/* Cloud CSS */

/* 
Note on url paths:
To run locally use: url(../images/design/wrapper.gif)
To run on Websiter use: url(/images/design/wrapper.gif)
*/

body {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	font-family: Arial, Helvetica, sans-serif;
		color: #000000;
		font-size: 14px;
		line-height: 16px;
		margin: 0px; 	padding: 0px;
		background-color: #FFFFFF;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/body-bg.jpg');
		background-position: left top;
		background-repeat: repeat-x;
}

/*  The main wrapper div, position relative. All other div's are absolute within this div.  */
#wpr {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;
		width: 990px;
		margin: 0px auto;
		padding: 0px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/wpr-bg.jpg');
		background-position: left top;
		background-repeat: repeat-y;
	top: 0px;
	left: 0px;
}

/* Header divs */
#hd1 {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;
		margin: 0px; 	padding: 0px;
		left: 0px; 	top: 0px;
		width: 990px;
		height: 217px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/body-bg.jpg');
		background-position: left top;
		background-repeat: repeat-x;
		background-color: #30368E;
}

#hd-lg { /* Cloud logo - within #hd1*/
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		top: 18px;
		left: 47px;
		width: 151px;
		height: 62px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/hd-lg.jpg');
		background-position: left top;
		background-repeat: no-repeat;
}

#hd2 {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;
		margin: 0px; 	padding: 0px;
		left: 71px; 	
top: 7px;
		width: 799px;
		height: 156px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/h2-bg.jpg');
		background-position: left top;
		background-repeat: no-repeat;
		background-color: #FFFFFF;
}

/* Header image rotator - #rt1 is within #hd2, #rt2 to #rt5 are within #wpr */
#rt5 {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		top: 8px;
		left: 8px;
		width: 932px;
		height: 108px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-welcome.jpg');
		background-position: left top;
		background-repeat: no-repeat;
}
#rt4 {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		top: 8px;
		left: 8px;
		width: 932px;
		height: 108px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-welcome.jpg');
		background-position: left top;
		background-repeat: no-repeat;
}
#rt3 {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		top: 8px;
		left: 8px;
		width: 932px;
		height: 108px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-welcome.jpg');
		background-position: left top;
		background-repeat: no-repeat;
}
#rt2 {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		top: 8px;
		left: 8px;
		width: 932px;
		height: 108px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-welcome.jpg');
		background-position: left top;
		background-repeat: no-repeat;
}
#rt1 {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		top: 8px;
		left: 8px;
		width: 932px;
		height: 108px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-welcome.jpg');
		background-position: left top;
		background-repeat: no-repeat;
}
#rt5 {top: 92px; left: 29px;}
#rt4 {top: 92px; left: 29px;}
#rt3 {top: 92px; left: 29px;}
#rt2 {top: 92px; left: 29px;}
#rt2 {background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-hotels.jpg');
}
#rt3 {background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-retail.jpg');
}
#rt4 {background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-leisure.jpg');
}
#rt5 {background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/rt-ocean-liners.jpg');
}

/* Bread crumb trail - within #wpr */
#bc {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		left: 22px; 	top: 200px;
		width: 949px;
		height: 40px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/bc-bg.gif');
		background-position: left bottom;
		background-repeat: no-repeat;
		background-color: #FFFFFF;
		font-weight: normal;
		color: #BFCFDC;
		text-align: left;
		font-family: Gill Sans MT, Arial, Helvetica, sans-serif; /* Menu and headings used Gill Sans MT as first choice, everthing else uses Arial as first choice */
		font-size: 14px;
		line-height: 14px;
}

#bc li a:active {font-weight: normal; color: #BFCFDC; text-decoration: none;} 

#bc li a:visited {font-weight: normal; color: #BFCFDC; text-decoration: none;} 

#bc li a:hover {font-weight: normal; color: #BFCFDC; text-decoration: none;} 

