/* ---------->>> 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, #outer_wrapper  {
	min-height: 100%;
	height: auto !important;
	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:800px;         /* 2 x (left columnfullwidth + center column padding) + right column fullwidth */
	text-align:center; 
	background-color:#043167;
	/* margin-top: 30px;
	margin-bottom: 30px; */ /* margin-bottom doesn't seem to work here, so create same effect with #bottomMargin */
	border:0px solid #ffffff;
}		

/* ---------->>> layout positioning styles: <<<--------------------------------------------------------------------*/
/* ------------  the following styles govern the position and style of the basic parts of the layout --------------*/	

#outer_wrapper {
	position:absolute; /* wrapper divs seem to need absolute positioning in order to force 100% height */
	width:951px;
	left: 50%; 
	margin-left:-475px; /* this centers horizontally for absolute positioning */
	background-image: url(../graphics/layout/back.gif);
	background-repeat: repeat-y;
	background-position: left top;
	background-color: #ffffff;
	border:0px double #CC0000;
}

#outer_wrapperIndex {
	position:absolute; /* wrapper divs seem to need absolute positioning in order to force 100% height */
	width:950px; 
	height:auto; /* really, this is 560px - this is height of inside content area plus padding = outer_wrapper */
	top:50%;
	left:50%;
	margin-top:-330px; /* SZT 06/0210: added facebook img: 658 height (whole contentIndex div) / 2 = margin-top */
	/* margin-top:-305px;  */ /* 560 height + (25*2) padding = 610 > take this number and half it for margin-top */
	margin-left:-500px; /* 950 width + (25*2) padding = 1000 > take this number and half it for margin-left */
	padding: 25px;
	border:1px solid #296DC0;
}

#topMargin {
	position:relative;
	top:0px;
	height:30px;
	width:100%; 
	background-color:#043167;
	border:0px solid #ffffff;
}

#header {
	position:relative;
	top:0px;
	background-color: #296DC0;
	width:951px;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFFFFF; 
}

#headerIndex {
	background-color: #ffffff;
	width: 921px;
	padding-top:15px;
	padding-left:15px;
	padding-right:15px;
}

/* the next two styles are solely used to define areas to turn off for display when printed */
/*
#manualNav {
	display:visible;
}
	
#mainNav {
	display:visible;
}
*/

/* container for left, center and right columns */
#content {
	position:relative;		
	padding-left:180px;      /* left column fullwidth */
	padding-right:262px;     /* right column fullwidth + center column padding */
	text-align:left;
	top:0px;
	left:0px;
	height:auto;
	overflow:auto;	
	min-height:300px; 		/* min-height is for short pages (contact us) where right image scrolls vertically in ff */
	margin-bottom:175px; 	/* build in some bottom-margin to equal height of the footer */ 
	border:0px #666666 solid;	
}

#content .column {
	position: relative;
	float: left;
}

#contentIndex {
	position:relative;		
	top:0px;
	width:921px;
	padding-bottom:15px;
	padding-left:15px;
	padding-right:15px;
	text-align:left;
	background-color:#ffffff;
	border:0px #ffcccc solid;	
}

/* center column */
#bodyTextArea {
	/* padding: 10px 20px;   */    /* center column padding */
	width: 100%;
}

/* this spaces the actual text away from the left and right columns */
#bodyText {
	padding-left: 35px;
	padding-right: 70px;
	border:0px #ffcccc solid;
}

/* left column */
#subNavArea {
	width: 180px;             /* left column width */
	/* padding: 0 10px; */    /* left column padding */
	right: 180px;             /* left column fullwidth + center column padding */
	margin-left: -510px;
	padding-top:50px;
	padding-left:20px;
}

/* right column */
#pageImgArea {
	width: 260px;             /* right column width */
	/* padding: 0 10px; */    /* right column padding */
	margin-right:-475px;
}

