@import url("reset.css");
@import url("text.css");
@import url("960.css");

/*
* handcrafted code by
* jason o'brien at centresource
* http://www.centresource.com
*/



/*
* -------------General Stuff-------------
*/
.clearfix:after { clear:both; content:"."; display:block; height:0; visibility:hidden; }
.clearfix { display: block; }
* html .clearfix { height: 1%; }

body { background:#f7e8bd url(../images/body-bg.jpg); color: #333;font:13px/1.5 Helvetica,Arial,'Liberation Sans',FreeSans,sans-serif; position: relative; }

/*
* -------------Typography-------------
*/
a {color:#4e1303;}
a:hover {text-decoration:underline;color:#000;color:rgba(0,0,0,.7);}

h1, h2, h3, h4, h5, h6 {
  line-height: 1.1;
}

h2 {font-size:36px;}


/*
* -------------Containers-------------
*/

#wrapper-top {background-color:#f7e8bd;background:transparent url(../images/body-top-bg2.jpg) left top repeat-x;}

/*
* -------------Header-------------
*/

#header {position:relative;overflow:hidden;height:200px;color:#fff;z-index:2;font-size:12px;}
  #header h1 {text-indent:-9999px;width:199px;height:200px;background:url(../images/logo.png) no-repeat;position:relative;left:-40px;float:left;}
    #header h1 a {display:block;width:100%;height:100%;}
  
  /*Navigation*/
  #nav-main {list-style:none;position:absolute;left:153px;top:15px;}
    #nav-main li {padding-left:20px;margin:0 0 10px 0;width:444px;height:22px;background:url(../images/nav-main-sprite.png) no-repeat;text-indent:-9999px;}
      #nav-main li:hover {background-position:0 -153px;}
    #nav-main a {display:block;width:100%;height:100%;}
    /*Individual Items*/
    #nav-main li.our-beers {background-position:0 -33px;}
      #nav-main li.our-beers:hover {background-position:0 -186px;}
    #nav-main li.yazoo-store {background-position:0 -66px;}
      #nav-main li.yazoo-store:hover {background-position:0 -219px;}
    #nav-main li.yazoo-blog {background-position:0 -98px;}
      #nav-main li.yazoo-blog:hover {background-position:0 -251px;}
    #nav-main li.talk-to-us {background-position:0 -130px;}
      #nav-main li.talk-to-us:hover {background-position:0 -283px;}
      
    /*Active Navigation*/
    body.our-beers #nav-main li.our-beers {background-position:0 -186px;}
    body.about-yazoo #nav-main li.about-yazoo {background-position:0 -153px;}

  /*Contact Info*/
  .contact-info {width:360px;float:right;overflow:hidden;text-align:right;margin-top:45px;}
    .contact-info .company,
    .contact-info .taproom-hours {float:left;width:auto;margin-right:20px;}
      .contact-info .taproom-hours {float:left;width:auto;margin-right:0;}
    .contact-info strong {display:block;}
    .contact-info .tour { color:#fff; line-height:2em; }

/*
* -------------Buttons-------------
*/    

a.button-learnmore {display:block;width:150px;height:39px;background:url(../images/button-learnmore.png) no-repeat;text-indent:-9999px;}
    
/*
* -------------Homepage-------------
*/
body.home #content-wrapper {background:url(../images/home-beer-bg-trans.png) center top no-repeat;padding-top:100px;margin-top:-25px;z-index:1;overflow:hidden;}
  body.home #content-wrapper > .container_16 {padding-top:50px;}


h3.welcome {height:16px;background:url(../images/home-welcome.png) center top no-repeat;margin:0 auto;text-indent:-9999px;margin-top:-100px;}

#beer-spread {padding-top:50px;padding-bottom:115px;z-index:1;}
  #beer-spread ul {list-style:none;position:relative;margin:0;width:736px;margin:0 auto;z-index:2;}
    #beer-spread li {float:left;width:105px;height:316px;margin-left:20px;z-index:3;}
      #beer-spread li:first-child {margin:0;}
      
body.home div.hover {display:block;padding:15px;width:236px;height:54px;background:url(../images/beer-hover-bg.jpg) no-repeat;z-index:100;position:relative;left:-85px;opacity:0;}
  body.home div.hover h2 {font-size:14px;margin-bottom:10px;background:url(../images/beer-hover-headers.png) no-repeat;height:14px;text-indent:-9999px;width:117px;}
    body.home li.pale-ale div.hover h2 {background-position:-117px 0;width:87px;}
    body.home li.hefeweizen div.hover h2 {background-position:-204px 0;width:123px;}
    body.home li.sly-rye-porter div.hover h2 {background-position:-327px 0;width:156px;}
    body.home li.sue div.hover h2 {background-position:-483px 0;width:33px;}
    body.home li.hopproject div.hover h2 {background-position:-668px 0;width:151px;height:17px;}
      body.home div.hover h2 a {display:block;width:100%;height:100%;}
  body.home div.hover p {font-size:11px;margin-bottom:5px;}
  body.home div.hover p a {color:#333;text-decoration:none;}

#content-secondary {margin-top:-50px;margin-bottom:80px;}
  #tour, #twitter, #newsletter {position:relative;}
  #tour h2, #twitter h2, #newsletter h2 {background:url(../images/home-content-headers.png) no-repeat;height:18px;text-indent:-9999px;}
  #twitter h2 {background-position: 0 -18px;width:280px;margin:0 auto;}
  #newsletter h2 {background-position: 0 -36px;}
  
#tour {min-height:200px;}
  #tour img {position:absolute;left:-60px;top:20px;}
    #tour:hover img {-webkit-transform:rotate(-3deg);-moz-transform:rotate(-3deg);}
  #tour p {padding-left:100px;}
  #tour a {position:absolute;left:55px;bottom:48px;}
    #tour a:hover {left:65px;}

/*Twitter Feed*/
#twitter {background:url(../images/twitter-bg.png) center 35px no-repeat;min-height:200px;}
#mtaTwitter {position:relative;}
  #mtaTwitter > a {display:none;}
  #mtaTwitter ul {width:260px;margin:0 auto;font:12px/16px Georgia,Times,serif;padding-top:30px;}
    #mtaTwitter li {margin: 0;list-style:none;}
    
    #mtaTwitter span.when {display:none;}
    
#twitter a.follow {display:block;width:290px;height:10px;background:url(../images/twitter-follow.png) right top no-repeat;text-indent:-9999px;margin-top:15px;}

/*Newsletter*/
#newsletter {min-height:200px;}
#newsletter form {margin-bottom:10px;}
.e2ma_signup_image_container, .e2ma_signup_message, .e2ma_signup_form_required_footnote, .e2ma_signup_form_label {display:none;}
#e2ma_signup_reset_button {display:none;}

input[name="emma_member_email"] {background:url(../images/newsletter-input-bg.png) no-repeat;border:0;width:196px;height:49px;padding-left:15px;padding-right:70px;position:relative;}
#e2ma_signup_form_button_row {position:absolute;right:12px;top:55px;width:34px;height:17px;}
  #e2ma_signup_form_button_row input {width:34px;height:17px;cursor:pointer;background:url(../images/newsletter-submit.png) no-repeat;border:0;text-indent:-9999px;}

#newsletter > p {font-size:11px;color:#826948;}

    
/*
* -------------Interior-------------
*/

body.interior #content-wrapper {padding-top:40px;}

  /*Headers*/
  #content-wrapper h1 {text-indent:-9999px;}
  .our-beers #content-wrapper h1 {background:url(../images/interior-headers.png) 0 -77px no-repeat;height:30px;}
  .about-yazoo #content-wrapper h1 {background:url(../images/interior-headers.png) 0 0 no-repeat;height:38px;}
  .about-yazoo #content-wrapper .tour h1 {background:url(../images/interior-headers.png) 0 -39px no-repeat;height:38px;margin-top:30px;}
  .talk-to-us #content-wrapper h1 {background:url(../images/interior-headers.png) 0 -107px no-repeat;height:30px;}
  .charity #content-wrapper h1 {background:url(../images/interior-headers.png) 0 -137px no-repeat;height:38px;}

  /*Our Beers*/
  .beer-individual {min-height:426px;}
    .beer-individual img {position:absolute;left:-10px;top:0;}
    .beer-individual .info {background:url(../images/beer-stats-bg.png) 35px 0 no-repeat;min-height:110px;padding-top:20px;margin-top:20px;}
    
    .beer-individual h3 {margin-bottom:10px;background:url(../images/beer-info-headers.png) no-repeat;height:12px;text-indent:-9999px;}
      .beer-individual .food-pairings h3 {background-position:0 -12px;}
    
    .beer-individual .food-pairings p {padding-right:30px;}
    
    .our-beers #content-main h2 {height:60px;text-indent:-9999px;margin-bottom:15px;}
    
    body.dos-perros #content-main h2 {background:url(../images/beer-headers.png) no-repeat;}
    body.pale-ale #content-main h2 {background:url(../images/beer-headers.png) 0 -61px no-repeat;}
    body.hefeweizen #content-main h2 {background:url(../images/beer-headers.png) 0 -122px no-repeat;height:77px;}
    body.sly-rye-porter #content-main h2 {background:url(../images/beer-headers.png) 0 -263px no-repeat;height:76px;}
    body.stout #content-main h2 {background:url(../images/beer-headers.png) 0 -200px no-repeat;height:61px;}
    body.hopproject #content-main h2 {background:url(../images/beer-headers.png) 0 -400px no-repeat;height:75px;}
    body.sue #content-main h2 {background:url(../images/beer-headers.png) 0 -340px no-repeat;height:60px;width:200px;}
    body.seasonal #content-main h2 {background:url(../images/beer-headers.png) 0 -476px no-repeat;height:62px;}
    
    .beer-individual dl {overflow:hidden;width:190px;margin-bottom:5px;border-bottom:1px solid #cdbf9d;}
      .beer-individual dt {width:30%;float:left;clear:left;font-weight:bold;padding:2px 0;clear:left;display:block;}
      .beer-individual dd {width:70%;text-align:right;float:left;clear:right;padding:2px 0;clear:right;display:block;}
    
  /*Subnavigation*/
  
  #subnavigation {margin-top:20px;}
  
  #subnavigation li {list-style:none;height:30px;display:inline-block;margin:0 20px 0 0;text-indent:-9999px;padding-top:13px;}
  
  body.our-beers #subnavigation li a {display:block;width:107px;height:21px;background:url(../images/subnavigation-beers.png) no-repeat;margin-right:25px;}
  
    body.dos-perros #subnavigation li.dos-perros {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}
    body.dos-perros #subnavigation li.dos-perros a {background-position:0 -21px;}
    
    body.pale-ale #subnavigation li.pale-ale {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}
      body.our-beers #subnavigation li.pale-ale a {width:80px;background-position:-107px 0;}
      body.pale-ale #subnavigation li.pale-ale a, body.our-beers #subnavigation li.pale-ale a:hover {width:80px;background-position:-107px -21px;}

    body.hefeweizen #subnavigation li.hefeweizen {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}
      body.our-beers #subnavigation li.hefeweizen a {width:116px;background-position:-187px 0;}
      body.hefeweizen #subnavigation li.hefeweizen a, body.our-beers #subnavigation li.hefeweizen a:hover {width:116px;background-position:-187px -21px;}
    
    body.sly-rye-porter #subnavigation li.sly-rye-porter {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}
      body.our-beers #subnavigation li.sly-rye-porter a {width:138px;background-position:-303px 0;}
      body.sly-rye-porter #subnavigation li.sly-rye-porter a, body.our-beers #subnavigation li.sly-rye-porter a:hover {width:138px;background-position:-303px -21px;}
    
    body.stout #subnavigation li.stout {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}
      body.our-beers #subnavigation li.stout a {width:132px;background-position:-441px 0;}
      body.stout #subnavigation li.stout a, body.our-beers #subnavigation li.onward-stout a:hover {width:132px;background-position:-441px -21px;}
  
    body.hopproject #subnavigation li.hopproject {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}
      body.our-beers #subnavigation li.hopproject a {width:115px;background-position:-733px 0;}
      body.hopproject #subnavigation li.hopproject a, body.our-beers #subnavigation li.hopproject a:hover {width:115px;background-position:-733px -21px;}
      
    body.sue #subnavigation li.sue {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}  
      body.our-beers #subnavigation li.sue a {width:36px;background-position:-610px 0;}
      body.sue #subnavigation li.sue a, body.our-beers #subnavigation li.sue a:hover {width:36px;background-position:-610px -21px;}
      
    body.seasonal #subnavigation li.seasonal {background:url(../images/subnavigation-active-bg.png) right center no-repeat;}  
      body.our-beers #subnavigation li.seasonal a {width:87px;background-position:-646px 0;}
      body.seasonal #subnavigation li.seasonal a, body.our-beers #subnavigation li.seasonal a:hover {width:87px;background-position:-646px -21px;}
      
    /* Gerst Link */
      body.our-beers #subnavigation li.gerst a { background:url(../images/gerst-logo.png) right center no-repeat; width:175px;background-position:0 0; }
      
      
      
    /*About*/
    
    body.about-yazoo .about {min-height:400px;}

    body.about-yazoo .about .photos {position:absolute;left:0;top:0;}
    
    body.about-yazoo .photos li {position:absolute;left:0;top:0;margin:0;list-style:none;}
      body.about-yazoo .photos li.one {position:absolute;left:-40px;top:30px;z-index:503;-webkit-transform:rotate(-6deg) scale(.95);-moz-transform:rotate(-6deg) scale(.95);}
      body.about-yazoo .photos li.two {position:absolute;left:70px;top:120px;z-index:502;-webkit-transform:rotate(10deg) scale(.87);-moz-transform:rotate(10deg) scale(.87);}
      body.about-yazoo .photos li.three {position:absolute;left:120px;top:-20px;z-index:501;-webkit-transform:rotate(2deg) scale(.78);-moz-transform:rotate(2deg) scale(.78);}
        body.about-yazoo .photos li:hover {-webkit-transition:.2s all linear;-moz-transition:.2s all linear;-webkit-transform:rotate(0) scale(1);-moz-transform:rotate(0) scale(1);z-index:505;}
      
    h2.history, h2.hours {margin-bottom:10px;clear:both;background:url(../images/home-content-headers.png) 0 -54px no-repeat;text-indent:-9999px;height:23px;}    
      h2.hours {background-position:0 -77px;height:22px;}
      
    body.about-yazoo .tour img {position:relative;top:-35px;left:30px;}
      body.about-yazoo .tour img:hover {-webkit-transform:rotate(3deg);-moz-transform:rotate(3deg);}
      
      
    /*Forms*/
    body.talk-to-us form .row {margin:10px 0;}
    body.talk-to-us form input[type="text"], form textarea {padding:1px 10px;width:230px;height:50px;line-height:50px;background:url(../images/form-input-bg.jpg) no-repeat;border:0;font-size:15px;font-family:Georgia,serif;position:relative;}
    body.talk-to-us form textarea {height:80px;max-height:80px;width:280px;max-width:280px;background:url(../images/form-textarea-bg.jpg) no-repeat;padding:10px 10px;line-height:1.6;}
    body.talk-to-us form label {display:block;margin-bottom:3px;}
    body.talk-to-us form input[type="image"]:hover {position:relative;top:-2px;left:2px;-webkit-transform:rotate(-2deg);-moz-transform:rotate(-2deg);}
    
    /*Contact*/
    body.talk-to-us .about > p { padding-right:100px; }
    body.talk-to-us small a {color:#4e1303 !important;position:relative;top:20px;font-size:10px;}
    body.talk-to-us .map {background:url(../images/map-bg.jpg) no-repeat;position:relative;}
      body.talk-to-us .map iframe {position:relative;left:10px;top:10px;}
      
    /*Charity*/
    .charity-rules { margin-bottom:40px; }
    .charity-rules li { list-style:none; float:left; width:280px; margin:0 0 0 40px; }
    .charity-rules li:first-child { margin:0; }
    .charity-rules li span { display:block; width:57px; height:57px; margin:0 auto 20px; background:url(../images/charity-numbers.png) no-repeat; }
    .charity-rules li + li span { background-position:-57px 0; }
    .charity-rules li + li + li span { background-position:-114px 0; }
      
    
    
      
/*
* -------------Footer-------------
*/
body.talk-to-us #footer {margin-top:60px;}
body.our-beers #footer {margin-top:60px;}
#footer .container_16 {border-top:1px solid #d8c5ae;padding-top:20px;font-size:12px;}
  #footer .contact-info {float:left;margin-right:20px;margin-top:0;text-align:left;}
  #footer .nav-footer {float:left;width:220px;}
    #footer .nav-footer ul {float:left;width:50%;font-family:Rockwell,Arial,Helvetica,sans-serif;text-transform:uppercase;}
      #footer .nav-footer ul li {list-style:none;list-style-position:outside;margin:0 0 3px 0;}
        #footer .nav-footer ul li a {color:#4e1303;text-decoration:none;}
  #footer .copyright {float:right;text-align:right;width:330px;}
    #footer .copyright p {margin-bottom:5px;}
    #footer .copyright a {color:#000;text-decoration:none;}
    
    
/*
* -------------Age Verify-------------
*/
body.age-verify div {width:350px;margin:60px auto;}
body.age-verify a {display:block;width:256px;height:113px;margin:0 auto 20px;background:url(../images/enter.png) no-repeat;text-indent:-9999px;position:relative;}
body.age-verify a:active {top:1px;left:1px;}
body.age-verify p {text-align:center;}
body.age-verify p strong {font-size:10px;}
body.age-verify h1 {width:229px;height:237px;background:url(../images/ageverify-logo.png) no-repeat;margin:0 auto 30px;text-indent:-9999px;}