html, body  {
	font: 100% Verdana, Arial, Helvetica, sans-serif;
	background: #CFDEF2;
	margin: 0 auto; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 10px;
	color: #333;
	height: 100%;
	text-align: left;
}
/*interior.css is attached to the interior.html page and interiorPlayer.html. the background for the main content is white  with 2 columns. there is a secondary navigation and an image in the header. the small donation and small join community button are styled to the right. */
#container { 
	width: 864px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	padding:0px;
	}
/*container ends*/


/*contains the curved edges image, logo, main navigation and search*/	
#header{
	margin: 0px;
	padding: 0px;
	height: 78px;
	}
	
/*placed curved edges images*/	
#curve{
	height: 10px;
	background-image:url(../images/wrapper/white.png);
	background-repeat: no-repeat;}	 
	 
*html #curve{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/wrapper/white.png', sizingMethod='fixed');
background: url(../images/wrapper/clear.gif);
}
	
/*left side of the header contains the logo white background*/
#logo{
margin: 0px;
padding: 0px 0px 0px 20px;
height: 68px;
width: 234px;
float: left;
background: #FFFFFF;
} 
*:first-child+html #logo {
padding: 0px 21px 0px 20px;
}
*html #logo {
padding: 0px 21px 0px 20px;
}
	
/*header navigation top right*/
#headerNav{
	font-size:11px;
	margin: 0px;
	padding: 0px 20px 0 0;
	width: 590px;
	height: 68px;
	float: right;
	background:#ffffff;
	text-align: right;
	}

/*pushes the top right navigation to the top*/
#headerNav ul{
	margin: 0px;
	padding: 0px 0px 4px 0px;
}

/*creates a list with borders*/
#headerNav ul li{
	list-style: none;
	display: inline;
	border-right: 1px solid #4D4D4D;
	padding: 0px 10px 0px 10px;}

/*grey colored type and no underline*/
#headerNav ul li a{
	font-size: 11px;
	color: #4D4D4D;
	text-decoration: none;}
	
/*hover with an underline*/
#headerNav ul li a:hover{
	text-decoration: underline;
	}
	
/*the selected state has an underline*/
#headerNav ul li a.selected{
	text-decoration:underline;}
	
/*search form styled out*/	
form{
	margin: 10px 0 0 0;
	}


/*end of header*/

/*main navigation with the background image/ height/ font size*/
#mainNav{
	padding: 0px;
	margin: 0px;
	font-weight: bold;
	font-size:10px;
	height: 22px;
	background-image:url(../images/wrapper/mainnav.gif);
	background-repeat: repeat-x;
	text-align: center;
	}
	
	
/*floats the list left and controls the color*/
#mainNav ul{
	padding: 0 20px 0 0;
	margin: 0;
	color: #005295;
	float: left;		
}

/*displays the list inline*/
#mainNav ul li { 
	display: inline; }

/*floats left with no underlines and border right/ blue color*/
#mainNav ul li a{
	padding: 5px 10px 5px 10px;
	color: 005295;
	text-decoration: none;
	float: left;
	border-right: 1px solid #005295;
	font-size: 10px;
}

/*link is blue*/
#mainNav a:link{
	color: #005295;}

/*visited blue*/	
#mainNav a:visited{
	color: #005295;}

/*hover background color orange white type*/	
#mainNav ul li a:hover{
	background-color: #f37421;
	color: #fff;
}
/*end of main navigation*/

	
/*contains flash animation or image and the secondary navigation*/
/*set height 125 background color dark blue*/
#containFlash{
	padding: 0px;
	margin: 0px;
	height: 125px;
	background: #16529a;}	
	

	
	
/*placement of flash animation or image*/		
#flash{
	padding: 0px;
	margin: 0px;
	float: right;
	}

/*creates a white space between the flash and the main content*/	
#spacer{
	padding: 0px;
	margin: 0px;
	height: 7px;
	background-color:#FFFFFF;
	}
/*end of Flash header with secondary navigation*/
	
	
/*contains all of the main content with 2 columns mainLeft and mainRight*/	
#mainContent{
/*min-height:353px;*/
	overflow: hidden;/*makes the background image go to the end of the content*/
	background-image:url(../images/wrapper/borderwhite.gif);
	background-repeat:repeat-y;
	text-align: left;
	}
#mainContentOne{
/*min-height:353px;*/
	overflow: hidden;/*makes the background image go to the end of the content*/
	background: #ffffff;
	background-image: none;
	text-align: left;
	}	
