/* MOBILE DEVICES (max-width: 767px) */
@media (max-width: 767px) {
    /* Navbar adjustments */
    .head {
    height: 20%;
  }
    .head .navbar {
      


      position: absolute;
      top: 105px;
      right: 0;
      background: var(--clr1);
      flex-direction: column;
      width: 144%;
      height: 200%;
      display: none;
    }
  
    .head .navbar .active {
      max-height: 500px;
    }
  
    .head .navbar a {
      padding: 1rem;
      border-top: 1px solid var(--clr3);
      left: 5rem;
    }
  
    #menu-bar {
      display: block;
      scale: 2;
    }
  
    /* Banner-section adjustments */
    .text-box {
      padding: 10px 20px;
    }
  
    .text-box h2 {
      font-size: 18px;
    }
  
    .dot {
      width: 10px;
      height: 10px;
    }
  
    .dots {
      bottom: 10px;
    }
  
    /* Container adjustments */
    .container {
      flex-direction: column;
      height: auto;
    }
  
    .left, .right {
      width: 100%;
      padding: 15px;
      min-height: 300px;
    }
  
    .left {
      height: 50vh;
    }
  
    .right h2 {
      font-size: 2rem;
    }
  
    .right p {
      font-size: 1.6rem;
      padding-top: 1rem;
    }
  
    /* Overlay image adjustments */
    .overlay-text {
      font-size: 2rem;
    }
  
    /* Video section adjustments */
    .youtube {
      grid-template-columns: 1fr;
    }
  
    /* Footer adjustments */
    .footer {
      width: 100vw;
      height: 18vw;
    }


    .logok img {
 height: 40px; /* Adjust height as needed */
  width: auto;
  object-fit: contain;
  padding-right:20px;
      margin-left:0.001px;
}
  }