:root {
  --background-color: rgb(0, 80, 91);
  --secondary-color: rgb(255, 127, 80);
  --font-family: "Roboto", sans-serif;
  --color-blue: rgba(26, 57, 90, 1);

  --font-weight-thin: 100;
  --font-weight-light: 300;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;
  --font-weight-black: 900;
}

* {
  padding: 0;
  margin: 0;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-family);
  h2 {
    color: var(--color-blue);
  }
  
  #scrollToTopBtn {
    position: fixed;
    right: 10px;
    bottom: 30%;
    display: none;
    padding: 5px;
    max-height: min-content;
    color: white;
    cursor: pointer;
    z-index: 10;
    font-size: 50px;
    background: rgba(43, 43, 43, 0.4);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px); /* For Safari support */
    border: 1px solid rgba(255, 255, 255, 0.3);
    border-radius: 5px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    animation: fadeInDown;
    animation-duration: 0.4s;

    > i {
      font-size: 100%;
    }
  }

  #scrollToTopBtn:hover {
    background: rgba(43, 43, 43, 0.2);
  }
}

/*Loader Starts */
.loader {
  display: flex;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  /* width: 100%;
    height: 100dvh; */
  /* border: 1px solid black; */
  align-items: center;
  justify-content: center;
  background: rgba(0, 33, 71, 1);
  z-index: 9999999;
}

.wheel-and-hamster {
  --dur: 1s;
  position: relative;
  width: 12em;
  height: 12em;
  font-size: 14px;
}

.wheel,
.hamster,
.hamster div,
.spoke {
  position: absolute;
}

.wheel,
.spoke {
  border-radius: 50%;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.wheel {
  background: radial-gradient(
    100% 100% at center,
    hsla(0, 0%, 60%, 0) 47.8%,
    hsl(0, 0%, 60%) 48%
  );
  z-index: 2;
}

.hamster {
  animation: hamster var(--dur) ease-in-out infinite;
  top: 50%;
  left: calc(50% - 3.5em);
  width: 7em;
  height: 3.75em;
  transform: rotate(4deg) translate(-0.8em, 1.85em);
  transform-origin: 50% 0;
  z-index: 1;
}

.hamster__head {
  animation: hamsterHead var(--dur) ease-in-out infinite;
  background: hsl(30, 90%, 55%);
  border-radius: 70% 30% 0 100% / 40% 25% 25% 60%;
  box-shadow: 0 -0.25em 0 hsl(30, 90%, 80%) inset,
    0.75em -1.55em 0 hsl(30, 90%, 90%) inset;
  top: 0;
  left: -2em;
  width: 2.75em;
  height: 2.5em;
  transform-origin: 100% 50%;
}

.hamster__ear {
  animation: hamsterEar var(--dur) ease-in-out infinite;
  background: hsl(0, 90%, 85%);
  border-radius: 50%;
  box-shadow: -0.25em 0 hsl(30, 90%, 55%) inset;
  top: -0.25em;
  right: -0.25em;
  width: 0.75em;
  height: 0.75em;
  transform-origin: 50% 75%;
}

.hamster__eye {
  animation: hamsterEye var(--dur) linear infinite;
  background-color: hsl(0, 0%, 0%);
  border-radius: 50%;
  top: 0.375em;
  left: 1.25em;
  width: 0.5em;
  height: 0.5em;
}

.hamster__nose {
  background: hsl(0, 90%, 75%);
  border-radius: 35% 65% 85% 15% / 70% 50% 50% 30%;
  top: 0.75em;
  left: 0;
  width: 0.2em;
  height: 0.25em;
}

.hamster__body {
  animation: hamsterBody var(--dur) ease-in-out infinite;
  background: hsl(30, 90%, 90%);
  border-radius: 50% 30% 50% 30% / 15% 60% 40% 40%;
  box-shadow: 0.1em 0.75em 0 hsl(30, 90%, 55%) inset,
    0.15em -0.5em 0 hsl(30, 90%, 80%) inset;
  top: 0.25em;
  left: 2em;
  width: 4.5em;
  height: 3em;
  transform-origin: 17% 50%;
  transform-style: preserve-3d;
}

.hamster__limb--fr,
.hamster__limb--fl {
  clip-path: polygon(0 0, 100% 0, 70% 80%, 60% 100%, 0% 100%, 40% 80%);
  top: 2em;
  left: 0.5em;
  width: 1em;
  height: 1.5em;
  transform-origin: 50% 0;
}

.hamster__limb--fr {
  animation: hamsterFRLimb var(--dur) linear infinite;
  background: linear-gradient(hsl(30, 90%, 80%) 80%, hsl(0, 90%, 75%) 80%);
  transform: rotate(15deg) translateZ(-1px);
}

.hamster__limb--fl {
  animation: hamsterFLLimb var(--dur) linear infinite;
  background: linear-gradient(hsl(30, 90%, 90%) 80%, hsl(0, 90%, 85%) 80%);
  transform: rotate(15deg);
}

.hamster__limb--br,
.hamster__limb--bl {
  border-radius: 0.75em 0.75em 0 0;
  clip-path: polygon(
    0 0,
    100% 0,
    100% 30%,
    70% 90%,
    70% 100%,
    30% 100%,
    40% 90%,
    0% 30%
  );
  top: 1em;
  left: 2.8em;
  width: 1.5em;
  height: 2.5em;
  transform-origin: 50% 30%;
}

.hamster__limb--br {
  animation: hamsterBRLimb var(--dur) linear infinite;
  background: linear-gradient(hsl(30, 90%, 80%) 90%, hsl(0, 90%, 75%) 90%);
  transform: rotate(-25deg) translateZ(-1px);
}

.hamster__limb--bl {
  animation: hamsterBLLimb var(--dur) linear infinite;
  background: linear-gradient(hsl(30, 90%, 90%) 90%, hsl(0, 90%, 85%) 90%);
  transform: rotate(-25deg);
}

.hamster__tail {
  animation: hamsterTail var(--dur) linear infinite;
  background: hsl(0, 90%, 85%);
  border-radius: 0.25em 50% 50% 0.25em;
  box-shadow: 0 -0.2em 0 hsl(0, 90%, 75%) inset;
  top: 1.5em;
  right: -0.5em;
  width: 1em;
  height: 0.5em;
  transform: rotate(30deg) translateZ(-1px);
  transform-origin: 0.25em 0.25em;
}

.spoke {
  animation: spoke var(--dur) linear infinite;
  background: radial-gradient(
      100% 100% at center,
      hsl(0, 0%, 60%) 4.8%,
      hsla(0, 0%, 60%, 0) 5%
    ),
    linear-gradient(
        hsla(0, 0%, 55%, 0) 46.9%,
        hsl(0, 0%, 65%) 47% 52.9%,
        hsla(0, 0%, 65%, 0) 53%
      )
      50% 50% / 99% 99% no-repeat;
}

/* Animations */
@keyframes hamster {
  from,
  to {
    transform: rotate(4deg) translate(-0.8em, 1.85em);
  }

  50% {
    transform: rotate(0) translate(-0.8em, 1.85em);
  }
}

@keyframes hamsterHead {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(0);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(8deg);
  }
}

