/* Menu */

div.menu_background {
	height: 50px;
	width: 100%;
	position: fixed;
	top: 0px;
	left: 0;
	z-index: 15;
	background-color: white;
}

div#menu_div {
	height: 100%;
	width: 100%;
	background-color: #def0fcb4;
	font-family: 'Comfortaa', cursive;
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	opacity: 1;
}

div.menu_item {
	cursor: pointer;
	flex: 1;
	text-align: center;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #4e4e4e;
	font-weight: 600;
	font-size: 0.8vw;
}

div.menu_item:hover {
	color: #000000;
	font-size: 1vw;
}

/* Progress Bar */

div#progress_bar {
	height: 10px;
	width: 100%;
	position: fixed;
	top: 50px;
	left: 0;
	z-index: 15;
}

div#progress {
	height: 100%;
	width: 0%;
	border-radius: 0px 7px 7px 0px;
	background-color: #2196F3;
	box-shadow:
		inset 0 2px 9px rgba(255, 255, 255, 0.3),
		inset 0 -2px 6px rgba(0, 0, 0, 0.4);
	position: relative;
	overflow: hidden;
	background-image: linear-gradient(to bottom, #aeece9, #0be0d6);
}

@media screen and (max-width: 1800px) {
	div.menu_item {
		font-size: 1vw;
	}

	div.menu_item:hover {
		font-size: 1.2vw;
	}
}

@media screen and (max-width: 1400px) {
	div.menu_item {
		font-size: 1.2vw;
	}

	div.menu_item:hover {
		font-size: 1.4vw;
	}
}

@media screen and (max-width: 1000px) {
	div.menu_item {
		font-size: 1.6vw;
	}

	div.menu_item:hover {
		font-size: 1.8vw;
	}
}