/* menu icon */
#menu-icon { display: none; /* hide menu icon initially */ }
#menu, #menu li { list-style:none; margin: 0; padding: 0; }
#menu li { list-style-type: none; float: left; position:relative; }
/* nav link */
#menu a.toplink { display: block; height:100px; padding:35px 10px 0 20px; margin-right:1px; text-decoration:none; font-family: 'benchninelight', arial; letter-spacing:1px; font-size:24px; color: #FFF; text-transform:uppercase; }
#menu a.toplink:hover, #menu li:hover a.toplink{background:#1580ca; color:#FFF; }
#menu li.active a.toplink{background:#1580ca;}
/* nav dropdown */
#menu ul { background:#FFF; box-shadow: 0px 6px 10px rgba(0, 0, 0, 0.176);  padding:5px; position: absolute; left:0; top:100px;  display: none; /* hide dropdown */ width: 250px; }
#menu ul li { float: none; margin: 0; padding: 0; }
#menu ul a { text-decoration:none; padding: 8px 10px; display: block; color: #666;   }
#menu ul a:hover {background: #3497db; color:#FFF; }
#menu li:hover > ul { display: block; /* show dropdown on hover */ }

#menu ul:before{content: ""; position:absolute; top:-10px; left:60px; background: url(../images/menuarrow.png) no-repeat; width:20px; height:10px;}


@media screen and (max-width: 1310px) {
#menu a.toplink {padding:38px 20px 0 20px; font-family: 'benchnineregular', arial; font-size:20px; }
#menu ul:before{left:55px; }

}

@media screen and (max-width: 1200px) {
#menu a.toplink {padding:20px 15px 0 15px;  height:60px; font-family: 'benchnineregular', arial; font-size:18px; }
#menu ul:before{left:45px; }

#menu ul { top:60px;  }

}

@media screen and (max-width: 767px) {
	
#menu-wrap { float:none; position: relative; }
/* menu icon */
#menu-icon {  width: 50px; height: 60px; background: url(../images/menu-icon.png) no-repeat; cursor: pointer;  display: block;/* show menu icon */ }
#menu-icon:hover { background-color: #1580ca; }
#menu-icon.active { background-color: #1580ca; }
/* main nav */
#menu { clear: both; position: fixed; top: 60px; width: 100%; height:100%; overflow:auto; z-index: 10000; padding: 0; background: #1580ca; display: none; /* visibility will be toggled with jquery */ }
#menu li { clear: both; float: none; margin:0; }
#menu a.toplink{ height:auto; padding:10px;  margin:0;}
#menu a.toplink:hover, #menu ul a:hover { background: #0873bd !important; }
/* dropdown */
#menu ul { width: auto; padding:0; position: static; display: block; border: none; background: #1580ca; box-shadow:none; }
#menu ul li { margin:0 0 0 15px; }

#menu ul a { text-decoration:none; padding: 8px 10px; display: block; color: #FFF;   }
#menu ul a:hover {background: #3497db; color:#FFF; }

#menu ul:before{ display:none;}
}
 @media screen and (min-width: 767px) {
	/* ensure #menu is visible on desktop version */
	#menu { display: block !important;}
}

