/*!
Makers & Allies
Version: 1.2
*/
@font-face {
    font-family: Heavitas;
    src: url(../fonts/heavitas.woff) format("woff");
    font-weight: 400;
    font-style: normal
}

html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary {
    display: block
}

audio,canvas,progress,video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden],template {
    display: none
}

a {
    background-color: transparent
}

a:active,a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b,strong {
    font-weight: 700
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub,sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code,kbd,pre,samp {
    font-family: monospace,monospace;
    font-size: 1em
}

button,input,optgroup,select,textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button,select {
    text-transform: none
}

button,html input[type=button],input[type=reset],input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],html input[disabled] {
    cursor: default
}

button::-moz-focus-inner,input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox],input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

legend {
    border: 0;
    padding: 0
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: 700
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td,th {
    padding: 0
}

* {
    box-sizing: border-box
}

body,html {
    font: normal 16px/1 Helvetica,Arial,sans-serif;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased
}

body.noscroll,html.noscroll {
    overflow: hidden!important
}

body {
    transition: background-color 1s
}

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none
}

::selection {
    background: #b3d4fc;
    text-shadow: none
}

hr {
    border: 0;
    display: block;
    height: 1px;
    margin: 1.5em 0;
    padding: 0
}

audio,canvas,iframe,img,svg,video {
    vertical-align: middle
}

fieldset {
    border: 0;
    margin: 0;
    padding: 0
}

textarea {
    resize: none
}

a,a:active,a:focus,a:hover,a:link,a:visited {
    outline: none
}

.lowercase {
    text-transform: lowercase
}

.ethos-hero-items,.ethos-hero-items:after,.hero.overlay:before,.home-hero-wine .bg:after,.wines-hero-wine .bg:after {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%
}

.home-hero-wine .bg:after,.wines-hero-wine .bg:after {
    content: "";
    background: transparent url(assets/images/global/line-texture-bg-overlay.png) 50%/7px auto repeat
}

.headline {
    color: #424242;
    font-weight: 700;
    text-transform: uppercase;
    font: normal normal 75px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    margin: 0;
    padding: 0
}

.contact-form-submit .headline+input,.headline+.button {
    margin-top: 30px
}

.default-content-inner .headline+p,.headline+.text {
    margin-top: .75em
}

.eyebrow {
    color: #fff;
    font-weight: 700;
    text-transform: uppercase;
    font: normal normal 30px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    margin: 0;
    padding: 0;
    letter-spacing: .05em
}

@media only screen and (max-width: 1200px) {
    .eyebrow {
        font-size:26px
    }
}

@media only screen and (max-width: 1023px) {
    .eyebrow {
        font-size:22px
    }
}

@media only screen and (max-width: 767px) {
    .eyebrow {
        font-size:17px
    }
}

@media only screen and (max-width: 480px) {
    .eyebrow {
        font-size:14px
    }
}

.title {
    color: #ccc;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 20px;
    font: normal normal 50px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    margin: 0;
    padding: 0
}

@media only screen and (max-width: 1200px) {
    .title {
        font-size:40px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .title {
        font-size:30px
    }
}

@media only screen and (max-width: 1023px) {
    .title {
        font-size:30px
    }
}

@media only screen and (max-width: 767px) {
    .title {
        font-size:25px
    }
}

@media only screen and (max-width: 480px) {
    .title {
        font-size:20px
    }
}

.default-content-inner h2,.subtitle,.wines-name {
    color: #fff;
    text-transform: uppercase;
    font: normal normal 30px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    margin: 0;
    padding: 0
}

@media only screen and (max-width: 1200px) {
    .default-content-inner h2,.subtitle,.wines-name {
        font-size:26px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .default-content-inner h2,.subtitle,.wines-name {
        font-size:22px
    }
}

@media only screen and (max-width: 1023px) {
    .default-content-inner h2,.subtitle,.wines-name {
        font-size:22px
    }
}

@media only screen and (max-width: 767px) {
    .default-content-inner h2,.subtitle,.wines-name {
        font-size:18px
    }
}

@media only screen and (max-width: 480px) {
    .default-content-inner h2,.subtitle,.wines-name {
        font-size:16px
    }
}

.default-content-inner .subtitle+h2,.default-content-inner .wines-name+h2,.default-content-inner h2+.subtitle,.default-content-inner h2+.wines-name,.default-content-inner h2+h2,.subtitle+.subtitle,.subtitle+.wines-name,.wines-name+.subtitle,.wines-name+.wines-name {
    margin-top: 5px
}

.subtitle2 {
    text-transform: uppercase;
    font: normal normal 20px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    margin: 0;
    padding: 0
}

.default-content-inner p,.text {
    font: 400 normal 20px/1.4 Open Sans,Helvetica,Arial,sans-serif;
    margin: 0;
    padding: 0
}

@media only screen and (max-width: 1200px) {
    .default-content-inner p,.text {
        font-size:18px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .default-content-inner p,.text {
        font-size:18px
    }
}

@media only screen and (max-width: 1023px) {
    .default-content-inner p,.text {
        font-size:17px
    }
}

@media only screen and (max-width: 767px) {
    .default-content-inner p,.text {
        font-size:15px
    }
}

@media only screen and (max-width: 480px) {
    .default-content-inner p,.text {
        font-size:14px
    }
}

.default-content-inner p strong,.text strong {
    font-weight: 700
}

.wine-title {
    color: #424242;
    font-weight: 700;
    text-transform: uppercase;
    font: normal normal 4vw/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    letter-spacing: .01em;
    margin: 0 0 5px;
    padding: 0
}

@media only screen and (max-width: 1023px) {
    .wine-title {
        font-size:40px
    }
}

@media only screen and (max-width: 767px) {
    .wine-title {
        font-size:30px
    }
}

@media only screen and (max-width: 480px) {
    .wine-title {
        font-size:20px;
        margin-bottom: 10px
    }
}

@media only screen and (max-width: 767px) {
    .wine-title br {
        display:none
    }
}

.wine-title .period {
    display: none
}

@media only screen and (max-width: 767px) {
    .wine-title .period {
        display:inline
    }
}

.wine-subtitle2 {
    color: #fff;
    text-transform: uppercase;
    font: normal normal 23px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    margin: 0;
    padding: 0
}

@media only screen and (max-width: 1500px) {
    .wine-subtitle2 {
        font-size:21px
    }
}

@media only screen and (max-width: 1023px) {
    .wine-subtitle2 {
        font-size:18px
    }
}

@media only screen and (max-width: 767px) {
    .wine-subtitle2 {
        font-size:17px
    }
}

@media only screen and (max-width: 480px) {
    .wine-subtitle2 {
        font-size:15px
    }
}

@media only screen and (max-width: 340px) {
    .wine-subtitle2 {
        font-size:13px
    }
}

.contact-form-submit .wine-subtitle2+input,.wine-subtitle2+.button {
    margin-top: 20px
}

.wine-subtitle2+.wine-subtitle2 {
    margin-top: 5px
}

/*!
 * fullPage 2.9.2
 * https://github.com/alvarotrigo/fullPage.js
 * MIT licensed
 *
 * Copyright (C) 2013 alvarotrigo.com - A project by Alvaro Trigo
 */
.fp-enabled body,html.fp-enabled {
    margin: 0;
    padding: 0;
    overflow: hidden;
    -webkit-tap-highlight-color: transparent
}

#superContainer {
    height: 100%;
    position: relative;
    -ms-touch-action: none;
    touch-action: none
}

.fp-section {
    position: relative;
    box-sizing: border-box
}

.fp-slide {
    float: left
}

.fp-slide,.fp-slidesContainer {
    height: 100%;
    display: block
}

.fp-slides {
    z-index: 1;
    height: 100%;
    overflow: hidden;
    position: relative;
    transition: all .3s ease-out
}

.fp-section.fp-table,.fp-slide.fp-table {
    display: table;
    table-layout: fixed;
    width: 100%
}

.fp-tableCell {
    width: 100%;
    height: 100%
}

.fp-slidesContainer {
    float: left;
    position: relative
}

.fp-controlArrow {
    -webkit-user-select: none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -ms-user-select: none;
    position: absolute;
    z-index: 4;
    top: 50%;
    cursor: pointer;
    width: 0;
    height: 0;
    border-style: solid;
    margin-top: -38px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.fp-controlArrow.fp-prev {
    left: 15px;
    width: 0;
    border-width: 38.5px 34px 38.5px 0;
    border-color: transparent #fff transparent transparent
}

.fp-controlArrow.fp-next {
    right: 15px;
    border-width: 38.5px 0 38.5px 34px;
    border-color: transparent transparent transparent #fff
}

.fp-scrollable {
    position: relative
}

.fp-scrollable,.fp-scroller {
    overflow: hidden
}

.iScrollIndicator {
    border: 0!important
}

.fp-notransition {
    transition: none!important
}

#fp-nav {
    position: fixed;
    z-index: 100;
    margin-top: -32px;
    top: 50%;
    opacity: 1;
    -webkit-transform: translateZ(0)
}

#fp-nav.right {
    right: 17px
}

#fp-nav.left {
    left: 17px
}

.fp-slidesNav {
    position: absolute;
    z-index: 4;
    left: 50%;
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.fp-slidesNav.bottom {
    bottom: 17px
}

.fp-slidesNav.top {
    top: 17px
}

#fp-nav ul,.fp-slidesNav ul {
    margin: 0;
    padding: 0
}

#fp-nav ul li,.fp-slidesNav ul li {
    display: block;
    width: 14px;
    height: 13px;
    margin: 7px;
    position: relative
}

.fp-slidesNav ul li {
    display: inline-block
}

#fp-nav ul li a,.fp-slidesNav ul li a {
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
    cursor: pointer;
    text-decoration: none
}

#fp-nav ul li:hover a.active span,#fp-nav ul li a.active span,.fp-slidesNav ul li:hover a.active span,.fp-slidesNav ul li a.active span {
    height: 12px;
    width: 12px;
    margin: -6px 0 0 -6px;
    border-radius: 100%
}

#fp-nav ul li a span,.fp-slidesNav ul li a span {
    border-radius: 50%;
    position: absolute;
    z-index: 1;
    height: 4px;
    width: 4px;
    border: 0;
    background: #333;
    left: 50%;
    top: 50%;
    margin: -2px 0 0 -2px;
    transition: all .1s ease-in-out
}

#fp-nav ul li .fp-tooltip {
    position: absolute;
    top: -2px;
    color: #fff;
    font-size: 14px;
    font-family: arial,helvetica,sans-serif;
    white-space: nowrap;
    max-width: 220px;
    overflow: hidden;
    display: block;
    opacity: 0;
    width: 0;
    cursor: pointer
}

#fp-nav.fp-show-active a.active+.fp-tooltip,#fp-nav ul li:hover .fp-tooltip {
    transition: opacity .2s ease-in;
    width: auto;
    opacity: 1
}

#fp-nav ul li .fp-tooltip.right {
    right: 20px
}

#fp-nav ul li .fp-tooltip.left {
    left: 20px
}

.fp-auto-height.fp-section,.fp-auto-height .fp-slide,.fp-auto-height .fp-tableCell,.fp-responsive .fp-auto-height-responsive.fp-section,.fp-responsive .fp-auto-height-responsive .fp-slide,.fp-responsive .fp-auto-height-responsive .fp-tableCell {
    height: auto!important
}

.slick-slider {
    box-sizing: border-box;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent
}

.slick-list,.slick-slider {
    position: relative;
    display: block
}

.slick-list {
    overflow: hidden;
    margin: 0;
    padding: 0
}

.slick-list:focus {
    outline: none
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand
}

.slick-slider .slick-list,.slick-slider .slick-track {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.slick-track {
    position: relative;
    left: 0;
    top: 0;
    display: block
}

.slick-track:after,.slick-track:before {
    content: "";
    display: table
}

.slick-track:after {
    clear: both
}

.slick-loading .slick-track {
    visibility: hidden
}

.slick-slide {
    float: left;
    height: 100%;
    min-height: 1px;
    display: none
}

[dir=rtl] .slick-slide {
    float: right
}

.slick-slide img {
    display: block
}

.slick-slide.slick-loading img {
    display: none
}

.slick-slide.dragging img {
    pointer-events: none
}

.slick-initialized .slick-slide {
    display: block
}

.slick-loading .slick-slide {
    visibility: hidden
}

.slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent
}

.slick-arrow {
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    width: 50px;
    height: 150px;
    background-color: transparent;
    background-repeat: no-repeat;
    background-size: 33px auto;
    border: 0;
    text-indent: -9999px;
    white-space: nowrap;
    overflow: hidden;
    z-index: 1;
    padding: 0;
    margin: 0;
    transition: opacity .2s
}

@media only screen and (max-width: 767px) {
    .slick-arrow {
        width:30px;
        height: 100px;
        background-size: 20px auto;
        display: none!important
    }
}

.slick-arrow.slick-prev {
    left: 0;
    background-image: url(assets/images/global/slider-arrow-left.png);
    background-position: 0
}

.slick-arrow.slick-next {
    right: 0;
    background-image: url(assets/images/global/slider-arrow-right.png);
    background-position: 100%
}

.slick-arrow.slick-hidden {
    display: none
}

.slick-arrow:focus {
    outline: none
}

.slick-disabled {
    opacity: .25;
    cursor: default
}

.slick-dots {
    margin: 0;
    padding: 0;
    position: absolute;
    left: 50%;
    bottom: -100px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    z-index: 1
}

@media only screen and (max-width: 1023px) {
    .slick-dots {
        bottom:-60px
    }
}

.slick-dots li {
    width: 10px;
    height: 10px;
    background: rgba(0,0,0,.4);
    border-radius: 50%;
    list-style-type: none;
    margin: 0 5px;
    cursor: pointer;
    transition: background .2s
}

.slick-dots li.slick-active {
    background: #fff
}

.slick-dots li button {
    display: none
}

