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

body {
 position: relative;
 font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
 font-size: 90%;
 background-color:#FAFFFF;
 width:800px;
 padding: 10px;
 text-align: justify;
 margin: 0 auto;
}
@media screen { body { padding-top:70px; } }

/* Styles for course name and logo */

div.top {
 top:8px;
 width:820px;
 opacity: 0.9; filter: alpha(opacity=90);
 margin: 0px -10px;
}
@media screen { div.top {position: fixed; } }

.title {
  width:820px;
  background-color:#10A0A0;
  margin: 0px;
  padding: 5px 0 5px 0;
  text-align: center;
  font-size: 1.55em;
  font-weight: bold;
  color: GOLD;
}

.courseName {
  vertical-align: middle;
  width: 625px; 
  padding: 0;
}
td.cmuqlogo {
 text-align: right;
}
img.cmuqlogo {
 padding-right: 5px;
 border:none;
 vertical-align: middle;
}

/* Styles for top level menus */

ul.menu {
  list-style-type: none;
  margin: 1px;
  padding: 0px;
}
li.menu {
  float:left;
}
a.menu {
  display:block;
  background-color: TEAL;
  color:YELLOW;
  font-size: 1.2em;
  font-weight: bold;
  padding: 2px 20px;
  border-right: 1px solid #FAFFFF;
  text-decoration:none;
}
a.menu:hover {
 color: GOLD;
 background-color: darkslategrey;
}

/* Styles for sections, etc. */

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

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

h2 {
 font-size: 1.2em;
}

h3 {
 font-size: 1.0em;
}

p, table, tr, td, ul, li {
 font-size: 1em;
}

/* Styles for toggler */

@media print {
 .toggleon-mark, .toggleoff-mark {
   display: none;
 }
}

.toggleon-mark, .toggleoff-mark {
 color: gray;
 margin: 0ex 0em 0ex 0.3em;
 padding: 0ex 0.2em;
 text-align: right;
}

.toggleon-mark:hover, .toggleoff-mark:hover,
.toggleon-mark:active, .toggleoff-mark:active {
 color: black;
}


/* Buttons to toggle descriptions and details on and off in scheduler */
#buttons {
  position: absolute;
  right: 2px;
  top: 101px;
  text-align: right;
}
#summary-button, #details-button, #recitation-button {
  color: red;
}
@media print {
  #buttons { display: none; }
}

#copyright:before {
  content: "\00A9"; /* copyright symbol */
  padding-right: 0.2em;
}