/* global elements */

* {
	margin:0px;
	padding:0px;
	}
	
html {
	height:100%;
	}

body {
	height:100%;
	font-family: Arial, Helvetica, sans-serif;
	background-color:#003366;
	color:#003366;
	}
	
/* page structure, specific ids and classes */

#wrap {
	position:relative;
	min-height:100%;
	width:80%;
	margin:4% auto;
	background-color:#FFFFFF;
	text-align:center;
	}
	
#container{
	position:relative;
	width:100%;
	min-height:100%;
	margin:0% auto 0% auto;
	text-align:left;
	}
	
/* content elements */

#content {
	position:relative;
	width:65%;
	min-height:100%;
	margin:0%;
	padding-top:8%;
	padding-right:2%;
	background-color:#FFFFFF;
	float:left;
	}
	
/* top right div for dynamic iformation */
	
#infoBox {
	position:absolute;
	top:5px;
	right:1em;;
	width:50%;
	height:90px;
	float:right;
	text-align:right;
	}
	
/* header elements */

#header {
	position:relative;
	width:100%;
	height:120px;
	border-bottom: 15px double #003366;
	}
	
#logo {
	position:absolute;
	top:0;
	left:0;
	width:65%;
	margin:0%;
	padding:3%;
	text-align:left;
	overflow:hidden;
	}
	
#leftCrnDiv {
	position:absolute;
	top:0;
	left:0;
	width:38px;
	height:38px;
	background-image:url(images/ltcrn.png);
	background-repeat:no-repeat;
	}
	
#rightCrnDiv {
	position:absolute;
	top:0;
	right:0;
	width:38px;
	height:38px;
	background-image:url(images/rtcrn.png);
	background-repeat:no-repeat;
	}
	
#headerDiv1 { /* sits top right - holds tool */
	position:absolute;
	width:129px;
	top:32px;
	right:0;
	margin:0;
	float:right;
	}
	
/* various elements */

#imagecontainer {
	padding:1em 2em 0 0;
	float:left;
	}	
	
/* navigation and sidebar elements */

#sidebar {
	position:relative;
	float:left;
	width:30%;
	margin:0;
	padding-top:50px;
	padding-right:2%;
	text-align:left;
	background-color:#FFFFFF;
	z-index:101;
	}
	
#sidebarXtraDiv	{
	width:35%;
	border:3px double #000066;
	float:right;
	margin:1%;
	}
	
#navbar {
	width:100%;
	margin:0;
	padding:0 3% 6% 5%;
	text-align:left;
	}

.menu{
	margin:5px 0;
	padding:0;
	width:80%; /*width of menu*/
	}

.menu a.menuitem{
	position:relative; /*To help in the anchoring of the ".statusicon" icon image*/
	width:100%;
	display:block;
	padding:5px 10px;
	font-size:.9em;
	color:#003366;
	text-decoration:none;
	outline-style:none;
	}

.menu a.menuitem:visited, .menu .menuitem:active{
	color:#003366;
	outline-style:none;
	}

.menu a.menuitem .statusicon{ /*CSS for icon image that gets dynamically added to headers*/
	position:absolute;
	top:5px;
	right:0px;
	border:none;
	}

.menu a.menuitem:hover{
	color:#CC0000;
	}

.menu div.submenu{ /*div that contains each sub menu*/
	width:115%;
	background:#FFFFFF;
	}

.menu div.submenu ul{ /*ul of each sub menu*/
	list-style-type: none;
	margin: 0px;
	padding:0px;
	}

.menu div.submenu ul li{
	padding-bottom:5px;
	}

.menu div.submenu ul li a{
	display: block;
	font-size:.8em;
	font-weight:normal;
	color:#003366;
	text-decoration:none;
	padding:1px 0px;
	padding-left:1px;
	}

.menu div.submenu ul li a:hover{
	background:#FFFFFF;
	color:#CC0000;
	}

/* footer elements */

#footer {
	position:relative;
	bottom:0px;
	width:100%;
	height:200px;
	margin:0;
	padding-top:15px;
	background-color:#003366;
	border-top: 15px double #003366;
	}
	
#footer a, a:link, a:visited, a:active {
	color:#FFFFFF;
	}
	
#footer a:hover {
	color:#CC0000;
	}
	