#mainBody {
position: relative;
margin-top: 130px;
width: 557px;
padding: 0px 10px;
}
*:first-child+html #mainBody {
margin-top: 10px;
}
*html #mainBody {
margin-top: 10px;
}
#mainBodyOne {
position: relative;
margin-top: 5px;
width: 844px;
padding: 0px 10px;
clear: both;
}

/*controls left column floated left set widht 288px*/
#mainLeft{
	width: 288px;
	float: left;
	text-align: left;
	}
	
/*controls the right column floated right set width 576px */
#mainRight{
	width: 576px;
	float: right;
	}

	
#regions{
border-top-width: 1px;
border-top-style: solid;
border-top-color: #005295;
}	

#regions h2 
{
padding-top: 15px;
padding-right: 5px;
padding-bottom: 5px;
padding-left: 15px;
color: #005295;
font-size: 17px;
font-weight: bold;
} 

/*list with underline looks like a  grey type*/
#regions li{
	/*margin: 0 0 0 30px;*/
	/*padding: 0px 145px 0px 15px;*/
	font-size: 12px;
	line-height: 18px;
	font-weight:100;
	color: #333333;
	}
	
/*paragraphs in grey*/	
#regions p{
	margin: 0px 10px 0 15px;
	font-size: 12px;
	line-height: 15px;
	font-weight:100;
	color: #333333;
	padding-bottom: 10px;
	}
	
#regions p.events{
	margin: 0 10px 0 15px;
	font-size: 12px;
	line-height: 15px;
	font-weight:100;
	color: #333333;
	padding-top: 10px; 
	border-bottom-width: 1px;
border-bottom-style: solid;
border-bottom-color: #333333; 
	}	
	
#regions a {
   color: #333333;
}	

#regions a:link {
   color: #333333;	
} 

#regions a:hover {
   color: #f37421;
}

#flashMap{
	/*width: 576px;
	height: 327px;	*/
	margin: 0 0 10px 0px;}

	
#interior {
  width: 430px;
  float: left;
}	
	
/*list with underline looks like a  grey type*/
#interior li{
	/*margin: 0 0 0 30px;*/
	/*padding: 0px 145px 0px 15px;*/
	font-size: 12px;
	line-height: 18px;
	font-weight:100;
	color: #333333;
	}
	
/*paragraphs in grey*/	
#interior p{
	margin: 0px;
	padding-left: 15px;
	padding-right: 10px;
	font-size: 12px;
	line-height: 15px;
	font-weight:100;
	color: #333333;	
	padding-bottom: 10px;
	}

/*/*paragraphs with a link has an orange link*/	
p a:link{
	color:#f37421;
	font-size: 12px;
	color: #333333;
	}
	
/*hover has no underline*/	
p a:hover{
	text-decoration:none;
	}

/*list with border right after text within a paragraph*/
.pipes a{
	text-decoration: none;
	}
	
.pipes a:link{
	color: #005295;}
	
.pipes a:hover{
	text-decoration:underline;}

	
/*headlines in blue 19px*/
h1{
	margin: 0px;
	padding:15px 15px 5px 25px;
	color: #005295;
	font-size:18px;
	line-height: 22px;
	font-weight:500;}

	
/*headlines in orange 19px*/
h2{
	margin: 0px;
	padding:15px 5px 5px 15px;
	color: #F37421;
	font-size:17px;
	font-weight:bold;}
	
/*sub headline in orange 13px*/
h3{
	margin: 0px;
	padding:5px 5px 5px 15px;
	color: #F37421;
	font-size:13px;
	/*font-weight: 600;*/
	 }
/*dark grey headline medium size*/
h4 {
	margin: 0px;
	padding:10px 5px 5px 15px;
	color: #333333;
	font-size:13px;
	font-weight: bold;}


/*bold grey font 12px*/	
#mainRight strong{
	font-size: 12px;
	line-height: 15px;
	font-weight:bold;
	color: #333333;
	}
	
	
/*light blue color on the paragraph*/
.blueType{
color: #ABE1FA;}


/*join button containter*/
/*height expands with type. set width 288 floated left centered with a font size 11px*/
#joinContainer{
	font-size: 11px;
	padding: 0;
	margin: 10px 0 10px 5px;	
	width: 267px;
	height: auto;
	float: left; 
	}

/*the top curved image of the button set height 12px*/	
#joinBtTop{
	margin: 0;
	padding: 0;
	height:12px;
	background-image:url(../images/wrapper/joinbttop.png);
	background-repeat:no-repeat;}  
	
