@import "font-awesome.css";

.toggle, [id^=drop] {
 display: none;
 margin-bottom: 1px;
}

nav { 
	margin: 0 auto;
	padding: 0;
	height: 45px;
	font-family: 'Open Sans', Sans-Serif;
	font-weight: 300;
	word-wrap: break-word !important;
	background-color: #999;
	width: 100%;
	
}

.navcontain { width: 100%; max-width: 1220px; margin: 0 auto; }

nav:after {
	content: "";
	display: table;
	clear: both;
}

nav ul {
	padding: 0;
	margin: 0;
	list-style: none;
	position: relative;
	z-index: 99999;
}

nav ul li { 
	margin: 0;
	padding: 0;
	display: inline-block;
	float: left;
	height: 45px;
	background-color: none;
	border-right: 1px solid #bbb;
}

.hmlink { border-left: 1px solid #bbb; }
 
nav ul li a { 
	display: table-cell;
	vertical-align: middle;
	padding: 0 20px;
	margin: 0;
	color: #fff;
	font-size: 18px;
	height: inherit;
	text-decoration: none;
}

.toggle-drop { 
	display: table-cell;
	vertical-align: middle;
	padding: 0 20px;
	margin: 0;
	color: #fff;
	font-size: 18px;
	height: inherit;
	text-decoration: none;
}


nav ul ul {
	width: 200px;	
}

nav ul ul li {
	display: block;
	float: none;
	width: 100%;
	height: auto;
	min-height: 45px;
	position: relative;
	border: none;
}

nav ul ul li a { 
	display: block;
	padding: 10px 20px;
	margin: 0;
	width: 100%;
	height: auto;
	text-decoration: none;
}

nav ul ul ul li {
	position: relative;
	top: -45px;
	left: 200px;
}

#servdrop {
	width: 300px;
}

#servdrop li {
	width: 100%;
	height: 45px;
	margin: 0;
	padding: 0;
	float: left;
	background: #1b1b19;
}

#servdrop li a { 
	display: inline-block;
	vertical-align: top;
	width: 100%;
	height: 45px;
	padding: 10px 20px;
}


nav a:hover { background-color: #444; }

nav ul li:hover { background: #444; }

nav ul li.active { background: #ed2024; }


nav ul ul {
	display: none;
	position: absolute;
	top: 45px; 
}

nav ul li:hover > ul { display: inherit; }

[id^=drop]:checked + ul { display: block; }

nav li > a:after { content: ' +'; }

nav li > a:only-child:after { content: ''; }

/* Media Queries
--------------------------------------------- */

@media all and (max-width : 1024px) {

nav {height: 40px;}

#servdrop {
	width: 100%;
}

#servdrop li {
	width: 100%;
	display: list-item;
	height: auto;
	float: none;
}

#servdrop li a { 
	display: block;
	line-height: normal;
	width: 100%;
	height: auto;
	padding: 10px 40px;
}

.toggle + a, .menu { 
	display: none; 
}

.toggle, .toggle-drop {
	display: block;
	background-color: #444;
	padding: 0 20px;
	color: #fff;
	font-size: 16px;
	line-height: 40px;
	text-decoration: none;
	border: none;
}

.toggle:hover { background-color: #444; }

.toggle-drop:hover { background-color: #444; }

[id^=drop]:checked + ul { display: block; }

nav a {
	line-height: 40px;background-color:#000;
}

nav ul li {
	display: block;
	width: 100%;
	height: auto;
	border-bottom: 1px solid #a6a399;
	
}

nav ul ul .toggle,
 nav ul ul a { padding: 0 40px; }

nav ul ul ul a { padding: 0 80px; }

nav a:hover { background-color: #444; }

nav ul ul ul a { background-color: #222; }

nav ul li ul li .toggle,
 nav ul ul a { background-color: #222; }

nav ul ul {
  float: none;
  position: static;
  color: #fff;
  width: 100%;
}

nav ul ul li:hover > ul,
nav ul li:hover > ul { display: none; }

nav ul ul li {
  display: block;
  width: 100%;
}

nav ul ul ul li { position: static; }

nav ul li a { /*Top Level Links*/
	display: block;
	vertical-align: inherit;
	width: 100%;
	padding: 0 20px;
	margin: 0;
	color: #fff;
	font-size: 16px;
	height: inherit;
	line-height: 40px;
}

nav ul li ul li a { /*2nd Level Links*/
	display: block;
	padding: 10px 20px 10px 40px;
	width: 100%;
	line-height: normal;
}
}