@-webkit-keyframes a {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes a {
    0% {
        opacity: 1
    }

    50% {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

.typed-cursor {
    color: #b11f24;
    opacity: 1;
    -webkit-animation: a .7s infinite;
    animation: a .7s infinite
}

.wpcf7-not-valid {
    box-shadow: inset 0 0 0 2px red!important
}

.wpcf7-not-valid-tip,.wpcf7-response-output {
    display: none!important
}

span.ajax-loader {
    left: calc(50% - 8px);
    position: relative;
    margin: 10px 0 0!important;
    display: block!important;
    background: none!important;
    border-radius: 50%;
    border-left: 2px solid #b11f24!important;
    border-top: 2px solid #b11f24!important;
    border-bottom: 2px solid transparent!important;
    border-right: 2px solid transparent!important;
    -webkit-animation: e .7s infinite linear;
    animation: e .7s infinite linear
}

.button,.contact-form-submit input {
    padding: 8px 15px;
    display: inline-block;
    text-decoration: none;
    text-transform: uppercase;
    font: 600 normal 14px/1.4 Open Sans,Helvetica,Arial,sans-serif;
    letter-spacing: .12em;
    border-radius: 10px 0 0 10px;
    position: relative;
    transition: background-position .2s linear,padding .2s linear,background-color .2s
}

@media only screen and (max-width: 767px) {
    .button,.contact-form-submit input {
        font-size:13px
    }
}

.button.primary,.contact-form-submit input.primary {
    color: #fff;
    padding-right: 10px
}

.button.primary:after,.contact-form-submit input.primary:after {
    content: "";
    position: absolute;
    left: 100%;
    height: 100%;
    width: 25px;
    top: 0;
    background-image: url(../images/global/button-arrow-line.png),url(../images/global/button-arrow-end.png);
    background-position: 0,calc(100% - 10px) 50%;
    background-size: 7px 10px,13px 10px;
    background-repeat: no-repeat;
    border-radius: 0 10px 10px 0;
    transition: width .2s,background-color .2s
}

@media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio:2),(min-resolution:192dpi) {
    .button.primary:after,.contact-form-submit input.primary:after {
        background-image:url(../images/global/button-arrow-line@2x.png),url(assets/images/global/button-arrow-end@2x.png)
    }
}

.button.primary:hover:after,.contact-form-submit input.primary:hover:after {
    width: 30px
}

.button.secondary,.contact-form-submit input.secondary {
    border: 1px solid #fff;
    color: #fff;
    transition: background-color .2s
}

.button.secondary:after,.contact-form-submit input.secondary:after {
    content: "";
    position: absolute;
    left: 100%;
    height: 100%;
    width: 35px;
    top: -1px;
    background-image: url(../images/global/button-arrow-line.png),url(../images/global/button-arrow-end.png);
    background-position: 10px,calc(100% - 10px) 50%;
    background-size: 7px 10px,13px 10px;
    background-repeat: no-repeat;
    border: 1px solid #fff;
    border-left: 0;
    border-radius: 0 10px 10px 0;
    transition: width .2s,background-color .2s
}

@media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio:2),(min-resolution:192dpi) {
    .button.secondary:after,.contact-form-submit input.secondary:after {
        background-image:url(assets/images/global/button-arrow-line@2x.png),url(assets/images/global/button-arrow-end@2x.png)
    }
}

.button.secondary:hover,.contact-form-submit input.secondary:hover {
    background-color: hsla(0,0%,100%,.1)
}

.button.secondary:hover:after,.contact-form-submit input.secondary:hover:after {
    width: 40px;
    background-color: hsla(0,0%,100%,.1)
}

.button.download,.contact-form-submit input.download {
    border: 1px solid #424242;
    color: #424242;
    transition: background-color .2s
}

.button.download:after,.contact-form-submit input.download:after {
    content: "";
    position: absolute;
    left: 100%;
    height: 100%;
    width: 35px;
    top: -1px;
    background: transparent url(assets/images/global/button-arrow-download.png) center 50%/10px 13px no-repeat;
    border: 1px solid #424242;
    border-left: 0;
    border-radius: 0 10px 10px 0;
    transition: background-color .2s
}

.button.download:hover,.button.download:hover:after,.contact-form-submit input.download:hover,.contact-form-submit input.download:hover:after {
    background-color: rgba(66,66,66,.1)
}

.button.download.centered,.contact-form-submit input.download.centered {
    margin-left: -35px
}

.button.centered,.contact-form-submit input.centered {
    margin-left: -25px
}

@media only screen and (max-width: 767px) {
    .button.centered-s,.contact-form-submit input.centered-s {
        margin-left:-25px
    }
}

.button.white:after,.contact-form-submit input.white:after {
    background-image: url(assets/images/global/button-arrow-line-dark.png),url(assets/images/global/button-arrow-end-dark.png)
}

@media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio:2),(min-resolution:192dpi) {
    .button.white:after,.contact-form-submit input.white:after {
        background-image:url(assets/images/global/button-arrow-line-dark@2x.png),url(assets/images/global/button-arrow-end-dark@2x.png)
    }
}

.full-width-image {
    width: 100%;
    height: auto
}

.overflow-container {
    overflow: hidden;
    display: block
}

.overflow-container.animate .overflow-inner {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01),-webkit-transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition-delay: .6s
}

.overflow-container.animate .overflow-inner.delay1 {
    transition-delay: .8s
}

.overflow-container.animate .overflow-inner.delay2 {
    transition-delay: 1s
}

.overflow-container.animate .overflow-inner.delay3 {
    transition-delay: 1.2s
}

.overflow-container.animate .overflow-inner.delay4 {
    transition-delay: 1.4s
}

.overflow-container.full-width {
    width: 100%
}

.overflow-inner {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    transition-delay: 1s;
    display: block
}

.header-logo {
    display: block;
    height: 100%;
    width: 100%;
    background-color: #b11f24;
    padding: 12px 17px 13px 14px;
    -webkit-transform: rotateY(0deg);
    transform: rotateY(0deg);
    -webkit-transform-origin: left center;
    transform-origin: left center;
    transition: background-color .5s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01),background-color .5s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01),background-color .5s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01);
    transition-delay: .8s
}

@media only screen and (max-width: 767px) {
    .header-logo.animate {
        -webkit-transform:rotateY(100deg);
        transform: rotateY(100deg);
        background-color: #5a1012;
        transition-delay: 0s
    }
}

.header-logo-wrapper {
    -webkit-perspective: 300px;
    perspective: 300px;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 20px
}

.header-logo svg {
    fill: #fff;
    width: 44px;
    height: auto
}

.header-nav {
    position: fixed;
    top: 0;
    right: 0;
    width: auto;
    height: 100%;
    padding: 20px;
    background-color: #f9f9f9;
    z-index: 1000;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    transition: -webkit-transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01),-webkit-transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition-delay: 0s
}

@media only screen and (max-width: 480px) {
    .header-nav {
        width:100%
    }
}

.header-nav.open {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.header-nav.open .header-button.close {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) .7s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) .7s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) .7s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) .7s
}

.header-nav.open .header-nav-logo svg {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .8s cubic-bezier(.24,.72,.35,1.01) .8s;
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01) .8s;
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01) .8s,-webkit-transform .8s cubic-bezier(.24,.72,.35,1.01) .8s
}

.header-nav.open .header-nav-items li a span {
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01),-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01)
}

.header-nav.open .header-nav-items li:first-child span {
    transition-delay: .1s
}

.header-nav.open .header-nav-items li:nth-child(2) span {
    transition-delay: .2s
}

.header-nav.open .header-nav-items li:nth-child(3) span {
    transition-delay: .3s
}

.header-nav.open .header-nav-items li:nth-child(4) span {
    transition-delay: .4s
}

.header-nav.open .header-nav-items li:nth-child(5) span {
    transition-delay: .5s
}

.header-nav.open .header-nav-items li:nth-child(6) span {
    transition-delay: .6s
}

.header-nav.open .header-nav-items span,.header-nav.open .header-nav-social {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.header-nav.open .header-nav-social {
    transition: -webkit-transform .8s cubic-bezier(.24,.72,.35,1.01) .9s;
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01) .9s;
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01) .9s,-webkit-transform .8s cubic-bezier(.24,.72,.35,1.01) .9s
}

.header-nav-logo {
    text-align: center;
    margin-top: 20px;
    overflow: hidden;
    display: block
}

@media only screen and (max-width: 480px) {
    .header-nav-logo {
        margin-top:10px
    }
}

.header-nav-logo svg {
    width: 200px;
    height: auto;
    fill: #ddd;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    transition-delay: .8s
}

@media only screen and (max-width: 480px) {
    .header-nav-logo svg {
        width:150px
    }
}

@media only screen and (max-width: 340px) {
    .header-nav-logo svg {
        width:110px
    }
}

.header-nav-items {
    margin: 20px 0 0;
    padding: 0 10px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-align: start;
    align-items: flex-start
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .header-nav-items {
        margin-top:6px
    }
}

@media only screen and (max-width: 480px) {
    .header-nav-items {
        margin-top:30px
    }
}

@media only screen and (max-width: 340px) {
    .header-nav-items {
        margin-top:20px
    }
}

.header-nav-items li {
    list-style-type: none;
    font: normal normal 15px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    letter-spacing: .01em;
}

.header-nav-items a.secondary {
    color: #cac4bd;
    font-size: 13px;
    margin-left: 15px;
}

.header-nav-items a {
    display: block;
    text-decoration: none;
    position: relative;
    overflow: hidden
}

.header-nav-items a span {
    position: relative;
    z-index: 2;
    display: block;
    padding: 10px 20px 10px 10px;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    transition-delay: .8s
}

@media only screen and (max-width: 340px) {
    .header-nav-items a span {
        padding:8px 0
    }
}

.header-nav-items a.primary {
    color: #8b8782
}

.header-nav-items a.secondary {
    color: #cac4bd
}

.header-nav-items a:after {

    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 100%;
    background: transparent url(assets/images/global/line-texture.png) 0 0/5px auto repeat;
    z-index: 1;
    transition: width .4s cubic-bezier(.24,.72,.35,1.01),left 0s .4s
}

@media only screen and (max-width: 1200px) {
    .header-nav-items a:after {
        display:none
    }
}

.header-nav-items a:hover:after {
    width: 100%
}

.header-nav-social {
    position: absolute;
    /*overflow:scroll!important;*/
    bottom: 0;
    left: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    height: 70px;
    border-top: 1px solid #cac4bd;
    width: 100%;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    transition-delay: .8s
}

.header-nav-social-title {
   font: 700 normal 10px/1 Open Sans,Helvetica,Arial,sans-serif;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: #8b8782;
    padding: 30px 0px 0;
    text-align: center;
    -ms-flex-positive: 1;
    flex-grow: 1;
}

.header-nav-social-item {
    width: 80px;
    text-align: center;
    border-left: 1px solid #cac4bd;
    padding-top: 20px;
    transition: background .2s cubic-bezier(.24,.72,.35,1.01)
}

.header-nav-social-item:hover {
    background: #fff
}

.header-nav-social-item:hover svg {
    fill: #716d69
}

.header-nav-social-item svg {
    fill: #8b8782;
    height: 25px;
    transition: fill .2s cubic-bezier(.24,.72,.35,1.01)
}

.header-button {
    width: 50px;
    height: 50px;
    border: 0;
    border-radius: 0;
    position: relative
}

.header-button:focus {
    outline: 0
}

.header-button-wrapper {
    overflow: hidden
}

.header-button.open {
    position: fixed;
    z-index: 1000;
    right: 20px;
    top: 20px;
    background: transparent url(assets/images/global/line-texture2.png) 50%/5px auto repeat
}

@media only screen and (max-width: 767px) {
    .header-button.open {
        right:10px;
        top: 10px
    }
}

.header-button.open:after,.header-button.open:before {
    content: "";
    display: block;
    position: absolute;
    width: 30px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-bottom: 3px solid #fff;
    margin-left: auto;
    margin-right: auto
}

.header-button.open:before {
    top: 15px;
    height: 6px;
    border-top: 3px solid #fff
}

.header-button.open:after {
    top: 33px;
    border-bottom: 3px solid #fff
}

.header-button.open.hidden {
    transition-delay: 0s
}

.header-button.close {
    position: relative;
    transition-delay: .8s;
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    background: transparent url(assets/images/global/line-texture.png) 50%/5px auto repeat
}

