@charset "UTF-8";
/*! normalize.css v5.0.0 | MIT License | github.com/necolas/normalize.css */
/** 1. Change the default font family in all browsers (opinionated). 2. Correct the line height in all browsers. 3. Prevent adjustments of font size after orientation changes in IE on Windows Phone and in iOS. */
/* Document ========================================================================== */
html { font-family: sans-serif; /* 1 */ line-height: 1.15; /* 2 */ -ms-text-size-adjust: 100%; /* 3 */ -webkit-text-size-adjust: 100%; /* 3 */ }

/* Sections ========================================================================== */
/** Remove the margin in all browsers (opinionated). */
body { margin: 0; }

/** Add the correct display in IE 9-. */
article, aside, footer, header, nav, section { display: block; }

/** Correct the font size and margin on `h1` elements within `section` and `article` contexts in Chrome, Firefox, and Safari. */
h1 { font-size: 2em; margin: 0.67em 0; }

/* Grouping content ========================================================================== */
/** Add the correct display in IE 9-. 1. Add the correct display in IE. */
figcaption, figure, main { /* 1 */ display: block; }

/** Add the correct margin in IE 8. */
figure { margin: 1em 40px; }

/** 1. Add the correct box sizing in Firefox. 2. Show the overflow in Edge and IE. */
hr { box-sizing: content-box; /* 1 */ height: 0; /* 1 */ overflow: visible; /* 2 */ }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
pre { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }

/* Text-level semantics ========================================================================== */
/** 1. Remove the gray background on active links in IE 10. 2. Remove gaps in links underline in iOS 8+ and Safari 8+. */
a { background-color: transparent; /* 1 */ -webkit-text-decoration-skip: objects; /* 2 */ }

/** Remove the outline on focused links when they are also active or hovered in all browsers (opinionated). */
a:active, a:hover { outline-width: 0; }

/** 1. Remove the bottom border in Firefox 39-. 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari. */
abbr[title] { border-bottom: none; /* 1 */ text-decoration: underline; /* 2 */ -webkit-text-decoration: underline dotted; text-decoration: underline dotted; /* 2 */ }

/** Prevent the duplicate application of `bolder` by the next rule in Safari 6. */
b, strong { font-weight: inherit; }

/** Add the correct font weight in Chrome, Edge, and Safari. */
b, strong { font-weight: bolder; }

/** 1. Correct the inheritance and scaling of font size in all browsers. 2. Correct the odd `em` font sizing in all browsers. */
code, kbd, samp { font-family: monospace, monospace; /* 1 */ font-size: 1em; /* 2 */ }

/** Add the correct font style in Android 4.3-. */
dfn { font-style: italic; }

/** Add the correct background and color in IE 9-. */
mark { background-color: #ff0; color: #000; }

/** Add the correct font size in all browsers. */
small { font-size: 80%; }

/** Prevent `sub` and `sup` elements from affecting the line height in all browsers. */
sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }

sub { bottom: -0.25em; }

sup { top: -0.5em; }

/* Embedded content ========================================================================== */
/** Add the correct display in IE 9-. */
audio, video { display: inline-block; }

/** Add the correct display in iOS 4-7. */
audio:not([controls]) { display: none; height: 0; }

/** Remove the border on images inside links in IE 10-. */
img { border-style: none; }

/** Hide the overflow in IE. */
svg:not(:root) { overflow: hidden; }

/* Forms ========================================================================== */
/** 1. Change the font styles in all browsers (opinionated). 2. Remove the margin in Firefox and Safari. */
button, input, optgroup, select, textarea { font-family: sans-serif; /* 1 */ font-size: 100%; /* 1 */ line-height: 1.15; /* 1 */ margin: 0; /* 2 */ }

/** Show the overflow in IE. 1. Show the overflow in Edge. */
button, input { /* 1 */ overflow: visible; }

/** Remove the inheritance of text transform in Edge, Firefox, and IE. 1. Remove the inheritance of text transform in Firefox. */
button, select { /* 1 */ text-transform: none; }

/** 1. Prevent a WebKit bug where (2) destroys native `audio` and `video` controls in Android 4. 2. Correct the inability to style clickable types in iOS and Safari. */
button, html [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; /* 2 */ }

/** Remove the inner border and padding in Firefox. */
button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; }

/** Restore the focus styles unset by the previous rule. */
button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; }

/** Change the border, margin, and padding in all browsers (opinionated). */
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em; }

/** 1. Correct the text wrapping in Edge and IE. 2. Correct the color inheritance from `fieldset` elements in IE. 3. Remove the padding so developers are not caught out when they zero out `fieldset` elements in all browsers. */
legend { box-sizing: border-box; /* 1 */ color: inherit; /* 2 */ display: table; /* 1 */ max-width: 100%; /* 1 */ padding: 0; /* 3 */ white-space: normal; /* 1 */ }

/** 1. Add the correct display in IE 9-. 2. Add the correct vertical alignment in Chrome, Firefox, and Opera. */
progress { display: inline-block; /* 1 */ vertical-align: baseline; /* 2 */ }

/** Remove the default vertical scrollbar in IE. */
textarea { overflow: auto; }

/** 1. Add the correct box sizing in IE 10-. 2. Remove the padding in IE 10-. */
[type="checkbox"], [type="radio"] { box-sizing: border-box; /* 1 */ padding: 0; /* 2 */ }

/** Correct the cursor style of increment and decrement buttons in Chrome. */
[type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; }

/** 1. Correct the odd appearance in Chrome and Safari. 2. Correct the outline style in Safari. */
[type="search"] { -webkit-appearance: textfield; /* 1 */ outline-offset: -2px; /* 2 */ }

/** Remove the inner padding and cancel buttons in Chrome and Safari on macOS. */
[type="search"]::-webkit-search-cancel-button, [type="search"]::-webkit-search-decoration { -webkit-appearance: none; }

/** 1. Correct the inability to style clickable types in iOS and Safari. 2. Change font properties to `inherit` in Safari. */
::-webkit-file-upload-button { -webkit-appearance: button; /* 1 */ font: inherit; /* 2 */ }

/* Interactive ========================================================================== */
/* Add the correct display in IE 9-. 1. Add the correct display in Edge, IE, and Firefox. */
details, menu { display: block; }

/* Add the correct display in all browsers. */
summary { display: list-item; }

/* Scripting ========================================================================== */
/** Add the correct display in IE 9-. */
canvas { display: inline-block; }

/** Add the correct display in IE. */
template { display: none; }

/* Hidden ========================================================================== */
/** Add the correct display in IE 10-. */
[hidden] { display: none; }

/* !H5BP HELPER CLASSES */
/* -------------------------------------------*/
/* Image replacement */
.ir, #gallery .flex-control-nav a, #gallery .flex-prev, #gallery .flex-next { display: block; border: 0; text-indent: -9999px; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }

.lt-ie8 .ir, .lt-ie8 #gallery .flex-control-nav a, #gallery .flex-control-nav .lt-ie8 a, .lt-ie8 #gallery .flex-prev, #gallery .lt-ie8 .flex-prev, .lt-ie8 #gallery .flex-next, #gallery .lt-ie8 .flex-next { line-height: 0; }

.ir br, #gallery .flex-control-nav a br, #gallery .flex-prev br, #gallery .flex-next br { display: none; }

.ir.roll, #gallery .flex-control-nav a.roll, #gallery .roll.flex-prev, #gallery .roll.flex-next { height: 0; line-height: 0; background-size: 100% auto; }

.ir.roll:hover, #gallery .flex-control-nav a.roll:hover, #gallery .roll.flex-prev:hover, #gallery .roll.flex-next:hover, .ir.roll:focus, #gallery .flex-control-nav a.roll:focus, #gallery .roll.flex-prev:focus, #gallery .roll.flex-next:focus { background-position: 0 100%; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Clearfix: contain floats For modern browsers 1. The space content is one way to avoid an Opera bug when the `contenteditable` attribute is included anywhere else in the document. Otherwise it causes space to appear at the top and bottom of elements that receive the `clearfix` class. 2. The use of `table` rather than `block` is only necessary if using `:before` to contain the top-margins of child elements. */
.clearfix:before, #chart-descriptions:before, .seasonals-beer .beer-ingredients:before, .core-beers-beer .beer-ingredients:before, .beer-columns:before, .beer-content header:before, .promo-row:before, #home-banner-descriptions:before, #footer-top .nav-container:before, .clearfix:after, #chart-descriptions:after, .seasonals-beer .beer-ingredients:after, .core-beers-beer .beer-ingredients:after, .beer-columns:after, .beer-content header:after, .promo-row:after, #home-banner-descriptions:after, #footer-top .nav-container:after { content: " "; /* 1 */ display: table; /* 2 */ }

.clearfix:after, #chart-descriptions:after, .seasonals-beer .beer-ingredients:after, .core-beers-beer .beer-ingredients:after, .beer-columns:after, .beer-content header:after, .promo-row:after, #home-banner-descriptions:after, #footer-top .nav-container:after { clear: both; }

/* For IE 6/7 only Include this rule to trigger hasLayout and contain floats. */
.lt-ie8 .clearfix, .lt-ie8 #chart-descriptions, .lt-ie8 .seasonals-beer .beer-ingredients, .seasonals-beer .lt-ie8 .beer-ingredients, .lt-ie8 .core-beers-beer .beer-ingredients, .core-beers-beer .lt-ie8 .beer-ingredients, .lt-ie8 .beer-columns, .lt-ie8 .beer-content header, .beer-content .lt-ie8 header, .lt-ie8 .promo-row, .lt-ie8 #home-banner-descriptions, .lt-ie8 #footer-top .nav-container, #footer-top .lt-ie8 .nav-container { zoom: 1; }

/* jQuery FlexSlider v2.4.0 http://www.woothemes.com/flexslider/ Copyright 2012 WooThemes Free to use under the GPLv2 and later license. http://www.gnu.org/licenses/gpl-2.0.html Contributing author: Tyler Smith (@mbmufffin) */
/* ==================================================================================================================== RESETS ====================================================================================================================*/
.flex-container a:hover, .flex-slider a:hover, .flex-container a:focus, .flex-slider a:focus { outline: none; }

.slides, .slides > li, .flex-control-nav, .flex-direction-nav { margin: 0; padding: 0; list-style: none; }

.flex-pauseplay span { text-transform: capitalize; }

/* ==================================================================================================================== BASE STYLES ====================================================================================================================*/
.flexslider { margin: 0; padding: 0; }

.flexslider .slides > li { display: none; -webkit-backface-visibility: hidden; }

.flexslider .slides img { width: 100%; display: block; }

.flexslider .slides:after { content: "\0020"; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }

html[xmlns] .flexslider .slides { display: block; }

* html .flexslider .slides { height: 1%; }

.no-js .flexslider .slides > li:first-child { display: block; }

@font-face { font-family: 'icomoon'; src: url("/fonts/icomoon.eot?-wmuqu9"); src: url("/fonts/icomoon.eot?#iefix-wmuqu9") format("embedded-opentype"), url("/fonts/icomoon.woff?-wmuqu9") format("woff"), url("/fonts/icomoon.ttf?-wmuqu9") format("truetype"), url("/fonts/icomoon.svg?-wmuqu9#icomoon") format("svg"); font-weight: normal; font-style: normal; }

