@charset "utf-8";
/* CSS Document */


/********************************************************************************************************
	@aboutLink = "https://cim.saddleback.edu/~fbenach0/"
	@author = "F. Benach"
	@rollOver = "F. Benach Home Page"
	@CreationDate = 10/10/2009

	This is the CSS file for CIM272A's Final Project.
	The images for the project were obtained from Wikipedia Commons as copyright free and edited in
	Photoshop.  The images are from Michelangelo's paintings in the Sistine Chapel.
********************************************************************************************************/


/* The import statement on the next line caused too many problems, so it was commented out */
/* @import url("browserReset.css"); */

body {
	background-color: #000;
	font-family:"Times New Roman", Times, serif;
	font-size: 76%;
	width: 95%;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	background-image: url(__Adam.png);
	background-attachment: fixed;
	background-position: 7em top;
	background-repeat: no-repeat;
	z-index: 5;/*	border: thick solid #0F0;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

header, div#pageHeader, div#navLocal {
	float: left;
	width: 11em;
	overflow: hidden;
	position: fixed;
	z-index: 15;
	left: 4%;
	display: list-item;
}

header, div#pageHeader {
	font-size: 1.2em;	/* Font-size required separately here because #navLocal gets its font-size via #pageBody	*/
	height: 34%;
	top: 9em;
}

div#navLocal {
	height: 35%;
	top: 20.5em;
/*	border: medium dashed #00F;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

a.utilityLink, a.globalLink, a.localLink {
	/*	background-color: #723538;*/
	width: 9em;
	display: block;
	color: #F7DCC1;
	padding-right: .5em;
	padding-left: .5em;
	border: thin solid transparent;
	background-attachment: scroll;
	background-image: url(_navButton.png);
	background-repeat: no-repeat;
	background-position: center top;
/*	border: thin dashed #00F;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

a {
	text-decoration: none;
	color: #9e9cb8;
}

a:hover {
	color: #F7DCC1;
	text-decoration:blink;
	background-color: transparent;
	background-attachment: scroll;
	background-image: url(_hoverBgRptr.png);
	background-repeat: repeat-x;
	background-position: left center;
}

header, div#pageHeader a:hover, div#navLocal a:hover, body#assignment a.localLink#localAssignment, body#index a.localLink#localIndex, body#schedule a.localLink#localSchedule, body#project a.localLink#localProject, body#syllabus a.localLink#localSyllabus{
	color: #723538;
	border: thin solid transparent;
	background-color: transparent;
	background-attachment: scroll;
	background-image: url(_navButton.png);
	background-repeat: no-repeat;
	background-position: center bottom;
}

div#pageName {
	color: transparent;
	visibility: visible;
	background-attachment: scroll;
	background-image: url(__Creator.png);
	background-repeat: no-repeat;
	background-position: left top;
	z-index: -15;
	height: 190px;
	position: relative;
	left: 10%;
/*	border: thin solid #FF0*/;	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

div#pageBody {
	font-size: 1.2em;
	background-image: url(_Wings.png);
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: center bottom;
	width: 45em;
	position: relative;
	left: 25.5%;
	right: auto;
	padding-bottom: 4em;
	margin-bottom: 3em;	
/*	border: medium dashed #0F0;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

div#pageContent {
	margin-bottom: 2em;
/*	border: thick solid #00F;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

table {
	border-collapse:separate;
	background-color: transparent;
	color:#000;
	margin: auto;
/*	border: medium outset #F7DCC1;*/	/* Better without this table border */
}

/* Below section does not work - it gets placed in the first cell and expands it */
/*table:before {		
	content:url(assets/_storyHeaderBg.png);
}
*/

/*  Too much irregularity in the placement of the following with different sized tables, so commented out */
/*table:before {
	content: url(assets/_tableTop.png);
	position:relative;
	left: 19em	;
	margin:auto;
}
*/

/* Following made layout too busy and unbalanced - commented out */
/*table:after {
	content: url(assets/_tableBottom.png);
	position:relative;
	left: 20em	;
	margin:auto;
}
*/

table a {
	color: #6a66b3;	/* Darker shade of blue necessary to stand out against light table background */
}

table a:hover {
	color: #F7DCC1;
	text-decoration:blink;
	background-color: transparent;
	background-attachment: scroll;
	background-image: url(_hoverBgRptr.png);
	background-repeat: repeat-x;
	background-position: left center;

}

tbody {	/*  Could use this section as a wrapper of tables in following files: assignment, index, schedule.  Could use to add shadows or images to borders of tables.  But here, it would make layout too busy.  */
}

td, th {
/*  Below sets properties for all table cells */
	color: #000;
	border: medium inset #F7DCC1;
	padding: .5em;
}

.feature {
	color: #F7DCC1;
	font-size: 1.2em;	/*  This is 1.2em OVER the 1.2em already set by #pageBody	*/
	background-color: transparent;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;

	text-align: center;
	vertical-align: middle;
	padding-left: -0em;
	padding-top: 0em;
}

.feature a {
	color: #9e9cb8;	/* "feature" is against dark background, so lighter font color needed here */
}

.feature  a:hover {
	color: #723538;
	text-decoration:blink;
	background-color: transparent;
	background-attachment: scroll;
	background-image: url(_hoverBgH3RptrLight.png);
	background-repeat: repeat-x;
	background-position: left center;
}

