html, body {
height: 100%; width:100%; 
}

* {
font-family: Raleway,Arial, Helvetica, sans-serif;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
font-size: 1.0em;
color:#333333;
text-decoration: none;
text-align:left;
margin:0; 
padding:0;
border:0px;
list-style:none; 
font-weight:normal ;
letter-spacing:normal;
-webkit-text-size-adjust: 100%; 
appearance: none;
border-radius:0px;
z-index:1;
-webkit-appearance: none;
-webkit-border-radius: 0;
border-radius: 0;
-moz-border-radius: 0;
background-repeat:no-repeat
}

div, p , a, span, input , strong, em, table, tr, td  { color:inherit; font-size:inherit; }
 
 

strong{ font-weight:bold;}

p{ margin:6px 0 2px 0; padding:0;}

.show{ display: block;}
.hide{ display: none;}
 .show{ display: block;}
.hide{ display: none;}
.fadeContent{  
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
filter: alpha(opacity=40);
-moz-opacity: 0.4;
-khtml-opacity: 0.4;
opacity: 0.4;

-webkit-transition:all 0.3s ease-in-out;
-moz-transition:all 0.3s ease-in-out;
-o-transition:all 0.3s ease-in-out;
transition:all 0.3s ease-in-out;
}

 
#ajaxContainer{
position: fixed;
top:0px;
left:0px;
bottom:0px;
right:0px;
background-image:url(../images/bgTrans.png);
background-repeat:repeat;
z-index:1000; display:none
}

/* all ajx windows & viewers - position per usage*/
#closeWindow,
.closeWindow,
a.closeWindow,
span.closeWindow {
position:absolute;
right:12px;
top:12px;
display:block;
font-size:1px;
text-indent:-9999px;
width:30px;
height: 30px;
background-position:50% 50%;
background-repeat: no-repeat;
background-image: url(../images/icons/deleteWhite.png);
text-decoration:none;
/*  border:1px solid;border-color:#e9e9e9;*/
  background-color:#e9e9e9;
cursor:pointer;
z-index:1000
	}
	
	.closeWindow:hover{background-color:#999;  }

.ajxBasket  .closeWindow{   }


#errorMessage{ /* JS alerts div */
	position: absolute;
	top:40%;
	left:50%;
	border:4px solid #ff0000;
	padding:10px 12px;
	width:250px;
	margin-left:-120px;
	background:#fff;
	background-image:url(../images/icons/deleteGray.png);
	
	background-position:calc(100% - 10px) 10px;
	cursor:pointer
} 


#loadingContent{
position: fixed;
top:0px;
left:0px;
bottom:0px;
right:0px;
background-image:url(../images/bgTrans.png);
background-repeat:repeat;
 z-index:1000; display:none;
} 

#loadingContent span{
position:absolute;   
top:calc(50% - 18px); 
left:calc(50% - 18px);   text-align:center
}
 
#loadingContent span  img{
vertical-align:middle; margin:0 auto;
height:35px; 
z-index:1001;
}


/*outer*/
#header{ width:100%; position:relative }

#contentWrapper{
clear: both; 
text-align:left;
z-index: 1;
 
margin: 0px auto 0px auto;
min-height:525px;
height:auto !important;
height:525px;
background-color:#FFFFFF;
}

#ajaxContent{  }

#contentWrapperClear{ height:10px; width:100%; clear:both; display:block}	

.pageBanners{ width:100%; margin:0 auto 10px auto}
.pageBanners img{ width:100%; margin:0 auto; }