.header-button.close:after,.header-button.close:before {
    content: "";
    display: block;
    position: absolute;
    width: 35px;
    left: 50%;
    top: 23px;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    background-color: #8b8782;
    height: 3px;
    margin-left: auto;
    margin-right: auto;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.header-button.close:before {
    -webkit-transform: translateX(-50%) rotate(45deg);
    transform: translateX(-50%) rotate(45deg)
}

.header-button.close:after {
    -webkit-transform: translateX(-50%) rotate(-45deg);
    transform: translateX(-50%) rotate(-45deg)
}

.newsletter-signup form {
    margin-top: 20px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap
}

.newsletter-signup input[type=email] {
    background-color: #fff;
    border: none;
    border-radius: 0;
    box-sizing: border-box;
    box-shadow: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    width: calc(100% - 120px);
    height: 100px;
    padding: 0 30px;
    font: 300 normal 30px/1 Open Sans,Helvetica,Arial,sans-serif;
    color: #525252
}

@media only screen and (max-width: 1200px) {
    .newsletter-signup input[type=email] {
        height:80px;
        font-size: 26px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .newsletter-signup input[type=email] {
        height:80px;
        font-size: 26px
    }
}

@media only screen and (max-width: 480px) {
    .newsletter-signup input[type=email] {
        width:calc(100% - 80px);
        font-size: 20px;
        height: 60px;
        padding: 0 20px
    }
}

.newsletter-signup input[type=email]::-webkit-input-placeholder {
    color: #525252
}

.newsletter-signup input[type=email]:-moz-placeholder,.newsletter-signup input[type=email]::-moz-placeholder {
    text-transform: uppercase;
    color: #525252
}

.newsletter-signup input[type=email]:-ms-input-placeholder {
    text-transform: uppercase;
    color: #525252
}

.newsletter-signup input[type=email]:focus {
    outline: 0
}

.newsletter-signup input[type=submit] {
    background: url(assets/images/global/shaka.svg) 50%/50% auto no-repeat;
    background-color: #ddd;
    border: none;
    border-radius: 0;
    box-sizing: border-box;
    box-shadow: none;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    width: 120px
}

@media only screen and (max-width: 1200px) {
    .newsletter-signup input[type=submit] {
        background-size:40% auto
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .newsletter-signup input[type=submit] {
        background-size:40% auto
    }
}

@media only screen and (max-width: 480px) {
    .newsletter-signup input[type=submit] {
        width:80px
    }
}

.footer {
    height: 100%;
    background: #232323;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-align: stretch;
    align-items: stretch
}

@media only screen and (max-width: 1023px) {
    .footer {
        -ms-flex-flow:column nowrap;
        flex-flow: column nowrap;
        -ms-flex-pack: end;
        justify-content: flex-end
    }
}

.footer-full-height .footer {
    height: 100vh
}

.footer-item {
    width: 50%;
    height: calc(100% - 40px)
}

@media only screen and (max-width: 1023px) {
    .footer-item {
        width:100%
    }
}

.footer-item.left {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap
}

@media only screen and (max-width: 1023px) {
    .footer-item.left {
        height:40%
    }
}

@media only screen and (max-width: 1023px) {
    .footer-item.right {
        -ms-flex-order:-1;
        order: -1;
        height: calc(60% - 40px)
    }
}

.footer-section {
    padding: 17vh 8vw
}

@media only screen and (max-height: 800px) {
    .footer-section {
        padding-top:100px;
        padding-bottom: 100px
    }
}

@media only screen and (max-width: 1023px) {
    .footer-section {
        padding-top:40px;
        padding-bottom: 40px;
        -ms-flex-positive: 1;
        flex-grow: 1;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width: 767px) {
    .footer-section {
        padding:8vw
    }
}

.footer-trade {
    height: 50%;
    background-color: #1f1f1f
}

.footer-contact {
    height: 50%;
    background-color: #232323
}

.footer-follow {
    height: 100%;
    background-color: #1c1c1c;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-pack: justify;
    justify-content: space-between
}

@media only screen and (max-width: 1023px) {
    .footer-follow {
        -ms-flex-pack:center;
        justify-content: center
    }
}

.footer-newsletter {
    margin-bottom: 40px
}

@media only screen and (max-width: 767px) {
    .footer-newsletter {
        margin-bottom:20px
    }
}

.footer-newsletter input[type=email] {
    background-color: #232323
}

.footer-newsletter input[type=submit] {
    background-color: #2f2f2f
}

.footer-title {
    margin: 0;
    padding: 0;
    color: #f5f0ea;
    font: normal normal 50px/1.1 Heavitas,Arial Black,Helvetica,sans-serif
}

@media only screen and (max-width: 1500px) {
    .footer-title {
        font-size:40px
    }
}

@media only screen and (max-width: 1023px) {
    .footer-title {
        font-size:30px
    }
}

@media only screen and (max-width: 480px) {
    .footer-title {
        font-size:20px
    }
}

.default-content-inner .footer p,.footer .default-content-inner p,.footer .text {
    color: #888888
}

.default-content-inner .footer p a,.footer .default-content-inner p a,.footer .text a {
    color: currentColor;
    text-decoration: none
}

.default-content-inner .footer p a:hover,.footer .default-content-inner p a:hover,.footer .text a:hover {
    text-decoration: underline
}

.footer .highlight {
    color: #b11f24
}

.footer-social {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap
}

.footer-social-icons {
    width: calc(25% - 6px);
    margin: 0 6px 0 0;
    padding: 0
}

@media only screen and (max-width: 1023px) {
    .footer-social-icons {
        display:none
    }
}

.footer-social-icons li {
    margin: 0;
    padding: 0;
    list-style-type: none;
    padding-top: calc(100% + 3px);
    position: relative
}

.footer-social-icons li:first-child {
    margin-bottom: 6px
}

.footer-social-icons a {
    display: block;
    width: 100%;
    height: 100%;
    transition: background-color .2s;
    position: absolute;
    left: 0;
    top: 0
}

.footer-social-icons svg {
    position: absolute;
    fill: #fff;
    height: 40%;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

.footer-social-instagram {
    background-color: #517fa4
}

.footer-social-instagram:hover {
    background-color: #406582
}

.footer-social-facebook {
    background-color: #3c5b9b
}

.footer-social-facebook:hover {
    background-color: #2e4576
}

.footer-social-feed {
    width: 75%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

@media only screen and (max-width: 1023px) {
    .footer-social-feed {
        width:100%
    }
}

@media only screen and (max-width: 340px) {
    .footer-social-feed {
        display:none
    }
}

.footer-social-feed a {
    width: calc(33.33333% - 4px);
    margin: 0 6px 6px 0;
    background-position: 50%;
    background-size: cover;
    background-repeat: no-repeat;
    padding-top: calc(33.33333% - 3px)
}

@media only screen and (max-width: 1023px) {
    .footer-social-feed a {
        width:calc(25% - 4.5px);
        padding-top: calc(25% - 6px)
    }
}

.footer-social-feed a:nth-child(3n) {
    margin-right: 0
}

@media only screen and (max-width: 1023px) {
    .footer-social-feed a:nth-child(3n) {
        margin-right:6px
    }
}

@media only screen and (max-width: 1023px) {
    .footer-social-feed a:nth-child(4n) {
        margin-right:0
    }
}

.footer-social-feed a:nth-child(n+4) {
    margin-bottom: 0
}

@media only screen and (max-width: 1023px) {
    .footer-social-feed a:nth-child(n+5) {
        display:none
    }
}

.footer-social-feed img {
    display: block;
    width: 100%;
    height: auto
}

.footer-copyright {
    background-color: #111;
    text-align: center;
    height: 40px;
    font: 400 normal 12px/1.5 Open Sans,Helvetica,Arial,sans-serif;
    color: #525252;
    width: 100%;
    padding-top: 11px;
    letter-spacing: .05em;
    text-transform: uppercase
}

@media only screen and (max-width: 767px) {
    .footer-copyright {
        font-size:9px;
        padding-top: 7px;
        letter-spacing: .03em
    }
}

@media only screen and (max-width: 340px) {
    .footer-copyright {
        font-size:8px;
        letter-spacing: 0
    }
}

.footer-copyright-item:after {
    content: " |";
    margin: 0 .5em
}

@media only screen and (max-width: 767px) {
    .footer-copyright-item:nth-child(2):after {
        content:none
    }
}

@media only screen and (max-width: 767px) {
    .footer-copyright-makers {
        display:block
    }
}

.footer-copyright a {
    color: currentColor;
    text-decoration: none
}

.footer-copyright a:hover {
    text-decoration: underline
}

@-webkit-keyframes b {
    0% {
        background-position: center 50%
    }

    80% {
        background-position: center 50%
    }

    90% {
        background-position: center 60%
    }

    to {
        background-position: center 50%
    }
}

@keyframes b {
    0% {
        background-position: center 50%
    }

    80% {
        background-position: center 50%
    }

    90% {
        background-position: center 60%
    }

    to {
        background-position: center 50%
    }
}

.hero {
    height: 100%;
    position: relative;
    overflow: hidden
}

.hero.main {
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 5%;
    padding-right: 5%
}

.hero.main .eyebrow {
    z-index: 3
}

.hero.main .headline {
    color: #fff;
    position: relative;
    z-index: 3
}

@media only screen and (max-width: 1200px) {
    .hero.main .headline {
        font-size:60px
    }
}

@media only screen and (max-width: 1023px) {
    .hero.main .headline {
        font-size:45px
    }
}

@media only screen and (max-width: 767px) {
    .hero.main .headline {
        font-size:35px
    }
}

@media only screen and (max-width: 480px) {
    .hero.main .headline {
        font-size:28px
    }
}

.hero.main .headline a {
    color: currentColor;
    text-decoration: none
}

.hero-intro {
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

.hero-intro-content {
    z-index: 1;
    width: 100%;
    position: relative;
    padding: 50px 0
}

@media only screen and (max-width: 1023px) {
    .hero-intro-content {
        padding-left:15%;
        padding-right: 15%
    }
}

@media only screen and (max-width: 767px) {
    .hero-intro-content {
        padding-left:5%;
        padding-right: 5%
    }
}

.hero-intro-icon {
    margin-bottom: 2em
}

.hero-intro-eyebrow {
    margin-bottom: .1em
}

.hero-intro-headline {
    margin-bottom: 1em
}

@media only screen and (max-width: 767px) {
    .hero-intro-headline {
        margin-bottom:.5em
    }
}

.hero-intro-text {
    margin-bottom: 2em
}

.hero-intro .headline {
    color: #424242
}

@media only screen and (max-width: 1200px) {
    .hero-intro .headline {
        font-size:60px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .hero-intro .headline {
        font-size:60px
    }
}

@media only screen and (max-width: 1023px) {
    .hero-intro .headline {
        font-size:45px
    }
}

@media only screen and (max-width: 767px) {
    .hero-intro .headline {
        font-size:35px
    }
}

@media only screen and (max-width: 480px) {
    .hero-intro .headline {
        font-size:28px
    }
}

.default-content-inner .hero-intro p,.hero-intro .default-content-inner p,.hero-intro .text {
    color: #424242
}

@media only screen and (max-width: 1023px) {
    .default-content-inner .hero-intro p br,.hero-intro .default-content-inner p br,.hero-intro .text br {
        display:none
    }
}

.hero-arrow {
    position: absolute;
    left: 50%;
    bottom: 0;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    height: 33px;
    width: 126px;
    background: transparent url(assets/images/global/hero-arrow.png) bottom/100% 100% no-repeat;
    cursor: pointer;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom;
    transition: -webkit-transform .5s;
    transition: transform .5s;
    transition: transform .5s,-webkit-transform .5s;
    transition-delay: 1s;
    z-index: 3
}

@media only screen and (max-width: 767px) {
    .hero-arrow {
        height:22px;
        width: 85px
    }
}

.hero-arrow.animate {
    -webkit-transform: translateX(-50%) rotateX(-90deg);
    transform: translateX(-50%) rotateX(-90deg);
    transition-delay: 0s
}

.hero-arrow.white {
    background-image: url(assets/images/global/hero-arrow-white.png)
}

.hero-arrow-small {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 40px;
    height: 40px;
    background: transparent url(assets/images/global/hero-arrow-small.png) center 50%/10px auto no-repeat;
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    z-index: 4;
    transition: opacity .3s 1.5s,visibility .3s 1.5s;
    -webkit-animation: b 3s infinite;
    animation: b 3s infinite
}

@media only screen and (max-width: 767px) {
    .hero-arrow-small {
        bottom:-5px
    }
}

.hero-arrow-small:hover {
    cursor: pointer
}

.hero-arrow-small.hide {
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s,visibility .3s
}

.hero-arrow-small.dark {
    background-image: url(assets/images/global/hero-arrow-small-dark.png)
}

.hero-arrow-small.main {
    bottom: 20%;
    border-radius: 50%;
    border: 1px solid #fff
}

.hero-arrow-small.main.dark {
    border-color: #424242
}

.hero-arrow-small.main.hidden {
    opacity: 0;
    transition: none
}

.hero-line-texture {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 600px;
    width: 400px;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    overflow: hidden
}

@media only screen and (max-width: 1200px) {
    .hero-line-texture {
        height:550px;
        width: 350px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .hero-line-texture {
        height:550px
    }
}

@media only screen and (max-width: 1023px) {
    .hero-line-texture {
        height:450px;
        width: 300px
    }
}

@media only screen and (max-width: 480px) {
    .hero-line-texture {
        height:65%;
        width: 65%;
        max-height: 450px
    }
}

.hero-line-texture:after,.hero-line-texture:before {
    content: "";
    position: absolute;
    background-image: url(assets/images/global/line-texture-horizontal.png);
    background-repeat: repeat;
    background-size: auto 10px;
    left: 50%;
    top: 50%;
    width: 200%;
    height: 200%;
    transition-delay: 1s
}

.hero-line-texture:before {
    background-position: 0 0;
    -webkit-transform: translate(calc(-50% + 600px),calc(-50% - 600px)) rotate(-45deg);
    transform: translate(calc(-50% + 600px),calc(-50% - 600px)) rotate(-45deg)
}

.hero-line-texture:after {
    background-position: 0 5px;
    -webkit-transform: translate(calc(-50% - 600px),calc(-50% + 600px)) rotate(-45deg);
    transform: translate(calc(-50% - 600px),calc(-50% + 600px)) rotate(-45deg)
}

.hero-line-texture.animate:after,.hero-line-texture.animate:before {
    -webkit-transform: translate(-50%,-50%) rotate(-45deg);
    transform: translate(-50%,-50%) rotate(-45deg);
    transition: -webkit-transform 1s cubic-bezier(.24,.72,.35,1.01);
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01);
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01),-webkit-transform 1s cubic-bezier(.24,.72,.35,1.01);
    transition-delay: .75s
}

.hero-line-texture.dark:after,.hero-line-texture.dark:before {
    background-image: url(assets/images/global/line-texture-horizontal-dark.png)
}

.hero.full-height {
    height: 100vh
}

.hero.parallax {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100vh;
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: z-index 1s 1s,-webkit-transform 1s ease;
    transition: transform 1s ease,z-index 1s 1s;
    transition: transform 1s ease,z-index 1s 1s,-webkit-transform 1s ease;
    z-index: 3
}

@media only screen and (max-width: 767px) {
    .hero.parallax {
        padding-bottom:60px
    }
}

.hero.parallax.animate {
    -webkit-transform: translateY(-50vh);
    transform: translateY(-50vh);
    z-index: 0;
    transition: z-index 0s linear 0s,-webkit-transform 1.3s cubic-bezier(.5,0,.6,1);
    transition: transform 1.3s cubic-bezier(.5,0,.6,1),z-index 0s linear 0s;
    transition: transform 1.3s cubic-bezier(.5,0,.6,1),z-index 0s linear 0s,-webkit-transform 1.3s cubic-bezier(.5,0,.6,1)
}

.hero.no-parallax {
    position: absolute;
    z-index: 0
}

.hero.no-parallax.animate {
    -webkit-transform: none;
    transform: none
}

.hero.video {
    z-index: 3
}

.hero.video video {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    z-index: -1
}

.hero.video video.desktop {
    min-width: 100%;
    min-height: 100%
}

@media only screen and (max-width: 480px) {
    .hero.video video.desktop {
        display:none
    }
}

.hero.video video.mobile {
    width: 120%;
    min-height: 120%;
    display: none
}

@media only screen and (max-width: 480px) {
    .hero.video video.mobile {
        display:block
    }
}

.hero.video:after {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,.5);
    z-index: 2
}

.hero.overlay:before {
    content: "";
    background: rgba(0,0,0,.2);
    z-index: 0
}

.hero-play {
    z-index: 4;
    margin-top: 30px;
    position: relative
}

.hero-play-button {
    display: block;
    z-index: 4;
    position: relative;
    cursor: pointer;
    opacity: 1;
    transition: opacity .2s
}

.hero-play-button:hover {
    opacity: .7
}

#play-button {
    width: 75px
}

#play-button.animate #play-button-circle {
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1s ease-in-out 1.2s
}

#play-button.animate #play-button-triangle {
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1s ease-in-out 1.6s
}

#play-button-circle,#play-button-triangle {
    fill: none;
    stroke: #fff;
    stroke-width: 5;
    stroke-linejoin: round;
    stroke-miterlimit: 10;
    transition-delay: 1s
}

#play-button-circle {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    stroke-dashoffset: 340;
    stroke-dasharray: 340
}

#play-button-triangle {
    stroke-dashoffset: 180;
    stroke-dasharray: 180
}

