
nav{
	display: block;
	background-color:#FFF;
	margin: 0px;
	top: 0px;
	padding: 0px 30px;
	z-index: 200;
}

ul{
	list-style-type: none;
	padding: 0px 00px;
	width: 100%;
}

li button{
	border: 0px solid #F4C7CE;
	border-radius:0px;
	background: transparent;
	color: #000;
	cursor: pointer;
	display: block;
	width: 100%;
	padding: 30px 10px;
	font-size: 20px;
	margin: 0px;
}


li button:hover{
	text-decoration: none/*underline*/;
	color:#F00;
}

.menu li button{
	display: block;
	/*background: #F46136*/
}

.logo img{
	height: 100px;
	width: auto;
	margin-left: 0px;
}

/*------------Mobile Menu------------*/

.menu{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	margin: 0px;
	
}
.toggle{
	order: 1;
}

.item{
	order: 4;
}


.item{
	width: 100%;
	text-align: center;
	order: 3;
	display:none;

}

.item.active{
	display: block;
}

.toggle{
	cursor: pointer;
	
}

.bars{
	background: #FFF;
	display: inline-block;
	height: 3px;
	position: relative;
	width: 25px;
}
.bars::before,.bars::after{
	background: #F00;
	content: "";
	display: inline-block;
	height: 3px;
	position: absolute;
	width: 25px;
}

.bars::before{
	top: 8px;
}
.bars::after{
	top: -8px;
}

/*------------Tablet Menu------------*/

@media all and (min-width:767px){
	
	.menu{
		justify-content: center;
	}
	
	.logo{
		flex:1;
	}
	
	
	.toggle{
		order:2;
		margin: 0px 0px 5px 5px;
	}
	
	li button {
	border: none;
	border-radius:0px;
	cursor: pointer;
	display: block;
	width: 100%;
	padding: 0px 10px;
	font-size: 20px;
	margin: 0px;
	}
	
	
}

/*------------Desktop Menu------------*/

@media all and (min-width:1025px){
	
	nav{
		display: flex;
		flex-wrap: wrap;
		width: 100%;
		justify-content: space-between;
		align-content: center;
		background-color: #FFF;
		z-index: 100;
	}
	
	
	
	.menu{
		display: flex;
		flex-wrap: wrap;
		max-width: 1024px;
		justify-content: space-between;
		align-items: center;
		margin: auto;
	
	}
	
	
	.item{
		display:block;
		width: auto;
		order: 1;
		
	}
	
	
	.toggle{
		display: none;
		margin: 0px 0px 0px 0px;
	}
	
	.logo{
		order:0;
	}
	
	
	
}







