@charset "UTF-8";

/* RESET */
/* ----------------------------------------- */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal }
q:before, q:after { content:''}

/* Global reset-RESET */
/* The below restores some sensible defaults */
strong { font-weight: bold }
em { font-style: italic }
a img { border:none } /* Gets rid of IE's blue borders */

/* This helps to identify headings at the initial build stage, so I thought it'd be useful to have it */
h1, h2, h3, h4, h5, h5, h6 { font-weight:bold } 

br.dirtyLittleTrick { clear:both; display:block; height:1px; margin:-1px 0 0 0 }
/* div { position:relative } */

/**************** MAIN STYLE **********************/

body { background: url(Images/global/bkd-body-tile.jpg) repeat; font-size: 62.5%; 
       font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif; color: #424242; } 

/* TYPOGRAPHY */
/* ----------------------------------------- */
p { line-height: 1.7em; padding-bottom: .8em; } 

p .small {font-size: .8em; }

h2 { font-size: 2.1em; color: #4886a7; background:url(Images/global/hr.png) no-repeat bottom left; padding-bottom: .4em; margin-bottom: .4em; }
h2.white { font-size: 2.1em; color: #fff; background:url(Images/global/hr-white.png) no-repeat bottom left; padding-bottom: .4em; margin-left: 5px; }
h3 { font-size: 1.5em; padding-bottom: .8em; }
h4 { font-size: 1.3em; padding-bottom: .5em; }
h4.blue { color: #4886a7; }

ul.normalList { margin-left: 20px; }
ul.normalList li { list-style-type: disc; font-size: .9em; padding-bottom: .6em; }
ul.normalList ul { margin-left: 20px; padding-top: .3em; }
ul.normalList li ul li { list-style-type: disc; font-size: .9em; padding-bottom: .3em; }

ol.normalList { margin-left: 23px; }
ol.normalList li { list-style-type:decimal; font-size: .9em; padding-bottom: .6em; }
ol.normalList ul { margin-left: 20px; padding-top: .3em; }
ol.normalList li ul li { list-style-type: disc; font-size: .9em; padding-bottom: .3em; }

p.breadCrumb { color: #9f9f9f; font-weight: bold; font-size: 1.4em; margin-top: 0px; padding-top: 0px; }
p.breadCrumb a { text-decoration: none; color: #9f9f9f; }

.clear { clear: both; }

a { color: #000; font-weight: bold; text-decoration: 'underline'; } 
a:visited { color: #424242; }
a:hover { color: #4886a7; }
a:normal { text-decoration: none; }

.loginLink { color: #b7daff !important; font-weight: bold; }
.loginLink span { color: #b7daff; font-weight: bold; cursor:default;}

.cannon { font-weight:bold; color:#F00; }
.carts { font-weight:bold; color:#000; }
.reg { font-weight:bold; color:#000; }

/* LAYOUT */
/* ----------------------------------------- */
#wrapper {  width: 100%; }

#searchShell { height: 52px; width: 952px; margin: 0 auto; position: relative; }
#searchShell .container { width: 196px; height: 37px; float: right; background:url(Images/global/bkd-search.gif) no-repeat; position: absolute; right: 20px; bottom: 0px;  } 

#shell { width:946px; margin: 0px auto; -moz-border-radius: 10px; -webkit-border-radius: 10px; border: 3px solid #fff; background: #fff; }

#header { width:946px;  background:url(Images/global/bkd-header-ytile.gif) repeat-y; height: 85px; -moz-border-radius-topleft: 6px; -moz-border-radius-topright: 6px; -webkit-border-top-left-radius: 6px; -webkit-border-top-right-radius: 6px; }
#header .logo { height: 65px; width: 265px; float: left; margin: 10px 0px 0px;  }
#header .tagline { width: 650px; float: right; margin: 20px 20px 0px 0px; padding-top: 5px; text-align: right; font-size: 1.4em; font-style: italic;  }

#homeBottom {border-top: 3px solid #fff; } 

#login {background-color:White; width:100%;}
#login .form {width:500px; margin:0px auto;}

/*#homeBottom { -moz-border-radius-bottomleft: 10px;  -webkit-border-bottom-left-radius: 10px; border-left: 3px solid #fff; border-bottom: 3px solid #fff; -moz-border-radius-bottomright: 10px;  -webkit-border-bottom-right-radius: 10px; border-right: 3px solid #fff; border-bottom: 3px solid #fff; background: red; }*/
#homeBottom { background:#5e96b2 url(Images/global/bkd-productBox-xtile-bottom.png) repeat-x top; -moz-border-radius-bottomright: 6px;  -webkit-border-bottom-right-radius: 6px; -moz-border-radius-bottomleft: 6px;  -webkit-border-bottom-left-radius: 6px; overflow : hidden; _height : 1%;}
#homeBottom .mainBody { width: 595px; float: left; padding: 20px; -moz-border-radius-bottomleft: 6px;  -webkit-border-bottom-left-radius: 6px; background: #fff; font-size: 1.3em; }
#homeBottom .adminMainBody { width: 100%; float: left; padding: 20px; -moz-border-radius-bottomleft: 6px;  -webkit-border-bottom-left-radius: 6px; background: #fff; font-size: 1.3em; }
#homeBottom .adminMainBody input { width:auto; }
#homeBottom .adminMainBody ol, ul {  padding-left:15px; padding-top:0px; margin-top:0px;}
#homeBottom .adminMainBody li { list-style:disc outside none; }
#homeBottom .productBox { width: 290px; float: right; padding-top: 15px; /*background:url(Images/global/bkd-productBox-xtile-bottom.png) repeat-x bottom; -moz-border-radius-bottomright: 6px;  -webkit-border-bottom-right-radius: 6px;*/ }
#homeBottom .productBox .product { width: 130px; float: left; margin-right: 5px; }
#homeBottom .productBox .product p { color: #fff; text-align: center; } 

#interiorBottom { border-top: 3px solid #fff; overflow:hidden; _height: 1%; position:relative; } 
#interiorBottom { background:#5e96b2 url(Images/global/bkd-productBox-xtile-bottom.png) repeat-x top; -moz-border-radius-bottomright: 6px;  -webkit-border-bottom-right-radius: 6px; -moz-border-radius-bottomleft: 6px;  -webkit-border-bottom-left-radius: 6px;}
#interiorBottom .mainBody { width: 724px; float: right; padding: 20px 10px 20px 20px; background: #fff; font-size: 1.3em; }
#interiorBottom .hightlightCol { width: 130px; float: right; margin-left: 20px; text-align: center; padding-top: 15px; }

#interiorBottom .sideNav { width: 192px; float: left; }
#interiorBottom .address { position:absolute;  left: 15px; bottom: 5px; color: #fff; font-size: 1.1em; }

#footer { width: 952px; margin: 10px auto; text-align: right; font-size: 1em; color: #b7daff; } 

#flash { } 
	#flash .slideshow1 { float: left; width: 633px; height: 225px; }
	#flash .slideshow2 { float: right; width: 310px; height: 225px; }
	
#flashNews { }

#news {  padding-left:20px; padding-top:50px; color: #FFF; z-index: 90; width: 275px; font-size: 1.3em; }

#news a { color: #FFF; font-weight:normal;  }
#news a:visited { color: #FFF; }
#news a:hover{ color: #CCC; }

#footer a { color: #b7daff; font-weight: bold; }
	

.row { clear: both; padding-top: 7px; padding-left: 24px; }
.spacerRow { clear: both; padding: 15px 0px 20px 0px; }
.document, .documentWide { float: left; width: 217px; margin-bottom:3px; }
.document .icon, .documentWide .icon { float: left; width: 20px; top: -3px; position: relative; }
.document .name, .documentWide .name { float: left; max-width: 197px; font-size: 8pt; }
.documentWide { width: 434px; }
.documentWide .name { width: 394px; }

.Productdocument { float: left; width: 350px; margin-bottom:3px; }
.Productdocument .icon { float: left; width: 20px; top: -3px; position: relative; }
.Productdocument .name { float: left; max-width: 310px; font-size: 8pt; }

.CartGroups {display:block; text-decoration:none; text-align:center; vertical-align:middle; color:#fff; height:36px; text-align:center; width: 100%; background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 0; line-height:36px; overflow:hidden; border-left: 1px solid #fff; border-right: 1px solid #fff; border-bottom: 1px solid #fff;}

/* MAIN NAVIGATION */
/* ----------------------------------------- */
#mainNav { width:946px; height:36px; position:relative; font-size:12px; z-index:100; text-shadow: 0px 0px 6px #000;}

#mainNav ul { padding:0; margin:0;}
#mainNav ul li { float:left; position:relative;}
#mainNav ul li ul { display: none; }

#mainNav ul li a {display:block; text-decoration:none; color:#fff; height:36px; text-align:center; width: 156px; background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 0; line-height:36px; overflow:hidden; border-left: 1px solid #fff; border-right: 1px solid #fff; border-bottom: 1px solid #fff;}
#mainNav ul li a.first { border-left: none; width: 157px; }
#mainNav ul li a.last { border-right: none; width: 157px; overflow: hidden; }
#mainNav ul li:hover a {color:#fff; background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 -36px;}

#mainNav ul li:hover ul {display:block; position:absolute; top:36px; left:0; width:156px;}
#mainNav ul li:hover ul li ul {display: none;}
#mainNav ul li:hover ul li a {display: block; background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 0; color:#fff; text-align: left; padding-left: 5px; width: 151px;}
#mainNav ul li:hover ul li a:hover {background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 -36px; color:#fff;}

#mainNav ul li:hover ul li.green a {background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 -36px;}
#mainNav ul li:hover ul li.green a:hover { color:#FF6; }

#mainNav ul li:hover ul li a.twoLine, #mainNav ul li:hover ul li a.twoLine:hover { line-height:14px; padding-top:2px; height:34px; }

#mainNav ul li:hover ul li:hover ul {display:block; position:absolute; left:158px; top:0;}
#mainNav ul li:hover ul li:hover ul.left {left:-156px;}

.siteMap { height:20px; font-size:1.4em; background:url(Images/global/bkd-header-ytile.gif) repeat-y;  }


/* SIDE NAVIGATION */
/* ----------------------------------------- */

.sideNav ul { margin:0px; padding:0px;  }

ul#sideNav { list-style-type: disc; text-shadow: 0px 0px 6px #000; } 

ul#sideNav li a { height: 45px; line-height:45px; display: block; text-decoration: none; color: #fff; font-size: 1.3em; padding-left: 5px; background: url(Images/global/bkd-sideNav-xtile-hover.jpg) repeat-x 0px 0px; border-bottom: 1px solid #fff; }

ul#sideNav li a:hover { height: 45px; line-height:45px; display: block; text-decoration: none; color: #fff; font-size: 1.3em; padding-left: 5px; background: url(Images/global/bkd-sideNav-xtile-hover.jpg) repeat-x 0px -45px; border-bottom: 1px solid #fff;  }

ul#sideNav li.active { line-height:45px; display: block; color: #fff; font-size: 1.3em; padding-left: 15px; background: url(Images/global/bkd-sideNav-xtile-hover.jpg) repeat-x 0px -45px; border-bottom: 1px solid #fff; }

ul#sideNav li.expanded { line-height:45px; display: block; color: #fff; font-size: 1.3em; background: url(Images/global/bkd-sideNav-xtile-hover.jpg) repeat-x 0px -45px; border-bottom: 1px solid #fff; }
	/*ul#sideNav li.expanded a {font-size:1em; background:none; display:inline; line-height:normal; height:auto; padding-left:15px; border-bottom:none; font-weight:normal; }*/
	ul#sideNav li.expanded a {font-size:1em; background:none; height:auto; padding-left:15px; border-bottom:none; font-weight:normal; }

ul#sideNav li ul { padding: 1px 0px 1px -15px; } 
ul#sideNav li ul li { line-height: 18px; padding-left: 0px; }


ul#sideNav li.expanded ul { margin: 5px 0px 5px 0px;  }
ul#sideNav li.expanded ul li { line-height: 22px; padding-left: 0px; }

ul#sideNav li.expanded ul li ul li { margin-left: 10px;  }

ul#sideNav li ul li a { background: none; line-height: 16px; height: 16px; padding: 1px 0px 1px 5px; border: none; font-size: 1em;  } 
ul#sideNav li ul li a:hover { background: #86b6cb; line-height: 16px; height: 16px; padding: 1px 0px 1px 5px; border: none; font-size: 1em; }

ul#sideNav li.expanded ul li a { font-weight:bold; background: none; display:table; line-height: 16px; height: 16px; padding: 1px 0px 1px 5px; border: none; font-size: 1em;  } 
ul#sideNav li.expanded ul li a:hover { background: #86b6cb; line-height: 16px; height: 16px; padding: 1px 0px 1px 5px; border: none; font-size: 1em; }

/*li>ul#ulCartTypes { display: none; } /* Using a selector for so that this is not used in IE6, but in later versions. */
ul#ulCartTypes li { float: none; }

ul#sideNav li.expanded ul li ul li:hover ul#ulCartTypes { display: block; position: relative; font-size: 8pt; }
ul#sideNav li.expanded ul li ul li:hover ul#ulCartTypes li a {
	display: block; 
	color:#fff; 
	text-align: left; 
	padding-left: 5px; 
	width: 160px;
}
ul#sideNav li.expanded ul li ul li:hover ul#ulCartTypes li {
	display: block; 
	color:#fff; 
	text-align: left; 
	padding-left: 5px; 
	width: 160px;
}

ul#sideNav li.expanded ul li ul li:hover ul#ulCartTypes li a:hover {display: block;  font-size:10pt; font-weight:bold; }

/*
ul#ulStandardCarts li:hover a {color:#fff; background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 -36px;}
ul#ulStandardCarts li:hover ul#ulCartTypes li a 
{
	display: block; 
	background: url(Images/global/bkd-nav-xtile.png) repeat-x 0 0; 
	color:#fff; 
	text-align: left; 
	padding-left: 5px; 
	width: 151px;
}
*/


/* FORMS */
/* ----------------------------------------- */
.Warning { color: Red; }
fieldset { border: none; }
textarea { width: 300px; height: 200px; background: #E6E6E6; }
input.radio, input.checkbox, input.submit { width: auto; }

input:focus, textarea:focus {background: #cce8ff; }

input { width: 140px; }

input.searchBox { border: 1px solid #7a7a7a; width: 145px; height:13px; margin: 8px; padding: 3px; color: #7a7a7a; position:absolute; } 
input.searchButton { background: url(Images/global/bkd-searchButton.gif) no-repeat center center #c4c4c4; border: 1px solid #a2a2a2; width: 19px; height: 19px; color: #fff; cursor: pointer; position:absolute; right:8px; top:9px; }


/* FAUX CORNERS */
/* ----------------------------------------- */
.fauxCorners { position: relative; }

.fauxCorners .tl, .fauxCorners .tr, .fauxCorners .bl, .fauxCorners .br, .fauxCorners .blHome, .fauxCorners .brHome { width: 10px; height: 10px; position: absolute;}

.fauxCorners .tl
{ background: url(Images/global/ie-corners/shell-tl.jpg) top left no-repeat; top: -3px; left: -3px; }

.fauxCorners .tr
{ background: url(Images/global/ie-corners/shell-tr.jpg) top right no-repeat; top: -3px; right: -3px; }

.fauxCorners .bl
{ background: url(Images/global/ie-corners/shell-bl.gif) bottom left no-repeat; bottom: -3px; left: -3px; }

.fauxCorners .br
{ background: url(Images/global/ie-corners/shell-br.jpg) bottom right no-repeat; bottom: -3px; right: -3px; }

.fauxCorners .blHome
{ background: url(Images/global/ie-corners/shell-bl-home.jpg) bottom left no-repeat; bottom: -3px; left: -3px; }

.fauxCorners .brHome
{ background: url(Images/global/ie-corners/shell-br-home.jpg) bottom right no-repeat; bottom: -3px; right: -3px; }


/**************** PRODUCT POPUP **********************/

.product { font-size: 1.3em; padding:5px; }
	.product .col1 { width:110px; border:solid 1px #CCC; font-size:1.1em; font-weight:bold; padding:2px; }
	.product .col2, .product .col2description { width:200px; border:solid 1px #CCC; padding:2px; text-align:center; }	
	.product .col3 { width:10px; padding-left:50px; }		
	.product .col2description { font-size:.8em; }
	.product .description { padding-bottom:15px; }		
	.product .prodNo { width:200px; font-size:1.1em; font-weight:bold; padding:2px; text-align:center; }	
	
	.product .comparison { padding-bottom:15px; }
	
/*****************************************************/


/**************** SKIN STYLES **********************/

.textbox { border: solid 1px #cccccc; padding: 3px; }

.button_black
{
	width: 74px; height: 24px; color: #FFFFFF; font-size: 10px; font-weight: bold; 
	text-align: center; cursor: pointer; border: none 0px transparent;
	background: url( 'images/button_blk.gif' ) no-repeat top center; 
	margin: 0px 0px -3px 0px; padding: 0px 0px 5px 0px;
}

/**************** AJAX STYLES **********************/

/*Modal Popup*/
.modalBackground { background-color: #333333; filter: alpha(opacity=70); opacity: 0.7; }
.modalHeader { cursor: move; padding: 3px; margin-bottom: 10px; border: solid 1px #333333; font-size: 12px;
               background-color: #333333; color: #ffffff; font-weight: bold; }
			   
.modalProductPopup { background-color: #ffffff; border: solid 1px #000000; padding: 5px; }

.modalCloseButton { width: 100%; text-align: right; clear: both; padding-top: 10px; }
			  
/*Validator*/
.validatorCalloutHighlight { background-color: #ffffcc; z-index: 200; }

/*Update Progress*/
.loadingbox { position: absolute; top: 140px; right: 14px; border: 0px solid #215585; background-color: Transparent; 
              height: 16px; width: 160px; text-align: right; font-size: 10px; }
                            
              
.thumbImage { float: left; width: 100px; margin: 10px 18px; }

#signInUpForm input { width:auto; margin-bottom:3px; }
#signInUpForm label { margin-left: 5px; position:relative; top:-2px; }