/* ==========================================================================
   Estilos para slider de la home
   ========================================================================== */


/*
   Slider promociones
   ========================================================================== */

.promo-slider .owl-item {
    width: 100%;
}


/*owl carousel item*/

.oc-item {
    display: block;
    text-decoration: none;
}

.oc-item img {
    display: block;
    max-width: 100%;
    width: 100%;
    height: auto;
}


/*
   Precios Slider
   ========================================================================== */


/*Clase base para los precios*/

.oc-precio {
    text-align: center;
    font-weight: var(--fw-bold);
    line-height: 1;
    text-decoration: none;
    display: block;
    z-index: 100;
    position: absolute;
}

#precio-veranoisla {
    color: #fff;
    font-size: 0.5em;
    top: 64%;
    right: 8%;
}

#precio-veranocaribe {
    color: #fff;
    font-size: 0.5em;
    top: 80%;
    right: 5%;
}

#precio-inviernocaribe {
    color: #fff;
    font-size: 0.5em;
    top: 80%;
    right: 5%;
}

#precio-navidadcaribe {
    color: #fff;
    font-size: 0.5em;
    top: 80%;
    right: 5%;
}

#precio-sliderRomaCaribe {
    color: #fff;
    font-size: 0.5em;
    top: 90%;
    right: 40%;
}


/*Version Movil*/

.especial-cruceros-movil #precio-veranoisla-movil {
    font-size: 14px;
    color: #0085C4;
    position: absolute;
    right: 8%;
}

.especial-cruceros-movil #precio-veranoisla:nth-of-type(2) {
    top: 63%;
}

.especial-cruceros-movil #precio-veranoisla:nth-of-type(3) {
    top: 83%;
}

.especial-cruceros-movil #precio-veranocaribe-movil {
    font-size: 11px;
    color: #fff;
    position: absolute;
    right: 5%;
}

.especial-cruceros-movil #precio-veranocaribe-movil:nth-of-type(3) {
    top: 80%;
}

.especial-cruceros-movil #precio-inviernocaribe {
    font-size: 11px;
    color: #fff;
    position: absolute;
    right: 6%;
}

.especial-cruceros-movil #precio-inviernocaribe:nth-of-type(3) {
    top: 80%;
}

.especial-cruceros-movil #precio-navidadcaribe {
    font-size: 11px;
    color: #fff;
    position: absolute;
    right: 6%;
}

.especial-cruceros-movil #precio-navidadcaribe:nth-of-type(3) {
    top: 80%;
}

.especial-cruceros-movil #precio-sliderRomaCaribe {
    font-size: 11px;
    color: #fff;
    position: absolute;
    right: 40%;
}

.especial-cruceros-movil #precio-sliderRomaCaribe:nth-of-type(3) {
    top: 90%;
}


/*Fin slider movil*/

.oc-precio small {
    font-weight: var(--fw-lite);
    display: block;
}

#precio-1,
#precio-2 {
    top: 25%;
    right: 25%;
    display: none;
}

.chat-online {
    position: fixed;
    bottom: 15px;
    z-index: 1000;
    right: 97px;
    font-size: 25px;
    font-weight: bold;
    color: #505050;
    display: none;
}

#clgo #chatIframe {
    bottom: 55px !important;
}


/* Small devices (landscape phones, 576px and up) */

@media (min-width: 576px) {
    #clgo #chatIframe {
        bottom: 0px !important;
    }
}


/* Medium devices (tablets, 768px and up) */