#bc li a {font-weight: normal; color: #BFCFDC; text-decoration: none;} /* Additional specificity of '#bc li a' required over simply '#bc a' as Websiter adds an id in each li */
#bc li a:hover {color: #666666;}

#bc ul {
	list-style-type: none;
	margin: 12px 0px 0px 15px;
	padding: 0px;
}

#bc ul li {
	display: inline;
	white-space: nowrap;
}

#bc a {
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/bc-arrow.gif') no-repeat right center;
	text-decoration: underline;
	margin: 0px 5px 0px 0px;	
	padding: 0px 19px 0px 0px;
}

#bc a.last {background: none;}  /* Don't show image after last item in breadcrumb trail. Websiter adds the class 'last' to the last a-tag in the trail */
	

/* Footers */
#ft2 {
	position: relative;
	margin: 0px; border: 0px; padding: 0px;
}
#ft1 {
	position: relative;
	margin: 0px; border: 0px; padding: 0px;
}
#ft1 {
	width: 990px;
	height: 53px;
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ft1.jpg');
	background-position: left bottom;
	background-repeat: no-repeat;
	clear: both;
	margin: 20px 0px 0px 0px; /* Margin top sets distance between content and footer */
}
#ft2 {
	top: 0px; left: 31px;
	width: 930px;
	height: 23px;
	background-color: #BFCFDC;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ft2.gif') repeat-x 0 0;
}
/* Privacy, Terms, etc, see below for styling of #f2 links */
#ft2r {
	margin: 5px 10px 0px 10px; border: 0px; padding: 0px;
	font-size: 12px;
	line-height: 12px;
	color: #FFFFFF;
	float: left;
}
#ft2l {
	margin: 5px 10px 0px 10px; border: 0px; padding: 0px;
	font-size: 12px;
	line-height: 12px;
	color: #FFFFFF;
	float: left;
}
#ft2r {float: right;}

/* Footer links */
#ft2 a {color: #FFFFFF; font-weight: normal;}
#ft2 a:hover {color: #666666;}


/* Quick links in right hand menu */
#ql-wpr { /* Quick links wrapper */
	position: absolute;
	margin: 0px; border: 0px; padding: 0px;
	top: 244px; /* To meet orginal design use top: 356px; */
	left: 746px;
	width: 215px;
}
.ql-box {/* Quick link box */
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;
		margin: 0px 0px 7px 0px; 	padding: 0px;
	width: 191px;
}

.ql-datasheets {
	height: 0px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ql-datasheets.jpg') no-repeat 0 0;
	top: 46px;
	left: 24px;
}
.ql-datasheets:hover {background: url('ql-datasheets-hvr.jpg') no-repeat 0 0; 
cursor: pointer;
}

.ql-faq {
	height: 96px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ql-faq.jpg') no-repeat 0 0;
	top: 14px;
	left: 1px;
}
.ql-faq:hover {background: url('ql-faq-hvr.jpg') no-repeat 0 0; 
cursor: pointer;
}

.ql-hd {/* Quick link box heading */
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;
		margin: 0px; 	padding: 0px;
		height: 17px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ql-hd-bg.jpg') repeat-x 0 0;
	top: 22px;
	left: 0px;
	width: 191px;
}
.ql-hd p {
	margin: 0px; border: 0px; padding: 5px 0px 0px 12px;
	color: #FFFFFF;
	font-family: Gill Sans MT, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 13px;
	line-height: 13px;
}

.ql-news {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;
		margin: 0px; 	padding: 0px;
		height: 30px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ql-news-bg.jpg') 0 0; /* Repeat x and y as box can expand down */
}
/* Allow height to extend in standards compliant browsers */
html>body .ql-news {
  height: 89px; 
  min-height: 30px;
	top: 1px;
	left: 0px;
}

#ql-box-btm { /* Container for bottom left and right corners plus line */
	position: relative;
	margin: 0px; border: 0px; padding: 0px;
	width: 215px;
	height: 30px;
}


