/* hero video */
.video-bg {
  position: relative; /* Keeps the container in flow */
  width: 100%;
  height: auto; /* Full viewport height */
  overflow: hidden;
  
}

.video-bg video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensures the video fills the container */
  z-index: -1; /* Sends the video to the background */
}

.hero-content {
  position: relative;
  z-index: 1; /* Ensures content appears above the video */
  color: white; /* Makes text readable */
  text-align: center;
  padding-top: 30vh; /* Adjust to align content vertically */
}


/* contact video background */

.contact-vid {
  position: relative; /* Keeps the container in flow */
  width: 100%;
  height: auto; /* Full viewport height */
  overflow: hidden;
}

.contact-vid video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensures the video fills the container */
  z-index: -1; /* Sends the video to the background */
}

#contact-section {
  position: relative;
  z-index: 1; /* Ensures content appears above the video */
  margin: 15vh 0vh 20vh 0vh;
  
}









/* parallax */
/* General Parallax Section */

/* General Styles */
body, html {
margin: 0;
padding: 0;
overflow-x: hidden;
}

/* ===============================================Parallax Section================================================== */
.parallax {
position: relative;
height: 50vh; /* 50% of the viewport height */
background-image: url('/assets/img/bg/parallax-new-bf.webp'); /* Replace with your image */
background-attachment: fixed;
background-position: center;
background-repeat: no-repeat;
background-size: cover;
display: flex;
align-items: center;
justify-content: center;
}

/* Overlay Image */
.overlay-image {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
align-items: center;
justify-content: center;
}

.overlay-image img{
justify-content: center;
align-items: center;
align-content: center;
}

.overlay-image img {
width: 100%; /* Adjust size dynamically based on screen size */
max-width: 500px; /* Set a maximum width */
height: auto;
border-radius: 8px; /* Optional for better visuals */
}


.th-menu-wrapper .mobile-logo{
background-color: rgb(0, 5, 48);
}



/*=================================== Responsive Adjustments =====================================*/
@media (max-width: 768px) {
.parallax {
  height: 60vh; /* Adjust height for smaller screens */
  background-image: url('/assets/img/bg/parallax-new-bf.webp');
  background-attachment: fixed; /* Creates the parallax effect */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}
}

.overlay-image img {
  width: 100%; /* Make image take more width on smaller screens */
  max-width: 400px; /* Reduce max width */
}


@media (max-width: 1150px) {
.parallax {
  height: 30vh; 

}

.overlay-image img {
  width: 100%; /* Make image take more width on smaller screens */
  max-width: 120vh; /* Reduce max width */
}
}

@media (min-width: 1366px) {

.parallax {
  height: 30vh; 

}
.overlay-image img {
  width: 100%; /* Increase width for large screens */
  max-width: 100vh; /* Allow a larger maximum size */
  
}
}



@media (max-width: 480px) {
.parallax {
  height: 20vh; /* Increase height for very small screens */
  background-image: url('/assets/img/bg/parallax-new-bf.webp');
 
  background-attachment: fixed; /* Creates the parallax effect */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

.overlay-image img {
  width: 100%; /* Full width on very small screens */
  max-width: 140vh; /* Further reduce max width */
}
}


/* home body scaling */



.sub-title{
  margin-bottom: 20px;
}


.parallax-contact{
      /* Background image */
      background-image: url('/assets/img/bg/parallax.png'); /* Replace with your image */
      height: 40vh; /* Full screen height */
      background-attachment: fixed; /* Creates the parallax effect */
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;

}





.contactpage-vid {
  position: relative; /* Keeps the container in flow */
  width: 100%;
  height: auto; /* Full viewport height */
  overflow: hidden;
}

.contactpage-vid video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensures the video fills the container */
  z-index: -1; /* Sends the video to the background */
}

#contactpage-section {
  position: relative;
  z-index: 1; /* Ensures content appears above the video */
  margin: 15vh 0vh 25vh 0vh;
  
}



/* service-page-vid */
.servicepage-vid {
  position: relative; /* Keeps the container in flow */
  width: 100%;
  height: auto; /* Full viewport height */
  overflow: hidden;
  
}

.servicepage-vid video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover; /* Ensures the video fills the container */
  z-index: -1; /* Sends the video to the background */
}