.parallax-standard-scroll {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1
}

.wrapper {
    -webkit-transform: none;
    transform: none;
    transition: -webkit-transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01),-webkit-transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition-delay: 0s
}

.wrapper.nav-in {
    -webkit-transform: translateX(-200px);
    transform: translateX(-200px)
}

@-webkit-keyframes c {
    0% {
        -webkit-transform: translateY(100%) rotate(0deg);
        transform: translateY(100%) rotate(0deg)
    }

    30% {
        -webkit-transform: translateY(0) rotate(0deg);
        transform: translateY(0) rotate(0deg)
    }

    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg)
    }

    70% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    80% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg)
    }

    90% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

@keyframes c {
    0% {
        -webkit-transform: translateY(100%) rotate(0deg);
        transform: translateY(100%) rotate(0deg)
    }

    30% {
        -webkit-transform: translateY(0) rotate(0deg);
        transform: translateY(0) rotate(0deg)
    }

    50% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    60% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg)
    }

    70% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    80% {
        -webkit-transform: rotate(10deg);
        transform: rotate(10deg)
    }

    90% {
        -webkit-transform: rotate(-10deg);
        transform: rotate(-10deg)
    }

    to {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
}

.contact-form {
    width: 700px;
    margin: 0 auto;
    padding: 100px 0
}

@media only screen and (max-width: 1200px) {
    .contact-form {
        width:600px
    }
}

@media only screen and (max-width: 1023px) {
    .contact-form {
        width:500px
    }
}

@media only screen and (max-width: 767px) {
    .contact-form {
        width:100%;
        padding: 80px 30px;
        max-width: 500px
    }
}

.contact-form-title {
    margin-bottom: 20px
}

.contact-form-intro {
    margin-bottom: 30px
}

.contact-form .title {
    color: #b11f24;
    text-align: center
}

.contact-form .default-content-inner p a,.contact-form .text a,.default-content-inner .contact-form p a {
    color: currentColor;
    text-decoration: none;
    transition: color .2s
}

.contact-form .default-content-inner p a:hover,.contact-form .text a:hover,.default-content-inner .contact-form p a:hover {
    color: #b11f24
}

@media only screen and (max-width: 767px) {
    .contact-form .default-content-inner p br,.contact-form .text br,.default-content-inner .contact-form p br {
        display:none
    }
}

.contact-form-wrapper {
    position: relative
}

.contact-form form {
    opacity: 1;
    visibility: visible;
    transition: opacity .5s,visibility .5s
}

.contact-form form.hide {
    opacity: 0;
    visibility: hidden
}

.contact-form-input input,.contact-form-input select,.contact-form-input textarea {
    width: 100%;
    display: block;
    border: none;
    border-radius: 0;
    box-sizing: border-box;
    box-shadow: none;
    position: relative;
    -moz-appearance: none;
    appearance: none;
    -webkit-appearance: none;
    transition: border-color .2s;
    background-color: #f5f0ea;
    font: 300 normal 26px/1.3 Open Sans,Helvetica,Arial,sans-serif;
    padding: .4em .7em;
    margin-top: 10px
}

@media only screen and (max-width: 1200px) {
    .contact-form-input input,.contact-form-input select,.contact-form-input textarea {
        font-size:22px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .contact-form-input input,.contact-form-input select,.contact-form-input textarea {
        font-size:22px
    }
}

@media only screen and (max-width: 1023px) {
    .contact-form-input input,.contact-form-input select,.contact-form-input textarea {
        font-size:18px
    }
}

@media only screen and (max-width: 767px) {
    .contact-form-input input,.contact-form-input select,.contact-form-input textarea {
        font-size:16px
    }
}

.contact-form-input input:focus,.contact-form-input select:focus,.contact-form-input textarea:focus {
    outline: 0
}

.contact-form-input select {
    background: #f5f0ea url(assets/images/global/select-arrow.png) calc(100% - 16px) 50%/20px auto no-repeat
}

.contact-form-input select::-ms-expand {
    display: none
}

.contact-form-submit input {
    display: block;
    margin: 30px auto 0;
    background: #b11f24 url(../images/global/button-arrow-end.png) calc(100% - 10px) 50%/13px 10px no-repeat;
    padding-right: 30px!important;
    border: 0;
    border-radius: 10px;
    color: #fff
}

@media (-webkit-min-device-pixel-ratio: 2),(min-device-pixel-ratio:2),(min-resolution:192dpi) {
    .contact-form-submit input {
        background-image:url(assets/images/global/button-arrow-end@2x.png)
    }
}

.contact-form-submit input:hover {
    background-color: #9b1b20
}

.contact-form-submit input:focus {
    outline: 0
}

.contact-form textarea {
    height: 150px
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .contact-form textarea {
        height:100px
    }
}

@media only screen and (max-width: 767px) {
    .contact-form textarea {
        height:100px
    }
}

.contact-form-success {
    color: #b11f24;
    font-weight: 700;
    text-transform: uppercase;
    font: normal normal 30px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    margin: 0;
    text-align: center;
    visibility: hidden;
    transition: visibility 0s .5s;
    position: absolute;
    top: 30%;
    width: 100%
}

@media only screen and (max-width: 767px) {
    .contact-form-success {
        font-size:20px
    }
}

.contact-form-success.show {
    visibility: visible
}

.contact-form-success.show .contact-form-success-icon svg {
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-animation: c .8s forwards .5s;
    animation: c .8s forwards .5s
}

.contact-form-success.show .contact-form-success-text div {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .3s .6s;
    transition: transform .3s .6s;
    transition: transform .3s .6s,-webkit-transform .3s .6s
}

.contact-form-success svg {
    fill: #b11f24;
    width: 80px;
    display: block;
    margin: 0 auto 20px;
    -webkit-transform-origin: center bottom;
    transform-origin: center bottom
}

@media only screen and (max-width: 767px) {
    .contact-form-success svg {
        width:50px
    }
}

.contact-form-success path {
    fill: #b11f24!important
}

.contact-form-success-icon {
    overflow: hidden;
    padding-top: 20px
}

.contact-form-success-icon svg {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.contact-form-success-text {
    overflow: hidden
}

.contact-form-success-text div {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.ethos-hero {
    background: #f5f0ea
}

.ethos-hero .overflow-container {
    z-index: 4;
    position: relative
}

.ethos-hero .headline {
    color: #424242
}

.contact-form-submit .ethos-hero input,.ethos-hero .button,.ethos-hero .contact-form-submit input {
    background-color: #424242;
    color: #fff
}

.contact-form-submit .ethos-hero input:after,.ethos-hero .button:after,.ethos-hero .contact-form-submit input:after {
    background-color: #424242
}

.contact-form-submit .ethos-hero input:hover,.contact-form-submit .ethos-hero input:hover:after,.ethos-hero .button:hover,.ethos-hero .button:hover:after,.ethos-hero .contact-form-submit input:hover,.ethos-hero .contact-form-submit input:hover:after {
    background-color: #353535
}

.ethos-hero-items:after {
    content: "";
    z-index: 3;
    background: linear-gradient(0deg,#f5f0ea 0,hsla(33,35%,94%,.7))
}

@media only screen and (max-width: 767px) {
    .ethos-hero-items:after {
        background:hsla(33,35%,94%,.9)
    }
}

.ethos-hero-items.animate-in .ethos-hero-item {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition-timing-function: cubic-bezier(.24,.72,.35,1.01)
}

.ethos-hero-items.animate-out .ethos-hero-item {
    -webkit-transform: translateY(-200%);
    transform: translateY(-200%);
    transition-timing-function: ease
}

.ethos-hero-item {
    position: absolute;
    z-index: 1;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform,-webkit-transform;
    -webkit-transform: translateY(200%);
    transform: translateY(200%);
    transition-timing-function: ease-in-out
}

.ethos-hero-item.item1 {
    width: 30%;
    left: -2%;
    top: 3%;
    transition-duration: 2s;
    z-index: 1
}

@media only screen and (max-width: 767px) {
    .ethos-hero-item.item1 {
        width:60%
    }
}

.ethos-hero-item.item2 {
    width: 42%;
    left: -1%;
    top: 30%;
    transition-duration: 2.5s;
    z-index: 2
}

@media only screen and (max-width: 767px) {
    .ethos-hero-item.item2 {
        width:70%;
        bottom: 13%
    }
}

.ethos-hero-item.item3 {
    width: 29%;
    left: 7%;
    bottom: 5%;
    transition-duration: 1.6s;
    z-index: 2
}

@media only screen and (max-width: 767px) {
    .ethos-hero-item.item3 {
        width:45%
    }
}

.ethos-hero-item.item4 {
    width: 28%;
    left: 33%;
    top: 14%;
    transition-duration: 2.1s;
    z-index: 1
}

@media only screen and (max-width: 767px) {
    .ethos-hero-item.item4 {
        width:48%
    }
}

.ethos-hero-item.item5 {
    width: 45%;
    right: -5%;
    top: 5%;
    transition-duration: 1.7s;
    z-index: 1
}

.ethos-hero-item.item6 {
    width: 30%;
    right: 31%;
    bottom: 11%;
    transition-duration: 2.2s;
    z-index: 2
}

@media only screen and (max-width: 767px) {
    .ethos-hero-item.item6 {
        width:50%;
        bottom: 27%
    }
}

.ethos-hero-item.item7 {
    width: 26%;
    right: -8%;
    bottom: 14%;
    transition-duration: 1.5s;
    z-index: 1
}

@media only screen and (max-width: 767px) {
    .ethos-hero-item.item7 {
        width:50%
    }
}

.ethos-hero-item.item8 {
    width: 30%;
    right: 4%;
    bottom: 32%;
    transition-duration: 1.8s;
    z-index: 2
}

@media only screen and (max-width: 767px) {
    .ethos-hero-item.item8 {
        width:50%
    }
}

.video-overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    background: #000;
    left: 0;
    top: 0;
    z-index: 2000;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s,visibility .5s
}

.video-overlay.open {
    opacity: 1;
    visibility: visible
}

.video-overlay-inner {
    width: 80%;
    position: relative
}

.video-overlay-close {
    position: absolute;
    right: -50px;
    top: 0;
    width: 40px;
    height: 40px;
    background: transparent url(assets/images/global/line-texture-light.png) 0 0/5px auto repeat;
    cursor: pointer
}

@media only screen and (max-width: 767px) {
    .video-overlay-close {
        top:-50px;
        right: 0
    }
}

.video-overlay-close:after,.video-overlay-close:before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 25px;
    height: 3px;
    background-color: #fff
}

.video-overlay-close:before {
    -webkit-transform: translate(-50%,-50%) rotate(-45deg);
    transform: translate(-50%,-50%) rotate(-45deg)
}

.video-overlay-close:after {
    -webkit-transform: translate(-50%,-50%) rotate(45deg);
    transform: translate(-50%,-50%) rotate(45deg)
}

.contact-popup {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: 2000;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    transition: -webkit-transform 1s cubic-bezier(.24,.72,.35,1.01) .1s;
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01) .1s;
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01) .1s,-webkit-transform 1s cubic-bezier(.24,.72,.35,1.01) .1s
}

@media only screen and (max-width: 1023px) {
    .contact-popup {
        -ms-flex-direction:column;
        flex-direction: column
    }
}

.contact-popup.animate {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition-delay: .3s
}

@media only screen and (max-width: 1023px) {
    .contact-popup.animate {
        transition-delay:.5s
    }
}

.contact-popup.animate .left {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition-delay: .5s
}

.contact-popup.animate .close {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.7s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.7s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.7s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.7s
}

.contact-popup-section {
    width: 50%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative
}

@media only screen and (max-width: 1023px) {
    .contact-popup-section {
        width:100%;
        height: 50%
    }
}

.contact-popup-inner {
    width: 60%;
    height: 300px;
    text-align: left
}

@media only screen and (max-width: 1500px) {
    .contact-popup-inner {
        width:70%
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .contact-popup-inner {
        height:200px
    }
}

@media only screen and (max-width: 1023px) {
    .contact-popup-inner {
        height:auto
    }
}

@media only screen and (max-width: 767px) {
    .contact-popup-inner {
        width:80%
    }
}

.contact-popup .left {
    background-color: #f9f9f9;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    z-index: 1;
    transition: -webkit-transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01);
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01),-webkit-transform .8s cubic-bezier(.24,.72,.35,1.01)
}

@media only screen and (max-width: 1023px) {
    .contact-popup .left {
        -webkit-transform:translateX(0);
        transform: translateX(0)
    }
}

.contact-popup .right {
    background-color: #ececec;
    z-index: 2
}

.contact-popup-button-wrapper {
    position: absolute;
    right: 20px;
    top: 20px;
    width: 50px;
    height: 50px;
    z-index: 3;
    cursor: pointer;
    overflow: hidden
}

.contact-popup .close {
    transition-delay: 1s
}

.contact-popup-title {
    margin-bottom: 20px
}

.contact-popup .title {
    color: #424242
}

.contact-popup .default-content-inner p a,.contact-popup .text a,.default-content-inner .contact-popup p a {
    color: currentColor;
    text-decoration: none
}

.contact-popup .default-content-inner p a:hover,.contact-popup .text a:hover,.default-content-inner .contact-popup p a:hover {
    text-decoration: underline
}

.contact-popup.in-app .left {
    height: 40%
}

.contact-popup.in-app .right {
    height: 60%
}

.contact-popup.in-app .right .contact-popup-inner {
    -webkit-transform: translateY(-40%);
    transform: translateY(-40%)
}