@keyframes hamsterEye {
  from,
  90%,
  to {
    transform: scaleY(1);
  }

  95% {
    transform: scaleY(0);
  }
}

@keyframes hamsterEar {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(0);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(12deg);
  }
}

@keyframes hamsterBody {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(0);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(-2deg);
  }
}

@keyframes hamsterFRLimb {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(50deg) translateZ(-1px);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(-30deg) translateZ(-1px);
  }
}

@keyframes hamsterFLLimb {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(-30deg);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(50deg);
  }
}

@keyframes hamsterBRLimb {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(-60deg) translateZ(-1px);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(20deg) translateZ(-1px);
  }
}

@keyframes hamsterBLLimb {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(20deg);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(-60deg);
  }
}

@keyframes hamsterTail {
  from,
  25%,
  50%,
  75%,
  to {
    transform: rotate(30deg) translateZ(-1px);
  }

  12.5%,
  37.5%,
  62.5%,
  87.5% {
    transform: rotate(10deg) translateZ(-1px);
  }
}

@keyframes spoke {
  from {
    transform: rotate(0);
  }

  to {
    transform: rotate(-1turn);
  }
}
/*Loader Ends */

/* Nav Starts */

.container-one::before {
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  background: rgba(0, 0, 0, 0.5); /* This is the dark overlay */
  z-index: 1;
}

.container-one {
  position: relative;
  height: 68vh;
  color: white;
  text-align: center;
  /* border: 1px solid red; */

  > h2 {
    color: white;
  }

  > .backoverlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    z-index: -1;

    > .carousel-inner {
      position: relative;
      width: 100%;
      height: 100%;

      > .carousel-item {
        position: relative;
        width: 100%;
        height: 100%;

        > img {
          width: 100%;
          height: 100%;
          aspect-ratio: 16/9;
          object-fit: cover;
        }
      }
    }
  }

  > .content-one {
    font-family: var(--font-family);
    position: relative;
    padding-top: 34.5dvh;
    line-height: 46px;
    z-index: 2;

    > h2 {
      font-size: clamp(20px, 3vw, 46px);
      font-weight: var(--font-weight-light);
      font-style: normal;
      letter-spacing: 1px;
      color: white;
    }

    > p {
      font-size: 20px;
      font-weight: var(--font-weight-light);
      letter-spacing: 1px;
    }
  }
}

.nav {
  display: none;
  height: 17.7dvh;
  right: 0;
  left: 0;
  justify-content: space-between;
  align-items: center;
  position: absolute;
  z-index: 3;
 

  background: rgba(43, 43, 43, 0.4);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px); /* For Safari support */
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
  animation: fadeInDown;
  animation-duration: 1s;

  .logo {
    height: 100%;
    max-width: 120px;
    margin-left: 1.5vw;
    z-index: 4;

    img {
      height: 100%;
      width: 100%;
    }
  }

  nav {
    width: 70%;
    margin-left: -0.5px;

    
    ul {
      display: flex;
      width: 100%;
      justify-content: space-evenly;

      li {
        list-style: none;

        .nav-link:hover {
          color: var(--secondary-color);
        }

        a:visited {
          /* color: var(--secondary-color); */
          color: rgb(251, 164, 129);
         
        }

        .nav-link {
          transition: 0.7s ease;
        }
      }

      a {
        color: white;
        text-decoration: none;
        font-weight: var(--font-weight-medium);
        font-size: clamp(12px, 14px, 1.5vw);
        text-wrap-style:balance ;
        /* border: 1px solid red; */

        > i {
          margin-right: 5px;
        }
      }
    }
  }
}

/* HAM STARTS */
.ham {
  display: none;
  position: relative;
  flex-direction: column;
  justify-content: space-between;
  width: 30px;
  height: 20px;
  margin-right: 1.5dvw;

  .line {
    display: block;
    position: absolute;
    width: 100%;
    height: 3px;
    background-color: #8c8c8c;
    box-shadow: 0.3px 0.3px 1px rgba(0, 0, 0, 0.3);
    border-radius: 8px;
    transition: all 0.5s ease;
  }

  #one {
    top: 0;
    transform-origin: left;
  }
  #two {
    top: 50%;
    transform: translateY(-50%);
  }
  #three {
    bottom: 0;
    transform-origin: left;
  }
}

/* HAM ENDS */

/* Nav Ends */



.container-two-cover {
  /* border: 1px solid red; */
  width: 100%;
  display: flex;
  margin-top: 11vh;
}

.container-two {
  width: 100%;
  /* border: 1px solid cyan; */
  display: flex;
  flex-direction: column;
  align-items: center;
}

.left {
  width: 80%;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  margin-bottom: 10dvh;
}

.left-content {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 3dvh;
  text-align: center;
  text-wrap: balance;

  h2 {
    /* border: 1px solid black; */
    font-size: 28px;
    font-weight: 600;
  }

  h4 {
    color: #e56e44;
    font-weight: var(--font-weight-light);
    font-size: clamp(16px, 1.5vw, 18px);
  }

  p {
    line-height: 22px;
    font-size: clamp(15px, 1vw, 18px);
    font-weight: var(--font-weight-regular);
    text-wrap-style: pretty;
    color: #333333;
  }
}

.btn-know {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 60px;
  /* border: 1px solid red; */
  text-align: center;
  margin-top: 6dvh;
  margin-bottom: 1vh;
}

