/* fm other sylesheet */
/*
* {	margin: 0;
	padding: 0;
}
*/

body {
    margin: 0px auto;
    width: 900px;
    background: #FFFFFF url(/images/headerbg3.png) repeat-x;
    font: normal small  arial, Helvetica, sans-serif, Verdana;
    /* BJS 89/2/08 font: normal small "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif; */
	/* JJW 5/30/08 font: normal small "Trebuchet MS", Arial, Helvetica, sans-serif; */
	/* JJW 2/22/08 font: normal normal normal medium "Trebuchet MS", Arial, Helvetica, sans-serif; */
    color: #333333;
}

/* whole-page satchmo container */

#container {
  /* width: 90%;  */
  width: 900px;
  /* padding: 1em; */
  margin: 0px auto; /* 10px auto; */
  /* background-color: #fff;
     color: #333; */
  /* border: 1px solid gray; */
  line-height: 130%;
}

h1, h2 {
  margin: 5px 0;
  padding: 0;
  line-height: 100%;
}

a {	text-decoration: none;
	color: #972296;
}

a:hover {	text-decoration: underline;
	color: #000000;
}

/* this works w/both ie and ffox, konq */

ul { list-style: circle inside; margin: 0; padding-left: 10px; }

ul#recentblogs { list-style: circle outside; }

.boxedtitle, #rightnav h3 {
	padding-left: 10px;
	/* text-transform: uppercase; 
	font-size: 1em; */
        /* font-weight: bold; */
	font-size: larger;
	font-variant: small-caps;
}

/* Adjust for H3 built-in styles, vs div which has none */
#rightnav h3 {
  font-weight: normal;
  margin: 0;
}

.boxedcontent, #menu_container {
	padding: 10px;
	background: url(/images/img05.gif) repeat-x;
}

#menu_container ul ul {
display: none;
}

.left  { float: left }
.right { float: right }
.clear { clear: both }
.clearleft { clear: left }
.clearright { clear: right }

.big     { font-size:large; }
.xbig    { font-size:x-large; }
.xxbig   { font-size:xx-large; }
.small   { font-size:small; }
.xsmall  { font-size:x-small; }
.xxsmall { font-size:xx-small; }

.green   { color: green; }
.blue    { color: blue; }
.red     { color: red; }
.purple   { color: purple; }

/* input[type="text"] { background-color: lightcyan } Perhaps use lightblue fade here? also for textarea? */
/* The following was #options input[type="submit"], but let's just make it for all submit buttons */
.navbutton, input[type="submit"] { padding: 0 5px; border: 1px solid blue; 
    background: url(/images/buttongrad_light.png) repeat-x; color: black; }
.navbutton:hover, input[type="submit"]:hover { padding: 0 5px; border: 1px solid blue; 
    background: url(/images/buttongrad_lighter.png) repeat-x; color: #222; } 

/* doesn't work in konqueror: 
  .cmdbutton { padding: 0 5px; border: 1px solid red; 
    background: url(/images/buttongrad_light.png) repeat-x; color: red; }
*/

/* .grid  */
.grid, .purpleborder { border: 1px solid purple }
.grid th { padding: 5px; background-color: #ddf; text-transform: capitalize; }
.grid td { padding: 5px; }

/* .grid, ttree  */
.evenrow, #ttree .even, .even { background-color: #dfd; } /* do we need .ttree .even ? */
#ttree .odd, .odd { background-color: #ddf; }

#ttree fieldset { width: 400px; }

#tltp #description {
  max-width:300px;
  background-color: wheat;
}

/* good-better-best, plan boxes JJW 6/7 */

/* .greencontent, .bluecontent, .orangecontent { */
.plan {
float: left;
margin-right: 10px;
padding: 10px;
width: 300px;
}

/*
.plan ul { padding-left: 20px }
.plan h1, .plan h2 { padding: 10px }
*/

.plans .plan {
	width: 200px;
}

.greencontent { 
  background: url(/images/greenfade.png) repeat-x;
  border: 1px solid purple;
}

.bluecontent { 
  /* nope - a ways togo b4 this is possible :-( background: url(images/rect4.svg); */
  background: url(/images/bluefade.png) repeat-x;
  border: 1px solid purple;
}

.orangecontent { 
  background: url(/images/orangefade.png) repeat-x;
  border: 1px solid purple;
}

.purplecontent { 
  background: url(/images/purplefade.png) repeat-x;
  border: 1px solid purple;
}

.yellowcontent { 
  background: url(/images/yellowfade.png) repeat-x;
  border: 1px solid purple;
}

.bluegraycontent { 
  background: url(/images/bluegrayfade.png) repeat-x;
  border: 1px solid purple;
}

.horzbox {
  background: url(/images/horzbox.png) repeat-y top right;
  width: 95%;
  /* height: 120px;*/ 
  border: 1px solid purple;
  margin: 10px 10px 10px 0;
  padding: 10px;
}

.horzbox img {
  margin: 0px 10px 0px 0px;
  /* border: 1px solid gray; */
  float: left;
}


/* Header */

#top {
  /* padding: 5px; */
  height: 70px; /* 140px; */
  padding-bottom: 10px;
}