.white ,  a.white:link,a.white:visited,a.white:hover { color:#FFFFFF ;}
.red ,  a.red:link, a.red:visited { color: #FF0000 ;}
.red_bold ,  a.red_bold:link, a.red_bold:visited { color: #FF0000 ; font-weight:bold;}
.orange, a.orange{color:#ff6600;}
.green, a.green:link,a.green:visited{
color: #8CBC00;
}
.blue, a.blue:link,a.blue:visited { color: #006699; }
.gray, a.gray:link,a.gray:visited{color: #606060}
.silver ,  a.silver:link,a.silver:visited,a.silver:hover {color: #cccccc;}
.pink ,  a.pink:link,a.pink:visited,a.pink:hover{color:#FF0099;}
.black ,  a.black:link,a.black:visited,a.black:hover{color:#000;}
.clr{ display:block; clear:both}


.italic{font-style:italic;}
.bold ,  a.bold:link, a.bold:visited {font-weight:bold;}
 

.block{ clear:both; display:block}

.smaller{
font-size: 0.8em;
}
.evenSmaller{
font-size: 0.7em;
}

.bigger{
font-size: 1.1em;
}
 
.evenBigger{
font-size: 1.2em;
}

.underline{ text-decoration:underline}

.contentRight p a { color:#003366; text-decoration:underline}


    

.contentRight .Double_Border,
.Double_Border{border:2px solid #e1e1e1; padding:5px; margin:5px 0; -moz-border-radius: 3px;
-webkit-border-radius:3px;
border-radius: 3px; }


.Own_Line{ clear:both; margin:5px 0 5px 0; }
 
	
	
.contentRight .tickMenu ,
.tickMenu { 	margin: 4px 0 4px 0;   padding: 5px 5px 5px 5px; }

.contentRight .tickMenu li ,
.tickMenu li{
list-style:none;
margin:4px 0;	  
padding:0px 0px 3px 22px;
background-image: url(../images/tick.png);

background-position:2px 4px;
font-weight: normal; font-style: normal; font-weight: normal	
} 

.tickMenu li p { margin:0; padding:0}

.contentRight .tickMenu li  a,
.tickMenu li a{
color:#004E75;
} 


hr{
border:0; 
height:2px; 
margin:4px auto; width:100%; 
clear: both;
background-color: transparent;
background-image:url(../images/semiTransLine.png);
background-repeat:repeat-x; background-position:left top;
} 



/* bgs and gradients */
.bgBlack{ 	background-color: #333333; color:#FFFFFF;}

.bgBlueDk{	background-color: #003366; 	color:#FFFFFF;}

.bgBlueLt{ background-color: #7195A9;color:#FFFFFF;text-shadow:1px 1px #777;}

.bgGrayLt{ 	background-color: #D2D2D2;	color:#333;}

.bgGrayMid{ background-color:#A3A3A3;color:#FFFFFF;/*text-shadow:1px 1px #999;*/}

.bgGrayDk{ 	background-color: #6C6C6C; 	color:#FFFFFF;}

.bgGreen{ 	background-color: #99CC00; 	color:#FFFFFF;}

.bgRed{ background-color: #D40000;color:#FFFFFF; }

.bgRedDk{ background-color: #780000;color:#FFFFFF; } 	

.gradient{
background-image:url(../images/gradientBG.png);
background-position:left top;
background-repeat:repeat-x; 
}

/* bgs and gradients */



/* ####### buttons  */

.buttons25,
.buttons50,
.buttons75, 
.buttons100, 
.buttons125, 
.buttons150,  
.buttons175, 
.buttons200,
.buttons250,
.buttons300,
.buttons350,
.buttonsFULL  {
background: transparent;
font-family: Arial, Helvetica, sans-serif;  
text-align:left;
cursor:pointer;
border: 0px;
height:40px; line-height:40px;
background-image:url(../images/buttonsBG.png);
color:#FFFFFF;
padding: 0 15px; text-align:center; position:relative; 
}





.buttonsRed{
color: #FFFFFF;
background-position: left 0px;
background-color: #D81313; 
}

.buttonsGray {
color: #FFFFFF;
background-position: left -44px;
background-color: #7D7D7D; 
}

.buttonsLtGray {
color: #000;
background-color: #DBDBDB;
background-position: left -88px; 
}

.buttonsGreen {
color: #FFFFFF;
background-position:left -132px;
background-color: #95BB28; 
}

.buttonsBlue  {
color: #FFFFFF;
background-position: left -176px;
background-color: #385F87;text-shadow:1px 1px #333;
}

.buttonsBlack  {
color: #FFFFFF; 
background-color: #424242;
background-position:left bottom
}

.buttons25:active ,
.buttons50:active ,
.buttons75:active , 
.buttons125:active , 
.buttons150:active ,  
.buttons175:active , 
.buttons200:active ,
.buttons250:active ,
.buttonsFULL:active {	
background: #424242; 
color:#FFFFFF;  }







.buttonsLoading{
background-image:url(_ajax/loading1.gif);

background-position: 50% 50%;  
}

.buttonLinks,
a.buttonLinks,
#contentFull a.buttonLinks,
.contentRight a.buttonLinks,
.contentRight p a.buttonLinks { 
line-height: 40px;height: 40px;
display:inline-block; padding: 0 15px;
color: #fff   ; text-decoration:none ; 
}

.buttonLinks:hover,
a.buttonLinks:hover,
#contentFull a.buttonLinks:hover,
.contentRight a.buttonLinks:hover,
.contentRight p a.buttonLinks:hover{ background:#333333}

/* over ride text as rest are white*/
a.buttonsLtGray,
#contentFull   a.buttonsLtGray,
.contentRight a.buttonsLtGray,
.contentRight p a.buttonsLtGray{
color: #666666; 
}	

/* for blocking buttons out */

.buttonWrapper, 
div.buttonWrapper, 
p.buttonWrapper, 
#contentFull		p.buttonWrapper,
#contentLEFT		p.buttonWrapper,
.contentRight p.buttonWrapper{ 
height:34px; display:block; clear:both; margin:6px auto
}

/* button icons*/
.buttons25  span ,
.buttons50 span ,
.buttons75 span ,
.buttons100 span ,
.buttons125 span ,
.buttons150 span ,
.buttons175 span , 
.buttons200 span ,
.buttons250 span ,
.buttonsFULL  span {  background-position: right 50%;  position:absolute; height:100%; width:30px; right: 10px; top:0px; } 


span.iconArrowW{ background-image:url(../images/icons/arrowRwhite.png); }	
span.iconArrowB{	background-image:url(../images/icons/arrowR.png);}	
span.iconPlusW{background-image:url(../images/icons/plusWhite.png);}	
span.iconPlusB{	background-image:url(../images/icons/plus.png);}	
span.iconMinusW{	background-image:url(../images/icons/minusWhite.png);}	
span.iconMinusB{	background-image:url(../images/icons/minus.png);}	

 

.buttonsTrash, a.buttonsTrash, 
.contentRight .buttonsTrash,
.contentRight a.buttonsTrash {
cursor: pointer;
height: 25px;
width: 25px;
background-image: url(../images/trash.png);
background-color: transparent;
border: 0;
background-repeat: no-repeat;
background-position: center;
text-decoration:none
} 
 
 

.standardNav, ul.standardNav{    
margin: 0px 0px 20px 0px  
}

.contentFull .standardNav li ,
.contentRight .standardNav li ,
.standardNav li { display:block; clear:both;  margin:0; padding:0;}


.standardNav li h3{
display:block;
text-decoration:none; 
font-size:1.1em;	
font-weight:bold;
padding: 6px 0 0 0px;
margin:0px auto 0 auto;
border:0px;
background-color:#fff;
cursor:pointer;
position:relative;
font-size:1.4em;
font-weight: normal;
display:block; position:relative
}


.contentFull .standardNav li a,
.contentRight .standardNav li a,
.standardNav li a{
display:block;
text-decoration:none;
font-size:1em;
margin:0px 0;
background-color:#FFFFFF;
padding: 10px 0 10px 25px; 
background-image:url(../images/icons/arrowRgrayThin.png);

background-position:6px 12px;
background-size:8px;
border-bottom:1px solid #e1e1e1;
color:#000; 
display:block; 
font-weight: normal
}

.standardNav li a:hover{ background-color:#f1f1f1}

.standardNav li ul li { background:none; border:none}



.standardNav li ul{ padding:0 0 0px 0} 

.standardNav li a.docLink{ padding-left:30px;  background-size:auto;  background-image:url(../images/fileTypes/word.png) ;background-position:left 50%;}
.standardNav li a.pdfLink{ padding-left:30px; background-size:auto; background-image:url(../images/fileTypes/pdf.png);background-position:left 50%;}
.standardNav li a.xlLink{ padding-left:30px; background-size:auto; background-image:url(../images/fileTypes/xl.png) ;background-position:left 50%;}
.standardNav li a.imgLink{ padding-left:30px; background-size:auto; background-image:none; padding-left:0px}
.standardNav li a.imgLink img{ padding-left:30px;  background-size:auto;  padding:0; height:80px; display:inline-block; margin:0 0px  0px 0; white-space:nowrap;}



/* ///  widgets ///// */

#contactFormWrapper h3{
display:block;
text-decoration:none;
clear:both;
cursor: default;
width:100%;
padding:0 15px;
margin: 0px auto 0 auto;
border-radius:  0px 0px;
font-size:0.8em;
font-weight:normal;
height:44px;
line-height:44px;
text-align:left;
background-color:#666666;
color:#FFFFFF;
text-transform: uppercase;
}



 




/*gallery*/ 

#galleryWrap{ padding:5px 0; clear:both;   }

#galleryWrap h1{ font-size:1.1em; font-weight:normal; text-align:left; padding:5px 0; margin: 0px 0 0 0} 
 
  


#googleMapOuter{
height:400px;
width:100%;
border:2px solid #ccc;
padding:5px;
-moz-border-radius: 1px;
-webkit-border-radius: 1px;
border-radius:  1px; 
margin:10px 0 0 0 
}

@media only screen and (orientation:landscape)   { 
#googleMapOuter{	height:500px;}
}

@media only screen and (orientation:portrait)   { 
#googleMapOuter{	height:300px;}
}



#googleMap { 
height:100%; width:100%;
display:block
}

#googleMap p{ margin:0; padding:3px; font-size:14px; text-align:left; width:200px; height:auto; overflow:visible; font-family:Arial, Helvetica, sans-serif}	

#googleMap img{ max-width:inherit; max-height:inherit}
#googleMap p  img { width:120px; display:block; padding:0px; border:1px solid #fff; margin: 6px 0 }




 


/* cookies */

#cookieAlertWrap{
width:100%;
position:fixed;
z-index:1000;
bottom:0px;
right:0px  ;
padding:0px 20px;
height:80px;
background-image:url(../images/cookiesBg.png);
background-repeat:repeat
}

#cookieAlertWrap p{ 
font-size:14px; 
color:#e1e1e1; 
padding :0px; 
margin:0px;  line-height:80px;
}

#cookieAlertWrap p strong{
display:inline-block; color:#FFFFFF; padding-right:10px;
} 

#cookieAlertWrap #closer{
padding:0px;
height:34px;
width:34px;
text-align:center;
color:#fff;
font-size:1px;
text-indent:-2000px;
position:absolute;
right:12px;
top:22px;
cursor:pointer;
background-image:url(../images/icons/deleteWhite.png);

background-position:50% 50%;
background-color:#666666;
-webkit-transition: all 500ms ease-in-out 0s;
-moz-transition: all 500ms ease-in-out 0s;
-o-transition: all 500ms ease-in-out 0s;
transition: all 500ms ease-in-out 0s;

}
#cookieAlertWrap #closer:hover{ 
background-color:#FFFFFF; background-image:url(../images/icons/delete.png);
-webkit-transition: all 500ms ease-in-out 0s;
-moz-transition: all 500ms ease-in-out 0s;
-o-transition: all 500ms ease-in-out 0s;
transition: all 500ms ease-in-out 0s;
}

#cookieAlertWrap #pageLink{
text-decoration:none;
font-weight:bold;
display:inline-block;
margin:0;
padding: 0px 0 0 10px;
color:#99CC00;
text-decoration:underline;
}
#cookieAlertWrap #pageLink:hover{ color:#99CC00}



/* footer globals */
#footerWrap{
min-height:500px;
background-color: #333333; /* non w3*/
background-image: url(../images/footerBg.png), url(../images/semiOverlay.png), linear-gradient(  to bottom, #323232, #222	); 
background-position:top left , top left , top left;
background-repeat: repeat-x , repeat ,  repeat 
} 




/*icon*/
#socialWrap li a span {
display:block;
width:42px;
height:42px;
line-height:42px;
background-position:50% 50%;

border-radius:0px;
background-color: none;
-webkit-transition: all 300ms ease-in-out 0s;
-moz-transition: all 300ms ease-in-out 0s;
-o-transition: all 300ms ease-in-out 0s;
transition: all 300ms ease-in-out 0s;
border:1px solid;
border-color: #fff;
background-size:22px;
border-radius:22px;
}
 
  
#socialWrap #twitter span{ background-image:url(../images/social/twitter.png)   }
#socialWrap #facebook span {	background-image:url(../images/social/facebook.png)}
#socialWrap #googlePlus span{	background-image:url(../images/social/googleplus.png)}
#socialWrap #linkedIn span{ background-image:url(../images/social/linkedin.png) }
#socialWrap #rss span{ background-image:url(../images/social/rss.png)  }
#socialWrap #pinterest span{ background-image:url(../images/social/pinterest.png) }
#socialWrap #tumblr span{ background-image:url(../images/social/tumblr.png) }
#socialWrap #soundcloud span{ background-image:url(../images/social/soundCloud.png) }
#socialWrap #instagram span{background-image:url(../images/social/instagram.png) ;}
#socialWrap #youtube span{background-image:url(../images/social/youtube.png)  }






#footer ul,
#footer ul li ,
#footer ul li a ,
#footer ul li span ,
#footer ul li strong {color:#fff}
#footer ul li a:hover {color:#FFFFFF; text-decoration:none} 
/*animated hover */

#socialWrap li a:hover span {
background-color:#999;
background-size:26px;
border-color: #fff;
background-color: #333;
}


#footer #siteInfo li#siteBy{
	display:block;
	clear:both; width:100%;
	text-align: right;
}

#footer #siteInfo #siteBy a{
	display:block;
	font-size: 0.7em;
	text-align:right;
	color:#ccc
} 
 

#footer #siteInfo  #siteBy a span {
	border-left:1px solid;
	border-color:#999;
	padding:  0  0 0 4px;
}



#footer #cardPayments{ display:block; clear:both; margin:5px auto;  }
#footer #cardPayments li{ display:inline}
#footer #cardPayments li p{
display:block;
clear:both;
font-size:0.7em;
color:#FFCC00;
font-weight: 300;
height:24px;
line-height:26px;
background-image:url(../images/cardLogos/padlock.png);

background-position:left 50%;
padding:0px 0 0 25px;
background-size:auto auto;
text-transform:uppercase;
}
#footer #cardPayments li img{ display:inline-block; margin: 5px 5px 0 0 ; height:30px; border:2px solid #fff}


#footer #pageTop { position:fixed; bottom:10px; right:20px;width:50px; height:50px; display:none	} 

#footer #pageTop a {
-webkit-transition: all 300ms ease-in-out 0s;
-moz-transition: all 300ms ease-in-out 0s;
-o-transition: all 300ms ease-in-out 0s;
transition: all 300ms ease-in-out 0s;
background-position: 50% 45% ; 
 width:50px; height:50px;
 border-radius:25px;
 display:block;
 background-color:#444;
z-index:1000; background-image:url(../images/pageTop.png);
}

#footer #pageTop a:hover{  background-color:#000; } 
#footer #pageTop a span{ display:none}







/* ///// FORMS ////// */



 
/* ///// FORMS ////// */
input  , select {border-radius:0; }

select {
-webkit-appearance: none;

appearance: none;
 padding: 0 5px 0 4px; 
height:36px; 
border:2px solid #ccc;
background-color:#fff;

/* to be added when FF works 
-moz-appearance: none;
	background-image: url(../images/icons/arrowDgray.png);
	background-position :calc(100% - 8px) 50%;
	*/
}

 @media screen and (-webkit-min-device-pixel-ratio:0) {  /*  safari */
 select {
	background-image: url(../images/icons/selectDD.png?5);
	background-position :right 50%;
	
	-webkit-appearance:none;
	padding: 0 48px 0 10px; 
 height:44px; border:1px solid #ccc;  
  }  }

select  option{   padding:2px 4px; margin: 0 2px; font-size:1em  }
select optgroup{ padding:6px 4px; margin:0;font-style:normal; font-weight:bold} 

input[type=text] , input[type=email] , input[type=password]  , input[type=telephone]  { border:2px solid #ccc; height:36px; padding:5px;}
textarea{border:2px solid #ccc; padding:5px;}

input[type=text].inputErr, input[type=password].inputErr,  input[type=email].inputErr, select.inputErr { border-color:#FF0000;} 

::-webkit-input-placeholder { color:#c1c1c1; }
::-moz-placeholder { color:#c1c1c1; } /* firefox 19+ */
:-ms-input-placeholder { color:#c1c1c1; } /* ie */
input:-moz-placeholder { color:#c1c1c1; }


.checkboxRadioList{ position:relative; text-align:left}

.hiddenInput, 
.checkboxRadioList input[type=radio],
.checkboxRadioList  input[type=checkbox]{ position:absolute; left:-99999px; top:0}

.checkboxRadioList  input[type=radio]  + label,
.checkboxRadioList  input[type=checkbox]  + label { 
display:block; clear:both; 
padding:2px 0 0 30px; 
background-image:url(../images/checkBoxes.png);  
background-position:left 0px;  
min-height:26px;
font-size:0.9em;  
margin:5px auto; 
cursor:pointer;
color:#666666}  

.checkboxRadioList  input[type=radio]  + label:hover, 
.checkboxRadioList  input[type=checkbox]  + label:hover{
 background-position:left -100px;
}


.checkboxRadioList  input[type=radio]:checked  + label,
.checkboxRadioList  input[type=checkbox]:checked  + label{ color:#333 ; background-position: left -200px}

.checkboxRadioList input[type="radio"]:disabled + label  ,
.checkboxRadioList input[type="radio"]:disabled + label:hover  ,
.checkboxRadioList input[type="checkbox"]:disabled + label,
.checkboxRadioList input[type="checkbox"]:disabled + label:hover  {
	font-weight: normal;
 cursor:default;background-position:left 0px;  
 
 -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
opacity: 0.5;

 text-decoration:none;color:#666666
} 


/*right align */
.checkboxRadioListRight{  text-align:right}
.checkboxRadioListRight  input[type=radio]  + label,
.checkboxRadioListRight  input[type=checkbox]  + label {
 text-align:right; 
 background-position:right 0px;
 padding:3px 30px  0 0 ;
 }
 
.checkboxRadioListRight  input[type=radio]  + label:hover, 
.checkboxRadioListRight  input[type=checkbox]  + label:hover{
 background-position:right -100px;
}
 
.checkboxRadioListRight  input[type=radio]:checked  + label,
.checkboxRadioListRight  input[type=checkbox]:checked  + label{ 
 background-position:right -200px; }
 
.checkboxRadioList  input[type=radio]   + label.orange  { font-style:italic }


#contactForm ul li label{ font-size:0.8em;padding:3px 0 0 30px; } 
 
/* already check box list - over ride */ 
#samplesList{ margin:10px auto; padding:10px 15px ; border:3px solid #e5e5e5; border-radius:4px;} 
#samplesList li { margin: 14px 0} 
#samplesList li label{ margin-bottom:0px}
/*#samplesList li img{  max-width:50px; display:inline-block; margin-right:5px; border:2px solid #e1e1e1; padding:5px; }*/
#samplesList li a  {
display:inline-block;
font-size:0.8em;
height:16px; line-height:14px;
text-transform:uppercase;
background-image:url(../images/icons/arrowRGray.png);
background-position:right 50%;
padding: 0px  15px 0 0px ;

color:#006699;
font-weight:bold
} 

#samplesList li a:hover{ background-image:url(../images/icons/arrowR.png); text-decoration:underline}

#updateSamples{ margin:10px 0; display:none }
 
 
/* safari 
@media screen and (-webkit-min-device-pixel-ratio:0) {  
select{
	background-image: url(../images/icons/selectDD.png);
	background-position :right 50%;
	
	-webkit-appearance:none;
	padding: 0 48px 0 10px; 
 height:44px; border:1px solid #ccc;  
} 
}
*/

#loginContainer, #registerStartWrap, 
#registerForm, 
#updateForm{
	border:1px solid #e1e1e1;
	padding: 10px 20px 20px 20px;
	margin:10px 0 0 0;
	width:48%;
	background-color:#f9f9f9;
}

#registerForm,  #updateForm{ width:100%;}

#loginContainer{ float: left}
#registerStartWrap{ float: left; margin-left:20px;}




form h5{
font-size:1em;
color:#333;
font-weight:bold;
padding:5px 0 0 0;
margin:0px 0 0px 0;
text-shadow: 1px 1px #fff;
}
.rows{ margin: 0 0 4px 0;}
.buttonRow{ margin:10px auto 0 auto}

/* account page boxes*/
#loginContainer hr, 
#registerStartWrap hr,
#registerForm hr { 
clear:both; display:block; margin:15px auto; border:0; background:none; background-color:#CCCCCC; height:2px;}

#forgottenLink{
	color: #006699;
	cursor: pointer;
}
#forgottenLink:hover{ text-decoration:underline}

/* account page links*/
#accountLinks{ display:block; clear:both; padding:10px 0;}
#accountLinks li{ 
display:block; clear:both; 
height:44px;  
 
padding: 12px 0 0 32px;
margin:0;
}
#accountLinks li a{font-weight:bold;
font-family: Arial, Helvetica, sans-serif;
display:inline-block;   color:#006699;  font-size:1.1em;
}

#accountLinks li a:hover{ color:#00496D }
#accountLinks li#accountBasketLink {background-image:url(../images/accountPage/accountCartIcon.png);background-position:2px 8px;}
#accountLastPageLink {background-image:url(../images/accountPage/accountLastPage.png);background-position:0 8px;}
#accountWishListLink {background-image:url(../images/accountPage/accountwishListIcon.png);background-position:0 12px;}
#accountSamplesLink { background-image:url(../images/accountPage/accountSamplesIcon.png); background-position:0 10px;  }
#accountDetailsLink{background-image:url(../images/accountPage/accountEditIcon.png);background-position:0 10px;  }

#accountOrdersLink{
background-image:url(../images/accountPage/accountOrdersIcon.png);
background-position:1px 10px;
}

#accountSignOutLink{
background-image:url(../images/accountPage/accountIconSignOut.png);
background-position:0 10px;
}

 
  
 

.errorMessage{ color:#FF0000; font-size:0.8em; font-weight:bold}

#loginContainer input  , 
#registerStartWrap input  {width:100%;}

#loginContainer label, 
#registerStart label , 
#registerForm label,
#updateForm label {
font-weight:bold;
display:block;
font-size:0.8em;
color:#2D7C90;
text-shadow:1px 1px #fff;
padding:8px 0 2px 0;
}

#registerForm input[type=text] , 
#registerForm input[type=email] ,
#registerForm input[type=telephone]  { width:100%;}
#registerForm .inputsDD{  width:100%;}

#updateForm input[type=text] , 
#updateForm input[type=email] ,
#updateForm input[type=telephone] ,
#updateForm .inputsDD  { width:100%; max-width:700px }

/*details update and password reset forms shared*/ 
#registerForm #NEWpswd ,#registerForm #repeatpswd ,
#updateForm #pswd ,  #updateForm #NEWpswd , #updateForm #repeatpswd , #updateForm #emailU  { width:225px; }


#registerForm #salutation,
/*#registerForm #countyR, #updateForm #countyU,  */
#registerForm #countryR,
#updateForm #salutationU{ width:225px}


#updateForm  #passwordChangeLink{
margin:15px auto 10px auto;
padding:0;
clear:both;
color:#006699;
text-decoration:underline;
font-size:0.9em;
font-weight:bold;
cursor: pointer;
}

#updateForm  #passwordChangeLink span{
height:11px;
width:11px;
display:inline-block;
margin-left:6px;
background-image:url(../images/icons/arrowRGray.png);
background-position:left 50%;

} 
#updateForm  #passwordChangeLink.passwordChangeLinkOpen{ color:#8AB900 }
#updateForm  #passwordChangeLink.passwordChangeLinkOpen span{ background-image:url(../images/icons/arrowDgray.png)}

#updateForm #passwordChangeWrap{ margin:0 0 15px 0}




/* helpers */
form em{ font-size:0.8em; color:#666666; font-style:normal; margin:0px 0px 0 4px ; } 
.mobile form em{ display:block; clear:both; margin:2px 0px 0 0px ;}

#countyNotListed{ color:#006699; text-decoration:underline; cursor:pointer; font-size:1.0em; font-weight:bold; padding:5px;} 

/*p#verificationCodes ,  div#verificationCodes , #verificationCodes { margin:0; padding:0;  }*/

.verificationCode{ width:18px; background-image:url(../images/verificationCode.png);  
display:block; float:left;height:26px;margin:0px 0px 0 0px ;  }
 
#verificationCode , #verificationCodeR { 
color:#000;
font-size:0.9em; 
font-weight:bold;
text-transform:uppercase;
letter-spacing:1px;
text-align:center; 
height:26px;
}

#contactForm #verificationCode{ width:96px; margin-left:5px;}

#registerForm #verificationCodeR   {
width: 180px; margin-left:10px;
}
	 

#agreeWithTerms, label#agreeWithTerms{ padding-left:30px;}
 


#contactForm input{
width:100%;
} 
#contactForm .inputBox {
height:60px;
padding:4px;
width:100%; 
border:2px solid #ccc;
color:#333333;
padding:1px 0px 1px 3px;
font-family: Arial, Helvetica, sans-serif;
}

#contactForm #additionalInfo  p{
color: #FF6600
}



 

input.inputsOver , select.inputsOver , textarea.inputsOver { background-color:#FFFFFF;   border-color:#999;    }
input.inputsErr, select.inputsErr, textarea.inputsErr{ border-color: #FF0000}


/*site css*/


/*  filters */
	#filterForm  {
display:block;
width:100%; 
min-height:200px;
height:100%; 
background-color:#fff;
padding:  0px; position:relative
}

	#filterForm ,	#filterForm  ul , #filterForm ul li,  #filterForm li, #filterForm label, #filterForm a { }
 

#filterForm .filterContainer {
	border: 1px solid;
	border-bottom-width:2px;
	margin: 0 0px 10px 0px;
	border-color: #A2A2A2;
	padding: 0px;position:relative; /* for offset radios & checkboxes */  
}

/*openers and label/checkbox combo for show hide ul's*/
#filterForm   .ulDisplaySetterLabel  {
	padding:0px 0 0px 26px;
	height:38px;
	line-height:38px;
	background-color:#A2A2A2;
	display:block;
	font-weight:bold;
	font-size:0.7em;
	text-transform: uppercase;
	color:#fff;
	background-position: 8px  14px;
 font-family:Arial, Helvetica, sans-serif;
	background-image:url(../images/icons/arrowDwhite.png);
	position: relative;
	cursor:pointer 
}

#filterForm  .ulDisplaySetter{ position:absolute; left:-30000px; top:0;}

#filterForm    input.ulDisplaySetter[type="checkbox"]:checked + label {
background-image:url(../images/icons/arrowUwhite.png);
}

 

