@charset "UTF-8";
body {
	background-color: #FFFFFF;
	font-family: Verdana, Helvetica, sans-serif;
	font-size: 10pt;
	color: #585858;
	text-align: left;
	background-image: url(images/template/picture.png);
	background-position: center top;
	margin: 0px;
}
#back {
	background-image: url(images/template/BorderGrade.png);
	background-size: 100%;
	background-repeat: repeat-y;
}
#content {
	margin-right: 10%;
	margin-left: 10%;
}
#seasonal_border {
	/*background-image: url(images/template/border_temp.png);*/
	/*background-image: url(images/template/border_hlwn.png);*/
	/*background-image: url(images/template/border_rmbr.png);*/
	/*background-image: url(images/template/border_chms.png);*/
	background-repeat: repeat-y;
	background-position: center top;
	background-size: 125%;
	padding-left: 12%;
	padding-right: 12%;
}
/*Start Desktop CSS*/
@media (min-width: 851px){
div.mobile {
	/*Content hidden with small display*/
	display: none;
}
div.compact {
	/*Content hidden with medium display*/
	display: none;
}
div.desktop {
	/*Content shown with desktop display*/
	display: block;
}}/*End Desktop CSS*/
/*Start Compact CSS*/
@media (max-width: 850px){
div.mobile {
	/*Content hidden with small display*/
	display: none;
}
div.compact {
	/*Content displayed with medium display*/
	display: block;
}
div.desktop {
	/*Content hidden with desktop display*/
	display: none;
}}/*End Compact CSS*/
/*Start Mobile CSS*/
@media (max-width: 480px){
div.mobile {
	/*Content displayed with small display*/
	display: block;
}
div.compact {
	/*Content hidden with medium display*/
	display: none;
}
div.desktop {
	/*Content hidden with desktop display*/
	display: none;
}}/*End Mobile CSS*/
h1 {
	margin-block-start: 0px;
	margin-block-end: 0px;
	padding-top: 1em; 
	font-size: 150%;
	font-weight: bold;
	color: #678090;
	letter-spacing: 0.7em;
	padding-bottom: 1em;
	text-align: left;
}
h2 {
	font-size: 125%;
	font-weight: bold;
	color: #6F9DBE;
	letter-spacing: 0.4em;
	text-transform: lowercase;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
}
h2 {
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 90%;
	color: #555555;
	letter-spacing: 0.15em;
	padding-bottom: .2em;
	background-color: #c0cad3;
	text-align: right;
	padding-top: .2em;
	padding-right: 1em;
}
h2.Ntce {
	font-size: 125%;
	font-weight: bold;
	color: #6F9DBE;
	letter-spacing: 0;
	line-height: 25px;
	text-transform: none;
	text-align: left;
	background-image: url(images/template/bar_info.png);
	background-repeat: repeat;
	padding-right: 2.5px;
	padding-left: 2.5px;
	padding-bottom: 0px;
	padding-top: 0px;
}
h2.Advi {
	font-size: 125%;
	font-weight: bold;
	color: #5E8CAD;
	background-color: yellow;
	letter-spacing: 0;
	line-height: 25px;
	text-transform: none;
	text-align: left;
	background-image: url(images/template/bar_advi.png);
	background-repeat: repeat;
	padding-right: 2.5px;
	padding-left: 2.5px;
	padding-bottom: 0px;
	padding-top: 0px;
}
h2.Wtch {
	font-size: 125%;
	font-weight: bold;
	color: #4D7B9C;
	background-color: orange;
	letter-spacing: 0;
	line-height: 25px;
	text-transform: none;
	text-align: left;
	background-image: url(images/template/bar_wtch.png);
	background-repeat: repeat;
	padding-right: 2.5px;
	padding-left: 2.5px;
	padding-bottom: 0px;
	padding-top: 0px;
}
h2.Warn {
	font-size: 125%;
	font-weight: bold;
	color: #3C6A8B;
	background-color: #DD4444;
	letter-spacing: 0;
	line-height: 25px;
	text-transform: none;
	text-align: left;
	background-image: url(images/template/bar_warn.png);
	background-repeat: repeat;
	padding-right: 2.5px;
	padding-left: 2.5px;
	padding-bottom: 0px;
	padding-top: 0px;
}
a {
	color: #FF6600;
	text-decoration: none;
	font-weight: normal;
}
a:visited {
	text-decoration: none;
	color: #CC6600;
}
a:hover {
	text-decoration: underline overline;
	color: #6F9DBE;
}
a:active {
	text-decoration: none;
}
h1,h2,h3,h4,h5,h6 {
	font-family: Arial, Helvetica, sans-serif;
}
.credits {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 70%;
	font-style: italic;
	text-transform: lowercase;
	letter-spacing: 0.3em;
	text-align: right;
}
h3 {
	font-size: 110%;
	font-weight: normal;
	color: #585858;
	letter-spacing: 0.4em;
	text-transform: lowercase;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
}
ul {
	font-size: 75%;
	padding-bottom: 1em;
	padding-top: 1em;
	margin-left: 10%;
	list-style-type: square;
	text-transform: lowercase;
}
li {
	padding-bottom: 0.5em;
}
.blockquote {
	background-color: #E7E7DE;
	margin-right: 22%;
}
caption {
	font-size: 95%;
	font-style: normal;
	font-weight: bold;
	letter-spacing: .1em;
	padding-top: 0.5em;
	padding-bottom: 0.25em;
	text-align: left;
}
table {
	font-family: Geneva, Arial, Helvetica, sans-serif;
}
/*Start Mobile CSS*/
@media (max-width: 850px){
td.temp {
	width: 100%;
	padding: 5px;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/temp_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 40px 100px;
}
td.solar {
	width: 100%;
	padding: 5px;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/temp_solar.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 120px 100px;
}
td.rain {
	width: 100%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/rain_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 125px 90px;
}
td.storm {
	width: 100%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/storm_amount.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 125px 90px;
}
td.wind {
	width: 100%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/wind_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 125px 90px;
}
td.press {
	width: 100%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/press_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100px 95px;
}
td.moon {
	width: 100%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/moon.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100px 100px;
}
td.extra {
	width: 25%;
	padding: 5px;
	text-align: center;
	font-size: 18px;
}}/*End Mobile CSS*/
/*Start Desktop CSS*/
@media (min-width: 851px){
td.temp {
	width: 50%;
	padding: 5px;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/temp_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 80px 200px;
}
td.solar {
	width: 50%;
	padding: 5px;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/temp_solar.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 240px 200px;
}
td.rain {
	width: 50%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/rain_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 250px 180px;
}
td.storm {
	width: 50%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/storm_amount.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 250px 180px;
}
td.wind {
	width: 50%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/wind_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 250px 180px;
}
td.press {
	width: 50%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/template/press_back.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 200px 190px;
}
td.moon {
	width: 100%;
	text-align: center;
	font-size: 18px;
	background-image: url(images/moon.png);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 200px 200px;
}
td.extra {
	width: 50%;
	padding: 5px;
	font-size: 18px;
}}/*End Desktop CSS*/
.tableseparator_temp {
	font-size: 90%;
	font-weight: 400;
	background-color: #338044;
	color: #CCCCCC;
	padding: .5em;
	letter-spacing: .1em;
}
.tableseparator_rainfall {
	font-size: 90%;
	font-weight: 400;
	background-color: #559966;
	color: #CCCCCC;
	padding: .5em;
	letter-spacing: .1em;
}
.tableseparator_wind{
	font-size: 90%;
	font-weight: 400;
	background-color: #77B188;
	color: #666666;
	padding: .5em;
	letter-spacing: .1em;
}
.tableseparator_pressure {
	font-size: 90%;
	font-weight: 400;
	background-color: #99CAAA;
	color: #666666;
	padding: .5em;
	letter-spacing: .1em;
}
td {
	font-size: 100%;
	padding-top: 0.2em;
	padding-right: 0.5em;
	padding-bottom: 0.2em;
	padding-left: 0.5em;
	color: #222222;
	border: 1px;
	border-color: #ffffff;
}

.td_thumbnails {
	padding-top: 0.1em;
	padding-right: 0.2em;
	padding-bottom: 0.1em;
	padding-left: 0.0em;
}

.td_temperature_data {
	background-color: #B7D3F1;
}
.td_rainfall_data {

	background-color: #CCE0F5;
}
.td_wind_data {
	background-color: #E1EDF9;
}
.td_pressure_data {
	background-color: #F6FAFD;
}
.td_navigation_bar {
	text-align: center;
	padding-top: 1em;
	padding-bottom: 1em;
	letter-spacing: 0.2em;
	background-color: #f0f0ff;
}
/*Start Desktop CSS*/
@media (min-width: 851px){
.labels {
	font-weight: bold;
	background-position: left;
}
.site_data {
	text-align: left;
}}/*End Mobile CSS*/
/*Start Mobile CSS*/
@media (max-width: 850px){
.labels {
	width: 40px;
	font-weight: bold;
	background-position: left;
}
.site_data {
	text-align: left;
	padding-right: 5px;
	padding-left: 5px;
}}/*End Mobile CSS*/
.colon_separator {
	font-weight: 400;
	background-position: left;
}