.ql-box-bl  {
	left: 0px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ql-box-bl.gif') no-repeat 0 0;
}

/* Quick link box line */
.ql-box-ln {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		top: 146px; /* 65px; */
		left: 20px;
		margin: 6px 0px 3px 0px; 	padding: 0px;
		width: 175px;
		height: 46px;
		font-size: 2px; 	line-height: 2px; /* Fix height in IE */
	background: #E7ECF0 url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ql-box-ln-bg.gif') repeat-x 0 0;
	}

/* 'View More' link */
a.more {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 0px;
	padding: 0px 0px 0px 17px;
	text-align: left;
		font-size: 12px; 
		line-height: 12px;
		font-weight: bold;
		color: #004C98;
		text-decoration: none;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/more-blt.gif') no-repeat 0 center;
}
a.more:hover {
	color: #0073D6;
	cursor: pointer;
	background: url('more-blt-hvr.gif') no-repeat 3px center;
}

div.ql-news a.more {
	/* margin: 10px 0px 0px 128px; */
	display: block; /* Allow positioning */
	position: absolute;
	top: 13px; /* 76px; */
	left: 124px;
}

.ql-sb {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;
		margin: 0px; 	padding: 0px;
		height: 172px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/ql-sb-bg.jpg') repeat-x 0 0;
}
div.ql-sb div.ql-box-br {top: 157px;} 
div.ql-sb div.ql-box-bl {top: 157px;} /* Can't simply use bottom 0px 'cos of IE bug */


/* List of links - used for News box and Product features */
ul.lnklst {margin: 0px; border: 0px; padding: 6px 0px 0px 0px;}

ul.lnklst li {
	margin: 0px; border: 0px; padding: 4px 0px 0px 12px;
	width: 200px; /* Correct for within ql-news box */
	list-style: none;
}

/* The span.no-link styling allows text that is not a link to have the same format */
ul.lnklst li span.no-link {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 0px;
	padding: 0px 0px 0px 12px;
	color: #6E6F71;
		display: block; /* Stops text wrap below bullet */
		font-size: 12px;
		line-height: 12px;
		text-decoration: none;
		font-weight: normal;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/lnklst-blt.gif') no-repeat 0 3px;
}
ul.lnklst a {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 0px;
	padding: 0px 0px 0px 12px;
	color: #6E6F71;
		display: block; /* Stops text wrap below bullet */
		font-size: 12px;
		line-height: 12px;
		text-decoration: none;
		font-weight: normal;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/lnklst-blt.gif') no-repeat 0 3px;
}
ul.lnklst a:hover {background-position: 3px 3px; color: #2F307F;} /* The active link hover styling is not applied to (ul.lnklst li span.no-link) */

ul.lnklst li span.no-link {background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/lnklst-no-link-blt.gif') no-repeat 0 3px;
} /* Different bullet to distinguish non-links */

/* Blue links on the products detail page for Accessories, Data Sheet, FAQs, etc - stlyed here so can be used on standard pages */

ul.lnklst-blue {margin: 0px; border: 0px; padding: 6px 0px 0px 0px;}

ul.lnklst-blue li {
	margin: 0px; border: 0px; padding: 4px 0px 0px 0px;
	width: 215px;
	list-style: none;
}

ul.lnklst-blue a {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 0px;
	padding: 7px 0px 7px 12px;
	color: #FFFFFF;
		display: block; /* Keeps length as the li width */
		width: 100%; /* Fills containing table cell */
		font-size: 12px;
		line-height: 12px;
		text-decoration: none;
		font-weight: normal;
	background: #004C98 url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/lnklst-blue-blt.gif') no-repeat 198px 10px; /* Background image top = 3 + 7 padding = 10px */
}
ul.lnklst-blue a:hover {background-position: 195px 10px; background-color: #0073D6; color: #FFFFFF;}


/* Search box */
#srh {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		top: 8px;
		left: 759px;
		width: 213px;
		height: 31px;
	background: #004C98 url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/srh-bg.gif') no-repeat 0 0;
	}

#srh-lbl {
	position: absolute;	
	top: 8px;
	left: 7px;
	width: 44px;
	height: 15px;
	color: #FFFFFF;
	font-size: 11px;
	line-height: 15px;
	margin: 0px; border: 0px; padding: 0px;
}

