/* Springfree CSS Document */

body {
	font-family: arial, helvetica, sans-serif;
	color: #333;
	margin: 0 0 0 0;
	background-image: url("/images/h-lines.gif");
	background-repeat: repeat;
}

#container {
	width: 760px;
	margin: 0 auto auto auto;
	border: 1px solid #999;
	background-color: white;
}

#homecontainer { height: 600px}

.homemasthead { width: 760px; 
				height: 80px; 
				border: 0;}
				
.normalmasthead { width: 760px; 
                  height: 100px; 
                  border: 0;}
       
div#masthead { margin: 0 0 0 0;
               padding: 0 0 0 0;}

div#navbar { display:none }

div#navbar ul.mainnav { left: 12px }

div#navbar ul {  position: relative;
                 top: 5px;
                 margin: 0; 
                 padding: 0; 
                 background-color: #09F;
                 color: #FFFFFF;
                 font-size: 8pt;
                 font-weight: bold;
                 z-index: 99999;
                 }
                 
div#navbar ul li {  position: relative; 
                    list-style: none;
                    height: 20px;
                    text-align:center;}

div#navbar ul ul li {  position: relative; 
                       list-style: none; 
                       margin: 0;
                       padding: 0 0 0 1em;

                       height: 20px;
                       display: block;
                       text-align:left;}

div#navbar  ul a {width: auto;}

div#navbar ul ul { position: absolute;
                   background-color: #ADAEAE;
                   top: 20px;
                   left: 0px;
                   display: none;}
                    
div#navbar ul ul ul,
div#navbar ul ul ul ul {  position: absolute;
                          background-color: #ADAEAE;
                          top: 0;
                          width: 9em;
                          left: -8.5em;
                          display: none;}


div#navbar ul.level0     { float: right; 
                           width: 8em; }
                           
div#navbar ul.mainnav    { float  : left; width: 600px;}
div#navbar ul.mainnav li { display: inline; margin: 0px 0px 0px 10px}

div#navbar ul.level0 {  }

div#navbar ul.level0 li.submenu:hover ul.level1,
div#navbar ul.level1 li.submenu:hover ul.level2,
div#navbar ul.level1 li.submenu:hover ul.level2 li.submenu:hover ul.level3
{display:block;}

ul.level1 {width: 85px;}


div#navbar li a {padding: 0 0 0 0;
                  margin: 0 0 0 0;}


div#navbar li a:link, 
div#navbar li a:visited,
div#navbar li a:active{color: #FFFFFF; text-decoration:none;}
div#navbar li a:hover {color: #028CCE; text-decoration:none;}
            
div#navbar ul.mainnav li a:hover {color: #FFB13A; text-decoration:none;}

#progressbar { display: none }

div#footer {  position: absolute;
  			  top: 434px;
  		   }
/* promo boxes with css rollovers */
div#promobox { margin: 0 0 0 0;
               padding: 10px 0 10px 0;}
div#promobox img {padding: 0 0 0 0; margin: 0 0 0 0; border: 0}
div#promobox img.promimg1 {padding: 0 0 0 0;}
div#promobox img.promimg2 {padding: 0 0 0 5px;}
div#promobox img.promimg3 {padding: 0 0 0 6px;}
div#promobox img.promimg4 {padding: 0 0 0 5px;}


div#linkbar { margin: 0 0 0 0;
              padding: 0 0 0 0;
              width: 760px;
              height: 25px;
              background-color: #999999;
              font-size: 70%;
              color: #FFFFFF;
              clear  : left;}

div#linkbar ul { position: relative;
                 margin: 0 0 0 0; 
                 padding: 0 0 0 0; 
                 background-color: #999999;
                 float  : left; 
                 width: 250px;
                 line-height: 25px;}
     
div#linkbar ul li { position: relative;
                    list-style: none;
                    height: 20px;
                    text-align:center;
                    display: inline;
                    margin: 0px 0px 0px 10px}

div#linkbar li a:link, 
div#linkbar li a:visited,
div#linkbar li a:active{color: #FFFFFF; text-decoration:none;}
div#linkbar li a:hover {color: #028CCE; text-decoration:none;}

