:root{ 
    --eidm: #8f00f0;
     --principalMed:rgb(103, 138, 128) ;
     --naranja:#ef7808 ;
       --naranjaLight:#ffe1c6 ;
     --principal: rgb(0, 135, 94) ;;
        --principalLight:rgb(170, 219, 204) ;;
    --blanco:#fff;
    --grisLightest:rgb(250, 250, 250);
    --grisLight:rgb(238, 238, 238);
    --grisLight2:rgb(190, 190, 190);
    --grisMed : #8a8a8a;
    --grisDark: #2e2e2e;
   
}

.f-serif-i{
     font-family: 'Zodiak-ThinItalic';
     font-style: italic;
}


.padLeftCalc{
    padding-left: var(--padLeftXL);
}
 
.b-rad{
    border-radius: var(--radio);
}


.back-grisLight{
    background-color: var(--grisLight);
}
.back-grisLightest{
    background-color: var(--grisLightest);
}

.back-white{
    background-color: var(--blanco);
}

.back-grid{
    background-image: url('../images/grid_back_2.png');
}

.back-verde{
    background-color: var(--principal);
     color: var(--blanco);
}
.col-verde, .col-verde *{
    color: var(--principal);
}

.col-naranja{
    color: var(--naranja);
}

.col-principal, .col-principal *{
    color: var(--principal);
}
.col-principalMed, .col-principalMed *{
    color: var(--principalMed);
}

.col-principalLight, .col-principalLight *{
    color: var(--principalLight);
}

.col-principalDark, .col-principalDark *{
    color: var(--principalDark);
}

.col-white, .col-white *{
    color: var(--blanco);
}

.col-grisMed, .col-grisMed *{
    color: var(--grisMed);
}

.col-grisDark, .col-grisDark *{
    color: var(--grisDark);
}

/* FUENTES */

.f-titular {
  font-family: "Antonio", sans-serif;
 
}
.f-contenido {
  font-family: "DM Sans", sans-serif;
 
}
html, body{
    overflow-x: hidden;
}

.pos-rel{
    position: relative;
}

*{
     font-family: "DM Sans", sans-serif; 
}

.pad-peq{
    padding-left: 15px;
    padding-right: 15px;
}

p:last-child{
    margin-bottom: 0;
}


/*HERO*/

.text-hero{
    & strong{
        font-weight: 600;
        color:var(--principalMed) !important;
    }

    position: relative;

    &:before{
        position: absolute;

        width: 30px;
        height: 1px;
        background-color: var(--principalMed);
        content: "";
        top: -15px;
        left: 0;

    }
}

.kind{
    color:var(--grisMed);
    border: 1px solid var(--grisMed);
    line-height: 1;
    border-radius: 500px;
    padding: 5px 12px; 
    font-weight: 300;
}

.with-ponente{
   color:var(--principalMed) ;
}

.list-content{

    list-style: disc;
}

.item-date-in{
    border:1px solid var(--grisDark);
    color:var(--grisDark);
    font-size: 0.85rem;
    border-radius: 500px;
    display: inline-block; 
    padding: 5px 10px
}

.back-tela{
    height: 100%;;
    width:100%; 
    background-image: url('../images/flota_tela_plata.png');
    background-position: center right;
    background-repeat: no-repeat;
    background-size: contain;
    max-width: 50svw;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right:0;
}


.tit-date{
    /* font-size: 3rem;
    font-weight: 200;
    text-transform: uppercase; */
    font-weight: 300;
    font-size: 16px ;
}
.date{
    margin-top: 0;
    padding-top: 0;
    line-height: 1;
font-size: 2rem;
margin-right: 15px;
color:var(--principal);
font-weight:700
}
.hour{
    color:var(--eidm);
font-size: 3rem;
}

 
/* TEXTOS */

.tit-seccion{ 
 /*32-48  360 - 1600*/ 
 /* font-size: clamp(2rem, 1.6087rem + 1.7391vw, 3rem); */
 font-size: clamp(2rem, 1.7097rem + 1.2903vw, 3rem);
 line-height: 105%;

}
.subtit-seccion{
      
/*.f20-to-32  360 - 1600 */
/* font-size: clamp(1.25rem, 1.0323rem + 0.9677vw, 2rem); */
  font-size: clamp(1.25rem, 0.9565rem + 1.3043vw, 2rem);

}
.h3-page{

}



/*PADDINGS*/

.pad-header{
    padding: calc( var(--altHeader) * 2) 0;
}


.container{
    --gap:15px !important;
    padding:0;
    /* border:1px solid rgb(255, 255, 255); */
    max-width: calc(100% - var(--gap) * 2); 

    @media screen and (min-width:1400px) {
            max-width: calc(100% - var(--gap) * 6); 
    }
    @media screen and (min-width:1600px) {

        max-width: 1600px
        
    }

        &.max-1200{
    max-width: 1200px;
    }

    &.max-1024{
    max-width: 1024px;
    }
}

.container-left{

    padding-left:  calc(  var(--gap) * 1);

    @media screen and (min-width:768px) {
        padding-left:  calc(  var(--gap) * 2);
    }

    @media screen and (min-width:1400px) {
       padding-left: calc(  var(--gap) * 6); 
    }

        @media screen and (min-width:1600px) {
       padding-left: var(--padLeftXL); 
    }
 

}

