@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

@import url('https://fonts.googleapis.com/css2?family=Montserrat+Alternates:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


:root {
    --height-nav: 50px;
    --height-nav-reserva-detalles-slider: 56px;
}


.Poppins {
    font-family: 'Poppins', sans-serif;
}

.border-bottom-color-azul-final {
    border-bottom: 1px solid var(--color-azul-final);
}

.z-index-menos-10 {
    z-index: -10;
}

.z-index-5 {
    z-index: 5;
}

.slider-detalles-reserva {
    position: absolute;
    display: block;
    height: 100%;
    width: 100%;
    z-index: 10;
    transition: top 0.3s ease-in-out;
}

.slider-oculto {
    top: calc(100vh - var(--height-nav-reserva-detalles-slider));
}

.slider-visible {
    top: var(--height-nav);
    width: 100%;
    margin-left: 0;
}


.navBarNone .slider-visible {
    top: 0 !important;
    width: 100%;
    margin-left: 0;
}

.height-nav-reserva-detalles-slider {
    height: var(--height-nav-reserva-detalles-slider);
}


.heightNav {
    height: var(--height-nav);
}

.heightBody {
    height: calc(100vh - var(--height-nav));
    max-height: calc(100vh - var(--height-nav));
    overflow-y: auto;
}


    .heightBody.navBarNone {
        height: 100vh !important;
        max-height: 100vh !important;
        overflow-y: auto;
    }

#navbarDeployed {
    position: fixed;
    height: 100vh;
    width: 100%;
    transform: translateY(-120%);
    transition: ease 1s all;
    z-index: 11;
}

    #navbarDeployed.active {
        transform: none;
    }

html, body {
    font-family: "Montserrat Alternates", sans-serif;
}

h1:focus {
    outline: none;
}

a, .btn-link {
    color: #0071c1;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred."
    }

.height-5px {
    height: 5px;
}

.mt-0px {
    margin-top: 0px !important;
}

.mt-menos-50-movil {
    margin-top: -50px;
}

.mt-menos-150-movil {
    margin-top: -150px;
}

.mt-menos-166-movil {
    margin-top: -166px;
}

.mt-menos-100-movil {
    margin-top: -100px;
}

.pt-100px-movil {
    padding-top: 100px;
}

.pt-50px-movil {
    padding-top: 50px;
}

.me-1_3rem {
    margin-right: 1.3rem;
}

.marginBmenos10px {
    margin-bottom: -10px;
}

.h-30 {
    height: 30%;
}

.h-70 {
    height: 70%;
}

.h-80 {
    height: 80%;
}

.h-85 {
    height: 85%;
}

.h-90 {
    height: 90%;
}


.h-98 {
    height: 98%;
}

.containerTarifas-h-700px-h-700px {
    height: 720px;
}


.w-20 {
    width: 20% !important;
}

.w-30 {
    width: 30%;
}

.w-35 {
    width: 35%;
}

.w-40 {
    width: 40%;
}

.w-49{
    width:49% !important;
    max-width:49% !important;
}

.w-87 {
    width: 87%;
}

.w-90 {
    width: 90%;
}

.w-95 {
    width: 95%;
}

.width-100 {
    width: 100%;
}

.w-70px {
    width: 70px;
}

.w-619px {
    max-width: 280px;
    width: 90%;
}

.maxHeight500px {
    max-height: 500px !important;
    height: 100%;
}

.overflow-y-auto {
    overflow-y: auto;
}

.maxHeight536px {
    max-height: 536px !important;
    height: 100%;
}

.fw-100 {
    font-weight: 100;
}

.fw-200 {
    font-weight: 200;
}

.fw-300 {
    font-weight: 300;
}

.fw-400 {
    font-weight: 400;
}

.fw-500 {
    font-weight: 500;
}

.fw-600 {
    font-weight: 600;
}

.fw-700 {
    font-weight: 700;
}

.fw-800 {
    font-weight: 800;
}

.fs-8px {
    font-size: 8px;
}

.fs-10px {
    font-size: 10px;
}

.fs-12px {
    font-size: 12px;
}

.fs-13px {
    font-size: 13px;
}

.fs-14px {
    font-size: 14px;
}

.fs-15px {
    font-size: 15px;
}

.fs-16px {
    font-size: 16px;
}

.fs-18px {
    font-size: 18px;
}

.fs-20px {
    font-size: 20px;
}

.fs-22px {
    font-size: 22px;
}

.fs-24px {
    font-size: 24px;
}

.fs-26px {
    font-size: 26px;
}

