body {
text-align: left; 
position:relative;  
font-size: 16px;
background-color:#fff; 
} 


/*themes in customer/account MATCH @db/cust/scr/mob*/
.black #header{ background-color:#000}
.darkGray #header{ background-color:#3D3D3D }
.mediumGray #header{ background-color:#555}
.lightGray #header{ background-color:#e1e1e1}
.blue #header{ background-color: #003366}
.white #header{ background-color:#FFFFFF}

.black #navMain a{ color:#fff}
.darkGray #navMain a{ color:#fff}
.mediumGray #navMain a{ color:#fff}
.lightGray #navMain a{ color:#111}
.blue #navMain a{ color:#fff}
.white #navMain a{ color:#333}

.black #strapLine{ color:#999}
.darkGray #strapLine{ color:#ccc}
.mediumGray #strapLine{ color:#ccc}
.lightGray #strapLine{ color:#333}
.blue #strapLine{ color:#fff}
.white #strapLine{ color: #999999}

.black #telephoneNumber{ color:#A8A8A8 }
.darkGray #telephoneNumber{ color:#ccc}
.mediumGray #telephoneNumber{ color:#e1e1e1}
.lightGray #telephoneNumber{ color:#222}
.blue #telephoneNumber{ color:#e1e1e1}
.white #telephoneNumber{ color:#555}
 
/*themes in customer/account MATCH @db/cust/scr/mob NB SEARCH STYLES BELOW TOO*/


#wrapper {
width:100%;
min-width:1024px; 
margin:0px auto;   
min-height:100%; 
padding-top:140px;/* header height    */
}

	

/* HEADER COLOUR PICKED UP FROM DB SETTING */
#header{
width:100%;
min-width:1024px;
z-index:5; 
position:fixed;
left:0;
right:0;
top:0px;
height:140px; 
}

 
/*top inner */ 
#top{ 
width:1000px;  
height: 0px;
position: relative;
z-index:10;
margin:0 auto;
z-index:5;  
}



#logo{
text-align: left;
float: left;
position: absolute;
left: 0px;
top:15px;
width:480px; 
height:70px;
background-repeat: no-repeat;
background-position:left 50%;   
background-size:contain;
display:block; border: none;
z-index: 2; 
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms; 
}

#strapLine{
display:none;
/* colour from theme in index* HIDDEN /
/*position: absolute;
font-size:0.86em;
font-style: normal;
font-weight: 300;
letter-spacing: 0px;
word-spacing: 2px;
text-transform: up;
font-style: normal;
width:400px;
overflow:hidden;
text-align:center;
left:300px;
top:70px;
z-index:1;  
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
font-family: Raleway ,Arial, Helvetica, sans-serif*/
} 
 

#logo span{ display:none} 

#telephoneNumber{
position: absolute;
font-size:0.88em; letter-spacing: -0.01em;
font-family:  "Open Sans" , Helvetica, sans-serif;
color: #999;
font-weight: 200; 
/*text-shadow:1px 1px #222;*/
right:0px;
padding-left:20px;
top:20px; /*12px */ 
height:20px;
line-height:20px;
/*background-image:url(../images/tel.png?2016);
background-position:left 50%;
background-repeat:no-repeat*/
} 


/* for fixed JS header  */
#header{
-webkit-transition: all 100ms;
-moz-transition: all 100ms;
-o-transition: all 100ms;
transition: all 100ms;
}

#header.headerFixed{ height:60px;  }
#header.headerFixed #navMain{ margin-top:14px }  
#header.headerFixed #strapLine, #header.headerFixed #telephoneNumber, #header.headerFixed #navTop , #header.headerFixed #socialTop { display:none}
#header.headerFixed #logo{ top:-100px;  /* height:36px; top:10px;*/}
#header.headerFixed #searchWrap{ display:none}

