.menu {display: table;margin:auto;}
.menu .menu-checkbox-label { display: none;}
.menu .menu-checkbox-label:before, .menu .menu-checkbox-label:after { background: #999 none repeat scroll 0 0;
    content: "";
    height: 4px;
    position: absolute;
    width: 30px;}
.menu .menu-checkbox-label:before {left: 0px; top: 23px;}
.menu .menu-checkbox-label:after { left: 0px;top: 43px;}
.menu .menu-checkbox, .menu .dropdown-checkbox {display: none;}


.menu-list {list-style: none; margin: 0;padding: 0;}
.menu-list > li {display: inline-block;}
.menu-list > li a, .menu-list > li label  {
color: #999;
cursor: pointer;
display: block;
font-family: "Open Sans",sans-serif;
font-size: 13px;
font-weight: 500;
position: relative;
letter-spacing: 1px;
padding: 0 22px;
text-decoration: none;
text-transform: uppercase;}

.menu-list > li a:hover , .menu-list > li.active a, .menu-list > li label:hover {color:#666;}
.menu-list > li a:hover:before, .menu-list > li.active a:before {left:-33px;}

.menu-left {float:left;}
.menu-right {float:right;}

.menu .dropdown-checkbox:checked + .dropdown-checkbox-label + .dropdown-menu {display:block;}


	.menu-checkbox-label span { display: inline-block;transition: .3s all;width:30px;height:4px;background:#666;}
	.menu .menu-checkbox-label:before, .menu .menu-checkbox-label:after {transition: .3s all;}

	.menu .menu-checkbox:checked + .menu-checkbox-label + .menu-container {left: 0;opacity: 1;}

	.menu .menu-checkbox:checked + .menu-checkbox-label span {opacity:0;}
	.menu .menu-checkbox:checked + .menu-checkbox-label:after {transform: rotate(45deg) translate(-2px, 4px);transform-origin: right center 0;}
	.menu .menu-checkbox:checked + .menu-checkbox-label:before { transform: rotate(-45deg) translate(-5px, -5px);transform-origin: right top 0;}

	.menu .dropdown-menu {background-clip: padding-box;background-color: transparent;border: medium none;border-radius: 0;display: none;float: none;padding: 0;position: relative;text-align: center;
	}