.fs-28px {
    font-size: 28px;
}

.fs-30px {
    font-size: 30px;
}

.fs-32px {
    font-size: 32px;
}

.fs-40px {
    font-size: 40px;
}

.fs-64px {
    font-size: 64px;
}

.border_25_0_25_25 {
    border-radius: 25px 0px 25px 25px;
}

.borderRadius_0_25_25_25 {
    border-radius: 0px 25px 25px 25px;
}

.borderRadius_10_10_0_0 {
    border-radius: 10px 10px 0px 0px;
}

.borderRadius_5_5_0_0 {
    border-radius: 5px 5px 0px 0px;
}

.borderRadius_0px {
    border-radius: 0px;
}


.borderRadius_5px {
    border-radius: 5px;
}

.borderRadius_10px {
    border-radius: 10px;
}

.borderRadius_15px {
    border-radius: 15px;
}

.borderRadius_25px {
    border-radius: 25px;
}

.height-85px {
    height: 85px;
}

.height-88px {
    height: 88px;
}

.height-85px-50px-md {
    height: 85px;
}

.height-88px-50px-md {
    height: 88px;
}

.max-w-70px {
    max-width: 70px;
}

.max-w-80px {
    max-width: 80px;
}

.max-w-135px {
    max-width: 135px;
}

.max-w-250px {
    max-width: 250px;
}

.w-300px {
    width: 300px;
}

.w-320px {
    width: 320px;
}

.w-350px {
    width: 350px;
}

.mt-10px {
    margin-top: -10px;
}

.mb-4px {
    margin-bottom: -4px !important;
}


.lineaPuntos {
    border-bottom: 2px dashed #AFAFAF;
    height: 20px;
    width: 55px;
}

.borderBottomSeleccioarHorarios {
    border-bottom: 5px solid #F0F0F0 !important;
}

.lineaRecta {
    box-shadow: 0 5px 0 0 #F0F0F0;
}

.lineaRecta3px {
    box-shadow: 0 3px 0 0 #F0F0F0;
}


.pe-80px {
    padding-right: 80px;
}



.navLinkMovil.active {
    text-decoration: none !important;
    text-decoration: none !important;
}

.opacity-86 {
    opacity: 86%;
}

.opacity-60 {
    opacity: 60%;
}

.text-decoration-none {
    text-decoration: none;
}



.cajaImagenPagoAceptado {
    position: absolute;
    top: 25%;
    left: 17%;
}

.lineHeight-1 {
    line-height: 1;
}


@media (max-width: 576px) {
    .textoTopSelect {
        font-family: Poppins;
        font-weight: 700;
        font-size: 12px !important;
        position: absolute !important;
        top: 10%;
        left: 2%;
        padding-left: 10px;
    }

    .btnMasMenos {
        height: 31px !important;
        width: 31px !important;
    }

    .btnSeleccionarTarifaModal > span {
        font-size: 12px;
    }

    .ModalHome {
        max-width: 95% !important;
    }

    .borderRadius5pxBottomMovil {
        border-radius: 0px 0px 5px 5px !important;
    }

    .buttonTarifas.active::before {
        border-radius: 5px !important;
        padding-left: 4px;
        padding-right: 4px;
        font-weight: 400;
        font-size: 9px !important;
        right: 5px !important;
    }

    .destacada .colorTarifaPrecio.fs-24px {
        font-size: 24px !important;
    }

    .ModalTarifa {
        max-width: 95% !important;
        margin: auto;
        min-width: 200px !important;
    }

    .w-95-movil {
        width: 95% !important;
        margin: auto;
    }

    .imagenDestacada.active.destacada {
        background-color: transparent;
    }

    .pb-movil-100px {
        padding-bottom: 100px !important;
    }

    .borderMovilFilaHorario {
        border-style: dashed !important;
        border-width: 1px !important;
        border-color: rgba(69, 107, 163, 1) !important;
    }

    .lineaRectaMovilNone {
        box-shadow: none !important;
    }

    .DatePickerPersonalizado .mud-picker-container .mud-button-label,
    .DatePickerRangoPersonalizado .mud-picker-container .mud-button-label {
        font-size: 1.25rem;
    }

    .linkContinuarModificar {
        width: 160px;
        font-size: 12px;
    }

        .linkContinuarModificar > .mud-button-label {
            width: 160px !important;
            font-size: 12px !important;
        }

    .divSelectPhone > div.iti.iti--allow-dropdown > input {
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
    }

    .w-45_movil {
        width: 45%;
    }

    .maxHeight500px {
        max-height: 600px !important;
        height: 100%;
    }

    .SelectorPersonalizado > div.mud-input-control-input-container > div.mud-input > .mud-input-slot,
    .SelectorPersonalizado > div.mud-input-control-input-container > div.mud-input > input::placeholder,
    .DatePickerPersonalizado .mud-input-slot.mud-input-root.mud-input-root-text.mud-input-root-adorned-end {
        font-size: 12px !important;
    }

    .SelectorPersonalizado p {
        font-size: 12px !important;
    }

    input.DatePickerRangoPersonalizado {
        font-size: 12px !important;
    }

    .height-85px-50px-md {
        height: 50px;
    }

    .height-88px-50px-md {
        height: 50px;
    }
}