#logobox {
  float: left;
  /* font-size: 32pt; */
  margin: 0px;
  padding: 0px;
  /* margin-top: 18px;  - for text-based logo only */
  /* padding-bottom: 10px;   for ie - otherwise bottoms cut off */
}

#top, #top img { behavior: url(/js/iepngfix.htc); }

/* #tagline { letter-spacing: -0.5px; font-style: italic; font-weight: bold; } */

#tagline {
  font-style: italic; /* font-weight: bold;  *  12px Arial; */
  margin: -8px 0 0 10px;
}

/* Header > Menu */

#menu {	float: right; }

#menu ul {
  margin: 10px 10px;
  list-style: none;
}

#contactus {
  padding-top: 0px;
  margin-top: 8px;  /* this way for ie */
  line-height: 90%;
  text-align: center;
}

/*
<!--[if IE7]>
 #contactus {
  margin-top: -50px;
 }
<![endif]-->
*/

#menu li { display: inline; }

#menu li a {
  display: block;
  float: left;
  height: 22px;
  margin: 2px 5px;
  padding: 4px 14px 0px;
  background-color: #82d9b2;
	/* background: url(/images/img02.gif) repeat-x; */
	/* JJW 7/4/8 attempt background: url(/images/bg_button.png) repeat-x; */
    /* background: url(/images/button-bad17b-mid.png) repeat-x; */
  text-decoration: none;
    /* text-align: center; */
  font-weight: bold;
  color: #000000;
  /* border: 1px solid #927bd1;  complement of bad17b per agave - was: purple; */
  border: 1px solid #553311;
}
/*
#menu a:link {
	background: url(/images/img03.gif) repeat-x;
	text-decoration: none;
}
#menu a:visited {
	background: url(/images/img03.gif) repeat-x;
	text-decoration: none;
}
*/

#menu li a:focus {
	/* background: url(/images/img03.gif) repeat-x; */
	/* text-decoration: none; */
    outline: 0px solid red;
}

#menu li a:hover {
  background-color: orange;
  /* background: url(/images/orange_grad_21h.png) repeat-x; */
  /* background-image: url(/images/img04.gif); */
  /* background: url(/images/button-bad17b-up.png) repeat-x; */
  /* color: #FFFFFF; */
  text-decoration: none;
  border: 1px solid white;
}

#menu li a:active {
  background-color: orange;
  /* background: url(/images/orange_grad_21h.png) repeat-x; */
  border: 1px solid white;
  /* background: url(/images/button-bad17b-dn.png) repeat-x; */
}

/* it's hard-coded at the moment!  put this back when becomes dynamic! 
- needs either smart navbar snippet, or checkboxes on each page for 
'in_navbar', 'in_thismenu', 'in_thatmenu', etc

#menu .active a {
	background: url(/images/img03.gif) repeat-x;
	color: #FFFFFF;
}
*/


