#menu-bar {
	display: none;
}

header label {
	float: right;
	font-size: 30px;
	margin-top: 40px;
	margin-right: 30px;
	cursor: pointer;
}


.menu {
	font-family: Raleway;
	font-style: 300;
	font-size: 15px;
	position: absolute;
	width: 100%;
	height: 100vh;
	top: 150px;
	left: 0;
	background: rgba(240,240,240,0.9); 
	transition: all 0s;
	transform: translateX(-100%);
	z-index: 100;
}

.menu a {
	display: block;
	color: #0033A0;
	height: 50px;
	text-decoration: none;
	padding: 15px;
	border-bottom: 1px solid rgba(255,255,255,0.5)
}

.menu a:hover {
	background: rgba(255,255,255,0.3)
} 


#menu-bar:checked ~ .menu {
	transform: translateX(0%);
}


@media (min-width: 1024px) {
	.menu {
		position: static;
		width: auto;
		height: auto;
		transform: translateX(0%);
		float: right;
		display: flex;
		background-color: #FFFFFF;
		}

	.menu a {
		border: none;
		margin-top: 40px;
	}

	header label {
		display: none;

	}
}