/* Start of CMSMS style sheet 'csieupahr-global-screen' */
{* This is the Global styelsheet for the 'screen' media. NOTE: Comments below show the types of styles and what they will be applied to in the main document (web page). For information on what these styles mean, look for a good online CSS tutorial at your level of understanding. *}

{* ELEMENTS: These styles are applied to all elements of this name. For example, if styles are specified for 'p' (Paragraph), all instances of <p></p> in the page will have those styles applied, unless modified by the document using the style="" attribute. *}

body {
/*background-color: #2a71b4;*/
background-color: #5D79BA;
 font-family: arial, helvetica, sans-serif;
 font-size: 0.69em;
 margin: 0;
 padding: 0;
}
img {
 border: 0;
}
a img {
text-decoration: none;
}
div, p, h1, h2, h3, h4 {
border: 0;
padding: 0;
margin: 0;
}
p {
 margin-bottom: 6px;
}
p, a, div, span, blockquote, pre {
 font-size: 1em;
}
h1, h2, h3, h4, h5 {
 font-weight: bold;
 padding: 6px 0 3px 0;
 margin: 0;
 font-family: arial, helvetica, sans-serif;
}
h1 {font-size: 1.36em;}
h2 {font-size: 1.18em;}
h3 {font-size: 1.18em;}
h4 {font-size: 1em;}
h5 {font-size: 1em;}
a:link {
 color: #0066cc;
 text-decoration: underline;
}
a:hover, a:visited:hover {
 color: #006ccf;
 text-decoration: none;
}
a:visited {
 color: #003366;
}
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, a.no-underline:hover, .no-underline a:hover {
 text-decoration: underline ! important;
}
h1 a, h2 a, h3 a, h4 a, a.no-underline, .no-underline a {
 text-decoration: none ! important;
}
hr {
width: 60%;
color: #c0c0c0;
background-color: #c0c0c0;
height: 1px;
padding: 0;
border: 0;
margin: 10px auto 20px auto;
}
fieldset {
border: 1px dotted #666;
}


/* IDs: These are applied to a specific element with id="idname" where 'idname' corresponds to #idname below. */

#container {
 margin: auto;
 width: 775px;
 background-color: #bfcff0;
 padding-bottom: 10px;
 padding: 0 10px 10px 10px;
}
#top-navigation {
 width: 100%;
 margin: 0;
 padding: 7px 0 2px 0;
 font-size: 1em;
 line-height: 12px;
 text-align: right;
}
#header {
 width: 775px;
 height: 130px;
 background-color: #6682c1;
 background-image: url('img/top_bg.png');
 background-repeat: repeat-x;
 position: relative;
 margin: 0 0 11px 0;
 padding: 0;
}
#content-wrapper {
width: 775px;
position: relative;
background-image: url('img/content-background.png') ! important;
}
#left-navigation a {
text-decoration: none;
}
#left-navigation a:hover {
text-decoration: underline;
}
#left-navigation ul li {
font-weight: bold;
margin-bottom: 1em ! important;
}
#left-navigation ul li ul li {
font-weight: normal;
margin-bottom: 0px ! important;
}
#content-box {
 width: 564px;
 background-color: #ffffff;
 float: left;
 margin-bottom: 11px;
}
#rss-link {
color: #c6c6c6;
}
#content-img-container {
 width: 564px;
 height: 291px;
 margin: 0;
 padding: 0;
 position: relative
}
#alpha-band {
 width: 564px;
 height: 39px;
 position: absolute;
 bottom: 0;
 left: 0;
 background-repeat: repeat-x;
}
#alpha-band h3 {
 font-size: 20px;
 font-weight: bold;
 color: #ffffff;
 margin: 8px 0.5em 0 0.5em ! important;
 padding: 0;
}
#content-box-content {
 border: 0;
 padding: 14px 20px;
