.tooltip {
  font-weight:bold;
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted grey;
}

.tooltip .tooltiptext {
  visibility: hidden;
  font-size:0.8em;
  width: 300px;
  background-color: black;
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

body {background:#EEE; font-family: 'Sintony', Century Gothic, sans-serif; color:#000;}
a {text-decoration:none;}
p {margin:0px 0px 10px 0px; line-height:1.4em}
ul {list-style-type:square; margin:10px 0px 10px 0px;}
ul li, ol li {margin:6px 0px;}
div {padding:8px;}
div.container { width:900px; border:1px solid #CCC; margin:0 auto; background:#FFF; }
div.banner { background:url('images/zzlogo.png') 10px 10px no-repeat #333333;color:#FFF; margin:10px; overflow:hidden; border: 1px solid #333333; padding:0;}
div.banner h1{ font-size:25pt; padding:5px; padding-left:100px; margin:0; color:FFF000}
div.topic_header { margin:15px 10px; color:#000; padding:0}	
div.topic_header a { text-decoration:none; color:#000000;}	
div.topic_header table td {vertical-align:top;}	
div.topic_header h1 { font-family: 'Sintony', Century Gothic, sans-serif; margin:0; padding:0px 5px; text-align:left; font-size:25pt; font-weight:normal;}	
div.quicklinks {border:1px solid #CCC; background: #DBEEF4; margin-bottom:15px;}
div.topic_info { overflow:auto; margin:10px 10px; font-size: 0.9em;}	
div.topic_info img{ max-width:100%;}	
div.topic_info  table{ font-size:1em; margin:10px 0px; border-collapse:collapse; border:1px solid #999;}	
div.topic_info  table td{ vertical-align:top; padding:6px; border:1px solid #999; }	
div.topic_info  table th{ vertical-align:top; padding:6px; background:#EEE; border:1px solid #999; text-align:left; font-size:1em;}	
div.topic_info h1 { font-family: 'Lobster', cursive; margin:20px 0px 10px 0px; font-size:22pt; color:#b00707; font-weight:normal; border-bottom:1px solid #444; text-decoration:none;}	
div.topic_info h2 { font-size:16pt; margin:10px 0px 6px 0px; color:#990000;}	
img {border: solid 1px black; width:max-100%; margin:10 0}
div.topic_summary { float:right; width:35%; background:#DDD; border:1px solid #BBB; margin:10px; border-radius:15px;}	
div.activity { overflow:auto; background:#dbeef4; margin:20px 0px; padding:4px 20px; border-radius:10px;}	
div.activity  table{ width:100%; margin:10px 0px; border-collapse:collapse;border:1px solid #999; }	
div.activity  table td{ vertical-align:top; padding:5px; background:#FFF; border:1px solid #999; }	
div.activity  table th{ vertical-align:top; padding:5px; color: #FFF; background:#000; border:1px solid #999; }	
div.activity  table ol{ margin-bottom:15px; }	
div.activity  table ul{ margin-bottom:15px; }	
div.activity  table ol li{ margin:4px; }	
div.activity h1 { font-family: 'Sintony', Century Gothic, sans-serif; margin:15px 0px 0px 0px; font-size:16pt; color:#444; font-weight:normal; border-bottom:none;}					
div.activity h2 { font-size:12pt; margin:0px 40% 0px 0px; }	
div.textbox	{background:#EEE; margin:5px 20px 20px 20px; border:2px solid;}
div.textbox	p {margin:0px;}
div.topic_examples { background-image:url('images/examples.png'); overflow:auto; margin:20px 10px; font-size:10pt; color: #FFF;}	
div.topic_examples h1 { font-family: 'Lobster', cursive; margin:0px 0px 10px 0px; font-size:20pt; color:#FFF; font-weight:normal; }					
div.topic_examples h2 { font-size:12pt; margin:0px 40% 0px 0px; }	
div.writing_frame {border:1px dotted #000; margin:20px 0px; font-family: Georgia, serif; font-size:11pt;}
div.writing_frame ol {margin:4px 0px 12px 0px;}
div.writing_frame ol li{margin:3px;}
div.writing_frame h1 {margin:0; font-size:12pt; font-weight:bold; border:0; font-family: Georgia, serif; }
table.tasks th { text-align:left; padding-top:15px;}	
table.example { font-family: 'Sintony', Century Gothic, sans-serif; border:none; font-size:11pt; margin:5 auto;}	
table.example td { border:1px solid #FFF; text-align:center; width:275px; }	
div.topic_info table.overview { border-collapse:collapse;}
div.topic_info table.overview td { vertical-align:middle; border:none;}
div.description {border-radius:10px; border:1px solid black;}
div.word {border-radius:15px; padding:10px; background:#000; color: #FFF; font-size:1.4em; border:1px solid black; text-align:center;}
div.flowchart {border-radius:8px; box-shadow:2px -2px 0px #666; border:1px solid black;}
div.flowchart-container {margin:30px;text-align:center;}
table.tasks { font-family: 'Sintony', Century Gothic, sans-serif; width:100%; border:none; font-size:11pt;}	
div.topic_info table.specTable { border:1px solid black; margin:10px 0px; width:100%}
div.topic_info table.specTable th { border:1px solid black; background-color:#2A5F70; color:#FFF; text-align:left; font-size:1em;}
div.topic_info table.specTable td {vertical-align:top; border:none; padding:5px;}
div.topic_info table.specTable td ul { margin:0; font-weight:bold;}
div.topic_info table.specTable td ul li { margin:4px;}
div.topic_info table.specTable td.quote {font-style:italic;}
div.context {background:maroon; color:#FFF; margin-bottom:10px;border-radius:12px}
div.context h3 {font-size:1.05em; margin:0 0 5 0;}
div.video {background-color:#dbeef4; border:1px black dashed; font-size:1.1em; display:inline-block; padding:4px 0px 0px 0px; margin:10px 0px;}
p.caption {font-style:italic; margin:5px; font-size:0.9em;}
hr {color:#efefef;}
a.pdflink {float:right; margin-top:15px;}
a.posterlink {float:right; margin-top:10px;}
a.studentlink {float:right; font-size:18pt; margin:10px 15px 0px 0px;}
div.example {border-radius:10px; border:1px solid #000; padding:0px 6px; margin:15px 0px; box-shadow: -2px 2px 2px #888;}
div.example  table {border:none; color:#000;}
div.example  table td {border:none;}
div.case-study h1 {font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:13pt; font-weight:bold; color:#fff; padding:0px 5px; margin:0; border:1px solid #0070c0; background:#0070c0;}
fieldset p { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:10pt; margin:7px;}
fieldset li { font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif; font-size:10pt; }
fieldset { border:1px solid #0070c0; background:#ffffcc;}
fieldset legend { margin-left:8px;}
textarea{margin:0 0 6 0; padding:4px 8px; font-family: "Arial"; font-size:1.1em; width:100%; background:lightyellow; }
textarea.python {color:white; font-family: "Courier New"; background:black}


	
#nav { float: left; width: 100%; margin: 0auto; margin-bottom:0; padding: 0px 4px; list-style: none; background: #ececec; border-top:1px solid #FFFFFF}	
#nav li { float: left; display: block; padding: 0px 10px 0px 2px; text-decoration: none; font-weight: bold; font-size: 0.9em; color: #000; background: #ececec url(images/nav_slant.gif) no-repeat top right;}
#nav li.end { background: none;}
#nav a { float: left; display: block; padding: 0px 6px 0px 0px; text-decoration: none; font-weight: bold; font-size: 100%; color: #666;  }	
#nav #nav-1 a { padding-left: 10px;}	
#nav a:hover { color: #000; }	
#nav a.selected { color: darkred; }	
ul#more { clear: left; margin-top: 60px;}	
ul#more { clear: left; margin-top: 60px;}


@media print {
  
  fieldset, div.case-study h1 {background:#FFF; color:#000;border:1px solid #000; }
  body {background:#FFF; margin:0;}
  div.banner { background:none; color:#000; margin:0px; overflow:hidden; border:none; padding:0;}
  div.banner h1{ font-size:10pt; padding:10px; margin:0;}
  div.container { border:none; width:650px; }
  
  img {max-width:100%;}
  div.quicklinks { display:none; }  
  #nav {display:none;}
  div.topic_header  { padding:0;}	  
  div.topic_header  table{ background-color:white !important;}	  
  div.activity { overflow:auto; background:#FFF; border:1px solid #000; margin:20px 0px; padding:4px 20px; font-size:10pt; border-radius:0px;}	
  a.pdflink, a.posterlink {display:none;}
  p.no_print {display:none;}	
  
  


  }