#pageContent a, #pageFooter a {color: #f0f0f0;}
#pageContent a:hover, #pageFooter a:hover {color: #82e016;}
#pageContent a:visited, #pageFooter a:visited  {color: #555;}

em {
   display: block;
   padding: 6px 10%;
   font-size: smaller;
}

p { margin: 1em 0; }

ul, ol  { margin-bottom: 10px; }
ul li, ol li {
padding: 5px 10px;
margin: 0 20px;
margin-top: 10px;
border-bottom: 1px dotted #444;
border-top: 1px dotted #444;
}

ul li+li, ol li+li { border-top: none; margin-top: 0; }



/*-------------------------------------------  assignment ----------------------------------------------*/
#assignment{}

#assignment table{
border-spacing: 0 20px;
}
/*hide table headers ( #, description, due date ) */
#assignment th{
display: none;
visibility: hidden;
}

#assignment td p{
border-bottom: 1px dotted #404040;
padding: 6px 0;
}

#assignment .story {
color: #8bcc29;
font-family: Georgia;
font-size: 1.4em;
font-weight: normal;
font-style: normal;
text-transform: capitalize;  
text-align: center;
letter-spacing: 0px;
padding-bottom: 20px;
}

#assignment td.number {
background: url(images/number.png) no-repeat left 10px;
font-family: Georgia;
font-size: 16px;
color: #000;
width: 30px;
text-align: center;
vertical-align: top;
text-transform:lowercase;
padding: 14px 0;
}
#assignment td.number:hover {
background: url(images/number-hover.png) no-repeat left 10px;
color:  #7dd815;
}

/*to keep bg pic from showing in empty cell, cannot use empty-cell property because
 these empty cell contains &nbsp which is not considered empty
 */
#assignment #a2+#a3 .number {
background: none;
}

#assignment .description {
background: #2c2c2c;
padding: 20px;
border: 1px solid #484848;
color: #aaa;
font-size: 1.1em;
line-height: 1.5em;
letter-spacing: 0.1em;
border-right:none;
}

#assignment .date {
font-family: Georgia;
font-size: 20px;
line-height: 20px;
text-align: center;
vertical-align: top;
padding: 10px 10px 18px 10px;;
background: #383838;
color: #8bcc29;
border: 1px solid #484848;
border-left:none;
}

#assignment .date:first-line {
font-family: "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;	
text-transform: lowercase;
font-size:10px;
font-style: italic;
letter-spacing: 0;
color: #686868;
}
#assignment .feature{
padding: 0px 0px 0px 42px;
color: #000;
font-size: 1em;
letter-spacing: 0em;
line-height: 1.2em;
border-bottom: none;
}

#assignment .feature:before, #assignment .feature:after {
content: "\25aa\25aa\25aa ";
color: #6aa611;
font-style: normal;
}

/*-------------------------------------------  index ----------------------------------------------*/
#index{}

/*hide link set*/

td.feature a.localLink{
display: none;
visibility: hidden;
}

#index table{
border-collapse: separate;
border-spacing: 4px 16px;
font-size: 1em;
letter-spacing: 0.1em;
line-height: 1.6em;
color: #999;
}

#index .feature{
text-align: left;
color: #000;
font-family: "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
font-size: 1em;
font-style: normal;
vertical-align:middle;
padding: 0px 10px 20px 10px;
}

#index .feature h3{
color: #8bcc29;
font-family: Georgia;
font-size: 1.4em;
font-weight: normal;
font-style: normal;
text-transform: capitalize;  
text-align: center;
letter-spacing: 0px;
margin-bottom: -24px;
}

#index #book {
vertical-align: bottom;
text-align: right;
}

#index #book img{
width: 180px;
height:180px;
border: 1px solid #484848;
background: #2c2c2c;
}

#index .story{
background: transparent;
padding: 0;
}
#index .storyLeft {
height: 100%;
padding: 0;
vertical-align: top;
}

#index .storyHeader {
background: #262626;
padding: 6px 10px;
color: #aaa;
font-size: 1.1em;
letter-spacing: 0.2em;
font-weight: normal;
text-transform: lowercase;
text-align: center;;
font-family: Georgia;
font-style: italic;
border: 1px solid #484848;
border-bottom: none;
}

#index .storyHeader:hover{
background: #162603;
border-bottom: none;
color: #8bd916;
}

#index .storyBody {
background: #2c2c2c;
border: 1px solid #484848;
padding: 20px;
text-align: left;
font-size: 1.1em;
}

#index .storyBody:first-letter{
font-size: 2em;
font-family: Georgia;
display:block;
float:left;
}

#index .storyLeft .storyBody,  #index .storyRight .storyBody {
   height: 10em;
   vertical-align: middle;
}


/*-------------------------------------------  project ----------------------------------------------*/
#project{}

