#navigation {
width:100%;
box-sizing:border-box;
position:relative;
}

#menu-toggle {
position:absolute;
cursor:pointer;
background:	transparent url(../img/menu_icon.png) no-repeat left top;
top:27px;
left:10px;
width:34px;
height:26px;
z-index:50;
display:none;
}

#menu-toggle:hover, #menu-toggle.active, #menu-toggle.active:hover {
background:	transparent url(../img/menu_icon_hi.png) no-repeat left top;
}
#menu-toggle:after {
content:"Menu";
text-transform:uppercase;
color:#fff;
font-size:27px;
line-height:1px;
padding-left:50px;
position:relative;
top:2px;
}
.active-nav #menu-toggle:after {
display:none;
}
/******** Menu ******************************************************************************/

#navigation .content > .menu {
display:block;
box-sizing:border-box;
text-align:center;
margin:0px;
padding:0px;
}

#navigation .content > .menu li{
list-style:none;
box-sizing:border-box;
position:relative;
margin:0px;
padding:0px;
}
#navigation .content > .menu > li{
min-height:120px;
width:25%;
text-align:left;
float:left;
}
#navigation .content > .menu li a, #navigation .content > .menu li a:link, #navigation .content > .menu li a:visited {
font-size:23px;
text-decoration:none;
color:#ffffff;
height:120px;
width:100%;
text-align:left;
padding:45px 15px 20px 28px;
display:block;
text-transform:uppercase;
font-weight:500;
margin:0px;
}
#navigation .content > .menu li a, #navigation .content > .menu li a:link, #navigation .content > .menu li a:visited {
background-color:#8568a6;	
}
#navigation .content > .menu li + li a, #navigation .content > .menu li + li a:link, #navigation .content > .menu li + li a:visited {
background-color:#957bb2;	
}
#navigation .content > .menu li + li + li a, #navigation .content > .menu li + li + li a:link, #navigation .content > .menu li + li + li a:visited {
background-color:#a48ebc;	
}
#navigation .content > .menu li + li + li + li a, #navigation .content > .menu li + li + li + li a:link, #navigation .content > .menu li + li + li + li a:visited {
background-color:#b3a1c8;	
}
#navigation .content > .menu li > a:hover, #navigation .content > .menu li > a:active, #navigation .content > .menu li.active-trail > a, #navigation .content > .menu li.active-trail > a:link, #navigation .content > .menu li.active-trail > a:visited {
color:#674290 !important;
background-color:#fff !important;
}
.active-nav #navigation {
padding-left:75px;
padding-right:0px;
}
.active-nav #navigation .content > .menu {   
margin-left:0px; 
padding-left:0px;
display:block;
position:relative;
}

.active-nav #navigation .content > .menu li, .active-nav #navigation .content > .menu li.last {
width:100% !important;
display:block;
float:none;
}

.active-nav #navigation .content > .menu li a {
  display:block;
  height:auto;
}




/* Submenu */
#navigation .content > .menu ul {
position: absolute;
top:120px;
left:-15px;
z-index: 100;
width: 100%;
min-width:200px;
padding-top:0px;
padding-left:15px;
padding-right:15px;
box-sizing:content-box;
visibility:hidden;
text-align:left;
display:block;
padding-bottom:10px;
}
#navigation .content > .menu ul li {
display:block;
position:relative;
min-width:100%;
float:none;
clear:both;
text-align:left;
padding:0px;
height:auto;
}
#navigation .content > .menu ul li a, #navigation .content > .menu ul li a:link, #navigation .content > .menu ul li a:visited {
font-size:18px;
min-height:30px;
padding:15px 15px 15px 28px;
margin-top:1px;
text-align:left;
height:auto;
color:#fff !important;
background-color:#8568a6 !important;
}
#navigation .content > .menu li.active-trail li.active-trail a, #navigation .content > .menu ul li a:hover, #navigation .content > .menu ul li a:active {
background-color:#674290 !important;
color:#fff !important;
}

#navigation .content > .menu li:hover ul {
	visibility:visible;
}


.active-nav #navigation .content > .menu ul {
  position:static;
  visibility: visible !important;
  box-shadow:none;
  margin-top:1px;
}