/* Header */
header{
    position: relative;
    height: 100vh;
    /* width: 100%; */
    min-height: 500px;
    overflow: hidden;
}

.header #webgl-canvas {
    min-height: 500px !important;
}

#carousel-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
header::before {
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background-color: #00000030;
}

header img{
    width: 100%;
    height: 100%;
    object-fit: cover;
}


.header__text{
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}
@media(max-width: 500px){
    .header__text {
        position: absolute;
        top: 62%;
        transform: translateY(-50%)
    }
}

.newsletter_popup__close {
    width: 100%;
    display: flex;
    justify-content: end;
    position: absolute;
    top: 8px;
    right: 8px;
}

    .newsletter_popup__close button {
        outline: none;
        border-radius: 100px;
        height: 25px;
        width: 25px;
        border: 1px solid #00000073;
        background-color: white;
        box-shadow: 0 1px 8px rgba(0, 0, 0, 0.3);
/*        justify-content: center;
        justify-items: center;
        align-items: center;
        display: grid;
        align-content: center;*/
    }

    #newsletter_popup_container {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        justify-content: center;
        align-items: center;
        background-color: #00000057;
        z-index: 10000;
    }

#newsletter_popup {
    max-width: 550px;
    background-color: white;
    padding: 25px 35px;
    border-radius: 5px;
    position: relative;
    margin: 5%;
}

    #newsletter_popup .newsletter_popup_title {
        font-weight: 500;
        font-size: 24px;
        padding-bottom: 10px;
        line-height: 28px;
        font-family: 'CF Ifigeneia', serif !important;
    }

    #newsletter_popup .newsletter_disclaimer {
        font-size: var(--fs-text);
        font-weight: 300;
        line-height: 26px;
    }

#newsletter_popup .newsletter_popup_form{
    display: flex;
    gap: 10px;
    padding: 10px 0px;
}

@media(max-width: 475px){
    #newsletter_popup .newsletter_popup_form{
        flex-direction: column;
    }
}

    #newsletter_popup .newsletter_popup_form input {
        width: 100%;
        height: 40px;
        padding: 0 8px;
        font-size: 14px;
    }

#newsletter_popup .newsletter_popup_form button{
    text-transform: uppercase;
    padding: 8px 28px;
    border-radius: var(--radius);
    background-color: #FDE100 !important;
    font-size: var(--fs-small);
    font-weight: 300;
    outline: none;
    border: none;
    cursor:pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    color: black;
}