#project .storyHeader {
background: #262626;
padding: 6px 10px;
color: #aaa;
font-size: 1.1em;
letter-spacing: 0.2em;
font-weight: normal;
text-transform: lowercase;
text-align: center;;
font-family: Georgia;
font-style: italic;
border: 1px solid #484848;
border-bottom: none;
}

#project .storyHeader:hover{
background: #162603;
border-bottom: none;
color: #8bd916;
}

#project .storyBody {
background: #2c2c2c;
border: 1px solid #484848;
padding: 20px;
text-align: left;
clear: left;
font-size: 1.1em;
letter-spacing: 0.1em;
line-height: 1.6em;
color: #999;
}

#project .storyBody:first-letter{
font-size: 2em;
font-family: Georgia;
display:block;
float:left;
}

/*-------------------------------------------  syllabus ----------------------------------------------*/
#syllabus{}

#syllabusHeaderTable, #syllabus .story{
margin: 20px 0;
}

#syllabus h3{
color: #8bcc29;
font-family: Georgia;
font-size: 1.4em;
font-weight: normal;
font-style: normal;
text-transform: capitalize;
text-align: center;
padding-bottom: 10px;
letter-spacing: 0px;
margin-top: 20px;
}

/* lines (<p>) 2-4 get different style than top line
* all have the same markup other than the 1st <p> does not come after a <p> */

#syllabus h3+h3, #syllabus h4 {
letter-spacing: 1px;
color: #999;
font-family: "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
font-size: 1.2em;
text-transform: uppercase;
font-style: normal;
padding-bottom: 4px;
text-align: center;
margin-top: 0;
}
#syllabus h4{
   color: #000;
   font-size: 1.1em;
   margin-bottom: 16px;
}

#syllabusHeaderTable  {
   width: 100%;
   background: #2c2c2c;
   border: 1px solid #484848;
   padding: 10px;
   text-transform: lowercase;
   font-size: 10.5px;
   text-align: center;
   vertical-align: top;
}

#syllabusHeaderTable .number, #syllabusHeaderTable .number a,
#syllabusHeaderTable .number a:visited{
   color: #000;
   text-align: right;
   padding: 10px 4px;
}

#syllabusHeaderTable .description, #syllabusHeaderTable .description a,
#syllabusHeaderTable .description a:visited {
   color: #aaa;
   padding: 10px 8px;
}
#syllabusHeaderTable a{
text-decoration:underline;
}

#syllabus .storyHeader {
background: #262626;
padding: 6px 10px;
color: #aaa;
font-size: 1.1em;
letter-spacing: 0.2em;
font-weight: normal;
text-transform: lowercase;
text-align: center;
font-family: Georgia;
font-style: italic;
border: 1px solid #484848;
border-bottom: none;
}

#syllabus .storyHeader:hover{
background: #162603;
border-bottom: none;
color: #8bd916;
}


#syllabus .storyBody {
background: #2c2c2c;
border: 1px solid #484848;
padding: 20px;
text-align: left;
clear: left;
font-size: 1.1em;
letter-spacing: 0.1em;
line-height: 1.6em;
color: #999;
}

#syllabus .storyBody:first-letter{
font-size: 2em;
font-family: Georgia;
display:block;
float:left;
}

#syllabusGradingTable{
   width: 75%;
   margin: 10px auto;
   color: #000;
   border: 1px dotted #000;
}
#syllabusGradingTable td{
   padding: 0 10px;
   vertical-align: top;
   text-align: right;
}

/*-------------------------------------------  schedule ----------------------------------------------*/
#schedule{}

#schedule table{
border-collapse: separate;
border-spacing: 0px 15px;
}

/*hide table headers ( #, description, due date ) */

#schedule th  {
display: none;
visibility: hidden;
}

#schedule .feature p{
color: #8bcc29;
font-family: Georgia;
font-size: 1.4em;
font-weight: normal;
font-style: normal;
text-transform: capitalize;
text-align: center;
padding-bottom: 10px;
letter-spacing: 0px;
}

/* lines (<p>) 2-4 get different style than top line
* all have the same markup other than the 1st <p> does not come after a <p>
*/

#schedule .feature p+p {
letter-spacing: .1em;
color: #999;
font-family: "Lucida Sans Unicode", Arial, Helvetica, Sans-Serif;
font-size: 1.2em;
font-style: normal;
padding-bottom: 4px;
text-align: center;
}

#schedule td.number {
background: url(images/number.png) no-repeat left 10px;
font-family: Georgia;
font-size: 16px;
color: #000;
width: 30px;
text-align: center;
vertical-align: top;
padding: 14px 0;
}

#schedule td.number:before {
content:"w";
}

#schedule td.number:hover {
background: url(images/number-hover.png) no-repeat left 10px;
color:#7dd815;
}

#schedule .description {
background: #2c2c2c;
border: 1px solid #484848;
padding: 20px;
color: #aaa;
font-size: 1.1em;
line-height: 1.5em;
letter-spacing: 0.1em;
border-right:none;
}

#schedule .date {
background: #2c2c2c;
border: 1px solid #484848;
border-left:none;
}