body {
    margin: 0;
    padding: 0;
    font-family: "Inter", sans-serif;
    font-optical-sizing: auto;
    font-weight: <weight>;
    font-style: normal;
    font-variation-settings: "slnt" 0;
    background-color: #F5F5DC;
  }
  .image {
    width="30%";
  }
  .sidebar {
    margin: 0;
    padding: 0;
    width: 100px;
    background-color: #55917F;
    position: fixed;
    height: 100%;
    overflow: auto;
    text-align: center;
    transition: transform 0.3s ease;
    position: fixed; top: 0; left: 0;
  }
  
  .sidebar.hidden {
    transform: translateX(-100%);
  }
  
  hr {
    border: 1px solid #36454F;
    width: 80%;
  }
  
  /* Sidebar links */
  .sidebar a {
    display: block;
    color: black;
    padding: 16px;
    text-decoration: none;
  }
  .menu-btn {
      opacity: 0;
  }
  /* Links on mouse-over */
  .sidebar a:hover:not(.active) {
    color: white;
    transform: scale(1.3);
  }
  
  div.content {
    margin-left: 150px;
    padding: 1px 16px;
    height: 1000px;
    text-align: center;
  }
  @media screen and (min-width: 700px)  {
      .mobile-break { display: none; }
  }
  @media screen and (max-width: 700px) {
    .image {
        width: 80%;
    }
    .sidebar {
      position: fixed;
      top: 0;
      left: 0;
      transform: translateX(-100%);
    }
    
    .sidebar.show {
      transform: translateX(0);
    }
    
    .sidebar a {
      float: left;
    }
  
    div.content {
      margin-left: 0;
    }
  
    .menu-btn {
      opacity: 1;
      display: block;
      background-color: #55917F;
      color: white;
      padding: 10px;
      border: none;
      cursor: pointer;
      font-size: 20px;
      position: fixed;
      top: 10px;
      left: 10px;
      z-index: 1000;
    }
  }
        .orange {
            display: inline-block;
           font-size: 60px;
           color: #CC5500;
           
        }
        
  
  .text {
          font-size:39px;
          color:#36454F;	
  }
  .logos {
      text-align: center;
      font-size:40px;
      color:#36454F;	
  }
  .logostext {
      font-size:16px;
      color:#36454F;	
  }
  .github {
      font-size:50px;
      color:#36454F;	
  }
  html {  
        scroll-behavior: smooth;  
  }
         .accessibility-btn {
              position: fixed;
              bottom: 2%;
              right: 2%;
              background-color: #000;
              color: #fff;
              padding: 10px;
              border: none;
              cursor: pointer;
              z-index: 1000;
          }
          .high-contrast {
              background-color: #000;
              color: #fff;
              .text {
                  color:#fff;
              }
              .logos {
                  color:#fff;
              }
              .logostext {
                  color:#fff;
              .github {
                  font-size:50px;
                  color:#fff;	
              }
              hr {
                  border: 1px solid white;
                  width: 80%;
              }
              a { 
                  color: white;
              }
          }