.pad-peq{
    @media screen and (max-width:768px){
        padding: var(--gap);
    }

}
.py-gap{
    padding-top: var(--gap);
    padding-bottom: var(--gap);
}

/*MARGIN */

.mb-30{
    margin-bottom: 30px;
}

/* HEADER */

.logo-header{
    height: 30px;
    @media screen and (min-width: 768px) {
    height: 40px;    
    }
    
}

/* PONENTE */

.col-foto-ponente{

    & img{
        @media screen and (max-width:1024px) {
            
        max-width: 350px;
        }
    }

}

.nombre-bio{
    margin-bottom: 50px;
    position: relative;


    &:after{
        position: absolute;
        top:50%;
        left:0;
        width: 50svw;
        background-color: var(--principalMed);
        content: "";
        transform: translateX(-100%);
        height: 2px;
    }
}

.img-ponente{
box-shadow: rgba(0, 0, 0, 0.2) 0px 12px 28px 0px, rgba(0, 0, 0, 0.1) 0px 2px 4px 0px, rgba(255, 255, 255, 0.05) 0px 0px 0px 1px inset;

    z-index: 10;
    aspect-ratio: 1;
    object-fit: cover;
    object-position: top center;

}


/* PONENTE */

 

/* HERO */

 

.bot-cta{
    background-color: var(--principal);
    border: 1px solid var(--principal);
    padding: 10px 30px;
    border-radius: 500px;
    text-transform: uppercase;
    color:var(--blanco);
    text-decoration: none;
    /*16 - 20 - 360 - 1600 */
    font-size: clamp(1rem, 0.9274rem + 0.3226vw, 1.25rem);
    transition: all 0.3s;

    &:hover{
        color: var(--principal);
        background-color: transparent;
    }


    &.mas_info{
        border-color:  var(--grisDark);
        color: var(--grisDark);
        border:1px solid var(--grisDark);
        background-color: transparent;
        &:hover{
            background-color: var(--grisDark);
            color:var(--blanco);
        }
    }

}


.bot-cta-peq{
padding: 5px 15px;
font-size: 16px;

}

.back-quadGran{

    position: absolute;
    top: 0;
    left: 0;

    height: 100svh;
    
    right: 0;
    z-index:-1;
    background-repeat:repeat ;

    background-size: 2.5%;
    opacity: 0.5;

 
    background-image: url('../images/quad_gran.svg');
    
    &:after{
        content: "";

        position: absolute;
        top:0;
         
        left: 0;
        right: 0;
        bottom: 0;
                
        background: #ffffff;
        background: linear-gradient(217deg,rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);

        
    }
}

.back-puntos{
    background-image: url('../images/fondo_puntos.svg');
    background-repeat: repeat;
}
.back-puntos_verdes{
    background-image: url('../images/fondo_puntos_verdes.svg');
    background-repeat: repeat;
}


.pad-seccion{
    padding-top: 50px;
    padding-bottom: 50px;
    @media screen and (min-width:768px){

    padding-top: 75px;
    padding-bottom: 75px;

    } 
}

.pad-seccion-video{

    padding-top: 75px;
    padding-bottom: 75px;

    @media screen and (min-width:768px){

    padding-top: 100px;
    padding-bottom: 100px;

    } 

}

.pad-seccion-expandida{

    padding-top: 75px;
    padding-bottom: 75px;

    @media screen and (min-width:768px){

        padding-top: 100px;
        padding-bottom: 100px;

    } 

    @media screen and (min-width:1200px){

        padding-top: 150px;
        padding-bottom: 150px;

    } 

}

 

.pad-seccion.back-futbol, .pad-seccion.back-grisLightest{
        padding-bottom: 50px;
        @media screen and (min-width:768px){
            padding-bottom: 100px;
        }
        @media screen and (min-width:1024px){
            padding-bottom: 150px;
        } 
 }

 .pad-seccion-max{
            
        @media screen and (min-width:768px){
            padding-bottom: 100px;
                 padding-top: 100px;
        }
        @media screen and (min-width:1024px){
            padding-bottom: 200px;
                 padding-top: 200px;
        } 
 }

.item-desta{

    padding: 16px 24px;
    padding-top: 20px;
    @media screen and (min-width:1024px) {
        padding: 24px 30px;
        padding-top: 26px;
    }
        
    border-radius: var(--radio);
    background-color: var(--grisLight);

    @media screen and (min-width:768px) {
        min-height: 400px;
    }

    @media screen and (max-width:768px) {
        margin-bottom: 30px;;
    }


    & .tit{
        color:var(--principal);
        font-weight: 700;
        max-width: 300px; 
        
font-size: 32px;
        @media screen and (max-width:768px) {
            padding-right: 35px;
            margin-bottom: 25px;
        font-size: 24px;    
            
        }
    }

    & p{
        font-size: 18px;
    }

}

*[class^="box-"] {
  position: relative;

  &:before{
    content: "";
    position: absolute;
    width:30px;
    height: 30px;
    top:25px;
    right:15px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;

}
}


.pl-img{
    padding-left: 50px;
}

