.mobileControl {height: 125px; background: #532d6d; padding-top:47px; box-sizing: border-box;}
.mobileControl ul {list-style-type:none; display:block; margin:0; padding:0px; text-align:center;}
.mobileControl ul li {display:block;}
.mobileControl ul li a {display:block; position:relative; text-decoration:none; z-index: 10000; color:#fff; font-size:18px;
 -webkit-transition: all 0.5s ease;
 -moz-transition: all 0.5s ease;
 -o-transition: all 0.5s ease;
 transition: all 0.5s ease;
}
.mobileControl ul li a:before {content:"\2338"; font-family:Basic-Icons; margin-right:10px; font-size: 28px; vertical-align: -6px;}
.mobileControl ul li a:hover {color:#a7aaac;}
.mobileControl ul li a.active {}

/* 16px baseline (180px - 767px) */
@media only screen and (min-width:11.250em) and (max-width:47.938em) {

	/******************************************************
	MAIN NAVIGATION
	******************************************************/

	nav {position:absolute; float:none; left:0; right:0; z-index:1001; min-width: 264px;}

	.mainNavWrpr {display:none; position:relative;  background: #532d6d;}
	.mainNavWrpr .mainNav {display:block; position:relative !important; text-align:left;}

	.mainNav > .sf-menu {display:block; list-style-type:none; margin:0; padding:10px 0;}
	.mainNav > .sf-menu > li {display:block; margin:0; padding:0;}

	/* SuperFish menu */

	/*** ESSENTIAL STYLES ***/
	.sf-menu, .sf-menu * {margin:0; padding:0; list-style:none;}
	.sf-menu {line-height:1.0;}

	.sf-menu a {display:block; position:relative; text-decoration:none;}

	/*** Main Menu SKIN ***/

	/* Sub Menu Offset */

	.sf-menu li:hover ul,
	.sf-menu li.sfHover ul {top:0px;}

	/* Navigation : Main Level */

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

	.mainNav .sf-menu > li > div > a {display:block; text-align:center; margin: 0 40px; font-size:16px; line-height:21px;}

	.mainNav .sf-menu > li > div > a,
	.mainNav .sf-menu > li > div > a:visited,
	.mainNav .mainMenu a,
	.mainNav .mainMenu a:visited	{color:#ffffff !important; text-decoration: none;}

	.mainNav .sf-menu > li:hover > div > a,
	.mainNav .sf-menu > li.on > div > a,
	.mainNav .sf-menu > li.sfHover > div > a {color:#d2553a;}

	.mainNav .sf-menu > li > div > a span {display:block; position:relative;}
	.mainNav .sf-menu > li > div > a > span {padding:12px 0 12px 0;}

	.mainNav .sf-menu > li ~ li > div > a > span {}

	.mainNav .sf-menu > li > div .expandMenuLinks:before {position: absolute; left:0px; content:"\25ba"; font-size:10px; padding: 18px 15px 18px 15px; color:#ffffff; cursor:pointer; }
	.mainNav .sf-menu > li > div > ul > li > div > .expandMenuLinks:before { padding:10px 0 10px 18px; position: absolute;}

	/* Sub - Navigation : First Level */

	.mainNav .sf-menu > li > div ul {display:none; background:#3c1e50;} 

	.mainNav .sf-menu > li > div > ul > li {display:block;}

	.mainNav .sf-menu > li > div > ul > li > div > a {display:block; text-align: center; line-height:21px;  padding: 12px 0 12px 0;}
	.mainNav .mainMenu li ul li a {}

	.mainNav .sf-menu > li > div > ul > li > div > a,
	.mainNav .sf-menu > li > div > ul > li > div > a:visited,
	.mainNav .sf-menu > li > div > ul > li > div > a:hover {color:#ffffff;}

	.mainNav .sf-menu > li > div > ul > li:hover > div > a,
	.mainNav .sf-menu > li > div > ul > li.on > div > a,
	.mainNav .sf-menu > li > div > ul > li.sfHover > div > a {}

	.mainNav .sf-menu > li > div > ul > li > div > a.sf-with-ul > span:after {content:"\25ba"; position:absolute; font-size:10px; line-height:45px; left:50px; top:50%; margin-top:-21px; color:#ffffff;}

	/* Sub - Navigation : Second Level */

	.mainNav .sf-menu > li > div > ul > li > div > ul > li {display:block;}

	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a {display:block; padding:4px 25px 4px 85px; font-size:14px; line-height:16px;}

	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a,
	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a:visited,
	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a:hover {color:#ffffff;}

	.mainNav .sf-menu > li > div > ul > li > div > ul > li:hover > div > a,
	.mainNav .sf-menu > li > div > ul > li > div > ul > li.on > div > a,
	.mainNav .sf-menu > li > div > ul > li > div > ul > li.sfHover > div > a {color:#d2553a;}


	.mainNav .sf-menu li li a,
	.mainNav .sf-menu li li a:visited {height:auto;}

	.mainNav .sf-menu li:hover,
	.mainNav .sf-menu li.sfHover,
	.mainNav .sf-menu a:focus,
	.mainNav .sf-menu a:hover,
	.mainNav .sf-menu a:active {outline:0; text-decoration:none;}

	.mainNav .sf-menu li > div > a > span.icon-indicator:after {font-size:13px; font-weight:normal;
		content: "\2b";
	}
	.mainNav .sf-menu li.sfHover > div > a > span.icon-indicator:after {font-size:13px; font-weight:normal;
		content: "\2d";
	}
}

/* 16px baseline (768px +) */
@media only screen and (min-width:48em){

	nav {display:block; position:absolute; margin:0 auto;  z-index:501;  width: 100%; min-width: 300px;}

	.mainNavWrpr {display:block; position:relative; margin:0 auto;}

	.mainNav { }

	/*** ESSENTIAL STYLES ***/
	.sf-menu, .sf-menu ul {margin:0; padding:0; list-style:none;  background: #532d6d;}
	.sf-menu li {position:relative;}
	.sf-menu ul {position:absolute; display:none; top:0; left:100%; z-index:200;}
	.sf-menu li:hover > div > ul,.sf-menu li.sfHover > div > ul {display:block;}
	.sf-menu a {display:block; position:relative; text-decoration:none;}
	.sf-menu ul ul {top:0; left:100%;}

	/*** MAIN MENU SKIN ***/
	.mainNavWrpr {display:none; position:relative;  background: #532d6d;}

	/*** Navigation : Main Level ***/

	.mainNav > .sf-menu {}

	.mainNav > .sf-menu > li {padding:0; vertical-align:middle;}

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

	.mainNav .sf-menu > li {}

	.mainNav .sf-menu > li > div {}

	.mainNav .sf-menu > li > div > a { padding:0; margin:0 -5px; text-align:center; padding: 10px 0;}

	.mainNav .sf-menu > li > div > a,
	.mainNav .sf-menu > li > div > a:visited {color:#ffffff;}
	
	.mainNav .sf-menu > li.on > div > a,
	.mainNav .sf-menu > li > div > a:hover,
	.mainNav .sf-menu > li > div > a:focus {color:#fff; background:#3c1e50;}

	.mainNav .sf-menu > li > div > a > span { }

	.mainNav .sf-menu > li > div > a > span > span {display:block; max-height:30px; overflow:hidden;}
	
	.mainNav .sf-menu > li.sfHover > div > a > span:after {content:"\25b2"; font-family:sans-serif,"courier new"; position:absolute; display:block; left:0; right:0; bottom:-4px; font-size:22px; line-height:22px; z-index:231;}

	/*** Sub - Navigation : First Level ***/

	.mainNav .sf-menu > li > div > ul {width:200px; top:0px; background:#3c1e50; text-align:center; }

	.mainNav .sf-menu > li > div > ul > li > div > a {padding:0 15px; font-size:17px; line-height:21px;}

	.mainNav .sf-menu > li > div > ul > li > div > a,
	.mainNav .sf-menu > li > div > ul > li > div > a:visited {color:#fff;}
	.mainNav .sf-menu > li > div > ul > li > div > a {
		-webkit-transition:background-color 0.1s ease 0s;
		-moz-transition:background-color 0.1s ease 0s;
		-ms-transition:background-color 0.1s ease 0s;
		-o-transition:background-color 0.1s ease 0s;
		transition:background-color 0.1s ease 0s;
	}

	.mainNav .sf-menu > li > div > ul > li > div > a.sf-with-ul > span:after {content:"\25ba"; position:absolute; right:10px; color:#4d5456; font-family:arial; font-size:16px; line-height:16px; top:50%; margin-top:-8px;
		-o-transform:scale(0.8,1);
		-webkit-transform:scale(0.8,1);
		-moz-transform:scale(0.8,1);
		transform:scale(0.8,1);
	}

	.mainNav .sf-menu > li > div > ul > li > div > a > span {display:block;}
	.mainNav .sf-menu > li > div > ul > li > div > a > span > span {display:block; padding:10px 0;}
	.mainNav .sf-menu > li > div > ul > li ~ li > div > a > span > span {}

	/*** Sub - Navigation : Second Level ***/

	.mainNav .sf-menu > li > div > ul > li > div > ul {left:100%; width:100%; top:-2px; background-color:#ffffff;}

	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a {padding:0 15px; font-size:17px; line-height:17px;}

	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a,
	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a:visited {color:#000000;}
	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a {
		-webkit-transition:background-color 0.1s ease 0s;
		-moz-transition:background-color 0.1s ease 0s;
		-ms-transition:background-color 0.1s ease 0s;
		-o-transition:background-color 0.1s ease 0s;
		transition:background-color 0.1s ease 0s;
	}

	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a > span {display:block;}
	.mainNav .sf-menu > li > div > ul > li > div > ul > li > div > a > span > span {display:block; padding:10px 0;}
	.mainNav .sf-menu > li > div > ul > li > div > ul > li ~ li > div > a > span {display:block; border-top:1px solid #1face3;}

	.mainNav .sf-menu li li a,
	.mainNav .sf-menu li li a:visited {height:auto;}

	.mainNav .sf-menu li:hover,
	.mainNav .sf-menu li.sfHover,
	.mainNav .sf-menu a:focus,
	.mainNav .sf-menu a:hover,
	.mainNav .sf-menu a:active {outline:0; text-decoration:none;}

}