.header__text__under_picture{
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.header-heading {
    font-size: 68px;
    color: white;
    font-weight: 500;
    text-shadow: 2px 2px 10px #000;
    margin-left: 40px;
    line-height: 73px;
    margin-bottom: 30px;
    max-width: 550px;
    width: 100%;
}


.header-trip-info{
    margin-left: 40px;
    min-height: 140px;
}

.header-trip-info__heading {
    color: #FFF;
    text-shadow: 2px 2px 10px #000;    
    font-size: 27px;
    font-style: normal;
    font-weight: 500;
    line-height: 35px; 
}

.header-trip-info__duration-places {
    color: #FFF;
    text-shadow: 2px 2px 10px #000;
    font-size: 27px;
    font-style: normal;
    font-weight: 300;
    line-height: 35px;
}

.header-trip-info__place {
    color: #FFF;
    text-shadow: 2px 2px 10px #000;
    font-size: 19px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
    letter-spacing: 2.88px;
}


.bottom-info__header{
    position: absolute;
    bottom: 50px;
    width: 100%;
}
.header-button-trip{
    display: grid;
    grid-template-columns: 2.5% auto 1fr;
    width: 100%;
    align-items: center;
}

.header-button-trip::before {
    width: 100%;
    height: 1px;
    content: "";
    display: block;
    position: relative;
    background-color: white;
}
    .header-button-trip::after {
        width: 100%;
        height: 1px;
        content: "";
        display: block;
        position: relative;
        background-color: white;
    }

.icon-arrow__content{
    width: 16px;
    height: 16px;
    
}

.icon-arrow {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 8px;
    border: 2px solid #FDE100;
    border-radius: 100%;
}

.button-trip-starts-now{
    text-align: right;
    margin-right: 2.5%;
    cursor: pointer;
    display: flex;
    justify-content: end;
}

    .button-trip-starts-now h1 {
        font-size: 19px;
        background-color: #FDE100;
        border-radius: 44px;
        width: fit-content;
        padding: 14px 20px;
        justify-self: end;
        font-weight: 500;
        box-shadow: 0px 4px 15px 0px rgba(150, 133, 0, 0.35);
    }

.icon-arrow__content img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.header-button-trip__container {
    padding: 18px 16px;
    border: 1px solid white;
    width: fit-content;
    border-radius: 100px;
    display: flex;
    align-items: center;
    gap: 20px;
}

.header-button-trip p{
    font-size: 16px;
    color: white;
}

.mouse-style-move-container{
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0;
    pointer-events: none;
}


@media(max-width: 800px){
    .mouse-style-move-container{
        display: none !important;
    }
}
.mouse-style__move{
    content: "";
    display: block;
    position: relative;
    width: 80px;
    height: 80px;
    border: 2px solid white;
    border-radius: 100px;
    pointer-events: none; /* Prevent interactions */
    /*transform: translate(-50%, -50%);*/
}

.mouse-style__heading{
    position: absolute;
    right: -110px;
    top: 30px;
    color: #ffffffa1;
}
.stable-mouse__text {
    position: absolute;
    top: 270px;
    right: 4.2%;
    color: #ffffffa1;
}

@media(max-width: 800px){
    .stable-mouse__text {
        top: 240px;
    }
}


.mouse-style-stable-container {
    position: absolute;
    right: 5%;
    top: 182px;
}

@media(max-width: 800px){
    .mouse-style-stable-container {
        top: 150px;

        -webkit-user-select: none; /* Safari and iOS */
        -moz-user-select: none;    /* Firefox */
        -ms-user-select: none;     /* Internet Explorer/Edge */
        user-select: none;         /* Standard syntax */
        -webkit-touch-callout: none;
    }
}
.mouse-style__stable {
    width: 80px;
    height: 80px;
    border: 2px solid #ffffff5c;
    border-radius: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    user-select: none;
}  
.mouse-style__stable img{
    width: 35px;
    pointer-events: none;
    height: auto;
}

/* Reviews */
.reviews {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-items: center;
    justify-content: center;
    padding: 100px 0;
    background-color: #fdfcf2;
}

.review__heading h1{
    font-size: 54px;
    font-weight: 300;
/*    margin-bottom: 40px;*/
}

@media(max-width: 600px) {
    .review__heading h1 {
        font-size: 44px;
        font-weight: 300;
        margin-bottom: 20px;
    }
}

    .review__heading span{
        font-style: italic;
    }

.review__container-slider {
    display: flex;
    align-items: start;
    margin-top: 36px;
}
@media(max-width: 1000px) {
    .reviews{
        margin-bottom: 100px;
    }
}
.reviews__container{
    overflow: hidden;
/*     max-width: 1000px; */
    position: relative;
    margin: 0;
    width: 70vw;
}

@media(max-width: 1000px) {
    .reviews__container {
        overflow: hidden;
        max-width: 300px;
        position: relative;
        margin: 0;
        width: 100%;
    }
}
.reviews__wrapper {
    display: flex;
    transition: transform 0.5s ease-in-out;
    will-change: transform;
}
  
  .review-slide {
    flex: 0 0 100%;
    /*max-width: 100%;*/
    box-sizing: border-box;
    padding: 0 20px 20px 20px;
    text-align: center;
  }

.review-pagination {
    position: absolute;
    text-align: center;
}

.arrow-left, .arrow-left-trip {
    top: 50%;
    left: 8px;
}


.arrow-right, .arrow-right-trip {
    top: 50%;
    right: 8px;
}
.swipper-pagination {
        position: relative;
        margin-top: 20px;
}

.swiper-pagination-bullet {
    background: #D2D2D2;
    width: 10px;
    height: 10px;
    opacity: 1;
}

.swiper-pagination-bullet-active {
    background: #FEED66;
    opacity: 1;
}


.slider-arrow{ 
    /*position: absolute;*/
    top: 60%;
    z-index: 90;
    width: 50px;
    height: 50px;
    display: flex
;
    justify-content: center;
    align-items: center;
    background-color: white;
    border-radius: 100px;
    transition: 0.3s all ease;
    transform: scale(1);
}

.trip-types__wrapper .slider-arrow {
    position: absolute;
}

    @media(max-width: 1410px) {
        .reviews .slider-arrow {
            top: 90%;
        }
    }

    @media(max-width: 850px) {
        /*.slider-arrow*/
    }

    .swiper-button-disabled{
    opacity: 0;
}
.inside-arrow{
    border: 1px dashed black;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 100px;
    cursor: pointer;
    transition: 0.3s all ease ;
  
    padding: 4px;
}

.exdesArrowLeft.arrow-left{
    left: 50px;
}
.exdesArrowLeft.arrow-right{
    right: 50px;
}
@media(max-width: 800px) {
    .exdesArrowLeft.arrow-left {
        left: 10px;
    }

    .exdesArrowRight.arrow-right {
        right: 10px;
    }
}
.slider-arrow:hover{
   transform: scale(1.1);

}


.review-slide{
/*     max-width: 1000px !important; */
width: 100%;
    text-align: center;
    margin: 0 auto;
}
.review-heading {
    font-size: 38px;
    font-weight: 400;
    /* font-style: italic; */
    line-height: 55px;
    margin-bottom: 20px;
/*    margin-top: 36px;*/
}

@media(max-width: 650px){
    .review-slide{
        /* max-width: 400px; */
        width: 100%;
        overflow: hidden;
        text-align: center;
        margin: 0 auto;
        
    }
    .reviews__wrapper{
        /* width: 300px; */
        max-width: 600px;
        /* width: 100%;
        overflow: hidden; */
        /* display: flex;
        justify-content: center; */
    }
    .review-heading {
        font-size: var(--fs-heading-3);
        font-style: italic;
        line-height: 35px;
        font-weight: 400;
    }
}

@media(max-width: 450px){
    .review-slide{
        /* max-width: 300px; */
        width: 100% !important;
        /* text-align: center; */
        /* margin: 0 auto; */
    }
    .review-heading{
        font-size: var(--fs-heading-3);
        line-height: 35px;
        font-weight: 400;
    }
}

.review-text {
    font-size: var(--fs-text);
    font-weight: 300;
}

.review-date{
    font-size: var(--fs-small);
    font-weight: 400;
    color: rgba(0, 0, 0, 0.616);
}

.review-by{
    font-size: var(--fs-text);
}


/* Explore destinations */
.explore__destinations{
    min-height: 100vh;
    position: relative;
    /* width: 100vw; */
    overflow: hidden;
}

.explore__destinations .overlay{
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.534);
    z-index: 9;
    pointer-events: none;
}