*html #joinBtTop{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/wrapper/joinbttop.png', sizingMethod='fixed');
background: url(../images/wrapper/clear.gif);
}

/*the bottom curved image of the button set height 12px*/
#joinBottom {
	margin: 0;	 
	padding:0;
	height:12px;
	background-image:url(../images/wrapper/joinbottom.png);
	background-repeat:no-repeat;} 
*html #joinBottom{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/wrapper/joinbottom.png', sizingMethod='fixed');
background: url(../images/wrapper/clear.gif);
}

/*space between the top and bottom with a repeated background height set to auto to flow to content*/
#joinBt{
	height: auto;
	background-image: url(../images/wrapper/joinbtbackground.png);
	background-repeat: repeat-y;
	padding: 0;
	margin: 0;
	} 
*html #joinBt{
height: 110px;
 background-image: none;
 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=../images/wrapper/joinbtbackground.png, sizingMethod='scale');
}	
	
/*headline in white for join Button 16px*/	
#joinBt h1{
	padding: 0px 10px 2px 15px;
	margin: 0;
	color: #FFFFFF;
	font-size: 16px;
	/*font-weight: 600;*/}

/*paragraph text on the button set to 11px white color*/	
#joinBt p{
	margin: 0;
	padding: 0px 0 5px 15px;
	font-size: 11px;
	line-height: 13px;
	font-weight:100;
	color: #FFFFFF;
	}
	
/*links are white with no underline 11px*/
#joinBt  p a:link{
	color:#FFFFFF;
	font-size: 11px;
	text-decoration:none;
	}

/*visited on the join button*/
#joinBt  p a:visited{
	color:#FFFFFF;}

/*hover has a white underline*/		
#joinBt p a:hover{
	text-decoration:underline;
	}
/*controls the arrows with a set height of 14px width 34px floated right. A overflow hidden is set to trick the image to roll over and switch to a different color*/	
#arrowBlue a{
	float: right;
	padding: 0px;
	margin: 0px 32px 0px 2px;
	display:block;
	height:14px;
	width:34px;
	overflow:hidden;	
}

/*controls the hover on the arrows. A -35px is set on the text-indent to show the second image of the arrow button*/	
#arrowBlue a:hover{
	display:block;
	text-indent:-35px;} 
/*end of join button*/


/*small button container on the right*/
#smallBt{
	float: right;
	width: 130px;
	/*padding:0px 0px 0px 5px;*/
	margin: 0;
	
	}
/*5px space below the image on the right*/
#smallBt img {
	margin: 0 0 5px 0;}	

/*image right styles*/	
/*orange headline above image*/
#imageRight h1{
color: #F37421;
font-size:12px;
margin: 0;
padding: 0;	
}

/*paragraph below image in grey*/
#imageRight p{	
font-size: 14px;
	color: #333333;
	/*text-decoration: underline;*/
	margin: 0;
	padding: 0;
	}

/*link below image*/	
#imageRight a:link{
font-size: 11px;
	color: #333333;
	text-decoration: underline;
	}
	
/*hover no underline*/
#imageRight a:hover{
	text-decoration: none;
}

/*donation button container*/
/*set height and width 115px background blueButton.png*/	
#donationContainer{
	padding:0px 10px 0px 5px;
	margin:0;
	width: 115px;
	height: 115px;
	background-image:url(../images/wrapper/bluebutton.png);
	background-repeat: no-repeat;
	} 
*html #donationContainer{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/wrapper/bluebutton.png', sizingMethod='fixed');
background: url(../images/wrapper/clear.gif);
}	
	
/*white font paragraph within the button*/	
#donationBt p{
 	margin: 0 0px 0 0;
	padding:15px 20px 0px 12px;
	/*font-weight:100;
	color: #FFFFFF;
	font-size: 14px;*/
	}
	

#donationBt p a, #donationBt p a:link{
font-size:14px;
	color:#FFFFFF;
	text-decoration:none;
	}

/*hover with an underline*/		
#donationBt p a:hover{
	text-decoration:underline;
	}
/*Orange arrow button floated right*/	
#arrowDonate {
	width: 26px; 
	float: right;
	margin: -15px 23px 0px 0px;
	padding:0;
	}
*html #arrowDonate {
height: 17px;
	margin: -15px 13px 0px 0px;
}