.cont-img-cover{
  display: flex;
  flex: 1;
  position: relative;
  height: 100%;

}
.img-cover{
    position: absolute;
    min-height: 100%;

    object-fit: cover;
    object-position: center;

    aspect-ratio: 250/600;

    
    bottom: 0;
 
    right: 0;

    border-top-left-radius: 500px;
    border-top-right-radius: 500px;
}

/* AIMED */
  
   
 
.img-star{
    max-width: 130px;
}

.box-especial{
      &:before{
    background-image: url('../images/diamantito_prin.svg');
      }
    
}
.box-network{
      &:before{
    background-image: url('../images/diamantito_prin.svg');
      }
     
}
.box-empleo{
      &:before{
    background-image: url('../images/diamantito_prin.svg');
      }
     
}
 
 

.listado-unique{
    @media screen and (max-width:768px) {

        & .item-specs{
            margin-bottom: 30px;
        }
        
    }
}


.img-fit{
    object-fit: cover;
    object-position: center;
    border-radius: var(--radio);
}




.item-desta-prin{
    border-radius: 8px;
    border: 1px solid var(--principal);
    padding: 15px;
    color:var(--principal);

    strong{
        font-weight: 700;
    }

    & .cont-desta-prin{
        font-weight: 300;
        margin-top: 50px;
        color:var(--grisDark);
    }

}
.num_desta{

     color:var(--principal);
    font-size: 7svh;
    position: relative;

    line-height: 1;

    & .super{

        font-size: 0.4em;
        position: absolute;
        left:20px;

    }

}
.cont-desta-prin{

}

.img-pala{
    position: absolute;
    top: 0;
    left: calc(var(--gap) * 2 );
    right: 0;
    bottom: 0;
}


/* GRID */


/* .master-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(8, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
}

.grid-sec-1 { grid-area: 1 / 1 / 3 / 2; }
.grid-sec-2 { grid-area: 3 / 1 / 5 / 2; }
.grid-sec-3 { grid-area: 1 / 2 / 5 / 3; }
.grid-sec-4 { grid-area: 3 / 3 / 5 / 4; }
.grid-sec-5 { grid-area: 1 / 3 / 3 / 4; }
.grid-sec-6 { grid-area: 5 / 3 / 7 / 4; }
.grid-sec-7 { grid-area: 7 / 3 / 9 / 4; }
.grid-sec-8 { grid-area: 5 / 1 / 9 / 3; } */




.master-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
grid-template-rows: repeat(4, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
}
 

.grid-sec-1 { grid-area: 1 / 1 / 3 / 2; }
.grid-sec-2 { grid-area: 1 / 3 / 2 / 4; }
.grid-sec-3 { grid-area: 2 / 3 / 3 / 4; }
.grid-sec-4 { grid-area: 1 / 2 / 3 / 3; }
.grid-sec-5 { grid-area: 3 / 3 / 4 / 4; }
.grid-sec-6 { grid-area: 3 / 1 / 5 / 2; }
.grid-sec-7 { grid-area: 3 / 2 / 4 / 3; }
.grid-sec-8 { grid-area: 4 / 2 / 5 / 3; }
.grid-sec-9 { grid-area: 4 / 3 / 5 / 4; }


.row-img-list{
    display: flex;
    justify-content: end;
    margin-bottom: 25px;
    align-items: start;
}

.item-specs{
    justify-content: space-between;
    border-radius: var(--radio);
    border:1px solid var(--blanco);
    padding-top:15px;
    padding-bottom: 35px;
    backdrop-filter: blur(10px);
 
    & .img_list{
        width: 35px;
        height: auto;
        transition: all 0.3s;
    }

    & p{
        padding-right: 25px;
    }


    &:hover{

        & .img_list{
            transform: rotate(180deg);
        }

    }

}



.item-specs:has(img) , .item-specs:has(h3){ 
    /* padding: 0;
    bordeR:0; */
}
 

.back-futbol{

    position: relative;
    overflow: hidden;

}

.back-futbol:after{
        content: "";
        background-color: var(--principal);
        opacity: 0.92;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-position: top right;
        background-size: cover;
        z-index: -1; 
}

.back-image-futbol{
        
        background-image: url('../images/fondo_futbol.jpg');
        position: absolute;
        
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-position: top right;
        background-size: cover;
        z-index: -2; 
        opacity: 1;
}

.swiper-galeria-path, .swiper-galeria-experience{
    position: relative;
    max-width: 100svw;

    &:after{
        content: "";
        background: #ffffff;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
        top:0;
        bottom: 0;
        right: 0;
        width: 200px;
        position: absolute;
        z-index: 100;
        pointer-events: none;

    }
}

.bot-galeria-path{

    @media screen and (max-width:768px) {
        margin-bottom: 30px;
        margin-top: 20px;
    }
}

.bot-flech-gal{
    border-radius: 500px;
    background-color: var(--principal);
    aspect-ratio: 1;
    width: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
 

    & img{
        max-width: 35px;

    }



    &.prev-gal{
        & img{
            transform: rotate(180deg);
        }
    }

    margin-right: 20px;

    &:last-child{margin-right: 0;}

    transition: all 0.3s;
    &:hover{
        background-color: var(--grisDark);
    }
}



/*GALERIA INTERNACIONAL*/