[class^="icon-"], [class*=" icon-"] { font-family: 'icomoon'; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; /* Better Font Rendering =========== */ -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

.icon-facebook:before { content: "\ea8c"; }

.icon-instagram:before { content: "\ea90"; }

.icon-twitter:before { content: "\ea91"; }

.icon-vimeo:before { content: "\ea9c"; }

/** @license MyFonts Webfont Build ID 3009003, 2015-04-14T13:29:54-0400 The fonts listed in this notice are subject to the End User License Agreement(s) entered into by the website owner. All other parties are  explicitly restricted from using the Licensed Webfonts(s). You may obtain a valid license at the URLs below. Webfont: HTNeon by Flat-it URL: http://www.myfonts.com/fonts/flat-it/ht-neon/regular/ Copyright: Copyright (c) 2008 by Ryoichi Tsunekawa. All rights reserved. Licensed pageviews: 10,000 License: http://www.myfonts.com/viewlicense?type=web&buildid=3009003 © 2015 MyFonts Inc */
@font-face { font-family: 'HTNeon'; font-weight: normal; font-style: normal; src: url("/fonts/2DE9EB_0_0.eot"); src: url("/fonts/2DE9EB_0_0.eot?#iefix") format("embedded-opentype"), url("/fonts/2DE9EB_0_0.woff2") format("woff2"), url("/fonts/2DE9EB_0_0.woff") format("woff"), url("/fonts/2DE9EB_0_0.ttf") format("truetype"), url("/fonts/2DE9EB_0_0.svg#wf") format("svg"); }

@font-face { font-family: "Twentieth Century W01"; src: url("/fonts/17bd30b7-a8a6-4fc9-a545-3851a066203d.eot?#iefix"); src: url("/fonts/17bd30b7-a8a6-4fc9-a545-3851a066203d.eot?#iefix") format("eot"), url("/fonts/dcce54f5-5037-42ac-8ac1-7e1e3ad33b5c.woff2") format("woff2"), url("/fonts/badfae5c-b91c-44d3-8f21-ca6c25d14e81.woff") format("woff"), url("/fonts/d23415b8-cbd1-46e9-9333-090fa6e9214e.ttf") format("truetype"), url("/fonts/4b14e988-ed4a-47a3-b5a5-e953387ea25e.svg#4b14e988-ed4a-47a3-b5a5-e953387ea25e") format("svg"); font-weight: 300; font-style: normal; }

@font-face { font-family: "Twentieth Century W01"; src: url("/fonts/8624165c-9e93-4346-a219-990b0d920759.eot?#iefix"); src: url("/fonts/8624165c-9e93-4346-a219-990b0d920759.eot?#iefix") format("eot"), url("/fonts/f73f3a87-0dc2-4041-87ea-656b797408a7.woff2") format("woff2"), url("/fonts/d3817bf0-b3c3-4ff4-9955-924a3af74ca1.woff") format("woff"), url("/fonts/aa686768-0d35-4f93-80d4-1a3c1491ff89.ttf") format("truetype"), url("/fonts/de5c639d-b02a-4eeb-bbf3-494c4a0f5ce6.svg#de5c639d-b02a-4eeb-bbf3-494c4a0f5ce6") format("svg"); font-weight: 400; font-style: normal; }

@font-face { font-family: "Twentieth Century W01"; src: url("/fonts/f74e533c-352b-4133-9ffb-7d4d18ad39bf.eot?#iefix"); src: url("/fonts/f74e533c-352b-4133-9ffb-7d4d18ad39bf.eot?#iefix") format("eot"), url("/fonts/59b36fb1-81b8-429f-82f6-b92780287235.woff2") format("woff2"), url("/fonts/e926dc4a-f0fd-40d2-8715-e64974216b1b.woff") format("woff"), url("/fonts/6efb073c-8a74-48b7-b46e-b86568deae85.ttf") format("truetype"), url("/fonts/2b173c45-6319-4807-9f66-ea619182c95f.svg#2b173c45-6319-4807-9f66-ea619182c95f") format("svg"); font-weight: 400; font-style: italic; }

@font-face { font-family: "Twentieth Century W01"; src: url("/fonts/19709223-675d-4559-bb7f-135c5186f023.eot?#iefix"); src: url("/fonts/19709223-675d-4559-bb7f-135c5186f023.eot?#iefix") format("eot"), url("/fonts/8b95b714-d340-4fef-bf60-86348bb3def9.woff2") format("woff2"), url("/fonts/6ce98d1c-a506-4623-a6c1-39d496cb4766.woff") format("woff"), url("/fonts/865dc4ba-dd06-49f4-b4a3-45d4a1342117.ttf") format("truetype"), url("/fonts/0202ee39-d77e-4418-b44e-f76b2fcf6737.svg#0202ee39-d77e-4418-b44e-f76b2fcf6737") format("svg"); font-weight: 600; font-style: normal; }

@font-face { font-family: "Twentieth Century W01"; src: url("/fonts/e1301bd9-09a5-4332-bb71-b93d745ab880.eot?#iefix"); src: url("/fonts/e1301bd9-09a5-4332-bb71-b93d745ab880.eot?#iefix") format("eot"), url("/fonts/3db55513-298e-4f0d-a94e-96b48e114be7.woff2") format("woff2"), url("/fonts/acccf3dc-5ffe-4534-9855-68770fc6df0b.woff") format("woff"), url("/fonts/aea99fce-684b-4980-99fb-e2f941d19967.ttf") format("truetype"), url("/fonts/c882c92e-18dc-4970-a181-26b2f055a956.svg#c882c92e-18dc-4970-a181-26b2f055a956") format("svg"); font-weight: 700; font-style: normal; }

@font-face { font-family: "Twentieth Century W01"; src: url("/fonts/0a979659-828a-4174-a55f-f324808ff077.eot?#iefix"); src: url("/fonts/0a979659-828a-4174-a55f-f324808ff077.eot?#iefix") format("eot"), url("/fonts/ba07794f-9afb-42c2-b704-8153382eba04.woff2") format("woff2"), url("/fonts/6313568a-87e6-4b95-8fc7-7f7fc0945a2e.woff") format("woff"), url("/fonts/42f8b83e-1bf2-41d5-aed9-e416354751ea.ttf") format("truetype"), url("/fonts/d57f07a9-bb6a-440d-819f-81743aceb081.svg#d57f07a9-bb6a-440d-819f-81743aceb081") format("svg"); font-weight: 700; font-style: italic; }

@font-face { font-family: "Twentieth Century W01"; src: url("/fonts/ef26d211-b63d-4ad3-8893-12b71ca2304f.eot?#iefix"); src: url("/fonts/ef26d211-b63d-4ad3-8893-12b71ca2304f.eot?#iefix") format("eot"), url("/fonts/47f366c9-1d2e-4149-8ec4-75eb8f6ceeee.woff2") format("woff2"), url("/fonts/53fcf5bb-8349-43fe-8e91-e202cfadd927.woff") format("woff"), url("/fonts/96139cb7-6723-44c0-b721-4c15d401a35c.ttf") format("truetype"), url("/fonts/e536cf3c-7a8d-4ec9-8e96-efa05b0e3622.svg#e536cf3c-7a8d-4ec9-8e96-efa05b0e3622") format("svg"); font-weight: 800; font-style: normal; }

/* !BASE STYLES */
/* -------------------------------------------*/
html { box-sizing: border-box; -webkit-box-sizing: border-box; }

*, *:before, *:after { box-sizing: inherit; -webkit-box-sizing: inherit; }

html, body, button, input, select, textarea { color: #6A6B66; font-family: "Twentieth Century W01", sans-serif; line-height: 1; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

::-moz-selection { background: #26AFD7; text-shadow: none; color: #fff; }

::selection { background: #26AFD7; text-shadow: none; color: #fff; }

hr { display: block; height: 1px; border: 0; border-top: 1px solid #6A6B66; padding: 0; }

img, svg { max-width: 100%; height: auto; vertical-align: middle; }

.bg-img { background-position: 50% 50%; background-repeat: no-repeat; background-size: cover; }

a { color: #F05A28; text-decoration: none; transition: color 300ms linear; }

nav *, .ir, #gallery .flex-control-nav a, #gallery .flex-prev, #gallery .flex-next { margin: 0; padding: 0; }

nav li { list-style: none; }

h1, h2, h3, h4, h5, h6, p, ul, ol, dl { margin-top: 0; }

/* !UNIVERSAL DESKTOP AND MOBILE HIDING */
/* -------------------------------------------*/
.mobile .desktop-only, .desktop .mobile-only, .desktop .phone-only, .tablet .phone-only, .desktop .tablet-only, .phone .tablet-only { display: none !important; }

/* !LAZY LOADING */
/* -------------------------------------------*/
.lazyload, .lazyloading { opacity: 0; will-change: opacity; }

.lazyloaded { transition: opacity 250ms linear; opacity: 1; }

/* !STRUCTURE */
/* -------------------------------------------*/
html { padding-bottom: 22px; background: #696a6c url(/img/metal-bg.png) repeat 0 0; }

body { margin: 0 auto; max-width: 1800px; background: #fff; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.35); }

/* !INTROS */
/* -------------------------------------------*/
.intro-image-wrapper { position: relative; overflow: hidden; background: #ddd; }

.intro-image-wrapper::after { content: ''; display: block; height: 0; padding-bottom: 40.5%; }

.intro-image-wrapper h1.image { position: absolute; z-index: 2; left: 0; top: 25%; margin: 0; width: 100%; height: 50%; text-align: center; }

.intro-image-wrapper h1.image img { height: 100%; width: auto; }

.intro-image-wrapper h1.text { position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -55%); transform: translate(-50%, -55%); z-index: 3; font: 400 15vw/1 "vinyl", sans-serif; text-transform: uppercase; color: #fff; white-space: nowrap; -webkit-filter: drop-shadow(0.05em 0.05em 0 rgba(0, 0, 0, 0.3)); filter: drop-shadow(0.05em 0.05em 0 rgba(0, 0, 0, 0.3)); }

.intro-image-wrapper::before { display: block; content: ''; position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 33%; background: linear-gradient(to top, white 10%, rgba(255, 255, 255, 0)); }

.intro-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; font-family: "object-fit: cover"; z-index: 0; }

.intro-text { margin: 0 auto; padding: 30px 24px 0; max-width: 1020px; font-size: 1.25rem; line-height: 1.5; font-weight: 600; color: #7B7D7F; }

.intro-text.no-pad { padding-top: 0; }

.intro-text h2 { margin: 0 0 10px; background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; background-position: 0 50%; }

.intro-text h2 span { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 1.5rem; text-transform: uppercase; display: inline-block; padding-right: 10px; letter-spacing: 3px; color: #F05A28; background: #fff; }

.plain-header { margin-bottom: 32px; padding-top: 24px; background: url(/img/double-stripe-gray-horz.png) repeat-x 0 52px; background-size: 10px 17px; }

.plain-header h1 { margin-bottom: 0; }

.plain-header h1 img { max-height: 124px; width: auto; }

.plain-header h2 { margin: 20px 0 0; background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; background-position: 0 50%; }

.plain-header h2 span { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 1.5rem; text-transform: uppercase; display: inline-block; padding-right: 10px; letter-spacing: 3px; color: #F05A28; background: #fff; }

.plain-header p, .plain-header ul { font-size: 1rem; line-height: 1.375; margin-top: 12px; margin-bottom: 0; }

@media screen and (max-width: 43.6875em) { .intro-image-wrapper h1.image { top: 20%; height: 60%; } }

@media screen and (max-width: 29.9375em) { .plain-header { padding-top: 18px; background-position: 0 36px; } }

/* !RANDOM ELEMENTS */
/* -------------------------------------------*/
.dash-sep { margin: 32px auto; height: 10px; max-width: 1020px; background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; }

.cta-button { display: inline-block; padding: 0.5em 0.7em 0.5em 0.8em; font: 800 22px/1.1 "Twentieth Century W01", sans-serif; text-transform: uppercase; letter-spacing: 0.14em; color: #fff; background: #F05A28; border: none; border-radius: 0; transition: background-color 300ms linear; }

.cta-button:hover, .cta-button:focus { background-color: #9d3b19; }

@media screen and (max-width: 62.4375em) { .cta-button { font-size: 20px; } }

@media screen and (max-width: 43.6875em) { .cta-button { font-size: 18px; } }

/* !AGE GATE */
/* -------------------------------------------*/
#age-gate-overlay { position: fixed; z-index: 9998; left: 0; top: 0; width: 100%; height: 100%; background: rgba(8, 35, 43, 0.9); }

#age-gate { position: absolute; z-index: 9999; left: 0; top: 150px; width: 100%; }

#age-gate-inner { position: relative; margin: 0 auto 30px; padding: 120px 0 18px; width: 436px; text-align: center; background: #fff; }

#age-gate-inner:before { content: ''; position: absolute; left: 7px; top: 7px; right: 7px; bottom: 7px; border: 2px solid #F05A28; }

#age-gate-inner:after { content: ''; position: absolute; left: 7px; top: 112px; right: 7px; height: 2px; background: #F05A28; }

#age-gate-header { position: absolute; z-index: 1; left: 0; top: -60px; width: 100%; height: 180px; background: url(/img/age-gate-header.png) no-repeat 50% 0; background-size: 500px auto; }

#age-gate-content { background: #26AFD7; }

#age-gate-question { padding: 32px 20px; min-height: 94px; font-size: 1.875rem; line-height: 1; font-weight: 300; color: #fff; }

#age-gate-answers { position: relative; z-index: 1; }

#age-gate-answers a { display: inline-block; font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 2.25rem; text-transform: uppercase; margin: 0 5px; padding: 8px 0 0; font-size: 1.875rem; width: 70px; background: #fff; cursor: pointer; transition: color 300ms linear; }

#age-gate-answers a:hover, #age-gate-answers a:focus { color: #9d3b19; }

@media screen and (max-width: 43.6875em) { #age-gate { top: 125px; } #age-gate-inner { margin: 0 18px 30px; width: auto; } #age-gate-question { padding: 25px 20px; min-height: 76px; font-size: 1.625rem; } }

/* !404 */
/* -------------------------------------------*/
.error-404 main img { float: left; margin-top: 50px; width: 350px; }

.error-404 main .text { margin-left: 400px; padding-bottom: 30px; }

.error-404 main h1 { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 2.25rem; text-transform: uppercase; letter-spacing: 0.0625em; margin: 0 0 0.2em; font-size: 6.875rem; letter-spacing: 5px; color: #F05A28; text-shadow: -10px 10px 0 #ebecec; }

.error-404 main h2 { font-size: 1.25rem; line-height: 1.5; color: #959799; }

@media screen and (max-width: 62.4375em) { .error-404 main img { margin-top: 25px; width: 250px; } .error-404 main .text { margin-left: 300px; } .error-404 main h1 { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 2.25rem; text-transform: uppercase; letter-spacing: 0.0625em; font-size: 5.625rem; letter-spacing: 4px; text-shadow: -5px 5px 0 #ebecec; } }

@media screen and (max-width: 49.9375em) { .error-404 main img { display: none; } .error-404 main .text { padding-top: 30px; margin-left: 0; } }

@media screen and (max-width: 29.9375em) { .error-404 main h1 { font-size: 3.75rem; letter-spacing: 2px; } }

/* !BASE GRID */
/* -------------------------------------------*/
.grid { margin-left: auto; margin-right: auto; padding-left: 48px; padding-right: 48px; max-width: 1068px; }

.grid::after { clear: both; content: ""; display: block; }

.grid-item { float: left; margin-bottom: 24px; }

.grid-item > img { width: 100%; }

.grid-break { display: none; width: 100%; height: 1px; clear: both; }

@media screen and (max-width: 43.6875em) { .grid { padding-left: 24px; padding-right: 24px; } }

@media screen and (max-width: 29.9375em) { .grid { padding-left: 18px; padding-right: 18px; } }

/* !4 COLUMNS */
/* -------------------------------------------*/
/* !3 COLUMNS */
/* -------------------------------------------*/
/* !2 COLUMNS */
/* -------------------------------------------*/
/* !NO COLUMNS */
/* -------------------------------------------*/
/* !PRE-CONFIGURED GRIDS */
/* -------------------------------------------*/
.grid-4 .grid-item { float: left; padding: 0; width: 25%; }

.grid-4 .item-4-1 { padding: 0 18px 0 0; }

.grid-4 .item-4-2 { padding: 0 12px 0 6px; }

.grid-4 .item-4-3 { padding: 0 6px 0 12px; }

.grid-4 .item-4-0 { padding: 0 0 0 18px; }

.grid-4 .grid-break { display: none; }

.grid-4 .break-4-0 { display: block; }

@media screen and (max-width: 43.6875em) { .grid-4 .grid-item { float: left; padding: 0; width: 50%; } .grid-4 .item-2-1 { padding: 0 12px 0 0; } .grid-4 .item-2-0 { padding: 0 0 0 12px; } .grid-4 .grid-break { display: none; } .grid-4 .break-2-0 { display: block; } }

@media screen and (max-width: 29.9375em) { .grid-4 .grid-item { float: none; display: block; padding: 0; width: 100%; } .grid-4 .grid-break { display: none; } }

.grid-3 .grid-item { float: left; padding: 0; width: 33.333333%; }

.grid-3 .item-3-1 { padding: 0 16px 0 0; }

.grid-3 .item-3-2 { padding: 0 8px; }

.grid-3 .item-3-0 { padding: 0 0 0 16px; }

.grid-3 .grid-break { display: none; }

.grid-3 .break-3-0 { display: block; }

@media screen and (max-width: 43.6875em) { .grid-3 .grid-item { float: left; padding: 0; width: 50%; } .grid-3 .item-2-1 { padding: 0 12px 0 0; } .grid-3 .item-2-0 { padding: 0 0 0 12px; } .grid-3 .grid-break { display: none; } .grid-3 .break-2-0 { display: block; } }

@media screen and (max-width: 29.9375em) { .grid-3 .grid-item { float: none; display: block; padding: 0; width: 100%; } .grid-3 .grid-break { display: none; } }

.grid-2 .grid-item { float: left; padding: 0; width: 50%; }

.grid-2 .item-2-1 { padding: 0 12px 0 0; }

.grid-2 .item-2-0 { padding: 0 0 0 12px; }

.grid-2 .grid-break { display: none; }

.grid-2 .break-2-0 { display: block; }

@media screen and (max-width: 49.9375em) { .grid-2 .grid-item { float: none; display: block; padding: 0; width: 100%; } .grid-2 .grid-break { display: none; } }

/* !MASTHEAD AND FOOTER */
/* -------------------------------------------*/
.nav-container { position: relative; margin-left: auto; margin-right: auto; padding-left: 24px; padding-right: 24px; max-width: 1128px; }

@media screen and (max-width: 62.4375em) { .nav-container { padding-left: 15px; padding-right: 15px; } }

/* !MASTHEAD */
/* -------------------------------------------*/
#menu-toggle { display: none; }

#pre-masthead { height: 31px; background: #696a6c url(/img/metal-bg.png) repeat 0 0; }

#masthead { position: relative; padding-top: 13px; height: 81px; background: #fff; }

.recessed-nav #masthead { height: 50px; }

#masthead:before { content: ''; display: block; position: absolute; z-index: 0; left: 0; top: 7px; width: 100%; height: 28px; background: #b0b1b2 url(/img/tab-shadow-bottom.png) repeat-x 0 100%; }

#masthead:after { content: ''; display: block; position: absolute; z-index: 0; left: 0; top: 43px; width: 100%; height: 3px; background: #F05A28; }

#logo { position: absolute; z-index: 9900; left: 24px; top: -36px; width: 98px; }

#nav { position: relative; z-index: 1; margin: 0 0 0 100px; font-size: 1.125rem; font-weight: 300; text-transform: uppercase; letter-spacing: 0.1666666667em; }

#nav ul { height: 1.125rem; }

#nav li { float: left; margin-left: 40px; }

#nav li:first-child { margin-left: 0; }

#nav a { color: #fff; }

#nav a:hover, #nav a:focus { color: rgba(235, 61, 5, 0.85); }

#sub-nav { position: relative; z-index: 1; margin: 25px 0 0 115px; font-size: 0.8125rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0769230769em; }

#sub-nav ul { height: 0.8125rem; }

#sub-nav li { float: left; margin-left: 20px; }

#sub-nav li:first-child { margin-left: 0; }

#sub-nav a:hover, #sub-nav a:focus { color: #26AFD7; }

@media screen and (max-width: 62.4375em) { #menu-toggle { position: absolute; display: inline-block; cursor: pointer; right: 24px; top: -2px; color: #fff; font-size: 1rem; line-height: 1.125; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0625em; line-height: 17px; } #menu-toggle span { position: relative; top: 1px; display: inline-block; vertical-align: top; padding-right: 4px; } #menu-toggle i { position: relative; display: inline-block; vertical-align: top; height: 17px; width: 26px; border: 3px solid #fff; border-width: 3px 0; } #menu-toggle i:after { content: ''; position: absolute; left: 0; top: 4px; width: 100%; height: 3px; background: #fff; } #pre-masthead { height: 18px; } #masthead { height: 58px; } .recessed-nav #masthead { height: 43px; } #masthead:before { top: 5px; } #masthead:after { top: 38px; height: 2px; } #logo { left: 15px; top: -24px; width: 67px; } #nav { display: none; position: absolute; z-index: 9999; left: 0; top: 30px; margin: 0; width: 100%; font-size: 1.5rem; font-weight: 700; text-align: center; } #nav ul { height: auto; } #nav li { float: none; margin: 0; } #nav a { display: block; padding: 12px 0 8px; color: #7B7D7F; background: #ebecec url(/img/tab-shadow-top.png) repeat-x 0 0; } #sub-nav { display: none; } }

/* !FOOTER */
/* -------------------------------------------*/
#footer { padding: 10px 0 0; }

#footer-top { padding: 4px 0; border: 1px solid #F05A28; border-width: 1px 0; }

#footer-top ul { float: left; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; line-height: 22px; }

#footer-top li { float: left; margin-left: 15px; }

#footer-top li:first-child { margin-left: 0; }

#footer-top li a { color: #bdbebf; }

#footer-top li a:hover, #footer-top li a:focus { color: #26AFD7; }

#footer-top li i { display: none; }

#mc-embedded-subscribe-form { float: right; }

#mc-embedded-subscribe-form label { display: inline-block; vertical-align: top; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; line-height: 22px; color: #bdbebf; }

#mc-embedded-subscribe-form input[type="email"] { display: inline-block; vertical-align: top; width: 190px; height: 22px; font-size: 1rem; text-indent: 4px; border: none; border-radius: 0; background: #e5e5e5; }

#mc-embedded-subscribe-form button { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.6875rem; text-transform: uppercase; padding: 0 6px 0 7px; height: 22px; line-height: 22px; color: #fff; letter-spacing: 1px; border: none; border-radius: 0; background: #F05A28; transition: background-color 0.3s linear; }

#mc-embedded-subscribe-form button:hover, #mc-embedded-subscribe-form button:focus { background: #9d3b19; }

#form-message { display: none; clear: both; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; padding: 6px 0 2px; text-align: right; color: #F05A28; }

#credits { padding: 12px 0; font-size: 0.75rem; line-height: 1.1666666667; font-weight: 800; text-transform: uppercase; letter-spacing: 0.125em; font-weight: 400; letter-spacing: 1px; color: #bdbebf; text-align: right; }

#credits p { margin: 0 -4px 0 0; }

@media screen and (max-width: 62.4375em) { #footer-top ul { font-size: 1.25rem; line-height: 1; } #footer-top li i { display: inline-block; } #footer-top li span { display: none; } #footer-top li .icon-facebook { position: relative; top: -2px; } }

@media screen and (max-width: 49.9375em) { #footer-top { padding: 18px 0 15px; } #footer-top ul { float: none; margin-bottom: 6px; font-size: 1.75rem; } #footer-top ul::after { clear: both; content: ""; display: block; } #mc-embedded-subscribe-form { float: none; } #form-message { text-align: left; } #credits { text-align: left; } }

/* !HEADER */
/* -------------------------------------------*/
#home-header { position: relative; padding-top: calc(30px + 5%); padding-bottom: 43%; text-align: center; background: #1c75bc; }

#home-header .content { position: relative; z-index: 2; margin: 0 auto; width: 86%; }

#home-header .content h1 { margin: 0; padding-bottom: calc(25px + 5%); }

#home-header .content h1 img { max-width: 82%; }

#home-header .content h2 { margin: 0 0 1em; font: 400 20px/1.3 "Twentieth Century W01", sans-serif; color: #fff; text-transform: uppercase; letter-spacing: 0.2em; text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.35); }

@media screen and (max-width: 62.4375em) { #home-header .content h2 { font-weight: 600; } }

#home-header .content .header-image.mobile { display: none; }

@media screen and (max-width: 43.6875em) { #home-header .content .header-image.mobile { display: inline; } #home-header .content .header-image.desktop { display: none; } }

#home-header .background { position: absolute; left: 0; top: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; font-family: "object-fit: cover"; }

#home-header::after { display: block; content: ''; position: absolute; z-index: 1; left: 0; bottom: 0; width: 100%; height: 25%; background: linear-gradient(to top, #1c75bc 20px, rgba(28, 117, 188, 0)); }

@media screen and (max-width: 43.6875em) { #home-header::after { height: 50%; } }

/* !BEER SECTION */
/* -------------------------------------------*/
#home-beer { padding: 0 0 45px; background: #1c75bc; color: #fff; }

#home-beer .text { margin: 0 auto; padding: 0 30px; max-width: 1140px; }

#home-beer .text h2 { margin: 0 0 0.35em; font: 400 40px/1 "vinyl", sans-serif; text-transform: uppercase; letter-spacing: 0.11em; background: url(/img/dashes-white-horz.png) repeat-x 0 0; background-size: 7px 10px; background-position: 0 15px; }

#home-beer .text h2 span { display: inline-block; padding-right: 15px; background: #1c75bc; }

#home-beer .text .intro { font-size: 1.25rem; line-height: 1.5; }

#home-beer .text .link { text-align: center; }

#beer-images { overflow: hidden; padding: 20px 0 45px; }

@media screen and (max-width: 43.6875em) { #beer-images { padding: 15px 0 35px; } }

#beer-images #beer-image-slider { position: relative; left: calc(100% + 20px); will-change: left; -webkit-transform: translateZ(0); transform: translateZ(0); transition: left 1.3s cubic-bezier(0.215, 0.61, 0.355, 1); }

#beer-images #beer-image-strip { display: flex; align-items: flex-end; will-change: transform; -webkit-transform: translateZ(0); transform: translateZ(0); }

#beer-images.animate.loaded #beer-image-slider { left: 0; }

#beer-images.animate.loaded #beer-image-strip { -webkit-animation: slideLoop 15s linear 0s infinite; animation: slideLoop 15s linear 0s infinite; }

#beer-images .beer { position: relative; display: block; margin-right: 20px; padding-bottom: 13px; width: 154px; }

#beer-images .beer img { width: 100%; }

#beer-images .beer .can { position: relative; z-index: 2; }

#beer-images .beer .shadow { position: absolute; z-index: 1; left: 0; bottom: 0; }

@media screen and (max-width: 43.6875em) { #beer-images .beer { width: 102px; margin-right: 16px; padding-bottom: 9px; } }

@-webkit-keyframes slideLoop { 0% { -webkit-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-50%); transform: translateX(-50%); } }

@keyframes slideLoop { 0% { -webkit-transform: translateX(0); transform: translateX(0); }
  100% { -webkit-transform: translateX(-50%); transform: translateX(-50%); } }

#beer-image-strip.count-1 { width: 348px; }

#beer-image-strip.count-2 { width: 696px; }

#beer-image-strip.count-3 { width: 1044px; }

#beer-image-strip.count-4 { width: 1392px; }

#beer-image-strip.count-5 { width: 1740px; }

#beer-image-strip.count-6 { width: 2088px; }

#beer-image-strip.count-7 { width: 2436px; }

#beer-image-strip.count-8 { width: 2784px; }

#beer-image-strip.count-9 { width: 3132px; }

#beer-image-strip.count-10 { width: 3480px; }

#beer-image-strip.count-11 { width: 3828px; }

#beer-image-strip.count-12 { width: 4176px; }

#beer-image-strip.count-13 { width: 4524px; }

#beer-image-strip.count-14 { width: 4872px; }

#beer-image-strip.count-15 { width: 5220px; }

#beer-image-strip.count-16 { width: 5568px; }

#beer-image-strip.count-17 { width: 5916px; }

#beer-image-strip.count-18 { width: 6264px; }

#beer-image-strip.count-19 { width: 6612px; }

#beer-image-strip.count-20 { width: 6960px; }

#beer-image-strip.count-21 { width: 7308px; }

#beer-image-strip.count-22 { width: 7656px; }

#beer-image-strip.count-23 { width: 8004px; }

#beer-image-strip.count-24 { width: 8352px; }

#beer-image-strip.count-25 { width: 8700px; }

#beer-image-strip.count-26 { width: 9048px; }

#beer-image-strip.count-27 { width: 9396px; }

#beer-image-strip.count-28 { width: 9744px; }

#beer-image-strip.count-29 { width: 10092px; }

#beer-image-strip.count-30 { width: 10440px; }

#beer-image-strip.count-31 { width: 10788px; }

#beer-image-strip.count-32 { width: 11136px; }

#beer-image-strip.count-33 { width: 11484px; }

#beer-image-strip.count-34 { width: 11832px; }

#beer-image-strip.count-35 { width: 12180px; }

#beer-image-strip.count-36 { width: 12528px; }

#beer-image-strip.count-37 { width: 12876px; }

#beer-image-strip.count-38 { width: 13224px; }

#beer-image-strip.count-39 { width: 13572px; }

#beer-image-strip.count-40 { width: 13920px; }

#beer-image-strip.count-41 { width: 14268px; }

#beer-image-strip.count-42 { width: 14616px; }

#beer-image-strip.count-43 { width: 14964px; }

#beer-image-strip.count-44 { width: 15312px; }

#beer-image-strip.count-45 { width: 15660px; }

#beer-image-strip.count-46 { width: 16008px; }

#beer-image-strip.count-47 { width: 16356px; }

#beer-image-strip.count-48 { width: 16704px; }

#beer-image-strip.count-49 { width: 17052px; }

#beer-image-strip.count-50 { width: 17400px; }

@media screen and (max-width: 43.6875em) { #beer-image-strip.count-1 { width: 236px; } #beer-image-strip.count-2 { width: 472px; } #beer-image-strip.count-3 { width: 708px; } #beer-image-strip.count-4 { width: 944px; } #beer-image-strip.count-5 { width: 1180px; } #beer-image-strip.count-6 { width: 1416px; } #beer-image-strip.count-7 { width: 1652px; } #beer-image-strip.count-8 { width: 1888px; } #beer-image-strip.count-9 { width: 2124px; } #beer-image-strip.count-10 { width: 2360px; } #beer-image-strip.count-11 { width: 2596px; } #beer-image-strip.count-12 { width: 2832px; } #beer-image-strip.count-13 { width: 3068px; } #beer-image-strip.count-14 { width: 3304px; } #beer-image-strip.count-15 { width: 3540px; } #beer-image-strip.count-16 { width: 3776px; } #beer-image-strip.count-17 { width: 4012px; } #beer-image-strip.count-18 { width: 4248px; } #beer-image-strip.count-19 { width: 4484px; } #beer-image-strip.count-20 { width: 4720px; } #beer-image-strip.count-21 { width: 4956px; } #beer-image-strip.count-22 { width: 5192px; } #beer-image-strip.count-23 { width: 5428px; } #beer-image-strip.count-24 { width: 5664px; } #beer-image-strip.count-25 { width: 5900px; } #beer-image-strip.count-26 { width: 6136px; } #beer-image-strip.count-27 { width: 6372px; } #beer-image-strip.count-28 { width: 6608px; } #beer-image-strip.count-29 { width: 6844px; } #beer-image-strip.count-30 { width: 7080px; } #beer-image-strip.count-31 { width: 7316px; } #beer-image-strip.count-32 { width: 7552px; } #beer-image-strip.count-33 { width: 7788px; } #beer-image-strip.count-34 { width: 8024px; } #beer-image-strip.count-35 { width: 8260px; } #beer-image-strip.count-36 { width: 8496px; } #beer-image-strip.count-37 { width: 8732px; } #beer-image-strip.count-38 { width: 8968px; } #beer-image-strip.count-39 { width: 9204px; } #beer-image-strip.count-40 { width: 9440px; } #beer-image-strip.count-41 { width: 9676px; } #beer-image-strip.count-42 { width: 9912px; } #beer-image-strip.count-43 { width: 10148px; } #beer-image-strip.count-44 { width: 10384px; } #beer-image-strip.count-45 { width: 10620px; } #beer-image-strip.count-46 { width: 10856px; } #beer-image-strip.count-47 { width: 11092px; } #beer-image-strip.count-48 { width: 11328px; } #beer-image-strip.count-49 { width: 11564px; } #beer-image-strip.count-50 { width: 11800px; } }

/* !BANNER */
/* -------------------------------------------*/
#home-banner { padding: 0 44px; background: #006cb4; background: radial-gradient(circle, #00adee 50%, #006cb4); }

#home-banner .inner { position: relative; margin: 0 auto; max-width: 1112px; }

#home-banner .inner:before { content: ''; position: absolute; left: 5%; top: 7%; width: 90%; height: 100%; background: radial-gradient(rgba(255, 255, 255, 0.5) 40%, rgba(255, 255, 255, 0) 55%); }

#home-banner-top, #home-banner-bottom { position: relative; z-index: 1; }

#home-banner-top img, #home-banner-bottom img { width: 100%; }

#home-banner-descriptions { position: relative; z-index: 1; min-height: 118px; }

#home-banner-descriptions a { float: right; width: 19.559352518%; color: #fff; text-shadow: 5px 5px 0 rgba(34, 31, 31, 0.15); }

#home-banner-descriptions h3 { margin: 8px -2px 10px -2px; font-family: "HTNeon", cursive; font-size: 2.5rem; font-weight: 400; word-break: break-word; }

#home-banner-descriptions h4, #home-banner-descriptions h5 { font-weight: 300; line-height: 1; text-transform: uppercase; }

#home-banner-descriptions h4 { margin: 0 0 10px; font-size: 1rem; letter-spacing: 5px; }

#home-banner-descriptions h5 { margin: 0 0 10px; font-size: 0.75rem; letter-spacing: 2px; }

#home-banner-descriptions #home-banner-description-seasonal { float: left; text-align: right; text-shadow: -5px 5px 0 rgba(34, 31, 31, 0.15); }

#home-banner-descriptions #home-banner-description-seasonal h4 { margin-right: -5px; }

#home-banner-descriptions #home-banner-description-seasonal h5 { margin-right: -2px; }

#home-banner-beers { position: absolute; z-index: 1; left: 20.6834532374%; top: 22.4586288416%; width: 58.0035971223%; height: 66.1938534279%; text-align: center; }

#home-banner-core-beers { position: relative; z-index: 2; display: inline-block; height: 98%; }

#home-banner-core-beers img { height: 100%; width: auto; max-width: none; }

#home-banner-seasonal { position: absolute; z-index: 1; left: 2%; top: 20%; display: block; height: 71%; }

#home-banner-seasonal img { height: 100%; width: auto; max-width: none; }

#home-banner-heavy-machinery { position: absolute; z-index: 1; right: 0; top: 18.5%; display: block; width: 31%; height: 76.5%; }

#home-banner-heavy-machinery img { height: 100%; width: auto; }

@media screen and (max-width: 62.4375em) { #home-banner { padding: 0 8px; } #home-banner-descriptions h3 { font-size: 1.875rem; } #home-banner-descriptions h4 { font-size: 0.875rem; letter-spacing: 2px; } }

@media screen and (max-width: 43.6875em) { #home-banner-top { padding-bottom: 60%; } #home-banner-bottom { display: none; } #home-banner-descriptions { display: none; } #home-banner-beers { left: 10.3417266187%; width: 78.6870503597%; height: 72.1040189125%; } }

/* !PROMOS */
/* -------------------------------------------*/
.home-template main { overflow: hidden; }

.promo-row { position: relative; margin-bottom: 16px; }

.promo-row:first-child { margin-top: 16px; }

.promo-cell { position: relative; z-index: 1; display: block; color: #fff; }

.promo-guts { padding: 40px 50px 30px 0; }

.promo-category { padding: 0 0 12px 60px; margin-bottom: 20px; font-family: "HTNeon", cursive; font-size: 2.125rem; line-height: 1; background: url(/img/dots-white-horz.png) repeat-x 3px 100%; background-size: 7px 3px; }

.promo-pre, .promo-post { font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; margin: 0 0 20px 60px; letter-spacing: 2px; }

.promo-title { font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 3.25rem; text-transform: uppercase; font-size: 4.75rem; margin: 0 0 12px 60px; word-break: break-word; }

.promo-cell-half .promo-title { font-size: 3.75rem; }

.promo-cell-left .promo-guts, .promo-cell-right .promo-guts { background-repeat: no-repeat; background-position: 9999px 0; }

.promo-cell-left { float: left; padding-right: 8px; width: 50%; }

.promo-cell-right { float: right; padding-left: 8px; width: 50%; }

.promo-bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: 50% 50%; background-size: cover; }

.promo-color-Blue { background: radial-gradient(#00adee 60%, #0081d1) no-repeat 50% 50%; background-size: cover; }

.promo-color-Red { background: radial-gradient(#dc3420 60%, #930904) no-repeat 50% 50%; background-size: cover; }

.promo-color-Green { background: radial-gradient(#8dc53e 60%, #446d09) no-repeat 50% 50%; background-size: cover; }

.promo-color-Brown { background: radial-gradient(#754b29 60%, #4b2d17) no-repeat 50% 50%; background-size: cover; }

.promo-color-Gray { background: radial-gradient(#9b8579 60%, #3b2c24) no-repeat 50% 50%; background-size: cover; }

.promo-bg-left { left: -8px; width: 50%; }

.promo-bg-right { left: auto; right: -8px; width: 50%; }

@media screen and (max-width: 62.4375em) { .promo-title { font-size: 3.75rem; } .promo-cell-left, .promo-cell-right { float: none; padding: 0; width: 100%; } .promo-cell-left .promo-guts, .promo-cell-right .promo-guts { background-position: 50% 50%; background-size: cover; } .promo-cell-left { margin-bottom: 16px; } .promo-bg-left, .promo-bg-right { display: none; } }

@media screen and (max-width: 43.6875em) { .promo-guts { padding: 30px 30px 20px 0; } .promo-category { padding-left: 30px; font-size: 1.625rem; } .promo-pre, .promo-post { margin-left: 30px; } .promo-title { font-size: 3rem; margin-left: 30px; } .promo-cell-half .promo-title { font-size: 3rem; } }

/* !BEER SLIDERS */
/* -------------------------------------------*/
.beer-template section { position: relative; margin-top: 40px; width: 100%; height: 750px; background: url(/img/double-stripe-gray-horz.png) repeat-x 0 46px; background-size: 10px 19px; background: url(/img/double-stripe-gray-horz.png) repeat-x 0 46px, linear-gradient(#fff 67%, #ebecec); background-size: 10px 19px, auto; overflow: hidden; }

.beer-template section:first-child { margin-top: 20px; }

.beer-slider { position: relative; margin: 0 auto; overflow: visible; width: 1080px; height: 100%; }

.beer-slider .inner { position: relative; height: 100%; }

.beer-slider article { float: left; height: 100%; background: url(/img/dots-gray-vert.png) repeat-y 0 0; background-size: 3px 7px; }

.back-to-list { display: inline-block; position: absolute; top: -2px; right: 30px; z-index: 900; padding-left: 28px; cursor: pointer; font-size: 1rem; line-height: 1.125; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0625em; color: #F05A28; }

@media screen and (max-width: 43.6875em) { .back-to-list { display: none !important; } }

.back-to-list.hide { display: none; }

.back-to-list::before, .back-to-list::after { display: block; content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 20px; will-change: opacity; transition: opacity 150ms linear; }

.back-to-list::before { background: url(/img/icon-menu.svg) no-repeat 0 50%; }

.back-to-list::after { background: url(/img/icon-menu-back.svg) no-repeat 100% 50%; opacity: 0; }

.back-to-list:hover, .back-to-list:focus { color: #26AFD7; }

.back-to-list:hover::before, .back-to-list:focus::before { opacity: 0; }

.back-to-list:hover::after, .back-to-list:focus::after { opacity: 1; }

.beer-slider-nav .slider-nav-button { position: absolute; z-index: 100; top: 50%; width: 50px; background-size: 100% 100%; background-repeat: no-repeat; background-position: 0 0; cursor: pointer; -webkit-transform: translateY(-50%); transform: translateY(-50%); }

.beer-slider-nav .slider-nav-button::after { content: ''; display: block; height: 0; padding-bottom: 140%; }

.beer-slider-nav .hide { display: none; }

.beer-slider-nav .slider-nav-button.prev { left: 20px; background-image: url(/img/slider-arrow-left.png); }

.beer-slider-nav .slider-nav-button.next { right: 20px; background-image: url(/img/slider-arrow-right.png); }

@media screen and (max-width: 71.8125em) { .beer-slider-nav .slider-nav-button { width: 40px; } .beer-slider-nav .slider-nav-button.prev { left: 5px; } .beer-slider-nav .slider-nav-button.next { right: 5px; } }

@media screen and (max-width: 43.6875em) { .beer-slider-nav { display: none; } }

.beer-intro { padding: 20px 48px 0; }

.beer-intro header h2, .beer-intro header h3 { display: inline-block; vertical-align: bottom; }

.beer-intro header h2 { margin: 0 15px 15px 0; padding-bottom: 2px; }

.beer-intro header h3 { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 1.25rem; text-transform: uppercase; letter-spacing: 0.1em; margin: 0 0 15px; }

.beer-intro p, .beer-intro ul { font-size: 1.25rem; line-height: 1.5; color: #7B7D7F; }

.beer-menu { margin-top: 30px; -webkit-column-count: 2; -moz-column-count: 2; column-count: 2; -webkit-column-width: 150px; -moz-column-width: 150px; column-width: 150px; -webkit-column-gap: 24px; -moz-column-gap: 24px; column-gap: 24px; }

.beer-menu a { display: block; -webkit-column-break-inside: avoid; -moz-column-break-inside: avoid; break-inside: avoid; margin: 0; padding: 0 0 20px; line-height: 1.2; text-transform: uppercase; color: #6A6B66; background: url(/img/dots-gray-horz.png) repeat-x 0 0; background-size: 7px 3px; background-position: left 0 bottom 8px; }

.beer-menu a.beer-available { color: #F05A28; }

.beer-menu a:hover, .beer-menu a:focus { color: #9d3b19; }

.beer-menu a .name { font-size: 20px; font-weight: 800; letter-spacing: 0.04em; }

.beer-menu a .details { display: flex; justify-content: space-between; font-size: 13px; }

.beer-menu a .style { font-weight: 800; letter-spacing: 0.03em; }

.beer-menu a .season { letter-spacing: 0.1em; }

@media screen and (max-width: 43.6875em) { .beer-menu { display: none; } }

.beer-img img { width: 100%; }

.beer-img.with-shadow { position: relative; padding-bottom: 2.5%; }

.beer-img.with-shadow .can { position: relative; z-index: 1; }

.beer-img.with-shadow .shadow { position: absolute; left: 0; bottom: 0; }

.desktop-beer { float: left; margin-top: 25px; margin-left: 4.8148148148%; width: 32.037037037%; }

.mobile-beer { display: none; }

.beer-content { float: left; margin-left: 2.7777777778%; width: 57.4074074074%; }

.beer-content header { position: relative; padding-top: 10px; }

.beer-icon { float: left; margin: -10px 10px 0 0; padding: 0 5px 10px; width: 160px; height: 160px; line-height: 155px; text-align: center; }

.beer-icon img { position: relative; top: -3px; max-height: 100%; max-width: 100%; width: auto; height: auto; vertical-align: middle; }

.beer-date { position: absolute; top: 0; margin: 0; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; line-height: 1; color: #F05A28; }

.with-icon .beer-date { left: 170px; }

.beer-category { position: absolute; top: 25px; font-size: 1.0625rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 2px; color: #888a8c; }

.with-icon .beer-category { left: 170px; }

.beer h1 { margin: 62px 0 8px; font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 2.25rem; text-transform: uppercase; letter-spacing: 0.0625em; letter-spacing: 3px; }

.beer h2 { margin: 0 0 18px; font-size: 1rem; line-height: 1.125; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0625em; color: #F05A28; }

.beer-columns { padding-top: 25px; max-width: 520px; background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; background-size: 5px 8px; }

.beer-stats { float: left; padding: 0; margin: 0 0 0 6px; width: 78px; }

.beer-stats li { padding: 14px 0 8px; list-style: none; text-align: center; border-top: 1px solid #7B7D7F; }

.beer-stats li:first-child { padding-top: 0; border-top: none; }

.beer-stats li h3 { font-size: 0.75rem; line-height: 1.1666666667; font-weight: 800; text-transform: uppercase; letter-spacing: 0.125em; margin: 0; padding-bottom: 6px; color: #7B7D7F; }

.beer-stats li div { font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 1.3125rem; text-transform: uppercase; padding-bottom: 6px; color: #F05A28; }

.beer-stats li.big div { font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 2.25rem; text-transform: uppercase; padding-bottom: 0; }

.beer-details { float: left; margin-left: 30px; width: 71.1538461538%; }

@media screen and (min-width: 43.75em) { .beer-details .collapsed-content { display: block !important; } .beer-details .show-collapsed { display: none; } }

.beer-detail-text { font-size: 1rem; line-height: 1.25; font-weight: 300; }

@media screen and (max-width: 67.4375em) { .beer-slider { width: 96%; } }

@media screen and (max-width: 49.9375em) { .beer-img { width: 28.3333333333%; } .beer-content { width: 61.1111111111%; } }

@media screen and (max-width: 43.6875em) { .beer-template section { height: auto; background: none; } .beer-slider { width: 100%; height: auto; } .beer-slider .inner { left: 0 !important; width: 100% !important; height: auto; } .beer-slider article { float: none; height: auto; background: none; width: 100% !important; } .desktop-beer { display: none; } .mobile-beer { display: block; margin: 0 auto 25px; padding-top: 15px; width: 180px; max-width: 100%; } .beer-content { float: none; margin-left: 0 !important; width: auto; padding: 0 18px 40px; } .beer-icon { margin-top: 0; width: 80px; height: 80px; line-height: 80px; } .beer-details .collapsed-content { display: none; } .beer-details .show-collapsed { display: block; margin-top: 20px; padding-top: 8px; border-top: 1px solid #7B7D7F; font-size: 1rem; line-height: 1.125; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0625em; text-align: center; cursor: pointer; } .beer-details .show-collapsed span { display: inline-block; vertical-align: middle; margin: 0 5px; } .beer-details .show-collapsed .info::before { content: 'More'; } .beer-details .show-collapsed .arrow { width: 0; height: 0; border-style: solid; border-width: 7px 5px 0 5px; border-color: #F05A28 transparent transparent; will-change: transform; transition: -webkit-transform 300ms ease; transition: transform 300ms ease; transition: transform 300ms ease, -webkit-transform 300ms ease; } .expanded .beer-details .show-collapsed .info::before { content: 'Less'; } .expanded .beer-details .show-collapsed .arrow { -webkit-transform: scaleY(-1); transform: scaleY(-1); } .with-icon .beer-date { left: 90px; } .beer-category { top: 20px; } .with-icon .beer-category { left: 90px; } .beer h1 { margin: 30px 0 8px; font-size: 1.875rem !important; line-height: 1.1; letter-spacing: 1px !important; } .with-icon .beer h1 { margin-left: 90px; } .beer h2 { margin: 0 0 20px; } .with-icon .beer h2 { margin-left: 90px; } .beer-stats { margin: 0 0 0 -6px; width: 74px; } .beer-details { float: none; margin-left: 84px; width: auto !important; } }

@media screen and (max-width: 29.9375em) { .beer-icon { display: none; } .beer-date { position: static; margin: 0 0 6px; } .beer-category { position: static; margin: 0 0 6px; } .beer h1 { margin: 0 0 6px; } .beer h2 { margin: 0 0 6px; } .beer-content header { padding-bottom: 12px; } }

/* !CORE FOUR */
/* -------------------------------------------*/
#core-beers-family { margin: 60px -8px 0; display: flex; }

#core-beers-family a { position: relative; padding: 0 8px 16px; width: 16.6666666%; }

#core-beers-family a img { width: 100%; }

#core-beers-family a .can { position: relative; z-index: 1; top: 0; transition: top 0.25s ease-in; }

#core-beers-family a .shadow { position: absolute; left: 0; bottom: 0; opacity: 1; transition: opacity 0.25s linear; }

#core-beers-family a:hover .can { top: -15px; transition: top 0.35s ease-out; }

#core-beers-family a:hover .shadow { opacity: 0.6; transition: opacity 0.35s linear; }

.core-beers-beer .bitter-marks { background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; background-size: 5px 8px; position: relative; height: 8px; }

.core-beers-beer .bitter-marks div { position: absolute; height: 100%; background: #fff url(/img/dashes-red-horz.png) repeat-x 0 0; background-size: 5px 8px; }

.core-beers-beer .bitter-slider { position: relative; overflow: visible; margin: 6px 0; height: 4px; border-radius: 2px; background: linear-gradient(90deg, #ebecec, #7B7D7F); }

.core-beers-beer .bitter-slider div { position: absolute; margin: -4px 0 0 -8px; width: 15px; height: 12px; background: url(/img/bitterness-marker.svg) no-repeat 0 0; }

.core-beers-beer .bitter-detail, .core-beers-beer .beer-color { margin: 0 0 7px; padding: 0 0 8px; min-height: 30px; border-bottom: 1px solid #7B7D7F; }

.core-beers-beer .bitter-detail dt, .core-beers-beer .beer-color dt { font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; float: left; margin: 0 12px 0 0; padding: 0 10px; line-height: 22px; color: #fff; border-radius: 3px; }

.core-beers-beer .bitter-detail dd, .core-beers-beer .beer-color dd { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; padding-top: 1px; }

.core-beers-beer .bitter-detail dt { padding-left: 33px; background: url(/img/bitterness-arrow.svg) #b0b1b2 no-repeat 7px 100%; }

.core-beers-beer .beer-ingredients { position: relative; margin: 20px 0 12px; min-height: 108px; background: #dedfdf url(/img/tab-shadow-bottom.png) repeat-x 0 100%; border-radius: 3px; }

@media screen and (max-width: 43.6875em) { .core-beers-beer .beer-ingredients::after { clear: none; } }

.core-beers-beer .beer-ingredients dl { margin: 0; padding: 10px 0 4px; }

.core-beers-beer .beer-ingredients dl:before { content: ''; position: absolute; left: 13px; top: 0; width: 2px; height: 100%; background: #fff; }

.core-beers-beer .beer-ingredients dl:after { content: ''; position: absolute; right: 0; top: 0; width: 31px; height: 100%; border-left: 2px solid #fff; background: url(/img/beer-geek.svg) no-repeat 50% 50%; }

.core-beers-beer .beer-ingredients dt { position: relative; z-index: 1; float: left; width: 58px; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; margin-right: 8px; padding: 2px 0; color: #9c9e9f; background: #fff; border-radius: 0 3px 3px 0; }

.core-beers-beer .beer-ingredients dd { position: relative; z-index: 1; font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; padding: 2px 36px 2px 0; margin-bottom: 6px; line-height: 21px; }

.core-beers-beer .beer-tshirt { margin-top: 12px; padding-top: 16px; border-top: 1px solid #7B7D7F; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; }

.core-beers-beer .beer-tshirt a:hover, .core-beers-beer .beer-tshirt a:focus { color: #26AFD7; }

@media screen and (max-width: 43.6875em) { #core-beers-intro { padding: 0 18px; } #core-beers-family { display: none; } }

@media screen and (max-width: 29.9375em) { .core-beers-beer .bitter-detail dt, .core-beers-beer .beer-color dt { float: none; display: inline-block; } .core-beers-beer .bitter-detail dd, .core-beers-beer .beer-color dd { margin: 6px 0 0; } .core-beers-beer .beer-ingredients dl:before { display: none; } .core-beers-beer .beer-ingredients dt { float: none; display: inline-block; } .core-beers-beer .beer-ingredients dd { float: none; margin: 4px 4px 10px 10px; font-size: 0.875rem; line-height: 1.333; } }

/* !SEASONALS */
/* -------------------------------------------*/
.seasonals-beer h1 { font-family: "cubano", sans-serif; line-height: 1; font-weight: 400; text-transform: uppercase; font-size: 2.5rem; letter-spacing: 4px; color: #F05A28; }

.seasonals-beer .beer-ingredients { margin: 20px 0 12px; }

@media screen and (max-width: 43.6875em) { .seasonals-beer .beer-ingredients::after { clear: none; } }

.seasonals-beer .beer-ingredients dl { margin: 0; padding: 0; }

.seasonals-beer .beer-ingredients dt { float: left; width: 66px; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; padding: 2px 0 2px 4px; color: #F05A28; }

.seasonals-beer .beer-ingredients dd { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; padding: 2px 0; margin-bottom: 6px; line-height: 21px; }

.seasonals-beer .beer-tshirt { position: relative; font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; padding: 6px 76px 6px 0; background: #dedfdf; border-radius: 0 3px 3px 0; }

.seasonals-beer .beer-tshirt a { position: relative; display: block; padding-left: 12px; background: #fff; border-radius: 0 3px 3px 0; }

.seasonals-beer .beer-tshirt a:hover, .seasonals-beer .beer-tshirt a:focus { color: #26AFD7; }

.seasonals-beer .beer-tshirt a span { position: relative; z-index: 1; }

.seasonals-beer .beer-tshirt a:before { content: ''; position: absolute; left: 18px; top: -6px; bottom: -6px; width: 2px; background: #fff; }

.seasonals-beer .beer-tshirt a:after { content: ''; position: absolute; right: -18px; top: -6px; bottom: -6px; width: 2px; background: #fff; }

@media screen and (max-width: 43.6875em) { #seasonals { border-top: 20px solid #a3a4a5; padding-top: 40px; } #seasonals-intro { padding: 0 18px; } }

/* !OTHER BEERS */
/* -------------------------------------------*/
#other-beers { height: auto; }

#other-beers header { position: relative; margin: 0 auto 60px; padding: 20px 48px 0; max-width: 1080px; }

#other-beers .tap-wrapper { padding: 0 30px; }

#other-beers .tap-list { position: relative; margin: 0 auto 100px; max-width: 1150px; }

#other-beers .tap-row, #other-beers .tap-info { margin-left: 35px; }

#other-beers .tap-about { left: 35px; padding-right: 48px; }

#other-beers .tap-about-tab { bottom: 1px; }

#other-beers .tap-info-details { margin: 0; padding: 13px 20px 6px 20px; list-style: none; font: 700 15px/1.2 "Twentieth Century W01", sans-serif; text-transform: uppercase; letter-spacing: 0.01em; }

#other-beers .tap-info-details li { height: auto; }

#other-beers .tap-info-details .detail { display: inline-block; vertical-align: top; margin: 0 0.5em 0.5em 0; }

#other-beers .tap-info-details .detail:last-child { margin-right: 0; }

#other-beers .tap-info-details .label { color: #fdb813; }

#other-beers .tap-info-details a { padding: 0 10px; color: #fff; }

#other-beers .tap-info-details a:hover, #other-beers .tap-info-details a:focus { color: #fdb813; }

@media screen and (max-width: 43.6875em) { #other-beers { border-top: 20px solid #a3a4a5; padding-top: 40px; } #other-beers header { margin-bottom: 40px; padding: 0 18px; } #other-beers .tap-wrapper { padding: 0; } #other-beers .tap-list { margin-bottom: 40px; } #other-beers .tap-about { left: 0; } #other-beers .tap-row, #other-beers .tap-info { margin-left: 0; } #other-beers .tap-info-details { padding: 0 18px 13px; } }

.beer-modal { position: absolute; z-index: 5001; visibility: hidden; top: 60px; left: 0; padding: 30px 12px; width: 100%; color: #fff; }

.beer-modal .box { position: relative; margin: 0 auto; padding: 40px 80px; max-width: 864px; background: #F05A28; box-shadow: 10px 10px 0 rgba(123, 125, 127, 0.5); }

@media screen and (max-width: 62.4375em) { .beer-modal .box { padding: 40px; box-shadow: none; } }

@media screen and (max-width: 43.6875em) { .beer-modal .box { padding: 40px 15px 30px; } }

.beer-modal .video { position: relative; }

.beer-modal .video::after { content: ''; display: block; height: 0; padding-bottom: 56.25%; }

.beer-modal .video iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

.beer-modal .caption { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; }

.beer-modal .caption p, .beer-modal .caption ul, .beer-modal .caption ol { margin: 1.5em 0 0; }

.beer-modal .caption a { color: inherit; font-weight: 800; letter-spacing: 0.01em; }

.beer-modal .caption a:hover, .beer-modal .caption a:focus { color: #fdb813; }

.beer-template .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: rgba(255, 255, 255, 0.7); z-index: 5000; display: none; top: 0; left: 0; }

@media screen and (max-width: 62.4375em) { .beer-template .reveal-modal-bg { background: rgba(123, 125, 127, 0.9); } }

.beer-template .close-reveal-modal { position: absolute; top: 20px; right: 20px; width: 20px; cursor: pointer; }

.beer-template .close-reveal-modal img { width: 100%; }

@media screen and (max-width: 62.4375em) { .beer-template .close-reveal-modal { top: 15px; right: 15px; width: 15px; } }

@media screen and (max-width: 43.6875em) { .beer-template .close-reveal-modal { top: 15px; right: 15px; width: 15px; } }

/* !INTRO */
/* -------------------------------------------*/
#taproom-intro { margin-bottom: 100px; }

@media screen and (max-width: 64em) { #taproom-intro { margin-bottom: 50px; } }

@media screen and (max-width: 43.6875em) { #taproom-intro { margin-bottom: 30px; } }

#taproom-intro > .inner { margin: 0 auto; padding: 75px 30px; max-width: 985px; background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; background-position: 0 100%; }

@media screen and (max-width: 64em) { #taproom-intro > .inner { padding: 45px 30px 60px; } }

@media screen and (max-width: 43.6875em) { #taproom-intro > .inner { padding: 30px 18px 40px; } }

#taproom-intro .hours { margin-bottom: 20px; text-align: center; color: #F05A28; }

#taproom-intro .hours h2 { margin: 0 0 1em; font: 800 20px/1.2 "Twentieth Century W01", sans-serif; text-transform: uppercase; letter-spacing: 0.18em; }

#taproom-intro .hours ul { margin: 0; padding: 0; list-style: none; font: 400 20px/1.2 "Twentieth Century W01", sans-serif; text-transform: uppercase; letter-spacing: 0.08em; }

#taproom-intro .hours ul li { position: relative; display: inline-block; margin: 0 0 1em; padding: 0 42px; }

@media screen and (max-width: 64em) { #taproom-intro .hours ul li { padding: 0 20px; } }

#taproom-intro .hours ul li:not(:last-child)::after { content: ''; display: block; position: absolute; right: 0; top: 50%; width: 5px; height: 5px; -webkit-transform: translate(2px, -1px); transform: translate(2px, -1px); border-radius: 50%; background: #F05A28; }

@media screen and (max-width: 62.4375em) { #taproom-intro .hours ul { font-size: 18px; } #taproom-intro .hours ul li { display: block; padding: 0; margin-bottom: 0.5em; } #taproom-intro .hours ul li:not(:last-child)::after { display: none; } }

#taproom-intro .intro { font: 400 20px/1.8 "Twentieth Century W01", sans-serif; }

#taproom-intro .intro p, #taproom-intro .intro ul, #taproom-intro .intro ol { margin: 0 0 1em; }

#taproom-intro .intro p:last-child, #taproom-intro .intro ul:last-child, #taproom-intro .intro ol:last-child { margin-bottom: 0; }

#taproom-intro .intro a:hover, #taproom-intro .intro a:focus { color: #9d3b19; }

/* !TAPS */
/* -------------------------------------------*/
#taps { position: relative; }

#taps article { margin: 0 auto 27px; padding: 0 20px; max-width: 1104px; }

#taps article > h1 { font-size: 1.875rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.0666666667em; text-shadow: 5px 6px 0px rgba(0, 0, 0, 0.07); color: #fdb813; }

#taps #taps-exclusives > h1 { color: #F05A28; }

.tap-list-heading { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin-bottom: 20px; }

.tap-list-cat-heading { font-size: 1.875rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.0666666667em; text-shadow: 5px 6px 0px rgba(0, 0, 0, 0.07); margin: 0; color: #F05A28; }

.tap-list-cat-subhead { font-size: 1.875rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.0666666667em; text-shadow: 5px 6px 0px rgba(0, 0, 0, 0.07); margin: 0; font-weight: 700; font-size: 26px; letter-spacing: 0.02em; color: #7B7D7F; text-shadow: 4px 5px 0px rgba(0, 0, 0, 0.07); }

.tap-list { position: relative; margin: 0 45px 0 80px; }

#tap-list-exclusives { margin-left: 45px; }

.tap-about { position: absolute; left: 0; top: 0; z-index: 1; padding: 13px; width: 75%; height: 100%; overflow: hidden; background: #F05A28 url(/img/tab-shadow-right.png) repeat-y 100% 0; background: url(/img/tab-shadow-top.png) repeat-x 0 0, #F05A28 url(/img/tab-shadow-right.png) repeat-y 100% 0; color: #fff; }

.tap-about.tap-about-bg { right: 0; width: auto; box-shadow: 12px 6px 12px rgba(0, 0, 0, 0.2); }

#tap-list-exclusives .tap-about { left: 35px; padding-right: 48px; }

.tap-about h2, .tap-about ul, .tap-about p { margin-bottom: 0; font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; }

.tap-about h2 { font-weight: 700; }

.tap-about-tab { position: absolute; top: 0; right: 100%; padding: 10px 0; width: 35px; min-height: 84px; font-size: 0.625rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.1em; text-align: center; color: #fff; border-radius: 6px 0 0 6px; background: #F05A28 url(/img/tab-shadow-right.png) repeat-y 100% 0; background: url(/img/tab-shadow-bottom.png) repeat-x 0 100%, #F05A28 url(/img/tab-shadow-right.png) repeat-y 100% 0; }

.tap-list.multi .tap-about-tab { min-height: 126px; }

#tap-list-exclusives .tap-about-tab { bottom: 1px; min-height: 83px; }

#tap-list-exclusives.open .tap-about-tab { background: url(/img/tab-shadow-bottom.png) repeat-x 0 100%, url(/img/tab-shadow-left.png) repeat-y 0 0, #F05A28 url(/img/tab-shadow-right.png) repeat-y 100% 0; }

.tap-about-tab b { display: block; font-weight: inherit; }

.tap-about-tab .space { height: 7px; }

.tap-about-tab .vert { position: absolute; left: 50%; top: 50%; width: 75px; -webkit-transform: translate(-50%, -50%) rotate(-90deg); transform: translate(-50%, -50%) rotate(-90deg); }

.tap-rows { overflow: hidden; }

.tap-row { position: relative; z-index: 3; padding: 13px 110px 13px 25px; min-height: 84px; display: flex; flex-direction: column; justify-content: center; background: #e5e5e5 url(/img/tab-shadow-top.png) repeat-x 0 0; }

.tap-row::after { clear: both; content: ""; display: block; }

#tap-list-exclusives .tap-row { margin-left: 35px; }

.tap-row h2, .tap-row h3 { margin: 0; font-size: 1.375rem; line-height: 1.8125rem; font-weight: 700; text-transform: uppercase; color: #959799; }

.tap-row h3 { font-size: 1.6875rem; color: #F05A28; }

.tap-row h2 small { position: relative; top: -2px; font-size: 1rem; text-transform: none; font-style: italic; }

.tap-row .abv { position: absolute; top: 0; right: 0; padding: 24px 0 0 3px; width: 84px; height: 100%; text-align: center; background: url(/img/tab-shadow-left.png) repeat-y 0 0; }

.tap-row .abv div { margin: 0 0 2px; font: 400 32px/0.8 "vinyl", sans-serif; text-transform: uppercase; letter-spacing: -0.01em; color: #F05A28; }

.tap-row .abv h4 { margin: 0; font-size: 0.75rem; line-height: 1.1666666667; font-weight: 800; text-transform: uppercase; letter-spacing: 0.125em; color: #7B7D7F; }

.tap-row .tap-info-tab { display: block; position: absolute; bottom: 0; right: 135px; padding: 6px 7px 3px; font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.6875rem; text-transform: uppercase; color: #fff; background: #F05A28 url(/img/tab-shadow-top.png) repeat-x 0 0; background: url(/img/tab-shadow-top.png) repeat-x 0 0, url(/img/tab-shadow-left.png) repeat-y 0 0, #F05A28 url(/img/tab-shadow-right.png) repeat-y 100% 0; }

.tap-row-dim { background-color: #b0b1b2; }

.tap-row-dim h2 { color: #626466; }

.tap-row-dim h3 { color: #fff; }

.tap-row-dim .abv div { color: #fff; }

.tap-row-dim .tap-info-tab { background: #626466 url(/img/tab-shadow-top.png) repeat-x 0 0; background: url(/img/tab-shadow-top.png) repeat-x 0 0, url(/img/tab-shadow-left.png) repeat-y 0 0, #626466 url(/img/tab-shadow-right.png) repeat-y 100% 0; }

.tap-info { display: none; position: relative; z-index: 3; background: #F05A28 url(/img/tab-shadow-top.png) repeat-x 0 0; }

#tap-list-exclusives .tap-info { margin-left: 35px; }

.tap-info .inner { display: table; table-layout: fixed; width: 100%; }

.tap-info:after { content: ''; display: block; position: absolute; left: 50%; top: 13px; bottom: 13px; margin-left: -1px; width: 3px; background: url(/img/dots-white-vert.png) repeat-y 0 0; background-size: 3px auto; }

.tap-info-dim { background-color: #626466; }

.tap-info-text, .tap-info-stats, .tap-info-details { display: table-cell; table-layout: fixed; padding: 13px 0; width: 50%; vertical-align: middle; color: #fff; }

.tap-info-text h2, .tap-info-text ul, .tap-info-text p { margin: 0 13px; font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; }

.tap-info-text h2 { font-weight: 700; }

.tap-info-text a { color: inherit; font-weight: 800; letter-spacing: 0.01em; }

.tap-info-text a:hover, .tap-info-text a:focus { color: #fdb813; }

.tap-info-stats::after { clear: both; content: ""; display: block; }

.tap-info-stats li { float: left; padding-left: 20px; list-style: none; }

.tap-info-stats li:first-child { padding-left: 15px; }

.tap-info-stats li div, .tap-info-stats li h4 { display: inline-block; margin: 0; vertical-align: middle; }

.tap-info-stats li div { margin-right: 6px; font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 3.25rem; text-transform: uppercase; font-size: 2.7rem; }

.tap-info-stats li h4 { font-size: 0.75rem; line-height: 1.1666666667; font-weight: 800; text-transform: uppercase; letter-spacing: 0.125em; }

@media screen and (max-width: 62.4375em) { .tap-list { margin: 0 10px 0 45px; } #tap-list-exclusives { margin-left: 10px; } }

@media screen and (max-width: 49.9375em) { .tap-row .tap-info-tab { right: 100px; } }

@media screen and (max-width: 43.6875em) { #taps { margin-top: 27px; padding-bottom: 1px; } #taps article { padding: 0; } #taps article > h1 { margin-left: 18px; margin-right: 18px; } .tap-list-heading { margin-left: 18px; margin-right: 12px; } .tap-list { margin: 0; } #tap-list-exclusives { margin-left: 0; } .tap-about.tap-about-bg { box-shadow: 0 6px 12px rgba(0, 0, 0, 0.2); } #tap-list-exclusives .tap-about { left: 0; } .tap-about-tab { display: none; } .tap-row { padding-right: 100px; padding-left: 18px; } #tap-list-exclusives .tap-row { margin-left: 0; } .tap-row h2 { font-size: 1.25rem; line-height: 1.6875rem; } .tap-row h3 { font-size: 1.4375rem; line-height: 1.6875rem; } .tap-row h2 small { font-size: 0.875rem; } .tap-row .abv { padding-top: 18px; } .tap-row .abv div { font-size: 28px; } .tap-row .tap-info-tab { right: 0; width: 84px; } #tap-list-exclusives .tap-info { margin-left: 0; } .tap-info .inner { display: block; } .tap-info:after { display: none; } .tap-info-text, .tap-info-stats, .tap-info-details { display: block; padding: 18px; width: 100%; } .tap-info-text h2, .tap-info-text ul, .tap-info-text p { margin: 0; } .tap-info-stats { margin: 0; padding: 0 0 18px; } .tap-info-stats li { padding-left: 18px; } .tap-info-stats li:first-child { padding-left: 18px; } }

/* !CENTERED SMALL CONTENT */
/* -------------------------------------------*/
.tap-centered-small { margin: 0 auto; padding: 0 24px; max-width: 648px; text-align: center; }

.tap-centered-small h1 { font-size: 1.875rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.0666666667em; text-shadow: 5px 6px 0px rgba(0, 0, 0, 0.07); margin: 0 0 20px; }

.tap-centered-small h2 { font-size: 1.875rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.0666666667em; font-size: 1.1875rem; }

.tap-centered-small p, .tap-centered-small ul { font-size: 1rem; line-height: 1.375; margin-bottom: 0.75em; text-align: left; }

/* !FOOD */
/* -------------------------------------------*/
#food { position: relative; z-index: 1; overflow: visible; margin: 10% 0 0; /*background: url(/img/chevron-top.png) no-repeat 0 0, url(/img/chevron-bottom.png) no-repeat 0 100%, radial-gradient(circle, #f881af 50%, #f56395 90%);*/ background: linear-gradient(to right, #f56395 10%, #f881af 50%, #f56395 90%); background-size: 100% auto, 100% auto, auto; color: #fff; }

#food .tap-centered-small { position: relative; z-index: 1; padding-top: 31%; padding-bottom: 2%; }

#food h2 { color: #5A4A42; }

#food .food-text a { color: inherit; font-weight: 800; letter-spacing: 0.015em; }

#food .food-text a:hover, #food .food-text a:focus { color: #5A4A42; }

#food .food-link { margin-top: 30px; }

#food .chevron { position: absolute; top: calc(100% - 1px); width: 100%; }

#food-truck-wrapper { position: absolute; top: 0; width: 100%; }

#food-truck-wrapper.stage-left { left: -100%; }

#food-truck { position: relative; margin: -4.4166666667% auto 0; width: 80.8333333333%; padding-bottom: 39%; height: 0; }

#food-truck img { position: absolute; max-width: none; }

#food-truck-body { left: 1.9587628866%; top: 0; width: 95.2577319588%; }

#food-truck-left-tire { left: 25.5670103093%; top: 57.905982906%; width: 13.8144329897%; }

#food-truck-right-tire { left: 76.4948453608%; top: 57.905982906%; width: 13.8144329897%; }

#food-truck-shadow { left: 0; bottom: 0; width: 100%; }

@media screen and (max-width: 43.6875em) { #food { padding-bottom: 25px; } #food .tap-centered-small { padding-top: 36%; } }

/* !MERCH */
/* -------------------------------------------*/
#merch { position: relative; padding-top: 23.3333333333%; padding-bottom: 19.1666666667%; }

#merch .content { position: relative; z-index: 2; padding: 0 20px; text-align: center; }

#merch .content h2 { font: 400 15vw/1 "vinyl", sans-serif; text-transform: uppercase; color: #fff; white-space: nowrap; -webkit-filter: drop-shadow(0.05em 0.05em 0 rgba(0, 0, 0, 0.3)); filter: drop-shadow(0.05em 0.05em 0 rgba(0, 0, 0, 0.3)); margin: 0; }

#merch .content .merch-link { margin-top: 20px; }

#merch .merch-image { position: absolute; left: 0; top: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; font-family: "object-fit: cover"; }

#merch .chevron { position: absolute; z-index: 10000; left: 0; bottom: 0; width: 100%; -webkit-transform: translateY(50%); transform: translateY(50%); }

/* !GALLERY */
/* -------------------------------------------*/
#gallery { position: relative; }

#gallery .flex-prev, #gallery .flex-next { position: absolute; z-index: 9999; top: 50%; width: 4.5%; margin-top: -3.15%; padding-bottom: 6.3%; background-size: 100% 100%; background-repeat: no-repeat; background-position: 0 0; cursor: pointer; }

#gallery .flex-prev { left: 2.5%; background-image: url(/img/slider-arrow-left.png); }

#gallery .flex-next { right: 2.5%; background-image: url(/img/slider-arrow-right.png); }

#gallery .flex-control-nav { position: absolute; z-index: 9999; left: 0; bottom: 20px; width: 100%; text-align: center; line-height: 15px; }

#gallery .flex-control-nav li { display: inline-block; margin: 0 5px; }

#gallery .flex-control-nav a { width: 15px; height: 15px; background: #fff; border-radius: 15px; opacity: 0.5; transition: opacity 0.35s linear; cursor: pointer; }

#gallery .flex-control-nav a.flex-active { opacity: 1; }

/* !SECTIONS */
/* -------------------------------------------*/
.community-feed-header { margin: 0 auto; padding: 0 24px; max-width: 1124px; }

.community-feed-header::after { clear: both; content: ""; display: block; }

.community-feed-header i { float: left; margin: 2px 10px 0 0; width: 25px; height: 25px; font-size: 17px; line-height: 25px; text-align: center; background: #F05A28; color: #fff; }

.community-feed-header h2 { float: left; font-size: 1.875rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.0666666667em; text-shadow: 5px 6px 0px rgba(0, 0, 0, 0.07); color: #bdbebf; }

.community-feed-header h2 a { color: #bdbebf; }

.community-feed-header h2 a:hover, .community-feed-header h2 a:focus { color: #F05A28; }

/* !TWITTER */
/* -------------------------------------------*/
#twitter { margin-bottom: 20px; }

.tweet { color: #828485; word-break: break-word; }

.tweet-main { font-family: "proxima-nova-extra-condensed", sans-serif; font-weight: 600; font-size: 2.75rem; line-height: 1.1; letter-spacing: 1px; text-transform: uppercase; margin-bottom: 24px; }

.tweet.grid-item { font-size: 1.3125rem; line-height: 1.2; font-weight: 700; }

@media screen and (max-width: 29.9375em) { .tweet-main { font-size: 2rem; } .tweet.grid-item { font-size: 1.1875rem; } }

/* !INSTAGRAM */
/* -------------------------------------------*/
#instagram { margin-bottom: -8px; }

#instagram .image { background-position: center center; background-repeat: no-repeat; background-size: cover; }

#instagram .image::after { content: ''; display: block; height: 0; padding-bottom: 100%; }

/* !COLUMNS */
/* -------------------------------------------*/
#brewery-columns h2 { margin-bottom: 16px; font: 400 29px/1 "vinyl", sans-serif; text-transform: uppercase; letter-spacing: 0.08em; }

#brewery-columns h2 a:hover, #brewery-columns h2 a:focus { color: #26AFD7; }

#brewery-columns p, #brewery-columns ul { font-size: 1rem; line-height: 1.375; margin-right: 12px; }

#brewery-columns p a:hover, #brewery-columns p a:focus, #brewery-columns ul a:hover, #brewery-columns ul a:focus { color: #26AFD7; }

.brewery-column-img, #map { display: block; margin-bottom: 18px; }

.brewery-column-img img, #map img { width: 100%; }

#map { position: relative; height: 0; padding-bottom: 53%; background: #f2f2f2; }

#map iframe { position: absolute; left: 0; top: 0; width: 100%; height: 100%; }

/* !BREWING 101 */
/* -------------------------------------------*/
#brewing-sep { margin-top: 0; }

#brewing-header { margin: 0 auto; padding: 0 24px; max-width: 1020px; }

#brewing-header h2 { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 1.25rem; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 18px; color: #F05A28; }

#chart { position: relative; overflow: hidden; margin-bottom: 20px; padding-bottom: 18px; }

#chart:before, #chart:after { content: ''; position: absolute; z-index: 10; top: 0; display: block; width: 3px; height: 100%; background: url(/img/dots-gray-vert.png) repeat-y 0 0; background-size: 3px 7px; }

#chart:before { right: 50%; margin-right: 610px; }

#chart:after { left: 50%; margin-left: 610px; }

#chart-header-wrapper { background: #a3a4a5; }

#chart-header { margin: 0 auto; max-width: 1200px; background: url(/img/brewery-header.png) no-repeat 0 0; background-size: 100% 100%; }

#chart-header img { display: none; }

#chart-header .inner { position: relative; height: 0; padding-bottom: 9.9%; }

#chart-header p { position: absolute; left: 46.4%; top: 22.2222222222%; width: 17%; font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; line-height: 1.1; }

#chart-header ol { position: absolute; margin: 0 0 0 18px; padding: 0 0 0 20px; left: 63.4%; top: 22.2222222222%; width: 18%; border-left: 1px solid #a3a4a5; font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.0666666667em; line-height: 1.1; }

#chart-header li { list-style: none; }

#chart-header span { display: inline-block; width: 20px; }

#chart-header a { cursor: pointer; }

#chart-header #link-hot-side { color: #F05A28; }

#chart-header #link-hot-side:hover, #chart-header #link-hot-side:focus { color: #c04820; }

#chart-header #link-cold-side { color: #26AFD7; }

#chart-header #link-cold-side:hover, #chart-header #link-cold-side:focus { color: #1e8cac; }

#chart-header #link-packaging { color: #fdb813; }

#chart-header #link-packaging:hover, #chart-header #link-packaging:focus { color: #ca930f; }

#chart-content { margin: 0 auto; max-width: 1200px; background: #ebecec; }

#chart-slider { position: relative; width: 100%; height: 0; padding-bottom: 39.4%; }

#chart-slider img { position: absolute; left: 0; top: 0; max-width: none; }

#chart-bg { width: 300%; }

#chart-mg { width: 450%; -webkit-transform: translateX(-2.266666%); transform: translateX(-2.266666%); }

#chart-fg { width: 675%; }

#chart-bottom { position: relative; margin-top: 10px; padding: 20px 0; overflow: hidden; background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; background-position: 3px 0; }

#chart-descriptions { position: relative; width: 675%; font-size: 1rem; line-height: 1.25; font-weight: 300; text-align: center; background: #fff; }

#chart-descriptions strong { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.0666666667em; }

.chart-description { float: left; margin-left: 18.5185185185%; width: 14.8148148148%; padding: 12px 50px; }

.chart-description:first-child { margin-left: 0; }

#chart-prev, #chart-next { position: absolute; display: block; top: 50%; margin-top: -13px; width: 30px; height: 26px; border-radius: 4px; cursor: pointer; background: #F05A28 no-repeat 50% 50%; background-size: auto 12px; transition: background-color 0.3s linear; }

#chart-prev:hover, #chart-prev:focus, #chart-next:hover, #chart-next:focus { background-color: #9d3b19; }

#chart-prev { left: 10px; background-image: url("../img/arrow-white-left.svg"); }

#chart-next { right: 10px; background-image: url("../img/arrow-white-right.svg"); }

#chart-footer { height: 24px; background-color: #a3a4a5; }

@media screen and (max-width: 64em) { #chart-header p { top: 20.202020202%; font-size: 0.875rem; } #chart-header ol { top: 20.202020202%; font-size: 0.8125rem; line-height: 1.2; } }

@media screen and (max-width: 62.4375em) { #chart-header p { display: none; } #chart-header ol { left: 45.5%; top: 33.3333333333%; width: 36.5%; margin: 0; padding: 0; border: none; font-size: 0.75rem; letter-spacing: normal; } #chart-header li { display: inline-block; margin-left: 8px; } #chart-header span { width: auto; padding-right: 4px; } #chart-descriptions { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; } #chart-descriptions strong { font-size: 0.8125rem; } }

@media screen and (max-width: 49.9375em) { #chart-header { text-align: center; background: none; } #chart-header img { display: inline; } #chart-header .inner { display: none; } #chart-fg { display: none; } }

/* !BEERWORKER GRID */
/* -------------------------------------------*/
.bw-photo { margin-bottom: 20px; }

.bw-photo img { width: 100%; }

.beerworker h3 { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 1.25rem; text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 10px; color: #F05A28; }

.beerworker h4 { font-size: 1rem; line-height: 1.125; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0625em; margin-bottom: 10px; }

.more-bio { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.0666666667em; margin-bottom: 10px; }

.more-bio a { color: #26AFD7; }

.more-bio a:hover, .more-bio a:focus { color: #F05A28; }

/* !MODAL */
/* -------------------------------------------*/
.beerworker .reveal-modal { visibility: hidden; top: 40px; left: 50%; margin-left: -250px; width: 500px; background: url(/img/dashes-gray-horz.png) repeat-x 0 0; background-size: 7px 10px; background-color: #fff; background-position: 0 15px; position: absolute; z-index: 5001; padding: 45px 40px 25px 40px; }

.beerworker .reveal-modal p, .beerworker .reveal-modal ul { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; }

.beerworker .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: #26AFD7; background: rgba(38, 175, 215, 0.8); z-index: 5000; display: none; top: 0; left: 0; }

.beerworker .reveal-modal .close-reveal-modal { position: absolute; left: -10px; top: 9px; width: 20px; height: 20px; background: url(/img/x.svg) #F05A28 no-repeat 50% 50%; cursor: pointer; }

@media screen and (max-width: 43.6875em) { .beerworker .reveal-modal { visibility: hidden; top: 30px; left: 5%; margin-left: 0; width: 90%; padding-left: 20px; padding-right: 20px; padding-bottom: 10px; } }

#events { margin: 0 auto; padding: 0 24px 0 96px; max-width: 1020px; background: url(/img/dots-gray-vert.png) repeat-y 0 0; background-size: 3px 7px; background-position: 94px 0; }

.event { position: relative; margin-bottom: 24px; background: #ebecec; }

.event::after { clear: both; content: ""; display: block; }

.event:before, .event:after { content: ''; display: block; position: absolute; right: 0; }

.event:before { top: 17px; width: 100%; height: 35px; background: #fff; }

.event:after { bottom: 10px; height: 45px; left: 68px; background: url(/img/event-arrow.svg) no-repeat 0 0; }

.event .inner::after { clear: both; content: ""; display: block; }

.event .inner:before { content: ""; display: table; }

.event-date { position: relative; z-index: 1; float: left; width: 90px; background: #a3a4a5; border: 1px solid #fff; border-width: 0 4px 4px 0; text-align: center; color: #fff; }

.event-date-large { display: block; font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 3.25rem; text-transform: uppercase; padding: 13px 0 9px; border-bottom: 2px solid #fff; }

.event-date-multi .event-date-large { font-size: 1.875rem; }

.event-date-small { display: block; font-size: 1rem; line-height: 1.125; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0625em; padding: 7px 0; }

.event-date-multi .event-date-small { font-size: 0.875rem; line-height: 1.5; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0714285714em; }

.event-info { position: relative; z-index: 1; margin: 12px 12px 12px 110px; border: 1px solid #7B7D7F; }

.event-title { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1.1176470588; font-size: 1.0625rem; text-transform: uppercase; letter-spacing: 0.0588235294em; margin: 0; padding: 12px 16px; border-bottom: 1px solid #7B7D7F; color: #26AFD7; }

.event-title small { font-family: "Twentieth Century W01", sans-serif; color: #7B7D7F; }

.event-text { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; padding: 14px 16px 6px; min-height: 65px; }

.event-text p, .event-text ul { margin: 0 0 0.5em; }

.event-text ul { padding-left: 1.5em; }

.event-location { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; position: relative; font-weight: 400; padding: 10px 16px; border-top: 1px solid #7B7D7F; }

.event-location .map-link { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.0666666667em; position: absolute; left: -95px; top: 50%; margin-top: -5px; }

.event-location .map-link:hover, .event-location .map-link:focus { color: #9d3b19; }

@media screen and (max-width: 62.4375em) { #events { padding: 0 48px; background-position: 46px 0; } }

@media screen and (max-width: 43.6875em) { #events { padding: 0 24px; background-position: 22px 0; } .event:before, .event:after { display: none; } .event-date { float: none; width: 100%; border-width: 0 0 2px 0; } .event-date-large, .event-date-multi .event-date-large { padding: 10px 0 6px; font-size: 1.75rem; } .event-date-multi .event-date-small { font-size: 1rem; line-height: 1.125; font-weight: 700; text-transform: uppercase; letter-spacing: 0.0625em; } .event-info { margin: 12px; } .event-title { margin: 4px 0; padding: 8px 12px; background: #fff; border: none; } .event-text { padding-left: 12px; padding-right: 12px; border-top: 1px solid #7B7D7F; border-bottom: 1px solid #7B7D7F; } .event-location { margin: 4px 0; padding: 6px 60px 6px 12px; border: none; background: #fff; } .event-location .map-link { left: auto; top: 14px; right: 8px; } }

@media screen and (max-width: 29.9375em) { #events { padding: 0 18px; background-position: 16px 0; } }

/* !LARGE TABLET AND DESKTOP */
/* -------------------------------------------*/
@media screen and (min-width: 62.5em) { #calendar-header { margin-top: 30px; margin-bottom: 30px; text-align: center; } #calendar-header h2 { font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 3.25rem; text-transform: uppercase; display: inline-block; vertical-align: middle; margin: 0 20px; color: #F05A28; } #calendar-header a { display: inline-block; vertical-align: middle; } #calendar-header a img { width: 30px; } #calendar { margin-bottom: 64px; } #calendar .row { display: flex; flex-direction: row; } #calendar .cell { width: 14.2857142857%; min-height: 140px; padding: 9px 7px; border: 1px solid #fff; background: #f2f2f2; } #calendar .cell.header { min-height: 0; padding: 12px 7px; font: 700 15px / 1 "Vitesse A", "Vitesse B", sans-serif; text-transform: uppercase; text-align: center; letter-spacing: 0.05em; color: #F05A28; } #calendar .day-summary { display: block; color: #6A6B66; } #calendar .day-summary .number { font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 2.25rem; text-transform: uppercase; color: #bdbebf; transition: color 0.25s linear; } #calendar .day-summary ul { margin: 0; padding: 0 0 0 2px; font-size: 14px; line-height: 1.2; list-style: none; word-break: break-word; transition: color 0.25s linear; } #calendar .day-summary li { position: relative; margin-top: 4px; padding: 0 0 0 0.7em; } #calendar .day-summary li:before { content: '•'; position: absolute; font-size: 13px; left: 0; top: 1px; } #calendar a.day-summary { height: 100%; } #calendar a.day-summary:hover .number, #calendar a.day-summary:hover ul { color: #F05A28; } #calendar .day-details { position: absolute; z-index: 5001; visibility: hidden; top: 60px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); padding: 40px; width: 718px; color: #fff; background: #F05A28; box-shadow: 10px 10px 0 rgba(123, 125, 127, 0.5); } #calendar .day-close { margin-bottom: 40px; } #calendar .close-reveal-modal { cursor: pointer; } #calendar .close-reveal-modal img { width: 15px; } #calendar .day-header { margin-bottom: 42px; font-size: 2.25rem; line-height: 1; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; } #calendar .day-block { margin-bottom: 30px; } #calendar .day-block .header { padding: 16px 13px; color: #F05A28; background: #fff; } #calendar .day-block .summary { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.0666666667em; float: left; padding-top: 1px; width: calc(100% - 150px); } #calendar .day-block .time { float: right; max-width: 130px; font-size: 0.9375rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; } #calendar .day-block .description, #calendar .day-block .location { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; font-weight: 400; padding: 15px 11px 1px; border: 2px solid #fff; border-width: 0 2px 2px; } #calendar .day-block .description p, #calendar .day-block .description ul, #calendar .day-block .description ol, #calendar .day-block .location p, #calendar .day-block .location ul, #calendar .day-block .location ol { margin: 0 0 1em; } #calendar .day-block .description ul, #calendar .day-block .description ol, #calendar .day-block .location ul, #calendar .day-block .location ol { padding: 0 0 0 1.2em; } #calendar .day-block .description a, #calendar .day-block .location a { color: #fff; } #calendar .day-block .description a:hover, #calendar .day-block .location a:hover { text-decoration: underline; } #calendar .day-block .location { padding-bottom: 15px; } #calendar .day-block .add-event { padding: 7px 11px 8px; background: #fff; font-size: 0.875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.035em; } #calendar .reveal-modal-bg { position: fixed; height: 100%; width: 100%; background: rgba(255, 255, 255, 0.5); z-index: 5000; display: none; top: 0; left: 0; } }

/* !MOBILE */
/* -------------------------------------------*/
@media screen and (max-width: 62.4375em) { #calendar-header { margin-top: 25px; margin-bottom: 25px; text-align: center; } #calendar-header h2 { font-family: "vinyl", sans-serif; font-weight: 400; line-height: 1; font-size: 2.25rem; text-transform: uppercase; display: inline-block; vertical-align: middle; margin: 0 10px; color: #F05A28; } #calendar-header a { display: inline-block; vertical-align: middle; } #calendar-header a img { width: 22px; } #calendar-header::after { content: ''; display: block; height: 15px; border-bottom: 2px solid #bdbebf; } #calendar .row.header, #calendar .day-summary, #calendar .day-close { display: none; } #calendar .day { margin-bottom: 40px; } #calendar .day-header { font-size: 1.875rem; line-height: 1; font-weight: 800; text-transform: uppercase; letter-spacing: 0.0666666667em; margin-bottom: 20px; font-size: 1.5rem; letter-spacing: normal; color: #26AFD7; } #calendar .day-header span { display: none; } #calendar .day-block { margin-bottom: 15px; word-break: break-word; } #calendar .day-block .header { padding: 16px 13px; color: #fff; background: #bdbebf; } #calendar .day-block .summary { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 0.9375rem; text-transform: uppercase; letter-spacing: 0.0666666667em; float: left; padding-top: 1px; width: calc(100% - 110px); } #calendar .day-block .time { float: right; max-width: 100px; font-size: 0.875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; } #calendar .day-block .description, #calendar .day-block .location { font-size: 0.9375rem; line-height: 1.3333333333; font-weight: 300; font-weight: 400; padding: 11px 11px 0; border: 2px solid #bdbebf; border-width: 0 2px 2px; } #calendar .day-block .description p, #calendar .day-block .description ul, #calendar .day-block .description ol, #calendar .day-block .location p, #calendar .day-block .location ul, #calendar .day-block .location ol { margin: 0 0 0.8em; } #calendar .day-block .description ul, #calendar .day-block .description ol, #calendar .day-block .location ul, #calendar .day-block .location ol { padding: 0 0 0 1.2em; } #calendar .day-block .description a, #calendar .day-block .location a { color: #F05A28; } #calendar .day-block .location { padding-bottom: 11px; } }

.contact-link { font-family: "Vitesse A", "Vitesse B", sans-serif; font-weight: 700; line-height: 1; font-size: 2.25rem; text-transform: uppercase; letter-spacing: 0.0625em; margin: 0 auto 20px; padding: 0 24px; max-width: 1020px; color: #F05A28; word-break: break-all; }

.contact-link a:hover, .contact-link a:focus { color: #26AFD7; }

#abw-mapbox { position: relative; height: 600px; box-sizing: border-box; background: #ccc; }

#abw-locations { padding: 25px 40px; text-align: center; }

#abw-locations .item { display: inline-block; margin: 10px; padding: 4px; background: #ddd; border-radius: 2px; }

.general-page-template main { padding: 20px 0; }

.general-page-template .headline, .general-page-template .intro-text, .general-page-template .body-text { margin: 0 auto 30px; padding: 0 24px; max-width: 972px; }

.general-page-template .headline h1 { margin: 0; font: 400 120px/0.9 "vinyl", sans-serif; text-transform: uppercase; letter-spacing: .03em; word-break: break-word; color: #F05A28; text-shadow: 0.06em 0.06em 0 rgba(123, 125, 127, 0.2); }

@media screen and (max-width: 62.4375em) { .general-page-template .headline h1 { font-size: 105px; } }

@media screen and (max-width: 49.9375em) { .general-page-template .headline h1 { font-size: 90px; } }

@media screen and (max-width: 43.6875em) { .general-page-template .headline h1 { font-size: 65px; } }

@media screen and (max-width: 29.9375em) { .general-page-template .headline h1 { font-size: 55px; } }

.general-page-template .intro-text { font-size: 22px; }

.general-page-template .body-text { font-size: 18px; line-height: 1.5; }

.general-page-template .image, .general-page-template .video { margin: 0 auto 30px; width: 100%; max-width: 1140px; }

.general-page-template .video .inner { position: relative; padding-bottom: 56.25%; }

.general-page-template .video .inner iframe { position: absolute; width: 100%; height: 100%; }

.general-page-template .image { text-align: center; }

.general-page-template .full-image { margin: 0 0 30px; }

.general-page-template .full-image img { display: block; width: 100%; }