/* make sure to build in enough margin-bottom in the #content div to space this footer out;
otherwise, on long pages, the footer might overlap the text */
#footer {	
	clear: both;
	position:absolute;
	text-align:left;
	bottom:0px;
	/* margin-left:180px; */ /* IE 7 didn't like margin-left , so use left instead */
	left:0px;
	padding-top: 15px;
	padding-bottom: 0px;
	height:160px;
	width:951px;
	border:0px #333333 solid;	
}	

#footerIndex {
	position:absolute;
	right:0px; 
	bottom:-30px; /* use negative margin to make sure footer hangs below content area */
	color: #296DC0;
	border:0px solid #ffffff;
}

#facebookIndex {
	position:relative;
	top:10px;
	float:right;
	bottom:0px; /* use negative margin to make sure footer hangs below content area */
	width:144px;
	height:44px;
	color: #296DC0;
	border:0px solid #ffffff;
}

#bottomMargin {
	position:absolute;
	bottom:-5px;
	height:35px;
	width:101%;
	background-color:#043167;
	border:0px solid #ffffff;
}

.imgLarge {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
	width: 260px;
	text-align: right;
}

.imgSmall {
	vertical-align:top;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFFFFF;
	width: 70px;
	text-align: right;
}

/* center this div vertically and horizontally in the browser viewport (margin-left/top = half of width/height) */
/*
#popUpFlash  {
	z-index:10; 
	position: absolute;
	width: 990px;
	height: 630px;
	text-align: center;
	left: 50%;
	top: 50%;
	margin-left: -495px;
	margin-top: -315px;
	visibility:hidden;
	display:none;
}
*/

/* used for Home and Our Program pages, in which Flash movies are act as primary page content */
#mainFlashContent {
	width:922px;
	height:354px;
	border:0px #296DC0 solid;
}

#warningMsg {
	visibility:visible;
	position:relative;
	margin:0 auto;
	top: 140px;
	text-align:left;
	border:1px dotted #CC0000;
}

.noFlash {
	width:325px;
}

.noScript {
	width:300px;
}

p.msgText {
	color:#CC0000;
	padding:15px;
	background-color:#ffffff;
}

/* ---------->>> sub-menu positioning styles: <<<------------------------------------------------------------------*/
/* ------------  the following styles govern the position/style/layer order of dhtml sub-menus --------------------*/	

/* [currently none] */

/* #subNav {	
	position:relative;
	top:0px;
	left:0px;
	float:left;
	text-align:left;
	width:183px;
	height:auto;	
	border:2px solid #cccccc; 
} */

/* ---------->>> sub-nav styles: <<<-------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of the sub-navigation links in the left column -----------*/	

