/*####################
##### HTML, BODY #####
#####################*/ 

body {
	font-family				: Arial, Helvetica, sans-serif;
	font-size				: 12px;
	color					: #322E25;
	text-align				: center;
	margin					: 0px 0px 0px 0px;
	padding 				: 0px 0px 0px 0px;
	background-color		: #EDE9E4;
	behavior				: url('htc/csshover.htc');
}
	
#menuh{float:none;}
#menuh ul li{float:left; width: 100%;}
#menuh a{height:1%;font:bold 0.7em/1.4em arial, sans-serif;}


/*###################
##### CONTAINER #####
###################*/ 

#container{
	width					: 800px;
	height					: auto;
	margin					: 20px auto 20px auto;
	padding					: 20px 20px 20px 20px;
	text-align				: left;
	border					: 1px solid #CCCCCC;
	display					: block;
	background-color		: #FFFFFF;
}

#containerInner{	
	display					: block;
	width					: 800px;
	background 				: #FFF url('../images/bkgrndContent.gif') top left repeat-x;
}



/*###############
##### FONTS #####
###############*/ 

p{
	margin					: 0px 0px 0px 0px;
	padding		 			: 5px 0px 5px 0px;
	font-size 				: 105%;
	line-height				: 1.4em;
}


h1{  /*  Page Titles */
	margin					: 0px 0px 0px 0px;
	padding		 			: 0px 0px 5px 0px;
	font-size 				: 170%;
	font-weight				: normal;
	color					: #0A6FBD;
}

h2{  /*  Sub titles */
	margin					: 8px 0px 0px 0px;
	padding		 			: 0px 0px 0px 0px;
	line-height				: 1.5em;
	font-size 				: 110%;
	font-weight				: bold;
	color					: #0A6FBD;
}

h3{  /*  Sub titles */
	margin					: 0px 0px 0px 0px;
	padding		 			: 4px 0px 5px 0px;
	line-height				: 1.5em;
	font-size 				: 140%;
	font-weight				: bold;
	color					: #CC0000;
}


#content ul, #contentRight ul {
	margin					: 10px 0px 10px 10px;
	padding 				: 0px 0px 0px 0px;
	list-style				: none;
}

#content ul li, #contentRight ul li{
	margin					: 0px 0px 0px 5px;
	padding 				: 0px 0px 5px 15px;
	line-height				: 1.4em;
	background				: url('../images/icons/bullet.gif') top left no-repeat;
}

#content ul ul li, #contentRight ul ul li{
	margin					: 0px 0px 0px 5px;
	padding 				: 0px 0px 5px 15px;
	line-height				: 1.4em;
	background				: url('../images/icons/bullet2.gif') top left no-repeat;
}

a{
	color					: #666666;
	text-decoration			: underline;
}

a:hover {
	color					: #000000;
	text-decoration			: underline;
}



/*##############
#### HEADER ####
#############*/ 
	
#header{
	display 				: block;
	width					: 800px;	
	height					: 129px;
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	background				: url('../images/bkgrndHeader.gif') top left repeat-x;
	
}


.title{
	margin					: 60px -110px 0px 0px;
	padding					: 0px 0px 0px 0px;
	border					: none;
	float					: right;
}



.logo{
	margin					: 6px 0px 0px 20px;
	padding					: 0px 0px 0px 0px;
	border					: none;
	float					: left;
}

.logoLS{
	margin					: 6px 20px 0px 0px;
	padding					: 0px 0px 0px 0px;
	border					: none;
	float					: right;
}

.headerPhone{
	margin					: 67px 10px 0px 0px;
	padding					: 0px 0px 0px 0px;
	border					: none;
	font-size               : 260%;
	color                   : #FFF;
	float					: right;
}

#navTop{
	margin 					: 0px 15px 0px 0px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	list-style 				: none;
	height					: 31px;
	float					: right;
}

ul#navTop li{
	display 				: inline;
}

ul#navTop li a{
	margin					: 10px 0px 0px 0px;
	padding					: 0px 15px 0px 15px;
	display 				: block;
	float 					: left;
	text-decoration 		: none;
	width					: 9px;
	height 					: 9px;
	border-right			: 1px dotted #CCC;
}


ul#navTop li a.navTopHome{
	background				: url('../images/home.gif') top center no-repeat;
}

ul#navTop li a.navTopHome:hover{
	background				: url('../images/home.gif') bottom center no-repeat;
}

ul#navTop li a.navTopContact{
	background				: url('../images/contact.gif') top center no-repeat;
}

