@import 'reset.css';

/* ==================================================================================== */
/* = Generic Styles begin here - will try and keep names as transportable as possible = */
/* ==================================================================================== */

body {
	background:#fff url('../img/bg-body.png') repeat-x;
	margin:0;
	padding:0;
	font-family: Arial, helvetica, sans-serif;
	color:#333;
}

#menu-bar  {
	height:39px;
	width:100%;
	text-align:center;
	margin:0;
	padding:0;
	position:absolute;
	top:0;
	z-index:2;
	background: transparent url('../img/bg-header-bar.png') top left repeat-x; 
}

#menu-bar span {
	font-family:Arial, Helvetica, sans-serif;
	color:#FFF;
	text-align:right;
	font-size:12px;
	text-transform:uppercase;
	width:848px;
	display:block;
	margin:0px auto 0 auto;
}

#menu-bar span a {
	text-decoration:none;
	color:#FFF;
	position:relative;
	margin:0 0 0 10px;
	padding: 7px 12px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background:#006699;
}

#menu-bar span a:hover {
	font-weight: bold;
}

#header {
	height:210px;
	width:848px;
	margin:0 auto;
	z-index:1;
	background:transparent url('../img/bg-header-center.png') no-repeat;
	
}

#content {
	width:848px;
	margin:0 auto;
	min-height:400px;
}



/* =============== */
/* = text styles = */
/* =============== */

/* Used for logo - semantic fanatics can bite my shiny metal  /Bender */
h1 {
	padding:35px 0 0 0;
}

/* Main tagline */
h2 {
	font-size:24px;
	color:#187DB9;
	margin:10px 0 15px 0;
}

h3 {
	font-size:18px;
	color:#677F91;
	margin:20px 0 0 0;
}

p {
	clear:left;
	margin:0 0 15px 0;
	font:14px/25px helvetica;
}


/* ================================= */
/* = Make like the shins and split = */
/* ================================= */

#col1 {
	float:left;
	margin:0 10px 0 0 ;
	width:220px;
}
#login-holder {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background: #677F91 url('../img/bg-login.png') repeat-x;
	padding:5px;
	margin:20px 0 0 0;
}

#col1 #login-holder h3 {
	color:#fff;	
	margin:0 0 0 0;
	font-size:10px;
	border:0;
	line-height:10px;
}

#col1 #login-holder label {
	font-size:10px;
	color:#333;
	font-family:arial;
	margin:0;
	line-height:0;
}

#col1 #login-holder input[type="text"] {
	width:200px;
}


/* ========================= */
/* = Right Column Elements = */
/* ========================= */

#col2 {
	float:right;
	width:610px;
}

#col2 p {
	line-height:21px;
}

#col2  a {
	color:#187DB9;
	text-decoration:none;
	border-bottom: 1px dotted #187DB9;
}

#col2  a:hover {
	color:#187DB9;
	text-decoration:none;
	border-bottom: 1px solid #187DB9;
	
}

#col2 #image-holder {
	width:209px;
	float:right;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background:#187db9;
	font-size:10px;
	color:#fff;
	margin:0 0 0 20px;
}

#col2 #image-holder p {
	padding:7px 12px;
	margin:0 0 5px 0;
	font:10px/14px helvetica;
}

#col2 #image-holder-wide {
	width:600px;
	float:left;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	background:#187db9;
	font-size:10px;
	color:#fff;
	margin:0 0 20px 0;
}

#col2 #image-holder-wide p {
	padding:7px 12px;
	margin:0 0 3px 0;
	font:10px/14px helvetica;
}

#col-wide {
	width:850px;
}

#col-wide p {
	line-height:21px;
}

#col-wide a {
	color:#187DB9;
	text-decoration:none;
}

#col-wide a:hover {
	color:#187DB9;
	text-decoration:none;
}

#col-wide a img {
	margin-left: 15px;
	vertical-align: middle;
}

#map-holder {
	margin-bottom: 20px;
	height:675px;
	border: 1px solid #666;
}

#cm_mapTR {
	overflow:visible; 
	background-color:#fff; 
	float:right; 
	height:675px; 
}

#cm_mapTR a {
	text-align: center;
}

#water-holder {
	width:585px;
	background: #DDD url('../img/bg-widebar.png') repeat-x;
	padding:0px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}

