/* Clear Any Formatting */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

address, article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

strong {
  font-weight: bold;
}

body 
{
    font-family: Arial, Helvetica, sans-serif;
	color: black;
	line-height: 1;	
	margin: 0px;
	padding: 0px;
    /* background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet); */
}


/* Headings */


h1 {
 font: bold 120% Arial, Helvetica, sans-serif;
 color: black;
 margin: 5px;
 padding: 5px;
}

h2 {
 font: bold 100% Arial, Helvetica, sans-serif;
 color: black;
 margin: 0px 0px 0px 0px;
 padding: 0px;
}

h3{
 font: bold 100% Arial, Helvetica, sans-serif;
 color: black;
 margin: 0px;
 padding: 0px;
}

h4{
 font: 100% Arial, Helvetica, sans-serif;
 color: black;
 margin: 0px;
 padding: 0px;
}

h5{
 font: 100% Arial, Helvetica, sans-serif;
 color: black;
 margin: 0px;
 padding: 0px;
}

/* Page Elements */

/*Navigation Formatting */

nav
{
	align-items: center;
    	background-color: white;
	position: fixed;
	top:0;
	width: 100%;
	justify-content: center;
	text-align: center;
	height: 60px;
	z-index: 1;
}

nav img {
	float: left;
	height: 90%;
	padding-left: 5px;
	
}

nav a {
	position: relative;
	font-size: 16px;
	color: black;
	text-align: center;
	padding: 14px 16px;
	text-decoration: none;
	top: 15px;
}

nav a:hover {
	background-color: #8BB8E8;
	color:black;
	border-top-left-radius:5pt;
	border-top-right-radius:5pt;
	border-bottom-left-radius:5pt;
	border-bottom-right-radius:5pt;

}

Nav .icon {
  display: none;
}

/* Aside Rules */

aside
{   
position: fixed;
	top: 60px;
	right: 0%;
    background-color: rgba(235, 232, 217, 0.8);
    font: small Verdana,sans-serif;
    font-size:80%;
    width: 10%;
    margin: 2%;
    padding: 20px;
    border-radius: 10px;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    z-index: 1;
    box-shadow: 0 0 10px #629996;
    -moz-box-shadow: 0 0 10px #629996;
    -webkit-box-shadow: 0 0 10px #629996;

}


/* The bubbles float here, so here we can change the
focal background colors */

main {
    float:left;
    position: relative;
    z-index: 0;
	top: 60px;
    margin: 2%;
    width:80%;
    background-color: rgba(163,154,137,0.5);
    border-radius: 10px;
	padding-bottom:20px;
}

    
/* Paragraph Rules */

p {
    margin: 10px;
}

/* Anchor Rules */

a:hover
{
    color:#0062A0;
}

a
{
    color: #2A69A6;
    text-decoration:none;
}

/* Section Rules */

.Content {
 background: #2774AE;
	color: white;
	border-top-right-radius:5pt;
	border-bottom-left-radius:5pt;
	border-bottom-right-radius:5pt;
	padding: 5px;
}

.SectionHeading {
 float:left;
 display:block;
 background: rgba(235, 232, 217, 0.8);
	color: black;
	border-top-left-radius:5pt;
	border-top-right-radius:5pt;
	margin: 2% 2% -2% 2%;
}

.Legend {
	height: 1em;
	width: 1em;
	margin-left: .5em;
	margin-right: .5em;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px;
	vertical-align: text-bottom;
}

section {
	float:left;
	display:block;
	background-color: rgba(235, 232, 217, 0.8);
	margin: 2% 2% 0% 2%;
	width: 96%;
 border-top-right-radius:5pt;
	border-bottom-left-radius:5pt;
	border-bottom-right-radius:5pt;
}

section h1 {
	display: inline;
	background: rgba(235, 232, 217, 0.8);
	color: white;
	border-top-left-radius:5pt;
	border-top-right-radius:5pt;
	margin: 10px 5px 0px 0px;
}

/* Article Rules */

article {
    background-color: rgba(235, 232, 217, 0.8);
    margin: 15px 10px 15px 10px;
    padding: 2px;
    border-radius: 15px;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    box-shadow: 0 0 10px #629996;
    -moz-box-shadow: 0 0 10px #629996;
    -webkit-box-shadow: 0 0 10px #629996;
    opacity: 1.0;
				height:auto;
    overflow:auto;
}

article header {
    display: block;
    color: black;
    margin-left: 10px;
    margin-top:5px;
}

article h1 {
 font: bold 100% Arial, Helvetica, sans-serif;
 color: black;
 margin: 0px;
 margin-top: 10px;
 padding: 0px;
 display: inline;
}

article header h2 {
    font: 12px Arial, sans-serif;
}

article h3 {
    margin: 20px 10px 10px 10px;
}

article p {
    margin: 5px 10px 10px 10px;
}

article ul {
    margin: 20px;
}

article form {
    margin: 0px 0px 10px 20px;
}

article img {
    width:75%;
		margin: 5px 10px 10px 10px;
}

/* article p  */
.BoardPhoto {
    max-width: 10% !important;
    height: auto;
    width: auto;
    float: left;
    border-radius: 50%;
}

.BoardPhotoR {
    max-width: 10% !important;
    height: auto;
    width: auto;
    float: right;
    border-radius: 50%;
}

/*
.BoardPhoto:nth-of-type(odd)  {
     float:right;
}
*/


article table {
    margin: 5px 10px 10px 10px;
}

article table th {
	font-weight: bold;
}

tbody tr:nth-child(odd) {
	background-color: rgba(255, 255, 255, 0.9);
}

tbody tr:nth-child(even) {
	background-color: rgba(255, 255, 255, 0.6);
}

tr td {
	padding: 5px;
	color: black;
	line-height: 1em;
}

td img {
	height: 1em;
	width: 1em;
	margin-left: .5em;
	margin-right: .5em;
	margin-top: 0px;
	margin-bottom: 0px;
	padding: 0px;
	vertical-align: text-bottom;
}
