/* CSS Document */

/*

  @aboutLink="https://cim.saddleback.edu/~djacob9/about_dpj.html"
  @author="Daryl Jacob"
  @rollOver="https://cim.saddleback.edu/~djacob9/index.html"
  @CreationDate="9/10/12";
  This is the CIM272 FINAL PROJECT
  The Model is Brooklyn Decker.  This photo was taken from SPORTS ILLUSTRATED.  The image is used here for educational purposes and not for profit.
  
  The most difficult thing about this design was getting the links to line up along the vertical edge of the page content.  You will note different code for IE.  If you like IE, try rotating some text and positioning it and you will likely change your opinion of IE.   
*/

/* ---------- roll over properties ------ */
a.globalLink:hover, a.utilityLink:hover, a.localLink:hover {
	background-repeat: no-repeat;
	background-position: right;
	background-color:#000000; }
	
a:link {
	color:#2A3FAA;
	text-shadow: -1px -1px 0px #CCCCCC, 1px  1px  0  #000000;
    }
 
a:hover {
	color: white; text-shadow: 0.1em 0.1em 0.6em #000000;  
    } 
	
/* highlight current tab */	
body#index a#localIndex,
body#assignment a#localAssignment,
body#project a#localProject,
body#schedule a#localSchedule,
body#syllabus a#localSyllabus,
body#tabs a#localTabs,
body#sample a#localSample,
body#assignment a#assignmentAdvanced
 {
	color:#FFFFFF;
	background-color:#f75959;}	

/* --- Vertical Links --- */
a.globalLink, a.utilityLink {
	background-color: #1A82F7;
	color: #FFFFFF;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px;
    border-width: thin;
    font-family: Verdana,Geneva,sans-serif;
    font-size: 14px;
    line-height: 20px;
    padding-left: 8px;
    padding-right: 8px;
    text-align: center;
    border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: solid;
	border-top-color: #000;
	border-right-color: #000;
	border-bottom-color: #000;
	border-left-color: #000;
	background-color: #1a82f7;
	z-index: 20;
	margin-right:4px;
	margin-right:4px;
}
a.localLink {
	font-family: Verdana,Geneva,sans-serif;
	font-size:14px;
	line-height: 20px;
	text-align: center;
	color:#FFFFFF;
	padding-left:8px;
	padding-right:8px;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: none;
	border-left-style: solid;
	border-top-color: #000;
	border-right-color: #000;
	border-bottom-color: #000;
	border-left-color: #000;
	background-color: #1a82f7;
	border-top-left-radius:15px;
	border-top-right-radius:15px;
	z-index: 20;
	}

	


/* #syllabus is the page body id */

body {
	/*border: medium dotted #lime;*/
	max-width: 1400px;
	min-width: 1000px;
	color: #FFFFFF;
	width: auto;
	margin-left: auto;
	margin-right: auto;
	background-image:url(BrooklynDecker.png);
	background-repeat: no-repeat;
	background-position: 0px top;
	background-color: #000000;
	font-family: Verdana,Geneva,sans-serif;
	font-size: 18px;
	background-attachment: fixed;
	}




	
h4, h3.feature{
	line-height: 0em;
	text-align:center;
	color: white;}

#index #pageBody #pageContent table#indexTable tbody tr td#book span.storyBody a img,
#index #pageBody #pageContent #syllabusHeaderTable tr .number p a img,
#index #pageBody #pageContent #syllabusHeaderTable tr .description p a img { 
    margin-top: 5px;
	margin-right: 12px;
	margin-bottom: 0px;
	margin-left: 12px; 
	border-radius:7px;
	box-shadow:-1px 1px 40px #000000;  }



#pageBody  {
	width:auto;
	max-width:1400px;
	padding-left:275px;
	padding-right:25px;
	margin-right:auto;
	margin-left:auto;
	}
	
body.cim225#assignment #pageContent  {
	margin-left: 197px;
	padding: 10px;
}
	