.ex-des__images{
    height: 100%;
    width: 100%;
    position: absolute;
}

.ex-des-swiper-slide {
    opacity: 0.5;
    transition: opacity 0.5s ease-in-out;
}

.ex-des-swiper-slide-active {
    opacity: 1;
}

.ex-des-swiper-container {
    width: 100%;
    height: 100%;
}
.explore__destinations .ex-des__images .swiper-slide img {
    width: 110%;
    height: 100%;
    position: absolute;
    left: -10%;
}
.ex-des__images img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}
.ex-des__slides-container{
    /* width: 100vw; */
    height: 100%;
    /* overflow-x: scroll; */
}
.ex-des__container{
    height: 100%;
    min-height: 100vh;
    display: flex;
    align-items: center;
    width: 100%;
    /* display: grid; */
    /* grid-template-columns: 1fr auto 1fr; */
    /* align-items: center;
    justify-items: center; */
    z-index: 10;
    position: relative;
}

.ex-des__swiper-container{
    width: 100%;
}

.ex-des__swiper-container .swiper-wrapper{
    align-items: center;
}

.ex-des__container .slider-arrow{
    border-color: rgba(255, 255, 255, 0);
    background-color: white;
}

.exdesArrowLeft, .exdesArrowRight{
    position: absolute;
    cursor: pointer;
}



