body{
    padding:0.2em;
}

table#main{
  width:100%;
  max-width:480px;
}
table#main tbody tr td{text-align: center;}
table#main tbody tr#toeterRij td:first-of-type{vertical-align: top;}
table#main tbody tr#toeterRij{display: none;}
table#main tbody tr#luisterRij{display: none;}
table#main tbody tr#verzendRij{display: none;}
input:focus{
  outline: none;
}

input#kenteken{
  width: 6em;
  background-color: #e5be01;
  color: #000;
  border: 2px solid #333;
  border-radius: 4px;
  font-family: Roboto, Geneva, Arial, sans-serif;
  font-size: 2em;
  font-weight: bold;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  text-align: center;
  margin-top:1em;
  margin-bottom:1em;
}
::placeholder {
  color: #c59e01;
  opacity: 1; /* Firefox */
}
:-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #c59e01;
}
::-ms-input-placeholder { /* Microsoft Edge */
   color: #c59e01;
}

input[type=button]{
  width: 6em;
  height: 6em;
  border-radius: 1em;
  font-size:1.5em;
  cursor:pointer;
}
div#berichten, div#getoeter{
  text-align:left;
  height:25vh;
  overflow-y:auto;
  background-color:#eee;
  font-size:1.5em;
}
div#berichten,input#zoek{
  padding:1px;
  border-width:2px;
  border-style:inset;
  background-color:#ffe;
  margin-bottom:2px;
}
input#zoek, div#berichten, div#getoeter{
  width:95vw;
  font-size:1.25em;
}
div#berichten div, div#getoeter div{
  width:95vw;
  font-family:Verdana;
  height:1.4em;
  line-height:1.4em;
  display:inline-block;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
div#berichten div.odd{
  background-color:#eed;
}
div#getoeter div.odd{
  background-color:#ddd;
}
div#berichten div.selected{
  background-color:#bbb;
  color:#fff;
}
div#berichten div em{
  font-style:normal;
  color:red;
}