body {
	margin: 0;
	text-align: left;
	color: rgb(100, 100, 100);
	font-family: Helvetica, Arial, Verdana, sans-serif;
}

h1 {
	background-color: rgb(61, 69, 82);
	color: white;
	padding: 1em;
	padding-top: 1em;
	margin: 0;
	font-size: 10rem;
}

h2, h3, h4, h5, h6 {
	color: rgb(163, 204, 173);
	margin: 1rem;
}
nav {
	display: inline-block;
	position: fixed;
	top: 0;
	width: 100%;	
}

nav a {

	float: left;
	width: 100%;
	font-size: 1.2em;
}

nav ul {
	width: 100%;
	list-style: none;
	margin: 0;
	padding: 0;
}

nav li {
	width: 100%;
}


nav ul ul{
	display: none;
}
	
nav ul li:hover > ul {
	display: inline-block;
	background-color: WHITE;

	
}
nav ul {
	box-shadow: none;
}
nav #menu-bar ul  {
	box-shadow: 0 0 1em rgba(0,0,0,0.2);
}
	nav ul:after {
		content: ""; clear: both; display: block;
	}
/*For showing the path of the current page. Below header.*/
.backlinks {
	margin-left: 1em;
	
}

a {
color: rgb(61, 109, 140);
}
a :visited {
	color: rgb(163, 204, 173);
}
a:hover, a:focus {
	color: rgb(243, 114, 115);
}


table {
	padding: 1em;
	font-weight: normal;
	border-style: solid;
	border-width: 1px;
	border-color: rgb(163, 204, 173);
	font-size: 0.8em;
	max-width: 100%;
	/*width: 100%; */
}

th.index {

	color: rgb(163, 204, 173);
	font-size: 1.2em;
	font-weight: bold;
	border-bottom: 1px solid rgb(163, 204, 173);
	border-right: 1px solid rgb(163, 204, 173);

}


p {
	margin: 1rem;
	
}

nav a, nav a:visited {
	
	background-color: rgb(61, 69, 82);
	color: WHITE;
	padding: 1em 1.25em;
	text-decoration: none;
	-webkit-transition: background-color 0.2s;
	transition: background-color 0.2s;
}


nav a:hover, nav a:focus {
	color: rgb(61, 69, 82);
	background-color: rgb(163, 204, 173);
}


img {
	max-width: 100%;
	
}

.shaded-banner {
	background-color: rgb(230, 242, 232);
	padding: 1em;

}

label{
	padding-left: 1em;
}


.article {
	background-color: white;
}

q {
	font-style: italic;
	font-weight: normal;
}

/*form*/
form{
	text-align: center;
}

form fieldset{
	border-style: none;
}

form > div{
  margin: 1em 0;
}

form .form-element{
  margin: .5em 0;
}

form legend{
  font-size: 1.2em;
  background-color: white;
  border-width: .25em;
  border-radius: .5em;
  border-style: solid;
  border-color: rgba(0, 0, 0, .2);
  padding: .5em 1em;
  font-weight: bold;
}

form input.text-box-input{
  padding: .1em;
  background-color: rgb(255, 240, 240);
  border-radius: .5em;
  margin-left: .5em;
}

form label{
  font-size: 1.1em;
}

form .submit-form{
  padding: .45em 5em;
}
/*end of form*/

/*figure*/
figure{
  position: relative;
  width: auto;
  margin: 0;
  padding: 0;
}

figure img.solid-border{
  border-color: rgb(20, 20, 0);
  border-radius: .2em;
  border-width: .3em;
  border-style: solid;
}

figure figcaption{
	font-size: 0.8em;
	text-align: center;
}

/*end of figure*/
/*For specifying content to float differently.*/
.leftbound {
	float: left;
}
.rightbound {
	float: right;
}
section{
	padding: 2rem 0;
}

/*this will add a margin for everything if the screen gets too big */
#wrapper{
	/* this is for a medium/small screen */
	transition: all .5s ease-out;
	padding-top: 4rem;
	max-width: 100%;  
	width: auto;
	text-align:left;   
	background-color: #FFFFFF; 
	height: 1000px;
}

/*if it gets big then make a margin for the "wrapper" */
@media (min-width: 90em) {
	/* this is for a very large screen */
	nav ul {
		box-shadow: 0 0 1em rgba(0,0,0,0.2);
	}

	nav {
		box-shadow: none;
	}

  	#wrapper{
    	max-width: 90em;
    	margin: 0 auto;
  	}
  
}