.ex-des__container .slider-arrow::after {
    content: "";
    display: block;
    position: absolute;
    border-radius: 100px;
    width: 32px;
    height: 32px;
    /*border: 2px dashed black;*/
    transition: 0.3s all ease;
}

.ex-des__container .slider-arrow:hover::after{
    width: 40px;
    height: 40px;
}

.ex-des__info{
    text-align: center;
}
.ex-des__title {
    color: white;
    text-transform: uppercase;
    font-size: 20px;
    margin-left: 30px;
    font-weight: 200;
}

.ex-des__destination-name {
    font-size: 120px;
    line-height: 110px;
    color: white;
    margin: 0px 0 26px;
    letter-spacing: 3px;
}
.review__container-slider {
/*    position: relative;*/
}

    .review__container-slider .review-pagination {
        bottom: 160px !important;
    }
    .button-review {
        margin-top: 60px;
        padding: 8px 16px;
        background-color: #FDE100;
        border-radius: 4px;
/*        display: none;*/
    }

@media(max-width: 800px) {
    .ex-des__destination-name{
        font-size: 50px;
    }
}
.ex-des__countries li a {
    color: white;
    font-weight: 100;
    font-size: 22px;
    /*text-transform: uppercase;*/
}

    .ex-des__countries li a p {
        border-bottom: 1px solid #fde10000;
        line-height: 30px;
        transition: 0.3s all ease;
    }
        .ex-des__countries li a p:hover {
            border-bottom: 1px solid #FDE100;
        }



        .ex-des__countries {
            display: flex;
            gap: 28px;
            justify-content: center;
        }

@media(max-width: 762px){
    .ex-des__countries{
        display: flex;
        flex-direction: column;
        gap: 8px;
    }
}


.discover-more{
    display: flex;
    gap: 8px;
    justify-content: center;
    border: 1px solid white;
    width: fit-content;
    margin: 40px auto;
    padding: 8px 16px;
    border-radius: 100px;
}


.discover-more__icon{
    border: 2px solid var(--color-primary);
    width: 30px;
    border-radius: 100px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.discover-more__icon img{
    width: 15px;
    height: 15px;
}

.discover-more__icon__small{
    border: 2px solid var(--color-primary);
    width: 30px;
    border-radius: 100px;
    height: 30px;
    scale: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: 0.3s all ease;
}

.ex-des__countries-link-name.active .discover-more__icon__small{
    /* display: flex; */
    scale: 1;
    transition: 0.3s all ease;
}


.ex-des__link {
    display: flex;
    gap: 8px;
    justify-content: center;
}

.ex-des__map {
    width: 30vw;
    height: 30vw;
    margin: 0 auto;
   overflow: hidden;
}
/*.ex-des__map svg{
    width: 30vw;
    max-width: 500px;
    height: auto;
}
*/
@media(max-width: 800px) {
    .ex-des__map svg{
        width: 60vw;
        height: auto;
    }
    .ex-des__map {
        width: 90vw;
        height: 100vw;
        
    }
}

.discover-more p{
    color: white;
}

.ex-des__slides-wrapper{
    display: flex
    ;
        width: fit-content;
        position: relative;
}

.ex-des__slide{
    width: 100vw;
}





/* Trip types */
.trip-types__container{
    position: relative;
    padding-top: 2rem;
    width: 100%;
    overflow: hidden;
}


.overlay{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 50%;
    background-color: #FDFCF2;
    z-index: 1;
}
.trip-types__heading{
    position: relative;
    z-index: 9;
}
.trip-types__wrapper{
    z-index: 9;
}

.trip-types__heading h1 {
    text-align: center;
    font-size: var(--fs-heading-1);
    font-weight: 500;
    line-height: 60px;
    margin-bottom: 40px;
    display: flex;
    flex-direction: column;
}

    .trip-types__heading h1 .italic-heading{
        font-weight: 200;
    }

    .trip-types__wrapper {
        width: 100%;
        max-width: 1540px;
        margin: 0 auto;
        /* padding-bottom: 80px; */
        overflow: hidden;
    }

@media(max-width: 1410px){
    .trip-types__wrapper{
       
        overflow:unset
    }
}

.trip-types__content{
    /* margin-top: 40px; */
    /* display: flex; */
    /* justify-content: space-between; */
    /* gap: 30px; */
}



.trip-types__item{
    text-align: center;
    /* max-width: 300px; */
    /* gap: 30px; */
    display: flex;
    width: 335px;
    flex-direction: column;
    gap: 20px;
    justify-content: center;
    align-items: center;
    z-index: 9;
}



.trip-item-text{
    /* margin-top: 20px */
}
.trip-item-link {
    /* margin-top: 20px; */
    border: 1px solid black;
    padding: 8px 24px;
    width: fit-content;
    font-weight: 300;
    border-radius: 100px;
}

.trip-types__image-placeholder{
    width: 100%;
    height: 545px;
    text-align: center;
    position: relative;
    background-size: cover;
}

.trip-types__image-placeholder img{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    object-fit: cover;
    height: 100%;
    width: 100%;
}

.trip-types__image-placeholder::after{
    content:"";
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.393);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 5;
}