#searchWrap{  width: 1000px; text-align:right; margin:0 auto; position:relative; height:0; }
#searchForm {
 display:block;
 height:32px;
 text-align:right; width:auto; border:0px solid #ff0000;
 position: absolute; right:0px; top:42px
 
}
#searchForm input[type=text]{
width:200px;
height:30px; 
border-right:0;
display: block;
float:left;
font-size:0.88em;
color:#333;
padding:0 30px 0 10px;
margin:0;
border-radius: 2px 0px 0px 2px;
background-color:#fff;
} 


#searchForm input[type=submit]{
display:block;
float:left;
background:#444;
width:30px;
height:30px;
background-color: none;
font-size:0.01em;
text-align:center;
cursor: pointer;
background-image: url(../images/icons/searchWhite.png);
background-repeat: no-repeat;
background-position: 50% 50%;
background-size:12px;
text-indent:-3000px;
border-radius: 0  2px 2px 0;
}  

.black #searchForm input[type=submit] {background-color: #555;}
.white #searchForm input[type=text]{  border:1px solid #aaa;border-right:none;}
.white #searchForm input[type=submit] {background-color: #aaa;}
.darkGray #searchForm input[type=submit] {background-color: #000;}
.mediumGray #searchForm input[type=submit] {background-color: #000;}
.lightGray #searchForm input[type=text]{  border:1px solid #999;border-right:none;}
.lightGray #searchForm input[type=submit] {background-color: #999;}
 

#searchError{
	position:absolute;
	top:0px;
	right:0px;
	width:250px;
	background-color:#FFFFFF;
	text-align:left;
	font-size:0.8em;
	padding:4px;
	border:3px solid #ff0000;
	display:none; 
}


 	

/* top section social networking*/
#socialTop{ position:absolute; right:0px; top:50px; width:auto; text-align:right; z-index:1;height:30px; }
#socialTop li{ display:block; float:left;   text-align:center; margin-right:10px; }
#socialTop li:last-child{ margin-right:0}

#socialTop li a span {
display:block;
width:22px;
height:22px;
line-height:22px;
margin:0 auto;
background-position:50% 50%;
background-repeat:no-repeat;
background-color: #006699;
background-size:14px;
border:0px solid #e1e1e1;
}

#socialTop li a span{ 
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
border-radius:2px; 
-webkit-transition: all 100ms ease-in-out 0s;
-moz-transition: all 100ms ease-in-out 0s;
-o-transition: all 100ms ease-in-out 0s;
transition: all 100ms ease-in-out 0s;
}
#socialTop li a:hover span {background-size:20px; }


#socialTop li a strong {
display:none;
width:100%;
overflow:hidden;
font-size:0.7em; padding:4px 0 0 0;
font-weight:normal;
text-align:center;  
-webkit-transition: all 200ms ease-in-out 0s;
-moz-transition: all 200ms ease-in-out 0s;
-o-transition: all 200ms ease-in-out 0s;
transition: all 200ms ease-in-out 0s;
}
#socialTop li a:hover strong { display:none;color: #555;}
#socialTop li a span{ }

  

#contentWrapper{ padding: 0px 0 50px 0; width:1000px; margin:0px auto 0px auto; min-height:520px;}
 

.contentLeft  {width:240px; float:left;	 }
.contentRight {width:735px; float:right;  }
.contentFull {	background:#fff;	}
 

  
#mobileMenuOpener{ display:none}
#homeIconMobile{ display:none}
  
	

#navMain *{  z-index:5; font-family: "Open Sans", Arial, Helvetica, sans-serif}
#navMain { 
height:30px;line-height:30px;
z-index:5;
display:block;
margin:92px  auto 0 auto;
width:1000px;  
-webkit-transition: margin 200ms;
-moz-transition: margin 200ms;
-o-transition: margin 200ms;
transition: margin 200ms;
}

#navMain ul  {
padding:0px 0 0 0; 
width:100%; 
margin: 0px  auto 0 auto; float:none;
 z-index:1;    text-align:left;  
} 
#navMain li { display:inline-block;position:relative; z-index:1; } 


#navMain  li a,
#navMain ul ul a  { } 

