.map-container{
    width: 40vh;
    height: 50vh;
    margin-top: 2rem;
    position: relative;
    flex: 2 2;
    margin-left: 2rem;
  }
  
  #map { position: relative; top: 2vh; bottom: 20vh; left: 10vh; width: 50%; height: 40vh; border-radius: 10px; }
  
  
  #map-menu {
    height: 2rem;
    background-color: rgba(255, 255, 255, 0.7);
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    z-index: 99;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1rem;
  
  }
  
  #map-menu select{
    padding: 2px;
  }

  .map-overlay {
    position: absolute;
    z-index: 100;
    background-color: rgba(255, 255, 255, 0.7);
    left: 0;
    right: 0;
    padding: 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .map-text {
    margin: 2vh;
    font-size: 2vh;
    width: 55vh;
    height: 35vh;
    border: solid;
    background-color:#251B37;
    color:white;
    opacity: 70%;
    border-radius: 10px;    
    align-items:center;
    padding: 20px;
  }

  .link {
    background-color: white;
  }


  @media (max-width: 70rem) {

    .map-container{
      width: 15vh;
      height: 25vh;
      margin-top: 1rem;
      position: relative;
      flex: 2 2;
     
    }

    .map-text {
      display: block;
      font-size: 1.4vh;
      width: 20vh;
      height: 35vh;
      border: solid;
      background-color:#251B37;
      color:white;
      opacity: 70%;
      border-radius: 25px;    
      align-items:center;
     
    }
  
    @media (max-width: 48rem) {

      .map-container{
        width: 42vh;
        height: 8vh;
        margin-top: 0.1rem;
        margin-right:1vh;
        
       
      }
  
      .map-text {
       
        font-size: 1.2vh;
        width: 34vh;
        height: 15vh;
        margin-left: 2vh;
        border: solid;
        background-color:#251B37;
        color:white;
        opacity: 70%;
        border-radius: 10px;    
        align-items:center;
       
      }

      #map { position: relative; top: 2vh; bottom: 2vh; left: -3vh; width: 100%; height: 20vh; border-radius: 10px; }  
  
  }