#pricesSliderWrap,
#filterForm ul { 
	text-align:left;
	background-color:#FFFFFF; position:relative;
 }
 
.screen 	#pricesSliderWrap,
.screen #filterForm ul {   max-height:400px; overflow:hidden; overflow-y: auto; }


/* update text area*/
#slideResultWrap{
	display:block;
	margin:0 auto;
	padding:0 10px 0 0;
	text-align: right;
	line-height:30px;
		color:#666666;
	font-size:20px; font-weight:bold; 
	}
	 


#filterForm li{
list-style:none;  
}

#filterForm .clearFilters {
	background:none;
	text-align:center;
	position:absolute;
	top:0px;
	right:0px;
	height:25px;
	line-height:25px;
	width:30px; 
	cursor:pointer;
	font-weight: normal;
	color:#f1f1f1;
	cursor:pointer;
	font-size:1em;
	text-transform: lowercase;
	text-decoration:none;
	}
 
 #filterForm .clearFilters:hover{ text-decoration:underline}


#filterForm li label  { /* links to checkboxes fonts in screen/ mobile setttings */
	text-align:left;
	border-bottom:1px solid #e8e8e8;
	display:block;
	letter-spacing:0px;
	margin:0;
	color:#333333;
	display:	block;
	width:100%; 
	padding: 10px 40px 10px 10px;    
		background-image:url(../images/icons/checkBoxOff.png);	 
	background-position: calc(100% - 8px)   6px;
	
	cursor:pointer
}