#srhtxt {
	position: absolute;	
	top: 8px;
	left: 55px;
	height: 15px;
	width: 133px;
	color: #000000;
	font-size: 12px;
	line-height: 14px; /* Required for vertical centring in IE */
	margin: 0px; border: 0px; padding: 0px;
}

#srh-btn {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;	
		top: 10px;
		left: 190px;
		height: 12px;
		width: 13px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/srh-btn.gif') no-repeat 0 0;
		margin: 0px; 	padding: 0px;
}

#srh-btn:hover {background-image: url('srh-btn-hvr.gif'); 
cursor: pointer;
}


#content {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: relative;	
		width: 672px;
		height: 570px;	/* IE takes this as the height and then incorrectly re-sizes if required */
	text-align: center;
		margin: 15px 0px 10px 51px; /* margin at bottom is distance between end of content and footer */
		padding: 0px;
}
/* Standards compliant browsers recognise this height setting */
html>body div#content {
  height: 650px; 
  min-height: 570px;
	top: -3px;
	left: 0px;
}

/* Add right padding and a bit of space between points in lists within the content area */
#content ul {padding-right: 10px;}
#content ol {padding-right: 10px;}
#content li {margin-bottom: 0.5em;}

p {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	text-align: left;
		font-size: 14px; 
		line-height: 18px;
		margin: 0px;
		padding: 14px 0px 0px 0px;
	color: #FFFFFF;
}

/* Standard headings */

h3 {
	font-family: Gill Sans MT, Arial, Helvetica, sans-serif; /* Menu and headings used Gill Sans MT as first choice, everthing else uses Arial as first choice */
	color: #333333;
	font-weight: normal;
	margin: 0px; border: 0px;
	padding: 14px 0px 0px 0px;
}

h2 {
	font-family: Gill Sans MT, Arial, Helvetica, sans-serif; /* Menu and headings used Gill Sans MT as first choice, everthing else uses Arial as first choice */
	color: #333333;
	font-weight: normal;
	margin: 0px; border: 0px;
	padding: 14px 0px 0px 0px;
}

h1 {
	font-family: Gill Sans MT, Arial, Helvetica, sans-serif; /* Menu and headings used Gill Sans MT as first choice, everthing else uses Arial as first choice */
	color: #333333;
	font-weight: normal;
	margin: 0px; border: 0px;
	padding: 14px 0px 0px 0px;
}

h1 {
	color: #004C98;
	font-size: 22px;
	line-height: 22px;
}