#footer p.normalFoot {
	font-size:1em;
	font-weight:600;
	text-align:center;
	line-height:125%;
	color:#FFFFFF;
	padding:0% 5% 3% 5%;
	 }
	 
#footer p.italicsFoot {
	font-size:.95em;
	font-weight:500;
	font-style:italic;
	text-align:center;
	line-height:115%;
	color:#FFFFFF;
	padding:1% 5% 0% 5%;
	}

h1, h2, h3, h4, h5, p {
	font-family:Arial, Helvetica, sans-serif;
	line-height:200%;
	padding-bottom:3%;
	}

h1 {
	font-size:1.4em;
	font-weight:600;
	text-align:center;
	color:#003366;
	}

h2 {
	font-size:1.2em;
	font-weight:600;
	text-align:left;
	color:#003366;
	}

h3 {
	font-size:1em;
	font-weight:600;
	text-align:center;
	color:#CC0000;
	}

h4 {
	font-size:1em;
	font-weight:600;
	text-align:left;
	color:#CC0000;
	}
	
h5 {
	font-size:1em;
	font-weight:600;
	text-align:left;
	color:#003366;
	}
	
/* define workshop text */

h1.wkshp {
	font-size:1.2em;
	font-weight:600;
	text-align:left;
	padding-bottom:1.25em;
	}

h2.wkshp {
	font-size:1em;
	font-weight:600;
	text-align:left;
	padding-bottom:1.25em;
	}
 
p {
	font-size:1em;
	text-align:left;
	color:#003366;
	}
	
p.center {
	font-size:1em;
	text-align:center;
	color:#003366;
	}
	
p.right {
	font-size:1em;
	text-align:right;
	color:#003366;
	}
	 
p.italics {
	padding-left:2%;
	line-height:160%;
	font-style:italic;
	}
	
ol {
	line-height:200%;
	padding-bottom:3%;
	color:#003366;
	}
	
ul {
	line-height:200%;
	padding-bottom:3%;
	color:#003366;
	}
	 
li {
	margin-left:10%;
	font-size:1em;
	}
	 
a, a:active, a:link, a:visited {
	color:#003366;
	font-weight: bold;
	}

a:hover {
	color:#CC0000;
	font-weight: bold;
	}
	
a img {
	border:none;
	}
	
/* xtra divs */
	 
#xtraDiv1 { /* testimonial on index */
	padding:5%;
	text-align:left;
	overflow:hidden;
	}
	
#xtraDiv2 { /* sits left bottom on index*/
	position:absolute;
	bottom:0px;
	left:0px;
	width:25%;
	height:115px;
	overflow:hidden;
	}
	
#xtraDiv3 { /* girl with tool on index */
	position:absolute;
	bottom:0;
	right:0;
	margin-right:0;
	padding-right:5%;
	width:20%;
	height:305px;
	float:right;
	overflow:hidden;
	}

.xtraDiv4 { /*float box for anatomy lesson page */
	width:23%;
	margin-left:4%;
	padding:3%;
	float:left;
	text-align:center;
	}
	
#xtraDiv5 { /* girl with tool on about kit */
	position:absolute;
	bottom:0;
	right:0;
	width:150px;
	height:200px;
	float:right;
	overflow:hidden;
	}
	
 /* video elements on index */
	
#vidDiv1{ /* holds julie tool tip */
	padding:5%;
	text-align:left;
	}
	
#vidDiv2 {
	padding:5%;
	text-align:left;
	}
	
#systemDiv1 { /* holds system on index */
	width:40%;
	margin-left:25%;
	padding-top:5%;
	padding-bottom:5%;
	text-align:center;
	}
	
#systemDiv2 { /* holds system throughout */
	width:100%;
	text-align:left;
	}
	
/* product table elements */

table.productTable {
	width:100%;
	font-size:100%;
	}
	
table.productTable a {
	text-decoration:none;
	}
	
table.productSubTable {
	width:100%;
	text-align:center;
	}
	
table.productSubTableBordered {
	width:100%;
	text-align:center;
	vertical-align:top;
	border:1px dotted #CC0000;
	}
	
table.priceTable {
	width:100%;
	padding:0 1em;
	font-size:100%;
	}
	
table.priceTable a	{
	text-decoration:none;
	}
	
td.columnFormat	{
	vertical-align:top;
	width:33.4%;
	}
	
