#head_menu {
	background: #8a9b0f;
}

@media only screen and (min-width: 737px) {
	.dropmenu {
		*zoom: 1;
		list-style-type: none;
		margin: 5px 20px 20px;
		padding: 0;
	}
	.dropmenu:before, .dropmenu:after {
		content: "";
		display: table;
	}
	.dropmenu:after {
		clear: both;
	}
	.dropmenu li a {
		display: block;
		margin: 0;
		padding: 15px 0 11px;
		background: #8a9b0f;
		color: #fff;
		font-size: 14px;
		line-height: 1;
		text-decoration: none;
	}

	#dropmenu-logout {
		display: inline;
		float: right;
	}

	.dropmenu li ul{
		list-style: none;
		position: absolute;
		z-index: 9999;
		top: 100%;
		left: 0;
		margin: 0;
		padding: 0;
	}
	.dropmenu li ul li {
		width: 100%;
	}
	.dropmenu li ul li a {
		padding: 13px 15px;
		border-top: 1px solid #7c8c0e;
		background: #6e7c0c;
		text-align: left;
	}
	.dropmenu li:hover > a {
		background: #6e7c0c;
	}
	.dropmenu li a:hover {
		background: #616d0b;
	}

	.dropmenu li ul{
	  visibility: hidden;
	  opacity: 0;
	  transition: 0s;
	}
	.dropmenu li:hover ul{
	  visibility: visible;
	  opacity: 1;
	}
	.dropmenu li ul li a{
	  visibility: hidden;
	  opacity: 0;
	  transition: .5s;
	}
	.dropmenu li:hover ul li a{
	  visibility: visible;
	  opacity: 1;
	}

	#menu-schedule {
		background:url(../img/icon/icon_schedule_white_32.png);
		background-repeat: no-repeat;
		margin:10px 6px 6px 6px;
		text-decoration: none;
		padding-top: 11px;
	}
	#menu-user {
		background:url(../img/icon/icon_user_white_32.png);
		background-repeat: no-repeat;
		margin:10px 6px 6px 6px;
		text-decoration: none;
		padding-top: 11px;
	}
	#menu-work {
		background:url(../img/icon/icon_work_white_32.png);
		background-repeat: no-repeat;
		margin:10px 6px 6px 6px;
		text-decoration: none;
		padding-top: 11px;
	}
	#menu-reserve {
		background:url(../img/icon/icon_reserve_white_32.png);
		background-repeat: no-repeat;
		margin:10px 6px 6px 6px;
		text-decoration: none;
		padding-top: 11px;
	}

	#menu-logout {
		padding: 20px 0 11px;;
	}
}

@media only screen and (max-width: 736px) {
	.dropmenu {
		*zoom: 1;
		list-style-type: none;
		width: 340px;
		margin: 5px auto 5px;
		padding: 0;
	}
	.dropmenu:before, .dropmenu:after {
		content: "";
		display: table;
	}
	.dropmenu:after {
		clear: both;
	}
	.dropmenu li a {
		display: block;
		margin: 0;
		padding: 15px 0 11px;
		background: #8a9b0f;
		color: #fff;
		font-size: 12px;
		line-height: 1;
		text-decoration: none;
	}

	.dropmenu-logout {
		right: -130px;
	}

	.dropmenu-logout a {
		width: 80px;
	}

	.dropmenu li ul{
		list-style: none;
		position: absolute;
		z-index: 9999;
		top: 100%;
		left: 0;
		margin: 0;
		padding: 0;
	}
	.dropmenu li ul li {
		width: 100%;
	}
	.dropmenu li ul li a {
		padding: 13px 15px;
		border-top: 1px solid #7c8c0e;
		background: #6e7c0c;
		text-align: left;
	}
	.dropmenu li:hover > a {
		background: #6e7c0c;
	}
	.dropmenu li a:hover {
		background: #616d0b;
	}

	.dropmenu li ul{
	  visibility: hidden;
	  opacity: 0;
	  transition: 0s;
	}
	.dropmenu li:hover ul{
	  visibility: visible;
	  opacity: 1;
	}
	.dropmenu li ul li a{
	  visibility: hidden;
	  opacity: 0;
	  transition: .5s;
	}
	.dropmenu li:hover ul li a{
	  visibility: visible;
	  opacity: 1;
	}

	.menu-item {
		width: 140px;
	}

	#menu-schedule {
		background:url(../img/icon/icon_schedule_white_32.png);
		background-repeat: no-repeat;
		margin:10px 6px 6px 6px;
		text-decoration: none;
	    height: 32px;
	    width: 32px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#menu-user {
		background:url(../img/icon/icon_user_white_32.png);
		background-repeat: no-repeat;
		margin:10px 6px 6px 6px;
		text-decoration: none;
	    height: 32px;
	    width: 32px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#menu-work {
		background:url(../img/icon/icon_work_white_32.png);
		background-repeat: no-repeat;
		margin:10px 6px 6px 6px;
		text-decoration: none;
	    height: 32px;
	    width: 32px;
		text-indent: 100%;
		white-space: nowrap;
		overflow: hidden;
	}
	#menu-logout {
		padding: 18px 0 11px;;
	}
}

@media only screen and (min-width: 900px) {
	.dropmenu li {
		position: relative;
		width: 20%;
		float: left;
		margin: 0;
		padding: 0;
		text-align: center;
	}
}

@media only screen and (max-width: 899px) and (min-width: 737px) {
	.dropmenu li {
		position: relative;
		width: 25%;
		float: left;
		margin: 0;
		padding: 0;
		text-align: center;
	}
}

@media only screen and (max-width: 736px) {
	.dropmenu li {
		position: relative;
		width: 20%;
		float: left;
		margin: 0;
		padding: 0;
		text-align: center;
	}
}