body {background: grey; color: black; font-family: Arial, Helvetica, sans-serif; text-align: center;}
span.titulomenu {display: inline-block; font-size: 20px; font-weight: bold; margin: 10px auto 10px;}
#map{display: block; margin: 0; padding: 0; position: absolute; top: 48px; left: 0; right: 0; bottom: 0;}
.clearfix {clear: both;}
nav {background: gradient(linear, center top, center bottom, from(#fff), to(#ccc)); background: -moz-gradient(linear, center top, center bottom, from(#fff), to(#ccc)); background: -webkit-gradient(linear, center top, center bottom, from(#fff), to(#ccc)); background-image: linear-gradient(#fff, #ccc); box-shadow: 0 0 4px 2px rgba(0,0,0,0.4); padding: 0 10px; position: relative;padding-top: 10px}
.menu li {float: right; position: relative; z-index: 20;}
.menu li a {color: rgb(68, 68, 68); display: block; font-size: 18px; line-height: 10px; margin-right: 50px; padding: 14px; text-decoration: none;text-align: left;}
.menu li a:hover {background: -moz-gradient(linear, center top, center bottom, from(#ededed), to(#fff)); background: -webkit-gradient(linear, center top, center bottom, from(#ededed), to(#fff)); background: gradient(linear, center top, center bottom, from(#ededed), to(#fff)); background-image: linear-gradient(#ededed, #fff); box-shadow: inset 0 0 1px 1px rgba(0,0,0,0.1); color: #222;}
.menu ul {display: none; position: absolute; left: -9999px; list-style: none; opacity: 0; transition: opacity 1s ease; padding-top: 10px;}
.menu ul li {float: none;}
.menu ul a { white-space: nowrap;}
.menu li:hover ul {display: block; background: rgba(255,255,255,0.7); box-shadow: inset 0 2px 4px rgba(0,0,0,0.4); left: -2px; opacity: 1;}
@media screen and (max-width: 500px) {
span.titulomenu {font-size: 16px; margin: 14px auto 0;}
.menu li a {font-size: 20px; margin-right: 35px;}}