#nav,#nav ul {
 list-style: none outside none;
 margin: 0;
 padding: 0;
}
#nav {
 font-family: "Lucida Sans Unicode",Verdana,Arial,sans-serif;
 font-size: 12px;
 height: 36px;
 list-style: none outside none;
 margin: 10px auto;
 text-shadow: 0 -1px 3px #22B0AC;
 width: 820px;

 /* border radius */
 -moz-border-radius: 4px;
 -webkit-border-radius: 4px;
 border-radius: 4px;

 /* box shadow */
 -moz-box-shadow: 0px 3px 3px #44e4de;
 -webkit-box-shadow: 0px 3px 3px #44e4de;
 box-shadow: 0 3px 4px #22B0AC;

 /* gradient */
 background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #22B0AC), color-stop(0.5, #22B0AC), color-stop(0.51, #22B0AC), color-stop(1, #22B0AC));
 background-image: -moz-linear-gradient(center bottom, #22B0AC 0%, #23C4BF 50%, #1EDBD5 51%, #22B0AC 100%);
 background-color: #22B0AC;
}
#nav li {
 border-bottom: 1px solid #44E4DE;
 border-left: 1px solid #2FDCD7;
 border-right: 1px solid #22DCD6;
 border-top: 1px solid #22B0AC;
 display: block;
 float: left;
 height: 34px;
 position: relative;
 width: 135px;
}
#nav > li:first-child {
 border-left: 0 none;
 margin-left: 5px;
}
#nav ul {
 left: -9999px;
 position: absolute;
 top: -9999px;
 z-index: 2;
}
#nav ul li {
 background: none repeat scroll 0 0 #22B0AC;
 box-shadow: 5px 5px 5px #22B0AC;
 width: 100%;
}
#nav li a {
 color: #FFFFFF;
 display: block;
 line-height: 34px;
 outline: medium none;
 text-align: center;
 text-decoration: none;

 /* gradient */
 background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #20D6D0), color-stop(0.5, #22B0AC), color-stop(0.51, #22B0AC), color-stop(1, #22B0AC));
 background-image: -moz-linear-gradient(center bottom, #1FDCD5 0%, #1FE0DA 50%, #1A928E 51%, #21E2DC 100%);
 background-color: #00a693;
}

/* keyframes #animation */
@-webkit-keyframes animation {
 0% {
 -webkit-transform: scale(1);
 }
 30% {
 -webkit-transform: scale(1.2);
 }
 100% {
 -webkit-transform: scale(1.1);
 }
}
@-moz-keyframes animation {
 0% {
 -moz-transform: scale(1);
 }
 30% {
 -moz-transform: scale(1.2);
 }
 100% {
 -moz-transform: scale(1.1);
 }
}
#nav li > a:hover {
 /* CSS3 animation */
 -webkit-animation-name: animation;
 -webkit-animation-duration: 0.3s;
 -webkit-animation-timing-function: linear;
 -webkit-animation-iteration-count: 1;
 -webkit-animation-direction: normal;
 -webkit-animation-delay: 0;
 -webkit-animation-play-state: running;
 -webkit-animation-fill-mode: forwards;

 -moz-animation-name: animation;
 -moz-animation-duration: 0.3s;
 -moz-animation-timing-function: linear;
 -moz-animation-iteration-count: 1;
 -moz-animation-direction: normal;
 -moz-animation-delay: 0;
 -moz-animation-play-state: running;
 -moz-animation-fill-mode: forwards;
}
#nav li:hover ul {
 left: 0;
 top: 34px;
 width: 150px;
}