/*Small devices (landscape phones, 576px and up) sm*/
@media (min-width: 576px) {
    .textoTopSelect {
        font-family: Poppins;
        font-weight: 700;
        font-size: 12px !important;
        position: absolute !important;
        top: 10%;
        left: 2%;
        padding-left: 10px;
    }

    .fs-12px-sm {
        font-size: 12px;
    }

    .fs-13px-sm {
        font-size: 13px;
    }

    .fs-15px-sm {
        font-size: 15px;
    }

    .fs-16px-sm {
        font-size: 16px;
    }

    /*
    .bgColorAzul-sm {
        background-color: var(--color-azul);
    }

    .bgColorAzulClaro-sm {
        background-color: var(--color-azul-claro);
    }

    .bgColorAzulOscuro-sm {
        background-color: var(--color-azul-oscuro);
    }

    .bgColorRojo-sm {
        background-color: var(--color-rojo) !important;
    }

    .bgColorGrisClaro-sm {
        background-color: var(--color-gris-claro);
    }

    .colorAzul-sm {
        color: var(--color-azul);
    }

    .colorAzulClaro-sm {
        color: var(--color-azul-claro);
    }

    .colorAzulOscuro-sm {
        color: var(--color-azul-oscuro);
    }

    .colorRojo-sm {
        color: var(--color-rojo);
    }
     */

    .w-md-100 {
        width: 100%;
    }

    .fs-sm-12px {
        font-size: 12px;
    }

    .fs-sm-14px {
        font-size: 14px;
    }

    .fs-sm-16px {
        font-size: 16px;
    }

    .fs-sm-18px {
        font-size: 18px;
    }

    .fs-sm-20px {
        font-size: 20px;
    }

    .fs-sm-22px {
        font-size: 22px;
    }

    .fs-sm-24px {
        font-size: 24px;
    }

    .fs-sm-26px {
        font-size: 26px;
    }

    .fs-sm-28px {
        font-size: 28px;
    }

    .fs-sm-30px {
        font-size: 30px;
    }

    .fs-sm-32px {
        font-size: 32px;
    }

    .fw-sm-100 {
        font-weight: 100;
    }

    .fw-sm-200 {
        font-weight: 200;
    }

    .fw-sm-300 {
        font-weight: 300;
    }

    .fw-sm-400 {
        font-weight: 400;
    }

    .fw-sm-500 {
        font-weight: 500;
    }

    .fw-sm-600 {
        font-weight: 600;
    }

    .fw-sm-700 {
        font-weight: 700;
    }

    .fw-sm-800 {
        font-weight: 800;
    }
}

/* Medium devices (tablets, 768px and up) md*/
@media (min-width: 768px) {
    .fs-15px-md {
        font-size: 15px;
    }

    .w-40-md {
        width: 40%;
    }

    .w-75-md {
        width: 75%;
    }

    /*
    .colorAzul-md {
        color: var(--color-azul);
    }

    .colorAzulClaro-md {
        color: var(--color-azul-claro);
    }

    .colorAzulOscuro-md {
        color: var(--color-azul-oscuro);
    }

    .colorRojo-md {
        color: var(--color-rojo);
    }


    .bgColorAzul-md {
        background-color: var(--color-azul);
    }

    .bgColorAzulClaro-md {
        background-color: var(--color-azul-claro);
    }

    .bgColorAzulOscuro-md {
        background-color: var(--color-azul-oscuro);
    }

    .bgColorRojo-md {
        background-color: var(--color-rojo) !important;
    }

    .bgColorGrisClaro-md {
        background-color: var(--color-gris-claro);
    }
        */
    .w-md-80 {
        width: 80%;
    }

    .fs-md-12px {
        font-size: 12px;
    }

    .fs-md-14px {
        font-size: 14px;
    }

    .fs-md-16px {
        font-size: 16px;
    }

    .fs-md-18px {
        font-size: 18px;
    }

    .fs-md-20px {
        font-size: 20px;
    }

    .fs-md-22px {
        font-size: 22px;
    }

    .fs-md-24px {
        font-size: 24px;
    }

    .fs-md-26px {
        font-size: 26px;
    }

    .fs-md-28px {
        font-size: 28px;
    }

    .fw-md-100 {
        font-weight: 100;
    }

    .fw-md-200 {
        font-weight: 200;
    }

    .fw-md-300 {
        font-weight: 300;
    }

    .fw-md-400 {
        font-weight: 400;
    }

    .fw-md-500 {
        font-weight: 500;
    }

    .fw-md-600 {
        font-weight: 600;
    }

    .fw-md-700 {
        font-weight: 700;
    }

    .fw-md-800 {
        font-weight: 800;
    }
}

