HTML,BODY { margin:0px; height:100%; text-align:center; padding:0px; }
BODY,TD { font:1em Arial,Verdana,Helvetica,sans-serif; color:#000000; }
BODY { background:#FFFFFF; }
A { color:#CC0000; }
A:hover { color:#CC4400; text-decoration:underline; }
A:visited { color:#663300; }
P,DL { margin:10px; padding:0px; text-align:justify; }
.indent { padding-left:20px; }
.centered { text-align:center; margin-left:auto; margin-right:auto; }
.centered TABLE { text-align:center; margin:0px auto; }
.centered TR { text-align:left; }
UL { padding-left:20px; }
UL,DD { margin:10px 25px; text-align:left; color:#333333; }
LI { padding:5px; }
OL { text-align:left; color:#333333; }
.titleText {font:Italic Bold 1.8em Arial,Verdana,Helvetica,sans-serif; padding:2px 20px; text-align:center;}
.fancyText {font:Italic Bold 1.2em "Shelley Volante BT", Script, cursive;}
.largeText {font:Italic Bold 1.4em Arial,Verdana,Helvetica,sans-serif;}
.strongText {font:bold 0.9em Arial,Verdana,Helvetica,sans-serif;}
.strongUText {font:bold 0.9em Arial,Verdana,Helvetica,sans-serif; text-decoration:underline;}
.smallText {font:bold 0.8em Arial,Verdana,Helvetica,sans-serif; color:#444444;}
.noteText {font:0.8em Arial,Verdana,Helvetica,sans-serif;}
.tinyText {font:0.7em Arial,Verdana,Helvetica,sans-serif;}
.newsTable {background-color:#DDC287;padding:10px;border-radius:10px;margin:0px 0px 5px;table-layout:fixed;}
.newsTable a {text-decoration:none;}
.newsHead {font-weight:bold;font-size:1em;padding:5px;}
.newsTitle {color:#000000;font-weight:bold;font-size:1.1em;}
.newsContent {background:#FFFFFF;color:#222222;padding:10px;margin:5px 0px;border-radius:10px;font-style:italic;font-size:0.8em;opacity:0.75;filter:alpha(opacity=75);}
.newsContent:hover {opacity:1;filter:alpha(opacity=100);cursor:pointer;}
.newsArticle {background:#FFFFFF;color:#222222;padding:10px;margin:5px 0px;border-radius:10px;font-size:1em;display:inline-block;}
.mainTitle {font:1.6em Arial,Verdana,Helvetica,sans-serif;}
.subTitle {font:bold 1.2em Arial,Verdana,Helvetica,sans-serif;}
.tableheader {font:1.3em Arial,Verdana,Helvetica,sans-serif; background-color: #DDDDDD; padding: 4px; }
.tablebody {font:0.9em Arial,Verdana,Helvetica,sans-serif; background-color: #EEEEEE; padding: 10px; }
.tablenested {font:0.9em Arial,Verdana,Helvetica,sans-serif; background-color: #EEEEEE; padding: 3px; }
.shadowRight {-moz-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55); -webkit-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55); box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);}
.shadowRightInner {-moz-box-shadow:inset 6px 6px 6px 0px rgba(119, 119, 119, 0.55); -webkit-box-shadow:inset 6px 6px 6px 0px rgba(119, 119, 119, 0.55); box-shadow:inset 6px 6px 6px 0px rgba(119, 119, 119, 0.55);}
.breakWrap { overflow-wrap:break-word; word-wrap:break-word; -ms-word-break:break-all; word-break:break-all; word-break:break-word; -ms-hyphens:auto; -moz-hyphens:auto; -webkit-hyphens:auto; hyphens:auto; }
.flexcontainer{
  padding: 10px;
  display: -webkit-box;     /* iOS 6-, Safari 3.1-6 */
  display: -moz-box;        /* Firefox 19- */
  display: -ms-flexbox;     /* IE 10 */
  display: -webkit-flex;    /* Chrome */
  display: flex;            /* Opera 12.1, Firefox 20+ */

  /* iOS 6-, Safari 3.1-6 */
  -webkit-box-orient: horizontal;
  -webkit-box-pack: justify;
  -webkit-lines: multiple;  /* Only here for informative purpose, this line is what should have made it work, it has never been implemented */ 

  /* Firefox 19- */
  -moz-flex-flow: row wrap;
  -moz-justify-content: space-around;
  -moz-box-lines: multiple; /* Only here for informative purpose, this line is what should have made it work, it has never been implemented */ 

  /* Chrome */
  -webkit-flex-flow: row wrap;
  -webkit-justify-content: space-around;

  /* IE10 */
  -ms-flex-flow: row wrap;
  -ms-justify-content: space-around;

  /* Opera 12.1, Firefox 20+ */
  flex-flow: row wrap;
  justify-content: space-around;
}
.flexitem {
  margin: 10px;
  -webkit-box-flex: auto;    /* iOS 6-, Safari 3.1-6 */
  -moz-box-flex: 1.0;        /* Firefox 19- */
  -webkit-flex: auto;        /* Chrome */
  -ms-flex: auto;            /* IE10 */
  flex: auto;                /* Opera 12.1, Firefox 20+ */
}
.flexitemfixed {
  margin: 10px;
  -webkit-box-flex: 0;    /* iOS 6-, Safari 3.1-6 */
  -moz-box-flex: 0;        /* Firefox 19- */
  -webkit-flex: auto;        /* Chrome */
  -ms-flex: auto;            /* IE10 */
  flex: 0 1 auto;                /* Opera 12.1, Firefox 20+ */
}
#mainMenusControl { display:none; }
#mainBG {
	position:fixed;
	z-index:0;
	width:100%;
	background-color:#FFFFFF;
}
#mainHolder {
	position:relative;
	z-index:1;
	width:100%;
	margin:0px auto;
	text-align:left;
	min-height:100%;
	padding:0px;
}

@media (max-width:480px) {
	#mainMenusControl { display:block; }
	#mainMenus { display:none; }
	#mainMenus, #mainMenusControl {
		position:relative;
		clear:both;
		z-index:100;
		width:100%;
		text-align:center;
	}
		#mainMenus ul ul { display:none; z-index:110; width:260px; }
		#mainMenus ul, #mainMenusControl ul {
			margin:0px;
			padding:0px;
			list-style: none;
			position: relative;
			display: inline-block;
			background-color:#657FD5;
			width:100%;
		}
		#mainMenus ul li, #mainMenusControl ul li { float: none; display: block; }
		#mainMenus ul li a, #mainMenusControl ul li a {
			padding: 5px 10px;
			display: block;
			color: #FFDC46;
			text-decoration: none;
		}
		#mainMenus ul li:hover, #mainMenus ul li:active {
			background-image: url(/images/Shade20.png);
		}
		#mainMenus ul li:hover a { color: #FFFFFF; text-decoration: underline; }
		#mainMenus ul li:hover > ul li { float: none; display: block; }
		#mainMenus ul li:hover > ul li a { color: #FFDC46; text-decoration: none; }
		#mainMenus ul li:hover > ul li a:hover { color: #FFFFFF; text-decoration: underline; }
		#mainMenus ul li ul {
			position: relative;
			margin: 0px;
			padding: 0px;
			min-width: 310px;
			color:#000000;
			background-color: rgba(101,127,213,0.97);
			-moz-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
			-webkit-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
			box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
		}
	#mainHeader {
		position:relative;
		z-index:3;
		width:100%;
		height:166px;
		margin:0px;
		background-color:#75B167;
	}
	#headerLogoBG {
		position:absolute;
		z-index:6;
		top:0px;
		left:0px;
		width:250px;
		height:166px;
		margin:0px;
		background:url(/images/LogoBG.png) top left no-repeat;
	}
	#headerTopBarBG {
		position:absolute;
		z-index:6;
		top:0px;
		left:250px;
		right:0px;
		height:40px;
		background:url(/images/HeaderBG.png) top left repeat-x;
	}
	#headerTopBar {
		position:absolute;
		z-index:7;
		top:50px;
		left:200px;
		right:0px;
		text-align:center;
		color:#CC0000;
		padding:4px;
	}
	#headerTopBar A { display:inline-block; color:#CC0000; margin:10px 20px; }
	#headerPageTitle {
		display:none;
	}
}

