nav {
position: fixed;
display: flex;
height: 15vh;
width: 100%;
z-index: 99;
background: rgba(0, 0, 0, 0.6);
transition: 0.3 ease;
background: #0c1c2c;
}

.topnav {transition: 0.3s;}

	.navimg {
	position: relative;
	height: 100%;
	width: 10%;
	overflow: hidden;
	}
		.navimg a {
		position: relative;
		height: 100%;
		width: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		overflow: hidden;
		}
		.navimg img {
		height: 100%;
		}
	.navpag {
	position: absolute;
	height: 100%;
	width: 50%;
	margin: 0 25%;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	}
		.navpag a {
		position: relative;
		margin: 0 1vw;
		font-size: 1.4vw;
		text-decoration: none;
		text-transform: capitalize;
		font-weight: 500;
		letter-spacing: 1px;
		color: #fff;
		border-bottom: solid transparent 2px;
		}
		.navpag .active, .navpag a:hover {
		color: #109d8b;
		}


@media screen and (max-width: 900px) {
	.navimg {
	display: none;
	}
	.navpag {
	height: 100%;
	width: 100%;
	left: 0;
	margin: 0;
	}
		.navpag a {
		font-size: 3.5vw;
		}
}
@media screen and (max-width: 700px) {
		.navpag a {
		font-size: 4vw;
		}
}
@media screen and (max-width: 500px) {
		.navpag a {
		font-size: 4.5vw;
		}
}