* {
	box-sizing: border-box;
}

a:hover {
    cursor: pointer;
}

body {
    margin: 0;
    padding: 0;
    font: 13pt Georgia, Times New Roman, Times, serif;
	background: #f0f0f0;
    height: 100%;
}

#wrapper {
    height: 100vh;
    width: 100vw;
    display:grid;
    grid-template-columns: 100%;
    grid-template-rows: 100px 1fr 50px; 
}

#header {
	background: #007396 url(/img/gears.gif) left bottom no-repeat;
	display: grid;
	grid-template-rows: 100%;
  	grid-template-columns: 100%;
  	overflow: hidden;
}	

#navhdr {
	background: #73d1df url(/img/shade.gif) left top repeat-x;
	margin-top: 20px;
	height: 80px;
	margin-left: 100px;
	margin-right: 100px;
	display: grid;
	grid-template-columns: 100%;
  	grid-template-rows: auto auto;
}

#logo {
    margin-top: 5px;
    margin-bottom: 0px;
    margin-left: 20px;
	color: #ffffff;
	font-size: 38px;
	font-weight: bold;
}

#logo a {
    text-decoration: none;
    color: #fff;
}

sup {
    position: relative;
    font-size: 30%;
    line-height: 0;
    vertical-align: baseline;
    top: -1.2em;
    font-weight: normal;
	font-style: normal;
	opacity: 0.8;
	padding-left: 0;
	margin-left: -0.5em;
}

.centerrow2 {
    height: 100%;
    display:grid;
    grid-template-columns: 100%;
    background: #f0f0f0;
    padding-left: 100px;
    padding-right: 100px;
}

.content {
	background-color: #ffffff;
	padding: 20px;
}

.starthidden {
	display: none;
}

.footer {
    background: #007396;
    height: 50px;
}

#footermain {
	height: 50px;
	margin-left: 100px;
	margin-right: 100px;
	background: #73d1df url(/img/shade.gif) left top repeat-x;
	font: 10pt Georgia, Times New Roman, Times, serif;	
	padding: 10px;
	color: #007396;
}

.desktop {
	display: block;
}

.mobile {
	display: none;
}

@media screen and (max-width: 500px) {

	body {
		font-size: 15pt;
	}
	
	.desktop {
		display: none;
	}
	
	.mobile {
		display: block;
	}
	
	#header {
	  	overflow: hidden;
	  	height: 100px;
	}
		
	#logo {
		text-align: center;
	    margin-top: 5px;
		font-size: 32px;
		margin-left:  0px;
	}
	
	#navhdr {
		margin-left: 10px;
		margin-right: 10px;
		margin-top: 20px;
		height: 80px;
	}
	
	#hamburger_menu {
		display: none;
		text-align:center;
		background-color: #007396;
		padding-bottom: 1px;
	}
	
	.bigNavButns {
		list-style-type: none;
		margin: 0 20px;
	    padding: 0;
	}
	
	.bigNavButns a {
		display: block;
		position: relative;
		color: black;
		text-decoration: none;
		padding: 12px 10px 10px;
		border: 1px solid #007396;
		background: #73d1df;
		margin-top: 6px;
		margin-bottom: 6px;
	}
	
	.bigNavButns a:hover {
		background-color: white; 
	}

	
	.centerrow2 {
	    padding-left: 0px;
	    padding-right: 0px;
	}
	
	.footer {
	    background: #007396;
	    height: auto;
	}
	
	#footermain {
		height: auto;
		margin-left: 0px;
		margin-right: 0px;
		background: #73d1df url(/img/shade.gif) left top repeat-x;
		font: 10pt Georgia, Times New Roman, Times, serif;	
		padding: 10px;
		color: #007396;
	}
}

.smallbold {
	font-weight: bold;
	font-size: small;
}

.smallfont {
	font: 12pt Georgia, Times New Roman, Times, serif;	
}

/* material icons: */

.material-icons {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;  /* Preferred icon size */
  display: inline-block;
  line-height: 1;
  text-transform: none;
  letter-spacing: normal;
  word-wrap: normal;
  white-space: nowrap;
  direction: ltr;
  /* Support for all WebKit browsers. */
  -webkit-font-smoothing: antialiased;
  /* Support for Safari and Chrome. */
  text-rendering: optimizeLegibility;
  /* Support for Firefox. */
  -moz-osx-font-smoothing: grayscale;
  /* Support for IE. */
  font-feature-settings: 'liga';
}