#filterForm li label  span{   display:block; width:calc(100% - 30px) }

#filterForm li label:hover  { background-color:#f1f1f1;
}

#filterForm li:last-child label{ border-bottom:0px; }

#filterForm li  input[type="checkbox"]:checked + label ,
#filterForm li  input[type="radio"]:checked + label {
font-weight: normal;
background-image:url(../images/icons/checkBoxOn.png?2);
color:#000000
} 
 

#filterForm li  input[type="checkbox"]:disabled + label {
	font-weight: normal;
	background-image:url(../images/icons/checkBoxDisabled.png?1);
	color:#ccc; cursor:default
} 


#filterForm li input  {  
position:absolute; right:10000px; 
}


#filterBtnWrapper{ height:100px;}

/*filter */



/*cats page h2 desc*/
.categoryDescription{ margin:12px auto 0 auto; font-size:1em}
#categoryList{ margin:15px auto}
 
 

/* products page headlines above category */
#productsPage h1, #productsPage h2{ display:inline-block; font-size:0.9em; font-weight:bold; color:#666666; padding:0 2px 0 0;}
#productsPage h1 span, #productsPage h2 span{ color:#999999;}
#productsPage h2 em{ font-style:normal;} 


 
#productsList { clear:both; display:block;  margin:15px 0 0 0; padding:0;   width:100%;     }
 



/*details */
#productDetailsLeft{
	width:462px;
	float:left;
	text-align:center;
	margin:0px  0 0 0;
	position:relative; overflow:hidden
}
 

#productDetailsImgsWrap{ border:2px solid #e4e4e4;width:100%; height:370px;overflow:hidden; position:relative /*relative for icons */  }

/* size in mobile using JS */
#productDetailsImgs{ display:block; width:auto; margin:0; height:370px; position:relative; text-align:left }
#productDetailsImgs li {
margin:0 auto;  text-align:center; float:left; display:none;	
overflow:hidden;
	width:460px; 	height:360px;	position:relative; 
	 }
#productDetailsImgs li:first-child { display:block}

#productDetailsImgs li a{
	display:inline-block;  
	position:relative; 
	overflow:hidden;
	width:100%; 	
	height:100%;
	line-height:370px;
	text-align:center; font-size:0;white-space:nowrap;
}

#productDetailsImgs li  img{
vertical-align:middle;
margin:0; 
display:inline-block;  
} 

