/*----------------------------------------banner--------------------------*/
.banner{ background-image: url(../img/fondo_banner.jpg); background-size: cover; background-position: center center;}
.banner .btn-close{
    
    font-weight: bold;
    background: none;
    font-size: 2em;
}

.fa-circle-xmark:before{color: #000!important;}
.modal-fullscreen .modal-content {background-color: transparent!important;}
.banner .presentacion{ font-size: clamp(1.1rem, 3vw + 0.5em, 1.4rem); color:#333; line-height: 100%; font-weight:600; margin-bottom: 0px;}
.banner .caja_evento .fecha {font-size:1.7rem; display: flex; flex-direction: column; ; font-weight: 500; position: relative; margin-top: -20px; line-height: 100%;}
.banner .caja_evento .fecha span{font-size: 4.7em; line-height: 100%; letter-spacing: -10px;}
.banner .caja_evento .fecha::after{
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 150px; /* o el tamaño que quieras */
    height: 2px;

}


.banner .caja_evento .evento{text-transform: uppercase; color:#000; font-size:clamp(1.3em, 3vw + 0.5em, 1.5em); line-height: 95%; font-weight: 600;}
.banner .caja_evento .texto_evento{ font-weight: 600; font-size:clamp(0.9em, 3vw + 0.5em, 1em); line-height:100%;}
.banner .reserva{font-weight: 600; font-size:clamp(1em, 3vw + 0.5em, 1.2em); line-height:100%;}
.banner  .reserva a{  text-decoration: underline;}
.banner  .reserva a:hover{color:#000;}

.banner .btn_corporativo{letter-spacing: 0px!important;}

/*------media queries------------*/
/* Extra small devices (portrait phones, less than 576px)*/
@media (width <= 575.98px){
   
    .banner .caja_evento .evento{ font-size:1.1em!important;}
    .banner .caja_evento .fecha span{font-size:2.5em; }
    .banner .caja_evento .texto_evento{ font-size:0.9em!important;}
    .banner .btn_corporativo{font-size: 0.8em; padding: 8px 15px;}
    .banner .presentacion{font-size: 1.1em;}
    
}



/* Small devices (landscape phones, 576px and up)*/
@media (576px <= width <= 767.98px) {
    .banner .caja_evento {max-width: 197px; }
    .banner .caja_evento .evento{ font-size:1.1em!important;}
    .banner .caja_evento .fecha span{font-size:2.2em; }
    .banner .caja_evento .texto_evento{ font-size:0.9em!important;}
    .banner .btn_corporativo{font-size: 0.8em; padding: 8px 15px;}
    .banner .presentacion{font-size: 1.1em;}

}


/* Medium devices (tablets, 768px and up)*/
@media (768px <= width <= 991.98px) {
    .banner .caja_evento .fecha span{font-size:2em; }
    .banner .caja_evento .evento{ font-size:1.1em!important;}
    .banner .btn_corporativo{font-size: 0.9em; padding: 8px 20px;}
    .banner .caja_evento .texto_evento{ font-size:0.9em!important;}
    .banner .presentacion{font-size: 1em;}
    .banner .reserva {font-size: 1em;}
}
/* Medium devices (tablets, 768px and up)*/
@media (768px <= width <= 991.98px) and (orientation: portrait) {

}