@-webkit-keyframes d {
    0% {
        background-color: #decd8c
    }

    10% {
        background-color: #dbb78a
    }

    20% {
        background-color: #eb997d
    }

    30% {
        background-color: #c86f69
    }

    40% {
        background-color: #ad3029
    }

    50% {
        background-color: #873ab9
    }

    60% {
        background-color: #2c459a
    }

    70% {
        background-color: #4f93b5
    }

    80% {
        background-color: #70d5b8
    }

    90% {
        background-color: #c86f69
    }

    to {
        background-color: #decd8c
    }
}

@keyframes d {
    0% {
        background-color: #decd8c
    }

    10% {
        background-color: #dbb78a
    }

    20% {
        background-color: #eb997d
    }

    30% {
        background-color: #c86f69
    }

    40% {
        background-color: #ad3029
    }

    50% {
        background-color: #873ab9
    }

    60% {
        background-color: #2c459a
    }

    70% {
        background-color: #4f93b5
    }

    80% {
        background-color: #70d5b8
    }

    90% {
        background-color: #c86f69
    }

    to {
        background-color: #decd8c
    }
}

.landscape-popup {
    display: none;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: #000;
    z-index: 1999;
    background-position: 50%;
    background-size: auto 60%;
    background-repeat: no-repeat;
    background-image: url(assets/images/global/landscape-popup1.svg);
    -webkit-animation: d 2s infinite;
    animation: d 2s infinite
}

.landscape-popup.bg2 {
    background-image: url(assets/images/global/landscape-popup2.svg)
}

@media only screen and (max-width: 767px) and (orientation:landscape) {
    .landscape-popup {
        display:block
    }
}

.landscape-popup.in-app {
    background-size: auto 40%;
    background-position: center 35%
}

.home-hero-intro {
    background-color: #f5f0ea
}

.home-hero-intro .bg {
    background-image: url(assets/images/home/intro.jpg)
}

@media only screen and (max-width: 767px) {
    .home-hero-intro .bg {
        display:none
    }
}

.home-hero-intro .bg:after {
    content: none
}

.home-hero-intro .eg-logo svg {
    fill: #424242
}

@media only screen and (max-width: 1023px) {
    .home-hero-intro .eg-logo svg {
        width:60px
    }
}

.home-hero-wine .content {
    width: 50%;
    height: 100%;
    padding-top: 100px;
    padding-bottom: 100px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: start;
    align-items: flex-start;
    position: absolute;
    top: 0;
    z-index: 1
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .content {
        position:absolute;
        width: 100%;
        height: 35%;
        text-align: center;
        -ms-flex-align: center;
        align-items: center;
        bottom: 0;
        left: 0;
        top: auto;
        padding: 0
    }
}

.home-hero-wine .content.left {
    left: 0;
    padding-right: 15%;
    padding-left: 12%;
    margin-left: auto
}

@media only screen and (max-width: 1200px) {
    .home-hero-wine .content.left {
        padding-left:10%;
        padding-right: 10%
    }
}

@media only screen and (max-width: 1023px) {
    .home-hero-wine .content.left {
        padding-left:7%;
        padding-right: 7%
    }
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .content.left {
        padding-left:10%;
        padding-right: 10%
    }
}

.home-hero-wine .content.right {
    right: 0;
    padding-left: 11%
}

@media only screen and (max-width: 1500px) {
    .home-hero-wine .content.right {
        padding-left:12%
    }
}

@media only screen and (max-width: 1200px) {
    .home-hero-wine .content.right {
        padding-left:10%;
        padding-right: 10%
    }
}

@media only screen and (max-width: 1023px) {
    .home-hero-wine .content.right {
        padding-left:7%;
        padding-right: 7%
    }
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .content.right {
        padding-left:10%;
        padding-right: 10%
    }
}

@media only screen and (max-width: 480px) {
    .home-hero-wine .content.right {
        padding-left:20px;
        padding-right: 20px
    }
}

.home-hero-wine .content .subtitle2 {
    margin-bottom: 30px
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .content .overflow-container {
        display:inline-block
    }
}

.home-hero-wine .bg {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    transition-delay: 1s
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .bg {
        width:100%;
        height: 50%;
        position: relative
    }
}

@media only screen and (max-width: 480px) {
    .home-hero-wine .bg {
        height:45%
    }
}

.home-hero-wine .bg.left {
    left: 0;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-transform-origin: right center;
    transform-origin: right center
}

.home-hero-wine .bg.right {
    right: 0;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transform-origin: left center;
    transform-origin: left center
}

.home-hero-wine .bg.animate {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: -webkit-transform .7s;
    transition: transform .7s;
    transition: transform .7s,-webkit-transform .7s;
    transition-delay: .3s
}

.home-hero-wine .can {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 800px auto;
    background-attachment: fixed
}

@media only screen and (max-width: 1500px) {
    .home-hero-wine .can {
        background-size:700px auto
    }
}

@media only screen and (max-width: 1200px) {
    .home-hero-wine .can {
        background-attachment:scroll
    }
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .can {
        width:100%;
        height: 75%;
        background-size: auto 100%;
        background-position: center top 0
    }
}

.home-hero-wine .can.left {
    left: 0
}

@media only screen and (max-width: 1200px) {
    .home-hero-wine .can.left {
        left:-25%
    }
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .can.left {
        left:0
    }
}

.home-hero-wine .can.right {
    right: 0
}

@media only screen and (max-width: 1200px) {
    .home-hero-wine .can.right {
        right:-25%
    }
}

@media only screen and (max-width: 767px) {
    .home-hero-wine .can.right {
        right:0
    }
}

.home .black-tea {
    background-color: #00b4b1
}

.home .black-tea .bg {
    background-image: url(assets/images/home/bg-black-tea.jpg)
}

.home .black-tea .can {
    background-image: url(assets/images/home/can-black-tea.png)
}

.home .black-tea .wine-title {
    color: #f9e093
}

.home .black-tea .wine-subtitle2 {
    color: #00908e
}

.contact-form-submit .home .black-tea input,.home .black-tea .button,.home .black-tea .contact-form-submit input {
    background-color: #00908e;
    color: #fff
}

.contact-form-submit .home .black-tea input:after,.home .black-tea .button:after,.home .black-tea .contact-form-submit input:after {
    background-color: #00908e
}

.contact-form-submit .home .black-tea input:hover,.contact-form-submit .home .black-tea input:hover:after,.home .black-tea .button:hover,.home .black-tea .button:hover:after,.home .black-tea .contact-form-submit input:hover,.home .black-tea .contact-form-submit input:hover:after {
    background-color: #007775
}

.home .green-tea {
    background-color: #b11f24
}

.home .green-tea .bg {
    background-image: url(assets/images/home/bg-red-wine.jpg)
}

.home .green-tea .can {
    background-image: url(assets/images/home/can-red-wine.png)
}

.home .green-tea .wine-title {
    color: #9cd5c4
}

.home .green-tea .wine-subtitle2 {
    color: #7d1619
}

.contact-form-submit .home .green-tea input,.home .green-tea .button,.home .green-tea .contact-form-submit input {
    background-color: #7d1619;
    color: #fff
}

.contact-form-submit .home .green-tea input:after,.home .green-tea .button:after,.home .green-tea .contact-form-submit input:after {
    background-color: #7d1619
}

.contact-form-submit .home .green-tea input:hover,.contact-form-submit .home .green-tea input:hover:after,.home .green-tea .button:hover,.home .green-tea .button:hover:after,.home .green-tea .contact-form-submit input:hover,.home .green-tea .contact-form-submit input:hover:after {
    background-color: #671215
}

.home .herbal-tea {
    background-color: #243f93
}

.home .herbal-tea .bg {
    background-image: url(assets/images/home/bg-rose.jpg)
}

.home .herbal-tea .can {
    background-image: url(assets/images/home/can-rose.png)
}

.home .herbal-tea .wine-title {
    color: #f3896f
}

.home .herbal-tea .wine-subtitle2 {
    color: #162559
}

.contact-form-submit .home .herbal-tea input,.home .herbal-tea .button,.home .herbal-tea .contact-form-submit input {
    background-color: #162559;
    color: #fff
}

.contact-form-submit .home .herbal-tea input:after,.home .herbal-tea .button:after,.home .herbal-tea .contact-form-submit input:after {
    background-color: #162559
}

.contact-form-submit .home .herbal-tea input:hover,.contact-form-submit .home .herbal-tea input:hover:after,.home .herbal-tea .button:hover,.home .herbal-tea .button:hover:after,.home .herbal-tea .contact-form-submit input:hover,.home .herbal-tea .contact-form-submit input:hover:after {
    background-color: #111d44
}

.home ..gift-tea {
    background-color: #74a345
}

.home ..gift-tea .bg {
    background-image: url(assets/images/home/bg-.gift-tea.jpg)
}

.home ..gift-tea .can {
    background-image: url(assets/images/home/can-.gift-tea.png)
}

.home ..gift-tea .wine-title {
    color: #c2e8fb
}

.home ..gift-tea .wine-subtitle2 {
    color: #537431
}

.contact-form-submit .home ..gift-tea input,.home ..gift-tea .button,.home ..gift-tea .contact-form-submit input {
    background-color: #5d8237;
    color: #fff
}

.contact-form-submit .home ..gift-tea input:after,.home ..gift-tea .button:after,.home ..gift-tea .contact-form-submit input:after {
    background-color: #5d8237
}

.contact-form-submit .home ..gift-tea input:hover,.contact-form-submit .home ..gift-tea input:hover:after,.home ..gift-tea .button:hover,.home ..gift-tea .button:hover:after,.home ..gift-tea .contact-form-submit input:hover,.home ..gift-tea .contact-form-submit input:hover:after {
    background-color: #50702f
}

.home .bubbles {
    background-color: #1d1e1e
}

.home .bubbles .bg {
    background-image: url(assets/images/home/bg-bubbles.jpg)
}

.home .bubbles .can {
    background-image: url(assets/images/home/can-bubbles.png)
}

.home .bubbles .wine-title {
    color: #e1d169
}

.home .bubbles .wine-title .overflow-container:first-child .overflow-inner {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(transparent,transparent),linear-gradient(180deg,#f3a083 0,#edbd76);
    background-repeat: repeat,repeat;
    background-size: cover,cover;
    -webkit-background-clip: text
}

.home .bubbles .wine-title .overflow-container:nth-child(2) .overflow-inner {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(transparent,transparent),linear-gradient(180deg,#e8cd68 0,#ccd277);
    background-repeat: repeat,repeat;
    background-size: cover,cover;
    -webkit-background-clip: text
}

.home .bubbles .wine-title .overflow-container:nth-child(3) .overflow-inner {
    -webkit-text-fill-color: transparent;
    background: linear-gradient(transparent,transparent),linear-gradient(180deg,#b9d382 0,#9dd29e);
    background-repeat: repeat,repeat;
    background-size: cover,cover;
    -webkit-background-clip: text
}

.home .bubbles .wine-subtitle2 {
    color: #61897f;
    -webkit-text-fill-color: transparent;
    background: linear-gradient(transparent,transparent),linear-gradient(180deg,#63897b 0,#5f8983);
    background-repeat: repeat,repeat;
    background-size: cover,cover;
    -webkit-background-clip: text
}

.contact-form-submit .home .bubbles input,.home .bubbles .button,.home .bubbles .contact-form-submit input {
    background-color: #366660;
    color: #fff
}

.contact-form-submit .home .bubbles input:after,.home .bubbles .button:after,.home .bubbles .contact-form-submit input:after {
    background-color: #366660
}

.contact-form-submit .home .bubbles input:hover,.contact-form-submit .home .bubbles input:hover:after,.home .bubbles .button:hover,.home .bubbles .button:hover:after,.home .bubbles .contact-form-submit input:hover,.home .bubbles .contact-form-submit input:hover:after {
    background-color: #2d5550
}

#intro-cans {
    width: 160px
}

@media only screen and (max-width: 1023px) {
    #intro-cans {
        width:100px
    }
}

#intro-cans.animate #intro-can-red-wine,#intro-cans.animate #intro-can-rose {
    -webkit-transform: translateX(0) scale(1);
    transform: translateX(0) scale(1);
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s
}

#intro-can-red-wine {
    -webkit-transform: translateX(110px);
    transform: translateX(110px);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    transition-delay: 1s
}

#intro-can-rose {
    -webkit-transform: translateX(-110px);
    transform: translateX(-110px);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    transition-delay: 1s
}

#wines {
    z-index: 1
}

#wines.show {
    z-index: 100
}

.wines {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
    z-index: 3;
    transition: -webkit-transform 1s ease;
    transition: transform 1s ease;
    transition: transform 1s ease,-webkit-transform 1s ease
}