.hero-content {
  position: relative;
  z-index: 1; /* Ensures content appears above the video */
  color: white; /* Makes text readable */
  text-align: center;
  padding-top: 30vh; /* Adjust to align content vertically */
}





.who-we-are{
  margin-top: -40vh;
}

.elements-sec{
  margin-top: -20vh;
}

.destination-content .box-title{
margin-bottom: 25px;
}





.client .tour-content h3{
margin: 10px 0px 30px 0px;



}

.team-content .media-body h3{
font-size: 16px;

}




/* .brand-area .swiper .swiper-slide h3{

text-align: center;
} */

.brand-area .swiper .swiper-slide .brand-box{

margin-bottom: 15px;
}

.background-container {
background: rgba(197, 199, 226, 0.3) /* Green background with 30% opacity */
}


.form-hero ::placeholder{
color: white;

}

.hero-form .form-hero {
position: relative;
-webkit-box-align: center;
-webkit-align-items: center;
    -ms-flex-align: center;
        align-items: center;
background-color: transparent;
border: 1px solid #E1E4E6;
border-radius: 8px;
padding: 14px 24px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
    -ms-flex-pack: justify;
        justify-content: space-between;
align-items: center;
}

.hero-form .form-hero:before {

position: absolute;
top: 15px;
right: 20px;
}

.hero-form .form-hero label {
color: var(--white-color);
font-size: 14px;
font-weight: 400;
display: block;
margin: 0;
}

.hero-form .form-hero input {
max-width: 105px;
}

.hero-form .form-hero input,
.hero-form .form-hero .nice-select {
color: var(--white-color);
height: auto;
line-height: unset;
background-color: transparent;
border-radius: 0;
border: none;
font-weight: 400;
padding: 0;
}

.hero-form .form-hero .nice-select {
max-width: 90px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-webkit-justify-content: center;
    -ms-flex-pack: center;
        justify-content: center;
}

.hero-form .form-hero .nice-select:after {
display: none;
}

.hero-form .form-hero .nice-select .option {
color: var(--title-color);
}

.hero-form .form-hero .nice-select .option.selected {
color: var(--theme-color) !important;
background: var(--theme-color) !important;
}

.hero-form .form-hero .nice-select .option.selected.focus {
color: #fff !important;
background: var(--theme-color) !important;
}

.hero-form .form-hero .nice-select .option:hover, .hero-form .form-hero .nice-select .option.focus {
background: var(--theme-color) !important;
color: #fff !important;
}

.hero-form .form-hero .nice-select.open .list {
border-bottom: 3px solid var(--theme-color);
}


.breadcumb-content {
background: rgba(157, 209, 244, 0.3);
max-width: 500px; /* Set a maximum width */
margin: 0 auto; /* Center the element */
padding: 20px; /* Adjust spacing as needed */
}

.bank .bank-widget{
max-width: 550px;
}





/* ================================================================================================ */



/* payment section responsive */




/* =========================== large screen==================================== */

@media(min-width: 1441px){

/* ................. about-area-home.................. */

.about-area-home{
margin-bottom: 8vh;
}
/* .....................destination-area................... */

.destination-area{
margin-top: 2vh;
}

/* ................. parallax-home...................... */
.parallax-home{
margin-top: 8vh;
margin-bottom: 2vh;
}


/* ........................contact-section................. */

#contact-section{
margin-top: -10px
}


/* ......contact-form-home */
.contact-form-home{

  margin-bottom: 7vh;
}

/* ........................... brand-area.......... */

.brand-area {
margin-top: -14vh;
}


.payment-align{
  margin-top: -4vh;
  margin-bottom: -10vh;
}

.payment-align .payment-box{
  margin: 0vh 3vh 0vh 3vh;
}

.payment-content .bank .bank-box{
  margin: 0vh 3vh 0vh 3vh;
}





/* ...................gallery................... */

.gallery-area{
  margin-bottom: 7vh;
}

.bank-section{
  margin-top: 4vh;
}



}

/* ==================================== laptop screen===================== */

@media(min-width: 1025px) and (max-width: 1440px){


/* ................. about-area-home.................. */

.about-area-home{
  margin-bottom: 16vh;
}
/* .....................destination-area................... */

.destination-area{
  margin-top: 5vh;
  margin-bottom: 18vh;
}

/* ................. parallax-home...................... */
.parallax-home{
  margin-top: 8vh;

}

/* ................ testi-sec ............. */
.testi-home{
  margin-top: -8vh;
}



/* ........................contact-section................. */

#contact-section{
  margin-top: -10px
}


  /* ......contact-form-home */
  .contact-form-home{

    margin-bottom: 18vh;
  }

