:root{
    --color-primary: #1B2639;
}

@font-face {
    font-family: Nunito;
    font-display: auto;
    src: url('/fonts/Nunito-VariableFont_wght.ttf');
}

@font-face {
    font-family: Comfortaa;
    font-display: auto;
    src: url('/fonts/Comfortaa-VariableFont_wght.ttf');
}
@font-face {
    font-family: Mitr-Bold;
    font-display: auto;
    src: url('/fonts//Mitr-Bold.ttf');
}
label.error,
.error {
    width: 100%;
    color: #8c0000;
    font-size: .9rem;
}

a, a:hover {
    color: inherit;
    text-decoration: none;
}
.text-blue{
    color: var(--color-primary);
}
.text-justify{
    text-align: justify;
}
body {
    font-family: 'Nunito', sans-serif;
    font-size: 18px;
    font-weight: 600;
    font-size: 1.5rem;
}
.stroke{
    -webkit-text-stroke: 2px var(--color-primary);
    color: transparent;
}
strong{
    font-weight: 700;
}

.grecaptcha-badge{
    opacity: 0;
}

header{
    height: 130px;
}
.header{
    font-size: 1.8rem;
    font-weight: 700;
    color: var(--color-primary);
}
.header_fixed{
    position: fixed;
    width: 100%;
    transform: translateY(-100%);
    transition: 400ms;
    opacity: 0;
    animation: menu .5s linear;
    animation-fill-mode: forwards;
    z-index: 100;
    top: 0;
    filter: drop-shadow(0 0 7px #00000082);
}

@keyframes menu {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

.header .navbar-nav .nav-link{
    color: var(--color-primary);
}
.header .navbar-toggler,
.header_fixed .navbar-toggler{
    font-size: 4rem;
    color: var(--color-primary);
}
.header_fixed .navbar-toggler{
    background: #fff;
    border-radius: 4px;
    margin-top: 3px;
    font-size: 3rem;
}
.header .navbar-toggler:focus{
    box-shadow: none;
}
.header-post .header .navbar-brand img{
    display: none;
}
.header-post{
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 100;
}
.header .dropdown-item{
    font-size: 1.2rem;
    font-weight: bold;
}
.banner{
    position: relative;
    padding: 6rem 0;
}
.navbar.navbar-expand-lg .navbar-nav{
    gap: 3rem;
}
.banner::before{
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 400px;
    height: 1px;
    background-color: var(--color-primary);
}
.banner h3{
    font-weight: 900;
    font-size: calc(1rem + 4vw);
    color: var(--color-primary);
}
.banner h3.text-border{
    font-size: calc(3rem + 4vw);
    -webkit-text-stroke: 2px var(--color-primary);
    color: transparent;
}
.soy{
    background: url('/img/front-ash.png') no-repeat;
    background-position: -200px calc(100% + 100px);
    background-size: calc(32rem + 20vw) auto;
    padding-bottom: 10rem;
}
.soy h3{
    font-weight: 900;
    font-size: calc(6rem + 10vw);
    color: var(--color-primary);
}
.soy h2{
    font-weight: 900;
    font-size: calc(2rem + 3vw);
    color: var(--color-primary);
    
}
.btn-mas{
    border: 1px solid var(--color-primary);
    border-radius: 40px;
    padding: 10px 30px;
    font-size: 2rem;
    font-weight: 900;
    position: relative;
    z-index: 100;
}
.btn-mas:hover{
    background: var(--color-primary);
    color: #fff;
}
.carousel-indicators [data-bs-target]{
    width: 10px;
    height: 10px;
    border: 1px solid var(--color-primary);
    border-radius: 50%;
}
.carousel-indicators .active{
    background: var(--color-primary);
}

.descubre{
    padding-top: 5rem;
    padding-bottom: 10rem;
    position: relative;
    z-index: 3;
    color: #fff;
    min-height: 55rem;
    overflow-x: clip;
    font-weight: 300;
    background: url('/img/forma-1.png') no-repeat left bottom;
    background-size: 600px auto;
    margin-top: -10rem;
}
.descubre::after {
    content: "";
    position: absolute;
    width: calc(100% + 116px);
    height: 100%;
    top: 53%;
    left: 50%;
    background: url('/img/bg-blue.png') no-repeat top;
    background-size: auto;
    background-size: 100% 100%;
    z-index: -1;
    transform: translate(-50%, -50%);
}
.areas h4{
    font-size: 2.5rem;
    font-weight: 700;
}
.swiper-container-free-mode > .swiper-wrapper{
    transition-timing-function : linear;
}
.swiper-container-free-mode > .swiper-wrapper > .swiper-slide{
    width: auto;
}
.marquee h3{
    font-size: calc(3rem + 4vw);
    text-transform: uppercase;
    letter-spacing: 0.1rem;
    margin-bottom: 0;
    font-weight: 700;
    filter: drop-shadow(0px 0px 5px var(--color-primary));
}
.item-word{
    padding: 0 80px;
    position: relative;
}
.item-word::before{
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(50%, -50%);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #fff;
}

.areas .accordion-header > button{
    border: 2px solid var(--color-primary);
    color: var(--color-primary);
    border-radius: 100px !important;
    padding: 10px 40px;
    width: 100%;
    max-width: 760px;
    background: #fff;
    font-weight: 900;
    font-size: 2rem;
}
.card-area{
    background: var(--color-primary);
    color: #fff;
    padding: 20px 15px;
    border-radius: 40px;
    font-weight: lighter;
    max-width: 760px;
}
.card-area h2{
    font-weight: 800;
    text-transform: uppercase;
}
.areas{
    background: url('/img/forma-2.png') no-repeat;
    background-position: 90% calc(100% + 200px);
    background-size: 800px auto;
    padding-bottom: 20rem;
    position: relative;
    overflow: hidden;
    min-height: 100vh;
}
.areas::after{
    position: absolute;
    content: "";
    width: 200px;
    height: 200px;
    border: 1px solid var(--color-primary);
    border-radius: 50%;
    left: 52%;
    top: 10%;
    z-index: -1;
}
.servicios{
    background: url('/img/bg-blue.png') no-repeat center;
    background-size: calc(100% + 120px) 100%;
    color: #fff;
    padding-top: 15rem;
    padding-bottom: 20rem;
    position: relative;
    z-index: 10;
}
.servicios::after{
    position: absolute;
    content: "";
    bottom: 5%;
    left: -120px;
    width: 500px;
    height: 500px;
    background: url('/img/forma-3.png') no-repeat center;
    background-size: contain;
}
.bb-bco{
    position: relative;
}
.bb-bco::after{
    position: absolute;
    content: "";
    width: 400px;
    max-width: 100%;
    height: 2px;
    background: #fff;
    bottom: 0;
    left: 0;
}
.bg-lap{
    position: relative;
    margin-top: -17rem;
    background:url('/img/bg-lap.jpg') no-repeat center bottom;
    background-size: 100% 80%;

}
.circle{
    position: absolute;
    left: 5%;
    bottom: 0;
    width: 100px;
    height: 100px;
    background: #ededed;
    border-radius: 50%;
    transform: translateX(-50%);
    z-index: 10;
}
.call-to-action{
    position: relative;
    min-height: calc(20rem + 25vw);
    color: #fff;
    z-index: 1;
}
.call-to-action::after{
    content: "";
    position: absolute;
    background: url('/img/laptop.png') no-repeat;
    background-size: 100% 100%;
    width: 900px;
    height: 900px;
    bottom: 30%;
    right: 0;
    opacity: .4;
    z-index: -1;
}
.btn-start{
    --radius: 60px;
    border: 2px solid #fff;
    border-radius: var(--radius);
    color: #fff;
    width: 100%;
    max-width: 250px;
    height: 50px;
    display: flex;
    align-items: center;
    overflow: hidden;
    
}
.btn-start > div{
    opacity: 1;
    background: #fff;
    border-radius: 20px;
    height: 100%;
    color: var(--color-primary);
    padding: 5px 25px;
    transition: all 500ms;
    transform: translate(0);
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn-start:hover > div{
    margin-left: 100%;
    transform: translate(-100%, 0);

}
.form-popup .form-control,
.suscripcion .form-control,
.suscripcion .form-select,
.comunidad .form-control,
.contacto .form-control{
    border-radius: 0 0 20px 20px;
    border-color: var(--color-primary);
    padding: .6rem 1rem;
}
.form-popup textarea.form-control,
.suscripcion textarea.form-control,
.comunidad textarea.form-control,
.contacto textarea.form-control{
    border-radius: 0 0 20px 80px;
}
.btn-submit{
    font-size: 4rem;
    font-weight: 900;
    transition: 300ms;
}
.btn-submit:hover{
    color: #fff;
    filter: drop-shadow(0px 0px 3px #000);
}
.contacto{
    position: relative;
    background: url('/img/forma-4.png') no-repeat;
    background-position: -300px calc(100% + 200px);
}
.contacto::before, .call-to-action::before{
    position: absolute;
    content: "";
    left: 5%;
    height: 100%;
    top: 0;
    width: 1px;
    background: var(--color-primary);
}
.footer{
    background: var(--color-primary);
    color: #fff;
    font-weight: 200;
    font-size: 1.2rem;
    filter: drop-shadow(0 0 20px #0000003d);
}
.titulo-principal.acerca h1{
    font-family: 'Mitr-Bold';
    font-weight: normal;
}
.titulo-principal h1{
    font-size: calc(1rem + 2vw);
    font-weight: 900;
}
.titulo-principal.acerca{
    background: url('/img/logo-lg.png') no-repeat center;
    background-size: auto 80%;
}
.acerca-body{
    color: #fff;
    background: var(--color-primary);
    background-size: calc(100% - 300px) auto;
}
.acerca-separador{
    background: url('/img/forma-5.png') no-repeat top center;
    background-size: 100% 100%;
    padding-top: 10rem;
    color: #fff;
    margin-top: -10rem;
    position: relative;
}
.cursos-top{
    background: url('/img/forma-6.png') no-repeat, url('/img/forma-9.png') no-repeat;
    background-size: 100% 100%, 45%, auto;
    background-position: center, 0 12%;
    color: var(--color-primary);
    
}
.cursos-body{
    background: url('/img/forma-8.png') no-repeat, #d2cecc;
    background-position: calc(100% + 20px) 15%;
    background-size: 230px auto;
    color: var(--color-primary);
}
.cursos-footer{
    height: calc(35vw);
    background: url('/img/forma-7.png') no-repeat;
    background-size: 100% 100%;
    position: relative;
    overflow-x: clip;
    color: var(--color-primary);
}
.cursos-footer img{
    width: calc(20rem + 20vw);
    position: absolute;
    right: -5%;
    bottom: 75px;
    -webkit-clip-path: inset(0px 0px 0px -276px round 0px 0px 30% 100%);
    clip-path: inset(0px 0px 0px -276px round 0px 0px 30% 100%);
}
.cursos-footer::before{
    content: "";
    position: absolute;
    width: calc(300px + 15vw);
    height: calc(300px + 15vw);
    border-radius: 50%;
    background: #5f727e;
    right: 0px;
    bottom: 60%;
}
.cursos-desafios{
    margin-top: -20rem;
    overflow: hidden;
}
.cursos-desafios h3{
    position: relative;
    font-size: 3.5rem;
    color: var(--color-primary);
}
.cursos-desafios h3::before{
    content: "";
    position: absolute;
    bottom: 0;
    width: 350px;
    left: 0;
    transform: translateX(-50%);
    height: 1px;
    background: var(--color-primary);
}
.cursos-desafios h3.bd-end::before{
    right: 0;
    left: auto;
    transform: translateX(10%);
}
.live{
    font-size: calc(3rem + 4vw);
    font-weight: 900;
    color: var(--color-primary);
    line-height: .8;
    position: relative;
}
.live span:first-child{
    padding-right: 12rem;
}
.live span:last-child{
    padding-left: 12rem;
}
.live .stroke{
    font-family: 'Mitr-Bold';
    font-weight: normal;
}
.live::after{
   content: ""; 
   position: absolute;
   top: 50%;
   right: 70%;
   width: 100px;
   height: 100px;
   border-radius: 50%;
   background: #5f727e;
   z-index: -1;
}
.temario{
    overflow: hidden;
}
.temario-header{
    height: 200px;
    width: 100%;
    background: url('/img/bg-top.png') no-repeat center;
    background-size: 100% 100%;
}
.temario-tabs{
    background: url('/img/forma-6-bco.png') no-repeat, #0d2137;
    min-height: 400px;
    background-size: 100% 400px;
    background-position: 100% 100%;
}
#cursos-tabs .nav-item{
    display: flex;
    justify-content: center;
    align-items: center;
}
#cursos-tabs .nav-link{
    border-radius: 40px;
    text-transform: uppercase;
    font-weight: 900;
    text-align: center;
    color: #fff;
    max-width: 270px;
    min-height: 55px;
    line-height: 1;
    padding: 3px 40px;
}
#cursos-tabs .nav-link.active{
    color: var(--color-primary);
}
.temario-content{
    margin-top: -5rem;
}
.card-curso{
    color: var(--color-primary);
    position: relative;
    max-width: 350px;
    margin: auto;
}
/* .card-curso::after{
    content: "";
    position: absolute;
    left: 50%;
    bottom: 100%;
    transform: translate(-50%, 50%);
    width: 70px;
    height: 70px;
    border-radius: 50%;
    background: #d2cecc;
    transition: all 400ms;
} */
.card-title,
.card-curso h3{
    font-weight: 900;
    text-transform: uppercase;
    text-align: center;
}
.card-curso .card-content{
    border: 2px solid var(--color-primary);
    border-radius: 40px;
    padding: 3.5rem 20px 0 20px;
    overflow: hidden;
    position: relative;
}
.card-curso .card-hover{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 100%;
    padding: 20px 20px 3.5rem 20px;
    background: var(--color-primary);
    color: #fff;
    text-align: center;
    font-weight: 200;
    font-size: 1.3rem;
    transition: 400ms;
    overflow: hidden;
}
.card-curso:hover::after{
    bottom: 0;
}
.card-curso:hover .card-hover{
    bottom: 0;
}
.temario-footer{
    position: relative;
    height: 400px;
    background: url('/img/bg-bottom-bco.png') no-repeat ;
    background-size: 100% 100%;
    filter: drop-shadow(0px 15px 6px #00000030);
    z-index: -1;
}
.comunidad{
    margin-top: -6rem;
}
.button-comunidad > div {
    max-width: 400px;
    margin: auto;
    text-align: center;
    border: 1px solid var(--color-primary);
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;
    transition: all 400ms;
    filter: drop-shadow(0 0 0 var(--color-primary));
}
.button-comunidad > div::after,
.button-comunidad > div::before{
    content: "";
    position: absolute;
    top: 50%;
    width: 300px;
    transform: translateY(-50%);
    transition: all 400ms;
    height: 80px;
}
.button-comunidad > div::after{
    right: 100%;
    background: url('/img/button-left.png') no-repeat center right;
    background-size: contain;
    
}
.button-comunidad > div::before{
    left: 100%;
    height: 80px;
    background: url('/img/button-right.png') no-repeat center left;
    background-size: contain;
}
.button-comunidad > div > button,
.button-comunidad > div > a {
    padding: 8px 25px;
    border-radius: 50px;
    background: var(--color-primary);
    color: #fff;
    font-weight: 800;
    text-transform: uppercase;
    width: 180px;
    transition: all 400ms;
    border: 0;
}
.button-comunidad:hover > div{
    filter: drop-shadow(0 0 10px var(--color-primary));
}
.button-comunidad:hover > div > button,
.button-comunidad:hover > div > a {
    width: 100%;
}
.button-comunidad:hover > div::before {
    transform: translate(-20px, -50%);
}
.button-comunidad:hover > div::after {
    transform: translate(20px, -50%);
}
.faq{
    margin-top: 6rem;
}
.faq h2{
    font-size: 4rem;
    text-transform: uppercase;
    color: var(--color-primary);
}
.faq h3{
    font-size: 5rem;
}
.faq-header{
    height: 600px;
    background: url('/img/forma-6.png') no-repeat;
    background-size: 100% 100%;
}
.faq-body{
    background: #d2cecc;
}
.faq-body #accordion-faq{
    margin-top: -10rem;
}
.faq-body .accordion-item,
.faq-body .accordion-button{
    background: transparent;
    border: none;
}
.faq-body .accordion-button{
    box-shadow: none;
}
.accordion{
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M7.247 11.14 2.451 5.658C1.885 5.013 2.345 4 3.204 4h9.592a1 1 0 0 1 .753 1.659l-4.796 5.48a1 1 0 0 1-1.506 0z'/%3e%3c/svg%3e");
}
.accordion-button:not(.collapsed){
    color: var(--color-primary);
}
#accordion-faq .accordion-button{
    font-size: 2rem;
    font-weight: 800;
    margin-bottom: .5rem;
}
#accordion-faq .accordion-body{
    font-size: 1.3rem;
    font-weight: 200;
    position: relative;
}
#accordion-faq .accordion-body::after{
    content: "";
    position: absolute;
    width: 150px;
    height: 100px;
    border-width: 1px 0 0 1px;
    border-color: var(--color-primary);
    border-style: solid;
    top: 0;
    left: 0;
    border-radius: 40px 0 0 0;
}
.latest{
    background: url('/img/forma-5.png') no-repeat ;
    background-size: 100% 100%;
    background-position: center bottom;
    padding-top: 20rem;
    color: #fff;
    margin-top: -7rem;
}
.video-latest{
    padding: 3rem 0 3rem 5rem;
    background: url('/img/bg-latest.png') no-repeat left center;
    background-size: auto 100%;
}
.latest-body{
    background: var(--color-primary);
    color: #fff;
}
/****  Flip card  ****/