.know-more {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 150px;
  height: 100%;
  font-size: 15px;
  color: white;
  background-color: var(--color-blue);
  box-shadow: -2px 2px 3px rgb(80, 48, 48);
}

.right {
  width: 90%;
  display: grid;
  align-items: center;
  grid-template-columns: 1fr;
  row-gap: 20px;
  /* border: 1px solid black; */


  .img-one, .img-two{
    animation: fadeIn;
    animation-duration: 5s;
    animation-delay: 0.2s;
  }

  .gallery {
    overflow: hidden;
    /* border: 1px solid black; */

    img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: 50% 60%;
    }
  }
}

.container-three-cover {
  margin-top: 10dvh;
  /* border: 1px solid black; */
  width: 100%;
}

.h2-center {
  display: flex;
  width: 100%;
  justify-content: center;
  /* border: 1px solid red; */
  height: fit-content;
}

#card-heading {
  text-align: center;
  font-size: 32px;
  margin-bottom: 7vh;
  color: var(--color-blue);
  width: 90%;
}

.container-three-outer {
  display: flex;
  width: 100%;
  justify-content: center;
}

.container-three-inner {
  display: grid;
  /* border: 1px solid cyan; */
  width: 90%;
  justify-content: center;
  row-gap: 20px;
}

.cards {
  display: flex;
  justify-content: center;
  align-items: center;
}

.cards-inner {
  width: 91%;
  text-align: center;
  padding: 10px;
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 15px;
  border: 1px solid #f2f2f2;
  transition: 0.3s;

  /* border: 1px solid red; */

  h2 {
    font-size: 28px;
    font-weight: var(--font-weight-medium);
  }
  p {
    font-weight: var(--font-weight-regular);
    color: #333333;
  }
}

.cards-inner:hover {
  border-color: var(--secondary-color);
}

.container-four-outer {
  width: 100%;
  /* border: 1px solid red; */
  margin-top: 20px;
  display: flex;
  justify-content: center;
}

.container-four-inner {
  width: 87%;
  display: grid;
  /* grid-template-columns: 1fr; */
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  /* grid-auto-rows: minmax(100px); */
  text-align: center;
  row-gap: 20px;
}

.counter-cards {
  transition: 0.3s;
  border: 1px solid white;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  padding: 30px 0px 30px 0px;
  margin-bottom: 2vh;

  .counter-icon {
    /* border: 1px solid red; */
    margin-bottom: -30px;
  }

  h2 {
    font-size: 69px;
    font-weight: var(--font-weight-regular);
    margin-top: 6vh;
  }

  p {
    /* border: 1px solid red; */
    /* margin-bottom: 3vh; */
    /* margin-top: -5px; */
    font-size: 19px;
    font-weight: var(--font-weight-medium);
  }
}

.counter-cards:hover {
  border-color: #61ce70;
}

.container-five-outer {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 75vh;
  margin-top: 9vh;
  /* border: 1px solid red; */
  margin-bottom: 9vh;
  position: relative;
}

.backoverlay-two {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  background-image: url(Images/couple-shikara.webp);
  background-size: cover;
  background-position: center;
  z-index: -1;
}

.container-five-outer::before {
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1;
}

.container-five-inner {
  z-index: 2;
  width: 80%;
  /* border: 1px solid red; */

  h2 {
    font-size: 32px;
    color: white;
  }
}

.btn-contact {
  display: flex;
  justify-content: center;
  width: 100%;
  height: 55px;
  /* border: 1px solid red; */
  text-align: center;
  margin-top: 6dvh;
  margin-bottom: 1vh;
}
.contact-us {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 150px;
  height: 100%;
  font-size: 15px;
  color: white;
  background-color: #e56e44;
  box-shadow: -2px 2px 3px rgb(107, 54, 54);
}

.container-six-outer {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  padding-bottom: 50px;

  background-image: url(Images/leaf\ abstract.webp);
  background-size: cover;

  > .h2-center {
    animation: fadeInDown;
    animation-duration: 2s;

    > #card-heading-two {
      text-align: center;
      font-size: 32px;
      margin-top: 60px;
      margin-bottom: 5vh;
      width: 90%;
      color: #000000;
      background: rgba(170, 169, 169, 0.4);
      backdrop-filter: blur(1px);
      -webkit-backdrop-filter: blur(3px); /* For Safari support */
      border: 1px solid rgba(255, 255, 255, 0.3);
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      border-radius: 5px;
    }
  }

  > .container-six-inner {
    display: inline-block;
    width: 90%;

    /* border: 1px solid pink; */

    > .container-six-content {
      
      display: grid;
      grid-template-columns: 1fr;
      /* grid-template-rows: repeat(3,70vh); */
      grid-auto-rows: minmax(60vh, auto);
      row-gap: 20px;
      padding-top: 2.5vh;
      justify-items: center;
      /* border: 1px solid red; */



        >.package {
          width: 100%;
          min-width: 220px;
          background: rgba(77, 77, 77, 0.4);
          backdrop-filter: blur(3px);
          -webkit-backdrop-filter: blur(3px); /* For Safari support */
          border: 1px solid rgba(255, 255, 255, 0.3);
          border-radius: 20px;
          overflow: hidden;
          box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
          display: flex;
          flex-direction: column;
          align-items: center;

          &&:hover {
            background: rgba(43, 43, 43, 0.5);
            transition: 0.4s ease-in-out;
          }

          > .packageImage {
            width: 100%;
            min-height: 200px;
            max-height: 210px;
            /* border: 1px solid red; */
            overflow: hidden;

            > img {
              width: 100%;
              height: 100%;
              /* border: 1px solid red; */
              aspect-ratio: 4/3;
              object-fit: cover;
              object-position: 50% 40%;
            }
          }

          > h2 {
            width: 95%;
            margin-left: 10px;
            margin-top: 10px;
            font-size: 32px;
            color: #f5f5f5; /* Warm off-white */
            text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);
          }

          > h6 {
            color: #f5f5f5;
            width: 91%;
          }

          > p {
            width: 89%;
            text-align: right;
            font-size: 15px;
            color: #fffacd; /* Lemon Chiffon */
            font-weight: bold;
            margin-top: 10px;
            display: inline-block;
            text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.3);

            > span {
              font-size: 18px;
              margin-left: 5px;
            }
          }

          > .btn {
            color: white;
            background-color: var(--color-blue);
            width: 150px;
            height: 60px;
            font-size: 15px;
            text-decoration: underline;
            border-radius: 0%;
            box-shadow: -2px 2px 3px rgb(80, 48, 48);
            margin-bottom: 2.5vh;
            margin-top: 2.5vh;
            
            &&:hover{
              cursor:pointer;
            }
          }
        }
    }
  }
}