/*trick with hover one image us set height and width with overflow hidden and display block*/		
#arrowDonate a{
	float: right;
	padding: 0;
	margin: 0;
	display:block;
	height:15px;
	width:26px;
	overflow:hidden;
	}
	
/*hover shows other half of image by using negative text-indent*/
#arrowDonate a:hover{
display:block;
	text-indent:-26px;}
/*end of donation button*/

/*small join button*/
/*background orange button JoinSmButton set height width 115px*/
#JoinSmContainer{
	padding:0px 10px 20px 5px;
	margin:0;
	width: 115px;
	height: 115px;
	background-image:url(../images/wrapper/joinsmbutton.png);
	background-repeat: no-repeat;
	} 
	
*html #JoinSmContainer{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/wrapper/joinsmbutton.png', sizingMethod='fixed');
background-image: url(../images/wrapper/clear.gif);
}
	

/*controls the padding on the white paragraph*/
#JoinSm p{
 	margin: 0 0px 0 0;
	padding:15px 20px 0px 12px;
	}
	
/*controls the link with no underline and 14px font size*/
#JoinSm a{
font-size: 14px;
	color:#FFFFFF;
	text-decoration:none;
	}

#JoinSm a:link{
font-size: 14px;
	color:#FFFFFF;
	text-decoration:none;
	}
	/*
#JoinSm a:visited {
	color: #FFFFFF;}*/	

/*hover with an underline*/	
#JoinSm p a:hover{
	text-decoration:underline;
	}
	
/*blue arrow button floated right*/	
#arrowJoinSm {
	width: 26px; 
	float: right;
	margin:-13px 22px 0px 0px;
	padding:0;
	}
/*trick with hover one image us set height and width with overflow hidden and display block*/		
#arrowJoinSm a{
	float: right;
	padding: 0;
margin: 0;
	display:block;
	height:15px;
	width:26px;
	overflow:hidden;
	}
	
/*hover shows other half of image by using negative text-indent*/	
#arrowJoinSm a:hover{
	display:block;
	text-indent:-26px;}
/*end of small join button*/



/*movie player set width centered*/
.player{
    margin: 0 0 0 30px;
	padding-top: 10px;}	  
	
.player h1 {
padding-left: 0px;	
}
/*end of main content*/

/*this is for the curved corners on the bottom of the website*/	
#footer{
	padding: 0px;
	margin: 0 auto;
	width: 864px;
	height: 10px;
	background-image: url(../images/wrapper/whitebottom.png);} 
*html #footer{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/wrapper/whitebottom.png', sizingMethod='fixed');
background: url(../images/wrapper/clear.gif);
}	
#footerOne{
	padding: 0px;
	margin: 0 auto;
	width: 864px;
	height: 10px;
	background-image: url(../images/wrapper/whitebottom1.png);} 
*html #footerOne{
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../images/wrapper/whitebottom1.png', sizingMethod='fixed');
background: url(../images/wrapper/clear.gif);
}	
	
/*end of footer*/
	
.linksetMenu{
	margin-bottom: 15px;
	padding:15px 0 10px 0px;
	background:#16529A;
	width: 288px;
	float: left;
	line-height: 20px;
	font-size: 12px;
	min-height: 100px;
	text-align:left;}
   
/*list for secondary nav floated left */
.linksetLinkInternal .navigationItem{
	margin:0px;
	padding: 0;
	float: left;
	width:100%;
	list-style:none;
	}
/*no underline with display block text color light blue*/	
.navigationItem a{
	display: block;
	color: #cfdef2;
	text-decoration: none;
	padding: 0 35px;
	link-height: 2.5;
	}
	
/*type white with a hover image with a gradient and orange bullet*/
.navigationItem a:hover{
	color: #FFFFFF;
	background:url(../images/wrapper/hoversecondarya.gif);
	}

.linksetSubMenu-1 .linksetLabel{
	color: #FFFFFF;
	background-image:url(../images/wrapper/hoversecondarya.gif);
	display: block;
	text-decoration: none;
	padding: 0 35px;
	link-height: 2.5;
	}

	
/*subnavigation on the secondary navigation*/	
.linksetSubMenu-2{
	margin: 0px;
padding:0px;
background:#16529A;
list-style-type: none;
/*width: 288px;*/
/*float: left;*/
line-height: 15px;
font-size: 10px;
/*font-weight: bold;*/
}

/*padding left to push the secondarySub to the right*/
.linksetSubMenu-2 .navigationItem {
	margin:0px;
	padding: 0 0 0 20px;
	float: left;
	width:100%;}
	
