/*small screen = default*/
/* --> hide all links, except for the first one ("Home"). Show the link that contains should open and close the topnav (.icon) */

	a.topnavW {
		display:inline-block;
		width:80%;
		font-family: "Eudoxus Sans", system-ui, sans-serif, verdana;
		border: 1px solid transparent;
		border-radius: 20px;
		color:#313715;
		float: left;
		font-size: 17px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: normal;
		margin: 0px 0px 5px 0px;
		padding: 5px 15px 5px 15px;
		text-align:left;
		text-decoration: none;
	}

	a.topnavW:hover{
		text-decoration:underline;
	}
	
	a.topnavW1{
		display:inline-block;
		width:80%;
		font-family: "Eudoxus Sans", system-ui, sans-serif, verdana;
		border: 1px solid #313715;
		border-radius: 20px;
		color:#313715;
		float: left;
		font-size: 17px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: normal;
		margin: 0px 0px 5px 0px;
		padding: 5px 15px 5px 15px;
		text-align:center;
		text-decoration: none;
	}

	a.topnavW1:hover{
		text-decoration:none;
		background-color:#AB975D;
		border-color:#AB975D;
		color:#F4F6DF;
	}

	a.topnavW2{
		display:inline-block;
		width:80%;
		font-family: "Eudoxus Sans", system-ui, sans-serif, verdana;
		background-color:#313715;
		border: 1px solid #313715;
		border-radius: 20px;
		color:#F4F6DF;
		float: left;
		font-size: 17px;
		font-style: normal;
		font-weight: 400;
		letter-spacing: normal;
		margin: 0px 0px 5px 0px;
		padding: 5px 15px 5px 15px;
		text-align:center;
		text-decoration: none;
	}

	a.topnavW2:hover{
		border-color:#E9EDBF;
		background-color:#E9EDBF;
		color:#313715;
	}


.topnav{
	overflow:hidden;
	display:none;
}

/* Style the links inside the navigation bar */
.topnav a{
	display:block;
	float:none;
	
	font-family:'Eudoxus Sans',system-ui,sans-serif,verdana;
	font-weight:400;
	font-style:normal;
	color:#313715;
	text-decoration:none;
	text-align:left;
	letter-spacing:0px;
	padding:10px 0px 10px 5px;
	margin-left:5px;
}

.topnav a:hover {
	text-decoration:underline;
}

.topnav a.box1{
	/* border-color:#313715; */
}

.topnav a.box1:hover{
	/* text-decoration:none; */
	/* background-color:#AB975D; */
	/* border-color:#AB975D; */
	/* color:#F4F6DF; */
}

.topnav a.box2{
	border-color:#313715;
	background-color:#313715;
	color:#F4F6DF;
}

.topnav a.box2:hover{
	text-decoration:none;
	/* border-color:#E9EDBF; */
	/* background-color:#E9EDBF; */
	/* color:#313715; */
	
	background-color:#AB975D;
	border-color:#AB975D;
	color:#F4F6DF;

}

.topnav a.active{
	background-color:#e56523;
	color:#2f569d;
}

/*big screen%/
/* Hide the link that should open and close the topnav on small screens */
@media screen and (min-width:737px) {
/* @media only screen and (min-resolution:165dpi) and (max-resolution:168dpi), only screen and (min-resolution:155dpi) and (max-resolution:160dpi), only screen and (min-resolution:134dpi) and (max-resolution:144dpi), only screen and (min-resolution:120dpi) and (max-resolution:130dpi), only screen and (max-resolution:116dpi) { */
	a.topnavW, a.topnavW1, a.topnavW2 {
		display:none;
	}

	.topnavcontainer{
		text-align:center;
	}
	.topnav{
		display:block;
		background-color:transparent;
		margin-top:16px;
		margin-left:10;
		margin-right:10;
		overflow:visible;
		float:right;
	}

	.topnav a{
		float:left;
		margin-right:15px;
		font-size:17px;
		border:1px solid transparent;
		padding:5px 15px 5px 15px;
		border-radius: 20px;
	}

	.topnav a.box1{
		border-color:#313715;
	}

	.topnav a.box1:hover{
		text-decoration:none;
		background-color:#AB975D;
		border-color:#AB975D;
		color:#F4F6DF;
	}

	.topnav a.box2{
		border-color:#313715;
		background-color:#313715;
		color:#F4F6DF;
	}

	.topnav a.box2:hover{
		text-decoration: none;
		border-color:#E9EDBF;
		background-color:#E9EDBF;
		color:#313715;
	}

}