/*
  $Id: stylesheet.css,v 1.56 2003/06/30 20:04:02 hpdl Exp $



  osCommerce, Open Source E-Commerce Solutions

  http://www.oscommerce.com



  Copyright (c) 2003 osCommerce



  Released under the GNU General Public License

*/



.boxText { font-family: Verdana, Arial, sans-serif; font-size: 10px; }

.errorBox { font-family : Verdana, Arial, sans-serif; font-size : 10px; background: #ffb3b5; font-weight: bold; }

.stockWarning { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #cc0033; }

.productsNotifications { background: #f2fff7; }

.orderEdit { font-family : Verdana, Arial, sans-serif; font-size : 10px; color: #70d250; text-decoration: underline; }



BODY {

  background: #ffffff;

  color: #000080;

  margin: 0px;

}



h1 { 

 font-family: Verdana, Arial, sans-serif;

 font-size: 20px;

 font-weight: bold;

 margin-bottom: 0;

 padding-bottom: 0;

}



h2 {

 font-family: Verdana, Arial, sans-serif;

 font-size: 14px;

 font-weight: normal;

 margin-bottom: 0;

 padding-bottom: 0;

}



A {

  color: #000080;

  text-decoration: none;

}



A:hover {

  color: #000080;

  text-decoration: underline;

}



A:visited {

  color: #000080;

}





FORM {

	display: inline;

}



TR.header {

  background: #ffffff;

}



TR.headerNavigation {

  background: #bbc3d3;

color: #fdfdfd;}



TD.headerNavigation {

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

  background: #ffffff;

  color: #0d018f;

  font-weight : bold;

}



A.headerNavigation { 

  color: #0810ff; 

}



A.headerNavigation:hover {

  color: #3f82ff;

}



TR.headerError {

  background: #ff0000;

}



TD.headerError {

  font-family: Tahoma, Verdana, Arial, sans-serif;

  font-size: 12px;

  background: #ff0000;

  color: #ffffff;

  font-weight : bold;

  text-align : center;

}



TR.headerInfo {

  background: #00ff00;

}



TD.headerInfo {

  font-family: Tahoma, Verdana, Arial, sans-serif;

  font-size: 12px;

  background: #00ff00;

  color: #ffffff;

  font-weight: bold;

  text-align: center;

}



TR.footer {

  background: #bbc3d3;

}



TD.footer {

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

  background: #bbc3d3;

  color: #ffffff;

  font-weight: bold;

  text-align: center;

}



P.footer{

  text-align: center;

}



.infoBox {

  background: #000080;

  border-left: 1px #000080;

}



.infoBoxContents {

  background: #f8f8f9;

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

  border-left: 1px #000080;

  text-align: left;

}



.infoBoxNotice {

  background: #FF8E90;

}



.infoBoxNoticeContents {

  background: #FFE6E6;

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

}



TD.infoBoxHeading {

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

  font-weight: bold;

  background: #000080;

  color: #ffffff;

}



TD.infoBox, SPAN.infoBox {

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

}



TR.accountHistory-odd, TR.addressBook-odd, TR.alsoPurchased-odd, TR.payment-odd, TR.productListing-odd, TR.productReviews-odd, TR.upcomingProducts-odd, TR.shippingOptions-odd {

  background: #f8f8f9;

}



TR.accountHistory-even, TR.addressBook-even, TR.alsoPurchased-even, TR.payment-even, TR.productListing-even, TR.productReviews-even, TR.upcomingProducts-even, TR.shippingOptions-even {

  background: #f8f8f9;

}



TABLE.productListing {

  border: 1px #4dbdf5 solid;

  border-style: solid;

  border-color: #b6b7cb;

  border-spacing: 1px;

background-color: #fcfcfc;

color: #03069c;}



.productListing-heading {

  font-family: Verdana, Arial, sans-serif;

  font-size: 14px;

  background: #fbfcff;

  color: #03069c;

  font-weight: bold;

}



TD.productListing-data {

  font-family: Verdana, Arial, sans-serif;

  font-size: 12px;

  font-weight: bold;

}



A.pageResults {

  color: #0000FF;

}



A.pageResults:hover {

  color: #0000FF;

  background: #FFFF33;

}





TD.pageHeading, DIV.pageHeading {

  font-family: Verdana, Arial, sans-serif;

  font-size: 20px;

  font-weight: bold;

  color: #000080;

background-color: #ffffff;}

TD.pageSubHeading, DIV.pageSubHeading {

  font-family: Verdana, Arial, sans-serif;

  font-size: 16px;

  font-weight: bold;

  color: #000080;

background-color: #9CCEFF}

DIV.productStockMessage{

  font-family: Verdana, Arial, sans-serif;

  font-size: 16px;

  font-weight: bold;

  color: #ffffff;

background-color: #000080;

}



TR.subBar {

  background: #FFFFFF;

}



TD.subBar {

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

  color: #000080;

background-color: #fdfdfd;}



TD.main, P.main {

  font-family: Verdana, Arial, sans-serif;

  font-size: 11px;

  line-height: 1.5;

}



TD.mainBold, P.mainBold {

  font-family: Verdana, Arial, sans-serif;

  font-size: 12px;

  line-height: 1.5;

  font-weight: bold;

}



TD.smallText, SPAN.smallText, P.smallText {

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

}



TD.jimText, SPAN.jimText, P.jimText {

  font-family: Verdana, Arial, sans-serif;

  font-size: 12px;

}



TD.accountCategory {

  font-family: Verdana, Arial, sans-serif;

  font-size: 13px;

  color: #408cdd;

}



TD.fieldKey {

  font-family: Verdana, Arial, sans-serif;

  font-size: 12px;

  font-weight: bold;

}



TD.fieldValue {

  font-family: Verdana, Arial, sans-serif;

  font-size: 12px;

}



TD.tableHeading {

  font-family: Verdana, Arial, sans-serif;

  font-size: 12px;

  font-weight: bold;

}



SPAN.newItemInCart {

  font-family: Verdana, Arial, sans-serif;

  font-size: 10px;

  color: #ff0000;

}



CHECKBOX, INPUT, RADIO, SELECT {

  font-family: Verdana, Arial, sans-serif;

  font-size: 11px;

}



TEXTAREA {

  width: 100%;

  font-family: Verdana, Arial, sans-serif;

  font-size: 11px;

}



SPAN.greetUser {

  font-family: Verdana, Arial, sans-serif;

  font-size: 12px;

  color: #2027ef;

  font-weight: bold;

}



TABLE.formArea {

  background: #fdfdfd;

  border-color: #2a94d6;

  border-style: solid;

  border-width: 1px;

}

TD.formAreaTitle {

  font-family: Tahoma, Verdana, Arial, sans-serif;

  font-size: 12px;

  font-weight: bold;

}



SPAN.markProductOutOfStock {

  font-family: Tahoma, Verdana, Arial, sans-serif;

  font-size: 12px;

  color: #c76170;

  font-weight: bold;

}



SPAN.productSpecialPrice {

  font-family: Verdana, Arial, sans-serif;

  color: #ff0000;

font-weight: bold;}



SPAN.errorText {

  font-family: Verdana, Arial, sans-serif;

  color: #ff0000;

}



.moduleRow { }

.moduleRowOver { background-color: #D7E9F7; }

.moduleRowSelected { background-color: #E9F4FC; }



.checkoutBarFrom, .checkoutBarTo { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #8c8c8c; }

.checkoutBarCurrent { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #000080; }



/* message box */



.messageBox { font-family: Verdana, Arial, sans-serif; font-size: 10px; }

.messageStackError, .messageStackWarning { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #ff0000; font-weight: bold; }

<!--NTisdale commented out to change from pink color background to red background  11-SEPT-2010-->
<!--.messageStackError, .messageStackWarning { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #ffb3b5; }-->

.messageStackSuccess { font-family: Verdana, Arial, sans-serif; font-size: 10px; background-color: #99ff00; }



/* input requirement */



.inputRequirement { font-family: Verdana, Arial, sans-serif; font-size: 10px; color: #ff0000; }





a:link.linkSpecs, a:visited.linkSpecs, a:hover.linkSpecs {

  font-family: Verdana, Arial, sans-serif;

  font-size: 13px;

  line-height: 1.5;

  color: #000080;

  text-decoration: underline;

  

}





a:link { font-family: Arial; color: #000080; }

a:hover { font-family: Arial;color: #FF0000; }

.para {font-family: "Arial"; font-size: 9pt;}



a:link.headings {color: #000080;width:100%; font-family:arial; font-weight:bold}



a:visited.headings {color: #194073; width:100%; font-family:arial; font-weight:bold}



a:hover.headings {color: #3099FF; text-decoration:none; width:100%; font-family:arial; font-weight:bold}



a:active.headings {color: #000080; width:100%; font-family:arial; font-weight:bold}



a.headings {background-repeat:no-repeat;font-family: arial;}





table {

	font: 9pt "arial", sans-serif

}

body {

}



div.main{

	color: #000080;

	background-color: #ffffff; /*themecolour6;*/

      border: 1px solid #000080;

      border-left: 1px solid #000080;

      border-right: 1px solid #000080;

	font-family: "arial", sans-serif;

	font-size: 9pt;

	width: 1007px;

	margin-left: auto; 

	margin-right: auto;



}



div.mainbg{

  width: 100%;

  background-color: #fff;

  

}



jim {

        color: #ffffff;

        }

        

p {

	margin-top: 0px;

	margin-bottom: 0px;

	}

	blockquote {

	margin-top: 0px; 

	margin-bottom: 0px; 

	color: #000080;

	margin-right: 0px;

}

ol {

	margin-top: 0px; 

	margin-bottom: 0px; 

	color: #000080

}



.imageborder {

	border-left-width: 1px;

	border-left-style: solid;

	border-left-color: #FFFFFF;

}



.imagebox {

	border: 1px solid #FFFFFF;

}



#content ul {

	color: #000080;

	list-style-image: url('images/indexv3_files/indexv3_bullet.gif');

      text-align: left; font-family:arial; font-size:10pt; line-height:150%; margin-left:20px; margin-right:3px; margin-top:3px; margin-bottom:3px

}

#rightcolumn ul {

	color: #000080;

	margin-top: 3px;

	margin-bottom: 3px;

	margin-left: 17px;

	list-style-image: url('images/indexv3_files/indexv3_bullitt.gif');

      line-height: 150%; 

      margin-right: 3px;

}

#leftcolumn ul {

	color: #000080;

	margin-top: 3px;

	margin-bottom: 3px;

	margin-left: 13px;

	list-style-image: url('images/indexv3_files/indexv3_bullitt.gif');line-height:150%; margin-right:3px;

}

h1 {

	font-size: 12pt;

	color: #000080;/*themecolour5;*/

	margin-top: 0px;

	margin-bottom: 3px; font-family:arial;

	font-weight:bold;

	text-align: left;

}

h2 {

	font-size: 16px;

	color: #000080;

	margin-top: 0px;

	margin-bottom: 3px;

}

#content a:link {

	color: #194073;/*themecolour5;*/

}

#content a:visited {

	color: #c31f2d;

}

#content a:link:hover {

	color: #3099ff;/*themecolour1;*/

}

#leftcolumn a:link {

	color: #194073;/*themecolour5;*/

}

#leftcolumn a:visited {

	color: #999999;

}

#leftcolumn a:link:hover {

	color: #3099ff;/*themecolour1;*/

}

.leftcoltext {

	padding: 10px 10px 10px 10px;

	text-align: left;

}

#rightcolumn a:link {

	color: #194073;/*themecolour5;*/

}

#rightcolumn a:visited {

	color: #999999;

}

#rightcolumn a:link:hover {

	color: #3099ff;/*themecolour1;*/

}

.rightcoltext {

	padding: 10px;

	color: #666666;

	background-color:   #e2f1ff;/*themecolour1$ 86.1%, 100%;*/

	border: 1px solid #3099ff;/*themecolour1;*/

}



#leftcolumn {

	color: #333333;

	background-color: #d5eaff;/*themecolour1%180;*/

	background-color:   #d2e9ff;/*themecolour1$ 78.5%, 100%;*/

	padding: 10px;

	border: 1px solid #3099ff;/*themecolour1;*/

}



#leftcolumn1 {

	background-color: #ffffff;/*themecolour1%180;*/

	background-color:   #ffffff;/*themecolour1$ 78.5%, 100%;*/

	padding: 0px;

	border: 0px solid #3099ff;/*themecolour1;*/

}



.parahead {

	font-size: 13px;

	font-weight: bold;

	color: #257008;/*themecolour9;*/

}



h3 {

	font-size: 10pt;

	color: #333333;

	font-weight: bold;

	padding-top: 0px;

	padding-bottom: 0px;

}



td.columnleft{

  padding-left: 5px;

  padding-right: 5px;

  padding-top: 10px;

  border-right: 1px solid #000080;

}



/* popup menus */

#pophorizontal{

	float: left; /* to keep the other floating objects contained*/

	position: relative; /* This can also be fixed or absolute*/

	width: 100%;

	

	/*Format */

	background-color: #f8f8f9;

	color: #000080;

	font-family: Arial, Helvetica, sans-serif;



}



#pophorizontal ul{

	float: left;

/* 	white-space: nowrap; */

	margin: 0;  

	padding: 0;  

	width: 100%;

}



#pophorizontal li:hover{

	background-color: #000080;

}



/* add more for each extra submenu level*/

#pophorizontal ul li,

#pophorizontal ul li ul li,

#pophorizontal ul li ul li ul li,

#pophorizontal ul li ul li ul li ul li

{ 

	margin: 0;

	padding: 0;

	float: left;

	list-style-type: none;

	position: relative;  

	width:100%;

}

/* add more for each extra submenu level*/

#pophorizontal ul li ul,

#pophorizontal ul:hover li ul li ul,

#pophorizontal ul:hover li ul li ul li ul,

#pophorizontal ul:hover li ul li ul li ul li ul

{ 

	float: right;

	display: none;

	z-index: 1000;

	width: 40em;

	position: absolute;

	left: 160px;

	top: 0px; /* Required with some value or

	the effect will not work*/

}









/* For the remaining submenu levels*/

/* add more for each extra submenu level*/

#pophorizontal  > ul > li:hover > ul,

#pophorizontal  ul  li  ul  li:hover  ul,

#pophorizontal  ul  li  ul li ul li:hover  ul,

#pophorizontal  ul  li  ul li ul li ul li:hover  ul{

	float: right;

	display: block;

	position: absolute;

	

	width: 40em;

	left: 160px;

	top: 0px; /* Required with some value or

	the effect will not work*/

}

#pophorizontal ul li:hover ul li{ 

	display: block;

 	float: left;   

 	width: 100%;

}







#pophorizontal ul li a{

	float: left;

	display: block;

	

	text-decoration: none;

	color: #000080;

	padding: 0 .5em 0 .5em;

}

/* The on state for the link when you are on the submenu.

This should be before the hover state for the link itself*/

#pophorizontal ul li:hover > a{

	background-color: #000080;

	color: #f8f8f9;

}

#pophorizontal ul li a:hover{ 

	background-color: #000080; 

	color: #f8f8f9; 

}



#pophorizontal ul li ul li a{ 

	float: none;

	

	border-color: #000080;  

	border-style: solid; 

 	border-width: 1px;  

	

 	background-color: #f8f8f9;

 	color: #000080;

	



 	white-space: normal;

 }



