header {
	width: 100%;
	height: 80px;
	background: top right repeat-x #16874d;
	background-size: auto 100%;
	z-index: 9999999999999;
	background-position-x: 33%;
	border-bottom: 7px solid #338faa;
}

.header {
	width: 100%;
	margin: auto;
	height: 100%;
	display: flex;
	justify-content: space-between;
	padding: 0px 20px;
}

.left {
	display:flex;
	justify-content: center;
	align-items: center;
	width: auto;
	height: 100%;
}

.sitename {
	color: #fff;
	font-size: 18px;
	font-weight: bold;
	margin-left:5px;
}

.center {
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex: 1;
	padding: 0px 30px;
}

.centerLi {
	width: auto;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	text-transform: capitalize;
	font-weight: 600;
	font-size: 14px;
	padding: 0px 20px;
	cursor: pointer;
}

.right {
	width: 10%;
	height: 100%;
	display: none;
	justify-content: flex-end;
	align-items: center;
}

.search,
.menu {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	padding: 8px;
	/* border: 2px solid #fff; */
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}


.menu {
	margin-right: 20px;
	display: none;
	position: absolute;
	left: 8px;
}

.menu img {
	width: 30px;
	height: 30px;
}

.search img {
	width: 28px;
	height: 28px;
}

.left img {
	width: auto;
	height: 50px;
}

@media screen and (max-width:960px) {
    header{
		height: 60px;
	}

	.left img {
		/* position: absolute; */
		width: auto;
		height: 50px;
		left: 0px;
		right: 0px;
		margin: auto;
	}

	.header {
		width: 100%;
	}

	.right {
		display: flex;
	}

	.menu {
		display: flex;
	}

	.center {
		width: 100%;
		position: absolute;
		top: 60px;
		left: -100vw;
		height: 100vh;
		flex-wrap: wrap;
		align-content: flex-start;
		background-color: #f7f7d2;
		z-index: 99999;
		transition: all 0.5s;
		padding: 0px;
	}

	.centerLi {
		width: 90%;
		margin: auto;
		height: 50px;
		border-bottom: 1px dashed;
	}
}