.cont-galeria-int {
display: grid;
/* grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(3, 1fr); */
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(2, 1fr);


grid-column-gap: 15px;
grid-row-gap: 15px; 
}

 


.item-gal-int-1 { grid-area: 1 / 1 / 2 / 2; }
.item-gal-int-2 { grid-area: 2 / 1 / 3 / 2; }
.item-gal-int-3 { grid-area: 1 / 2 / 2 / 3; }
.item-gal-int-4 { grid-area: 1 / 4 / 2 / 5; }
.item-gal-int-5 { grid-area: 2 / 5 / 3 / 6; }
.item-gal-int-6 { grid-area: 1 / 6 / 2 / 7; }
.item-gal-int-7 { grid-area: 2 / 3 / 3 / 4; }
.item-gal-int-8 { grid-area: 2 / 4 / 3 / 5; }



*[class^="item-gal-int"] {

    display: flex; 
      /* cuadrado */
      position: relative;


 
 & img{
          overflow: hidden;
      border-radius: var(--radio);
    max-width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    object-position: center;
 }

}


.galeria-inter {
display: grid;
grid-template-columns: repeat(6, 1fr);
grid-template-rows: repeat(2, 1fr);
grid-column-gap: 15px;
grid-row-gap: 15px;
}

.gal-item-int-1 { grid-area: 1 / 1 / 2 / 2; }
.gal-item-int-2 { grid-area: 2 / 1 / 3 / 2; }
.gal-item-int-3 { grid-area: 1 / 2 / 2 / 3; }
.gal-item-int-4 { grid-area: 2 / 2 / 3 / 3; }
.gal-item-int-5 { grid-area: 1 / 3 / 2 / 4; }
.gal-item-int-6 { grid-area: 2 / 3 / 3 / 4; }
.gal-item-int-7 { grid-area: 1 / 4 / 2 / 5; }
.gal-item-int-8 { grid-area: 2 / 4 / 3 / 5; }
.gal-item-int-9 { grid-area: 1 / 5 / 2 / 6; }
.gal-item-int-10 { grid-area: 2 / 5 / 3 / 6; }
.gal-item-int-11 { grid-area: 1 / 6 / 2 / 7; }
.gal-item-int-12 { grid-area: 2 / 6 / 3 / 7; }

/*div[class^='myclass'], div[class*=' myclass']{*/
 div[class^='gal-item-int-']{
       /* background-image: url('../images/fondo_puntos_verdes_3.svg'); */
       background-color: var(--principalLight);
             background-color: var(--grisLightest);
       border-radius: var(--radio);
 }

.cubre_blanco{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity:  0;
    background-color: var(--blanco);
    /* background-image: url('../images/fondo_puntos_verdes.svg'); */
    transition: opacity 0.5s;
 
 
}
.cubre_blanco.aparece{
    transition: opacity 0.5s;
        opacity: 1;
    }

*[class^="gal-item-int"] {

    display: flex; 
      /* cuadrado */
      position: relative;


 
 & img{
          overflow: hidden;
      border-radius: var(--radio);
    max-width: 100%;
    aspect-ratio: 1;
    object-fit: cover;
    object-position: center;
 }

}



.listado-for{

    --gap:15px;

    gap: var(--gap);

    display: flex;
    flex-wrap: wrap;
    justify-content: start;

    width: 100%; 


    & li{

        color:var(--blanco);
 
        padding : 15px;
        display: flex;
        flex-direction: column;

        /* border:1px solid var(--principal); */
        background-color: var(--principal);
        border-radius: var(--radio);

      
    }           

     & .icono-for{  
        
         max-width: 35px;

        @media screen and (min-width:768px) {
             max-width: 50px;
        }
           
            margin-bottom: 20px;
    }
    
    

    @media screen and (min-width:360px){
        


        
         & li{
            max-width:calc( ( 100%  - (var(--gap)/1)   )   / 2 )  ;
         }

 
    } 

        @media screen and (min-width:360px) and (max-width:640px){
            & li:last-child{
                max-width: 100%;
            }
        }

     @media screen and (min-width:640px){
  
            
            & li{
                max-width:calc( ( 100%  - (var(--gap)*2)   )   / 3 )  ;
            }

    
     } 

     @media screen and (min-width:1024px){
  
            
            & li{
                max-width:calc( ( 100%  - (var(--gap)*4)   )   / 5 )  ;
                justify-content: space-between;
                min-height: 225px;
            }

    
     } 



 
}
 
     /*TESTIMONIOS*/

.nom-testi{
    color:var(--principal);
    font-weight: 600;
    font-size: 20px;
    margin-bottom: 5px;
}

.cargo-testi{
    font-weight: 600;
margin-bottom: 10px;
}

.exper-testi{

    font-size: 15px;

}

.info-testimonial{
    justify-content: space-between;
}

