lecturer/includes/index.css

/* NavBar */
div#nav {
  font-size: 0.8em;
  float: right; 
  margin-top: 74px;  
}

div#nav ul {
  margin: 0; 
  padding: 0;   
}

div#nav li {
  position: relative; 
  list-style: none; 
  margin: 0 10px;
  padding: 0;
  float: left; 
  line-height: 1em; 
  text-align: center; 
}

div#nav li:hover {  
  border-bottom: 2px solid #F00; 
}

div#nav li a {
  display: block; 
  padding: 0.25em 0;
  text-decoration: none;   
}

div#nav>ul a {
  width: auto;
}

/* Main */
body {
  margin: 10px;
  font-family: "Verdana";
  color: #000;
}

div.subtitle, div.notifications {
  border-bottom: 1px solid #DEDEDE;
  margin-right: 10px;
  font-size: 1.5em;
}

div.notifications {
  text-align: center;
  color: #F00;
}

a {
  color: #00F;
  text-decoration: none;
}

a:hover {
  border-bottom: 3px solid #F00;  
}

a.subject:hover {
  border-bottom: 0;
}

div.header, div.header-class {
  width: 100%;
  height: 100px;
  float: left;
  margin: 0;
  vertical-align: middle;
  background: #BBD9EE url("../images/background.jpg") 0 0 no-repeat;
  font-size: 20px;
  color: #F00;  
}

div.header-class {
  background: #BBD9EE url("../images/background-repeat.jpg") 0 0 repeat-x;  
}

div.content {
  margin: 0 200px 0 0;
}

div.intro {
  width: 75%; 
  border: 0px solid #F00;  
}

div.quotes {
  float: right;
  border: 3px solid #ab801a;
  border-left: 0;
  border-right: 0;
  margin-top: 5px;
  padding: 2px 0;
  width: 20%;
  margin-right: 10px;
  text-align: right;
  font-family: "Verdana, Georgia, Arial";
  font-size: 0.9em;
}

div.date {
  position: absolute;
  right: 20px;
  top: 15px;
  color: #000;
  font-size: 15px;
}

div.sidebar {
  float: right;
  width: 200px;
  margin: 5px 0 0 0;
}

div.subjects, div.news {
  margin: 0 10px 0 0;  
  border-top: 0;
}

div.news {
  margin-top: 4em;
}

div.subjects h1, div.news h1 {
  border-bottom: 1px solid #999;
  text-align: center;
}

div.subjects img {
  margin: 10px 10px 10px 0;
  border: 0;
}

div.update-title {
  text-align: center;
  font-weight: bold;
  
}

p.even {
  background: #E0EECF;
  padding: 2px;
}

p.odd {
  background: #fdddaa;
  padding: 2px;
}

span.subjectTitle {
  float: left;
  font-size: 1.5em;
  color: #000;  
  margin-left: 0;
  margin-top: 65px;
}

div.footer {
  height:10px;
  border-top:1px solid #B1B1B1;
  margin-right: 1em;
  text-align:center;
  font-family:"Verdana, Sans-Serif";
  font-size:0.8em;
  font-weight:normal;
  padding:5px;
}

/* 
CSS Text Boxes
Copyright : MikeCherim.com (http://green-beast.com/)
*/

body > #class-information {
  margin : auto;
  float: right;
}

div#class-information {
  float:right;
}
/*
  Now I'm resetting the paragraph padding (it was zeroed). I'm also clearing
  the p, but I don't really need this for the top one, only the bottom. The 
  top has no effect (it'll clear the heading by default), but it is needed 
  for the bottom (depending on the shell width versus the ul width). It may 
  not be needed at all. Your situation will determine.
*/
#class-information p {
  padding : 0px;
  clear : both;
}

/*
  I define the width of the ul, set the height (in ems!) align the text and
  remove list styles. The last may not be needed on most browsers
*/
ul.cinfo {
  height : 9em;
  text-align : center;
  list-style-type : none;
}

/*
  Now I style the individual boxes (li)
*/
ul.cinfo li {
  margin : 0 2px 10px;
  border : 1px solid #666;
  width : 160px;
  height : auto;
  background : #f6f6ff;
  float : left; 
  display : block;
}

/*
  Style the li links
*/
#class-information a {
  color : #A01300;
}

#class-information a:hover, #class-information a:focus, #class-information a:active {
  text-decoration : none;
  color: #FFF;
  background-color: #A01300;
}

#class-information a:focus, #class-information a:active {
  color: #FFF;
  background-color: #A01300;
}

/*
  Style the h3 links
*/
#class-information ul.cinfo h3 {
  color : #FFF;
  display : block;
  width : 160px;
  padding : 2px 0;
  background : #5280bc; 
  border-bottom : 1px solid #666;
  text-decoration : none;
  margin: 0;
}

#class-information ul.cinfo h3 a:hover, #class-information ul.cinfo h3 a:focus, #class-information ul.cinfo h3 a:active {
  background : #957412;
  color : #fff;
}

/*
  This tyles the text p content within the li separately. The most important 
  thing here is to re-kill the padding and add the margin to create good gutters
*/
ul.cinfo p {
  font-size : 0.9em;
  padding : 0;
  margin : 10px;
}