 body {
     overflow-x: hidden;
     font-family: Poppins;
 }

 html {
     overflow-x: hidden;
 }

 .nav-item {
     font-size: 14px !important;
 }

 .s-8 {
     font-size: 8px;
 }

 .s-9 {
     font-size: 9px;
 }

 .s-10 {
     font-size: 10px;
 }

 .s-11 {
     font-size: 11px;
 }

 .s-12 {
     font-size: 12px;
 }

 .s-13 {
     font-size: 13px;
 }

 .s-14 {
     font-size: 14px;
 }

 .s-15 {
     font-size: 15px;
 }

 .s-16 {
     font-size: 16px;
 }

 .s-17 {
     font-size: 17px;
 }

 .s-18 {
     font-size: 18px;
 }

 .s-19 {
     font-size: 19px;
 }

 .s-20 {
     font-size: 20px;
 }

 .s-21 {
     font-size: 21px;
 }

 .s-22 {
     font-size: 22px;
 }

 .s-23 {
     font-size: 23px;
 }

 .s-24 {
     font-size: 24px;
 }

 .s-25 {
     font-size: 25px;
 }

 .s-26 {
     font-size: 26px;
 }

 .s-27 {
     font-size: 27px;
 }

 .s-28 {
     font-size: 28px;
 }

 .s-29 {
     font-size: 29px;
 }

 .s-30 {
     font-size: 30px;
 }

 .s-31 {
     font-size: 31px;
 }

 .s-32 {
     font-size: 32px;
 }

 .s-33 {
     font-size: 33px;
 }

 .s-34 {
     font-size: 34px;
 }

 .s-35 {
     font-size: 35px;
 }

 .s-36 {
     font-size: 36px;
 }

 .s-37 {
     font-size: 37px;
 }

 .s-38 {
     font-size: 38px;
 }

 .s-39 {
     font-size: 39px;
 }

 .s-40 {
     font-size: 40px;
 }

 .s-41 {
     font-size: 41px;
 }

 .s-42 {
     font-size: 42px;
 }

 .s-43 {
     font-size: 43px;
 }

 .s-44 {
     font-size: 44px;
 }

 .s-45 {
     font-size: 45px;
 }

 .s-46 {
     font-size: 46px;
 }

 .s-47 {
     font-size: 47px;
 }

 .s-48 {
     font-size: 48px;
 }

 .s-49 {
     font-size: 49px;
 }

 .s-50 {
     font-size: 50px;
 }

 .s-51 {
     font-size: 51px;
 }

 .s-52 {
     font-size: 52px;
 }

 .s-53 {
     font-size: 53px;
 }

 .s-54 {
     font-size: 54px;
 }

 .s-55 {
     font-size: 55px;
 }

 .s-56 {
     font-size: 56px;
 }

 .s-57 {
     font-size: 57px;
 }

 .s-58 {
     font-size: 58px;
 }

 .s-59 {
     font-size: 59px;
 }

 .s-60 {
     font-size: 60px;
 }

 .s-61 {
     font-size: 61px;
 }

 .s-62 {
     font-size: 62px;
 }

 .s-63 {
     font-size: 63px;
 }

 .s-64 {
     font-size: 64px;
 }

 .s-65 {
     font-size: 65px;
 }

 .s-66 {
     font-size: 66px;
 }

 .s-67 {
     font-size: 67px;
 }

 .s-68 {
     font-size: 68px;
 }

 .s-69 {
     font-size: 69px;
 }

 .s-70 {
     font-size: 70px;
 }




 .navbar {
     position: static !important;
 }

 .container {
     overflow: visible !important;
 }


 @media (min-width: 1400px) {

     .container,
     .container-lg,
     .container-md,
     .container-sm,
     .container-xl,
     .container-xxl {
         max-width: 1320px;
     }

     .container-fluid {
         max-width: 1320px !important;
     }
 }

 .dropdown-menu {
     z-index: 1050 !important;
     top: 100% !important;
     left: auto !important;
     right: auto !important;
     border-radius: 0;
     background-color: #fff;
     transform: translateX(0);
     /* width: 550px; */
     max-width: max-content;
     transition: all 0.3s ease-in-out;
 }

 .profile {
     z-index: 1050 !important;
     top: 100% !important;
     left: -78px !important;
     right: auto portant;
     border-radius: 0;
     background-color: #fff;
     transform: translateX(0);
     /* width: 550px; */
     max-width: max-content;
     transition: all 0.3s ease-in-out;
 }

 /* Show dropdown on hover */
 .nav-item.dropdown:hover .dropdown-menu {
     display: block;
     margin-top: 0;
 }

 .dropdown-menu a {
     max-width: max-content;
     font-size: 13px;
     color: #888686;
     text-decoration: none;
     padding: 5px;
     margin-left: 8px !important;
 }

 .dropdown-menu a:hover {
     background-color: transparent;
 }

 .nav-item-menu-title {
     font-size: 14px;
     font-weight: 600;
     color: #888686;
     padding: 3px;
     display: inline-block;
     border-bottom: 2px solid #c0bdbd;
     padding-bottom: 3px;
     /* text-shadow: 1px 0px 0px rgba(0, 0, 0, 0.37); */
 }



 .container-fluid {
     max-width: 95%;
     /* overflow-x: initial; */
     margin: 0 auto;
 }

 .min-vh-75 {
     min-height: 75vh !important;
 }

 .banner {
     background-image: url('../images/banner.png');
     background-size: cover;
     background-position: center;
     height: 100vh;
     width: 100%;
     background-repeat: no-repeat;
     margin-bottom: 120px;

     /* display: flex;
     align-items: center;
     justify-content: center; */
 }

 .search-box {
     background-color: #fff;
     border-radius: 10px;
     padding: 8px 16px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
     max-width: fit-content;
 }

 .search-input {
     border: none;
     outline: none;
 }

 /* Custom width for first input */
 .input-where {
     width: 250px;
 }

 /* Custom width for second input */
 .input-when {
     width: 150px;
 }


 .search-icon {
     color: #fd5d14;
     font-size: 15px;
     margin-left: 5px;
     border-radius: 50%;
     width: 35px;
     height: 35px;
     border: 2px solid #c7c7c7;
     display: flex;
     align-items: center;
     justify-content: center;
 }


 .search-btn {
     background-color: #fd5d14;
     color: white;
     border-radius: 40px;
     padding: 10px 24px;
     border: none;
     height: 40px;
 }

 .divider {
     border-left: 1px solid #e0e0e0;
     height: 40px;
 }

 .offer-card {
     /* box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.308),
         0px -1px 4px rgba(0, 0, 0, 0.05),
         2px 0px 6px rgba(0, 0, 0, 0.05),
         -2px 0px 6px rgba(0, 0, 0, 0.05); */
     width: 12rem;
     box-shadow: 0px 6px 12px 2px rgba(0, 0, 0, 0.3);
 }

 a.card {
     text-decoration: none;
     color: inherit;
 }

 .text-shadow {
     text-shadow: 2px 3px 6px rgba(0, 0, 0, 0.37);
 }

 .tour-card {
     margin-right: 50px;
 }

 #FeaturedTour {
     background-color: #0E3D4E;
 }

 .featurepack {
     background-size: cover;
     background-position: center;
     height: 300px !important;
     /* width: 260px; */
     border-radius: 12px;

 }

 .translate-middle {
     transform: translate(-50% -20%) !important;
 }

 #why-travel-with-us {
     background-image: url('../images/why-travel-with-us.jpg');
     background-size: cover;
     background-position: center;
     min-height: 600px !important;
     padding: 60px 50px 60px 50px;
 }

 #why-travel-with-us .card {
     background-color: #ffffff41;
     border: none;
     height: 350px;

 }

 .progress-ring {
     width: 150px;
     height: 150px;
     padding: 10px;
     /* Ring ki width yeh decide karega */
     border-radius: 50%;
     background: conic-gradient(transparent 0deg 90deg,
             /* 12 se 3 transparent */
             #0E3D4E 90deg 360deg
             /* 3 se 12 color */
         );
     display: flex;
     align-items: center;
     justify-content: center;
 }

 #plans {
     height: 580px !important;
 }

 .plans-main-card {
     background-color: #0E3D4E;
     width: 21.5%;
     padding: 20px;
     height: 515px !important;
 }

 .btn-theme {
     background-color: #fd5d14;
     color: white;
     border-radius: 10px;
     padding: 10px 30px;
     border: none;
     margin-top: 20px !important;
 }

 .text-theme {
     color: #fd5d14 !important;
 }

 .fs-12 {
     font-size: 12px !important;
 }

 #Membership,
 #bestTours {
     background-image: url('../images/Rectangle_4_4.png');
     background-size: cover;
     background-position: center;
     min-height: 550px !important;
     display: flex;
     align-items: end;

 }

 #bestTours .container {
     margin-top: 200px;
 }

 #bestTours .card {
     background-color: #ffffff71;
     border: none;
     height: auto;
 }

 #bestTours .card .card {

     background-size: cover;
     height: 200px;
 }

 .feature-card {
     height: 216px;
     position: relative;
 }

 .feature-card-lg {
     height: 447px;
     position: relative;
 }

 .feature-card-body {
     margin-left: 10px;
     position: absolute;
     bottom: 0;
     left: 0;
     right: 0;
     padding: 20px;
     color: #fff;
 }

 #Membership .card {
     background-color: #ffffff71;
     border: none;
 }

 .membership-card {
     object-fit: fill;
     background-position: center;
     background-size: cover;
     background-repeat: no-repeat;
     width: 430px;
     height: 430px;
 }

 .join-member {
     background-image: url("../images/Frame_29.png");
     background-size: cover;
     background-position: center;
     min-height: 550px !important;
     display: flex;
     align-items: end;
 }


 .membership-features .star-icon {
     font-size: 1.8rem;
     vertical-align: text-top;
     display: inline-block;
     margin-top: -15px;
 }

 .membership-features h4 {
     font-size: 1.3rem;
     font-weight: bold;
     margin-top: 0;
 }

 .membership-features p {
     font-size: 0.95rem;
     line-height: 1.3;
     margin-bottom: 0;
 }

 .membership-features h4,
 .membership-features p {
     color: #333;
 }

 .membership-features li {
     display: flex;
     align-items: center;
     margin-bottom: 1rem;
 }


 #moments-grid {
     display: grid;

     grid-template-columns: repeat(1, 1fr);
     /* Default 1 column */
     gap: 1rem;
     /* Spacing between grid items, similar to Bootstrap's g-3 */
     grid-auto-rows: minmax(200px, auto);
     /* Minimum row height, auto for larger content */
     grid-auto-flow: dense;
     /* Crucial for masonry-like packing */
 }

 @media (min-width: 768px) {

     /* Medium devices (md) */
     #moments-grid {
         grid-template-columns: repeat(2, 1fr);
         /* 2 columns on medium screens */
     }
 }

 @media (min-width: 992px) {

     /* Large devices (lg) */
     #moments-grid {
         grid-template-columns: repeat(3, 1fr);
         /* 3 columns on large screens */
     }

     .height-300 {
         height: 100%;
     }
 }

 @media (min-width: 1200px) {

     /* Extra large devices (xl) */
     #moments-grid {
         grid-template-columns: repeat(4, 1fr);
         /* 4 columns on extra large screens for more dynamic look */
     }
 }


 #best-moments .moment-item {
     display: flex;
     justify-content: center;
     align-items: center;
     background-color: #f0f0f0;
     border: 1px solid transparent;
     transition: border-color 0.3s ease-in-out;
 }

 #best-moments .moment-item img {
     width: 100%;
     height: 100%;
     display: block;
     object-fit: cover;
 }

 #best-moments .moment-item.highlighted-moment {
     border: 3px solid #007bff;
     box-shadow: 0 0 10px rgba(0, 123, 255, 0.5);
 }

 #best-moments .video-overlay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.3);
     opacity: 1;
     display: flex;
     justify-content: center;
     align-items: center;
     transition: background-color 0.3s ease-in-out;
     cursor: pointer;
 }

 #best-moments .play-icon {
     font-size: 4rem;
     color: white;
     text-shadow: 0 0 10px rgba(0, 0, 0, 0.7);
 }



 #best-moments .moment-item:hover .video-overlay {
     background-color: rgba(0, 0, 0, 0.4);
 }

 #handpicks .card {
     object-fit: fill;
     background-position: center;
     background-size: cover;
     background-repeat: no-repeat;
     height: 225px;
     /* width: 260px; */
 }

 #handpick2 {
     background-position: center;
     background-size: cover;
     background-repeat: no-repeat;
     height: 400px;
     /* Or a larger height if needed for content */
     position: relative;
     /* For absolute positioning of overlay */
 }

 #handpick2 .over-lay {
     position: absolute;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3));
     /* Adjust opacity as needed */
     display: flex;
     /* Use flexbox to center content vertically */
     align-items: center;
     /* Center items vertically in the overlay */
     justify-content: center;
     /* Center items horizontally in the overlay */
 }

 .help-card {
     border: 3.5px solid #0E3D4E !important;
     overflow: hidden;
     border-radius: 0px 35px 0px 35px;
 }

 .card-body-right {
     width: 50%;
     /* Adjust as needed */
 }

 .help-card {
     border: 3.5px solid #0E3D4E !important;
     border-top-right-radius: 35px !important;
     border-bottom-left-radius: 35px !important;
     overflow: hidden;
     box-shadow: 0 8px 8px -4px rgba(0, 0, 0, 0.3);
     /* bottom shadow only */
 }

 .theme-d-blue {
     color: #0E3D4E !important;
 }

 .bg-theme-d-blue {
     background-color: #0E3D4E !important;
 }

 .btn-outline-theme-d-blue {
     color: #0E3D4E !important;
     border: 1.5px solid #0E3D4E !important;
     background-color: transparent !important;
     background-image: none !important;
     transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out !important;
 }

 .btn-outline-theme-d-blue:hover {
     color: #fff !important;
     background-color: #0E3D4E !important;
     border-color: transparent !important;
 }

 .btn-outline-theme-d-blue:focus {
     box-shadow: 0 0 0 0.25rem rgba(14, 61, 78, .25) !important;
 }

 .btn-outline-theme-d-blue:active,
 .btn-outline-theme-d-blue.active {
     color: #fff !important;
     background-color: #0E3D4E !important;
     border-color: #0E3D4E !important;
 }

 .btn-outline-theme-d-blue:disabled,
 .btn-outline-theme-d-blue.disabled {
     color: #0E3D4E !important;
     background-color: transparent !important;
     border-color: #0E3D4E !important;
     opacity: 0.65 !important;
 }

 .footer-main ul {
     padding: 0 !important;
     margin: 0 !important;
 }

 .footer-main .nav-item {
     height: 25px !important;
 }

 .footer-main .nav-item>a {
     color: #ffffff;
 }

 .footer-main .nav-link {
     padding: 5px 0px !important;
 }


 .btn-outline-dark {
     color: #0E3D4E !important;
     border: 0.5px solid #0E3D4E !important;
     background-color: #fff !important;
     padding-left: 12px;
     padding-right: 12px;
     padding-top: 6px;
     border-radius: 3px !important;
     font-size: 12px !important;
     padding-bottom: 6px;
     font-size: 6px;
 }


 .btn-outline-dark:hover {
     color: #fff !important;
     border: 1px solid #0E3D4E !important;
     background-color: #0E3D4E !important;
     padding-left: 12px;
     padding-right: 12px;
     padding-top: 6px;
     border-radius: 3px !important;
     font-size: 12px !important;
     padding-bottom: 6px;
     font-size: 6px;
 }

 .bg-card-danger {
     background-color: rgba(235, 102, 43, 0.28) !important;
 }

 .profile .search-box {
     max-width: 100% !important;
 }

 .bottom {
     top: 160px !important;
     left: 100px;
 }

 .btn-danger {
     color: #fff !important;
     border: 1px solid #0E3D4E !important;
     background-color: #0E3D4E !important;
     font-weight: 600 !important;
     padding-left: 20px;
     padding-right: 20px;
     border-radius: 3px !important;
     font-size: 14px !important;
 }

 .btn-danger:hover {
     color: #0E3D4E !important;
     border: 1px solid #0E3D4E !important;
     background-color: #fff !important;
     font-weight: 600 !important;
     padding-left: 20px;
     padding-right: 20px;
     border-radius: 3px !important;
     font-size: 14px !important;
 }


 .categories-background {
     background-image: url("../images/BG-categories.png") !important;
     /* background-color: red !important; */
     background-position: center !important;
     background-repeat: no-repeat !important;
     background-size: cover !important;
     height: 100vh !important;
     width: 100% !important;
 }


 .line-height {
     line-height: 1;
 }

 .rating {
     height: 24px;
     width: 48px;
     background-color: rgba(255, 196, 3, 1);
     display: flex;
     border-radius: 20px;
     align-items: center;
     justify-content: center;
     color: white;
 }


 .fw-400 {
     font-weight: 400;
 }

 .fw-500 {
     font-weight: 500;
 }

 .fw-600 {
     font-weight: 600;
 }

 .height-350 {
     height: 350px !important;
 }

 .height-700 {
     height: 718px !important;
 }

 .bg-aboutus {
     background-image: url("../images/dignal.png");
     background-position: top;
     background-repeat: no-repeat;
     background-size: cover;
     width: 100%;
     height: 110vh;
 }

 .dots {
     background-image: url("../images/dots.png");
     background-position: bottom;
     background-repeat: no-repeat;
     background-size: cover;
     width: 50%;
     height: 100vh;
     position: absolute;
     right: 0px;
     top: 0px;
 }


 .bg-destination {
     background-image: url("../images/Destinations.png");
     background-position: bottom;
     background-repeat: no-repeat;
     background-size: cover;
     width: 100;
     height: 100vh;
 }

 .bottom-85 {
     bottom: 85% !important;
 }


 .bg-offer {
     background-color: rgba(16, 44, 57, 1);
     border-radius: 50%;
     width: 100px;
     height: 100px;
     display: flex;
     align-items: center;
     justify-content: center;
     color: white;
 }


 .dropdown-menu {
     border-radius: 15px !important;
     overflow: hidden;
     border: none !important;
 }


 /* Extra small devices (phones, 600px and down) */
 @media only screen and (max-width: 425px) {
     .banner {
         background-image: url("../images/banner.png");
         background-size: cover;
         background-position: center;
         height: 100% !important;
         width: 100%;
         background-repeat: no-repeat;
         margin-bottom: auto;

     }

     .banner .s-50 {
         font-size: 34px;
     }

     .banner .s-24 {
         font-size: 18px;
     }

     .offer-card {
         width: initial !important;
     }

     #why-travel-with-us .card {
         background-color: #ffffff99 !important;
         border: none;
         height: auto;

     }

     .plans-main-card {
         background-color: #0E3D4E;
         width: 21.5%;
         padding: 20px;
         height: 100% !important;
     }

     #bestTours .card {

         background-size: cover;
         height: auto;
     }


     .help-card-img-left {
         width: 100%;
         height: 300px !important;
         /* Adjust as needed */
         border-top-left-radius: 0.5rem;
         border-bottom-left-radius: 0.5rem;
         object-fit: cover;
     }

 }

 @media (max-width: 767px) {
     .dropdown-menu {
         width: 90vw !important;
         left: 0 !important;
         padding: 1rem !important;
         box-sizing: border-box;
     }

     .dropdown-menu .row {
         flex-direction: column;
     }

     .dropdown-menu .col-md-4 {
         width: 100% !important;
     }

     .navbar-nav {
         margin-left: 0 !important;
     }
 }


 /* Hover dropdown on desktop only */
 @media (min-width: 992px) {
     .navbar .dropdown:hover .dropdown-menu {
         display: block;
         margin-top: 0;
     }
 }

 /* Dropdown menu styling */
 .dropdown-menu {
     border-radius: 15px;
     overflow: hidden;
 }

 /* Fix mobile screen horizontal scroll */
 body {
     overflow-x: hidden;
 }

 /* Make large dropdowns responsive */
 @media (max-width: 767px) {
     .dropdown-menu {
         width: 90vw !important;
         left: 0 !important;
         padding: 1rem !important;
         box-sizing: border-box;
     }

     .dropdown-menu .row {
         flex-direction: column;
     }

     .dropdown-menu .col-md-4 {
         width: 100% !important;
     }
 }

 /* Medium devices (landscape tablets, 768px and up) */
 @media only screen and (min-width: 768px) {}

 /* Large devices (laptops/desktops, 992px and up) */
 @media only screen and (max-width: 992px) {
     #why-travel-with-us .card {
         background-color: #ffffff41;
         border: none;
         height: auto;

     }
 }

 /* Extra large devices (large laptops and desktops, 1200px and up) */
 @media only screen and (min-width: 1200px) {}



 @media only screen and (max-width: 767px) {

     .bg-aboutus {
         background-image: url("../images/dignal.png");
         background-position: top;
         background-repeat: no-repeat;
         background-size: cover;
         width: 100%;
         height: 100%;
     }

     .s-64 {
         font-size: 34px;
     }
 }

 .swiper {
     direction: rtl !important;
 }

 .ltr {
     direction: ltr;
 }

 .top-30 {
     top: 30px;
 }

 /* .bg-testimonial {
     background-image: url("../assets/images/testi.jpg");
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     width: 100%;
     height: 100%;
     padding: 50px; 
     border-radius: 25px;
 } */

 .height-300 {
     height: 300px;
 }



 .shadow-theme {
     box-shadow: 0px 0.2rem 0.25rem 3px rgba(0, 0, 0, 0.15) !important;
 }