/*** ESSENTIAL STYLES ***/
#nav-wrapper{
	width: 100%;
	position: relative;
	clear:both;
	overflow: visible;
	height: 75px;
	z-index: 500;
	display: inline-block;
	-webkit-box-shadow: 0px 3px 3px 0px rgba(50, 50, 50, 0.55);
	-moz-box-shadow:    0px 3px 3px 0px rgba(50, 50, 50, 0.55);
	box-shadow:         0px 3px 3px 0px rgba(50, 50, 50, 0.55);
	background-color: #fff;
}
.sf-menu, .sf-menu * {
	margin: 0 auto;
	padding: 10px 0;
	list-style: none;
	max-width: 1024px;
}

.sf-menu li {
	position: relative;
	padding-left: 0px;
	padding-right: 0px;
	margin-bottom: 0;
}

.sf-menu li.logo{
background-image: url(../../../../img/logo.png);
margin: 0px auto;
background-repeat: no-repeat;
background-position: center top;
position: relative;
padding: 5px;
width: 120px;
height: 62px;
top: 0px;
}

nav #pull {display: none;}
/* All Smartphones (portrait and landscape) ----------- */	
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 767px){
#nav-wrapper{
	width: 100%;
	position: relative;
	clear:both;
	overflow: visible;
	z-index:200;
	height: 70px;
	display: block;
	background-color: #fff;
	-webkit-box-shadow: 0px 3px 3px 0px rgba(50, 50, 50, 0.55);
	-moz-box-shadow:    0px 3px 3px 0px rgba(50, 50, 50, 0.55);
	box-shadow:         0px 3px 3px 0px rgba(50, 50, 50, 0.55);
}	

h3.mobile-logo {
background-image: url(../../../../img/logo.png);
margin: 0px auto;
background-repeat: no-repeat;
background-position: center top;
position: absolute;
padding: 0 5px;
width: 129px;
height: 65px;
z-index: 500;
top: 0px;
right: 0px;	
}
.sf-menu li.logo{
display:none;}
	
.sf-menu li {
	position: relative;
	padding-left: 0px;
	padding-right: 5px;
	margin-bottom: 0;
}	
}

/*--- iPads (portrait) ----------- */
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) {
.sf-menu li.logo{
display:none;}

sf-menu li {
	position: relative;
	padding-left: 0px;
	padding-right: 5px;
	margin-bottom: 0;
}
#nav-wrapper .sf-menu a {
    padding: 0.75em;
    text-decoration: none;
}		
}
.sf-menu ul {
	position: absolute;
	display: none;
	top: 100%;
	left: 0;
	z-index: 99;
	

}

.sf-menu > li {
	float: left;
}
.sf-menu li:hover > ul,
.sf-menu li.sfHover > ul {
	display: block;
	border-top: 1px solid #ddd;
}

.sf-menu a {
	display: block;
	position: relative;
}
.sf-menu ul ul {
	top: 0;
	left: 100%;
}


/***  SKIN ***/

.sf-menu ul {
	width: 10em; /* no auto sub width for IE7, see white-space comment below */
	margin-top: 7px;
	-webkit-box-shadow: 3px 3px 5px 0px rgba(0,0,0, 0.5);
	-moz-box-shadow: 3px 3px 5px 0px rgba(0,0,0, 0.5);
	box-shadow: 3px 3px 5px 0px rgba(0,0,0,0.5);
}
.sf-menu a {

	padding: .75em 1em;
	text-decoration: none;
	zoom: 1; /* IE7 */
}
.sf-menu a {
	color: #121212;
	border: none;
	text-transform: uppercase;
}

.sf-menu a:hover { color: #333; }
.sf-menu li {
	white-space: nowrap; /* no need for Supersubs plugin */
	-webkit-transition: background .2s;
	transition: background .2s;
}

.sf-menu li:before { content: none; }

.sf-menu ul li {
	background: #fff;
	border-bottom: 1px solid #ddd;
}

.sf-menu ul ul { border-top: 1px solid #e4e4e4; margin-top: 0px; top: -1px; }

.sf-menu ul ul li {
	background: #fff;
}
.sf-menu li:hover,
.sf-menu li.sfHover {
	background: #eee;
	/* only transition out, not in */
	-webkit-transition: none;
	transition: none;
}