body{font-family: sans-serirf;}
@media only screen and (min-width:150px) and (max-width:700px) {
  body {
    color:#000;
   font-family:"Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
   font-size:12px;
   font-size-adjust:none;
    font-style:normal;
    font-variant:normal;
    font-weight:normal;
   width:100%;
 }
 #page {
   width: 98%;
   min-width: 310px;
   margin: 0px auto;
   padding: 0px 0px;
   position: relative;
 }
}
@media only screen and (orientation:portrait) and (min-width:321px) {
 html, body {
    width: 320px;
   min-width: 310px;
   margin: 0px;
    overflow-x: hidden;
 }
 #page {
   width: 320px;
   min-width: 310px;
   margin: 0px;
  }
}
@media only screen and (orientation:portrait) and (min-width:481px) {
 html, body {
    width: 480px;
   min-width: 470px;
   margin: 0px;
    overflow-x: hidden;
 }
 #page {
   width: 480px;
   min-width: 470px;
   margin: 0px;
  }
}
nav{background: #000; height: 52px; width: 100%; position: fixed; top: 0; left: 0;}
nav ul{list-style: none; margin: 0 auto; padding: 0; width: 100%; max-width: 1200px;}
nav ul ul {display: none; position:absolute;top: 100%; left: 0; width: 100%;}
nav ul li {position: relative; float: left; widht: 20%; text-align: center;}
nav ul li:hover ul {display: block;}
nav ul li li{position: relative; float: none; widht: 100%; border: none;}
nav ul li a{display: block; text-decoration: none; color: #138808; padding: 15px 25px; font-size: 1.2em; box-sizing: border-box; border-right: solid 2px #000; border-left:solid 2px #000;}
nav ul ul li a{font-size: 0.7rem; border-bottom: solid 2px #000;}
nav ul ul li:first-child a{border-top: solid 2px #000;}
nav ul li:hover a{background: #000; color: #138808; text-decoration: none; transition: 0,5s;}
nav ul li li:hover a{background: #000; color: #FFF;}