div#linkbar p#copyright { line-height: 25px;
                          text-align:right;
                          margin: 0px 20px 0px 0px}
                
p#fineprint   { margin: 0 0 0 0;
                padding: 0 0 0 0;
                width: 760px;
                font-size: 70%; 
                color: #999999;}

/* begin navmenu */
div#navmenu { display:none }

div#navmenu ul {padding:0;
                margin:0;
                list-style: none;}
        
div#navmenu ul li { margin: 0;
                    padding: 0;
                    line-height: 20px;
                    border-top: 2px solid #e6e5e0;}

div#navmenu ul li.firstmenuitem { border-top: 0}
div#navmenu ul li.lastmenuitem  { border-bottom: 2px solid #e6e5e0;}

div#navmenu li a:link, 
div#navmenu li a:visited,
div#navmenu li a:active{color: #333; text-decoration:none;}
div#navmenu li a:hover {color: #333; text-decoration:none;}
div#navmenu ul li.level1-current {background-color: #09F;}

div#navmenu li.level1 a:link, 
div#navmenu li.level1 a:visited,
div#navmenu li.level1 a:active {color: #333; text-decoration:none;}
div#navmenu li.level1 a:hover {color: #FFF; text-decoration:none;}
div#navmenu li.level1:hover a {color: #FFF; text-decoration:none;}

div#navmenu li.level1-current a:link, 
div#navmenu li.level1-current a:visited,
div#navmenu li.level1-current a:active {color: #FFF; text-decoration:none;}
div#navmenu li.level1-current a:hover {color: #FFF; text-decoration:none;}
div#navmenu li.level1-current:hover a {color: #FFF; text-decoration:none;}

div#navmenu li.level1childselected a:link, 
div#navmenu li.level1childselected a:visited,
div#navmenu li.level1childselected a:active {color: #FFF; text-decoration:none;}
div#navmenu li.level1childselected a:hover {color: #FFF; text-decoration:none;}
div#navmenu li.level1childselected:hover a {color: #FFF; text-decoration:none;}

div#navmenu li.level2 a:link, 
div#navmenu li.level2 a:visited,
div#navmenu li.level2 a:active {color: #333; text-decoration:none;}
div#navmenu li.level2 a:hover {color: #FFF; text-decoration:none;}

div#navmenu ul li.level1childselected {background-color: #09F;}
div#navmenu ul li.level1nochild {padding-left: 20px}
div#navmenu ul li.level1:hover {background-color:#09F;}
div#navmenu ul li.level2 {background-color:#ffffff; padding-left: 50px}
div#navmenu ul li.level2:hover {background-color:#09F;}
div#navmenu ul li.level2 a:hover  {color: #FFF;}
div#navmenu ul li.level2:hover a  {color: #FFF;}
div#navmenu ul li.level1-current:hover {background-color: #09F;}
div#navmenu ul li.level2-current:hover {background-color: #09F;}

div#navmenu ul li img.navarrow { border: 0; float: left; padding: 5px 0 5px 0}

.on  { display:block}
.off { display:none}
/* end navmenu */

.contentarea {  float:left;
                margin: 0;
                padding: 10px;
                border: 0;
                width: 580px;}
                
#slideshow 
{
  position: relative;
  width: 760px;
  width: 330px;
  padding: 0px;
}
#slideshow div 
{
  position: absolute;
  width: 760px;
  top: 0px;
  left: 0px;
  text-align: center;
}


.contentarea .col1 { width: 300px; float: left}
.contentarea .col2 { width: 260px; float: left}
.contentarea .col2 .spectitle { margin: 5px 0 4px 8px}

.contactform {}