@media (min-width: 768px) {
    .especial-cruceros #precio-veranoisla {
        position: absolute;
        right: 8%;
        font-size: 24px;
        color: #0085C4
    }
    .especial-cruceros #precio-veranoisla:nth-of-type(2) {
        top: 63%;
    }
    .especial-cruceros #precio-veranoisla:nth-of-type(3) {
        top: 83%;
    }
    .especial-cruceros #precio-veranocaribe {
        position: absolute;
        right: 5%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-caribe:nth-of-type(3) {
        top: 80%;
    }
    .especial-cruceros #precio-inviernocaribe {
        position: absolute;
        right: 5%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-inviernocaribe:nth-of-type(3) {
        top: 80%;
    }
    .especial-cruceros #precio-navidadcaribe {
        position: absolute;
        right: 5%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-navidadcaribe:nth-of-type(3) {
        top: 80%;
    }
    .especial-cruceros #precio-sliderRomaCaribe {
        position: absolute;
        right: 40%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-sliderRomaCaribe:nth-of-type(3) {
        top: 90%;
    }
}


/* Extra large devices (large desktops, 1200px and up) */

@media (min-width: 1000px) {
    .chat-online {
        right: 0;
        left: 94px;
        bottom: 8px;
    }
    .especial-cruceros #precio-veranoisla {
        right: 8%;
        font-size: 35px;
        color: #0085C4
    }
    .especial-cruceros #precio-veranoisla:nth-of-type(2) {
        top: 63%;
    }
    .especial-cruceros #precio-veranoisla:nth-of-type(3) {
        top: 83%;
    }
    .especial-cruceros #precio-caribe {
        right: 5%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-caribe:nth-of-type(3) {
        top: 80%;
    }
    .especial-cruceros #precio-inviernocaribe {
        right: 4%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-inviernocaribe:nth-of-type(3) {
        top: 80%;
    }
    .especial-cruceros #precio-navidadcaribe {
        right: 4%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-navidadcaribe:nth-of-type(3) {
        top: 80%;
    }
    .especial-cruceros #precio-sliderRomaCaribe {
        right: 40%;
        font-size: 35px;
        color: #fff
    }
    .especial-cruceros #precio-sliderRomaCaribe:nth-of-type(3) {
        top: 90%;
    }
}

#colecaribe {
    position: absolute;
    bottom: 13%;
    left: 46%;
    color: #d5ecfb;
    font-size: 2.3rem;
}

#colecaribe-movil {
    position: absolute;
    bottom: 10%;
    left: 18%;
    color: #d5ecfb;
}

.display-hide {
    display: none;
}


/*----------------Iconos del buscador---------------------------*/

.logoBuscador {
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.logoHotel {
    background-image: url(../img/ico/hotel.svg);
}

.logoHotel:hover {
    background-image: url(../img/ico/hotelBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.buscador__tab:hover .logoHotel {
    background-image: url(../img/ico/hotelBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

#bhtab2.isSelected .logoHotel {
    background-image: url(../img/ico/hotelBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.buscador__tab:hover {
    background-color: #f7800c;
    color: white;
}

.buscador__tab.isSelected {
    background-color: #f7800c;
    color: white;
}

.logoPaquete {
    background-image: url(../img/ico/paquete.svg);
}

.buscador__tab:hover .logoPaquete {
    background-image: url(../img/ico/paqueteBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

#bhtab1.isSelected .logoPaquete {
    background-image: url(../img/ico/paqueteBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.logoVuelo {
    background-image: url(../img/ico/plane.svg);
}

.buscador__tab:hover .logoVuelo {
    background-image: url(../img/ico/planeBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

#bhtab3.isSelected .logoVuelo {
    background-image: url(../img/ico/planeBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.logoCosta {
    background-image: url(../img/ico/costa.svg);
}

.buscador__tab:hover .logoCosta {
    background-image: url(../img/ico/costaBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

#bhtab4.isSelected .logoCosta {
    background-image: url(../img/ico/costaBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

.logovueloHotel {
    background-image: url(../img/ico/vueloHotel.svg);
}

.buscador__tab:hover .logovueloHotel {
    background-image: url(../img/ico/vueloHotelBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}

#bhtab5.isSelected .logovueloHotel {
    background-image: url(../img/ico/vueloHotelBlanco.svg);
    width: 30px;
    height: 30px;
    background-repeat: no-repeat;
    margin: 0 auto;
}