@import url('https://fonts.googleapis.com/css2?family=Amiri:ital,wght@0,400;0,700;1,400;1,700&family=Poppins:wght@400;500;700&display=swap');

*{
	padding:0;
	margin:0;
	box-sizing:border-box;
	list-style:none;
	text-decoration:none;
	font-family: "Amiri", serif;
	font-style: normal;
}

header{
	background:#14A3C7;
    color:#000;
	border-bottom:1px solid #ccc;
    
}

header a{
	color:#fff;
	font-weight:bold;
	font-size:21px;
	background:;
}

header .navbar{
	background:;
	display:flex;
	align-items:center;
	justify-content:space-between;
	min-height:70px;
	padding:0 24px;
	width:90%;
	margin:auto;
}

.nav-menu{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:30px;
}
.nav-brand{
	font-size:30px;
	font-weight:bold;
}
.nav-link{
	transition:.4s;
}
.nav-link:hover{
	color:#ffffff;transition:.4s;text-decoration:underline;
}
.hamburger{
	display:none;
	cursor:pointer;
	/*color:#000;*/
}
.hamburger .bar{
	display:block;
	width:24px;
	height:3px;
	margin:5px auto;
	webkit-transaction: all 0.3s ease-in-out;
	transition:all 0.3s ease-in-out;
	background:#000;
	/*color:#000;*/
}

@media (max-width:768px){
	
	header a{
	color:#ffffff;
	font-weight:bold;
	font-size:21px;
	font-weight:bold;
}
	.hamburger{
		display:block;
	}
	
	.hamburger.active .bar:nth-child(2){
		opacity:0;
	}
	.hamburger.active .bar:nth-child(1){
		transform:translateY(8px) rotate(45deg);
	}
	.hamburger.active .bar:nth-child(3){
		transform:translateY(-8px) rotate(-45deg);
	}
	
	.nav-menu{
		position:fixed;
		left:-100%;
		top:70px;
		gap:0;
		flex-direction:column;
		background:#14A3C7;
		opacity:95%;
		width:100%;
		text-align:center;
		transition:0.5s;
		z-index: 1;
		font-weight:bold;
		border-TOP:2px solid #ffffff;font-weight:bold;
	}
	.nav-link{
	transition:.4s;background:;padding:0px 100px;
}
	.nav-item{
		margin:0px 0;width:100%;transition:0.3s;font-weight:bold;font-size:19px;
	}
	.nav-item:hover{background:blue;transition:0.3s;font-size:19px;}
	.nav-menu.active{
		left:0;
	}
	
	
	
	
}