#navMain ul  li a  {
text-align:center;
letter-spacing: 0px;
/*color: #333; */
/* NAV COLOUR PICKED UP FROM DB SETTING */
text-transform: uppercase;
display:block;
font-weight:400;
padding: 0px 15px;
text-decoration:none;
font-size:0.68em; letter-spacing:0.06em;
transition: all 100ms ease-in-out 0s; 
}
 


#navMain ul  li a.mainCategory{ }/* hide border on previous 	*/
#navMain ul  li a.mainCategory span{
width:10px;
height:8px;
display:inline-block;
margin-left:2px;
background-image:url(../images/nav/arrowDownGray.png);
background-repeat:no-repeat;
background-position:  50%;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
}

#navMain ul li a.mainCategory:hover  span {background-image:url(../images/nav/arrowDownGray.png);}
#navMain ul li a.mainCategoryOpen span{ 
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
transform: rotate(-180deg);
background-image:url(../images/nav/arrowDownGray.png);
}


#navMain ul  li:first-child a   { border-left:none; padding-left:0  }
#navMain  ul li:last-child  a { border-right:none; background:none;  margin-right:0;  }

/*#navMain ul li a.navMainSelected,*/
#navMain ul li a:hover , 
#navMain ul li a.mainCategoryOpen,
#navMain ul li a.mainCategoryOpen:hover{ 
text-decoration: none; background-color: #000; color:#FFFFFF  ;text-shadow:1px 1px #333;
} 

#navMain ul li a:hover,
#navMain ul li a.mainCategory:hover,
#navMain ul li a.mainCategoryOpen,
#navMain ul li a.mainCategoryOpen:hover{
background-color:#000;
background-image:none;
color:#FFFFFF
} /* only with subs	*/


#navMain ul li ul{ /*  all sub ul */
width:320px;
 z-index:1;  
position:absolute; 
height: auto;
top:30px;
background-color:#000;
left: 0px;
padding: 12px 15px 10px 10px ;
display:none	}

/* default show subs */
#navMain ul li:hover ul,
#navMain ul a:hover ul{  } 	

#navMain ul  li .subCatRight{ 
right:0px; 
left:auto
}


#navMain ul li  ul li , 
#navMain ul li  ul li:hover   { display:block; clear:both; width:100%; margin:0  auto; 
background:none; background-image:url(../images/semiTransLine.png); 
background-repeat:repeat-x; background-position: left bottom }

#navMain ul li  ul li:last-child{ background-image:none; border-bottom: none} 


#navMain ul li  ul li a:link,
#navMain ul li  ul li a:visited  {
background:none;
text-align:left;
font-weight: normal;
display:block;
line-height: normal;
height:auto;
padding: 5px 0px 5px 14px; 
text-transform: none;
text-decoration:none;
border:0;
font-size:0.76em; 
color: #fff;
margin:3px auto; 
-webkit-transition: none;
-moz-transition:none;
-o-transition: none  ;
transition:   none; text-shadow: none;
} 

#navMain ul li  ul li:last-child a { border-bottom:0}


#navMain ul li ul li a:hover {
color:#fff; 
text-decoration: underline; 
background-position: 10px -18px; 	
}

/* main menu view full link for mobile*/
#navMainViewFull, p#navMainViewFull{ display:none}

#navMain ul li a#basketLink{ 
}
#navMain ul li a#basketLink span{ 
	background-image:url(../images/shop/cartGray.png);
	background-repeat:no-repeat;
	background-position: 50% 50%;background-size: auto 14px;
	padding-right:16px; font-size:0px; text-indent:-2000px; width:14px; height:22px; display: inline-block
	}
#navMain ul li a#basketLink:hover span{
	background-image:url(../images/shop/cartWhite.png);}


  
 
/* collapsible for side bar form on screen, no + sign padding to create inner illusion  */
#formOpener{ margin:0;height:40px; line-height:40px;}
#formOpener span{ background-image:none;  padding-top:6px;  }

 


