/* © 2008 Fresh Approach */
/* XHTML / CSS Helen Barclay'08 */
@import url(headers.css);
@import url(cat-nav.css);
@import url(details.css);
@import url(tabs.css);
@import url(db.css);

/* -- GLOBAL STYLES 
-------------------------------------------------------------------------------*/
html, body {
 } 

body {
	font-family:Arial, Helvetica, sans-serif;
	font-size:62.5%;
	color:#606060;
	background:url(../../images/css/page-bg.gif) repeat-x;
	height:100%;
	}


/* -- RESET DEFAULT
-------------------------------------------------------------------------------*/
body, h1, h2, h3, h4, h5, ul, ul li, ol, ol li, form, input, fieldset, label, dl, dt, dd { 
	margin:0; padding:0; }

	
	
ul li, ol li { list-style-type:none; }

legend {display: none;}



.invisible, hr {display:none; }
.cleaner{clear:both;}
h3.cleaner {
	clear:both;
	color:#AAACAF;
	font-size: 1.8em;
	text-transform: uppercase;
	border-bottom:solid 1px #BFBFBF;
	padding:0 0 10px 0;
}

.txt-red{color: #FF0000; vertical-align:super;}
.txt-white{color: #fff; vertical-align:super;}

/* -- GLOBAL LINK STYLES 
-------------------------------------------------------------------------------*/
a {
	outline:none;}

img {
	border:none;
	vertical-align: middle;
}

a:link, a, a:visited, a:active{
	color:#A6A5A0;
	text-decoration:none;
}

a:hover{
	color:#606060;
	text-decoration:underline;
}

h2 {
	color:#bfbfbf;
	font-size:4em;
	letter-spacing: -2px;
	text-transform:uppercase;
}

.floatright {float:right;}

.hrdivider {clear:both; height:1px; background:#CBCBCB; margin:10px 0 10px 0; padding:0; border:none;}
.hrnone {clear:both; height:1px; background:none; background-position:bottom; margin:0; padding:0; border:none;}


/* -- GLOBAL TYPOGRAPHY
-------------------------------------------------------------------------------*/
#sitewrapper {
	margin:0 auto;
	width:960px;
	font-size:1.1em;
	min-height:100%;
}

#header {
	display:block;
	height:130px;
}

#header .search {
	float:right;
	/*margin:20px 0 0 0;*/
	/* added the below margins - 19/01/09*/
	margin:20px 25px 0 0;
}

#header .search input {
	font-size:0.9em;
	width:200px;
	color:#999999;
	vertical-align:middle;
	margin:0 5px 0 0;
}

/* added by Fauzia - 19/01/09 */
#header .button  {
	clear: right;
	float : right;	
	margin: -20px 0 0 0;
}

#banner {
	margin:10px 0 10px 0;
}

#black {
	clear:both;
	height:145px;
	background: url(../../images/css/blackbg.png) no-repeat;
	color:#ffffff;
	overflow:hidden;
}

#black ul {}

#black ul li {
	width:152px;
	float:left;
	padding:20px;
}

#black h3 {
	color:#ffd102;
	text-transform: uppercase;
	font-size:1.6em;
	display:inline;
	margin:0 0 0 10px;
}

#black h3 a, #black h3 a:link, #black h3 a:visited, #black h3 a:active{color:#FFD102;}
#black h3 a:hover{color:#ffffff;}

#features {
	width:980px;
	float:left;
	margin:20px 0 20px 0;
	background:url(../../images/css/linksbg.gif) repeat-y;
}

#features .link-item {
	width:152px;
	float:left;
	padding:0 20px 0 20px;
}

#features .products, #features .products a, #features .products a:link, #features .products a:active, #features .products a:visited  {	color:#809dac;}
#features .indlinks, #features .indlinks a, #features .indlinks a:link, #features .indlinks a:active, #features .indlinks a:visited  {color:#7a7c7f;}
#features .applications, #features .applications a, #features .applications a:link, #features .applications a:active, #features .applications a:visited  {color:#989788;}
#features .environment, #features .environment a, #features .environment a:link, #features .environment a:active, #features .environment a:visited  {color:#9db180;}
#features .news, #features .news a, #features .news a:link, #features .news a:active, #features .news a:visited  {color:#aaacaf;}


#features .link-item h3 {
	display:inline;
	font-size:1.4em;
	margin:0 0 0 10px;
}


ul#products {
	list-style-type: disc;
	list-style-image: url(../../images/icons/product-bullet.gif);
	list-style-position: inside;
	margin:10px 0 0 0;
	padding-left: 1em;
	text-indent: -0.5em;
}

ul#links {
	list-style-type: disc;
	list-style-image: url(../../images/icons/links-bullet.gif);
	list-style-position: inside;
	margin:10px 0 0 0;
	padding-left: 1em;
	text-indent: -0.5em;
}