.latest-body .flip-card{
    width: 100%;
    max-width: 370px;
    height: 400px;
    perspective: 1000px;
    margin: auto;
}
.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
   
}
.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}
.flip-card-front, .flip-card-back {
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    border-radius: 2rem;
    border: 2px solid #fff;
    padding: 15px 2rem;
}
.flip-card-front {
    background: url('/img/bg-card.png') no-repeat bottom right, var(--color-primary);
    background-size: 50% auto;
}
  
.flip-card-back {
    background: url('/img/bg-card-blue.png') no-repeat bottom right, #fff;
    background-size: 50% auto;
    transform: rotateY(180deg);
    color: var(--color-primary);

}

/****  Flip card  ****/

.flip-card-back-num,
.flip-card-front-num{
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(-30%, -50%);
    max-height: 200px;
    transition: 500ms;
}
.flip-card:hover .flip-card-front-num{
    transform: translate(0, -50%);
}
.flip-card:hover .flip-card-back-num{
    transform: translate(-30%, -50%);
}
.flip-card-back h4,
.flip-card-front h4{
    font-weight: 900;
    text-transform: uppercase;
    text-align: right;
}
.latest-footer{
    background: url('/img/bg-bottom-2.png') no-repeat, #d2cecc;
    background-size: 100% 100%;
    height: 180px;
}
.separador-podcast{
    background: url('/img/forma-7.png') no-repeat, url('/img/forma-3.png') no-repeat;
    background-size: 100% 100%, 30rem auto;
    background-position: center top, 20% -10rem;
    height: 500px;
}
.titulo-principal.blog{
    background: url('/img/forma-10.png') no-repeat center;
    background-size: 100% 100%;
    color: #fff;
    height: 25rem;
    position: relative;
}
.titulo-principal.blog::after{
    content: "";
    position: absolute;
    width: 250px;
    height: 250px;
    bottom: 0;
    right: 10%;
    border: 1px solid var(--color-primary);
    border-radius: 50%;
    z-index: -1;
}
.card-category{
    background: #fff;
    color: var(--color-primary);
    width: 100%;
    max-width: 400px;
    height: 300px;
    margin: auto;
    border-radius: 40px;
    padding: 20px;
    border: 2px solid var(--color-primary);
    transition: 300ms;
}
.card-category > div{
    width: 100%;
    height: 100%;
    border: 1px solid #fff;
    border-radius: 40px;
    padding: 30px 20px;
    transition: 300ms;
    position: relative;
    overflow: hidden;
}
.button-entrar{
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translate(-50%, 100%);
    transition: 300ms;
    
}
.button-entrar > a{
    font-weight: 900;
    font-size: 2.5rem;
    -webkit-text-stroke: 2px #fff;
    color: transparent;
}
.card-category:hover{
    background: var(--color-primary);
    color: #fff;
}
.card-category:hover > div{
    padding-bottom: 50px;
}
.card-category:hover .button-entrar{
    transform: translate(-50%, 0);
}
.suscripcion{
    padding-top: 15rem;
    background: url('/img/bg-top-2.png') no-repeat center top;
    background-size: 100% 600px;
}
.suscripcion-footer{
    background: url('/img/bg-bottom-3.png') no-repeat center top, url('/img/forma-2.png') no-repeat;
    background-size: 100% auto, 500px auto ;
    background-position: center top, 80% -50px;
    height: 500px;
}
.sub-text{
    position: absolute;
    background: url('/img/suscribirme.png') no-repeat center, #fff;
    background-size: auto 100%;
    height: 80%;
    width: 130px;
    top: 50%;
}
.contacto.contacto-int{
    background: transparent;
}
.contacto-int::after{
    content: "";
    position: absolute;
    left: 0;
    bottom: 25%;
    height: 100%;
    width: 20%;
    z-index: -1;
    background: url('/img/kj-logo.png') no-repeat center, url('/img/bg-left.png') no-repeat center top;
    background-size: 70% auto, 100% 100%;
    background-position: 50% 70%;
}
.contacto.contacto-int::before{
    height: 60%;
    top: auto;
    bottom: 0;
}
.btn-whatsapp {
    position: fixed;
    left: 30px;
    bottom: 30px;
    width: 50px;
    height: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff !important;
    font-size: 31px;
    border-radius: 50%;
    background: linear-gradient(45deg, #30d44d, #53f170);
    z-index: 1000;
    transition: all 250ms;
    line-height: 100%;
    filter: drop-shadow(0 0 6px #00000047);
}
.btn-whatsapp:hover{
    background: var(--color-primary);
}
.int-category .card-curso::after{
    display: none;
}
.blog-posts .card-curso .card-content,
.int-category .card-curso .card-content,
.int-post .card-curso .card-content{
    padding: 0;
}
.blog-posts .card-curso .img-destacada,
.int-category .card-curso .img-destacada,
.int-post .card-curso .img-destacada{
    position: relative;
    width: 100%;
    height: 340px;
    margin-bottom: 1.5rem;
}
.blog-posts .card-curso .img-destacada > img,
.int-category .card-curso .img-destacada > img,
.int-post .card-curso .img-destacada > img{
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}
.int-category .card-hover,
.int-post .card-hover{
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.titulo-principal.post{
    background: url('/img/forma-10.png') no-repeat center;
    background-size: auto;
    background-size: 100% 100%;
    color: #fff;
    min-height: 25rem;
    position: relative;
    padding: 2rem 0 10rem 0;
    z-index: 10;
}
.titulo-principal.post h1{
    font-size: calc(1rem + 2vw);
    filter: drop-shadow(0 0 10px var(--color-primary));
}
.int-post{
    margin-top: -10rem;
    height: 100vh;
}
.int-post .img-post{
    max-width: 40%;
    min-width: 40%;
    overflow: hidden;
    position: relative;
}
.int-post .img-post > img{
    position: relative;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    top: 0;
    left: 0;
}
.content-post{
    padding-top: 5rem;
    font-size: 1.2rem;
}
.blog-categories{
    list-style: none;
}

.titulo-principal.ebooks{
    background: url('/img/bg-ebooks.jpg') no-repeat center top;
    background-size: cover;
    padding: 5rem 0;
    min-height: 500px;
}
.titulo-principal.ebooks h1{
    font-size: 5rem;
}
.titulo-principal.ebooks h1 span{
    font-size: 7rem;
}
.ebook-separator-top{
    background: url('/img/bg-top-e.png') no-repeat center;
    background-size: 100% 100%;
    padding: 10rem 0;
    margin-top: -20rem;
    position: relative;
    z-index: 2;
}
.ebook-separator-bottom{
    background: url('/img/bg-bottom-e.png') no-repeat center, url('/img/forma-11.png') no-repeat;
    background-size: 100% 100%, 400px auto;
    background-position: center, 20% 100%;
    padding: 10rem 0;
    position: relative;
    z-index: 2;
}
.ebooks {
    background: var(--color-primary);
    color: #fff;
    position: relative;
}
.card-ebook{
    border: 1px solid #fff;
    border-radius: 20px;
    overflow: hidden;
    position: relative;
    transition: all 250ms;
}
.card-ebook .ebook-hover{
    opacity: 0;
    transition: all 250ms;
    position: absolute;
    left: 50%;
    top: 50%;
    width: 60px;
    height: 60px;
    z-index: 3;
    display: flex;
    justify-content: center;
    align-items: center;
    color: var(--color-primary);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}
.card-ebook:hover .ebook-hover{
    background: #ffffffb4;
    opacity: 1;
}
.bounce{
    animation: bounce 2s infinite;
}


@keyframes bounce {
    0%, 100%{
        filter: drop-shadow(0 0 3px #fff);
    }
    50%{
        filter: drop-shadow(0 0 10px #fff);
    }
}

.mnu-white .header .navbar-toggler{
    color: #fff;
}

@media(max-width:1199px) {
    .card-servicios img{
        width: calc(50px + 4rem);
    }
    .call-to-action::after{
        width: calc(100px + 50vw);
        height: calc(100px + 50vw);
    }
    .titulo-principal.acerca{
        background-size: 90% auto;
    }
    .cursos-footer img{
        right: -10%;
        bottom: 45px;
        -webkit-clip-path: inset(0px 0px 0px -237px round 0px 0px 30% 100%);
        clip-path: inset(0px 0px 0px -237px round 0px 0px 30% 100%); 
    }
    .cursos-footer::before {
        right: -4%;
    }
    .cursos-desafios {
        margin-top: -8rem;
    }
    #cursos-tabs .nav-link{
        font-size: 1rem;
        max-width: 215px;
    }
    .temario-footer{
        height: 250px;
    }
    .faq-header{
        height: auto;
        padding-bottom: 15rem;
    }
    .suscripcion-footer{
        background-size: 100% auto, calc(20vw + 200px) auto ;
    }
    .navbar.navbar-expand-lg .navbar-nav {
        gap: 1rem;
    }
    .card-curso .card-hover{
        font-size: 1rem;
    }
    .titulo-principal.ebooks h1{
        font-size: calc(2rem + 3vw);
    }
    .titulo-principal.ebooks h1 span{
        font-size: calc(3rem + 3vw);
    }
}
@media(max-width:991px) {
    .banner h3.text-border {
        font-size: calc(2rem + 3vw);
    }
    .banner h3, .descubre h4 {
        font-size: calc(1rem + 3vw);
    }
    .marquee h3{
        font-size: calc(1.5rem + 3vw);
    }
    .soy{
        background: none;
        padding-bottom: 5rem;
    }
    .btn-mas{
        font-size: calc(1rem + 1.5vw);
    }
    .descubre{
        min-height: 42rem;
        margin-top: -5rem;
    }
    .servicios::after{
        width: calc(240px + 22vw);
        height: calc(240px + 22vw);
        bottom: 10%;
    }
    .bg-lap{
        background-size: 100% 60%;
    }
    .cursos-top{
        background-size: 160% 100%, 0;
    }
    .cursos-footer img {
        -webkit-clip-path: inset(0px 0px 0px -202px round 0px 0px 30% 100%);
        clip-path: inset(0px 0px 0px -202px round 0px 0px 30% 100%);
    }
    .cursos-desafios {
        margin-top: 0;
    }
    .cursos-desafios h3{
        position: relative;
        font-size: calc(1rem + 3.3vw);
    }
    .live span:first-child {
        padding-right: 0;
    }
    .live span:last-child {
        padding-left: 0;
    }
    #cursos-tabs .nav-link{
        font-size: 1rem;
        max-width: 100%;
        width: 300px;
    }
    .temario-tabs{
        background-size: 100% 180px;
    }
    .temario-content{
        margin-top: 0;
    }
    .comunidad{
        margin-top: 0;
    }
    .faq h2{
        font-size: calc(2rem + 2vw);
    }
    .faq h3{
        font-size: calc(2.5rem + 2vw);
    }
    .faq-header{
        padding-bottom: 5rem;
        background-size: 140% 100%;
    }
    .faq-body #accordion-faq{
        margin-top: 0;
    }
    .faq-header {
        background-position: center 70px;
    }
    #accordion-faq .accordion-button{
        font-size: calc(1rem + 1.5vw);
    }
    .latest{
        background-size: 150% 100%;
    }
    .latest-body .flip-card{
        max-width: 70%;
        height: 330px;
    }
    .flip-card-back-num, .flip-card-front-num{
        width: 115px;
    }
    .titulo-principal.blog{
        background-size: 125% 100%;
    }
    .suscripcion{
        padding-top: 6rem;
        background-size: 100% 250px;
    }
    .sub-text{
        left: 0;
    }
    .int-post{
        height: auto;
    }
    .content-post{
        padding-top: 5rem;
    }
    .card-curso .card-hover{
        font-size: calc(.5rem + 1vw);
    }
}

@media(max-width:767px){
    .cursos-body{
        background: #d2cecc;
    }
    .cursos-footer{
        height: 130px;
    }
    .cursos-footer img{
        display: none;
    }
    .cursos-footer::before {
        display: none;
    }
    #accordion-faq .accordion-body{
        font-size: inherit;
    }
    body {
        font-size: calc(.6rem + 1.5vw);
    }
    .temario-header{
        background-size: 160% 100%;
    }
    .latest{
        padding-top: 14rem;
        margin-top: -3rem;
    }
    .latest-footer{
        height: 110px;
    }
    .separador-podcast{
        height: 240px;
        background-size: 100% 100%, 15rem auto;
        background-position: center top, 20% -5rem;
    }
    .sub-text{
        height: 100%;
        width: 50px;
        background-size: 100% auto;
        top: 20%;
    }
    .areas .accordion-header > button{
        font-size: calc(1rem + 1.5vw);
    }
}

@media(max-width:576px){
    .banner h3.text-border {
      font-size: calc(1.3rem + 3vw);
    }
    .banner h3 {
        font-size: calc(.6rem + 3vw);
    }
    .soy h3 {
        font-size: calc(3rem + 10vw);
    }
    .banner::before {
        max-width: 90%;
    }
    .call-to-action::after {
        right: -20%;
    }
    .contacto{
        background: none;
    }
    .temario-footer {
        height: 125px;
    }
    .button-comunidad > div{
        max-width: 80%;
    }
    .button-comunidad > div::after,
    .button-comunidad > div::before{
        height: 60px;
    }
    .contacto-int::before,
    .contacto-int::after{
        display: none;
    }
}