h1.grey {color: #BFCFDC;}

h2 {
	color: #333333;
	font-size: 20px;
	line-height: 20px;
}

h3 {
	color: #333333;
	font-size: 18px;
	line-height: 18px;
}

table {margin: 10px 0px 0px 0px;}

hr {
	color: #CCCCCC;
	/*background-color: #CCCCCC; This is set in templatestyle.css so it does not appear as a 1 char high solid line in the webeditor */
	height: 1px;
	margin: 10px;
}

/* Additional styles available from Websiter editor */
.underline {text-decoration: underline;}
.centrealign {text-align: center;}
.rightalign {text-align: right;}

/* Blue box with white text - can be applied to p tags */
.bluebox {
	padding: 10px;
	margin: 10px;
	font-size: 14px; 
	line-height: 20px;
	color: #FFFFFF;
	background-color: #004C98;
}


/* Image styles */
img.right {
	background: #FFFFFF;
	margin-left: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
	float: right;
	border: 1px solid #000000;
}

img.left {
	background: #FFFFFF;
	margin-right: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
	float: left;
	border: 1px solid #000000;
}

/* Class to hide images so they can be pre-loaded. Can be used to hide any object */
.hdn {display: none;}

img {
	background-position: center;
	vertical-align: middle;
}

/* Basic links */
p.a-link { /* p.a-link styles a p to work like an a so it can be used with javascript */
	color: #532E4D;
	text-decoration: underline;
    font-weight: bold;
}
a { /* p.a-link styles a p to work like an a so it can be used with javascript */
	color: #FFFFFF;
	text-decoration: underline;
    font-weight: bold;
}
p.a-link:hover {color: #6B4866;}
a:hover {color: #6B4866;}
/*a:visited {color: #532E4D;}*/

p.a-link {padding: 6px 0px 14px 0px;}
p.a-link:hover {cursor: pointer;}

/* Link in blue box */
p.bluebox a {color: #00B5FA;}
p.bluebox a:hover {color: #7FDEFF;}

a img {border: 0px;} /* Remove border from image links */

/* CSS to replace tables - used for web enquiry forms */

/* The div with class tbl-out centres correctly in standards compliant browsers (as left and right margin set to auto). IE doesn't recognise auto. Div (centrefix) fixes this as IE incorrectly centres an element with text-align:center; */
.centrefix {text-align: center;} 

/* Width and margin set on a containing table wrapper (tbl-out) and not inner table div (tbl-in) to fix the IE width bug */
.tbl-out {
	width: 550px; 
	margin: 0px auto;
	border: 0px;
	padding: 0px;
	text-align: left;
}

.tbl-in {
	margin: 0px;
	border: 1px solid #F5F6F8;
	padding: 5px;
	background-color: #EDF0F5;
}

div.row {
  clear: both;
  margin: 0px; border: 0px; padding: 0px;
}
/* Standards compliant browsers don't add their own spacing so need top padding */
html>body div.row {padding: 2px 0px 0px 0px;}

div.space {
  clear: both;
  height: 6px;
  line-height: 6px;
  margin: 0px; border: 0px; padding: 0px;
}

div.half-space {
  clear: both;
  height: 6px;
  line-height: 6px;
  margin: 0px; border: 0px; padding: 0px;
}
div.space {height: 12px; line-height: 12px;}

div.row label {
	float: left;
	width: 207px;
	text-align: right;
	font-size: 14px; 
	line-height: 18px;
	margin: 2px 0px 0px 0px;
	padding: 0px;
}
span.fld label {width: 80px;} /* Email & Phone radio labels */

/* Class fld (field) defines data input fields */
div.row span.fld {
  float: right;
  width: 300px;
  text-align: left;
  margin-right: 2px;	/* Required to stop right side touching the fieldset border in IE */
}

div.row span.fld-full-width {
  float: left;
  width: 520px;
  text-align: left;
  margin: 0px;
}

/* The spacer is used to ensure the table-div clears the last field. Note not required if fields are enclosed in a fieldset tag */
div.spacer {
  clear: both;
}

/* Class full (full width) ensures fields fill their containing element */
.full {width: 100%;}

.bld {font-weight: bold;}  /* Set bold text in selects */

fieldset {
	border: 1px solid #CAD4DE;
	padding: 0px 8px 10px 5px;	/* Can't add padding to top as IE incorrectly puts this outside the fieldset so have added a bottom margin on the legend */
}

legend {
	border: 1px solid #01759A;
	padding: 2px 5px;
	margin: 0px 0px 10px 0px;
	font-weight: bold;
	color: #FFFFFF;
	background-color: #01759A;
}

form {border: 0px; margin: 0px; padding: 0px;}	/* Stops IE adding space around a form */

/* Style for the input boxes */
/* applied only to inputs within div class inputs so does not have to apply to inputs that are buttons (as cannot be undone with a specific input.btn class). */
div.inputs textarea {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: #222222;
	margin: 2px 0px 0px 0px; padding: 0px; border: 1px solid #7F9DB9; /* Remove border style to stick with sunken default */
	background-color: #FFFFFF !important;   /* Removes yellow background added by Google toolbar and other browser style sheets */
}

div.inputs select {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: #222222;
	margin: 2px 0px 0px 0px; padding: 0px; border: 1px solid #7F9DB9; /* Remove border style to stick with sunken default */
	background-color: #FFFFFF !important;   /* Removes yellow background added by Google toolbar and other browser style sheets */
}

div.inputs input {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 18px;
	color: #222222;
	margin: 2px 0px 0px 0px; padding: 0px; border: 1px solid #7F9DB9; /* Remove border style to stick with sunken default */
	background-color: #FFFFFF !important;   /* Removes yellow background added by Google toolbar and other browser style sheets */
}

/* Buttons */
input.btn {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 16px; /* Required to vertically centre text in button in IE */
	color: #222222;
	width: 100px;
	margin: 0px; padding: 0px;
}

/* Menu */

/* Menu (navigation) panel in top header - within #wpr */
ain right-aligned menu panel */
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		margin: 0px; 	padding: 0px;
		left: 21px; 	top: 58px;
		width: 951px;
		height: 26px;
	color: #FFFFFF;
	display: normal;
	line-height: 16px;
	text-transform: none;
	font-size: medium;
	font-weight: 700;
	font-family: Arial, Helvetica, sans-serif;
	text-align: left;
}

#nav {/* Menu (navigation) panel */
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 0px;
	padding: 0px;
	float: right;
		height: 26px; /* IE will re-size this if more menu options are added */
		width: 568px; /* This will need to be increased if more menu options are added */
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/nav-bg.jpg');
		background-position: left top;
		background-repeat: no-repeat;
		background-color: #FFFFFF;
}
anel */
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 0px;
	padding: 0px;
	float: right;
		height: 26px; /* IE will re-size this if more menu options are added */
		width: 568px; /* This will need to be increased if more menu options are added */
	background-image: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/nav-bg.jpg');
		background-position: left top;
		background-repeat: no-repeat;
		background-color: #FFFFFF;
}
/* Standards compliant browsers recognise this height setting
This will allow new top-level menu options to be displayed if added without updating style sheet to increase width of #nav */
html>body div#nav {
  height: auto; 
  min-height: 26px;
}

#nav ul {margin: 0px; border: 0px; padding: 0px;}

#nav ul li {
	list-style: none;
	margin: 0px; border: 0px; padding: 0px;
	width: 180px;  /* Min top level menu width to allow space for 'DISTRIBUTORS' - in case new meu items added without updating style sheet */
	float: left; /* Lines up the top level menu options from left to right */
	text-transform: uppercase;
}

