/* NAV */
nav { height: 50px; width: 100%; background: #000; font-family: 'Open Sans', sans-serif; position: fixed; z-index: 1000000; border-bottom: 2px solid #fff;  }
nav li, nav ul { list-style-type: none }
#nav-spacer { height: 52px; width: 100%; display: block; }




/* FONT SIZES */
nav ul.main a { font-size: 16px; padding: 15px 20px 0 29px }
@media (min-width: 760px) and (max-width: 850px){
	nav ul.main a { font-size: 14px; padding: 15px 12px 0 12px }
}
@media (min-width: 850px) and (max-width: 1200px){
	nav ul.main a { font-size: 15px; padding: 15px 15px 0 15px }
}





/* MOBILE MENU */
.noScroll { height: 100%; overflow:hidden }

nav #nav-wrap { height: 50px; display: inline-block;  }

nav #mobile-menu { width: 50px; height: 50px; cursor: pointer; opacity: 0.75}
nav #mobile-menu:hover { background: #00ac89; opacity: 1 }
@media (min-width: 950px) {
	nav #mobile-menu { display: none }
	nav { text-align: center }
}
nav #mobile-menu .top-bar, 
nav #mobile-menu .bottom-bar { width: 30px; height: 4px; position: absolute;  top: 13px; left: 10px; background: #fff; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; }
nav #mobile-menu .bottom-bar { top:30px; }
nav #mobile-menu .top-bar.open  { top: 23px; -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); transform: rotate(45deg); }
nav #mobile-menu .bottom-bar.open  { top: 23px; -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); transform: rotate(-45deg); }



/* MAIN MENU */
nav ul.main { height: 50px; text-align: left }
nav ul.main li a { color: #fff; text-decoration: none;  height: 50px; display: block; box-sizing:border-box;  opacity: 0.75 }
nav ul.main li a:hover { background: #00ac89; opacity: 1 }
nav ul.main li a.more { background-image:url(/img/nav/icon-down.png); background-repeat: no-repeat;  }
nav ul.main li a.more.active { background-image:url(/img/nav/icon-up.png); background-color: #00ac89 }

@media (max-width: 950px) {
	nav * br { display: none; }
	nav ul.main { position: absolute; top: 100%; width: 100%; left: -100%; overflow: scroll; background: #000; }
	nav ul.main li { border-bottom: solid 1px #5F5F5F;  }
	nav ul.main li:first-child { border-top: 1px solid #5f5f5f; }
	nav ul.main.open { left: 0 }
	nav ul.main > li a { opacity: 0.1; margin-left: -50px; text-align: left;  }
	nav ul.main > li a.visible { opacity: 1; margin-left: 0px }
	nav ul.main li a.more { background-position: 30px 40px }
}
@media (min-width: 950px) {
	nav ul.main { position: relative; float: left; display: inline; height: 50px;   }
	nav ul.main > li { height: 100%; position: relative; display: inline-block;  }	
	nav ul.main li a.more { background-position: center 40px }
}





/* SUB MENU */
@media (max-width: 699px) {
		nav ul.main li ul { height: 0; overflow: hidden; text-indent:10px } 
}
@media (min-width: 700px) {
	nav ul.main li ul { background: #000; display: none; position: absolute; top: 100%; min-width: 250px}
	nav ul.main li ul a { height: auto; padding-bottom: 15px;}
	nav ul.main li:hover ul { display: block }
	
	nav ul.main li ul.wide { min-width: 300px; }
	nav ul.main li ul.wide li { width: 50%; float: left;  }
}
@media (min-width: 1100px){
	nav ul.main li ul.wide { min-width: 380px; }
}



/* SUB SUB MENU */
nav ul.main li ul li ul {  display: block; position: relative;}
nav ul.main li ul li ul li a {background:#000;text-indent: 15px;}







/* ICON LINKS */
nav ul.icon-links { display: none }
@media (min-width: 1200px) {
	nav ul.icon-links { float: left; display: inline; overflow: auto; white-space:nowrap }
	nav ul.icon-links li { float: left; display: inline-block; }
	nav ul.icon-links li a { height: 50px; width: 40px; display: block; background-repeat: no-repeat; background-size: 30px 30px; background-position: center; text-indent: -10000px; opacity: 0.75 }
	nav ul.icon-links li a:hover { opacity: 1 }
	nav ul.icon-links li a.twitter { background-image:url(../img/icons/green/icon-twitter.png) }
	nav ul.icon-links li a.facebook { background-image:url(../img/icons/green/icon-facebook.png) }
	nav ul.icon-links li a.instagram { background-image:url(../img/icons/green/icon-instagram.png) }
	nav ul.icon-links li a.email { background-image:url(../img/icons/green/icon-email.png) }
}




/* TRANSITION ELEMENTS */
nav a, nav #mobile-menu .top-bar, nav #mobile-menu .bottom-bar, nav #mobile-menu
{ -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
@media (max-width: 699px) {
	nav ul.main { -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; transition: all 0.3s ease-out; }
}