/*
	Style sheet for Business Furniture Online Ltd
	Last updated: 09/01/07
*/


/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Layout  */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { display: inline; float: left; position: relative; margin-left: 10px; margin-right: 10px; }
.grid_1 { width: 60px; }
.grid_2 { width: 140px; }
.grid_3 { width: 220px; }
.grid_4 { width: 300px; }
.grid_5 { width: 380px; }
.grid_6 { width: 460px; }
.grid_7 { width: 540px; }
.grid_8 { width: 620px; }
.grid_9 { width: 700px; }
.grid_10 { width: 780px; }
.grid_11 { width: 860px; }
.grid_12 { width: 940px; }

.alpha { margin-left: 0 !important; }
.omega { margin-right: 0 !important; }

.left {float:left;margin-right:10px;}
.right {float:right;margin-left:10px;}

.aligncenter {text-align:center;}

.borderless {margin:-10px;}

.clear { height: 20px; clear: both; }

* { margin: 0; padding: 0; }

html { background: url(/media/bg.jpg) no-repeat #fff center 25px;padding:0 0 20px 0; }

body { font-family: Arial, Helvetica, sans-serif; background: url(/media/bg.png) no-repeat scroll center bottom transparent; width: 100%; text-align: center; color: #444; font-size: 80%; /*background-image: url('/media/wrapperbg.gif'); */ /*background-repeat: repeat-y;*/ }

#wrapper { margin: 0 auto; padding: 0; width: 960px; background: #fff url(/media/maincontent_bg.gif) 0 110% repeat-x; text-align: left; }

.topaddress { padding: 0 10px; font-size: 85%; text-align: center; background: #fff; color: #666; display: none; }

#header { margin: 0; height: 75px; padding-top: 35px; }

#header .header-functions { text-align: right; background: url(/media/bg_header.gif) repeat-x; position: absolute; top: 0; left: 0; width: 100%; color: #fff; font-size: 90%; }
#header .header-functions .toolbar { width: 940px; margin: 0 auto; text-align: right; line-height: 25px; }
#header .header-functions .toolbar a { color: #fff; }

#header p { padding: 0; }

#header .tel { font-size: 200%; font-weight: 700; float: right; margin: 10px 0; color: #0055A5; }
#header .tel img { vertical-align: -2px; }



#header .basket { color: #0055a5; border-left: 2px solid #eee; width: 138px; padding-top: 10px; }
#header .basket .title { font-weight: 700; }

#header .basket p { margin: 0 10px 0; float: right; width: 82px; }

#header .basket a { color: #0055a5; }

#header .basket a:hover { color: #0055a5; text-decoration: underline; }

#header .basket img { float: left; margin: 0 0 10px 10px; }

#header .account { border-left: 2px solid #eee; width: 138px; padding-top: 10px; }
#header .account p { margin: 0 10px 0; float: right; width: 82px; }
#header .account img { float: left; margin: 0 0 10px 10px; }

#navigation {width:960px;}

.navigation { float: left; display: inline; clear: both; margin: 0 9px 0; width: 939px; border: 1px solid #c4c0bf; background:#eae8e4 url(/media/nav-li-bg.gif) repeat-x; position: relative; z-index: 2;height:30px;
border-radius:6px 6px 0 0;z-index:999;border-bottom:2px solid #2051A2}

#topnav li { float: left; display: inline; list-style-type: none; }

#topnav a { color: #004863; float: left; display: inline; padding: 0 8px;line-height:30px; border-right: 1px solid #c4c0bf; text-decoration: none; }

#topnav ul { background-color: #0055a5;opacity:0.9;filter:alpha(opacity=90); font-size: 85%; }
#topnav ul li a { color: #fff; border-right: 0; margin: 0 10px; border-bottom: 1px dotted #fff;width:16.7em; }

#topnav li:hover a { background-color: #0055a5;border-color:#0055a5; color: #fff; opacity:0.9;filter:alpha(opacity=90); }

#topnav li:first-child a {border-radius:6px 0 0 0}

#navigation #catnav { z-index: 1; position: relative; top: -10px; float: left; display: inline; width: 940px; margin: 0 9px; background-color: #0055a5; padding: 11px 0 0; border-top: none; }

#navigation #catnav li { display: inline; }

#navigation #catnav li a { padding: 5px; color: #fff; float: left; display: inline; text-decoration: none; }

#navigation #catnav li a:hover { color: #ccc; }

#navigation { background: none; height: 25px; vertical-align: middle; }

#navigation .benefits-ticker{clear:both;float:left;width:920px;background: url(/media/headline-bg.gif) repeat-x;padding:0 10px;margin:0 10px;text-align:center;}

#navigation .benefits-ticker img {vertical-align:middle;}

/* SUPERFISH NAVIGATION  - DO NOT DELETE */
#navigation ul { line-height: 1.2; }
#navigation ul ul { position: absolute; top: -999em; width: 20em; /* left offset of submenus need to match (see below) */ }
#navigation ul ul li { width: 100%; }
#navigation ul li:hover { visibility: inherit; /* fixes IE7 'sticky bug' */ }
#navigation ul li { float: left; position: relative; }
#navigation ul a { display: block; position: relative; }
#navigation ul li:hover ul, #navigation ul li.sfHover ul { left: 0; top: 2.8em; /* match top ul list item height */ z-index: 99; }

#navigation.home {}

#navigation form {float:right;margin-right:5px;margin-top:4px;}
#navigation form p {margin:0;padding:0;color:#004863;}
#navigation form .go {background-color:#F26522;border-color:#f0ab2d;border-width:1px;border-radius:5px;color:#fff;padding:2px;}
ul.sf-menu li:hover li ul, ul.sf-menu li.sfHover li ul { top: -999em; }
ul.sf-menu li li:hover ul, ul.sf-menu li li.sfHover ul { left: 18em; /* match ul width */ top: 0; }
ul.sf-menu li li:hover li ul, ul.sf-menu li li.sfHover li ul { top: -999em; }
ul.sf-menu li li li:hover ul, ul.sf-menu li li li.sfHover ul { left: 20em; /* match ul width */ top: 0; }

#sidenavigation { 
padding:10px;
vertical-align: top; width: 200px; }

#maincontent {width:760px;padding:0 10px 20px;}
#maincontent li { padding-left: 20px; list-style-position: inside; }

.breadcrumbnav {margin:10px 0;}

#rightnavigation { float: right; margin: 0; padding: 10px; }

#footer { margin: 0; padding: 0; background: url(/media/bg_footer.gif) repeat-x top #0a0036; height: 230px; }

#footer .highlight { background-color: #f26522; padding: 10px; margin-bottom: 10px; }
#footer .highlight img { vertical-align: -12px; }
#footer .highlight a { font-size: 150%; color: #fff; }
#footer .highlight a:hover { color: #fff; }

#footer li {padding-left:20px;border-bottom:1px dashed #80654e;padding-bottom:5px;margin-top:5px;list-style-type:none;background:url(/media/footer-arrow.png) no-repeat 3% center;}
#footer li a {display:block;}

#footer .credits {font-size:90%;color:#fff;margin:0 10px;}
#footer .credits a {color:#fff;}

.repeat { width: 520px; background: #0055a5; }
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Typography */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
h1, h2, h3, h4, h5, h6 { color: #e4701e; font-size: 140%; font-weight: 100; margin: 10px 0; padding: 0; line-height:1;}
h1 {font-size:180%;}

#maincontent .title {color:#0055a5;font-size:180%;}


#maincontent ul li { padding-bottom: 5px; list-style-type: square; margin-left: 30px; }

ol li { padding-bottom: 3px; list-style-type: decimal; }
#footer p {color:#fff;}
.small { font-size: 85%; }

p { padding:5px 0;}


/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Link Styles */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

a { text-decoration: underline; color: #f26522; background: transparent; }

a:hover { text-decoration: none; color: #e4701e; background: transparent; }


#header a { text-decoration: none; color: #0055a5; background: transparent; }

#header a:hover { text-decoration: none; color: #e4701e; background: transparent; }



.repeat a { text-decoration: none; padding: 1px; color: #fff; }

.repeat a:hover { padding: 1px; text-decoration: underline; color: #fff; }

#footer a { text-decoration: none;color: #fff; }

#footer a:hover { text-decoration: none; color: #e4701e; }

a.sitecredit { font-size: 80%; text-decoration: none; color: #666666; background-color: transparent; text-align: center; }

.sitecredit:hover { background-color: #b36f7d; color: white; text-align: center; }

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Extra Bits */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

table { border-spacing:0;border-collapse:collapse;border:none;}

.bluebg { background: #0055a5 url('/media/bluebg.gif') bottom left no-repeat; color: #fff; padding: 5px 10px 5px 20px;width:735px; }

p.bluebg { padding-left: 40px; margin: 10px 0; }

.categorycell { padding: 10px; text-align: center; }

td { vertical-align: top; text-align:left; }



.hide { height: 0; width: 0; overflow: hidden; position: absolute; /* for the benefit of IE5 Mac */ }

.hidden { display: none; }

img { border: 0; }

hr { border: 0; border-bottom: 1px solid #ccc; height: 1px; margin-top: 1ex; }

.hiddenclear { clear: both; color: #fff; font-size: 0; margin: 0; visibility: hidden; }

.floatleft { float: left; margin-right: 5px; }

.floatleftb { float: left; margin-right: 5px; border: solid 1px #0055a5; }

.floatright { float: right; margin-left: 5px; }

.floatrightb { float: right; margin-left: 5px; border: solid 1px #0055a5; }

.clearleft { clear: left; }
.clearright { clear: right; }
.clearboth { clear: both; }

.center { text-align: center; }

.VABR { line-height: 70%; vertical-align: bottom; text-align: right; }

.VABL { line-height: 70%; vertical-align: bottom; text-align: left; }

.VATR { line-height: 70%; vertical-align: top; text-align: right; }

.VATL { line-height: 70%; vertical-align: top; text-align: left; }
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Tables */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

.tableborder { border-top: solid 2px #bb9cc6; border-right: solid 2px #bb9cc6; text-align: center; }

.tableborderlight { border-top: solid 2px #bb9cc6; border-right: solid 2px #bb9cc6; text-align: center; background-color: #faecfe; }

.tableborder2 { border-top: solid 2px #bb9cc6; font-weight: bold; background-color: #faecfe; }

.tableborder3 { border-right: solid 2px #bb9cc6; background-color: white; }

.tableborder4 { border-top: solid 2px #bb9cc6; text-align: center; }

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Forms and fields */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

form { padding: 0; margin: 0; }

form td {padding:5px;}

fieldset { border: none; }

legend { color: #0055A5; font-size: 145%; font-weight: bold; padding: 10px 0 10px; border-bottom: 2px solid #eee; display: block; width: 100%; }

.blurred { border: #0055a5 1px solid; padding: 2px; background-color: #fff; }

.focused { border: #ff0000 1px solid; padding: 2px; background-color: #fff; }


#sidenavigation form { font-size: 85%; }


/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Customer Top Nav */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

#Ctopnav { margin: 0; padding: 0 0 5px 5px; text-align: center; background: #998a9f; border-top: solid 1px #fff; }

#Ctopnav ul, #Ctopnav li { margin: 0; padding: 0; display: inline; list-style-type: none; }

#Ctopnav a:link, #Ctopnav a:visited { line-height: 14px; font-weight: bold; margin: 0 7px 2px 7px; text-decoration: none; color: #fff; font-size: 11px; }

#Ctopnav a:link#current, #Ctopnav a:visited#current, #Ctopnav a:hover { padding-bottom: 0px; background: transparent; color: #0055a5; }

#Ctopnav a:hover { color: #ccc; }

#customernavigation { font-size: 85%; text-align: center; padding: 0; margin: 2px 0 0 0; width: 580px; }

#customernavigation a { margin: 0 4px 0 4px; padding: 0; }

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */
/*  Side Nav */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */


#sidenav { }

#sidenav li { list-style: none; color: #005bac; float: left; clear: left; width: 145px; margin-left: 0;margin-bottom:10px; }

#sidenav li a img {margin:0 0 10px;}

#sidenav li a { display: block; background: #fff; text-decoration: none; font-size: 85%; }

#sidenav li.sub { font-size: 91%; list-style: circle; list-style-position: outside; margin: 0 2px 2px 6px; border: none; text-align: left; }

#sidenav ul.sub { margin: 0px 0 2px 14px; }

#sidenav li.subsub { font-size: 91%; list-style: disc; list-style-position: outside; margin: 0 0 2px -3px; border: none; text-align: left; color: #0055a5; }

#sidenav ul.subsub { margin: 0px 2px 2px -13px; }

#sidenav li a:link { color: #0055a5; }

#sidenav li a:visited { color: #0055a5; }

#sidenav li a:hover { border-color: #0055a5; color: #f4934d; }

/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------  */

body.heavy_duty .grid_3 a h2 { text-align: center; margin-right: 35px; }

body.heavy_duty .grid_3 a .price { color: #F36523; font-size: 140%; font-weight: bold; text-align: center; margin-right: 35px; }

.product-options select { width: 144px; }



body.heavy_duty hr.clear { padding-bottom: 20px; }
body.heavy_duty hr { border: none; height: 1px; background-color: #eeeeee; width: 100%; }
body.heavy_duty h1 { color: #0d5190; font-size: 180%; padding: 10px 10px 0; }
body.heavy_duty h2, body.heavy_duty h2 h3 { color: #0d5190; font-size: 160%; padding: 10px 10px 10px; }
body.heavy_duty p { padding: 10px; color: #0d5190; }
div.featuredbox { border: 2px solid #ccc; float: left; width: 370px; margin: 0 0 10px 0; }
div.featuredbox img.product { float: right; }
div.featuredbox p.price { color: #f36523; font-weight: bold; font-size: 120%; }
div.featuredbox img.button { float: left; padding: 0 0 10px 5px; }


/* BANNERS */
.banner { margin: 0 10px; float: left; width: 940px; clear: both; overflow: hidden; height: 170px;position:relative; }
.banner .slide { width: 940px; height: 270px;overflow: hidden; z-index: 1;}
.banner .slide .bg {background-color:#fff;opacity:0.6;filter:alpha(opacity=60);position:absolute;z-index:2;width:940px;height:170px;display:none;}
.banner .slide img { width: 940px; position: absolute; top: 0; left: 0; z-index: 1; }
.banner .slide .content { position: relative; z-index: 3; padding: 30px; color: #0055A5; width:500px;}
.banner .slide .content .title { font-size: 200%;font-weight: 700;}

/* BOXES */

.grad-box {float: left; margin: 0 10px; list-style-type: none; background: #f5f4f1 url(/media/grad-box.gif) repeat-x bottom;border-radius:15px;overflow:hidden;}
.grad-box .inner { border: 1px solid #cccccc; margin: 7px; background-color: #fff; position: relative; padding:10px;
border-radius:10px;}

/* TOP SELLERS */

.top-sellers {width:960px;margin-left:-10px;}

/* TOP TIPS */
.top-tip h3 { background-color: #f7a37a; color: #fff; padding: 10px; margin: 0; }
.top-tip h3 .circle { color: #fff; font-size: 100%; padding: 4px 10px; background:url(/media/top-tip-circle.png) no-repeat;}

.top-tip li { padding: 10px; font-size: 135%; color:#666;border-bottom:1px solid #F7A37A; }
.top-tip li a { font-size: 70%; }
.top-tip .alt {}
.top-tip .alt a { color: #fff; }

/* BUTTONs */

.button {padding:5px 10px;background-color:#00499B;border-radius:10px;position:relative;}
.button:hover {background-color:#00499B;}
.infobutton { text-indent:-9999px;float:right;background:url(/media/info_button.png) no-repeat;width:16px;height:17px;}
.infobutton:hover {float:right;background:url(/media/info_button.png) no-repeat;width:16px;height:17px;}

/* SPECIAL OFFERS */
.special-offers {background:#ed1c24 url(/media/special-offers-arrow.gif) no-repeat 95% center;color:#fff;font-weight:700;font-size:150%;padding:0;}
.special-offers a {display:block;color:#fff;text-decoration:none;padding:10px;}

/* HOME RECOMMENDED PRODUCTS */

.recommended img {width:124px;}

/* CATEGORY PAGES */
.product-list>td {width:50%;}
.product-list td {padding:5px;}

.categorycell {padding:5px;}
.productTD {padding:5px;}

/* PRODUCT DETAIL */

.product-choices {width: 340px; background: #fdf1e9; border: solid 1px #ef9d63; margin: 10px 0 10px 0;}
.product-choices td {padding:5px;}
/* BASKET */
.basket-totals td {padding:5px;}