/*px 15px 10px 10px;*/
 font-size: 105%;
}
#content-box-content p {
line-height: 1.5em;
}
#bottom-navigation, #bottom-links {
 position: relative;
 clear: both;
 margin: 11px;
 font-weight: bold;
 color: #003366;
 text-align: center;
}
#copyright {
 position: relative;
 clear: both;
 margin: 11px;
 font-size: 9px;
 color: #666666;
 text-align: center;
}
#copyright a:link, #copyright a:hover, #copyright a:visited, #copyright a:visited:hover {
color: #666666;
}

#top-navigation ul {
 list-style-type: none;
}
#top-navigation ul li {
 display: inline;
 border-left: 1px solid #003366;
 padding-left: 0.3em;
}
#top-navigation ul li.first {
 border: 0;
}
#top-navigation ul {
 list-style-type: none;
}
#top-navigation ul li {
 display: inline;
 border-left: 1px solid #003366;
 padding-left: 0.3em ! important;
 background: none ! important;
}
#top-navigation ul li.first {
 border: 0;
}

{* CLASSES: These are applied to any element which specifies the class name using class="classname" where 'classname' would appear below as '.classname' *}


/* Navigation lists */
.navigation ul {
 list-style-type: none;
margin: 0; padding: 0;
}
.navigation ul li {
 display: inline;
 margin-left: 0px;
 padding: 0 0 0 12px;
 background: url("img/middot.gif") no-repeat 0 50%;
}
.navigation ul li.first {
 background: none;
}
.navigation a:link {
 color: #003366;
 text-decoration: none;
}
.navigation a:hover, .navigation a:visited:hover {
 color: #0066cc;
 text-decoration: underline;
}
.navigation a:visited {
 color: #003366;
 text-decoration: none;
}
/*---*/
.clear {
width: 100%;
height: 1px;
clear: both;
}
.center {
 text-align: center;
}
.float-left {
 float: left;
}
.float-right {
 float: right;
}
.left-box-header, .right-box-header {
 position: relative;
 height: 25px;
 margin: 0;
 padding: 0 8px 0 8px;
}
.left-box-header h2, .right-box-header h2 {
 font-size: 13px;
 color: #ffffff;
 font-weight: normal;
 padding-top: .3em;
}
.left-box-header {
 background-color: #6682c1;
 background-image: url('img/blue_bar.png');
 background-repeat: repeat-x;
}
.right-box-header {
 background-color: #666e6e;
 background-image: url('img/grey_bar.png');
 background-repeat: repeat-x;
}
.left-box-content {
 padding: 11px;
 margin-bottom: 11px;
 background-color: #ffffff;
}
.news-sidebar-summary-link a {
text-decoration: none;
}
.news-sidebar-summary-link a:hover {
text-decoration: underline;
}
a.feed {
 margin-left: 3px;
 padding: 0 0 0 19px;
 background: url("img/feed-icon-14x14.png") no-repeat 0 50%;
}
.right {
text-align: right;
}
.left-box {
 width: 200px;
 background-color: #bfcff0;
 float: left;
 margin-right: 11px;
}
.left-box-content ul {
list-style-type: none;
margin: 0;
padding: 0;
}
.left-box-content ul li {
 margin-left: .5em;
 text-indent: -.5em
}
.left-box-content ul ul li {
 margin-left: 2em;
 text-indent: -.5em
}
.alpha-red {
 background-image: url('img/red_alpha.png');
}
.alpha-turquoise {
 background-image: url('img/turquoise_alpha.png');
 /* background-color: #3D95AB; */
}
.alpha-yellow {
 background-image: url('img/yellow_alpha.png');
}
.alpha-lightblue {
 background-image: url('img/lightblue_alpha.png');
}
.in-content-float-right {
clear: right;
float: right;
margin: 4px 0 5px 10px;
}
.in-content-float-left {
clear: left;
float: left;
margin: 4px 10px 5px 0;
}
.in-content-center {
clear: both;
text-align: center;
margin: 5px 0 5px 0;
}
.caption {
font-size: 90%;
font-style: italic;
color: #666666;
margin-bottom: 0.5em;
}
.caption-400 {
display: block;
width: 400px;
margin: auto;
text-align: center;
font-size: 90%;
font-style: italic;
color: #666666;
margin-bottom: 1.5em;
}
.custom-top-img {
float: right;
margin-right: 150px;
}
.absolute-fix {
position: absolute;
width: 775px;
height: 11px;
background-color: #bfcff0;
left: 0;
bottom: 0;
}