#nav ul li {
	list-style: none;
	margin: 0px; border: 0px; padding: 0px;
	width: 180px;  /* Min top level menu width to allow space for 'DISTRIBUTORS' - in case new meu items added without updating style sheet */
	float: left; /* Lines up the top level menu options from left to right */
	text-transform: uppercase;
}
#nav ul li li {width: 200px;} secondary menu levels in IE */

/* Width of top-level individual menu items reset here */
#nav ul li#map1 {width: 53px;} /* Home.  Note: the full '#nav ul li#map1' rather than just '#map1' is required by IE */
#nav ul li#map2 {width: 70px;} 
#nav ul li#map2 {width: 70px;} /* Products     */
#nav ul li#map3 {width: 90px;} /* Applications */
#nav ul li#map4 {width: 65px;} /* Support      */
#nav ul li#map5 {width: 90px;} li#map6 {width: 45px;} /* News         */
#nav ul li#map7 {width: 70px;} /* About us     */
#nav ul li#map7 {width: 70px;} /* About us     */
#nav ul li#map8 {width: 80px;} /* Contact us   */
#nav ul li#map9 {display: none} /* Hide 'Pages not visible from main menu' */

/* Background colour to drop-down options */
#nav ul ul li {
	background-color: #FFFFFF;
	/* filter: alpha(opacity=95);  - Cannot set opcacity in IE, the opacity works but is breaks the pop-out functionality! For IE, 0 to 100 */
	opacity: 0.95;              /* CSS3 standard (not yet supported), 0 to 1 */
	-moz-opacity: 0.95;         /* for Mozilla, 0 to 1 */
} 
/* Remove opacity on hover 
#nav ul ul li:hover {
	filter: alpha(opacity=100);
	opacity: 1;
	-moz-opacity: 1;
}
*/

