body {
 
	width: 100%;
	margin: 0px;
	font-family: arial;
	font-size: 1em;
	background-color: #ebebe0;

	/* Prevent font scaling in landscape while allowing user zoom */
	-webkit-text-size-adjust: 100%;

	/* Mobile Safari resizes elements based on its best guess of what's going to be readable for the user. Override this with:  */
	-webkit-text-size-adjust: none;
}



/* Navigation Bar */
/* Add background color to the top naviation */

.topnav a {
	color: white !important;
}

.dropdown {
	color:white;
}

.hamburger-menu {
	display: none;
}

#nav-menu-links {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}

.topnav, .dropdown{
	background-color: #333;
	padding: 0px 0px 0px 5px;
	overflow: hidden;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	font-size: max(0.9vw, 0.9em, 0.9rem);
	align-items: center;
}

.topnav a, .dropdown a {;
	text-align: flex-start;
/*	margin:0px;*/
	margin-left: -5px;
	padding: 20px;
	text-decoration: none; /* Remove Underline */
	font-size: max(1vw, 1em, 1rem);
}

/* Add a color to the active link */
.topnav a.active {
/*	margin:0px;*/
	background-color: #04AA6D;
	color: white;
}

.topnav button {
	color: white;
}

/* Change color of home links on hover */
.topnav a:hover {
	background-color: #666666; /* whiter */
	color: white;
}

.dropdown {
/*	margin:0px;*/
	padding-top:20px;
	padding-bottom:20px;
/*	overflow: hidden;
	float: left;*/
}

.dropdown .dropbtn {
	border: none;
	background-color: inherit;
	font-family: inherit;
/*	margin: 0px;*/
	font-size: max(1vw, 1em, 1rem);
}

@media screen and (max-width: 635px) {
	.dropdown .dropbtn {
		font-size: max(0.9vw, 0.9em, 0.9rem);
	}
}

.dropdown-content {
	display: none;
	position: absolute;
	top: 55px;
	margin-left: -5px;
	background-color:#ffff80
}

.dropdown-content a {
  color: black !important;
  padding: 12px 16px;
  text-decoration: none;
/*  display: block;*/
	display: flex;
  text-align: left;
}

.dropdown-content a:hover {
/*	margin:0px;*/
	background-color: #262626;
	color: white !important;
}

/*.dropdown:hover .dropdown-content {
	display: block;
}*/

.dropdown:hover .dropdown-content, .dropdown:active .dropdown-content {
	display: block;
}

.dropbtn:active .dropdown-content {
	display: block;
}

.dropdown:hover {
	background-color: #666666;
}


h1, h2, h3{
	text-align: center;
}

h3 {
	margin-top:50px;
}

ul {
	margin: auto;
	max-width: 600px;
	background-color:#a6a6a6;
	border-radius:10px;
}

li{
	font-size:1.3em;
	margin:5px;
	padding:10px;
}

@media screen and (max-width: 499px) {

.hamburger-menu {
/*	display: flex;*/
	display: block;
}

#nav-menu-links {
		display: none;
}

.topnav:first-child{
		padding:20px 35px 20px 0px;
}

.topnav {
		pointer-events: all;
		position: relative;
/*	 margin:auto;
	   margin:0px;*/
	   width:100%;
/*	 padding:5px;*/
	    display: block;
	    overflow:visible;
	    background-color: #333;
/*	  position: relative;*/
	}
	
	.topnav a {
		color: white;
		padding: 20px;
		width:100%;
	  text-decoration: none;
	  font-size: 17px;  
	}

	.hamburger-menu {
		display:block;
		color:white;
		padding-top:20px;
		padding-bottom:20px;
		padding-right:20px;
		width:50px;
		position: absolute;
		right:0;
		top:0;
	}

	.topnav a.hamburger-menu {
		margin:auto;
		overflow:visible;
		display: block;
		padding-top: 20px;
		padding-bottom: 20px;
		width:50px;
		background: #333;
		position: absolute;
		right:0;
		top: 0;
	}

	.topnav a:hover {
	  background-color: #ddd;
	  color: black;
	}
	
	.active {
	  background-color: #04AA6D;
	  color: white;
	}

	.dropdown:first-child{
		margin-top:20px;
	}
	.dropdown {
		margin:0px;
		padding:10px;
		padding-top: 10px;
		padding-bottom: 10px;
		display:block;
		width:500px;
		overflow:visible;
	}

	.dropdown-content {
		margin:auto;
		padding:0px;
		height:1px;
		margin-left:-15px;
		margin-top:-40px;
		width:100%;

		height:fit-content;
/*		height: 100%;*/
		position:relative;
		top:50px;
		overflow:visible;
		overflow-y: visible;
		-webkit-overflow-scrolling: auto!important;

		/*Give us inertia style scrolling on WebKit based touch devices*/
		-webkit-overflow-scrolling: touch;
	}

	.dropdown-content a {
		font-size:0.9em;
		margin:0px;
		margin-left:20px;
		padding:8px;
	}

	.dropdown-content a:hover {
		margin:0px;
		padding-left:35px;
		background-color:black;
		color:white;
	}

	.dropdown-content:not(.dropdown:last-child) a:last-child{
 		margin-bottom:40px; 
	}

	.dropdown:last-child .dropdown-content a:last-child {
		margin-bottom: 20px;
		overflow: hidden;
	}

/*	.topnav:not(:last-child) .dropdown-content a:last-child{
 		margin-bottom:40px; 
	}	*/

	.topnav a.active {
		margin:0px;
		margin-bottom:40px;
		padding-left: 30px;
		background-color: #04AA6D; /*green background */
		color: white;
	}

/*	.topnav .dropdown:last-child .dropdown-content:last-child {
		margin-bottom:20px;
	}*/

	.dropdown {
		overflow:visible;
		position:relative;
		top:0;
	}

/*	.topnav .dropdown:last-child .dropdown-content:last-child {
		margin-bottom:-40px;
		overflow: visible;
	}	*/

	.dropdown-content .active:first-child {
		margin-bottom:0px;
	}

	.dropdown-content .active:first-child {
		margin-bottom:0px;
	}

	.dropdown-content .active:not(:first-child):not(:last-child) {
		margin-bottom:0px;
	}

	#contact-nav {
		margin-bottom:35px;
	}
	
	#contact-nav .active {
		position:absolute;
		font-size:inherit;
		background-color: #04AA6D;	
	}

}