@media screen {
body {
  border:  none;
  margin: 0;
  padding: 0;
  background: #ffffff none repeat scroll 0%;
  width: 100%;
  font-size: 100%;
  font-family: Verdana,Helvetica,Arial;
  color: #000000;
}
h1 {
  font-family: "Times New Roman",Times,Georgia,serif;
  color: #000000;
  font-size: x-large;
  font-weight: bold;
  text-align: center;
  line-height: 120%;
  margin-right: 10%;
  margin-left: 10%;
}
h2 {
  color: #000000;
  font-size: large;
  font-weight: bold;
  text-align: left;
  line-height: 120%;
  margin-right: 10%;
  margin-left: 10%;
  padding-top: 2%;
}
h3 {
  color: #000000;
  font-size: medium;
  font-weight: bold;
  text-align: left;
   line-height: 120%;
  margin-right: 10%;
  margin-left: 10%;
  padding-top: 2%;
}
h4 {
  font-size: medium;
  font-weight: bold;
  speak: normal;
  color: #000000;
   line-height: 120%;
  margin-right: 10%;
  margin-left: 10%;
  font-family: Tahoma,Arial,sans-serif;
  text-align: left;
}
p {
  font-size: medium;
  font-weight: normal;
  speak: normal;
  color: #000000;
  margin-right: 10%;
  margin-left: 10%;
  font-family: Tahoma,Arial,sans-serif;
  font-style: normal;
  text-align: left;
   line-height: 120%;
}
.separator {
  border-top: thin solid #333333;
}
.tiny {
  font-family: Arial,Helvetica,sans-serif;
  font-size: x-small;
  font-style: italic;
}
img {
  border:  none;
  margin: 10px;
  padding: 10px;
  height: auto;
  max-width: 100%;
}
p.caption {
  text-align: center;
  margin-right: 10%;
  margin-left: 10%;
  font-size: smaller;
}
a {
  color: #000066;
  font-weight: bold;
  font-size: medium;

	}
a:active {
 	}
a:hover {

  	}
a:visited {
  color: #333333;
	}
table {
  vertical-align: top;
	}
#menu {
 clear: both;
  margin-right: 10%;
  margin-left: 10%;
  box-sizing: border-box;
}

.style1 {font-size: x-small}
.style2 {font-size: medium}
.style3 {
	font-size: medium;
	color: #FF0000;
	font-weight: bold;
}
.style4 {color: #FF0000}

#columnbox {
 clear: both;
  margin-right: 10%;
  margin-left: 10%;
  box-sizing: border-box;
  background-color:#eee;
   line-height: 120%;
}


/* Create three equal columns that float next to each other */
.column {
  float: left;
  width: 31%;
  font-size: small;
  padding: 10px;
   line-height: 120%;
}
.column h2, h3, h4 {font-weight: bold;
 line-height: 120%;}


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

#header {
  clear: both;
  width: 100%;
  font-family:Verdana,Helvetica,Arial;
  text-align: center;
}
#header img {
  border:  none;
  margin: 0px;
  padding: 0px;
  height: auto;
  max-width: 100%;
}
#callout {
	padding: 2%;
	background: #eeeeee none;
	float: right;
	left: 80%;
	width: 20%;
	display: block;
}


#maincolumn {
  border-top: 1px solid #000000;
  clear: both;
  float: none;
  vertical-align: top;
  top: 0px;
  padding-right: 5%;
  padding-left: 5%;
}
#maincolumn img {
  border:  none;
  margin: 10px;
  padding: 10px;
  height: auto;
  max-width: 95%;
}
#footer {
  border-top: 1px solid #000000;
  margin: auto;
  clear: both;
  float: none;
   padding-right: 5%;
  padding-left: 5%;
  text-align: center;
}
#footer a {
  text-align: center;
  font-family: Verdana,Helvetica,Arial;
  font-size: xx-small;
}
#footer p {
  text-align: center;
  font-family: Verdana,Helvetica,Arial;
  font-size: xx-small;
}
a:visited {
  color: #333333;
	}

.bullet {
  padding: 1% 15%;
  text-align: left;
}
table {
  width: 55%;
}


.show {
    display: block;
	width: 60%;
    background-color: #eee;
	font-size:small;
}
}


