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;
 height:55px;
}

/* 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;
}


/* Display people pictures */

.bubble {
 border-bottom: dotted 1px lightgray;
}
div.people-pic {
 Xdisplay: none;
}
img.people-pic {
 height:70px;
 width:70px;
}

.tip {
 font-size: smaller;
 text-align: justify;
 Xline-height: 1.25em;
 Xdisplay: none;
 width: 300px;
}


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

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


/* Progress markers for wiki articles */

li.done {
 color: green;
 %color: darkgreen;
}

li.half {
 color: orange;
}

li.todo {
 color: red;
}

.resources {
  border: 1px solid gray;
  margin-top: 2ex;
  margin-left: -1ex;
  padding: 0.5ex 0 1ex 1ex;
  background-color: lightyellow;
}

.caption-resources:before {
  content: "Other resources:";
}
.caption-concepts:before {
  content: "Concepts:";
}
.caption-further:before {
  content: "Further readings:";
}
.caption-exercises:before {
  content: "Exercises:";
}
ul.lecture-material-other {
  list-style-type: none;
  padding: 0 0 1.5ex 0;
}

ul.lecture-material-other > li {
  float:left;
  margin: 0 1em;
}

a.video {
  background-color: white;
  border: 1px solid darkgray;
  border-radius: 1ex;
  padding: 0 0.5em;
  text-decoration: none;
 }

a.code {
  font-family: courier, monotype;
}
a.lab {
  background-color: #E0EBEB;
  padding: 0 0.5em;
  text-decoration: none;
 }