
  
  .main_top_banner-container {
    position: relative;
    z-index: 0;
    /* Ensure the banner is above the rotating image */
    background-color: var(--orange);
    border: 2px solid var(--orange);
    /* Add a border */
    border-radius: 25px;
    /* Curve the border */
    overflow: hidden;
  }
  
  .main_top_banner {
  
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    position: relative;
    z-index: 2;
    /* Further ensure the banner is on top */
  }
  
  .main_top_banner-image {
    width: 30%;
    height: auto;
    border-radius: 10px;
  }
  
  .rotating-image-container {
    width: 30vw;
    /* Adjust size as needed */
    height: 30vw;
    /* Adjust size as needed */
    max-width: 400px;
    /* Maximum size to maintain design */
    max-height: 400px;
    border-radius: 50%;
    overflow: hidden;
    position: absolute;
    top: 60%;
    /* Adjust positioning to overlap with the banner */
    right: 86%;
    /* Adjust positioning as needed */
    animation: rotate 20s linear infinite;
    /* Adjust timing as needed */
    z-index: 1;
    /* Ensure the rotating image stays below the banner */
  }
  
  .rotating-image-container img {
    width: 100%;
    height: auto;
  }
  
  @keyframes rotate {
    from {
      transform: rotate(0deg);
    }
  
    to {
      transform: rotate(360deg);
    }
  }
  
  #navigationmenu{
    height: 50%;
  }
  .main_top_background-video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      object-fit: cover; /* Ensures the video covers the whole area */
       /* Ensures the video stays behind the content */
    }









    









  
    svg.circuit-path {
      position: fixed;
      bottom: 50%;
      right: 50%;
      transform: translate(50%, 50%);
      z-index: -9;
      opacity: 0.5;
      height: 200%;
      width: auto;
    }
    .path {
      animation: draw 20s infinite;
      animation-timing-function: linear;
    }
    .path-01 {
      animation-delay: 0s;
    }
    .path-02 {
      animation-delay: 1s;
    }
    .path-03 {
      animation-delay: 2s;
    }
    .path-04 {
      animation-delay: 3s;
    }
    .path-05 {
      animation-delay: 4s;
    }
    
    @media screen and (min-width: 768px) {
      svg.circuit-path {
        height: auto;
        width: 200%;
      }
    }
    
    /* hero container	*/
    @media screen and (min-width: 768px) {
      .container {
        max-width: 768px;
        padding-top: 25px;
      }
    }
    
    @keyframes draw {
      0% {
      }
      100% {
        stroke-dashoffset: 0;
        stroke-opacity: 1;
      }
    }
    