@charset "iso-8859-1";

body {
	font-family: arial, sans-serif;
	font-size: 10pt; 
	font-weight: normal;
	text-align: center;
	}

#maincontent { /* out wrapper*/
	text-align: left;
	margin: auto;
	width: 952px;
	background: white;
	border: double silver;
	}
	
#topheader { /* title bar with page links */
	padding: 1px;
	background: url(image/headback.gif) top left repeat-y; 
	height: 100px; 
	border-bottom: 1px solid gray;
	}
	
li {margin-bottom: 6px;
	margin-right: 6px;
	}

/* suckerfish drop down menu stolen from 
http://htmldog.com/articles/suckerfish/dropdowns/example/bones1.html */

div.menubar {
	float: right;
	margin: 1px 20px 1px 0;
	color: white;
	}

#dropmenu, #dropmenu ul {
	font-size: 80%; 
	list-style: none;
	margin: 0px;
	text-indent: 0px;
	padding-left: 0px;
	background: url(image/headback.gif) top left repeat-y;  
	}

#dropmenu li, #dropmenu li ul  {
	font-weight: bold;
	float: left;
	display: block;
	width: 140px; /* width needed or else Opera goes nuts */
	z-index: 1;
	margin: 0;
	}

#dropmenu a {
	color: white;
	display: block; 
	} 

#dropmenu li ul a {
	text-decoration: none;
	}

#dropmenu li ul { /* second-level lists */
	position: absolute; 
	display: none; 
	font-size: 100%; 
	}

#dropmenu li:hover ul, #dropmenu li.sfhover ul { /* lists nested under hovered list items */
	left: auto; 
	display: block;
	}
	
#dropmenu li ul li { /* individual menu items */
	}

#dropmenu a:hover {background: #aa0000;
	}

.nolink {color: red;}

#dropmenu a, li.nolink {padding: 2px 0 3px 2px;}

/* container for our 2 columns */
#content {}

/* righthand column with news and shopping cart */ 
#rightbox {
	width: 251px; 
	border-left:  1px gray solid;
	margin-left: -1px;
	border-bottom: 0px gray solid;
	margin-bottom: -1px;
	float: right;
	}
/*	rivet cart to screen -- may not work for lte IE6 */
#cart {
	position: fixed;
	width: 251px; 
	border-bottom: 1px solid gray;
	}

table {font-size: 100%}

table.sidecart {
	width: 100%;
	border: 0px;
	margin: 3px 0px 3px 0px;
	}
table.sidecart td {
	font-size: 90%;
	color: black;
	vertical-align: top;
	text-align:left;
	}

#linkbox p {
	text-align: center;
	margin: 20px 0 30px 0;
	}

/* individual page content */
#leftbox {
	border-right: 1px solid gray;
	float: left; 
	width: 700px; 
	}

#innercontent {
	text-align: left;
	}

/* display different tools on homepage */
table.sidemenu {
	font-size: 80%;
	font-weight: bold;
	border-collapse: collapse;
	width: 100%;
	border-bottom: 1px solid gray; 
	background: url(image/headback.gif) top left repeat-y;  
	}

table.sidemenu td {
	text-align: center;
	vertical-align: bottom;	
	padding: 0px 0px 0px 0px;
	}

table.sidemenu img {margin-top: 9px; border: 1px solid gray;}
table.sidemenu td a {
	text-decoration: none;
	color: white;
	display: block;
	}
table.sidemenu td a:hover {background: #aa0000;}

div.clear {clear:both;}

/* copyright info below the columns */
#footer {
	clear: both;
	text-align:center;
	font-size: 60%;
	}

/* define homepage pictures */

div.homebios {
	margin-left: 4px; 
	margin-top: 16px;
	}

div.homepix {
	width: 200px; 
	float: left; 
	margin-right: 30px;
	}

div.homepix img { /*ie might futz this*/
	width: 200px; 
	height: 166px;
	}

div.pictitle, div.pictitle a {
	font-family: arial rounded MT bold, sans-serif;
	font-size: 110%; 
	color: #444444;
	text-align: center;
	text-decoration: none;
	}

div.homepix p {margin: 0px;}

/* general tags */
h1, h2, h3, h4, h5 {clear: both;} 

h1, h5 {font-size: 140%; /* main title and shopping cart header, hierarchy for SEO */
	margin: 0;
	padding: 3px;
	color: white;
	text-align: center;
	border-bottom: 1px solid gray;
	}

h1 {	background: url(image/h1back_l.gif) top right repeat-y;
	}

h5 {	background: url(image/h1back_r.gif) top left repeat-y;
	background-position: -1px 0px; /* smooth gradient for sidebox */
	}

h2 {	font-size: 110%; /*product names */
	color: #000000;
	background: #c0c0c0;
	margin-bottom: 0px;
	margin-top: 0px;
	padding: 4px;
	}

h3 {	font-size: 135%;
	font-variant: small-caps;
	margin: 14px 0px 10px 4px;
	color: navy;
	}

h4 {color: blue;
	font-size: 120%;
	}

h6 {	font-size: 110%; /* News */
	font-weight: bold;
	color: #a00000;
	margin: 12px 4px 5px 4px;
	text-decoration: none;
	}

