@charset "utf-8";

/*---Navigation---*/



nav { display: inline-block; text-align: left; z-index: 1; position: relative; }
nav ul, nav ul li, nav ul li a { display: block; position: relative; }
	nav > ul > li { float: left; }
/*Main level button styles*/
nav > ul > li > a { font-size: 16px; font-weight: 400; color: #2c3442;  line-height: 50px; padding: 0 15px; margin: 0 5px 0 0; 
	-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
		nav > ul > li:first-child > a { padding-left: 0; }
	nav > ul > li:hover > a { color: #3077c1; }
/*".sub-menu" class is automatically added by the script*/
	nav > ul > li.sub-menu > a { padding-right: 30px; }
/*Main level button Arrows styles*/
		nav > ul > li.sub-menu > a:after {  position: absolute; top: 0; right: 10px; display: block; content: '\f107'; font-family: FontAwesome; color: #3077c1;
			-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
		nav > ul > li.sub-menu:hover > a:after { top: 5px; }
	nav ul ul { position: absolute; left: -9999px; }
/*Sub level button intial state*/
	nav ul ul li { max-height: 0; -webkit-transition: max-height 0.5s ease; -moz-transition: max-height 0.5s ease; -ms-transition: max-height 0.5s ease; -o-transition: max-height 0.5s ease; transition: max-height 0.5s ease; }
	nav li:hover > ul { left: auto; }
	nav li:hover > ul > li { height: auto; max-height: 100px; }

	nav ul ul ul { margin-left: 100%; top: 0;}
	
	nav ul li.sub-menu ul {-webkit-box-shadow:3px 3px 3px rgba(44,51,65,0.3); -moz-box-shadow:3px 3px 3px rgba(44,51,65,0.3); box-shadow:3px 3px 3px rgba(44,51,65,0.3);}
	
/*Sub level button styles*/
	nav ul ul li a { border-bottom: #d1d6dd 1px solid; padding: 15px 35px 15px 20px; width: 300px; font-size: 16px; line-height: 18px; color: #242424; background: white;
		-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
		nav ul ul ul li a { width: auto; -ms-word-break: keep-all; word-break: keep-all; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; }
/*Border of the end of each sub level*/
		nav ul ul li:last-child > a, nav ul ul li.last-item > a {  border-bottom: #d1d6dd 5px solid; }
/*Sub level button hover styles*/
		nav ul ul li:hover > a, nav ul ul li a:hover { background: #d1d6dd;}
/*Sub level button Arrows styles*/
	nav ul ul li.sub-menu > a:after { display: block; content: '\f105'; font-family: FontAwesome; position: absolute; top: 50%; margin-top: -10px; right: 5px; padding: 0 10px;}
/*---Offscreen styles---*/
nav ul .edge ul { right: 100%; }
	nav ul .edge ul li a { background: silver; }
		nav ul .edge ul li a:hover { background: black; }
/*Active button styles*/
	nav ul li.act > a { color: #3077c1; font-weight: 700;  }

@media screen and (max-width: 1200px){

#menu-icon { display: inline-block; float: right; clear: right; cursor: pointer; margin-top: 20px;
	 -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
	#menu-icon:after { content: "\f0c9"; display: inline-block; width: 45px; height: 45px; line-height: 45px; font-family: FontAwesome; font-size: 25px; text-align: center;
		/*-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; */ }
	#menu-icon:hover, #menu-icon:focus { color: #3077c1; }
	#menu-icon.active { }
		#menu-icon.active:hover {  }
		#menu-icon.active:after { content: "\f00d";  }

nav ul li.sub-menu ul {-webkit-box-shadow:none; -moz-box-shadow:none; box-shadow:none;}

nav {/*width: 100%; margin-top: 0px;*/ display: block; }
nav ul {display: none; margin-top: 0px; background: #fff;  }
nav > ul {border-bottom: #d1d6dd 5px solid; margin-bottom: 20px; position: absolute; right: 0px;  top: 65px; z-index: 9999; width: 350px; /*max-height: calc(100vh - 105px);*/ overflow-y: auto ;
	-webkit-box-shadow:3px 3px 3px rgba(44,51,65,0.3); -moz-box-shadow:3px 3px 3px rgba(44,51,65,0.3); box-shadow:3px 3px 3px rgba(44,51,65,0.3);}
	header.sticky nav > ul { top: 65px; }
	
nav ul li {width: 100%; border-top: #efefef 1px solid; }
	nav ul li:first-child { border-top: none; }

nav ul ul li, nav li:hover > ul > li { height: auto; max-height: none; }
nav ul li a, nav ul ul li a { width: 100%; border-bottom: 0; margin: 0;  }
nav ul ul li:last-child > a, nav ul ul li.last-item > a { border-bottom: none;}

nav > ul > li > a  {font-size: 14px; font-weight: 500; color: #242424; text-transform: uppercase; line-height: 45px; padding: 10px 20px; }
nav > ul > li:first-child > a { padding-left: 20px; }
nav ul ul li a { }

nav > ul > li { float: none; }
nav ul ul li a { padding-left: 25px; }
	nav ul ul ul li a { padding-left: 35px; }
	nav ul ul ul ul li a { padding-left: 45px; }
	nav ul ul ul ul ul li a { padding-left: 55px; }
	nav ul ul ul ul ul ul li a { padding-left: 65px; }
	nav ul ul ul ul ul ul ul li a { padding-left: 75px; }

nav ul ul, nav ul ul ul { position: relative; left: 0; width: 100%; margin: 0; }

nav > ul > li.sub-menu > a:after, nav > ul > li.sub-menu > a:before, nav ul ul > li.sub-menu > a:after, nav ul ul > li.sub-menu > a:before { display: none; }

nav .sub-menu-button { position: absolute; z-index: 99; right: 0; top: 0; display: block; border-left: lightgray 1px solid; height: 65px; width: 65px; cursor: pointer; }
	nav .sub-menu-button:after { position: absolute; display: block; content: '\f067'; font-family: FontAwesome; font-size: 22px; line-height: 65px; width: 100%; height: 100%; text-align: center; color: #242424;
		-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
		nav .sub-menu a { padding-right: 60px; }
		nav .sub-menu:hover > .sub-menu-button:after { /*color: #3077c1;*/ }
		

		
	nav ul ul .sub-menu-button { height: 48px; width: 48px; }
	nav ul ul .sub-menu-button:after { line-height: 48px; color: black; }
  
nav .sub-menu-button.sub-menu-opened { background: rgba(44,52,66,0.65); background: #d1d6dd;
	-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;}
	nav .sub-menu-button.sub-menu-opened:hover { background: #3077c1; color: #fff; }
	nav .sub-menu-button.sub-menu-opened:after { content: '\f068'; color: #fff; }
	
	
	
}

@media (min-width: 1201px) {
  nav ul {display: block !important; } /*Bug fix for displaying Menu when resizing window. Media query must be 1px wider than the menu break point, must be "min-width", and must be after the break point*/
}

@media screen and (max-width: 600px){ nav > ul {right: 0px; left: 0px; top: 65px; width: 100%; }

@media screen and (max-width: 550px) { #menu-icon { margin-top: 15px;} }