.fatfrank {
    font-family: "FatFrank", sans-serif;
}

.europa {
    font-family: 'Europa', sans-serif;
}

:root {
    --green: #173c2a;
    --teal: #85c7bb;
    --pink: #ed9bb4;
    --cream: #f8f1e7;
    --dark-cream: #f0e3d0;
    --yellow: #f4db50;
}



/*------------------------------------*\
    MAIN
\*------------------------------------*/
/* global box-sizing */
*,
*:after,
*:before {
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
/* html element 62.5% font-size for REM use */
html {
    font-size: 100%;
}

body {
    color: #243a2a;
    font-weight: 400;
    overflow-x: hidden;
}
/* clear */
.clear:before,
.clear:after {
    content: ' ';
    display: table;
}

.clear:after {
    clear: both;
}

.clear {
    *zoom: 1;
    clear: both;
}

img {
    max-width: 100%;
}

a {
    color: var(--green);
    text-decoration: none;
}

    a:hover {
        text-decoration: none;
        color: var(--green);
    }

    a:focus {
        outline: 0;
        text-decoration: none;
    }

    a:hover, a:active {
        outline: 0;
    }

ul, li {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6 {
    color: #243a2a;
    margin: 0;
}



.light {
    font-weight: 300;
}

.regular {
    font-weight: 400;
}

.medium {
    font-weight: 500;
}

.semibold {
    font-weight: 600;
}

.bold {
    font-weight: 700;
}

.extrabold {
    font-weight: 800;
}


h1, .fs-28 {
    font-size: 28px;
    line-height: 36px;
}

h2, .fs-26 {
    font-size: 26px;
    line-height: 34px;
}

h3, .fs-24 {
    font-size: 24px;
    line-height: 32px;
}

h4, .fs-22 {
    font-size: 22px;
    line-height: 28px;
}

.h4, .fs-20 {
    font-size: 20px;
    line-height: 26px;
}

h5, .fs-18 {
    font-size: 18px;
    line-height: 24px;
}

.h5, .fs-16 {
    font-size: 16px;
    line-height: 24px;
}

.fs-15 {
    font-size: 15px;
    line-height: 22px;
}

h6, .fs-14 {
    font-size: 14px;
    line-height: 20px;
}

.fs-12 {
    font-size: 12px;
    line-height: 18px;
}




p:not(:last-child), p:not(:last-of-type) {
    margin-bottom: 10px;
}

.text-justify {
    text-align: justify;
}

p:last-child {
    margin: 0;
}

.butn {
    display: inline-block;
    background: var(--yellow);
    color: var(--green);
    padding: 7px 15px;
    text-align: center;
    font-size: 16px;
    line-height: 24px;
    font-weight: 700;
}

.border-pink {
    border-color: var(--pink) !important;
}

.border-green {
    border-color: var(--green) !important;
}

.border-teal {
    border-color: var(--teal) !important;
}

.bg-green {
    background: var(--green);
}

.bg-yellow {
    background: var(--yellow);
}

.bg-teal {
    background: var(--teal);
}

.bg-cream {
    background: var(--cream);
}

.bg-pink {
    background: var(--pink);
}

.bg-darkcream {
    background: #f1e3d3;
}

.text-yellow {
    color: var(--yellow);
}

.text-pink {
    color: var(--pink) !important;
}

.text-cream {
    color: var(--cream) !important;
}


/*------------------------------------*\
    		HEADER & FOOTER
\*------------------------------------*/
.container {
    max-width: 1300px;
    width: 100%;
}

/****** HEADER ********/

.top-bar ul li.dropdown > a, .bottom-header .navbar > div > ul > li > a {
    padding: 15px 0;
}

    .top-bar ul li.dropdown > a:after {
        content: '';
        display: inline-block;
        vertical-align: middle;
        border-top: 7px solid var(--pink);
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
    }

.top-bar ul > li.nav-item > a:hover {
    color: var(--dark-cream);
}

.top-bar ul li.dropdown .dropdown-menu, .bottom-header .navbar > div > ul > li .dropdown-menu {
    top: 36px;
}

.bottom-header .navbar > div > ul > li {
    padding: 0;
    margin-right: 0.9rem;
}

    .bottom-header .navbar > div > ul > li > a {
        font-family: "FatFrank", sans-serif;
        position: relative;
        font-size: 18px;
    }

    .bottom-header .navbar > div > ul > li.dropdown > a:after {
        content: "";
        display: inline-block;
        width: 15px;
        height: 15px;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='white'/%3E%3Cpolygon points='12.5,5 8,12.5 3.5,5' fill='%23173c2a'/%3E%3C/svg%3E");
        margin-left: 0.5em;
        vertical-align: unset;
        content: "";
        border-top: unset;
        border-right: unset;
        border-bottom: unset;
        border-left: unset;
    }

.bottom-header form input {
    min-width: 190px;
    padding: 3px 10px;
    font-size: 17px;
}


.nodropdown .dropdown-toggle::after {
    display: none;
}

.image-block-div {
    margin-left: 2px !important;
}

.Header-search-input {
    color: var(--green);
}

    .Header-search-input::placeholder {
        color: var(--green);
        font-weight: bold;
    }


.full-width-menu {
    padding: 20px;
    width: 26%;
    position: fixed;
    /*left: 0;*/
    border: 0 !important;
    border-radius: 0;
    top: 52px !important;
}

    .full-width-menu > div {
        max-width: 580px;
        margin-left: 2%;
    }

    .full-width-menu ul li a {
        display: block;
        padding: 3px 0;
        color: var(--green);
    }

        .full-width-menu ul li a:hover {
            font-weight: bold;
        }

    .full-width-menu .column {
        flex: 1;
        padding: 0 20px;
    }

        .full-width-menu .column:first-child ul li a {
            color: var(--green);
        }

        .full-width-menu .column:not(:last-child) {
            border-right: 2px solid var(--green);
        }




.fullscreen-menu {
    background-color: #f3f3ed;
    padding: 20px;
    width: 100%;
    position: fixed;
    left: 0;
    border: 0 !important;
    border-radius: 0;
    top: 104px !important;
}

    .fullscreen-menu > div {
        max-width: 970px;
        margin-left: 25%;
    }

        .fullscreen-menu > div ul li a {
            display: block;
            padding: 3px 0;
            font-weight: 500;
        }

    .fullscreen-menu .column {
        flex: 1;
        padding: 0 20px;
    }

        .fullscreen-menu .column:not(:last-child) {
            border-right: 1px solid var(--green);
        }


.fullscreen-menu {
    min-height: 300px;
}

.bottom-header .navbar > div > ul > li .dropdown-menu > li {
    padding: 5px 10px;
}

ul.sub-menu > li {
    max-width: max-content;
}

    ul.sub-menu > li.show-menu-item {
        max-width: 100%;
    }

        ul.sub-menu > li.show-menu-item > ul {
            display: flex;
            flex-wrap: wrap;
        }

        ul.sub-menu > li.show-menu-item > a {
            font-weight: bold;
        }

    ul.sub-menu > li > ul {
        position: absolute;
        top: 0;
        left: 25%;
        display: none;
        width: 78%;
        padding-bottom: 100%;
    }

ul.sub-menu {
    position: relative;
    width: 100%;
    max-width: 1100px;
}

    ul.sub-menu > li > ul > li {
        display: inline-flex;
        width: 22%;
        border-left: 2px solid var(--green);
        padding-left: 20px;
    }

/****** FOOTER ********/


.footer {
    background: #243a2a;
}

    .footer ul li a {
        color: var(--cream);
        font-weight: 400;
        display: block;
        padding-bottom: 3px;
    }

.footer-logo img {
    max-width: 160px;
}

.social-media a img {
    max-width: 35px;
}

/*------------------------------------*\
    		SITE 
\*------------------------------------*/

.banner-section {
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.headline {
    transform: rotate(-2deg);
}

.banner-section h1 {
    font-size: 50px;
    line-height: 59px;
    font-family: "FatFrank", sans-serif;
    background: var(--yellow);
    display: inline;
}

.headline h1::after {
    content: '';
    position: absolute;
    right: -40px; /* Adjust for arrow size */
    bottom: 0%;
    border-left: 40px solid var(--yellow); /* Yellow arrow */
    border-top: 30px solid transparent;
    border-bottom: 30px solid transparent;
}

.banner-bottom {
    background: lch(22 19.07 158.5 / 0.75);
}

.banner-price span, .banner-price del {
    font-size: 28px;
}

.banner-price del {
    text-decoration: none;
    position: relative;
    display: inline-block;
    padding: 0 10px;
}

    .banner-price del:after {
        content: '';
        display: block;
        width: 100%;
        height: 2px;
        background: var(--green);
        transform: rotate(-9deg);
        position: absolute;
        bottom: 15px;
        left: 0;
    }

.discovery-pd {
    padding-left: 1.7rem;
    padding-right: 3.2rem;
}

.discovery-sort-btn {
    width: 130px;
    text-align: left;
}

.infobar .row {
    text-align: center;
}

.infobar .infobar-slider {
    display: flex;
    align-items: stretch;
}

    .infobar .infobar-slider .tns-item {
        text-align: center;
    }


        .infobar .infobar-slider .tns-item:not(:first-child) {
            border-left: 1px solid var(--green);
        }



.title {
    font-size: 45px;
    line-height: 50px;
    font-family: "FatFrank", sans-serif;
}

.shape-left:before {
    content: '';
    display: block;
    width: 15px;
    height: 150px;
    background: var(--yellow);
    position: absolute;
    top: -10px;
    left: -5px;
    clip-path: polygon(0 0, 100% 0, 85% 100%, 0% 100%);
}



.timeline li {
    padding-left: 40px;
    position: relative;
    padding-bottom: 10px;
}

    .timeline li:before {
        content: '';
        display: inline-block;
        width: 20px;
        height: 20px;
        background-color: var(--green);
        border-radius: 50%;
        position: absolute;
        left: 0;
    }

    .timeline li:first-child:before {
        background: var(--pink);
    }

    .timeline li:last-child:before {
        background: var(--teal);
    }

    .timeline li:not(:last-child):after {
        content: '';
        display: inline-block;
        width: 2px;
        height: 100%;
        position: absolute;
        left: 9px;
        top: 0;
        background-color: var(--green);
        opacity: .7;
        z-index: -1;
    }

.arrow {
    display: block;
    width: 25px;
    height: 25px;
    background: var(--yellow);
    position: relative;
    border-radius: 50%;
    margin: 10px auto 0;
    transition: transform 0.3s ease; /* Transition between states */
}

    .arrow:after {
        content: '';
        display: block;
        border-left: 7px solid transparent;
        border-right: 7px solid transparent;
        position: absolute;
        top: 8px;
        left: 6px;
        transition: border 0.3s ease; /* Transition for the arrow */
    }

.arrow-down:after {
    border-top: 10px solid var(--green);
}

.arrow-up:after {
    border-bottom: 10px solid var(--green);
}

.arrow-down.active {
    transform: rotate(180deg); /* Flipping the arrow */
}

.link-slant .text-inner {
    transform: rotate(-2deg);
}

.expect-item img {
    width: 100%;
    height: 175px;
    object-fit: cover;
}

body .tns-control {
    display: flex;
    justify-content: center;
    gap: 20px;
}

    body .tns-control li,
    body .tns-control li:hover {
        background: var(--yellow);
        width: 30px;
        height: 30px;
        border-radius: 50%;
        font-size: 25px;
        color: var(--green);
        text-align: center;
        line-height: 30px;
        cursor: pointer;
    }


.logo-slider .logo-item img {
    max-width: 160px;
}

.logo-slider .logo-item {
    padding: 0 40px;
}

.trending-card-height {
    height: 200px;
    overflow: hidden;
}

.trending-card-wrap {
    max-height: 3em;
    overflow-wrap: break-word;
}

.trending-card-head {
    padding-left: 0px !important;
}

.logo-slider-wrapper .control, .trending-slider-wrapper .control {
    margin: 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    display: flex !important;
    width: 100%;
    justify-content: space-between;
    left: 0;
}

.logo-slider-wrapper .tns-outer, .trending-slider-wrapper .tns-outer {
    padding: 0 60px !important;
}

.logo-slider-wrapper .control li, #trending_control li,
.logo-slider-wrapper .control li:hover, #trending_control li:hover {
    background: #f8f0e7;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 25px;
    color: var(--green);
}

#trending_control li {
    background-color: #ffffff;
}


    #trending_control li:hover {
        background-color: var(--yellow);
    }