/* ........................... brand-area.......... */

.brand-area {
  margin-top: -4vh;
}






  .payment-align{
    margin-top: -12vh;
    margin-bottom: -10vh;
  }

  .payment-align .payment-box{
    margin: 0vh 3vh 0vh 3vh;
  }

  .payment-content .bank .bank-box{
    margin: 0vh 3vh 0vh 3vh;
  }

  .bank-section{
    margin-top: -16vh;
  }





  /* ...................gallery................... */

  .gallery-area{
    margin-bottom: 15vh;
  }








}

/* =================================== tablet =============================== */


@media(min-width: 769px) and (max-width: 1024px){


  /* ................. about-area-home.................. */
  
  .about-area-home{
    margin-bottom: 8vh;
  }
  /* .....................destination-area................... */
  
  .destination-area{
    margin-top: 2vh;
    margin-bottom: 8vh;
  }
  
  /* ................. parallax-home...................... */
  .parallax-home{
    margin-top: 8vh;
    margin-bottom: 8vh;

  }

  /* ................ testi-sec ............. */
  .testi-home{
    margin-top: -8vh;
  }


  
  /* ........................contact-section................. */
  
#contact-section{
    margin-top: -10px
  }
  
  
    /* ......contact-form-home */
    .contact-form-home{
  
      margin-bottom: 18vh;
    }


/* ........................... brand-area.......... */
  
  .brand-area {
    margin-top: -12vh;
  }
  
  
    /* ...................gallery................... */
  
    .gallery-area{
      margin-bottom: 10vh;
    }
  

    .payment-align{
      margin-top: -2vh;
      margin-bottom: -10vh;
    }
  
    .payment-align .payment-box{
      margin: 0vh 5vh 0vh 15vh;
    }
  
    .payment-content .bank .bank-box{
      margin: 0vh 5vh 0vh 12vh;
    }

    .bank-section{
      margin-top: 5vh;
    }

  
}

/* ========================== larger phone ======================================= */
@media(min-width: 481px) and (max-width: 768px){


  /* ................. about-area-home.................. */
  
  .about-area-home{
    margin-bottom: 15vh;
  }
  /* .....................destination-area................... */
  
  .destination-area{
    margin-top: 2vh;
    margin-bottom: 8vh;
  }
  
  /* ................. parallax-home...................... */
  .parallax-home{
    margin-top: 8vh;
    margin-bottom: 8vh;

  }

  /* ................ testi-sec ............. */
  .testi-home{
    margin-top: -8vh;
  }


  
  /* ........................contact-section................. */
  
#contact-section{
    margin-top: -10px
  }
  
  
    /* ......contact-form-home */
    .contact-form-home{
  
      margin-bottom: 18vh;
    }


/* ........................... brand-area.......... */
  
  .brand-area {
    margin-top: -5vh;
  }
  
  
    /* ...................gallery................... */
  
    .gallery-area{
      margin-bottom: 10vh;
    }
  

    .payment-align{
      margin-top: -2vh;
      margin-bottom: -10vh;
    }
  
    .payment-align .payment-box{
      margin: 0vh 5vh 0vh 15vh;
    }
  
    .payment-content .bank .bank-box{
      margin: 0vh 5vh 0vh 12vh;
    }

    .bank-section{
      margin-top: -10vh;
    }
  

  
}





/* =========================================== small phone ======================== */

@media(min-width: 320px) and (max-width: 480px){


/* ................. about-area-home.................. */

.about-area-home{
  margin-bottom: 15vh;
}
/* .....................destination-area................... */

.destination-area{
  margin-top: 2vh;
  margin-bottom: 8vh;
}

/* ................. parallax-home...................... */
.parallax-home{
  margin-top: 8vh;
  margin-bottom: 8vh;

}

/* ................ testi-sec ............. */
.testi-home{
  margin-top: -8vh;
}



/* ........................contact-section................. */

#contact-section{
  margin-top: -10px
}


  /* ......contact-form-home */
  .contact-form-home{

    margin-bottom: 18vh;
  }


/* ........................... brand-area.......... */