.contentarea .contactheading {color: #333;}
			  
.contactrule {color: #ffb13A;
			  background-color: #ffb13A;
			  border: 0;
			  margin: 0}

.contactform input,
.contactform select {display: block;
                     width: 150px;
	                 float: left;
	                 font-size: 70%;
	                 background-color: #cdccc1;
	                 margin: 0 0 15px 0;
	                 border: 1px solid #999;
	                 color: #333;}
                
.contactform label {width: 150px;
					font-size: 70%;
					float: left;
                    text-align: right;
	                padding-right: 20px;
	                margin: 0 0 0 0;
	                padding: 0 5px 0 0;}

.contactform .contactreset,
.contactform .contactsubmit { width: 60px;
							  height: 20px; 
							  background-color:#cdccc1;
							  color:#333;
							  margin: 5px 0 5px 5px;
							  float:right;}

.contactform .contactreset:hover,
.contactform .contactsubmit:hover {background-color: #999999;color:white}

.contactform br {
	clear: left;
}

.contactform .col1 {width: 320px; 
                    height: auto;
					border: 0;
					float: left;
					padding: 10px 10px 10px 0;
					margin: 0 0 0 0;}
					
.contactform .col2 {width: 202px;
                    height: auto;
					float: left;
					border: 0;
					padding: 0 0 0 0;
					margin: 0 0 0 0;}
					
.contactform .col2 label {width: 150px; 
						  text-align: left;
						  padding: 10px 0 5px 0;}

.contactform .col2 textarea {width: 200px;
                             height: 138px;
							 float:none; 
							 overflow: auto;
							 background-color: #cdccc1;
							 color: #333;
							 font-size: 85%;
							 padding: 0 0 0 0;
							 border: 1px solid #999;}

.productgallery { float: left; 
		   width: 260px; 
		   border: 1px solid #cdccc1;
		   padding: 5px 0 3px 5px;
		   margin: 0 10px 0 0}
		   			 
.productgallery .display { float: left; 
					width: 200px; 
					border: 0; 
					padding: 0; 
					margin: 0 5px 0 0;
					position: relative; 
					top: 5px}
					
.productgallery .thumbs { float: left; padding: 0 margin: 0}

.productgallery .thumbs img { border: 1px solid #cdccc1;
                       display:block; 
                       margin: 0 0 2px 0;}

.exploregallery { float: left; 
		   width: 280px; 
		   border: 1px solid #cdccc1;
		   padding: 5px 0 3px 5px;
		   margin: 0 10px 0 0}
		   			 
.exploregallery .display {
					width: 200px; 
					border: 0; 
					padding: 0; 
					margin: 0 5px 0 0;
					position: relative;}
					
.exploregallery .thumbs {padding: 0; margin: 5px 0 0 0; text-align:center}

.exploregallery .thumbs img { border: 1px solid #cdccc1;
                       margin: 0 0 0 0;}

.exploretext { padding: 15px 0 0 0;}

.sitemap {font-size: smaller; float:left; width:580px; padding: 0 10px 10px 10px; }

.sitemap ul.navcol {display: block; float: left;}

.sitemap li {
	list-style: none;
	font-weight: bold;
	padding-left: 0;
	margin-left: 0;
	margin-top: 0.25em;

	}

.sitemap li ul {
	font-weight: normal;
	padding-left: 0;
	margin-left: 1em;
	}

.sitemap li ul li {
	font-weight: normal;
	margin-left: 0;
	padding-left: 16px;
	background-color: white;
		width: 10em;
	}

.sitemap li ul li ul li {
	margin-left: 1em;
	background: url(/images/bullet.gif) no-repeat 0 50%;
	}

.sitemap li,
.sitemap li a:link,
.sitemap li a:visited,
.sitemap li li a:active {color: #333; text-decoration:none;}
.sitemap li a:hover {text-decoration: underline;background-color: #eee;}

/* shop styles */

.producttable { border: 1px dotted black;
				border-collapse: collapse;
				width: 395px;
				margin-top: 10px; 
				margin-left:15%;
				margin-right:15%}

.producttable th.tbodyheading { text-align: center; background-color: #ddd}
.producttable .currency {text-align: right; }
.producttable td,
.producttable th { border-bottom: 1px dotted black; 
                   text-align: left;
                   height: 20px;
				   padding: 0 5px 0 5px;}
.producttable .bottomline td, .producttable .bottomline th{ border-top: 1px solid black;}

.adjustform input.quantity { width: 50px}

.buttonsleft  { width: 200px; float: left;}
.buttonsleft input { margin: 10px 2px 5px 15px}
.buttonsright { width: 260px; float: right;}
.buttonsright input { margin: 10px 2px 5px 2px;}

#serviceoptions { margin: 20px 0 20px 15px}
#serviceoptions label { display: block; float: left; width: 180px}
#serviceoptions select { }

#prevnext { margin: 10px 0 10px 0 }


form.cmxform fieldset {
  margin-bottom: 10px;
  border: 0;
}

form.cmxform legend {
  font-weight: bold;
  display:none;
}

form.cmxform fieldset ol {
  margin: 0;
  padding: 0;
}
form.cmxform fieldset li {
  list-style: none;
  padding: 5px;
  margin: 0;
}
form.cmxform label {
  display: block;
  width: 100px;
  float: left;
}
form.cmxform .field {
  width: 200px;
}
form.cmxform #purchase_reason{
  height: 40px;
}
form.cmxform select {
  margin-right: 8px
}
.fielderror {
  color: red;
  font-size: 80%;
}
.paymenterror {
  color: red;
  font-weight: bold;
}
.checkoutconfirm { width: 565px;}

.checkoutconfirmtable { border-collapse: collapse;
					    border: 1px dotted black;
						width: 395px; 
						margin-top: 20px; 
						margin-left:15%;
						margin-right:15%}

.checkoutconfirmtable th,.checkoutconfirmtable td { border-bottom: 1px dotted black;
                   									text-align: left;
				   									height: 20px;
				        							padding: 0 5px 0 5px;}

.checkoutconfirm th.tbodyheading { text-align: center; background-color: #ddd}
.checkoutconfirm th.fieldheading {width: 100px }

.mandarisk {color:red }
.shop  {}
.shop .instruct {margin: 10px 0 10px 5px}
.shop .instruct .title {font-size: 120%; font-weight:bold; margin: 0 0 0 0}
.shop .instruct .para { margin: 0 0 5px 0}

.shop table.prodlist td { padding: 10px 0 10px 0 }
.shop table.prodlist td.bordered {  border-bottom: 2px dotted #ddd}
.shop table.prodlist td.prodimg { width: 100px;}
.shop table.prodlist td.proddetails { width: 400px; padding: 0 0 0 25px;}
.shop table.prodlist td.proddetails .title {font-size: 110%; font-weight:bold;}
.shop table.prodlist td.proddetails .price {line-height: 40px; font-size: 110%; font-weight:bold; color:#09F}

.shop .spectablecontainer { border: 1px solid #cdccc1; margin:0; padding:2px;width:560px;}
.shop table.spectable { width:560px;
                        border-collapse: collapse;
						border-spacing: 0;}
.shop table.spectable td {padding: 4px; border: 0; margin:0}
.shop th {font-weight: bold; text-align:left}
.shop td.sectiontitle {	font-weight: bold;	text-align: left;	text-transform: uppercase;	background-color: #80ccff;	padding: 4px;}
.shop td.rowtitle {	font-weight: bold;	text-align: left;	padding: 4px;	width:33%;}
.shop tr.row1 {	background-color: white;}
.shop tr.row2 {	background-color: #cdccc1;}

/* used for image title in buy page */
imgtitle {margin:0;padding:0}

/* store locator */
.locator form { margin-top: 10px; }
.locator form .gobutton { margin-left: 5px; vertical-align: bottom}
.locator .backbutton { margin-top: 10px; vertical-align: bottom}
.locator .dealersearchresults .thumbmap { float: left; margin-right: 10px;}
.locator .dealersearchresults address.dealeraddress { font-style: normal; margin-bottom: 10px}
.locator hr { margin: 10px 0 10px 0; height: 1px; background: #CCC; border: 0}
.locator .dealersearchresults .distance { color: #09F; font-weight: bold}
.locator .dealersearchresults address span.name { font-size: 115%; font-weight: bold}
.locator .errormsg {color:red;}
