@import url(http://fonts.googleapis.com/css?family=Ubuntu&subset=latin-ext);



/* Menu CSS */ 

#cssmenu, #cssmenu > ul{
 
 background: url(images/highlight-bg.png) repeat;
 padding-bottom: 3px;
 font-family: 'Ubuntu', sans-serif;
 font-weight: 600;
 
 
}

#cssmenu:before, #cssmenu:after, #cssmenu > ul:before, #cssmenu > ul:after {

 content: '';
 display: table;
 
}


#cssmenu:after, #cssmenu > ul:after {

 clear: both;
 
}

#cssmenu {

 zoom:1;
 
}

#cssmenu > ul{
 
 background: url(images/menu-bg.png) repeat;
 margin: 0;
 padding: 0;
 position: relative;
 
}

#cssmenu > ul li{
 
 margin: 0;
 padding: 0;
 list-style: none;
 
}

#cssmenu > ul > li{

 float: left;
 position: relative;
 
}

#cssmenu > ul > li > a{

 padding: 23px 26px;
 display: block;
 color: white;
 font-size: 13px;
 text-decoration: none;
 text-transform: uppercase;
 text-shadow: 0 -1px 0 #0d0d0d;
 text-shadow: 0 -1px 0 rgba(0, 0, 0, .70);
 line-height: 18px;
 
}


#cssmenu > ul > li:hover > a{

 background: url(images/highlight-bg.png) repeat;
 text-shadow: 0 -1px 0 #97321f;
 text-shadow: 0 -1px 0 rgba(122, 42, 26, .64);
 
}

#cssmenu > ul > li > a > span{

 line-height: 18px;
 
}

#cssmenu > ul > li.active > a, #cssmenu > ul > li > a:active{
 
 background: url(images/hover.png) repeat;
 
}



/* Childs */

#cssmenu > ul ul{

 opacity: 0;
 visibility: hidden;
 position: absolute;
 top: 120px;
 background: url(images/menu-bg.png) repeat;
 margin: 0;
 padding: 0;
 z-index: -1;
 -webkit-transition: all .35s .2s ease-in-out;
 -moz-transition: all .35s .2s ease-in-out;
 -ms-transition: all .35s .2s ease-in-out;
 transition: all .35s .2s ease-in-out;
 
}

#cssmenu > ul li:hover ul{
 opacity: 1;
 visibility: visible;
 margin: 0;
 color: #000;
 z-index: 2;
 top:64px;
 left: 0;
 
}

#cssmenu > ul ul:before{

 content: '';
 position: absolute;
 top: -10px;
 width: 100%;
 height: 20px;
 background: transparent;
 
}


#cssmenu > ul ul li{

 list-style: none;
 padding: 0;
 margin: 0;
 width: 100%;
 
}

#cssmenu > ul ul li a{

 padding: 18px 26px;
 display: block;
 color: white;
 font-size: 13px;
 text-decoration: none;
 text-transform: uppercase;
 width: 150px;
 border-left: 4px solid transparent;
 -webkit-transition: all .35s ease-in-out;
 -moz-transition: all .35s ease-in-out;
 -ms-transition: all .35s ease-in-out;
 transition: all .35s ease-in-out;

}

#cssmenu > ul ul li a:hover{

 border-left: 4px solid #d64e34;
 background: url(images/hover.png) repeat;

}

#cssmenu > ul ul li a:active{

 background: url(images/menu-bg.png) repeat;

}