.wines.animate {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.wines.animate-up-easing {
    transition-timing-function: cubic-bezier(0,0,.36,.99)
}

.wines.animate-up {
    -webkit-transform: translateY(-50vh);
    transform: translateY(-50vh);
    transition-timing-function: cubic-bezier(.5,0,.6,1)
}

.wines .hero-arrow {
    -webkit-transform: translateX(-50%) translateY(-100%);
    transform: translateX(-50%) translateY(-100%);
    top: 0;
    left: 100%
}

@media only screen and (max-width: 767px) {
    .wines .hero-arrow {
        left:200%
    }
}

.wines .hero-arrow.animate {
    -webkit-transform: translateX(-50%) translateY(-100%) rotateX(-90deg);
    transform: translateX(-50%) translateY(-100%) rotateX(-90deg)
}

.wines-section {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    overflow: hidden
}

.wines-hero-main {
    background: transparent url(assets/images/wines/hero.jpg) 50%/cover no-repeat
}

.wines-hero-wine {
    overflow: visible;
    height: 100%
}

.wines-hero-wine .left,.wines-hero-wine .right {
    transition: background-position 5s ease,-webkit-transform 1s ease;
    transition: transform 1s ease,background-position 5s ease;
    transition: transform 1s ease,background-position 5s ease,-webkit-transform 1s ease
}

@media only screen and (min-width: 768px) {
    .wines-hero-wine .down {
        -webkit-transform:translateY(100%);
        transform: translateY(100%)
    }

    .wines-hero-wine .up {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .down-s {
        -webkit-transform:translateY(100%);
        transform: translateY(100%)
    }

    .wines-hero-wine .up-s {
        -webkit-transform: translateY(-100%);
        transform: translateY(-100%)
    }
}

.wines-hero-wine .content {
    width: 50%;
    height: 100%;
    padding: 100px 9vw;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 0;
    z-index: 4;
    overflow: hidden
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .content {
        width:100%;
        position: relative;
        -ms-flex-pack: end;
        justify-content: flex-end;
        padding: 0 60px 40px
    }
}

@media only screen and (max-width: 480px) {
    .wines-hero-wine .content {
        padding:0 40px 40px
    }
}

.wines-hero-wine .content.left {
    left: 0
}

.wines-hero-wine .content.right {
    right: 0
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .content.right {
        -ms-flex-align:end;
        align-items: flex-end
    }
}

.wines-hero-wine .content-breaker {
    position: relative;
    margin-bottom: 15px
}

@media only screen and (max-width: 340px) {
    .wines-hero-wine .content-breaker {
        margin-bottom:5px
    }
}

.wines-hero-wine .content-breaker-inner {
    padding-bottom: 22px
}

.wines-hero-wine .content-breaker-inner:after {
    content: "";
    position: absolute;
    background: transparent url(assets/images/global/line-texture-breaker.png) 0 100%/7px auto repeat-x;
    display: block;
    width: 70%;
    height: 7px;
    left: 0;
    bottom: 0
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .content-breaker-inner:after {
        width:100%
    }
}

.contact-form-submit .wines-hero-wine .content input,.wines-hero-wine .content .button,.wines-hero-wine .content .contact-form-submit input {
    margin: 40px 0 10px
}

@media only screen and (max-width: 767px) {
    .contact-form-submit .wines-hero-wine .content input,.wines-hero-wine .content .button,.wines-hero-wine .content .contact-form-submit input {
        margin:20px 0 0
    }
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .content>div {
        width:250px
    }
}

@media only screen and (max-width: 480px) {
    .wines-hero-wine .content>div {
        width:200px
    }
}

.wines-hero-wine .content:after,.wines-hero-wine .content:before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 100%;
    height: 200%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    z-index: -1;
    background-color: transparent;
    background-position: 50%;
    background-size: 120% auto;
    background-repeat: repeat
}

.wines-hero-wine .content:before {
    transition-duration: 2s
}

.wines-hero-wine .content:after {
    transition-duration: 2.5s
}

.wines-hero-wine .content.down:after,.wines-hero-wine .content.down:before {
    -webkit-transform: translateY(-25%);
    transform: translateY(-25%)
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .content.down-s:after,.wines-hero-wine .content.down-s:before {
        -webkit-transform:translateY(-25%)!important;
        transform: translateY(-25%)!important
    }
}

.wines-hero-wine .content.last-down:after,.wines-hero-wine .content.last-down:before,.wines-hero-wine .content.up:after,.wines-hero-wine .content.up:before {
    -webkit-transform: translateY(-75%);
    transform: translateY(-75%)
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .content.up-s:after,.wines-hero-wine .content.up-s:before {
        -webkit-transform:translateY(-75%);
        transform: translateY(-75%)
    }
}

.wines-hero-wine .bg {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    width: 50%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 4
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .bg {
        background:none!important;
        width: 25%;
        z-index: 5
    }
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .bg:after {
        content:none
    }
}

.wines-hero-wine .bg.left {
    left: 0
}

.wines-hero-wine .bg.right {
    right: 0
}

.wines-hero-wine .can {
    width: 150%;
    height: 100%;
    position: absolute;
    top: 0;
    z-index: 1;
    background-size: 1000px auto;
    background-position: 50%;
    background-repeat: no-repeat;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    transition-delay: 1s
}

@media only screen and (max-width: 1500px) {
    .wines-hero-wine .can {
        background-size:900px auto
    }
}

@media only screen and (max-width: 1200px) {
    .wines-hero-wine .can {
        background-size:800px auto
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .wines-hero-wine .can {
        background-size:800px auto
    }
}

@media only screen and (max-width: 1023px) {
    .wines-hero-wine .can {
        background-size:600px auto
    }
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .can {
        background-size:100% auto;
        width: 700px;
        top: -100px
    }
}

@media only screen and (max-width: 480px) {
    .wines-hero-wine .can {
        top:-100px;
        width: 520px
    }
}

@media only screen and (max-width: 340px) {
    .wines-hero-wine .can {
        background-size:70% auto
    }
}

.wines-hero-wine .can.left {
    -webkit-transform: translateX(-100%) rotate(-35deg);
    transform: translateX(-100%) rotate(-35deg);
    left: -25%
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .can.left {
        left:-300px
    }
}

@media only screen and (max-width: 480px) {
    .wines-hero-wine .can.left {
        left:-220px
    }
}

@media only screen and (max-width: 340px) {
    .wines-hero-wine .can.left {
        left:-250px
    }
}

.wines-hero-wine .can.right {
    -webkit-transform: translateX(100%) rotate(35deg);
    transform: translateX(100%) rotate(35deg);
    right: -25%
}

@media only screen and (max-width: 767px) {
    .wines-hero-wine .can.right {
        right:-300px
    }
}

@media only screen and (max-width: 480px) {
    .wines-hero-wine .can.right {
        right:-220px
    }
}

@media only screen and (max-width: 340px) {
    .wines-hero-wine .can.right {
        right:-240px
    }
}

.wines-hero-wine .can.animate {
    transition: -webkit-transform 1s cubic-bezier(.24,.72,.35,1.01);
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01);
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01),-webkit-transform 1s cubic-bezier(.24,.72,.35,1.01);
    transition-delay: .5s
}

.wines-hero-wine .can.animate.left {
    -webkit-transform: translateX(0) rotate(35deg);
    transform: translateX(0) rotate(35deg)
}

.wines-hero-wine .can.animate.right {
    -webkit-transform: translateX(0) rotate(-35deg);
    transform: translateX(0) rotate(-35deg)
}

.wines-hero-wine.black-tea .bg {
    background-image: url(assets/images/wines/black-tea-bg.jpg)
}

.wines-hero-wine.black-tea .content {
    background-color: #00b4b1
}

.wines-hero-wine.black-tea .content:before {
    background-image: url(assets/images/wines/black-tea-pattern1.png)
}

.wines-hero-wine.black-tea .content:after {
    background-image: url(assets/images/wines/black-tea-pattern2.png)
}

.wines-hero-wine.black-tea .can {
    background-image: url(assets/images/home/can-black-tea.png)
}

.wines-hero-wine.black-tea .title {
    color: #f9e093
}

.wines-hero-wine.black-tea .wines-ml {
    color: #00908e
}

.wines-hero-wine.green-tea .bg {
    background-image: url(assets/images/wines/red-wine-bg.jpg)
}

.wines-hero-wine.green-tea .content {
    background-color: #b11f24
}

.wines-hero-wine.green-tea .content:before {
    background-image: url(assets/images/wines/red-wine-pattern1.png)
}

.wines-hero-wine.green-tea .content:after {
    background-image: url(assets/images/wines/red-wine-pattern2.png)
}

.wines-hero-wine.green-tea .can {
    background-image: url(assets/images/home/can-red-wine.png)
}

.wines-hero-wine.green-tea .title {
    color: #9cd5c4
}

.wines-hero-wine.green-tea .wines-ml {
    color: #7d1619
}

.wines-hero-wine.herbal-tea .bg {
    background-image: url(assets/images/wines/rose-bg.jpg)
}

.wines-hero-wine.herbal-tea .content {
    background-color: #243f93
}

.wines-hero-wine.herbal-tea .content:before {
    background-image: url(assets/images/wines/rose-pattern1.png)
}

.wines-hero-wine.herbal-tea .content:after {
    background-image: url(assets/images/wines/rose-pattern2.png)
}

.wines-hero-wine.herbal-tea .can {
    background-image: url(assets/images/home/can-rose.png)
}

.wines-hero-wine.herbal-tea .title {
    color: #f3896f
}

.wines-hero-wine.herbal-tea .wines-ml {
    color: #162559
}

.wines-hero-wine..gift-tea .bg {
    background-image: url(assets/images/wines/.gift-tea-bg.jpg)
}

.wines-hero-wine..gift-tea .content {
    background-color: #74a345
}

.wines-hero-wine..gift-tea .content:before {
    background-image: url(assets/images/wines/.gift-tea-pattern1.png)
}

.wines-hero-wine..gift-tea .content:after {
    background-image: url(assets/images/wines/.gift-tea-pattern2.png)
}

.wines-hero-wine..gift-tea .can {
    background-image: url(assets/images/home/can-.gift-tea.png)
}

.wines-hero-wine..gift-tea .title {
    color: #c2e8fb
}

.wines-hero-wine..gift-tea .wines-ml {
    color: #537431
}

.wines-hero-wine.bubbles .bg {
    background-image: url(assets/images/wines/bubbles-bg.jpg)
}

.wines-hero-wine.bubbles .bg:after {
    display: none
}

.wines-hero-wine.bubbles .content {
    background-color: #1d1e1e
}

.wines-hero-wine.bubbles .content:before {
    background-image: url(assets/images/wines/bubbles-pattern1.png)
}

.wines-hero-wine.bubbles .content:after {
    background-image: url(assets/images/wines/bubbles-pattern2.png)
}

.wines-hero-wine.bubbles .can {
    background-image: url(assets/images/home/can-bubbles.png)
}

.wines-hero-wine.bubbles .content .overflow-container:first-child .overflow-inner .wines-ml,.wines-hero-wine.bubbles .content .overflow-container:first-child .overflow-inner .wines-name {
    color: #eeb978
}

.wines-hero-wine.bubbles .content .overflow-container:first-child .overflow-inner:after {
    background-image: url(assets/images/wines/breaker-bubbles1.png)
}

.wines-hero-wine.bubbles .content .overflow-container:nth-child(2) .overflow-inner .title {
    color: #e5d065
}

.default-content-inner .wines-hero-wine.bubbles .content .overflow-container:nth-child(2) .overflow-inner h2,.wines-hero-wine.bubbles .content .overflow-container:nth-child(2) .overflow-inner .default-content-inner h2,.wines-hero-wine.bubbles .content .overflow-container:nth-child(2) .overflow-inner .subtitle,.wines-hero-wine.bubbles .content .overflow-container:nth-child(2) .overflow-inner .wines-name {
    color: #d0d275
}

.wines-hero-wine.bubbles .content .overflow-container:nth-child(2) .overflow-inner:after {
    background-image: url(assets/images/wines/breaker-bubbles2.png)
}

.default-content-inner .wines-hero-wine.bubbles .content .overflow-container:nth-child(3) .overflow-inner>div h2,.wines-hero-wine.bubbles .content .overflow-container:nth-child(3) .overflow-inner>div .default-content-inner h2,.wines-hero-wine.bubbles .content .overflow-container:nth-child(3) .overflow-inner>div .subtitle,.wines-hero-wine.bubbles .content .overflow-container:nth-child(3) .overflow-inner>div .title,.wines-hero-wine.bubbles .content .overflow-container:nth-child(3) .overflow-inner>div .wines-name {
    color: #b0d387
}

.wines-title {
    display: -ms-flexbox;
    display: flex;
    margin: 0;
    padding: 0
}

.wines-ml {
    text-transform: uppercase;
    font: normal normal 42px/1.1 Heavitas,Arial Black,Helvetica,sans-serif;
    line-height: .9;
    margin-right: 10px
}

.wines-ml-number {
    display: block;
    font-size: 47px
}

@media only screen and (max-width: 1200px) {
    .wines-ml-number {
        font-size:38px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .wines-ml-number {
        font-size:33px
    }
}

@media only screen and (max-width: 1023px) {
    .wines-ml-number {
        font-size:33px;
        margin-top: 1px
    }
}

@media only screen and (max-width: 767px) {
    .wines-ml-number {
        font-size:26px
    }
}

@media only screen and (max-width: 480px) {
    .wines-ml-number {
        font-size:24px
    }
}

.wines-ml-unit {
    display: block;
    font-size: 25px
}

@media only screen and (max-width: 1200px) {
    .wines-ml-unit {
        font-size:20px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .wines-ml-unit {
        font-size:17px
    }
}

@media only screen and (max-width: 1023px) {
    .wines-ml-unit {
        font-size:17px
    }
}

@media only screen and (max-width: 767px) {
    .wines-ml-unit {
        font-size:14px
    }
}

@media only screen and (max-width: 480px) {
    .wines-ml-unit {
        font-size:12px
    }
}

.wines.static {
    position: absolute;
    -webkit-transform: translateY(100vh);
    transform: translateY(100vh)
}

.wines.static .wines-section {
    position: static
}

.wines.static .wines-hero-wine .bg,.wines.static .wines-hero-wine .content {
    -webkit-transform: none;
    transform: none
}

.ethos-hero-main {
    background: #000 url(assets/images/ethos/hero.jpg) 50%/cover no-repeat;
    z-index: 0!important
}

.ethos-hero-main .headline {
    height: 3.2em
}

.ethos-hero-intro {
    background: #f5f0ea
}

.default-content-inner .ethos-hero-intro h2,.ethos-hero-intro .default-content-inner h2,.ethos-hero-intro .subtitle,.ethos-hero-intro .wines-name {
    color: #b11f24
}

.ethos-video {
    height: 50%;
    width: 100%;
    position: relative;
    overflow: hidden
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .ethos-video {
        height:40%
    }
}

@media only screen and (max-width: 1023px) {
    .ethos-video {
        height:auto
    }
}

.ethos-video.animate-in video {
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%)
}

@media only screen and (max-width: 1023px) {
    .ethos-video.animate-in video {
        -webkit-transform:translate(0);
        transform: translate(0)
    }
}

.ethos-video.animate-out video {
    -webkit-transform: translate(-50%,-20%);
    transform: translate(-50%,-20%)
}

@media only screen and (max-width: 1023px) {
    .ethos-video.animate-out video {
        -webkit-transform:translate(0);
        transform: translate(0)
    }
}

.ethos-video video {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-80%);
    transform: translate(-50%,-80%);
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s,-webkit-transform 1s;
    width: 100%;
    min-height: 100%
}

@media only screen and (max-width: 1023px) {
    .ethos-video video {
        -webkit-transform:translate(0);
        transform: translate(0);
        transition-duration: 0s;
        position: static;
        min-height: 0;
        width: 100%
    }
}

