/*** ESSENTIAL STYLES ***/
.sf-menu {
  position: relative;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  display: table;
}
.sf-menu .sf-mega {
  position: absolute;
  display: none;
  top: 100%;
  left: 0;
  z-index: 99;
  display: block;
}
.sf-menu > li {
  float: left;
}
.sf-menu li:hover > .sf-mega,
.sf-menu li.sfHover > .sf-mega {
  display: block;
}

.sf-menu > li > a {
  display: block;
  position: relative;
}


/*** DEMO SKIN ***/
.sf-menu .sf-mega {
 /* box-shadow: 0 6px 3px 6px rgba(0,0,0,.2);*/
  
  -moz-box-shadow: 0px 3px 8px rgb(100,100,100);
-webkit-box-shadow: 0px 3px 8px rgb(100,100,100);
box-shadow: 0px 3px 8px rgb(100,100,100);
  width: 100%; /* allow long menu items to determine submenu width */
}
#menu1 .sf-menu a {
	padding: 7px 1.2em 8px;
	/* margin: 5px 0.3em; */
	text-decoration: none;
	zoom: 1;
	-webkit-transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-o-transition: color 0.3s ease;
	transition: color 0.3s ease;
	color: #c9b7b7;
	font-size: 24px;
	font-weight: 300;
	font-variant: small-caps;
	border-bottom: 1px #3a3232 solid;
}
#menu2 .sf-menu a {
	padding: 1em 1.4em 1em;
	margin: 0.5em 0.3em;
	border-radius: 10px;
	text-decoration: none;
	zoom: 1; /* IE7 */
	-webkit-transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-o-transition: color 0.3s ease;
	transition: color 0.3s ease;
		-webkit-transition: background-color 0.3s ease;
	-moz-transition: background-color 0.3s ease;
	-o-transition: background-color 0.3s ease;
	transition: background-color 0.3s ease;
	color: #FFFFFF;
	font-size:14px;
	font-weight: 400;
	text-transform: uppercase;
}
.sf-menu li {
	white-space: nowrap; /* no need for Supersubs plugin */
	*white-space: normal; /* ...unless you support IE7 (let it wrap) */
	-webkit-transition: background .2s;
	transition: background .2s;
}
#menu1 .sf-menu li a:hover,
#menu1 .sf-menu li.sfHover a {
	/* only transition out, not in */
	-webkit-transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-o-transition: color 0.3s ease;
	transition: color 0.3s ease;
	color: #f37144;
border-bottom: 1px solid;

}
#menu2 .sf-menu li a:hover,
#menu2 .sf-menu li.sfHover a {
	color: #f37144;
	/* only transition out, not in */
	-webkit-transition: color 0.3s ease;
	-moz-transition: color 0.3s ease;
	-o-transition: color 0.3s ease;
	transition: color 0.3s ease;
}

/*** mega menu dropdown ***/
.sf-mega {
background-color: #f5f5f5;
border-radius:0px 0px 2px 2px;
background-repeat: repeat-x;;
margin: 0px 0 0 0;
padding: 0px 0px;
width: 250px !important;
min-width: 150px;
position: absolute;
top:37px !important;
left:238px !important;
z-index: 999;
}
.sf-mega h4 {
padding: 15px 15px !important;
margin: 0 !important;
font-variant:normal;
font-size:1em;
font-weight:300;


}
.sf-mega h4:hover {
background-color:#f37144;

}
.sf-mega-section {
  float: left;
  padding: 0 1em 1em 0;
  margin-right: 1em;
  border-right: 1px solid #b4c8f5;
}
.sf-menu .col a {
font-size: 14px !important;
border: 0 !important;
line-height: 10px;
padding: 0 !important;
margin: 0 !important;
font-variant:small-caps;
}


/*** arrows (for all except IE7) **/
.sf-arrows .sf-with-ul {

}
/* styling for both css and generated arrows */
.sf-arrows .sf-with-ul:after {
	content: '';
	position: absolute;
	bottom: -7px;
	left: 50%;
	margin-top: 3px;
	margin-left: -5px;
	height: 0;
	width: 0;
  /* order of following 3 rules important for fallbacks to work */
  border: 5px solid transparent;
  border-top-color: #dFeEFF; /* edit this to suit design (no rgba in IE8) */
  border-top-color: rgba(255,255,255,.5);
}
.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 */
}