/* display on homepage */
.homepage .nav-container{max-height:100%;opacity:1;display:block}
.homepage #togglecategories>span{visibility:hidden}
/* styling */

.nav-container{
	overflow:hidden;
	border:solid 1px #ccc;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	border-left-color:transparent
}
.nav-container a{
	color:#000
}
.nav-container>ul,.nav-container li{
	margin:0;padding:0;list-style-type: none;
}

.nav-container>ul>li>ul{
	display:none;
}
.nav-container ul>li>ul{
	padding-left:5px;
}
/*expand*/
.nav-container ul>li>a.expanded+ul{
	display:block;
}
.nav-container li>a{
	display:block;
	padding:5px 10px;
	border-bottom:solid 1px #eee;
	transition: background-color 0.2s ease;
}
.nav-container li>a:hover{
	background:rgba(219, 219, 219,.5)
}
.nav-container li.active>a{
	font-weight:700
}
.homepage .nav-container li.active>a{
	font-weight:inherit
}

.nav-container li.level0{
	border-left:solid 5px #ccc;
}
.nav-container li.level0.haschilds{
	background:url("data:image/gif;base64,R0lGODlhDgAHAIAAAHd3d////yH5BAEAAAEALAAAAAAOAAcAAAIPDIKpCbff3GNxUmmbVdgWADs=") no-repeat scroll right 12px transparent
}
.nav-container li.level0{
	display:block;
}
.nav-container li.level0>a{
	color:black
}

/* colors */
.nav-container li.level0:nth-child(1){
	border-left-color:#0054a5
}
.nav-container li.level0:nth-child(2){
	border-left-color:#0072bb
}
.nav-container li.level0:nth-child(3){
	border-left-color:#008fd5
}
.nav-container li.level0:nth-child(4){
	border-left-color:#00adef
}
.nav-container li.level0:nth-child(5){
	border-left-color:#01a89e
}
.nav-container li.level0:nth-child(6){
	border-left-color:#00a652
}
.nav-container li.level0:nth-child(7){
	border-left-color:#3bb34f
}
.nav-container li.level0:nth-child(8){
	border-left-color:#73ad58
}
.nav-container li.level0:nth-child(9){
	border-left-color:#9cc255
}
.nav-container li.level0:nth-child(10){
	border-left-color:#cfdb4b
}
.nav-container li.level0:nth-child(11){
	border-left-color:#f9ea4f
}
.nav-container li.level0:nth-child(12){
	border-left-color:#efbf2f
}
.nav-container li.level0:nth-child(13){
	border-left-color:#e79724
}
.nav-container li.level0:nth-child(14){
	border-left-color:#df5829
}
.nav-container li.level0:nth-child(15){
	border-left-color:#bd0701
}
.nav-container li.level0:nth-child(16){
	border-left-color:#c72360
}
.nav-container li.level0:nth-child(17){
	border-left-color:#b80c78
}
.nav-container li.level0:nth-child(18){
	border-left-color:#84077c
}

/* desktop expand */
@media (min-width: 768px) {
	.nav-container>ul>li>ul{
		display:none;
		border:solid 2px #ccc;
		position:absolute;
		top:0;
		left:300px;
		width:870px;
		height:550px;
		z-index:10;
		background:#fff;
		overflow:auto;
		-webkit-border-radius: 3px;
		-moz-border-radius: 3px;
		border-radius: 3px;
		padding-top:7px;
		padding-bottom:10px
	}
	.nav-container>ul>li>ul>li
	{
	-webkit-column-break-inside: avoid;
			  page-break-inside: avoid;
				   break-inside: avoid;	
	}
	.nav-container ul.level0{
	  column-count: 3;
	  column-gap: 1em
	}
	.nav-container li.level1{
		vertical-align:top
		/*font-size:1em*/
	}
	.nav-container li.level1>a{
		font-weight:bold;
		text-transform:uppercase;
		border:none
	}
	.nav-container li.level2>a{
		border:none;
		padding:2px 5px
	}
  .nav-container li.level3{display:none}
  
  /** From scrolled bar hamburger */
  .nav-container.scrolled-hamburger-expand {
    position: fixed;
    z-index: 999;
    background: #fff;
    top: 50px;
    overflow: auto;
  }
  .nav-container.scrolled-hamburger-expand>ul>li>ul{
    border: none;
		position: relative;;
		top:0;
		left:0;
		width:auto;
		height:auto;
		-webkit-border-radius: 0;
		-moz-border-radius: 0;
		border-radius: 0;
		padding-top:0;
		padding-bottom:0
  }
  .nav-container li > a {
    padding: 5px 15px;
  }
	.nav-container.scrolled-hamburger-expand>ul>li>ul>li
	{
	-webkit-column-break-inside: avoid;
			  page-break-inside: avoid;
				   break-inside: avoid;	
	}
	.nav-container.scrolled-hamburger-expand ul.level0{
	  column-count: 1;
	  column-gap: 0;
	}
	.nav-container.scrolled-hamburger-expand li.level1{
		vertical-align:top
		/*font-size:1em*/
	}
	.nav-container.scrolled-hamburger-expand li.level1>a{
		font-weight:normal;
		text-transform:none;
		border:none;
    border-bottom: solid 1px #eee;
	}
	.nav-container.scrolled-hamburger-expand li.level2>a{
    border:none;
    border-bottom: solid 1px #eee;
		padding:2px 5px 2px 15px;
	}
  .nav-container.scrolled-hamburger-expand li.level3{display:none}
  

}