#productDetailsImgs li  img.portrait{ max-height:80%; width:auto}
#productDetailsImgs li  img.landscape{ max-width:90%; max-height:100%; height:auto}

/* text*/
#productDetailsImgs li p{
position:absolute;
bottom:-2px; padding:2px 0;
left:0px;  width:100%; height:auto; border:0px solid
}
#productDetailsImgs li p strong {
width:auto;
color:#666666;
z-index:1000;
text-align:center;
background:#fff;
padding:2px 10px;
margin:0 auto;
display:block;
font-size:0.8em;
font-weight:normal
}
 

/* noImage*/
#productDetailsImgs li p.noImage { 
display:block ; width:100%; height:100%;position:relative; overflow:hidden; text-align:center} 
#productDetailsImgs li p.noImage img { width:150px; height:150px }


#changeIcons{ position:absolute; width:100%; top:165px ; left:0; display:none}

#changeIcons li{border:0px solid #e1e1e1; width:40px; height:50px; background-color:#ccc;position:absolute;}
#changeIcons li#previous {  left:2px; display:none}
#changeIcons li#next { right:2px;}
#changeIcons li p{
cursor:pointer;
text-indent:-9999px;
background-position:50% 50%;

display:block;
width:100%;
height:100%;
margin:0;
padding:0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
} 
#changeIcons li#previous p{ background-image: url(../images/icons/arrowLwhite.png) } 
#changeIcons li#next p{ background-image:url(../images/icons/arrowRwhite.png) } 


#changeIcons li:hover{border-color: #999;}
#changeIcons li#previous p:hover,
#changeIcons li#next p:hover{
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity: 1;
-khtml-opacity: 1;
opacity: 1;
}

#changeIcons li .changeIconActive   {
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=750)";
filter: alpha(opacity=70);
-moz-opacity: 0.7;
-khtml-opacity: 0.7;
opacity: 0.7;
display:none;
}



#productExtraImgs{
	display:block;
	margin:10px  auto;
	text-align:left;
	width: 100%; min-height:80px; 
}

#productExtraImgs li { display:inline-block;   text-align:center ; height:80px; width:85px;  margin:  0 5px 5px 0px}

.screen #productExtraImgs li:nth-child(5n + 5){ margin-right:0px;  }

#productExtraImgs li a{ display:block; cursor:pointer; border:1px solid #e1e1e1;  height:100%; width:100%; position:relative; line-height:75px; text-align:center }
#productExtraImgs li a:hover{ border-color:#999999} 
#productExtraImgs li a img{ max-height:84%; max-width:84%; margin:0 auto; vertical-align:middle}

#productExtraImgs li a.activeExtraImage{
border-color:#888;
cursor:default
}

 

#productDetailsRight{
 background-color:#fff;
 padding:0px 10px 15px 10px;
 width:520px;
 margin:0 0 0 0px;
 float:right;
 border:0px solid #e4e4e4;
}

#productDetailsRight h1 { 
font-size:1.2em; font-weight:bold; text-shadow:1px 1px #fff
} 
#productDetailsRight h2{
	font-size:1em;
	font-weight:bold;  
} 
#productDetailsRight p{
	margin: 5px 0; font-size:0.86em;
	padding:0;
} 


#productDetailsRight ul {
	margin: 5px 0; 	
} 


#productDetailsRight #fullInfo ul li{
	margin: 2px 0; list-style: disc; list-style-position: inside
} 

#productDetailsRight p.prodCode{ font-size:0.9em; color:#999; font-weight:bold  }

#productDetailsRight a{ color:#006699; text-decoration:underline}
/* tables matched in addAmend css admin*/
#productDetailsRight table *{ font-size:0.95em}
#productDetailsRight table{ width:100%; max-width:100%; border:1px solid #e1e1e1;margin:10px auto}
#productDetailsRight tr{ width:100%;}
#productDetailsRight tr.tableHeader ,#productDetailsRight tr.tableHeader td{ background-color:#f1f1f1;font-weight:bold}
#productDetailsRight td{ padding:6px; border:1px solid #f1f1f1}
/* tables matched in addAmend css admin*/

.preOrder, select option.preOrder , #productDetailsRight select option.preOrder{ color:#FF6600; }
.outOfStock , select option.outOfStock,  #productDetailsRight  option.outOfStock { color: #FF0000; }

#pricingArea p{ margin:2px 0}
#pricingArea p.prices  { color:#333; font-size:1.1em; font-weight:bold }
#pricingArea .prices .wasPrice{ color:#FF0000; font-size:1em; font-weight:bold; display:block} /* was price */
 
#buyWrap{ margin:8px auto}

#productDetailsRight select{ width:100%; margin:5px auto; font-size:1em; } 
#productDetailsRight select option{ padding:0 4px; margin:0} 
#productDetailsRight select optgroup{ padding:0px; margin:0;font-style:normal; font-weight:bold} 

#productDetailsRight select#qty{ font-weight:normal; width:35%; float:left; font-size:0.8em}
#productDetailsRight #buyButton{ float:right; width:60%;   }
#productDetailsRight select#qty, #productDetailsRight #buyButton{height:40px;margin:0; display:inline-block} 

#buyWrap hr{ border:none; background:none; height:0px; clear:both}  
 

/* price  options and opt ex wraps */
#buyWrap,
#optionsWrapper,
#pricesWrapper,
#optionalExtraWrap {
 background:#fff; border:2px solid #e1e1e1; padding:12px; margin:8px 0; position:relative	; border-radius:4px;}

#optionsWrapper.optionsSelectError , 
#pricesWrapper.optionsSelectError{ border-color:#FF0000;}

.optionPreOrder , 
.checkboxRadioList  input[type=radio]  + label.optionPreOrder,
#productDetailsRight select option.optionPreOrder, 
label.optionPreOrder { color:#FF6600; font-style: normal} 
em.asterisk { font-size:1.1em;color:#FF6600; }

.checkboxRadioList  input[type=radio]  + label.outOfStock,
#productDetailsRight select option.outOfStock, label.outOfStock  { color:#999; }  


#optionalExtraWrap h5{ font-size:1em; color:#888}
#optionalExtraWrap ul { margin-top:10px}
#optionalExtraWrap li { min-height:30px; position: relative;  padding-right:42px;}

#optionalExtraWrap .checkboxRadioList input[type="checkbox"] + label{ color:#006699; font-size:0.9em;}
#optionalExtraWrap .checkboxRadioList input[type="checkbox"] + label strong{ padding-left:5px} 

#optionalExtraWrap li p.optExListImage {
overflow:hidden;
position:absolute;
top:-6px;
right:0px;
width:30px;
height:30px;
cursor:pointer;
border:2px solid #ccc;
text-align:center;
}
#optionalExtraWrap li p.optExListImage:hover { border-color:#999999} 
#optionalExtraWrap li p.optExListImage span {width:30px; height:30px; display:block;background-size:cover; background-repeat:no-repeat; background-position:50% 50%; margin:0px}


.pricesGroupName{
color:#333;
font-size:0.9em;
font-weight:bold;
margin:8px 0 0 0 ;
display:block
}

.radioListPrices{ color:#006699; padding-left:6px; /*display:block*/}/* price when showing radio list*/

p.preOrderMsg , 
p.preOrderMsg{ color:#FF6600; font-size:0.8em; font-weight:bold}
/*optional Extras*/

 
 

/*  opt ext  width match productDetailsRight
#optionalExtraAjx{ position:relative; display:block; 	width:520px; z-index:1001}
 */
#optExtraViewer{
width:800px; height:400px;
	margin:0 auto;
	position:absolute;
	left:calc(50% - 400px);
	top:calc(50% - 200px);
 background-color:#fff;
	border:6px solid #ccc;
	padding:55px 10px 15px 10px; overflow:auto;
}
#optExImgWrapper{ float:left; width:36%;  }
#optExImgWrapper img{
	max-width:100%;
	max-height:200px;
	position:relative;
	display:block;
	margin: 0 auto;
	padding: 5px;
	border:1px solid #fff;
}
#optExTextWrapper{ float:right;width:60% }
#optExTextWrapper.noImage{ float:none;width:100% }
#optExTextWrapper #optExTextWrapper h5, 
#optExTextWrapper h5{ font-size:1.0em; color:#006699; font-weight:bold}/* title*/
#productDetailsRight #optExTextWrapper p,
#optExTextWrapper p{ font-size:0.9em} /*paras  and full*/
#optExtraViewer hr{ display:block; clear:both; height:20px; background:none; border:none} 


/*  samples */
#samplesContainer{
margin:15px auto;
padding:12px;
border:2px solid #e1e1e1;
border-radius:4px;
background-image:url(../images/samplesIcon.png);

background-position:10px 18px;
padding-left:55px;
position: relative;
 }
