/* CSS Document */

html, body {
	text-align: left;
	vertical-align: top;
	margin: 0px;
	padding: 0px;
	min-height: 100% !important;
	height: 100% !important;
	width: 100%;
	border: 0px solid #00FF00;
	}
	
body {
	background: #3b3b3b url("images/bkg_body.png") repeat top left;
	position: relative;
	}

.offscreen { position: absolute; top: -500px; }

#container { /* This is an empty container so we can absolutely position elements over the main table */
	width: 780px;
	margin: 20px auto 0px auto; 
	padding: 0px 0px;
	
	border: 0px solid #00FF00; /* Change to 1px to see if things are behaving */
	position: relative;
	
	font: normal 12px Arial, Helvetica, sans-serif;
	color: #000;
	vertical-align: top;
	}
#container_table {
	width: 100%;
	}

h1 {
	font: bold 18px Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px 16px;
	}
h2 {
	font: bold 14px Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px 16px;
	}
h3 {
	font: bold 12px Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px 16px;
	}
h4 {
	font: bold 11px Arial, Helvetica, sans-serif;
	margin: 0px;
	padding: 0px 16px;
	}
p {
	margin: 0px;
	padding: 0px 0px 1em 0px;
	}
A:link {color: #999; text-decoration: underline;}
A:visited {color: #000; text-decoration: underline;}
A:hover {color: #000; text-decoration: underline;}
A:active {color: #CCC; text-decoration: underline;}

/**** MASTHEAD ****/

#masthead {
	height: 145px; /* Curved Height */
	padding: 0px;
	vertical-align: bottom;
	background:  url("images/bkg_masthead.png") no-repeat top left;
	}
	#masthead_position { width: 748px; height: 145px; margin: 0px 16px; position: relative; }
	#masthead .logo { position: absolute; top: 21px; left: 0px; }
	#masthead .foundation_logo { position: absolute; top: 34px; left: 445px; }
	#masthead .josh { position: absolute; left: 630px; }

/**** MENU ***/

#menu {
	position: absolute;
	top: 101px;
	left: 0px;
	height: 31px;
	padding: 0px;
	background:  url("images/bkg_menu.png") no-repeat top left;
	vertical-align: top;
	}

#menu_buytheplaybook, #menu_fundraising, #menu_contactus {
	display: block;
	height: 31px;
	background-image: url("images/menu.png");
	background-repeat: no-repeat;
	float: left;
	}

#menu_buytheplaybook { width: 159px; background-position: 0 0; }
#menu_buytheplaybook:hover, #page_buytheplaybook #menu_buytheplaybook { background-position: 0 0px; }
#menu_buytheplaybook span { display: none; }

#menu_fundraising { width: 102px; background-position: -159px 0; }
#menu_fundraising:hover, #page_fundraising #menu_fundraising { background-position: -159px 0px; }
#menu_fundraising span { display: none; }

#menu_contactus { width: 114px; background-position: -261px 0; }
#menu_contactus:hover, #page_contactus #menu_contactus { background-position: -261px 0px; }
#menu_contactus span { display: none; }

#content {
	width: 504px;
	background:  url("images/bkg_content.png") repeat-y top left;
	vertical-align: top;
	padding: 0px 0px 0px 16px;
	}
	.no_sidebar { width: 748px; background: url("images/bkg_full.png") repeat-y top left !important; }
	#content A:link { text-decoration: none; }
	#content A:visited { text-decoration: none; }
	#content A:hover { text-decoration: none; }
	#content A:active { text-decoration: none; }

#content h1 { /* By default this is an Overview or Record Title */
	background-color: #545454; 
	padding: 8px 16px;
	margin: 0px 0px 0px 12px;
	font-weight: bold;
	color: #FFF;
	}
	#content h1 A:link { color: #FFF; }
	#content h1 A:visited { color: #FFF; }
	#content h1 A:hover { color: #FFF; }
	#content h1 A:active { color: #FFF; }

#content .h1_full { /* Used if "show_sidebar" is set to "no" */
	margin: 0px 12px 0px 12px;
	}

#content .category_links { /* This is for a menu to "Jump To" a certain category in a List View. It is currently being used inside the H1 tag */
	font-size: 11px;
	font-weight: normal;
	padding: 8px 1px;
	color: #EEE;
	}
	#content .category_links A:link {color: #CCC; text-decoration: none;}
	#content .category_links A:visited {color: #CCC; text-decoration: none;}
	#content .category_links A:hover {color: #FFF; text-decoration: none;}
	#content .category_links A:active {color: #CCC; text-decoration: none;}
	
	#content .category_links .spacer { margin: 0px 2px; }