@media print {
body {
  border:  none;
  margin: 0;
  padding: 0;
  background: #ffffff none repeat scroll 0%;
  width: 100%;
  font-size: 12pt;
  font-family: Verdana,Helvetica,Arial;
  color: #000000;
}
h1 {
  font-family: "Times New Roman",Times,Georgia,serif;
  color: #000000;
  font-size: 16pt;
  font-weight: bold;
  text-align: center;
  line-height: 120%;
  margin-right: 10%;
  margin-left: 10%;
}
h2 {
  color: #000000;
  font-size: 14pt;
  font-weight: bold;
  text-align: left;
  line-height: normal;
  margin-right: 10%;
  margin-left: 10%;
  padding-top: 2%;
}
h3 {
  color: #000000;
  font-size: 12pt;
  font-weight: bold;
  text-align: left;
  margin-right: 10%;
  margin-left: 10%;
  padding-top: 2%;
}
p {
  font-size: 12pt;
  font-weight: normal;
  color: #000000;
  margin-right: 10%;
  margin-left: 10%;
  font-family: Verdana,Helvetica,Arial,sans-serif;
  font-style: normal;
  text-align: justify;
}
.separator {
  border-top: thin solid #333333;
}
table
	{width: 75%;
	page-break-inside: avoid;
	}
	
.show {
    display: none;
  }
}


@media screen and (max-width: 1080px) {
  
body {
  border:  none;
  margin: 0;
  padding: 0;
  background: #ffffff none scroll 0%;
  width: 100%;
  font-size: 100%;
  font-family: Verdana,Helvetica,Arial;
  color: #000000;
}
h1 {
  font-family: "Times New Roman",Times,Georgia,serif;
  color: #000000;
  font-size: x-large;
  font-weight: bold;
  text-align: center;
  line-height: 120%;
  margin-right: 3%;
  margin-left: 3%;
}
h2 {
  color: #000000;
  font-size: large;
  font-weight: bold;
  text-align: left;
  line-height: normal;
  margin-right: 3%;
  margin-left: 3%;
  padding-top: 2%;
}
h3 {
  color: #000000;
  font-size: medium;
  font-weight: bold;
  text-align: left;
  margin-right: 3%;
  margin-left: 3%;
  padding-top: 2%;
}
p {
  font-size: medium;
  font-weight: normal;
  speak: normal;
  color: #000000;
  margin-right: 3%;
  margin-left: 3%;
  font-family: Tahoma,Arial,sans-serif;
  font-style: normal;
  text-align: left;
}
.separator {
  border-top: thin solid #333333;
}
.tiny {
  font-family: Arial,Helvetica,sans-serif;
  font-size: x-small;
  font-style: italic;
}
img {
  border:  none;
  margin: 10px;
  padding: 10px;
  height: auto;
  max-width: 95%;
}
p.caption {
  text-align: center;
  margin-right: 10%;
  margin-left: 10%;
  font-size: smaller;
}
a {
  color: #000066;
  font-weight: bold;
  margin: 2mm;
	}
a:active {
 	}
a:hover {

  	}
a:visited {
  color: #333333;
	}
table {
  vertical-align: top;
	}
#menu {
clear: both;
padding-right, padding-left: 5%;
}
/* Responsive layout - makes the two or three columns for large screens stack on top of each other instead of next to each other on small screens*/
.column {
    width: 100%;
  }
.col-2 {
  width:100%; }

#header {
  clear: both;
  width: 100%;
  font-family: Verdana,Helvetica,Arial;
  text-align: center;
}
#callout {
  clear: both;
  width: 100%;
  padding: 2%;
  outline: 1px;
  background: #ffffff none repeat scroll 0%;
  border: 1px solid 000; 
}


#maincolumn {
  border-top: 1px solid #000000;
  clear: both;
  float: none;
  vertical-align: top;
  top: 0px;
  margin-right: 3%;
  margin-left: 3%;
}
#maincolumn img {
  border:  none;
  margin: 10px;
  padding: 10px;
  height: auto;
  max-width: 95%;
}
#footer {
  border-top: 1px solid #000000;
  margin: auto;
  clear: both;
  float: none;
  width: 100%;
  text-align: center;
}
#footer p {
  text-align: center;
  padding-right: 5%;
  padding-left: 5%;
}
#footer ul {
  list-style-type: none;
  list-style-image: none;
  list-style-position: outside;
  font-size: small;
}
#footer ul li {
  display: inline;
}
#footer ul li a {
  font-family: Verdana,Helvetica,Arial;
  display: inline;
  text-align: center;
}
.bullet {
  padding: 1% 15%;
  text-align: left;
}
table {
  width: 55%;
}

.menu {
    width: 100%;
  }
.style1 {font-size: x-small}
.style2 {font-size: medium}
.style3 {
	font-size: medium;
	color: #FF0000;
	font-weight: bold;
}
.style4 {color: #FF0000}
.show {
    display: none;
  }
}