/* Large devices (desktops, 992px and up) lg*/
@media (min-width: 992px) {
    .descripcionTarifa.tarifaDesplegada {
        height: 500px !important;
    }
    /*
    .colorAzul-lg {
        color: var(--color-azul);
    }

    .colorAzulClaro-lg {
        color: var(--color-azul-claro);
    }

    .colorAzulOscuro-lg {
        color: var(--color-azul-oscuro);
    }

    .colorRojo-lg {
        color: var(--color-rojo);
    }

    .bgColorAzul-lg {
        background-color: var(--color-azul);
    }

    .bgColorAzulClaro-lg {
        background-color: var(--color-azul-claro);
    }

    .bgColorAzulOscuro-lg {
        background-color: var(--color-azul-oscuro);
    }

    .bgColorRojo-lg {
        background-color: var(--color-rojo) !important;
    }

    .bgColorGrisClaro-lg {
        background-color: var(--color-gris-claro);
    }*/


    .fs-lg-12px {
        font-size: 12px;
    }

    .fs-lg-13px {
        font-size: 13px;
    }

    .fs-lg-14px {
        font-size: 14px;
    }

    .fs-lg-15px {
        font-size: 15px;
    }

    .fs-lg-16px {
        font-size: 16px;
    }

    .fs-lg-18px {
        font-size: 18px;
    }

    .fs-lg-20px {
        font-size: 20px;
    }

    .fs-lg-22px {
        font-size: 22px;
    }

    .fs-lg-24px {
        font-size: 24px;
    }

    .fs-lg-26px {
        font-size: 26px;
    }

    .fs-lg-28px {
        font-size: 28px;
    }

    .fs-lg-32px {
        font-size: 32px;
    }

    .fw-lg-100 {
        font-weight: 100;
    }

    .fw-lg-200 {
        font-weight: 200;
    }

    .fw-lg-300 {
        font-weight: 300;
    }

    .fw-lg-400 {
        font-weight: 400;
    }

    .fw-lg-500 {
        font-weight: 500;
    }

    .fw-lg-600 {
        font-weight: 600;
    }

    .fw-lg-700 {
        font-weight: 700;
    }

    .fw-lg-800 {
        font-weight: 800;
    }

    .boder-bottom-dashed-azul {
        border-bottom: none !important;
    }

    .boder-right-dashed-azul {
        border-right: dashed 2px var(--color-azul) !important;
    }
}

