html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
display: block; }
body {
line-height: 1; }
ol, ul {
list-style: none; }
blockquote, q {
quotes: none; }
blockquote:before, blockquote:after {
content: '';
content: none; }
q:before, q:after {
content: '';
content: none; }
table {
border-collapse: collapse;
border-spacing: 0; }
.wrapper {
box-sizing: border-box;
max-width: 1200px;
margin: 0 auto; }
.flexwrap {
display: -webkit-box;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap; }
.container-fluid {
margin-right: auto;
margin-left: auto;
padding-right: 2rem;
padding-left: 2rem; }
.row {
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 0;
-webkit-flex: 0 1 auto;
-moz-box-flex: 0;
-moz-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-box-direction: normal;
-webkit-box-orient: horizontal;
-webkit-flex-direction: row;
-moz-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -0.5rem;
margin-left: -0.5rem; }
.row.reverse {
-webkit-box-direction: reverse;
-webkit-box-orient: horizontal;
-webkit-flex-direction: row-reverse;
-moz-flex-direction: row-reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse; }
.col.reverse {
-webkit-box-direction: reverse;
-webkit-box-orient: vertical;
-webkit-flex-direction: column-reverse;
-moz-flex-direction: column-reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse; }
.col-xs {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: auto;
-moz-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto; }
.col-xs-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 8.33333%;
-moz-flex-basis: 8.33333%;
-ms-flex-preferred-size: 8.33333%;
flex-basis: 8.33333%;
max-width: 8.33333%; }
.col-xs-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 16.66667%;
-moz-flex-basis: 16.66667%;
-ms-flex-preferred-size: 16.66667%;
flex-basis: 16.66667%;
max-width: 16.66667%; }
.col-xs-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 25%;
-moz-flex-basis: 25%;
-ms-flex-preferred-size: 25%;
flex-basis: 25%;
max-width: 25%; }
.col-xs-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 33.33333%;
-moz-flex-basis: 33.33333%;
-ms-flex-preferred-size: 33.33333%;
flex-basis: 33.33333%;
max-width: 33.33333%; }
.col-xs-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 41.66667%;
-moz-flex-basis: 41.66667%;
-ms-flex-preferred-size: 41.66667%;
flex-basis: 41.66667%;
max-width: 41.66667%; }
.col-xs-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 50%;
-moz-flex-basis: 50%;
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
max-width: 50%; }
.col-xs-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 58.33333%;
-moz-flex-basis: 58.33333%;
-ms-flex-preferred-size: 58.33333%;
flex-basis: 58.33333%;
max-width: 58.33333%; }
.col-xs-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 66.66667%;
-moz-flex-basis: 66.66667%;
-ms-flex-preferred-size: 66.66667%;
flex-basis: 66.66667%;
max-width: 66.66667%; }
.col-xs-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 75%;
-moz-flex-basis: 75%;
-ms-flex-preferred-size: 75%;
flex-basis: 75%;
max-width: 75%; }
.col-xs-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 83.33333%;
-moz-flex-basis: 83.33333%;
-ms-flex-preferred-size: 83.33333%;
flex-basis: 83.33333%;
max-width: 83.33333%; }
.col-xs-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 91.66667%;
-moz-flex-basis: 91.66667%;
-ms-flex-preferred-size: 91.66667%;
flex-basis: 91.66667%;
max-width: 91.66667%; }
.col-xs-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 100%;
-moz-flex-basis: 100%;
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%; }
.col-xs-offset-0 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 0; }
.col-xs-offset-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 8.33333%; }
.col-xs-offset-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 16.66667%; }
.col-xs-offset-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 25%; }
.col-xs-offset-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 33.33333%; }
.col-xs-offset-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 41.66667%; }
.col-xs-offset-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 50%; }
.col-xs-offset-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 58.33333%; }
.col-xs-offset-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 66.66667%; }
.col-xs-offset-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 75%; }
.col-xs-offset-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 83.33333%; }
.col-xs-offset-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 91.66667%; }
.col-xs-offset-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 100%; }
.col-xs {
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-flex-basis: 0;
-moz-flex-basis: 0;
-ms-flex-preferred-size: 0;
flex-basis: 0;
max-width: 100%; }
.start-xs {
-webkit-box-pack: start;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
justify-content: flex-start;
text-align: left; }
.center-xs {
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
text-align: center; }
.end-xs {
-webkit-box-pack: end;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
justify-content: flex-end;
text-align: right; }
.top-xs {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
align-items: flex-start; }
.middle-xs {
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center; }
.bottom-xs {
-webkit-box-align: end;
-ms-flex-align: end;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
align-items: flex-end; }
.around-xs {
-ms-flex-pack: distribute;
-webkit-justify-content: space-around;
-moz-justify-content: space-around;
justify-content: space-around; }
.between-xs {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
justify-content: space-between; }
.first-xs {
order: -1; }
.last-xs {
order: 1; }
@media only screen and (min-width: 48em) {
.container, .sub-page .container, .page .container {
width: 46rem; }
.hide-sm {
display: none; }
.col-sm {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: auto;
-moz-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto; }
.col-sm-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 8.33333%;
-moz-flex-basis: 8.33333%;
-ms-flex-preferred-size: 8.33333%;
flex-basis: 8.33333%;
max-width: 8.33333%; }
.col-sm-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 16.66667%;
-moz-flex-basis: 16.66667%;
-ms-flex-preferred-size: 16.66667%;
flex-basis: 16.66667%;
max-width: 16.66667%; }
.col-sm-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 25%;
-moz-flex-basis: 25%;
-ms-flex-preferred-size: 25%;
flex-basis: 25%;
max-width: 25%; }
.col-sm-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 33.33333%;
-moz-flex-basis: 33.33333%;
-ms-flex-preferred-size: 33.33333%;
flex-basis: 33.33333%;
max-width: 33.33333%; }
.col-sm-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 41.66667%;
-moz-flex-basis: 41.66667%;
-ms-flex-preferred-size: 41.66667%;
flex-basis: 41.66667%;
max-width: 41.66667%; }
.col-sm-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 50%;
-moz-flex-basis: 50%;
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
max-width: 50%; }
.col-sm-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 58.33333%;
-moz-flex-basis: 58.33333%;
-ms-flex-preferred-size: 58.33333%;
flex-basis: 58.33333%;
max-width: 58.33333%; }
.col-sm-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 66.66667%;
-moz-flex-basis: 66.66667%;
-ms-flex-preferred-size: 66.66667%;
flex-basis: 66.66667%;
max-width: 66.66667%; }
.col-sm-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 75%;
-moz-flex-basis: 75%;
-ms-flex-preferred-size: 75%;
flex-basis: 75%;
max-width: 75%; }
.col-sm-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 83.33333%;
-moz-flex-basis: 83.33333%;
-ms-flex-preferred-size: 83.33333%;
flex-basis: 83.33333%;
max-width: 83.33333%; }
.col-sm-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 91.66667%;
-moz-flex-basis: 91.66667%;
-ms-flex-preferred-size: 91.66667%;
flex-basis: 91.66667%;
max-width: 91.66667%; }
.col-sm-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 100%;
-moz-flex-basis: 100%;
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%; }
.col-sm-offset-0 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 0; }
.col-sm-offset-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 8.33333%; }
.col-sm-offset-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 16.66667%; }
.col-sm-offset-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 25%; }
.col-sm-offset-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 33.33333%; }
.col-sm-offset-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 41.66667%; }
.col-sm-offset-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 50%; }
.col-sm-offset-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 58.33333%; }
.col-sm-offset-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 66.66667%; }
.col-sm-offset-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 75%; }
.col-sm-offset-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 83.33333%; }
.col-sm-offset-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 91.66667%; }
.col-sm-offset-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 100%; }
.col-sm {
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-flex-basis: 0;
-moz-flex-basis: 0;
-ms-flex-preferred-size: 0;
flex-basis: 0;
max-width: 100%; }
.start-sm {
-webkit-box-pack: start;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
justify-content: flex-start;
text-align: left; }
.center-sm {
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
text-align: center; }
.end-sm {
-webkit-box-pack: end;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
justify-content: flex-end;
text-align: right; }
.top-sm {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
align-items: flex-start; }
.middle-sm {
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center; }
.bottom-sm {
-webkit-box-align: end;
-ms-flex-align: end;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
align-items: flex-end; }
.around-sm {
-ms-flex-pack: distribute;
-webkit-justify-content: space-around;
-moz-justify-content: space-around;
justify-content: space-around; }
.between-sm {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
justify-content: space-between; }
.first-sm {
order: -1; }
.last-sm {
order: 1; } }
@media only screen and (min-width: 62em) {
.container, .sub-page .container, .page .container {
width: 61rem; }
.hide-md {
display: none; }
.col-md {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: auto;
-moz-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto; }
.col-md-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 8.33333%;
-moz-flex-basis: 8.33333%;
-ms-flex-preferred-size: 8.33333%;
flex-basis: 8.33333%;
max-width: 8.33333%; }
.col-md-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 16.66667%;
-moz-flex-basis: 16.66667%;
-ms-flex-preferred-size: 16.66667%;
flex-basis: 16.66667%;
max-width: 16.66667%; }
.col-md-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 25%;
-moz-flex-basis: 25%;
-ms-flex-preferred-size: 25%;
flex-basis: 25%;
max-width: 25%; }
.col-md-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 33.33333%;
-moz-flex-basis: 33.33333%;
-ms-flex-preferred-size: 33.33333%;
flex-basis: 33.33333%;
max-width: 33.33333%; }
.col-md-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 41.66667%;
-moz-flex-basis: 41.66667%;
-ms-flex-preferred-size: 41.66667%;
flex-basis: 41.66667%;
max-width: 41.66667%; }
.col-md-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 50%;
-moz-flex-basis: 50%;
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
max-width: 50%; }
.col-md-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 58.33333%;
-moz-flex-basis: 58.33333%;
-ms-flex-preferred-size: 58.33333%;
flex-basis: 58.33333%;
max-width: 58.33333%; }
.col-md-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 66.66667%;
-moz-flex-basis: 66.66667%;
-ms-flex-preferred-size: 66.66667%;
flex-basis: 66.66667%;
max-width: 66.66667%; }
.col-md-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 75%;
-moz-flex-basis: 75%;
-ms-flex-preferred-size: 75%;
flex-basis: 75%;
max-width: 75%; }
.col-md-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 83.33333%;
-moz-flex-basis: 83.33333%;
-ms-flex-preferred-size: 83.33333%;
flex-basis: 83.33333%;
max-width: 83.33333%; }
.col-md-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 91.66667%;
-moz-flex-basis: 91.66667%;
-ms-flex-preferred-size: 91.66667%;
flex-basis: 91.66667%;
max-width: 91.66667%; }
.col-md-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 100%;
-moz-flex-basis: 100%;
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%; }
.col-md-offset-0 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 0; }
.col-md-offset-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 8.33333%; }
.col-md-offset-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 16.66667%; }
.col-md-offset-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 25%; }
.col-md-offset-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 33.33333%; }
.col-md-offset-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 41.66667%; }
.col-md-offset-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 50%; }
.col-md-offset-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 58.33333%; }
.col-md-offset-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 66.66667%; }
.col-md-offset-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 75%; }
.col-md-offset-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 83.33333%; }
.col-md-offset-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 91.66667%; }
.col-md-offset-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 100%; }
.col-md {
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-flex-basis: 0;
-moz-flex-basis: 0;
-ms-flex-preferred-size: 0;
flex-basis: 0;
max-width: 100%; }
.start-md {
-webkit-box-pack: start;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
justify-content: flex-start;
text-align: left; }
.center-md {
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
text-align: center; }
.end-md {
-webkit-box-pack: end;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
justify-content: flex-end;
text-align: right; }
.top-md {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
align-items: flex-start; }
.middle-md {
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center; }
.bottom-md {
-webkit-box-align: end;
-ms-flex-align: end;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
align-items: flex-end; }
.around-md {
-ms-flex-pack: distribute;
-webkit-justify-content: space-around;
-moz-justify-content: space-around;
justify-content: space-around; }
.between-md {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
justify-content: space-between; }
.first-md {
order: -1; }
.last-md {
order: 1; } }
@media only screen and (min-width: 75em) {
.container, .sub-page .container, .page .container {
width: 71rem; }
.hide-lg {
display: none; }
.col-lg {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: auto;
-moz-flex-basis: auto;
-ms-flex-preferred-size: auto;
flex-basis: auto; }
.col-lg-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 8.33333%;
-moz-flex-basis: 8.33333%;
-ms-flex-preferred-size: 8.33333%;
flex-basis: 8.33333%;
max-width: 8.33333%; }
.col-lg-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 16.66667%;
-moz-flex-basis: 16.66667%;
-ms-flex-preferred-size: 16.66667%;
flex-basis: 16.66667%;
max-width: 16.66667%; }
.col-lg-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 25%;
-moz-flex-basis: 25%;
-ms-flex-preferred-size: 25%;
flex-basis: 25%;
max-width: 25%; }
.col-lg-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 33.33333%;
-moz-flex-basis: 33.33333%;
-ms-flex-preferred-size: 33.33333%;
flex-basis: 33.33333%;
max-width: 33.33333%; }
.col-lg-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 41.66667%;
-moz-flex-basis: 41.66667%;
-ms-flex-preferred-size: 41.66667%;
flex-basis: 41.66667%;
max-width: 41.66667%; }
.col-lg-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 50%;
-moz-flex-basis: 50%;
-ms-flex-preferred-size: 50%;
flex-basis: 50%;
max-width: 50%; }
.col-lg-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 58.33333%;
-moz-flex-basis: 58.33333%;
-ms-flex-preferred-size: 58.33333%;
flex-basis: 58.33333%;
max-width: 58.33333%; }
.col-lg-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 66.66667%;
-moz-flex-basis: 66.66667%;
-ms-flex-preferred-size: 66.66667%;
flex-basis: 66.66667%;
max-width: 66.66667%; }
.col-lg-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 75%;
-moz-flex-basis: 75%;
-ms-flex-preferred-size: 75%;
flex-basis: 75%;
max-width: 75%; }
.col-lg-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 83.33333%;
-moz-flex-basis: 83.33333%;
-ms-flex-preferred-size: 83.33333%;
flex-basis: 83.33333%;
max-width: 83.33333%; }
.col-lg-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 91.66667%;
-moz-flex-basis: 91.66667%;
-ms-flex-preferred-size: 91.66667%;
flex-basis: 91.66667%;
max-width: 91.66667%; }
.col-lg-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
-webkit-flex-basis: 100%;
-moz-flex-basis: 100%;
-ms-flex-preferred-size: 100%;
flex-basis: 100%;
max-width: 100%; }
.col-lg-offset-0 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 0; }
.col-lg-offset-1 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 8.33333%; }
.col-lg-offset-2 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 16.66667%; }
.col-lg-offset-3 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 25%; }
.col-lg-offset-4 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 33.33333%; }
.col-lg-offset-5 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 41.66667%; }
.col-lg-offset-6 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 50%; }
.col-lg-offset-7 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 58.33333%; }
.col-lg-offset-8 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 66.66667%; }
.col-lg-offset-9 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 75%; }
.col-lg-offset-10 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 83.33333%; }
.col-lg-offset-11 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 91.66667%; }
.col-lg-offset-12 {
box-sizing: border-box;
-webkit-box-flex: 0;
-webkit-flex-grow: 0;
-moz-flex-grow: 0;
-ms-flex-positive: 0;
flex-grow: 0;
-webkit-flex-shrink: 0;
-moz-flex-shrink: 0;
-ms-flex-negative: 0;
flex-shrink: 0;
padding-right: 0.5rem;
padding-left: 0.5rem;
margin-left: 100%; }
.col-lg {
-webkit-box-flex: 1;
-webkit-flex-grow: 1;
-moz-flex-grow: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-flex-basis: 0;
-moz-flex-basis: 0;
-ms-flex-preferred-size: 0;
flex-basis: 0;
max-width: 100%; }
.start-lg {
-webkit-box-pack: start;
-ms-flex-pack: start;
-webkit-justify-content: flex-start;
-moz-justify-content: flex-start;
justify-content: flex-start;
text-align: left; }
.center-lg {
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
-moz-justify-content: center;
justify-content: center;
text-align: center; }
.end-lg {
-webkit-box-pack: end;
-ms-flex-pack: end;
-webkit-justify-content: flex-end;
-moz-justify-content: flex-end;
justify-content: flex-end;
text-align: right; }
.top-lg {
-webkit-box-align: start;
-ms-flex-align: start;
-webkit-align-items: flex-start;
-moz-align-items: flex-start;
align-items: flex-start; }
.middle-lg {
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
-moz-align-items: center;
align-items: center; }
.bottom-lg {
-webkit-box-align: end;
-ms-flex-align: end;
-webkit-align-items: flex-end;
-moz-align-items: flex-end;
align-items: flex-end; }
.around-lg {
-ms-flex-pack: distribute;
-webkit-justify-content: space-around;
-moz-justify-content: space-around;
justify-content: space-around; }
.between-lg {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
-webkit-justify-content: space-between;
-moz-justify-content: space-between;
justify-content: space-between; }
.first-lg {
order: -1; }
.last-lg {
order: 1; } }
body::-webkit-scrollbar {
width: 0;
display: none; }
html {
-ms-touch-action: none; }
@font-face {
font-family: Roboto;
src: url(fonts/Roboto-Regular.ttf);
font-weight: 400; }
@font-face {
font-family: Roboto;
src: url(fonts/Roboto-Bold.ttf);
font-weight: 700; }
@font-face {
font-family: Blizzard Regular;
src: url(fonts/blizzardregular.ttf);
src: url(fonts/blizzardregular.woff); }
a {
text-decoration: none;
font-family: Roboto; }
body {
color: #000;
font-family: Roboto; }
@media (max-width: 1024px) {
body {
overflow: visible;
height: auto !important; } }
@media (max-width: 1024px) {
html {
overflow: visible;
height: auto !important; } }
.container, .sub-page .container, .page .container {
width: 1370px;
padding: 0 15px;
max-width: 100%;
margin: 0 auto;
box-sizing: border-box; }
@media (max-width: 1390px) {
.container, .sub-page .container, .page .container {
padding: 0 30px;
width: 1020px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.container, .sub-page .container, .page .container {
width: 1260px; } }
@media (max-width: 1290px) {
.container, .sub-page .container, .page .container {
width: calc(100% - 60px); } }
@media (max-width: 1024px) {
.container, .sub-page .container, .page .container {
width: 100%;
padding: 0 20px; } }
.sub-page .container {
width: 71rem;
max-width: 100%; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.sub-page .container {
width: 1200px; } }
.page strong, .page b {
font-weight: bold; }
.page .container {
width: 1220px;
max-width: 100%; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.page .container {
width: 71rem; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.page .container {
width: 1200px; } }
header {
position: absolute;
width: 100%; }
@media (max-width: 1024px) {
header {
display: block;
height: 70px;
position: relative;
box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
background-color: #ce2016; } }
@media (max-width: 1024px) {
header .navigation {
width: 100%;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
align-items: center;
height: 100%;
justify-content: space-between; } }
header .logo {
margin-top: 30px;
display: inline-block;
position: relative;
z-index: 9999; }
header .logo img {
max-width: 100%;
height: auto; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
header .logo {
transform: scale(0.8); } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
header .logo {
transform: scale(1);
/*width: 108px;*/
width: 7.625vw; }
header .logo img {
max-width: 100%; } }
@media (max-width: 1024px) {
header .logo {
width: 65px;
height: 65px;
margin-top: 0; } }
@media (max-width: 1024px) {
header .logo img {
max-width: 100%; } }
header .burger {
width: 82px;
height: 70px;
background: url(img/nav.svg) center no-repeat;
background-size: 82px 70px;
display: block;
position: relative;
z-index: 9999; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
header .burger {
transform: scale(0.8); } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
header .burger {
width: 4.2vw;
height: 3.64vw;
transform: scale(0.7); } }
@media (max-width: 1024px) {
header .burger {
background: url(img/navmob.svg) center no-repeat;
background-size: contain;
width: 51px;
height: 39px;
margin-right: 20px;
top: auto; } }
section {
height: 100vh;
overflow-y: scroll; }
@media (max-width: 1024px) {
section {
height: auto; } }
section#video {
overflow: hidden;
background: #ce2016;
background-size: cover;
position: relative;
z-index: 0; }
@media (max-width: 1024px) {
section#video {
background-repeat: no-repeat;
height: 100vh;
background-size: cover;
overflow: hidden; } }
@media (max-width: 1024px) and (orientation: landscape) {
section#video {
height: 100vw; } }
section#video .play {
background: url(img/play.svg);
width: 90px;
cursor: pointer;
height: 90px;
position: absolute;
left: 50%;
top: 50vh;
transform: translate(-50%, -200%);
z-index: 2; }
section#video .play.pause {
background: url(img/icon-pause.png);
background-size: cover; }
@media (max-width: 1024px) {
section#video .play {
width: 60px;
height: 60px;
background-size: contain;
top: 15.4%;
transform: translate(-50%, 0);
position: absolute; } }
section#video h1 {
color: #ffffff;
font-family: Blizzard Regular;
font-size: 7.8125vw;
font-weight: 400;
letter-spacing: -4.5px;
line-height: 6.7vw;
text-align: center;
width: 457px;
width: 100vw;
left: 0;
max-width: 100%;
margin: 41.7vh auto 0 0;
position: absolute;
bottom: 282px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section#video h1 {
text-shadow: 1px 1px #000; } }
@media (max-width: 1024px) {
section#video h1 {
color: #000;
font-size: 13.8666666667vw;
font-weight: 400;
letter-spacing: -1.59px;
margin-top: 21.466667vw;
line-height: 13.8666666667vw;
top: 23.835082vh;
text-align: center;
margin-left: auto;
width: 100%;
left: 0;
z-index: 999; } }
@media (max-width: 1024px) and (orientation: landscape) {
section#video h1 {
top: 30.835082vw; } }
.mobbottles {
display: none; }
@media (max-width: 1024px) {
.mobbottles {
width: 23.83808vh;
height: 40.77961vh;
position: absolute;
z-index: 999;
right: 6.93333vw;
/*margin-top: vhm_header(276px);*/
bottom: 19.1904vh;
background: url(img/bottles.png) center no-repeat;
background-size: contain; } }
@media (max-width: 1024px) and (max-width: 415px) {
.mobbottles {
max-width: 159px; } }
.teaser_wrap {
background: url(img/teaser.png);
bottom: 0;
width: 100%;
height: 150px;
position: absolute; }
@media (max-width: 1024px) {
.teaser_wrap {
height: 54.623688vh;
position: absolute;
top: 51vw;
background: url(img/teasermob.png) left top;
z-index: 99;
background-repeat: repeat-x;
background-size: contain; } }
.teaser {
background: url(img/bg-footer.png);
position: absolute;
bottom: 0;
width: 100%;
height: 150px; }
@media (max-width: 1024px) {
.teaser {
background: url(img/bg-footer.png);
background-repeat: no-repeat;
background-size: contain;
display: block;
height: 33.836582vh;
top: 25.63718vh; }
.teaser:before {
content: '';
background-color: #ce2016;
display: block;
height: 28.33583vh;
margin-top: 15px; } }
.teaser .container.hide {
position: relative;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
width: 1080px;
justify-content: flex-end;
align-items: flex-start;
/*flex-wrap: wrap;*/ }
.teaser .container.hide div:first-child {
padding-top: 40px; }
@media (max-width: 1024px) {
.teaser .container.hide div:first-child {
width: 30%;
text-align: left; } }
@media (max-width: 500px) {
.teaser .container.hide div:first-child {
transform: scale(0.6); } }
@media (max-width: 400px) {
.teaser .container.hide div:first-child {
transform: scale(0.5); } }
@media (max-width: 1024px) {
.teaser .container.hide div:last-child {
width: calc(70% - 40px);
padding-left: 20px;
padding-right: 20px; }
.teaser .container.hide div:last-child p {
padding: 0;
text-align: left;
margin: 0;
margin-top: 53px; } }
.teaser .container.hide img {
width: 187px;
height: auto;
position: relative;
/*transform: scale(2) translate(0, -11%);*/
top: -108px; }
@media (max-width: 1024px) {
.teaser .container.hide img {
top: auto;
bottom: 0; } }
@media (max-width: 500px) {
.teaser .container.hide img {
top: -108px;
bottom: initial; } }
@media (max-width: 400px) {
.teaser .container.hide img {
top: -217px; } }
@media (max-width: 1024px) {
.teaser .container.hide {
position: absolute;
top: 9vh;
padding-left: 0;
padding-right: 0;
width: 100%;
justify-content: center; } }
.teaser a.btn {
margin-left: 0;
top: auto;
position: absolute;
/* left: 50%; */
/* transform: translate(-50%, 0); */
line-height: 22px;
/* margin-top: 6px; */
/* margin-top: 48px; */
display: inline; }
@media (max-width: 1024px) {
.teaser a.btn {
display: block;
width: 184px;
position: relative;
margin-left: 0;
margin-right: 0;
top: 2vh;
left: 0;
top: 0;
max-width: 100%;
font-size: 14px;
padding: 5px;
width: 137px;
margin-top: 9px;
min-width: auto;
left: 0;
transform: translate(0, 0%); } }
@media (max-width: 400px) {
.teaser a.btn {
max-width: 100%;
font-size: 15px;
padding: 7px;
width: 147px;
margin-top: 9px;
min-width: auto; } }
@media (max-width: 360px) {
.teaser a.btn {
max-width: 100%;
font-size: 14px;
padding: 5px;
width: 137px;
margin-top: 9px;
min-width: auto; } }
.teaser p, .teaser ul, .teaser ol {
padding-top: 58px;
padding-left: 95px;
color: #ffffff;
font-family: Blizzard Regular;
font-size: 36px;
font-weight: 400;
line-height: 39px;
margin: 0; }
@media (max-width: 1330px) {
.teaser p, .teaser ul, .teaser ol {
margin-right: 9vw;
padding-left: 0; } }
@media (min-width: 1024px) {
.teaser p, .teaser ul, .teaser ol {
text-align: center;
margin-right: 4vw; } }
@media (max-width: 1024px) {
.teaser p, .teaser ul, .teaser ol {
margin: 0 27vw 0;
padding-left: 0;
padding-top: 0;
font-size: 4.1979vh;
line-height: 4.64768vh;
letter-spacing: -0.84px;
text-align: center; } }
@media (max-width: 625px) {
.teaser p, .teaser ul, .teaser ol {
font-size: 3.197901vh; } }
@media (max-width: 370px) {
.teaser p, .teaser ul, .teaser ol {
margin-top: -33px; } }
.teaser p span, .teaser ul span, .teaser ol span {
font-size: 26px;
display: block; }
@media (max-width: 1024px) {
.teaser p span, .teaser ul span, .teaser ol span {
font-size: 3.5982vh;
line-height: 5.24738vh;
display: block; } }
.show-teaser {
display: block;
width: 92px;
height: 50px;
border-radius: 24px;
border: 3px solid #000;
border-bottom: 10px solid #000;
background-color: #ddc9a1;
background-image: url(img/arr_down.svg);
background-position: center;
background-repeat: no-repeat;
position: absolute;
left: 50%;
transform: translate(-50%, 0%);
bottom: 200px; }
@media (max-width: 1024px) {
.show-teaser {
display: none; } }
.show-teaser:hover {
border-bottom: 7px solid #000; }
.show-teaser:active {
border: 3px solid #000;
background-color: #ce2016; }
a.btn {
border-radius: 28px;
border: 3px solid #000000;
background-color: #ddc9a1;
color: #000000;
font-family: Blizzard Regular;
font-size: 22px;
font-weight: 400;
letter-spacing: -0.66px;
line-height: 30px;
text-align: center;
padding: 10px 25px;
border-bottom: 10px solid #000;
text-decoration: none;
display: inline-block;
min-width: 178px;
box-sizing: border-box; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
a.btn {
min-width: 160px;
line-height: 25px;
font-size: 20px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
a.btn {
line-height: 20px; } }
@media (max-width: 1024px) {
a.btn {
margin-bottom: 50px;
position: relative;
left: 50%;
transform: translate(-50%, 0);
min-width: 178px;
font-size: 22px;
line-height: 20px; } }
a.btn:hover {
text-decoration: underline; }
a.btn:active {
color: #fff;
background-color: #ce2016;
text-decoration: none;
border: 3px solid #000000; }
section + section {
height: calc(100vh);
margin-top: -9.25926vh;
background: url(img/bg.png);
padding-top: 9.25926vh;
background-repeat: round; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
section + section {
margin-top: -80px;
padding-top: 80px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section + section {
margin-top: -62px;
padding-top: 62px; } }
@media (max-width: 1024px) {
section + section {
margin-top: -60px;
padding-top: 55px;
padding-bottom: 60px;
height: auto;
background: url(img/mobile/bg.png);
background-size: contain; } }
section + section .container, section + section .sub-page .container, .sub-page section + section .container, section + section .page .container, .page section + section .container {
height: 100%; }
@media (max-width: 1024px) {
section + section .container, section + section .sub-page .container, .sub-page section + section .container, section + section .page .container, .page section + section .container {
height: auto; } }
section + section p, section + section ul, section + section ol {
margin: 25px 0;
letter-spacing: -0.1px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section + section p, section + section ul, section + section ol {
margin: 10px 0; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
section + section p, section + section ul, section + section ol {
margin: 17px 0; } }
@media (max-width: 1024px) {
section + section p, section + section ul, section + section ol {
word-break: break-word;
padding-right: 20px; } }
section + section .container > .row:first-child, section + section .sub-page .container > .row:first-child, .sub-page section + section .container > .row:first-child, section + section .page .container > .row:first-child, .page section + section .container > .row:first-child {
height: 100%;
align-items: center; }
@media (max-width: 1024px) {
section + section .container > .row:first-child, section + section .sub-page .container > .row:first-child, .sub-page section + section .container > .row:first-child, section + section .page .container > .row:first-child, .page section + section .container > .row:first-child {
align-items: initial; } }
#bottles {
width: 35.83vh;
height: 61.16vh;
left: 63.5416vw;
background: url(img/bottles.png);
background-size: contain;
background-repeat: no-repeat;
position: fixed;
top: 205px;
-webkit-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-moz-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-ms-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-o-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
z-index: 99; }
@media (max-width: 1024px) {
#bottles {
position: relative;
display: none; } }
.fun {
right: 36.57vh; }
h2, h3, h4 {
font-family: Blizzard Regular;
font-size: 70px;
font-weight: 400;
line-height: 78px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
h2, h3, h4 {
font-size: 50px;
line-height: 58px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
h2, h3, h4 {
font-size: 40px;
line-height: 48px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
h2, h3, h4 {
font-size: 37px;
line-height: 45px; } }
@media (max-width: 1024px) {
h2, h3, h4 {
font-size: 36px;
font-weight: 400;
letter-spacing: -1.08px;
line-height: 47px; } }
h3 {
font-size: 50px;
line-height: 58px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
h3 {
font-size: 30px;
line-height: 38px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
h3 {
font-size: 25px;
line-height: 33px; } }
@media (max-width: 1024px) {
h3 {
font-size: 26px;
font-weight: 400;
line-height: 35px; } }
h4 {
font-size: 30px;
line-height: 34px; }
p, ul, ol {
font-family: Roboto;
font-size: 20px;
font-weight: 400;
line-height: 30px;
margin-top: 10px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
p, ul, ol {
font-size: 15px;
line-height: 24px; } }
@media (max-width: 1024px) {
p, ul, ol {
font-size: 20px;
font-weight: 400;
line-height: 30px; } }
#beers {
margin-top: 0;
padding-top: 0;
height: 100%;
background: url(img/beer.jpg);
background-repeat: no-repeat;
background-size: cover; }
@media (max-width: 1024px) {
#beers {
padding-top: 50px;
padding-bottom: 30px;
background: url(img/mobile/bgbeer.png);
background-size: cover;
background-position: 0 -30px; }
#beers:before {
content: '';
background: url(img/mobile/bgbeer.png);
position: absolute; } }
#beers .nextscreen {
bottom: 20px; }
#beers .container {
height: auto;
padding-top: 7vh; }
#beers .row + .row {
margin-top: 10.18519vh; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
#beers .row + .row {
margin-top: 40px; } }
@media (max-width: 1024px) {
#beers .row + .row {
margin-top: 0;
padding-top: 0; } }
.event {
text-align: left; }
@media (max-width: 1024px) and (orientation: landscape) {
.event {
width: 100vw; } }
.event img {
border-radius: 50%;
max-width: 100%; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.event img {
width: 190px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.event img {
width: 150px; } }
@media (max-width: 1024px) {
.event img {
width: 32vw;
max-width: 100%; } }
.event h3 {
text-align: left;
font-family: Blizzard Regular;
font-size: 50px;
font-weight: 400;
line-height: 60px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.event h3 {
font-size: 30px;
line-height: 40px; } }
@media (max-width: 1024px) {
.event h3 {
font-size: 28px;
letter-spacing: -0.84px;
line-height: 43px; } }
.event h4 {
margin-top: 8px;
text-align: left;
font-family: Blizzard Regular;
font-size: 30px;
font-weight: 400;
line-height: 34px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.event h4 {
font-size: 20px;
line-height: 24px;
margin-top: 0; } }
@media (max-width: 1024px) {
.event h4 {
letter-spacing: -0.6px; } }
.event .intro {
margin-top: 30px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.event .intro {
margin-top: 15px; } }
.event .intro p, .event .intro ul, .event .intro ol {
width: 100%;
font-size: 20px;
margin-top: 7px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.event .intro p, .event .intro ul, .event .intro ol {
font-size: 16px; } }
@media (max-width: 1024px) {
.event .intro p, .event .intro ul, .event .intro ol {
font-size: 16px;
margin-bottom: 0;
margin-top: 2px;
line-height: 1; } }
.event .pin {
color: #ce2016;
background: url(img/pin.png) left center no-repeat;
padding-left: 23px;
margin-top: 5px;
display: inline-block;
font-size: 20px;
line-height: 26px;
background-size: 16px; }
@media (max-width: 1024px) {
.event .pin {
font-size: 16px;
padding-left: 19px; } }
.event .list {
margin-top: 30px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.event .list {
margin-top: 20px; } }
.event .list .li {
cursor: pointer;
width: 122px;
height: 122px;
position: relative;
overflow: hidden; }
.event .list .li a {
cursor: pointer; }
.event .list .li * {
cursor: default; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.event .list .li {
width: 102px;
height: 102px; } }
@media (max-width: 1024px) {
.event .list .li {
width: 25.86667vw;
height: 25.86667vw; } }
.event .list .li img {
max-width: 100%;
max-height: 100%; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.event .list .li img {
width: 100%;
max-width: 100%; } }
.event .list .li:before {
content: ' ';
background: rgba(0, 0, 0, 0.403);
position: absolute;
z-index: 1;
display: block;
width: 100%;
height: 100%;
left: 0;
top: 0;
border-radius: 50%;
opacity: 1; }
.event .list .li:hover:before {
opacity: 0;
-webkit-transition: opacity 0.5s ease-in-out;
-moz-transition: opacity 0.5s ease-in-out;
-ms-transition: opacity 0.5s ease-in-out;
-o-transition: opacity 0.5s ease-in-out; }
.event .list .li .date {
width: 100%;
position: absolute;
text-align: center;
z-index: 2;
left: 0;
top: 0;
padding-top: 20px;
color: #fff;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
align-items: center; }
@media (max-width: 1024px) {
.event .list .li .date {
padding-top: 20%; } }
.event .list .li .date .month {
font-size: 18px;
font-weight: 500;
line-height: 27px;
text-transform: uppercase;
margin: 0;
width: 100%; }
@media (max-width: 1024px) {
.event .list .li .date .month {
font-size: 3.73333vw;
line-height: 4.8vw;
padding-right: 0; } }
.event .list .li .date .day {
width: 100%;
font-size: 46px;
font-weight: 500;
line-height: 55px;
margin: 0; }
@media (max-width: 1024px) {
.event .list .li .date .day {
font-size: 9.6vw;
line-height: 12.26667vw;
padding-right: 0; } }
.event .list .li + .li {
margin-left: 16px; }
.event .txt p, .event .txt ul, .event .txt ol {
margin: 25px 0;
font-size: 20px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.event .txt p, .event .txt ul, .event .txt ol {
font-size: 16px;
margin: 17px 0; } }
@media (max-width: 1024px) {
.event .txt p, .event .txt ul, .event .txt ol {
line-height: 30px; } }
#subline .socials {
margin-top: 76px; }
@media (max-width: 1024px) {
#subline .socials {
margin-top: 69px;
justify-content: space-between;
width: 475px;
margin-left: auto;
margin-right: auto;
max-width: 100%; } }
#subline .socials a {
display: block;
width: 130px;
height: 130px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
#subline .socials a {
width: 120px;
height: 120px; } }
@media (max-width: 1024px) {
#subline .socials a {
width: 26.13333vw;
height: 26.13333vw;
max-width: 120px;
max-height: 120px; } }
@media (max-width: 321px) {
#subline .socials a {
max-width: 80px;
max-height: 80px; } }
#subline .socials a + a {
margin-left: 30px; }
@media (max-width: 1024px) {
#subline .socials a + a {
margin-left: 5vw; } }
@media (max-width: 340px) {
#subline .socials a + a {
margin-left: 0; } }
#subline .socials .fb {
background: url(img/fbbig.png) center no-repeat;
background-size: contain; }
#subline .socials .ytb {
background: url(img/youtbig.png) center no-repeat;
background-size: contain; }
#subline .socials .spt {
background: url(img/hzbig.png) center no-repeat;
background-size: contain; }
.links {
text-align: left;
padding-left: 40px;
margin-top: 50px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.links {
margin-top: 20px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.links {
transform: scale(0.7); } }
@media (max-width: 1024px) {
.links {
padding-left: 0; } }
@media (max-width: 1024px) {
.links {
transform: scale(1); } }
.links .link {
width: 255px;
height: 287px;
margin-bottom: 25px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.links .link {
width: 190px;
height: 227px; } }
@media (max-width: 1024px) {
.links .link a.btn {
min-width: 178px; } }
.links .download {
background: url(img/download.png) left bottom no-repeat; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.links .download {
background-size: contain;
margin-left: 22px; } }
@media (max-width: 1024px) {
.links .download {
width: 46.93333vw;
height: 44.53333vw;
background: url(img/download.png) right bottom no-repeat;
background-size: contain;
margin-left: auto;
margin-right: auto; } }
.links .download + a {
margin-left: 10px; }
@media (max-width: 1024px) {
.links .download + a {
margin-left: auto; } }
.links .gmail {
background: url(img/gmail.png) center bottom no-repeat; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.links .gmail {
background-size: contain;
width: 155px;
margin-left: 36px; } }
@media (max-width: 1024px) {
.links .gmail {
background-size: contain;
width: 33.33333vw;
height: 33.33333vw;
margin-left: auto;
margin-right: auto; } }
.links .gmail + a {
margin-left: 38px; }
@media (max-width: 1024px) {
.links .gmail + a {
width: 33.33333vw; } }
@media (max-width: 1024px) {
.links .gmail + a {
margin-left: auto; } }
#contact .box {
text-align: left; }
section#contact.active {
top: calc(500% - 46px) !important; }
footer {
background: url(img/bg-footer.png);
height: 146px;
margin-top: -146px;
z-index: 99;
position: relative; }
footer.absolute {
position: absolute;
top: 600%;
left: 0;
width: 100%;
margin-top: -146px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
footer.absolute {
margin-top: -114px;
height: 114px; } }
@media (max-width: 1024px) {
footer.absolute {
position: relative;
margin-top: -15px;
top: 0;
background-size: contain;
height: auto; } }
@media (max-width: 1024px) {
footer {
margin-top: -15px;
height: auto;
height: auto;
background-size: contain;
overflow: hidden;
background-repeat: no-repeat;
padding-bottom: 80px; }
footer:before {
content: '';
width: 100%;
height: 100%;
margin-top: 15px;
position: absolute;
background: #ce2016; } }
footer .container, footer .sub-page .container, .sub-page footer .container, footer .page .container, .page footer .container {
height: 100%; }
@media (max-width: 1024px) {
footer .container, footer .sub-page .container, .sub-page footer .container, footer .page .container, .page footer .container {
height: auto; } }
footer .container > .row, footer .sub-page .container > .row, footer .page .container > .row {
position: relative;
height: 100%;
padding-top: 30px; }
@media (max-width: 1024px) {
footer .container > .row, footer .sub-page .container > .row, footer .page .container > .row {
height: auto; } }
@media (max-width: 1024px) {
footer .menu li {
display: block;
text-align: center;
width: 100%; } }
footer .menu li a {
color: #fff;
font-size: 16px;
font-weight: 500;
line-height: 22px; }
@media (max-width: 1024px) {
footer .menu li a {
font-size: 20px;
line-height: 65px; } }
footer .menu li + li {
margin-left: 70px; }
@media (max-width: 1024px) {
footer .menu li + li {
margin-left: auto;
margin-top: 25px; } }
@media (max-width: 1024px) {
footer .social {
width: 100%;
max-width: 375px;
margin-left: auto;
margin-right: auto;
margin-top: 80px;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: space-between; } }
footer .social a {
display: block; }
footer .social a + a {
margin-left: 20px; }
@media (max-width: 1024px) {
footer .social a + a {
margin-left: auto; } }
footer .social .fb {
width: 20px;
height: 39px;
background: url(img/icon_facebook.png) center no-repeat;
background-size: contain; }
@media (max-width: 1024px) {
footer .social .fb {
width: 31px;
height: 59px; } }
footer .social .yt {
width: 44px;
height: 31px;
background: url(img/icon_youtube.png) center no-repeat;
background-size: contain; }
@media (max-width: 1024px) {
footer .social .yt {
width: 67px;
height: 47px; } }
footer .social .inst {
width: 44px;
height: 41px;
background: url(img/icon_instagram.png) center no-repeat;
background-size: contain; }
@media (max-width: 1024px) {
footer .social .inst {
width: 61px;
height: 61px; } }
footer .social .sci {
width: 40px;
height: 41px;
background: url(img/icon_spotify.png) center no-repeat;
background-size: contain; }
@media (max-width: 1024px) {
footer .social .sci {
width: 61px;
height: 61px; } }
footer .social p, footer .social ul, footer .social li {
margin-left: 20px;
color: #ffffff;
font-family: Blizzard Regular;
font-size: 22px;
font-weight: 400;
line-height: 30px; }
@media (max-width: 1024px) {
footer .social p, footer .social ul, footer .social li {
margin-left: auto;
width: 100%;
text-align: center;
line-height: 63px; } }
#totop {
cursor: pointer;
width: 179px;
height: 256px;
background: url(img/sternla_stern.png) center no-repeat;
position: absolute;
z-index: 99;
right: -140px;
bottom: 10px; }
@media (max-width: 1640px) {
#totop {
right: 0px;
/*transform: translate(25%, 0);*/ } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
#totop {
display: none; } }
@media (max-width: 1024px) {
#totop {
display: none; } }
.nextscreen {
width: 100%;
position: absolute;
margin-top: -62px;
z-index: 9;
left: 0; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.nextscreen {
margin-top: -56px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.nextscreen {
margin-top: -47px; } }
@media (max-width: 1024px) {
.nextscreen {
display: none; } }
.nextscreen a {
cursor: pointer;
display: block;
margin: 0 auto;
width: 46px;
height: 30px;
background: url(img/arrow_down.svg) center no-repeat;
background-size: contain; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.nextscreen a {
transform: scale(0.8); } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.nextscreen a {
transform: scale(0.8); } }
.beer.funbox {
top: 0;
right: auto;
left: 52.5vw;
width: 61.2vh;
height: 78.8vh; }
@media (max-width: 1024px) {
.beer.funbox {
width: 90%;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: scale(0.8); }
.beer.funbox .bottles_mob.hide-md {
margin-top: 4.88vh; } }
.beer.funbox .papier2 {
width: 12.96296vh;
height: 11.2963vh;
position: absolute;
top: 10.64815vh;
right: 29.53704vh;
background: url(img/papier2.png) center;
background-size: contain; }
.beer.funbox .eclipse {
right: -5vh; }
.beer.funbox .txt1 {
width: 23.61111vh;
height: 11.57407vh;
position: absolute;
top: 24.07407vh;
right: 37.4vh;
background: url(img/red-arr-1.png) right bottom no-repeat;
background-size: 15.37037vh 3.51852vh; }
.beer.funbox .txt1 h4 {
font-size: 3.7037vh;
line-height: 4.44444vh; }
.beer.funbox .txt2 {
width: 26.85185vh;
height: 13.14815vh;
position: absolute;
top: 5.09259vh;
right: -16.6vh;
background: url(img/red-arr-2.png) left bottom no-repeat;
background-size: 10.18519vh 8.14815vh; }
.beer.funbox .txt2 h4 {
text-align: right;
font-size: 3.7037vh;
line-height: 4.44444vh; }
.beer.funbox .glass {
width: 20.1vh;
height: 51.94vh;
background: url(img/beer.png) center no-repeat;
background-size: contain;
position: absolute;
right: -14.8vh;
top: 27vh; }
.funbox {
position: absolute;
right: auto;
left: 52.5vw;
width: 61.2vh;
top: 110px;
height: 78.8vh; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.funbox {
/*top: 80px;*/ } }
@media (max-width: 1024px) {
.funbox {
position: relative;
margin-bottom: 0; } }
.funbox h4 {
font-family: Blizzard Regular;
font-size: 40px;
font-weight: 400;
line-height: 48px; }
.funbox .eclipse {
position: absolute;
top: 11.48vh;
width: 51.85vh;
height: 51.85vh;
background-color: rgba(191, 152, 45, 0.211);
opacity: 0.2;
border-radius: 50%;
right: -5vh; }
@media (max-width: 1024px) {
.funbox .eclipse {
opacity: 1; } }
#bottles.fun[data-index="1"] {
top: -100%;
transform: translate(0%, 0%);
-webkit-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-moz-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-ms-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-o-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out; }
#bottles.fun[data-index="6"] {
top: -100%;
-webkit-transition: top 0.6s ease-in-out;
-moz-transition: top 0.6s ease-in-out;
-ms-transition: top 0.6s ease-in-out;
-o-transition: top 0.6s ease-in-out; }
.wow.animated {
display: block; }
@media (min-width: 1024px) {
.wow.animated {
visibility: visible !important; } }
@media (max-width: 1024px) {
.wow.animated {
display: block;
visibility: hidden; } }
@media (max-width: 1024px) {
.rock.funbox {
width: 90%;
top: 0;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: scale(0.8); }
.rock.funbox .bottles_mob.hide-md {
margin-top: 1.85vh; } }
.rock.funbox .papier {
width: 10.74074vh;
height: 10.64815vh;
position: absolute;
top: 96px;
right: -10.74074vh;
background: url(img/papier.png) center;
background-size: contain; }
.rock.funbox .txt1 {
width: 15.7vh;
height: 21.29vh;
position: absolute;
top: 2.59259vh;
right: 37.4vh;
background: url(img/red-arr-3.png) right bottom no-repeat;
background-size: 7.96296vh 11.01852vh; }
.rock.funbox .txt1 h4 {
font-size: 3.7037vh;
line-height: 4.44444vh; }
.rock.funbox .mice {
width: 14.90741vh;
height: 56.01852vh;
background: url(img/mice.png) center no-repeat;
background-size: contain;
position: absolute;
right: -5.3vh;
top: 18.88889vh; }
.rock.funbox .buble {
width: 20.74074vh;
height: 14.35185vh;
background: url(img/rock.png) center no-repeat;
background-size: contain;
position: absolute;
right: -20.7vh;
top: 27.77778vh; }
#hat {
width: 11.75926vh;
height: 8.05556vh;
background: url(img/cap.png) center no-repeat;
background-size: contain;
left: 74vw;
position: fixed;
top: 18.33333vh;
margin-top: -100vh;
z-index: 99;
-webkit-animation-fill-mode: none !important; }
#hat.hide, .boxwow.hide, .mapwow.hide {
top: 200%;
visibility: hidden; }
.par.funbox {
/*width: 890px;*/ }
@media (max-width: 1024px) {
.par.funbox {
width: 90%;
top: 0;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: scale(0.8); } }
.par.funbox .eclipse {
top: 15.55556vh; }
.par.funbox .parashute1 {
background: url(img/parachute.png) center no-repeat;
background-size: contain;
position: absolute;
width: 26.2037vh;
height: 28.88889vh;
right: 18.3vh;
top: 5.3vh; }
.par.funbox .parashute2 {
position: absolute;
width: 26.2037vh;
height: 28.88889vh;
background: url(img/parachute2.png) center no-repeat;
background-size: contain;
right: -2.5vh;
top: 7.96vh; }
.par.funbox .cloud {
background: url(img/cloud.png);
background-size: contain;
position: absolute; }
.par.funbox .cld1 {
width: 15.55556vh;
height: 7.87037vh;
background-size: contain;
right: 3.7vh;
top: 4vh; }
.par.funbox .cld2 {
width: 11.75926vh;
height: 5.92593vh;
background-size: contain;
right: 38.8vh;
top: 33vh; }
.par.funbox .cld3 {
width: 21.75926vh;
height: 11.01852vh;
background-size: contain;
right: -10.18vh;
top: 35vh; }
.par.funbox .cld4 {
width: 15.37037vh;
height: 7.77778vh;
background-size: contain;
right: 38vh;
top: 62vh; }
.par.funbox .txt1 {
width: 25.18519vh;
height: 11.85185vh;
background: url(img/red-arr-1.png) right bottom no-repeat;
top: 46.2963vh;
position: absolute;
background-size: 12.59259vh 3.51852vh;
right: 40.5vh; }
.par.funbox .txt1 h4 {
font-size: 3.7037vh;
line-height: 4.44444vh; }
.par.funbox .txt2 {
position: absolute;
background: url(img/red-arr-4.png) left top no-repeat;
background-size: 13.51852vh 5.55556vh;
top: 57.31481vh;
right: -17.7vh;
padding-top: 6.01852vh; }
.par.funbox .txt2 h4 {
text-align: right;
font-size: 3.7037vh;
line-height: 4.44444vh; }
@media (max-width: 1024px) {
.deal.funbox {
width: 90%;
max-width: 460px;
left: 0;
right: 0;
top: 0;
margin: 0 auto;
transform: scale(0.8); }
.deal.funbox .bottles_mob.hide-md {
margin-top: 50px; } }
.deal.funbox .txt1 {
width: 15.74074vh;
height: 21.2963vh;
position: absolute;
top: 7vh;
right: 40vh;
background: url(img/red-arr-3.png) right bottom no-repeat;
background-size: 7.96296vh 11.01852vh; }
.deal.funbox .txt1 h4 {
font-size: 3.7037vh;
line-height: 4.44444vh; }
.deal.funbox .prost {
position: absolute;
background: url(img/prost.png) right bottom no-repeat;
background-size: contain;
width: 25.55556vh;
height: 16.38889vh;
right: -19vh;
top: 25vh; }
.mapwow {
position: fixed;
z-index: 99;
bottom: 0;
width: 24.81481vh;
height: 23.51852vh;
background: url(img/map.png) right bottom no-repeat;
background-size: contain;
top: 61.2963vh;
/*right: 74vh;*/
left: 50.2vw; }
.boxwow {
left: 58.43vw;
position: fixed;
z-index: 99;
bottom: 0;
width: 54.53704vh;
height: 35.64815vh;
background: url(img/box.png) right bottom no-repeat;
background-size: contain; }
.secondanimate {
animation: paranimate 2s infinite linear !important; }
.cldanimate {
animation: cloudeaninate 2s infinite linear !important; }
.cldanimate-2 {
animation: cloudeaninate-2 2s infinite linear !important; }
.pulse {
animation: pulseanimate 2s infinite linear !important; }
.rotatebuble {
transform-origin: 0;
animation: rotbubleanimate 2.2s infinite linear !important; }
.rotatebuble2 {
transform-origin: center right;
animation: rotbubleanimate 2.2s infinite linear !important; }
.animblot {
animation: blotanimate 8s infinite linear !important; }
.animphone {
animation: phoneanimate 7.5s infinite linear !important; }
.animplakat {
animation: plakatanimate 7.5s infinite linear !important; }
@keyframes rotbubleanimate {
0% {
transform: rotate(0deg); }
50% {
transform: rotate(7deg); }
100% {
transform: rotate(0deg); } }
@keyframes pulseanimate {
0% {
transform: scale(1.03); }
50% {
transform: scale(1); }
100% {
transform: scale(1.03); } }
@keyframes blotanimate {
0% {
transform: scale(1); }
50% {
transform: scale(1.2); }
100% {
transform: scale(1); } }
@keyframes phoneanimate {
0% {
transform: scale(1) rotate(0deg); }
50% {
transform: scale(0.97) rotate(-5deg); }
100% {
transform: scale(1) rotate(0deg); } }
@keyframes plakatanimate {
0% {
transform: scale(1) rotate(0deg); }
50% {
transform: scale(0.97) rotate(5deg); }
100% {
transform: scale(1) rotate(0deg); } }
@keyframes cloudeaninate {
0% {
transform: translate(-5%); }
50% {
transform: translate(0%); }
100% {
transform: translate(-5%); } }
@keyframes cloudeaninate-2 {
0% {
transform: translate(5%); }
50% {
transform: translate(0%); }
100% {
transform: translate(5%); } }
@keyframes paranimate {
0% {
transform: rotate(-1deg); }
50% {
transform: rotate(1deg); }
100% {
transform: rotate(-1deg); } }
#aware {
display: none;
position: fixed;
z-index: 9999;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8); }
#aware .agebottles {
background: url(img/2botls.png) center no-repeat;
width: 395px;
height: 645px;
position: absolute;
bottom: 0px;
background-size: contain;
right: -30px; }
@media (max-width: 1024px) {
#aware .agebottles {
display: none; } }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
#aware .agebottles {
width: 325px;
height: 541px;
background-size: contain; } }
#aware .link-wrap {
position: absolute;
display: flex;
justify-content: space-around;
width: 100%;
padding: 10px 0;
bottom: 0; }
#aware .link-wrap a {
color: #000;
text-decoration: underline; }
#aware .link-wrap a:hover {
text-decoration: none; }
#aware .footer {
width: 100%; }
@media (max-width: 1024px) {
#aware .footer {
display: none; } }
#aware .footer .footinn {
width: 1090px;
margin: 0 auto;
max-width: 100%; }
#aware .footer p {
color: #fff;
margin-left: 45px; }
#aware .inner {
background: url(img/kul_sternla.png) center top no-repeat;
width: 1640px;
background-size: auto 823px;
height: 905px;
position: absolute;
left: 50%;
top: 50%;
max-width: 100%;
transform: translate(-50%, -50%); }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
#aware .inner {
transform: translate(-50%, -50%) scale(0.8); } }
@media (max-width: 1024px) {
#aware .inner {
transform: translate(-50%, -50%) scale(0.8);
background: url(img/kul_sternla.png) center no-repeat; } }
#aware .inner .top {
padding-top: 110px;
width: 1090px;
margin: 0 auto;
position: relative;
padding-bottom: 26px; }
@media (max-width: 1024px) {
#aware .inner .top {
padding-top: 0; } }
@media (max-width: 1024px) {
#aware .inner .selectage {
text-align: center;
width: 100%; }
#aware .inner .selectage img {
max-width: 95%; } }
#aware .inner .selectage .radiobox {
margin-top: 25px;
padding-left: 130px; }
@media (max-width: 1024px) {
#aware .inner .selectage .radiobox {
padding-left: 20px;
display: flex;
justify-content: center;
flex-wrap: wrap; } }
#aware .inner .selectage .radiobox input {
display: none; }
#aware .inner .selectage .radiobox input[type='radio'] + label {
position: relative;
margin-bottom: 50px;
padding-left: 86px; }
#aware .inner .selectage .radiobox input[type='radio'] + label:before {
content: '';
display: block;
width: 64px;
height: 64px;
border: 3px solid #000000;
background-color: #ddc9a1;
border-bottom: 8px solid #000;
border-radius: 50%;
position: absolute;
left: 0; }
@media (max-width: 1024px) {
#aware .inner .selectage .radiobox input[type='radio'] + label {
margin-bottom: 10px;
width: 250px; } }
#aware .inner .selectage .radiobox input[type='radio'] + label span.big {
font-family: Blizzard Regular;
font-size: 60px;
font-weight: 400;
line-height: 70px;
margin-left: 0;
padding-top: 0; }
@media (max-width: 1024px) {
#aware .inner .selectage .radiobox input[type='radio'] + label span.big {
font-size: 40px;
line-height: 50px; } }
#aware .inner .selectage .radiobox input[type='radio'] + label span {
margin-left: 20px;
font-size: 20px;
font-weight: 400;
padding-top: 3px;
line-height: 30px; }
@media (max-width: 1024px) {
#aware .inner .selectage .radiobox input[type='radio'] + label span {
font-size: 18px;
margin-left: 0;
display: block;
width: 100%;
text-align: left; } }
#aware .inner .selectage .radiobox input[type='radio']:checked + label:before {
content: '';
display: block;
width: 64px;
height: 64px;
border: 3px solid #000000;
background-color: #ce2016;
border-radius: 50%;
position: absolute;
left: 0; }
input[type="checkbox"] {
display: none !important; }
input[type="checkbox"] + label, input[type="checkbox"] + span {
position: relative;
padding-left: 48px;
line-height: 1.5; }
input[type="checkbox"] + label:before, input[type="checkbox"] + span:before {
position: absolute;
left: 0;
content: '';
width: 30px;
height: 30px;
border-radius: 5px;
border: 1px solid #919090;
background-color: #ffffff; }
input[type="checkbox"] + label:hover:before, input[type="checkbox"] + span:hover:before {
border: 2px solid #707070;
box-sizing: border-box; }
input[type="checkbox"]:checked + label:before, input[type="checkbox"]:checked + span:before {
left: 0;
content: '';
width: 30px;
height: 30px;
border-radius: 5px;
border: 1px solid #919090;
background-color: #ffffff;
background-image: url(img/hook.svg);
background-repeat: no-repeat;
background-position: center; }
.page {
background: url(img/kulbg.jpg);
box-sizing: border-box; }
.page .content {
padding-top: 19.90741vh;
padding-bottom: 12.96296vh; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.page .content {
padding-left: 50px;
padding-right: 50px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.page .content {
padding-left: 50px;
padding-right: 50px; } }
@media (max-width: 1024px) {
.page .content {
padding-top: 25px; } }
@media (max-width: 1024px) {
.page {
padding-top: 25px;
background: url(img/mobile/page2.jpg); } }
.page h1, .page h2, .page h3, .page h4 {
font-family: Blizzard Regular;
font-size: 70px;
font-weight: 400;
line-height: 80px; }
@media (max-width: 1024px) {
.page h1, .page h2, .page h3, .page h4 {
font-size: 36px;
letter-spacing: -1.08px;
line-height: 47px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.page h1, .page h2, .page h3, .page h4 {
font-size: 37px;
line-height: 47px; } }
.page h3, .page h1 + h2, .page h1 + h3, .page h1 + h4 {
font-family: Blizzard Regular;
font-size: 50px;
font-weight: 400;
line-height: 60px; }
@media (max-width: 1024px) {
.page h3, .page h1 + h2, .page h1 + h3, .page h1 + h4 {
font-size: 28px;
/*letter-spacing: -0.78px;*/
line-height: 35px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.page h3, .page h1 + h2, .page h1 + h3, .page h1 + h4 {
font-size: 28px;
/*letter-spacing: -0.78px;*/
line-height: 35px; } }
.page h4 {
font-family: Blizzard Regular;
font-size: 30px;
font-weight: 400;
line-height: 1.2; }
.page .article {
margin-top: 55px;
padding-bottom: 230px; }
.page .article p, .page .article ul, .page .article ol {
margin-bottom: 30px;
margin-top: 0; }
@media (max-width: 1024px) {
.page .article p, .page .article ul, .page .article ol {
word-break: break-word; } }
@media (max-width: 1024px) {
.page .article {
padding-bottom: 60px; } }
.sub-page {
background: url(img/kulbg.jpg);
box-sizing: border-box; }
.sub-page .content {
padding-top: 19.90741vh;
padding-bottom: 12.96296vh; }
@media (max-width: 1024px) {
.sub-page .content {
padding-top: 25px; } }
@media (max-width: 1024px) {
.sub-page {
padding-top: 25px;
background: url(img/mobile/page.jpg) left; } }
.sub-page h1 {
font-family: Blizzard Regular;
font-size: 70px;
font-weight: 400;
line-height: 80px; }
@media (max-width: 1024px) {
.sub-page h1 {
font-size: 36px;
letter-spacing: -1.44px;
line-height: 47px; } }
.sub-page h2, .sub-page h3, .sub-page h4 {
font-family: Blizzard Regular;
font-size: 50px;
font-weight: 400;
line-height: 60px; }
@media (max-width: 1024px) {
.sub-page h2, .sub-page h3, .sub-page h4 {
font-size: 26px;
/*letter-spacing: -0.78px;*/
line-height: 35px; } }
.sub-page h3 {
font-family: Blizzard Regular;
font-size: 50px;
font-weight: 400;
line-height: 60px; }
@media (max-width: 1024px) {
.sub-page h3 {
font-size: 26px;
/*letter-spacing: -0.78px;*/
line-height: 35px; } }
.sub-page h4 {
font-family: Blizzard Regular;
font-size: 30px;
font-weight: 400;
line-height: 34px; }
section.bottom {
position: relative;
height: calc(100vh);
/* margin-top: -110px;
background: url(img/bg.png);
padding-top: 110px;*/
margin-top: -80px;
background: url(img/bg.png);
padding-top: 80px; }
@media (max-width: 1024px) {
section.bottom {
height: auto;
margin-top: -60px;
padding-bottom: 60px;
padding-top: 55px;
background: url(img/mobile/bg.png);
background-size: cover; } }
section.bottom > .container > .row:first-child, .sub-page section.bottom > .container > .row:first-child, .page section.bottom > .container > .row:first-child {
height: calc(100vh - 146px); }
@media (max-width: 1024px) {
section.bottom > .container > .row:first-child, .sub-page section.bottom > .container > .row:first-child, .page section.bottom > .container > .row:first-child {
height: auto; } }
section.bottom .nextscreen {
top: 25px;
margin-top: 0; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
section.bottom .nextscreen {
top: 23px; } }
section.bottom .prostimg {
position: relative;
right: -80px; }
section.bottom .prostimg img {
max-width: 100%; }
@media (max-width: 1024px) {
section.bottom .prostimg {
left: 0;
width: 100%;
text-align: center; } }
section.bottom a.btn {
margin-top: 30px; }
section.bottom .mt100 {
margin-top: 100px; }
@media (max-width: 1024px) {
section.bottom .mt100 {
margin-top: 0; } }
.not_found {
padding-top: 1px;
min-height: calc(100vh - 1px);
background: url(img/bg404.jpg) center no-repeat; }
@media (max-width: 1024px) {
.not_found a.btn {
display: table; } }
.not_found .notfound {
background: url(img/not_found.png) center top no-repeat;
padding-top: 53.24074vh;
background-size: 105.18519vh 50.74074vh;
margin-top: 90px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.not_found .notfound {
padding-top: 49vh; } }
@media (max-width: 1024px) {
.not_found .notfound {
background: none;
padding-top: 30%; } }
.not_found h1 {
font-family: Blizzard Regular;
font-size: 50px;
font-weight: 400;
line-height: 60px;
margin-bottom: 30px; }
@media (max-width: 1024px) {
.not_found h1 {
font-size: 36px;
line-height: 40px; } }
section.top {
overflow: hidden; }
section.top .titleicon {
margin-top: 19.90741vh; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
section.top .titleicon {
margin-top: 10.907407vh; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section.top .titleicon {
/*margin-top: vh(115px);*/
margin-top: 19.9074074074vh; } }
@media (max-width: 1024px) {
section.top .titleicon {
margin-top: 0; } }
@media (max-width: 1024px) {
section.top {
height: auto;
padding-bottom: 60px; } }
@media (max-width: 1024px) {
section.top img {
margin-top: 40px;
max-width: 100%; } }
section.top h2, section.top h3, section.top h4 {
font-family: Blizzard Regular;
font-size: 50px;
font-weight: 400;
line-height: 60px; }
@media (max-width: 1024px) {
section.top h2, section.top h3, section.top h4 {
font-size: 28px;
line-height: 35px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section.top h2, section.top h3, section.top h4 {
font-size: 28px;
line-height: 35px; } }
.contact img {
max-width: 100%; }
.form-line a {
color: #ce2016; }
.form-line label {
display: block;
margin-bottom: 15px;
padding-top: 4px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.form-line label {
font-size: 16px;
padding-top: 0;
margin-bottom: 7px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.form-line label {
font-size: 16px;
padding-top: 0;
margin-bottom: 7px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.form-line label {
font-size: 16px;
padding-top: 0;
margin-bottom: 5px; } }
.form-line input[type="checkbox"] + label {
padding-top: 0; }
.form-line .selectize-input {
padding: 0;
border: none;
box-shadow: none;
padding-left: 7px; }
.form-line .selectize-input input[type="select-one"] {
display: none !important; }
.form-line .selectize-input .item {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
align-items: center;
height: 48px;
font-family: Roboto;
font-size: 18px;
line-height: 30px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.form-line .selectize-input .item {
height: 35px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.form-line .selectize-input .item {
height: 35px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.form-line .selectize-input .item {
height: 35px; } }
.form-line .selectize-input.focus.full.input-active {
background-color: rgba(0, 0, 0, 0.666);
color: #fff; }
.form-line .selectize-input.focus.full.input-active .input {
color: #fff; }
.form-line .selectize-input.full {
background-color: transparent; }
.form-line .selectize-control.single .selectize-input:after {
background: url(img/arr_down.svg) center no-repeat;
width: 21px;
height: 14px;
background-size: contain;
border: none;
right: 20px;
top: 20px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.form-line .selectize-control.single .selectize-input:after {
top: 14px;
right: 16px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.form-line .selectize-control.single .selectize-input:after {
top: 14px;
right: 16px; } }
.form-line .selectize-control.single .selectize-input.dropdown-active:after {
background: url(img/arrow_up_white.svg) center no-repeat;
background-size: contain; }
.form-line .selectize-dropdown .option {
box-sizing: border-box;
font-size: 18px;
line-height: 30px;
border-bottom: 1px solid #919090;
border-left: 1px solid #919090;
border-right: 1px solid #919090;
height: 48px;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
align-items: center; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.form-line .selectize-dropdown .option {
height: 35px;
margin-bottom: 15px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.form-line .selectize-dropdown .option {
height: 35px;
margin-bottom: 15px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.form-line .selectize-dropdown .option {
height: 35px;
margin-bottom: 10px; } }
.form-line .selectize-dropdown .option:last-child {
border-radius: 0 0 5px 5px; }
.form-line .selectize-dropdown .option.active {
color: #ce2016;
background: #fff; }
.form-line input[type="text"], .form-line input[type="email"], .form-line input[type="tel"], .form-line .selectize-control {
width: 100%;
max-width: 536px;
height: 50px;
font-family: Roboto;
font-weight: normal;
border-radius: 5px;
border: 1px solid #919090;
background-color: #ffffff;
padding-left: 7px;
display: block;
margin-bottom: 30px;
box-sizing: border-box;
font-size: 18px;
line-height: 30px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.form-line input[type="text"], .form-line input[type="email"], .form-line input[type="tel"], .form-line .selectize-control {
height: 35px;
margin-bottom: 15px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.form-line input[type="text"], .form-line input[type="email"], .form-line input[type="tel"], .form-line .selectize-control {
height: 35px;
margin-bottom: 15px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.form-line input[type="text"], .form-line input[type="email"], .form-line input[type="tel"], .form-line .selectize-control {
height: 35px;
margin-bottom: 10px; } }
@media (max-width: 1024px) {
.form-line input[type="text"], .form-line input[type="email"], .form-line input[type="tel"], .form-line .selectize-control {
margin-left: auto;
margin-right: auto;
max-width: 100%; } }
.form-line input[type="text"]:focus, .form-line input[type="email"]:focus, .form-line input[type="tel"]:focus, .form-line .selectize-control:focus {
border: 3px solid #707070;
outline: none; }
.form-line .selectize-dropdown-content {
margin-left: -1px;
width: calc(100% + 2px); }
.form-line .selectize-control {
padding-left: 0; }
.form-line p {
margin: 0; }
.form-line textarea {
width: 100%;
max-width: 536px;
height: 50px;
border-radius: 5px;
border: 1px solid #919090;
background-color: #ffffff;
padding-left: 7px;
display: block;
margin-bottom: 30px;
box-sizing: border-box;
font-size: 18px;
line-height: 30px;
height: 245px;
margin-bottom: 15px;
font-family: Roboto;
font-weight: normal; }
.form-line textarea:focus {
border: 3px solid #707070;
outline: none; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.form-line textarea {
height: 135px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.form-line textarea {
height: 135px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.form-line textarea {
height: 135px; } }
@media (max-width: 1024px) {
.form-line textarea {
max-width: 100%; } }
.form-line [type="submit"] {
outline: none;
min-width: 178px;
min-height: 50px;
border-radius: 24px;
cursor: pointer;
border: 3px solid #000000;
background-color: #ddc9a1;
border-bottom: 8px solid;
text-align: center;
font-family: Blizzard Regular;
font-size: 22px;
font-weight: 400;
letter-spacing: -0.66px;
line-height: 30px;
margin-top: 30px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.form-line [type="submit"] {
margin-top: 15px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.form-line [type="submit"] {
margin-top: 15px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.form-line [type="submit"] {
margin-top: 10px; } }
@media (max-width: 1024px) {
.form-line [type="submit"] {
/* position: relative;
left: 50%;*/
/*transform: translate(-50%, 0);*/
margin-bottom: 40px;
margin-left: auto;
margin-right: auto;
display: block; } }
.form-line [type="submit"]:hover {
text-decoration: underline; }
.form-line [type="submit"]:active {
border: 3px solid #000;
background-color: #ce2016; }
.w100 {
width: 100%; }
@media (max-width: 1024px) {
.w100 {
width: auto;
margin-bottom: 40px; } }
.mb30 {
margin-bottom: 30px; }
.fixed {
position: fixed; }
.navigation.fixed {
z-index: 9999; }
@media (max-width: 1024px) {
.navigation.fixed {
height: 70px;
background: #ce2016; } }
.menuwrap {
display: none;
background-color: rgba(0, 0, 0, 0.921);
width: 100%;
height: calc(100vh - 125px);
position: fixed;
left: 0;
top: 0;
z-index: 999; }
.menuwrap #menu-item-127 {
padding-left: 45px;
background: url(img/arrow.png) left center no-repeat; }
.menuwrap #menu-item-127:hover {
background: url(img/route.png) left center no-repeat;
background-size: 26px; }
@media (max-width: 1024px) {
.menuwrap {
height: 100%; } }
.menuwrap ul.menu {
position: relative;
left: 21.614583333333336vw;
top: 25vh; }
@media (max-width: 1024px) {
.menuwrap ul.menu {
top: 130px;
left: 80px; } }
.menuwrap ul.menu li {
margin-bottom: 30px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.menuwrap ul.menu li {
margin-bottom: 15px; } }
.menuwrap ul.menu li.has-children > a:after, .menuwrap ul.menu li.menu-item-has-children > a:after {
content: '';
background: url(img/haschildren.svg);
width: 29px;
height: 20px;
display: inline-block;
margin-left: 15px; }
.menuwrap ul.menu li.has-children.current.open > a:after, .menuwrap ul.menu li.current.menu-item-has-children.open > a:after {
background: url(img/arrow_up.svg); }
.menuwrap ul.menu li.has-children.open > a:after, .menuwrap ul.menu li.menu-item-has-children.open > a:after {
/*background: url(img/arrow_up.svg);*/
transform: rotate(-180deg); }
.menuwrap ul.menu li.current > a {
color: #ce2016; }
.menuwrap ul.menu li.menu-item-has-children:hover > a:after {
background: url(img/arrow_up.svg);
transform: rotate(-180deg); }
.menuwrap ul.menu li.menu-item-has-children.open:hover > a:after {
background: url(img/arrow_up.svg);
transform: rotate(0deg); }
.menuwrap ul.menu li:hover > a {
color: #ce2016; }
.menuwrap ul.menu li.current_page_item > a .menuwrap ul.menu li#menu-item-127 {
padding-left: 45px;
background: url(img/arrow.png) left center no-repeat; }
.menuwrap ul.menu li.current_page_item > a .menuwrap ul.menu li#menu-item-127:hover {
background: url(img/route.png) left center no-repeat;
background-size: 26px; }
.menuwrap ul.menu li a {
color: #ffffff;
font-family: Blizzard Regular;
font-size: 40px;
line-height: 48px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.menuwrap ul.menu li a {
font-size: 30px;
line-height: 38px; } }
.menuwrap ul.menu li ul {
display: none;
padding-left: 30px; }
.menuwrap ul.menu li ul li {
margin-bottom: 10px; }
.menuwrap .menubottles {
width: 48.95833333333333vw;
height: 30.833333333333336vw;
background: url(img/menubottles.png) center no-repeat;
background-size: contain;
position: absolute;
top: 205px;
right: 7.187499999999999vw; }
@media (max-width: 1024px) {
.menuwrap .menubottles {
display: none; } }
.menuwrap .girl {
width: 179px;
height: 257px;
background: url(img/sternla_stern.png) center no-repeat;
position: absolute;
bottom: -116px;
right: 274px; }
@media (max-width: 1024px) {
.menuwrap .girl {
display: none; } }
.burger.open {
background: url(img/nav_open.svg) center no-repeat; }
@media (max-width: 1024px) {
.burger.open {
background: url(img/mobile/nav_open.svg) center no-repeat; } }
.titleicon {
margin-bottom: 30px; }
.titleicon img {
margin-top: 25px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.titleicon img {
display: none; } }
@media (max-width: 1024px) {
.titleicon img {
display: none; } }
.titleicon div:first-child {
margin-right: 40px;
padding-top: 10px; }
@media (max-width: 1390px) {
.titleicon div:first-child {
margin-right: 15px; } }
@media (max-width: 1024px) {
.titleicon div:first-child {
margin-right: 0;
padding-top: 0; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.titleicon div:first-child {
margin-right: 0;
padding-top: 0; } }
.titleicon h1 {
margin-top: 17px; }
.mt130 {
margin-top: 12.03704vh; }
@media (max-width: 1024px) {
.mt130 {
margin-top: 0; } }
.sliderbox {
/*width: 870px;*/
max-width: 100%;
position: absolute;
margin-left: -66px;
/*.date.active{*/ }
@media (max-width: 1024px) {
.sliderbox {
position: relative;
margin-left: -20px;
margin-right: -20px;
max-width: calc(100% + 40px);
position: relative;
margin-top: 50px;
margin-bottom: 45px; } }
.sliderbox .prev {
cursor: pointer;
width: 30px;
margin-right: 36px;
background: url(img/arrow_left.svg) center no-repeat;
background-size: contain; }
@media (max-width: 1024px) {
.sliderbox .prev {
width: 30px;
height: 47px;
position: absolute;
top: calc(50% - 18px);
transform: translate(0, -50%);
z-index: 9;
left: 20px; } }
.sliderbox .next {
cursor: pointer;
width: 30px;
background: url(img/arrow_right.svg) center no-repeat;
background-size: contain;
margin-left: 16px; }
@media (max-width: 1024px) {
.sliderbox .next {
right: 20px;
width: 30px;
height: 47px;
position: absolute;
top: calc(50% - 18px);
transform: translate(0, -50%);
z-index: 9; } }
.sliderbox .sliderwrap {
/* margin-left: 40px;
margin-right: 40px;*/
/*width: 732px;*/
max-width: 100%;
overflow: hidden; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.sliderbox .sliderwrap {
width: 582px; } }
@media (max-width: 1024px) {
.sliderbox .sliderwrap {
margin-left: auto;
margin-right: auto;
width: 438px; } }
.sliderbox .sliderwrap .inner {
margin-left: -20px;
-webkit-transition: transform 0.5s ease-in-out;
-moz-transition: transform 0.5s ease-in-out;
-ms-transition: transform 0.5s ease-in-out;
-o-transition: transform 0.5s ease-in-out; }
@media (max-width: 1024px) {
.sliderbox .sliderwrap .inner {
margin-left: calc(50% - 90px); } }
.sliderbox .sliderwrap .inner .item {
cursor: pointer;
padding-left: 20px; }
@media (max-width: 1024px) {
.sliderbox .sliderwrap .inner .item {
padding-left: 25px;
opacity: 0.2; }
.sliderbox .sliderwrap .inner .item.active {
opacity: 1; } }
.sliderbox .date {
box-sizing: border-box;
border-radius: 50%;
width: 130px;
height: 130px;
background-color: #32302b;
border: 3px solid #32302b;
color: #fff; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.sliderbox .date {
width: 100px;
height: 100px; } }
@media (max-width: 1024px) {
.sliderbox .date {
width: 130px;
height: 130px; } }
.sliderbox .date .txt {
height: 72px; }
.sliderbox .date .month {
font-size: 40px;
font-weight: 500;
letter-spacing: -2px;
line-height: 50px;
text-transform: uppercase;
width: 100%; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.sliderbox .date .month {
font-size: 32px; } }
.sliderbox .date .date {
font-weight: 500;
letter-spacing: -0.6px;
line-height: 30px;
width: 100%; }
.sliderbox .date:hover {
color: #000;
border: 3px solid #000000;
background-color: #fcfaf5; }
.eventlist .eventitem {
margin-bottom: 40px;
cursor: pointer; }
.eventlist .eventitem .overlay_popup {
cursor: default; }
.eventlist .eventitem .overlay_popup a {
cursor: pointer; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.eventlist .eventitem {
margin-bottom: 20px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem {
margin-bottom: 15px; } }
.eventlist .eventitem .more {
margin-top: 35px; }
@media (max-width: 1024px) {
.eventlist .eventitem .more {
margin-bottom: 0; } }
.eventlist .eventitem div.first {
margin-right: 40px;
width: 180px;
height: 180px;
position: relative;
z-index: 0; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.eventlist .eventitem div.first {
width: 160px;
height: 160px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem div.first {
width: 120px;
height: 120px; } }
@media (max-width: 1024px) {
.eventlist .eventitem div.first {
width: 100px;
height: 100px;
margin-right: 20px; }
.eventlist .eventitem div.first + div {
width: calc(100% - 120px); } }
.eventlist .eventitem div.first:before {
content: ' ';
background: rgba(0, 0, 0, 0.403);
position: absolute;
z-index: 1;
display: block;
width: 100%;
height: 100%;
left: 0;
top: 0;
border-radius: 50%;
opacity: 1; }
.eventlist .eventitem div.first:hover:before {
opacity: 0;
-webkit-transition: opacity 0.5s ease-in-out;
-moz-transition: opacity 0.5s ease-in-out;
-ms-transition: opacity 0.5s ease-in-out;
-o-transition: opacity 0.5s ease-in-out; }
.eventlist .eventitem div.first:hover .date {
opacity: 0;
-webkit-transition: opacity 0.5s ease-in-out;
-moz-transition: opacity 0.5s ease-in-out;
-ms-transition: opacity 0.5s ease-in-out;
-o-transition: opacity 0.5s ease-in-out; }
.eventlist .eventitem div.first + div {
max-width: 240px; }
@media (max-width: 1120px) {
.eventlist .eventitem div.first + div {
max-width: 200px; } }
.eventlist .eventitem img {
width: 180px;
max-width: 100%; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.eventlist .eventitem img {
width: 160px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem img {
width: 120px; } }
.eventlist .eventitem .date {
color: #fff;
position: absolute;
left: 50%;
top: 50%;
z-index: 2;
transform: translate(-50%, -50%); }
.eventlist .eventitem .date .month {
text-align: center;
font-size: 30px;
font-weight: 500;
line-height: 38px;
text-transform: uppercase;
margin: 0;
width: 100%; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem .date .month {
font-size: 18px;
line-height: 19px; } }
@media (max-width: 1024px) {
.eventlist .eventitem .date .month {
font-size: 16px;
line-height: 17px; } }
.eventlist .eventitem .date .day {
text-align: center;
width: 100%;
font-size: 70px;
font-weight: 500;
line-height: 80px;
margin: 0; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem .date .day {
font-size: 36px;
line-height: 39px; } }
@media (max-width: 1024px) {
.eventlist .eventitem .date .day {
font-size: 38px;
line-height: 41px; } }
.eventlist .eventitem h4 {
margin-top: 26px;
font-family: Blizzard Regular;
font-size: 34px;
font-weight: 400;
line-height: 38px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem h4 {
font-size: 30px;
line-height: 34px;
margin-top: 15px; } }
@media (max-width: 1024px) {
.eventlist .eventitem h4 {
font-size: 22px;
line-height: 25px;
margin-top: 13px; } }
.eventlist .eventitem .pin {
display: block;
padding-top: 3px;
margin-top: 1px;
color: #ce2016;
font-family: Roboto;
font-size: 24px;
font-weight: 400;
line-height: 30px;
background: url(img/pin.png) left center no-repeat;
background-size: 16px;
padding-left: 25px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem .pin {
font-size: 20px;
line-height: 26px; } }
@media (max-width: 1024px) {
.eventlist .eventitem .pin {
font-size: 16px;
line-height: 19px;
padding-left: 17px;
background-size: contain; } }
.eventlist .eventitem .star {
padding-left: 25px;
display: block;
padding-top: 3px;
font-size: 18px;
line-height: 30px;
color: #000000;
margin-top: 7px;
background: url(img/star.svg) left 8px no-repeat; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.eventlist .eventitem .star {
margin-top: 5px;
font-size: 16px;
line-height: 28px;
padding-top: 2px;
background: url(img/star.svg) left 5px no-repeat; } }
@media (max-width: 1024px) {
.eventlist .eventitem .star {
font-size: 16px;
line-height: 20px;
padding-left: 18px;
background-size: 14px; } }
.overlay_popup {
display: none;
left: 0;
top: 0;
width: 100%;
height: 100%;
position: fixed;
z-index: 999;
background-color: rgba(0, 0, 0, 0.921); }
@media (max-width: 1024px) {
.overlay_popup h2, .overlay_popup h3, .overlay_popup h4 {
margin-top: 40px;
font-size: 30px;
margin-bottom: 20px; } }
.overlay_popup .popup {
background: url(img/popupbg.jpg) center;
width: 1640px;
height: 844px;
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 100;
max-width: calc(100% - 30px);
max-height: calc(100vh - 30px); }
@media (max-width: 1024px) {
.overlay_popup .popup {
width: calc(100% - 40px);
max-width: calc(100% - 40px);
height: calc(100vh - 40px);
max-height: calc(100vh - 40px); } }
.overlay_popup .popup .close {
cursor: pointer;
background: url(img/nav_open.svg) center no-repeat;
width: 60px;
height: 60px;
background-size: contain;
position: absolute;
right: 70px;
top: 70px;
display: block; }
@media (max-width: 1024px) {
.overlay_popup .popup .close {
width: 20px;
height: 30px;
right: 30px;
top: 30px; } }
.overlay_popup .popup .content {
margin-top: 185px;
padding: 0 140px; }
@media (max-width: 1024px) {
.overlay_popup .popup .content {
margin-top: 85px;
padding: 0 10px;
overflow: scroll;
height: calc(100vh - 125px); } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.overlay_popup .popup .content {
margin-top: 60px; } }
.overlay_popup .popup .content .img {
margin-right: 65px;
text-align: center;
width: 350px; }
@media (max-width: 1024px) {
.overlay_popup .popup .content .img {
margin-right: 0px;
width: 100%;
height: 153px;
position: relative; } }
.overlay_popup .popup .content .img + div {
width: calc(100% - 415px); }
@media (max-width: 1024px) {
.overlay_popup .popup .content .img + div {
width: 100%; } }
.overlay_popup .popup .content img {
display: block;
border-radius: 50%;
width: 350px;
max-width: 100%; }
@media (max-width: 1024px) {
.overlay_popup .popup .content img {
width: 152px; } }
.overlay_popup .popup .content .star {
margin-top: 20px;
padding-left: 30px;
display: inline-block;
color: #000;
background: url(img/star.svg) left center no-repeat; }
@media (max-width: 1024px) {
.overlay_popup .popup .content .star {
padding-top: 0;
margin-top: 0;
position: absolute;
top: 50%;
left: 163px;
transform: translate(0, -50%);
font-size: 20px;
line-height: 35px;
background-size: 23px; } }
.overlay_popup .popup .content .dateevent {
margin: 0 0 10px;
font-size: 28px;
font-weight: 400;
letter-spacing: -0.84px;
line-height: 1.2; }
@media (max-width: 1024px) {
.overlay_popup .popup .content .dateevent {
font-size: 22px; } }
.overlay_popup .popup .content .pin {
margin-bottom: 30px; }
@media (max-width: 1024px) {
.overlay_popup .popup .content .pin {
font-size: 22px; } }
.overlay_popup .popup .content p {
margin-bottom: 0px; }
.overlay_popup .popup .content ul {
padding-left: 20px;
list-style: disc;
line-height: 30px; }
.overlay_popup .popup .content .links {
margin-top: 30px; }
@media (max-width: 1024px) {
.overlay_popup .popup .content .links {
margin-top: 40px;
justify-content: space-around; } }
@media (max-width: 1024px) {
.overlay_popup .popup .content .links a {
height: 53px;
margin-bottom: 50px;
transform: none;
left: auto; } }
.overlay_popup .popup .content .links a + a {
margin-left: 80px; }
@media (max-width: 1024px) {
.overlay_popup .popup .content .links a + a {
margin-left: 0;
margin-right: 0;
margin-bottom: 60px; } }
.btn.ext:before {
content: '';
display: inline-block;
width: 15px;
height: 15px;
margin-right: 7px;
background: url(img/exticn.png) left center no-repeat; }
section.no_height {
height: auto;
padding-bottom: 340px; }
@media (max-width: 1024px) {
section.no_height {
padding-top: 0;
background: url(img/mobile/bg.png) center top; } }
section.no_height .container {
height: auto;
padding-bottom: 350px;
padding-top: 110px; }
@media (max-width: 1024px) {
section.no_height .container {
padding-top: 0;
padding-bottom: 40px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section.no_height .container {
padding-top: 20px; } }
@media (max-width: 1024px) {
section.no_height {
padding-bottom: 0;
background: url(img/mobile/noheight.png) top; } }
section.no_height2 {
height: 100%;
overflow: hidden; }
@media (max-width: 1024px) {
section.no_height2 {
overflow: initial;
height: auto;
padding-top: 0;
background: url(img/mobile/bg.png) center top; } }
section.no_height2 .container {
height: auto;
padding-bottom: 350px;
padding-top: 110px; }
@media (max-width: 1024px) {
section.no_height2 .container {
padding-top: 0;
padding-bottom: 40px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section.no_height2 .container {
padding-top: 20px; } }
@media (max-width: 1024px) {
section.no_height2 {
padding-bottom: 0;
background: url(img/mobile/noheight.png) top; } }
h2.suche, h3.suche, h4.suche {
margin-top: 70px;
font-family: Blizzard Regular;
font-size: 50px;
line-height: 60px; }
h2.suche:after, h3.suche:after, h4.suche:after {
content: '';
background: url(img/pin.png) center no-repeat;
background-size: contain;
display: inline-block;
width: 31px;
height: 45px;
margin-left: 12px;
position: relative; }
@media (max-width: 1024px) {
h2.suche:after, h3.suche:after, h4.suche:after {
display: none; } }
.address {
margin-top: 60px;
width: 550px;
max-width: 100%;
padding-left: 25px;
background: url(img/pin.png) left top no-repeat;
background-size: 16px; }
@media (max-width: 1024px) {
.address {
padding-left: 35px;
background: url(img/pin.png) 14px 2px no-repeat;
margin-top: 50px;
width: 100%;
box-sizing: border-box;
background-size: 16px; } }
.address h3 {
font-size: 24px;
font-weight: bold;
line-height: 50px;
font-family: Roboto;
line-height: 1.1;
margin-bottom: 10px; }
.address p {
margin: 7px 0; }
.address a.route {
background: url(img/route.png) left center no-repeat;
background-size: 11px;
padding-left: 17px;
color: #ce2016; }
@media (max-width: 1024px) {
.address a.route {
font-size: 20px; } }
.absarrow {
width: 55px;
height: 130px;
background: url(img/absarrow.png) center no-repeat;
margin-left: 210px;
margin-top: -26px; }
@media (max-width: 1024px) {
.absarrow {
display: none; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.absarrow {
display: none; } }
.gewin {
position: relative;
right: -100px;
margin-top: 19.90741vh; }
@media (max-width: 1024px) {
.gewin {
left: 50%;
transform: translate(-50%, 0);
max-width: 100%;
display: block;
margin-bottom: 40px; } }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.gewin {
right: 60px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.gewin {
right: 30px;
max-width: 100%;
margin-top: 14.35185vh; } }
.form-line.offset {
margin-top: 155px; }
@media (max-width: 1024px) {
.form-line.offset {
margin-top: 0px;
margin-bottom: 30px; } }
.form-line.offset h3 {
color: #ce2016;
font-family: Blizzard Regular;
font-size: 40px;
font-weight: 400;
line-height: 48px; }
.form-line.offset .checkboxes {
margin-top: 20px; }
.form-line.offset .checkboxes label, .form-line.offset .checkboxes span {
margin-right: 50px;
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex; }
@media (max-width: 1024px) {
.form-line.offset .checkboxes label, .form-line.offset .checkboxes span {
margin-right: 40px; } }
.mt70 {
margin-top: 70px; }
@media (max-width: 1024px) {
.mt70 {
margin-top: 0; }
.mt70 img {
max-width: 100%;
display: block;
margin: 0 auto; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.mt70 img {
max-width: 100%; } }
.download.container {
margin-left: auto;
margin-right: auto;
width: 1269px; }
.fileslider {
/*width: 1180px;*/
max-width: initial;
position: relative;
margin-left: 0; }
@media (max-width: 1024px) {
.fileslider {
position: relative;
margin-left: -20px;
margin-right: -20px;
max-width: calc(100% + 40px);
margin-top: 80px;
margin-bottom: 25px; } }
@media (max-width: 1640px) {
.fileslider {
width: 1200px;
margin-top: 0 !important; } }
@media (max-width: 1330px) {
.fileslider {
width: 940px; } }
.fileslider .prev {
cursor: pointer;
position: absolute;
left: -75px;
height: 46px;
top: 50%;
transform: translate(0, -50%); }
@media (max-width: 1430px) {
.fileslider .prev {
left: -50px; } }
@media (max-width: 1640px) {
.fileslider .prev {
left: 160px; } }
@media (max-width: 1330px) {
.fileslider .prev {
left: 60px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.fileslider .prev {
position: absolute;
height: 24px;
/*left: 160px;*/ } }
@media (max-width: 1024px) {
.fileslider .prev {
left: 20px;
width: 30px;
height: 46px;
position: absolute;
z-index: 9;
top: calc(50% - 20px);
transform: translate(0, -50%); } }
@media (max-width: 1024px) and (min-width: 600px) {
.fileslider .prev {
left: 50px; } }
.fileslider .next {
position: absolute;
right: -71px;
height: 46px;
top: 50%;
cursor: pointer;
transform: translate(0, -50%); }
@media (max-width: 1430px) {
.fileslider .next {
right: -50px; } }
@media (max-width: 1640px) {
.fileslider .next {
right: 175px; } }
@media (max-width: 1330px) {
.fileslider .next {
right: 75px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.fileslider .next {
position: absolute;
height: 24px;
/*right: 170px;*/ } }
@media (max-width: 1024px) {
.fileslider .next {
right: 20px;
width: 30px;
height: 46px;
position: absolute;
z-index: 9;
top: calc(50% - 20px);
transform: translate(0, -50%); } }
@media (max-width: 1024px) and (min-width: 600px) {
.fileslider .next {
right: 50px; } }
.fileslider .sliderwrap {
margin-left: auto;
margin-right: auto;
width: 1224px; }
.fileslider .sliderwrap .inner {
margin-left: -15px; }
@media (max-width: 1024px) {
.fileslider .sliderwrap .inner {
margin-left: calc(50% - 143px);
position: relative; } }
.fileslider .sliderwrap .date {
cursor: pointer; }
.fileslider .sliderwrap .inner .item {
padding-left: 15px;
position: relative;
overflow: hidden; }
@media (max-width: 1024px) {
.fileslider .sliderwrap .inner .item {
padding-left: 28px;
opacity: 0.2; }
.fileslider .sliderwrap .inner .item.active {
opacity: 1; } }
.fileslider .sliderwrap .inner .item .description {
position: absolute;
bottom: -100%;
text-align: center;
box-sizing: border-box;
color: #fff;
width: 80%;
font-size: 22px;
border-radius: 7px;
padding: 11px 5px;
background: #ce2016;
left: calc(50% + 7.5px);
transform: translate(-50%, 0);
transition: bottom 0.5s; }
@media (max-width: 1024px) {
.fileslider .sliderwrap .inner .item .description {
transform: translate(calc(-50% + 14px), 0); } }
.fileslider .sliderwrap .inner .item:hover .description {
bottom: 15px;
transition: bottom 0.5s; }
.fileslider .sliderwrap .inner .item:hover > a:before {
content: '';
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
border-radius: 5px;
background: url(img/downicon.png) center no-repeat;
background-color: rgba(0, 0, 0, 0.74); }
.fileslider .sliderwrap .inner .item > a {
display: block;
position: relative; }
.fileslider .sliderwrap .inner .item > a img {
border-radius: 5px;
box-sizing: border-box;
border: 10px solid #fff;
width: 398px;
max-width: 100%; }
@media (max-width: 1024px) {
.fileslider .sliderwrap .inner .item > a img {
width: 231px;
border: 6px solid #fff; } }
@media (max-width: 1640px) {
.fileslider .sliderwrap .inner .item > a img {
width: 225px; } }
.mt30 {
margin-top: 30px; }
.table {
max-width: 450px;
margin-bottom: 80px; }
@media (max-width: 1024px) {
.table {
max-width: 100%;
width: 100%;
margin-bottom: 50px; } }
.table .head {
border-radius: 5px 5px 0 0;
border: 1px solid #302e29;
background-color: #302e29;
color: #fff; }
@media (max-width: 1024px) {
.table .head {
position: relative; }
.table .head:before {
content: '';
background-image: url(img/mobile/arrow_down_white.svg);
background-repeat: no-repeat;
right: 20px;
top: 18px;
width: 21px;
height: 13px;
cursor: pointer;
position: absolute;
transform: rotate(0deg);
-webkit-transition: transform 0.5s ease-in-out;
-moz-transition: transform 0.5s ease-in-out;
-ms-transition: transform 0.5s ease-in-out;
-o-transition: transform 0.5s ease-in-out; }
.table .head.open:before {
transform: rotate(-180deg);
-webkit-transition: transform 0.5s ease-in-out;
-moz-transition: transform 0.5s ease-in-out;
-ms-transition: transform 0.5s ease-in-out;
-o-transition: transform 0.5s ease-in-out; }
.table .head.open + div {
max-height: 999px;
-webkit-transition: max-height 2.5s ease-in-out;
-moz-transition: max-height 2.5s ease-in-out;
-ms-transition: max-height 2.5s ease-in-out;
-o-transition: max-height 2.5s ease-in-out; } }
.table .head p, .table .head ul, .table .head ol {
font-weight: normal;
padding: 0 20px;
margin: 15px 0; }
@media (max-width: 1024px) {
.table .head p, .table .head ul, .table .head ol {
font-size: 16px;
line-height: 20px;
font-weight: normal; } }
@media (max-width: 1024px) {
.table .body {
max-height: 0;
overflow: hidden;
-webkit-transition: max-height 0.5s ease-in-out;
-moz-transition: max-height 0.5s ease-in-out;
-ms-transition: max-height 0.5s ease-in-out;
-o-transition: max-height 0.5s ease-in-out; } }
.table .body .line {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: space-between;
background-color: rgba(199, 172, 118, 0.141); }
.table .body .line:nth-child(2n + 2) {
background-color: rgba(191, 152, 45, 0.29); }
.table .body .line p, .table .body .line ul, .table .body .line ol {
font-weight: bold;
padding: 0 20px; }
@media (max-width: 1024px) {
.table .body .line p, .table .body .line ul, .table .body .line ol {
font-size: 16px;
line-height: 20px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.table .body .line p, .table .body .line ul, .table .body .line ol {
margin: 13px 0; } }
.impressum article {
/*background: url(img/sternla_stern_big.png) top 145px right 300px no-repeat;*/
background: url(img/sternla_stern_big.png) top 15vh right 15.6vw no-repeat;
background-size: 19.7vw 28.4vw; }
@media (max-width: 1024px) {
.impressum article {
background: none; } }
.footmenu {
max-width: 610px; }
@media (max-width: 1024px) {
.footmenu {
max-width: 100%;
width: 100%; } }
@media (max-width: 1024px) {
.footmenuwrap {
display: block; } }
.mt60 {
margin-top: 60px; }
#more {
margin-bottom: 0;
margin-left: auto;
margin-right: auto;
display: inline-block; }
.pagination {
display: none;
margin-top: 25px; }
@media (max-width: 1024px) {
.pagination {
display: -webkit-flex;
display: -moz-flex;
display: -ms-flex;
display: -o-flex;
display: flex;
justify-content: center;
width: 100%; }
.pagination div {
width: 9px;
height: 10px;
background-color: #000000;
opacity: 0.8;
border-radius: 50%;
margin: 0 2.5px; }
.pagination div.current {
width: 9px;
height: 10px;
border: 1px solid #000000;
background-color: #ffffff;
opacity: 0.8;
box-sizing: border-box; } }
@media (max-width: 1024px) {
#event .btn {
margin-top: 30px; } }
@media (max-width: 1024px) {
#beers {
padding-bottom: 50px; }
#subline {
padding-bottom: 100px; } }
.scrollwrap {
position: relative; }
.funinnerpage .bottles {
width: 35.83vh;
height: 61.16vh;
background: url(img/bottles.png);
background-size: contain;
background-repeat: no-repeat;
position: fixed;
bottom: 50%;
transform: translate(0, 50%);
-webkit-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-moz-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-ms-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-o-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
z-index: 99; }
.funinnerpage #bottles, .funinnerpage .bottles {
position: absolute;
right: 2.9vh;
top: 15.74074vh;
transform: none; }
.funinnerpage .boxwow {
position: absolute;
top: 45.46296vh;
left: 11vh; }
.funinnerpage .mapwow {
position: absolute;
top: 56.0185185185vh;
left: -5vh;
margin-top: 2px !important; }
.funinnerpage .eclipse {
opacity: 1; }
.funinnerpage #hat {
top: 13.61111vh;
z-index: 9999;
right: 6vh; }
.funinnerpage.rock.funbox {
transform: scale(0.8);
left: 58vw; }
@media (max-width: 1200px) {
.funinnerpage.rock.funbox {
left: 51vw; } }
@media (max-width: 1024px) {
.funinnerpage.rock.funbox {
width: 90%;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto; } }
.blot.funinnerpage .eclipse {
top: 10.48vh;
width: 40.83333vh;
height: 40.83333vh; }
.blot.funinnerpage .bottles {
top: 17.740741vh;
background: url(img/minibotl.png) center no-repeat;
background-size: contain;
right: 0;
width: 30.46296vh;
height: 51.66667vh; }
@media (max-width: 1024px) {
.blot.funinnerpage {
width: 290px;
height: 106.4vw;
max-height: 392px;
background-size: contain;
position: relative;
top: 0;
left: 50%;
margin-left: -145px;
margin-top: 40px;
margin-bottom: 60px; } }
@media (max-width: 1024px) and (max-width: 460px) {
.blot.funinnerpage {
margin-left: -158px; } }
.blot.funinnerpage .txt1 {
width: 15.18519vh;
height: 14.72222vh;
position: absolute;
top: 37vh;
right: 31.4vh;
background: url(img/red-arr-5.png) right bottom no-repeat;
background-size: 9.16667vh 7.03704vh; }
.blot.funinnerpage .txt1 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.blot.funinnerpage .txt2 {
width: 14.90741vh;
height: 15vh;
position: absolute;
top: 8vh;
right: -13.4vh;
background: url(img/red-arr-6.png) left bottom no-repeat;
background-size: 9.16667vh 7.03704vh; }
.blot.funinnerpage .txt2 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.blot.funinnerpage .blot-1 {
width: 25.27778vh;
height: 22.40741vh;
position: absolute;
background: url(img/blot-1.png) center no-repeat;
background-size: contain;
right: 11.7vh;
top: 13vh; }
.blot.funinnerpage .blot-2 {
position: absolute;
width: 16.75926vh;
height: 12.68519vh;
position: absolute;
background: url(img/blot-2.png) center no-repeat;
background-size: contain;
right: -9.2vh;
top: 53vh; }
.blot.funinnerpage .pen {
position: absolute;
width: 6.75926vh;
height: 32.03704vh;
position: absolute;
background: url(img/pen.png) center no-repeat;
background-size: contain;
right: -6.3vh;
top: 27vh; }
@media (max-width: 1024px) {
.requiredfields {
margin-bottom: 40px;
font-size: 14px;
line-height: 30px; } }
#agreed + label, .wpcf7-list-item-label {
display: block; }
@media (max-width: 1024px) {
#agreed + label, .wpcf7-list-item-label {
font-size: 18px; } }
#agreed + label span, .wpcf7-list-item-label span {
display: block; }
@media (max-width: 1024px) {
#agreed + label span, .wpcf7-list-item-label span {
display: inline; } }
section.top .deal.funinnerpage {
transform: scale(0.9); }
.addresslist {
display: none; }
@media (max-width: 1024px) {
.addresslist #more {
margin-left: initial; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
section.bottom .rock.funbox {
margin-top: 40px; } }
.tablet.funinnerpage .eclipse {
top: 10.48vh;
width: 40.83333vh;
height: 40.83333vh; }
.tablet.funinnerpage .bottles {
top: 17.740741vh;
background: url(img/minibotl.png) center no-repeat;
background-size: contain;
right: 0;
width: 30.46296vh;
height: 51.66667vh; }
@media (max-width: 1024px) {
.tablet.funinnerpage {
width: 100%;
height: 106.4vw;
max-height: 392px;
/*background: url(img/mobile/contact.png)center no-repeat;*/
background-size: contain;
position: relative;
top: 0;
left: 0;
margin-top: 40px;
margin-bottom: 60px;
/*&>div{
display: none;
}*/ } }
.tablet.funinnerpage .txt1 {
width: 19.44444vh;
height: 9.72222vh;
position: absolute;
top: 19vh;
right: 27.4vh;
background: url(img/red-arr-1.png) right bottom no-repeat;
background-size: 11.85185vh 2.5vh; }
.tablet.funinnerpage .txt1 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.tablet.funinnerpage .txt2 {
width: 23.33333vh;
height: 6.2037vh;
position: absolute;
top: 60vh;
right: -23.4vh;
background: url(img/red-arr-7.png) left center no-repeat;
background-size: 9.62963vh 3.7037vh; }
.tablet.funinnerpage .txt2 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.tablet.funinnerpage .plakat {
position: absolute;
width: 38.24074vh;
height: 51.2037vh;
background: url(img/mobile/plakat.png) center no-repeat;
background-size: contain;
right: -26vh;
top: 6vh; }
.tablet.funinnerpage .phone {
position: absolute;
width: 16.57407vh;
height: 30vh;
background: url(img/mobile/phone.png) center no-repeat;
background-size: contain;
right: 24.3vh;
top: 34vh; }
.zfix {
position: absolute;
z-index: 11;
right: -23px; }
.radler.funinnerpage .eclipse {
top: 10.48vh;
width: 40.83333vh;
height: 40.83333vh; }
@media (max-width: 1024px) {
.radler.funinnerpage {
width: 280px;
left: 50%;
margin-left: -163px;
height: 106.4vw;
max-height: 392px;
background-size: contain;
position: relative;
top: 0;
margin-top: 40px;
margin-bottom: 60px; } }
.radler.funinnerpage .txt1 {
width: 15.37037vh;
height: 13.14815vh;
position: absolute;
top: 2vh;
right: 17.4vh;
background: url(img/red-arr-8.png) right bottom no-repeat;
background-size: 7.5vh 5.83333vh; }
.radler.funinnerpage .txt1 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.radler.funinnerpage .txt2 {
padding-top: 55px;
width: 18.61111vh;
height: 12.12963vh;
position: absolute;
top: 35vh;
right: -18vh;
background: url(img/red-arr-9.png) left top no-repeat;
background-size: 10.46296vh 4.16667vh; }
.radler.funinnerpage .txt2 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.radler.funinnerpage .beer {
top: 17.740741vh;
background: url(img/radler.png) center no-repeat;
background-size: contain;
right: 0;
width: 42.12963vh;
height: 61.66667vh; }
.radler.funinnerpage .lemon {
position: absolute;
width: 25.46296vh;
height: 17.87037vh;
background: url(img/lemons.png);
background-size: contain;
right: -13vh;
top: 47vh; }
.radler.funinnerpage .buble {
right: -20vh;
z-index: 2;
top: 10vh;
position: absolute;
/*width: vh(263px);*/
width: 24.51852vh;
height: 16.94444vh;
background: url(img/radlerbuble.png) center no-repeat;
background-size: contain; }
.helles.funinnerpage .eclipse {
top: 10.48vh;
width: 40.83333vh;
height: 40.83333vh; }
@media (max-width: 1024px) {
.helles.funinnerpage {
width: 70%;
height: 106.4vw;
max-height: 392px;
/*background: url(img/mobile/contact.png)center no-repeat;*/
background-size: contain;
position: relative;
top: 0;
left: 0;
margin-top: 40px;
margin-bottom: 60px; } }
@media (max-width: 400px) {
.helles.funinnerpage {
width: 80%; } }
.helles.funinnerpage .txt1 {
width: 15.37037vh;
height: 13.14815vh;
position: absolute;
top: 2vh;
right: 17.4vh;
background: url(img/red-arr-8.png) right bottom no-repeat;
background-size: 7.5vh 5.83333vh; }
.helles.funinnerpage .txt1 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.helles.funinnerpage .txt2 {
padding-top: 55px;
width: 18.61111vh;
height: 12.12963vh;
position: absolute;
top: 35vh;
right: -18vh;
background: url(img/red-arr-9.png) left top no-repeat;
background-size: 10.46296vh 4.16667vh; }
.helles.funinnerpage .txt2 h4 {
font-size: 2.77778vh;
line-height: 3.51852vh; }
.helles.funinnerpage .beer {
top: -0.259259vh;
background: url(img/helles.png) center no-repeat;
background-size: contain;
right: -4vh;
width: 42.12963vh;
height: 61.66667vh;
position: absolute; }
.helles.funinnerpage .buble {
right: -20vh;
top: 10vh;
position: absolute;
width: 24.35185vh;
height: 16.94444vh;
background: url(img/radlerbuble.png) center no-repeat;
background-size: contain; }
#video iframe {
width: 100% !important;
height: 100% !important; }
#video .video-wrapped {
width: 100vw !important;
height: 100vh !important; }
.video-wrapped-play {
display: none !important; }
.wpcf7-form {
width: 100%;
display: flex;
flex-wrap: wrap; }
.wpcf7-validation-errors {
display: none !important; }
span.wpcf7-not-valid-tip {
color: #f00;
font-weight: normal;
display: block;
margin-top: -17px;
font-size: 14px !important;
line-height: 22px !important; }
.wpcf7-list-item {
margin: 0 !important; }
.nearevent {
cursor: pointer; }
#wpsl-gmap {
border: 10px solid #fff;
border-radius: 4px;
width: 97% !important; }
#wpsl-search-input, #wpsl-category .wpsl-dropdown, #wpsl-gmap {
height: 50px !important;
font-size: 18px !important;
margin-left: auto !important;
margin-right: auto !important; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
#wpsl-search-input, #wpsl-category .wpsl-dropdown, #wpsl-gmap {
height: 35px !important; } }
#wpsl-result-list {
width: 100% !important;
margin-right: -0.5rem !important;
margin-left: -0.5rem !important; }
#wpsl-search-input {
margin-bottom: 15px !important;
padding: 0 !important;
padding-left: 7px !important;
width: 100% !important;
margin-left: 0 !important; }
@media (max-width: 1024px) {
#wpsl-search-input {
margin-left: auto !important; } }
.onepage-wrapper .section {
width: calc(100% + 20px) !important;
padding-right: 20px;
/*box-sizing: border-box;*/ }
.home .onepage-wrapper .section {
/* width: 100%!important;
padding-right: 0;*/ }
.page h3.maph3 {
font-size: 20px;
padding-top: 0;
margin-bottom: 7px;
/*font-family: Roboto;*/
margin-bottom: 20px; }
section ul {
margin-left: 20px;
list-style: initial; }
section ul li {
margin-bottom: 9px;
line-height: 1.2; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
section ul li {
font-size: 15px;
line-height: 24px; } }
section ol {
margin-left: 20px;
list-style: decimal; }
section ol li {
margin-bottom: 9px;
line-height: 1.2; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
section ol li {
font-size: 15px;
line-height: 24px; } }
input[type="submit" i]:disabled {
color: #000; }
input[type="submit" i]:disabled:before {
content: ''; }
input[type="submit" i]:disabled:after {
content: ''; }
@media all and (-ms-high-contrast: none) {
#event .event {
margin-top: 50px; }
*::-ms-backdrop, .funinnerpage #hat {
top: 19.61vh;
right: 28vh; }
/* IE11 */
*::-ms-backdrop, input[type="text"], *::-ms-backdrop, input[type="email"], *::-ms-backdrop, input[type="tel"], *::-ms-backdrop, .selectize-control, *::-ms-backdrop, textarea {
width: 536px !important; }
.brgwrap {
width: 9.65vw !important; }
section, section.center-xs {
background-size: cover !important;
justify-content: space-around; }
.event li img {
max-height: 122px; } }
.wpcf7 {
width: 100%; }
#vid_overlay {
position: absolute;
width: 100%;
height: 100%; }
#vid {
width: 100%;
/*@include mq_big{*/
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
position: absolute;
top: 50%;
left: 50%;
min-width: 100%;
min-height: 100%;
width: auto;
height: auto;
z-index: -100; }
@media (max-width: 1024px) {
#vid {
/*width: 100%;
height: auto;
z-index: 1;
left: initial;
top: initial;
position: relative;
-webkit-transform: translateX(0%) translateY(-30%);
-moz-transform: translateX(0%) translateY(-30%);
-ms-transform: translateX(0%) translateY(-30%);
-o-transform: translateX(0%) translateY(-30%);
transform: translateX(0%) translateY(-30%);*/
width: 100%;
height: 56vw;
min-height: initial;
min-width: initial;
z-index: 1;
left: initial;
top: initial;
position: relative;
-webkit-transform: translateX(0) translateY(0);
-moz-transform: translateX(0) translateY(0);
-ms-transform: translateX(0) translateY(0);
-o-transform: translateX(0) translateY(0);
transform: translateX(0) translateY(0); } }
@media (min-width: 1920px) {
section.no_height, section.bottom, .page, .teaser_wrap, .teaser, footer {
background-size: cover; }
section.bottom {
margin-top: -9.2592592593vh;
padding-top: 9.2592592593vh; }
section.bottom .nextscreen {
top: unset;
margin-top: -62px; } }
.fixind-5.boxwow {
/*margin-top: 100vh;*/ }
.fixind-5.mapwow {
margin-top: 12vh; }
.boxUp {
/*margin-top: 0!important;*/
top: 49vh;
-webkit-transition: top 0.9s ease;
-moz-transition: top 0.9s ease;
-ms-transition: top 0.9s ease;
-o-transition: top 0.9s ease; }
.hatDown {
margin-top: 0 !important;
-webkit-transition: margin-top 0.9s ease;
-moz-transition: margin-top 0.9s ease;
-ms-transition: margin-top 0.9s ease;
-o-transition: margin-top 0.9s ease; }
@keyframes boxUpanimate {
0% {
margin-top: 100%; }
100% {
margin-top: 0%; } }
.deal.funinnerpage .fixind-5.boxwow {
margin-top: 0; }
.bounceInLeft.mapwow, .mapwow[data-class="bounceInLeft"] {
animation-fill-mode: initial; }
@media (max-width: 1610px) {
.top.section.active .container {
/*position: relative;*/ } }
.glass {
/*border-bottom: 3px green solid;*/ }
.bottles_mob {
visibility: hidden;
width: 35.83vh;
height: 61.16vh;
background: url(img/bottles.png);
background-size: contain;
background-repeat: no-repeat;
position: absolute;
-webkit-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-moz-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-ms-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-o-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
z-index: 99;
right: 3.7vh;
top: 16.5vh; }
.surfboards_mob {
visibility: hidden;
width: 299px;
height: 573px;
background: url(img/supgewinn.png);
background-size: contain;
background-repeat: no-repeat;
position: absolute;
-webkit-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-moz-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-ms-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
-o-transition: bottom 0.5s ease-in-out, transform 1.5s ease-in-out;
z-index: 99;
left: 0;
top: 0; }
.hat_inner {
visibility: hidden;
width: 11.7592592593vh;
height: 8.0555555556vh;
background: url(img/cap.png) center no-repeat;
background-size: contain;
right: 53px;
position: absolute;
top: 116px;
z-index: 9999;
-webkit-animation-fill-mode: none !important; }
@media (max-width: 990px) {
.hat_inner {
display: none;
right: 45px;
top: 98px; } }
@media (max-width: 700px) {
.hat_inner {
right: 57px;
top: 109px; } }
@media (max-width: 1330px) {
.page section .container {
width: 1000px; } }
@media (max-width: 1140px) {
.page section .container {
width: 900px; } }
.surfboards_mob.hide-md {
display: none; }
@media (max-width: 1024px) {
.surfboards_mob.hide-md {
display: block; } }
.bottles_mob.hide-md {
display: none; }
@media (max-width: 1024px) {
.bottles_mob.hide-md {
display: block; } }
#upPage {
width: 52px;
height: 52px;
border-radius: 4px;
position: fixed;
right: 20px;
background: url(img/arrow_up_white.svg) center no-repeat;
background-size: 30px;
background-color: #ce2016;
bottom: -100%;
cursor: pointer;
-webkit-transition: bottom 0.5s ease-in-out;
-moz-transition: bottom 0.5s ease-in-out;
-ms-transition: bottom 0.5s ease-in-out;
-o-transition: bottom 0.5s ease-in-out; }
@media (max-width: 1024px) {
#upPage {
display: none; } }
#upPage.show {
bottom: 30px;
-webkit-transition: bottom 0.5s ease-in-out;
-moz-transition: bottom 0.5s ease-in-out;
-ms-transition: bottom 0.5s ease-in-out;
-o-transition: bottom 0.5s ease-in-out; }
.brgwrap {
/*width: 166px;*/
width: 8.65vw;
display: flex;
justify-content: center;
-webkit-flex-wrap: wrap;
-moz-flex-wrap: wrap;
-ms-flex-wrap: wrap;
-o-flex-wrap: wrap;
flex-wrap: wrap;
margin-left: 30px; }
@media only screen and (max-width: 1600px) and (min-height: 768px) and (orientation: landscape) {
.brgwrap {
margin-left: 10px; } }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.brgwrap {
margin-left: 10px; } }
@media (max-width: 1024px) {
.brgwrap {
margin-left: 20px;
justify-content: space-between;
width: 100%;
align-items: center; } }
#tst {
right: auto;
left: 1220px; }
.sliderbox.mt70 {
margin-top: 0; }
h2.mb30, h3.mb30, h4.mb30 {
margin-top: 0px; }
.funbox.radler {
width: 51.2vh; }
@media (max-width: 1024px) {
.funbox.radler {
width: 90%;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: translate(-25%, 0); } }
.funbox.helles {
width: 51.2vh; }
@media (max-width: 1160px) {
.funbox.helles {
left: 47.5vw; } }
.rock.funinnerpage.eventrock {
left: 52vw; }
@media (max-width: 1024px) {
.rock.funinnerpage.eventrock {
left: 0; } }
section.top .deal.funinnerpage {
left: 58.5vw;
width: 61.2vh;
top: 0; }
@media (max-width: 1640px) {
section.top .deal.funinnerpage {
/*left: 50.5vw;*/ } }
@media (max-width: 1024px) {
section.top .deal.funinnerpage {
left: 0;
margin-bottom: 40px;
transform: scale(0.8);
width: 90%; } }
@media (max-width: 1640px) {
.funbox.tablet.funinnerpage {
/*left: 44.5vw;*/ } }
@media (max-width: 1024px) {
.funbox.tablet.funinnerpage {
width: 90%;
top: 0;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: scale(1);
max-height: initial;
height: 70vh; } }
@media (max-width: 1640px) {
.funbox.blot.funinnerpage {
/*left: 46.5vw;*/ } }
@media (max-width: 1024px) {
.funbox.blot.funinnerpage {
width: 90%;
top: 0;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: scale(1);
max-height: initial;
height: 74vh; } }
.wpsl-error {
border: 1px solid #bd0028 !important; }
.download-section h2.mb30, .download-section h3.mb30, .download-section h4.mb30 {
margin-top: -35px;
margin-bottom: 0; }
@media (max-width: 1024px) {
.download-section h2.mb30, .download-section h3.mb30, .download-section h4.mb30 {
margin-top: 10px; } }
.box_mob {
display: none; }
@media (max-width: 1024px) {
.box_mob {
display: block;
width: 73.04vh;
height: 38.37vh;
background: url(img/mobbox.png) center no-repeat;
position: absolute;
background-size: contain;
right: -9.5vh;
visibility: hidden;
z-index: 9999;
top: 51.17vh; } }
.hat_mob {
width: 10.39vh;
height: 7.7vh;
right: 7.17vh;
background: url(img/cap.png) center no-repeat;
background-size: contain;
position: absolute;
top: 15.33vh;
z-index: 999;
opacity: 0; }
@media (max-width: 1024px) {
.hat_mob {
opacity: 1; } }
@media (max-width: 1020px) {
.boxwow, .mapwow {
display: none !important;
visibility: hidden !important; } }
input[tabindex] {
height: 0 !important;
margin: 0 !important;
padding: 0 !important;
display: none !important; }
.wpsl-dropdown {
display: none !important; }
#wpsl-category label {
width: initial !important; }
.flowUp {
top: -100%;
-webkit-transition: top 0.8s ease-in-out;
-moz-transition: top 0.8s ease-in-out;
-ms-transition: top 0.8s ease-in-out;
-o-transition: top 0.8s ease-in-out; }
.flowDown {
top: 49vh;
-webkit-transition: top 0.4s ease-in-out;
-moz-transition: top 0.4s ease-in-out;
-ms-transition: top 0.4s ease-in-out;
-o-transition: top 0.4s ease-in-out; }
.flowDownDown {
top: 150%;
-webkit-transition: top 0.4s ease-in-out;
-moz-transition: top 0.4s ease-in-out;
-ms-transition: top 0.4s ease-in-out;
-o-transition: top 0.4s ease-in-out; }
@media (max-width: 360px) {
.event .list .li + .li {
margin-left: 14px; } }
@media (max-width: 1024px) {
.main {
overflow: hidden; } }
.funbox.helles {
width: 67.2vh; }
@media (max-width: 1640px) {
.funbox.helles {
width: 74.2vh; } }
@media (max-width: 1024px) {
.funbox.helles {
height: 61vh;
max-height: initial;
width: 40%;
top: 0;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: scale(0.8); } }
@media (max-width: 1024px) {
.funbox.radler {
height: 61vh;
max-height: initial;
width: 40%;
top: 0;
max-width: 460px;
left: 0;
right: 0;
margin: 0 auto;
transform: scale(0.8); } }
.wpcf7-mail-sent-ok {
display: block;
border: none !important;
font-weight: bold;
color: #000000;
background: none;
height: 40px;
border-radius: 4px;
padding-top: 13px;
box-sizing: border-box; }
.wpcf7-not-valid-tip {
margin-top: 2px; }
.thankyou {
padding-top: 30vh; }
.thankyou p {
text-align: center;
margin-bottom: 30px;
font-family: Blizzard Regular;
font-size: 28px; }
@media only screen and (max-width: 1366px) and (min-height: 625px) and (orientation: landscape) {
.mb30 {
margin-bottom: 10px;
line-height: 27px; } }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.mb30 {
margin-bottom: 10px;
line-height: 27px; } }
#wpsl-result-list p {
padding-left: 0 !important; }
@media (max-width: 1024px) {
[data-lbp] .popup {
overflow-y: scroll; } }
.lb-conent {
width: 730px;
max-width: 100%;
padding-top: 130px;
margin: 0 auto;
box-sizing: border-box; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.lb-conent {
padding-top: 10px; } }
@media (max-width: 1024px) {
.lb-conent {
padding: 10px;
padding-top: 80px; } }
.lb-conent h2, .lb-conent h3, .lb-conent h4 {
font-size: 50px;
line-height: 52px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.lb-conent h2, .lb-conent h3, .lb-conent h4 {
font-size: 46px;
line-height: 48px; } }
@media (max-width: 1024px) {
.lb-conent h2, .lb-conent h3, .lb-conent h4 {
font-size: 30px;
line-height: 42px;
margin-top: 0; } }
.lb-conent p {
margin-top: 10px;
margin-bottom: 0;
font-size: 20px;
font-weight: 400;
line-height: 30px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.lb-conent p {
font-size: 17px;
line-height: 26px; } }
@media (max-width: 1024px) {
.lb-conent p {
font-size: 19px;
font-weight: 400;
line-height: 30px; } }
.lb-conent p a {
color: #ce2016; }
.downloadfiles {
justify-content: space-between;
width: 1011px;
max-width: 100%;
margin: 0 auto;
margin-top: 55px; }
@media only screen and (max-width: 1600px) and (max-height: 960px) {
.downloadfiles {
margin-top: 30px; } }
@media (max-width: 1024px) {
.downloadfiles {
margin-top: 80px; } }
.downloadfiles div {
text-align: center;
width: 368px;
max-width: 100%; }
@media (max-width: 1024px) {
.downloadfiles div {
box-sizing: border-box; } }
.downloadfiles div:first-child {
width: 283px; }
@media (max-width: 1024px) {
.downloadfiles div:first-child {
width: 100%; } }
.downloadfiles div:nth-child(2) {
width: 370px; }
@media (max-width: 1024px) {
.downloadfiles div:nth-child(2) {
width: 100%; } }
.downloadfiles div:last-child {
width: 180px; }
@media (max-width: 1024px) {
.downloadfiles div:last-child {
width: 100%; } }
.downloadfiles div h3 {
font-size: 30px;
line-height: 36px;
margin-bottom: 20px; }
.downloadfiles div img {
border-radius: 5px;
border: 3px solid #fff;
height: 207px;
width: auto; }
@media (max-width: 1024px) {
.downloadfiles div img {
height: auto;
max-width: calc(100% - 30px); } }
.downloadfiles div a.btn {
margin-top: 28px;
padding: 4px 25px; }
@media (max-width: 1024px) {
.downloadfiles div a.btn {
left: auto;
transform: none;
padding: 10px 25px; } }
.youtube.funinnerpage .txt1 {
position: absolute;
background: url(img/red-arr-10.png) 0 bottom no-repeat;
height: 193px;
right: -12vh; }
.youtube.funinnerpage .tv {
background: url(img/tv.png) center no-repeat;
background-size: contain;
position: absolute;
width: 30.09259vh;
height: 31.38889vh;
right: -19.685185vh;
top: 38.814815vh; }
.youtube.funinnerpage .roll {
background: url(img/filmrolle.png) center no-repeat;
background-size: contain;
position: absolute;
width: 34.25926vh;
height: 27.12963vh;
right: 26.888889vh;
top: 49.074074vh; }
.youtube.funinnerpage .mot {
background: url(img/klappe.png) center no-repeat;
background-size: contain;
position: absolute;
width: 21.11111vh;
height: 22.77778vh;
top: 34vh;
right: 32.722222vh;
z-index: 99; }
.youtube.funinnerpage .bottles_mob {
right: 2.2vh;
top: 19.5vh; }
#CybotCookiebotDialogBodyLevelWrapper input[type="checkbox"] {
display: initial !important; }
#CybotCookiebotDialogBodyLevelWrapper input[type="checkbox"] + label:before, input[type="checkbox"] + span:before {
content: none; }
#CybotCookiebotDialogBodyLevelWrapper input[type="checkbox"]:checked + label:before, input[type="checkbox"]:checked + span:before {
content: none; }
span.wpcf7-list-item-label::before {
content: "" !important;
position: absolute;
left: 0;
display: block;
content: '';
width: 30px;
height: 30px;
border-radius: 5px;
border: 1px solid #919090;
background-color: #ffffff; }
#surfboards {
width: 39.1vh;
height: 71.16vh;
left: 64.5416vw;
background: url(img/supgewinn.png);
background-size: contain;
background-repeat: no-repeat;
position: fixed;
top: 142px;
/* -webkit-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-moz-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-ms-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-o-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;*/
z-index: 99; }
@media (max-width: 1024px) {
#surfboards {
position: relative;
display: none; } }
.surfboardsmob {
width: 133px;
height: 256px;
left: 50%;
background: url(img/supgewinn.png);
background-size: contain;
background-repeat: no-repeat;
-webkit-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-moz-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-ms-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
-o-transition: top 0.5s ease-in-out, transform 1.5s ease-in-out;
z-index: 999;
transform: translate(-50%, -120%);
display: none; }
@media (max-width: 1024px) {
.surfboardsmob {
position: relative;
display: block;
transform: translate(-50%, -140%); } }
@media (max-width: 900px) {
.surfboardsmob {
transform: translate(-50%, -120%); } }
@media (max-width: 500px) {
.surfboardsmob {
width: 89px;
height: 168px; } }
@media (max-width: 360px) {
.surfboardsmob {
height: 160px;
transform: translate(-50%, -112%); } }
.sup-page .page {
padding-top: 0; }
@media (max-width: 1024px) {
.sup-page #beers {
padding-top: 50px;
padding-bottom: 30px;
background: url(img/teasermob.png), url(img/mobile/bgbeer.png);
background-size: contain, cover;
background-position: left 0, 0 0;
margin-top: -18px;
z-index: 9999;
position: relative;
background-repeat: no-repeat, repeat; }
.sup-page section + section {
position: relative;
z-index: 9999; }
.sup-page #event {
background: none; }
.sup-page section#video {
height: 92vh; } }
@media (max-width: 1024px) {
.sup-page .deal.funbox {
width: 639px;
max-width: 999px;
left: 35%;
right: 0;
top: 0;
margin: 0 auto;
transform: translate(-50%, 0); } }
#controllers {
width: 52px;
height: 110px;
position: fixed;
right: 20px;
bottom: 130px; }
@media (max-width: 1024px) {
#controllers {
display: none; } }
#controllers a {
margin-bottom: 4px;
cursor: pointer;
width: 52px;
height: 50px;
display: block; }
#controllers a:first-child {
background: url(img/arrow_up_white.svg) center no-repeat;
background-color: #1f1818;
border-radius: 25px; }
#controllers a:last-child {
background: url(img/arrow_up_white.svg) center no-repeat;
background-color: #1f1818;
border-radius: 25px;
transform: rotate(180deg); }
@media (max-width: 500px) {
section#video.sub-header {
height: 67vh; } }
@media (max-width: 500px) and (max-height: 590px) {
section#video.sub-header {
height: 80vh; } }
section#video.sub-header .sup-text p, section#video.sub-header .sup-text span {
line-height: 1.3; }
@media (max-width: 1024px) {
section#video.sub-header .sup-text p, section#video.sub-header .sup-text span {
color: #000 !important; } }
section#video.sub-header h1 {
position: relative;
text-align: left;
bottom: 215px;
font-size: 6.5vw; }
@media (max-width: 1024px) {
section#video.sub-header h1 {
bottom: 0;
top: -256px;
margin-top: 0;
line-height: 50px;
font-size: 80px; } }
@media (max-width: 500px) {
section#video.sub-header h1 {
font-size: 48px;
top: -170px; } }
@media (max-width: 321px) {
section#video.sub-header h1 {
font-size: 43px; } }
section#video.sub-header .b-center {
bottom: 57px;
position: relative; }
.sup-text {
position: relative;
bottom: 170px; }
.sup-text p {
font-family: Roboto;
font-size: 29px;
font-weight: bold; }
@media (max-width: 500px) {
.sup-text p {
font-size: 18px; } }
@media (max-width: 1024px) {
.sup-text {
bottom: 0;
top: -240px;
z-index: 9999; } }
@media (max-width: 500px) {
.sup-text {
top: -172px; } }
.gewinnspell {
display: none;
padding: 20px;
background: #ce2016;
color: #fff;
max-width: 268px;
position: absolute;
padding-right: 103px;
padding-bottom: 23px;
right: -1%;
bottom: 260px;
z-index: 9999;
transform: rotate(-9deg); }
.gewinnspell h2, .gewinnspell h3, .gewinnspell h4, .gewinnspell h3, .gewinnspell h4 {
font-size: 54px; }
.gewinnspell p {
font-size: 16px;
margin-top: 18px; }
@media (max-width: 1024px) {
.gewinnspell {
position: absolute;
bottom: auto;
top: 32vw; }
.gewinnspell h2, .gewinnspell h3, .gewinnspell h4, .gewinnspell h3, .gewinnspell h4 {
font-size: 34px; } }
@media (max-width: 1024px) and (max-width: 500px) {
.gewinnspell h2, .gewinnspell h3, .gewinnspell h4, .gewinnspell h3, .gewinnspell h4 {
font-size: 27px; } }
@media (max-width: 1024px) {
.gewinnspell p {
font-size: 16px;
margin-top: 15px;
display: none; } }
@media (max-width: 500px) {
.gewinnspell {
padding: 13px;
right: -2%;
padding-right: 66px;
padding-bottom: 14px; } }
.b-center {
display: flex;
justify-content: center;
flex-wrap: wrap; }
.btn.witharrow {
min-width: 90px;
padding: 4px 25px; }
@media (max-width: 1024px) {
.btn.witharrow {
display: none; } }
.btn.witharrow .arrdown {
background-image: url(img/arr_down.svg);
background-position: center;
background-repeat: no-repeat;
display: block;
width: 32px;
height: 32px; }
.more-info-in-sup {
display: block;
width: 100%;
text-align: center;
font-family: Blizzard Regular;
margin-bottom: 7px; }
@media (max-width: 1024px) {
.more-info-in-sup {
display: none; } }
#cle {
position: absolute;
z-index: 99999;
width: 5px;
height: 5px;
background: #e91e63;
top: 490px;
left: 60%;
display: block; }
.funbox.palms1 {
left: 60vw;
width: 670px;
height: 761px; }
@media (max-width: 1024px) {
.funbox.palms1 {
top: 0;
left: 50%;
transform: translate(-50%, 0); } }
.funbox.palms1 .surfboards_mob {
left: 121px;
top: 70px; }
.funbox.palms1 .eclipse {
right: auto;
left: 42px;
background-color: unset;
background-image: url(img/ellipsesup.png);
background-size: contain;
top: 110px;
width: 501px;
height: 501px; }
.funbox.palms1 .papier2 {
right: auto;
left: 8px;
width: 142px;
height: 129px;
position: absolute;
top: 92px;
background: url(img/papier2.png) center;
background-size: contain;
transform: rotate(-10deg); }
.funbox.palms1 .txt1 {
background-image: url(img/arrow_sup.png);
background-size: contain;
background-repeat: no-repeat;
background-image: url(img/arrow_sup.png);
background-size: 77px 66px;
background-repeat: no-repeat;
padding-left: 84px;
padding-top: 13px;
position: absolute;
left: 435px;
top: 625px; }
.funbox.palms1 .trees1 {
background-image: url(img/palmen.png);
background-size: contain;
background-repeat: no-repeat;
position: absolute;
left: 331px;
width: 328px;
height: 415px;
top: 200px; }
.funbox.palms1 .bottles {
width: 168px;
height: 212px;
background: url(img/bottles.png);
background-size: contain;
background-repeat: no-repeat;
position: absolute;
bottom: 135px;
left: 370px;
z-index: 99; }
.funbox.palms2 {
top: 174px;
left: 56vw;
width: 795px;
height: 808px; }
@media (max-width: 1024px) {
.funbox.palms2 {
top: 0;
left: 50%;
transform: translate(-50%, 0); } }
.funbox.palms2 .surfboards_mob {
left: 218px;
top: 151px; }
.funbox.palms2 .eclipse {
right: auto;
left: 128px;
background-color: unset;
background-image: url(img/ellipsesup.png);
background-size: contain;
top: 190px;
width: 501px;
height: 501px; }
.funbox.palms2 .twopalms .palm1 {
background-image: url(img/palme_klein.png);
background-repeat: no-repeat;
width: 193px;
height: 367px;
background-size: contain;
position: absolute;
left: 442px;
top: 272px; }
.funbox.palms2 .twopalms .palm2 {
background-image: url(img/palme_gross.png);
background-repeat: no-repeat;
width: 232px;
height: 454px;
background-size: contain;
position: absolute;
left: 555px;
top: 173px; }
.funbox.palms2 .bottlepack {
background-image: url(img/radlerpack.png);
width: 232px;
height: 232px;
background-size: contain;
background-repeat: no-repeat;
left: 551px;
position: absolute;
top: 524px; }
.funbox.palms2 .txt1 {
background-image: url(img/arrow_sup2.png);
background-size: 106px 96px;
background-repeat: no-repeat;
padding-right: 116px;
background-position: right;
padding-top: 84px;
position: absolute;
left: 283px;
top: 646px; }
.funbox.palms2 .buble {
width: 224px;
height: 155px;
background: url(img/bublrsup.png) center no-repeat;
background-size: contain;
position: absolute;
left: 0;
top: 300px; }
.flex_start {
align-items: flex-start !important; }
.hideUp {
top: -200vh !important; }
.withredtext p {
color: #ce2016;
font-family: Blizzard Regular;
font-size: 30px !important; }
@media (max-width: 1024px) {
.supCompetitionUserFormContainer.row {
justify-content: center; } }
.eventlist.winners .eventitem h4 {
font-size: 30px; }
.eventlist.winners .eventitem .pin {
font-size: 20px; }
.eventlist.winners div.first {
overflow: hidden;
border-radius: 50%; }
.eventlist.winners .short {
display: block;
padding-top: 3px;
font-size: 18px;
line-height: 30px;
color: #000000;
margin-top: 7px; }
.eventlist.winners div.first + div {
max-width: 350px; }
@media (max-width: 1330px) {
.eventlist.winners div.first + div {
max-width: 100%;
width: 100%; } }
@media (max-width: 900px) {
.supCompetitionUserFormContainer span.text {
font-size: 35px; } }
@media (max-width: 900px) {
.form-line input[type="text"].spell {
max-width: 28px;
width: auto;
display: inline;
margin-bottom: 0;
position: absolute;
height: 28px;
top: -24px;
left: -3px;
font-family: Blizzard Regular;
font-size: 33px;
text-align: center; } }
.event_link {
color: #000; }