#pageContent {
	width: auto;
	min-width: 850px;
	min-height:900px;
	margin-left: auto;
	margin-right: auto;
	margin-top: -1px;
	background-color: #FFFFFF;
	color: black;
	padding-top: 5px;
	padding-right: 5px;
	padding-bottom: 0px;
	padding-left: 0px;
	border-top-left-radius:30px;
    border-top-right-radius:30px;
	border-bottom-left-radius:30px;
    border-bottom-right-radius:30px;
	/* fallback   */
	background-color: #1a82f7;
	background-repeat: repeat-x;
	/* Safari 4-5, Chrome 1-9 */
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#1a82f7), to(white));
	/* Safari 5.1, Chrome 10+ */
	background: -webkit-linear-gradient(top, #1a82f7, white);
	/* Firefox 3.6+ */
	background: -moz-linear-gradient(top, #1a82f7, white);
   	/* Opera 11.10+ */
	background: -o-linear-gradient(top, #1a82f7, white);
	border: thin solid #000000;
	box-shadow:-1px 1px 60px #000000;
}

#pageName{
	color: white;
	font-size: 1.5em;
	text-align: center;
	width: 700px;
	padding-top: 5px;
	text-align: center;
	color: #FFFFFF;
	margin-left: auto;
	margin-right: auto;
	visibility:hidden;
	}



/* ------------ IE ONLY CODE TO GET VERTICAL LINKS POSITIONED --------------*/

.ie #navUtility{
	position:absolute;
	right: 36px;
	text-align: right;
	-ms-transform:rotate(180deg);
	height: 500px;
	width: 450px; }

.ie #navGlobal {
	top: -70px;
	position:absolute;
	right: 92px;
	-ms-transform: rotate(180deg);
	}

.ie #pageContent {
	position:absolute;
	width:auto;
	min-width: 850px;
	min-height: 900px;
	margin-left: auto;
	margin-top: -1px;
	color: #000000;
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
	background-repeat: repeat-x;
	border: thin solid #000000;
	box-shadow: -1px 1px 60px #000000;}
	
	
/* ------------ IE ONLY CODE TO GET VERTICAL LINKS POSITIONED --------------*/

body.cim225#assignment #pageHeader {left: -320px;
}

#pageHeader {/*border:thin dotted green;*/
	top: 735px;
	left: -244px;
	position: relative;
	float: left;
	text-align: center;
	/* use width to adjust left/right position of vertical links */
	height: 35px;
	width: 1035px;
	writing-mode: tb-rl;
	-moz-transform: scale(1) rotate(270deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-webkit-transform: scale(1) rotate(270deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	-o-transform: scale(1) rotate(270deg) translateX(0px) translateY(0px) skewX(0deg) skewY(0deg);
	white-space: nowrap;
	clear: both;
}

/* Horozontal links at top of content div */
#navLocal {/*border:thin dotted yellow;*/
	margin-top: 110px;
	width: 765px;
	text-align: center;	}   
	 
/* Links at top half of vertical tabs on left edge of content div */
#navUtility  {/*border:medium dotted white;*/
	position: absolute;
	right: 18px;
		}
	
/* Links at bottom half of vertical tabs on left edge of content div */	
#navGlobal  {
	position:absolute;
	right:319px;
	}		
	
/* --- Horozantal Links --- */
#navLocal a.localLink {
	display: inline-block;
	margin-right: 2px;
	margin-left:2px;
	}

.storyHeader {
	font-size: 150%;
	text-align: center;
	color: #006;
	line-height: 125%;
	width: auto;
	margin-top:20px;
	margin-right:20px;
	margin-left:20px;
	border-top-left-radius:15px;
	border-top-right-radius:15px;
	border: medium double #333333;
	background-color: #D8D8D8;
	box-shadow:-1px 1px 40px #000000;
	}
 