.modal-body {
  display: flex;
  width: 100%;
  justify-content: center;

  > .modalForm {
    width: 90%;
    display: flex;
    flex-direction: column;
    gap: 10px;

    > input {
      width: 100%;
      height: 50px;
      padding: 15px;
      border-radius: 5px;
      border: 1px solid rgb(231, 231, 231);
      transition: 0.3s ease-in-out;
      &&:focus {
        border: 1.5px solid rgb(160, 160, 255);
        outline: none;
        box-shadow: 2px 2px 4px rgb(160, 160, 255);
      }
    }

    > label {
      font-size: clamp(16px, 1.5vw, 1.6wv);
      font-weight: 500;
    }

    > select {
      height: 50px;
      border-radius: 5px;
      padding: 10px;
      transition: 0.3s ease-in-out;

      &&:focus {
        border: 1.5px solid rgb(121, 121, 255);
        box-shadow: 2px 2px 4px rgb(160, 160, 255);
        outline: none;
      }
    }

    > .btn {
      margin-top: 2vh;
      width: 130px;
      height: 45px;
      margin-right: 6%;
      background-color: var(--color-blue);
      color: white;
      box-shadow: -1px 1px 2px rgb(118, 80, 80);
      cursor: pointer;
    }
  }
}

.container-seven-outer {
  width: 100%;
  /* border: 1px solid black; */
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 80px;
  background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
    url("Images/moving-bg.webp") no-repeat center center fixed;
  background-position: top 60%;
  background-size: cover; /* Ensure the image covers the section */

  > h2 {
    font-size: 32px;
    width: 100%;
    padding-bottom: 50px;
    background-color: white;
  }
  > .container-seven-inner {
    background-color: white;
    width: 100%;
    margin-top: -8px;
    padding-left: 3%;
    padding-right: 3%;
    padding-bottom: 60px;

    .accordion-button {
      color: rgb(26, 57, 90);
      font-size: 16px;
      font-weight: 600;
    }

    /* Styling when the accordion is open */
    .accordion-button:not(.collapsed) {
      background-color: white;
      color: var(--secondary-color) !important; /* Change text color to white */
    }

    /* Reduce blue focus border size */
    .accordion-button:focus {
      box-shadow: 0 0 0 2px #b2c4d4 !important; /* Sets the border size to 1px with the default Bootstrap blue */
      outline: none !important; /* Removes the outline for consistency */
    }

    .accordion-body{
      color: #333333;
    }
  }

  > .div {
    width: 100%;
    /* border: 1px solid red; */
    height: 80vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    > .div-one {
      width: 70%;
      margin-bottom: 6vh;
      /* border: 1px solid cyan; */
      > h1 {
        color: white;
        text-align: center;
        font-size: 28px;
        font-weight: var(--font-weight-regular);
      }
    }

    > .div-two {
      /* border: 1px solid red; */
      margin: 0;
    }
  }

  > .footer-container-outer {
    background-color: #000;
    width: 100%;

    .footer-container-inner {
      display: flex;
      flex-direction: column;
      margin-top: 16vh;

      > .footer-info {
        /* border: 1px solid red; */
        display: flex;
        flex-direction: column;
        align-items: center;
        > div {
          width: 90px;
          margin-bottom: 2.5vh;
          > img {
            width: 100%;
          }
        }
        > p {
          width: 75%;
          text-align: center;
          font-weight: var(--font-weight-regular);
          color: white;
        }
      }

      > .footer-links {
        margin-top: 10vh;
        margin-bottom: 10vh;
        display: flex;
        flex-direction: column;
        > h2 {
          font-size: 22px;
          color: white;
          font-weight: 600;
          /* border: 1px solid red; */
          display: inline-block;
          width: fit-content;
          margin-left: 15px;
        }
        > .div {
          /* border: 1px solid red; */
          display: flex;
          margin-left: 20px;
          margin-top: 2.5vh;
          > ul {
            display: flex;
            flex-direction: column;
            row-gap: 6px;
            list-style: none;
            margin: 0;
            padding: 0;
      



            > .footer-item {
              text-wrap: nowrap;
              > a {
                text-decoration: none;
                color: #454343;
                cursor: pointer;
                font-size: 16px;
                font-weight: var(--font-weight-light);
                transition: 0.3s ease-in-out;

                &&:hover{
                  color: var(--secondary-color);
                  
              }

                > i {
                  margin-right: 5px;
                }

                > svg {
                  margin-right: 5px;
                }
              }
            }
          }

           

        }
      }

      > .Address {
        margin-bottom: 10vh;
        display: flex;
        flex-direction: column;
        > h2 {
          font-size: 22px;
          margin-bottom: 2.5vh;
          color: white;
          font-weight: 600;
          /* border: 1px solid red; */
          display: inline-block;
          width: fit-content;
          margin-left: 15px;
        }

        > .location {
          display: flex;
          align-items: self-start;
        }

        > a {
          margin-top: 6px;
          text-wrap: nowrap;
          text-decoration: none;
          color: #454343;
          cursor: pointer;
          font-size: 16px;
          font-weight: var(--font-weight-light);
          margin-left: 20px;
          cursor: pointer;
          transition: 0.3s ease-in-out;

          &&:hover{
            color: var(--secondary-color);
          }

          > i {
            margin-right: 5px;
          }

          > svg {
            margin-right: 5px;
            fill: currentColor;
            
          }
        }
      }
      .card-social {
        width: fit-content;
        height: fit-content;
        /* background-color: rgb(238, 238, 238); */
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 25px 25px;
        width: 100%;
        gap: 20px;
      }

      /* for all social containers*/
      .socialContainer {
        width: 52px;
        height: 52px;
        background-color: rgb(44, 44, 44);
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        transition-duration: 0.3s;
      }
      /* Instagram*/
      .containerOne:hover {
        background-color: #d62976;
        transition-duration: 0.3s;
      }
      /* YouTube*/
      .containerTwo:hover {
        background-color: #d50000;
        transition-duration: 0.3s;
      }
      /* Facebook*/
      .containerThree:hover {
        background-color: #3b5998;
        transition-duration: 0.3s;
      }
      /* Whatsapp*/
      .containerFour:hover {
        background-color: #128c7e;
        transition-duration: 0.3s;
      }

      .socialContainer:active {
        transform: scale(0.9);
        transition-duration: 0.3s;
      }

      .socialSvg {
        width: 17px;
      }

      .socialSvg path {
        fill: rgb(255, 255, 255);
      }

      .socialContainer:hover .socialSvg {
        animation: slide-in-top 0.3s both;
      }

      @keyframes slide-in-top {
        0% {
          transform: translateY(-50px);
          opacity: 0;
        }

        100% {
          transform: translateY(0);
          opacity: 1;
        }
      }

      .connect {
        > h2 {
          font-size: 22px;
          color: white;
          font-weight: 600;
          /* border: 1px solid red; */
          display: inline-block;
          width: fit-content;
          margin-left: 15px;
        }
      }
    }
  }
}