.slide-testimonio{
    --gap:15px; 
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: 100%; 
    gap:calc(var(--gap) * 1.5 );
    @media screen and (min-width:480px) {
 
 

        & .info-testimonial{


            
            border-radius: var(--radio);
            /* width: 50%; */
            width: 100%;
            padding: var(--gap);
            padding-top: calc(2 * var(--gap));
            background-color: var(--grisLight);
        }

        & .cont-img-testi{
            width: 50%; 
            position: relative; 

            &:before{
                display: none;
                content:"";
                position: absolute;
                top:15px;
                left:15px;
                width: 50px;
                height: 50px;
                transform: rotate(180deg);
                background-repeat: no-repeat;
                background-size: contain;
                     background-image: url('../images/comillas.svg');
      
            }


            &:after{
                display: none;
                content:"";
                position: absolute;
                bottom:15px;
                right:15px;
                width: 50px;
                height: 50px;

                background-repeat: no-repeat;
                background-size: contain;
                     background-image: url('../images/comillas.svg');
      
            }


            

        }

        & .img-testi{
            width: 100%;
            height: 100%;
            object-fit: cover;
            object-position: center;
        }
        
    }
}
 

/* LISTADO APRENDERÁS*/

.img-aprenderas{

    @media screen and (max-width:768px) {

        min-height: 50svh;

        margin-bottom: 15px;
        
    }

}


 .listado-aprenderas{
    --gapAprenderas:36px;
    width: 100%; 
    @media screen and (min-width:768px){
        
  
        gap: var(--gapAprenderas);
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;


    } 

    @media screen and (max-width:768px){
        display: flex;
        flex-direction: column;

        & .listado-learn{
            width: 100%;;
            flex-wrap: wrap; 
            --gapAprenderas:15px;

                & li{
                    width: 100%;
                    max-width: calc(50% - var(--gapAprenderas) / 2 );
                }

                  & li:last-child{
                    max-width: 100%;

                  }

        }


    }

    @media screen and (min-width:1024px){
        --gapAprenderas:48px;
    }


     & .item-listado:nth-child(1){

         width:100%;        


        @media screen and (min-width:768px){
             max-width: calc(40% - var(--gapAprenderas) / 2 );
         
        }

    }    
     & .item-listado:nth-child(2){

         width:100%;        


        @media screen and (min-width:768px){
             max-width: calc(60% - var(--gapAprenderas) / 2 );
         
        }

    }  
 
}


.listado-details{
        --gapAprenderas:36px;

         & .item-listado:nth-child(1){

         width:100%;        


        @media screen and (min-width:768px){
             max-width: calc(50% - var(--gapAprenderas) / 2 );
         
        }

    }    
     & .item-listado:nth-child(2){

         width:100%;        


        @media screen and (min-width:768px){
             max-width: calc(50% - var(--gapAprenderas) / 2 );
         
        }

    }  


}


.listado-learn{

    --gap:15px;

    gap: var(--gap);

    display: flex;
    flex-wrap: wrap;
    justify-content: start;

    width: 100%; 

      

    & .icono-for{
        max-width: 50px;
        margin-bottom: 20px;
    }
    
    

    @media screen and (min-width:480px){
        


        
         & li{
            max-width:calc( ( 100%  - (var(--gap)/1)   )   / 2 )  ;
         }

 
    } 

     @media screen and (min-width:640px){
  
            
            & li{
                max-width:calc( ( 100%  - (var(--gap)*2)   )   / 3 )  ;
            }

    
     } 
 

 
}

.item-in{


        justify-content: flex-end;

        width: 100%;

        min-height: 150px;

        color:var(--principal);

 
        padding : 15px;
        display: flex;
        flex-direction: column;

        /* border:1px solid var(--principal); */
        background-color: var(--grisLight);
        border-radius: var(--radio);

        position: relative;

         color:var(--grisDark); 
         
         @media screen and (max-width:768px) {

            min-height: 200px;
            
         }

         font-size: 18px;


        &:before{
            content: "01";
            color:var(--principal);            
            position: absolute;
            top:15px;
            left:15px;
            font-weight: 600;
            font-size: 1.3em; 
            
        }


        &:nth-child(2){

            &:before{
                content:"02";
            }
        }
        &:nth-child(3){

            &:before{
                content:"03";
            }
        }
        &:nth-child(4){

            &:before{
                content:"04";
            }
        }
        &:nth-child(5){

            &:before{
                content:"05";
            }
        }
        &:nth-child(6){

            &:before{
                content:"06";
            }
        }
        &:nth-child(7){

            &:before{
                content:"07";
            }
        } 
        &:nth-child(8){

            &:before{
                content:"08";
            }
        } 
        &:nth-child(9){

            &:before{
                content:"09";
            }
        } 
        &:nth-child(10){

            &:before{
                content:"10";
            }
        }


}


/*MAIN */

.tit-bullets{

    border: 1px solid var(--grisLight2);
    padding: 5px 15px;
    border-radius: 500px;
}

.lista-desta-about{
    margin-left: 0;
    padding-left: 0;
    list-style: none;
    width: 100%;;
    overflow: hidden;

     & li{
        overflow: hidden;
        width: 100%;;
        padding: 8px 0;
        margin: 8px 0;
        border-bottom: 1px solid var(--grisLight2);
        /*18-32 */
        /* font-size: clamp(1.125rem, 0.871rem + 1.129vw, 2rem); */
        font-size: 16px;
        line-height: 110%;


     }

     & .num{
        color:var(--grisLight2)
     }
}

.img_der_eidm{
    position: absolute;
    max-width: 25svw;
    border-radius: 8px;
    top:0;
    right:15px;
}

/* SWIPER APRENDERÁS  */