.storyBody, #storyBody  {
    border-bottom-left-radius:15px;
	border-bottom-right-radius:15px; 
	min-height: 60px;
	text-align:left;
	padding-bottom:15px;
	padding-top: 10px;
	padding-left:15px;
	padding-right:15px;
	margin-left:20px;
	margin-right:20px;
	border: thin solid #000000;
	box-shadow:-1px 1px 40px #000000;
	background-color: #FFFFFF;
	}
	

.storyBody:first-letter, #storyBody:first-letter {
	font-weight: bolder;
	}
 
#assignmentAdvancedTable tr .feature,	
#assignmentTable tr .feature  {
	font-size: 150%;
	text-align: center;
	color: #006;
	background-color:#F75959;
	line-height: 125%;
	width: auto;
	margin-top:20px;
	margin-right:20px;
	margin-left:20px;
	border-top-left-radius:15px;
	border-top-right-radius:15px;
	border: medium double #333333;
	background-color: #E4E4E4;
	}
	
#pageFooter {
	/*border: medium dotted tan;*/
	color: #1a82f7;
	text-align: center;
	width: 900px;
	margin-right: auto;
	margin-left: auto;
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 13em;
}

#localScheduleSyllabus {
	text-align: center;
}

tr .feature, tr #book, td.number, th.number {
	text-align: center;
}
	
#project #pageBody #pageContent #storyMain .storyHeader  
    {margin-top: 30px;
	margin-bottom: 0px;
    }

#schedule #pageBody #pageContent #scheduleTable {
	width: 75%;
	margin-right: auto;
	margin-left: auto;
	font-size: 14px;
	border: solid thin #000000;
	border-radius:15px;}

#schedule #pageBody #pageContent #scheduleTable tr {
	height:55px;
	}

#schedule #pageBody #pageContent #scheduleTable tr .feature {
	font-size: 2em;
}

#schedule #pageBody #pageContent {
	padding-top: 3em;
}
#syllabus #pageBody #pageContent #localScheduleSyllabus {
	margin-right: auto;
	margin-left: 14em;
	line-height:4em;
	font-size: 1.5em;
}
#syllabus #pageBody #pageContent {
	padding-top: 30px;
	padding-right: 30px;
	padding-bottom: 10px;
	padding-left: 30px;
}

#syllabus #pageBody #pageContent #syllabusHeader .feature {
	font-family: Verdana,Geneva,sans-serif;
	font-size: 1.5em;
	color: #000000;
	line-height: 1em;
	}


#syllabusHeaderTable {
	text-align:left;
	margin-left:auto;
	margin-right:auto;
	padding: 5px;
	border: medium double #333333;
	background-color: #E4E4E4;
    border-radius:15px;
	box-shadow:-1px 1px 40px #000000; 
	}


#assignment #pageBody #pageContent #assignmentTable td  {
	border: thin solid #000000;
	margin-top: 20px;
	margin-bottom: 20px;
	padding-top: 0px;
	padding-right: 24px;
	padding-bottom: 0px;
	padding-left: 24px;
}
#syllabusGradingTable,       {
	width: 33%;
	padding: 3px;
	margin-top: 15px;
	margin-right: auto;
	margin-bottom: 15px;
	margin-left: auto;
	border-radius:15px;
    border: thin solid #000000;
	box-shadow:-1px 1px 40px #000000;
	}

#assignment #pageBody #pageContent {
	padding-top: 30px;
	padding-right: 20px;
	padding-bottom: 30px;
	padding-left: 20px;
}

#assignment #pageBody #pageContent #assignmentTable tr td.description {
	background-color: #FFFFFF;box-shadow:-1px 1px 40px #000000;
}
#assignmentTable tr td.number, #assignmentTable tr td.date {
	background-color: #f75959; box-shadow:-1px 1px 40px #000000;
}

 
#schedule #pageBody #pageContent #scheduleTable tr .number, #schedule #pageBody #pageContent #scheduleTable tr .description  {
	padding-right: 5px;
	padding-left: 8px;
	font-size: 1.25em; 
	background-color:#f75959;
}