.copyright {
  background-color: black;
  border-top: 0.5px solid rgb(44, 44, 44);
  padding-top: 10px;
  padding-bottom: 10px;
  > p {
    text-align: center;
    font-weight: var(--font-weight-regular);
    color: #454343;
    line-height: 18px;

    > span {
      font-size: 10px;
      >a{
        display: inline-block;
        text-decoration: none;
        color: var(--secondary-color);
        transition: 0.5s ease;

        &&:hover{
          transform: scale(1.3);
          color: var(--secondary-color);
        }
      }
    }
  }
}

/* ABOUT SECTION STARTS */

.about-background::before{
  content: "";
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  position: absolute;
  background: rgba(0, 0, 0, 0.7); /* This is the dark overlay */
  z-index: 1;
}

.about-background{
  /* border: 10px solid red; */
  position: relative;
  height: 65vh;
  background-size: cover;
  

  >.about-backoverlay{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(Images/about\ shikara.jpeg);
    background-position: 50% 20%;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
  }

  >.a-content-one{
    position: relative;
    z-index: 2;
    padding-top: 35vh;

    >h2{
      color: white;
      font-size: 52px;
      font-weight: var(--font-weight-bold);
      text-align: center;
      text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.8);
    }
  }
}
.a-sec-1-outer{
  display: flex;
  width: 100%;
  /* height: 65vh; */
  /* border: 1px solid red; */
  margin-top: 7vh;
  justify-content: center; 

  >.a-sec-1{
    width: 100%;
    display: flex;
    flex-direction: column-reverse;
    margin-top: 3vh;
    /* border: 1px solid black; */
   
  
    >.a-sec-1-left{
      width: 100%;
      height: 60vh;
      margin-top: 40px;
      /* border: 1px solid red; */
  
      >.a-carousel{
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
  
        >.carousel-inner{
          position: relative;
        width: 100%;
        height: 100%;
  
          >.carousel-item{
            position: relative;
            width: 100%;
            height: 100%;
  
            >img{
              width: 100%;
              height: 100%;
              aspect-ratio: 16/9;
              object-fit: cover;
              /* border: 1px solid black; */
            }
          }
        }
      }
    }
  
    >.a-sec-1-right{
      width: 100%;
      /* height: 100%; */
      display: flex;
      justify-content: center;
  
      >div{
        /* border: 1px solid red; */
        width: 85%;
        height:min-content;
        >h2{
          font-size: 32px;
          font-weight: var(--font-weight-bold);
        }
  
        >p{
          margin-top: 3vh;
          font-size: 17px;
          color: #323232;
          font-weight: var(--font-weight-regular);
        }
      }
     
    }
  }
  
  
}

.a-sec-2{
margin-bottom: 10px;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: fit-content;
  margin-top: 12vh; 
  /* border: 1px solid red; */

  >.a-sec-2-left{
    /* border: 1px solid red; */
    width: 95%;
    display: flex;
    flex-direction: column;
    align-items: center;

    >.a-sec-2-left-top{

      /* border: 1px solid red; */
      width: 85%;
      >h2{
        text-align: left;
        font-size: 32px;
        font-weight: var(--font-weight-bold);
        margin-bottom: 20px;
      }

      >p{
        font-weight: var(--font-weight-regular);
        color: #454343;
        text-align: left;
        font-size: 17px;
        
      }
    }

    >.a-sec-2-left-bottom{
      width: 85%;
      margin-top: 40px;

      >h2{
        text-align: left;
        font-size: 32px;
        font-weight: var(--font-weight-bold);
        margin-bottom: 20px;
      }

      >p{
        font-weight: var(--font-weight-regular);
        color: #454343;
        text-align: left;
        font-size: 17px;
        
      }
    }
  }

   >.a-sec-2-right{
    width: 100%;
   height: 70vh;
   margin-top: 80px;
  
    >.a-carousel{
      width: 100%;
      height: 100%;
      background-repeat: no-repeat;
      background-size: cover;
      background-position: center;
  
      >.carousel-inner{
        position: relative;
      width: 100%;
      height: 100%;
  
        >.carousel-item{
          position: relative;
          width: 100%;
          height: 100%;
  
          >img{
            width: 100%;
            height: 100%;
            aspect-ratio: 16/9;
            object-fit: cover;
            /* border: 1px solid black; */
           }
        }
      }
    }
  }

} 

.a-seven-outer{
  /* border: 1px solid black; */
  margin-top: -65px;
}

.a-seven-inner{
  /* border: 1px solid red; */

  /* margin-top: -30px; */
  /* overflow: hidden; */
}



/* ABOUT SECTION ENDS */


/* CONTACT SECTION STARTS */

.c-tag{
  /* border: 1px solid red; */
  text-align: center;
  margin-top: 10vh;
  margin-bottom: 8vh;

  >p{
    /* border: 1px solid red; */
    font-weight: var(--font-weight-bold);
    font-size: 19px;
    letter-spacing: 2px;
    margin: 0;
    color: var(--secondary-color);
  }
  >h2{
    /* border: 1px solid red; */
    margin: 0;
    margin-top: 10px;
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    letter-spacing: 1px;

  }
}


