/*** ESSENTIAL STYLES ***/
#nav-wrap{ text-align:center; }
.sf-menu, .sf-menu * {
	margin: 0;
	padding: 0;
	list-style: none;
}
.sf-menu .sf-mega {
	display: none;
	width:100%;
	z-index: 999;
}

.sf-menu > li {
	float: left;
	display:block;
	padding:0 15px; margin:0;

}




.sf-menu > li:first-child{ padding-left:0;}
.sf-menu > li:last-child{ border:none;}
.sf-menu > li.last {
	background:none;
}

.sf-menu li:hover > .sf-mega,
.sf-menu li.sfHover > .sf-mega {
	display: block;
}

.sf-menu a {
	display: block;
}

/*** DEMO SKIN ***/
.sf-menu {
	float: left;
	width:100%;
}

.sf-menu .sf-mega {
  width:100%; /* allow long menu items to determine submenu width */
}

.sf-menu > li > a {
	font-family: 'MyriadPro-Regular';
	font-size:18px;
	text-decoration: none;
	position:relative;
	transition: all 0.3s ease-in 0s;
	padding:19px 0; 	
}


.sf-menu li {
	-webkit-transition: background .2s;
	transition: background .2s;
}

.sf-menu li:hover,
.sf-menu li.sfHover {
	/* only transition out, not in */
	-webkit-transition: none;
	transition: none;
}


/*** mega menu dropdown ***/

#header .bottom-block .container{ position:relative;}
#header .bottom-block .container .sf-mega {
  padding:0;
  box-sizing: border-box;
  width: 1140px;
  left:15px;
  position:absolute;
  border-radius:0;
  top:58px;
  
}

.sf-mega-section {
  float: left;
  padding:0;
  margin:0;
  text-align:left;
  width:25%;
}
.sf-mega-section img{ max-width:100%;}

.sf-mega-section-last{ padding-right:0; }

.sf-mega-img-section {
  float: right;
  padding:0;
  margin:0;
  line-height:0;
}

.sf-mega-section ul{ padding:15px 0 0 0; margin:0; list-style:none; }
.sf-mega-section ul li{ display:block; padding:0px 0 10px 0px !important; margin:0; }
.sf-mega-section ul li.last{ border:none; }
.sf-mega-section ul li a{ font-size:16px; line-height:18px;}
.sf-mega-section ul li a:hover{}

/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {}
/* styling for both css and generated arrows */

.sf-arrows > li > .sf-with-ul:focus:after,
.sf-arrows > li:hover > .sf-with-ul:after,
.sf-arrows > .sfHover > .sf-with-ul:after {
  border-top-color: white; /* IE8 fallback colour */
}
 
.sf-menu .sf-mega .block{ margin:0; padding:15px 15px;}

#menu-icon{ display:none; }

@media screen and (max-width: 1199px) {
.sf-menu > li{ padding: 0 11px; }
}