ul#navTop li a.navTopContact:hover{
	background				: url('../images/contact.gif') bottom center no-repeat;
}

ul#navTop li a.navTopMap{
	background				: url('../images/sitemap.gif') top center no-repeat;
}

ul#navTop li a.navTopMap:hover{
	background				: url('../images/sitemap.gif') bottom center no-repeat;
}




/*##################
#### NAVIGATION ####
##################*/ 

#navigation{
	width					: 736px;
	height					: auto;
	margin					: -15px 0px 0px 20px;
	padding					: 12px 12px 12px 12px;
	border					: 1px solid #CCCCCC;
	display					: block;
	background-color		: #FFFFFF;	
}

/* ---- MAIN NAV ---- */

#navMain{

	margin 					: 0px 0px 1px 0px;
	padding					: 0px 0px 0px 0px;
	display 				: block;
	list-style 				: none;
	width					: 736px;
	height					: 31px;
	background				: url('../images/bkgrndNav.gif') top left;
}
	
#navMain ul{
	margin 					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	list-style				: none;
	float					: left;
}


#navMain li{
	position				: relative;
	display 				: inline;
}

		
#navMain a{	
	margin					: 0px 0px 0px 0px;
	padding					: 8px 14px 0px 14px;
	display 				: block;
	float 					: left;
	color					: #237ECB;
	text-decoration 		: none;
	font-size 				: 13px;
	text-align				: center;
	height 					: 23px;
	font-weight				: normal;	
	
}
	
#navMain a:hover, #navMain a.selected{
	text-decoration 		: none;
	color					: #FFF;
	background				: url('../images/bkgrndNavOver.gif') top left;
}


#navMain ul ul{
	position				: absolute;
	margin 					: 34px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	display					: none;
	width					: 168px;
	z-index					: 500;
	border					: 1px solid #999999;
	background-color		: #333333;
}

#navMain ul ul li{
	position				: relative;
	display 				: inline;
}

	
	
#navMain ul ul a{
	margin					: 0px 0px 0px 0px;
	padding					: 7px 15px 7px 15px;
	display 				: block;
	float 					: left;
	color					: #999999;
	text-decoration 		: none;
	font-size 				: 11px;
	font-weight				: normal;
	text-align				: left;
	height 					: auto;
	width					: 138px;
	line-height				: 1.4em;
	border					: none;
	border-top				: 1px solid #999999;
	text-transform			: none;
}

#navMain ul ul a:hover{	
	text-decoration 		: none;
	color					: #FFFFFF;
	background-color		: #666666;
	background-image		: none;
}



#navMain ul a span{
	background				: url('../images/arrow1.gif') right no-repeat;
	margin					: 0px 0px 0px 0px;
	padding					: 0px 20px 0px 0px;
}



div#navMain li:hover ul ul,
div#navMain li li:hover ul ul,
div#navMain li li li:hover ul ul,
div#navMain li li li li:hover ul ul
{display:none;}

div#navMain li:hover ul,
div#navMain li li:hover ul,
div#navMain li li li:hover ul,
div#navMain li li li li:hover ul
{display:block;}




.banner{
	margin					: 1px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;

}


/*###############
#### CONTENT ####
###############*/ 

#content{
	display 				: block;
	width					: 762px;	
	min-height				: 260px;
	margin					: 15px 0px 15px 0px;
	padding					: 0px 20px 0px 20px;
	float					: left;	
}

*html #content{	
	height					: 260px;
}

.sideContent{
	display 				: block;	
	min-height				: 15px;
	margin					: 0px 0px 15px 20px;
	padding					: 15px;
	float					: right;	
	border					: 1px solid #CCC;	
}

.sideContent img{
	margin					: 0px 0px 15px 0px;
	padding					: 0px 0px 0px 0px;
}

/*#######################
#### BLIND SELECTION ####
#######################*/ 

#blindSelect{
	display 				: block;
	width					: 370px;	
	height					: 260px;
	margin					: 0px 0px 5px 15px;
	padding					: 0px 0px 0px 0px;
	float					: right;	
	font-size				: 11px;
	border					: 1px solid #CCCCCC;
}

.blindSelectHeader{
	display 				: block;
	margin					: 0px 0px 0px 0px;
	padding					: 6px 0px 0px 12px;
	height					: 25px;
	background				: url('../images/bkgrndBlindSelect.gif') top left;
	font-size				: 16px;
	color					: #FFFFFF;
}

.blindSelectContent{
	display 				: block;
	margin					: 0px 0px 0px 0px;
	padding					: 8px 8px 8px 8px;
	height					: auto;
	color					: #333333;
}

