@media screen and (max-width: 600px) {
  input[type='text'],
  input[type='number'],
  textarea {
    font-size: 16px;
  }

  h1 {
    font-size: 1.5em;
  }

  .hide_on_mobile {
    display: none;
  }

  #pac-input {
    width: 150px;
    height: 44px;
  }

  #table caption {
    font-size: 1.3em;
  }

  #table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }

  #table tr {
    /*border-bottom: 3px solid #ddd;*/
    display: block;
    margin-bottom: 8px;
  }

  #table td {
    display: block;
    /*font-size: .8em;*/
    text-align: right;
    border: 0;
    border-bottom: 1px dotted #b0adae;
  }

  #table td:empty::after {
    content: "\00a0";
  }

  #table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
  }

  #table td:last-child {
    border-bottom: 0;
  }

  .width0, .width33, .width50, .width100 {
    width: auto;
  }

  #table tr, #table tr:hover {
    background-color: #ebecee;
  }
}