.buttons25{ 	width:25px; 	font-size:0.8em;  } 
.buttons50{ 	width:50px; 	font-size:0.8em;  } 
.buttons75{ 	width: 75px; font-size:0.8em; } 
.buttons100{ 	width: 100px;  font-size: 0.8em;} 
.buttons125{ width: 125px; font-size: 0.8em;} 
.buttons150{ width: 150px; font-size: 0.8em;} 
.buttons175{ width: 175px; font-size: 0.8em; } 
.buttons200{ width: 200px; font-size: 0.8em;  } 
.buttons250{ width: 250px; font-size: 0.8em;} 
.buttonsFULL{ width: 100%; font-size: 0.8em;} 

 
	
	

/* side contact form   */ 
 #contactFormWrapper{ display:block; margin:0 auto;  }
	
#contactFormWrapper h3{
display:block;
text-decoration:none;
clear:both; 
width:100%;
padding:5px 0px 6px 0;
margin: 0px auto 0px auto;
border-radius:  0px 0px;
font-size:1em;
font-weight: normal;
text-align:left;
background-color: #333;
text-indent:18px;
border-radius:2px 2px 0 0 ;
color: #fff;
border:0px solid #ccc;
}

#contactForm   { 
display:block;
border:2px solid #e1e1e1;  background-color:#fff; border-top:none; 
padding:10px  ;border-radius:1px; background-image:url(../images/semiOverlay.png); background-repeat:repeat;

}  
#contactForm *{ font-family:Arial, Helvetica, sans-serif}

#contactForm  p{
color:#545454;
display:block;
padding:6px 0 4px 0px;
margin:0;
font-weight:bold;
clear:both;

font-size: 0.75em;
}

#contactForm  br { clear:both; display:block}



#contactForm input, 
#contactForm textarea {
-webkit-appearance: none;
-webkit-border-radius: 0;
border-radius: 0;
-moz-border-radius: 0;

}

#contactForm .inputs{
width:100%;
border:2px solid #e1e1e1;
height:34px;
color:#333333;
padding:0px 0px 0px 4px;

outline:none;
display: block;
clear: both;

margin: 2px 0 0 0;

}
#contactForm .inputsDD{ width:208px; padding:3px 3px; border:2px solid #e1e1e1;  	font-size:11px;
color:#333333; }

#contactForm .inputsDD option{ padding:1px 5px 1px 3px} 

#contactForm .inputBox{
height:60px;
padding:4px;
width:100%; 
border:2px solid #e1e1e1;
color:#333333;
padding:1px 0px 1px 3px;


}

#contactForm #additionalInfo  p{
color: #FF6600
}

#contactForm .inputsErr{ border-color:#ff0000}
#contactForm  .inputsOver { border-color:#999; background:#fff} 

#contactForm  .inputsDDErr  {
border: 2px solid #ff0000;
background-color: #FF0000;
color: #F0F0F0;
} 
#contactForm .inputsDDOver {
border: 2px solid #e3e3e3; 
background-color: #fff;
color: #333;
} 


#contactForm .verificationCode{  
width:20px; background-image:url(../images/verificationCode.png); display:block; float:left; height:24px;margin:0px 0px 0px 0px; }
#contactForm .inputsVerify {
width: 90px; 
float:right;
background:#fff; 
background-color: #FFFFFF;
color:#000;
font-size:1.2em; 
font-weight:bold;
text-transform:uppercase;
letter-spacing:2px;
text-align:center;
border:1px solid #999;
height:24px; 
}

#contactForm .inputsVerifyErr { border-color:red}
 
#contactForm hr{ background: none; border:none}

#contactForm input#sendEnquiry,
#sendEnquiry{
height:32px;
line-height:32px;
width:100%;
background-color:#333;
border: none;
color:#fff;
cursor:pointer;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
text-align:center;
border-radius:2px;
}
#sendEnquiry:hover{ background-color:#333333}


#contactForm ul li label{ font-size:0.75em; line-height:1.1em}  
 
/*eo form  stuff */


 






/* page styles*/ 
  
 
#listingOptions{
padding-top:5px;
background-color:#fff;  
}

#listingOptions #listingTitle,
#listingOptions li#listingTitle {  } 
#listingOptions #listingTitle h3 { font-size:0.8em; padding:0px 5px 0 0; }
 


 