.c-c-1{
  width: 100%;
  height: fit-content;
  /* border: 1px solid black; */
  display: flex;
  justify-content: center;

  >.c-c-1-inner{
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    height: fit-content;
    /* border: 1px solid red; */
    justify-content: space-around;

    >div{
      display: flex;
      justify-content: center;
      padding-top: 20px;
      width: 90%;
      height: 25vh ;
      text-align: center;
      background-color: white;
      border: 2px solid #f2f2f2;
      border-radius: 50px;
      box-shadow: 2px 2px 4px #e7e6e6;
      margin-bottom: 20px;
      transition: 0.3s ease-in-out;
      

      &&:hover{
        box-shadow: 2px 2px 4px #bdbdbd;
      }

      >a{
        text-decoration: none;

        >i{
          color: var(--secondary-color);
        }

       >h3{
       margin: 0;
       margin-top: 10px;
       margin-bottom: 5px;
       color: var(--color-blue);
       font-weight: var(--font-weight-bold);
       }

       >span{
        color: #454343;
        font-size: 16px;
        font-weight: var(--font-weight-regular);
       }
      }
    }
  }
}

.c-c-2{
  width: 100%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 5vh;
  /* border: 1px solid red; */
  background-image: url(Images/contact-main-bg.jpg);
  background-size: contain;


  >.c-c-2-left{
    width: 95%;
    border: 1px solid #bdbdbd;
    border-radius: 45px;
    overflow: hidden;

    &&:hover{
      box-shadow: 2px 2px 4px #8c8c8c;
    }

    >iframe{
      width: 100%;
    }
  }

  >.c-c-2-right{
    margin-top: 5vh;
    margin-bottom: 13vh;
    width: 90%;
    height: fit-content;
    border-radius: 45px;
    background-image: url(Images/bg-3.jpg);
      background-size: cover;
    /* border: 1px solid cyan; */


    

    >form{
      display: flex;
      flex-direction: column;
      align-items: center;
      background: rgba(43, 43, 43, 0.2);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px); /* For Safari support */
  border: 1px solid rgba(255, 255, 255, 0.3);
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      border-radius: 45px;
      overflow: hidden;

      
      >h2{
        text-align: center;
        font-size: 30px;
        font-weight: var(--font-weight-medium);
        width: 100%;
        padding: 20px;
        text-shadow: 1px 1px 3px white;
        /* background-color: var(--secondary-color); */
        
      }

      >p{
        width: 75%;
        font-size:15px;
        text-shadow: 1px 1px 2px rgb(216, 179, 179);
        color: #454343;
      }

      >input{
        width: 70%;
        height: 45px;
        padding: 15px;
        border: 1px solid rgb(231, 231, 231);
        margin-bottom: 15px;
        transition: 0.3s ease-in;

        &&:hover{
          border: 3px solid rgb(160, 160, 255);
        }

        &&:focus {
          border: 1.5px solid rgb(160, 160, 255);
          box-shadow: 2px 2px 4px rgb(160, 160, 255);
          outline: none;
        }        
      }

      >textarea{
        display: flex;
        width: 70%;
        height: 120px;
        padding: 15px;

        border: 1px solid rgb(231, 231, 231);
        transition: 0.3s ease-in-out;

        &&:hover{
          border: 3px solid rgb(160, 160, 255);
        }

        &&:focus {
          border: 1.5px solid rgb(160, 160, 255);
          box-shadow: 2px 2px 4px rgb(160, 160, 255);
          outline: none;
        }  
      }

      >button{
        margin-top: 15px;
        width: 70%;
        height: 55px;
        padding: 15px;
        background-color: var(--color-blue);
        color: white;
        box-shadow: 2px 2px 6px rgb(160, 160, 255);
        margin-bottom: 3vh;
        border: none;
      }
    }
  }

  
}

/* CONTACT SECTION ENDS */



/* DESTINATION SEC STARTS */

.d-tag{
  display: flex;
  /* border: 1px solid red; */
  width: 100%;
  justify-content: space-evenly;
  align-items: center;
  /* text-align: center; */
  margin-top: 8vh;
  
  
  >h2{
    margin: 0;
    display: flex;
    justify-content: center;
    text-align: center;
    word-wrap: break-word;
    font-weight: var(--font-weight-bold);
    font-size: 34px;
    letter-spacing: 1.2px;
    flex-wrap: wrap;
    text-wrap-style: balance ;
    
    >span{
      color: var(--secondary-color);
    }
  }
}

.d-tag::before{
  content: "";
  width: 10vw;
  height: 3px;
  background-color: var(--secondary-color);
}

.d-tag::after{
  content: "";
  width: 10vw;
  height: 3px;
  background-color: var(--secondary-color);
}

.d-cards-c{
  /* border: 1px solid red; */
  margin-top: 8vh;
  padding-bottom: 3vh;
  height: auto;
  display: grid;
  grid-template-columns: 1fr;
  grid-auto-rows: minmax(500px, 60vh);
  justify-content: center;
  row-gap: 20px;

  >.card:first-child{
    margin-top: 20px;
  }

  >.card:last-child{
    margin-bottom: 20px;
  }

  >.card{
    /* border: 1px solid black; */
    /* width: 90vw; */
    /* min-height: 500px;
    height: 70vh; */
    position: relative;
    border: 2px solid #f2f2f2;
    box-shadow: 4px 4px 8px #e7e6e6;
    transition: 0.3s ease-in-out;
    animation: fadeIn;
    animation-delay: 0.2s;

    &&:hover{
      box-shadow: 4px 4px 8px #bdbdbd , -4px -4px 8px #bdbdbd;
    }

    >img{
      /* border: 1px solid cyan; */
      height: 45%;
      position: relative;
      object-fit: cover;
      object-position: center;
    }

    >.kms{
      display: flex;
      align-content: center;
      justify-content: center;
      position: absolute;
      /* border: 1px solid green; */
      background-color: var(--secondary-color);
      /* width: 70%; */
      min-width: 250px;
      max-width: 70%;
      padding-left: 20px;
      padding-right: 10px;
      height: 30px;
      bottom: 52%;
      left: 50%;
      transform: translateX(-50%);
      box-shadow: 2px 2px 4px rgb(160, 160, 255);

      >p{
        padding: 0;
        margin: 0;
        font-size: 15px;
        font-weight: var(--font-weight-medium);
        margin: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        /* border: 1px solid cyan; */
        color: #2C2C2C;

        >i{
          margin-right: 8px;
          font-size: 15px;
        }
        
      }
    }

    >.card-body{
      /* border: 1px solid red; */
      position: relative;


      >.card-title{
        margin: 0;
        padding: 0;
        /* border: 1px solid cyan; */
        margin-top: 40px;
        margin-bottom: 5px;
        color: var(--color-blue);

        >i{
          margin-right: 10px;
          color: var(--secondary-color);
        }
      }

      >.card-text{
        margin: 0;
        /* border: 1px solid cyan; */
        margin-top: 10px;
        margin-bottom: 10px;
        color: #454343;
      }

      >.card-btn{
        display: flex;
        align-items: center;
        justify-content: center;
        position: absolute;
        /* border: 1px solid cyan; */
        bottom: 20px;
        height: 40px;
        width: 130px;
        text-decoration: none;
        color: var(--color-blue);
        font-weight: var(--font-weight-medium);
        background-color: var(--secondary-color);
        box-shadow: 2px 2px 4px rgb(160, 160, 255);

        &&:hover{
          box-shadow: 2px 2px 4px rgb(105, 105, 254);
        }

      }
    }
  }
}
/* DESTINATION SEC ENDS */

