/* Lato - IBM Plex Sans - Fonts */
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&family=Lato:ital,wght@0,100;0,300;0,400;0,700;0,900;1,100;1,300;1,400;1,700;1,900&display=swap');

@font-face {
	font-family: 'Nexa-fonts';
	src: url(fonts/nexa-heavy.ttf);
}

@font-face {
	font-family: 'Nexa-fonts-light';
	src: url(fonts/nexa-extralight.ttf);
}

:root {
	--white-colour: #FFFFFF;
	--black-colour: #000000;
}

.mb-10 {
	margin-bottom: 10px;
}
.mb-20 {
	margin-bottom: 20px;
}
.mb-30 {
	margin-bottom: 30px;
}
.mb-40 {
	margin-bottom: 40px;
}
.mb-50 {
	margin-bottom: 50px;
}
.mb-60 {
	margin-bottom: 60px;
}
.mb-70 {
	margin-bottom: 70px;
}
.mb-80 {
	margin-bottom: 80px;
}
.mb-90 {
	margin-bottom: 90px;
}
.mb-100 {
	margin-bottom: 100px;
}

body {
	font-family: "Lato", serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 24px;
	background-color: var(--white-colour);
	color: var(--black-colour);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	font-family: "IBM Plex Sans", serif;
}

.nexa-fonts {
	font-family: 'Nexa-fonts';
}

p,
figure {
	margin: 0;
}

h2 {
	font-size: 62px;
	font-weight: 700;
	color: #103962;
	text-transform: uppercase;
	font-family: "IBM Plex Sans", serif;
	line-height: 1.2;
}

h2 span {
	color: var(--white-colour);
}

span,
small {
	display: inline-block;
}

ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

a {
	text-decoration: none;
	display: inline-block;
	transition: 0.3s all ease-in-out;
	-webkit-transition: 0.3s all ease-in-out;
	-moz-transition: 0.3s all ease-in-out;
}

button {
	border: none;
	background: transparent;
	cursor: pointer;
	transition: 0.3s all ease-in-out;
	-webkit-transition: 0.3s all ease-in-out;
	-moz-transition: 0.3s all ease-in-out;
	padding: 0;
}

button:focus {
	outline: none;
	box-shadow: none !important;
}

input,
textarea,
input:focus,
textarea:focus {
	outline: none;
	border: none;
}

::placeholder {
	opacity: 1;
}

select {
	appearance: none;
	-moz-appearance: none;
	-webkit-appearance: none;
}

.container,
.container-fluid {
	padding: 0 10%;
}




/*--------------------
 Back to Top Button
---------------------*/

.scrollToTopBtn {
	background-color: #0C46A6;
	border: none;
	border-radius: 50%;
	color: white;
	cursor: pointer;
	font-size: 20px;
	line-height: 0;
	width: 45px;
	height: 45px;
	position: fixed;
	bottom: 20px;
	right: 20px;
	z-index: 100;
	opacity: 0;
	transform: translateY(100px);
	transition: all .5s ease;
}

.showBtn {
	opacity: 1;
	transform: translateY(0)
}








/* 
---------------
header-area
---------------
*/

.header-area {
	padding: 15px 0;
	background-color: var(--white-colour);
}

.header-list li a {
	color: var(--black-colour);
	font-weight: 300;
	font-size: 21px;
}

.header-list li a:hover {
	color: #009FE3;
}

.btn-shape {
	color: #f7f0e8 !important;
	font-weight: 900 !important;
	background-color: #009FE3;
	border-radius: 30px;
	padding: 18px 60px;
}

.btn-shape:hover {
	background-color: #66BCE1;
}



/* 
---------------
sm-header
---------------
*/

.sm-header {
	padding: 18px 0 14px;
	background-color: #0F3962;
}

.sm-header>div {
	padding-left: 20px;
	padding-right: 20px;
}

.sm-header-logo {
	max-width: 130px;
}

#menuOffcanvas {
	width: 360px !important;
	background: #0F3962;
}

#menuOffcanvas .offcanvas-header {
	padding: 18px 20px 14px;
}

#menuOffcanvas .offcanvas-body {
	padding-bottom: 250px;
}

#menuOffcanvas .header-list-div>ul>li>a {
	font-size: 16px;
	font-weight: 400;
	line-height: 27px;
	color: var(--white-colour);
	padding: 10px 32px;
	border-radius: 21px;
}