#nav a {
	font-family: Gill Sans MT, Arial, Helvetica, sans-serif; /* Menu and headings used Gill Sans MT as first choice, everthing else uses Arial as first choice */
	font-size: 10px;
	line-height: 24px;
	font-weight: normal;
	text-align: center;
	display: block;
	border: 0px;
	border-right: 1px solid #EFF3F6;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 0px;
	color: #004C98;
	text-decoration: none;
}
/* Remove right border from 'Contact Us' - the right-most option in the list */
#map8 a {border: 0px;}


#nav a:hover {color: #29B8DF;}

/* Position pop-out menus */
#nav li {position: relative;}

#nav ul ul {
	position: absolute;
	z-index: 500;
}

#nav ul ul ul {
	position: absolute;
	top: 0;
	left: 100%;
}

/* Show/Hide on hover */
div#nav ul ul li:hover ul ul
{display: none;}


div#nav ul li:hover ul ul
{display: none;}


div#nav ul ul
{display: none;}


div#nav ul ul ul li:hover ul
{display: block;}


div#nav ul ul li:hover ul
{display: block;}


div#nav ul li:hover ul
{display: block;}

/* Suggestion box form */

form {margin: 0px; border: 0px; padding: 0px;}	/* Stops IE adding space around a form */

div#sb-input { /* Container for input fields on Suggestion Box form */
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	position: absolute;
		top: 200px;
		left: 0px;
		width: 215px;
		font-family: Arial, Helvetica, sans-serif;
		margin: 0px; 	padding: 0px;
	height: 101px;
}

div.row {
	clear: both;
	margin: 0px; border: 0px; padding: 0px;
}
/* Standards compliant browsers don't add their own spacing so need top padding */
html>body div.row {padding: 2px 0px 0px 0px;}

div#sb-input div.row label {
	float: left;
	width: 60px;
	text-align: right;
	font-size: 12px; 
	line-height: 12px;
	font-weight: bold;
	color: #77777F;
	margin: 10px 0px 0px 0px;
	padding: 0px;
}

/* data input fields */
div#sb-input textarea {
	float: right;
	width: 135px;
	height: 14px;
	text-align: left;
	font-size: 12px; 
	line-height: 12px;
	margin: 8px 12px 0px 0px;
	border: 1px solid #B7CCE1;
	padding: 0px;
	background-color: #FFFFFF !important; /* Override google toolbar */
}
div#sb-input input {
	float: right;
	width: 135px;
	height: 14px;
	text-align: left;
	font-size: 12px; 
	line-height: 12px;
	margin: 8px 12px 0px 0px;
	border: 1px solid #B7CCE1;
	padding: 0px;
	background-color: #FFFFFF !important; /* Override google toolbar */
}
div#sb-input textarea {height: 73px}

div.spacer {clear: both;}

div#sb-input p {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 10px 0px 0px 145px;
	padding: 0px 0px 0px 16px;
	text-align: left;
		font-size: 12px; 
		line-height: 12px;
		font-weight: bold;
		color: #004C98;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/more-blt.gif') no-repeat 0 center;
}
div#sb-input p:hover {
	color: #0073D6;
	cursor: pointer;
	background: url('more-blt-hvr.gif') no-repeat 3px center;
}