@media only screen and (max-width: 1023px) {
    .ethos-video video.desktop {
        display:none
    }
}

.ethos-video video.mobile {
    display: none
}

@media only screen and (max-width: 1023px) {
    .ethos-video video.mobile {
        display:block
    }
}

.ethos-values {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    background: #f5f0ea;
    height: 50%;
    width: 100%;
    -ms-flex-positive: 1;
    flex-grow: 1
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .ethos-values {
        height:60%
    }
}

.ethos-values-wrapper {
    height: 100%;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-align: center;
    align-items: center
}

.ethos-values-inner,.ethos-values-wrapper {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center
}

.ethos-values-inner {
    padding: 40px;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    max-width: 1800px
}

.ethos-values-item {
    width: 33.33333%;
    text-align: center;
    padding: 30px 4%;
    border-right: 2px solid #e0dbd6
}

@media only screen and (max-width: 1200px) {
    .ethos-values-item {
        padding:40px 2% 30px
    }
}

@media only screen and (max-width: 1023px) {
    .ethos-values-item {
        width:100%;
        padding: 40px 2% 60px;
        border-right: 0;
        border-bottom: none;
        max-width: 500px
    }
}

@media only screen and (max-width: 480px) {
    .ethos-values-item {
        padding:0
    }
}

.ethos-values-item:last-child {
    border-right: 0;
    border-bottom: 0
}

@media only screen and (max-width: 1023px) {
    .ethos-values-item-hide-s {
        display:none
    }
}

.ethos-values-icon {
    margin-bottom: 30px
}

@media only screen and (max-width: 1500px) {
    .ethos-values-icon {
        margin-bottom:15px
    }
}

@media only screen and (max-width: 1023px) {
    .ethos-values-icon {
        margin-bottom:30px
    }
}

@media only screen and (max-width: 767px) {
    .ethos-values-icon {
        margin-bottom:20px
    }
}

.ethos-values-icon svg {
    width: auto;
    height: 100px
}

@media only screen and (max-width: 1500px) {
    .ethos-values-icon svg {
        height:80px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .ethos-values-icon svg {
        height:80px
    }
}

.ethos-values-icon path {
    fill: #b11f24
}

.ethos-values-title {
    margin-bottom: 20px
}

@media only screen and (max-width: 1500px) {
    .ethos-values-title {
        margin-bottom:15px
    }
}

@media only screen and (max-width: 1023px) {
    .ethos-values-title {
        margin-bottom:20px
    }
}

@media only screen and (max-width: 767px) {
    .ethos-values-title {
        margin-bottom:15px
    }
}

@media only screen and (max-width: 1023px) {
    .ethos-values-title br {
        display:none
    }
}

@media only screen and (max-width: 480px) {
    .ethos-values-title br {
        display:inline
    }
}

.default-content-inner .ethos-values h2,.ethos-values .default-content-inner h2,.ethos-values .subtitle,.ethos-values .wines-name {
    color: #b11f24
}

@media only screen and (max-width: 1500px) {
    .default-content-inner .ethos-values h2,.ethos-values .default-content-inner h2,.ethos-values .subtitle,.ethos-values .wines-name {
        font-size:26px
    }
}

@media only screen and (max-width: 1023px) {
    .default-content-inner .ethos-values h2,.ethos-values .default-content-inner h2,.ethos-values .subtitle,.ethos-values .wines-name {
        font-size:30px
    }
}

@media only screen and (max-width: 767px) {
    .default-content-inner .ethos-values h2,.ethos-values .default-content-inner h2,.ethos-values .subtitle,.ethos-values .wines-name {
        font-size:26px
    }
}

.ethos-statement {
    background: #e8e3de;
    height: 50%;
    text-align: center;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .ethos-statement {
        height:60%
    }
}

@media only screen and (max-width: 767px) {
    .ethos-statement {
        height:70%
    }
}

.ethos-statement-inner {
    max-width: 1200px;
    padding: 40px 100px
}

@media only screen and (max-width: 767px) {
    .ethos-statement-inner {
        padding:40px 60px
    }
}

@media only screen and (max-width: 480px) {
    .ethos-statement-inner {
        padding:0 30px 40px
    }
}

.ethos-statement-title {
    margin-bottom: 20px
}

@media only screen and (max-width: 767px) {
    .ethos-statement-title {
        margin-bottom:10px;
        text-align: left
    }
}

.ethos-statement .title {
    color: #424242
}

@media only screen and (max-width: 1500px) {
    .ethos-statement .title {
        font-size:50px
    }
}

@media only screen and (max-width: 1200px) {
    .ethos-statement .title {
        font-size:40px
    }
}

@media only screen and (max-width: 1023px) {
    .ethos-statement .title {
        font-size:30px
    }
}

@media only screen and (max-width: 767px) {
    .ethos-statement .title {
        font-size:25px
    }
}

@media only screen and (max-width: 767px) {
    .default-content-inner .ethos-statement p,.ethos-statement .default-content-inner p,.ethos-statement .text {
        font-size:13px
    }
}

@media only screen and (max-width: 767px) {
    .default-content-inner .ethos-statement p.full,.ethos-statement .default-content-inner p.full,.ethos-statement .text.full {
        display:none
    }
}

.default-content-inner .ethos-statement p.shortened,.ethos-statement .default-content-inner p.shortened,.ethos-statement .text.shortened {
    display: none;
    text-align: left
}

@media only screen and (max-width: 767px) {
    .default-content-inner .ethos-statement p.shortened,.ethos-statement .default-content-inner p.shortened,.ethos-statement .text.shortened {
        display:block
    }
}

.ethos-contact {
    background: #fff
}

.ethos-text {
    font-size: 16px
}

#ethos~.ethos-values-s-only {
    display: none
}

@-webkit-keyframes e {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes e {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@-webkit-keyframes f {
    0% {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px)
    }

    50% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }

    to {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

@keyframes f {
    0% {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px)
    }

    50% {
        -webkit-transform: translateY(10px);
        transform: translateY(10px)
    }

    to {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px)
    }
}

@-webkit-keyframes g {
    0% {
        -webkit-transform: translateX(-55px);
        transform: translateX(-55px)
    }

    to {
        -webkit-transform: translateX(55px);
        transform: translateX(55px)
    }
}

@keyframes g {
    0% {
        -webkit-transform: translateX(-55px);
        transform: translateX(-55px)
    }

    to {
        -webkit-transform: translateX(55px);
        transform: translateX(55px)
    }
}

#screw-corks {
    transition: background-color 1s
}

#screw-corks .first-section {
    background-color: #b11f24;
    transition: background-color 0s 0s
}

#screw-corks .first-section.animate {
    background-color: transparent;
    transition: background-color 0s 1s
}

.screw-corks {
    transition: background-color 1s
}

.screw-corks-hero-main {
    background: #000 url(assets/images/screw-corks/hero.jpg) 50%/cover no-repeat;
    z-index: 0!important
}

.screw-corks-hero-main-icon {
    margin-bottom: 30px
}

.screw-corks-hero-main-icon svg {
    fill: #fff
}

.contact-form-submit .screw-corks-hero-main input,.screw-corks-hero-main .button,.screw-corks-hero-main .contact-form-submit input {
    background-color: #fff;
    color: #424242
}

.contact-form-submit .screw-corks-hero-main input:after,.screw-corks-hero-main .button:after,.screw-corks-hero-main .contact-form-submit input:after {
    background-color: #fff
}

.contact-form-submit .screw-corks-hero-main input:hover,.contact-form-submit .screw-corks-hero-main input:hover:after,.screw-corks-hero-main .button:hover,.screw-corks-hero-main .button:hover:after,.screw-corks-hero-main .contact-form-submit input:hover,.screw-corks-hero-main .contact-form-submit input:hover:after {
    background-color: #f2f2f2
}

.screw-corks-hero-main.hide {
    visibility: hidden
}

.default-content-inner .screw-corks-hero p,.screw-corks-hero .default-content-inner p,.screw-corks-hero .headline,.screw-corks-hero .text {
    color: #fff
}

.screw-corks-hero-arrow {
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 50px;
    height: 50px;
    background: transparent url(assets/images/screw-corks/hero-arrow.png) center 50%/10px auto no-repeat;
    opacity: 0;
    visibility: hidden;
    transition: background-position .3s cubic-bezier(.24,.72,.35,1.01),opacity .3s,visibility .3s,-webkit-transform .5s;
    transition: background-position .3s cubic-bezier(.24,.72,.35,1.01),opacity .3s,visibility .3s,transform .5s;
    transition: background-position .3s cubic-bezier(.24,.72,.35,1.01),opacity .3s,visibility .3s,transform .5s,-webkit-transform .5s;
    -webkit-transform: translate(-50%,100%);
    transform: translate(-50%,100%);
    z-index: 1
}

.screw-corks-hero-arrow:hover {
    background-position: center 70%;
    cursor: pointer
}

.screw-corks-hero-arrow.show {
    opacity: 1;
    visibility: visible;
    -webkit-transform: translate(-50%);
    transform: translate(-50%)
}

.screw-corks-icon {
    margin-bottom: 30px
}

.screw-corks-icon-svg path {
    fill: #fff
}

.screw-corks-headline {
    margin-bottom: 1em
}

#screw-corks-recycle {
    width: 250px
}

#recycle-arrows {
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-animation: e 3s linear infinite;
    animation: e 3s linear infinite
}

#recycle-can,#recycle-can-shape {
    -webkit-animation: f 3s ease-in-out infinite;
    animation: f 3s ease-in-out infinite
}

#recycle-can-lines,#recycle-can-logo {
    -webkit-animation: g 2s linear infinite;
    animation: g 2s linear infinite
}

#screw-corks-pack {
    width: 200px
}

#screw-corks-pack.animate #pack-moon {
    -webkit-transform: translate(0);
    transform: translate(0);
    transition: -webkit-transform 1s cubic-bezier(.24,.72,.35,1.01) 1s;
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01) 1s;
    transition: transform 1s cubic-bezier(.24,.72,.35,1.01) 1s,-webkit-transform 1s cubic-bezier(.24,.72,.35,1.01) 1s
}

#screw-corks-pack.animate #pack-can {
    -webkit-transform: translate(0);
    transform: translate(0);
    transition: -webkit-transform .8s cubic-bezier(.24,.72,.35,1.01) .8s;
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01) .8s;
    transition: transform .8s cubic-bezier(.24,.72,.35,1.01) .8s,-webkit-transform .8s cubic-bezier(.24,.72,.35,1.01) .8s
}

#pack-moon {
    -webkit-transform: translateY(25px);
    transform: translateY(25px);
    transition-delay: 1s
}

#pack-can {
    -webkit-transform: translateX(-25px);
    transform: translateX(-25px);
    transition-delay: 1.1s
}

#screw-corks-break {
    width: 250px
}

#screw-corks-break.animate #break-can {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .5s cubic-bezier(.6,.03,1,.57) 1.4s;
    transition: transform .5s cubic-bezier(.6,.03,1,.57) 1.4s;
    transition: transform .5s cubic-bezier(.6,.03,1,.57) 1.4s,-webkit-transform .5s cubic-bezier(.6,.03,1,.57) 1.4s
}

#screw-corks-break.animate #break-bottle {
    opacity: 0;
    transition: opacity 0s linear 1.8s
}

#screw-corks-break.animate #break-bottle-left,#screw-corks-break.animate #break-bottle-left-shape,#screw-corks-break.animate #break-bottle-right,#screw-corks-break.animate #break-bottle-right-shape {
    -webkit-transform: translate(0) rotate(0);
    transform: translate(0) rotate(0);
    opacity: 1;
    transition: opacity 0s linear 1.8s,-webkit-transform .2s cubic-bezier(.6,.03,1,.57) 1.8s;
    transition: transform .2s cubic-bezier(.6,.03,1,.57) 1.8s,opacity 0s linear 1.8s;
    transition: transform .2s cubic-bezier(.6,.03,1,.57) 1.8s,opacity 0s linear 1.8s,-webkit-transform .2s cubic-bezier(.6,.03,1,.57) 1.8s
}

#screw-corks-break.animate #break-circle {
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1s cubic-bezier(.76,.2,.39,.8) .8s
}

#break-can {
    -webkit-transform: translateY(-270px);
    transform: translateY(-270px);
    transition-delay: 1s
}

#break-bottle {
    opacity: 1;
    transition-delay: 1s
}

#break-bottle-left,#break-bottle-left-shape {
    opacity: 0;
    -webkit-transform-origin: 187px 261px 0;
    transform-origin: 187px 261px 0;
    -webkit-transform: translateX(-10px) rotate(90deg);
    transform: translateX(-10px) rotate(90deg);
    transition-delay: 1s
}

#break-bottle-right,#break-bottle-right-shape {
    opacity: 0;
    -webkit-transform-origin: 214px 261px 0;
    transform-origin: 214px 261px 0;
    -webkit-transform: translateX(10px) rotate(-90deg);
    transform: translateX(10px) rotate(-90deg);
    transition-delay: 1s
}

#break-circle {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke-dasharray: 2000;
    stroke-dashoffset: 2000;
    transition-delay: 1s
}

#screw-corks-equal {
    width: 200px
}

#screw-corks-equal.animate #equal-can-top {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.4s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.4s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.4s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.4s
}

#screw-corks-equal.animate #equal-can-bottom {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1s
}

#screw-corks-equal.animate #equal-bottle {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.2s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.2s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.2s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.2s
}

#screw-corks-equal.animate #equal-sign {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: -webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s;
    transition: transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s,-webkit-transform .5s cubic-bezier(.24,.72,.35,1.01) 1.6s
}

#equal-can-top {
    -webkit-transform: translateY(140px);
    transform: translateY(140px);
    transition-delay: 1s
}

#equal-can-bottom {
    -webkit-transform: translateX(165px);
    transform: translateX(165px);
    transition-delay: 1s
}

#equal-bottle {
    -webkit-transform: translateX(-103px);
    transform: translateX(-103px);
    transition-delay: 1s
}

#equal-sign {
    -webkit-transform: translateX(-45px);
    transform: translateX(-45px);
    transition-delay: 1s
}

#screw-corks-gear {
    width: 250px
}

