/*TIPOGRAFIA*/
    .poppins-thin {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: normal;
  }
  
  .poppins-extralight {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: normal;
  }
  
  .poppins-light {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: normal;
  }
  
  .poppins-regular {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: normal;
  }
  
  .poppins-medium {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: normal;
  }
  
  .poppins-semibold {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: normal;
  }
  
  .poppins-bold {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: normal;
  }
  
  .poppins-extrabold {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: normal;
  }
  
  .poppins-black {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: normal;
  }
  
  .poppins-thin-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 100;
    font-style: italic;
  }
  
  .poppins-extralight-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 200;
    font-style: italic;
  }
  
  .poppins-light-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 300;
    font-style: italic;
  }
  
  .poppins-regular-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 400;
    font-style: italic;
  }
  
  .poppins-medium-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    font-style: italic;
  }
  
  .poppins-semibold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 600;
    font-style: italic;
  }
  
  .poppins-bold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 700;
    font-style: italic;
  }
  
  .poppins-extrabold-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 800;
    font-style: italic;
  }
  
  .poppins-black-italic {
    font-family: "Poppins", sans-serif;
    font-weight: 900;
    font-style: italic;
  }
  body{
    font-family: "Poppins", sans-serif;
  }

/*MENÚ DE NAVEGACIÓN*/
.nav{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-top: 10px;
    padding-left: 10%;
    font-size: 15pt;
}
.logo{
    width: 75%;
    margin-left:20%;
}
ul li{
    display: inline-block;
    padding: 0px 8px;
}
ul li a:hover{
    color: #573CF9;
}

a{
    text-decoration: none;
    color: #808080;
}
.btn-unir{
    background-color: #573CF9;
    width: 80%;
    height: 46px;
    border-radius: 10px;
    margin-top: 20px;
    border: none;
    width: 160px;
}
.btn-unir a{
    font-size: 25px;
    color: #99FFF5;
    font-weight: bold;
}
.btn-unir a:hover{
    color: white;
}
.navbar {
    background-color: transparent;
    position: fixed;
    z-index: 999;
    transition: top 1.0s ease;
}
.navbar.fixed {
    top: 0;
    background-color: white;
}
.btn-iniciar{
    font-size: 17pt;
    text-decoration: none;
    color:#573CF9;
}
.btn-iniciar:hover{
    text-decoration: underline #573CF9;
}
.navbar{
    display: flex;
    justify-content: space-around;
    padding: 10px 20px;
    transition: background-color 0.5s ease;
}
.nav-links{
    display: flex;
    list-style: none;
}
.nav-links ul li{
    margin-right: 40px;
}
.nav-links li a {
    transition: 0.3;
}
.centered-section {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin-top: -50vh; 
        }
.burger{
    flex-direction: column;
    cursor: pointer;
    display: none;
}

/*SECCIÓN 1 - SLIDER PRINCIPAL*/

.text-principal{
    font-family: "Poppins", sans-serif;
}
.frase-negrita{
    font-style:italic;
}
.img-hombre{
    height: 100%;
    width: 100%;
    margin-top: 9%;
}
.img-mujer{
    height: 100%;
    margin-top: 25%;
}
.banner-principal{
    width: 100%;
    height: 100%;
}
h1{
    color: #573CF9; 
    font-size: 40pt;
    padding-right: 33px;
    margin-top: 20%;
    font-family: "Poppins", sans-serif;
}

.carousel-indicators [data-bs-target]{
    background-color: #573CF9!important;
    height: 5px;
    width: 100px;
    border-radius: 10px;
}

.carousel-inner {
    height: 100vh!important;
}
/*SECCIÓN-2 FRASE*/
.text-frase{
    font-family: "Poppins", sans-serif;
    font-size: 25pt;
    color: #573CF9;
    padding-top: 10%;
    padding-bottom: 10%;
    padding-left: 20%;
    padding-right: 20%;
}
.frase{
    background-image: url(../images/seccion-2/Recurso77.jpg);
    background-size: cover;
}

/*SECCIÓN-3 PERSONAS*/
.personas{
    background-color: #99FFF4;
}
.swiper-container {
    width: 100%;
    padding: 30px 0;
}