#menuOffcanvas .header-dropdown {
	background-color: #FFFFFFFC;
	border-radius: 10px;
}

#menuOffcanvas .header-dropdown li a {
	font-size: 15px;
	padding: 6px 10px;
	color: var(--black-colour);
}

#menuOffcanvas .header-list-div>ul {
	padding: 32px 0 0;
	text-align: center;
}

#menuOffcanvas .header-list-div ul li a::after {
	display: none;
}

#menuOffcanvas .contact-btn-div a {
	font-size: 14px;
	line-height: 24px;
	padding: 15px 42px;
	margin: 30px 0 0;
}

.canvas-footer-div {
	border-radius: 60px 60px 0 0;
	background-color: var(--white-colour);
	padding: 40px 0 20px;
	text-align: center;
	position: absolute;
	width: 100%;
	left: 0;
	bottom: 0;
}

.canvas-footer-div a:hover {
	opacity: 0.8;
}

.bar-close-btn {
	color: var(--white-colour);
	font-size: 20px;
	margin-left: 10px;
}

#menuOffcanvas .search-btn-div input {
	padding: 12px 16px 12px 44px;
	font-size: 14px;
	line-height: 18px;
}

#menuOffcanvas .search-btn-div label {
	font-size: 16px;
	top: 11px;
}




/* 
-------------------
banner-area
-------------------
*/

.banner-area {
	position: relative;
	z-index: 10;
	padding: 100px 0;
	margin: 40px 0 0;
}

.banner-area .banner-right-image {
	width: 54%;
	right: 0;
	top: -25px;
	z-index: -1;
	position: absolute;
	height: 100%;
}

.banner-area .gradient-image {
	position: absolute;
	left: 0;
	top: 0;
	width: 66%;
	z-index: -1;
	height: 89%;
}

.banner-area .banner-ball-image {
	position: absolute;
	left: 15%;
	bottom: 0;
	z-index: -2;
	width: 37%;
}

.banner-content {
	position: relative;
	z-index: 10;
}

.banner-content h3 {
	font-size: 23px;
	font-weight: 700;
	color: #103962;
	margin: 0 0 5px;
}

.banner-content p {
	font-size: 18px;
	font-weight: 300;
	color: var(--white-colour);
}

.position-h1 {
	font-size: 100px;
	text-transform: uppercase;
	font-weight: 700;
	position: absolute;
	left: -153px;
	top: 50px;
	z-index: -1;
	color: transparent; 
    -webkit-text-stroke: 1px #003780;
}

.banner-image {
	margin: 0 0 0;
}

.banner-image img {
	width: 65%;
	margin: 0 auto;
}



/* 
-------------------
vencedores-area
-------------------
*/

.vencedores-area {
	padding: 100px 0 200px;
}

.vencedores-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 60px;
}

.vencedores-item h4 {
	font-size: 24px;
	color: #0F3962;
	font-weight: 700;
	margin: 0 0 15px;
}

.vencedores-item h4 span {
	color: #93BF20;
}

.vencedores-item > img {
	transition: 0.3s all ease-in-out;	
}

.vencedores-item > img:hover {
	transform: scale(0.96);
	transition: 0.3s all ease-in-out;
}



/* 
-------------------
categorias-area
-------------------
*/

.categorias-area {
	position: relative;
	z-index: 10;
}

.categorias-flex-bg {
	position: relative;
	z-index: 10;
}

.categorias-flex-bg > img {
	position: absolute;
	left: 0;
	width: 100%;
	top: 0;
	z-index: -1;
	height: 100%;
}

.categorias-btn-area .categorias-btn {
	padding: 36px 31px;
	border-radius: 68px;
	background-color: #0F3962;
	color: var(--white-colour) !important;
	margin: 0 0 20px;
	vertical-align: middle;
}

.categorias-btn-area .categorias-btn:hover {
	opacity: 0.8;
}

.categorias-btn-area .categorias-btn:last-child {
	background-color: #94C01E;
	margin: 0;
}

.categorias-btn-area .categorias-btn img {
	width: 69px;
}

.categorias-btn-area .categorias-btn h4 {
	font-size: 28px;
	font-weight: 500;
}

.categorias-btn-area .categorias-btn p {
	font-size: 15px;
	margin: 5px 0 0;
}