.d-info{
  margin-top: 8vh;
  margin-bottom: 14vh;
  /* border: 1px solid red; */
 display: flex;
 flex-direction: column;
 width: 100%;
 height: fit-content;
 align-items: center;
 padding: 10px;
 /* margin-bottom: 15vh; */

  >.d-group{
    /* border: 1px solid red; */

  >.d-info-image{
    width: 100%;
    height: 50vh;

    >.carousel-inner{
      position: relative;
      width: 100%;
      height: 100%;
      /* border: 1px solid red; */

      >.carousel-item{
        position: relative;
        width: 100%;
        height: 100%;

        >img{
          width: 100%;
          height: 100%;
          aspect-ratio: 16/9;
          object-fit: cover;
        }

        >.carousel-caption{
          >h5{
            color: #f5f5f5;
            text-shadow: 2px 2px 4px black;
          }
        }
      }
    }
  }

  >.d-info-info{
    width: 100%;
    margin-top: 20px;
    

    >h2{
     font-family: fantasy;
     font-weight: var(--font-weight-bold);
     font-size: 32px;

     >i{
      margin-right: 15px;
     }
    }

    >h5{
      margin-top: 10px;
      margin-bottom: 10px;
      font-size: 20px;
      color: var(--color-blue);

      >i{
        margin-right: 7px;
      }
    }

    >p{
      padding: 3px;
      margin-top: 10px;
      margin-bottom: 10px;
      color: #454343;
      font-weight: var(--font-weight-regular);
    }
  }
}

  >.p-o-i{

    width: 100%;
    border: 1px solid #b8b4b4;
    overflow: hidden;
    border-radius: 40px;
    margin-top: 20px;
    >h2{
      margin: 0;
      font-size: 32px;
      font-family:'Times New Roman', Times, serif;
      background-color: var(--secondary-color);
      text-align: center;
      padding: 7px 0px;
    >i{
        margin-right: 7px;
      }
    }
    >ul{
      margin: 0;
      list-style-type: "\21AA";
      margin:14px 0px;

      >li{
        padding-left: 20px;
        color: var(--color-blue);
        font-family: 'Times New Roman', Times, serif;
        font-size: 20px;
      }
    }
  }
}

/* DESTINATION SEPERATE ENDS */





