body{width:980px;margin:0 auto;text-align:center;font-family:verdana,georgia,arial;font-size:15px;background:linear-gradient(#000, #305);text-align:center}
header{background:#508;color:#C6F}
header h1{font-size:40px;text-align:left;text-shadow: 3px 3px 5px #ecf;margin:0;padding:0 0 0 20px;text-transform:uppercase}
header p{text-align:right;font-size:17px}
h2{font-size:17px;text-align:center;margin:25px 0 0 0}
img{border:0px}
a{color:#408;font-style:oblique}
a:hover{color:#93F}
#wrapper{width:980px;color:black;margin:0;padding:0;background:#eeddff;text-align:justify;border:2px solid #204}
#wrapper p{padding:5px 25px;line-height:23px}
#acces{background:linear-gradient(#ff0, #880);width:500px;margin:10px 238px;text-align:center;border:1px solid #305;border-radius:5px;padding:15px 0;font-size:50px}
#acces p{margin:10px}
#acces a{text-transform:uppercase;text-decoration:none;font-weight:bold}
#acces a:hover{color:#080}
nav{margin:20px auto;text-align:left;font-size:13px}
nav ul{list-style-type:none;margin:0;padding:10px}
nav li{float:left;width:290px;border:1px solid #305;background:#dce;margin:10px 5px;padding:10px 5px;text-align:center}
nav a{font-weight:bold;color:#000}
nav a:hover{text-decoration:underline;color:#F13}
footer{text-align:center;padding:20px;clear:both;background:#585570;color:#FFF;font-size:13px}
footer a{color:#ff0}
footer a:hover{color:#0f0}
@viewport {width:device-width;zoom:1}
@media (max-width: 980px) {
    * {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
body,html{width:100%;margin:0;padding:0;font-size:1em;line-height:1.6em}
h1{font-size:1.2em}
#wrapper,header,footer,article,#acces,nav{width:100%;margin:0;padding:5px}
#wrapper{border:0;border-radius:0}
nav li{line-height:2em;width:100%}
}
@media (max-device-width:768px) and (orientation: landscape) {
  html {-webkit-text-size-adjust:100%;-ms-text-size-adjust: 100%}
}