/* Default max-vh classes for mobile (below 576px) */
@media (max-width: 575px) {
    .max-vh-xs-10 { max-height: 10vh!important; }
    .max-vh-xs-20 { max-height: 20vh!important; }
    .max-vh-xs-30 { max-height: 30vh!important; }
    .max-vh-xs-40 { max-height: 40vh!important; }
    .max-vh-xs-50 { max-height: 50vh!important; }
    .max-vh-xs-60 { max-height: 60vh!important; }
    .max-vh-xs-70 { max-height: 70vh!important; }
    .max-vh-xs-75 { max-height: 75vh!important; }
    .max-vh-xs-80 { max-height: 80vh!important; }
    .max-vh-xs-90 { max-height: 90vh!important; }
    .max-vh-xs-100 { max-height: 100vh!important; }
}

/* Small devices (sm, min-width: 576px) */
@media (min-width: 576px) {
    .max-vh-sm-10 { max-height: 10vh!important; }
    .max-vh-sm-20 { max-height: 20vh!important; }
    .max-vh-sm-30 { max-height: 30vh!important; }
    .max-vh-sm-40 { max-height: 40vh!important; }
    .max-vh-sm-50 { max-height: 50vh!important; }
    .max-vh-sm-60 { max-height: 60vh!important; }
    .max-vh-sm-70 { max-height: 70vh!important; }
    .max-vh-sm-75 { max-height: 75vh!important; }
    .max-vh-sm-80 { max-height: 80vh!important; }
    .max-vh-sm-90 { max-height: 90vh!important; }
    .max-vh-sm-100 { max-height: 100vh!important; }
}

/* Medium devices (md, min-width: 768px) */
@media (min-width: 768px) {
    .max-vh-md-10 { max-height: 10vh!important; }
    .max-vh-md-20 { max-height: 20vh!important; }
    .max-vh-md-30 { max-height: 30vh!important; }
    .max-vh-md-40 { max-height: 40vh!important; }
    .max-vh-md-50 { max-height: 50vh!important; }
    .max-vh-md-60 { max-height: 60vh!important; }
    .max-vh-md-70 { max-height: 70vh!important; }
    .max-vh-md-75 { max-height: 75vh!important; }
    .max-vh-md-80 { max-height: 80vh!important; }
    .max-vh-md-90 { max-height: 90vh!important; }
    .max-vh-md-100 { max-height: 100vh!important; }
}

/* Large devices (lg, min-width: 992px) */
@media (min-width: 992px) {
    .max-vh-lg-10 { max-height: 10vh!important; }
    .max-vh-lg-20 { max-height: 20vh!important; }
    .max-vh-lg-30 { max-height: 30vh!important; }
    .max-vh-lg-40 { max-height: 40vh!important; }
    .max-vh-lg-50 { max-height: 50vh!important; }
    .max-vh-lg-60 { max-height: 60vh!important; }
    .max-vh-lg-70 { max-height: 70vh!important; }
    .max-vh-lg-75 { max-height: 75vh!important; }
    .max-vh-lg-80 { max-height: 80vh!important; }
    .max-vh-lg-90 { max-height: 90vh!important; }
    .max-vh-lg-100 { max-height: 100vh!important; }
}

/* Extra large devices (xl, min-width: 1400px) */
@media (min-width: 1400px) {
    .max-vh-xl-10 { max-height: 10vh!important; }
    .max-vh-xl-20 { max-height: 20vh!important; }
    .max-vh-xl-30 { max-height: 30vh!important; }
    .max-vh-xl-40 { max-height: 40vh!important; }
    .max-vh-xl-50 { max-height: 50vh!important; }
    .max-vh-xl-60 { max-height: 60vh!important; }
    .max-vh-xl-70 { max-height: 70vh!important; }
    .max-vh-xl-75 { max-height: 75vh!important; }
    .max-vh-xl-80 { max-height: 80vh!important; }
    .max-vh-xl-90 { max-height: 90vh!important; }
    .max-vh-xl-100 { max-height: 100vh!important; }
}

body:not(.loaded) .slider-parallax .slider-inner{
    position: unset!important;
}

.invisible {
    visibility: hidden;
}

.swiper_wrapper{
    background-color: var(--black-color);
}

#toast-container{
    margin-top: 10px!important;
}

#header .ajax-search-container button, #slider .ajax-search-container button{
    display: none;
}

.slider-caption h3{
    font-size: 24px;
}

.slider-caption h2{
    font-size: 36px;
}

div#header-wrap.semi-transparent.dark {
    background: rgba(0, 0, 0, 0.75);
}

#header.semi-transparent:not(.dark) {
    background: rgba(255, 255, 255, 0.75);
}

.fw-light{
    font-weight: 300;
}

.fw-regular{
    font-weight: 400!important;
}


.bg-gradient{
    background: linear-gradient(to right top, #ee3537, #f03342, #f0314c, #f13156, #f03260, #f03361, #ef3363, #ef3464, #ef345e, #ef3457, #ef3451, #ee354a)!important;
}


.button.button-primary {
    position: relative;
    overflow: hidden;
    background-image: linear-gradient(to right top, #ee3537, #f03342, #f0314c, #f13156, #f03260, #f03361, #ef3363, #ef3464, #ef345e, #ef3457, #ef3451, #ee354a);
    border: 1px solid #ee3537;
    color: white;
    transition: color 0.3s ease, border-color 0.3s ease;
}

.button.button-primary::before {
    content: '';
    position: absolute;
    inset: 0;
    background-color: white;
    opacity: 0;
    transition: opacity 0.5s ease;
    z-index: 0;
}

.button.button-primary span {
    position: relative;
    z-index: 1;
    transition: color 0.3s ease;
}

.button.button-primary:hover::before {
    opacity: 1;
}

.button.button-primary:hover {
    border-color: black !important;
}

.button.button-primary:hover span {
    color: black !important;
}



.button {
    padding: 12px 25px;
    border-radius: 30px!important;
    letter-spacing: 0.5px;
    font-weight: 400!important;
    transition: all 1s ease!important;
}

.button:not(.noshadow){
    box-shadow: 0 0 #0000, 0 0 #0000, 0 20px 25px -5px rgba(0, 0, 0, .5), 0 8px 10px -6px rgba(0, 0, 0, .5);
}


b.text-black.text-underline {
    border-bottom: 1px solid black;
}

.button.button-white {
    border: 1px solid white;
}

.button.button-black {
    border: 1px solid #111;
}

.button.button-white:hover {
    border: 1px solid black;
    background: black;
}

.button.button-white:hover span {
    color: white!important;
}

#slider button{
    font-weight: 500;
    font-size: 1rem;
    border-width: 1px !important;
}


@media(min-width:575px){

    #slider h2{
        font-size: 2.7em;
    }

    #slider h3{
        margin-top: 4vh !important;
        font-size: 1.6em;
        margin-bottom: 3vh;
    }

}

/* RESPONSIVE OVERALL FIXES*/
@media(max-width: 575px){
    
    .header-banderas {
        position: absolute;
        right: 120px;
        top: 8px;
    }

    #logo {
        max-width: calc(100% - 120px);
    }

    #logo img{
        margin: 10px 0;
        max-width: 200px;
    }

    #slider h3 {
        display: block;
        font-size: 1em;
        margin: 2em 0;
    }

    #slider h2{
        font-size: 1.75em;
        line-height: 1.15em;
        margin-top: 45px;
        margin-bottom: 0;
    }

}