.blindSelectFooter{
	display 				: block;
	margin					: 0px 0px 0px 0px;
	padding					: 6px 0px 0px 12px;
	height					: 36px;
	border-top				: 1px solid #CCCCCC;
	background-color		: #E2DCD3;
	font-size				: 20px;
	color					: #333333;
}

.blindSelectFooter span{
	float					: right;
}


/* ------ TABLE SELECTOR ------ */
.tblBlind{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	width					: 355px;
}

.tblBlind td{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	height					: 28px;
}

.tblBlindField{
	margin					: 0px 2px 0px 0px;
	padding					: 3px 5px 0px 5px;
	width					: 25px;
	height					: 15px;
	float					: right;
	border					: 1px solid #999999;
	font-size				: 11px;
	text-align				: right;
}
.tblBlindField2{
	margin					: 0px 2px 0px 0px;
	padding					: 3px 5px 0px 5px;
	border					: 1px solid #999999;
	font-size				: 11px;
	text-align				: right;
	cursor                  : pointer;
}

.tblBlindSelectDDM{
	margin					: 0px 0px 0px 0px;
	padding					: 2px 2px 2px 2px;
	width					: 195px;
	height					: 22px;
	font-size				: 11px;
	border					: 1px solid #999999;
	float					: left;
}

.tblBlindImg{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	float					: right;
	border					: 1px solid #999999
}

.help{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 5px;
	float                   : right;
}


/* ------ COLOUR SELECTOR ------ */
#colourBlue input, #colourWhite input, #colourBeige input, #colourBlack input, #colourDarkBlue input{
	margin					: 0px 0px 0px 3px;
	padding					: 1px 1px 2px 1px;
	float					: left;
	display 				: block;
	/*width					: 36px;*/
	height					: 19px;
	border					: 1px solid #999999;
	background-color		: #83A9D8;
	color					: #333333;
	text-decoration 		: none;
	font-size 				: 11px;
	line-height				: 1.8em;
	text-align				: center;
}

#colourWhite input{
	background-color		: #E9E9E9;
}

#colourBeige input{
	background-color		: #EBD3A9;
}

#colourBlack input{
	background-color		: #000000;
	color                   : #FFFFFF;
}
#colourDarkBlue input{
    background-color        : #000066;
    color                   : #FFFFFF;
}

#colourBlue input:hover, #colourWhite input:hover, #colourBeige input:hover, #colourBlack input:hover, #colourDarkBlue input:hover{
	border					: 1px solid #000000;
}

#colourBlue input.selected, #colourWhite input.selected, #colourBeige input.selected, #colourBlack input:selected, #colourDarkBlue input:selected{
	border					: 1px solid #000000;
}




/*################
##### FOOTER #####
################*/ 

#footer{
	clear					: both;
	width					: 800px;
	height					: 45px;
	margin					: 0px auto 0px auto;
	padding		 			: 0px 0px 0px 0px;
	line-height				: 1.5em;
	font-size				: 11px;
	background				: url('../images/bkgrndFooter.gif') top left;
	color					: #B4B09E
}

.footerLogo{
	margin					: 4px 0px 0px 21px;
	padding		 			: 0px 0px 0px 0px;
	float					: left;
}


#copyright, #terms{
	margin					: 6px 0px 0px 10px;
	padding		 			: 0px 0px 0px 0px;
	float					: left;
	text-align				: left;	
}

#terms {
	margin					: 6px 20px 0px 0px;
	padding		 			: 0px 0px 0px 0px;
	float					: right;
}


#copyright a, #terms a {
	text-decoration			: none;
	padding		 			: 0px 5px 0px 5px;
	color					: #D6D3C9;
}

#copyright a:hover , #terms a:hover{
	color					: #FFFFFF;
	text-decoration			: underline !important;
}



/*###############
##### MISC. #####
###############*/ 

.img{
	margin					: 0px 0px 20px 0px;
	padding		 			: 12px;	
	border					: 1px solid #CCC;
}


.imgRight{
	float					: right;
	margin					: 0px 0px 10px 20px;
	padding		 			: 12px;	
	border					: 1px solid #CCC;
}

#stamps{
	float					: right;
	margin					: 20px 0px 3px 20px;
	padding		 			: 0px 0px 0px 0px;	
}

#stamps img{
	margin					: 0px 0px 0px 0px;
	padding		 			: 0px 0px 5px 0px;	
}

