/******************************************************************************* 
* Base Formatting                                                              *
*******************************************************************************/

*{margin:0; padding:0;}
html, body{height: 100%;}
body{background-color: #09203f;	font-size:100%;	font-family: Arial, Tahoma, sans-serif;	/*text-align: center;*/	/*background-image: url(images/gradient.png);	background-repeat: repeat-x;*/}
p{ margin: 0 0 1.22em 0; padding: 0; }

body{margin: 0 auto; /*border: 1px dashed #ffdead;*/ width:100%; text-align:left; font-size:1em;}

.center{text-align:center;}
.left{text-align:left;}
.right{text-align:right;}

.floatleft{float:left;}
.floatright{float:right;}

.clearboth{clear:both;}
.clearright{clear:right;}
.clearleft{clear:left;}

h1{font-size:150%; font-family:Myriad Pro Cond; color:#3A54BB;}
h2{margin:25px 0 0 4px; font-size:130%; text-transform:none;}

a:link{color:#4280FF; text-decoration:none;}
a:hover{color:#056983; text-decoration:underline;}
a:visited{color:#93109F; text-decoration:none;}

img{border:none;}

abbr{border-bottom:1px dashed white; text-decoration:none;}

blockquote{background:url(../../_images/base/blockquote_open.png) 0 0 no-repeat; margin:1.6em 2em;}
blockquote p{color:#555555; font-size:1.1em; font-weight:bold; text-align:justify; background:url(../../_images/base/blockquote_close.png) 100% 90% no-repeat; padding:0 40px; margin-bottom:0;}
cite{background:none; display:block; text-align:right; font-size:0.95em; font-weight:normal; font-style:italic;}
blockquote>p+p{background:none;} /* This fairly complex rule uses both a child selector (>) and an adjacent selector (+), and styles the paragraph that comes immediately after the paragraph that’s a child element of the blockquote (which is the paragraph with the cite element). The rule overrides the background value defined in step 5 for paragraphs within the block quote). Note that this assumes the quote itself will only be a single paragraph. If you have multi-paragraph quotes, you’ll need to apply a class to the final paragraph and set the quote-close.gif image as a background on that, rather than on blockquote p. Source: The Essential Guide to CSS and HTML web design */

/******************************************************************************* 
* Text Formatting                                                              *
*******************************************************************************/

.warning{margin:10px; padding:0px; background:#FFFFC6; border:2px solid #900;}
.warning p{font-size:1.1em;}
.warning p span{color:#900; font-size:1.8em; font-weight:bold;}

/******************************************************************************* 
* Products Lists                                     				         *
*******************************************************************************/

/* ****** Main Layout ****** */
#product_table{width:900px; height:auto; margin:0; padding:0; border:0;}
#product_nav{width:900px; height:0px; /*This height needs to be adjusted once a NAV Panel has been designed*/ margin:0; padding:0;}
#product_topborder{width:900px; height:8px; margin:0; padding:0; background:transparent url(../../Common/images/base/products/Producttable_r2_c1.png) no-repeat 0 0;}
#product_window{width:898px; height:auto; text-align:center; color:#666; background-color:#FFF; border-left:1px solid #666666; border-right:1px solid #666666;}
#product_bottomborder{width:900px; height:8px; margin:0; padding:0; clear:left; background:transparent url(../../Common/images/base/products/Producttable_r4_c1.png) no-repeat 0 0;}

#product_thumb{width:898px; height:auto; padding:0; margin-left:9px;}
#product_thumb div{width:200px; height:175px; margin:10px; display:block; float:left; text-align:center; background:#ccc url(../../Common/images/base/products/product_bg_thumbnail_grey.jpg) no-repeat 0 0;}

#product_thumb a{display:block; text-decoration:none; font-size:1.1em; color:#666;}
#product_thumb a:hover{background:url(../../Common/images/base/products/product_bg_thumbnail_yellow.jpg) no-repeat 0 0; color:#CCC;}

#product_thumb h2{width:200px; margin:0; padding:2px; height:30px; font-size:1.1em; color:#666;}
#product_thumb span{width:200px; height:45px; padding:2px; display:block; font-size:0.68em; color:#666;}

.product_range_header{color:#333; font-size:1.4em;}

#productheading{width:880px; height:40px; margin:0; padding-left:10px;}

/* ****** Products ****** */
#bti_introduction{width:880px; margin:0; padding-left:10px; float:left; text-align:left;}
#bti_configurator{width:100%; height:650px;}


/******************************************************************************* 
* Data Locker Mini Site                                                        *
*******************************************************************************/

#dlcontainer{width:920px; height:auto; overflow:hidden;}
#dlheader{width:710px; height:auto;}
#dlcontent{width:720px; height:auto; margin-left:180px; text-align:left; poistion:relative; padding:0 0 0 10px;}
#dlcontent h1{font-family:Myriad Pro Cond;	font-size:22pt; text-transform:uppercase; margin: 0 0 0 10px; clear:both;}
#dlcontent .capacity{font-size:1.3em; text-align:center; padding: 30px 0 0 0; margin:10px 0 0 0;}
#dlcontent .certificates{background:url("../../images/Site/background_hatching.jpg"); color:#333; cellpadding:5px;}

#dltower{width:180px; height:auto; float:left; position:relative; padding:0px; text-align:center;}
#dltower ul{ padding:0px; width:100%; margin:0px; }
#dltower ul li{ list-style:none; padding:0px; font-size:22px; }

.dlwheretobuy a{display:block; width:177px; height:38px; background: url("../../datalocker/images/wheretobuybasket.png") 0 0 no-repeat; text-decoration:none;}
.dlwheretobuy a:hover{background-position: 0 -38px; color:#049;}

.cssnav	{position:relative;	font-family:arial, helvetica, sans-serif; background-image:url(../../datalocker/Images/tower_btn_on.jpg); background-repeat:no-repeat; white-space:nowrap; display:block; width:180px; height:40px; margin:0; padding:0; }
.cssnav a {display:block; color:#000000; font-size:12px; width:180px; height:40px; display:block; float:left; color:white; text-decoration:none;}
.cssnav img {width:180px; height:40px; border:0;}
.cssnav span {position:absolute; left:27px; top:13px; margin:0px; padding:0px; cursor:pointer; width:149px; height:14px; text-align:left;}
* html a:hover {visibility:visible}
.cssnav a:hover img{visibility:hidden}
a.datalockernews{color:white;}

#dlproduct_range{width:710px; height:auto; position:relative; padding:0; margin:0 auto;}
#dlproduct_range h2{text-align:center; font-family:arial; font-size:1.4em; font-weight:bold;}
#dlproduct_range img{padding:20px;}
#dlproduct_range img:hover{opacity:0.6; filter:alpha(opacity=60);}

#dlproduct_rangesplit1, #dlproduct_rangesplit2{width:350px; text-align:center; height:auto; position:relative; margin: 0 0 0 0; float:left;}
#dlproduct_rangesplit1 ul li, #dlproduct_rangesplit2 ul li{ margin-left:50px; text-decoration:none; text-align:left; font-size:1.1em; list-style:square;}
#dlproduct_rangesplit1 a, #dlproduct_rangesplit2 a{text-decoration:none; color:white;}
#dlproduct_rangesplit1 a:hover, #dlproduct_rangesplit2 a:hover{text-decoration:underline; color:white;}

#dlproduct{width:720px; height:auto; text-align:left; poistion:relative; padding:0 0 0 10px;}
#dlproduct img{float:right;}
#dlproduct ul li{list-style:square;}

#dlsupportdiv{width:720px; height:auto; margin:10px 0 0 0; background-color:white; color:black; background: url("../../images/Site/background_hatching.jpg") 0 0 repeat;}
#dlsupporttab{height:50px; border-bottom: 2px solid #666;}
#dlsupportdiv .spacer20 div{width:auto; height:10px;}

.title h2{width:300px; margin: 15px 0 0 10px; float:left;}
.toggle a{margin-left:200px; text-align:right; float:right; font-weight:bold; margin: 15px 10px 0 0 ;}

#dlsup_security div{width:670px; height:auto; margin:15px 0 0 15px; border-bottom:1px dashed #666;}
#dlsup_security div h3{margin:0 0 10px 0;}

#dlsup_technical div{width:670px; height:auto; margin:15px 0 0 15px; border-bottom:1px dashed #666;}
#dlsup_technical div h3{margin:0 0 10px 0;}
#dlsup_technical ol li{margin:0 0 0 25px;}

#dlsup_downloads{width:720px; padding-bottom:30px;}
#dlsup_downloads p{padding:12px;}
.dlsup_instructions div{width:600px; height:auto;}
.dlsup_instructions h3{margin:0 0 0 20px;}
.dlsup_instructions ol{width:650px; padding-left:10px; padding-bottom:10px;}
.dlsup_instructions ol li{width:670px; margin:0 0 0 20px; font-size:80%;}
#dlsup_table{width:600px; margin: 20px 0 0 30px;}
.dlsup_tableheader{font-size:130%; font-weight:bold;}
.dlsup_tablebody{}

#dlsup_manuals div{width:205px; height:auto; float:left; margin: 20px 0 0 20px;}
#dlsup_manuals a{text-decoration:none; color:black;}
#dlsup_manuals img{margin-left:50px; border:6px solid green;}
#dlsup_manuals span strong{display:block; font-size:120%; margin-bottom:0.2em; color:#000;}
#dlsup_manuals span{line-height:1.3; display:block; font-size:100%; padding:3px 5px; margin-top:10px;}

.dlreviewbox{width:720; height:auto; padding:10px; border-bottom:1px dashed #666;}
.dlreviewbox h2{margin:0 0 5px 0;}
.dlreviewbox p{margin:0 0 8px 0; padding:5px;}
.dlreviewbox img{float:right; padding:10px 0 10px 10px;}

div.featurebox h3{background:transparent url(../../common/images/base/featurebox_l.png) no-repeat scroll right center; clear:right; color:#99ACCA; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:0.9em; margin:0; padding:3px 1.5em 4px 0.5em; position:absolute; top:-11px; left:20px;}
div.featurebox h6{background:transparent url(../../common/images/base/featurebox_r.png) no-repeat scroll left center; clear:left; color:#99ACCA; font-family:Verdana,Arial,Helvetica,sans-serif; font-size:0.9em; margin:0; padding:3px 1.5em 4px 1.5em; position:absolute; bottom:-11px; right:20px;}
div.featurebox{background:none repeat scroll 0 0; border:1px solid #999; margin-bottom:1em; padding:5px 0 5px 0; position:relative; width:auto !important;}
.featurebox p{margin:0; padding: 0 0 10px 20px; color:#fff;}

.dlnews{width:225px; margin: 12px 0 0 12px; text-align:center; float:left; position:relative;}
.dlnews a{text-decoration:none; color:white;}
.dlnews img{ border:5px solid green;}
.dlnews span{line-height:1.3; display:block; font-size:0.9em; padding:3px 5px; margin-top:10px;}
.dlnews span strong{display:block; font-size:120%; margin-bottom:0.2em; color:white;}

#dltop10 div{witdth:720; height:auto; margin-left:40px;}
#dltop10 ol li{margin-left:40px; margin-top:20px;}

#dlvideo{width:720px; height:auto; border-bottom:1px dashed #666;}
#dlvideo object{padding:25px;}
.activex{padding:15px 0 0 10px; font-size:0.8em; }

#dlshow{width:720px; height:auto;}
#dlshowimages img{margin:8px; float:left; border:6px solid green;}
#dlshow .floatright{float:right; clear:right;}

#dlscrapbook{width:720px; height:auto;}
#dlscrapbook div{width:205px; height:auto; float:left; margin: 20px 0 0 15px; text-align:center;}
#dlscrapbook a{text-decoration:none; color:white;}
#dlscrapbook img{ border:6px solid green;}
#dlscrapbook span{line-height:1.3; display:block; font-size:100%; padding:3px 5px; margin-top:10px;}
#dlscrapbook span strong{display:block; font-size:120%; margin-bottom:0.2em; color:white;}

#dlextras{width:720px; height:auto;}
#dlextras div{width:315px; height:auto; float:left; margin: 15px 0 0px 35px; text-align:center;}
#dlextras a{text-decoration:none; color:white;}
#dlextras span{line-height:1.3; display:block; font-size:100%; padding:3px 5px; margin-top:10px;}
#dlextras span strong{display:block; font-size:120%; margin-bottom:0.2em; color:white;}

/******************************************************************************* 
* Customer Enquiry Form                                                        *
*******************************************************************************/

#contact{width:400px; height:auto; margin-left:50px; padding:5px 15px 15px 15px; background:white url(../../images/Site/background_hatching.jpg) no-repeat 0 0;}
#contact dt{margin:10px 0 0 0; color:black;}
#contact dd{display:block;}
#contact fieldset{border:none; margin: 0 0 0 25px;}
#contact p{padding-top:15px; color:#333; font-style:italic;}
#contact h2{font-size:1.6em; color:#333; font-style:bold;}
#contact div{padding-top:10px;}

#contact_suc p{padding-top:15px; color:#333;}

.btn_contactus a{display:block; width:100px; height:37px; background: url("../../datalocker/images/btn_contactus.png") 0 0 no-repeat; text-decoration:none;}
.btn_contactus a:hover{background-position: 0 -37px; color:#049;}

/******************************************************************************* 
* Buttons - not currently used                                                 *
*******************************************************************************/

a.button{height:22px; color:#09203f; font-weight:bold; text-align:center; background: url(../images/base/button.gif) repeat-x center; border: 1px solid #959595; text-decoration: none; padding: 2px 4px 2px 4px; line-height: 22px;}
a.button:hover{color: #056983;}

/******************************************************************************* 
* Main Structure                                                               *
*******************************************************************************/

#background_gradient{position:absolute; top:0px; z-index:-111; width:100%; left:0px;}
#content_area{text-align:left; width:960px; margin:0 auto;} 
#content_area{color:#dfedf6; margin: 0 auto; /*border: 1px dashed #ffdead;*/ width:920px; text-align:left; font-size:.8em; margin-top:15px;}

#sticky_wrapper, #sticky_footer{text-align:left; width:100%; margin:0 auto;}
#sticky_wrapper {min-height:100%; height:auto !important; height:100%; margin:0 auto -71px;}
#sticky_footer, #sticky_push {height:71px; position:relative;}

#header_top_bar, #footer_bar{width:100%; height:29px; color:#0f1324; font-size:0.687em; font-family:Tahoma, Arial, sans-serif; word-spacing:5px; 	background-image:url(../images/base/top_bar.gif); background-repeat:repeat-x; background-color:#E5EAED;}
#header_top_bar span, #footer_bar span{padding:10px 0 0 44px; display:block;}
#header_top_bar span a,#footer_bar div a,#footer_bar div b{color:#FFFFFF; word-spacing:normal; font-weight:normal; font-family:raavi;}

#footer_bar {height:51px; background-image:url(../images/base/footer_bar.gif); position:relative;}
#footer_bar div{position:relative; top:-8px;}
#footer_bar div.alignLeft{padding-left:44px; position:relative; top:18px;}
#footer_bar div.alignRight{padding-right:44px; text-align:right; top:15px; width:500px;	position:absolute; right:0;}

#header_menu_content{position:relative;	margin-left:auto; margin-right:auto; text-align:center; width:100%;	height:56px; padding-top:5px;}

/******************************************************************************* 
* Seperators fade                                                              *
*******************************************************************************/

#vert_separator{
	width:20px;
	height: 100%;
	background-image: url(../images/base/vert_separator.gif);
	background-repeat: repeat-y;
	position: relative;
	background-position: center;
	margin: 0 auto;
}

#vert_separator #bleed_top{
	position: absolute;
	top: 0;
	left: 0;
	background-position: center;
	background-image: url(../images/base/vert_separator_top.gif);
	background-repeat: no-repeat;
	height:34px;
	width:100%;
}

#vert_separator #bleed_bottom{
	position: absolute;
	bottom: 0;
	left: 0;
	background-image: url(../images/base/vert_separator_bottom.gif);
	background-repeat: no-repeat;
	background-position: center;
	height:34px;
	width:100%;
}

#horz_separator{
	width:100%;
	height: 2px;
	background-image: url(../images/base/horz_separator.gif);
	background-repeat: repeat-x;
	background-position: center;
	font-size: 1px;
	position: relative;
	margin-top: 10px;
	margin-bottom: 10px;
}

#horz_separator #bleed_left{
	background-image: url(../images/base/horz_separator_left.gif);
	width:34px;
	position: absolute;
	left: 0;
}

#horz_separator #bleed_right{
	background-image: url(../images/base/horz_separator_right.gif);
	width:34px;
	position: absolute;
	right: 0;
}
#Producttableleft_separator{
	width:4px;
	height: 100%;
	background-image: url(../images/base/producttable_bar_left.png);
	background-repeat: repeat-y;
	position: relative;
	background-position: center;
	margin: 0 auto;
}
#Producttableright_separator{
	width:5px;
	height: 100%;
	background-image: url(../images/base/producttable_bar_right.png);
	background-repeat: repeat-y;
	position: relative;
	background-position: center;
	margin: 0 auto;
}
#Producttable_separator{
	width:100%;
	height: 15px;
	background-image: url(../images/base/productseperator.png);
	background-repeat: repeat-x;
	background-position: center;
	font-size: 1px;
	position: relative;
	margin-top: 8px;
	margin-bottom: 15px;
	margin-left: 0px;
}

/******************************************************************************* 
* Collapsable Content                                                          *
*******************************************************************************/

span.readMore{display:none;}
span.readMore_show a, div.readMore_hide a{color:#4280FF; text-decoration:none; font-weight:bold;}
span.readMore_show a:hover, div.readMore_hide a:hover{text-decoration:underline;}