/* -------------------------------------------------------- Layout -------------------------------------------------------------- */ * { margin: 0px; padding: 0px; outline-style: none; } #site { position: relative; width: 100%; height: 100%; transform: translate3d(0px, 0px, 0px);} html, body { font-family: 'TradeGothicNo.18-Condensed', Verdana, sans-serif !important; font-size: 16px; color: #fff; line-height: 21px; min-height: 100%; height: 100%; text-transform: uppercase; overflow: hidden !important;} body { background: transparent !important;} a, a:link, a:active, a:visited { color: #fff; border-bottom: 1px solid #fff; text-decoration: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } a:hover, a:focus { color: #d20630 !important; border-bottom: 1px solid #d20630; text-decoration: none !important;} a.info_link, a.info_link:link, a.info_link:active, a.info_link:visited { color: #d20630 !important; border-bottom: 0px solid #fff; font-size: 13px; display: inline-block; margin-top: 5px; text-transform: lowercase; } a.info_link:hover, a.info_link:focus { color: #000 !important; text-decoration: none !important;} h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0; font-weight: bold; color: #d20630; text-transform: uppercase; } h1 { font-size: 32px; line-height: 32px; margin-bottom: 30px;} h2 { font-size: 18px; line-height: 35px;} #content h1 { margin-bottom: 20px; } h1.padding_top { padding-top: 50px;} #content ol,#content ul { margin: 0 0 10px 17px; } #content p { margin: 0 0 20px 0; } #content p ~ ul { margin: -20px 0 10px 17px; } #content iframe { max-width: 100% !important; } #print_header {display: none;} .margin_top { margin-top: 30px;} .margin_bottom { margin-bottom: 30px;} .margin_right { margin-right: 30px; } .no_margin { margin: 0 0 !important; } .pad_left { padding-left: 20px;} .pad_right { padding-right: 20px;} .pad_bottom { padding-bottom: 25px;} .pad_bottom_small { padding-bottom: 5px;} .pad_all { padding: 20px;} .pad_title { padding: 15px 10px 15px 20px;} .width_100 { width: 100% !important; } .width_50 { width: 49%; } .width_33 { width: 32%; } .fixed { position: fixed; } .absolute { position: absolute; } .relative { position: relative; } .container { position: relative; z-index: 2; } .valign { display: table-cell; vertical-align: middle; width: 100%; height: 100%; } .fancybox_img.left { margin-top: 4px; margin-right: 20px; margin-bottom: 15px; } .fancybox_img.right { margin-top: 4px; margin-left: 20px; margin-bottom: 15px; } .inline_block { display: inline-block !important; zoom: 1;} .left { float: left; } .right { float: right; } ::selection { background: #d20630; color: #fff;} .pointer { cursor: pointer; } /* -------------------------------------------------------- Fonts -------------------------------------------------------------- */ @font-face { font-family:'TradeGothicNo.18-Condensed'; src: url('fonts/TradeGothicNo.18-Condensed_gdi.eot'); src: url('fonts/TradeGothicNo.18-Condensed_gdi.eot?#iefix') format('embedded-opentype'), url('fonts/TradeGothicNo.18-Condensed_gdi.woff') format('woff'), url('fonts/TradeGothicNo.18-Condensed_gdi.ttf') format('truetype'), url('fonts/TradeGothicNo.18-Condensed_gdi.svg#TradeGothicNo.18-Condensed') format('svg'); font-weight: 400; font-style: normal; font-stretch: expanded; unicode-range: U+0020-2122; } @font-face { font-family:'TradeGothicNo.18-Condensed'; src: url('fonts/TradeGothicNo.20-CondBold_gdi.eot'); src: url('fonts/TradeGothicNo.20-CondBold_gdi.eot?#iefix') format('embedded-opentype'), url('fonts/TradeGothicNo.20-CondBold_gdi.woff') format('woff'), url('fonts/TradeGothicNo.20-CondBold_gdi.ttf') format('truetype'), url('fonts/TradeGothicNo.20-CondBold_gdi.svg#TradeGothicNo.20-CondBold') format('svg'); font-weight: bold; font-style: normal; font-stretch: expanded; unicode-range: U+0020-2122; } .font_normal { font-family: 'robotoregular'; } .font_upper { text-transform: uppercase; } .fw_bold { font-weight: bold; } .fs_11 { font-size: 11px;} .fs_13 { font-size: 13px;} .fs_14 { font-size: 14px;} .fs_15 { font-size: 15px;} .fs_16 { font-size: 16px;} .fs_19 { font-size: 19px;} .fs_24 { font-size: 24px;} .fs_25 { font-size: 25px; line-height: 30px; } .fs_28 { font-size: 28px; line-height: 34px; } .fs_40 { font-size: 40px; line-height: 45px; } .lh_70 { line-height: 70px; } .lh_50 { line-height: 50px; } .lh_35 { line-height: 35px; } .va_bottom { vertical-align: text-bottom; } /* -------------------------------------------------------- Icons -------------------------------------------------------------- */ .flex-direction-nav { list-style-type: none; margin: 0; } .flex-direction-nav li { float: left; } .flex-prev { display: block; width: 20px; height: 20px; background: url(/pics/bg_sprite.png) left top no-repeat; speak: none; background-position:0px -60px; margin-right: 5px;} .flex-next { display: block; width: 20px; height: 20px; background: url(/pics/bg_sprite.png) left top no-repeat; speak: none; background-position:0px -40px; } /* -------------------------------------------------------- Colors -------------------------------------------------------------- */ .bg_red { background-color: #d20630; } .bg_white { background-color: #fff; } .txt_white { color: #fff !important; } .txt_black { color: #222 !important; } .txt_red { color: #d20630 !important; } /* -------------------------------------------------------- Header -------------------------------------------------------------- */ header { position: fixed; top: 0; left: 0; width: 100%; height: 140px; overflow: hidden; z-index: 900;} header .bg_logo { height: 115px; background: url(/pics/bg_logo.png) bottom center no-repeat; } header nav { vertical-align: top; margin: 0px 0px 0px 0px;} header ul { list-style-type: none; margin: 0;} header nav ul li { height: 80px; float: left; margin: 0; background: none; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.2s ease; } header nav ul.left li { margin-right: 60px;} header nav ul.right li { margin-left: 60px; } header nav ul.languages { margin-left: 40px; } header nav ul.languages li { margin-left: 20px; } header nav ul li.current, header nav ul li:hover { } header nav ul li a, header nav ul li a:link, header nav ul li a:visited, header nav ul li a:active { color: #fff; line-height: 80px; border: none;} header a:hover, header li.current a { color: #d20630 !important; text-decoration: none; border: none;} .header_home_link { position: absolute; left: 50%; top: 0; margin-left: -87px; width: 174px; height: 120px; border-bottom: none!important;} /* -------------------------------------------------------- Mobilenavigatie -------------------------------------------------------------- */ #mobile_menu_container { display: none; } #mobile_menu .search_submit { position: absolute; padding: 10px; width: 20px; height: 20px; top: 15px; right: 10px; background-color: #004489; cursor: pointer;} #menu_toggle { position: absolute; width: 40px; height: 30px; top: 35px; right: 20px; /*margin: 50px auto;*/ -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .5s ease-in-out; -moz-transition: .5s ease-in-out; -o-transition: .5s ease-in-out; transition: .5s ease-in-out; cursor: pointer;} #menu_toggle.hide { display: none !important; } #menu_toggle span { display: block; position: absolute; height: 5px; width: 100%; background: #fff; border-radius: 5px; opacity: 1; left: 0; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -o-transform: rotate(0deg); transform: rotate(0deg); -webkit-transition: .25s ease-in-out; -moz-transition: .25s ease-in-out; -o-transition: .25s ease-in-out; transition: .25s ease-in-out;} #menu_toggle.open span { background: #fff;} #menu_toggle span:nth-child(1) { top: 0px;} #menu_toggle span:nth-child(2),#menu_toggle span:nth-child(3) { top: 11px;} #menu_toggle span:nth-child(4) { top: 22px;} #menu_toggle.open span:nth-child(1) { top: 18px; width: 0%; left: 50%;} #menu_toggle.open span:nth-child(2) { -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);} #menu_toggle.open span:nth-child(3) { -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);} #menu_toggle.open span:nth-child(4) { top: 18px; width: 0%; left: 50%;} /* -------------------------------------------------------- Content -------------------------------------------------------------- */ .step, .beer_step { position: relative; display: table; width: 100%; height: 100%; padding: 150px 0 40px 0; overflow: hidden; background: transparent !important; } section.step_age { position: fixed; display: table; width: 100%; height: 100%; padding: 150px 0 40px 0; overflow: hidden; z-index: 10; } .full_bg { position: absolute; top: 0; display: block; width: 100%; height: 100%; z-index: 1; background-repeat: no-repeat ; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-animation-duration: 20s; animation-duration: 20s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; /* -webkit-animation-name: move; animation-name: move; */ animation-direction: alternate; -moz-animation-direction: alternate; -webkit-animation-direction: alternate; -o-animation-direction: alternate; -ms-transform-origin: bottom center; transform-origin: bottom center; -webkit-transform-origin: bottom center; -o-transform-origin: bottom center; -moz-transform-origin: bottom center; } .fp-section.active .full_bg{ -webkit-animation-name: move; animation-name: move; } .mobile-visitor .fp-section.active .full_bg{-webkit-animation-name: none; animation-name: none;} .slide .half_bg { display: block; width: 100%; height: 100%; z-index: 1; background-repeat: no-repeat ; background-position: center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; -webkit-animation-duration: 20s; animation-duration: 20s; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-name: move; /*animation-name: move;*/ animation-direction: alternate; -moz-animation-direction: alternate; -webkit-animation-direction: alternate; -o-animation-direction: alternate; -ms-transform-origin: bottom center; transform-origin: bottom center; -webkit-transform-origin: bottom center; -o-transform-origin: bottom center; -moz-transform-origin: bottom center; } .mobile-visitor .slide .half_bg {-webkit-animation-name: none; animation-name: none;} .btn, .btn:link, .btn:visited { position: relative; display: inline-block; width: auto; height: 30px; padding: 0px 30px; text-align: center; border: 1px solid #fff; color: #fff; font-size: 14px; line-height: 30px;} .btn:hover { background: #fff; color: #d20630;} .controls { padding-top: 10px; border-top: 1px solid rgba(255,255,255,0.4); } .controls .prev, .controls .next { width: 25px; height: 22px; cursor: pointer;} .controls .prev { background: url(/pics/bg_prev.png) right top no-repeat;} .controls .next { background: url(/pics/bg_next.png) left top no-repeat;} .controls .prev:hover { -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-iteration-count: 2; animation-iteration-count: 2; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: MoveSideR; animation-name: MoveSideR; } .controls .next:hover { -webkit-animation-duration: 800ms; animation-duration: 800ms; -webkit-animation-iteration-count: 2; animation-iteration-count: 2; -webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-name: MoveSideL; animation-name: MoveSideL; } .carousel_controls { position: relative; margin-top: -55px; z-index: 999;} .carousel_controls .prev_container, .carousel_controls .next_container { width: 42%; border-bottom: 1px solid rgba(255,255,255,0.4); } .carousel_controls .prev, .carousel_controls .next { display: inline-block; height: 22px; cursor: pointer; } .carousel_controls .prev:hover, .carousel_controls .next:hover { color: #d20630; } .carousel_controls .prev { padding-left: 20px; background: url(/pics/bg_arrow_left.png) left center no-repeat; } .carousel_controls .next { padding-right: 20px; background: url(/pics/bg_arrow_right.png) right center no-repeat; } .carousel_controls .prev_container { text-align: right;} .carousel_controls .next_container { } .carousel_controls .middle_container { width: 16%;} .controls .play_control { margin-left: 50px; width: 24px; height: 24px; background: url(/pics/ico_pause.png) center center no-repeat; cursor: pointer; margin-left: 40%; } .controls .play_control.play { background: url(/pics/ico_play.png) center center no-repeat; } #beer_content { margin-top: 100px; } /* -------------------------------------------------------- Agecheck -------------------------------------------------------------- */ #agecheck {display: none;} #agecheck.show { display: block; } .agecheck { margin-top: 200px; } .agecheck_glass { top: 0; left: -70px; } .agecheck_bottle { top: 50px; left: 160px; } .agecheck .select { width: 100%; height: 120px; font-size: 80px; color: #fff; text-align: center; background: rgba(255,255,255,0.08); border: none; border-bottom: 1px solid #fff; } /* -------------------------------------------------------- Fixtures -------------------------------------------------------------- */ .glass { top: 50%; left: 50%; z-index: 999; } .glass.lansmenneke { margin-top: -271px; margin-left: -150px; } .bottle {} .bottle.lansmenneke { } .scroll { position: relative; bottom: 30px; left: 50%; margin-left: -11px; width: 22px; height: 32px; opacity: 1; background: url(/pics/bg_scroll.png) left top no-repeat; } .scroll span { position: absolute; top: 12px; left: 10px; margin: 0; padding: 0; width: 2px; height: 6px; background: #c7c7c7; opacity: 0; border-radius: 50%; -webkit-animation: scrollWheel 1.2s linear infinite; -moz-animation: scrollWheel 1.2s linear infinite; -o-animation: scrollWheel 1.2s linear infinite; animation: scrollWheel 1.2s linear infinite;} .scroll.end { opacity: 0; } #fixed_container { display: none; top: 50%; left: 50%; z-index: 5; } #fixed_container.show { display: block;} #fixed_container.absolute { top: 150%; } #glass_container { position: relative; margin: -246px 0 0 -150px; z-index: 999; } .circle_overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: url(/pics/bg_circle_overlay.png) no-repeat; background-size: cover; z-index: 2; } .circle_overlay.z1 { z-index: 1; } /* -------------------------------------------------------- Beer carousel -------------------------------------------------------------- */ #beer_carousel { position: relative; width: 50%; margin: 0 auto; height: 550px; list-style-type: none;} .lt-ie9 #beer_carousel { left: 50px; } #beer_carousel .beer_item { width: 300px; height: 534px; margin: 0; padding: 0; } #beer_carousel .beer_bottle .logo { position: absolute; top: 40px; left: 0; } #fixed_container_beer { position: fixed; width: 100%; height: 100%; display: block; top: 0; left: 0; z-index: -1; } #fixed_container_beer .beer_bottle { position: absolute; top: 50%; left: 50%; width: 300px; height: 534px; margin: -243px 0 0 -153px; padding: 0; z-index: 2; display: none; } #fixed_container_beer .beer_bottle.show { display: block;} #fixed_container_beer .beer_bottle .logo { position: absolute; top: 40px; left: 0; } #fixed_container_beer .beer_bottle.show .logo { } .eigenschap { position: absolute; top: 50%; left: 50%; width: 150px; height: 50px; text-align: center; font-size: 22px; line-height: 30px; } .eigenschap.pos_1 { margin-left: -330px; margin-top: 60px; } .eigenschap.pos_2 { margin-left: 150px; margin-top: 170px; } .eigenschap.pos_3 { margin-left: -330px; margin-top: 60px; } .eigenschap.pos_4 { margin-left: 150px; margin-top: 170px; } .eigenschap.pos_5 { margin-left: -330px; margin-top: 60px; } .eigenschap_line { position: absolute; top: 50%; left: 50%; width: 2px; height: 100px; background-color: #666; z-index: 1000; -webkit-transform-origin: top left; -moz-transform-origin: top left; -o-transform-origin: top left; -ms-transform-origin: top left; transform-origin: top left; } .line_01 { margin-top: 160px; margin-left: -80px; transform: rotate(110deg); -webkit-transform: rotate(110deg); -ms-transform: rotate(110deg); -moz-transform: rotate(110deg); -o-transform: rotate(110deg); } .line_02 { margin-top: 150px; margin-left: 160px; transform: rotate(130deg); -webkit-transform: rotate(130deg); -ms-transform: rotate(130deg); -moz-transform: rotate(130deg); -o-transform: rotate(130deg); } .line_03 { margin-top: 160px; margin-left: -80px; transform: rotate(110deg); -webkit-transform: rotate(110deg); -ms-transform: rotate(110deg); -moz-transform: rotate(110deg); -o-transform: rotate(110deg); } .line_04 { margin-top: 150px; margin-left: 160px; transform: rotate(130deg); -webkit-transform: rotate(130deg); -ms-transform: rotate(130deg); -moz-transform: rotate(130deg); -o-transform: rotate(130deg); } .line_05 { margin-top: 160px; margin-left: -80px; transform: rotate(110deg); -webkit-transform: rotate(110deg); -ms-transform: rotate(110deg); -moz-transform: rotate(110deg); -o-transform: rotate(110deg); } /* -------------------------------------------------------- Beer slides -------------------------------------------------------------- */ .component { margin: 0 auto; position: relative; margin-top: 100px; max-width: 100%; margin-left: 200px; z-index: 1; } .component-transparent { width: 900px; height: 500px; } .component > ul { width: 100%; max-width: 100%; height: 100%; position: relative; list-style: none; padding: 0; margin: 0 auto; } .component-transparent > ul { width: 180px; } .component li { width: 100%; height: 100%; position: absolute; top: 0; left: 0; pointer-events: none; opacity: 0; z-index: 999; } .component .current { opacity: 1; pointer-events: auto; z-index: 1000; } .component li img { display: block; max-width: 100%; } /* -------------------------------------------------------- Slides -------------------------------------------------------------- */ .slides { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .slides .slide { width: 100%; height: 100%; overflow: hidden; } .item { position: relative; opacity: 0; height: 0px; overflow: hidden; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } .item.show { opacity: 1; height: auto;} /* -------------------------------------------------------- Timeline -------------------------------------------------------------- */ .timeline { position: absolute; top: 0; left: 0; width: 100%; height: 90%; border-bottom: 2px solid #fff; z-index: 1; } .timeline:after { content: ""; position: absolute; bottom: -4px; left: 0; width: 100%; border-bottom: 2px solid #d20832; } .content_container { position: absolute; top: 0; left: 0; width: 100%; height: 90%; z-index: 1;} .content_wrapper { position: relative; height: 100%; width: 1170px; margin: 0 auto;} .info_block { position: absolute; top: 80%; width: 300px; margin-left: -150px; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 1300ms cubic-bezier(0.645, 0.045, 0.355, 1); opacity: 0; transform: scale(0); } .info_block.active { top: 40%; opacity: 1; transform: scale(1); } .info_block.pos_0 { left: -50%; } .info_block.pos_1 { left: 0%; } .info_block.pos_2 { left: 50%;} .info_block.pos_3 { left: 100%;} .info_block.pos_4 { left: 150%;} .info_block.pos_1.active { margin-left: 40px; } .info_block.pos_2.active { margin-left: 40px; } .info_block.pos_3.active { margin-left: -340px; } .info_block h1 { margin-bottom: 0; text-shadow: 1px 1px #000;} .info_block h4 { margin-bottom: 30px; font-weight: normal; } .marker { position: absolute; bottom: -2px; left: 40%; width: 2px; height: 5%; background: #d20832; z-index: 1; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 1300ms cubic-bezier(0.645, 0.045, 0.355, 1); } .marker:before { content: ""; position: absolute; top: 0px; left: -4px; width: 10px; height: 10px; background: #d20832; border-radius: 100%; z-index: 1; } .markers_container { position: relative; height: 100%; width: 1170px; margin: 0 auto;} .marker.pos_0 { left: -50%;} .marker.pos_1 { left: 0%;} .marker.pos_2 { left: 50%;} .marker.pos_3 { left: 100%;} .marker.pos_4 { left: 150%;} .marker.active { height: 60%; } /* -------------------------------------------------------- Map -------------------------------------------------------------- */ #gmaps_map { margin: 5% auto 0 auto; width: 90%; height: 70%; z-index: 999; } #panto { position: relative; text-align: center; z-index: 999; top: 70px;} #panto .location_panto { display: inline-block; cursor: pointer; font-size: 22px; background: url(/pics/markers/location.png) left center no-repeat; padding-left: 30px; margin-right: 15px; text-shadow: 1px 1px #000;} #panto .location_panto.active { color: #d20630 !important; background: url(/pics/markers/location_active.png) left center no-repeat; } /* -------------------------------------------------------- Animations -------------------------------------------------------------- */ @-webkit-keyframes MoveSideL { 0% { padding-right: 0px; } 50% { padding-right: 10px; } 100% { padding-right: 0px; }} @keyframes MoveSideL { 0% { padding-right: 0px; } 50% { padding-right: 10px; } 100% { padding-right: 0px; }} @-webkit-keyframes MoveSideR { 0% { padding-left: 0px; } 50% { padding-left: 10px; } 100% { padding-left: 0px; }} @keyframes MoveSideR { 0% { padding-left: 0px; } 50% { padding-left: 10px; } 100% { padding-left: 0px; }} @-webkit-keyframes scrollWheel{ 0%{top:8px;opacity:1} 50%{opacity:1} 100%{top:16px;opacity:0} } @-moz-keyframes scrollWheel{ 0%{top:8px;opacity:1} 50%{opacity:1} 100%{top:16px;opacity:0} } @-o-keyframes scrollWheel{ 0%{top:8px;opacity:1} 50%{opacity:1} 100%{top:16px;opacity:0} } @keyframes scrollWheel{ 0%{top:8px;opacity:1} 50%{opacity:1} 100%{top:16px;opacity:0} } @-webkit-keyframes move{ from{transform:scale(1); -ms-transform:scale(1); -webkit-transform:scale(1); -o-transform:scale(1); -moz-transform:scale(1)} to{transform:scale(1.15); -ms-transform:scale(1.15); -webkit-transform:scale(1.15); -o-transform:scale(1.15); -moz-transform:scale(1.15)} } @keyframes move{ from{transform:scale(1); -ms-transform:scale(1); -webkit-transform:scale(1); -o-transform:scale(1); -moz-transform:scale(1)} to{transform:scale(1.15); -ms-transform:scale(1.15); -webkit-transform:scale(1.15); -o-transform:scale(1.15); -moz-transform:scale(1.15) } } /* -------------------------------------------------------- Formulier -------------------------------------------------------------- */ #form_container { position: relative; width: 100%; max-width: 500px; margin-bottom: 20px; overflow: hidden; } #form_container .frm_PageBreakHr { display: none; } #form_container .frm_Label { margin: 5px 20px 2px 0px; width: 100%; float: left; } #form_container .frm_Field { margin: 3px 0px 2px 0px; width: 100%; float: left; } #form_container .frm_Field .frm_CheckContainer { margin: 0px 0px 4px 0px; width: 450px; float: left; } #form_container .frm_Field .frm_CheckContainer .frm_CheckLabel { margin: 0px 0px 0px 2px; float: left; max-width:260px; } #form_container .frm_Field .frm_RadioContainer { margin: 0px 0px 4px 0px; width: 450px; float: left; } #form_container .frm_Field .frm_RadioContainer .frm_RadioLabel { margin: 0px 0px 0px 2px; width: 260px; float: left; } #form_container .frm_Quantity .frm_RadioContainer { margin: 0px 0px 4px 0px; float: none; clear:both; display:block; } #form_container .frm_Quantity .frm_RadioContainer .frm_RadioLabel { margin: 0px 0px 0px 2px; } #form_container .frm_TextBlock { width: 450px; } #form_container .frm_Header { margin: 30px 0px 0px 0px; width: 100%; float: left; } #form_container .frm_Header h1, #form_container .frm_Header h2, #form_container .frm_Header h3, #form_container .frm_Header h4, #form_container .frm_Header h5, #form_container .frm_Header h6 { margin-bottom: 0px; float: left; } #form_container .frm_FileUploaded_Message { display: block; width:100%; float:left; } #form_container .frm_TextBlock, #form_container .frm_Numeric, #form_container .frm_MultipleChoice, #form_container .frm_PhoneNumber, #form_container .frm_Calendar, #form_container .frm_TextBox, #form_container .frm_Email, #form_container .frm_TextArea, #form_container .frm_FileUpload { margin: 5px 0px 0px 0px; float: left; width: 100%; } #form_container .frm_TextBox .frm_Field input, #form_container .frm_Numeric .frm_Field input, #form_container .frm_PhoneNumber .frm_Field input, #form_container .frm_Email .frm_Field input, #form_container .frm_Calendar .frm_Field input, #form_container .frm_MultipleChoice .frm_Field input.frm_RadioInput, #form_container .frm_MultipleChoice .frm_Field input.frm_CheckInput { padding: 1px 3px; margin: 0px; width: 100%; background: rgba(255,255,255,0.08); height: 35px; border: none; border-bottom: 1px solid #fff; font: 16px/35px 'TradeGothicNo.18-Condensed', verdana, sans-serif; color: #fff; } #form_container .frm_MultipleChoice .frm_Field input.frm_RadioInput, #form_container .frm_MultipleChoice .frm_Field input.frm_CheckInput { margin-top: 6px; float: left; clear: both; } #form_container .frm_Calendar .frm_Field { position: relative; } #form_container .frm_Calendar .frm_Field img { position: absolute; top: 5px; right: 7px; margin: 0px; } #form_container .frm_FileUpload .frm_Field input { padding: 1px 3px; margin: 0px; width: 100%; height: 28px; font: 13px/21px 'TradeGothicNo.18-Condensed', verdana, sans-serif; color: #d20630; border: 1px solid #E0E0E0; } #form_container .frm_Calendar .frm_Field input { padding: 1px 3px; margin: 0px; width: 100%; font: 13px/21px 'TradeGothicNo.18-Condensed', verdana, sans-serif; color: #444; border: 1px solid #E0E0E0; } #form_container .frm_TextArea .frm_Field textarea { padding: 1px 3px; margin: 0px; width: 100%; background: rgba(255,255,255,0.08); height: 90px; border: none; border-bottom: 1px solid #fff; font: 16px/21px 'TradeGothicNo.18-Condensed', verdana, sans-serif; color: #fff;} *+html #form_container .frm_TextArea .frm_Field textarea { height: 86px; } #form_container .frm_MultipleChoice .frm_Field select { padding: 1px 1px; margin: 0px; width: 280px; height: 24px; font: 13px/18px 'TradeGothicNo.18-Condensed', verdana, sans-serif; color: #444; border: 1px solid #E0E0E0; } #form_container .frm_Calendar .frm_Field select { padding: 1px 1px; margin: 0px 10px 0px 0px; width: 85px; height: 21px; font: 13px/18px 'TradeGothicNo.18-Condensed', verdana, sans-serif; color: #444; border: 1px solid #E0E0E0; } #form_container .frm_MultipleChoice .frm_Field input { margin-top: 1px; margin-right: 5px; float: left; } #form_container .frm_FormTail, #form_container .frm_PageBreak { margin-top: 15px; width: 100%; padding: 0px 0px; float: left; } #form_container .frm_BtnContainer { width: 100%; padding: 0px 0px; float: left; } #form_container .frm_BtnContainer .frm_BtnPrevious_Inactive { display: none; } #form_container .frm_BtnContainer .frm_BtnPrevious { position: relative; padding: 5px 10px 5px 10px; height: 30px; float: left; font-family: 'TradeGothicNo.18-Condensed'; text-transform: uppercase; text-shadow: 0 0 0 #000; color: #fff; text-decoration: none; border: 0px; cursor: pointer; background: none repeat scroll 0 0 #004489; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } #form_container .frm_BtnContainer .frm_BtnNext_Inactive { display: none; } #form_container .frm_BtnContainer .frm_BtnNext { position: relative; padding: 5px 10px 5px 10px; height: 30px; float: right; font-family: 'TradeGothicNo.18-Condensed'; text-shadow: 0 0 0 #000; color: #fff; text-decoration: none; text-transform: uppercase; border: 0px; cursor: pointer; background: none repeat scroll 0 0 #004489; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } #form_container .frm_BtnContainer .frm_BtnSubmit, #gmaps_getdirections { position: relative; background: transparent; padding: 0px 30px; height: 30px; float: right; font-family: 'TradeGothicNo.18-Condensed'; text-align: center; border: 1px solid #fff; color: #fff; font-size: 14px; line-height: 30px; text-transform: uppercase; cursor: pointer; -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -ms-transition: all 0.3s ease; transition: all 0.3s ease; } #form_container .frm_BtnContainer .frm_BtnCheck { position: relative; padding: 5px 10px 5px 10px; height: 30px; float: right; font-family: 'TradeGothicNo.18-Condensed';text-align: center; border: 1px solid #fff; color: #fff; font-size: 14px; line-height: 30px; text-transform: uppercase; cursor: pointer; background: none repeat scroll 0 0 #004489; -webkit-transition: all 0.3s ease;-moz-transition: all 0.3s ease;-ms-transition: all 0.3s ease; transition: all 0.3s ease;} #form_container .frm_BtnContainer .frm_BtnSubmit:hover {background: #fff; color: #d20630;} /* -------------------------------------------------------- Turn device notification ---------------------------------------------*/ #turnDeviceNotification { position:fixed; top: 0; left:0; height:100%; width:100%; display: none; background:#000; color:#fff; z-index:999999; text-align: center;} #turnDeviceNotification img { height: auto; max-height: 60%; margin: 0 auto; display: block;} /* -------------------------------------------------------- Footer -------------------------------------------------------------- */ footer { position: fixed; bottom: 10px; width: 100%; height: auto; padding: 0px 0; color: #6b5151; z-index: 100;} footer a:link, footer a:visited { color: #6b5151; padding: 0px 5px; text-decoration: none; border: none;} footer a:hover { color: #fff !important; border: none;} /* -------------------------------------------------------- Responsive -------------------------------------------------------------- */ @media (max-width: 980px) { #beer_carousel { height: 650px;} #panto { top: 10px;} .agecheck .select { font-size: 46px;} } @media (max-width: 767px) { html, body { font-size: 14px;} h1 { font-size: 28px; line-height: 28px; margin-bottom: 20px;} h2 { font-size: 16px; line-height: 33px;} footer { display: none !important; } .valign { padding: 0 20px 40px 20px; vertical-align: bottom;} .timeline ~ .valign { padding: 0 20px 0px 20px; vertical-align: middle;} #form_container .frm_TextBox .frm_Field input, #form_container .frm_Numeric .frm_Field input, #form_container .frm_PhoneNumber .frm_Field input, #form_container .frm_Email .frm_Field input, #form_container .frm_Calendar .frm_Field input, #form_container .frm_MultipleChoice .frm_Field input.frm_RadioInput, #form_container .frm_MultipleChoice .frm_Field input.frm_CheckInput { height: 25px; font: 16px/25px 'TradeGothicNo.18-Condensed', verdana, sans-serif;} #form_container .frm_TextArea .frm_Field textarea { height: 25px; line-height: 25px;} #form_container .frm_BtnContainer .frm_BtnSubmit, #gmaps_getdirections { padding: 0px 25px; height: 25px; line-height: 25px;} #fixed_container { top: 110% !important; } #fixed_container.absolute { top: 110%; } /*#fp-nav { display: none !important; }*/ #fp-nav ul li, .fp-slidesNav ul li { margin-right:-3px !important; } .btn, .btn:link, .btn:visited { box-sizing: border-box;} .agecheck_glass, .agecheck_bottle { display:none;} .agecheck { margin-top: 0px; padding: 0 20px;} .agecheck .select { width: 100%; height: 30px; margin-bottom: 10px; font-size: 20px;} .agecheck .span2 { width: 32%; float: left;} .agecheck .span2:nth-child(even) { margin: 0 2%;} .agecheck .span3 { width: 32%; float: left;} .component-transparent { visibility: hidden; height: 0; width: 0;} #glass_container { display:none;} .eigenschap { width: 100%; height: 140px; position: absolute; left: 0; margin: 0!important; padding: 0 20px; box-sizing:border-box; text-align: center; } .eigenschap_line { display:none;} #fixed_container_beer .beer_bottle .img_bottle, #fixed_container_beer .beer_bottle .logo { display: none;} #fixed_container_beer .beer_bottle.show_mobile .logo { display: block;} #beer_carousel .hide{ display:block;} #beer_carousel { height: 625px;} } @media (max-width: 768px) and (min-height: 700px) { .valign { padding: 0 20px 0px 20px; vertical-align: middle;} } @media (max-width: 480px) { .fs_40 { font-size: 34px; line-height: 40px;} header { height: 80px;} header .bg_logo { height: 80px; background: url(/pics/logo-small.png) bottom center no-repeat; } .header_home_link { margin-left: -55px; width: 110px; height: 80px;} #menu_toggle { top: 18px; width: 30px;} #menu_toggle span { height: 2px; border-radius: 2px;} #menu_toggle span:nth-child(2), #menu_toggle span:nth-child(3) { top: 6px;} #menu_toggle span:nth-child(4) { top: 12px;} #age_title { position: absolute; top: 130px; } .content_wrapper { width: 300px;} .info_block.active { top: 35%;} .info_block { margin-left: -116px;} .info_block.pos_0 { left: -50%; } .info_block.pos_1 { left: 0%; } .info_block.pos_2 { left: 0%;} .info_block.pos_3 { left: 100%;} .info_block.pos_4 { left: 200%;} .info_block.pos_1.active { margin-left: 0px; } .info_block.pos_2.active { margin-left: 0px; } .info_block.pos_3.active { margin-left: -300px; } #beer_carousel { height: 480px;} .carousel_controls { margin-top: -20px;} #panto .location_panto { font-size: 15px;} } @media (max-width: 380px) { #beer_carousel { height: 430px;} .carousel_controls { margin-top: -40px;} } @media (min-width: 480px) and (max-width: 768px) { .markers_container { width: 460px; } .content_wrapper { width: 460px; } .info_block.pos_2 { left: 10%;} .marker.pos_0 { left: -50%;} .marker.pos_2 { left: 10%;} } @media (min-width: 768px) and (max-width: 979px) { .markers_container { width: 720px; } .content_wrapper { width: 720px; } } @media (min-width: 979px) and (max-width: 1199px) { .markers_container { width: 960px; } .content_wrapper { width: 960px; } } @media (min-width: 1200px) { .markers_container { width: 1170px; } .content_wrapper { width: 1170px; } } /* -------------------------------------------------------- mMenu -------------------------------------------------------------- */ .mm-menu.mm-horizontal>.mm-panel{-webkit-transition:-webkit-transform .4s ease;transition:transform .4s ease}.mm-menu .mm-hidden{display:none}.mm-wrapper{overflow-x:hidden;position:relative}.mm-menu,.mm-menu>.mm-panel{width:100%;height:100%;position:absolute;left:0;top:0;z-index:0}.mm-menu{font-family:arial;display:block;overflow:hidden;padding:0}.mm-menu>.mm-panel{background:inherit;-webkit-overflow-scrolling:touch;overflow:scroll;overflow-x:hidden;overflow-y:auto;box-sizing:border-box;padding:20px;-webkit-transform:translateX(100%);transform:translateX(100%)}.mm-menu>.mm-panel.mm-opened{-webkit-transform:translateX(0);transform:translateX(0)}.mm-menu>.mm-panel.mm-subopened{-webkit-transform:translateX(-30%);transform:translateX(-30%)}.mm-menu>.mm-panel.mm-highest{z-index:1}.mm-menu .mm-list{padding:20px 0}.mm-menu>.mm-list{padding-bottom:0}.mm-menu>.mm-list:after{content:'';display:block;height:40px}.mm-panel>.mm-list{margin-left:-20px;margin-right:-20px}.mm-panel>.mm-list:first-child{padding-top:0}.mm-list,.mm-list>li{list-style:none;display:block;padding:0;margin:0}.mm-list{font:inherit;font-size:16px}.mm-list a,.mm-list a:hover{text-decoration:none}.mm-list>li{position:relative}.mm-list>li>a,.mm-list>li>span{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;color:#444;line-height:20px;display:block;padding:10px 10px 10px 20px;margin:0}.mm-list>li:not(.mm-subtitle):not(.mm-label):not(.mm-search):not(.mm-noresults):after{content:'';border-bottom-width:1px;border-bottom-style:solid;display:block;bottom:0;width:auto;margin-left:20px;position:relative;left:auto}.mm-list a.mm-subopen{background:rgba(3,2,1,0);width:40px;height:100%;padding:0;position:absolute;right:0;top:0;z-index:2}.mm-list a.mm-subopen:before{content:'';border-left-width:1px;border-left-style:solid;display:block;height:100%;position:absolute;left:0;top:0}.mm-list a.mm-subopen.mm-fullsubopen{width:100%}.mm-list a.mm-subopen.mm-fullsubopen:before{border-left:none}.mm-list a.mm-subopen+a,.mm-list a.mm-subopen+span{padding-right:5px;margin-right:40px}.mm-list>li.mm-selected>a.mm-subopen{background:0 0}.mm-list>li.mm-selected>a.mm-fullsubopen+a,.mm-list>li.mm-selected>a.mm-fullsubopen+span{padding-right:45px;margin-right:0}.mm-list a.mm-subclose{text-indent:20px;padding-top:30px;margin-top:-20px}.mm-list>li.mm-label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden;font-size:10px;text-transform:uppercase;text-indent:20px;line-height:25px;padding-right:5px}.mm-list>li.mm-spacer{padding-top:40px}.mm-list>li.mm-spacer.mm-label{padding-top:25px}.mm-list a.mm-subclose:before,.mm-list a.mm-subopen:after{content:'';border:2px solid transparent;display:inline-block;width:7px;height:7px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);margin-bottom:-5px;position:absolute;bottom:50%}.mm-list a.mm-subopen:after{border-top:none;border-left:none;right:18px}.mm-list a.mm-subclose:before{border-right:none;border-bottom:none;margin-bottom:-15px;left:22px}.mm-menu.mm-vertical .mm-list .mm-panel{display:none;padding:10px 0 10px 10px}.mm-menu.mm-vertical .mm-list .mm-panel li:last-child:after{border-color:transparent}.mm-menu.mm-vertical .mm-list li.mm-opened>.mm-panel{display:block}.mm-menu.mm-vertical .mm-list>li>a.mm-subopen{height:40px}.mm-menu.mm-vertical .mm-list>li>a.mm-subopen:after{top:16px;right:16px;bottom:auto}.mm-menu.mm-vertical .mm-list>li.mm-opened>a.mm-subopen:after{-webkit-transform:rotate(45deg);transform:rotate(45deg)}.mm-menu.mm-vertical .mm-list>li.mm-label>a.mm-subopen{height:25px}.mm-menu{background:#333;color:rgba(255,255,255,.6)}.mm-menu .mm-list>li:after{border-color:rgba(0,0,0,.15)}.mm-menu .mm-list>li>a.mm-subclose{background:rgba(0,0,0,.1);color:rgba(255,255,255,.3)}.mm-menu .mm-list>li>a.mm-subclose:before,.mm-menu .mm-list>li>a.mm-subopen:after{border-color:rgba(255,255,255,.3)}.mm-menu .mm-list>li>a.mm-subopen:before{border-color:rgba(0,0,0,.15)}.mm-menu .mm-list>li.mm-selected>a:not(.mm-subopen),.mm-menu .mm-list>li.mm-selected>span{background:rgba(0,0,0,.1)}.mm-menu .mm-list>li.mm-label,.mm-menu.mm-vertical .mm-list li.mm-opened>a.mm-subopen,.mm-menu.mm-vertical .mm-list li.mm-opened>ul{background:rgba(255,255,255,.05)}.mm-page{-webkit-transition:-webkit-transform .4s ease;transition:transform .4s ease}html.mm-opened{overflow:hidden;position:relative}html.mm-opened body{overflow:hidden}html.mm-opened .mm-page{box-sizing:border-box;position:relative}html.mm-background .mm-page{background:inherit}#mm-blocker{background:rgba(3,2,1,0);display:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:999999}html.mm-blocking #mm-blocker,html.mm-opened #mm-blocker{display:block}.mm-menu.mm-offcanvas{display:none;position:fixed}.mm-menu.mm-current{display:block}.mm-menu{width:80%;min-width:140px;max-width:440px}html.mm-opening #mm-blocker,html.mm-opening .mm-page{-webkit-transform:translate(80%,0);transform:translate(80%,0)}@media all and (max-width:175px){html.mm-opening #mm-blocker,html.mm-opening .mm-page{-webkit-transform:translate(140px,0);transform:translate(140px,0)}}@media all and (min-width:550px){html.mm-opening #mm-blocker,html.mm-opening .mm-page{-webkit-transform:translate(440px,0);transform:translate(440px,0)}}html.mm-slide .mm-menu{-webkit-transition:-webkit-transform .4s ease;transition:transform .4s ease}html.mm-slide.mm-opened .mm-menu{-webkit-transform:translateX(-30%);transform:translateX(-30%)}html.mm-slide.mm-opening .mm-menu{-webkit-transform:translateX(0);transform:translateX(0)}html.mm-slide.mm-right.mm-opened .mm-menu{-webkit-transform:translateX(30%);transform:translateX(30%)}html.mm-slide.mm-right.mm-opening .mm-menu{-webkit-transform:translateX(0);transform:translateX(0)}html.mm-slide.mm-top.mm-opened .mm-menu{-webkit-transform:translateY(-30%);transform:translateY(-30%)}html.mm-slide.mm-top.mm-opening .mm-menu{-webkit-transform:translateY(0);transform:translateY(0)}html.mm-slide.mm-bottom.mm-opened .mm-menu{-webkit-transform:translateY(30%);transform:translateY(30%)}html.mm-slide.mm-bottom.mm-opening .mm-menu{-webkit-transform:translateY(0);transform:translateY(0)}html.mm-zoom-menu .mm-menu{-webkit-transition:-webkit-transform .4s ease;transition:transform .4s ease}html.mm-zoom-menu.mm-opened .mm-menu{-webkit-transform:scale(.7,.7) translateX(-30%);transform:scale(.7,.7) translateX(-30%);-webkit-transform-origin:left center;transform-origin:left center}html.mm-zoom-menu.mm-opening .mm-menu{-webkit-transform:scale(1,1) translateX(0);transform:scale(1,1) translateX(0)}html.mm-zoom-menu.mm-right.mm-opened .mm-menu{-webkit-transform:scale(.7,.7) translateX(30%);transform:scale(.7,.7) translateX(30%);-webkit-transform-origin:right center;transform-origin:right center}html.mm-zoom-menu.mm-right.mm-opening .mm-menu{-webkit-transform:scale(1,1) translateX(0);transform:scale(1,1) translateX(0)}html.mm-zoom-menu.mm-top.mm-opened .mm-menu{-webkit-transform:scale(.7,.7) translateY(-30%);transform:scale(.7,.7) translateY(-30%);-webkit-transform-origin:center top;transform-origin:center top}html.mm-zoom-menu.mm-top.mm-opening .mm-menu{-webkit-transform:scale(1,1) translateY(0);transform:scale(1,1) translateY(0)}html.mm-zoom-menu.mm-bottom.mm-opened .mm-menu{-webkit-transform:scale(.7,.7) translateY(30%);transform:scale(.7,.7) translateY(30%);-webkit-transform-origin:center bottom;transform-origin:center bottom}html.mm-zoom-menu.mm-bottom.mm-opening .mm-menu{-webkit-transform:scale(1,1) translateY(0);transform:scale(1,1) translateY(0)}html.mm-zoom-panels .mm-menu.mm-horizontal>.mm-panel{-webkit-transform:scale(1.5,1.5) translateX(100%);transform:scale(1.5,1.5) translateX(100%);-webkit-transform-origin:left center;transform-origin:left center;-webkit-transition-property:-webkit-transform,left;transition-property:transform,left}html.mm-zoom-panels .mm-menu.mm-horizontal>.mm-panel.mm-opened{-webkit-transform:scale(1,1) translateX(0);transform:scale(1,1) translateX(0)}html.mm-zoom-panels .mm-menu.mm-horizontal>.mm-panel.mm-opened.mm-subopened{-webkit-transform:scale(.7,.7) translateX(-30%);transform:scale(.7,.7) translateX(-30%)}.mm-search,.mm-search input{box-sizing:border-box}.mm-list>li.mm-search{padding:10px;margin-top:-20px}.mm-list>li.mm-subtitle+li.mm-search{margin-top:0}div.mm-panel>div.mm-search{padding:0 0 10px}.mm-menu.mm-hasheader .mm-list>li.mm-search{margin-top:0}.mm-menu>.mm-search{background:inherit;width:100%;position:absolute;top:0;left:0;z-index:2}.mm-search{padding:15px 10px 10px}.mm-search input{border:none;border-radius:0;font-family:arial;font-size:16px;line-height:40px;outline:0;display:block;width:100%;height:40px;margin:0;color:#444!important;padding:0 10px}.mm-search input::-ms-clear{display:none}.mm-menu .mm-noresultsmsg{text-align:center;font-size:21px;display:none;padding:60px 0}.mm-menu .mm-noresultsmsg:after{border:none!important}.mm-noresults .mm-noresultsmsg{display:block}.mm-menu li.mm-nosubresults>a.mm-subopen{display:none}.mm-menu li.mm-nosubresults>a.mm-subopen+a,.mm-menu li.mm-nosubresults>a.mm-subopen+span{padding-right:10px}.mm-menu.mm-hassearch>.mm-panel{padding-top:20px}.mm-menu.mm-hassearch>.mm-panel>.mm-list:first-child{margin-top:-20px}.mm-menu.mm-hasheader>.mm-panel>div.mm-search:first-child{margin-top:-10px}.mm-menu.mm-hasheader>.mm-panel>div.mm-search:first-child+.mm-list{padding-top:0}.mm-menu .mm-search input{background:rgba(255,255,255,.3);color:rgba(255,255,255,.6)}.mm-menu .mm-noresultsmsg{color:rgba(255,255,255,.3)}.mm-menu.mm-bottom,.mm-menu.mm-top{width:100%;min-width:100%;max-width:100%}.mm-menu.mm-right{left:auto;right:0}.mm-menu.mm-bottom{top:auto;bottom:0}html.mm-right.mm-opening #mm-blocker,html.mm-right.mm-opening .mm-page{-webkit-transform:translate(-80%,0);transform:translate(-80%,0)}@media all and (max-width:175px){html.mm-right.mm-opening #mm-blocker,html.mm-right.mm-opening .mm-page{-webkit-transform:translate(-140px,0);transform:translate(-140px,0)}}@media all and (min-width:550px){html.mm-right.mm-opening #mm-blocker,html.mm-right.mm-opening .mm-page{-webkit-transform:translate(-440px,0);transform:translate(-440px,0)}}html.mm-front #mm-blocker,html.mm-front .mm-page{-webkit-transform:translate(0,0)!important;transform:translate(0,0)!important;z-index:0}.mm-menu.mm-front{z-index:6;box-shadow:0 0 15px rgba(0,0,0,.5)}html.mm-opened.mm-next .mm-page{box-shadow:none}.mm-menu.mm-front,.mm-menu.mm-next{-webkit-transition:-webkit-transform .4s ease;transition:transform .4s ease;-webkit-transform:translate(-100%,0);transform:translate(-100%,0)}.mm-menu.mm-front.mm-right,.mm-menu.mm-next.mm-right{-webkit-transform:translate(100%,0);transform:translate(100%,0)}.mm-menu.mm-front.mm-top{-webkit-transform:translate(0,-100%);transform:translate(0,-100%)}.mm-menu.mm-front.mm-bottom{-webkit-transform:translate(0,100%);transform:translate(0,100%)}html.mm-opening .mm-menu.mm-front,html.mm-opening .mm-menu.mm-next{-webkit-transform:translate(0,0);transform:translate(0,0)}.mm-menu.mm-front.mm-bottom,.mm-menu.mm-front.mm-top{height:80%;min-height:140px;max-height:880px}.mm-menu.mm-light{background:#fff;color:#d20630;}.mm-menu.mm-light .mm-list>li:after{border-color:rgba(0,0,0,.1)}.mm-menu.mm-light .mm-list>li>a.mm-subclose{background:rgba(255,255,255,.6);color:rgba(0,0,0,.3)}.mm-menu.mm-light .mm-list>li>a.mm-subclose:before,.mm-menu.mm-light .mm-list>li>a.mm-subopen:after{border-color:#444}.mm-menu.mm-light .mm-list>li>a.mm-subopen:before{border-color:rgba(0,0,0,.1)}.mm-menu.mm-light .mm-list>li.mm-selected>a:not(.mm-subopen),.mm-menu.mm-light .mm-list>li.mm-selected>span{background:rgba(255,255,255,.6)}.mm-menu.mm-light .mm-list>li.mm-label,.mm-menu.mm-light.mm-vertical .mm-list li.mm-opened>a.mm-subopen,.mm-menu.mm-light.mm-vertical .mm-list li.mm-opened>ul{background:rgba(0,0,0,.03)}.mm-menu.mm-light .mm-buttonbar{border-color:rgba(0,0,0,.6);background:#f3f3f3}.mm-menu.mm-light .mm-buttonbar>*{border-color:rgba(0,0,0,.6)}.mm-menu.mm-light .mm-buttonbar>input:checked+label{background:rgba(0,0,0,.6);color:#f3f3f3}.mm-menu.mm-light label.mm-check:before{border-color:rgba(0,0,0,.6)}.mm-menu.mm-light em.mm-counter{color:rgba(0,0,0,.3)}.mm-menu.mm-light .mm-footer,.mm-menu.mm-light .mm-header{border-color:rgba(0,0,0,.1);color:rgba(0,0,0,.3)}.mm-menu.mm-light .mm-header .mm-next:after,.mm-menu.mm-light .mm-header .mm-prev:before{border-color:rgba(0,0,0,.3)}.mm-menu.mm-light .mm-list li.mm-label>div>div{background:rgba(0,0,0,.03)}.mm-menu.mm-light .mm-search input{background:rgba(0,0,0,.1);color:rgba(0,0,0,.6)}.mm-menu.mm-light .mm-noresultsmsg{color:rgba(0,0,0,.3)}.mm-menu.mm-light label.mm-toggle{background:rgba(0,0,0,.1)}.mm-menu.mm-light label.mm-toggle:before{background:#f3f3f3}.mm-menu.mm-light input.mm-toggle:checked~label.mm-toggle{background:#4bd963}html.mm-opened.mm-white .mm-page{box-shadow:0 0 10px rgba(0,0,0,.3)}.mm-menu.mm-white{background:#fff;color:rgba(0,0,0,.6)}.mm-menu.mm-white .mm-list>li:after{border-color:rgba(0,0,0,.1)}.mm-menu.mm-white .mm-list>li>a.mm-subclose{background:rgba(0,0,0,.06);color:rgba(0,0,0,.3)}.mm-menu.mm-white .mm-list>li>a.mm-subclose:before,.mm-menu.mm-white .mm-list>li>a.mm-subopen:after{border-color:rgba(0,0,0,.3)}.mm-menu.mm-white .mm-list>li>a.mm-subopen:before{border-color:rgba(0,0,0,.1)}.mm-menu.mm-white .mm-list>li.mm-selected>a:not(.mm-subopen),.mm-menu.mm-white .mm-list>li.mm-selected>span{background:rgba(0,0,0,.06)}.mm-menu.mm-white .mm-list>li.mm-label,.mm-menu.mm-white.mm-vertical .mm-list li.mm-opened>a.mm-subopen,.mm-menu.mm-white.mm-vertical .mm-list li.mm-opened>ul{background:rgba(0,0,0,.03)}.mm-menu.mm-white .mm-buttonbar{border-color:rgba(0,0,0,.6);background:#fff}.mm-menu.mm-white .mm-buttonbar>*{border-color:rgba(0,0,0,.6)}.mm-menu.mm-white .mm-buttonbar>input:checked+label{background:rgba(0,0,0,.6);color:#fff}.mm-menu.mm-white label.mm-check:before{border-color:rgba(0,0,0,.6)}.mm-menu.mm-white em.mm-counter{color:rgba(0,0,0,.3)}.mm-menu.mm-white .mm-footer,.mm-menu.mm-white .mm-header{border-color:rgba(0,0,0,.1);color:rgba(0,0,0,.3)}.mm-menu.mm-white .mm-header .mm-next:after,.mm-menu.mm-white .mm-header .mm-prev:before{border-color:rgba(0,0,0,.3)}.mm-menu.mm-white .mm-list li.mm-label>div>div{background:rgba(0,0,0,.03)}.mm-menu.mm-white .mm-search input{background:rgba(0,0,0,.1);color:rgba(0,0,0,.6)}.mm-menu.mm-white .mm-noresultsmsg{color:rgba(0,0,0,.3)}.mm-menu.mm-white label.mm-toggle{background:rgba(0,0,0,.1)}.mm-menu.mm-white label.mm-toggle:before{background:#fff}.mm-menu.mm-white input.mm-toggle:checked~label.mm-toggle{background:#4bd963}html.mm-opened.mm-black .mm-page{box-shadow:none}.mm-menu.mm-black{background:#000;color:rgba(255,255,255,.6)}.mm-menu.mm-black .mm-list>li:after{border-color:rgba(255,255,255,.2)}.mm-menu.mm-black .mm-list>li>a.mm-subclose{background:rgba(255,255,255,.25);color:rgba(255,255,255,.3)}.mm-menu.mm-black .mm-list>li>a.mm-subclose:before,.mm-menu.mm-black .mm-list>li>a.mm-subopen:after{border-color:rgba(255,255,255,.3)}.mm-menu.mm-black .mm-list>li>a.mm-subopen:before{border-color:rgba(255,255,255,.2)}.mm-menu.mm-black .mm-list>li.mm-selected>a:not(.mm-subopen),.mm-menu.mm-black .mm-list>li.mm-selected>span{background:rgba(255,255,255,.25)}.mm-menu.mm-black .mm-list>li.mm-label,.mm-menu.mm-black.mm-vertical .mm-list li.mm-opened>a.mm-subopen,.mm-menu.mm-black.mm-vertical .mm-list li.mm-opened>ul{background:rgba(255,255,255,.15)}.mm-menu.mm-black .mm-buttonbar{border-color:rgba(255,255,255,.6);background:#000}.mm-menu.mm-black .mm-buttonbar>*{border-color:rgba(255,255,255,.6)}.mm-menu.mm-black .mm-buttonbar>input:checked+label{background:rgba(255,255,255,.6);color:#000}.mm-menu.mm-black label.mm-check:before{border-color:rgba(255,255,255,.6)}.mm-menu.mm-black em.mm-counter{color:rgba(255,255,255,.3)}.mm-menu.mm-black .mm-footer,.mm-menu.mm-black .mm-header{border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.3)}.mm-menu.mm-black .mm-header .mm-next:after,.mm-menu.mm-black .mm-header .mm-prev:before{border-color:rgba(255,255,255,.3)}.mm-menu.mm-black .mm-list li.mm-label>div>div{background:rgba(255,255,255,.15)}.mm-menu.mm-black .mm-search input{background:rgba(255,255,255,.3);color:rgba(255,255,255,.6)}.mm-menu.mm-black .mm-noresultsmsg{color:rgba(255,255,255,.3)}.mm-menu.mm-black label.mm-toggle{background:rgba(255,255,255,.2)}.mm-menu.mm-black label.mm-toggle:before{background:#000}.mm-menu.mm-black input.mm-toggle:checked~label.mm-toggle{background:#4bd963} /* -------------------------------------------------------- Sweet Alert -------------------------------------------------------------- */ .sweet-alert,.sweet-overlay{position:fixed;display:none}.sweet-overlay{background-color:rgba(0,0,0,.4);left:0;right:0;top:0;bottom:0;z-index:1000}.sweet-alert{background-color:#fff;font-family:Arial,sans-serif;width:478px;padding:17px;border-radius:5px;text-align:center;left:50%;top:50%;margin-left:-256px;margin-top:-200px;overflow:hidden;z-index:2000}@media all and (max-width:540px){.sweet-alert{width:auto;margin-left:0;margin-right:0;left:15px;right:15px}}.sweet-alert h2{color:#575757;font-size:30px;text-align:center;font-weight:600;text-transform:none;position:relative}.sweet-alert p{color:#000;font-size:16px;text-align:center;position:relative;margin:0;line-height:normal}.sweet-alert button{background-color:#d20630!important;color:#fff;border:none;box-shadow:none;font-size:17px;font-weight:500;border-radius:5px;padding:10px 32px;margin:26px 5px 0;cursor:pointer}.sweet-alert button:focus{outline:0;box-shadow:0 0 2px rgba(128,179,235,.5),inset 0 0 0 1px rgba(0,0,0,.05)}.sweet-alert button:hover{background-color:#a1d9f2}.sweet-alert button:active{background-color:#81ccee}.sweet-alert button.cancel{background-color:#D0D0D0}.sweet-alert button.cancel:hover{background-color:#c8c8c8}.sweet-alert button.cancel:active{background-color:#b6b6b6}.sweet-alert button.cancel:focus{box-shadow:rgba(197,205,211,.8) 0 0 2px,rgba(0,0,0,.0470588) 0 0 0 1px inset!important}.sweet-alert[data-has-cancel-button=false] button{box-shadow:none!important}.sweet-alert .icon{width:80px;height:80px;border:4px solid gray;border-radius:50%;margin:20px auto;position:relative;box-sizing:content-box}.sweet-alert .icon.error{border-color:#F27474}.sweet-alert .icon.error .x-mark{position:relative;display:block}.sweet-alert .icon.error .line{position:absolute;height:5px;width:47px;background-color:#F27474;display:block;top:37px;border-radius:2px}.sweet-alert .icon.error .line.left{-webkit-transform:rotate(45deg);transform:rotate(45deg);left:17px}.sweet-alert .icon.error .line.right{-webkit-transform:rotate(-45deg);transform:rotate(-45deg);right:16px}.sweet-alert .icon.warning{border-color:#F8BB86}.sweet-alert .icon.warning .body{position:absolute;width:5px;height:47px;left:50%;top:10px;border-radius:2px;margin-left:-2px;background-color:#F8BB86}.sweet-alert .icon.warning .dot{position:absolute;width:7px;height:7px;border-radius:50%;margin-left:-3px;left:50%;bottom:10px;background-color:#F8BB86}.sweet-alert .icon.info::after,.sweet-alert .icon.info::before{position:absolute;content:"";background-color:#C9DAE1}.sweet-alert .icon.info{border-color:#C9DAE1}.sweet-alert .icon.info::before{width:5px;height:29px;left:50%;bottom:17px;border-radius:2px;margin-left:-2px}.sweet-alert .icon.info::after{width:7px;height:7px;border-radius:50%;margin-left:-3px;top:19px}.sweet-alert .icon.success{border-color:#A5DC86}.sweet-alert .icon.success::after,.sweet-alert .icon.success::before{content:'';position:absolute;width:60px;height:120px;background:#fff}.sweet-alert .icon.success::before{border-radius:120px 0 0 120px;top:-7px;left:-33px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:60px 60px;transform-origin:60px 60px}.sweet-alert .icon.success::after{border-radius:0 120px 120px 0;top:-11px;left:30px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);-webkit-transform-origin:0 60px;transform-origin:0 60px}.sweet-alert .icon.success .placeholder{width:80px;height:80px;border:4px solid rgba(165,220,134,.2);border-radius:50%;box-sizing:content-box;position:absolute;left:-4px;top:-4px;z-index:2}.sweet-alert .icon.success .fix{width:5px;height:90px;background-color:#fff;position:absolute;left:28px;top:8px;z-index:1;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .icon.success .line{height:5px;background-color:#A5DC86;display:block;border-radius:2px;position:absolute;z-index:2}.sweet-alert .icon.success .line.tip{width:25px;left:14px;top:46px;-webkit-transform:rotate(45deg);transform:rotate(45deg)}.sweet-alert .icon.success .line.long{width:47px;right:8px;top:38px;-webkit-transform:rotate(-45deg);transform:rotate(-45deg)}.sweet-alert .icon.custom{background-size:contain;border-radius:0;border:none;background-position:center center;background-repeat:no-repeat}@-webkit-keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-tranform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@-moz-keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-tranform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@keyframes showSweetAlert{0%{transform:scale(.7);-webkit-transform:scale(.7)}45%{transform:scale(1.05);-webkit-transform:scale(1.05)}80%{transform:scale(.95);-webkit-tranform:scale(.95)}100%{transform:scale(1);-webkit-transform:scale(1)}}@-webkit-keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}@-moz-keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}@keyframes hideSweetAlert{0%{transform:scale(1);-webkit-transform:scale(1)}100%{transform:scale(.5);-webkit-transform:scale(.5)}}.showSweetAlert{-webkit-animation:showSweetAlert .3s;-moz-animation:showSweetAlert .3s;animation:showSweetAlert .3s}.hideSweetAlert{-webkit-animation:hideSweetAlert .2s;-moz-animation:hideSweetAlert .2s;animation:hideSweetAlert .2s}@-webkit-keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@-moz-keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@keyframes animateSuccessTip{0%,54%{width:0;left:1px;top:19px}70%{width:50px;left:-8px;top:37px}84%{width:17px;left:21px;top:48px}100%{width:25px;left:14px;top:45px}}@-webkit-keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@-moz-keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@keyframes animateSuccessLong{0%,65%{width:0;right:46px;top:54px}84%{width:55px;right:0;top:35px}100%{width:47px;right:8px;top:38px}}@-webkit-keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}@-moz-keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}@keyframes rotatePlaceholder{0%,5%{transform:rotate(-45deg);-webkit-transform:rotate(-45deg)}100%,12%{transform:rotate(-405deg);-webkit-transform:rotate(-405deg)}}.animateSuccessTip{-webkit-animation:animateSuccessTip .75s;-moz-animation:animateSuccessTip .75s;animation:animateSuccessTip .75s}.animateSuccessLong{-webkit-animation:animateSuccessLong .75s;-moz-animation:animateSuccessLong .75s;animation:animateSuccessLong .75s}.icon.success.animate::after{-webkit-animation:rotatePlaceholder 4.25s ease-in;-moz-animation:rotatePlaceholder 4.25s ease-in;animation:rotatePlaceholder 4.25s ease-in}@-webkit-keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0);-webkit-transform:rotateX(0);opacity:1}}@-moz-keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0);-webkit-transform:rotateX(0);opacity:1}}@keyframes animateErrorIcon{0%{transform:rotateX(100deg);-webkit-transform:rotateX(100deg);opacity:0}100%{transform:rotateX(0);-webkit-transform:rotateX(0);opacity:1}}.animateErrorIcon{-webkit-animation:animateErrorIcon .5s;-moz-animation:animateErrorIcon .5s;animation:animateErrorIcon .5s}@-webkit-keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}@-moz-keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}@keyframes animateXMark{0%,50%{transform:scale(.4);-webkit-transform:scale(.4);margin-top:26px;opacity:0}80%{transform:scale(1.15);-webkit-transform:scale(1.15);margin-top:-6px}100%{transform:scale(1);-webkit-transform:scale(1);margin-top:0;opacity:1}}.animateXMark{-webkit-animation:animateXMark .5s;-moz-animation:animateXMark .5s;animation:animateXMark .5s}@-webkit-keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}@-moz-keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}@keyframes pulseWarning{0%{border-color:#F8D486}100%{border-color:#F8BB86}}.pulseWarning{-webkit-animation:pulseWarning .75s infinite alternate;-moz-animation:pulseWarning .75s infinite alternate;animation:pulseWarning .75s infinite alternate}@-webkit-keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}@-moz-keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}@keyframes pulseWarningIns{0%{background-color:#F8D486}100%{background-color:#F8BB86}}.pulseWarningIns{-webkit-animation:pulseWarningIns .75s infinite alternate;-moz-animation:pulseWarningIns .75s infinite alternate;animation:pulseWarningIns .75s infinite alternate} /* -------------------------------------------------------- Beer slider animation -------------------------------------------------------------- */ .fxSlideIt li{-webkit-transform-origin:50% 100%;transform-origin:50% 100%}.fxSlideIt .navOutNext{-webkit-animation:slideOutLeft .5s forwards;animation:slideOutLeft .5s forwards}.fxSlideIt .navInNext{-webkit-animation:rotateSlideInRight .6s .1s forwards ease-in-out;animation:rotateSlideInRight .6s .1s forwards ease-in-out}.fxSlideIt .navOutPrev{-webkit-animation:slideOutRight .5s forwards;animation:slideOutRight .5s forwards}.fxSlideIt .navInPrev{-webkit-animation:rotateSlideInLeft .6s .1s forwards ease-in-out;animation:rotateSlideInLeft .6s .1s forwards ease-in-out}@-webkit-keyframes slideOutLeft{100%{-webkit-transform:translateX(-400%);opacity:0}}@keyframes slideOutLeft{100%{-webkit-transform:translateX(-400%);transform:translateX(-400%);opacity:0}}@-webkit-keyframes rotateSlideInRight{0%{-webkit-transform:translateX(100%) rotate(20deg)}35%{-webkit-transform:rotate(-8deg)}55%{-webkit-transform:rotate(6deg)}70%{-webkit-transform:rotate(-4deg)}85%{-webkit-transform:rotate(2deg)}95%{-webkit-transform:rotate(-1deg)}100%{-webkit-transform:translateX(0) rotate(0);opacity:1}}@keyframes rotateSlideInRight{0%{-webkit-transform:translateX(100%) rotate(20deg);transform:translateX(100%) rotate(20deg)}35%{-webkit-transform:rotate(-8deg);transform:rotate(-8deg)}55%{-webkit-transform:rotate(6deg);transform:rotate(6deg)}70%{-webkit-transform:rotate(-4deg);transform:rotate(-4deg)}85%{-webkit-transform:rotate(2deg);transform:rotate(2deg)}95%{-webkit-transform:rotate(-1deg);transform:rotate(-1deg)}100%{-webkit-transform:translateX(0) rotate(0);transform:translateX(0) rotate(0);opacity:1}}@-webkit-keyframes slideOutRight{100%{-webkit-transform:translateX(400%);opacity:0}}@keyframes slideOutRight{100%{-webkit-transform:translateX(400%);transform:translateX(400%);opacity:0}}@-webkit-keyframes rotateSlideInLeft{0%{-webkit-transform:translateX(-100%) rotate(-20deg)}35%{-webkit-transform:rotate(8deg)}55%{-webkit-transform:rotate(-6deg)}70%{-webkit-transform:rotate(4deg)}85%{-webkit-transform:rotate(-2deg)}95%{-webkit-transform:rotate(1deg)}100%{-webkit-transform:translateX(0) rotate(0);opacity:1}}@keyframes rotateSlideInLeft{0%{-webkit-transform:translateX(-100%) rotate(-20deg);transform:translateX(-100%) rotate(-20deg)}35%{-webkit-transform:rotate(8deg);transform:rotate(8deg)}55%{-webkit-transform:rotate(-6deg);transform:rotate(-6deg)}70%{-webkit-transform:rotate(4deg);transform:rotate(4deg)}85%{-webkit-transform:rotate(-2deg);transform:rotate(-2deg)}95%{-webkit-transform:rotate(1deg);transform:rotate(1deg)}100%{-webkit-transform:translateX(0) rotate(0);transform:translateX(0) rotate(0);opacity:1}} /* -------------------------------------------------------- Page overlay -------------------------------------------------------------- */ .pageload-overlay{position:fixed;width:100%;height:100%;top:0;left:0;visibility:hidden;z-index:10000}.pageload-overlay.show{visibility:visible}.pageload-overlay svg{position:absolute;top:0;left:0;pointer-events:none}.pageload-overlay svg path{fill:#000}.pageload-overlay .loader-inner{position:fixed;top:50%;left:50%;width:200px;height:200px;margin:-47px 0 0 -100px;display:none;opacity:1;z-index:10000;-webkit-transition:opacity .3s;transition:opacity .3s}.pageload-overlay.show .loader-inner{display:block}.pageload-loading.pageload-overlay.start{visibility:visible;background:#000}.pageload-loading.pageload-overlay .loader-inner{opacity:1}.loader,.loader:after,.loader:before{border-radius:50%}.loader:after,.loader:before{position:absolute;content:''}.loader:before{width:10.2em;height:20.2em;background:#000;border-radius:20.2em 0 0 20.2em;top:-.1em;left:-.1em;-webkit-transform-origin:10.2em 10.1em;transform-origin:10.2em 10.1em;-webkit-animation:load2 2s infinite ease 1.5s;animation:load2 1s infinite ease 1.5s}.loader{font-size:11px;text-indent:-99999em;position:absolute;top:-65px;left:-25px;z-index:-1;width:20em;height:20em;box-shadow:inset 0 0 0 1em #fff;-webkit-transform:translateZ(0);-ms-transform:translateZ(0);transform:translateZ(0)}.loader:after{width:10.2em;height:20.2em;background:#000;border-radius:0 20.2em 20.2em 0;top:-.1em;left:10.1em;-webkit-transform-origin:0 10.1em;transform-origin:0 10.1em;-webkit-animation:load2 2s infinite ease;animation:load2 1s infinite ease}@-webkit-keyframes load2{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes load2{0%{-webkit-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@-ms-keyframes uil-ring-anim{0%{-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}100%{-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@-moz-keyframes uil-ring-anim{0%{-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}100%{-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@-webkit-keyframes uil-ring-anim{0%{-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}100%{-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@-o-keyframes uil-ring-anim{0%{-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}100%{-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes uil-ring-anim{0%{-ms-transform:rotate(0);-moz-transform:rotate(0);-webkit-transform:rotate(0);-o-transform:rotate(0);transform:rotate(0)}100%{-ms-transform:rotate(360deg);-moz-transform:rotate(360deg);-webkit-transform:rotate(360deg);-o-transform:rotate(360deg);transform:rotate(360deg)}}.uil-ring-css{background:0 0;position:relative;width:200px;height:200px}.uil-ring-css>div{position:absolute;display:block;width:160px;height:160px;top:20px;left:20px;border-radius:80px;box-shadow:0 2px 0 0 #fff;-ms-animation:uil-ring-anim 1s linear infinite;-moz-animation:uil-ring-anim 1s linear infinite;-webkit-animation:uil-ring-anim 1s linear infinite;-o-animation:uil-ring-anim 1s linear infinite;animation:uil-ring-anim 1s linear infinite}.loader-inner img{position:absolute;z-index:-1;top:60px;left:40px;width:120px} /* -------------------------------------------------------- Glass home -------------------------------------------------------------- */ #glass { position: relative; width: 300px; height: 543px; background: url('/pics/glass_full.png') no-repeat; } #glass > div { width: 140px; position: absolute; left: 56%; top: 35%; -webkit-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%, -50%); -webkit-animation: serveja 10s linear infinite; -moz-animation: serveja 10s linear infinite; animation: serveja 10s linear infinite; -ms-animation: serveja 10s linear infinite; } #glass > div > div { position: relative; z-index: 400000; width: 100%; padding-bottom: 100%; } #glass > div .bolha { border-radius: 100%; display: block; z-index: 2; } #glass>div .bolha:nth-child(40){background-color:rgba(255,255,255,.61617166);width:5.65px;height:5.65px;position:absolute;left:19.50320926%;bottom:0;-webkit-animation:bolha 1.72287963s infinite linear;-moz-animation:bolha 1.72287963s infinite linear;animation:bolha 1.72287963s infinite linear;-ms-animation:bolha 1.72287963s infinite linear}#glass>div .bolha:nth-child(39){background-color:rgba(255,255,255,.29733587);width:5.8px;height:5.8px;position:absolute;left:29.34197514%;bottom:0;-webkit-animation:bolha 1.25717534s infinite linear;-moz-animation:bolha 1.25717534s infinite linear;animation:bolha 1.25717534s infinite linear;-ms-animation:bolha 1.25717534s infinite linear}#glass>div .bolha:nth-child(38){background-color:rgba(255,255,255,.32507339);width:4.98px;height:4.98px;position:absolute;left:22.67447879%;bottom:0;-webkit-animation:bolha 1.46505008s infinite linear;-moz-animation:bolha 1.46505008s infinite linear;animation:bolha 1.46505008s infinite linear;-ms-animation:bolha 1.46505008s infinite linear}#glass>div .bolha:nth-child(37){background-color:rgba(255,255,255,.74993956);width:4.67px;height:4.67px;position:absolute;left:41.79173112%;bottom:0;-webkit-animation:bolha 1.45723608s infinite linear;-moz-animation:bolha 1.45723608s infinite linear;animation:bolha 1.45723608s infinite linear;-ms-animation:bolha 1.45723608s infinite linear}#glass>div .bolha:nth-child(36){background-color:rgba(255,255,255,.89063129);width:3.49px;height:3.49px;position:absolute;left:54.15398498%;bottom:0;-webkit-animation:bolha 1.03691373s infinite linear;-moz-animation:bolha 1.03691373s infinite linear;animation:bolha 1.03691373s infinite linear;-ms-animation:bolha 1.03691373s infinite linear}#glass>div .bolha:nth-child(35){background-color:rgba(255,255,255,.40813025);width:3.11px;height:3.11px;position:absolute;left:21.05704251%;bottom:0;-webkit-animation:bolha 1.0159082s infinite linear;-moz-animation:bolha 1.0159082s infinite linear;animation:bolha 1.0159082s infinite linear;-ms-animation:bolha 1.0159082s infinite linear}#glass>div .bolha:nth-child(34){background-color:rgba(255,255,255,.53384215);width:2.38px;height:2.38px;position:absolute;left:35.81427471%;bottom:0;-webkit-animation:bolha 1.09678725s infinite linear;-moz-animation:bolha 1.09678725s infinite linear;animation:bolha 1.09678725s infinite linear;-ms-animation:bolha 1.09678725s infinite linear}#glass>div .bolha:nth-child(33){background-color:rgba(255,255,255,.16793197);width:4.88px;height:4.88px;position:absolute;left:34.8811606%;bottom:0;-webkit-animation:bolha 1.10043819s infinite linear;-moz-animation:bolha 1.10043819s infinite linear;animation:bolha 1.10043819s infinite linear;-ms-animation:bolha 1.10043819s infinite linear}#glass>div .bolha:nth-child(32){background-color:rgba(255,255,255,.48680692);width:3.2px;height:3.2px;position:absolute;left:22.89123822%;bottom:0;-webkit-animation:bolha 1.0863608s infinite linear;-moz-animation:bolha 1.0863608s infinite linear;animation:bolha 1.0863608s infinite linear;-ms-animation:bolha 1.0863608s infinite linear}#glass>div .bolha:nth-child(31){background-color:rgba(255,255,255,.75812568);width:4.84px;height:4.84px;position:absolute;left:30.52016651%;bottom:0;-webkit-animation:bolha 1.21604459s infinite linear;-moz-animation:bolha 1.21604459s infinite linear;animation:bolha 1.21604459s infinite linear;-ms-animation:bolha 1.21604459s infinite linear}#glass>div .bolha:nth-child(30){background-color:rgba(255,255,255,.61010273);width:4.7px;height:4.7px;position:absolute;left:37.08267818%;bottom:0;-webkit-animation:bolha 1.72226746s infinite linear;-moz-animation:bolha 1.72226746s infinite linear;animation:bolha 1.72226746s infinite linear;-ms-animation:bolha 1.72226746s infinite linear}#glass>div .bolha:nth-child(29){background-color:rgba(255,255,255,.87543143);width:5.81px;height:5.81px;position:absolute;left:55.6633165%;bottom:0;-webkit-animation:bolha 1.53074079s infinite linear;-moz-animation:bolha 1.53074079s infinite linear;animation:bolha 1.53074079s infinite linear;-ms-animation:bolha 1.53074079s infinite linear}#glass>div .bolha:nth-child(28){background-color:rgba(255,255,255,.24728927);width:4.8px;height:4.8px;position:absolute;left:26.93817684%;bottom:0;-webkit-animation:bolha 1.60085137s infinite linear;-moz-animation:bolha 1.60085137s infinite linear;animation:bolha 1.60085137s infinite linear;-ms-animation:bolha 1.60085137s infinite linear}#glass>div .bolha:nth-child(27){background-color:rgba(255,255,255,.63209483);width:4.29px;height:4.29px;position:absolute;left:56.26206978%;bottom:0;-webkit-animation:bolha 1.78646006s infinite linear;-moz-animation:bolha 1.78646006s infinite linear;animation:bolha 1.78646006s infinite linear;-ms-animation:bolha 1.78646006s infinite linear}#glass>div .bolha:nth-child(26){background-color:rgba(255,255,255,.17739294);width:4.55px;height:4.55px;position:absolute;left:51.48981203%;bottom:0;-webkit-animation:bolha 1.19679333s infinite linear;-moz-animation:bolha 1.19679333s infinite linear;animation:bolha 1.19679333s infinite linear;-ms-animation:bolha 1.19679333s infinite linear}#glass>div .bolha:nth-child(25){background-color:rgba(255,255,255,.66040299);width:4.44px;height:4.44px;position:absolute;left:32.34529837%;bottom:0;-webkit-animation:bolha 1.29922534s infinite linear;-moz-animation:bolha 1.29922534s infinite linear;animation:bolha 1.29922534s infinite linear;-ms-animation:bolha 1.29922534s infinite linear}#glass>div .bolha:nth-child(24){background-color:rgba(255,255,255,.23266751);width:3.8px;height:3.8px;position:absolute;left:38.46936913%;bottom:0;-webkit-animation:bolha 1.68832766s infinite linear;-moz-animation:bolha 1.68832766s infinite linear;animation:bolha 1.68832766s infinite linear;-ms-animation:bolha 1.68832766s infinite linear}#glass>div .bolha:nth-child(23){background-color:rgba(255,255,255,.2836743);width:3.72px;height:3.72px;position:absolute;left:36.99007905%;bottom:0;-webkit-animation:bolha 1.79803658s infinite linear;-moz-animation:bolha 1.79803658s infinite linear;animation:bolha 1.79803658s infinite linear;-ms-animation:bolha 1.79803658s infinite linear}#glass>div .bolha:nth-child(22){background-color:rgba(255,255,255,.12745756);width:4.89px;height:4.89px;position:absolute;left:24.17830667%;bottom:0;-webkit-animation:bolha 1.22301563s infinite linear;-moz-animation:bolha 1.22301563s infinite linear;animation:bolha 1.22301563s infinite linear;-ms-animation:bolha 1.22301563s infinite linear}#glass>div .bolha:nth-child(21){background-color:rgba(255,255,255,.67136287);width:2.39px;height:2.39px;position:absolute;left:55.36819881%;bottom:0;-webkit-animation:bolha 1.79245657s infinite linear;-moz-animation:bolha 1.79245657s infinite linear;animation:bolha 1.79245657s infinite linear;-ms-animation:bolha 1.79245657s infinite linear}#glass>div .bolha:nth-child(20){background-color:rgba(255,255,255,.25029066);width:3.09px;height:3.09px;position:absolute;left:44.88643711%;bottom:0;-webkit-animation:bolha 1.14912632s infinite linear;-moz-animation:bolha 1.14912632s infinite linear;animation:bolha 1.14912632s infinite linear;-ms-animation:bolha 1.14912632s infinite linear}#glass>div .bolha:nth-child(19){background-color:rgba(255,255,255,.78789978);width:4.3px;height:4.3px;position:absolute;left:31.67819417%;bottom:0;-webkit-animation:bolha 1.14885028s infinite linear;-moz-animation:bolha 1.14885028s infinite linear;animation:bolha 1.14885028s infinite linear;-ms-animation:bolha 1.14885028s infinite linear}#glass>div .bolha:nth-child(18){background-color:rgba(255,255,255,.37871164);width:4.53px;height:4.53px;position:absolute;left:27.05050454%;bottom:0;-webkit-animation:bolha 1.331996s infinite linear;-moz-animation:bolha 1.331996s infinite linear;animation:bolha 1.331996s infinite linear;-ms-animation:bolha 1.331996s infinite linear}#glass>div .bolha:nth-child(17){background-color:rgba(255,255,255,.6488744);width:2.95px;height:2.95px;position:absolute;left:55.63666286%;bottom:0;-webkit-animation:bolha 1.44484051s infinite linear;-moz-animation:bolha 1.44484051s infinite linear;animation:bolha 1.44484051s infinite linear;-ms-animation:bolha 1.44484051s infinite linear}#glass>div .bolha:nth-child(16){background-color:rgba(255,255,255,.76605189);width:3.47px;height:3.47px;position:absolute;left:26.59974048%;bottom:0;-webkit-animation:bolha 1.06882149s infinite linear;-moz-animation:bolha 1.06882149s infinite linear;animation:bolha 1.06882149s infinite linear;-ms-animation:bolha 1.06882149s infinite linear}#glass>div .bolha:nth-child(15){background-color:rgba(255,255,255,.30174982);width:3.21px;height:3.21px;position:absolute;left:23.93361276%;bottom:0;-webkit-animation:bolha 1.0713304s infinite linear;-moz-animation:bolha 1.0713304s infinite linear;animation:bolha 1.0713304s infinite linear;-ms-animation:bolha 1.0713304s infinite linear}#glass>div .bolha:nth-child(14){background-color:rgba(255,255,255,.53107032);width:2.94px;height:2.94px;position:absolute;left:25.7557467%;bottom:0;-webkit-animation:bolha 1.2408617s infinite linear;-moz-animation:bolha 1.2408617s infinite linear;animation:bolha 1.2408617s infinite linear;-ms-animation:bolha 1.2408617s infinite linear}#glass>div .bolha:nth-child(13){background-color:rgba(255,255,255,.62202464);width:3.69px;height:3.69px;position:absolute;left:52.97774003%;bottom:0;-webkit-animation:bolha 1.64416871s infinite linear;-moz-animation:bolha 1.64416871s infinite linear;animation:bolha 1.64416871s infinite linear;-ms-animation:bolha 1.64416871s infinite linear}#glass>div .bolha:nth-child(12){background-color:rgba(255,255,255,.38507281);width:5.4px;height:5.4px;position:absolute;left:39.91008968%;bottom:0;-webkit-animation:bolha 1.4558554s infinite linear;-moz-animation:bolha 1.4558554s infinite linear;animation:bolha 1.4558554s infinite linear;-ms-animation:bolha 1.4558554s infinite linear}#glass>div .bolha:nth-child(11){background-color:rgba(255,255,255,.46101653);width:3.26px;height:3.26px;position:absolute;left:57.96587384%;bottom:0;-webkit-animation:bolha 1.09047459s infinite linear;-moz-animation:bolha 1.09047459s infinite linear;animation:bolha 1.09047459s infinite linear;-ms-animation:bolha 1.09047459s infinite linear}#glass>div .bolha:nth-child(10){background-color:rgba(255,255,255,.29944924);width:4.49px;height:4.49px;position:absolute;left:38.32322431%;bottom:0;-webkit-animation:bolha 1.20057046s infinite linear;-moz-animation:bolha 1.20057046s infinite linear;animation:bolha 1.20057046s infinite linear;-ms-animation:bolha 1.20057046s infinite linear}#glass>div .bolha:nth-child(9){background-color:rgba(255,255,255,.32860666);width:5.49px;height:5.49px;position:absolute;left:42.5454295%;bottom:0;-webkit-animation:bolha 1.17683183s infinite linear;-moz-animation:bolha 1.17683183s infinite linear;animation:bolha 1.17683183s infinite linear;-ms-animation:bolha 1.17683183s infinite linear}#glass>div .bolha:nth-child(8){background-color:rgba(255,255,255,.2129962);width:4.35px;height:4.35px;position:absolute;left:53.95049194%;bottom:0;-webkit-animation:bolha 1.22275623s infinite linear;-moz-animation:bolha 1.22275623s infinite linear;animation:bolha 1.22275623s infinite linear;-ms-animation:bolha 1.22275623s infinite linear}#glass>div .bolha:nth-child(7){background-color:rgba(255,255,255,.35168371);width:2.6px;height:2.6px;position:absolute;left:44.8641531%;bottom:0;-webkit-animation:bolha 1.40318978s infinite linear;-moz-animation:bolha 1.40318978s infinite linear;animation:bolha 1.40318978s infinite linear;-ms-animation:bolha 1.40318978s infinite linear}#glass>div .bolha:nth-child(6){background-color:rgba(255,255,255,.64120398);width:5.2px;height:5.2px;position:absolute;left:49.25586162%;bottom:0;-webkit-animation:bolha 1.29379847s infinite linear;-moz-animation:bolha 1.29379847s infinite linear;animation:bolha 1.29379847s infinite linear;-ms-animation:bolha 1.29379847s infinite linear}#glass>div .bolha:nth-child(5){background-color:rgba(255,255,255,.57372966);width:3.94px;height:3.94px;position:absolute;left:39.47381492%;bottom:0;-webkit-animation:bolha 1.58685634s infinite linear;-moz-animation:bolha 1.58685634s infinite linear;animation:bolha 1.58685634s infinite linear;-ms-animation:bolha 1.58685634s infinite linear}#glass>div .bolha:nth-child(4){background-color:rgba(255,255,255,.86653053);width:5.51px;height:5.51px;position:absolute;left:41.21061179%;bottom:0;-webkit-animation:bolha 1.28321454s infinite linear;-moz-animation:bolha 1.28321454s infinite linear;animation:bolha 1.28321454s infinite linear;-ms-animation:bolha 1.28321454s infinite linear}#glass>div .bolha:nth-child(3){background-color:rgba(255,255,255,.88168294);width:5.91px;height:5.91px;position:absolute;left:46.76237129%;bottom:0;-webkit-animation:bolha 1.60920322s infinite linear;-moz-animation:bolha 1.60920322s infinite linear;animation:bolha 1.60920322s infinite linear;-ms-animation:bolha 1.60920322s infinite linear}#glass>div .bolha:nth-child(2){background-color:rgba(255,255,255,.78224614);width:4.45px;height:4.45px;position:absolute;left:26.71956285%;bottom:0;-webkit-animation:bolha 1.0792768s infinite linear;-moz-animation:bolha 1.0792768s infinite linear;animation:bolha 1.0792768s infinite linear;-ms-animation:bolha 1.0792768s infinite linear}#glass>div .bolha:nth-child(1){background-color:rgba(255,255,255,.32129075);width:2.12px;height:2.12px;position:absolute;left:43.84181137%;bottom:0;-webkit-animation:bolha 1.31108086s infinite linear;-moz-animation:bolha 1.31108086s infinite linear;animation:bolha 1.31108086s infinite linear;-ms-animation:bolha 1.31108086s infinite linear}@-moz-keyframes bolha{to{bottom:100%;opacity:0;-webkit-opacity:0;-moz-opacity:0}}@-webkit-keyframes bolha{to{bottom:100%;opacity:0;-webkit-opacity:0;-moz-opacity:0}}@keyframes bolha{to{bottom:100%;opacity:0;-webkit-opacity:0;-moz-opacity:0}} /** * fullPage 2.6.6 * https://github.com/alvarotrigo/fullPage.js * MIT licensed * * Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo */ html.fp-enabled, .fp-enabled body { margin: 0; padding: 0; overflow:hidden; /*Avoid flicker on slides transitions for mobile phones #336 */ -webkit-tap-highlight-color: rgba(0,0,0,0); } #superContainer { height: 100%; position: relative; /* Touch detection for Windows 8 */ -ms-touch-action: none; /* IE 11 on Windows Phone 8.1*/ touch-action: none; } .fp-section { position: relative; -webkit-box-sizing: border-box; /* Safari<=5 Android<=3 */ -moz-box-sizing: border-box; /* <=28 */ box-sizing: border-box; } .fp-slide { float: left; } .fp-slide, .fp-slidesContainer { height: 100%; display: block; } .fp-slides { z-index:1; height: 100%; overflow: hidden; position: relative; -webkit-transition: all 0.3s ease-out; /* Safari<=6 Android<=4.3 */ transition: all 0.3s ease-out; } .fp-section.fp-table, .fp-slide.fp-table { display: table; table-layout:fixed; width: 100%; } .fp-tableCell { display: table-cell; vertical-align: middle; width: 100%; height: 100%; } .fp-slidesContainer { float: left; position: relative; } .fp-controlArrow { position: absolute; z-index: 4; top: 50%; cursor: pointer; width: 0; height: 0; border-style: solid; margin-top: -38px; -webkit-transform: translate3d(0,0,0); -ms-transform: translate3d(0,0,0); transform: translate3d(0,0,0); } .fp-controlArrow.fp-prev { display: none !important; left: 15px; width: 0; border-width: 38.5px 34px 38.5px 0; border-color: transparent #fff transparent transparent; } .fp-controlArrow.fp-next { display: none !important; right: 15px; border-width: 38.5px 0 38.5px 34px; border-color: transparent transparent transparent #fff; } .fp-scrollable { overflow: scroll; } .fp-notransition { -webkit-transition: none !important; transition: none !important; } #fp-nav { position: fixed; z-index: 100; margin-top: -32px; top: 50%; opacity: 1; -webkit-transform: translate3d(0,0,0); } #fp-nav.right { right: 17px; } #fp-nav.left { left: 17px; } .fp-slidesNav{ position: absolute; z-index: 4; left: 50%; opacity: 1; } .fp-slidesNav.bottom { bottom: 17px; } .fp-slidesNav.top { top: 17px; } #fp-nav ul, .fp-slidesNav ul { margin: 0; padding: 0; } #fp-nav ul li, .fp-slidesNav ul li { display: block; width: 14px; height: 13px; margin: 7px 7px 10px 7px; position:relative; } .fp-slidesNav ul li { display: inline-block; } #fp-nav ul li a, .fp-slidesNav ul li a { display: block; position: relative; z-index: 1; width: 100%; height: 100%; cursor: pointer; border: none; text-decoration: none; } #fp-nav ul li a.active span, .fp-slidesNav ul li a.active span, #fp-nav ul li:hover a.active span, .fp-slidesNav ul li:hover a.active span{ /*margin: -2px 0 0 -2px;*/ background: #fff; border-radius: 100%; } #fp-nav ul li a span, .fp-slidesNav ul li a span { border-radius: 100%; position: absolute; z-index: 1; height: 10px; width: 10px; border: 2px solid #fff; background: transparent; left: 50%; top: 50%; -webkit-transition: all 0.1s ease-in-out; -moz-transition: all 0.1s ease-in-out; -o-transition: all 0.1s ease-in-out; transition: all 0.2s ease-in-out; } #fp-nav ul li:hover a span, .fp-slidesNav ul li:hover a span{ /*margin: -5px 0px 0px -5px;*/ } #fp-nav ul li .fp-tooltip { position: absolute; top: -2px; color: #fff; font-size: 14px; font-family: arial, helvetica, sans-serif; white-space: nowrap; max-width: 220px; overflow: hidden; display: block; opacity: 0; width: 0; } #fp-nav ul li:hover .fp-tooltip, #fp-nav.fp-show-active a.active + .fp-tooltip { -webkit-transition: opacity 0.2s ease-in; transition: opacity 0.2s ease-in; width: auto; opacity: 1; } #fp-nav ul li .fp-tooltip.right { right: 20px; } #fp-nav ul li .fp-tooltip.left { left: 20px; }