ul#news {
	list-style-type: disc;
	list-style-image: url(../../images/icons/news-bullet.gif);
	list-style-position: outside;
	margin:0 0 0 15px;
}

ul#products li, ul#links li{
	line-height:1.8em;
	font-weight: bold;
}

ul#news li{
	line-height:auto;
	font-weight: bold;
	margin:0 0 5px 0;
}

#footer {
	border-top:solid 5px #a6a5a0;
	margin:20px 0 50px 0;
	clear:both;
}

#footer ul, #footer p{float:left; display:inline; margin:10px 0 10px 0;}
#footer ul li{
	list-style-type: none;
	display:inline;
	padding:0 5px 0 5px;
	margin:0;
	background:url(../../images/css/nav-divider.gif) no-repeat;
	background-position:right;
}


#content {
	float:left;
	padding:20px;
	margin:10px 0 0 0;
	width:920px;
	background:url(../../images/css/whitebg.png) no-repeat;
}

#bottom{
	clear:both;
	background:url(../../images/css/white-bottom.png) no-repeat;
	height:25px;
	margin:0 0 10px 0;
}

ul#product-item{
	clear:both;
}

ul#product-item li{
	float:left;
	display:inline;
	width:184px;
	text-align:center;
	margin:0 0 10px 0;
	height:207px;
	overflow:hidden;
}

ul#product-item h3 {
	font-size:14px;
}

ul#product-item li h3 a, ul#product-item li h3 a:link, ul#product-item li h3 a:visited, ul#product-item li h3 a:active {
	text-align:left;
	padding:0 20px 0 20px;
	display:block;
	float:left; 
	display:inline; 
	background:url(../../images/icons/more.gif) no-repeat;
	margin:0; 
	color:black;
}

ul#track-item li {
	float:left;
	width:100%;
	padding:10px 0 10px 0;
	margin:0 0 10px 0;
	border:solid 1px #e7e7e7;
}

ul#track-item li img {
	float:left;
	margin:0 0 10px 0;
}

ul#track-item h3 {
	font-size:14px;
	/* added the 2 lines below to ensure track-item h3 is displayed under the image
	added by Fauiza - 23 Jan 09 */
	clear: both;
	padding-left: 10px;
}


ul#track-item li h3 a, ul#track-item li h3 a:link, ul#track-item li h3 a:visited, ul#track-item li h3 a:active {
	text-align:left;
	padding:0 20px 0 20px;
	display:block;
	float:left; 
	display:inline; 
	background:url(../../images/icons/more.gif) no-repeat;
	margin:0; 
	color:black;
}

ul#product-item li h3 a:hover, ul#track-item li h3 a:hover {
	background:url(../../images/icons/black-more.gif) no-repeat;
	color:white;
	text-decoration:none;
}


ul#breadcrumb {
	margin:10px 0 0 0;
}

ul#breadcrumb li {
	list-style-type: none;
	display:inline;
	padding:0 10px 0 10px;
	margin:0;
	background:url(../../images/css/crumb-divider.png) no-repeat;
	background-position:right;
}

h2.header {
	float:left;
	color:#bfbfbf;
	font-size:4em;
	letter-spacing: -2px;
	text-transform:uppercase;
	padding:0 0 20px 0;
	margin:0;
}

p.desc {
	float:left;
	display:inline;
	padding:0 0 20px 40px;
	margin:0;
	font-size:1.6em;
	color:#bfbfbf;
	width:450px;
}

h2.pagehdr{
	color:#bfbfbf;
	font-size:4em;
	letter-spacing: -2px;
	padding:0 0 20px 0;
	margin:0;
}

h2.sectionhdr{
	color:#bfbfbf;
	font-size:2.5em;
	padding:0 0 20px 0;
	margin:0;
}


/* #col-three h3, - added by Fauzia on 2/2/09 - used for press page heading text*/
#col-one h3, #col-three h3, #col-four h3, #col-six h3{
	clear:both;
	color:#FFD102;
	font-size:1.4em;
	margin:0 0 20px 0;
	padding:0;
}

#col-one h4, #col-four h4 {
	clear:both;
	display:inline;
	font-size:1.4em;
	margin:0;
	padding:0;
}

#lhs-nav {float:left; width:160px; margin:0 20px 0 0;}
#lhs-nav h3 {color:#FFD102; font-size:1.5em;}
#lhs-nav h4 {color:#FFD102; font-size:1.5em;}
#lhs-nav ul {list-style-type: disc; list-style-image: url(../../images/icons/lhs-bullet.gif);list-style-position: outside; margin:0 0 20px 25px;}
#lhs-nav ul li {line-height:1.8em; font-weight: bold;}
#lhs-nav ul li.highlight {line-height:1.8em; font-weight: bold; color:#FFD102; list-style-image: url(../../images/icons/highlight-bullet.gif);}