/* X-Large devices (large desktops, 1200px and up) xl*/
@media (min-width: 1200px) {
    .w-100-xl {
        width: 100% !important;
    }

    .borderRadius_5px-xl {
        border-radius: 5px;
    }

    .containerTarifas-h-700px-h-700px {
        height: 100%;
    }

    .divSelectPhone > div.iti.iti--allow-dropdown > input {
        background-color: rgba(237, 245, 252, 1);
        color: rgba(158, 158, 158, 1);
        font-family: 'Poppins', sans-serif;
        font-weight: 400;
        font-size: 16px !important;
        border-radius: 5px;
        border: none;
        padding-top: 0.5rem !important;
        padding-bottom: 0.5rem !important;
        padding-right: 1rem !important;
        padding-left: 3rem !important;
        width: 100%;
        text-align: initial;
    }

    .w-619px {
        max-width: 619px;
        width: 90%;
    }

    .h-100-xl {
        height: 100%;
    }

    .w-35-xl {
        width: 35%;
    }

    .pt-50px-movil {
        padding-top: 0;
    }

    .mt-menos-100-movil {
        margin-top: 0px;
    }

    .cajaImagenPagoAceptado-xl {
        position: absolute;
        top: 25%;
        left: 17%;
    }

    .borderRadius_0px-xl {
        border-radius: 0px;
    }

    .bgColorBlanco-xl {
        background-color: white;
    }

    .w-20-xl {
        width: 20%;
    }

    .w-30-xl {
        width: 30%;
    }

    .border_25_0_25_25-xl {
        border-radius: 25px 0px 25px 25px;
    }

    /*
    .colorAzul-xl {
        color: var(--color-azul);
    }

    .colorAzulClaro-xl {
        color: var(--color-azul-claro);
    }

    .colorAzulOscuro-xl {
        color: var(--color-azul-oscuro);
    }

    .colorRojo-xl {
        color: var(--color-rojo);
    }

    .bgColorAzul-xl {
        background-color: var(--color-azul);
    }

    .bgColorAzulClaro-xl {
        background-color: var(--color-azul-claro);
    }

    .bgColorAzulOscuro-xl {
        background-color: var(--color-azul-oscuro);
    }

    .bgColorRojo-xl {
        background-color: var(--color-rojo) !important;
    }

    .bgColorGrisClaro-xl {
        background-color: var(--color-gris-claro);
    }
        */
    .fs-xl-12px {
        font-size: 12px;
    }

    .fs-xl-14px {
        font-size: 14px;
    }

    .fs-xl-15px {
        font-size: 15px;
    }

    .fs-xl-16px {
        font-size: 16px;
    }

    .fs-xl-18px {
        font-size: 18px;
    }

    .fs-xl-20px {
        font-size: 20px;
    }

    .fs-xl-22px {
        font-size: 22px;
    }

    .fs-xl-24px {
        font-size: 24px;
    }

    .fs-xl-26px {
        font-size: 26px;
    }

    .fs-xl-28px {
        font-size: 28px;
    }

    .fs-xl-30px {
        font-size: 30px;
    }

    .fs-xl-32px {
        font-size: 32px;
    }

    .fs-xl-36px {
        font-size: 36px;
    }

    .fw-xl-100 {
        font-weight: 100;
    }

    .fw-xl-200 {
        font-weight: 200;
    }

    .fw-xl-300 {
        font-weight: 300;
    }

    .fw-xl-400 {
        font-weight: 400;
    }

    .fw-xl-500 {
        font-weight: 500;
    }

    .fw-xl-600 {
        font-weight: 600;
    }

    .fw-xl-700 {
        font-weight: 700;
    }

    .fw-xl-800 {
        font-weight: 800;
    }
}

/* XX-Large devices (larger desktops, 1400px and up) xxl*/
@media (min-width: 1400px) {
    .margin-right-xl-18rem {
        margin-right: 18rem !important;
    }

    .margin-left-100px-lg {
        margin-left: 120px;
    }

    .margin-left-200px-lg {
        margin-left: 300px;
    }

    .pt-100px-movil {
        padding-top: 0;
    }

    .mt-menos-166-movil {
        margin-top: 0px;
    }

    .mt-menos-150-movil {
        margin-top: 0px;
    }

    .cajaImagenPagoAceptado-xxl {
        position: absolute;
        top: 25%;
        left: 7%;
    }

    /*
    .color_185F93-xl {
        color: #185F93;
    }

    .color_AFAFAF-xl {
        color: #AFAFAF;
    }

    .colorAzul-xxl {
        color: var(--color-azul);
    }

    .colorAzulClaro-xxl {
        color: var(--color-azul-claro);
    }

    .colorAzulOscuro-xxl {
        color: var(--color-azul-oscuro);
    }

    .colorRojo-xxl {
        color: var(--color-rojo);
    }

    .bgColorAzul-xxl {
        background-color: var(--color-azul);
    }

    .bgColorAzulClaro-xxl {
        background-color: var(--color-azul-claro);
    }

    .bgColorAzulOscuro-xxl {
        background-color: var(--color-azul-oscuro);
    }

    .bgColorRojo-xxl {
        background-color: var(--color-rojo) !important;
    }

    .bgColorGrisClaro-xxl {
        background-color: var(--color-gris-claro);
    }
        */
    .fw-xxl-100 {
        font-weight: 100;
    }

    .fw-xxl-200 {
        font-weight: 200;
    }

    .fw-xxl-300 {
        font-weight: 300;
    }

    .fw-xxl-400 {
        font-weight: 400;
    }

    .fw-xxl-500 {
        font-weight: 500;
    }

    .fw-xxl-600 {
        font-weight: 600;
    }

    .fw-xxl-700 {
        font-weight: 700;
    }

    .fw-xxl-800 {
        font-weight: 800;
    }

    .fs-xxl-10px {
        font-size: 10px;
    }

    .fs-xxl-12px {
        font-size: 12px;
    }

    .fs-xxl-13px {
        font-size: 13px;
    }

    .fs-xxl-14px {
        font-size: 14px;
    }

    .fs-xxl-15px {
        font-size: 15px;
    }

    .fs-xxl-16px {
        font-size: 16px;
    }

    .fs-xxl-18px {
        font-size: 18px;
    }

    .fs-xxl-20px {
        font-size: 20px;
    }

    .fs-xxl-22px {
        font-size: 22px;
    }

    .fs-xxl-24px {
        font-size: 24px;
    }

    .fs-xxl-26px {
        font-size: 26px;
    }

    .fs-xxl-28px {
        font-size: 28px;
    }

    .fs-xxl-30px {
        font-size: 30px;
    }

    .fs-xxl-32px {
        font-size: 32px;
    }

    .fs-xxl-36px {
        font-size: 36px;
    }

    .fs-xxl-38px {
        font-size: 38px;
    }

    .fs-xxl-40px {
        font-size: 40px;
    }

    .w-xxl-50 {
        width: 50%;
    }
}