h6 a {	margin: 0;
	text-decoration: none;
	color: red;
	}

h6 a:hover {
	text-decoration: underline;
	}

h6.testmode {
	background: yellow;
	}

p	{
	margin: 6px 2px 6px 4px;
	text-align: left;
	}

/* tables to display those pyro products */
table.products {
	clear: both;
	border-collapse: collapse;
/*	font-size: 90%;  */
	font-weight: normal;
	width: 100%;
	border-bottom: 1px solid gray;
	}

table.products th {
	background: #ffffff;
	color: red;
	font-weight: bold;
	text-align: left;
	padding-left: 4px;
	}

/* let's make some striped tables */

tr.tr1 td {background: #efefff;}
	
tr.tr2 td {background: #fefeff;}

table.productsr tr.tr2 td {background: #efefff;}

table.productsr tr.tr1 td {background: #fefeff;}

table.products td, table.productsr td {color: navy;
	font-weight: normal;
	line-height: 125%;
	padding-left: 4px;
	vertical-align: top;
	text-align: left;
	}

td.rt, th.rt, td.rti {text-align: right  !important ; padding-right: 4px;}

td.rti {font-style: italic}

td form {display:inline;}

/* buttons all defined here: */

.bigbutton, .smallbutton, .viewcart {
	border: 1px solid silver;
	border-bottom: gray; 
	border-right: gray;
	text-decoration: none;
	background: #dddddd; 
	color: #000000;
	display:inline;
	}

.smallbutton { /* add to cart */
	font-size: 60%;
	padding: 0;
	}

.bigbutton, a.viewcart { /* "continue..." buttons */
	font-size: 90%;
	font-weight: bold; 
	padding: 1px;
	border: 2px;
	}

input.bigbutton {padding: 0px}

a.bigbutton {padding: 1px 11px 1px 11px;}

.bigbutton:hover, .smallbutton:hover, a.viewcart:hover {
	color: #fefeff;
	background: #000080; 
	border-color: gray;
	cursor: pointer;
	}

.bigbutton:active, .smallbutton:active, a.viewcart:active {}

form {margin:0}

p.right {text-align: right;}
p.left {text-align: left;}
p.center {text-align: center;}

img {border: 0;} 
img.bigpic {width: 700px;
	display: block;
	overflow: hidden;}
	
img.newitem {display:inline;
	vertical-align: middle;
	margin: 0 4px 0 4px;
	}

/* picture display in gallery page*/

div.picframe {
	clear: both;
	background: #eeeeee;
	margin: 5px;
	padding: 10px;
	border: 1px gray solid;
	float: left;
	width: 665px;
	}

div.picframe img {
	margin: 4px;
	padding: 1px;
	background: silver;
	}

div.picframe a img {border: 1px gray solid;}
div.picframe a img:hover {background: navy;}

div.picframe p {margin-bottom: 8px;}

/* thumbnail images*/
img.right, img.rthumb, img.gright {float: right;}
img.left, img.lthumb, img.gleft {float: left;}
img.lthumb, img.rthumb, img.thumb  {width: 120px; height:80px; margin: 0; padding: 1px;}
img.rthumb {border-bottom: 1px solid gray; border-top: 1px solid silver; border-left: 1px solid silver; margin-left: 1px;}
img.rthumb:hover {background: #ccccff;} 
img.gright, img.gleft {width: 200px; height: 133px;}


/* catalogue popup image properties */
div.popup {width: 900px;  
	text-align: center;
	}

/* fraction characters */
sup, sub {font-size: 60%;}

sup {vertical-align: 3pt;}

sub {vertical-align: -1pt;}

strong {color: red;}

/* "Tips & Tricks" */
li.tips {
	color: blue;
	font-weight: bold;
	}
li.tips div {
	color:black;
	font-weight: normal;
	}

/*testimonials */
ul.testi {
	list-style: none;
	margin-left: 4px;
	margin-right: 4px;
	padding-left: 0;
	}
ul.testi li {
	font-family: serif;
	font-style: oblique;
	margin-bottom: 15px;
	}
li.blue {color: black}
li.purple {color: blue}


/* make some vertical space - PITA for the Custom Tools section */
div.space {height: 30px;}
div.ctspace {
	clear: both;
	margin-bottom: 15px;
	}
	
form.smallform fieldset {margin: 20px; padding: 15px; }
form.smallform legend {margin-bottom: 5px;}

/* some little boxes for the payment buttons (Paypal, Credit Card, Money Order) */
table.paybox {
	border:0;
	padding: 0px;
	border-spacing: 12px;
	width:auto;
	}
table.paybox td {
	padding: 15px;
	text-align: center;
	vertical-align: bottom;
	}

.yesscript {display: none} /* hide JS from non-JS browsers */

.hhinp {width: 99%} /* hold harmless thingie */

span.eq {font-family: times new roman,serif; font-style: italic} /* equation */

/* div {border: thin red dotted} /* debugging*/

@media print{ 
/*hide links and cart when printing */
input, #rightbox, #topheader {display:none;} 
#leftbox {
	width: 100%;
	}
}