/*no underline*/
.linksetSubMenu-2 .navigationItem a{
	text-decoration: none;
	padding: 0 35px;
	}

/*link in orange*/	
.linksetSubMenu-2 .navigationItem a:link{
	color: #efa47b;}

/*visited in orange*/	
.linksetSubMenu-2 .navigationItem a:visited{
	color: #efa47b;}

/*hover in white*/	
.linksetSubMenu-2 .navigationItem a:hover{
	color: #FFFFFF;	
	background-image: none;
	}


.clearfix:after {
    content: ".";
    display: block;
    clear: both;
    visibility: hidden;
    line-height: 0;
    height: 0;
}

.clearfix {
    display: inline-block;
}

html[xmlns] .clearfix {
    display: block;
}

* html .clearfix {
    height: 1%;
}

/* default style modifications */

P, LI, OL, UL, TABLE, TR, TH, TD, .Explicit, fieldset {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

hr {
	margin-right: 10;
	margin-left: 10;
	width: 100%;
	height: 1px;
	background-color: #000000;
	border: 0px solid #000000;
}
a.topNav:link, a.topNav:active, a.topNav:visited {
	color: white;
	font-size: 12px;
	font-weight: bold;
	text-decoration: none;
	font-family:  Verdana, Arial, Helvetica, sans-serif;
}
a.topNav:hover {
	color: #000000;
	font-size: 12px;
	font-weight: bold;
	text-decoration: underline;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
/*
a, a:link, a:visited {
	color : #039;
	font-size: 12px;
	text-decoration : underline;
	font-family:  Verdana, Arial, Helvetica, sans-serif;
}
a:hover, a:active {
	color : #36c;
	font-size: 10pt;
	text-decoration : underline;
	font-family: Arial, Helvetica, Verdana, sans-serif;
}*/
.SectionHead {
	font-family: Verdana, Arial, Helvetica,  sans-serif;
}
p.cstmTitle {
	font-size: 14pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
.ObjTitle {
	color: #039;
	font-size: 12pt;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}
.ProgressBox {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: bold;
}
.ProgressBoxCurrent {
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: bold;
}
table.ProgressBox {
	padding-right : 4px;
	padding-left : 4px;
	border-bottom: #000000 1px solid;
	border-top: #000000 1px solid;
	border-left: #000000 1px solid;
	border-right: #000000 1px solid;
}
a.ProgressBox:link {
	font-size: 8pt;
	text-decoration:none;
}
a.ProgressBox:visited {
	font-size: 8pt;
	text-decoration:none;
}
a.ProgressBox:hover {
	font-size: 8pt;
	font-weight: bold;
	text-decoration:none;
}
.Instructions {
	color: white;
	background-color : #069;
	background-image: URL(../images/sp.gif);
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	font-weight: bold;
	padding: 4px 4px 1px 4px;
	margin-bottom: 0px;
	margin-top: 0px;
}
td.Instructions {
	border-bottom: #000000 1px solid;
	border-top: #000000 1px solid;
	border-left: #000000 1px solid;
	border-right: #000000 1px solid;
}
a.whitelink, a.whitelink:link, a.whitelink:visited, a.whitelink:hover, a.whitelink:active {
	color: white;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
}
.FormBox {
	font-family:  Verdana, Arial, Helvetica, sans-serif;
	font-size: 8pt;
	background-color: white;
	background-image: URL(../images/sp.gif);
}
div.FormBox {
	border: #669 1px solid;
	background-color: white;
	background-image: URL(../images/sp.gif);
	padding: 0px;
	width: 600px
}
div.FormBoxNoWidth {
	border: #669 1px solid;
	background-color: white;
	background-image: URL(../images/sp.gif);
	padding: 0px;
}
table.FormBox {
	border: #669 1px solid;
	border-collapse: collapse;
}
.FormBox .Divider {
	background-color: white;
}
.FormBoxNoWidth .Divider {
	background-color: white;
}
.FormBox .dividerHeading {
	background-color: white;
}
.FormBoxNoWidth .dividerHeading {
	background-color: white;
}
td.FormInput textarea, td.FormInput label, td.FormInput input, td.FormInput select, td.FormInput option {
font-family: Verdana;
}
.FormMsgText, .ProgressBar {
padding: 10px 0;
}

.WrapperBack {
visibility:hidden;
display:none;
}

#headerNav ul li.first{
    border-left: #4d4d4d solid 1px; 
}

input.search{
vertical-align: top;
margin-top:2px;
}