@media (min-width:481px) and (max-width:1199px) {
	#mainMenus {
		position:relative;
		clear:both;
		z-index:5;
		text-align:center;
		background-color:#657FD5;
		display:flex;
	}
		#mainMenus ul ul { display:none; z-index:110; }
		#mainMenus ul li:hover > ul { display:block; }
		#mainMenus ul {
			margin: 0px auto;
			padding: 0px 20px;
			list-style: none;
			position: relative;
			display: inline-block;	
		}
		#mainMenus ul li {
			float: left;
			margin: 2px;
			position: relative;
		}
		#mainMenus ul li a {
			padding: 5px 10px;
			display: block;
			color: #FFDC46;
			text-decoration: none;
		}
		#mainMenus ul li:hover, #mainMenus ul li:active {
			background-image: url(/images/Shade20.png);
		}
		#mainMenus ul li:hover a { color: #FFFFFF; text-decoration: underline; }
		#mainMenus ul li:hover > ul li { float: none; display: block; border: 0px; }
		#mainMenus ul li:hover > ul li a { color: #FFDC46; text-decoration: none; }
		#mainMenus ul li:hover > ul li a:hover { color: #FFFFFF; text-decoration: underline; }
		#mainMenus ul li ul {
			position: absolute;
			top: 38px;
			left: 0px;
			margin: 0px;
			padding: 0px;
			min-width: 200px;
			color: #000000;
			background-color: rgba(101,127,213,0.97);
			-moz-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
			-webkit-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
			box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
		}
	#mainHeader {
		position:relative;
		z-index:10;
		width:100%;
		height:166px;
		margin:0px;
		background-color:#75B167;
	}
	#headerLogoBG {
		position:absolute;
		z-index:6;
		top:0px;
		left:0px;
		width:250px;
		height:166px;
		margin:0px;
		background:url(/images/LogoBG.png) top left no-repeat;
	}
	#headerTopBarBG {
		position:absolute;
		z-index:6;
		top:0px;
		left:250px;
		right:0px;
		height:40px;
		background:url(/images/HeaderBG.png) top left repeat-x;
	}
	#headerTopBar {
		position:absolute;
		z-index:7;
		top:0px;
		left:250px;
		right:0px;
		height:40px;
		text-align:right;
		color:#CC0000;
		font-size:0.9em;
		padding:4px;
	}
	#headerTopBar A { color:#CC0000; margin:2px 20px; }
	#headerPageTitle {
		position:absolute;
		z-index:7;
		top:40px;
		left:0px;
		right:20px;
		height:36px;
		margin-left:220px;
		text-align:center;
		color:#FFFFFF;
	}
	#mainContent {
		padding:10px;
	}
}

