@media screen
  {
  body {padding-top: 50px;}
  div.top {position:fixed; }
  }

html { 
 background-image: url('../img/bg-geometric.gif');
 background-color: lightgray;
}

body {
 position: relative;
 font-family: "Comic Sans MS", cursive, sans-serif;
 font-size: 80%;
 background-color:#FFE7E7;
 width:780px; /* was 800 px */
 padding: 10px;
}


/* Styles for course name and logo */


div.top {
  XXposition:fixed;
  top:8px;
  width:800px;  /* was 808px */
  left:8px;
}

div.title {
  height: 50px;
  background-color:#FF5555;
  opacity: 0.6; filter: alpha(opacity=60);
  vertical-align: bottom;
  margin: 0px;
  text-align: center;
  font-size: 1.6em;
  font-weight: bold;
  color: GOLD;
}

.courseName {
  padding: 12px 0 0 0;
  float: left;
  width: 605px; /* was 625px */
}
div.cmuqlogo {
  padding-right: 5px;
  width: 173px;
  height: 50px;
  float: right;
}

img.cmuqlogo {
  border:none;
  opacity:1.0;filter:alpha(opacity=100);
}

/* Styles for top level menus */

ul.menu {
  list-style-type: none;
  margin: 0px;
  padding: 0px;
  width: 800px;
  background-color:#FF0000;
}
li.menu {
  float:left;
  height: 30px;
}
a.menu {
  padding: 3px 10px;
  border-right: 1px solid yellow;
  display:block;
  background-color:#FF0000;
  opacity:0.6;filter:alpha(opacity=60);
  color:YELLOW;
  font-size: 1.0em;
  font-weight: bold;
  text-decoration:none;
}
a.menu:hover {
  color: GOLD;
  background-color: DARKRED;
}

/* Styles for sections, etc. */

.shortcut {
  margin-left:40px;
  font-size: x-small;
  font-weight:normal;
  vertical-align:10%;
 }

h1 {
 margin-top: 60px;
 font-size: 1.5em;
}

h2 {
 font-size: 1.2em;
}

h3 {
 font-size: 1.1em;
}