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




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

/*outer */
#header{
width:100%;
min-width:1024px;
background-color:#669;   
z-index:5;
 background-image: linear-gradient( to top , #fff  , #fff );   
position:fixed;
left:0;
right:0;
top:0px;
height:110px;
border-bottom:1px solid #333;
}

 
/*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;
width: 360px;
background-image: url(../images/logo.png);
height:50px;
background-repeat: no-repeat;
background-position:0% 50%;
background-size:contain;
display:block;
top:16px; 
z-index: 2;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms; 
}

#strapLine{
position: absolute;
font-size:10.4px;
font-family:  "Montserrat" , Helvetica, sans-serif;
color: #999;
font-weight:700;
word-spacing: 1px; letter-spacing:1px;
text-transform: uppercase;  
font-style: normal;
text-align:left;
width:660px;
overflow:hidden;
left:0px;
top:82px;
z-index:1;
-webkit-transition: all 200ms;
-moz-transition: all 200ms;
-o-transition: all 200ms;
transition: all 200ms;
} 
 

#logo span{ display:none} 

#telephoneNumber{
position: absolute;
font-size:14.4px;
letter-spacing: 1px;
font-family:  "Montserrat";
color: #333;
font-weight: 500;
right:0px;
padding-left:15px;
top:75px;
height:22px;
line-height:22px;
background-image:url(../images/telMgrey.png);
background-position:left 50%;
background-repeat:no-repeat;
background-size:auto 14px;
} 


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


#header.headerFixed{ height:44px;  }
#header.headerFixed #navMain{ margin-top:0px ;height:45px;border-bottom:1px solid #fff;}  
#header.headerFixed #strapLine, #header.headerFixed #telephoneNumber, #header.headerFixed #navTop , #header.headerFixed #socialTop { display:none}
#header.headerFixed #logo{ height:20px; top:-40px;;}

 	

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

#socialTop li a span {
display:block;
width:30px;
height:30px;
line-height:30px;
margin:0 auto;
background-position:50% 50%;
background-repeat:no-repeat;
background-color: #069;
background-size:16px auto;
border:0px solid #fff;
}

#socialTop li a span{ 
-moz-border-radius:26px;
-webkit-border-radius: 26px;
border-radius:  26px; 
-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; background-color:#333 }


#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: 50px 0 20px 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:44px;
z-index:5;
display:block;
margin:110px  auto 0 auto;
background-color:#00254A; /* header height    */
width:100%;
-webkit-transition: margin 100ms;
-moz-transition: margin 100ms;
-o-transition: margin 100ms;
transition: margin 100ms;
}

#navMain ul  {
padding:0px 0 0 0; 
width:1000px; 
margin: 0px  auto 0 auto; 
 z-index:1;    text-align:left;    
} 
#navMain li { display:block; float:left;  z-index:1;  margin:0px; font-size:0; padding:0; position:relative } 


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

#navMain ul  li a  {
 background-image:url(../images/nav/navBorderRight.png); background-position:right top; background-repeat:repeat-y; 	
text-align:center;line-height:44px;
letter-spacing: 0px; margin:0 0 0 -4px;  
color: #e1e1e1;
text-transform: uppercase;
display:inline-block;
font-weight:400;
padding: 0px 10px;
text-decoration:none;
font-size:10.4px;
letter-spacing:0.02em;
transition: all 100ms ease-in-out 0s;
}
 #navMain li:last-child  a { background-image:none}


#navMain ul  li a.mainCategory{ }/* hide border on previous 	*/
#navMain ul  li a.mainCategory span{
width:12px;
height:8px;
display:inline-block;
margin-left:2px;
background-image:url(../images/nav/arrowDownWhite.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/arrowDownWhite.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;    }
#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:#111;
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:44px;
background-color:#111;
left: -4px;
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:12px;
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:15px  auto;  }
	
#contactFormWrapper h3{
/*display:block;
text-decoration:none;
clear:both; 
width:100%;
padding:10px 15px ;
margin: 0px auto 0px auto;
border-radius: 6px 6px 0 0;
font-size:1em;
font-weight: normal;
text-align:left;
background-color: #999;
text-indent:0px; ;
color: #fff;
border:0px solid #ccc;*/
 display:none
}

#contactForm   { 
display:block;
border:3px solid #888;  background-color:#fff; /*border-top:none; */
padding:24px 40px    ;border-radius: 5px   ; 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;border-radius: 6px 6px  ;
 
width:100%; 
border:2px solid #e1e1e1;
color:#333333; font-size:0.95em;
padding: 7px; margin:4px auto 10px auto
 
}

#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 .checkboxRadioList li{ display:inline-block; clear:none; margin:0 20px 0 0; font-size:15px}

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

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

#contactForm input#sendEnquiry,
#sendEnquiry{
height:38px;
line-height:38px;
width:270px;
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:4px;
}
#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; }
 


 
