/* default formatting	*/
html,body,ul,ol,li,div,p,h1,h2,h3,hr,img,br,form { margin: 0; padding: 0; }
body { font: 0.625em Arial, Helvetica, Tahoma, Verdana, sans-serif; color: #666; text-align: center; background: #fff; padding: 10px 20px; }

h1 { font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; font-size: 200%; margin: 0 0 10px 0; line-height: 125%; }
h2 { font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; font-size: 180%; margin: 0 0 10px 0; }
h3 { font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; font-size: 160%; margin: 0 0 10px 0; }
h4 { font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; font-size: 130%; margin: 0 0 -5px 0; color: #3399FF; }

p { margin: 10px 0; }
pre { clear: both; font-size: 130%; text-align: left; }

ul { margin: 0 0 0 20px; }
ol { margin: 0 0 0 25px; }
li { margin: 5px 0; }

a { color: #3399FF; text-decoration: none; } 
a:hover { color: #CC0000; text-decoration: underline; }
a:active, a:focus { outline: 0; }

.hide { display: none; visibility: hidden; }

.clr { clear: both; height: 0; overflow: hidden; }
.goleft { float: left; }
.goright { float: right; }


/* Layout */
#shell { width: 100%; margin: 0 auto; text-align: left; font-size: 110%; line-height: 125%; }


/* header */
#header { position: relative; height: 100px; width: 100%; padding: 0; background: url(/images/header-contact-details.gif) no-repeat 99.5% 80%; }
#header h1 { float: left; margin: 10px 0; }
#header #options { display: none; visibility: hidden; }


/* login panel */
#loginform { display: none; visibility: hidden; }

/* navigation */
#navigation {  display: none; visibility: hidden; }

/* subnav */
#subnav { display: none; visibility: hidden; }


/* banner */
#banner { display: none; visibility: hidden; }
#banner #bannerimages { width: 600px; position: absolute; top: 0px; left: 0; }
#banner #bannerimages img { display: block; }
#banner #bannernav { position: absolute; top: 0; right: 0; list-style: none; margin: 0; width: 325px; }
#banner #bannernav li { display: block; float: left; margin: 0; }
#banner #bannernav li a { float: left; font-size: 150%; font-weight: bold; display: block; width: 251px; height: 19px; padding: 23px 23px 23px 50px; background: transparent url(/images/banner-item-bg.gif) no-repeat left top; color: #fff; }
#banner #bannernav li a:hover { background-position: left bottom; text-decoration: none; }
#banner #bannernav li.current a { background-position: left bottom; }


/* boxes & subitems */
#boxes-reflect { clear: left; float: left; width: 100%; list-style: none; margin: 0 0 10px 0; }
#boxes-reflect li { margin: 0 10px 0 0; float: left; width: 23%; background: #eee url(/images/box-reflect.png) repeat-x left top; border: 1px solid #ccc; border-bottom: 3px solid #ccc; padding: 10px 10px 0 10px; }
#boxes-reflect li .icon-reflect img { border: 0; float: left; }
#boxes-reflect li h2 { margin: 5px 0 3px 100px!important; margin: 15px 0 3px 100px; font-size: 170%; text-transform: uppercase; }
#boxes-reflect li p { margin: 0 0 0 100px; }
#boxes-reflect li .find-out-more { display: block; background: url(/images/find-out-more.png) no-repeat left top; text-indent: -999em; width: 93px; height: 22px; margin: 8px 0 8px 98px!important; margin: 8px 0 0px 98px }

.online a { color: #009900; }
.phone a { color: #003399; }
.mobile a { color: #CC0000; }
.plug-in a { color: #FF9900; }

.listitem { border-top: 1px solid #ddd; padding: 10px 0; }
.listitem h3 { margin: 0; }
.listitem p { margin: 3px 0 0 0; }

.glossaryindex { padding: 10px; }
.glossaryindex a { font-size: 200%; font-weight: bold; display: block; float: left; padding: 4px; }
.glossaryindex strong { font-size: 200%; display: block; float: left; padding: 4px; }
.glossaryindex span { color: #AAA; font-size: 200%; display: block; float: left; padding: 4px; }

.glossaryterm { border-top: 1px solid #ddd; padding: 10px 0; }
.glossaryterm h3 { margin: 0; color: #333; }
.glossaryterm p { margin: 3px 0 0 0; }

.itemimg, .itemimgr { background: url(/images/boxreflect.gif) repeat-x left bottom; border: 1px solid #ccc; border-bottom: 3px solid #ccc; float: left; width: 48%; padding: 0 10px; margin: 0 12px 12px 0; }
.itemimg img, .itemimgr img { float: left;border: 0; margin: 0 10px 0 0; }
.itemimg h3, .itemimgr h3 { display: block; margin: 20px 0 3px 0; padding: 0 0 0 10px; font-size: 150%; }
.itemimg p, .itemimgr p { margin: 0 0 0 0; padding: 0 0 0 10px; font-size: 95%; line-height: 125%; }
.itemimgr { margin: 0 0 12px 0; }

.item, .itemr { background: url(/images/boxreflect.gif) repeat-x left bottom; border: 1px solid #ccc; border-bottom: 3px solid #ccc; float: left; width: 288px; padding: 20px; margin: 0 12px 12px 0; }
.item h3, .itemr h3 { display: block; margin: 0 0 3px 0; padding: 0; font-size: 150%;  }
.item p, .itemr p { margin: 0; padding: 0; font-size: 95%; line-height: 125%;  }
.itemr { margin: 0 0 12px 0; }

.news { float: left; clear: left; width: 100%; border-top: 1px solid #ddd; padding: 10px 0 0 0; }
.news h3 { margin: 3px 0 0 55px; }
.news p { margin: 3px 0 10px 55px; }
.news .calendar { width: 40px; float: left; margin: 0 0 10px 5px; padding: 0; background: #F4F4F4 url(/images/calendar-bg.gif) no-repeat bottom left; }
.news .calendar .month { width: 40px; text-align: center; text-transform: uppercase; display: block; background: #3399FF url(/images/calendar-top.gif) no-repeat top left; color: #fff; border-bottom: 1px solid #555; padding: 2px 0 0px 0; font-size: 100%; }
.news .calendar .day { width: 40px; text-align: center; display: block; color: #000; padding: 5px 0 2px 0; font-size: 180%; font-weight: bold; }
.news .calendar .year { width: 40px; text-align: center; display: block; color: #666; padding: 0 0 2px 0; font-size: 100%; font-weight: bold; }


/* content area layout */
#contentrightcol { float: left; width: 100%; background: #fff; }
.maincol { float: left; width: 100%; font-size: 110%; line-height: 145%; }
.rightcol { display: none; visibility: hidden; }
.left600 { float: left; width: 600px; overflow: hidden; }
.right290 { float: right; width: 290px; overflow: hidden; }


/* content area items */
.title { color: #3399FF; font-size: 180%; }
.date { color: #999; }
.faq { padding: 0px 0 0 0; margin: 0; }
.faq div { margin: 0!important; }
.faq h3 { margin: 10px 0; }
.faq p { margin: 0; }
#breadcrumb { margin: 0 0 5px 0; }

/* tabs */
.tabs { float: left; width: 100%; margin: 0; padding: 0; list-style: none; background: #fff url(/images/tabs-content-home-top-fade.gif) no-repeat left bottom; }
.tabs li { float: left; background: url(/images/tab-bg-right.gif) no-repeat right top; margin: 0 5px 0 0; }
.tabs li strong { display: block; padding: 10px 15px 7px 15px; color: #333; font-size: 110%; background: url(/images/tab-bg-left.gif) no-repeat left top; cursor: pointer; }
.tabs li.active { background-position: 100% -200px; }
.tabs li.active strong { background-position: 0 -200px; padding: 10px 15px 9px 15px; }

.tabcontent { clear: left; padding: 0; margin: -1px 0 0 0; background: #fff url(/images/tabs-content-home-left-fade.gif) no-repeat left top; }
.tabcontent .tab { padding: 20px; font-size: 110%; }
.tabcontent h3 { font-size: 100%; margin: 0; }
.tabcontent .tab p { color: #888; margin: 3px 0 15px 0; }
/* hack to sort the tab display in ie6 and below because it is rubbish - a necessary evil I'm afraid */
* html .tabcontent { background: #fff url(/images/tabs-content-home-left-fade.gif) no-repeat fixed left top; width: 100%; }

.youtube { text-align: center; padding: 20px; background: #fff url(/images/dot-x.gif) repeat-x left top; } 
.clrdot { clear: both; height: 3px; overflow: hidden; background: #fff url(/images/dot-x.gif) repeat-x left top; }


/* sidecol */
#book-demo-promo {  display: none; visibility: hidden; }
.rss { clear: both; padding: 15px; }
.rss h3 { padding: 0; margin: 0; line-height: 110%; font-size: 150%; }
.rss p { margin: 3px 0 10px 0; padding:0;  }
.rss a img { float: left; padding: 0; margin: 0 5px 0 0; }


/* footer */
#footer { clear: both; float: left; width: 100%; border-top: 3px solid #999; padding: 5px 0; margin: 10px 0 0 0; }
#footer img { vertical-align: middle; margin: 0 0 0 5px; }


/* forms etc */
fieldset { border: 1px solid #ddd; padding: 15px; margin: 15px 0; }
legend { padding: 0 5px; color: #777;  }
textarea { font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; color: #000; }
input { font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; font-size: 100%; color: #000; }
select { font-family: Arial, Helvetica, Tahoma, Verdana, sans-serif; font-size: 100%; color: #000; margin: 3px; vertical-align: middle; background: #FFFFEC; border: 1px solid #6E6E6E; }
.form { font-size: 120%; }
.txt { background: #FFFFEC url(/images/input-bg.gif) no-repeat left top; border: 1px solid #6E6E6E; font-size: 100%; color: #000; padding: 4px 5px; }
.radio { margin: 5px 30px 5px 0; padding: 0; line-height: 250%;}
.button { vertical-align: middle; margin: 0 10px 0 0; }
.forminfo { clear: both; margin-left: 180px; }
.formerror { color: #CC0000; }
.formsummary { color: #888; }
.formseparation { clear: both; width: 98%; position: relative; border-top: 1px solid #E5E5E5; height: 0; overflow: hidden; margin: 10px; }
.formheading { clear: both; margin: 10px; padding: 0 0 8px 0; border-bottom: 1px solid #ccc; }

.field { float: left; margin: 0 0 10px 0; padding: 5px 0 0 0; } 
.field .lbl { float: left; text-align: right; width: 172px; padding: 6px 8px 0 0; }
.field .data { float: left; width: 460px; }
.field .data .txt { margin: 0 0 6px 0; }
.field .data .alternate { vertical-align: middle; }

#demoform { clear: both; margin: 0; padding: 0; }
#demoform fieldset { border: 0; margin: 0; padding: 0; }
#demoform legend { display: none; visibility: hidden; margin: 0; padding: 0; }
#demoform .field { margin: 0; padding: 0 0 5px 0;}
#demoform .field .lbl { width: 150px; }
#demoform .field .data { width: 350px; }
#demoform .forminfo { clear: both; margin-left: 155px; }


/* send to friend */
#sendtofriend #header { width: 500px; margin: 0 auto; text-align: left; }
#sendtofriend #container { width: 500px; margin: 0 auto; text-align: left; font-size: 120%; }
#sendtofriend .lbl { width: 130px; }
#sendtofriend .data { width: 320px; }
#sendtofriend .forminfo {margin-left: 135px; }
#sendtofriend .options { position: absolute; top: 0; right: 0; margin: 0; padding: 0!important; background: #EFEFEF url(/images/header-options-bg-right.gif) no-repeat right bottom; }
#sendtofriend .options strong { display: block; background: transparent url(/images/header-options-bg-left.gif) no-repeat left bottom; padding: 10px 5px; }
#sendtofriend .options a { font-weight: bold; font-size: 120%; margin: 0 5px; padding: 2px 0px 0px 20px; }
.close { background: url(/images/cross.png) no-repeat left center; }


/* system messages */
.message { clear: both; font-size: 110%; color: #333; font-weight: bold; }
.info { background: #E8F3FD url(/images/information.png) no-repeat 5px 50%; margin: 0 0 10px 0; padding: 6px 6px 6px 26px; border: 1px solid #9AC3EB; }
.error { background: #FEF2F2 url(/images/cross.png) no-repeat 5px 50%; margin: 0 0 10px 0; padding: 6px 6px 6px 26px; border: 1px solid #EB9A9A; }
.ok { background: #EAF5E9 url(/images/tick.png) no-repeat 5px 50%; margin: 0 0 10px 0; padding: 6px 6px 6px 26px; border: 1px solid #AADBA3; }
.loggedin { clear: both; background: #E8F3FD url(/images/information.png) no-repeat 5px 50%; margin: 0 0 10px 0; padding: 6px 6px 6px 26px; border: 1px solid #9AC3EB; }

.terms { list-style: none; margin: 10px 0 10px 0px; padding: 0; }
.terms ul { margin: 10px 0 10px 10px; padding: 0; list-style: none; }
.terms li { padding: 3px; }