#pophorizontal ul li ul li:first-child a{

	border-width: 1px 1px 1px 1px;

}





/*******************************************************************************/





/* popup menus */

#popvertical{

	float: left; /* to keep the other floating objects contained*/

	position: relative; /* This can also be fixed or absolute*/

	width: 100%;

      margin: 0 auto;

	

	/*Format */

	background-color: #000080;

	color: #ffffff;

	font-family: Arial, Helvetica, sans-serif;

	text-align: left;



}



#popvertical ul{

	float: left;

	white-space: nowrap;

	margin: 0;  

	padding: 0;  

	text-align: center;

}



/* add more for each extra submenu level*/

#popvertical ul li{

	margin: 0;

	padding: 0;

	float: left;

	list-style-type: none;

	position: relative;  

	text-align: left; /* was left */

      /*width: 93px;  /* was not specified */

}

#popvertical ul li ul li,

#popvertical ul li ul li ul li,

#popvertical ul li ul li ul li ul li

{ 

	margin: 0;

	padding: 0;

	float: left;

	list-style-type: none;

	position: relative;  

	width: 100%;

}



/* add more for each extra submenu level*/

#popvertical ul li ul{

	float: right;

	display: none;

	z-index: 1000;

	width: 20em;

	position: absolute;

	left: 0em;

	top: 1.2em; /* Required with some value or

	the effect will not work*/



}