.brand-area {
  margin-top: -5vh;
}


  /* ...................gallery................... */

  .gallery-area{
    margin-bottom: 10vh;
  }


  .payment-align{
    margin-top: -2vh;
    margin-bottom: -10vh;
  }

  .payment-align .payment-box{
    margin: 0vh 5vh 0vh 15vh;
  }

  .payment-content .bank .bank-box{
    margin: 0vh 5vh 0vh 12vh;
  }

  .bank-section{
    margin-top: -10vh;
  }






 







}




/* ============================================================== ************about-page*********** ========================= */
@media(min-width: 1441px){

.about-area-about{
margin-bottom: 33vh;

}

.who-we-are{
margin-bottom: 15vh;
}


.portfolio-size .page-content{
margin-top: 3vh;
}
}





/* ==================================== laptop screen===================== */

@media(min-width: 1025px) and (max-width: 1440px){

.about-area-about{
  margin-bottom: 22vh;
  
}

.who-we-are{
  margin-bottom: 25vh;
}

.portfolio-size .page-content{
  margin-top: 8vh;
}



}


/* =================================== tablet =============================== */


@media(min-width: 769px) and (max-width: 1024px){
.about-area-about .title-area-heading {
  margin-top: 70vh;
  margin-bottom: 2vh;
  
}

.who-we-are{
  margin-bottom: 15vh;
  margin-top: 5vh;
}

.portfolio-size .page-content{
  margin-top: 9vh;
}




}


/* ========================== larger phone ======================================= */
@media(min-width: 481px) and (max-width: 768px){
.about-area-about .title-area-heading {
  margin-bottom: 3vh;
  
}

.who-we-are{
  margin-bottom: 15vh;
  margin-top: 1vh;
}

.portfolio-size .page-content{
  margin-top: 2vh;
}




}


/* =========================================== small phone ======================== */

@media(min-width: 320px) and (max-width: 480px){
.about-area-about .title-area-heading {
  margin-bottom: 3vh;
  
}

.who-we-are{
  margin-bottom: 15vh;
  margin-top: 1vh;
}

.portfolio-size .page-content{
  margin-top: 10vh;
}




}










/* ====================================================== service page (each) =============================== */

@media(min-width: 1441px){
.service-page-each .page-single .box-title {
  margin-top: 2vh;
}

.service-page-each .page-single .page-content .service-page-ul {
  margin-top: -3vh;
}

.service-page-each .page-single .page-content button{
 margin: 2vh 0vh 3vh 0vh;
}

.service-page-each .page-single .page-content .checklist{
  margin-top: 2vh;
}




}

/* ==================================== laptop screen===================== */

@media(min-width: 1025px) and (max-width: 1440px){
.service-page-each .page-single .box-title {
  margin-top: 5vh;
}

.service-page-each .page-single .page-content .service-page-ul {
  margin-top: -7vh;
}

.service-page-each .page-single .page-content button{
 margin: 4vh 0vh 7vh 0vh;
}

.service-page-each .page-single .page-content .checklist{
  margin-top: 6vh;
}




}



/* =================================== tablet =============================== */


@media(min-width: 769px) and (max-width: 1024px){
.service-page-each .page-single .box-title {
  margin-top: 11vh;
}

.service-page-each .page-single .page-content .service-page-ul {
  margin-top: -12vh;
}

.service-page-each .page-single .page-content button{
 margin: 6vh 0vh 10vh 0vh;
}

.service-page-each .page-single .page-content .checklist{
  margin-top: 9vh;
}




}

/* ========================== larger phone ======================================= */
@media(min-width: 481px) and (max-width: 768px){
.service-page-each .page-single .box-title {
  margin-top: 11vh;
}

.service-page-each .page-single .page-content .service-page-ul {
  margin-top: -12vh;
}

.service-page-each .page-single .page-content button{
 margin: 6vh 0vh 10vh 0vh;
}

.service-page-each .page-single .page-content .checklist{
  margin-top: 9vh;
}




}

/* =========================================== small phone ======================== */

@media(min-width: 320px) and (max-width: 480px){
.service-page-each .page-single .box-title {
  margin-top: 8vh;
}

.service-page-each .page-single .page-content .service-page-ul {
  margin-top: -9vh;
}

.service-page-each .page-single .page-content button{
 margin: 6vh 0vh 10vh 0vh;
}

.service-page-each .page-single .page-content .checklist{
  margin-top: 6vh;
}




}