#samplesContainer span, #samplesContainer p, #samplesContainer em{ height:40px; margin:0; padding:0;line-height:40px; font-weight: bold;font-size:0.9em;}
#samplesContainer span{ /* samples link */
color:#006699;
text-transform:uppercase;
display: block; 
cursor:pointer
}
#samplesContainer span:hover{ text-decoration:underline} 
 
#samplesContainer p{ 
background-image:url(../images/tick.png); 

background-position:right 50%; color:#99CC00;} 

#samplesContainer p a{ font-weight: bold; text-decoration:underline}

#samplesContainer em{ /*loading*/
display:none;
position:absolute;
right:10px; top:10px;
}
 /*loading*/
#samplesContainer img{ float:right; height:20px; line-height:20px; display:block; margin-top:10px}


/*  wishList */
#wishListContainer{
margin:15px auto;
padding:12px;
border:2px solid #e1e1e1;
border-radius:4px;
background-image:url(../images/wishListIcon.png);

background-position:10px 18px;
padding-left:55px;
position: relative;
 }
#wishListContainer span, #wishListContainer p, #wishListLoading { height:40px; margin:0; padding:0;line-height:40px; font-weight: bold;font-size:0.9em;}
#wishListContainer span{ /* samples link */
color:#006699;
text-transform:uppercase;
display: block; 
cursor:pointer
}
#wishListContainer span:hover{ text-decoration:underline} 
 
#wishListContainer p{ 
background-image:url(../images/tick.png); 

background-position:right 50%; color:#99CC00;} 

#wishListContainer p a{ font-weight: bold; text-decoration:underline}
#wishListContainer em{ /*loading*/
display:none;
position:absolute;
right:10px; top:10px;
}
 /*loading*/
#wishListContainer img{ float:right; height:20px; line-height:20px; display:block; margin-top:10px}


/* extra info  match proddetails Right */

#extraInfo{ margin:20px auto 0 auto;   }
#extraInfo h4{
border-bottom:3px solid #e8e8e8;
padding:0 0 2px 0; 
margin: 0 auto 5px auto;
font-weight:bold;
color:#333333
}

#extraInfo h4 span{
}

#extraInfo ul{}
#extraInfo ul  li { margin:3px 0 6px 0}
#extraInfo ul  li h5{
 font-weight:bold;
 font-size:0.95em;
 color: #666666;
 padding: 0px 0 2px 0;
}
#extraInfo ul li p{ margin:0; padding:0; font-size:0.9em; }


#productDocs{ margin:5px 0;
margin:15px auto;
padding:12px;
border:2px solid #e1e1e1;
border-radius:4px;
}
#productDocs li { display:block; clear:both;}
#productDocs h5{ font-size:1.1em; color:#666666; font-weight:bold}
#productDocs p  { font-size:1em;   padding:0px 0 6px 0 }
#productDocs a { color:#006699; font-weight:bold }

#productDocs  a.docLink,
#productDocs  a.pdfLink,
#productDocs  a.xlLink { background-position: left; font-size:0.9em; font-weight:bold; text-decoration:none; display: inline-block;  clear:both; padding:5px 0}

#productDocs  a.docLink{ padding-left:30px;  background-size:auto;  background-image:url(../images/fileTypes/word.png) ;background-position:left 50%;}
#productDocs  a.pdfLink{ padding-left:30px; background-size:auto; background-image:url(../images/fileTypes/pdf.png);background-position:left 50%;}
#productDocs  a.xlLink{ padding-left:30px; background-size:auto; background-image:url(../images/fileTypes/xl.png) ;background-position:left 50%;}

 #informationRight a:hover { text-decoration:underline;}



/* linked Products product detalils page  */
#relatedProducts{ display:block; clear:both; margin:10px auto; padding:5px 0; width:100%; overflow:hidden;background-color:#fff; }

#relatedProducts h5{/*  titles "you may also find.. ." */
	font-size:0.9em;
	color:#333;
	padding: 4px 0 4px  0;
 margin:10px auto;
	font-weight:bold; border-bottom:4px solid #e7e7e7
}
#relatedProducts ul { text-align:center;  width:1500px; height:160px;}
#relatedProducts ul li{
	display:block; float:left;
	margin:0 8px 0 0;
		width:160px;
	height:170px;
} 

#relatedProducts ul li:last-child{ margin-right:0;}
#relatedProducts ul li a {
	display:block; height:100%; width:100%;
	overflow:hidden;
	border:2px solid #e8e8e8;
	text-align: center;
	font-size: 0.8em;
	padding:5px; border-radius:2px;
}

#relatedProducts ul li a:hover { border-color:#999999; background-color:#f8f8f8}

#relatedProducts ul li a span{ /* thumbs wrap */
	height:70px;
	width:75px;
	display:block;
	position:relative;
	line-height:70px;
	margin: 6px  auto; text-align:center;
}
#relatedProducts ul li a img{ vertical-align:middle}
#relatedProducts ul li a img.portrait {height:100%; width:auto}
#relatedProducts ul li a img.landscape {width:100%; height:auto}

#relatedProducts ul li a strong {/* linked title */
color:#333333;
display:block;
text-align: center;
height:40px;
width:90%; 
margin: 15px auto 0 auto; font-size:0.9em;
} /* title*/
#relatedProducts ul li a em {
color:#006699;
display:block;
text-align: center;
padding:2px 0 0 0;
font-style:normal;
font-weight:bold
} /* price */

 /*  cart added ajx */ 

#itemAddedDisplay{ 
border:8px solid; border-color:#006699; 
padding:5px 15px 10px 15px; z-index:7;
 background:#fff; position:fixed; 
	left: calc(50% - 150px)  ;
	top:30%; 
	width:400px; text-align:left;
	height:auto;}
 


 

 /*for added and basket contents */ 


#basketContents, div#basketContents { 
position:absolute ;  z-index:20;height:0px; text-align:left;  margin:0; clear:both; width:100%;   right:0; top:0 ; display:none; }
#basketContentsDisplay{
	border:6px solid;
	border-color:#006699;
	padding:5px 15px 10px 15px;
	z-index:7;
	background:#fff;
	position:absolute;
	right:0px;
	top:40px;
	text-align:left;
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius: 6px;
	z-index:6;
}
.screen #basketContentsDisplay{	width:420px;}


@media only screen and (orientation:portrait)   {  	
.mobile #basketContentsDisplay{	width:300px; 	right:auto; left:calc(50% - 150px); 	top:65px;  }
}
@media only screen and (orientation:landscape)   {  	
.mobile #basketContentsDisplay{	width:400px; 	right:auto; left:calc(50% - 200px); 	top:65px;  }
}

.ajxBasket  h1,  #itemAdded h1 , #basketContents h1   {
	clear:both;
	color:#9DC32E;
	padding:0px 0px 2px 28px;
	font-size:0.8em;
	font-weight:bold;
	text-align:left;
	background-image:url(../images/cart.png);
	
	background-position:left top;
	margin: 10px 0 0px 0; min-height:26px; line-height:26px
 } 

