html {
    font-size: 14px;
}

:root {
    --tl-yellow: #ffc845;
    --tl-yellow-10: #e6b43e;
    --tl-yellow-15: #d9aa3b;
    --tl-yellow-20: #cca037;
    --tl-yellow-25: #bf9634;
    --tl-yellow-rgb: 255,200,69;
    --tl-red: #ed362e;
    --tl-red-10: #d53129;
    --tl-red-15: #c92e27;
    --tl-red-20: #be2b25;
    --tl-red-25: #b22923;
    --tl-red-rgb: 237,56,46;
    --tl-blue: #3098cd;
    --tl-blue-10: #2b89b9;
    --tl-blue-15: #2981ae;
    --tl-blue-20: #267aa4;
    --tl-blue-25: #24729a;
    --tl-blue-rgb: 48,152,205;
    --main-color: #ff4c4b;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

body {
    font-family: Lato, sans-serif;
}

.text-tl-blue {
    color: var(--tl-blue) !important;
}

.text-tl-red {
    color: var(--tl-red) !important;
}

.text-tl-yellow {
    color: var(--tl-yellow) !important;
}

.text-pre-line {
    white-space: pre-line !important;
}

.aspect-ratio-16x9 {
    aspect-ratio: 16/9 !important;
}

.object-fit-cover {
    object-fit: cover !important;
}

@media (min-width: 576px) {
    .border-sm-start {
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }

    .border-sm-start-0 {
        border-left: 0 !important;
    }
}

@media (min-width: 768px) {
    .border-md-start {
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }

    .border-md-start-0 {
        border-left: 0 !important;
    }
}

@media (min-width: 992px) {
    .border-lg-start {
        border-left: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
    }

    .border-lg-start-0 {
        border-left: 0 !important;
    }
}

.btn-tl-red {
    --bs-btn-color: white;
    --bs-btn-bg: var(--tl-red);
    --bs-btn-border-color: var(--tl-red);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--tl-red-15);
    --bs-btn-hover-border-color: var(--tl-red-20);
    --bs-btn-focus-shadow-rgb: var(--tl-red-rgb);
    --bs-btn-active-color: var(--bs-btn-hover-color);
    --bs-btn-active-bg: var(--tl-red-20);
    --bs-btn-active-border-color: var(--tl-red-25);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: white;
    --bs-btn-disabled-bg: var(--tl-red);
    --bs-btn-disabled-border-color: var(--tl-red);
}

.btn-outline-tl-red {
    --bs-btn-color: var(--tl-red);
    --bs-btn-border-color: var(--tl-red);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--tl-red);
    --bs-btn-hover-border-color: var(--tl-red);
    --bs-btn-focus-shadow-rgb: var(--tl-red-rgb);
    --bs-btn-active-color: white;
    --bs-btn-active-bg: var(--tl-red);
    --bs-btn-active-border-color: var(--tl-red);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--tl-red);
    --bs-disabled-bg: transparent;
    --bs-gradient: none;
}

.btn-tl-blue {
    --bs-btn-color: white;
    --bs-btn-bg: var(--tl-blue);
    --bs-btn-border-color: var(--tl-blue);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--tl-blue-15);
    --bs-btn-hover-border-color: var(--tl-blue-20);
    --bs-btn-focus-shadow-rgb: var(--tl-blue-rgb);
    --bs-btn-active-color: var(--bs-btn-hover-color);
    --bs-btn-active-bg: var(--tl-blue-20);
    --bs-btn-active-border-color: var(--tl-blue-25);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: white;
    --bs-btn-disabled-bg: var(--tl-blue);
    --bs-btn-disabled-border-color: var(--tl-blue);
}

.btn-outline-tl-blue {
    --bs-btn-color: var(--tl-blue);
    --bs-btn-border-color: var(--tl-blue);
    --bs-btn-hover-color: white;
    --bs-btn-hover-bg: var(--tl-blue);
    --bs-btn-hover-border-color: var(--tl-blue);
    --bs-btn-focus-shadow-rgb: var(--tl-blue-rgb);
    --bs-btn-active-color: white;
    --bs-btn-active-bg: var(--tl-blue);
    --bs-btn-active-border-color: var(--tl-blue);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--tl-blue);
    --bs-disabled-bg: transparent;
    --bs-gradient: none;
}

