/* Function */
.multi-level, .item ul, .nav input[type="checkbox"] {
    display: none;
	text-align: left;
}

#menu:checked ~ .multi-level, .item input:checked ~ ul {
    display: block;
}

/* Initial rotation for unchecked state */
.item input + label .arrow {
    transform: rotate(-90deg);
    -webkit-transform: rotate(-90deg); /* For Safari */
    transition: transform 0.1s ease;
}

/* Rotation for checked state */
.item input:checked + label .arrow {
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg); /* For Safari */
    transition: transform 0.1s ease;
}

/* General rotation class (not directly used in this toggle) */
.rotate {
    -ms-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
    z-index: 200;
}


/* Styles */

a.nav:link {
  text-decoration: none;
    color: inherit;
}

a.nav:visited {
  text-decoration: none;
    color: inherit;
}

a.nav:hover {
  text-decoration: none;
    color: inherit;
}

a.nav:active {
  text-decoration: none;
    color: inherit;
}

label.lvl0 a {
    cursor: pointer;
    color: #336;
  text-decoration: none;
	text-align: left;
	
}

label.lvl0 a:hover {
    cursor: pointer;
    color: #E9EDF4;
  text-decoration: none;
}

label.lvl0 a:active {
    color: #E9EDF4;
  text-decoration: none;
}

label.lvl0 a:visited {
    color: #336;
  text-decoration: none;
}

label.lvl1, lable.lvl2, lable.lvl3, li.lvl1, li.lvl2, li.lvl2, li.lvl3 {
    color: #e9edf4;
    text-decoration: none;
}

label.lvl1, lable.lvl2, lable.lvl3, li.lvl1, li.lvl2, li.lvl2, li.lvl3 , a:active {
    color: #e9edf4;
    text-decoration: none;
}

label.lvl1, lable.lvl2, lable.lvl3, li.lvl1, li.lvl2, li.lvl2, li.lvl3 , a:hover {
    color: #e9edf4;
    text-decoration: none;
}

label.lvl1, lable.lvl2, lable.lvl3, li.lvl1, li.lvl2, li.lvl2, li.lvl3 , a:visited {
    color: #e9edf4;
    text-decoration: none;
}

label.lvl0 {
    width: 100%;
    display: block;
    z-index: 3;
    position: relative;
    background-image: url("/assets/img/bg/bgOpacity.png");
    background-color: #669;
    color: #336;
    padding-left: 1em;
    font-size: 22px;
    font-family: "Lithos Pro Light", "EnglishGrotesque Light", "Bookmania Light", "Lucida Sans Unicode", Verdana, "sans-serif";
}

label.lvl1, li.lvl1 {
    width: 100%;
    display: block;
    z-index: 3;
    position: relative;
    background: #336;
    color: #e9edf4;
    padding-left: 1em;
    font-family: "Lithos Pro Light", "EnglishGrotesque Light", "Bookmania Light", "Lucida Sans Unicode", Verdana, "sans-serif";
    text-decoration: none;
}

label.lvl2, li.lvl2 {
    width: 100%;
    display: block;
    z-index: 3;
    position: relative;
    background-color: #669;
    color: #e9edf4;
    padding-left: 1em;
    font-family: "Lithos Pro Light", "EnglishGrotesque Light", "Bookmania Light", "Lucida Sans Unicode", Verdana, "sans-serif";
    text-decoration: none;
}

label.lvl3, li.lvl3  {
    width: 100%;
    display: block;
    z-index: 3;
    position: relative;
    padding-left: 1em;
    background-color: #9999CC;
    color: #e9edf4;
    font-family: "Lithos Pro Light", "EnglishGrotesque Light", "Bookmania Light", "Lucida Sans Unicode", Verdana, "sans-serif";
}

label.lvl4, li.lvl4 {
    width: 100%;
    display: block;
    z-index: 3;
    position: relative;
    background-color: #CCCCFF;
    color: #333366;
    padding-left: 1em;
    text-decoration: none;
    list-style: none;
    font-family: "Lithos Pro Light", "EnglishGrotesque Light", "Bookmania Light", "Lucida Sans Unicode", Verdana, "sans-serif";
}

label.mini  { 
    width: 100%;
    display: block;
    z-index: 3;
    position: relative;
    background: #336;
    color: #e9edf4;
    padding: 1em;
    font-family: "Lithos Pro Light", "EnglishGrotesque Light", "Bookmania Light", "Lucida Sans Unicode", Verdana, "sans-serif";
    text-decoration: none;
	
}

li.lvl4 a {
    color: #336;
    text-decoration: none;
}

li.lvl4 a:active {
    color: #336;
    text-decoration: none;
}

li.lvl4 a:hover {
    color: #336;
    text-decoration: none;
}

li.lvl4 a:visited {
    color: #336;
    text-decoration: none;
}

#nav-icon {
    font-size: 28px;
    line-height: 36px;
    padding-left: 1em;
}

.nav {
    width:300px;
    background-color: #CCCCFF;
    overflow-x: hidden;
    border: 2px solid #336;
    float: left;
}

.nav ul, .nav li, label {
    line-height: 36px;
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    font-weight: 100;
    width: 100%;
}

.nav li a  {
    line-height: 36px;
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    font-weight: 100;
    padding-left: 1em;
    color: inherit;
}

.item ul {
    padding: 0;
}

.mini-nav {
    width:300px;
    background-color: #CCCCFF;
    border: 2px solid #336;
    float: left;
}

.mini-nav ul, .mini-nav li, label {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    width: 100%;
}

.mini-nav li a  {
    margin: 0;
    padding: 0;
    list-style: none;
    text-decoration: none;
    padding-left: 1em;
    color: inherit;
}