.swiper-slide img {
    width: 100%;
    height: auto;
}

/*SECCIÓN-4 FRASE*/
.activa{
    background-image: url(../images/activate/fondo.png);
    background-size: cover;
    padding-top: 10%;
    padding-bottom: 10%;
    padding-left: 20%;
}
.text-morado{
    color: #573CF9;
}
.text-activa h2{
    color: #999999;
    font-size: 42pt;
}

/*SECCIÓN-5 COMO FUNCIONA*/
.como-funciona{
    background-image: url(../images/Como-funciona/Recurso-85.png);
    background-size:cover;
    height: 100%;
}
.title-funciona{
    font-size: 38pt;
    color: #D13D77;
}
.img-como-funciona{
    width: 50%;
}
.img-iconos{
    width: 50%;
}
p{
    font-size: 15pt;
    color: #9c9c9c;
}
.text-icon{
    font-size: 20pt!important;
}
.content {
    visibility: hidden;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}
.active {
    visibility: visible;
    position: relative;
    opacity: 1;
}
.btn-desafio {
    padding: 10px 20px;
    margin: 10px;
    cursor: pointer;
    background-color: #E5E7FF;
    color: #8674FB;
    border: none;
    font-size: 17pt;
    font-family: "Poppins", sans-serif;
    font-weight: 500;
    border-radius: 10px;
}
.btn-desafio.active {
    width: 50%;
    background-color: #BFC4FF;
    color: #573CF9;
}
.img-iconos {
    max-width: 100%;
    height: auto;
}
.text-icon {
    margin-top: 10px;
}

/*SECCIÓN-6 COMO ÚNIRSE*/
.unirse{
    background-image: url(../images/seccion-2/Recurso\ 67.png);
    background-size: cover;
    padding: 10%;
}
.text-unir{
    color:#573CF9;
}
.text-unir h3{
    font-size: 38pt;
    text-align: end;
}
.btn-unete{
    width: 60%;
    margin: 10px;
}
.btn-container a {
    cursor: pointer;
}


/*FOOTER*/
.logo-footer{
    width: 28%;
}
footer{
    height: 200px;
    background-color: #99FFF4;   
}
#fixed-navbar {
    transition: background-color 0.5s ease;
}
.carousel-inner {
    height: 100vh;
}

/*PAGINA NOSOTROS*/
.title-nosotros{
    margin-top: 90px!important;
}
.h2-nosotros{
    color: #573CF9;
}
.p-nosotros{
    font-size: 12pt;
}
.hr-nosotros{
    width: 40%;
    margin: 0 auto;
    border: 1px solid #773CF9;
    opacity: 100%!important;
}
.h3-nosotros{
    color: #573CF9;
}
.h4-nosotros{
    color: #573CF9;
    
}

