@media all and (max-width: 30em) {

#content-splash {
  margin-top: 1em!important;
}

.logo-lg {
  position: relative!important;
  bottom: 0!important;
  right: 0!important;
  margin: 0 auto!important;
}


/* Force table to not be like tables anymore */
  table, thead, tbody, th, td, tr { 
    display: block!important; 
  }
  
  /* Hide table headers (but not display: none;, for accessibility) */
  thead tr { 
    position: absolute!important;
    top: -9999px!important;
    left: -9999px!important;
  }
  
  td { 
    /* Behave  like a "row" */
    border: none!important;
    position: relative!important;
    padding-left: 50%!important; 
  }
  
  td:before { 
    /* Now like a table header */
    position: absolute!important;
    /* Top/left values mimic padding */
    top: 6px!important;
    left: 6px!important;
    width: 45%!important; 
    padding-right: 10px!important; 
    white-space: nowrap!important;
  }
  
  /*
  Label the data
  */
  td:nth-of-type(1):before { content: "NMI"; }
  td:nth-of-type(2):before { content: "Meter"; }
  td:nth-of-type(3):before { content: "Address"; }
  td:nth-of-type(4):before { content: "Name"; }
  td:nth-of-type(5):before { content: "Ph Primary"; }
  td:nth-of-type(6):before { content: "Ph Secondary"; }
  td:nth-of-type(7):before { content: "Actions"; }
  td:nth-of-type(8):before { content: ""; }

}

@media all and (max-width: 60em) {

#content-splash {
  background-color: rgba(0,0,0,0.2)!important;
  font-family: 'NettoOT-Regular'!important;
}

.tf, .img-welcome {
  display: none!important;
}

h1 {
  font-size: 2.5em!important;
}

h2 {
  font-size: 2em!important;
}

h3 {
  font-size: 1.5em!important;
}

.opt-selection {
  background-color: rgba(0,0,0,0.15);
  border-radius: 3px;
  margin-bottom: 1em;
}

input[type=text], input[type=email] {
  border: 0!important;
  box-shadow: none!important;
}



}


@media print
{
.noprint { display:none; }
.tf { display: block!important; }

}