
/* ---------->>> global position styles: <<<-----------------------------------------------------------------------*/
/* ------------  the following styles govern the position/style html, body and wrapper elements -------------------*/

/* note: this is a global white space reset.
 (asterisk is the universal css selector - all descendents will have this setting applied.) */   
*{padding: 0px; margin: 0px;}
				
/* 'min-height: 101%' forces firefox to always have a scrollbar, even on short pages,
   so that layout doesn't shift, which can throw off the sub-menus by a pixel or two. */		  
html, body {
	height: 100%;
}

/* ie7 understands min-height, but ie6 (and under) does not; this hack should force the height
for these browsers and allow the left background graphic to scroll all the way to the bottom of viewport */
/* mac hide \*/
/* html, body, #outer_wrapper {height:100%} */
/* end hide */
	
/* specify a min-width for the body as wide as the wrapper div: 
(prevents negative (inaccessible) left-margins in narrow browser windows 
when using netscape 6+/mozilla on win32.) */					
body {
	position:absolute;   /* wrapper divs seem to need absolute positioning in order to force 100% height */
	width:100%;	    	/* also seem to need a width defined */
	min-width:1000px;         /* 2 x (left columnfullwidth + center column padding) + right column fullwidth */
	min-height:675px;
	background-image: url(../graphics/back.gif);
	background-repeat: repeat-y;
	background-position: center;
	background-color: #252525;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #464646;
	/* line-height: 18px; */
	vertical-align: top;
	border:0px solid #ffffff;
}		

/* ---------->>> layout positioning styles: <<<--------------------------------------------------------------------*/
/* ------------  the following styles govern the position and style of the basic parts of the layout --------------*/	

#pageWrapper {
	position:absolute; /* positioning this as relative causes layout to shift offscreen in Safari */
	/* margin:0 auto; */ /* (sets auto-margins, thus centering this element in the containing div (firefox) */
	width:1000px; 
	height:auto; /* (1500px?) */
	top:0px;
	left:50%;
	margin-left:-500px; 		/* left and margin-left settings centers horizontally */
	border:0px solid #ffffcc;
}

#breadCrumbBar {	
	top:0px;
	/* height:30px; */
	background-color: #accde7;
	padding: 8px 0px 8px 20px;
	font-size: 11px;
	color: #003663;
	border-top-width: 1px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
}

#breadCrumbBar a {
	font-size: 11px;
	color: #003663;
	padding:0px 5px 0px 5px;
	text-decoration: none;
	font-weight: normal;
}

#breadCrumbBar a.on {
	font-weight:bold;
}

/*
#breadCrumbBar a:link, #breadCrumbBar a:visited {
	color: #003663;
}

#breadCrumbBar a:hover, #breadCrumbBar a:active {
	color: #003663;
}
*/

/* these are the sub-navigation links */
ul.subNavLinksLeft {
	position:relative;		/* position:relative; needed for ie 6 peakaboo bug */
	overflow:hidden;	
	width:180px;
	height:auto; 			/* height:20px */
	margin:0;
	padding-right:0px;  	/* each column already has 20px of margin right; space out just a touch more */
	list-style-type: none;
	text-indent:0px;	
	border:0px solid #000000;
}

ul.subNavLinksLeft li.header {	
	position:relative; 		/* position:relative; needed for ie 6 peakaboo bug */
	margin-left:0px;
	text-indent:0px;	
	padding-bottom: 10px;
	padding-left: 0px;	
	list-style-type: none;	
	background-image:none;
	border:0px solid #000000;
}

ul.subNavLinksLeft li.headerOn {	
	position:relative; 		/* position:relative; needed for ie 6 peakaboo bug */
	margin-left:0px;
	text-indent:0px;	
	padding-bottom: 10px;
	padding-left: 15px;	
	list-style-type: none;
	background-image: url(../graphics/interior/icon_arrow_closed.gif);
	background-repeat: no-repeat;
	background-position: left 4px;
}

ul.subNavLinksLeft li {	
	position:relative; 		/* position:relative; needed for ie 6 peakaboo bug */
	margin-left:1px;
	text-indent:0px;	
	padding-bottom: 5px;
	padding-left: 15px;	
	list-style-type: none;
	background-image:none;
	border:0px solid #000000;
}
	