.swiper-galeria-aprenderas{
    position: relative;
    max-width: 100svw;

    &:after{
        content: "";
        background: #ffffff;
        background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
        top:0;
        bottom: 0;
        right: 0;
        width: 200px;
        position: absolute;
        z-index: 100;
        pointer-events: none;

    }
}

/* FICHA */


.image_diaman{
    position: absolute;
    width: 200px;
    height: 200px;
    object-position: center;
    object-fit: contain;
    top:50%;
    left:50%;
    transform: translate(-50%, -50%);
    transition: all 0.5s;
}
.img_diamen_anim_1{
    top: 0;
    right: 0;
    transform: translate(50% , -50%) rotate(-21deg);
   
}
.img_diamen_anim_2{
    bottom: 0;
    left: 0;    
    width: 125px;
    height: 125px;
     transform: translate(-70% , -30%) rotate(80deg);
}
.img_diamen_anim_3{
    bottom: 0;
    right: 0;    
    width: 150px;
    height: 150px;
     transform: translate( 100% , 70%) rotate(-65deg);
}


/* SWIPER APRENDERÁS */






.item-listado-pro{
        padding: calc(1.5 * var(--gap))  calc(1.5 * var(--gap));
    @media screen and (min-width:768px) {
            padding: calc(2 * var(--gap))  calc(3 * var(--gap));
    }

    border-radius: var(--radio);
 
}


.lista-profesional{

    & li{
        padding-bottom: 15px ;
        border-bottom: 1px solid var(--principal);
        margin-bottom: 15px;
    }

    & li:last-child{
        border: 0;
    }
}

.box-shadow{
        box-shadow: rgba(17, 17, 26, 0.05) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
 

}

.img-profesional{
    z-index: 100;
    position: absolute;
    border-radius: var(--radio);
    max-width: 500px;
    aspect-ratio: 16/11;;
    object-fit: cover;
    object-position: center;
    height: auto;
    bottom:0;
    right:0;

    transform: translate(90% , 25%);


}

.img-profesional-izq{
    z-index: 25;
    position: absolute;
    border-radius: var(--radio);
    max-width: 300px;
    aspect-ratio: 1/1;;
    object-fit: cover;
    object-position: center;
    height: auto;
    top:0;
    left:0;

    transform: translate(-90% , -50%);


}

.img-profesional-vert{
        z-index: 25;
    position: absolute;
    border-radius: var(--radio);
    max-width: 200px; 
    object-fit: cover;
    object-position: center;
    height: auto;
    bottom:25px;
    left:-50px;

    transform: translate(-100% , 0);

}


.pad-seccion-pro{
    border-bottom: 1px solid var(--grisLight);
}


.listado-start{
    @media screen and (max-width:768px) {

        padding-left: var(--gap);
        padding-right: var(--gap);
        
    }
}

.lista-start_today{
    @media screen and (min-width:1024px) {

        & li{
            padding-bottom: 30px; 
        padding-top: 30px; 
        position: relative;
        }

        & li:last-child{
            /* margin-bottom: 0;
                    padding-bottom: 0; */
        }

        & li:after{
            content:"01";
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            right: 0;
            color:var(--grisLight);
            font-size: 4rem;
            line-height: 1;
            font-weight:700;
            text-align: right;

        }

         & li:nth-child(2){
            &:after{
                content:"02";
            } 
         }
         & li:nth-child(3){
            &:after{
                content:"03";
            } 
         }
         & li:nth-child(4){
            &:after{
                content:"04";
            } 
         }
         & li:nth-child(5){
            &:after{
                content:"05";
            } 
         }
         & li:nth-child(6){
            &:after{
                content:"06";
            } 
         }
         & li:nth-child(7){
            &:after{
                content:"07";
            } 
         }
        
    }
}


.border-alert{
    border:1px solid limegreen
}


/*ADDITIONAL */

.additional-details{
    --gap:15px;
    position: absolute;
    bottom:-25px;
    right: 0;

    transform: translateX(25%);

    display: flex;
    gap:var(--gap);



    & .item-add{
        border-radius: var(--radio);
         backdrop-filter: blur(10px);
        padding: var(--gap);
        color:var(--blanco);
        overflow: hidden;

        width: calc(100% / 3 );


        & *{
        z-index: 1;
        }

        display: flex;
        flex-direction: column;
        justify-content: space-between;
        position: relative;

        &:before{
            border-radius: var(--radio);
            content: "";
            position: absolute;
            top:0;
            bottom: 0;
            left: 0;
            right: 0;
            background-color: var(--principal);
            opacity: 0.7;

        }

        & strong{
            font-weight: 400;
            margin-bottom: 15px;
        }

        & .info{

            font-size: 32px;
            line-height: 1.1;
        }

    }



}