#schedule #pageBody #pageContent #scheduleTable {
	border: thin solid #000000;
	border-radius: 15px;
	padding-bottom:15px;
	padding-left:10px;
	padding-top:20px;
	box-shadow:-1px 1px 40px #000000;
}
#schedule #pageBody #pageContent {color:ffffff;}

#project #pageBody #pageContent {
	padding: 30px;
}

#index #pageBody #pageContent #indexTable a.localLink {
	display: none;
}
#index #pageBody #pageContent #indexTable tr .feature p {
	border: thin solid #000000;
	padding-top: 15px;
	padding-bottom: 15px;
	margin-right: 50px;
	margin-left: 0px;
	background-color: #FFFFFF;
	box-shadow:-1px 1px 40px #000000;
	border-radius: 15px;
}
#index #pageBody #pageContent #indexTable tr .feature h3 {
	font-size: 1.5em;
	color: #FFFFFF;box-shadow:-1px 1px 40px #000000;
	width:80%;
	margin-left:auto;
	margin-right:auto;
	border-radius: 15px;
}

#schedule #pageBody #pageContent #scheduleTable { 
    background-color: #FFFFFF; 
	box-shadow:-1px 1px 40px #000000; }

body.cimp7a#index #pageBody #pageContent #syllabusHeaderTable,
body.cimw260#index #pageBody #pageContent #syllabusHeaderTable {
	background-color: #FFFFFF;
    width: 98%;
	margin-bottom: 5px;
	margin-top: 5px; 
    box-shadow:-1px 1px 40px #000000; }


body.cimw260#project #pageContent .story .storyBody { 
    background-color: #FFFFFF;
    width:auto;
    margin-bottom: 5px;
	margin-top: 0px; 
	box-shadow:-1px 1px 40px #000000; }

body.cimw110a#schedule #pageBody #pageContent table,
body.cimw260#schedule #pageBody #pageContent table
{   padding-right: 10px;
    padding-left: 40px;
	padding-bottom: 20px;
	margin-top: -25px;}
   
body.cimw110a#schedule #pageBody #pageContent table td,
body.cimw260#schedule #pageBody #pageContent table td {  padding-right:12px;
	padding-left:12px;
	border: thin double #000000;
	border-radius:10px;
	box-shadow:-1px 1px 10px #000000;
	background-color: #FFFFFF;
    margin-right: auto;
	margin-left: auto;
	 }



body.cimw240#assignment #pageBody #pageContent #jQueryUIAccordion .storyBody { margin-top: -30px; }

body.cim225#assignment #pageContent #assignmentTable tr .description li {
margin-left: 30px;}

body.cim225#assignment #pageContent #assignmentTable tr .description p {
	padding-right: 25px;
	padding-left: 25px;
	}

body.cim225#assignment #pageContent #assignmentTable tr .description .feature { border-radius: 15px;}


body.cimw110a#schedule #pageBody #pageContent #scheduleTable { margin-top: 20px; }

body.cimw110a#schedule #pageBody #pageContent table {margin-top:17px; 
    margin-bottom: 15px;}

body.cimw110a#schedule #pageBody #pageContent #scheduleTable tr .description { background-color: #FFFFFF;
box-shadow:-1px 1px 20px #000000; }

body.cimw110a#schedule #pageBody #pageContent #scheduleTable tr th.description,
body.cimw110a#schedule #pageBody #pageContent #scheduleTable tr .number {
	background-color:#ffffff;
}

body.cimw110a#schedule #pageBody #pageContent { background-color:#D8CFBE; }
body.cimw110a#test #pageContent { padding-bottom: 15px; }

body.cimw260#index #pageBody #pageContent,
body.cimp7a#index #pageBody #pageContent {
	margin-right: auto;
	margin-bottom: auto;
	padding-top: 20px;
	padding-right: 15px;
	padding-bottom: 15px;
	padding-left: 15px;
}

body.cimw110a#schedule #pageBody #pageContent table { margin-right: 25px; }