.rating-stars {
    --percent: calc(var(--rating) / 5 * 100%);
    display: inline-flex;
    align-items: center;
    flex-wrap: nowrap;
    column-gap: .3rem;
    font-size: 1.5rem;
    line-height: 1;
}

    .rating-stars::before {
        content: '\2605\2605\2605\2605\2605';
        background: linear-gradient(90deg, gold var(--percent), lightgray var(--percent));
        background-clip: text;
        -webkit-background-clip: text;
        color: transparent;
    }

img.lazy.lqip {
    filter: blur(10px);
    opacity: 0.8;
}

img.initial.lqip,
img.loaded.lqip,
img.error.lqip {
    filter: blur(0);
    opacity: 1;
    transition: all 0.8s ease;
}

img.lazy:not([src]) {
    visibility: hidden;
}

/***** LAYOUT STYLES *****/

.navbar-brand img {
    width: 190px;
    height: auto;
}

@media (min-width: 768px) {
    .navbar-brand img {
        width: 220px;
        height: auto;
    }
}

.logo-tour {
    color: var(--tl-red);
}

.logo-per {
    color: var(--tl-yellow);
}

.logo-me {
    color: var(--tl-blue);
}

#scroll-target {
    position: absolute;
    width: 1px;
    height: 1px;
    top: 500px;
    left: 0;
}

#scroll-btn-div {
    position: sticky;
    bottom: 10vh;
    z-index: 9999;
}

#scroll-to-top-btn {
    background-color: var(--main-color);
    border: none;
    border-radius: 100%;
    cursor: pointer;
    width: 50px;
    height: 50px;
    position: absolute;
    right: 2rem;
    bottom: -25px; /* half-height */
    opacity: 0;
    transform: translateY(150px);
    transition: all .5s ease;
}

    #scroll-to-top-btn.show-scroll-btn {
        opacity: 1;
        transform: translateY(0);
    }

#secondary-background .blockquote {
    font-size: 2.5rem;
    color: white;
    font-weight: bold;
    text-shadow: 1px 1px 6px black;
}

#secondary-background .blockquote-footer {
    font-size: 2.5rem;
    color: white;
}

.footer-brand-logo img {
    width: 50%;
    height: auto;
}

@media (min-width: 992px) {
    .footer-brand-logo img {
        width: 100%;
        height: auto;
    }
}

.social-link {
    color: black;
    font-size: 20px;
    transition: all 1s ease;
    -webkit-transition: all 1s ease;
}

    .social-link:hover {
        color: var(--main-color);
        transition: all 0.2s ease;
        -webkit-transition: all 0.2s ease;
    }

.payment-row img {
    width: 55px;
    height: auto;
}

.footer-link:hover {
    color: #fff;
    text-decoration-color: #fff0;
    transition: all 0.2s ease;
    -webkit-transition: all 0.2s ease;
}

.destinations-menu {
    column-count: 2;
}

@media (min-width: 992px) {
    .destinations-menu.destinations-menu-es {
        column-count: 2;
    }

    .destinations-menu {
        column-count: 3;
    }
}

/***** LAYOUT END *****/


/***** HOMEPAGE STYLES *****/
/*
#search-container {
    background-image: url("/img/home/main-background.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-color: #83e5e2;
}

    #search-container > .container {
        min-height: 50vh;
    }

        #search-container > .container > div:first-child,
        #search-container > .container > div:last-child {
            flex: 1 1 0;
        }
*/

.carousel-search-container {
    background-image: url("/img/home/main-background-es-1.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-color: #83e5e2;
}

.carousel-background {
    position: absolute;
}

    .carousel-background img {
        height: 50vh;
        min-height: 350px;
        max-height: 500px;
        object-fit: cover;
        object-position: center;
    }

.search-container.container {
    height: 50vh;
    min-height: 350px;
    max-height: 500px;
}

    .search-container.container > div:first-child,
    .search-container.container > div:last-child {
        flex: 1 1 0;
    }

#main-header {
    font-weight: bold;
    color: white;
    text-shadow: 2px 2px 10px black;
}