.navPrimary {
	font-size: 14px;
	font-weight: bold;
	background-image: url(../graphics/layout/icon_arrow_down.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 20px;
}

.navSecondary {
	font-size: 12px;
	background-image: none;
	padding-left: 20px;
}

.navSecondarySelect {
	font-size: 12px;
	background-image: url(../graphics/layout/icon_arrow.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 20px;
}

.navPrimary a, .navSecondary a, .navSecondarySelect a {
	text-decoration: none;
}
					
/* ---------->>> text styles: <<<----------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of text for paragraphs, bold text, etc. ------------------*/	

div {					
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px; 
}

p {	
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #666666;
	padding-left:1px;
	padding-bottom:15px; 
}	
											
.bold {					
	font-style:inherit;
	font-weight:bold; 
}
						
.italic {				
	font-weight:inherit; 
	font-style:italic;
}

h1 {
	font-size:14px;
	font-weight:bold;
	color: #296DC0;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #296DC0;
	margin-bottom:15px;
}

h2 {
	font-size: 12px;
	font-weight: bold;
	color: #333333;
	padding-bottom:15px;
}

h3 {
	font-size: 11px;
	font-weight: bold;
	color: #333333;
	padding-bottom:5px;
}

.detailText {			
	font-size: 11px; 
	color: #999999;
}						
						
.errorText {			
	font-size: 11px; 
	color: #cc0000;
}

															
/* regular link styles */
a:link, a:visited, a:active {
	color: #296DC0;
}

a:hover {
	color: #043167;
}

a.footer {
	text-decoration:none;
	font-weight:bold;
	padding:2px;
}

.footerIndex {
	text-align: right;
	padding-top: 15px;
	color: #296DC0;
}

.footerCopy {   	
	padding-left:210px;
	font-size: 11px;
	color: #999999;
	text-decoration:none;
}

div.footerCopy p {
	color: #999999;
	padding-top:15px; 
}

.alumniText {
	min-height:77px;
	overflow:visible;
	padding-bottom:10px;	
	border:0px solid #000000;
}

.alumniPhotoLeft {
	float:left;
	width:77px;
	height:77px;
	margin-right:10px;
	padding-bottom:0px;
	border:0px dashed #666666;
}

.alumniPhotoRight {
	float:right;
	width:77px;
	height:77px;
	margin-left:10px;
	padding-bottom:0px;
	border:0px dashed #666666;	
}

.tuitionText {
	position:relative;
	width:135px;
	padding-bottom:15px;
	color:#666666;
}
	
.tuitionFeeText {
	position:absolute;
	top:0px;
	right:0px;
	color:#666666;
}


/* ---------->>> news teaser styles: <<<----------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance and positioning of news teasers on index page -------------------*/	

/* *** DMS - moved out to separate, common file so we can use also to display/preview banners on admin page
	NOW are in common/utils/bannerstyles.css
 */
 

/* ---------->>> list styles: <<<----------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of ordered/unordered lists -------------------------------*/	

/* global white space reset forces us to style lists manually */
/*
ul {	
	list-style:square;
	list-style-position:outside;
	margin-left:0em;
	padding-left:3em;
	text-indent:0em;
	width:80%;
	padding-bottom:15px;
	color: #666666; 
}
						
ol {	
	list-style-position:outside;
	margin-left:0em;
	padding-left:3em;
	text-indent:0em;
	width:80%;
	padding-bottom:15px;
	color: #666666; 
}

li { 	
	padding-bottom:5px;
}
						
li.listHeader {
	list-style:none;
	margin-left:-3em;
	padding-left:0em;
	text-indent:0em;
	font-weight:bold;
}
	
li.listItem {
	font-weight:normal;
}
*/


ul {	
	position:relative; /* needed for ie 6 peakaboo bug */
	list-style-type: none;
	margin-left:10px;
	text-indent:0px;
	padding-bottom:15px;
	color: #666666;
}

li {	
	position:relative; /* needed for ie 6 peakaboo bug */
	background-image: url(../graphics/layout/icon_diamond.gif);
	background-repeat: no-repeat;
	background-position: 0 .4em;
	padding-left: 25px;
	padding-bottom: 15px;	
}

		
/* ---------->>> form element styles: <<<--------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of form fields, selects, etc. ----------------------------*/			
		
.formButton {			
	/* font-family: Arial, Helvetica, sans-serif; */
	font-size: 12px;
	font-weight: bold;
	background-color: #666666;
	color: #ffffff;
	border: 2px solid #999999;
	margin-bottom:5px;
}

.formText {				
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #000000;
	margin-bottom:5px;
}						
						
.popFormText {			
	font-size: 11px; 
	margin-bottom:5px;
}

/* ---------->>> table styles: <<<---------------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of formatted tables for charts, etc. ---------------------*/	

/* [currently none] */						
		
/* ---------->>> miscellaneous styles: <<<-------------------------------------------------------------------------*/
/* ------------  the following styles set the appearance of horizontal rules other misc stuff ---------------------*/
	
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;
}
			
div.ruleFooter 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: #296DC0;
	background-color: #296DC0;
	height: 1px;
	margin-top:5px;
	margin-bottom:15px;
} 

div.ruleFooter { 				
	color: #043167;
	background-color: #043167;
	width: 700px;
	height: 1px;
	margin-top:5px;
	margin-bottom:5px;
}