.categorias-content h3 {
	font-size: 45px;
	color: #0F3962;
	font-weight: 700;
	font-family: "Lato", serif;
}

.categorias-image img {
	width: 80%;
}




/* 
-------------------
pharmacy-area
-------------------
*/

.pharmacy-area {
	position: relative;
	z-index: 10;
	margin: 200px 0 0;
	padding: 100px 0;
}

.pharmacy-area > img {
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: -1;
	height: 149%;
}

.pharmacy-image h3 {
	font-size: 37px;
	color: #0F3962;
	font-style: italic;
	margin: 18px 0 0;
	font-weight: 700;
}

.pharmacy-content h2 {
	font-size: 100px;
	font-weight: 500;
	font-family: 'Nexa-fonts';
	margin: -27% 0 0 -37%;
}

.pharmacy-content h2 span {
	font-family: 'Nexa-fonts';
}

.pharmacy-content p {
	color: var(--white-colour);
	margin: 0 0 16px;
}

.pharmacy-content h1 {
	color: transparent; 
    -webkit-text-stroke: 1px #003780;
	font-size: 133px;
	position: absolute;
	left: -52%;
	top: 43%;
	z-index: -1;
}

.pharmacy-content ul li a {
	color: var(--white-colour);
	font-size: 18px;
	font-weight: 600;
}

.pharmacy-content ul li a:hover {
	color: #0F3962;
}




/* 
-------------------
logos-slider-area
-------------------
*/

.logos-slider-area {
	padding: 100px 0 100px;
	position: relative;
	z-index: 15;
}

.logos-title-div > img {
	margin: 0 0 50px;
}

.logos-title-div h1 {
	color: transparent; 
    -webkit-text-stroke: 1px #003780;
	font-size: 70px;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	top: -38px;
	z-index: -1;
}

.logos-title-div h3 {
	font-size: 44px;
	font-weight: 900;
	color: #0F3862;
	margin: 0 0 30px;
}

.descript-div {
	padding: 0 0 20px;
}

.descript-div h4 {
	font-size: 20px;
	font-weight: 600;
}

.descript-div p {
	font-size: 16px;
	color: #2F2F2F;
}

#logoSlider {
	margin: 130px 0 0;
}

#logoSlider .item img {
	height: 79px;
	object-fit: contain;
}

#logoSlider .owl-nav {
	position: absolute;
	width: 100%;
	text-align: center;
	top: 42%;
	transform: translateY(-50%);
}

#logoSlider .owl-nav button {
	font-size: 36px;
	color: #94C01E;
	position: absolute;
}

#logoSlider .owl-nav .owl-prev {
	left: -40px;
	top: -22px;
}

#logoSlider .owl-nav .owl-next {
	right: -40px;
	top: -22px;
}




/* 
-------------------
padel-social-area
-------------------
*/

.padel-social-area {
	background-color: #0F3962;
	border-radius: 250px 0 0 250px;
	color: var(--white-colour) !important;
	padding: 100px 0;
}

.padel-social-content h3 {
	font-size: 35px;
	font-weight: 700;
	color: #FAF0E8;
	position: relative;
	display: inline-block;
	margin: 0 0 28px;
}

.padel-social-content h3::after {
	content: "";
	width: 90%;
	height: 1px;
	background-color: #FAF0E8;
	position: absolute;
	bottom: -9px;
	left: 0;
}

.padel-social-content p {
	color: #FAF0E8;
	margin: 0 0 20px;
	text-align: justify;
}

.padel-social-content a {
	font-weight: 700;
	font-size: 18px;
	color: #FFF;
	margin: 30px 0 0;
}

.padel-social-content a:hover {
	color: #00C2C4;
}



/* 
-------------------
padel-series-area
-------------------
*/

.padel-series-area {
	margin: 150px 0 0;
	overflow-x: hidden;
}

.padel-series-title {
	position: initial !important;
}

.padel-series-title h3:nth-child(2) {
	color: #94C01E;
}

.padel-series-title h1 {
	top: 35px;
	-webkit-text-stroke: 1px #94C01E;
	font-size: 6.8vw;
}

.padel-series-grid {
	grid-template-columns: repeat(3, 1fr);
	gap: 35px;
	background-color: #0F3962;
	margin: 35px 0 0;
	padding: 0 0 150px;
}



