#menu-icon {

	display: hidden;
	width: 40px;
	height: 40px;
	background: #4C8FEC url(images/menu-icon.png) center;

}

a:hover#menu-icon {

	background-color: #444;
	border-radius: 4px 4px 0 0;

}


/*MEDIA QUERY*/
@media only screen and (max-width : 640px) {

	.menu-icon {

		display:inline-block;

	}

	.menu ul, .menu:active ul { 

		display: none;
		position: absolute;
		padding: 20px;
		background: #fff;
		border: 5px solid #444;
		right: 20px;
		top: 60px;
		width: 50%;
		border-radius: 4px 0 4px 4px;

	}

	.menu li {

		text-align: center;
		width: 90%;
		padding: 10px 0;
		margin: 0;

	}

	.menu:hover ul {

		display: block;

	}
}