nav{
	background-color: #FAFAFA;
	opacity: .95;
	padding: 0px 30px;
	z-index: 100;
}

ul{
	list-style-type: none;
	padding: 10px 20px;
	width: 100%;
}

li button{
	border: thin solid #FAFAFA;
	border-radius:0px;
	background: transparent;
	color:#385875;
	cursor: pointer;
	display: block;
	width: 100%;
	padding: 30px 20px;
	font-size: 16px;
	margin: 5px;
}


li button:hover{
	text-decoration: none/*underline*/;
	color:rgba(69,101,130,0.85);
}

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

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

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

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

.item{
	order: 4;
}

.login{
	order:2;
}

.register{
	order:3;
}

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

}

.item.active{
	display: block;
}

.toggle{
	cursor: pointer;
	
}

.bars{
	background: #456582;
	display: inline-block;
	height: 3px;
	position: relative;
	width: 25px;
}
.bars::before,.bars::after{
	background: #456582;
	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;
	}
	
	
	.item.login:hover{
		background:#AC4F25;
	}
	
	.item.register{
		background: #F46136;
		order:1;
		width: auto;
		display:inherit;
		border:1px solid #F46136;
		border-radius: 0px;
		margin: 0px 10px 0px 0px;
	}
	
	.item.register:hover{
		background:#AC4F25;
	}
	
	.toggle{
		order:2;
		margin: 0px 0px 5px 10px;
	}
	
	li button {
	border: none;
	border-radius:0px;
	cursor: pointer;
	display: block;
	width: 100%;
	padding: 5px 10px;
	font-size: 20px;
	margin: 5px;
	}
	
	
}

/*------------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: #FAFAFA;
		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;
	}
	
	.login{
		background: #F46136;
		order:1;
		width: auto;
		display:inherit;
		border:1px solid #F46136;
		border-radius: 0px;
		margin: 0px 10px 0px 20px;
	}
	
	.login:hover{
		background:#AC4F25;
	}
	
	.register{
		background: #F46136;
		order:1;
		width: auto;
		display:inherit;
		border:1px solid #F46136;
		border-radius: 0px;
		margin: 0px 10px 0px 0px;
	}
	
	.register:hover{
		background:#AC4F25;
	}
	
}