/* Below code hides unnecessary links since they are already on the navBar at the left side of the page */
.feature #localAssignment,  .feature #remoteClassDetail,  .feature #localIndex,  .feature #localProject,  .feature #localSample,  .feature #localSchedule,  .feature #localSyllabus,  .feature #localTest {
	visibility: hidden;
	z-index:-50;
	position: fixed;
	left: 0px;
	top: 0px;
}

h3 {
	font-size: 1.2em;	/*  This is 1.2em OVER the 1.2em already set by #pageBody	*/
	color: #F7DCC1;
	background-color: transparent;
	text-align: center;
/*	border: medium dotted #0FF;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

div.storyHeader {
	font-size: 1.4em;
	color: #F7DCC1;
	font-style: normal;
	font-weight: bold;
	font-variant: small-caps;
	margin-top: 2em;
	padding-left: 1.5em;
	text-align: left;
	background-image: url(_storyHeaderBg.png);
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: left top;
/*	border: medium solid #F0F;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

div.storyHeader a {
	color: #9e9cb8;	/* Lighter color needed to include here because storyHeader's are against dark background.  Otherwise, some storyHeader's inside tables will inherit darker color from table setting */
}

div.storyHeader a:hover {
	color: #723538;
	text-decoration:blink;
	background-color: transparent;
	background-attachment: scroll;
	background-image: url(_hoverBgHeaderRptrLight.png);
	background-repeat: repeat-x;
	background-position: left center;
}

div.storyBody {
	color: #F7DCC1;
	margin-bottom: 2em;
	padding-right: 3.5em;
	padding-left: 3.5em;
/*	border: medium dashed #F0F;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}


div.storyBody:first-letter {
	font-size: 2em;
	color: #F7DCC1;
	background-repeat: no-repeat;
}

div.storyBody a {
	color: #9e9cb8;
}

div.storyBody a:hover {
	color: #F7DCC1;
	text-decoration:blink;
	background-color: transparent;
	background-attachment: scroll;
	background-image: url(_hoverBgRptr.png);
	background-repeat: repeat-x;
	background-position: left center;
}

div.storyBody:after {
	content:url(_storyAfter.png);	
	margin-left:32%;
	position:relative;
	bottom: -.5em;	
/*	border: thick dashed #FF0;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

footer, div#pageFooter {
	width: 60em;
	position: relative;
	left: 21.5%;
	right: auto;
	bottom: 0%;
	font-size: 1em;
	font-variant: small-caps;
	margin-top: 0.5em;
	overflow: hidden;
	text-align: center;
	color: #F7DCC1;
	background-image: url(_footerBg.png);
	background-attachment: scroll;
	background-repeat: no-repeat;
	background-position: center top;
}

footer, div#pageFooter a {
	font-weight: bold;
}

footer, div#pageFooter a:hover {
	color: #F7DCC1;
	text-decoration:blink;
	background-color: #723538;
}

#assignment #pageBody #pageContent table tbody h3 {
	color: #723538;	/* Need darker color because h3 here is against light background of table */
}

/* Needs to be here or will inherit transparent background from parent table */
#assignment #pageBody #pageContent table tbody td, th {
	background-color: #F7DCC1;
}
#assignment #pageBody #pageContent table tbody th {
	padding: 0em;	/* Looks better without padding */
}

/* Following needs repeating here or will inherit properties of parent table */
#assignment #pageBody #pageContent table tbody tr .feature {
	color: #F7DCC1;
	font-size: 1.2em;
	background-color: transparent;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	padding-top: 1em;
}

#index div.storyBody {
	margin: 0em;	/* Needed to offset the effect of the table cells doubling the margins */

}

#index #pageBody #pageContent table tbody td{
	background-color: transparent;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}

#index #pageBody #pageContent table tbody tr #book a:hover {
	background-image: none;		/*  This must be here, or it will inherit a background */
}

#index #pageBody #pageContent table tbody tr #book {
	text-align: right;
}

#index #pageBody #pageContent #indexTable tbody tr .storyLeft .storyBody:after {
	content:url(_storyAfter-half.png);	
	margin-bottom: -2em;
}

#index #pageBody #pageContent #indexTable tbody tr .storyRight .storyBody:after {
	content:url(_storyAfter-half.png);	
	margin-bottom: -2em;
}

/* Following needed here again or will inherit properties from parent table */
#schedule #pageBody #pageContent table tbody td, th {
	background-color: #F7DCC1;
}

/* Following needed here again or will inherit properties from parent table */
#schedule #pageBody #pageContent table tbody tr .feature {
	background-color: transparent;
}

/* Following required, otherwise divider line too far to the right */
#syllabus #pageBody #pageContent #courseDescription .storyBody:after {
	content:url(assets/_storyAfter.png);	
	margin-left:22%;
	position:relative;
	bottom: -1.5em;	
/*	border: thick dashed #FF0;	*//* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

/* Following needed or will inherit transparent background from syllabusHeader */
#syllabus #pageBody #pageContent table tbody td, th {
	background-color: #F7DCC1;
/*	background-color: red;*/	/* For Testing Layout only - COMMENT OUT PRIOR TO DEPLOYMENT */
}

/* Following item needs to be formatted individually because it is a repeat of an item in the navBar */
#syllabus #pageBody #pageContent #syllabusHeader #syllabusHeaderTable tbody tr .number a {
	color: #6a66b3;
}
#syllabus #pageBody #pageContent #syllabusHeader #syllabusHeaderTable tbody tr .number a:hover {
	color: #F7DCC1;
	background-color: #723538;
}