.banner-mr {
    margin-right: 2rem;
}

.d-block-pl {
    padding-left: .5rem;
}

.cta-section .butn {
    background: var(--green);
    color: var(--yellow);
    padding: 10px 20px;
    font-size: 18px;
    letter-spacing: 1px;
}

.faq-title img {
    max-width: 25px;
}

.trip-info {
    background: linear-gradient(to bottom, #f8f0e7 85%, #ffffff);
}

.trip-price:before, .trip-price:after {
    content: '';
    display: block;
    width: 100%;
    height: 7px;
    background-color: var(--teal);
}

.accomodation-slider .shape-left:before {
    left: 0;
    top: 0;
}

.accomodation-slider-wrapper .control {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

.ccomodation-slider-wrapper .control li,
.ccomodation-slider-wrapper .control li:hover {
    background: var(--yellow);
    width: 30px;
    height: 30px;
    border-radius: 50%;
    font-size: 25px;
    color: var(--green);
}


.accomodation-slider-wrapper .tns-nav {
    counter-reset: slides-num;
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    &:after

{
    content: counter(slides-num);
    display: inline-block;
    font-size: 20px;
    vertical-align: middle;
    padding-left: 7px;
}

}

.accomodation-slider-wrapper .tns-nav button {
    display: inline-block;
    counter-increment: slides-num;
    background: transparent;
    padding: 0;
    border: 0;
    margin-right: 0px;
    &.tns-nav-active

{
    min-width: 20px;
    margin-right: 0;
    &:before

{
    content: counter(slides-num) "  of";
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
}

}
}

/*.accomodation-slider .shape-left:before {
    left: 0;
    top: 0;
}

.accomodation-slider.owl-theme .owl-nav {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

    .accomodation-slider.owl-theme .owl-nav [class*=owl-],
    .accomodation-slider.owl-theme .owl-nav [class*=owl-]:hover {
        background: var(--yellow);
        width: 30px;
        height: 30px;
        border-radius: 50%;
        font-size: 25px;
        color: var(--green);
    }


.accomodation-slider .owl-dots {
    counter-reset: slides-num;
    position: absolute;
    bottom: 5px;
    left: 50%;
    transform: translateX(-50%);
    &:after

{
    content: counter(slides-num);
    display: inline-block;
    font-size: 20px;
    vertical-align: middle;
    padding-left: 7px;
}

}

.accomodation-slider .owl-dots button.owl-dot span {
    display: none;
}

.accomodation-slider .owl-dots .owl-dot {
    display: inline-block;
    counter-increment: slides-num;
    margin-right: 0px;
    &.active

{
    min-width: 20px;
    margin-right: 0;
    &:before

{
    content: counter(slides-num) "  of";
    display: inline-block;
    vertical-align: middle;
    font-size: 20px;
}

}
}
*/

.date-table tr th {
    padding: 20px 0;
    border-bottom: 3px solid var(--teal);
    font-size: 20px;
}


.date-table tr td {
    padding: 20px 0;
    border-bottom: 1px solid var(--teal);
    font-size: 20px;
}

    .date-table tr td.tbl-price {
        font-family: 'FatFrank', sans-serif;
    }

    .date-table tr td .butn {
        font-size: 18px;
    }

.month-list .inactive {
    opacity: .5;
}

.offer-slider .headline h2 {
    line-height: 40px;
}

    .offer-slider .headline h2::after {
        content: '';
        position: absolute;
        right: -34px;
        bottom: 0%;
        border-left: 36px solid var(--green);
        border-top: 24px solid transparent;
        border-bottom: 24px solid transparent;
    }

.offer-slider .slide-item {
    min-height: 280px;
    background-size: cover;
    background-position: center;
}

.offer-slider-wrapper .control {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 0;
    right: 0;
    width: 100%;
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

    .offer-slider-wrapper .control li {
        background: var(--cream);
    }

del {
    position: relative;
    text-decoration: none;
    margin: 0 5px;
}

    del:after {
        content: '';
        display: block;
        width: 100%;
        height: 2px;
        background: var(--pink);
        transform: rotate(-12deg);
        position: absolute;
        bottom: 40%;
        left: 0;
    }


/*------------------------------------*\
    RESPONSIVE MIN WIDTH
\*------------------------------------*/

@media (min-width:1025px) {
}

@media (min-width:1025px) {
    .form-title {
        font-size: 39px;
        line-height: 46px;
    }
}


@media(min-width:992px) {
}

@media(min-width:768px) {
    .border-md-0 {
        border-width: 0 !important;
    }
}




/*------------------------------------*\
    RESPONSIVE MAX WIDTH
\*------------------------------------*/

@media only screen and (max-width:1150px) {

    .full-width-menu {
        background-color: #f3f3ed;
        padding: 20px;
        width: 40%;
        position: fixed;
        border: 0 !important;
        border-radius: 0;
        top: 52px !important;
    }

    .bottom-header .navbar > div > ul > li {
        padding: 0;
        margin-right: 0.5rem;
    }

        .bottom-header .navbar > div > ul > li > a {
            font-size: 14px;
        }

        .bottom-header .navbar > div > ul > li.dropdown > a:after {
            width: 12px;
            height: 12px;
        }
}

@media only screen and (max-width:1024px) {

    .full-width-menu {
        background-color: #f3f3ed;
        padding: 20px;
        width: 40%;
        position: fixed;
        border: 0 !important;
        border-radius: 0;
        top: 52px !important;
    }

    .banner-price del {
        padding: 0;
    }

    .banner-price span, .banner-price del {
        font-size: 24px;
        line-height: 26px;
    }

    .logo-slider .logo-item {
        padding: 0 20px;
    }

    .cta-section .butn {
        font-size: 14px;
        padding: 5px 10px;
        text-wrap: nowrap;
    }

    .title, .banner-section h1 {
        font-size: 30px;
        line-height: 34px;
    }

    .logo-slider .logo-item {
        padding: 0 20px;
    }

    table.date-table tr th:nth-child(5),
    table.date-table tr th:nth-child(6),
    table.date-table tr th:last-child {
        display: none;
    }

    table.date-table tr th {
        width: 25%;
    }

    table.date-table tr td, table.date-table tr th {
        font-size: 15px !important;
    }

    table.date-table thead tr {
        display: flex;
    }

    table.date-table tbody tr {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }

        table.date-table tbody tr td {
            padding: 5px;
            border: 0;
        }

    table.date-table tr td:nth-child(1),
    table.date-table tr th:nth-child(1),
    table.date-table tr td:nth-child(2),
    table.date-table tr th:nth-child(2) {
        width: 30%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    table.date-table tr td:nth-child(3),
    table.date-table tr th:nth-child(3) {
        width: 10%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    table.date-table tr td:nth-child(4),
    table.date-table tr th:nth-child(4) {
        width: 30%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    table.date-table tbody tr td:nth-child(2),
    table.date-table tbody tr td:nth-child(3),
    table.date-table tbody tr td:nth-child(4) {
        border-left: 2px solid var(--teal);
    }


    table.date-table tbody tr td:nth-child(5),
    table.date-table tbody tr td:nth-child(6) {
        width: 70%;
        text-align: left !important;
    }

    table.date-table tbody tr td:last-child {
        width: 30%;
        margin-top: -25px;
        text-align: right !important;
    }

    table.date-table tbody tr:after {
        content: '';
        display: block;
        width: 100%;
        height: 2px;
        background: var(--teal);
        margin: 10px 0;
    }
}


@media only screen and (max-width:991px) {
    .header {
        z-index: 9;
        position: relative;
    }

    .mobilemenu {
        position: absolute;
        width: 100%;
        left: 0;
        top: 56px;
        overflow: auto;
        max-height: 100vh;
    }

        .mobilemenu > .navbar-nav > li {
            padding: 7px 0;
            text-align: center;
        }

            .mobilemenu > .navbar-nav > li > a {
                font-family: 'FATFRANK', sans-serif;
            }

            .mobilemenu > .navbar-nav > li.dropdown > a {
                display: flex;
                align-items: center;
                justify-content: space-between;
            }

        .mobilemenu > .navbar-nav .dropdown-toggle::after {
            vertical-align: middle;
        }

        .mobilemenu .navbar-nav .dropdown-menu {
            position: relative !important;
            background: transparent;
            box-shadow: none !important;
            transform: none !important;
        }

    .mobile-header .nav-item {
        position: relative;
        font-size: 18px;
    }

        .mobile-header .nav-item ul li {
            padding: 7px 0;
            position: relative;
            font-size: 18px;
        }

    .mobile-header button.mobile-sub-menu-btn {
        font-size: 22px;
        display: inline-block;
        vertical-align: middle;
        color: var(--pink);
        background: transparent;
        border: 0;
        position: absolute;
        right: 20px;
        top: 3px;
        font-weight: 700;
    }

    .mobile-header button.mobile-sub-menu-butn {
        font-size: 22px;
        display: inline-block;
        vertical-align: middle;
        color: var(--green);
        background: transparent;
        border: 0;
        position: absolute;
        right: 20px;
        top: 3px;
        font-weight: 700;
    }

    .mobile-header button.mobile-sub-menu-btn[aria-expanded=false]:before {
        content: '+';
    }

    .mobile-header button.mobile-sub-menu-btn[aria-expanded=true]:before {
        content: '-';
    }

    .mobile-header button.mobile-sub-menu-butn[aria-expanded=false]:before {
        content: '+';
    }

    .mobile-header button.mobile-sub-menu-butn[aria-expanded=true]:before {
        content: '-';
    }

    .logo-slider .logo-item {
        padding: 0 30px;
    }

    .bookingItem > div {
        width: 50%;
        flex-grow: 1;
    }

    .bookingPayment {
        border-right: 0;
    }
}



@media only screen and (max-width:767px) {
    h1 {
        font-size: 24px;
        line-height: 30px;
    }

    h2 {
        font-size: 20px;
        line-height: 26px;
    }

    h3 {
        font-size: 18px;
        line-height: 24px;
    }

    h4 {
        font-size: 16px;
        line-height: 22px;
    }

    h5, .fs-18 {
        font-size: 14px;
        line-height: 20px;
    }

    .no-border {
        border: 0 !important;
    }

    .footer {
        text-align: center;
    }

    .border-md-1 {
        border-width: 0 !important;
    }

    .banner-price span, .banner-price del {
        font-size: 20px;
        line-height: 24px;
    }



    .logo-slider-wrapper .control, .trending-slider-wrapper .control {
        position: relative;
        margin-top: 30px;
        justify-content: center;
    }

    #trending_control li {
        background: #ffffff;
    }

        #trending_control li:hover {
            background: var(--yellow);
        }


    .offer-slider .slide-item {
        min-height: 320px;
    }

    .offer-slider-wrapper .control {
        justify-content: center;
        bottom: 15px;
        transform: none;
        top: auto;
    }

    .mobile-bg-cream {
        background: var(--cream);
    }

    .mobile-bg-green {
        background-color: var(--green);
    }

        .mobile-bg-green .title {
            color: var(--cream);
        }

    .trending-section {
        background-color: #ffffff;
    }

    .infobar-slider p {
        font-size: 14px;
    }

    .banner-search h4 {
        font-size: 29px;
        line-height: 30px;
    }

    .banner-section > .container {
        min-height: 300px;
    }

    .index-banner-subtitle {
        width: 40%;
    }

    .headline h1::after {
        right: -29px;
        border-left: 30px solid var(--yellow);
        border-top: 19px solid transparent;
        border-bottom: 19px solid transparent;
    }

    .date-table tr td .butn {
        padding: 12px 20px !important;
        margin-top: -15px;
    }

    .logo-slider .logo-item img {
        max-width: 100%;
    }

    .logo-slider-wrapper .tns-outer {
        padding: 0 0px !important;
    }

    .trending-slider-wrapper .tns-outer {
        padding: 0 0px !important;
    }

    .logo-slider-wrapper .control li,
    .logo-slider-wrapper .control li:hover {
        background: var(--teal);
    }

    .abt-col-icon[aria-expanded="false"] {
        transform: rotate(-180deg);
    }

    /*Booking area*/
    ul.pastBookingList li {
        flex-direction: column;
    }

    .pastBookRef {
        border-bottom: 0;
    }

    .pastBookDetails {
        border: 1px solid #000;
        padding: 10px;
    }

    .pastBookRef {
        padding: 10px;
    }

    .bookingPayment {
        border: 0;
        border-top: 1px solid #000;
    }

    .bookingItem > div {
        width: 100%;
    }

    .bookingimage {
        order: -1;
    }

    .fns-22 {
        font-size: 22px !important;
        line-height: 28px !important;
    }
}

@media only screen and (max-width:575px) {

    .cta-section h2 {
        font-size: 16px;
    }

    .infobar .infobar-slider .tns-item {
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

        .infobar .infobar-slider .tns-item img {
            width: 15px;
        }

    .infobar .pt-2 {
        padding-top: 0 !important;
    }
}


.started {
    margin-top: 1px;
    background-color: #f8f1e7;
    padding: 50px 0 50px 0;
    display: inline-block;
    width: 100%;
}

    .started h1 {
        color: #173c2a;
        font-size: 1.5rem;
        margin-bottom: 1rem;
        line-height: 1.375;
        font-weight: 500;
        font-style: normal;
    }

    .started p {
        line-height: 1.5;
        margin-bottom: 1rem;
        color: #333;
        text-align: left;
        font-weight: 400;
        font-style: normal;
    }

.set-one {
    margin-bottom: 50px;
    display: inline-block;
    width: 100%;
}

.set-two {
    margin-bottom: 50px;
    display: inline-block;
    width: 100%;
}

.started ul li {
    line-height: 1.5;
    margin-bottom: 1rem;
    color: #333;
    text-align: left;
    font-weight: 400;
    font-style: normal;
}


.started-col-lg-3 {
    min-height: 1px;
    padding-right: 15px;
    float: left;
}

.started-col-lg-4 {
    min-height: 1px;
    padding-right: 15px;
    float: left;
}

.started-col-lg-6 {
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left;
}

.new button {
    background-color: #154d32;
    color: #fff;
    border-radius: 0px;
    text-align: center;
    width: auto;
    padding: 10px 24px 10px 24px;
    font-size: 1.25rem;
}

.desktop-mt-top {
    margin-top: 6.5rem;
}

.sticky-main-desktop {
    position: fixed;
    z-index: 99;
    width: 100%;
    margin-top: -6.5rem;
}

@media only screen and (max-width: 600px) {

    .block-width-section {
        margin-left: 0% !important;
    }

    .sticky-main-desktop {
        position: fixed;
        z-index: 99;
        width: 100%;
    }

    header .bg-green {
        position: fixed;
        width: 100%;
        z-index: 99;
    }

    header #searchbar {
        top: 55px;
        position: relative;
        background: #f4db50;
    }

    .alternative-section {
        display: flex;
        flex-wrap: wrap;
    }

    .altImage-section {
        order: 1;
    }

    .altText-section {
        order: 2;
    }
}

.block-width-section {
    margin-left: 15% !important;
}

.SeenInArea {
    display: flex;
    justify-content: center;
    align-items: center;
}


/* Form CSS Start ============================== */
.stepList {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 0;
    border-bottom: 1px solid #000;
    position: relative;
    z-index: 1;
    padding-top: 50px;
}

span.stepProgress {
    display: block;
    position: absolute;
    z-index: 1;
    left: 0;
    bottom: -2px;
    height: 4px;
    background: #000;
}

.stepItem {
    position: relative;
    z-index: 1;
    width: 170px;
    text-align: center;
    align-items: center;
    justify-content: center;
    display: flex;
    padding-bottom: 10px;
}

.stepCircle {
    display: block;
    position: absolute;
    z-index: 1;
    top: auto;
    bottom: -10px;
    width: 20px;
    height: 20px;
    border: 1px solid #000;
    background: #fff;
    border-radius: 50%;
    left: 50%;
    transform: translate(-50%);
}

.stepCheck {
    display: block;
    position: absolute;
    z-index: 111;
    left: 50%;
    transform: translate(-50%);
    bottom: -10px;
    width: 26px;
    margin-left: 2px;
    opacity: 0;
}

.activestep .stepCircle {
    background: #000;
}

.activestep img.stepCheck {
    opacity: 1;
}

.processstep span.stepCircle {
    background: #000;
}

.bk_clr {
    background: #f8f0e7 !important;
}

.bk_tr_clr {
    background: #f8f0e76e !important;
}

.stepListWrap {
    margin-bottom: 60px;
}

.sidewidgets {
    background: #f8f0e7;
    padding: 0 20px 20px 20px;
}

.StepOneBookbtn {
    display: flex;
    justify-content: center;
    padding: 5px 10px;
    background: #f4db50;
}

.sideWIdget {
    padding: 20px 0;
    border-bottom: 2px solid #85c7bb;
}

    .sideWIdget:last-child {
        border: 0;
    }

    .sideWIdget h2 {
        font-size: 24px;
        font-weight: bold;
        margin: 0 0 12px 0;
    }

ul.iconList li {
    display: flex;
    align-items: center;
    gap: 12px;
}

    ul.iconList li img {
        display: block;
        width: 20px;
        height: 20px;
        object-fit: contain;
        object-position: center;
    }

ul.iconList {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.OtherServices p {
    font-weight: 600;
}

ul.holidayPrice li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 600;
    font-size: 18px;
}

    ul.holidayPrice li:last-child {
        font-weight: bold;
    }

    ul.holidayPrice li del {
        color: #85c7bb;
    }

ul.holidayPrice {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

p.include {
    text-align: right;
    font-size: 14px;
}

.depositeText {
    margin-top: 20px;
}

    .depositeText h3 {
        margin-bottom: 10px;
        font-weight: bold;
    }


.formTItle h2 {
    font-size: 32px;
    font-weight: bold;
    margin-bottom: 40px;
}

.formTitleLine {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    padding-bottom: 40px;
    border-bottom: 10px solid #000;
}

.rightLogin {
    display: flex;
    align-items: center;
    gap: 30px 20px;
}

    .rightLogin h4 {
        font-weight: bold;
    }

.formWrap {
    padding: 40px 0;
}

section.stepFormContainer {
    overflow: hidden;
}

.formLeft {
    flex-grow: 1;
}

.formRight {
    max-width: 350px;
}

.formTItle {
    position: relative;
}

    .formTItle:after {
        position: absolute;
        z-index: -3;
        left: -100vw;
        right: -100vw;
        display: block;
        background: #aad8d0;
        content: "";
        height: 500px;
        bottom: 5px;
    }

img.sidebarThumb {
    display: block;
    width: 100%;
    height: 159px;
    object-fit: cover;
    object-position: center;
}


.formTopText h4 {
    margin: 0 0 15px 0;
}

.formTopText {
    margin-bottom: 20px;
}

.personalDetailsForm .row {
    gap: 20px 0;
}

select.form-control,
input.form-control {
    background: #f8f0e7;
    border-radius: 0px;
    height: 40px;
    color: #243a2a;
}

.form-control::placeholder {
    color: #243a2a;
}

img.selectIcon {
    display: block;
    width: auto;
    height: 40px;
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
}

.w150 {
    width: 180px;
}

.w40 {
    width: 40%;
}

.w100 {
    width: 150px;
}

.formCol {
    position: relative;
    z-index: 1;
}

span.requiredLable {
    display: block;
    position: absolute;
    top: 100%;
    font-size: 12px;
}

.selectWrap {
    display: flex;
    align-items: center;
    position: relative;
    z-index: 1;
}

    .selectWrap label {
        margin-right: 5px;
    }

.w30 {
    width: 30%;
}

.formCol > label {
    font-size: 18px;
    width: 100%;
    display: flex;
    align-items: center;
    gap: 20px 20px;
    margin-bottom: 5px;
}

.formCol label span {
    font-size: 12px;
}

.addressContainer h2 {
    font-size: 22px;
    padding: 30px 0px 40px 0;
    margin-bottom: 20px;
    border-bottom: 1px solid #85c7bb;
}

    .addressContainer h2 span {
        display: inline-block;
        line-height: 1.2;
        padding: 3px 5px;
        background: #f4db50;
    }

.row.addressRow {
    margin: 0 -30px;
}

    .row.addressRow > div {
        padding: 0 30px;
    }

.textArea {
    display: flex;
    flex-direction: column;
    border: 1px solid #85c7bb;
    margin-top: 0px;
}

    .textArea label {
        background: #f8f0e7;
        padding: 5px 10px;
    }

    .textArea textarea {
        padding: 10px 10px;
        border: 0;
        outline: none;
        background: #fbf8f3;
    }

.formFooter {
    padding-top: 20px;
}

.borderLIne {
    display: block;
    width: 100%;
    height: 1px;
    background: #85c7bb;
}

.acceptenceBox > p {
    background: #f8f0e7;
    padding: 5px 10px;
}

.acceptenceBox {
    margin-bottom: 30px;
}

.acceptence label {
    display: flex;
    gap: 10px;
}

.checkboxStyle {
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 1;
    width: 17px;
    height: 17px;
    background: #85c7bb;
    top: 4px;
    flex-shrink: 0;
}

    .checkboxStyle img {
        display: block;
        filter: brightness(0);
        opacity: 0;
        visibility: hidden;
    }

.acceptence input:checked + label .checkboxStyle img {
    opacity: 1;
    visibility: visible;
}

.acceptence input {
    display: none;
}

button.formSubmi {
    display: block;
    margin: 40px auto 0 auto;
    font-size: 22px;
    font-weight: bold;
    padding: 10px 15px;
    border: 0;
    background: #f4db50;
}

a.loginLink {
    font-size: 20px;
    font-weight: bold;
    padding: 5px 10px;
    background: #f4db50;
}

.w70 {
    width: 70%;
}

    .w70.addressContainer .borderLIne {
        margin-top: 30px;
    }

select.form-control option {
    background: #fbf8f3;
    border-radius: 0;
}

.formMobTitle {
    display: none;
}

.holayDayDetials {
    display: none;
}

.formTable {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.responsiveTable {
    overflow: auto hidden;
    padding-bottom: 10px;
}

.formTable table {
    margin: 0;
}

table.table {
    border: 1px solid #c2af9b;
    min-width: 550px;
}

    table.table tr td {
        border: 1px solid #c2af9b;
    }

    table.table thead {
        background: #f8f0e7;
    }

.formTable table.table:not(.no-first-row-style) tbody tr:first-child {
    background: #f8f0e76e;
    font-weight: 600;
}

.tableFooterText {
    display: flex;
    align-items: center;
    gap: 20px;
    justify-content: space-between;
}

    .tableFooterText p {
        margin: 0 0;
    }

.choseBtn {
    display: inline-block;
    padding: 7px 12px;
    background: #f4db50;
    border-radius: 0;
    font-weight: 600;
    white-space: normal;
    flex-shrink: 0;
}

img.downgray {
    transition: .3s;
}

.collapsTitle.active img.downgray {
    transform: rotate(180deg);
}

span.requiredLable.phonenumber {
    text-align: center;
    left: 24px;
}

.depositeText .deposite-require {
    float: right;
}

.depositeText p {
    font-size: 14px;
}

button.formSubmi.proceed-payment-btn {
    position: relative;
    left: 22%;
}


@media(max-width:991px) {

    .formTitleLine {
        border: 0;
    }

    .formTItle:after {
        display: none;
    }

    .formLeft {
        order: 2;
    }

    .formRight {
        max-width: 100%;
    }

    img.sidebarThumb {
        height: 38vw;
    }


    .stepList {
        padding-top: 30px;
    }

    .stepListWrap {
        margin-bottom: 0;
        background: #9ed2c9;
    }

    .formMobTitle {
        display: block;
        padding: 40px 0;
    }

        .formMobTitle h2 {
            font-weight: bold;
            font-size: 22px;
        }

    .holayDayDetials {
        background: #f4db50;
        padding: 10px 0;
        display: block;
    }

        .holayDayDetials h3 {
            display: flex;
            align-items: center;
            justify-content: space-between;
            font-size: 22px;
            font-weight: bold;
        }

    img.downgray {
        display: block;
        width: 22px;
    }

    .formSidebarContainer {
        padding: 30px 0 0;
    }

    .formTItle h2 {
        display: none;
    }

    .formCOntainer {
        padding-top: 40px;
    }

    .formTitleLine {
        padding-bottom: 0px;
    }

    .formTitleLine {
        flex-direction: column-reverse;
        align-items: flex-start;
    }

    .rightLogin {
        margin-bottom: 10px;
    }

    .formTitleLine h3 {
        font-size: 28px;
        font-weight: bold;
    }

    .formWrap {
        padding: 30px 0;
    }
}





@media(max-width:767px) {

    .tableFooterText {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .sidewidgets {
        padding-bottom: 40px;
    }

    .stepItem p b {
        display: block;
    }

    .stepItem p {
        font-size: 12px;
    }

    .stepItem {
        flex: 1;
        width: auto;
        height: 56px;
    }

    .w40 {
        width: 70%;
    }

    .formRow.row > .col-12 {
        display: none;
    }

    span.requiredLable {
        position: unset;
    }

    .formCol.w30 {
        width: 45%;
    }

    .w150 {
        width: 160px;
    }

    .w70.addressContainer {
        width: 95%;
        padding-top: 20px;
        padding-right: 0;
    }

    .formCol label span {
        font-size:;
    }

    .addressContainer h2 {
        padding: 30px 0px 20px 0;
    }

    .row.addressRow {
        margin: 0 -12px;
    }

        .row.addressRow > .col-md-6.formCol {
            max-width: 85%;
            padding: 0 12px;
        }

    .formFooter.col-12 {
        display: block !important;
    }

    .rightLogin {
        width: 100%;
    }

        .rightLogin h4 {
            width: 74%;
            font-size: 28px;
            font-weight: bold;
        }

    .block-width-section {
        margin-left: 0% !important;
    }
}
/* Form Css END ======================= */

.airport-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.airport-radio-btn {
    display: inline-flex;
    align-items: center;
    background-color: #d1ebe5;
    color: #333;
    padding: 8px 16px;
    border-radius: 8px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}

    .airport-radio-btn input[type="radio"] {
        display: none;
    }

    .airport-radio-btn.active {
        background-color: #85c7bb;
        color: #fff;
    }


.flight-modal-body .flight-form-label {
    background-color: rgba(0, 0, 0, .05);
    padding: 10px;
    margin-bottom: 5px;
    border-radius: 4px;
}

.flight-main-label {
    padding: 10px;
    margin-bottom: 5px;
    border-radius: 4px;
}

.flight-list-group-item {
    background-color: rgba(0, 0, 0, .05);
    border: 1px solid #c3dadb;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
}

.flight-form-check {
    margin-right: 10px;
}

.flight-form-check-input {
    margin-top: 0;
}

.choseBtn-btn-select {
    display: block;
    padding: 10px 60px;
    background: #f4db50;
    border-radius: 0;
    font-weight: 600;
    white-space: normal;
    flex-shrink: 0;
    border: none;
}

.choseFlightBtn-btn-select {
    display: block;
    padding: 15px 70px;
    background: #f4db50;
    border-radius: 0;
    font-weight: 600;
    white-space: normal;
    flex-shrink: 0;
    border: none;
}


.choseBtn-green-btn-select {
    display: block;
    padding: 15px 90px;
    background: #173c2a;
    border-radius: 0;
    font-weight: 600;
    white-space: normal;
    flex-shrink: 0;
    color: white;
    border: none;
}

.dep-modal-footer {
    /*justify-content: space-between;*/
    display: flex;
    justify-content: center;
}

    .dep-modal-footer .btn {
        flex: 1;
        margin: 0 5px;
    }

.viewformTitleLine {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    flex-wrap: wrap;
    padding-bottom: 40px;
}

.full-screen-loader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(255, 255, 255, 0.7);
    z-index: 9999;
}

/*========================================================*/
/*Booking Management*/

.bookingContainer {
    padding: 50px 0;
}

ul.bookingMenu {
    display: flex;
    gap: 5px 20px;
    flex-wrap: wrap;
    border-bottom: 2px solid #000;
    max-width: fit-content;
    margin-bottom: 30px;
}

    ul.bookingMenu li a {
        display: block;
        padding: 5px 0px;
    }

        ul.bookingMenu li a.active {
            font-weight: bold;
        }

h2.currentTitle {
    margin-bottom: 15px;
    font-size: 20px;
}

.bookingItem {
    display: flex;
    border: 1px solid #000;
    flex-wrap: wrap;
    gap: 0;
}

.bookingList {
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.bookingItem > div {
    width: 33.333%;
    flex-shrink: 0;
}

.bookingPayment {
    padding: 20px;
    border-right: 1px solid #000;
    border-left: 1px solid #000;
}

.bookingInfTItle {
    padding: 10px 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #000;
}

.bookingInfBody {
    padding: 15px 20px;
}

.bookingInfBodyTitl {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 15px;
    font-weight: 600;
    font-size: 17px;
}

.bookingInfTItle p {
    width: 40%;
}

.bookingInfTItle h3 {
    font-size: 20px;
    line-height: 1.4;
}

.bookingLocation {
    display: flex;
    align-items: center;
    gap: 0;
}

    .bookingLocation p {
        margin: 0;
        width: 50%;
        max-width: 140px;
        display: flex;
        align-items: center;
        gap: 10px;
    }

.bookingBtns {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 30px;
    gap: 10px;
}

.yellowBtn {
    background: var(--yellow);
    display: inline-block;
    padding: 8px 10px;
    font-size: 16px;
    font-weight: 500;
    min-width: 160px;
    text-align: center;
    border-radius: 5px;
}

table.table.paymentDuedateTable {
    max-width: 100%;
    width: 100%;
    min-width: unset;
}

    table.table.paymentDuedateTable td {
        font-size: 14px;
        padding: 5px 10px;
    }

ul.paymentTable {
    display: flex;
    flex-direction: column;
    gap: 0;
    margin-bottom: 20px;
    font-size: 16px;
}

    ul.paymentTable li {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

.makePayment.yellowBtn {
    display: table;
    margin: 0 auto;
}

.bookingimage img {
    display: block;
    width: 100%;
    max-height: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.pastBooking {
    margin-top: 40px;
}

ul.pastBookingList {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

    ul.pastBookingList li {
        display: flex;
    }

.pastBookRef {
    padding: 10px 20px;
    border: 1px solid #000;
    display: flex;
    align-items: center;
    gap: 30px;
    min-height: 50px;
}

.pastBookDetails {
    display: flex;
    align-items: center;
    gap: 40px;
    flex-grow: 1;
    border: 1px solid #000;
    border-left: 0;
    min-height: 50px;
    padding: 10px 10px 10px 30px;
}

.pastBookDetailsInf {
    flex-grow: 1;
    display: flex;
    align-items: center;
    gap: 40px;
}

.bookignMenuWrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 20px;
}

.personalFormBox .row {
    gap: 20px 0;
}

.personalInputBox {
    padding: 20px;
    border-bottom: 1px solid #000;
}

    .personalInputBox:last-child {
        border-bottom: 0;
    }

.personalFormBox {
    border: 1px solid #000;
    max-width: 900px;
    margin: 0 auto;
}

h3.personalForTitle {
    padding: 10px 15px;
    border-bottom: 1px solid #000;
    font-size: 18px;
    line-height: 1.5;
}

.personalInputBox .acceptence {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
}

    .personalInputBox .acceptence button {
        margin-left: auto;
    }

button.saveChange {
    display: block;
    font-size: 16px;
    font-weight: bold;
    padding: 10px 20px;
    border: 0;
    background: var(--yellow);
}

.row.addressRow {
    margin-top: 20px;
}

/*mobile responsive*/
@media(max-width:575px) {
    .pastBookDetails {
        flex-wrap: wrap;
        gap: 15px;
    }

    .pastBookDetailsInf {
        gap: 15px;
        width: 100%;
    }
}

span.requiredLable.phonenumber {
    text-align: center;
    left: 24px;
}

.depositeText h3 span {
    float: right;
}

.depositeText p {
    font-size: 14px;
}

button.formSubmi.proceed-payment-btn {
    position: relative;
    left: 22%;
}

.readonly-text[readonly] {
    background-color: #e9ecef; /* light gray background (like Bootstrap) */
    border-color: #ced4da; /* subtle border */
    cursor: not-allowed; /* show disabled cursor */
    opacity: 1; /* prevent fading out */
}

.readonly-select {
    pointer-events: none; /* prevents clicks */
    background-color: #e9ecef !important;
    border-color: #ced4da;
    cursor: not-allowed;
}
