html {font-family: Arial,Helvetica,Verdana,sans-serif;
 font-size: 1em;}

body {background-color: #ffffff;
 color: #000000;
 font-size: 1em;			/* 1em commonly equals to 16px */
 padding: 0;
 margin: 0 0 1em 0;
 overflow: auto;
}

a {
  color: blue;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

a:active {
  color: black;
}

a:visited {
  color: blue;
  text-decoration: none;
}


table {table-layout: fixed;
 overflow-x: auto;
 border: 0.1em solid #99CCFF;
 border-collapse: collapse;
 margin: 1em auto;
 font-size: 0.9em;}

td {vertical-align: middle;}

th {background: #99CCFF;}

ul {list-style-type: none;}


.alignleft {text-align: left;
 padding: 0.1em 0.2em 0.1em 0.3em;}

.alignright {text-align: right;
 padding: 0.1em 0.6em 0.1em 0;
 word-wrap: break-word;}

.bottomdotted {border-bottom: 0.1em dashed #CCCCCC;}

hr {clear: both;
 border: none;
 height: 2px;}

img {border: none;
 max-width: 100%;
 height: auto;}

select {width: 70%;
 background-color: #FFFFFF;
 margin: 0 1em 1em 1em;}

ul {list-style-type: none;}

	/*use below "id's" for single uses on pages*/

#banner {background: #1D364C;
 color: #ffffff;
 position: relative;
 height: 4.5em;
 width: 100%;
 text-align: left;
 z-index: 5;}

#banner div {padding: 0.5em 0 0 4em;}

#container {background: #F5FFFA;
 position: relative;			/* all inside container is positioned relative to container position*/
 padding: 0;
 margin: 0 auto;
 overflow: auto;}



}



#container {width: 90%;}

#content {background: #F5FFFA;
 color: #000000;
 position: relative;

}



.alignleft {text-align: left;
 padding: 0.1em 0.2em 0.1em 0.3em;}

.alignright {text-align: right;
 padding: 0.1em 0.6em 0.1em 0;
 word-wrap: break-word;}

.bottomdotted {border-bottom: 1px dashed #CCCCCC;
 font-size: 0.9em;}

.bottomnotdotted {font-size: 0.9em;}


.popup span {position: absolute;
 visibility: hidden;			/*do not show image*/
 background: #FFFFFF;
 border: 0.5em solid #FFFFFF;
 margin-left: 1em;
 margin-top: -5em;}

.popup:hover span {z-index: 25;		/*show image upon hover*/
 visibility: visible;}

* {
  box-sizing: border-box;
}

/* Create two unequal columns that floats next to each other */
.column {
  float: left;
  padding: 10px;
}
.left {
  width: 20%;
  background-color:#F5FFFA;
}

.right {
  width: 80%;
  background-color:#F5FFFA;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Container holding the image and the text */
.container2 {
  position: relative;
  text-align: center;
  color: white;
}

/* Bottom left text */
.bottom-left {
  position: absolute;
  bottom: 8px;
  left: 16px;
}

/* Top left text */
.top-left {
  position: absolute;
  top: 8px;
  left: 16px;
}

/* Top right text */
.top-right {
  position: absolute;
  top: 8px;
  right: 16px;
}

/* Bottom right text */
.bottom-right {
  position: absolute;
  bottom: 8px;
  right: 16px;
}

/* Centered text */
.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}