#navbar {
background-color: transparent; /* #fff; */
color: #333;
line-height: 90%;	
padding: 10px;
}

#navbar li {
  display: inline;
  list-style-type: none;
}
#navbar li:before {
  content: '» ';  /* « */
}

#navbar li.first:before {
  content: '';  /* yuk - should use my approach, not theirs - oh well. */
}


#rightnav {
float: right;
width: 220px;
padding: 0 10px;
}

#search input {
font-size: x-small;
/* background: wheat url(/images/light_blue_grad.png) repeat-x; */
/* border: 1px solid #8787a8; */
}

#search_keywords {
color: gray;
margin-left: 23px;
border: 1px solid gray;
}

#content {
margin-right: 230px;
padding: 10px;
}

#splashbox {
 margin-top: 10px;/*BJS 9/8/8 */
 margin-right: 5px;
 margin-bottom: 30px;
 /*width: 650px; BJS 9/8/8  - was 640*/
 height: 260px;
 background: url(../images/origami_fade1.jpg) repeat-x;
/*border: 1px solid purple;*/
 }

#statuspanel {  /* old - delete soon? JJW 9/08 */
float: right;
background-color: orange;
border: 1px solid purple;
padding: 10px;
/* max-width: 300px;*/
}

#cmdresult {
background-color: #edc;
border: 1px solid purple;
padding: 10px;
width: 350px;
height: 100px;
overflow: auto
}

#pagination {
clear:both;
display: block;
width:100%;
float: none;
padding: 1em;
}

#pagination ul {
margin: 0;
padding: 0;
text-align: left; 
font-size: 12px;
}

#pagination li {
list-style-type: none;
display: inline;
padding-bottom: 1px;
}

#pagination a, #pagination a:visited {
padding: 0 5px;
text-decoration: none; 
}

#pagination li.currentpage {
font-weight: bold;
padding: 0 5px;
}

#footer {
clear: both;
background: url(/images/img05.gif) repeat-x;
font-size: x-small;
text-align: center;
padding: 10px; 
color: #333;
}

#footer img { vertical-align: middle; border: 0; }

.vmlist h2 { margin: 2px; clear: both; }
.vmlist th { background-color: lightblue; text-transform: capitalize; }
.vmlist .evenrow { background-color: wheat }

.vmbox { border: 1px solid blue; padding: 5px; margin: 5px 0px; } /* height: 200%; } */
.hostimg { border: 0; }

.productImage {
border:solid 1px silver;
padding:5px;
float: left;
margin-top: 10px;
margin-left: 10px;
margin-right: 10px;
margin-bottom:2px;
}

.productImage p {
text-align: center;
font-size: 10pt;
}

#shipping ul li {
list-style-type: none;	
text-decoration: none;
padding-left: 1em;
text-indent: -1em;
}

#checkoutprogress {
border-style: solid;
border-width: 1px;
padding: 3px;
margin-bottom: 25px;	
}

#checkoutprogress ul {
display: inline;
margin-left: 0;
padding-left: 0;
border: none;
}

#checkoutprogress ul li {
margin-left: 0;
padding-left: 2px;
display: inline;
list-style: none;
}

#checkoutprogress ul li:before {
content: "\0020 \0020 \0020 \00BB \0020";
display: inline;
list-style: none;
}

#checkoutprogress ul li.first:before {
content: " ";
}

#checkoutprogress li.active {
background-color: #ccc;
}

/*
#product_category ul li {
  list-style: none;
}

#product_category p, #product p {
  margin: 0;
  padding:10px;
}
*/

#product_category img, #product img {
  margin: 0 20px;
}


/* from http://www.dynamicdrive.com/dynamicindex2/cmarquee2.htm */

/* no longer used 8/08 JJW, takes too much CPU
#marqueecontainer{
...
*/

.productreviews { background-color: azure; clear: both; padding: 5px; margin: 5px 0; border: 1px solid gray; }