/**
 *	Filename: mobilenav.css
 *
 *	Contains main CSS for Splendid Mobile Navigation
 */



/* Mobile Menu Overrides */

#header-placeholder-space{
	display:none!important;
}

html #header.fixed-header,
html #header.just-fixed-header,
html #header.header6{
	position:static!important;
}

html #header.header6{
	background:#111;
}

html body.headerstyle6 .page-heading{
	padding-top:60px;
}

#sideheader{
	width:100%!important;
	padding:0 15px!important;
	position:static!important;
}

html body.headerstyle7, 
html body.headerstyle7 .full-width{
	padding-left:0;
}

#header .navigation,
#header .navigation>div,
#header .navigation>nav{
	display:block!important;
	width:auto!important;
}

#main-header #main-nav>.menu{text-align:left!important;}
#main-nav{margin:0 -15px;}


#header .header-shopping-cart,
#header .header-search-box,
#sideheader .header-shopping-cart,
#sideheader .header-search-box,
#header .navigation .header-shopping-cart,
#header .navigation .header-search-box{
	display:none!important;
}

#sideheader #main-nav{
	margin-bottom:0!important;
}

#sideheader .logo{
	margin:30px 0!important;
}

#header .logo,
#sideheader .logo{
	display:block;
	text-align:center;
}

#header #preheader ul{
	display:block;
	text-align:center;
}

#header #main-header ul{
	margin:15px 0;
}

#header #main-header .menu ul{
	margin:0;
}

#header .align-right{
	text-align:center;
}

#main-header ul + ul, 
#main-header .button + ul{
	margin-left:0!important;
}

#sideheader + #header.header-fixed{
	position:static!important;
}

#sideheader #main-nav li a:after{
	content:none!important;
}

/* Mobile Menu Button */

#mobile-menu-button{
	display:block;
	height:65px;
	overflow:hidden;
	cursor:pointer;
	border:1px solid #eee;
	padding:10px 20px; 
	background:#fff;
	transition: background .3s;
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
}

#mobile-menu-button span{
	display:block;
	height:4px;
	width:40px;
	background:#718097;
	margin:7px auto;
	transition: background .3s;
	-webkit-transition: background .3s;
	-moz-transition: background .3s;
}

#mobile-menu-button:hover,
#mobile-menu-button.active{
	background:#f9f9fb;
}

#mobile-menu-button.active span{
	background:#5a64e7;
}


/* Mobile Navigation */

#main-nav .menu{display:none; background:#fff;}

#main-nav li,
#main-nav li + li{
	display:block!important;
	margin:0!important;
	position:relative!important;
}

#main-nav li + li>a,
#main-nav ul ul li>a{
	border-top:1px solid #eee!important;
}

#main-nav .menu{
	border:1px solid #eee!important;
	border-top:none!important;
}

#main-nav .menu a{
	padding:20px 25px!important; 
	font-size:18px!important; 
	text-transform:none!important; 
	font-weight:400!important; 
	color: #718097!important; 
	white-space:normal!important;
	opacity:1!important;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"!important;
	filter: alpha(opacity=100)!important;
}

#main-nav li a:before{content:none!important;}
#main-nav .menu a:hover {background: #f9f9fb!important; color: #525f71!important;}
#main-nav .menu li.dropdown-active>a{color:#fff!important; background-color:#5a64e7!important;}

#main-nav .menu>ul{display:block!important;}
#main-nav .menu ul ul{display:none;}

#main-nav ul{
	visibility:visible!important;
	min-width:0!important;
	position:static!important;
	padding:0!important;
	opacity:1!important;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"!important;
	filter: alpha(opacity=100)!important;
	box-shadow: none!important;
	-webkit-box-shadow: none!important;
	-moz-box-shadow: none!important;
	transform: none!important;
	-webkit-transform: none!important;
	-moz-transform: none!important;
	-ms-transform: none!important;
	-o-transform: none!important;
	border:none!important;
}

#main-nav .menu ul ul a{padding-left:45px!important;}
#main-nav .menu ul ul ul a{padding-left:65px!important;}
#main-nav .menu ul ul ul ul a{padding-left:95px!important;}
#main-nav .menu ul ul ul ul ul a{padding-left:115px!important;}


.dropdown-icon{
	position:absolute;
	top:0;
	right:0;
	width:65px;
	height:65px;
	z-index:1;
	cursor:pointer;
}

.dropdown-icon span{
	width:21px;
	height:21px;
	margin:22px auto;
	display:block;
	background:url(../img/sprites/accordion-icon.png) no-repeat;
}

li.dropdown-active>.dropdown-icon span{
	background-position:-21px 0;
}


/* Dark Color Scheme */
#main-nav.dropdown-dark #mobile-menu-button,
#main-nav.dropdown-dark .menu{
	background:#161819;
	border-color:#333!important;
}

#main-nav.dropdown-dark #mobile-menu-button span{background:#fff;}
#main-nav.dropdown-dark #mobile-menu-button:hover,
#main-nav.dropdown-dark #mobile-menu-button.active{background:#111;}
#main-nav.dropdown-dark #mobile-menu-button.active span{background:#5a64e7;}

#main-nav.dropdown-dark .menu a{color:#aaa!important;}
#main-nav.dropdown-dark .menu a:hover {background: #111!important; color: #fff!important;}

#main-nav.dropdown-dark li + li>a,
#main-nav.dropdown-dark ul ul li>a{
	border-color:#333!important;
}

#main-nav.dropdown-dark .dropdown-icon span{
	background-position:0 -21px;
}

#main-nav.dropdown-dark li.dropdown-active>.dropdown-icon span{
	background-position:-21px 0;
}