/* site.css */
/*header, footer	{
	background-color: lightgray;
	border: solid 1px black;
	font-family: Open Sans, serif;
}

footer 	{
	font-size: 12px;
	text-align: center;
	padding: 10px;
	border-radius: 3px;
}
*/
body 	{
	font-family: Roboto, Open Sans, sans-serif;
	font-size: 14px;
}

/*May not need
a {
	color: blue;
}*/

html, body {
/*	padding: 0;
	margin: 0;*/
	height: 100%;
}

/*Code for menu system positioning*/

nav {
	float: left;
	}

/*Code for menu system positioning*/

/*Added unique look each header*/

h1 { 
	font-family: Lato, serif;
	font-size: 125px;
}

h2 {
	font-family: Roboto, serif;
	font-size: 75px;
}

h3 {
	font-family: Open Sans, serif;
	font-size: 35px;
}

h4 {
	font-family: Open Sans, serif;
	font-size: 20px;
}

span {
	font-family: Lato, serif;
	font-size: 20px;
}

/*Added unique look each header*/

/*The section of code in between these notes was added for the menu system.*/

.glossymenu, .glossymenu li ul{
list-style-type: none;
margin: 0;
padding: 0;
width: 190px; /*WIDTH OF MAIN MENU ITEMS*/
border: 1px solid black;
}

.glossymenu li{
position: relative;
}

.glossymenu li a{
background: white url(blue-header.jpg) repeat-x bottom left;
font: 20px Open Sans, Roboto, sans-serif;
color: white;
display: block;
width: auto;
padding: 5px 0;
padding-left: 10px;
text-decoration: none;
}

.glossymenu li ul{ /*SUB MENU STYLE*/
position: absolute;
width: 190px; /*WIDTH OF SUB MENU ITEMS*/
left: 0;
top: 0;
display: none;
}

.glossymenu li ul li{
float: left;
}

.glossymenu li ul a{
width: 180px; /*WIDTH OF SUB MENU ITEMS - 10px padding-left for A elements */
}

.glossymenu .arrowdiv{
position: absolute;
right: 2px;
background: transparent url(arrow.gif) no-repeat center right;
}

.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}

.glossymenu li a:hover{
background-image: url(header-background-for-resources-gradient-blue-1024x305.jpg);
}

/* Holly Hack for IE \*/
* html .glossymenu li { float: left; height: 1%; }
* html .glossymenu li a { height: 1%; }
/* End */

/*The section of code in between these notes was added for the menu system.*/

/*The section of code in between these notes was added for the hero background system.*/

/* The hero image */
.hero-image {

  /* Use "linear-gradient" to add a darken background effect to the image (IMG_7175.jpg). This will make the text easier to read */
  background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("img/IMG_7175.jpg"); /*This image is a photo taken while on a trip to Colombia with my wife in 2012.*/

/*   Set a specific height */
  height: 100%;

  /* Position and center the image to scale nicely on all screens */
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  position: relative;
}

/* Place text in the middle of the image */
.hero-text {
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}

/*The section of code in between these notes was added for the hero background system.*/

.container {
  text-align: center;
  position: absolute;
  top: 98%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
}

/*header header1 {
	float: left;
	margin-left: -10px;
}

header header1 {
	display: inline;
	font-size: 12px;
}*/
