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

  .welcome-contact {
    background-size: cover; /* Use cover to ensure the background image covers the container */
  
  }
    .mobile {
        display: block;
    }

    .hidden-mob {
        display: none;
      }
      .open-nav-btn {
        font-size: 4em;
        padding-left: 1rem;
        position: fixed;
        color: white;
        visibility: visible;
        display: block;
        z-index: 999;
      }#scrollBtn {
        visibility: hidden;
      }.open-nav {
          font-size:3rem;
          cursor:pointer;
          color: white;
          z-index: 100;
          display: block;
      }#mySidenav {
          display:block;
      }.sidenav {
              height: 100%;
              width: 0;
              position: fixed;
              z-index: 2;
              top: 0;
              left: 0;
              background-color: white;
              overflow-x: hidden;
              transition: 0.5s;
              padding-top: 60px;
              visibility: visible;
              display: flex;
              font-family: 'Roboto',Arial, Helvetica, sans-serif;
      }.sidenav a {
              padding: 8px 8px 40px 32px;
              text-decoration: none;
              font-size: 3rem;
              color: black;
              display: block;
              transition: 0.3s;
      }.sidenav a:hover {
              color: #f1f1f1;
      }.sidenav .closebtn {
              position: absolute;
              top: 0;
              right: 25px;
              font-size: 3rem;
              margin-left: 50px;
              visibility: visible;
      } .sidenav h1 {
        padding: 0px 8px 40px 32px;
              text-decoration: none;
              font-size: 2rem;
              color: black;
      }.mainHeader {
        display: none;
        visibility: none;
      }header {
        z-index: 1;
      }header h1 {
        padding-top: 0.5rem;
      }
      
}