#water-holder img {
	margin:8px 0 5px 8px;
	
}

#water-holder h3 {
	color:#187DB9;
	width:430px;
	float:right;
	margin:10px 0 0 0;
}

#water-holder p {
	float:right;
	width:430px;
	color:#333;
	line-height:17px;
	font-size:12px;
}

#water-holder p a {
	color:#fff;
	text-decoration:none;
}


#col2 ol {
	width:450px;
	font-size:14px;
	color:#333;
	list-style-type: decimal;
	margin:0 40px 0 40px;
	display:block;
}

#col2 ol li, #col2 ul li {
	line-height:20px;
}

#col2 ul {
	font-size:14px;
	color:#333;
	margin:20px 40px 0 40px;
	display:block;
	list-style-type: disc;
	padding: 0 0 0 10px;
}

#col2 ul li {
	margin:0 0 10px 0;
}

#col2 table.lists {
	width:550px;
	font-size:12px;
	color:#187DB9;
	line-height:16px;
}

#col2 table.lists tr {
	height:25px;
}

#col2 div.highlight_box {
	border:1px solid #E3E3E3;
	background-color:#EEE;
	padding:0 20px 5px 20px;
	margin:0 0 15px 0;
}

#col2 div.highlight_box h3 {
	color:#E35525;
}


/* ======================================== */
/* = What's on the menu? Right.... STYLE! = */
/* ======================================== */

#col1 h3 {
	border-bottom:1px solid #666;
	width:190px;
	padding:0 0 10px 0;
	color:#187DB9;
}

#col1 ul {
	width:190px;
}

#col1 ul li {
	border-bottom:1px dotted #666;
	
}

#col1 ul li a {
	font-family:arial;
	font-size:12px;
	color:#666;
	line-height:28px;
	text-decoration:none;
}

#col1 ul li a:hover {
	color:#187DB9;
}

#col1 img {
	margin:20px auto;
}


/* ================================ */
/* = Footer content and structure = */
/* ================================ */

#footer {
	height:150px;
	margin:0 0 0px 0 ;
	clear:both;
	width:100%;
	background:#999;
}

#innerFooter {
	width:848px;
	background:url('../img/footer-header.jpg') top center no-repeat;
	margin:0 auto;
	height:40px;
	padding:13px 0 0 0;
}

p.bbc {
	float:right;
	font-size:10px;
	color:#ccc;
	margin:0 5px 0 0;
}

p.copy {
	float:left;
	width:400px;
	color:#ccc;
	font-size:10px;
	margin:0 0 0 5px;
}

p.copy a {
	color:#ccc;
	text-decoration:none;
}

p.bbc a {
	color:#ccc;
}

/* ====================================================================== */
/* = Content style items (unordered lists, ordered lists, quotes et al) = */
/* ====================================================================== */
#col2 ul.titleList, #col2 ul.linkList {
	margin:0;
	padding:0;
}


#col2 ul.linkList li {
	list-style:none;
	margin:0;
	padding:0;
	
}

#col2 .titleList h4 {
	color:#187DB9;
}

#col2 .titleList p {
	color:#666;
	font-size:12px;
	width:300px;
}


#col2 .linkList h4 {
	color:#666;
}

#col2 .linkList p {
	color:#666;
	font-size:12px;
	width:300px;
}

#col1 p.quote {
	width:188px;
	clear:left;
	background:#006699 url('../img/bg-quote-header.png') no-repeat;
	font-size:15px;
	font-family:georgia;
	color:#FFF;
	font-style:italic;
	padding:10px;
	margin:20px 0 0px 0px;
	line-height:140%;
}

#col1 p.cite {
	width:188px;
	padding:0 10px 5px 10px;
	background: #006699 url('../img/bg-quote-footer.png') bottom center no-repeat;
	display:block;
	color:#ccc;
	font-size:10px;
	line-height:140%;
}

.mainTable td {
	padding:3px;
	border-bottom:3px solid #FFF;
}

.mainText {
	text-align: right;
}

.titleTable {
	color:#187DB9;
}
.cellTable {
	background-color:#EFEFEF;
}


/* ==================================================== */
/* = Just some temp highlighting for missing elements = */
/* ==================================================== */

