#sidemenu {
	padding: 4px;
}

.vertical-menu {
	display: none;
	width: 100%;
	border: 1px solid  #e8e8e8;
}

.vertical-menu ul {	
	list-style-type: none;
}

.vertical-menu li {
	position: relative;
}

.vertical-menu input {
	display: none;
}

.vertical-menu label {
	display: block;
	position: absolute;
	top: 0px; right: 0px;
	width: 40px; height: 40px;
	background: url('../img/icons.png') 0px 0px;
}


.vertical-menu div {
	display: block;
	position: relative;
}

.vertical-menu a {
	display: block;
	background-color: #ffffff;
	border-top: 1px solid #d8d8d8;
	padding: 0 56px 0 16px;
	line-height: 40px;
	height: 40px;
	font-weight: bold;
}

.vertical-menu input ~ li div {
	height: 0;
	opacity: 0;
	transition: height 0.3s, opacity 0.3s;
	overflow: hidden;
}

.vertical-menu > ul > li > ul > input:checked ~ li > div,
.vertical-menu > ul > li > ul > input:checked ~ li > ul > input:checked ~ li > div,
.vertical-menu > ul > li > ul > input:checked ~ li > ul > input:checked ~ li > ul > input:checked ~ li > div {
	height: 40px;
	opacity: 1;	
}

.vertical-menu input ~ li label {
	display: none;
}

.vertical-menu input:checked ~ li label {
	display: block;
}

.vertical-menu a:hover,
.vertical-menu label:hover {
	background-color: #316400;
}
.vertical-menu a:hover span {
	color: #ffffff;
}
.vertical-menu label:hover {
	background: #316400 url('../img/icons.png') -40px 0px;
}



.vertical-menu li li a {
	background: #e8e8e8;
	padding-left: 32px;
}

.vertical-menu li li li a {
	background: #d8d8d8;
	padding-left: 48px;
	border-top: 1px solid #c8c8c8;
}

.vertical-menu li li li li a {
	background: #c8c8c8;
	padding-left: 56px;
}

.vertical-menu li input:checked + label {
	background-position: -80px 0px;
}

.vertical-menu li input:checked + label:hover {
	background-position: -120px 0px;
}

.vertical-menu li input:checked + label.selected {
	background-position: -120px 0px;
}

.vertical-menu label.selected {
	background-position: -40px 0px;
	border-color: #453c31;
}

.vertical-menu a.selected {
	background-color: #545454;
	border-color: #545454;

}
.vertical-menu a.selected span {
	color: #ffffff;
}

.vertical-menu-switch {
	display: none;
}

.vertical-menu-switch-label {
	display: block;
	height: 40px;
	line-height: 36px;
	border: 3px solid #eab000;
	padding-left: 16px;
	position: relative;
}
.vertical-menu-switch-label:after {
	display: inline-block;
	content: '';
	width: 40px;
	height: 40px;
	background: url('../img/icons.png') 0px 0px;
	position: absolute;
	top: -3px; right: -3px;
}

.vertical-menu-switch:checked + .vertical-menu-switch-label {
	background-color: #eab000;
	color: #ffffff;
}

.vertical-menu-switch:checked + .vertical-menu-switch-label:after {
	background-position: -120px 0px;
}

.vertical-menu-switch:checked ~ .vertical-menu {
	display: block;
}

.vertical-menu > ul li:first-child > div a  {
   border-top: none;
}

@media (min-width: 768px) {
	.vertical-menu {
		display: block;
	}
	.vertical-menu-switch-label {
		display: none;
	}
}
