@charset "utf-8";
/* CSS Document */

.menu {margin:-18px auto 0; max-width:980px; position:relative; z-index:999; font-weight:bold; font-size:1.2em; display:block;}
.menu li{
list-style: none;
float: left;
position: relative;
height: 1.85em;
}

.menu>li{
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out; 
}
.menu .active { background-image:url(img/active.png); background-repeat:no-repeat; background-position:left top;}
.menu a{
display: block;
text-decoration: none;
color: white;
padding: 2px 35px 0;
margin: 0;
position: relative;
}

.menu a:hover{
display: block;
text-decoration: underline;
}

ul.menu-hover a{padding-top:6px;}
ul.menu-hover{
visibility: hidden;
position: absolute;
top:100%;
opacity: 0;
height: 0;
width: 150px;
-webkit-transition: all 0.3s ease-in-out;
-moz-transition: all 0.3s ease-in-out;
-o-transition: all 0.3s ease-in-out;
transition: all 0.3s ease-in-out;
}

.menu li:hover .menu-hover{
visibility: visible;
height: 100%;
opacity: 1;
margin-top:10px;
width:160px;
padding-top:10px;
}

.menu-hover li{
height: 100%;
border-bottom: 1px solid #696969;
background-color: #2a2a2a;
border-left: none;
border-right: none;
width:100%;
}

.menu-hover li:hover{
background-image: -webkit-linear-gradient(#2a2a2a, #434343);
background-image: -moz-linear-gradient(#2a2a2a, #434343);
background-image: -o-linear-gradient(#2a2a2a, #434343);
background-image: linear-gradient(#2a2a2a, #434343);
box-shadow: none;
}

.menu-hover a{
color: white;
}

.menu a span:after{
content: "";
border-left: 3px solid transparent;
border-right: 3px solid transparent;
border-bottom: 3px solid white;
position: absolute;
top: 30px;
right: 35px;

-webkit-transition: all 0.2s ease-in-out;
-moz-transition: all 0.2s ease-in-out;
-o-transition: all 0.2s ease-in-out;
transition: all 0.2s ease-in-out; 
}