/***** begin NAVIGATION **********************/
/* begin NAVIGATION for screen width until 40em */
#main-nav {
	background: white;
	margin-left: 1em;
	margin-right: 1em;
	white-space: nowrap;
	overflow-x: auto;
	}
	
#main-nav a {
	padding: 0.5em 1em;
	display:inline-block;
	font-weight:bold;
	color: black;
	background: white;
	font-size: 1.1em;
	text-decoration: none; 
}

#main-nav a:focus,
#main-nav a:hover,
#main-nav a:active {
	text-decoration: underline;
}

#main-nav a[aria-current=page] {
	color: black;
	background: white;
	text-decoration: underline;
}
	 
#main-nav a[aria-current=page]:focus,
#main-nav a[aria-current=page]:hover,
#main-nav a[aria-current=page]:active {

}	
/* end NAVIGATION for screen width until 40em */

/* begin NAVIGATION for screen width above 40em */
@media screen and (min-width: 40em) {
	#main-nav {
	  background: black;
	}

	#main-nav a {
	  padding: 0.5em 1em;
	  display:inline-block;
	  font-weight:bold;
	  color: #eeeeee;
	  width: 7em;
	  font-size: 1.1em;
	  text-decoration: none; 
	  background: black;
	}

	#main-nav a:focus,
	#main-nav a:hover,
	#main-nav a:active {
	  color: black;
	  text-decoration: underline;
	  background: white;
	  border-radius: 0.2em 0.2em 0em 0em;
	}

	#main-nav a[aria-current=page] {
	  color: black;
	  text-decoration: none;
	  background: white;
	  border-radius: 0.2em 0.2em 0em 0em;
	}
	 
	#main-nav a[aria-current=page]:focus,
	#main-nav a[aria-current=page]:hover,
	#main-nav a[aria-current=page]:active {
	  color: black;
	  text-decoration: none;
	  background: white;
	}
	
	#main-nav a[aria-current=menuIcon] {
	  width: 1.2em;
	 }
	
}
/* end NAVIGATION for screen width above 40em */


nav.subMenu {
	background: white;
	margin-left: 1em;
	margin-right: 1em;
	white-space: nowrap;
	overflow-x: auto;
}

	
a.subMenu {
	padding: 0.6em 0.6em;
	display:inline-block;
	font-weight:bold;
	width: auto;
	color: black;
	background: white;
	font-size: 1em;
	text-decoration: none; 
}

.subMenu a:focus,
.subMenu a:hover,
.subMenu  a:active {
	  text-decoration: underline;
}
	
.subMenu a[aria-current=page] {
	  text-decoration: underline;
}

#menuLeft {
	text-align: left;
	margin-left: 1em;
	background: black;
	overflow: hidden;
	z-index: 0;
	position: absolute;
	overflow-Y: auto;
}

[aria-state="show"]{
	height: 100%;
}

[aria-state="hide"]{
	height: 0;
}

.menuLevel1 {
	margin-top: 1em;
	margin-left: 1em;
	padding-top: 0.2em;
	border-top-style: dotted;
	border-top-width: thin;
	margin-right: 1em;
	color: #eeeeee;
	display:block;
	text-decoration: none;
	font-weight:bold;
}

.menuLevel2 {
	margin-left: 2em;
	margin-right: 1em;
	color: #eeeeee;
	display:block;
	text-decoration: none;
}

.menuCross {
	margin-right: 1em;
	color: #eeeeee;
	text-align: right;
	display:block;
	text-decoration: none;
	font-size: 0.8em;
}

/***** end NAVIGATION **********************/