.trip-types__image-placeholder h1{
    margin-top: 40px;
    color: white;
    font-size: var(--fs-heading-1);
    z-index: 9;
    position: absolute;
    left: 50%;
    transform: translatex(-50%);
    font-weight: 500;
}

.trip-types__item:nth-child(2){
margin-top: 80px;
}

.trip-types__item:nth-child(4){
    margin-top: 80px;
}

@media(max-width: 480px){
    .trip-types__item:nth-child(2){
        margin-top: 0px;
        }
        
        .trip-types__item:nth-child(4){
            margin-top: 0px;
        }
}


@media(max-width: 800px) {
    .header-heading {
        font-size: 39px;
        color: white;
        font-weight: 500;
        text-shadow: 2px 2px 10px #000;
        margin-left: 16px;
        line-height: 40px;
        margin-bottom: 30px;
        width: 90%;
    }
    .header-trip-info {
        margin-left: 16px;
    }

    .header-trip-info__heading {
        font-size: 16px;
        line-height: 20px
    }
    .header-trip-info__duration-places {
        font-size: 16px;
    }

    .bottom-info__header{        
        display: flex
    ;
        bottom: 0px;
        flex-direction: column;
    }

    .header-button-trip::before{
        display: none;
    }
    .header-button-trip::after{
        display: none;
    }
    .header-button-trip{
        display: grid
    ;
        grid-template-columns: 1fr;
        width: 100%;
        align-items: center;
        padding: 0px 18px 18px;
    }
    .header-button-trip__container {
        width: 100%;
        text-align: center;
        background-color: #0000007a;
        color: white !important;
        border: 1px solid black;
        padding: 12px 16px;
    }
    .header-button-trip__container p{
        color: white;
        margin: 0 auto;
        font-size: 16px;
        font-weight: 300;
    }
    .button-trip-starts-now h1{
        width: 100%;
        font-family: 'CF ModGrotesk', sans-serif !important;
        font-size: 16px;
        border: 1px solid #FDE100 ;
        background-color: rgba(0,0,0,0);
        color: white;
        
    }
    .button-trip-starts-now{
        margin-right: 0;
        padding: 0px 18px 18px;
        /*border: 1px solid red;*/
        text-align: center;
    }
    .icon-arrow{
        display: none;
    }
    .header-button-trip__container {
    }
}

.ex-des__countries-link-name.active .discover-more__icon__small img {
    width: 14px;
}