/*
[-Author : Kafeel-]
*/
.menu{ background-color:#085dad; border-bottom:2px solid #fff;}
#nav, #nav ul {
	list-style: none;
	margin: 0 auto;
	padding: 0; 
}
#nav {
	font-family: 'ralewayregular'!important;
	height: auto; /* 21px / 14px */
	
}
#nav li {
	float: left;
	height: auto; /* 32px / 14px */
	margin: 0;
	padding: 0;
	position: relative;
	background-repeat: no-repeat;
	background-position: right top;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #033d73; text-align:left;
}

#nav li img { margin-left:3px;}

#nav li:last-child { border-right:0px;}

#nav a {
	color: #fff;
	display: block; /* 4px 30px 7px */
	text-decoration: none;
	line-height: 45px;
	padding-top: 0em;
	padding-right: 14px;
	padding-bottom: 0em;
	padding-left: 25px;
	font-family: 'ralewayregular';
	font-size: 16px;
	font-weight: normal;
	-webkit-transition-duration: 0.3s;
	-moz-transition-duration: 0.3s;
	-o-transition-duration: 0.3s;
	-ms-transition-duration: 0.3s;
	transition-duration: 0.3s; 
}
#nav a:hover, #nav a:focus {
	color: #000;
	
}
#nav .hover{background:#31c3e7;}

#nav ul {
	background:#31c3e7;
	left: 0;
	font-size: 0.857em; /* 12px / 14px */
	line-height: 1.5em; /* 18px / 12px */
	position: absolute;
	top: 45px; /* 32px / 12px */
	width: 180px; z-index:100; box-shadow:0px 8px 5px rgba(0,0,0,.3);
}
#nav ul li {
	float: none;
	height: auto;
	width: 180px;
	height:auto;
	border-top-width: 0px;
	border-right-width: 0px;
	border-bottom-width: 1px;
	border-left-width: 0px;
	border-bottom-style: solid;
	border-bottom-color: #383838;
}
#nav ul a {
	
	display:block;
	font-weight: normal;
	text-transform: none;
	color: #000;
	padding-top: 10px;
	padding-right: 20px;
	padding-bottom: 10px;
	padding-left: 10px;
	font-size: 14px;
	line-height:normal;
	
}
#nav ul ul {
	font-size: 1em;
}
#nav ul a:hover, #nav ul a:focus {
	color: #fff; background:#22b1d4;
}
#nav ul .hover > a {
	background:#22b1d4;
}
#nav ul ul {
	left: 180px;
	top: 0.5em; /* 6px / 12px */
}
#nav ul, #nav :hover ul ul, #nav .hover ul ul {
	margin-left: -9999px;
	display:none; 
}
#nav li:hover>ul, #nav li.hover>ul, #nav a:focus+ul, #nav ul ul, #nav .hover a:focus {
	margin-left: 0; 
	display:block
}



.parent{
	background-image: url(../images/right-arrow.png);
	background-repeat: no-repeat;
	background-position: 160px center ;
}

.last-ul{left:-180px!important;}

.first-last-ul{left:-32px!important;}




#nav a {
  display: inline-block;
  vertical-align: middle;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
#nav a:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
   background-color: #31c3e7;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
#nav a:hover, #nav a:focus, #nav a:active {
  color: white;
}
#nav a:hover:before, #nav a:focus:before, #nav a:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}



.nav-icon{ height:30px; width:30px; color:#fff; font-size:22px; margin-top:8px; cursor:pointer; display:none;}

@media screen and (max-width: 991px) {
	#nav {
	font-family: 'ralewayregular'!important;
	height: auto; /* 21px / 14px */ display:none;
	
}
	#nav li {
	float: none;
	border-right-width: 0px;
	border-right-style: solid;
	border-right-color: #F3F3F3; border-bottom:1px solid #383838; width:100%;
}
#nav a {
  display:block;
}

.nav-icon{display:block;}
#nav ul { width:100%; position:relative; top:0px;}  
#nav ul li {width:100%;}

}