#screw-corks-gear.animate #gear-can-left {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform 2s cubic-bezier(.24,.72,.35,1.01) 1s;
    transition: transform 2s cubic-bezier(.24,.72,.35,1.01) 1s;
    transition: transform 2s cubic-bezier(.24,.72,.35,1.01) 1s,-webkit-transform 2s cubic-bezier(.24,.72,.35,1.01) 1s;
    transition-delay: 1s
}

#screw-corks-gear.animate #gear-can-right {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    transition: -webkit-transform 2s cubic-bezier(.24,.72,.35,1.01) 1.3s;
    transition: transform 2s cubic-bezier(.24,.72,.35,1.01) 1.3s;
    transition: transform 2s cubic-bezier(.24,.72,.35,1.01) 1.3s,-webkit-transform 2s cubic-bezier(.24,.72,.35,1.01) 1.3s
}

#screw-corks-gear.animate #gear-can-left-lines,#screw-corks-gear.animate #gear-can-left-logo {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: -webkit-transform 2.9s cubic-bezier(.24,.72,.35,1.01) .6s;
    transition: transform 2.9s cubic-bezier(.24,.72,.35,1.01) .6s;
    transition: transform 2.9s cubic-bezier(.24,.72,.35,1.01) .6s,-webkit-transform 2.9s cubic-bezier(.24,.72,.35,1.01) .6s
}

#screw-corks-gear.animate #gear-can-right-lines,#screw-corks-gear.animate #gear-can-right-logo {
    -webkit-transform: translateX(0);
    transform: translateX(0);
    transition: -webkit-transform 2.9s cubic-bezier(.24,.72,.35,1.01) .8s;
    transition: transform 2.9s cubic-bezier(.24,.72,.35,1.01) .8s;
    transition: transform 2.9s cubic-bezier(.24,.72,.35,1.01) .8s,-webkit-transform 2.9s cubic-bezier(.24,.72,.35,1.01) .8s
}

#screw-corks-gear.animate #gear-circle {
    stroke-dashoffset: 0;
    transition: stroke-dashoffset 1s cubic-bezier(.76,.2,.39,.8) .8s
}

#gear-can-left,#gear-can-right {
    -webkit-transform: translateY(-110px);
    transform: translateY(-110px);
    transition-delay: 1s
}

#gear-can-left-lines,#gear-can-left-logo,#gear-can-right-lines,#gear-can-right-logo {
    -webkit-transform: translateX(-30px);
    transform: translateX(-30px);
    transition-delay: 1s
}

#gear-circle {
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke-dasharray: 2000;
    stroke-dashoffset: 2000;
    transition-delay: 1s
}

#fp-nav {
    -webkit-transform: translateX(60px);
    transform: translateX(60px);
    transition: -webkit-transform 1s;
    transition: transform 1s;
    transition: transform 1s,-webkit-transform 1s
}

@media only screen and (max-width: 767px) {
    #fp-nav {
        display:none
    }
}

#fp-nav.show {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

#fp-nav ul li:first-child,#fp-nav ul li:nth-child(n+7) {
    display: none
}

#fp-nav ul li a {
    cursor: default
}

#fp-nav ul li a span {
    background-color: #fff
}

.screw-corks-hero-main.no-parallax {
    visibility: visible!important
}

.trade-media-hero .parallax-standard-scroll {
    background: #000 url(assets/images/trade-media/hero.jpg) 50%/cover no-repeat
}

.trade-media-section {
    text-align: center;
    border-bottom: 1px solid #cac4bd;
    background: #f5f0ea;
    padding: 80px
}

@media only screen and (max-width: 1200px) {
    .trade-media-section {
        padding:60px 0
    }
}

@media only screen and (max-width: 1023px) {
    .trade-media-section {
        padding:40px
    }
}

.trade-media-section-headline+.trade-media-section-text {
    margin-top: 1em
}

@media only screen and (max-width: 1200px) {
    .trade-media-headline {
        font-size:60px
    }
}

@media only screen and (max-width: 1023px) {
    .trade-media-headline {
        font-size:50px
    }
}

@media only screen and (max-width: 767px) {
    .trade-media-headline {
        font-size:40px
    }
}

@media only screen and (max-width: 480px) {
    .trade-media-headline {
        font-size:30px
    }
}

.trade-media-title {
    margin-bottom: 20px;
    font-size: 40px
}

@media only screen and (max-width: 1200px) {
    .trade-media-title {
        font-size:30px
    }
}

@media only screen and (max-width: 1023px) {
    .trade-media-title {
        font-size:20px
    }
}

@media only screen and (max-width: 767px) {
    .trade-media-title {
        font-size:30px
    }
}

@media only screen and (max-width: 480px) {
    .trade-media-title {
        font-size:20px
    }
}

.tech-sheet-section {
    padding-bottom: 0
}

.tech-sheet-items {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 40px;
    max-width: 1400px;
    margin: 0 auto
}

@media only screen and (max-width: 767px) {
    .tech-sheet-items {
        -ms-flex-direction:column;
        flex-direction: column;
        padding: 0
    }
}

.tech-sheet-item {
    width: 33.33333%;
    text-align: center;
    padding: 0 20px;
    margin-bottom: 100px
}

@media only screen and (max-width: 1023px) {
    .tech-sheet-item {
        margin-bottom:60px
    }
}

@media only screen and (max-width: 767px) {
    .tech-sheet-item {
        width:100%
    }
}

@media only screen and (max-width: 480px) {
    .tech-sheet-item {
        padding:0
    }
}

.tech-sheet-item img {
    display: block;
    margin: 0 auto;
    margin-bottom: 30px;
    width: 100%;
    max-width: 350px
}

.tech-sheet-item .black-tea-title {
    color: #00b4b1
}

.tech-sheet-item .green-tea-title {
    color: #b11f24
}

.tech-sheet-item .herbal-tea-title {
    color: #243f93
}

.tech-sheet-item ..gift-tea {
    color: #74a345
}

.tech-sheet-item .bubbles {
    color: #1d1e1e
}

.brand-assets-items {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    padding: 40px;
    max-width: 1400px;
    margin: 0 auto
}

@media only screen and (max-width: 767px) {
    .brand-assets-items {
        -ms-flex-direction:column;
        flex-direction: column;
        padding: 0
    }
}

.brand-assets-item {
    width: 50%;
    text-align: center;
    padding: 0 20px
}

@media only screen and (max-width: 767px) {
    .brand-assets-item {
        width:100%
    }
}

@media only screen and (max-width: 480px) {
    .brand-assets-item {
        padding:0
    }
}

.brand-assets-item:first-child {
    position: relative
}

@media only screen and (max-width: 767px) {
    .brand-assets-item:first-child {
        margin-bottom:80px
    }
}

.brand-assets-item:first-child:after {
    position: absolute;
    content: "";
    border-right: 1px solid #acacac;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    height: 50%
}

@media only screen and (max-width: 767px) {
    .brand-assets-item:first-child:after {
        display:none
    }
}

.brand-assets-item-icon {
    height: 300px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    margin: 0 auto
}

@media only screen and (max-width: 1023px) {
    .brand-assets-item-icon {
        height:250px
    }
}

@media only screen and (max-width: 767px) {
    .brand-assets-item-icon {
        height:auto
    }
}

.brand-assets-item-icon.logos {
    width: 225px
}

@media only screen and (max-width: 1023px) {
    .brand-assets-item-icon.logos {
        width:180px
    }
}

@media only screen and (max-width: 480px) {
    .brand-assets-item-icon.logos {
        width:150px
    }
}

.brand-assets-item-icon.images {
    width: 250px
}

@media only screen and (max-width: 1023px) {
    .brand-assets-item-icon.images {
        width:200px
    }
}

@media only screen and (max-width: 480px) {
    .brand-assets-item-icon.images {
        width:170px
    }
}

.brand-assets-item svg {
    display: block;
    margin: 0 auto;
    margin-bottom: 40px;
    width: 100%;
    height: auto;
    fill: #b11f24
}

.brand-assets-title {
    color: #424242
}

.buzz {
    background-color: #243f93;
    padding: 100px 0 200px;
    transition: background-color .5s
}

@media only screen and (max-width: 1200px) {
    .buzz {
        padding:80px 0 160px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .buzz {
        padding:60px 0 140px
    }
}

@media only screen and (max-width: 1023px) {
    .buzz {
        padding:60px 0 100px
    }
}

@media only screen and (max-width: 767px) {
    .buzz {
        padding-top:40px 30px
    }
}

.buzz .title {
    color: rgba(0,0,0,.4);
    text-align: center;
    margin-bottom: 40px
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .buzz .title {
        font-size:50px
    }
}

@media only screen and (max-width: 1023px) {
    .buzz .title {
        margin-bottom:20px
    }
}

.buzz .headline {
    color: #f3eee8;
    font-size: 60px;
    max-width: 1400px
}

@media only screen and (max-width: 1200px) {
    .buzz .headline {
        font-size:50px
    }
}

@media only screen and (max-height: 730px) and (min-width:1024px) {
    .buzz .headline {
        font-size:40px
    }
}

@media only screen and (max-width: 1023px) {
    .buzz .headline {
        font-size:40px
    }
}

@media only screen and (max-width: 767px) {
    .buzz .headline {
        font-size:28px
    }
}

@media only screen and (max-width: 480px) {
    .buzz .headline {
        font-size:17px
    }
}

.buzz-item {
    height: 100%;
    text-align: center;
    display: -ms-flexbox!important;
    display: flex!important;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 200px
}

@media only screen and (max-width: 1200px) {
    .buzz-item {
        padding:0 150px
    }
}

@media only screen and (max-width: 1023px) {
    .buzz-item {
        padding:0 100px
    }
}

@media only screen and (max-width: 767px) {
    .buzz-item {
        padding:0 70px
    }
}

@media only screen and (max-width: 480px) {
    .buzz-item {
        padding:0 50px
    }
}

.buzz-item:focus {
    outline: 0
}

.buzz .button,.buzz .contact-form-submit input,.contact-form-submit .buzz input {
    background-color: rgba(0,0,0,.3);
    color: #fff
}

.buzz .button:after,.buzz .button:hover,.buzz .button:hover:after,.buzz .contact-form-submit input:after,.buzz .contact-form-submit input:hover,.buzz .contact-form-submit input:hover:after,.contact-form-submit .buzz input:after,.contact-form-submit .buzz input:hover,.contact-form-submit .buzz input:hover:after {
    background-color: rgba(0,0,0,.3)
}

.buzz .button:hover,.buzz .contact-form-submit input:hover,.contact-form-submit .buzz input:hover {
    background-color: rgba(0,0,0,.4);
    color: #fff
}

.buzz .button:hover:after,.buzz .button:hover:hover,.buzz .button:hover:hover:after,.buzz .contact-form-submit input:hover:after,.buzz .contact-form-submit input:hover:hover,.buzz .contact-form-submit input:hover:hover:after,.contact-form-submit .buzz input:hover:after,.contact-form-submit .buzz input:hover:hover,.contact-form-submit .buzz input:hover:hover:after {
    background-color: rgba(0,0,0,.4)
}

.buy-hero {
    background: #f5f0ea;
    z-index: 0!important
}

.buy-hero-headline {
    position: relative;
    z-index: 2
}

.buy-hero-headline .headline {
    color: #424242!important
}

.buy-hero-more {
    position: absolute;
    bottom: 80px;
    left: 0;
    z-index: 2;
    text-align: center;
    width: 100%
}

@media only screen and (max-width: 767px) {
    .buy-hero-more {
        bottom:120px
    }
}

.buy-hero-more.bottom-spacing {
    bottom: 29%
}

.buy-hero-title {
    margin-top: auto;
    margin-bottom: 10px;
    position: relative;
    z-index: 2
}

.buy-hero-title .eyebrow {
    color: #424242
}

.buy-contact {
    background: #fff
}

#map {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    width: 800px;
    z-index: 1
}

@media only screen and (max-width: 1200px) {
    #map {
        width:700px
    }
}

@media only screen and (max-width: 1023px) {
    #map {
        width:600px
    }
}

@media only screen and (max-width: 767px) {
    #map {
        width:400px;
        -webkit-transform: translate(-50%,-60%);
        transform: translate(-50%,-60%)
    }
}

@media only screen and (max-width: 480px) {
    #map {
        width:300px
    }
}

#map circle {
    transition: fill .5s
}

#map .default-state {
    transition-delay: .3s;
    transition-duration: .2s
}

@media only screen and (min-width: 1201px) {
    #map .default-state {
        fill:#e2ded9
    }
}

.default-hero {
    background: #f5f0ea;
    height: 400px;
    display: -ms-flexbox;
    display: flex;
    text-align: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 3%;
    padding-right: 3%
}

@media only screen and (max-width: 1023px) {
    .default-hero {
        height:auto;
        padding-top: 150px;
        padding-bottom: 100px
    }
}

.default-hero .headline {
    color: #424242
}

@media only screen and (max-width: 1200px) {
    .default-hero .headline {
        font-size:60px
    }
}

@media only screen and (max-width: 1023px) {
    .default-hero .headline {
        font-size:45px
    }
}

@media only screen and (max-width: 767px) {
    .default-hero .headline {
        font-size:35px
    }
}

@media only screen and (max-width: 480px) {
    .default-hero .headline {
        font-size:28px
    }
}

.default-content {
    background-color: #fff
}

.default-content-inner {
    padding: 100px 60px;
    max-width: 900px;
    margin: 0 auto
}

@media only screen and (max-width: 767px) {
    .default-content-inner {
        padding:40px 30px
    }
}

.default-content-inner h2 {
    color: #424242;
    margin-bottom: .3em
}

.default-content-inner p+p {
    margin-top: 1.5em
}

.default-content-inner p+h2 {
    margin-top: 2em
}

.default-content-inner p a {
    color: currentColor;
    text-decoration: underline
}

.default-content-inner p a:hover {
    color: #b11f24
}

.not-found {
    text-align: center
}

.contact-form-submit .not-found input,.not-found .button,.not-found .contact-form-submit input {
    margin-top: 50px;
    background-color: #b11f24;
    color: #fff
}

.contact-form-submit .not-found input:after,.not-found .button:after,.not-found .contact-form-submit input:after {
    background-color: #b11f24
}

.contact-form-submit .not-found input:hover,.contact-form-submit .not-found input:hover:after,.not-found .button:hover,.not-found .button:hover:after,.not-found .contact-form-submit input:hover,.not-found .contact-form-submit input:hover:after {
    background-color: #9b1b20
}