/* Site map */
#map9 {display: none;} /* Hide 'Pages not on main menu' */
#content ul ul ul ul {margin-top: 8px;} 
#content ul ul ul {margin-top: 8px;} 
#content ul ul {margin-top: 8px;} /* Add space before lists for each sub-menu level */

/* Product preview boxes */

div.prd-prv { /* Product preview wrapper */
	position: relative;
	margin: 12px 16px 14px 0px;
	border: 0px;
	padding: 0px;
	display: block;
	float: left;
	width: 320px;
	height: 420px;
	overflow: hidden;
}

div.prd-prv h1 a {
	margin: 0px;
	border: 0px;
	padding: 12px 0px 10px 6px;
	width: 320px;
	height: 12px;
	font-size: 14px;
	line-height: 14px;
	font-weight: normal;
	text-decoration: none;
	color: #FFFFFF;
	background-color: #004C98;
}

div.prd-prv h1 {
	margin: 0px;
	border: 0px;
	padding: 12px 0px 10px 6px;
	width: 320px;
	height: 12px;
	font-size: 14px;
	line-height: 14px;
	font-weight: normal;
	text-decoration: none;
	color: #FFFFFF;
	background-color: #004C98;
}
div.prd-prv h1 a {padding: 0px;} /* Stops padding extending over 'div.prd-img a img:hover' and cancelling opacity in Mozilla */
div.prd-prv h1 a:hover {color: #7FC6FF}

div.prd-img {
	position: relative;
	margin: 0px;
	border: 0px;
	padding: 0px;
	width: 320px;
	height: 48px;
	overflow: hidden;
}

div.prd-img a img {border: 0px;} /* Remove border from image link */

div.prd-img a img:hover {
	filter: alpha(opacity=75);  /* For IE, 0 to 100 */
	opacity: 0.75;              /* CSS3 standard (not yet supported), 0 to 1 */
	-moz-opacity: 0.75;         /* for Mozilla, 0 to 1 */
}

/* Rounded corners at bottom left and right of image use the .ql-box-bl, .ql-box-br divs */
div.prd-img div.ql-box-bl {top: 33px; left: 0px;}
div.prd-img div.ql-box-br {top: 33px; left: 302px}

div.prd-prv p.sum { /* Summary heading - not a real heading */
	margin: 0px;
	border: 0px;
	padding: 15px 0px 0px 0px;
	font-size: 18px;
	line-height: 18px;
	font-weight: bold;
	color: #004C98;
}

div.prd-prv p {
	text-align: left;
	font-size: 12px; 
	line-height: 14px;
	
	margin: 0px;
	border: 0px;
	padding: 10px 0px 0px 0px;
}

div.prd-prv p.ftr { /* Features heading - not a real heading */
	margin: 0px;
	border: 0px;
	border-bottom: 1px solid #ECE9D8;
	padding: 25px 0px 4px 0px;
	width: 223px;
	font-size: 14px;
	line-height: 14px;
	font-weight: bold;
	color: #6E6F71;
}

div.prd-prv-ln {
	border-style: none;
	border-color: inherit;
	border-width: 0px;
	margin: 0px;
	padding: 0px;
	width: 320px;
		height: 14px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/prd-prv-ln-bg.gif') no-repeat 0 10px;
}

div.prd-prv-ln a.more {
	display: block; /* Allow positioning */
	margin: 0px 0px 0px 143px;
}

span.reg-trade {/* Add a grey registered trademark */
	margin: 0px 0px 0px 0px;
	padding: 0px 9px 0px 0px;
	background: url('file:///C:/Web%20Sites/Cloud.co.uk/images/design/reg-trade.gif') no-repeat right top;
}