/*Reset*/
#menu, #menu ul {margin: 0;padding: 0;list-style: none;}
#menu {width: 100%; margin: 0px auto; border: 1px solid #006600; background-color: #4B8D1F; background-image: linear-gradient(#4DB508, #215002);border-radius: 6px;box-shadow: 0 1px 1px #777;}
#menu:before, #menu:after { content: ""; display: table;}
#menu:after {clear: both;}
#menu {zoom:1;}
#menu li {float: left; border-right: 1px solid #060; box-shadow: 1px 0 0 #030;position: relative;}#menu li:last-child{border:0; box-shadow:none;}
#menu a {float: left;padding: 12px 27px;color: #fff;text-transform: uppercase;font: bold 12px Arial, Helvetica;text-decoration: none;text-shadow: 0 1px 0 #000;}
#menu li:hover > a {color: #fafafa;}
/*Submenu*/
#menu ul { margin: 20px 0 0 0;_margin: 0; /*IE6 only*/opacity: 0;visibility: hidden; position: absolute; top: 38px; left: 0; z-index: 1; background: #444; background: linear-gradient(#444, #111);box-shadow: 0 -1px 0 rgba(255,255,255,.3);  border-radius: 3px; transition: all .2s ease-in-out;}
#menu li:hover > ul {opacity: 1; visibility: visible; margin: 0;}
#menu ul ul {top: 0; left: 150px; margin: 0 0 0 20px; _margin: 0; /*IE6 only*/box-shadow: -1px 0 0 rgba(255,255,255,.3);}
#menu ul li {float: none; display: block; border: 0; _line-height: 0; /*IE6 only*/ box-shadow: 0 1px 0 #111, 0 2px 0 #666;}
#menu ul li:last-child {box-shadow: none;}
#menu ul a {padding: 10px; width: 130px; _height: 10px; /*IE6 only*/ display: block; white-space: nowrap; float: none; text-transform: none;}
#menu ul a:hover {background-color: #0186ba; background-image: linear-gradient(#04acec, #0186ba);}
#menu ul li:first-child > a {border-radius: 3px 3px 0 0;}
#menu ul li:first-child > a:after {content: ''; position: absolute; left: 40px; top: -6px; border-left: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 6px solid #444;}
#menu ul ul li:first-child a:after {left: -6px; top: 50%; margin-top: -6px; border-left: 0; border-bottom: 6px solid transparent; border-top: 6px solid transparent; border-right: 6px solid #3b3b3b;}
#menu ul li:first-child a:hover:after {border-bottom-color: #04acec; }
#menu ul ul li:first-child a:hover:after {border-right-color: #0299d3; border-bottom-color: transparent;   }
#menu ul li:last-child > a {border-radius: 0 0 3px 3px;}
/*Mobilecss*/
#menu-trigger { /* Hide it initially */display: none;}

@media screen and (max-width: 600px) {
#menu-wrap {position: relative;}
#menu-wrap * {box-sizing: border-box;}
#menu-trigger {display: block; height: 40px; line-height: 40px; cursor: pointer; padding: 0 0 0 35px; border: 1px solid #222; color: #fafafa; font-weight: bold; background-color: #111;
/* Multiple backgrounds here, the first is base64 encoded */
background: url(data:image/png;base64,iVBOR...) no-repeat 10px center, linear-gradient(#444, #111); border-radius: 6px; box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;}
#menu { margin: 0; padding: 10px; position: absolute;top: 40px;width: 100%;z-index: 1;display: none;box-shadow: none; }
#menu:after {content: ''; position: absolute;left: 25px;top: -8px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #444;}   
#menu ul { position: static; visibility: visible; opacity: 1; margin: 0; background: none; box-shadow: none;}
#menu ul ul {margin: 0 0 0 20px !important; box-shadow: none; }
#menu li { position: static; display: block; float: none; border: 0; margin: 5px; box-shadow: none; }
#menu ul li{ margin-left: 20px; box-shadow: none;}
#menu a{display: block; float: none; padding: 0; color: #999;}
#menu a:hover{ color: #fafafa;}   
#menu ul a{padding: 0; width: auto;}
#menu ul a:hover{background: none;}
#menu ul li:first-child a:after,#menu ul ul li:first-child a:after {border: 0;} }
@media screen and (min-width: 600px) {#menu {display: block !important;}}