.section-title {
    display: block;
    position: relative;
    padding-bottom: 10px;
    text-align: center;
    text-transform: uppercase;
    font-weight: bold;
}

    .section-title:after {
        position: absolute;
        background-color: var(--tl-red);
        content: "";
        width: 70px;
        height: 5px;
        left: 0;
        right: 0;
        bottom: 0;
        margin: 0 auto;
        margin-bottom: 5px;
    }

    .section-title img {
        width: 220px;
        height: auto;
    }

.featured-destinations .card-title {
    font-size: 45px;
    color: white;
    font-weight: bold;
    text-shadow: 1px 1px 6px black;
}

.featured-destinations .list-group-item i {
    color: var(--tl-red);
}

.featured-destinations .list-group-item a {
    text-decoration: none;
}

.featured-destinations .card-link {
    position: relative;
}

#secondary-background {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    background-color: #83e5e2;
}

    #secondary-background > .container {
        min-height: 350px;
    }

/***** HOMEPAGE END *****/


/***** SEARCH-FORM STYLES *****/

form.search-form input.form-control:focus,
form.search-form .focus .ts-control {
    border-color: #ced4da;
    box-shadow: none !important;
}

.ts-wrapper.is-invalid.single,
.was-validated .invalid.single,
.was-validated :invalid + .ts-wrapper.single {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545'%3E%3Ccircle cx='6' cy='6' r='4.5'/%3E%3Cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3E%3Ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3E%3C/svg%3E");
    background-position: right .75rem center;
    background-repeat: no-repeat;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
    border-color: #ced4da;
}

.cursor-pointer,
.cursor-pointer input {
    cursor: pointer;
}

form.search-form .btn-clear-input {
    --bs-btn-color: black;
    --bs-btn-bg: white;
    --bs-btn-border-radius: 0;
    --bs-btn-hover-color: #495057;
    --bs-btn-hover-bg: white;
}

#search-button {
    background-color: var(--tl-red);
    border-color: var(--tl-red);
}

/***** SEARCH-FORM END *****/


/***** DESTINATIONS SYLES *****/

.destination-header {
    background-image: url(/img/products/header-bg/capri.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center 7%;
    background-color: #83e5e2;
}

    .destination-header > .container {
        height: 50vh;
        min-height: 350px;
        max-height: 500px;
    }

.destination-header-1 {
    background-image: url(/img/destinations/albania.webp);
    background-position: center;
}

.destination-header-12 {
    background-image: url(/img/destinations/capri.webp);
    background-position: center 55%;
}

.destination-header-13 {
    background-image: url(/img/destinations/corsica.webp);
    background-position: center 55%;
}

.destination-header-15 {
    background-image: url(/img/destinations/amalfi-coast.webp);
    background-position: center;
}

.destination-header-20 {
    background-image: url(/img/destinations/crete.webp);
    background-position: center 80%;
}

.destination-header-26 {
    background-image: url(/img/destinations/croatia.webp);
    background-position: center 70%;
}

.destination-header-48 {
    background-image: url(/img/destinations/elba.webp);
    background-position: center 60%;
}

.destination-header-49 {
    background-image: url(/img/destinations/ischia.webp);
    background-position: center 70%;
}

.destination-header-52 {
    background-image: url(/img/destinations/fuerteventura.webp);
    background-position: center 70%;
}

.destination-header-53 {
    background-image: url(/img/destinations/la-gomera.webp);
    background-position: center;
}

.destination-header-54 {
    background-image: url(/img/destinations/gran-canaria.webp);
    background-position: center 100%;
}

.destination-header-56 {
    background-image: url(/img/destinations/lanzarote.webp);
    background-position: center 30%;
}

.destination-header-57 {
    background-image: url(/img/destinations/la-palma.webp);
    background-position: center;
}

.destination-header-60 {
    background-image: url(/img/destinations/tenerife.webp);
    background-position: center 60%;
}

.destination-header-64 {
    background-image: url(/img/destinations/malta.webp);
    background-position: center;
}

.destination-header-65 {
    background-image: url(/img/destinations/gozo.webp);
    background-position: center 35%;
}

.destination-header-73 {
    background-image: url(/img/destinations/aegadian-islands.webp);
    background-position: center 65%;
}

.destination-header-74 {
    background-image: url(/img/destinations/pelagie-islands.webp);
    background-position: center 20%;
}

.destination-header-75 {
    background-image: url(/img/destinations/tremiti-islands.webp);
    background-position: center 65%;
}

.destination-header-77 {
    background-image: url(/img/destinations/ponza.webp);
    background-position: center 60%;
}

.destination-header-78 {
    background-image: url(/img/destinations/procida.webp);
    background-position: center 25%;
}

.destination-header-79 {
    background-image: url(/img/destinations/sardinia.webp);
    background-position: center 35%;
}

.destination-header-85 {
    background-image: url(/img/destinations/sicily.webp);
    background-position: center 70%;
}

.destination-header-89 {
    background-image: url(/img/destinations/aeolian-islands.webp);
    background-position: center 80%;
}

.destination-header-100 {
    background-image: url(/img/destinations/formentera.webp);
    background-position: center 80%;
}

.destination-header-101 {
    background-image: url(/img/destinations/ibiza.webp);
    background-position: center;
}

.destination-header-103 {
    background-image: url(/img/destinations/mallorca.webp);
    background-position: center 70%;
}

.destination-header-105 {
    background-image: url(/img/destinations/menorca.webp);
    background-position: center 30%;
}

.destination-header-107 {
    background-image: url(/img/destinations/greece.webp);
    background-position: center 35%;
}

/***** DESTINATIONS SYLES *****/


/***** FILTER-FORM STYLES *****/

.filter-accordion {
    --bs-accordion-color: inherit;
    --bs-accordion-bg: inherit;
    --bs-accordion-btn-color: inherit;
    --bs-accordion-btn-focus-border-color: red;
    --bs-accordion-btn-focus-box-shadow: none;
    --bs-accordion-active-color: inherit;
    --bs-accordion-active-bg: inherit;
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='var%28--bs-body-color%29'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e")
}

    .filter-accordion .accordion-button {
        box-shadow: none;
    }

#filter-price > .accordion-body {
    padding-left: 2rem;
    padding-right: 2rem;
}