@media (min-width: 768px) {

  .container-one {
    height: 88.5vh;
  }
  
  .container-two-cover {
    /* border: 1px solid red; */
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 8vh;
  }
  
  .container-two {
    /* border: 1px solid red; */
    width: 95%;
    height: 75vh;
    display: flex;
    flex-direction: row;
  }
  
  .left {
    /* border: 1px solid red; */
    width: 50%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: start;
    padding: 10px;
  }
  
  .left-content {
    margin-top: 10vh;
    display: flex;
    width: 90%;
    flex-direction: column;
    justify-content: space-between;
  
    h2 {
      /* border: 1px solid black; */
      text-align: start;
      font-size: 28px;
      font-weight: 600;
      margin-bottom: -1.5vh;
    }
  
    h4 {
      text-wrap-style: stable;
      color: #e56e44;
      font-weight: var(--font-weight-light);
      font-size: clamp(16px, 1.5vw, 18px);
      text-align: start;
      margin-bottom: -1.5vh;
      width: 100%;
    }
  
    p {
      line-height: 22px;
      font-size: clamp(15px, 1vw, 18px);
      font-weight: var(--font-weight-regular);
      text-wrap-style: pretty;
      text-align: start;
      color: #333333;
    }
  }
  
  .btn-know {
    display: inline-block;
  width: 75%;
  margin-top: 6vh;
  }
  
  .know-more {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 60px;
    font-size: 15px;
    color: white;
    background-color: var(--color-blue);
    box-shadow: -2px 2px 3px rgb(80, 48, 48);
    margin-left: 1px;
  }
  
  .right {
    width: 50%;
    height: 100%;
    display: grid;
    grid-template-columns: repeat(2, 1fr); 
    grid-template-rows: repeat(3, 1fr);
    gap: 20px; 
  }

  .gallery{ 
    
    height: 100%;

    >img {
    width: 100%;
    height: 100%;
    object-fit: cover; 
    object-position: 50% 60%;
  }
}


  .img-two {
    grid-row: span 2; 
    
  }
  
  .img-three {
    grid-row: span 2; 
    
  }
  
  
  .container-three-inner {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    width: 89.5%;
    justify-content: center;
    gap: 40px;
  }
  
  
  .cards-inner {
    padding: 50px;
    width: 100%;
    height: 100%;

    >.cards-icon{
      display: flex;
      justify-content: start;
      align-items: center;
    }

    >h2 {
      text-align: start;
    }
    >p {
      text-align: start;
    }
  }

  
  .container-four-inner {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
  }

  .container-five-outer{
    height: 400px;
  }

  .container-five-inner {
    width: 100%;
    display:flex;
    align-items: center;
    justify-content: space-evenly;
  
    >h2 {
      width: 50%;
      margin-left: -150px;
    }
  }
  
  .btn-contact {
    width:15%;
    margin-top: 1px;
    margin-left: -200px;
  }


  .container-six-outer {
    
  
  
    > .container-six-inner {
      display: inline-block;
      width: 90%;
      /* height: 100%; */
      /* border: 1px solid pink; */
  
  
      > .container-six-content {
        display: grid;
        width: 100%;
        grid-template-columns: repeat(3, 1fr);
        padding-top: 0px;
        /* border: 1px solid red; */
        
       
        
        
  
  
  
          >.package {
    
            height: 100%;
            width: 80%;
  
            > .packageImage {
              width: 100%;
              height: 200px;
              /* border: 1px solid red; */
              overflow: hidden;
  
              > img {
                width: 100%;
                height: 100%;
                /* border: 1px solid red; */
                aspect-ratio: 4/3;
                object-fit:cover;
                object-position: 50% 50%;
              }
            }
          }

          >.group{
            >.packageImage{
              >img{
                object-position: 50% 20%;
              }
            }
          }
      }
    }
  }


  .container-seven-outer {

  
    > .div {
      height: 75vh;
    }
  
    > .footer-container-outer {
      background-color: #000;
      width: 100%;
  
      .footer-container-inner {
        display: grid;
        grid-template-columns: 3fr 1fr 1.5fr 2fr;
        margin-top: 16vh;
        align-content: start;
  
        > .footer-info {
          margin-top: -40px;
        

          > div { 
            width: 99%;
            >img{
              min-width: 120px;
              max-width: 121px;

            }
         
          }
          > p {
            text-align: start;
            width: 95%;
          }
        }
  
        > .footer-links {
          margin-top: 0vh;
        }

        .card-social{
          /* border: 1px solid red; */
          display: flex;
          flex-wrap: wrap;
          width: fit-content;
          margin-left: 40px;
        }
  
        .connect{
          
          >h2{
            /* border: 1px solid red; */
            margin-left: 50px;

          }
        }
      }
    }
  }



  /* ABOUT SEC STARTS */

  .a-sec-1-outer{

  >.a-sec-1{
    width: 98.5%;
    height: 65vh;
    display: flex;
    flex-direction: row;
    margin-top: 0px;
    /* border: 1px solid black; */

    >.a-sec-1-left{
      width: 50%;
      height: 100%;
      margin-top: 0px;
      /* border: 1px solid pink; */
    }

    >.a-sec-1-right{
      width: 48%;
      /* border: 1px solid red; */
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
  
      >div{
        /* border: 1px solid red; */
        width: 85%;
        /* height:min-content; */
        >h2{
          font-size: 32px;
          font-weight: var(--font-weight-bold);
        }
  
        >p{
          margin-top: 3vh;
          font-size: 17px;
          color: #323232;
          font-weight: var(--font-weight-regular);
        }
      }
     
    }
  }
}

.a-sec-2-outer{
  display: flex;
  justify-content: center;
>.a-sec-2{
  margin-bottom: 0px;
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 98.5%;
  height: 80vh;
  margin-top: 12vh; 
  /* border: 2px solid red; */

  >.a-sec-2-left{
    /* border: 1px solid red; */
    width: 50%;
    


    >.a-sec-2-left-top{
      >h2{
        text-align: right;
      }

      >p{
        text-align: right;
      }
    }

    >.a-sec-2-left-bottom{

      >h2{
        text-align: right;
      }

      >p{
        text-align: right;
        
      }
    }
  }

  >.a-sec-2-right{
    width: 50%;
    height: 100%;
    margin-top: 0px;
   
   } 
  }
}

.a-seven-outer{
  /* border: 1px solid red; */
  margin-top: 10px;
}
/* ABOUT SEC ENDS */

/* CONTACT SEC STARTS */
.c-c-1{
>.c-c-1-inner{
  /* border: 1px solid red; */
  display: flex;
  /* justify-content: space-around; */
  width: 100%;
  height: 25.4vh;

  >div{
    min-width: 250px;
    max-width: 25%;
    margin: 0;
    
  }

}
}

.c-c-2{
  display: flex;
  flex-direction: row;
  justify-content: center;
  width: 100%;
  height: 90vh;
  /* border: 1px solid red; */

  

  >.c-c-2-left{
    width: 50%;
    height:100%;
    margin: 0;
    /* border: 1px solid black; */
    margin-right: 20px;

    >iframe{
      width: 100%;
      height: 100%;
    }
  }
  
  >.c-c-2-right{
    width: 40%;
    height: 100%;
    margin: 0;
    margin-left: 20px;

    >form{
  height: 100%;

      
    }
  }
}

/* CONTACT SEC ENDS */

/* DESTIONATION SEC STARTS */

.d-cards-c{
  width: 90%;
  /* border: 1px solid red; */
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  column-gap: 20px;
  

  >.card:first-child{
    margin-top: 0px;
  }

  >.card:last-child{
    margin-bottom: 0px;
  }
}  

/* DESTIONATION SEC ENDS */


/* DESTINATION SEPERATE STARTS */

.d-info{
  margin:0;
  /* border: 1px solid red; */
  display: grid;
  grid-template-columns: 1fr 0.7fr;
  column-gap: 80px;
  align-items: center;

  >.d-group{

    >.d-info-image{
      height: fit-content;
    }

}

>.p-o-i{
  height: fit-content;
  margin: 0;

  >ul{
    display: flex;
    flex-direction: column;
    row-gap: 20px;
  }
}
}

/* DESTINATION SEPERATE ENDS */




}






  

 
   
  
 
  
  






@media (max-width: 1024px) {
  .ham {
    display: flex;
  }


 nav {
    position: absolute;
    top: 0;
    left: -100%;
    opacity: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(56, 56, 56, 0.8);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    border-bottom-right-radius: 10px;
    transition: left 0.4s ease-in-out, opacity 0.4s ease-in-out;
  }


  ul {
    display: flex;
    flex-direction: column;
    align-items: start;
    height: fit-content;
    row-gap: 30px;
    padding-left: 20px;
    margin-top: 22dvh;
  }

  
}