@media (min-width: 1700px) {
    .d-xxxl-none {
        display: none !important;
    }

    .d-xxxl-block {
        display: block !important;
    }

    .w-xxxl-50 {
        width: 50%;
    }

    .w-xxxl-60 {
        width: 60%;
    }

    .cajaImagenPagoAceptado-xxl {
        position: absolute;
        top: 25%;
        left: 16%;
    }

    .fs-xxxl-10px {
        font-size: 10px;
    }

    .fs-xxxl-12px {
        font-size: 12px;
    }

    .fs-xxxl-13px {
        font-size: 13px;
    }

    .fs-xxxl-14px {
        font-size: 14px;
    }

    .fs-xxxl-15px {
        font-size: 15px;
    }

    .fs-xxxl-16px {
        font-size: 16px;
    }

    .fs-xxxl-18px {
        font-size: 18px !important;
    }

    .fs-xxxl-20px {
        font-size: 20px;
    }

    .fs-xxxl-22px {
        font-size: 22px;
    }

    .fs-xxxl-24px {
        font-size: 24px;
    }

    .fs-xxxl-26px {
        font-size: 26px;
    }

    .fs-xxxl-28px {
        font-size: 28px;
    }

    .fs-xxxl-30px {
        font-size: 30px;
    }

    .fs-xxxl-32px {
        font-size: 32px;
    }

    .fs-xxxl-36px {
        font-size: 36px;
    }

    .fs-xxxl-38px {
        font-size: 38px;
    }

    .fs-xxxl-40px {
        font-size: 40px;
    }

    .fs-xxxl-64px {
        font-size: 64px;
    }

    .ps-xxxl-4 {
        padding-left: 1.5rem !important;
    }
}

/*SELECTORES PERSONALIZADOS*/

/*
    .SelectorPersonalizado
    .DatePickerPersonalizado
    .DatePickerRangoPersonalizado
*/


.containerMudExpansionPanelPersonalizado svg {
    margin-top: -17px !important;
}

.DatePickerRangoPersonalizado svg, .DatePickerPersonalizado svg {
    margin-bottom: -3px !important;
}

.SelectorPersonalizado > div.mud-input-control-input-container > div.mud-input,
.DatePickerPersonalizado .mud-input.mud-input-text {
    margin-top: 0 !important;
}

.SelectorPersonalizado p {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    color: var(--color-azul) !important;
}


.SelectorPersonalizado.mud-input-control > .mud-input-control-input-container,
.DatePickerPersonalizado .mud-input-control .mud-input-control-input-container,
.DatePickerRangoPersonalizado .mud-input-control .mud-input-control-input-container {
    padding: 0 10px;
}

.SelectorPersonalizado label, .DatePickerPersonalizado label {
    color: #AFAFAF !important;
    font-family: Poppins !important;
    font-weight: 600 !important;
    padding: 0 10px !important;
}

.SelectorPersonalizado > div.mud-input-control-input-container > div.mud-input > .mud-input-slot,
.SelectorPersonalizado > div.mud-input-control-input-container > div.mud-input > input::placeholder,
.DatePickerPersonalizado .mud-input-slot.mud-input-root.mud-input-root-text.mud-input-root-adorned-end {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    font-weight: 700 !important;
    color: var(--color-azul) !important;
    margin-top: 8px;
    opacity: 1;
}

.DatePickerPersonalizado input::placeholder, .DatePickerRangoPersonalizado::placeholder {
    opacity: 1 !important;
}