#content h2 { /* By default this is an Overview or Record SubTitle */
	padding: 10px 16px 0px 16px;
	margin: 0px 0px 0px 12px;
	}
	#content h2 A:link {  }
	#content h2 A:visited {  }
	#content h2 A:hover {  }
	#content h2 A:active {  }

#content .h2_full { /* Used if "show_sidebar" is set to "no" */
	margin: 0px 12px 0px 12px;
	}

#content .description { /* Currently used on Record pages ... Overviews are using .overview for the description area (why?) */
	padding: 13px 0px 16px 0px;
	}

#content .overview {
	margin: 0px 0px 0px 12px;
	padding: 14px 16px;
	font-size: 11px;
	}

#content .overview img {
	max-width: 464px !important;
	}

#content .photo_after_subtitle {
	margin-top: 7px;
	}

#content .overview_after_subtitle {
	padding-top: 7px;
	}

#content .author {
	font-size: 10px;
	color: #CCC;
	padding: 6px 16px 0px 16px;
	}

#content .date_inline {
	color: #000;
	font-weight: bold;
	}

/* PHOTO "BLOCK" FOR OVERVIEWS AND RECORDS */

#content .photo_frame {
	float: right;
	width: 226px;
	margin: 14px 16px 8px 28px;
	text-align: center;
	}
	
#content .photo { position: relative; }
#content .photo .enlarge {
	position: absolute;
	z-index: 99;
	bottom: 6px;
	right: 8px;
	width: 26px;
	height: 26px;
	}
#content .show_border {
	border: solid 1px #333 !important;
	}
#content .left {
	float: left;
	}
#content .photo_caption {
	border: 0px solid #00FF00;
	background: url();
	text-align: center;
	padding: 8px 10px;
	font-size: 11px;
	font-weight: normal;
	color: #999;
	}
#content .photo_frame .enlarge_text {
	font-size: 10px;
	}
	#content .photo_frame .enlarge_text A:link {color: #999; text-decoration: none;}
	#content .photo_frame .enlarge_text A:visited {color: #999; text-decoration: none;}
	#content .photo_frame .enlarge_text A:hover {color: #000; text-decoration: none;}
	#content .photo_frame .enlarge_text A:active {color: #999; text-decoration: none;}
#content .photo_frame .enlarge_icon {
	vertical-align: middle; 
	margin-left: 0px;
	}
#content .overview_photo { /* Size is controlled through the image uploader right now */
	border: solid 0px #999;
	}

/*** GRID VIEW ***/

#gridview { clear: both; margin: 0px 0px 12px 12px; overflow: visible; }
.grid_item { float: left; margin: 16px 0px 0px 16px; }
.grid_item .image_cell { width: 104px; height: 104px; text-align: center; vertical-align: middle; }
.grid_item .image_cell img { width: 104px; height: 104px; }
.grid_item .info_cell { padding: 4px; vertical-align: top; text-align: center; font-size: 10px; }

/*** SIDEBAR ***/

#sidebar {
	width: 244px;
	height: 300px;
	background:  url("images/bkg_sidebar.png") repeat-y top left;
	vertical-align: top;
	padding-right: 16px;
	}
	#sidebar A:link { color: #000; text-decoration: none; }
	#sidebar A:visited { color: #000; text-decoration: none; }
	#sidebar A:hover { color: #999; text-decoration: none; }
	#sidebar A:active { color: #000; text-decoration: none; }

#sidebar h2 { /* By default this is Sidebar Title */
	background: #373737 url("images/bkg_sidebar_h2_right.png") no-repeat top left; 
	padding: 8px 16px;
	margin: 0px 12px 0px 0px;
	font-size: 18px; 
	font-weight: bold;
	color: #FFF;
	}
	#sidebar h2 A:link { color: #FFF; }
	#sidebar h2 A:visited { color: #FFF; }
	#sidebar h2 A:hover { color: #FFF; }
	#sidebar h2 A:active { color: #FFF; }

