@charset "utf-8";
/* 
Created By Nathan Toye
on 11-1-07 
	--------------------Contents-------------------------
Please Note:  Any conditional Formatting that changes global settings
or only applies to a specific div is listed immediately after the
Div ID definition. If that formatting only applies to a particular page
(like the homepage), it will be in section 7.  The standard way of
triggering specific page formatting is by giving the body tag an ID.
	1. Global White Space Reset (helps make all browsers act the same)
	2. Global Settings and General Classes
	3. Page Layout Divs with ID
	4. Navigation - Divs and Classes (Main Left Hand Menu)
	5. Navigation 2 -  Divs and Classes (Quick Right Hand Links)
	7. Page Specific Formatting, Dynamic Classes(.js applied) and Special Divs (Each individually Described)

classes reserved for .js identifiers:
.lat, .lng, .highlight, .mapBubble, .stripyTable, .search, .cascading, .segmentCheckbox
classes reserved for other .css files (and the associated .js):
.collapsed, .expanded, .accordion, .accordionContent
.footnote, .asc, .dsc
*/
/*  ---------------Global White Space Reset---------------- */
* {
	margin: 0px;
	padding: 0px;
	font-family: Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6, p, pre, blockquote, label, ul, ol, dl, fieldset, select, address, table{
	margin: .5em 2%;
}
li, dd {
	margin-left: 2%;
}
fieldset {
	padding: .5em;
}
/* -----------------Global Settings----------------------- */
body {
	font-size: 62.5%;
	background-color: #fafafa;
	background-image: url(../images/diagonalLinesGrayFade.png);
	background-repeat: repeat-x;
}
table {
	font-size: 1.2em;
}
h1 {
	font-size: 1.8em;
	color: #012A6F;
}
h2 {
	font-size: 1.5em;
	color: #012A6F;
}
h3 {
	font-size: 1.4em;
	color: #012A6F;
}
h4 {
	font-size: 1.3em;
	color: #012A6F;
}
h5 {
	font-size: 1.2em;
	color: #012A6F;
}
h6 {
	font-size: 1.1em;
	color: #012A6F;
}

p {
	font-size: 1.2em;
}
blockquote {
	margin-right: 35px;
	margin-left: 35px;
}
label {
  display: block;
}
fieldset label {
  display: inline;
}
fieldset select {
  margin: 0 1em 0 0.5em;
}
.left {
	float:left;
}
.padRight {
	padding-right: 1.5em;
}
.marginRight {
	margin-right: 1em;
}
.right {
	float: right;
}
.rightImage {
	float: right;
	padding-left: 1.5em;
	padding-bottom: 1.5em;
}
.leftImage {
	float: left;
	padding-right: 2em;
	padding-bottom: 1.5em;
}
.clearAll {
	clear: both
}
.wide40 {
	width: 40%;
}
.wide45 {
	width: 45%;
}
.wide50 {
	width: 50%;
}
.wide60 {
	width: 60%;
}

/* use hidden to temporarily hide things (javaScript may be used to add/remove this class).
neverShow is for things never intended to be displayed */
.hidden, .neverShow {
	display: none;
}
.highlightBlue {
	color: #012A6F;
	font-weight: bolder;
}
.highlightGreen {
	color: #5CAE1B;
}
.highlightRed {
	color: #E62E1F;
}
.heavy {
	font-size:1.2em;
}
.center {
	text-align:center;
}
/* when you want text to look like a link; use js to give it action */
.blueLink {
	color: #0000FF;
	text-decoration: underline;
	cursor: pointer;
}
.rightText {
	text-align: right;
}
/* these boxes have no defined shape, they are good for calling attention to blocks of text */
.boxBlue {
	border-width: 2px;
	border-style: solid;
	border-color: #OA1C6F;
	background-color: #A5B5FF;
}
.boxGrey {
	border-width: 2px;
	border-style: solid;
	border-color: #999999;
	background-color: #EBEDFE;
}
.boxGreen {
	border-width: 2px;
	border-style: solid;
	border-color: #73A150;
	background-color: #A2E371;
}
.boxYellow {
	border-width: 2px;
	border-style: solid;
	border-color: #FFCC33;
	background-color: #FFDC73;
}
.boxSilver {
	border-width: 2px;
	border-style: solid;
	border-color: #999999;
	background-color: #ada59d;
}
/* -----------------------Page Layout Divs with ID------------------- */
#wrapper {
	width: 800px;
	margin-right: auto;
	margin-left: auto;
	position: relative;
}
#leftShadow {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 14px;
	height: 587px;
	background-image: url(../images/leftShadow.png) !important;
	background-repeat: no-repeat;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/leftShadow.png'); 
	background: none;
}	
#rightShadow {
	position: absolute;
	left: 786px;
	top: 0px;
	width: 14px;
	height: 587px;
	background-image: url(../images/rightShadow.png) !important;
	background-repeat: no-repeat;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/rightShadow.png');
	background: none;
}
#container {
	width: 772px;
	left: 14px;
	position: absolute;
	top: 0px;
	background-color: #ffffff;
	min-height: 100%;
}
#banner {
	height: 100px;
	background-image: url(../images/header2interior.jpg);
	background-repeat: no-repeat;
	width: 772px;
}
#story {
	width: 617px;
	background-color: #ffffff;
	font-size: 1.1em;
	padding-right: 5px;
	float: right;