#popvertical ul li ul li ul,

#popvertical ul li ul li ul li ul,

#popvertical ul li ul li ul li ul li ul

{ 

	float: right;

	display: none;

	z-index: 1000;

	width: 20em;

	position: absolute;

	left: 20em;

	top: 0em; /* Required with some value or

	the effect will not work*/



}



#popvertical ul:hover li ul li ul,

#popvertical ul:hover li ul li ul li ul,

#popvertical ul:hover li ul li ul li ul li ul

{ 

	float: right;

	display: none;

	z-index: 1000;

	width: 20em;

	position: absolute;

	left: 20em;

	top: 1.2em; /* Required with some value or

	the effect will not work*/

}







/* First submenu level*/

#popvertical  > ul > li:hover > ul{

	display: block; /*unhide it*/

	

	float: right;	

	position: absolute; /* It needs to be absolute

	for the effect to work.*/

	

	width: 20em;

	top: 1.2em; /* This places the the bottom of the 

	ul 1.1em from the bottom of the enclosing li. This 

	is the important part of the effect.*/

        left: 0em;

	

}

/* For the remaining submenu levels*/

/* add more for each extra submenu level*/

#popvertical  ul  li  ul  li:hover  ul,

#popvertical  ul  li  ul li ul li:hover  ul,