/* 
-------------------
footer-area
-------------------
*/

.footer-area {
	background-color: #0F3962;
	padding: 80px 0;
	position: relative;
	z-index: 10;
}

.footer-bg {
	position: absolute;
	width: 100%;
	left: 0;
	top: 0;
	z-index: -1;
	height: 100%;
	object-fit: cover;
	object-position: center 118%;
}

.footer-shape {
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: -1;
	width: 400px;
}

.footer-logo img {
	width: 400px;
}

.ftr-logo-links > a {
	font-size: 18px;
	color: var(--white-colour);
	font-weight: 300;
}

.ftr-social-links {
	display: flex;
	gap: 10px;
	padding: 20px 0 0;
}

.ftr-social-links li a {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	border: 1px solid #FFF;
	font-size: 20px;
	color: var(--white-colour);
	text-align: center;
	line-height: 37px;
}

.ftr-social-links li a:hover {
	background-color: var(--white-colour);
	color: var(--black-colour);
}

.footer-content a img {
	width: 140px;
}

.footer-content p {
	color: var(--white-colour);
	font-weight: 300;
}

.footer-content h5 {
	color: var(--white-colour);
	font-weight: 300;
	font-size: 17px;
	margin: 30px 0 0;
}


.prizes h3 {
	font-size: 37px;
  	color: #0F3962;
  	font-style: italic;
  	margin: 18px 0 0;
  	font-weight: 700;
	margin-bottom: 10px;
}

.prizes p {
	font-size: 19px;
}

/* FORM */


#registrationForm {
	padding: 20px;
}

 label {
	display: block;
	margin-top: 5px;
	color: #0F3862;
}
input, button, textarea {
	width: 100%;
	padding: 10px;
	margin-bottom: 15px;
	border: 1px solid #ccc;
	border-radius: 4px;
	display: block;
}

button {
	background-color: #95c11f;
	color: white;
	border: none;
	cursor: pointer;
}

input[type="text"], select  {
	width: 100%;
	padding: 10px;
	margin-bottom: 15px;
	border: 1px solid #ccc;
	border-radius: 4px;
	display: block;
}
button:hover {
	background-color: #218838;
}


.required {
	color: red;
}

.required::after {
	content: ' *';
	color: red;
}

 .fancy-checkbox {
position: relative;
display: inline-block;
width: 40px;
height: 30px;
}

.fancy-checkbox input {
opacity: 0;
width: 0;
height: 0;
}

.fancy-checkbox label {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #ccc;
border-radius: 30px;
cursor: pointer;
transition: background-color 0.3s;
}

.fancy-checkbox label:before {
content: "";
position: absolute;
width: 20px;
height: 20px;
left: 2px;
bottom: 2px;
background-color: white;
border-radius: 50%;
transition: transform 0.3s;
}

.fancy-checkbox input:checked+label {
background-color: #4caf50;
}

.fancy-checkbox input:checked+label:before {
transform: translateX(20px);
}

select {
	background-color: #fff;
}

form h4 {
	color: #0F3962;
	font-weight: 700;
}

.equipa {
	display: none;
	border: 1px solid #ccc;
	padding: 10px;
	margin-top: 10px;
}
.active {
	display: block;
}

/* Slideshow: ocupa 50% da viewport em desktop e 100% em mobile */
    .slideshow-container {
      position: relative;
      width: 50vw; /* 50% da largura da viewport em desktop */
      margin: auto;
      overflow: hidden;
    }
    @media only screen and (max-width: 768px) {
      .slideshow-container {
        width: 100vw; /* 100% da largura em mobile */
		height: 300px; /* Altura definida; ajuste conforme necessário */
      }
    }
    .slides {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
      opacity: 0;
      transition: opacity 1s ease-in-out;
    }
    .active {
      opacity: 1;
    }
    /* Botões de navegação */
    .prev, .next {
      cursor: pointer;
      position: absolute;
      top: 50%;
      transform: translateY(-50%);
      padding: 16px;
      color: white;
      font-weight: bold;
      font-size: 18px;
      background-color: rgba(0,0,0,0.5);
      user-select: none;
      border-radius: 3px;
    }
    .prev {
      left: 0;
    }
    .next {
      right: 0;
    }
    .prev:hover, .next:hover {
      background-color: rgba(0,0,0,0.8);
    }