@media (min-width:1200px) {
	#mainMenus {
		position:absolute;
		left:0px;
		right:0px;
		top:85px;
		padding-left:200px;
		z-index:5;
		text-align:center;
		background-color:#657FD5;
		display:flex;
	}
		#mainMenus ul ul { display:none; z-index:110; }
		#mainMenus ul li:hover > ul { display:block; }
		#mainMenus ul {
			margin: 0px auto;
			padding: 0px 20px;
			list-style: none;
			position: relative;
			display: inline-block;	
		}
		#mainMenus ul li {
			float: left;
			margin: 2px;
			position: relative;
		}
		#mainMenus ul li a {
			padding: 5px 10px;
			display: block;
			color: #FFDC46;
			text-decoration: none;
		}
		#mainMenus ul li:hover, #mainMenus ul li:active {
			background-image: url(/images/Shade20.png);
		}
		#mainMenus ul li:hover a { color: #FFFFFF; text-decoration: underline; }
		#mainMenus ul li:hover > ul li { float: none; display: block; border: 0px; }
		#mainMenus ul li:hover > ul li a { color: #FFDC46; text-decoration: none; }
		#mainMenus ul li:hover > ul li a:hover { color: #FFFFFF; text-decoration: underline; }
		#mainMenus ul li ul {
			position: absolute;
			top: 38px;
			left: 0px;
			margin: 0px;
			padding: 0px;
			min-width: 200px;
			color: #000000;
			background-color: rgba(101,127,213,0.97);
			-moz-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
			-webkit-box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
			box-shadow:6px 6px 6px 0px rgba(119, 119, 119, 0.55);
		}
	#mainHeader {
		position:relative;
		z-index:10;
		width:100%;
		height:85px;
		margin:0px;
		background-color:#75B167;
	}
	#headerLogoBG {
		position:absolute;
		z-index:6;
		top:0px;
		left:0px;
		width:250px;
		height:166px;
		margin:0px;
		background:url(/images/LogoBG.png) top left no-repeat;
	}
	#headerTopBarBG {
		position:absolute;
		z-index:6;
		top:0px;
		left:250px;
		right:0px;
		height:40px;
		background:url(/images/HeaderBG.png) top left repeat-x;
	}
	#headerTopBar {
		position:absolute;
		z-index:7;
		top:0px;
		left:250px;
		right:0px;
		height:40px;
		text-align:right;
		color:#CC0000;
		font-size:0.9em;
		padding:4px;
	}
	#headerTopBar A { color:#CC0000; margin:2px 20px; }
	#headerPageTitle {
		position:absolute;
		z-index:7;
		top:40px;
		left:0px;
		right:20px;
		height:36px;
		margin-left:220px;
		text-align:center;
		color:#FFFFFF;
	}
	#mainContent {
		margin-top:50px;
		padding:10px;
	}
}

#mainContentHolder {
	display:flex;
	width:100%;
	flex-flow:row wrap;
	justify-content:center;
}
#mainContentSideBar {
	flex:0 1 30%;
	min-width:300px;
	order:2;
}
#mainContentText {
	flex:1 1 70%;
	min-width:300px;
	max-width:1000px;
	order:1;
	padding:10px;
}
#mainContent {
	position:relative;
	z-index:2;
	clear:both;
}
#mainFooter {
	position:relative;
	clear:both;
	z-index:3;
	bottom:0px;
	margin:0px auto;
	text-align:center;
	display:flex;
	justify-content:center;
	align-items:center;
}
#mainFooter TD {
	font:0.8em Arial,Verdana,Helvetica,sans-serif;
	color:#444444;
}
#mainFooter A { text-decoration:none; color:#003366; }
#mainFooter A:hover { text-decoration:underline; color:#3D6FB6; }
#overlayLayer {
	z-index: 9999;
	background-image:url(/images/Shade50.png);
	position:fixed; top:0px; left:0px; width:100%; height:100%; color:#FFFFFF; text-align:center; vertical-align:middle;
}
#overlayLayer A { color:#FFFFFF; }
