﻿
body {background: white; background-image: url(slant.jpg); font-size: 10pt; font-family: Arial, Helvetica, sans-serif; color: black; margin: 5px}

a {white-space: nowrap}
a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:active {text-decoration: none; }
a:hover {text-decoration: underline; color: #777777;}

.border {border: 1px solid; border-color: #000099; border-collapse: collapse}
.noborder {border: 0px solid; border-collapse: collapse}
.nowrap {white-space: nowrap}
.red-italic {font-style: italic; color: #bb0000}

div.header {display: table; width: 100%; background-color: #7585dc; cursor: pointer; margin-top: 0px; margin-bottom: 2px;}
span.header-left {display: table-cell; width: 49%; background-color: #7585dc; font-weight: bold; font-style: italic; font-size: 12pt; color: white; cursor: pointer; padding: 1px; padding-left: 5px; padding-right: 5px;}
span.header-right {display: table-cell; width: 49%; background-color: #7585dc; text-align: right; font-size: 10pt; color: white; cursor: pointer; padding: 1px; padding-left: 5px; padding-right: 0px;}

div.header-large {font-size: 18pt; font-weight: bold; font-style: italic; text-align: center}
div.header-medium {font-size: 11pt; font-weight: bold; text-align: center; margin-top: 5px; margin-bottom: 12px}
div.header-small {font-size: 9pt; font-style: italic; text-align: center}

div.notes {margin-bottom: 17px}
div.introheading {font-weight: bold; font-style: italic; font-size: 11pt; color: #6575cc; text-decoration: underline; padding: 2px; padding-left: 5px; margin-top: 5px; margin-bottom: 3px;}
div.subheading {font-weight: bold; font-style: italic; text-decoration: underline; color: #6575cc; padding-top: 5px; padding-left: 5px}
div.tip {text-indent: -20px; padding: 2px; padding-left: 25px; padding-bottom: 0px}
div.resource {text-indent: -10px; padding: 2px; padding-left: 15px}
div.note {text-indent: -10px; padding: 5px; padding-left: 15px}
div.subnote {text-indent: -10px; padding: 3px; padding-left: 25px}
div.advice {text-indent: 0px; padding-left: 5px; padding-bottom: 10px;}
div.format {padding-left: 5px;}
div.editorsnote {color: #3555bc; padding: 5px; padding-left: 5px;}

span.heavy-emphasis {font-weight: bold; font-size: 9pt; text-transform: uppercase; white-space: nowrap}
span.medium-emphasis {font-weight: bold}
span.light-emphasis {font-style: italic; white-space: nowrap}

span.exam {font-style: italic; font-weight: bold; font-size: 11pt}
span.uppercase {font-weight: bold; font-size: 14pt; text-transform: uppercase}

#horizontal-list {display: inline; margin: 0px; padding: 0px;}
#horizontal-list li {display: inline; list-style-type: none; padding-left: 10px; padding-right: 10px}

#vertical-list {margin: 0px; margin-top: 3px; padding: 0px}
#vertical-list li {margin-left: 30px; list-style-type: disc}

hr.blue {height: 1px; color: #7585dc; margin: 5px}
hr.shortblue {height: 1px; color: #7585dc; width: 180px; text-align: left;}

.thumbnail{position: relative; z-index: 0;}
.thumbnail:hover{background-color: transparent; z-index: 50; cursor: pointer}
.thumbnail span.full{ /*CSS for enlarged image*/ position: absolute; background-image: url(slant.jpg); padding: 5px; border: 1px solid gray; visibility: hidden; color: black; text-decoration: none;}
.thumbnail span.full img{ /*CSS for enlarged image*/ border-width: 0; padding: 2px;}
.thumbnail:hover span.full { /*CSS for enlarged image on hover*/ visibility: visible; top: 80px; left: 0px; /*position where enlarged image should offset horizontally */}
/* HTML for thumbnails: <!--<div class="note">Know the group conversion and nesting restrictions. Many thanks to <a href="http://www.boche.net" target="_blank">Jason Boche</a> for the following diagram.</div>
<span class="thumbnail" href="" style="padding-left: 30px"><span style="width: 110px"><img src="groupscope-small.png" border="0" style="margin-right: 10px" /></span><span style="position: relative; bottom: 20px; width: 400px">Simple explanation: arrows represent possible conversions and subscripts represent possible nestings. Mouse over the diagram for a full explanation (also thanks to Jason).</span><br />
<span class="full"><img src="groupscope-large-h.jpg" /></span></span></a>
--> */

#donate {position: relative; left: 5px; font-size: 8pt; margin: 5px}
#donate-left {float: left; position: relative; top: 5px; left: -3px}
#donate-right {width: 400px;}
