#the-process{background:#f9f8f7 url(../img/bg.jpg) no-repeat center center;-webkit-background-size:cover;-moz-background-size:cover;-o-background-size:cover;background-size:cover;height:0;opacity:0;overflow:hidden;position:fixed;top:0;left:0;width:100%;z-index:1051;-webkit-transition:all 1.2s ease,opacity 1.8s ease;-moz-transition:all 1.2s ease,opacity 1.8s ease;-o-transition:all 1.2s ease,opacity 1.8s ease;-ms-transition:all 1.2s ease,opacity 1.8s ease;transition:all 1.2s ease,opacity 1.8s ease;-webkit-transform:translateY(100%) translateZ(0);-moz-transform:translateY(100%) translateZ(0);-ms-transform:translateY(100%) translateZ(0);-o-transform:translateY(100%) translateZ(0);transform:translateY(100%) translateZ(0)}body.show-must-go-on{overflow:hidden}#the-process.show-must-go-on{height:100%;opacity:1;-webkit-transform:translate(0,0);-moz-transform:translate(0,0);-ms-transform:translate(0,0);-o-transform:translate(0,0);transform:translate(0,0)}#the-process.show-must-go-on-overflow{overflow-x:hidden;overflow-y:auto}#the-process-descs{overflow:hidden}#the-process-image{margin:0 auto}#the-process-image-cntr{position:relative}.the-process-desc{opacity:0;position:absolute;width:80%;-webkit-transform:translateX(60%);-moz-transform:translateX(60%);-ms-transform:translateX(60%);-o-transform:translateX(60%);transform:translateX(60%);-webkit-transition:all .5s ease,opacity .8s ease;-moz-transition:all .5s ease,opacity .8s ease;-o-transition:all .5s ease,opacity .8s ease;-ms-transition:all .5s ease,opacity .8s ease;transition:all .5s ease,opacity .8s ease}.the-process-desc-in-view{opacity:1;-webkit-transform:translateX(0);-moz-transform:translateX(0);-ms-transform:translateX(0);-o-transform:translateX(0);transform:translateX(0)}#the-process h2{font-family:Anton,sans-serif;text-transform:uppercase}.the-process-desc p{font-family:caslon_antiqueregular,sans-serif;font-size:1.5vmax;font-weight:300;opacity:.8}.process-1{top:8%}.process-2{top:19%}.process-3{top:35%}.process-4{top:47.8%}.process-5{top:67.5%}.process-6{top:81.5%}.process-7{top:92.5%}#grains-anim{background:url(../img/grains-1.png) repeat-y center top,url(../img/grains-2.png) repeat-y center top;border-radius:42%/5%;border-top-left-radius:0;border-top-right-radius:0;height:6.266%;left:2.6%;margin:0 auto;position:absolute;right:0;top:0;width:35%;-webkit-animation:grainsAnim 1.8s linear infinite;animation:grainsAnim 1.8s linear infinite}@-webkit-keyframes grainsAnim{from{background-position:center 0,center 0}to{background-position:center 300px,center 250px}}@keyframes grainsAnim{from{background-position:center 0,center 0}to{background-position:center 300px,center 250px}}#pipe-animation-container{width:100%;height:100%;pointer-events:none;position:absolute;top:0}.pipe{position:absolute;height:calc(40px - .1%);z-index:-1}.pipe-y{height:auto;width:calc(40px - .1%)}.pipe-narrow{height:calc(30px - .1%)}.pipe-y.pipe-narrow{width:calc(30px - .1%)}.beer{background:url(../img/pipe-x.png) center center repeat;height:100%;position:absolute;width:0;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.pipe-y .beer{background-image:url(../img/pipe-y.png)}.beer-left{left:0;-webkit-animation:beerFlowLeft 2s linear infinite;animation:beerFlowLeft 2s linear infinite}.beer-right{right:0;-webkit-animation:beerFlowRight 2s linear infinite;animation:beerFlowRight 2s linear infinite}.beer-top{height:0;top:0;width:100%;-webkit-animation:beerFlowTop 2s linear infinite;animation:beerFlowTop 2s linear infinite}.beer-bottom{bottom:0;height:0;width:100%;-webkit-animation:beerFlowBottom 2s linear infinite;animation:beerFlowBottom 2s linear infinite}#the-tun-anim{height:.91%;left:25.9%;position:absolute;top:53.08%;width:49%;z-index:-1}#the-tun-anim img{display:block;height:100%;position:absolute;top:0;width:100%}#the-tun-anim img:first-child{opacity:1;-webkit-animation:theTunAnim1 2s ease alternate infinite;animation:theTunAnim1 2s ease alternate infinite}@-webkit-keyframes theTunAnim1{from{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,-5px,0);-moz-transform:translate3d(0,-5px,0);-ms-transform:translate3d(0,-5px,0);-o-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}}@keyframes theTunAnim1{from{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(0,-5px,0);-moz-transform:translate3d(0,-5px,0);-ms-transform:translate3d(0,-5px,0);-o-transform:translate3d(0,-5px,0);transform:translate3d(0,-5px,0)}}#the-tun-anim img:nth-child(2){-webkit-animation:theTunAnim2 2s ease alternate infinite;animation:theTunAnim2 2s ease alternate infinite}@-webkit-keyframes theTunAnim2{from{opacity:1}to{opacity:0}}@keyframes theTunAnim2{from{opacity:1}to{opacity:0}}#the-tun-anim img:nth-child(3){-webkit-animation:theTunAnim3 2s ease alternate infinite;animation:theTunAnim3 2s ease alternate infinite;-webkit-animation-delay:1.7s;animation-delay:1.7s}@-webkit-keyframes theTunAnim3{0%{-webkit-transform:translate3d(0,-4px,0);-moz-transform:translate3d(0,-4px,0);-ms-transform:translate3d(0,-4px,0);-o-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}100%{-webkit-transform:translate3d(0,1px,0);-moz-transform:translate3d(0,1px,0);-ms-transform:translate3d(0,1px,0);-o-transform:translate3d(0,1px,0);transform:translate3d(0,1px,0)}}@keyframes theTunAnim3{0%{-webkit-transform:translate3d(0,-4px,0);-moz-transform:translate3d(0,-4px,0);-ms-transform:translate3d(0,-4px,0);-o-transform:translate3d(0,-4px,0);transform:translate3d(0,-4px,0)}100%{-webkit-transform:translate3d(0,1px,0);-moz-transform:translate3d(0,1px,0);-ms-transform:translate3d(0,1px,0);-o-transform:translate3d(0,1px,0);transform:translate3d(0,1px,0)}}#beer-drop-anim,#beer-drop-anim-2{background:url(../img/beer-drop.png) no-repeat scroll center top -52px;background-size:100% auto;height:2.2%;left:-3.4%;margin:0 auto;position:absolute;right:0;top:89.85%;width:6%}.beer-drop-anim-run{-webkit-animation:beerDropAnim 2s cubic-bezier(1,0,.8,.03) infinite;animation:beerDropAnim 2s cubic-bezier(1,0,.8,.03) infinite;-webkit-animation-delay:20ms;animation-delay:20ms}#beer-drop-anim.beer-drop-anim-run{-webkit-animation-delay:1.02s;animation-delay:1.02s}@-webkit-keyframes beerDropAnim{from{background-position:center -52px}to{background-position:center bottom -50px}}@keyframes beerDropAnim{from{background-position:center -52px}to{background-position:center bottom -50px}}.valve{position:absolute;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.valve-animation{-webkit-animation:valveRotate 2.1s ease forwards;animation:valveRotate 2.1s ease forwards}@-webkit-keyframes valveRotate{from{-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(965deg);-moz-transform:rotate(965deg);-ms-transform:rotate(965deg);-o-transform:rotate(965deg);transform:rotate(965deg)}}@keyframes valveRotate{from{-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}to{-webkit-transform:rotate(965deg);-moz-transform:rotate(965deg);-ms-transform:rotate(965deg);-o-transform:rotate(965deg);transform:rotate(965deg)}}@-webkit-keyframes beerFlowLeft{from{background-position:0 0}to{background-position:135px 0}}@keyframes beerFlowLeft{from{background-position:0 0}to{background-position:135px 0}}@-webkit-keyframes beerFlowRight{from{background-position:0 0}to{background-position:-135px 0}}@keyframes beerFlowRight{from{background-position:0 0}to{background-position:-135px 0}}@-webkit-keyframes beerFlowTop{from{background-position:0 0}to{background-position:0 135px}}@keyframes beerFlowTop{from{background-position:0 0}to{background-position:0 135px}}@-webkit-keyframes beerFlowBottom{from{background-position:0 0}to{background-position:0 -135px}}@keyframes beerFlowBottom{from{background-position:0 0}to{background-position:0 -135px}}#pipe-pointer-1{background:url(../img/pointer.png) no-repeat bottom center;height:.25%;left:39.43%;position:absolute;top:28.78%;width:1.75%}.pipe-pointer-1-anim-run{-webkit-animation:pipeAnim1 1.1s ease forwards;animation:pipeAnim1 1.1s ease forwards}@-webkit-keyframes pipeAnim1{0%{-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}66%{-webkit-transform:rotate(265deg);-moz-transform:rotate(265deg);-ms-transform:rotate(265deg);-o-transform:rotate(265deg);transform:rotate(265deg)}90%{-webkit-transform:rotate(210deg);-moz-transform:rotate(210deg);-ms-transform:rotate(210deg);-o-transform:rotate(210deg);transform:rotate(210deg)}100%{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}}@keyframes pipeAnim1{0%{-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}66%{-webkit-transform:rotate(265deg);-moz-transform:rotate(265deg);-ms-transform:rotate(265deg);-o-transform:rotate(265deg);transform:rotate(265deg)}90%{-webkit-transform:rotate(210deg);-moz-transform:rotate(210deg);-ms-transform:rotate(210deg);-o-transform:rotate(210deg);transform:rotate(210deg)}100%{-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg);transform:rotate(180deg)}}#pipe-pointer-2{background:url(../img/pointer-2.png) no-repeat bottom center;height:.38%;left:9%;position:absolute;top:45.94%;width:2.65%;-webkit-transform:rotate(30deg);-moz-transform:rotate(30deg);-ms-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg)}.pipe-pointer-2-anim-run{-webkit-animation:pipeAnim2 1.1s ease forwards;animation:pipeAnim2 1.1s ease forwards}@-webkit-keyframes pipeAnim2{0%{-webkit-transform:rotate(30deg);-moz-transform:rotate(30deg);-ms-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg)}66%{-webkit-transform:rotate(250deg);-moz-transform:rotate(250deg);-ms-transform:rotate(250deg);-o-transform:rotate(250deg);transform:rotate(250deg)}90%{-webkit-transform:rotate(200deg);-moz-transform:rotate(200deg);-ms-transform:rotate(200deg);-o-transform:rotate(200deg);transform:rotate(200deg)}100%{-webkit-transform:rotate(160deg);-moz-transform:rotate(160deg);-ms-transform:rotate(160deg);-o-transform:rotate(160deg);transform:rotate(160deg)}}@keyframes pipeAnim2{0%{-webkit-transform:rotate(30deg);-moz-transform:rotate(30deg);-ms-transform:rotate(30deg);-o-transform:rotate(30deg);transform:rotate(30deg)}66%{-webkit-transform:rotate(250deg);-moz-transform:rotate(250deg);-ms-transform:rotate(250deg);-o-transform:rotate(250deg);transform:rotate(250deg)}90%{-webkit-transform:rotate(200deg);-moz-transform:rotate(200deg);-ms-transform:rotate(200deg);-o-transform:rotate(200deg);transform:rotate(200deg)}100%{-webkit-transform:rotate(160deg);-moz-transform:rotate(160deg);-ms-transform:rotate(160deg);-o-transform:rotate(160deg);transform:rotate(160deg)}}#pipe-pointer-3{background:url(../img/pointer.png) no-repeat bottom center;height:.25%;left:33.9%;position:absolute;top:80%;width:1.75%}#beerhole-1{height:1.1%;left:53.4%;position:absolute;top:20.3%;width:9.7%;z-index:-1}#beerhole-2{height:1.2%;left:53.4%;position:absolute;top:36.4%;width:9.7%;z-index:-1}#the-steam{height:8.91%;position:absolute;top:31.2%;width:100%;z-index:-1}#the-steam img{display:block;position:absolute;width:100%;-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}#the-steam img:nth-child(1){-webkit-animation:steamAnim1 4s linear alternate infinite;animation:steamAnim1 4s linear alternate infinite}#the-steam img:nth-child(2){-webkit-animation:steamAnim2 3.8s linear alternate infinite;animation:steamAnim2 3.8s linear alternate infinite}#the-steam img:nth-child(3){-webkit-animation:steamAnim3 3.8s linear alternate infinite;animation:steamAnim3 3.8s linear alternate infinite}#the-steam img:nth-child(4){-webkit-animation:steamAnim4 3.9s linear alternate infinite;animation:steamAnim4 3.9s linear alternate infinite}#the-steam img:nth-child(5){-webkit-animation:steamAnim2 4s linear alternate infinite;animation:steamAnim2 4s linear alternate infinite}#the-steam img:nth-child(6){-webkit-animation:steamAnim3 3.8s linear alternate infinite;animation:steamAnim3 3.8s linear alternate infinite}#the-steam img:nth-child(7){-webkit-animation:steamAnim4 3.8s linear alternate infinite;animation:steamAnim4 3.8s linear alternate infinite}#the-steam img:nth-child(8){-webkit-animation:steamAnim1 3.9s linear alternate infinite;animation:steamAnim1 3.9s linear alternate infinite}@-webkit-keyframes steamAnim1{from{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(15px,0,2px);-moz-transform:translate3d(15px,0,2px);-ms-transform:translate3d(15px,0,2px);-o-transform:translate3d(15px,0,2px);transform:translate3d(15px,0,2px)}}@keyframes steamAnim1{from{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}to{-webkit-transform:translate3d(15px,0,2px);-moz-transform:translate3d(15px,0,2px);-ms-transform:translate3d(15px,0,2px);-o-transform:translate3d(15px,0,2px);transform:translate3d(30px,0,2px)}}@-webkit-keyframes steamAnim2{from{-webkit-transform:translate3d(0,16px,0);-moz-transform:translate3d(0,16px,0);-ms-transform:translate3d(0,16px,0);-o-transform:translate3d(0,16px,0);transform:translate3d(0,16px,0)}to{-webkit-transform:translate3d(8px,4px,-10px);-moz-transform:translate3d(8px,4px,-10px);-ms-transform:translate3d(8px,4px,-10px);-o-transform:translate3d(8px,4px,-10px);transform:translate3d(8px,4px,-10px)}}@keyframes steamAnim2{from{-webkit-transform:translate3d(0,16px,0);-moz-transform:translate3d(0,16px,0);-ms-transform:translate3d(0,16px,0);-o-transform:translate3d(0,16px,0);transform:translate3d(0,30px,0)}to{-webkit-transform:translate3d(8px,4px,-10px);-moz-transform:translate3d(8px,4px,-10px);-ms-transform:translate3d(8px,4px,-10px);-o-transform:translate3d(8px,4px,-10px);transform:translate3d(8px,4px,-10px)}}@-webkit-keyframes steamAnim3{from{-webkit-transform:translate3d(-12px,-6px,0);-moz-transform:translate3d(-12px,-6px,0);-ms-transform:translate3d(-12px,-6px,0);-o-transform:translate3d(-12px,-6px,0);transform:translate3d(-12px,-6px,0)}to{-webkit-transform:translate3d(0,2px,0);-moz-transform:translate3d(0,2px,0);-ms-transform:translate3d(0,2px,0);-o-transform:translate3d(0,2px,0);transform:translate3d(0,2px,0)}}@keyframes steamAnim3{from{-webkit-transform:translate3d(-12px,-6px,0);-moz-transform:translate3d(-12px,-6px,0);-ms-transform:translate3d(-12px,-6px,0);-o-transform:translate3d(-12px,-6px,0);transform:translate3d(-28px,-19px,0)}to{-webkit-transform:translate3d(0,2px,0);-moz-transform:translate3d(0,2px,0);-ms-transform:translate3d(0,2px,0);-o-transform:translate3d(0,2px,0);transform:translate3d(0,2px,0)}}@keyframes steamAnim4{from{-webkit-transform:translate3d(6px,0,-6px);-moz-transform:translate3d(6px,0,-6px);-ms-transform:translate3d(6px,0,-6px);-o-transform:translate3d(6px,0,-6px);transform:translate3d(12px,0,-6px)}to{-webkit-transform:translate3d(-4px,2px 0);-moz-transform:translate3d(-4px,2px 0);-ms-transform:translate3d(-4px,2px 0);-o-transform:translate3d(-4px,2px 0);transform:translate3d(-8px,8px 0)}}@media (max-width:991px){#the-process-image-col{overflow:hidden;text-align:center}#the-process-image-cntr{display:inline-block;margin-bottom:-10px;position:relative}.the-proces-buttons{height:100%;position:absolute;text-align:left;width:100%}.btn-pin{border:0;border-radius:0;-webkit-box-shadow:none;box-shadow:none;outline:0;position:absolute;z-index:100;-webkit-animation-duration:1s;animation-duration:1s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;animation-iteration-count:infinite;-webkit-animation-iteration-count:infinite;-webkit-animation-name:pulse;animation-name:pulse}@-webkit-keyframes pulse{0%{-webkit-transform:scale(1)}40%{-webkit-transform:scale(1.1)}50%{-webkit-transform:scale(1)}100%{-webkit-transform:scale(1)}}@keyframes pulse{0%{transform:scale(1)}40%{transform:scale(1.1)}50%{transform:scale(1)}100%{transform:scale(1)}}.btn-pin-1{left:60.5%;top:7.8%}.btn-pin-2{left:30.5%;top:19.19%}.btn-pin-3{left:68.2%;top:35.6%}.btn-pin-4{left:48%;top:51.9%}.btn-pin-5{left:82%;top:67.6%}.btn-pin-6{left:73%;top:80.2%}.btn-pin-7{left:43%;top:86%}.btn-pin:focus,.btn-pin:hover{border:0;outline:0;text-decoration:none}}@media (max-width:850px){#the-process-image-cntr{width:100%}}@media (max-width:609px){#the-process-image-cntr{width:100%}}@media (min-width:1550px){#the-process-image-col{text-align:center}#the-process-image-cntr{display:inline-block;position:relative}}@media (max-width:1400px) and (min-width:769px){.pipe{height:calc(20px - .1%)}.pipe-y{width:calc(23px - .1%)}.pipe-y.pipe-narrow{width:calc(20px - .1%)}}@media (max-width:991px){.beer{background-size:auto 100%!important;height:100%!important;width:100%!important}#beer-drop-anim-2{-webkit-animation:beerDropAnim 2s cubic-bezier(1,0,.8,.03) infinite;animation:beerDropAnim 2s cubic-bezier(1,0,.8,.03) infinite;-webkit-animation-delay:20ms;animation-delay:20ms}}@media (max-width:460px){.pipe{height:calc(15px - .1%)}.pipe-y{width:calc(15px - .1%)}.pipe-y.pipe-narrow{width:calc(10px - .1%)}}