#sidebar h3 { /* By default this is Sidebar SubTitle */
	font-size: 12px; 
	font-weight: bold;
	margin: 10px 12px 0px 0px;
	padding: 0px 16px;
	}
	#sidebar h3 A:link {  }
	#sidebar h3 A:visited {  }
	#sidebar h3 A:hover {  }
	#sidebar h3 A:active {  }

#sidebar .photo { position: relative; text-align: center; margin: 0px 12px 0px 0px; }
#sidebar .photo_edgeshadow { position: absolute; top: 0px; left: 0px; height: 100%; width: 9px; border: solid 0px #00FF00; z-index: 99; background:  url("images/bkg_sidebar_photoshadow_right.png") repeat-y top left; }

#sidebar .photo_caption {
	background: #656565 url("images/bkg_sidebar_caption_right.png") repeat-y top left;
	font-size: 11px;
	color: #666;
	text-align: center;
	font-weight: normal;
	padding: 6px 16px;
	margin: 0px 12px 0px 0px;
	}

#sidebar .overview { /* FCK content goes in here */
	margin: 0px 12px 0px 0px;
	padding: 0px 16px 16px 16px;
	font-size: 11px;
	}
	
#sidebar .overview h1, #sidebar .overview h2, #sidebar .overview h3, #sidebar .overview h4, #sidebar .overview h5, #sidebar .overview h6 { /* Resetting styles for FCK areas */
	padding: 0px;
	margin: 0px;
	background-color: transparent;
	background-image: url();
	color: #000;
	margin-top: 10px;
	}
	#sidebar .overview h1 { font-size: 18px; }
	#sidebar .overview h2 { font-size: 14px; }
	#sidebar .overview h3 { font-size: 12px; }
	#sidebar .overview h4 { font-size: 11px; }
	#sidebar .overview h5 { font-size: 10px; }
	#sidebar .overview h6 { font-size: 9px; }
	
#sidebar .overview p {
	margin: 0px;
	padding: 1em 0px 0px 0px;
	}

/* RECENT LIST */

#sidebar .recent_list {
	padding: 0px;
	margin: 13px 0px 9px 29px;
	}
#sidebar .recent_list li { color: #666; padding-bottom: 4px; font-size: 12px; }
	#sidebar .recent_list li A:link {color: #000; text-decoration: none;}
	#sidebar .recent_list li A:visited {color: #666; text-decoration: none;}
	#sidebar .recent_list li A:hover {color: #666; text-decoration: none;}
	#sidebar .recent_list li A:active {color: #000; text-decoration: none;}
	
#sidebar .viewall {
	padding: 0px 16px;
	margin-right: 12px;
	text-align: right;
	}
	#sidebar .viewall A:link { color: #000; text-decoration: none; }
	#sidebar .viewall A:visited { color: #000; text-decoration: none; }
	#sidebar .viewall A:hover { color: #666; text-decoration: none; }
	#sidebar .viewall A:active { color: #000; text-decoration: none; }
	
/**** FOOTER ****/
	
#footer {
	height: 76px;
	width: 100%;
	background:  url("images/bkg_footer.png") no-repeat top left;
	vertical-align: top;
	}
	#footer A:link { text-decoration: none; }
	#footer A:visited { text-decoration: none; }
	#footer A:hover { text-decoration: none; }
	#footer A:active { text-decoration: none; }
	
	#footer .navigation { font-size: 11px; font-weight: bold; color: #FFF; text-align: center; text-transform: uppercase; position: absolute; top: 20px; width: 100%; }
	#footer .navigation A:link { color: #FFF; }
	#footer .navigation A:visited { color: #FFF; }
	#footer .navigation A:hover { color: #858585; }
	#footer .navigation A:active { color: #FFF; }
	
	#footer .spacer { color: #858585; margin: 0px 7px; }
	
	#footer .logos { position: absolute; top: 46px; left: 28px; }
	
	#footer .copyright { font-size: 11px; color: #FFF; text-align: right; position: absolute; top: 43px; right: 24px; }
	#footer .copyright A:link { color: #FFF; }
	#footer .copyright A:visited { color: #FFF; }
	#footer .copyright A:hover { color: #858585; }
	#footer .copyright A:active { color: #FFF; }
	
	#footer .validation_logos { position: absolute; top: 81px; width: 100%; text-align: center; }
	#footer .validation_logos A:link {color: #FFF; }
	#footer .validation_logos A:visited {color: #FFF; }
	#footer .validation_logos A:hover {color: #858585; }
	#footer .validation_logos A:active {color: #FFF; }