.ajxBasket  ul{margin: 6px  auto 0 auto; padding: 5px 0px 0 0;text-align:left ; line-height:normal; 
 border-top:3px solid #e1e1e1; }

.ajxBasket li {font-size:14px; font-weight:normal; color:#666666; margin: 2px 0 2px 0; padding: 2px 0px  3px 0px;text-align:left ; clear:both;  list-style:none}

#basketContentsDisplay li { border-bottom:1px dashed #e1e1e1 ; } 
#basketContentsDisplay li:last-child { border:0;}
#itemAddedDisplay li { margin:6px 0 0 0 } 

.ajxBasket li a {/* main link in contents padding to line up delete*/
	color:#006699;
	width:calc(100% - 46px);
	float:left;
	display:block;
	font-weight:normal;
	margin:0;
	padding:0px 0 0 0;  
}

.ajxBasket li p{ display:block; clear:both; padding:1px 0; margin:0}

.ajxBasket li a:hover { text-decoration:underline}


#itemAddedDisplay li.optExtras { margin:4px 0  2px 0; padding:0 0 4px 0; border-bottom:1px dotted #ccc} 
#itemAddedDisplay li.optExtras:last-child { border-bottom:0}
#itemAddedDisplay li p.optExtrasTitle{ color:#9DC32E; font-weight:bold}

.ajxBasket span.removeFromBasket, 
.ajxBasket .removeFromBasket{
display:block;
cursor:pointer;
float:right;
font-size:0.7em;
text-transform:uppercase;
text-align:center;
font-weight: normal;
width:20px; height:20px; line-height:20px;
padding:0px 0 0 0;
color:#fff;
background-color:#ff0000;
}

.ajxBasket span.removeFromBasket:hover, 
.ajxBasket .removeFromBasket:hover{ background-color:#333333 }

.ajxBasket li strong{  display:block; clear:both; }/*prices*/
.ajxBasket #total{
	border-top: 3px solid #e1e1e1;
	font-weight:bold;
	padding:5px 0 0 0;
	margin:5px 0 0 0
}
.ajxBasket #total span{ display:block; clear:both; font-weight:normal; font-size:12px;}

.ajxBasket #basketLinkWrapper{  margin:0 auto 5px auto; clear:both}
.ajxBasket a.basketLink{
	display:block; clear:both;
	margin:10px 0 0 0;
	padding:10px 5px;
	text-align:center;
	font-size:0.8em;
	font-weight: bold;
	color:#fff;
	text-transform:uppercase; 
	border: 2px solid;
	border-color: #99CC00;
	width:100%;   background:#99CC00
}

.ajxBasket a.basketLink:hover{
	color:#fff;
	border-color: #006699; background:#006699
}

.ajxBasket p {  margin:0; padding:0;}
.ajxBasket * { font-size:0.96em;  }





/*basket*/
#basket  { display:block; clear:both; padding: 0 0 10px 0; width:100% }

#basket  li {
display:block;
clear:both;
background-color:#FFFFFF;
background-color:#fff;
font-size:0.8em; position:relative; 
margin:10px 0 0 0; padding:5px 0 10px 0; border-bottom:1px dotted#e1e1e1 }

#basket  li:last-child{ border-bottom:0px;} 

#basket  li hr{ margin:0px auto; background:none; height:0; clear:both;}

#basket  li span.thumbs{display:block;   float:left;  width:82px; height:82px;line-height:76px; text-align:center;  text-decoration:none;  position:relative; overflow:hidden; border:2px solid #e1e1e1; border-radius:4px; }  
#basket  li span.thumbs img{ max-height:100%; max-width:100%; vertical-align:middle ; margin:0 auto; text-align:center; padding:6px; }

#basket  li a div.textWrap {
	padding:2px	 20px 10px 10px;
	float:left;
	max-width:460px;
	color:#333333;   
} 

/*prod title*/
#basket  li a .textWrap strong{
display:block;  
}

/*price*/
#basket li a .textWrap em{
	display:block;
	color: #006699;
	font-weight:bold;
	font-style:normal;
	padding:0px 0 0 0; 
	text-decoration:none
}

#basket  li a:hover span.thumbs{ border-color:#999}
#basket  li a:hover .textWrap{ text-decoration:none;   }
#basket  li a:hover .textWrap em{ text-decoration: none }

#basket li .basketFormWrap{
display:block;
margin:0px auto  0 auto;
padding:0px;
float:right;
width:400px;
text-align:left;
position: relative; 
}

#basket li  .qtySelect  {
	width:100px;
	display:block; float:left;
	height:	34px;
	background-size:34px; 	 
 }

#basket li  .qtySelect,  .qtySelect option  {

 	font-size:0.85em; 
 } 
 

#basket .deleteItem{
margin: 0px 0 0 30px;
background:none;
cursor:pointer;
border:0;
font-size:0.7em;
color:#006699;
display:block;
float:left; 
width:	34px;
height:	34px;
background-color:#FF0000;
background-image:url(../images/icons/deleteWhite.png);
background-repeat: no-repeat;
background-position: 50% 50%;
border-radius:1px; z-index:100;
}

#basket .deleteItem:hover{
color:#FF0000
}

#basket .confirmDelete{
display:none;
position:absolute;
left:-1px;
top:0px; 
float:left; 
z-index:101; width:129px;
height:34px; line-height:34px;margin:0 0 0 1px;
font-size:0.7em; color:#fff;
text-transform:uppercase; font-weight:bold;
cursor:pointer; 
text-align:center; border:0px solid #e1e1e1; background-color:#ff0000;
}
#basket .confirmDelete:hover{ text-decoration:underline}

.noScriptUpdate{ display:block; clear:both}

#basket li  p.subTotal  {
	display:block; float:right;
text-align:right;
font-weight:bold;
font-size:0.9em; margin:0; padding:0;
}

#basket li  p.subTotal  span{ display:block; text-align:right} /*internal spans */

/* vat elements on function*/
#basket li  p.subTotal span.vat { display:block; font-size:0.8em}
#basket li  p.subTotal span.voucherExempt { display:inline; font-size:0.8em; color:#FF0000; font-weight:bold}



#shippingWrap{
text-align:right;
display:block;
margin:10px auto 10px auto; 
position:relative
}

#shippingWrap p{ text-align:right} 


#shippingWrap #shippingForm, 
form#shippingForm {/* match with, border & padding with checkout*/
display:inline-block; 
margin:0;
text-align:right; 
/*width:560px;padding:8px 22px 14px 22px ;border:0px solid;border-color: #e1e1e1; border-radius: 4px; */
max-width:100%;
background-color:#fff;   
}


#shippingForm h6{
display:block;
text-align:right;
font-size:0.9em;
padding: 0 34px 0 0;
margin-bottom:0px;
height:30px;
line-height:30px;
font-weight:bold;
color: #006699;
background-image: url(../images/deliveryIcon.png);
background-position: right 50%;
background-repeat: no-repeat;
text-transform:uppercase;
}

#freeShippingBelowLimit, p#freeShippingBelowLimit{
color:#FF0000;
font-size:0.8em;
padding-top:10px;
font-weight: bold;
}




 /* over ride checklist */
#shippingForm li  {  border-bottom:0px solid #f5f5f5 ;   }
#shippingForm li:last-child  { border-bottom:0}

#shippingForm .shippingSection { text-align:right; display:block; clear:both; padding:0 22px 0 0 ; margin:14px 8px  10px 0;
 line-height:16px;height:16px;
 font-weight:bold;
color:#999999; 
font-size:0.9em; text-transform:uppercase;
cursor:pointer; 
background-image:url(../images/icons/arrowRGray.png);
background-position:right 50%; 
}
 
#shippingForm .shippingSectionOpen  { color:#777; background-image:url(../images/icons/arrowDgray.png)}



#shippingForm input[type=radio]:not(:checked) + label{
font-size:0.9em;
color:#888
}  
#shippingForm li input[type=radio]:checked + label{ color:#000;font-size:0.9em;}


#shippingForm li label span{ font-weight:bold;  padding:0 4px  0 0 ;} /* country if one shown */ 
#shippingForm li label strong{ color:#99CC00; padding:0  0 0 6px;} /* price*/ 
.screen #shippingForm li label strong{ min-width:50px; display:inline-block; text-align:right}

#shippingForm li label strong.freeShip{ color:#ff0000; } 

#voucherWrap{
 display:inline-block;
 clear:both;
 text-align: right; margin:0 auto 10px; width:100%;
}

#voucherWrap #voucherResponse, 
#voucherWrap p ,
p#voucherResponse{
/* height:16px;
 line-height:16px;*/
 margin:0; padding:2px 0;
 width:100%;
 text-align:right;
 font-weight: bold;
 font-size: 0.9em;
 color:#99CC00
}

#voucherForm, form#voucherForm {
 display:block;
 text-align:right;
 height:40px; line-height:40px;
 position: relative;
} 
#voucherForm, form#voucherForm p, 
#voucherForm, form#voucherForm div{ text-align:right}



#SELvoucher{
 display: block;
 float:right;
 border:2px solid; border-color: #BDD872;
 border-right:none;
 width:262px;
 height:40px;
 text-indent:5px;
 font-size: 0.9em; color:#333333; font-weight:bold; font-size:1em;
 }
#SELvoucher.SELvoucherError{ border-color:#FF0000}

#submitVoucher   {
 height:40px;
 width:40px;
 display: block; float:right;
 text-align:center;
 border:none;
 color: #FFFFFF;
 font-size:0.8em;
 background-position:left -132px;
 background-color: #95BB28;
 background-image:url(../images/buttonsBG.png);
 font-weight: bold; cursor:pointer; background-repeat:repeat
}

#submitVoucher.submitVoucherError{ background:#FF0000}

#voucherLoading{ 
height:40px; width:40px;
text-indent:-10000px; 
background:none; border:none ;
background-image:url(../images/loading-spinner.gif); 
 background-position:50% 50%; background-repeat:no-repeat;
 display: block; float:right;
  border:2px solid; border-color: #BDD872; border-left:none
 }

#voucherError, #basket p#voucherError{ text-align:right; color:#FF0000; font-size:0.8em; display:block}
 

 
.totalsWrapper{
clear:both;
margin: 5px auto 0 auto;
text-align:right;
padding:5px   0px  ;
background:#fff;  
border-top:2px solid #e4e4e4; 
}
.totalsWrapperNoBorder{ border:0}
 
.basketPage .totalsWrapper p{ text-align:right; margin:0; padding:4px 0; font-size:0.9em; }

.basketPage .totalsWrapper p strong{  display:inline-block; text-align:right}
.basketPage .totalsWrapper p span{ width:70px; display:inline-block; text-align:right}

