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

  }

  .container {
      max-width: 100%;
      width: 100%;
      margin: 0 auto;
  }


  /* Hero Section */
  #hero {
      background: #f4f4f4;
      text-align: center;
      padding: 0;
  }



  #hero h1 {
      font-size: 2.5rem;
      margin-bottom: 10px;
  }

  #hero p {
      font-size: 1.2rem;
  }

  #image-links {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 0px;
      margin: 0;
  }

  #image-links {
      width: 100%;
      margin: 0;
      padding: 0;
      box-sizing: border-box;
  }

  #image-links {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0;
      width: 100vw;
  }

  .image-link h2 {
      margin: 10px 0;
      font-size: 1.5rem;
      color: #003366;
  }

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

  .image-link {
      text-align: center;
  }

  .image-link img {
      border-radius: px;
      width: 100%;
  }

  .image-link img,
  picture img {
      width: 100%;
      height: auto;
      display: block;
  }

  .image-link img,
  picture img {
      display: block;
      max-width: 100%;
      height: auto;
  }

  @media (max-width: 767px) {
      .container {
          padding: 0;
      }

      .image-link img {
          width: 100%;
      }
  }

  .picture-sec {
      position: relative;
  }

  .heroForegrounds {
      position: absolute;
      top: 30%;
      left: 10%;
      z-index: 2;
      color: #FFFFFF;
      text-align: left;
      max-width: 50%;
  }

  .imageOverlayBnr {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: transparent;
      z-index: 1;
  }

  .bg.img-responsive {
      display: block;
      width: 100%;
      height: auto;
      position: relative;
      z-index: 0;
  }

  .bannerPara {
      margin-left: 0;
  }

  .p-hg {
      margin-right: 10px;
  }

  .heroHeading span {
      display: block;
      line-height: 1.2;
  }

  section {
      margin: 0;
  }

  section h2 {
      font-size: 2rem;
      margin-bottom: 0px;
  }

  section p {
      font-size: 1.1rem;
  }


  .navbar-dark .navbar-nav .nav-link {
      position: relative;
      margin-left: 25px;
      padding: 35px 0;
      color: #FFFFFF;
      font-size: 18px;
      font-weight: 600;
      outline: none;
      transition: .5s;
  }

  .sticky-top.navbar-dark .navbar-nav .nav-link {
      padding: 20px 0;
      color: #FFFFFF !important;
  }

  .navbar-dark {
      background-color: transparent !important;
      position: absolute;
      width: 100%;
      top: 0;
      left: 0;
      border-bottom: none;
      z-index: 999;
  }

  .sticky-top.navbar-dark {
      background-color: transparent !important;
      position: fixed;
      background: transparent;
  }

  .navbar-dark .navbar-nav .nav-link:hover,
  .navbar-dark .navbar-nav .nav-link.active {
      color: #FFFFFF !important;
  }

  .navbar-dark .navbar-brand .nav-h {
      color: #FFFFFF !important;
  }

  .navbar-dark .navbar-toggler {
      color: #FFFFFF !important;
      border-color: var(--highlight) !important;
  }

  @media (max-width: 991.98px) {
      .sticky-top.navbar-dark {
          position: relative;
          background: transparent;
      }

      .navbar-dark .navbar-nav .nav-link,
      .navbar-dark .navbar-nav .nav-link.show,
      .sticky-top.navbar-dark .navbar-nav .nav-link {
          padding: 10px 0;
          color: #FFFFFF !important;
      }

      .navbar-dark .navbar-brand .nav-h {
          color: #FFFFFF !important;
      }
  }

  @media (min-width: 992px) {
      .navbar-dark .navbar-nav .nav-link::before {
          position: absolute;
          content: "";
          width: 0;
          height: 2px;
          bottom: -1px;
          left: 50%;
          background: var(--highlight);
          transition: .5s;
      }

      .navbar-dark .navbar-nav .nav-link:hover::before,
      .navbar-dark .navbar-nav .nav-link.active::before {
          width: 100%;
          left: 0;
      }

      .navbar-dark .navbar-nav .nav-link.nav-contact::before {
          display: none;
      }

      .sticky-top.navbar-dark .navbar-brand .nav-h {
          color: #FFFFFF !important;
      }
  }

  footer {
      position: relative;
      padding: 20px;
      background: #333;
      color: white;
      text-align: center;
  }

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

  .arrowContainer span {
      display: block;
      width: 10px;
      height: 10px;
      background-color: black;
      /* Or any color */
      margin: 5px;
  }

  .arrowContainer.slideDownDiv span {
      animation: slideDown 1s infinite;
  }

  @keyframes slideDown {
      0% {
          transform: translateY(0);
      }

      50% {
          transform: translateY(10px);
      }

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

  .bulb-hypr {
    max-height: 100px;
    height: 80px;
    animation: jump 1s infinite ease-in-out; /* Jumping animation */
    transition: transform 0.3s ease; /* Smooth scaling on hover */
  }
  
  .bulb-hypr:hover {
    animation-play-state: paused; /* Stop jumping on hover */
    transform: scale(1.1); /* Slightly increase the size */
  }
  
  @keyframes jump {
    0%, 100% {
      transform: translateY(0); /* Original position */
    }
    50% {
      transform: translateY(-20px); /* Jump upwards */
    }
  }