.styled-slider,
.styled-slider .noUi-handle {
    box-shadow: none;
}

    /* Hide markers on slider handles */
    .styled-slider .noUi-handle::before,
    .styled-slider .noUi-handle::after {
        display: none;
    }

#price-slider {
    height: 10px;
}

    #price-slider .noUi-connect {
        background: var(--main-color);
    }

    #price-slider .noUi-handle {
        height: 18px;
        width: 18px;
        top: -5px;
        right: -9px;
        border-radius: 9px;
    }

        #price-slider .noUi-handle .noUi-touch-area {
            border: 1px solid transparent;
            position: absolute;
            top: -10px;
            left: -10px;
            right: -10px;
            bottom: -10px;
            width: auto;
            height: auto;
        }

#filter-btn-row {
    z-index: 10;
    position: sticky;
    bottom: 0;
}

/***** FILTER-FORM END *****/


/***** PRODUCTS RESULTS SYLES *****/

#destination-header {
    background-image: url("/img/products/header-bg/capri.webp");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    background-color: #83e5e2;
}

    #destination-header > .container > .row {
        height: 50vh;
        min-height: 350px;
        max-height: 500px;
    }

    #destination-header span {
        font-size: 50px;
        color: white;
        font-weight: bold;
        text-shadow: 2px 2px 10px black;
    }

.extra-info {
    margin-top: .5rem;
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    column-gap: .3rem;
    line-height: 1;
}

#load-more-div button {
    text-decoration: none;
    color: var(--tl-blue);
}

    #load-more-div button:hover {
        color: var(--tl-blue-25)
    }

/***** PRODUCTS RESULTS END *****/


/***** PRODUCTS DETAILS SYLES *****/

.search-form .dropdown-toggle::after {
    content: none;
}

/***** PRODUCTS DETAILS END *****/


/***** FOOTER PAGES SYLES *****/

.footer-page-banner {
    width: 100%;
    height: 35vh;
    object-fit: cover;
    object-position: center;
}

/***** FOOTER PAGES END *****/


/***** COOKIE BANNER SYLES *****/

.cookie-banner {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 9999;
    transform: translateY(100%);
    transition: transform .5s ease;
}

    .cookie-banner.show {
        transform: translateY(0);
    }

.cookie-banner-text {
    font-size: 12px;
}

@media (min-width: 768px) {
    .cookie-banner-text {
        font-size: 14px;
    }
}

/***** COOKIE BANNER END *****/