ul.subNavLinksLeft li.on {
	background-image: url(../graphics/interior/icon_arrow_closed.gif);
	background-repeat: no-repeat;
	background-position: left 4px;
}

ul.subNavLinksLeft li.header a,  ul.subNavLinksLeft li.headerOn a {	
	font-weight:bold;
	font-size:14px;
	text-decoration: none;
}

ul.subNavLinksLeft li.on a {	
	font-weight:bold;
	font-size:12px;
	text-decoration: none;
}

ul.subNavLinksLeft li a {	
	font-weight:normal;
	font-size:12px;
	text-decoration: none;
}
	
ul.subNavLinksLeft li a:link, ul.subNavLinksLeft li a:visited {
	color: #003663;
}

ul.subNavLinksLeft li a:hover, ul.subNavLinksLeft li a:active {
	color: #3366CC;
}

/* styles for news teaser content (president's page: news headlines and photos) */
#newsTeasers {
	top:0px;
	width:700px;
	height:auto;
	border:0px #999999 solid;
}

#newsTeasers .column {
	width:auto;
	margin-right:35px;
	border:0px solid #000000;
}

#newsTeasers .newsImg {
	width:auto;
	height:auto;
	margin:0px 0px 15px 0px;
	border:0px #999999 solid;
}

#newsTeasers .newsText {
	font-weight:normal;
	font-size:12px;	
	line-height:16px;
	width:210px;	
	border:0px #999999 solid;
}

#newsTeasers a.newsTitle {
	font-weight:bold;
	font-size:14px;	
	line-height:24px;
	text-decoration:none;
	border:0px #999999 solid;
}

a.newsTitle:link, a.newsTitle:visited {
	color: #464646;
}

a.newsTitle:hover, a.newsTitle:active {
	 color: #003663;
}

div.rule hr { 			
	/* take out the hr element; its top/bottom margin properties are completely
	different in ff and ie. (it will display for non-css browsers.) */
	display:none;
}

/* this div wraps around and replaces the hr. */
div.rule { 				
	color: #ffffff;
	background-color: #ffffff;
	background-image: url(../graphics/interior/sep.gif);
	background-repeat: repeat-x;
	background-position: center;
	width:auto;
	height:3px;
	margin:20px 0px 20px 0px;
} 

/* added 091309 for photos */

.photoLeft, .photoRight, .photo-left, .photo-right {
	width: 60%;	
	height:auto;
	overflow:auto;
	padding:10px;
	color: #999999;
	border:1px solid #d2d2d2;
	margin: 5px 0 15px;
}
/* if you want to position the photo on left side of page, use this class */
.photoLeft, .photo-left {
	float: left;
	margin-right: 25px;
}
/* if you want to position the photo on right side of page, use this class
*/
.photoRight, .photo-right {
	float: right;
	margin-left: 25px;
}

.photo-vertical {
	width: 40%;
}
/* a hack to keep the width steady in HAITI package
*/
.photoRight2 {
	float:right;
	width:265px;	
	height:auto;
	overflow:auto;
	margin:5px 0px 15px 25px;
	padding:10px;
	color: #999999;
	text-align:center;
	border:1px solid #7D7D7D;
}


.captionspace {
	float:right;
	width:auto;	
	height:auto;
	overflow:auto;
	margin:5px 0px 15px 25px;
	padding:10px;
	color: #999999;
	text-align:center;
}

/* if a border around the photo is desired, change the border width (0px)
and color (#accde7) as desired */
img.photo {
	border:0px solid #accde7;
	/* border:3px solid #accde7; */
}
/* end photos */

/* Videopow addition, by Jason Rhodes on 9/20/2011 */
.videopow img {
	width: 450px;
	height: auto;
}
.videopow {
	margin: 15px 0;
}
.align-right {
	margin-left: 20px;
	float: right;
	text-align: right;
}
.align-left {
	margin-right: 20px;
	float: left;
	text-align: left;
}
.no-wrap {
	float: none;
	display: block;
}
.big-image { margin-right: 0; }
.big-image img {
	width: 100%;
}
