@charset "utf-8";
/*---layout divs---*/
body {
   font-family: "Times New Roman", Times, serif;
   font-size: 16px;
   max-width: 850px;
   margin: 0 auto;
   padding: 0;
   overflow: auto;
}

#container {
	width: 850px;
	/*position: relative;
	margin-left: -425px;
	left: 50%;*/ /*made it not scroll to the left again*/
	background-color: #FFFFCC;
	margin: 2px;
}
#banner {
	max-width: 100%;
	width: auto;
	height: 172px;
	padding: 0;
	top: 0;
}
#navigation, #footer {
	float: left;
	display: inline;
	width: 850px;
	color: #FFFFCC;
	font-weight: bold;
	font-variant: small-caps;
	text-align: center;
	background-color: black;
}

/* body text */
p {
	text-align: center;
	padding: 0.30em;
}
h1 {
	font-weight: bold;
	text-align: center;
}

/* use it possibly? */
#imagebox {
	display: flex;
	flex-wrap;
	/*height: 300px;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: center;
    justify-content: space-around;*/
}
#image {
	width: 47%;
	/*height: auto;
	margin: auto;*/
}






/*---links----*/
a:link {
	color: #663300;
	text-decoration: underline;
}
a:hover {
	text-decoration: none;
	color: #C5C2C2;
}
a.menu:link {
	color: #FFFFCC;
	font-weight: bolder;
	text-decoration: none;
}
a.menu:visited {
	text-decoration: none;
	color: #FFFFCC;
}
a.menu:hover {
	text-decoration: none;
	color: #C5C2C2;
}
a.fhf:link {
	color: #000066;
	font-weight: 200;
	text-decoration: none;
}
a.fhf:hover {
	text-decoration: none;
	font-weight: bold;
	color: #000000;
}
  

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 800px) {
  #imagebox {
    flex: 50%;
    max-width: 45%;
  }
}

/* Responsive layout - makes the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 600px) {
  #imagebox {
    flex: 100%;
    max-width: 100%;
  }
  #banner {
	  width: 50%;
	  
  }
  p, h1 {
	  width: 50%;
	  margin: 2px;
  }
  header {
	  width: 100%;
      position: absolute;
   }
   nav {
      width: 100%;
	  margin-top: 14%;
      font-size: 0.61em;
      position: relative;
	  display: block;  
   }
}