@media only screen and (min-width: 1920px) {
  .showingTripInfo { 
    display: block; 
  }
  #tripInfoHeader > .stopInfoHeader {
    display: none;
  }
  #container.showingTrip {
    width: auto;
    margin: auto;
  }
  #tripButtons {
    margin: 0;
  }
}

@media only screen and (min-width: 1024px) {

  html { 
    font-size: 14px; 
  }  
  
  #container {
    width: 1024px;
    margin: auto;
  }
  #container.showingMap {
    width: auto;
    margin: auto;
  }
  
  .showingStopInfo { 
    display: flex; 
  }
  #menu {
    flex: 0 1 5vh;
  }
  #menu.showingSearchInfo { 
    display: flex; 
  }
    .menuItem {
      padding-left: 3rem;
      padding-right: 3rem;
    }

  #sidemenu {
    height: 95vh;
    top: 5vh;
  }

  #message { 
    font-size: 100%;
    width: 35rem;
  }

  #myStops { 
    flex: 0 0 35rem;
  }
  
  #myStops.showingStopInfo {
    display: block;
  }
   
   #savedStopList, #otherRecentStopList {
     margin-top: 0em;
   }
   
  #getStop {
    flex: 2 0 35rem;
  }
    #getStopContent {
      width: 35rem;
      margin: 0 auto;
    }
      #searchStr { 
        font-size: 100%;
        margin-bottom: 1rem;
      }
      #searchHint {
        max-width: none;
      }
    #map {
      margin: 0em 0.5em 1em 0.5em;
    }
  #stopInfo, #tripInfo {
    margin: 0 0.5rem;
    flex: 1 0 35rem;
  }
    .destinationBox {
      margin: 0.5em 0em;
    }
    .stopInfoTrip, #tripDiagram, #tripMap {
      margin: 0.3em 0em;
    }
    #stopInfo > .button {
      width: 100%;
      margin-left: 0;
      margin-right: 0;
    }

  #tripDiagram, #tripMap {
    border-style: groove;
    border-width: 0.2em;
    border-radius: 3px;
    border-radius: var(--borderradius);
  }

  #contact, #about, #started, #contributors, #privacy, #apps {
    margin: 5% 20%;
  } 

  div.answer, div.question {
    font-size: 100%;
  }
}