.submitBtn{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 5px 0px 5px;
	display 				: block;
	font-weight				: normal;
	text-align				: center;
	color					: #FFF;
	text-decoration 		: none;
	font-size 				: 11px;
	line-height				: 1.8em;
	height					: 20px;
	width					: 100px;
	float					: right;
	border					: 1px solid #22466F;
	background				: url('../images/btnSubmit.gif') top left;
	cursor					: pointer;
}

.submitBtn:hover{
	background				: url('../images/btnSubmit.gif') bottom left;
	color					: #FFF;
	text-decoration 		: none;
}



/* ---- TABLES AND FORMS ---- */
.tblContact, .tblBrochure, .tblBasket, .tblDetails{
	margin					: 10px 0px 10px 0px;
	padding					: 0px 0px 0px 0px;
	width					: 512px;
	font-size				: 105%;
}

.tblBrochure{
	width					: 750px;

}

.tblContact td, .tblBrochure td{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 5px 5px 0px;	
	vertical-align			: top;
}

.ddField, .ddFieldLong, .textField, .textArea{
	margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 0px 0px;
	width					: 80px;
	height					: 22px;
	float					: left;
	border					: 1px solid #999999;
	font-size				: 12px;
	font-family				: Arial, Helvetica, sans-serif;
}

.ddFieldLong{
	width					: 166px;
}

.textField, .textArea{
	padding					: 3px 2px 0px 2px;
	width					: 160px;
	height					: 16px;
}

.textArea{
	height					: 80px;
}


.brochureBox, .brochureBoxSelected{
    margin					: 0px 0px 0px 0px;
	padding					: 10px 10px 5px 10px;
	border                  : 1px solid #CCCCCC;
	font-size               : 90%;
	min-height              : 166px;
	display:                block;
}

.brochureBox img, .brochureBoxSelected img{
    margin					: 0px 0px 0px 0px;
	padding					: 0px 0px 5px 0px;
}

.brochureBox:hover{
	border                  : 1px solid #333333;
	cursor                  : pointer;
	background-color        : #DEDEDE;
}

.brochureBoxSelected{
    border                  : 1px solid #333333;
	background-color        : #DEDEDE;
	cursor                  : pointer;
}




/*#################################
### Checkout ###
#################################*/ 


.tblCheckout{
	padding					: 0px 0px 0px 0px;
	border:1px solid #999999;
	float:left;
	font-size:11px;
	height:22px;
	margin:0;
	padding:2px;
	width:195px;

	
}





/*#################################
### SAFARI/IE6 HACK FOR NAV BAR ###
### KEEP AT BOTTOM OF THIS PAGE ###
#################################*/ 


#navMain ul ul{
margin:31px 0px 0px 0px;/*IE 5 for PC only*/
voice-family:"\"}\"";
voice-family:inherit;
margin:31px 0px 0px -1px;/*all non-IE 5 browsers*/
}
/*end*/

/*\*/
html*#navMain ul ul{
[margin:31px 0px 0px 0px;/*Affects older Firefox and Netscape browsers only. Seen also by IE5-6 and Safari for Macintosh, which is
addressed below.*/
margin:31px 0px 0px -172px;/*Affects Safari for Macintosh only (v1-3). See also by IE5-6, but thats addressed below. Also
hidden from older Firefox and Netscape browsers.*/
]margin:31px 0px 0px -170px;/*Affects IE 7 only. Seen by IE5-6 but thats addressed below. Hidden from Safari and all
Firefox and Netscape browsers.*/
}/**/
.dummyend[id]{clear:both/*end hack using dummy attribute selector for IE5 mac, else error in CSS occurs!*/}

/*The above rule is hidden from IE for MAC, and read only by older Firefox and Netscape 6-7 and IE5-7 for PC,
and Safari on MAC, in general.*/
/*Newer Firefox and Netscape agents reads rule, but does not read any properties set within [], so is
unaffected by it, probably because it sees these as part of an attribute selector. Those will be hidden.*/
/*IE 7 on PC will correctly read all rules as it will ignore many characters before a property*/
/*Safari for MAC sees each [] as a character and not part of a selector, if one falls before a property.
These cause the property name following the character to not be read, but next line without "[]" property
is  parsed.*/
/*use of [] will break all css selectors following the rule, if all are not closed, as Mozilla-Netscape
read the [] as part of a selector rule, so make sure they are all closed, using dummy selector.*/

/*\*/
* html #navMain ul ul{
margin:31px 0px 0px -170px;/*Finally, be sure to reapply a fix that affects IE 5-6 only here. IE for Mac and IE 7 for PC
are not affected here, which means purple above should work only in IE 7 above!*/
}
/**/