nav a { text-decoration: none; font-size: 15px; font-weight: 300 }
nav ul, nav ul li { margin: 0; padding: 0 }
nav .touch-btn { display: none }
#nav-container { z-index: 10 }
#nav-container .fa-bars:before, #nav-container .fa-navicon:before, #nav-container .fa-reorder:before { color: #fff!important }
.nav_hidden { display: none!important }
@media screen and (min-width:770px) {
nav ul li { display: inline; float: left; width: 200px; position: relative; margin: 0 }
nav ul li a { display: block; color: #000 }
nav ul li:hover a { color: #666 }
nav>ul>li { width: auto!important; padding: 5px 20px; border-right: solid 1px #122a88 }
nav>ul>li:first-child { padding: 5px 20px 5px 0; border-right: solid 1px #122a88 }
nav>ul>li:last-child { border-right: none; padding: 5px 20px }
nav>ul>li>a { color: #000 }
nav ul li ul { -webkit-transition: all .25s ease; -moz-transition: all .25s ease; -o-transition: all .25s ease; transition: all .25s ease; position: absolute; max-height: 0; overflow: hidden; margin: -20px 0 0; opacity: 0 }
nav ul li:hover>ul { max-height: 1000px; overflow: visible; margin: 0; opacity: 1; background-color: #122a88 }
nav ul li ul li a { color: #fff!important; padding: 10px }
nav ul li ul li a:hover { background-color: #a5abaf; color: #fff!important }
ul li ul li a.parent { background: url(images/arrow-parent.gif) 97% 50% no-repeat }
nav ul li ul li ul { float: left; position: absolute; left: 200px; top: 0; width: 0; margin: 0 0 0 -20px }
nav ul li ul li:hover>ul { margin: 0; width: 200px }
nav ul li ul li ul li, nav ul li ul li ul li ul li { background-color: #122a88 }
}
@media only screen and (max-width:770px) {
a.toggleMenu, nav ul li ul { -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease }
nav ul li ul, nav>ul { max-height: 0; overflow: hidden }
#navTop { display: none }
#nav-container { position: relative; display: block; background-image: none; border-left: none; margin: 0 }
nav a { color: #000 }
nav a:hover { color: #7b7b7b; text-decoration: none }
a.toggleMenu { padding: 10px; margin: 0; text-decoration: none; text-align: center; color: #fff; background-color: #122a88; transition: all .5s ease }
nav { margin: 0 10px 10px }
nav ul li { list-style: none; border-top: dashed 1px #666 }
nav>ul>li { background-color: #dedede }
nav ul li a { padding: 10px; display: block }
nav ul li ul { padding: 0 20px; transition: all .5s ease }
nav>ul { -webkit-transition: all .5s ease; -moz-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease }
nav ul li ul li a { background: url(images/bullet-sub.gif) 6px 8px no-repeat; padding: 5px 5px 5px 18px }
nav ul li.active>ul, nav>ul.active { max-height: 1000px }
span.touch-btn { float: right; transition: all .2s ease; -webkit-transition: all .2s ease; width: 20px; height: 20px; margin: 0; padding: 5px; -webkit-border-radius: 0; border-radius: 0; text-align: center; display: block; overflow: hidden; text-indent: -9999px; background: url(../images/plus-minus.gif) 50% 0 no-repeat #122a88 }
a.toggleMenu span.touch-btn, nav ul li.active>a.parent span.touch-btn { -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); background-position: 50% -20px }
a.toggleMenu.active span.touch-btn { background-position: 50% 0; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0) }
}
@media all and (device-width:770px) and (device-height:1024px) and (orientation:portrait) {
nav ul li ul { display: none }
nav ul li:hover>ul { display: block }
}
@media only screen and (max-width:770px) {
#nav { width: 100% }
.nav_hidden { display: block!important }
}