body{ font: 13px/17px Verdana, Tahoma, Arial, sans-serif; margin: 0; padding: 0; }

a:link { color: blue; }
a:visited { color: magenta; }
a:hover { color: purple; }
a:active { color: red; }

h1{ color: #003399; font: 22px Verdana, Georgia, helvetica, "Times New Roman", serif;    margin: 6px 0 8px 0;  }
h2{ color: #993300; font: 200 18px "Comic Sans MS", Verdana, Georgia, helvetica, sans-serif;    margin: 35px 0 4px 0;  }
h2:hover { background-color: Aqua; }
h3{ color: #6600cc;  font: bolder 14px Verdana, Georgia, helvetica, "Times New Roman", serif;  margin: 10px 0 8px 0;  }
h4{ font-size: 14px; color: #330033; }
p { font-size: 13px;  margin: 15px 0 18px 0;  line-height: 17px;  }

ul { font-size: 13px; color: #0000aa; margin-top: -3px; }
li { font-size: 13px; line-height: 19px; list-style-type: disc; }

.bigul ul { font-size: 15px; }
.bigul li { font-size: 15px; line-height: 19px; list-style-type: disc;  margin: 14px 0px 0px 6px;    padding: 2px 2px 2px 6px;          }
.bigul li:hover { background-color: #FAFAD2; }

td { font-size: 13px; line-height: 17px; }

.def {   background: #F0FFF0; border: 1px solid #FFC070; padding: 0px 15px 0px 15px;  margin: 0 40px 0 40px;  }

/* General */
.tiny { color: #000000; font: 10px Verdana, Georgia, helvetica, "Times New Roman", serif; }
.larger { color: #000000; font: 15px/20px Verdana, Georgia, helvetica, "Times New Roman", serif; }
.large { color: #000000; font: bold 16px/21px Verdana, Georgia, helvetica, "Times New Roman", serif; }
.huge { font: bold 30px/40px Verdana, Tahoma, Arial, sans-serif; }
.MenuTop { color: Black; margin: 12px 0px 0px 0px; font: bold 14px Verdana, Georgia, helvetica, serif;  text-align: center;  }
.Menu { font-size: 12px; margin: 2px 0px 0px 9px; text-indent: -5px; }
.times { font: bold 150% "Times New Roman", serif; }


.hide { color: #FFF8DC; background-color: #FFF8DC;  border: 1px solid #FFD700; padding: 3px 15px 3px 15px; }
.hide:hover { color: #000000; background-color: #FFFFEE; border: 1px solid #FFF000; }

.clear table { border-collapse: collapse; }
.clear th { padding: 2px; font-size: 15px; line-height: 20px; font-weight: bold; text-align: left; }
.clear td { padding: 2px; font-size: 15px; line-height: 20px; }

.simple table { border-collapse: collapse; background: #FFDEFF; }
.simple th { border: solid 2px white; padding: 3px; background: #99bbee; }
.simple td { border: solid 2px white; padding: 3px; }

.beach table { border-collapse: collapse; background: #F0F0C0; }
.beach th { border: solid 2px white; padding: 3px; background: #99bbee; font: 15px "Comic Sans MS" sans-serif; }
.beach td { border: solid 2px white; padding: 3px; font-size: 13px; }

.formal table { border-collapse: collapse; background: #F0FFF0; }
.formal th { border: 1px solid #FFC070; padding: 9px; font-size: 15px; color: #003399; }
.formal td { border: 1px solid #FFC070; padding: 9px; font-size: 13px; }

.indent50px { margin-left: 50px; }
.center80 { margin-left: 10%; margin-right: 10%; }


img.in { vertical-align: middle; }

/* definitions */
.outdent { text-indent: -10px; margin-left: 10px; margin-bottom: 8px; }

/* sidebar */
.sidebar {
	border: 1px solid #aaaaaa;
	font-size: 90%;
	float: right;
	margin: 5px 0 5px 10px;
	clear: left;
	width: 30%;
	background: #f9f9f9;
	padding: 5px;
}
.sidebar h3 { background: #ffffaa; padding: 3px 5px 3px 5px; font-size: 100%;  margin: 0 0 -8px 0;  text-align: center;   }
.sidebar p, .sidebar td { font-size: 90%; padding: 0 5px 0 5px;    }

/* examples */
.example {   margin: 10px 0 8px 50px;  background: #d8d8ff;  padding: 3px;  }
.example p, .example ul, .example .head, .example h3, .example br, .example2 {   margin: -8px 0 0 -8px; background: #f0f0ff; }
.example p { padding: 4px 4px 12px 15px; }
.example ul { padding: 4px 4px 12px 45px; }
.example .head, .example h3 {   padding: 4px 4px 18px 15px; font: bolder larger;  }
.example br, .example2 {   padding: 4px 4px 8px 15px;  }

/* forms */
input, select, textarea { border: thin solid #B0B0B0; }
input:focus, select:focus, textarea:focus { border: thin solid #000; }

/* worksheets */
.smallitalic { font: 12px "Times New Roman", Times, serif; }
.largemono { font: 18px/22px "Courier New", Courier, monospace; }
.time { color: #000000; display: inline; font: bold 16px Verdana, serif; }
.number { color: #000000; display: inline; font: normal 19px Arial, Verdana, serif; }

/* representing fractions */
.frac sup, .frac sub { vertical-align: baseline; position: relative; font: 85% Verdana, Georgia, "Courier New", serif; }
.frac sup { top: -0.5em; left: 0.20em; }
.frac sub { top: 0.15em; left: -0.15em; }

.frac-large sup, .frac-large sub { vertical-align: baseline; position: relative; font: bold 125% Verdana, Georgia, "Courier New", serif; }
.frac-large sup { top: -0.4em; left: 0.20em; }
.frac-large sub { top: 0.20em; left: -0.05em; }

/* makes a <td></td> into a black line, useful for fractions */
.black td, td .black { padding: 0px; height: 1px; background: Black; }

/* create worksheets highlighting */
.graphic:hover img{ filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); -moz-opacity: 1; }
a.graphic img { border: 0px none; }
/* 70% opacity when hovering */
.graphic img, .graphic img, .hover70:hover img { filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); -moz-opacity: 0.7; }

/* nice buttons */
.button { border: 1px solid white; text-align: center; display: block; padding: 4px; }
.button:hover { border: 1px solid silver; }

/* related pages */
.rel-title { font-size: 15px; font-weight: bold; background: #FFDEFF; }
.related { font-weight: bold; font-size: 15px; margin-bottom: 1px; border-top: 4px solid #ffddff; clear: none; padding-top: 20px; margin-top: 10px; border-bottom-width: 4px; border-bottom-style: solid; border-bottom-color: #ffddff; padding-bottom: 9px; background: url(images/related-pages.jpg) no-repeat; }
.related a { display: list-item; margin-left: 220px; font-size: 13px; font-weight: normal; margin-top: 2px; list-style-type: circle; background: White; }