.DatePickerPersonalizado > .mud-input-control,
.DatePickerRangoPersonalizado > .mud-input-control {
    margin-top: 0 !important;
}

input.DatePickerRangoPersonalizado {
    font-family: 'Poppins', sans-serif !important;
    font-size: 16px;
    font-weight: 700 !important;
    color: var(--color-azul) !important;
    padding: 6px 0px 7px 0px !important;
}

.DatePickerRangoPersonalizado label {
    color: #AFAFAF !important;
    font-family: Poppins !important;
    font-weight: 600 !important;
    padding: 0 10px !important;
    transform: translate(0, 1.5px) scale(0.75);
    transform-origin: top left;
}

.DatePickerRangoPersonalizado::before,
.DatePickerRangoPersonalizado::after {
    border-bottom: none !important;
}

.DatePickerRangoPersonalizado.mud-input.mud-input-text {
    padding: 0 !important;
}

.DatePickerRangoPersonalizado.mud-input-slot.mud-input-root,
.DatePickerRangoPersonalizado .mud-range-input-separator {
    margin-top: 8px !important;
}

.containerMudExpansionPanelPersonalizado > .mud-expansion-panels > .mud-expand-panel > .mud-expand-panel-header {
    padding: 13px 8px 3px 10px !important;
}

.btnMasMenos {
    height: 25px;
    width: 25px;
}

.inputNumberPasajeros {
    -moz-appearance: textfield;
    appearance: textfield;
    border: 2px solid var(--color-azul);
}

    .inputNumberPasajeros::-webkit-inner-spin-button, .inputNumberPasajeros::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .inputNumberPasajeros:focus-visible {
        border: 2px solid var(--color-azul) !important;
    }




@keyframes rotate {
    from {
        transform: rotateY(-45deg);
    }

    to {
        transform: rotateY(45deg);
    }
}

.rotateClass {
    animation: rotate 3s linear forwards; /* Puedes ajustar la duración y el tipo de animación según tus preferencias */
    transform-style: preserve-3d;
}

.border_top_right_left_2px {
    border: 3px solid var(--color-azul-oscuro) !important;
    border-bottom: 0px !important;
}


.placeholderGris::placeholder {
    color: rgba(158, 158, 158, 1) !important;
}

.mH_0 {
    max-height: 0
}

.mH_100 {
    max-height: 100%;
}

div.ModalCargando > div.mud-dialog-title {
    padding: 0;
    padding-top: 12px;
}


.borderTop1pxWhite {
    border-top: 1px solid white;
}

.borderLeft1pxWhite {
    border-left: 1px solid white;
}



.mud-picker-datepicker-toolbar.mud-button-date {
    font-size: 1.125rem !important;
}


@keyframes rotar {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(180deg);
    }
}

@keyframes aparecer {
    0% {
        background-color: var(--color-rojo);
    }

    100% {
        background-color: var(--color-azul-oscuro);
    }
}

@keyframes desplazar {
    0% {
        transform: translateY(0%);
    }

    50% {
        transform: translateY(-3%);
    }

    100% {
        transform: translateY(0%);
    }
}

.cambioPosicion {
    transform: translateY(0%);
    animation: desplazar 0.5s ease forwards;
}

/*
.cambioOpacidad {
    background-color: var(--color-azul-oscuro);
    animation: aparecer 1.5s ease forwards;
}
    */
/*
.cambioOpacidad {
    background-color: var(--color-rojo);
    -webkit-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}
    */
.posicionarFinal {
    position: absolute !important;
    bottom: 15%;
    left: 0;
    right: 0;
    margin: auto;
}


.divSelectPhone > div.iti.iti--allow-dropdown > input {
    background-color: rgba(237, 245, 252, 1);
    color: rgba(158, 158, 158, 1);
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 14px;
    border-radius: 5px;
    border: none;
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
    padding-right: 1rem !important;
    padding-left: 3rem !important;
    width: 100%;
    text-align: initial;
}


.validation-message {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 400 !important;
}

.marginTop_0_75_rem {
    margin-top: 0.75rem;
}

.mb-menos-2 {
    margin-bottom: -1rem;
}

.iconPlay.slider-visible {
    animation: rotar 1s ease forwards;
}

.onHoverbgColorAzul :hover {
    background-color: var(--color-azul) !important;
}

.modalTarifa .mud-dialog-title {
    padding: 10px 10px !important;
}