#freeGiftLevelMessage{ display:block; color:#FF0000; font-size:0.8em; font-weight:bold; text-align:right; clear:both  }

 
#donationForm{ text-align:right; margin:15px 0;}
#donationForm ul {
display:block; clear:both; text-align:right;  border:3px solid;border-color: #e1e1e1; border-radius: 4px; float:right;width:460px; max-width:100%;padding:8px 22px 14px 22px ;
}
#donationForm h4, 
#donationForm h5{ text-align:right}
#donationForm h4{
text-align:right;
font-size:1em;
font-weight:bold;
background-image: url(../images/charityDonationIcon.png);
background-position: right 2px;
background-repeat: no-repeat;
padding-right:30px;
min-height:28px;
} 
#donationForm h5{ text-align:right; font-size:0.9em; font-weight:normal}
#donationForm p{ text-align:right; font-size:0.8em} 
#donationForm p a{ color:#006699; text-decoration:underline}

#donationForm .checkboxRadioList label{ }

#donationForm hr{ display:block; background:none; border:0; clear:both; height:0px; margin:0; } 

#basketMessage{ color:#FF0000; font-size:0.9em; font-weight:bold} /* prefs editable shows above buttons */


#checkoutButtonWrap{clear:both; margin:0px auto; text-align:right; width:100%;}

 
.checkoutButtons{
text-align:center;
background:none;
/*background-image:url(../images/icons/arrowRWhiteThin.png);
background-position:95% 50%;
*/
display:inline-block;
white-space:nowrap; 
margin:5px 0 5px 10px;
 
width:260px;  
background-color: #003366;
font-size:0.8em;
font-weight:bold;
color:#FFFFFF;
border:0;
height:40px; line-height:40px;
cursor:pointer;
text-shadow:1px 1px #000
}

.checkoutButtons:hover{ background-color:#333333; text-shadow:none}

.mobile #checkoutButtonWrap{ }
.mobile .checkoutButtons, .mobile a.checkoutButtons{height:40px; line-height:40px; font-size:0.9em; margin: 5px 0;  }


/*match shipping box and samples*/
#checkout {
margin:20px auto;
text-align:right;
clear:both;
border:3px solid #e1e1e1;
background-color:#f9f9f9;
border-radius:4px;
 width:100%;
float:right;
}

#checkout form *{}
#checkout form{
border:1px solid #fff;
padding:20px;
border-radius:4px
}
 
#checkout  h5 , #checkout  p, #checkout label, #checkout span  { text-align:left}

#checkout  p{ margin:3px 0; padding:0; width:48%; float:left; }
#checkout  p:nth-child(2n + 2){ clear:both; margin-right:4%;  }
#checkout  p.cleared{ clear:both;}
#checkout  p.fullWidth{ clear:both; width:100%;}

.mobile #checkout  p{ margin:3px 0; padding:0; width:100%; float:none;   }

/*when logged in*/
#checkout  p.customerInfo{ display:block; font-size:0.86em; color:#333333; padding:10px 15px; border:1px dashed #ccc; background:#fff; width:100%; clear:both}

#checkout  div{ width:100%; clear:both;}

#checkout  h5{ font-size:1em; font-weight:bold}

#checkout label, #checkout span{
font-size:0.86em;
display:block;
font-weight:bold;
color:#6E6E6E;
margin: 8px 0 2px 0;
text-shadow:1px 1px #fff
}
#checkout input[type=text] ,#checkout select   { width:100%; height:34px;  text-align:left; font-size:0.8em; }
#checkout textarea{
width:100%;
display:block;
}

#checkout label em{ color:#FF0000; font-style:normal; font-weight:bold; font-size:0.9em } /* err messages */
#errName{ display:none}

/*readonly on checkout*/
#checkout input[readonly] { background:none; border:none; height:20px; width:100%;padding:0px; color:#666666}
 
 

#checkout #deliveryLink,
#checkout #deliveryClearLink {
cursor:pointer;
font-size:0.9em;
font-weight:bold;
margin:16px 0 0 0; 
 
color:#006699; 
display:inline-block;
height:20px; line-height:20px;
clear:both; 
background-position:0px 50% ;
padding-left:18px;
}
#checkout #deliveryLink{ background-image: url(../images/icons/plusGray.png); }
#checkout  #deliveryClearLink{ background-image:url(../images/icons/minusGray.png); }
 


#prevAddrWrap{margin:0px auto 20px auto; background-color:#FFFFFF; padding:10px 15px  ; border-radius:5px; border:1px solid #e1e1e1}
#prevAddrWrap h5{ color: #99CC00}
#checkout #prevAddrList{ padding:5px}

#checkout #prevAddrList  input[type=radio]  + label , #checkout #prevAddrList label{
color:#333;
font-weight:normal;
padding-top:0;
font-size:0.8em; 
}
#checkout #prevAddrList  input[type=radio]:checked  + label{ color:#333}

/* labels for remove prev addr  */
#checkout #prevAddrList  input[type=checkbox]  + label.removePrevious , #checkout #prevAddrList label.removePrevious{
color:#006699;
font-weight:normal;
height:22px;
line-height:22px;
font-size:0.64em;
font-weight:bold;  
}

#checkout #prevAddrList  input[type=checkbox]:checked  + label.removePrevious{ color:#ff0000;}
#checkout #prevAddrList hr{ margin:0 auto 10px auto; border:0; background:none; border-bottom:1px solid #e1e1e1; padding:0 0 6px 0;}
#checkout #prevAddrList li:last-child hr{ border:0px}

#checkout hr{ margin:0px auto; border:0; background:none; border-bottom:0; padding: 6px 0;}

 
#checkout #termsRow{   margin:0 auto;   clear:both; padding-top:20px}
#checkout #termsRow hr{ border-bottom:3px solid #e4e4e4; margin: 0px auto 10px auto; }  
#checkout label.checkoutTerms, #checkout label.checkoutTerms:hover { display:block; text-decoration:none; padding-top:4px;}
#checkout label.checkoutTerms a{ padding:0 3px; color:#006699; text-decoration:underline; font-weight:bold} 

#checkout #paymentsButton{ width:50%; margin-top:10px; max-width:500px;}

.mobile #checkout { width:100%; max-width:700px;float:right;}

.mobile  #checkout form{
border:0px;
padding:20px;
border-radius:4px; 
} 

/* timer for basket */
#timedOut{ background-color:#f9f9f9; padding:30px 20px; position:fixed; top:calc(50% - 50px); left:calc(50% - 150px); height:auto; width:300px; border:4px solid #ccc; z-index:100000}
#timedOut p, #timedOut a{ font-size:1em; font-weight:bold; text-align:center}
#timedOut  a{ color:#006699}


#loadingGiftWrap{ display:none}
#giftWrap{margin:15px 0 ; }
#giftWrap ul { display:block; clear:both; text-align:right;  border:3px solid;border-color: #e1e1e1; border-radius: 4px; float:right;width:460px; max-width:100%;padding:8px 22px 14px 22px ;}
#giftWrap h5{
display:block;
clear:both;
text-align:right;
font-weight:bold;
color:#FF3366;
padding:0px 26px 0  0;
height:30px;
line-height:30px;
font-size:0.9em;
background-image:url(../images/giftwrapIcon.png);
background-position:right 50%;
background-repeat: no-repeat;
margin:0 2px 8px 0;/* line up icon with options  match shipping font size */
}
 
#giftWrap p#giftWrapInfo{ display:block; clear:both; text-align:right; font-size:0.8em; padding-top:5px; }
#giftWrap hr{display:block; background:none; border:none; clear:both} 

#freeGifts{ display:block; margin:8px  auto;   padding-bottom:10px;  }
#freeGifts h5{ display:block;  font-size:0.8em; font-weight:bold ; margin-bottom:10px; text-transform:uppercase; }
#freeGifts h5 strong{ color:#FF0000}
#freeGifts ul { padding:0px;}


#freeGifts li,
#checkout #freeGifts li {display:block; height:auto; padding-top:10px;
margin:8px  auto 0 auto;  }

#freeGifts li:last-child, #checkout #freeGifts li:last-child{ }

#freeGifts li label, #checkout #freeGifts li label { margin:0 0  0px 0; display:block;  float:left; width:420px;    }
.mobile #freeGifts li label,  .mobile  #checkout #freeGifts li label {  width:calc(100% - 60px);   }

#freeGifts a{ width:50px; height:50px; line-height:42px;  position:relative; text-align:center; display:block;border:1px solid #ccc; float:right; background-color:#fff; border-radius:2px;}
#freeGifts li img{ max-width:90%; max-height:90%;vertical-align:middle; }
#freeGifts li strong{ font-wieght:bold; display:block}
#freeGifts hr , #checkout #freeGifts hr{ display:block; background:none; border-bottom:1px solid #ccc; clear:both; height:0px; margin:0; } 
