/* Theme Name: Hobbs Brewing Co. Author: Top Hat Author URI: https://builtbytophat.com; Version: 1.0 License: GPL-2.0+ License URI: http://www.gnu.org/licenses/gpl-2.0.html */ /* `/shmNNNmho- `sNNNNNNNNNNNNy` -mNNNms/---+mNNNd /hmNh` .NNNN: ``` -NNNN: `-omNNNh `.:/+sydmNNNNNs` `.-:/oyhdmmNNNNNNNNmh+. `.-:/+sydmmNNNNNNNNNmdhys+:-` `.-:+oyhdmmNNNNNNNNmdhhso/:..`` `.-:/+shddmNNNNNNNNNmdhyo+:-.``.-:: .:+shhhys/. ``.-:+oyhdmmNNNNNNNNmdhyso/-..` /mNNNymNNNNNNNNNmy. ./shddmNNNNNNNNNmdhyo+:-.`` `....` +NNNNNNNdyo++sdNNNd. :ymNNNNNNmddymNNNs.` ./shdmmmmdho- +NNNNNd/` .dNNNs +NNNNds+:-.` dNNNo -ymNNNNNmmNNNNNs` +NNNNy` sNNNh :NNNN+` dNNNo `sNNNNds/----+mNNNd` +NNNN` sNNNd sNNNd dNNNo `hNNNm+` .NNNN+ +NNNN yNNNy +NNNm- `` dNNNo yNNNd. dNNNs +NNNN /NNNN: `hNNNmyydh: dNNNo .NNNN: dNNNo +NNNN: `-yNNNNo `omNNNNNNm- dNNNo :NNNN` /NNNN- +NNNNNy+++sdNNNNd/ `:+oo+:` dNNNo -NNNN. `+NNNNs +NNNNNNNNNNNNmd+` dNNNo dNNNh-` `.+dNNNNo +NNNNoyhhhyo/. dNNNo .dNNNNdyyhdNNNNNh- +NNNN /s- dNNNo `+dNNNNNNNNNdo- oNNNm .hNNNy` dNNNo .:/+o+/-` `.:/yNNNN+ .mNNNd- dNNNo `-:- .NNNNNNNm/ dNNNh` dNNN+ /ydNNNN+ -NNNmhs: :NNNN. -:.` :mNNNNNNm/ -. +NNNm :NNNNy:.` `-/+o+/- +NNNm :+sy/ yNNNh `+hNNNNNNNNms. +NNNm dNNNo yNNNy `omNNNNmhyhNNNNm- +NNNm dNNNo yNNNy `hNNNNs-` `yNNNd +NNNm dNNNo yNNNy yNNNd- :NNNN` +NNNm dNNNo yNNNy .NNNN: :NNNN` +NNNm `.-/+- dNNNo yNNNy -NNNN. :NNNN` +NNNNhdmmNNNo dNNNo yNNNy -NNNN. `/NNNN` +NNNNNNNNmdh: `/oyh` dNNNo yNNNy -NNNN:-:/oyhdmNNNNN` +NNNNo/:..`` `mNNN+ dNNNo yNNNy -NNNNmNNNNNNNNNNNNN` +NNNm sNNNh dNNNo `.-:+dNNNy -NNNNNmdhhso/:/NNNN` +NNNm sNNNd `.dNNNdhddmNNNNNNNy -NNNN:.`` :NNNN` /NNNN` `dNNNs `.-:+oyhdmNNNNNNNNNmdhmNNNy -NNNN. :NNNN` `mNNNs `sNNNm. -+ydmNNNNNNNNNNNNdo+:-.``yNNNy -NNNN. `o+:- /NNNNy- `/dNNNm: `/hmNNNNmddys+/-dNNNo yNNNy -Nmdh` :dNNNNho:-....-/sdNNNNh- -hNNNNdo:.` dNNNo smmdo -.` `/hNNNNNNmmmmNNNNNmy: /mNNNh:` dNNNo .-.` `-+ydmmNNNmmdhs/. /NNNNo` dNNNo `..----.` `mNNNs `mNNN+ -NNNN. sNNNm` -NNNN. `sNNNN/ dNNNh` .+mNNNm/ -mNNNmo:-.-:oyNNNNNy. .sNNNNNNNNNNNNNms- ./ydmNNNmdy+- ``` */ /* # HTML5 Reset ---------------------------------------------------------------------------------------------------- */ /* ## Baseline Normalize --------------------------------------------- */ /* normalize.css v4.1.1 | MIT License | http://necolas.github.io/normalize.css/ */ html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}body{margin:0}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}audio,canvas,progress,video{display:inline-block}audio:not([controls]){display:none;height:0}progress{vertical-align:baseline}template,[hidden]{display:none}a{background-color:transparent;-webkit-text-decoration-skip:objects}a:active,a:hover{outline-width:0}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:inherit}b,strong{font-weight:bolder}dfn{font-style:italic}h1{font-size:2em;margin:0.67em 0}mark{background-color:#ff0;color:#282626}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-0.25em}sup{top:-0.5em}img{border-style:none}svg:not(:root){overflow:hidden}code,kbd,pre,samp{font-family:monospace, monospace;font-size:1em}figure{margin:1em 40px}hr{box-sizing:content-box;height:0;overflow:visible}button,input,optgroup,select,textarea{font:inherit;margin:0}optgroup{font-weight:bold}button,input{overflow:visible}button,select{text-transform:none}button,html [type="button"],[type="reset"],[type="submit"]{-webkit-appearance:button}button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:1px dotted ButtonText}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}textarea{overflow:auto}[type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{-webkit-appearance:textfield;outline-offset:-2px}[type="search"]::-webkit-search-cancel-button,[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-input-placeholder{color:inherit;opacity:0.54}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit} /* ## Box Sizing --------------------------------------------- */ html, input[type="search"] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } *, *::before, *::after { box-sizing: inherit; } /* ## Float Clearing --------------------------------------------- */ .author-box::before, .clearfix::before, .entry::before, .entry-content::before, .footer-widgets::before, .nav-primary::before, .nav-secondary::before, .pagination::before, .site-container::before, .site-footer::before, .site-header::before, .site-inner::before, .widget::before, .wrap::before { content: " "; display: table; } .author-box::after, .clearfix::after, .entry::after, .entry-content::after, .footer-widgets::after, .nav-primary::after, .nav-secondary::after, .pagination::after, .site-container::after, .site-footer::after, .site-header::after, .site-inner::after, .widget::after, .wrap::after { clear: both; content: " "; display: table; } /* # Defaults ---------------------------------------------------------------------------------------------------- */ /* ## Top Hat Layout Structures --------------------------------------------- */ section { float: left; width: 100%; position: relative; } /*Parallax Trick*/ .bg-wrap { clip: rect(0, auto, auto, 0); clip-path: inset(0 0); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; } .bg { position: fixed; display: block; top: 0; left: 0; width: 100%; height: 100%; background-size: cover; background-position: center center; transform: translateZ(0); will-change: transform; z-index: 2; } /* ## Typographical Elements --------------------------------------------- */ html { font-size: 62.5%; /* 10px browser default */ } /* Chrome fix */ body > div { font-size: 20px; font-size: 2rem; } body { background-color: #f1eee8; font-family: 'Titling Gothic FB'; color: #282626; font-size: 20px; font-size: 2rem; -webkit-font-smoothing: antialiased; font-weight: 300; line-height: 1.625; margin: 0; } body input { outline: none!important; } a:active, a:focus, { outline:0; border:none; -moz-outline-style: none; } a, button, input:focus, input[type="button"], input[type="reset"], input[type="submit"], textarea:focus, .button, .gallery img { -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -ms-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.1s ease-in-out; } a { text-decoration: underline; outline:0; border:none; -moz-outline-style: none; } a:focus, a:hover { text-decoration: none; outline:0; border:none; -moz-outline-style: none; } p { margin: 0 0 28px; padding: 0; } ol, ul { margin: 0; padding: 0; } hr { border: 0; border-collapse: collapse; border-top: 1px solid #eee; clear: both; margin: 1em 0; } b, strong { font-weight: 700; } blockquote, cite, em, i { font-style: italic; } mark { background: #ddd; color: #282626; } blockquote { margin: 40px; } blockquote::before { content: "\201C"; display: block; font-size: 30px; font-size: 3rem; height: 0; left: -20px; position: relative; top: -10px; } /* ## Objects --------------------------------------------- */ embed, iframe, img, object, video, .wp-caption { max-width: 100%; } img { height: auto; } figure { margin: 0; } /* ## Forms --------------------------------------------- */ ::-moz-placeholder { color: #d8d8d8; opacity: 1; } ::-webkit-input-placeholder { color: #d8d8d8; opacity: 1; } input { -webkit-appearance: none!important; border-radius: 0px!important; } option { color: #282626; } /* ## Tables --------------------------------------------- */ table { border-collapse: collapse; border-spacing: 0; line-height: 2; margin-bottom: 40px; width: 100%; word-break: break-all; } tbody { border-bottom: 1px solid #eee; } td, th { text-align: left; } td { border-top: 1px solid #eee; padding: 6px; } th { font-weight: 400; padding: 0 6px; } td:first-child, th:first-child { padding-left: 0; } /* ## Screen Reader Text --------------------------------------------- */ .screen-reader-shortcut, .screen-reader-text, .screen-reader-text span { border: 0; clip: rect(0, 0, 0, 0); height: 1px; overflow: hidden; position: absolute !important; width: 1px; word-wrap: normal !important; } .screen-reader-text:focus, .screen-reader-shortcut:focus, .widget_search input[type="submit"]:focus { background: #fff; box-shadow: 0 0 2px 2px rgba(0,0,0,.6); clip: auto !important; color: #333; display: block; font-size: 1em; font-weight: bold; height: auto; padding: 15px 23px 14px; text-decoration: none; width: auto; z-index: 100000; /* Above WP toolbar. */ } .more-link { position: relative; } /* # Global ---------------------------------------------------------------------------------------------------- */ .grecaptcha-badge { display: none!important; visibility: hidden!important; } body.locked { height: 100%; overflow: hidden; } .flex { display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .mobile-toggler { display: none; } h1, h2, h3, h4, h5, h6 { margin: 0; } /* ## Font Imports --------------------------------------------- */ @font-face { font-family: 'Titling Gothic FB'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Black.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Medium.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Wide'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Medium.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Wide'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Thin.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Wide'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Standard.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Standard.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Skyline'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Regular.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Skyline'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Standard.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Standard.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Wide'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Regular.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Regular.woff2') format('woff2'), url('TitlingGothicFB-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Wide'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Black.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Skyline'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Bold.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Skyline'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Black.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Narrow'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Standard.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Standard.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Skyline'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Light.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Thin.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Standard.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Standard.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Wide'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Bold.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Skyline'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Medium.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Narrow'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Regular.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Skyline'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Thin.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBSkyline-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Bold.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Wide'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Light.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBWide-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Narrow'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Thin.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Light.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFB-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Narrow'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Light.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Narrow'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Black.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Compressed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Bold.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Extended'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Regular.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Condensed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Light.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Condensed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Standard.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Standard.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Extended'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Light.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Narrow'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Bold.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Compressed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Standard.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Standard.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Extended'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Bold.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Narrow'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Medium.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBNarrow-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Condensed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Bold.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Bold.woff') format('woff'); font-weight: bold; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Compressed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Thin.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Extended'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Thin.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Extended'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Medium.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Condensed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Medium.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Compressed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Regular.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Extended'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Black.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBExtended-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Condensed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Black.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Compressed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Medium.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Medium.woff') format('woff'); font-weight: 500; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Compressed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Black.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Black.woff') format('woff'); font-weight: 900; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Condensed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Regular.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Regular.woff') format('woff'); font-weight: normal; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Condensed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Thin.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCondensed-Thin.woff') format('woff'); font-weight: 100; font-style: normal; font-display: swap; } @font-face { font-family: 'Titling Gothic FB Compressed'; src: url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Light.woff2') format('woff2'), url('/wp-content/themes/hobbs-brewing/assets/fonts/TitlingGothicFBCompressed-Light.woff') format('woff'); font-weight: 300; font-style: normal; font-display: swap; } .skyline, [data-font="Skyline Medium"], [data-font="Skyline Bold"], [data-font="Skyline Regular"] { font-family: 'Titling Gothic FB Skyline'; } [data-font="Skyline Regular"] { font-weight: normal; } [data-font="Skyline Medium"] { font-weight: 500; } [data-font="Skyline Bold"] { font-weight: bold } [data-font="Regular Regular"], [data-font="Regular Bold"], .regular { font-family: 'Titling Gothic FB'; } [data-font="Regular Regular"] { font-weight: normal; } [data-font="Regular Bold"] { font-weight: bold; } .narrow { font-family: 'Titling Gothic FB Narrow'; } [data-font="Narrow Bold"] { font-family: 'Titling Gothic FB Narrow'; font-weight: bold; } [data-font="Extended Light"], [data-font="Extended Regular"], [data-font="Extended Medium"], [data-font="Extended Bold"], .extended { font-family: 'Titling Gothic FB Extended'; } [data-font="Extended Light"] { font-weight: 300; } [data-font="Extended Regular"] { font-weight: normal; } [data-font="Extended Medium"] { font-weight: 500; } [data-font="Extended Bold"] { font-weight: bold; } [data-font="Condensed Regular"], .condensed { font-family: 'Titling Gothic FB Condensed'; } [data-font="Condensed Regular"] { font-weight: normal; } [data-font="Compressed Regular"], .compressed { font-family: 'Titling Gothic FB Compressed'; } [data-font="Compressed Regular"] { font-weight: normal; } [data-font="Wide Thin"], [data-font="Wide Medium"], [data-font="Wide Bold"], .wide { font-family: 'Titling Gothic FB Wide'; } [data-font="Wide Thin"] { margin-right: -10%; } [data-font="Wide Thin"] { font-weight: 100; } [data-font="Wide Medium"] { font-weight: 500; } [data-font="Wide Bold"] { font-weight: bold; } /* ## Site Specific Containers --------------------------------------------- */ /* ## Loader --------------------------------------------- */ .loader-left, .loader-right { width: calc(54% - 24.5px); position: fixed; top: 0; height: 100%; z-index: 99; background-color: #f1eee8; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .loader-left { left: calc(50% - 24.5px); } .loader-right { right: calc(50% - 24.5px); } .loader-left.loaded, .loader-right.loaded { width: 0!important; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } /* # Page Templates ---------------------------------------------------------------------------------------------------- */ /* ## Belize --------------------------------------------- */ .belize, .belize-content-holder { min-height: 100vh; } .belize-content-holder { background: no-repeat center right / contain; align-items: center; } .belize-content-inner { width: 90%; margin: 0 auto; } .belize-image .bg { width: calc(50% - 24.5px); } .belize-content-inner h1 { text-transform: uppercase; font-size: 82px; font-weight: bold; line-height: 1; margin-bottom: 10px; } .content-length { width: 522px; max-width: 100%; margin-right: auto; } .belize-long-copy { text-align: justify; font-size: 22px; line-height: 1.4; font-weight: normal; margin-bottom: 50px; } .belize-long-copy p { margin-bottom: 15px; } .belize-long-copy p:last-of-type { margin-bottom: 0; } .belize-button-link { text-transform: uppercase; font-weight: 600; line-height: 1; color: #282626; font-size: 40px; text-decoration: none; align-items: center; } .belize-button-link:not(.belize-button-link:last-of-type) { margin-bottom: 17px; } .belize-button-link img { width: 20px; margin-right: 15px; } /* ## Event --------------------------------------------- */ .event-single .global-left { background-color: #ada1cd; } .event-page-details { border-bottom: solid 3px #282626; margin-bottom: 25px; } .event-detail-block { width: calc(100% - 80px); align-items: center; } .event-detail-block .event-price-side, .event-detail-block .event-place-side { width: 100px; } .event-detail-block .event-place-side { border-bottom: unset; } .event-detail-block .event-price-side { padding: 0; } .event-detail-block .address-area { width: calc(100% - 200px); font-weight: 500; font-size: 16px; line-height: 1.2; text-transform: uppercase; } .address-area.mobile { display: none; width: 100%; font-weight: 500; font-size: 16px; line-height: 1.2; text-transform: uppercase; border-top: solid 3px #282626; text-align: center; padding: 15px 0; } /* ## Single Venue --------------------------------------------- */ .slider-holder { width: 100%; top: 0; position: -webkit-sticky; position: sticky; height: 100vh; } .long-text.slider-holder h1 { font-size: 42px; } .slider-holder h1 { position: absolute; z-index: 10; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; line-height: 1.4; text-transform: uppercase; font-weight: bold; color: #f2ede7; width: 90%; font-size: 52px; text-align: center; } .slider-holder .arrow-left { left: 5%; } .slider-holder .arrow-right { right: 5%; } .slider-holder .arrow-left, .slider-holder .arrow-right { position: absolute; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); z-index: 2; cursor: pointer; } .venue-slider { position: relative; z-index: 1; } .venue-slide:not(.slick-slide):before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.15); content: ''; z-index: 4; } .venue-slide { height: 100vh!important; width: 100%; background: no-repeat center center / cover; } .venues-title h1 { font-size: 20px; line-height: 1.1; text-transform: uppercase; align-items: center; font-weight: normal; margin-bottom: 30px; } .venues-title h1 span.title { font-weight: bold; font-size: 22px; padding-bottom: 2px; } .venues-title h1 span.first { margin-right: 4px; } .venue-text p:first-of-type { font-size: 20px; line-height: 1.3; letter-spacing: 1.1px; } .venue-text a { font-family: 'Titling Gothic FB Wide'; font-weight: bold; color: #282626; text-decoration: none; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .venue-text a:hover { color: #ada1cd; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .venue-text { font-size: 14px; line-height: 1.5; font-weight: normal; } .venue-text ul, .venue-text ol, .venue-text p { margin-bottom: 25px; } .venue-text li { margin-left: 20px; margin-bottom: 5px; } .venues-right { padding: 44px 0 0; } .venues-right .global-inner { position: relative; } .venues-right-abs { position: absolute; right: 0; top: 0; height: 100%; width: 9%; } .venues-right-abs a { position: -webkit-sticky; position: sticky; top: 35%; } .venues-right-abs a img { width: 100%; } /* ## Venues --------------------------------------------- */ .venue-top-hero { height: 50vh; min-height: 320px; position: relative; } .venue-top-hero:before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.2); content: ''; z-index: 1; } .amenities { min-height: 50vh; } .venue { width: 100%; } .venue-top-hero img { width: 100%; } .venue-top-hero { width: 100%; position: relative; background: no-repeat center center / cover; align-items: center; justify-content: center; } .venue-top-hero-contents { color: #f2ede7; font-weight: bold; line-height: 1.1; font-size: 17px; letter-spacing: -0.3px; width: 270px; margin: 0 auto; max-width: 90%; position: relative; z-index: 2; } .host-at { margin-bottom: 10px; } .amenities-inner { width: 518px; margin: 44px auto auto; max-width: 90%; text-align: center; padding-bottom: 80px; position: relative; } .amenity-line:last-of-type { margin-bottom: unset; } .amenity-text.extended { font-weight: bold; } .amenity-line { justify-content: center; line-height: 1.1; font-size: 22px; margin-bottom: 25px; letter-spacing: .1px; } .venue-link-holder { justify-content: center; position: absolute; left: 0; right: 0; margin: 0 auto; bottom: 0; } .venue-link-holder a:hover .arrow-right { right: 4px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .venue-link-holder a:hover .arrow-left { left: 4px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .venue-link-holder a img { position: relative; } .venue-link-holder a .arrow-right { right: 0; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .venue-link-holder a .arrow-left { left: 0; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .venue-link-holder a span { padding: 2px 5px 0; } .venue-link-holder a { text-decoration: none; line-height: 1; font-size: 15px; color: #282626; font-weight: bold; text-transform: uppercase; align-items: center; } .venue-link-holder .arrow-right { position: relative; transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); } /* ## Event Menu --------------------------------------------- */ .event-menu-stick { background-color: #ada1cd; top: 0; position: -webkit-sticky; position: sticky; height: 100vh; width: 100%; align-items: center; } .event-menu-stick .menu-item { text-transform: uppercase; line-height: 1; width: 100%; text-align: center; font-size: 82px; justify-content: center; margin-bottom: 8%; cursor: pointer; position: relative; color: #282626; text-decoration: none; } .event-menu-stick .menu-item:last-child { margin-bottom: unset; } .menu-item-word { padding-right: 3%; position: relative; z-index: 3; } .event-menu-stick .menu-item.active .menu-check { opacity: 1; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .menu-check { opacity: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; position: absolute; top: 50%; left: 50%; height: 130%; width: auto; margin: 0 auto; z-index: 1; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); } .menu-item-word:last-of-type { padding-right: unset; } .date-month { font-size: 15px; font-weight: 500; line-height: 1.1; letter-spacing: 2.32px; text-transform: uppercase; margin-bottom: 2px; } .free + .wide { font-weight: normal!important; } .event-price-side .free { font-size: 40px; font-weight: 500; line-height: 1; text-transform: uppercase; } .date-number { line-height: 1; font-weight: 500; font-size: 32px; letter-spacing: 1.83px; text-align: center; } .compressed.at-hobbs { font-size: 35px; line-height: 1; text-transform: uppercase; font-weight: normal; } .at-hobbs + .wide { font-size: 11px; line-height: 1; font-weight: 500; text-transform: uppercase; } .event-link img { width: 20px; } .event-link span { display: inline-block; width: calc(98% - 20px); margin-left: auto; line-height: 1.1; } .event-link { text-decoration: none; line-height: 1; text-transform: uppercase; font-size: 17px; font-weight: 500; align-items: center; color: #282626; } .at-hobbs + .brewery { font-size: 22px; letter-spacing: 1px; line-height: 1; font-weight: normal; text-transform: uppercase; } .date-block { width: 80px; padding: 15px 0; border-right: solid 3px #282626; align-items: center; justify-content: center; } .event-place-side { border-bottom: solid 3px #282626; } .event-price-side .wide { font-weight: bold; font-size: 14px; text-transform: uppercase; position: relative; top: -4px; } .paid-entry { justify-content: center; font-size: 40px; line-height: 1; } .paid-entry .medium { font-weight: 500; } .event-price-side, .event-place-side { padding: 15px 2.5%; text-align: center; } .event-place-side .compressed.outside { line-height: 1.1; text-transform: uppercase; font-size: 16px; font-weight: normal; } .date-and-title { border-top: solid 3px #282626; border-bottom: solid 3px #282626; } .event-name { width: calc(100% - 80px); padding: 11px 5%; line-height: 1.1; font-size: 36px; font-weight: 500; letter-spacing: 1.99px; text-transform: uppercase; align-items: center; } .event.hide { display: none; } .event { margin-top: 42px; border-bottom: solid 3px #282626; position: relative; z-index: 1; } .event-description-blurb { font-size: 14px; line-height: 1.71; letter-spacing: 0.77px; text-align: justify; font-weight: normal; } .event-description { width: calc(100% - 90px); padding-right: 5%; padding-top: 15px; padding-bottom: 25px; } .event-right-side { width: 90px; border-left: solid 3px #282626; } .date-and-specs .event-right-side.mobile { display: none; width: 66%; } .event-link-area { margin-top: 20px; } .event-render { min-height: 100vh; padding-bottom: 100px; } .transition-curtain.transition-in { left: 0; width: 100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .transition-curtain.transition-in.transition-out { left: auto; right: 0; width: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .transition-curtain { position: absolute; top: 0; height: 100%; width: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; z-index: 10; background-color: #f1eee8; display: block; content: ''; } /* ## Location --------------------------------------------- */ .location-menu-inner { width: 100%; text-align: center; } .location-right .global-inner { position: relative; z-index: 2; } .location-menu-images { position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 1; } .location-menu-images .bg { width: 50%; margin-left: auto; right: 0; left: auto; } .location-menu-images .bg-wrap { opacity: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .location-menu-images .bg-wrap.show { opacity: 1; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .location-right { align-items: center; } .location-menu-item:hover { color: #fff; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .location-menu-item { text-decoration: none; text-transform: uppercase; width: 100%; display: block; font-size: 90px; font-weight: bold; line-height: 1; color: #282626; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; margin-bottom: 7%; } .location-menu-item:last-of-type { margin-bottom: unset; } .location-menu-item.skyline { font-weight: 500; letter-spacing: 3.61px; } .locations .global-left, .locations .global-right { min-height: 100vh; } /* ## Beers --------------------------------------------- */ .back-button-beers { display: none!important; top: 50%; position: absolute; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); width: 24px; } .beers-page .global-left { left: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .show-beer .global-left, .show-beer .site-footer, .show-sub-section .site-footer, .show-sub-section .home-sliding { left: -100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } body.show-beer .beers-page .global-right { right: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .hobbs-beer { border-bottom: solid 3px #423f3d; padding: 22px 0; cursor: pointer; align-items: center; position: relative; } .hobbs-beer:hover .bubble-more { bottom: -60px; opacity: 1; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .bubble-more { position: absolute; left: 0; right: 0; margin: 0 auto; bottom: -80px; opacity: 0; pointer-events: none; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; width: 146px; } .beer-name-graphic, .beer-details-inner { width: 51%; margin: 0 auto; position: relative; } .beer-details .beer-graphic.right img { right: 0; } .beer-details .beer-graphic.left img { left: 0; } .beer-graphic { /*width: calc(45% - 168px);*/ width: 24.5%; position: relative; } .beers-beer-name { text-transform: uppercase; font-size: 35px; text-align: center; width: 100%; line-height: 1.1; margin-bottom: 10px; } .beer-name-inner { width: 100%; text-align: center; } .det-beer-name .small-format { font-size: 27px; } .long-name, .det-beer-name.long-name { font-weight: 500; } .mid-long, .det-beer-name.mid-long { font-weight: bold; } .reg-long, .det-beer-name.reg-long { font-weight: bold; } .beers-area-image .bg { width: 50%; margin-left: auto; left: auto; } .beers-area-image { height: 100%; width: 100%; position: relative; } .beers-detail-holder { position: absolute; top: 0; height: 100%; width: 100%; left: 0; z-index: 10; } .empty-first { height: 100vh!important; } .beers-detail-holder-inner { top: 0; position: -webkit-sticky; position: sticky; width: 100%; } .hobbs-beer-detail { height: 100vh!important; overflow-y: scroll; outline: none!important; padding: 22px 0 65px; } .beer-detail-inner { width: 367px; max-width: 90%; margin: 0 auto; } .on-tap-now-inner { width: 277px; margin: 0 auto; max-width: 100%; } .buy-now { width: 100%; background-color: #282626; text-transform: uppercase; line-height: 1; text-align: center; align-items: center; justify-content: center; height: 33px; padding-top: 1px; font-size: 22px; font-weight: bold; letter-spacing: 1.22px; text-decoration: none; } .on-tap-now { width: 100%; margin-bottom: 56px; position: relative; } .can-mock { width: 100%; margin-bottom: 19px; background: no-repeat center center / contain; } .can-mock:before { padding-top: 116%; display: block; width: 100%; content: ''; } .on-tap-now-text { width: 100%; text-align: center; font-size: 23px; font-weight: bold; line-height: 1.04; letter-spacing: 1.27px; text-transform: uppercase; margin-bottom: 3px; } .tap-location { align-items: center; } .tap-location .box { height: 16px; width: 14px; border: 2px solid #282626; } .tap-location .box.checked { background-image: url(/wp-content/themes/hobbs-brewing/assets/images-icons/check.svg); background-size: contain; background-position: center; background-repeat: no-repeat; } .tap-location .name { width: calc(96% - 14px); margin-left: auto; text-transform: uppercase; letter-spacing: 1.05px; line-height: 1; font-size: 20px; font-weight: normal; padding-top: 2px; } .tap-location { width: 45%; margin-right: auto; margin-bottom: 12px; } .tap-location:nth-child(2n) { margin-right: unset; } /* ## Colors --------------------------------------------- */ div[data-color="Blue"] { background-color: #90c3e9; } div[data-color="Blue"] .buy-now { color: #90c3e9; } div[data-color="Green"] { background-color: #a9cda4; } div[data-color="Green"] .buy-now { color: #a9cda4; } div[data-color="Pink"] { background-color: #d09c9c; } div[data-color="Pink"] .buy-now { color: #d09c9c; } div[data-color="Black"] { background-color: #282626; } div[data-color="Orange"] { background-color: #e1b69c; } div[data-color="Orange"] .buy-now { color: #e1b69c; } div[data-color="Purple"] { background-color: #b6abd3; } div[data-color="Purple"] .buy-now { color: #b6abd3; } /* ## Taps --------------------------------------------- */ .the-taps .location-stick { overflow: hidden; } .the-taps .global-left, .location-stick, .logo-stick { min-height: 100vh; } .logo-place { position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .location-stick, .logo-stick { top: 0; position: -webkit-sticky; position: sticky; width: 100%; align-items: center; } .location-image { background: no-repeat center center / cover; width: 100%; margin-bottom: 20px; } .location-image:before { padding-top: 70%; display: block; content: ''; width: 100%; } .the-taps .global-left { padding-top: 84px; } .the-taps .global-inner { position: relative; z-index: 3; } .hobbs-title-holder { align-items: center; width: calc(95% - 64px); padding-bottom: 4px; } .hobbs-tap-title h2 { font-size: 24px; font-weight: 500; text-transform: uppercase; line-height: 1; letter-spacing: 0.02px; } .to-go { width: 64px; background-color: #282626; color: #f2ede7; font-size: 12px; font-weight: 500; line-height: 1; letter-spacing: 1.21px; margin-left: auto; align-items: center; justify-content: center; text-transform: uppercase; height: 25px; padding-top: 2px; } .hobbs-tap-title { border-bottom: 3px solid #282626; align-items: flex-end; } .item-on-tap { border-bottom: 3px solid #282626; } .beer-name-row { width: calc(100% - 49px); margin-left: auto; } .item-on-tap .abv { width: 49px; justify-content: center; align-items: center; border-right: 3px solid #282626; } .item-on-tap .abv span { width: 35px; text-align: center; font-weight: normal; font-size: 24px; } .no-to-go .beer-name-holder { width: 100%; } .beer-name-holder { width: calc(100% - 64px); margin-right: auto; padding: 15px 13px; font-size: 23px; line-height: 1; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .beer-name-holder-inner { position: relative; top: 2px; width: 100%; } .main-taps .item-on-tap:hover .beer-name-holder, .main-taps .beer-name-holder.active { background-color: #282626; color: #f1eee8; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; cursor: pointer; } .guest-taps .beer-name-holder { width: calc(100% - 100px); } .brand { width: 100px; font-size: 24px; line-height: 1.1; align-items: center; justify-content: flex-end; font-weight: normal; text-transform: uppercase; } .beer-style { font-weight: normal; } .beer-name { font-weight: bold; margin-right: 8px; } .to-go-column { width: 64px; border-left: 3px solid #282626; align-items: flex-end; padding: 5px; } .to-go-column img { height: 45px; margin-right: 5px; } .to-go-column img:nth-child(3n) { display: none; } .to-go-column img:nth-child(2n) { margin-right: unset; } .hobbs-taps { margin-bottom: 45px; } .beer-details { position: absolute; top: 100%; width: 100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; height: 100vh; align-items: center; } .beer-details:not(".special-bg"){ background-color: #f1eee8; } .beer-details.in-right { top: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .location-right-side { width: 100%; } .location-right-side .location-holder { position: relative; width: 90%; margin: 0 auto; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; left: 0; top: 0; } .location-right-side .location-holder.exit-left { top: -100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } /*.beer-details-inner { width: 336px; margin: 0 auto; }*/ .beer-style-line { line-height: 1.1; font-size: 20px; } .ipa-special.wide { font-weight: bold; } .beer-details-inner.full { width: 100%; } .hobbs-beer .beer-graphic img.the-icon { z-index: 2; } .hobbs-beer .beer-graphic img.texture { z-index: 1; } .hobbs-beer .beer-graphic.left img { left: 0; } .hobbs-beer .beer-graphic.right img { right: 0; } /*.hobbs-beer[data-beer="Pitch-a-Tent"] .beer-graphic.left img { right: 0; left: auto; } .hobbs-beer[data-beer="Pitch-a-Tent"] .beer-graphic.right img { left: 0; right: auto; } */ .beer-graphic:before { content: ''; display: block; padding-top: 150%; } .beer-graphic img { height: 100%; width: auto; position: absolute; top: 0; } .det-beer-name { text-transform: uppercase; font-weight: 500; font-size: 40px; line-height: 1.1; letter-spacing: 0.36px; margin-bottom: 4px; } .beer-desc-inner { font-size: 16px; font-weight: 500; line-height: 1.44; letter-spacing: 0.02px; text-align: justify; } .det-beer-style { width: calc(100% - 90px); padding: 10px 0; border-right: 3px solid #282626; font-size: 22px; line-height: 1; padding-right: 2.5%; } .det-beer-abv { width: 90px; padding-left: 3%; font-size: 24px; } .beer-meta-dets { align-items: center; border-top: 3px solid #282626; border-bottom: 3px solid #282626; margin-bottom: 7px; } .det-beer-abv .condensed { margin-right: 4px; font-weight: 500; } /* ## Home --------------------------------------------- */ .sliding-left.no-transition, .sliding-right.no-transition { -moz-transition: all 0s ease!important; -webkit-transition: all 0s ease!important; -o-transition: all 0s ease!important; transition: all 0s ease!important; } .sliding-left, .sliding-right, .global-right, .global-left { width: calc(50% - 24.5px); position: relative; -moz-transition: all .5s ease; -webkit-transition: all .5s ease; -o-transition: all .5s ease; transition: all .5s ease; top: 0; } .sliding-right .section-slide-inner { text-align: right; justify-content: flex-end; } .global-right.margin-right .global-inner { padding-right: 11%; } .global-left { margin-right: auto; } .global-right { margin-left: auto; } .sliding-left > div, .sliding-left > a, .sliding-right > div, .sliding-right > a { height: 100vh; text-decoration: none; color: #282626; position: relative; width: 100%; float: left; top: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .sliding-left .bg { width: 50%; } .home-sliding .sliding-left .bg:before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100%; width: 100%; background-color: rgba(0, 0, 0, 0.35); content: ''; } .sliding-left { margin-right: auto; } .extra-for-last-section:not(.show) { opacity: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; -webkit-transition-delay: 400ms; -moz-transition-delay: 400ms; -o-transition-delay: 400ms; transition-delay: 400ms; pointer-events: none; } .extra-for-last-section.show { opacity: 1; } .home-hero-name-slider.fade { opacity: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } body .home-hero-name-slider.slick-initialized { opacity: 1; } body .home-hero-name-slider { opacity: 0; pointer-events: none; position: fixed!important; left: 0; width: 100%; right: 0; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); } .home-slide-left { align-items: center; justify-content: center; } .home-logo { position: relative; z-index: 10; width: 300px; max-width: 90%; margin: 0 auto; } .home-logo-right { position: absolute; z-index: 2; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; width: auto; height: 90%; } .home-slide-right { align-items: center; justify-content: center; } .home-slide-inner { position: relative; z-index: 3; width: 518px; max-width: 90%; margin: 0 auto; } .item-row { color: #282626; text-decoration: none; border-bottom: solid 3px #282626!important; margin-bottom: 41px; position: relative; } .item-row:last-of-type { margin-bottom: 0; } .item-content { width: calc(100% - 64px); padding-left: 14px; align-items: flex-end; font-size: 26px; font-weight: 500; font-stretch: normal; font-style: normal; line-height: normal; letter-spacing: 0.03px; border-left: solid 3px #282626; } .item-name span { margin-left: auto; } .item-name { width: 64px; padding: 5px 7px 5px 0; font-size: 16px; font-weight: 500; font-stretch: normal; line-height: 1.1; letter-spacing: 0.02px; text-align: right; text-transform: uppercase; min-height: 44px; align-items: flex-end; } .other-location-info { width: 100%; margin-top: 45px; } .l-bottom-text { text-align: center; text-transform: uppercase; font-weight: 500; font-size: 16px; margin-top: 7px; width: 100%; } .l-arrow-right { position: relative; transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); } .link-top a { color: #282626; font-weight: bold; text-decoration: none; text-transform: uppercase; align-items: center; justify-content: center; } .link-top a img { width: 23px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; position: relative; } .l-arrow-left { left: 0; } .l-arrow-right { right: 0; } .link-top a:hover .l-arrow-left { left: 10px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .link-top a:hover .l-arrow-right { right: 10px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .link-top a span { display: inline-block; position: relative; top: 1px; margin: 0 13px; } .link-top { text-align: center; width: 100%; } .section-slide { align-items: center; } .location-holder-sub-section { width: 100%; } .section-slide-inner { align-items: center; width: 450px; margin: 0 auto; max-width: 90%; position: relative; z-index: 55; } .sliding-left .split-icon { right: 0; } .section-slide-inner h2 { width: 206px; text-align: center; line-height: 1.1; text-transform: uppercase; } .section-slide-inner h2 [data-size="Small"] { font-size: 30px; } .section-slide-inner h2 [data-size="Big"] { font-size: 60px; } .sliding-left .section-slide-inner h2 { margin-right: auto; } .sliding-right .split-icon { left: 0; } .sliding-right .section-slide-inner h2 { margin-left: auto; } .split-icon { width: 432px; max-width: 50%; position: absolute; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); z-index: 55; pointer-events: none; } .click-section { cursor: pointer; } .sub-sections .sliding-right, .sub-sections .sliding-left { position: fixed; height: 100%; } .sub-sections .sliding-right { right: 0; } .sub-sections .sliding-left { left: 0; } .sliding-left .section-slide.sub-section-active { top: -100vh; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .sliding-right .section-slide.sub-section-active { top: 100vh; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .sub-sections .sliding-left .section-slide { position: absolute; left: 0; width: 100%; top: 100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .sub-sections .sliding-right .section-slide { position: absolute; right: 0; width: 100%; top: -100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .sub-sections .sliding-right .section-slide.active, .sub-sections .sliding-left .section-slide.active { top: 0%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } /* # Site Navigation ---------------------------------------------------------------------------------------------------- */ /* ## Desktop Menu --------------------------------------------- */ .menu-bar-logo img, .menu-bar-logo a { width: 100%; } .menu-bar-logo a { align-items: center; } .menu-button { text-transform: uppercase; line-height: 1; font-size: 29px; font-weight: normal; font-stretch: normal; font-style: normal; line-height: 0.85; letter-spacing: 0.03px; position: absolute; top: 10px; left: 0; right: 0; width: 100%; text-align: center; z-index: 4; cursor: pointer; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .at-home .menu-button { top: -100px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .main-menu-items a:last-of-type { margin-right: unset; } .main-menu-items a:nth-child(1), .main-menu-items a:nth-child(5) { font-weight: 500; } .main-menu-items a:nth-child(2) { font-weight: bold; } .main-menu-items a:nth-child(3) { font-weight: normal; } .main-menu-items a:nth-child(4) { font-weight: normal; } .main-menu-items a:nth-child(6) { font-weight: normal; } .main-menu-items a { text-decoration: none; color: #282626; text-transform: uppercase; font-size: 33px; line-height: 1; margin-right: 13px; } .menu-show .main-menu-items{ top: 48%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; opacity: 1; } .main-menu-items { width: 100vh; opacity: 0; max-width: none; justify-content: center; align-items: center; position: absolute; transform: rotate(-90deg) translateX(-50%); top: -140%; left: 50%; transform-origin: center left; z-index: 3; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .bottom-mono-gram { position: absolute; bottom: 0; left: 0; right: 0; z-index: 3; } .bottom-mono-gram img { width: 100%; } .main-menu-bar { position: fixed; z-index: 500; top: 0; left: 0; right: 0; margin: 0 auto; height: 100%; content: ''; width: 49px; background-color: #b4b4b4; } .main-menu-bar:before { position: absolute; left: 0; right: 0; top: 0; bottom: 0; height: 100%; width: 100%; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0.5), rgba(254, 254, 254, 0.5) 40%, rgba(0, 0, 0, 0.5)), linear-gradient(to bottom, #b4b4b4, #b4b4b4); content: ''; z-index: 1; } /* # Site Footer ---------------------------------------------------------------------------------------------------- */ .form-bottoms a { color: #282626; } .event-override-messaging, .reservations-override-messaging { position: absolute; width: 100%; top: 0; left: -100%; z-index: 10; font-size: 20px; font-weight: 500; line-height: 1.44; letter-spacing: 0.02px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .submit-area-holder { opacity: 1; top: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .event-change .submit-area-holder, .reservation-change .submit-area-holder { opacity: 0; top: 20px; pointer-events: none; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .event-change .event-override-messaging, .reservation-change .reservations-override-messaging { left: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .form-bottoms { position: relative; width: 100%; overflow: hidden; } .form-bottoms .form-full { left: 0%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .event-change .form-bottoms .form-full, .reservation-change .form-bottoms .form-full { left: 100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .site-footer { position: relative; left: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .top-hat-logo { width: 100%; justify-content: center; align-items: center; margin-top: 19px; } .top-hat-logo a img { width: 100%; } .top-hat-logo a { width: 120px; margin: 0 auto; } .hobbs-footer-left, .hobbs-footer-right { height: 100vh; align-items: center; } .home .hobbs-footer-left, .home .hobbs-footer-right { z-index: 20; } .belize-link-area { margin-bottom: 56px; justify-content: center; } .belize-wordmark { width: 163px; } .belize-icon { width: 62px; margin-left: 3px; } .global-inner { width: 90%; margin: 0 auto; } .location { width: 491px; max-width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 63px; } .the-taps .location:last-of-type, .locations .location:last-of-type { margin-bottom: unset; } .location:last-of-type { margin-bottom: 50px; } .logo-address { width: calc(95% - 240px); margin-right: auto; align-items: center; } .logo-foot-inner { width: 100%; } .location-hours { width: 240px; } .sub-sections .location-hours.flex { align-items: center; } .location-hours-special-inner { width: 100%; } .location-hours { border-left: solid 3px #282626; } .logo-address img { width: 222px; max-width: 100%; margin-left: auto; margin-right: auto; margin-bottom: 13px; } .the-address { width: 100%; text-align: center; text-transform: uppercase; font-size: 15px; font-weight: 500; line-height: 1.33; letter-spacing: 0.35px; } .location-hour-set:last-of-type { border-bottom: unset; } .location-hour-set { padding-left: 5%; padding-top: 13px; padding-bottom: 13px; border-bottom: solid 3px #282626; align-items: center; } .days { width: 52px; text-align: left; font-size: 14px; font-weight: normal; line-height: 1; letter-spacing: 0.02px; text-transform: uppercase; } .hours { width: calc(100% - 52px); } .hour-set { width: calc(50% - 16px); font-size: 15px; font-weight: 500; line-height: 1; letter-spacing: 0.02px; } .hours img { width: 12px; margin: 0 auto; } .bottom-links { justify-content: center; align-items: center; } .bottom-link:hover { color: #ada1cd; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .bottom-link { text-transform: uppercase; text-decoration: none; line-height: 1; font-size: 15px; font-weight: 500; font-stretch: normal; font-style: normal; line-height: 1; letter-spacing: 0.35px; color: #282626; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .bottom-links span.narrow { font-weight: 500; font-size: 15px; line-height: 1; margin: 0 10px; } .bottom-links span.narrow:last-of-type { display: none; } form p { margin-bottom: unset; } form .label:not(.form-full-label) { transform: translateX(-31%) translateY(84%) rotate(-90deg); width: 56px; } form .label { position: absolute; background-color: #282626; z-index: 2; color: #fff; font-family: 'Titling Gothic FB Compressed'; font-size: 15px; font-weight: 500; letter-spacing: 1px; text-align: center; text-transform: uppercase; line-height: 1; padding: 4px 0 2px; } .footer-form form { display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .not-valid .label { background-color: #D09C9C; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; color: #282626; } .not-valid input, .not-valid textarea, .not-valid select { border-color: #D09C9C!important; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .form-half { width: 50%; position: relative; margin-bottom: 22px; } .form-full.select-label { margin-bottom: 22px; } .form-full select { width: 100%; color: #d8d8d8!important; outline: none!important; } .form-full select.selected { color: #282626!important; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .form-half input, .form-full select { height: 56px; border: 3px solid #282626; color: #282626; display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; align-items: center; padding-left: 25px; padding-top: 3px; font-weight: 500; padding-bottom: 0; text-transform: uppercase; background-color: #f1eee8; appearance: none; -webkit-appearance: none; } .form-full select { background-position: 98% center; background-repeat: no-repeat; background-size: 15px; background-image: url(/wp-content/themes/hobbs-brewing/assets/images-icons/arrow-down-tri.svg); } .form-full:not(.select-label) .label { padding: 5px 10px 2px; } .form-full textarea { background-color: #f1eee8; border: 3px solid #282626; color: #282626; padding: 40px 20px; font-size: 14px; font-weight: normal; line-height: 1.5; letter-spacing: 0.77px; height: 240px; } .form-full textarea, .form-half input, .form-full { width: 100%; position: relative; z-index: 1; border-radius: 0px; } .submit-area-holder { width: 100%; justify-content: flex-end; margin-top: 10px; position: relative; } .submit-area.done { pointer-events: none; } .submit-area.hidden { opacity: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; pointer-events: none; } .submit-area { margin-left: auto; align-items: center; opacity: 1; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .submit-area .wpcf7-submit { -webkit-appearance: none; appearance: none; border: 0; background-color: transparent; font-family: 'Titling Gothic FB Extended'; font-size: 17px; font-weight: 500; line-height: 1; letter-spacing: normal; text-transform: uppercase; padding: 0; cursor: pointer; } .ajax-loader, .screen-reader-response, .wpcf7-response-output, .wpcf7-not-valid-tip { display: none!important; } .submit-area:hover img { margin-right: 1px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .submit-area img { margin-right: 8px; position: relative; -moz-transition: all .2s ease; -webkit-transition: all .2s ease; -o-transition: all .2s ease; transition: all .2s ease; } .dot_loader.show { opacity: 1; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .dot_loader { position: absolute; right: 0; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); width: 143px; text-align: center; opacity: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; pointer-events: none; } .dot { display: inline-block; margin:0 5px; width:10px; height: 10px; border-radius: 50%; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; animation: 1s infinite dot; -webkit-animation: 1s infinite dot; -moz-animation: 1s infinite dot; -o-animation: 1s infinite dot; } .dot:nth-child(2) { animation-delay: .1s; -webkit-animation-delay: .1s } .dot:nth-child(3) { animation-delay: .2s; -webkit-animation-delay: .2s; } @keyframes dot { 0% {background-color:#f1eee8;} 30% {background-color:#f1eee8;} 50% {background-color: #E1B69C;} 70% {background-color:#f1eee8;} 100% {background-color:#f1eee8;} } @-webkit-keyframes dot { 0% {background-color:#f1eee8;} 30% {background-color:#f1eee8;} 50% {background-color: #E1B69C;} 70% {background-color:#f1eee8;} 100% {background-color:#f1eee8;} } @-moz-keyframes dot { 0% {background-color:#f1eee8;} 30% {background-color:#f1eee8;} 50% {background-color: #E1B69C;} 70% {background-color:#f1eee8;} 100% {background-color:#f1eee8;} } @-o-keyframes dot { 0% {background-color:#f1eee8;} 30% {background-color:#f1eee8;} 50% {background-color: #E1B69C;} 70% {background-color:#f1eee8;} 100% {background-color:#f1eee8;} } @-ms-keyframes dot { 0% {background-color:#f1eee8;} 30% {background-color:#f1eee8;} 50% {background-color: #E1B69C;} 70% {background-color:#f1eee8;} 100% {background-color:#f1eee8;} } /* # Media Queries ---------------------------------------------------------------------------------------------------- */ @media (max-width: 1400px) { .venues-title h1 { font-size: 18px; } .venues-title h1 span { font-size: 20px; padding-bottom: 1px; } } @media (max-width: 1250px) { .beers-beer-name { font-size: 25px; } .beer-style-line { font-size: 15px; } .belize-content-inner h1 { font-size: 65px; } .belize-long-copy { font-size: 18px; margin-bottom: 30px; } .belize-button-link { font-size: 30px; } } @media (min-width: 952px) { .the-taps .location-right-side .location-holder { height: 100vh; align-items: center; } .the-taps .location-right-side { width: 100%; position: relative; height: 100vh; } .safari .sliding-right { height: 600vh; } .menu-show .menu-bar-logo { top: 200%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; opacity: 0; } body.page-template-hobbs-home-page-template { height: 100%; overflow: hidden; } .home-sliding { height: 100vh; overflow: hidden; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .menu-inner-contents { position: absolute; top: 50%; height: calc(100vh - 99px); transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); left: 0; right: 0; margin: 0 auto; z-index: 40; overflow: hidden; } .menu-bar-logo { width: 34vw; max-width: none; position: absolute; transform: rotate(-90deg) translateX(-50%); top: 50%; left: 48%; transform-origin: center left; z-index: 3; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .sliding-right { margin-left: auto; flex-direction: column-reverse; } .back-bar { display: none; } } .mobile-toggler { display: block; } @media (max-width: 951px) { .event-change .event-override-messaging, .reservation-change .reservations-override-messaging, .form-bottoms a { color: #f1eee8; font-size: 16px; } .location-click img.section-name-mobile { display: none!important; } .belize-content-inner { width: 518px; margin: 0 auto; max-width: 90%; } .belize, .belize-content-holder { min-height: unset; } .belize-image { height: 500px; } .belize-image .bg { width: 100%; } .belize-content-holder { padding: 75px 0 50px; } .location-click.right-side { align-items: flex-end; } .location-click.right-side .location-holder-sub-section { margin-bottom: 5%; } .location-click { align-items: flex-start; } .location-click .location-holder-sub-section { margin-top: 5%; } .location-holder-sub-section .location-image { display: none!important; } .hobbs-footer-left { margin-bottom: 25px; } .backer { align-items: center; padding-left: 2.5%; color: #d8d8d8; text-transform: uppercase; font-size: 29px; line-height: 1; font-weight: normal; cursor: pointer; } .show-sub-section .back-bar { top: 35px; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .back-bar { top: -50px; left: 0; width: 100%; z-index: 400; position: fixed; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .backer img { position: relative; transform: rotate(180deg); -ms-transform: rotate(180deg); -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -o-transform: rotate(180deg); width: 15px; margin-right: 4px; } .back-bar { background-color: #282626; padding: 5px 0; } .sub-sections { position: fixed; top: 35px; left: 100%; height: 100%; z-index: 200; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .show-sub-section .sub-sections { left: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .home-sliding { left: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .sub-sections .section-slide { display: none; } .sub-sections .section-slide.active { display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; } .sub-sections .sliding-left .section-slide, .sub-sections .sliding-right .section-slide { top: unset; position: relative; height: 50vh; } .sub-sections .sliding-right, .sub-sections .sliding-left { position: relative; width: 100%; } .location-stick, .logo-stick { position: relative; } .locations .global-left, .locations .global-right { min-height: auto; } .back-button-beers { display: block!important; } .beers-detail-holder-inner { position: unset; } .beers-page .global-right { position: fixed; right: -100%; top: 35px; height: calc(100% - 35px); -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; z-index: 200; } .hobbs-beer-detail { height: calc(100vh - 35px)!important; padding: 50px 0 100px; display: none; width: 100%; position: absolute; top: 0; left: 0; } .hobbs-beer-detail.active { display: block; } .beers-area-image { display: none!important; } .single-venues .venues-right .global-inner { width: 545px; } .single-venues .venues-title, .single-venues .venue-text { width: calc(95% - 45px); } .venues-right-abs { width: 45px; } .main-menu-items { width: 100%; opacity: 1; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } body .menu-show .main-menu-items { left: 0!important; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; text-align: left; padding-left: 2.5%; } .menu-show .menu-bar-logo { left: -100%; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; } .event { width: 650px; max-width: 100%; margin-left: auto; margin-right: auto; } .event-listing .global-left { display: none; } .form-half input, .form-full textarea, .form-full select { border-left: unset; border-right: unset; } .bottom-links { margin-top: 70px; } .submit-area .wpcf7-submit { color: #f1eee8; } .page-template-hobbs-venues-page-template-php .site-footer { margin-top: unset; } .site-footer { padding-top: 50px; background-color: #282626; margin-top: 100px; } .page-template-hobbs-beers-page-template .site-footer { margin-top: unset; } .location:last-of-type { margin-bottom: unset; } .item-row, .item-content, .date-and-title, .event-listing .event-name, .date-block, .date-and-specs .event-place-side, .event, .event-page-details, .address-area.mobile, .event-detail-block .event-place-side, .hobbs-beer, .beer-meta-dets, .det-beer-style { border-width: 2px!important; } .hobbs-footer-right { padding-bottom: 20px; } .site-footer .location-hours, .site-footer .location-hour-set { border-color: #f1eee8; border-width: 2px; } .hobbs-footer-left .location-holder { width: 500px; margin: 0 auto; max-width: 100%; color: #f1eee8; } .bottom-link, .bottom-links { color: #f1eee8; } .other-location-info { margin-top: 20px; } .location { width: 500px; max-width: 100%; } .location-holder-sub-section .location { max-width: 90%; margin: 0 auto; } .footer-form { width: 500px; margin: 0 auto; max-width: 100%; } .the-taps .global-left, .location-stick, .logo-stick { min-height: auto; } .hobbs-taps { width: 500px; max-width: 100%; margin-left: auto; margin-right: auto; } .location-menu-item { color: #282626!important; } .location-menu-images { display: none!important } .location-right-side { padding: 50px 0 75px; } .the-taps .global-right { order: 1; padding: 50px 0; } .the-taps .global-left { order: 2; padding-top: unset; } .section-name-mobile { position: absolute; top: 0; left: 0; right: 0; margin: 0 auto; height: 100vh; } .home-sliding .section-slide:not(div[data-slide="1"]){ height: 50vh; } .home-sliding .section-slide:not(div[data-slide="1"]):not(.right-side){ margin-bottom: 50px; } .section-slide .split-icon { width: 300px; } .section-slide.right-side .split-icon { left: 0; right: auto; } .section-slide .section-slide-inner { width: calc(100% - 432px); min-width: 50%; max-width: 50%; } .section-slide.right-side .section-slide-inner { margin-left: auto; margin-right: 10%; justify-content: flex-end; } .section-slide:not(.right-side) .section-slide-inner { margin-left: 10%; margin-right: auto; justify-content: flex-start; } .sliding-left .bg { width: 100%; } .main-menu-bar:before { background-image: linear-gradient(to left, rgba(255, 255, 255, 0.5), rgba(254, 254, 254, 0.5) 40%, rgba(0, 0, 0, 0.5)), linear-gradient(to left, #b4b4b4, #b4b4b4); } .mobile-toggler { display: none; } .loader-left { width: 100%!important; left: 0!important; } body .home-hero-name-slider, .loader-right, .home-logo, .bottom-mono-gram { display: none!important; } .at-home .menu-button, .menu-button { top: unset; width: 45px; height: 100%; right: 0; left: auto; background-color: #282626; color: #d8d8d8; display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; align-items: center; justify-content: center; } .menu-show .main-menu-items, .main-menu-items { top: 50%; justify-content: flex-start; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); left: 100%!important; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; left: auto; width: calc(100% - 45px); } .menu-bar-logo img { width: 100%; } .menu-bar-logo { left: 0; -moz-transition: all .4s ease; -webkit-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; position: absolute; top: 50%; transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -o-transform: translateY(-50%); z-index: 10; width: 400px; padding-left: 2.5%; display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; max-width: calc(90% - 45px); } .main-menu-bar { width: 100%; height: 35px; overflow: hidden; } .sliding-left, .sliding-right, .global-right, .global-left { width: 100%; } .home-logo-right { display: none; } .sliding-left > div.home-slide-right { height: auto; padding: 22px 0 50px; } .slider-holder, .venue-slide { position: relative; height: 500px!important; min-height: unset; } .sliding-left > div.home-slide-left, .sliding-left .bg { height: 500px; } .sliding-left .bg { margin-top: 35px; } .global-right.margin-right .global-inner { padding-right: unset; } .venues-right .global-inner { width: 500px; max-width: 90%; margin: 0 auto; } .slider-holder h1, .long-text.slider-holder h1 { font-size: 36px; } body { margin-top: 35px; } .hobbs-footer-left, .hobbs-footer-right { height: auto; } } @media (max-width: 720px) { .menu-bar-logo { width: 350px; } .main-menu-items a { font-size: 25px; } } @media (max-width: 600px) { .home-sliding .sliding-left .bg:before { display: none!important; } .bubble-more { display: none!important; } .locations { padding-top: 50px; } .belize-content-holder { padding: 50px 0; } .belize-content-inner h1 { font-size: 50px; } .belize-button-link img { width: 16px; margin-right: 8px; } .belize-button-link { font-size: 24px; } .belize-image, .belize-image .bg { height: 50vh; } .belize-image .bg { margin-top: 35px; } .link-top a { font-size: 18px; } .link-top a span { margin: 0 7px; } .l-bottom-text { font-size: 13px; margin-top: 5px; } .link-top a img { width: 19px; } .page-template-hobbs-venues-page-template-php .site-footer { margin-top: 30px; } .amenities { min-height: unset; } .slider-holder .arrow-left, .slider-holder .arrow-right { width: 27px; } .slider-holder .arrow-left { left: 2.5%; } .slider-holder .arrow-right { right: 2.5%; } .location-right-side { padding: 50px 0 65px; } .location-stick .location-right-side { padding: 0 0 50px; } .location-menu-item { margin-bottom: 4vh; font-size: 17vw; } .location-menu-item.skyline { letter-spacing: .6vw; } .top-hat-logo a { width: 107px; } .beer-graphic { width: 25%; } .hobbs-beer { padding: 11px 0; } .beers-beer-name { font-size: 23px; margin-bottom: 6px; } .beer-style-line { font-size: 14px; } .beer-name-graphic { width: 50%; } .beer-desc-inner { font-size: 14px; } .on-tap-now-text { font-size: 18px; margin-bottom: 4px; } .det-beer-style { font-size: 19px; } .det-beer-name { font-size: 34px; } .det-beer-name { font-size: 23px; } .tap-location .name { font-size: 15px; padding-top: 3px; width: calc(96% - 12px); } .tap-location .box { height: 14px; width: 12px; } .on-tap-now-inner { width: 221px; } .back-button-beers { left: 5%; cursor: pointer; } .buy-now { font-size: 15px; padding-top: 2px; height: 30px; } .venues-title h1 span { font-size: 16px; } .venues-title h1 span.title { font-size: 18px; } .venues-title h1 { margin-bottom: 19px; } .single-venues .venues-right .global-inner { max-width: 95%; margin-left: auto; margin-right: 0; } .single-venues .venues-title, .single-venues .venue-text { width: calc(98% - 30px); } .venues-right-abs { width: 30px; } .venue-top-hero-contents { font-size: 14px; } .venue-link-holder a { font-size: 11px; } .venue-link-holder a img { width: 15px; } .venue-top-hero-contents { width: 220px; } .amenity-line { font-size: 16px; margin-bottom: 19px; } .amenities-inner { padding-bottom: 60px; margin: 24px auto 75px; } .date-and-specs { width: 100%; } .event-render { padding-bottom: 0; } .event-listing .event-name { width: 100%; padding: 11px 0; order: 1; border-bottom: solid 3px #282626; } .event-listing .event-description { padding-right: 0; width: 100%; } .event-link { font-size: 14px; } .event-listing .event-description .event-description-blurb { font-size: 12px; } .date-and-specs .event-right-side.mobile { display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; border-left: unset; } .date-and-specs { order: 2; } .event-right-side.desktop { display: none!important; } .date-and-specs .event-place-side { border-right: solid 3px #282626; } .date-and-specs .event-place-side > div, .date-and-specs .event-price-side > div { width: 100%; } .date-and-specs .event-place-side, .date-and-specs .event-price-side { width: 50%; border-bottom: unset; align-items: center; display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; justify-content: center; } .brand { width: 65px; font-size: 17px; } .guest-taps .beer-name-holder { width: calc(100% - 65px); } .the-taps .global-right { padding: 50px 0 0 ; } .item-on-tap .abv span { font-size: 20px; } .to-go { font-size: 10px; height: 22px; } .beer-name-holder { font-size: 16px; } .hobbs-tap-title h2 { font-size: 16px; } .event-detail-block { align-items: unset; } .venues-right { padding: 25px 0 0; } .slider-holder h1, .long-text.slider-holder h1 { font-size: 23px; } .slider-holder, .venue-slide { height: 350px!important; } .sliding-left > div.home-slide-left, .sliding-left .bg { height: 50vh; } .venue-text ul, .venue-text ol, .venue-text p { margin-bottom: 14px; } .venue-text { font-size: 12px; } .venue-text p:first-of-type { font-size: 15px; } .event-detail-block .event-place-side { border-right: solid 3px #282626; } .event-detail-block .event-price-side { order: 2; } .event-detail-block .event-price-side, .event-detail-block .event-place-side { display: flex; display: -webkit-flex; display: -moz-flex; flex-wrap: wrap; -webkit-flex-wrap: wrap; align-items: center; justify-content: center; } .date-block { width: 33%; } .event-detail-block .event-place-side, .event-detail-block .event-price-side { width: 50%; } .event-page-details .event-detail-block { width: 66%; } .address-area.desktop { display: none; } .address-area.mobile { display: block; } .event-page-details { border-top: solid 3px #282626; } .form-half { width: 100%; margin-bottom: 12px; } .form-half.select-label { margin-bottom: 12px; } .form-full textarea { padding: 26px 20px; } .form-half input, .form-full select { height: 47px; font-size: 17px; padding-top: 1px; } form .label:not(.form-full-label) { width: 45px; font-size: 11px; } } @media (max-width: 510px) { .main-menu-items a { font-size: 20px; margin-right: 9px; } .item-content { font-weight: normal; font-size: 20px; } .lockup-image { width: 158px; max-width: 90%; } .item-name { width: 57px; font-size: 15px; min-height: 40px; } .item-row { margin-bottom: 25px; } .item-content { width: calc(100% - 57px); padding-left: 8px; padding-bottom: 4px; } .the-address { font-family: 'Titling Gothic FB Compressed'; font-size: 14px; } .logo-address img { margin-bottom: 8px; } .bottom-link { font-size: 13px; } .bottom-links span.narrow { margin: 0 6px; } .belize-icon { width: 51px; } .belize-wordmark { width: 128px; } .location-hours { width: 180px; } .hours { align-items: center; } .hour-set { font-size: 11px; } .logo-address { width: calc(95% - 180px); } .hours img { width: 9px; } .belize-link-area { margin-bottom: 36px; } .location { margin-bottom: 20px; } .the-address { font-size: 13px; } .logo-address { width: calc(95% - 188px); } .location-hours { width: 188px; } .location-hour-set { padding-top: 8px; padding-bottom: 8px; } .hour-set { font-size: 11px; } .days { font-size: 12px; width: 41px; } .hours { width: calc(100% - 41px); } } @media (max-width: 450px) { .main-menu-items a { font-size: 17px; } .osx .main-menu-items a { font-size: 18px; } } /* # Print Styles ---------------------------------------------------------------------------------------------------- */ @media print { *, *::before, *::after { background: transparent !important; box-shadow: none !important; color: #282626 !important; text-shadow: none !important; } a, a:visited { text-decoration: underline; } a[href]::after { content: " (" attr(href) ")"; } abbr[title]::after { content: " (" attr(title) ")"; } a[href^="javascript:"]::after, a[href^="#"]::after, .site-title > a::after { content: ""; } thead { display: table-header-group; } img, tr { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 2cm 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } blockquote, pre { border: 1px solid #999; page-break-inside: avoid; } .content, .content-sidebar { width: 100%; } button, input, select, textarea, .breadcrumb, .comment-edit-link, .comment-form, .comment-list .reply a, .comment-reply-title, .edit-link, .entry-comments-link, .entry-footer, .header-widget-area, .hidden-print, .home-top, .nav-primary, .nav-secondary, .post-edit-link, .sidebar { display: none !important; } .title-area { text-align: center; width: 100%; } .site-title > a { margin: 0; text-decoration: none; text-indent: 0; } .site-inner { padding-top: 0; position: relative; top: -100px; } .author-box { margin-bottom: 0; } h1, h2, h3, h4, h5, h6 { orphans: 3; page-break-after: avoid; page-break-inside: avoid; widows: 3; } img { page-break-after: avoid; page-break-inside: avoid; } blockquote, pre, table { page-break-inside: avoid; } dl, ol, ul { page-break-before: avoid; } }