td.productHead	{
	font-size:1em;
	font-weight:bold;
	text-align:left;
	padding-bottom:.5em;
	}
	
td.productRedHead	{
	font-size:.9em;
	font-weight:bold;
	text-align:left;
	padding:.5em 0 1em 0;
	color:#CC0000;
	}
	
td.productSubHead	{
	font-size:.8em;
	font-weight:bold;
	text-align:left;
	padding-bottom:.5em;
	}
	
td.productSubHeadCenter	{
	font-size:.8em;
	font-weight:bold;
	text-align:center;
	padding-bottom:.5em;
	}
	
td.productDesc	{
	font-size:.75em;
	text-align:left;
	padding-bottom:.75em;
	}
	
td.productCenterDesc	{
	font-size:.8em;
	text-align:center;
	padding-bottom:.5em;
	}
	
td.priceFormat	{
	font-size:.8em;
	font-weight:bold;
	text-align:right;
	padding-bottom:.5em;
	}
	
td.priceFormatCenter  {
	font-size:.8em;
	font-weight:bold;
	text-align:center;
	}
	
td.addToCartFormat	{
	font-size:.75em;
	font-weight:bold;
	text-align:right;
	}
	
td.addToCartFormatCenter  {
	font-size:.7em;
	font-weight:bold;
	text-align:center;
	}
	
td.addToCartFormatLeft	{
	font-size:.7em;
	font-weight:bold;
	text-align:left;
	}
	
/* various elements */

.productSeparator	{
	height:.5em;
	background-image:url(images/productSeparator.gif);
	background-repeat:repeat-x;
	vertical-align:middle;
	}
	
/* image elements */

img.addToCart {
	width:25px;
	text-align:right;
	padding-left:.75em;
	}
	
img.prodImage {
	width:175px;
	padding:.35em 1em;
	}
	
img.prodImageBook {
	width:100px;
	padding:1.5em 0;
	}
		
img.prodImageSmaller {
	width:125px;
	padding:1em;
	}
	
img.prodImageTools {
	width:85px;
	text-align:center;
	padding:1em;
	}		

/* date elements */

.outerbox {
	position:absolute;
	top:0;
	left:0;
	width:30px;
	overflow:hidden;
	font-weight: 900;
	border:1px solid #003366;
	z-index:100;
	}
	
.datebox  {
	font-size:11pt;
	color:#003366;
	text-align:center;
    border-bottom:1px;
	border-bottom-style:solid;
	border-bottom-color:#003366;
	}
	
.monthbox {
	font-size:7pt;
	color:#FFFFFF;
    background-color:#003366;
	text-align:center;
	}
	
/* float images */

img.floatLeft {
	margin:0px;
	padding:0% 4% 0% 0%;
	float:left;
	overflow:hidden;
	}
	
img.floatRight {
	margin:0px;
	padding:0% 0% 0% 4%;
	float:right;
	}
	
/* tool tip element */
	
#dhtmltooltip{
	position: absolute;
	width:325px;
	border:2px solid #003366;
	padding:3px;
	background-color:#FFFFFF;
	line-height:150%;
	visibility: hidden;
	z-index: 102;
	}

#toolTipDiv {
	padding:5%;
	padding-left:10%;
	text-align:left;
	}
	
#toolTipDiv li {
	margin:0;
	padding:0;
	list-style-image:url(images/check.gif);
	text-align:center;
	}
	
/* define tween (between) lines */
	
hr.tween {
	clear:both;
	color:#CC0000;
	width:95%;
	height: 2px;
	margin:25px 15px 25px 15px;
	background-color:#CC0000;
	border:none;
	text-align:center;
	}
	
hr.short_tween {
	clear:both;
	color:#CC0000;
	width:50%;
	height: 2px;
	margin:35px 15px 25px 15px;
	background-color:#CC0000;
	border:none;
	text-align:left;
	}
	
/* cleaner - - clear floats */

.cleaner {
	clear:both;
	height:1px;
	margin:0;
	border:none;
	padding:0;
	background:transparent;
	}
	
/* highlight text red */

span.highlight {
	margin:5px 0px 5px 5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	font-weight:bold;
	text-align:left;
	color: #CC0000;
	}

.close {
	position:absolute;	/* close popup */
	width:25%;
	bottom:0px;
	left:0px;
	margin-bottom:1%;
	padding-left:2%;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	}