#col-one {clear:both; float:left; width:520px;}
/*add by Fauzia to change font size - 27th Feb 09*/
#col-one p{font-size:1.2em;}
#col-two {float:right;	width:350px;}
#col-three {float:left; width:740px;}
#col-four{float:left; width:370px; margin:0 20px 0 0;}
#col-five {float:left; width:530px; margin:0;}
/*add by Fauzia - 21st Jan 09 - latest products column*/
#col-six {float:left;}

.news-item{float:left;border-bottom:solid 1px #BFBFBF; padding:10px 0 10px 0;}
.top {border-top:solid 1px #BFBFBF;}
.news-left {float:left; width:460px;font-size:1.2em;}
.news-left h3, .item-left h3 {color:#FFD102;font-size:2em;}
.news-left h4, .item-left h4{font-size:1em;}
.news-left a, .item-left a{color:#FFD102; font-weight:bold;}
.news-right {float:right; margin:0 0 0 40px;}

.news-story{float:left; padding:0;}
.item-left {float:left; width:700px;font-size:1.2em;}
.item-right {float:right; margin:0 0 0 40px; width:260px;}
.item-right h3 {color:#FFD102; margin:10px 0 0 0; font-size:1.5em;}

ul.downloads {border-top:solid 1px #BFBFBF;}
ul.results {margin:0 0 20px 0;}

ul.downloads  li, ul.results li {
	border-bottom:solid 1px #BFBFBF;
	padding:10px 10px 10px 0;
	font-size:1.2em;
}




#basket {
	display:none; 
   position:absolute; 
   left:250px; 
   top:95px; 
   border-style: solid; 
   background-color: white; 
   padding: 20px;
	background:#ffffff;
	width:300px;
	border:solid 1px #BFBFBF;
	overflow:auto;
	height:300px;
}

#basket table {width:280px;}
#basket table tr th{text-align:left;background:#bfbfbf;  padding:5px;}
#basket table tr td {border-bottom: solid 1px #bfbfbf; padding:5px;}
#basket table tr td.none {border-bottom: none; text-align:right; padding:5px;}

#landing {
	clear: both;
	padding:0 0 20px 0;
}
#landing img {
	float:left;
	margin:20px 20px 0 0;
}

#landing img.end {
	margin:20px 0 0 0;
}

ul.search{clear:both;}
ul.search li {
	border-bottom:solid 1px #BFBFBF;
	padding:10px 0 10px 0;
}




#maps{clear:both; margin:0; width:100%;}
#maps .info-box{
	clear:both;
	float:left;
	border:solid 1px #cfcbcb;
	margin:0;
	display: none;
	width:520px;
 }
 
#maps .info-on{display: block;}
#maps a:link,  #maps a:visited,  #maps a:active {color:#000000;}

ul#map{
	float:left;
	display:inline;
  	padding: 0;
  	margin:20px 0 0 0;
  	list-style: none;
	line-height:0; /*important or IE stuffs up*/
	width:262px;
}

ul#map h4 {
	font-size:1.1em;
}

ul#map li a {
    float:left;
    display:block;
    height:31px;
    background:url(../../images/map/tabs.gif) no-repeat;
	 line-height:14px;
	 text-indent:-5000px; /* this is important, it moves the soft-text off screen*/ 
	 text-decoration: none; /*bit odd but firefox doesn't move the underline of you don't do this*/
	}	
	


ul#map li#tabli1 a:link, ul#map li#tabli1 a:active, ul#map li#tabli1 a:visited  {width:128px;} /* this is the width of the button */
ul#map li#tabli1 a:hover {background-position:0 -31px;} /* this moves the graphic up by 1 row (30px) to form the overstate */

ul#map li#tabli2 a:link, ul#map li#tabli2 a:active, ul#map li#tabli2 a:visited  {width:134px; /* again, the width of the button */
background-position: -128px 0;/* this is the width of the previous button */} 
ul#map li#tabli2 a:hover {background-position:-128px -31px;} /* this moves the graphic up by 1 row (37px) to form the overstate */


ul#map li.on1 a {background:url(../../images/map/maptab_on.gif);}
ul#map li.on2 a {background:url(../../images/map/maptab_on.gif);}


.form{background:#E7E7E7; padding:20px;}
.form dl {margin:15px 0 15px 0;}
.form dt {float:left; margin:0 0 7px 0; width:120px; text-align:left;}
.form dd {float:none; margin:0 0 7px 0;}
.form dl input {width:240px; font-size:1em; padding:3px;}
.form dl textarea {width:240px;}
.form dl select {font-size:1em;}
.form dl span.checkbox {margin-right:-50px;}

#range {
	clear:both;
}

#range ul {}

#range ul li {
	width: 90px;
	float:left;
	padding:20px;
}

#range ul p {
	text-align:center;
}

#btnadd{display:inline;}