/*	padding-left: 145px; */
}
#story ul {
	margin-top: 0px;
	margin-right: 15px;
	margin-bottom: 0px;
	margin-left: 15px;
}
#sideBar {
	font-size: 0.9em;
	border-width: 2px;
	border-style: solid;
	border-color: #999999;
	background-color: #EBEDFE;
	float: right;
	width: 160px;
}
#footer {
	clear: both;
	font-size: 0.9em;  
}
#quicklinks {
	font-size: 1.2em;
	color:#000000;
}
#footnote {
	text-align:justify;
	font-size: .8em;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #999999;
}
#key {
	width: 140px;
	float:left;
	clear: left;
	font-size: 1.2em;
	padding-left: 5px;
	color:#000000;
}
div#key a {
	color: #0000FF;
	text-decoration: underline;
	cursor: pointer;
}
div#key ul {
	  list-style-type: none;
}
div#key .noline a:hover {
	color: inherit;
	text-decoration: none;
}
div#key .noline a:visited {
	color: inherit;
	text-decoration:none;
}
div#key .noline a:active {
	color: inherit;
	text-decoration:none;
}
div#key .noline a:link {
	color: inherit;
	text-decoration:none;
}

/* -------------------------Navigation - Divs and Classes------------------------- */
#nav {
/*	height: 500px; */
	width: 140px;
/*	position: absolute;  This block removed to test the new layout
	z-index: 1;
	left: 0px;
	top: 100px; */
	list-style-type: none;
	color: #FFFFFF;
	padding-left: 5px;
	float: left;
	clear: left;
}
#nav a {
	color: #FFFFFF;
	text-decoration: none;
}
.nav {
	background-repeat: no-repeat;
	cursor: pointer;
	margin-bottom: 1px;
	margin-top: 1px;
	margin-right: 2px;
	font-size: 12px !important;
}
.navMain {
	width: 129px;
	height: 34px;
	cursor: pointer;
	margin-left: 2px;
	padding-left: 4px;
	padding-top: 4px;
}
.navSub {
	width: 118px;
	height: 21px;
	margin-left: 14px;
	padding-left: 3px;
	padding-top: 3px;
}
.buttonMain {
	background-image: url(../images/buttonMain.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonMain.png');
	background: none;
}
.buttonMainFocus {
	background-image: url(../images/buttonMainFocus.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonMainFocus.png');
	background: none;
}
.buttonMainCurrent {
	background-image: url(../images/buttonMainCurrent.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonMainCurrent.png');
	background: none;
}
.buttonMainCurrentFocus {
	background-image: url(../images/buttonMainCurrentFocus.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonMainCurrentFocus.png');
	background: none;
}
.buttonSub {
	background-image: url(../images/buttonSub.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonSub.png');
	background: none;
}
.buttonSubFocus {
	background-image: url(../images/buttonSubFocus.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonSubFocus.png');
	background: none;
}
.buttonSubCurrent {
	background-image: url(../images/buttonSubCurrent.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonSubCurrent.png');
	background: none;
}
.buttonSubCurrentFocus {
	background-image: url(../images/buttonSubCurrentFocus.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/buttonSubCurrentFocus.png');
	background: none;
}
/* ------------------------------ Navigation 2 ------------------------ */
#nav2 {
	height: 26px;
	font-size: 13px !important;
/*	color: #E62E1F; */
	text-align: center;
	float: right;
/*	background-image: url(../images/lowerRightBannerNav.gif);
	background-repeat: no-repeat; */
	position: relative;
	top: -10px;
	width: 610px;
	padding-right: 0px;
	background-position: right;
	clear: right;
}
#nav2 .nav {
	margin-right: 0px;
}
#nav2 .navSub {
	width: 73px;
	height: 21px;
	margin-left: 0px;
	padding-left: 0px;
	padding-top: 3px;
	background: no-repeat;
/*	padding-top: 3px; */
}
#nav2 a {
	color: #000000;
	cursor: pointer;
	font-weight: bolder; 
	text-decoration: none;
}
#nav2 .buttonSubCurrent {
	background-image: url(../images/nav2buttonOff73x24.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/nav2buttonOff73x24.png');
	background: none;
}
#nav2 .buttonSubCurrentFocus {
	background-image: url(../images/nav2buttonFocus73x24.png) !important;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=scale src='images/nav2buttonFocus73x24.png');
	background: none;
}
/* --Page Specific Formatting, Dynamic Classes(.js applied) and Special Divs-- */
/* ------------------------------------------------------------------------- */
/* Adjusts the HomePage for a larger banner */
body#home div#banner {	
	height: 200px;
	background-image: url(../images/header1main.jpg);
} 
/* controls the layout of the UCC staff page contactus.cfm */
.staffContainer {
	padding-left: 10px;
}
.staffBox {
	border-width: 2px;
	border-style: solid;
	border-color: #FFFFFF;
	width: 196px;
	height: 120px;
	float: left;
}
.eventText {
	width: 470px;
	float: right;
}
#events .eventImage {
	padding-left: 1em;
	width: 130px;
	float: left;
}
#events p {
	text-align: justify;
}
.divider {
	background-image: url(../images/divider_thin420x5.png);
	background-position: center;
	background-repeat:no-repeat;
	height: 10px;
	clear: both;
}