#popvertical  ul  li  ul li ul li ul li:hover  ul{

	float: right;

	display: block;

	position: absolute;

	

	width: 40em;

	left: 20em;

	top: 0em; /* Required with some value or

	the effect will not work*/

}

#popvertical ul li:hover ul li{ 

	display: block;

 	float: left;   

 	width: 100%;

}







#popvertical ul li a{

	float: left;

	display: block;

	font-size: 15px;



	text-decoration: none;

	color: #ffffff;

	padding: 0 .5em 0 .5em;

}

/* The on state for the link when you are on the submenu.

This should be before the hover state for the link itself*/

#popvertical ul li:hover > a{

	background-color: #ffffff;

	color: #000080;

}

#popvertical ul li a:hover{ 

	background-color: #ffffff; 

	color: #000080; 

}



#popvertical ul li ul li a{ 

	float: none;

	

	border-color: #000080;  

	border-style: solid; 

 	border-width: 1px;  

	

 	background-color: #000080;

 	color: #ffffff;

	



 	white-space: normal;

 }



#popvertical ul li ul li:first-child a{

	border-width: 1px 1px 1px 1px;

}



.headerbanner{

/* background-image: url(images/cleansurroundings_headerbanner_left.jpg); 

background-repeat: no-repeat; 

background-position: top left;

background-color: #FFFFFF; /* was #E0E0F0 */

color: #000000; /* was #FFFFFF */

font-size: 16px;

}

.headerbanner2 {

/* background-image: url(images/cleansurroundings_headerbanner_right.jpg); 

background-repeat: no-repeat; 

background-position: top left;

background-color: #FFFFFF; /* was #E0E0F0 */

color: #000000; /* was #FFFFFF */

font-size: 16px;

}



#cs_header {

  background-image: url(images/cleansurroundings_headerbanner.jpg); 

  background-repeat: no-repeat; 

  background-position: top left;

  height: 159px;

}