/*----*/
li.li-as-box {
 float: left;
 width: 1.25em;
 height: 1em;
 background-color: #bfcff0;
 border: 1px solid #84a1e1;
 margin: 0.75em 0.5em ! important;
 padding: 1em ! important;
 text-align: right;
 line-height: 1em;
}
li.li-as-box:hover {
 background-color: #E5C88F;
}
.archive-list {
 position: relative;
 margin-left: 1.25em ! important;
}
/*----*/

/* The following style adds a little arrow when the user expands a section of the navigation bar - (only for 'grandchildren' */
.left-box-content li.activeparent li ul, .left-box-content li li.currentpage ul, .left-box-content li li.haschildren ul {
background-image: url('img/arrow-down-right.png');
background-repeat: no-repeat;
background-position: 0 -1px;
}

/* News */
.NewsSummaryCategory, .NewsPostDetailMeta {
color: #999999;
font-size: 95%;
}

/* FormBuilder */
.contactform fieldset {
padding: 1em;
background-color: #fff;
}
.contactform fieldset legend {
font-weight: bold;
}
.contactform div {
width: 100%;
padding: 0.25em 0 0.25em 0;
}
.contactform div label {
display: block; width: 10em;
}
.contactform div.required {
color: #f00;
}
.contactform textarea {
width: 100%;
}
/* End of 'csieupahr-global-screen' */

/* Start of CMSMS style sheet 'Accessibility and cross-browser tools' */
/* accessibility */

/* 
menu links accesskeys 
*/
span.accesskey {
   text-decoration:none;
}

/* 
accessibility divs are hidden by default 
text, screenreaders and such will show these 
*/
.accessibility, .accessibility hr {
   position: absolute;
   top: -999em;
   left: -999em;
}

/* 
definition tags are also hidden 
these are also used for menu links    
*/
dfn {
   position: absolute;
   left: -1000px;
   top: -1000px;
   width: 0;
   height: 0;
   overflow: hidden;
   display: inline;
}
/* end accessibility */


/* wiki style external links */
/* external links will have "(external link)" text added, lets hide it */
a.external span {
  position: absolute;
  left: -5000px;
  width: 4000px;
}

/* make some room for the image */
a.external {
/* css shorthand rules, read: first top padding 0 then right padding 12px then bottom then right */
  padding: 0 12px 0 0;
}
/* colors for external links */
a.external:link {
  color: #18507C;
/* background image for the link to show wiki style arrow */
  background: url(images/cms/external.gif) no-repeat 100% 0;
}
a.external:visited {
  color: #18507C; /* a different color can be used for visited external links */

/* 
Set the last 0 to -100px to use that part of the external.gif image for different color for active links 
external.gif is actually 300px tall, we can use different positions of the image to simulate rollover image changes.
*/
  background: url(images/cms/external.gif) no-repeat 100% 0; 
}

a.external:hover {
  color: #18507C;
/* Set the last 0 to -200px to use that part of the external.gif image for different color on hover */
  background: url(images/cms/external.gif) no-repeat 100% 0; 
  background-color: #C3D4DF;
}
/* end wiki style external links */


/* clearing */
/* 
clearfix is a hack for divs that hold floated elements. it will force the holding div to span all the way down to last floated item.
We strongly recommend against using this as it is a hack and might not render correctly but it is included here for convenience.
Do not edit if you dont know what you are doing
*/
	.clearfix:after {
		content: "."; 
		display: block; 
		height: 0; 
		clear: both; 
		visibility: hidden;
	}
	* html>body .clearfix {
		display: inline-block; 
		width: 100%;
	}
	
	* html .clearfix {
		/* Hides from IE-mac \*/
		height: 1%;
		/* End hide from IE-mac */
	}

/* end clearing */
/* End of 'Accessibility and cross-browser tools' */