body {
  height: 100%;
  background-color: #095d0b;
  margin: 0; /* Remove default margin */
}



#wrapper {
  height: 100%;
}



#hero {
    width:25%;
    z-index:-1;

}

#header {
	width:80%;
	margin-left:19%;
	height: 10%;
}

#header ul {
	width:40%;
	margin-left: auto;
	margin-right: 0;
}

#header li {
	display:inline;
	padding: 1vw;
}

#header a {
	text-decoration: none;
	color: black;
	font-weight: bold;
	font-size: 1.5vw;
}

#header li:hover {
	text-decoration: underline;
	border: 1px solid black;
}

#hero img {

    width:100%;

    height:auto;

}



#main h1 {
  font-variant: small-caps;
  margin-bottom: 1px;
  margin-top: 0.5em;
  margin:auto;
  padding-top: 1em;
  font-variant: small-caps;
  font-family: "Cinzel", Geneva, sans-serif;
  font-size: 120%;
}



#main {

  margin: auto;
  
  height: 80%;

  width: 75%;
  
  padding-left: 1em;

  border: 3px solid black;

  position: absolute;

  top: 10%;

  left: 19%;

  overflow: hidden;

  background-color: white;
  
  font-family: "Quicksand", Geneva, sans-serif;
  font-size: 120%;

  overflow-y:auto;



}



#main ul {

  display: inline-block;

  margin-top: 0px;

  text-align: left;

  font-size: 90%;

}