@charset "UTF-8";
/* CSS Document */

* { margin: 0; padding: 0; }

img { border: none; }
.clear { clear: both; }

body { background: url(images/bkd-xtile.jpg) repeat-x #F6B554; font-size: 62.5%; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: #666; }

/* Main Typography 
====================================*/

h1 { font-size: 2.2em; line-height: 1.3em; font-family: Georgia, "Times New Roman", Times, serif; padding-bottom: 1em; }
h2 { font-size: 1.8em; line-height: 1.3em; font-weight: normal; padding-bottom: 1em;  }
h3 { font-size: 1.6em; font-weight: normal; color: #000; padding-bottom: 0px; font-family: Georgia, "Times New Roman", Times, serif; }
h4 { font-size: 1.4em; font-weight: normal; color: #fff; padding-bottom: 1em; }

p { font-size: 1.2em; line-height: 1.6em; padding-bottom: 1em; }

ul { margin: 0em 1.5em 1.5em; padding: 0; }
li { font-size: 1.1em; padding: .5em; }

a { color: #333; text-decoration: none; font-weight: bold; }
a:hover { text-decoration: underline; }


/* Forms
====================================*/
      
fieldset { border: none; }
label { float: left; width: 11em; color: #333; }
input { width: 200px; }
textarea { width: 300px; height: 200px; background: #E6E6E6; }
input.text { background: #E6E6E6; }
input.radio, input.checkbox, input.submit { width: auto; }
input:focus, textarea:focus { background: #ffc; }
input.submit { margin-left: 13em; }
#contactForm { padding: 2em 1em 1em; margin-top: 5em; }

#careers label { color: #B3B3B3; width: 10em; }
#careers input { width: 150px; }
#careers textarea { width: 250px; }
#careers input.submit { width: auto; margin: 0; margin-left: 120px; }


#registerForm { padding: 1em; color:#666; margin: 0; }
fieldset#represent div { width: 150px; float: left; }
fieldset h3 { padding: 10px 0px; }
label.checkbox { float: none; }
input.zip { width: 40px;  }
input.state { width: 20px; float: left; }
label#zip { padding-left: 10px; width: 65px; }
#registerForm input.submit { margin-left: 0px; }

#establish label { width: 5em; }
#establish input.radio { float: left; }




/* Containers
====================================*/

#wrapper { width: 940px; margin: 0px auto; }

/* Main Content */

#contentShell { clear:both; width: 910px; padding: 1.5em; margin: 0; background-color: #fff; overflow: auto; background: url(images/bkd-xtile-content.gif) repeat-x bottom #fff; }
#contentShell .leftColumn { width: 410px; padding: 1.5em; float: left; }
#contentShell .rightColumn { width: 410px; padding: 1.5em; float: right; }
#contentShell .photoColumn { width: 445px; float: left; }

#contentShell2 { clear:both; width: 940px; padding: 0; margin: 0; background-color: #fff; overflow: auto; background: url(images/bkd-xtile-content.gif) repeat-x bottom #fff; }
#contentShell2 .leftColumn { width: 460px; float: left; }
#contentShell2 .rightColumn { width: 430px; padding: 1.5em 2em; float: right; }

#blackShell { clear:both; width: 940px; padding: 0; margin: 0; background-color: #000; overflow: auto; color: #fff; }
#blackShell .leftColumn { width: 350px; background: #000; float: left; padding: 1.5em 2em; }
#blackShell .rightColumn { width: 540px; float: right; background: url(images/bkd-xtile-content.gif) repeat-x bottom #fff; color: #666; }
#blackShell .padding { padding: 1.5em; }
#blackShell .contactText { padding-left: 2.5em; color: #808080; }
#blackShell .contactText a { color: #fff; font-weight: normal; }

#careers { clear:both; width: 940px; padding: 0; margin: 0; background-color: #000; overflow: auto; color: #fff; }
#careers .leftColumn { background-color: #000; width: 440px; float: left; padding: 1.5em; }
#careers .rightColumn { color: #666; background: url(images/bkd-xtile-content.gif) repeat-x bottom #fff; width: 440px; float: left; padding: 1.5em; }

#catalogs { clear:both; width: 940px; padding: 0; margin: 0; background-color: #fff; overflow: auto; background: url(images/bkd-xtile-content.gif) repeat-x bottom #fff; }
#catalogs .leftColumn { width: 320px; float: left; }
#catalogs .rightColumn { width: 560px; padding: 1.5em 2em; float: right; }

#catalogs h3 { padding-bottom: 10px; margin: 10px 0px; border-bottom: dashed 1px #666; clear: left; } 
#catalogs img.cover { width: 150px; float: left; margin: 0px 10px 10px 0px; }


/* Footer */

#footer { background:url(images/bkd-footer.gif) repeat-x; }
#footer .padding { width: 940px; margin: 0 auto; }
#footer .beerCup { text-align: right; height: 55px; }
#footer .beerCup img { width: 285px; float: right; }
#footer .beerCup p { padding: 1em; }
#footer .beerCup a:link { font-weight: normal; text-decoration: underline; }
#footer .info { padding: 1em; text-align: center; }

/* Main Navigation 
====================================*/

#mainNav { width: 930px; margin-top: 15px; }
#mainNav ul { list-style: none; width: auto; margin: 0; padding: 0; }
#mainNav li { float: left; padding: 0; margin: 0 10px 0 0; background: #F5AB48; }
#mainNav li a { background: url(images/bkd-mainNav.gif) no-repeat center #ccc; text-decoration: none; color: #000; height: 40px; line-height: 40px; font-size: 1.4em; display: block; padding: 0em 20px; font-weight: normal; }
#mainNav li a:hover { background: #F5AB48; color: #fff; text-decoration: none; }

/* IE 7 Fix */
#mainNav li:hover, #mainNav li.hover {
    position: static;
}

/* Sub Nav */
#mainNav li ul { position: absolute; width: auto; left: -999em; }
#mainNav li:hover ul { left: auto; }
#mainNav li:hover ul, #mainNav li.sfhover ul { left: auto; }
#mainNav li ul li { float: left; padding: 0; margin: 0; }
#mainNav li ul li a { background: #000; color: #E6E6E6; height: 35px; line-height: 35px; font-size: 1.2em; font-weight: normal;  }
#mainNav li ul li a:hover { background: #000; color: #F5AB48; text-decoration: none; }

/* Active State */
#mainNav li a.active { background: #F5AB48; color: #fff; }
#mainNav li ul li a.activeSub { color: #F5AB48; }