.MudTabSeleccionarHorarios div.mud-tab{
    min-height:35px !important;
}
.MudTabSeleccionarHorarios .mud-tabs-toolbar .mud-tabs-toolbar-inner {
    min-height: 35px !important;
}
.MudTabSeleccionarHorarios .mud-tab-slider.mud-tab-slider-horizontal {
    display: none;
}

.MudTabSeleccionarHorarios > div.mud-tabs-toolbar, .MudTabSeleccionarHorarios > div.mud-tabs-toolbar > div.mud-tabs-toolbar-inner {
    max-width: 100%;
}




/*CONTAINER TARIFAS*/
.containerTarifa {
    height: 80%;
}

    .destacada .colorTarifaPrecio.fs-24px {
        font-size: 36px;
    }

.filaTarifa {
    width: 90%;
    margin: auto;
    height: 2px;
}

.descripcionTarifa.tarifaDesplegada {
    height: 400px;
}

.descripcionTarifa {
    height: 100px;
    /*overflow-y: auto;*/
    overflow: -moz-scrollbars-none; /* Firefox */
    -ms-overflow-style: none; /* Internet Explorer y Edge */
    scrollbar-width: none; /* Firefox 64+ */
}

    .descripcionTarifa::-webkit-scrollbar {
        display: none; /* Oculta la barra de desplazamiento */
    }




.linkContinuarModificar {
    width: 270px;
    text-align: center;
}

   

.py-075rem {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}


.SelectorHorariosMovil > .mud-input-control-input-container {
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
    background-color: rgba(233, 242, 255, 1);
    padding-bottom: 5px;
    padding-top: 5px;
    border-radius: 5px;
}

    .SelectorHorariosMovil > .mud-input-control-input-container > label {
        position: relative;
        transform: none !important;
        padding-right: 16px !important;
    }



    .SelectorHorariosMovil > .mud-input-control-input-container > .mud-input > .mud-input-slot, .SelectorHorariosMovil > .mud-input-control-input-container > label {
        font-size: 16px !important;
        font-weight: 500 !important;
        color: rgba(24, 95, 147, 1) !important;
        font-family: "Montserrat Alternates", sans-serif !important;
    }

.MudTabSeleccionarHorarios .mud-tab.mud-ripple {
    font-size: 16px;
}
@media (max-width: 1350px) {
    .MudTabSeleccionarHorarios .mud-tab.mud-ripple{
        font-size:12px !important;
        min-width:120px !important;
    }
}


    .SelectorHorariosMovil .mud-input.mud-input-text.mud-input-adorned-end.mud-shrink.mud-select-input {
        margin-top: 0 !important;
    }

    .ModalTarifa {
        margin: auto;
        min-width: 600px;
        max-width: 1000px;
    }

        .ModalTarifa .mud-dialog-content {
            padding: 0 !important;
        }

    .filaTarifaModal {
        width: 90%;
        margin: auto;
        height: 2px;
    }

    .buttonTarifas.active::before {
        content: "Seleccionada";
        position: absolute;
        top: 0;
        transform: translateY(-50%);
        right: 10px;
        z-index: 20;
        border-radius: 5px;
        padding-left: 4px;
        padding-right: 4px;
        font-weight: 400;
        font-size: 14px;
        text-transform: none;
    }

    .borderRadius_5_0_5_5 {
        border-radius: 5px 0px 5px 5px;
    }

    .ModalTarifa > .mud-dialog-title, .ModalHome > .mud-dialog-title {
        padding: 0 !important;
    }

    .ModalHome {
        max-width: 100%;
        padding-right: 2em;
        padding-left: 2em;
    }

    .btnModalHome > span {
        font-size: 16px;
    }

    .cursor-not-allowed {
        cursor: not-allowed;
    }

    .cursor-auto {
        cursor: auto;
    }





   

    .ModalReservaAnterior {
        width: 100% !important;
        max-width: 900px !important;
    }

        .ModalReservaAnterior > div {
            width: 100% !important;
            max-height: 100% !important;
        }

    @media (max-width: 900px) {
        .ModalReservaAnterior {
            height: 100% !important;
            width: 95% !important;
            margin: auto;
        }
    }

    .ExpansionPanelContenedorCompraModificada > .mud-expand-panel-header {
        min-height: 25px;
        padding: 6px 16px;
    }


    .tachado {
        text-decoration: line-through;
    }

    .imagenFiltroGris {
        -webkit-filter: grayscale(100%); /* Safari 6.0 - 9.0 */
        filter: grayscale(100%);
    }



    .boder-bottom-dashed-azul {
        border-bottom: dashed 2px var(--color-azul);
    }

    .boder-right-dashed-azul {
        border-right: none;
    }