#col2 p .needed, #col1 .needed {
	background:#ccc;
	padding:2px;
	color:#990000;
}

/* ==================== */
/* = Styling for Form = */
/* ==================== */

#leftcol {
	float:left;
	margin:6px 10px 0 0 ;
	width: 175px;
	
}

#leftcol p {
	clear:left;
	font:14px/22px helvetica;
}

#rigthcol {
	float:right;
	width:610px;
}

.form {
	line-height:21px;
	font: 14px/21px helvetica;
}

#row {
	font: 14px helvetica;
	height:22px;
}

.bold {
	font-weight: bolder;
	color:#677F91;
}


/* ================ */
/* = Photo Styles = */
/* ================ */

ul.gallery {
	width:560px;
	margin:0 0 0 15px;
}


ul.gallery li {
	float:left;
	width:160px;
	height:160px;
	overflow:hidden;
	text-align:center;
	margin:5px 15px 15px 5px;
	
}

ul.gallery li img {
	margin:0 auto;
	padding:3px;
	border:1px solid #AAA277;
}

#archive_news{
	width:560px;
	border:solid #45321E 1px;
	padding:10px;
	margin:20px 0;
	background:#AAA277;
	display:block;
	clear:left;
	float:left;
}



/* ------------------------------------------------------------------------
	This you can edit.
------------------------------------------------------------------------- */

	div.pp_pic_holder .pp_top .pp_left { background: url(../images/prettyPhoto/light_rounded/tl.gif) top left no-repeat; } /* Top left corner */
	div.pp_pic_holder .pp_top .pp_middle { background: #fff; } /* Top pattern/color */
	div.pp_pic_holder .pp_top .pp_right { background: url(../images/prettyPhoto/light_rounded/tr.gif) top left no-repeat; } /* Top right corner */
	
	div.pp_pic_holder .pp_content { background-color: #fff; } /* Content background */
	div.pp_pic_holder .pp_content a.pp_next:hover { background: url(../images/prettyPhoto/light_rounded/btnNext.png) center right no-repeat; cursor: pointer; } /* Next button */
	div.pp_pic_holder .pp_content a.pp_previous:hover { background: url(../images/prettyPhoto/light_rounded/btnPrevious.png) center left no-repeat; cursor: pointer; } /* Previous button */
	div.pp_pic_holder .pp_content a.pp_expand { background: url(../images/prettyPhoto/light_rounded/btnExpand.gif) top left no-repeat; cursor: pointer; } /* Expand button */
	div.pp_pic_holder .pp_content a.pp_expand:hover { background: url(../images/prettyPhoto/light_rounded/btnExpand.gif) bottom left no-repeat; cursor: pointer; } /* Expand button hover */
	div.pp_pic_holder .pp_content a.pp_contract { background: url(../images/prettyPhoto/light_rounded/btnContract.gif) top left no-repeat; cursor: pointer; } /* Contract button */
	div.pp_pic_holder .pp_content a.pp_contract:hover { background: url(../images/prettyPhoto/light_rounded/btnContract.gif) bottom left no-repeat; cursor: pointer; } /* Contract button hover */
	div.pp_pic_holder .pp_content a.pp_close { width: 75px; height: 22px; background: url(../images/prettyPhoto/light_rounded/btnClose.png) center left no-repeat; cursor: pointer; } /* Close button */

	div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_previous { background: url(../images/prettyPhoto/light_rounded/arrow_previous.png) top left no-repeat; } /* The previous arrow in the bottom nav */
	div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_next { background: url(../images/prettyPhoto/light_rounded/arrow_next.png) top left no-repeat; } /* The next arrow in the bottom nav */

	div.pp_pic_holder .pp_bottom .pp_left { background: url(../images/prettyPhoto/light_rounded/bl.gif) top left no-repeat; } /* Bottom left corner */
	div.pp_pic_holder .pp_bottom .pp_middle { background: #fff; } /* Bottom pattern/color */
	div.pp_pic_holder .pp_bottom .pp_right { background: url(../images/prettyPhoto/light_rounded/br.gif) top left no-repeat; } /* Bottom right corner */

	div.pp_pic_holder .pp_loaderIcon { background: url(../images/prettyPhoto/light_rounded/loader.gif) center center no-repeat; } /* Loader icon */

	div.ppt div.ppt_left { background: url(../images/prettyPhoto/light_rounded/ttl.gif) top left no-repeat; }
	div.ppt div.ppt_right { background: url(../images/prettyPhoto/light_rounded/ttr.gif) top left no-repeat; }
	div.ppt div.ppt_content { background: url(../images/prettyPhoto/light_rounded/ttp.gif) top left repeat-x; }
	
	/* ----------------------------------
		Dark Rounded Theme
	----------------------------------- */
	
	div.dark_rounded .pp_top .pp_left { background: url(../images/prettyPhoto/dark_rounded/tl.png) top left no-repeat; } /* Top left corner */
	div.dark_rounded .pp_top .pp_middle { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat; } /* Top pattern/color */
	div.dark_rounded .pp_top .pp_right { background: url(../images/prettyPhoto/dark_rounded/tr.png) top left no-repeat; } /* Top right corner */
	div.dark_rounded .pp_bottom .pp_left { background: url(../images/prettyPhoto/dark_rounded/bl.png) top left no-repeat; } /* Bottom left corner */
	div.dark_rounded .pp_bottom .pp_middle { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat; } /* Bottom pattern/color */
	div.dark_rounded .pp_bottom .pp_right { background: url(../images/prettyPhoto/dark_rounded/br.png) top left no-repeat; } /* Bottom right corner */
	div.dark_rounded .pp_content { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat; } /* Content background */
	div.dark_rounded .currentTextHolder { color: #c4c4c4; }
	div.dark_rounded div.ppt_left { background: url(../images/prettyPhoto/dark_rounded/tl.png) top left no-repeat; }
	div.dark_rounded div.ppt_right { background: url(../images/prettyPhoto/dark_rounded/tr.png) top right no-repeat; }
	div.dark_rounded div.ppt_content { background: url(../images/prettyPhoto/dark_rounded/contentPattern.png) top left repeat; }
	div.dark_rounded .pp_loaderIcon { background: url(../images/prettyPhoto/dark_rounded/loader.gif) center center no-repeat; } /* Loader icon */
	
	
	/* ----------------------------------
		Dark Square Theme
	----------------------------------- */
	
	div.dark_square .pp_top .pp_left ,
	div.dark_square .pp_top .pp_middle,
	div.dark_square .pp_top .pp_right,
	div.dark_square .pp_bottom .pp_left,
	div.dark_square .pp_bottom .pp_middle,
	div.dark_square .pp_bottom .pp_right,
	div.dark_square .pp_content,
	div.dark_square div.ppt_left,
	div.dark_square div.ppt_right,
	div.dark_square div.ppt_content { background: url(../images/prettyPhoto/dark_square/contentPattern.png) top left repeat; }
	div.dark_square .currentTextHolder { color: #c4c4c4; }
	div.dark_square .pp_loaderIcon { background: url(../images/prettyPhoto/dark_rounded/loader.gif) center center no-repeat; } /* Loader icon */


	/* ----------------------------------
		Light Square Theme
	----------------------------------- */
	
	div.light_square .pp_top .pp_left ,
	div.light_square .pp_top .pp_middle,
	div.light_square .pp_top .pp_right,
	div.light_square .pp_bottom .pp_left,
	div.light_square .pp_bottom .pp_middle,
	div.light_square .pp_bottom .pp_right,
	div.light_square .pp_content,
	div.light_square div.ppt_left,
	div.light_square div.ppt_right,
	div.light_square div.ppt_content { background: #fff; }
	div.light_square div.ppt_content { color: #666666; }


/* ------------------------------------------------------------------------
	DO NOT CHANGE
------------------------------------------------------------------------- */

	div.pp_pic_holder a:focus { outline:none; }

	div.pp_overlay {
		background: #000;
		position: absolute; top: 0; left: 0;
		z-index: 9500;
		width: 100%;
	}
	
	div.pp_pic_holder {
		position: absolute; z-index: 10000;
		width: 100px;
	}
		
		div.pp_pic_holder .pp_top {
			position: relative;
			height: 20px;
		}
			* html div.pp_pic_holder .pp_top { padding: 0 20px; }
		
			div.pp_pic_holder .pp_top .pp_left {
				position: absolute;
				left: 0;
				width: 20px; height: 20px;
			}
			div.pp_pic_holder .pp_top .pp_middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 20px;
			}
				* html div.pp_pic_holder .pp_top .pp_middle { position: static; left: 0; }
			
			div.pp_pic_holder .pp_top .pp_right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 20px; height: 20px;
			}
		
		div.pp_pic_holder .pp_content {
			position: relative;
			text-align: left;
			width: 100%; height: 40px;
		}
		
			div.pp_pic_holder .pp_content .pp_details {
				display: none;
				margin: 10px 15px 2px 20px;
			}
				div.pp_pic_holder .pp_content .pp_details p.pp_description { display: none; float: left; margin: 0; }
				
				div.pp_pic_holder .pp_content .pp_details .pp_nav {
					float: left;
					margin: 3px 0 0 0;
				}
				
					div.pp_pic_holder .pp_content .pp_details .pp_nav p { float: left; margin: 0 4px; }
				
					div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_previous,
					div.pp_pic_holder .pp_content .pp_details .pp_nav a.pp_arrow_next {
						float: left;
						display: block;
						width: 14px; height: 15px;
						overflow: hidden;
						text-indent: -10000px;
						margin-top: 3px;
					}
					
					div.pp_pic_holder .pp_content .pp_details .pp_nav a.disabled { background-position: 0 -16px; cursor: default; }
		
		div.pp_pic_holder .pp_content div.hoverContainer {
			position: absolute; z-index: 2000;
			top: 0; left: 0;
			width: 100%;
		}
		
		div.pp_pic_holder .pp_content a.pp_next {
			display: block; float: right;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;
		}
			
		div.pp_pic_holder .pp_content a.pp_previous {
			display: block; float: left;
			text-indent: -10000px;
			width: 49%; height: 100%;
			background: url(../images/prettyPhoto/light_rounded/btnNext.png) 10000px 10000px no-repeat;
		}
		
		div.pp_pic_holder .pp_content a.pp_expand,
		div.pp_pic_holder .pp_content a.pp_contract {
			position: absolute; z-index: 20000;
			top: 10px; right: 30px;
			cursor: pointer;
			display: none;
			text-indent: -10000px;
			width: 20px; height: 20px;	
		}
			
		div.pp_pic_holder .pp_content a.pp_close {
			float: right;
			display: block;
			text-indent: -10000px;
		}
		
		div.pp_pic_holder .pp_bottom {
			position: relative;
			height: 20px;
		}
			* html div.pp_pic_holder .pp_bottom { padding: 0 20px; }
			
			div.pp_pic_holder .pp_bottom .pp_left {
				position: absolute;
				left: 0;
				width: 20px; height: 20px;
			}
			div.pp_pic_holder .pp_bottom .pp_middle {
				position: absolute;
				left: 20px; right: 20px;
				height: 20px;
			}
				* html div.pp_pic_holder .pp_bottom .pp_middle { position: static; left: 0; }
				
			div.pp_pic_holder .pp_bottom .pp_right {
				position: absolute;
				top: 0; left: auto; right: 0;
				width: 20px; height: 20px;
			}
		
		div.pp_pic_holder .pp_loaderIcon {
			display: none;
			position: absolute;
			top: 50%; left: 50%;
			margin: -12px 0 0 -12px;
			width: 24px; height: 24px;
		}
		
		div.pp_pic_holder #full_res { width: 100%; text-align: center; }
			div.pp_pic_holder #full_res { display: block; margin: 0 auto; }
	
		div.ppt {
			display: none;
			position: absolute;
			top: 0; left: 0;
			z-index: 9999;
			color: #fff; font-size: 13px;
		}
		
			div.ppt div.ppt_left,
			div.ppt div.ppt_right { float: left; width: 19px; height: 23px; overflow: hidden; }
			
			div.ppt div.ppt_content { float: left; line-height: 23px; }
			
/* ------------------------------------------------------------------------
	Miscellaneous
------------------------------------------------------------------------- */

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

	.clearfix {display: inline-block;}

	/* Hides from IE-mac \*/
	* html .clearfix {height: 1%;}
	.clearfix {display: block;}
	/* End hide from IE-mac */