/*Pantalla Celular*/
@media (max-width: 767.98px) {
    body{
        width: 100%;
        padding: 0%;
        margin: 0%
    }
    .navbar{
        position: relative;
        background-color: #44FFF6;
        height: 100px;
    }
    .carousel-indicators{
        display: none;
    }
    .burger{
        width: 30px;
        display: flex
    }
    .nav-links {
        display: none;
    }
    .nav-links{
        display: none;
        position: absolute;    
        top: 15%;
        right: 15px;
        background-color: red;    
        width: 100%;
        left: 0;
        margin: 0;
        text-align: center;
        transition: all 0.3;
    }
    .nav-buttons ul {
        width: 100%;
    }
    .nav-buttons ul li{
        width: 100%;        
        text-align: right;
        margin-left: 22px;
    }
    .btn-unir{
        margin-left: 30%;
        background-color: #573CF9;
        width: 70%;
        height: 30px;
        border-radius: 5px;
        margin-top: 20px;
        border: none;
    }
    .btn-unir a{
        font-size: 18px;
        color: #99FFF5;
        font-weight: bold;
    }
    .btn-iniciar{
        font-size: 10pt;
        text-decoration: underline 1px solid #666666;
        color:#808080;
    }
    header{
        width: 100%;
    }
    .text-icon{
        font-size: 12pt!important;
    }
    .carousel-1{
        height: 40vh;
        background-size: cover;
        width: 100%!important;
    }
    .img-hombre{
        display: none;
    }
    .img-mujer{
        display: none;
    }
    .carousel-2{
        height: 40vh;
        background-size: cover;
        width: 100%!important;
    }
    #row-banner{
        padding-left: calc(var(--bs-gutter-x) * .1)!important;
        padding-right: calc(var(--bs-gutter-x)* .1)!important;
    }
    
    h1{
        color: #573CF9; 
        font-size: 22pt;
        margin-top: 5%;
        font-family: "Poppins", sans-serif;
    }
    .text-activa h2{
        color: #999999;
        font-size: 20pt;
    }
    .text-activa h2 br{
        display: none;
    }
    .logo-footer{
        width: 60%;
    }
    .logo{
        width: 110%;
        margin-left: 0%;
        margin: 0px;
        padding: 0px;
    }
    .container-logo{
        padding: 0%;
        margin: 0%;
    }
    .img-mujer{
        height: 100%;
        width: 100%;
        margin-top: 25%;
    }
    .frase{
        background-image: url(../images/seccion-2/fondo-responsive.png);
        background-size: cover;
    }
    .activa{
        background-image: url(../images/activate/fondo.png);
        background-size: cover;
        padding-top: 10%;
        padding-bottom: 10%;
        padding-left: 5%;
    }
    .text-frase{
        font-family: "Poppins", sans-serif;
        font-size: 14pt;
        color: #573CF9;
        padding-top: 75px;
        padding-bottom: 65px;
        padding-left: 30px;
        padding-right: 30px;
    }
    .img-iconos{
        width: 60%;
    }
    p{
        font-size: 12pt;
        color: #9c9c9c;
    }
    .como-funciona{
        background-image: url(../images/Como-funciona/Recurso\ 48.png);
        background-size:cover;
        height: 100%;
    }
    .title-funciona{
        font-size: 18pt;
        color: #D13D77;
        font-weight: bold;
    }
    .btn-desafio{
        width: 100%;
        margin-bottom: 40px;
        margin-top: 40px;
        margin-left: 0px;
        margin-right: 0px;
        font-size: 8.3pt;
    }
    .btn-desafio.active{
        width: 100%;
    }
    
    .img-unete{
        text-align: center;
        margin-top: 20px;
        margin-bottom: 40px;
    }
    .text-unir h3{
        font-size: 18pt;
        margin-top: 40px;
        text-align: center;
    }
    .unirse{
        padding: 0%;
    }
    .logo-footer{
        margin-top: 25px;
    }
    footer{
        height: 100px;
        background-color: #99FFF4;   
    }
    .personas .row {
        display: none;
    }
    .swiper-container {
        display: block;
    }
    .carousel-inner {
        height: 70vh!important;
    }
}
@media (min-width: 768px) {
    .swiper-container {
        display: none;
    }
}
@media (max-width: 767px) {
    .personas .row {
        display: none;
    }
    .swiper-container {
        display: block;
    }
}
/*Pantalla PC Pequeño*/
@media (min-width: 768px) and (max-width: 1367px) {
    .nav{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-top: 10px;
        padding-left: 0%;
        font-size: 14pt;
    }
    .carousel-inner {
        height: 100vh!important;
    }

    .activa{
        background-image: url(../images/activate/fondo-pc-pequeno.png);
        background-size: cover;
    }  
}
    .img-principal {
        height: 70vh;
    }
/*Pantalla PC Mediano*/
@media (min-width: 1368px) and (max-width: 1534px) {
    .frase{
        background-image: url(../images/seccion-2/Recurso\ 77\ copia.png);
        background-size: cover;
    }
}
/*Pantalla PC Regular*/
@media (min-width: 1535px) and (max-width: 1919px){
    .nav{
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding-top: 10px;
        padding-left: 2%;
        font-size: 17pt;
    }
    .carousel-inner {
        height: 95vh!important;
    }
    .img-hombre{
        height: 100%;
        width: 100%;
        margin-top:6%;
    }

}
/*Pantalla PC 2K*/
@media (min-width: 1920px) and (max-width: 2100px){
    .carousel-inner {
        height: 83vh;
    }
    .como-funciona{
        height:550px;
    }
}