.add-details{
    --gap:15px;


 
    display: flex;
    flex-wrap: wrap;
    gap:var(--gap);



    & .item-add{
        border-radius: var(--radio);
 
        padding: var(--gap);
        color:var(--blanco);
        overflow: hidden;
        width: 100%;

          @media screen and (min-width:480px){ 
            max-width:calc( ( 100%  - (var(--gap)*1)   )   / 2 )  ;
          }

          &:last-child{
            max-width: 100%;;
          }



        & *{
        z-index: 1;
        }

        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        position: relative;

        &:before{
            border-radius: var(--radio);
            content: "";
            position: absolute;
            top:0;
            bottom: 0;
            left: 0;
            right: 0;
            /* background-color: var(--principal); */
            opacity: 1;

                background: linear-gradient(65deg, #00875e, #28bcd3);
    background-size: 400% 400%;

    -webkit-animation: animeVerde 30s ease infinite;
    -moz-animation: animeVerde 30s ease infinite;
    animation: animeVerde 30s ease infinite;

        }

        & strong{
            font-weight: 400;
            margin-bottom: 15px;
        }

        & .info{

            font-size: 32px;
            line-height: 1.1;
        }

    }
 

}

.anime-gradient {
    background: linear-gradient(65deg, #00875e, #066448);
    background-size: 400% 400%;

    -webkit-animation: animeVerde 15s ease infinite;
    -moz-animation: animeVerde 15s ease infinite;
    animation: animeVerde 15s ease infinite;
}

@-webkit-keyframes animeVerde {
    0%{background-position:0% 83%}
    50%{background-position:100% 18%}
    100%{background-position:0% 83%}
}
@-moz-keyframes animeVerde {
    0%{background-position:0% 83%}
    50%{background-position:100% 18%}
    100%{background-position:0% 83%}
}
@keyframes animeVerde {
    0%{background-position:0% 83%}
    50%{background-position:100% 18%}
    100%{background-position:0% 83%}
}


/*FAQS */

.pad-faq{
    padding: var(--gap);

    @media screen and (min-width:1024px) {

         padding: calc( 3 * var(--gap));
        
    }
}


.listado-faq{
    & li{
        width: 100%;
        padding-bottom: 15px;
        margin-bottom: 15px;
        border-bottom:1px solid var(--principal);

        & .ask{
            font-weight: 700;
            font-size: 24px;
            margin-bottom: 20px;
        }

        &:last-child{
            border:0
        }

    }
}

.pelota_fut{
    position: absolute;
    max-width: 300px;
    height: auto;
    bottom:  0;
    right: 0;
    z-index: 100;
     transform: translate(-10% , 60%); 

    display: none;

    @media screen and (min-width:960px) {
        display: flex;
        
    }
}

.pelota_tenis{   
     
    position: absolute;
    max-width: 450px;
    height: auto;
    top: 0;
    left: 0;
    z-index: 100;
      transform: translate(-50%,-50% );  

    display: none;

    @media screen and (min-width:960px) {
        display: flex;
        
    }
}


/*FOOTER*/

.logo_ace{
    max-height: 20px;
    @media screen and (min-width:768px) {
            max-height: 30px;
    }

    width: auto;
}

.logo_footer{
    max-height: 20px;
    @media screen and (min-width:768px) {
         max-height: 32px;
    }
   
    width: auto;
}

.bot_more_texti{
    padding: 4px 20px;
    color: var(--principal);
    border:1px solid var(--principal);
    margin-top: 20px;
    border-radius: 500px;
    text-decoration: none;
    transition: all 0.3s;

    &:hover{
        background-color: var(--principal);
        color:var(--blanco)
    }

}

.in_testi{
    max-width: 750px;
}

.back-hexa{
    background-image: url('../images/red_hexa.svg');
    background-repeat: repeat;
    background-size: 2.5%;
    background-color: transparent;
    border: 0;

}

.hsfc-CheckboxField .hsfc-FieldLabel{
    display: flex;
    align-items: start !important;

  

    & input{
        margin-top: 4px;
    }
}

.gap-webinars{


    --gap:50px;

        @media screen and (min-width:1400px) {

  --gap:100px;
        }
}

.conjunto-ini-webinar{
    display: flex;
    flex-direction: column;

    padding-bottom: 60px;

    border-bottom: 1px solid var(--grisMed);

    margin-bottom: 50px;

    &:last-child{
        margin-bottom: 0;
        border-bottom: 0;
        padding-bottom: 0;
    }
}


.item-unidad-webinar{

    z-index: 100;

    transition: all 0.3s;

    padding: 30px 15px ;
    border-radius: 8px;
    border: 1px solid var(--grisLight);
     @media screen and (min-width:1024px) {
        padding: 30px;

     }

     box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;

     &:hover {       
        transform: scale(1.05)    ;
             box-shadow: var(--principalLight) 0px 8px 24px;
              z-index: 1000;
    }

    &:first-child{
        @media screen and (max-width:768px) {

            margin-bottom: 30px;
            
        }
    }
      
}

.despliegue{
    max-width: 1200px;
}

.fecha-info-webinar{
    margin-left: 10px;
    padding-left: 10px;
    border-left: 2px solid var(--grisMed);
}

.pad-info{
    position: relative;
    padding: 20px;

    @media screen and (min-width:1200px) {

        padding: 30px; 
        
    }
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    padding-left: 0 !important;
}

/*
background: #EEAECA;
background: radial-gradient(circle, rgba(238, 174, 202, 1) 0%, rgba(148, 187, 233, 1) 100%);
*/

.col-info-webinar{
    position: relative;
    width: 100%;

    /* @media screen and (min-width:768px) {
        max-width:60%;    
    } */

        @media screen and (min-width:1024px) {
        max-width:70%;    
    }
    
    

}
.col-bio-webinar{
width: 100%; 
    /* @media screen and (min-width:768px) {
        max-width:40%;
    } */
        @media screen and (min-width:1024px) {
        max-width:30%;    
    }


 @media screen and (min-width:1200px) {

    left: 30px;
 }

 position: relative;

 &:before{
    content: "";
    position: absolute;
    width: 1px;
    height: 100%;
    left:-20px;
    top: 0;
    background-color:  var(--grisLight2);;
    display: none;
 }


}

.info-bio-expand{

    @media screen and (min-width:700px) and (max-width:1024px)  {

 

        display: flex;
        flex-direction: row !important;

        & .cont-bio-expand-txt{
            padding-left: 20px;
        }

        & > div{
            max-width: 60%;
        }

        & .cont-img-expand{
            max-width: 30%;
        }

        
    }

}

.cont-bio-expand-txt p{

    line-height: 1.3;

}


.info-webinar-ia{
@media screen and (min-width:768px) {
    max-width: 60%;
}
}

.demonio{
    position: absolute;
    bottom: 0;
    left: 0;
    max-height: 700px;
    width: auto;
}

.ia_cae{
        position: absolute;
    bottom: 0;
    right: 0;
    max-height: 700px;
    width: auto;
}

.hsfc-DataPrivacyField .hsfc-RichText{
    font-size: 13px;

}

.hsfc-Row span{
 font-size: 14px;

}

 

.fondo_web{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url('../images/fondo_web_2.svg');
    background-position: top left;
    background-repeat: no-repeat;
    background-size: cover;
    width: 100svw;
    height: 100svh;
    z-index: 0;;
    opacity: 0.15;
}



.item-unidad-webinar{
    background-color: var(--blanco);
    /* backdrop-filter: blur(10px); */
}

.esquina_punto{
    position: absolute;
    top: 15px;
    right: 15px;
    z-index: 10;
    max-width: 500px;
}

.interferencias{
    position: absolute;
    left: 15px;
    top:50%;
    transform: translateY(-50%);
}

.listado-in-par{
    display: flex;
    flex-direction: row;
    @media screen and (max-width:960px) {

        display: flex;
        flex-direction: column;

        & .item-listado{
            width: 100%;
            max-width: 100%;

        }
        
    }
}
.flecha-izq{

    position:relative;

    &:before{
        content: ""; 
        width: 37px;
        height: 22px;
        background-position: center;
        background-size: contain;
        background:url('../images/flecha_izq_green.svg');
        position: absolute;
        top:4px;
        left:-5px;
        transform: translate(-100% , 0);
    }
}

.fecha_expand{

    border: 2px solid var(--grisMed);
    padding: 5px 10px;
    border-radius: 500px;
}

.fondo_gradient{
    position: absolute;
    top: 0;
    height: 100svh;
    left: 20%;
    right: 0; 
    opacity: 0.5;
    background-size: contain;
    background-position: top right;
    background-repeat: no-repeat;

    mix-blend-mode: multiply;

    background-image: url('../images/fondo.jpg');
}

.back_quads{
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-image: url('../images/quad_gran.svg');
        opacity: 0.7;
        background-size: 2%;

}

.foto-ponenente{
    /* max-width: 300px; */
}

.logo_up{
    position: absolute;
    top: 0;
    right: 0;
    transform: translate( 50% , -50%);
    max-width: 300px;
    z-index: 0;

    display: none;

    @media screen and (min-width:1024px) {

        display: flex;
        
    }

}

.img-form{
    object-fit: cover;
    object-position: center;
}

.bot_moreinfo{
    cursor: pointer;
    font-size: 48px;
    color:var(--principal);
    line-height: 1;
    width: 30px;
    height: 30px;
    background-image: url('../images/cruz.svg ');
    background-position: center;
    background-size: contain;

    position: relative;
    transform-origin: center;

    &.active{
        transform: rotate(45deg);
    }
}

    .lista-desta-about{
        max-height: 125px;
        overflow-y: hidden;

        position: relative;

        &:after{
            position: absolute;
            content: "";
            bottom: 0;
            left: 0;
            right: 0;
            height: 100px;
            background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
        }
    }


    .active-acordeon {
  max-height: unset;

    }

    @media screen and (min-width:960px) {
.bot_moreinfo{


        display: none;
        
    }

    .lista-desta-about{
          max-height: unset;
        display: flex;
        flex-direction: column;

             &:after{
                display: none;
             }
    }
}

.cont_num{

    & div{
        max-width: calc(100% - 30px); 
    }

    & .num{
        display: flex;
        width: 30px !important; 

    }
    display: flex;
    flex-direction: row;

}

.back_mestalla{
    background-image: url('../images/fon_mestalla.jpg');
    background-position: bottom center;
    background-size: cover;
    background-attachment: fixed;

}

.logo_val{
    max-height: 60px;
    @media screen and (min-width:768px) {
        max-height: unset;
    }

}
.logo_esbs_val{
    max-height: 30px;
    @media screen and (min-width:768px) {
        max-height: 45px;
    }

}
.plus{
    line-height: 1;
    padding: 15px;
    font-size: 36px;
    transform: rotate(45deg);
}