/* html{
    background-color:#fff; 
    font-size:16px
} */
body{
    /* min-height:100vh; */
    margin:0;
    /* background-color:#EEEEEE; */
    /* color:#fff;
    font-family:brandon-grotesque,sans-serif;
    font-weight:400;
    font-style:normal;
    font-display:swap */
}
/* html,body, */
#content-wrapper{
    height:100%;
}
.no-scroll{
    overflow:hidden;
    position:relative
}
.overlay-is-open #content-wrapper{
    position:fixed;
    overflow:hidden;
    width:100%
}
/* footer *,h2,h2 .title{
    text-transform:uppercase
} */
*{
    -webkit-box-sizing:border-box;
    box-sizing:border-box
}
/* img{
    width:100%;
    height:auto
} */
svg{
    overflow:visible
}
/*
a{
    color:#fff;
    text-decoration:none
}
*/
.main{
    background-color:#030512;
    position:relative;
    z-index:2
}
.main:before{
    content:"";
    position:absolute;
    top:-1px;
    left:0;
    right:0;
    height:50vh;
    background:-webkit-gradient(linear,left bottom,left top,from(rgba(5,3,10,0)),to(rgba(2,4,10,1)));
    background:-o-linear-gradient(bottom,rgba(5,3,10,0),rgba(2,4,10,1));
    background:linear-gradient(0deg,#05030a00,#02040a)
}
.main--no-fade:before{
    content:none
}
.main--space{
    padding-top:7%;
    padding-bottom:3%
}



.navigation-center{
    display:flex;
    flex-direction:column;
    align-items:center;
    font-family:proxima-nova,sans-serif
}
.so-me-navigation{
    display:flex;
    flex-direction:row;
    justify-content:center;
    gap:1rem
}
.styleframe__wrap-menu{
    margin:1.5rem 0
}
.top-hero{
    min-height:100%;
    width:100%;
    /* background-color:#4AC5F0; */
	/* background-color:#fff; */
	background-color: #FBC8D8;
    position:relative;
}
@media (max-width: 568px){
    .top-hero{
        min-height:110%
    }
}
.top-hero__content{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    height:100%
}
.header{
    width:100%;
    height:100px;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:space-between;
    -ms-flex-pack:space-between;
    justify-content:space-between;
    -webkit-box-align:flex-start;
    -ms-flex-align:flex-start;
    align-items:flex-start;
    padding:20px;
    position:relative;
    z-index:5;
    -webkit-transition:opacity .4s,-webkit-transform .4s;
    transition:opacity .4s,-webkit-transform .4s;
    -o-transition:transform .4s,opacity .4s;
    transition:transform .4s,opacity .4s;
    transition:transform .4s,opacity .4s,-webkit-transform .4s
}
.header .top-left{
    display:flex;
    align-items:flex-start;
    margin:11px 0
}
.header .top-left .button{
    padding:0;
    margin-left:1em
}
.header .top-left .button-only-icon{
    top:.3em;
    left:.3em
}
.top-hero--playing .header{
    opacity:0;
    -webkit-transform:translateY(-10px);
    -ms-transform:translateY(-10px);
    transform:translateY(-10px)
}
.top-hero .hero.visible{
    padding-top:5rem;
}
@media (min-aspect-ratio: 3/4){
    .top-hero .hero.visible{
        padding-top:8rem
    }
}
@media (min-width: 500px){
    .top-hero .hero.visible{
        padding-top:8rem
    }
}
.top-hero .hero{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    gap:4rem;
    color:#f2f2f2;
    width:100%;
    -webkit-transition:opacity .4s,-webkit-transform 1s cubic-bezier(.25,.46,.45,.94);
    transition:opacity .4s,-webkit-transform 1s cubic-bezier(.25,.46,.45,.94);
    -o-transition:transform 1s cubic-bezier(.25,.46,.45,.94),opacity .4s;
    transition:transform 1s cubic-bezier(.25,.46,.45,.94),opacity .4s;
    transition:transform 1s cubic-bezier(.25,.46,.45,.94),opacity .4s,-webkit-transform 1s cubic-bezier(.25,.46,.45,.94);
	margin-top:30px;
    margin-bottom:75px;
	max-width: 90vw;
}
/* @media (max-width: 500px){
    .top-hero .hero{
        margin-bottom:10%;
        margin-top:0
    }
}
@media (max-width: 820px){
    .top-hero .hero{
        margin-bottom:0;
        margin-top:0
    }
}
@media (min-aspect-ratio: 3/4){
    .top-hero .hero{
        margin-bottom:20%
    }
} */
@media (orientation: landscape){
    .top-hero .hero{
        /* max-width:60vw; */
		max-width:85vw;
        /* margin-bottom:0 */
    }
    /* .header .top-left{
        margin:auto 0
    } */
}
/* @media (orientation: landscape){
    .top-hero .hero.hero--wide{
        max-width:67em
		margin-top: 5vh;
    }
} */
.top-hero .button{
    opacity:0;
    -webkit-animation:zero 2s 0s cubic-bezier(.28,.16,.42,.99) forwards;
    animation:zero 2s 0s cubic-bezier(.28,.16,.42,.99) forwards;
	margin-top: 0.5em;
}
.top-hero .button.visible{
    animation-delay:0s
}
.top-hero a.button.visible:hover{
	color: inherit;
}
.button__block-hero{
    display:flex;
    /* flex-direction:column; */
	flex-direction:row;
    justify-content:center;
    align-items:center;
    position:relative;
	gap:6rem 4rem;
	flex-wrap: wrap;
}
.button__block-hero img{
    width:100%;
    height:auto
}
.button__block-title{
    margin-bottom:0;
    font-size:.875em
}
.button__block-subtitle{
    font-size:.875em
}
.button__wrap-row{
    display:flex;
    flex-direction:row;
    width:100%
}
.button__wrap{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    position:relative;
    z-index:1;
	width:250px;
}
.button__wrap .b-title{
	color: #251e1c;
	text-align: center;
	margin-bottom: 0.5rem;
}
.button__wrap .b-lightbox{
	overflow: hidden;
	max-width: 100%;
	/* max-height: 100%; */
}
.button__wrap .b-lightbox img{
	transition: transform .6s ease;
}
.button__wrap .b-lightbox:hover img{
	transform: scale(1.15);
}

.button__wrap[data-reveal]{
    opacity:0;
    -webkit-transition:opacity 2s .1s cubic-bezier(.42,2.49,.04,.34);
    -o-transition:opacity 2s .1s cubic-bezier(.42,2.49,.04,.34);
    transition:opacity 2s .1s cubic-bezier(.42,2.49,.04,.34);
    transition:opacity 2s .1s cubic-bezier(.42,2.49,.04,.34),opacity 2s .1s cubic-bezier(.42,2.49,.04,.34)
}
.button__wrap[data-reveal].visible{
    opacity:1
}
.top-hero__button{
    margin:0 auto;
    padding:20px;
    cursor:pointer;
    position:-webkit-sticky;
    position:sticky;
    bottom:0
}
@media (orientation: landscape){
    .top-hero__button{
        position:absolute
    }
}
.top-hero__button svg{
    -webkit-transition:-webkit-transform .5s cubic-bezier(.42,2.49,.04,.34);
    transition:-webkit-transform .5s cubic-bezier(.42,2.49,.04,.34);
    -o-transition:transform .5s cubic-bezier(.42,2.49,.04,.34);
    transition:transform .5s cubic-bezier(.42,2.49,.04,.34);
    transition:transform .5s cubic-bezier(.42,2.49,.04,.34),-webkit-transform .5s cubic-bezier(.42,2.49,.04,.34)
}
.top-hero__button:hover svg{
    -webkit-transform:translateY(10px);
    -ms-transform:translateY(10px);
    transform:translateY(10px)
}
.fade-in-1{
    opacity:0;
    -webkit-animation:zero 1s linear forwards;
    animation:zero 1s linear forwards
}
.fade-in-2{
    opacity:0;
    -webkit-animation:zero 1.5s 1.5s linear forwards;
    animation:zero 1.5s 1.5s linear forwards
}
.pl{
    width:90%;
    max-width:90vw;
    margin:auto;
    text-align:center;
}
.pl svg{
    width:80%;
    height:auto;
    display:inline-block
}
@media (orientation: landscape){
    .pl{
        /* max-width:65vh; */
		max-width:50vw;
    }
}
@media (orientation: portrait) and (min-width: 800px),(orientation: landscape){
    .pl.pl--end{
        max-width:50%
    }
}
.pl-title{
    opacity:0;
    -webkit-transform:scale(.8);
    -ms-transform:scale(.8);
    transform:scale(.8);
    -webkit-transform-origin:center center;
    -ms-transform-origin:center center;
    transform-origin:center center;
    -webkit-transition:opacity 5s cubic-bezier(.28,.16,.42,.99),-webkit-transform 5s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 5s cubic-bezier(.28,.16,.42,.99),-webkit-transform 5s cubic-bezier(.28,.16,.42,.99);
    -o-transition:opacity 5s cubic-bezier(.28,.16,.42,.99),transform 5s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 5s cubic-bezier(.28,.16,.42,.99),transform 5s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 5s cubic-bezier(.28,.16,.42,.99),transform 5s cubic-bezier(.28,.16,.42,.99),-webkit-transform 5s cubic-bezier(.28,.16,.42,.99)
}
.pl-hero-title{
    opacity:0;
    -webkit-transform:scale(.8);
    -ms-transform:scale(.8);
    transform:scale(.8);
    -webkit-transform-origin:center center;
    -ms-transform-origin:center center;
    transform-origin:center center;
    -webkit-animation:zero 5s cubic-bezier(.28,.16,.42,.99) forwards;
    animation:zero 5s cubic-bezier(.28,.16,.42,.99) forwards
}
.pl-hero-subtitle{
    opacity:0;
    -webkit-animation:zero 3s 2s cubic-bezier(.28,.16,.42,.99) forwards;
    animation:zero 3s 2s cubic-bezier(.28,.16,.42,.99) forwards
}
.pl-subtitle{
    opacity:0;
    -webkit-transition:opacity 3s 2s cubic-bezier(.28,.16,.42,.99);
    -o-transition:opacity 3s 2s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 3s 2s cubic-bezier(.28,.16,.42,.99)
}
.pl-stroke,.pl-hero-stroke{
    stroke-dasharray:218 219;
    stroke-dashoffset:-218
}
.pl-hero-stroke{
    -webkit-animation:line 5s cubic-bezier(.53,.02,.17,1) forwards;
    animation:line 5s cubic-bezier(.53,.02,.17,1) forwards;
    -webkit-animation-play-state:paused;
    animation-play-state:paused
}
.pl-stroke{
    -webkit-transition:stroke-dashoffset 5s cubic-bezier(.53,.02,.17,1);
    -o-transition:stroke-dashoffset 5s cubic-bezier(.53,.02,.17,1);
    transition:stroke-dashoffset 5s cubic-bezier(.53,.02,.17,1)
}
.pl-center,.pl-hero-center{
    stroke-dasharray:56 100;
    stroke-dashoffset:-56
}
.pl-center{
    -webkit-transition:stroke-dashoffset 4s cubic-bezier(.53,.02,.17,1);
    -o-transition:stroke-dashoffset 4s cubic-bezier(.53,.02,.17,1);
    transition:stroke-dashoffset 4s cubic-bezier(.53,.02,.17,1)
}
.pl-hero-center{
    -webkit-animation:line 4s cubic-bezier(.53,.02,.17,1) forwards;
    animation:line 4s cubic-bezier(.53,.02,.17,1) forwards;
    -webkit-animation-play-state:paused;
    animation-play-state:paused
}
.pl-dot{
    opacity:0;
    -webkit-transition:opacity 4s cubic-bezier(.53,.02,.17,1);
    -o-transition:opacity 4s cubic-bezier(.53,.02,.17,1);
    transition:opacity 4s cubic-bezier(.53,.02,.17,1)
}
.pl-hero-dot{
    opacity:0;
    -webkit-animation:zero 4s cubic-bezier(.53,.02,.17,1) forwards;
    animation:zero 4s cubic-bezier(.53,.02,.17,1) forwards;
    -webkit-animation-play-state:paused;
    animation-play-state:paused
}
.visible .pl-hero-stroke,.visible .pl-hero-center,.visible .pl-hero-dot{
    -webkit-animation-play-state:running;
    animation-play-state:running
}
.visible .pl-stroke,.visible .pl-center{
    stroke-dashoffset:0
}
.visible .pl-dot{
    opacity:1
}
.visible .pl-title,.visible .pl-subtitle{
    opacity:1;
    -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1)
}
@-webkit-keyframes zero{
    to{
        opacity:1;
        -webkit-transform:translate(0,0) scale(1,1);
        transform:translate(0) scale(1)
    }
}
@keyframes zero{
    to{
        opacity:1;
        -webkit-transform:translate(0,0) scale(1,1);
        transform:translate(0) scale(1)
    }
}
@-webkit-keyframes line{
    to{
        stroke-dashoffset:0
    }
}
@keyframes line{
    to{
        stroke-dashoffset:0
    }
}
@-webkit-keyframes lineStroke{
    0%,20%{
        stroke-width:0
    }
}
@keyframes lineStroke{
    0%,20%{
        stroke-width:0
    }
}
.letter{
    opacity:1
}
.top-hero .description svg{
    -webkit-transform:rotate(20deg);
    -ms-transform:rotate(20deg);
    transform:rotate(20deg);
    margin:0 calc(5% - 8px)
}
@media (min-width: 360px){
    .top-hero .description svg{
        margin:0 15px
    }
}
@media (min-width: 480px){
    .top-hero .description{
        -webkit-transform:translateX(-21px);
        -ms-transform:translateX(-21px);
        transform:translate(-21px);
        font-size:15px
    }
}
.so-me{
    display:-webkit-box;
    display:-ms-flexbox;
    display:none;
    font-size:calc(1em + .5vw);
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    height:fit-content
}
@media (orientation: landscape){
    .so-me{
        display:flex
    }
}
.so-me a{
    font-size:1em;
    line-height:0;
    padding:0 .3em
}
.so-me svg{
    height:auto
}
.so-me.so-me--hero{
    opacity:0;
    -webkit-animation:zero 2s 2.8s cubic-bezier(.28,.16,.42,.99) forwards;
    animation:zero 2s 2.8s cubic-bezier(.28,.16,.42,.99) forwards
}
.so-me.so-me--footer{
    margin-top:10vmin
}
.steam-logo{
    font-size:calc(.9em + 2vmin)
}
.steam-logo svg{
    padding:2em 0;
    width:6.2em;
    height:auto
}
.button{
    overflow:visible;
    border:none;
    color:#fff;
    font-size:1.45rem;
    background:none;
    outline:none;
    cursor:pointer;
    padding:1em 1.7em;
    position:relative
}
.button.icon{
    padding:1rem
}
.button .icon{
    -webkit-transition:-webkit-transform .3s;
    transition:-webkit-transform .3s;
    -o-transition:transform .3s;
    transition:transform .3s;
    transition:transform .3s,-webkit-transform .3s
}
.button svg{
    display:block;
    width:auto;
    height:2em;
    background:transparent
}
.button.icon svg{
    height:60px
}
.button.icon.small svg{
    height:60px
}
.button.icon.small .icon{
    position:absolute;
	/* top: 24px;
	left: 24px; */
	top: 18px;
	left: 18px;	
	width: 45px;
	height: 45px;
}
.button.icon .icon{
    position:absolute;
	/* top: 24px;
	left: 24px; */
	top: 18px;
	left: 18px;	
	width: 45px;
	height: 45px;
}
@media (min-width: 768px){
    .button.icon.big .icon{
        position:absolute;
		/* top: 24px;
		left: 24px; */
		top: 18px;
		left: 18px;	
        width: 45px;
        height: 45px;
    }
    .button.icon.big svg{
        height:60px;
        stroke-width:3%;
        /* color:#fffc; */
    }
}
.btn-text{
    -webkit-transition:-webkit-transform .3s;
    transition:-webkit-transform .3s;
    -o-transition:transform .3s;
    transition:transform .3s;
    transition:transform .3s,-webkit-transform .3s;
    -webkit-transform-origin:center;
    -ms-transform-origin:center;
    transform-origin:center
}
.jp .checkbox-container .btn-border{
    display:none
}
svg:hover .btn-text,.button:hover .icon{
    /* -webkit-transform:scale(.95);
    -ms-transform:scale(.95);
    transform:scale(.95); */
    -webkit-transform:scale(1.25);
    -ms-transform:scale(1.25);
    transform:scale(1.25);
}
.btn-border{
    stroke-dasharray:2 6 20 6 50 20;
    stroke-dashoffset:104;
    -webkit-animation:line 4s cubic-bezier(.88,.44,.54,.77) forwards infinite;
    animation:line 4s cubic-bezier(.88,.44,.54,.77) forwards infinite
}
.startvideo .startvideo__text{
    -webkit-transition:-webkit-transform .4s;
    transition:-webkit-transform .4s;
    -o-transition:transform .4s;
    transition:transform .4s;
    transition:transform .4s,-webkit-transform .4s
}
.video-background{
    background:transparent;
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    z-index:0;
    overflow:hidden
}
.video-background.desktop{
    display:none
}
@media (min-width: 600px){
    .video-background.desktop{
        display:inline
    }
    .video-background.mobile{
        display:none
    }
}
._16-9{
    width:100%;
    height:0;
    padding-bottom:56.25%;
    position:relative
}
._16-9-desktop_3-2-mobile{
    width:250%;
    height:0;
    padding-bottom:150%;
    position:relative
}
._16-9-desktop_9-16-mobile{
	position:relative;
	height:0%;
    /* 
	width:178%;
    padding-bottom:81%; 
	*/
    /*
    width: 535%;
    padding-bottom: 300%;
    */
    /*
    width: 311%;
    padding-bottom: 112%;
    */
    width: 165%;
    padding-bottom: 80%;
}
@media (max-width:560px){
    ._16-9-desktop_9-16-mobile{
        width: 162%;
        padding-bottom: 90.5%;
        position:relative
    }
}
@media (max-width:440px){
    ._16-9-desktop_9-16-mobile{
        width: 192%;
        padding-bottom: 107.5%;
        position:relative
    }
}
@media (max-width:360px){
    ._16-9-desktop_9-16-mobile{
        width: 300%;
        padding-bottom: 165.5%;
        position:relative
    }
}
@media (min-aspect-ratio: 1/1){
    ._16-9-desktop_3-2-mobile{
        width:100%;
        height:0%;
        padding-bottom:56.5%;
        position:relative
    }
}
/* @media (min-width: 600px){
    ._16-9-desktop_3-2-mobile{
        width:auto;
        padding-bottom:56.25%;
        position:relative
    }
}
@media (max-width: 520px){
    ._16-9-desktop_9-16-mobile{
        padding-bottom:100%
    }
} */
@media (min-aspect-ratio: 3/4){
    ._16-9-desktop_9-16-mobile{
/*
        width:242%;
        padding-bottom:136.13%;
*/
        width: 173%;
        padding-bottom: 97.13%;
        position:relative
    }
}
@media (min-aspect-ratio: 1/1){
    ._16-9-desktop_9-16-mobile{
/*
        width:181%;
        padding-bottom:101.81%;
*/
        width: 134%;
        padding-bottom: 73.81%;
        position:relative
    }
}
/* @media (min-aspect-ratio: 4/3){
    ._16-9-desktop_9-16-mobile{
        width:135%;
        padding-bottom:85.94%;
        position:relative
    }
} */
@media (min-aspect-ratio: 16/9){
    ._16-9-desktop_9-16-mobile{
        width:100%;
        padding-bottom:56.5%
    }
}
.video-background iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    pointer-events:none
}
.video-foreground{
    position:absolute;
    width:178%;
    height:100%;
    left:-100%;
    bottom:0
}
@media (min-aspect-ratio: 3/4){
    .video-foreground{
        width:100%;
        height:auto;
        left:-10%;
        bottom:0
    }
}
@media (min-aspect-ratio: 16/9){
    .video-foreground{
        width:100%;
        height:auto;
        left:0%;
        top:0
    }
}
.top-hero .video-background iframe{
    background-image:url(/assets/images/poster.jpg);
    background-position:center;
    background-size:cover
}
.fade{
    /* background:#00000080; */
    width:100%;
    height:100%;
    position:absolute;
    top:0;
    left:0;
    pointer-events:none
}
.top-hero__video .video.hidden{
    opacity:0
}
.poltrailer{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100%;
    z-index:102;
    -webkit-transition:opacity 1s;
    -o-transition:opacity 1s;
    transition:opacity 1s;
    background-color:#030512;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    pointer-events:none
}
@media (orientation: landscape){
    .poltrailer{
        padding:40px
    }
}
.poltrailer__overlay{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:none;
    border:none
}
.poltrailer__video{
    margin:auto;
    position:relative;
    z-index:4
}
.poltrailer iframe{
    width:100%;
    height:56.25vw;
    max-height:100%;
    -webkit-transition:opacity 1s .3s;
    -o-transition:opacity 1s .3s;
    transition:opacity 1s .3s;
    opacity:0
}
@media (min-aspect-ratio: 16/9){
    .poltrailer iframe{
        width:178vh;
        height:100%
    }
}
.poltrailer--visible{
    pointer-events:all;
    opacity:1!important
}
.poltrailer--visible iframe{
    opacity:1
}

.section.section--hero{
    /* background:#000;
    mix-blend-mode:lighten; */
    margin-bottom:0
}
.section.section--hero-row{
    flex-flow:row wrap;
    justify-content:center;
    align-items:flex-start;
    gap:1.125rem;
    width:100%
}
.section__wrap.section__wrap--hero{
    padding:70px 0 5vmin
}
.section__wrap{
    padding:15vmin 0 5vmin
}
.section{
    width:90%;
    /* max-width:70em; */
	max-width: 80em;
    border:1px solid rgba(255,255,255,0);
    /* padding:0 5% 2.5em; */
	padding:0;
    margin:0 auto;
    line-height:1.7;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    position:relative;
    -webkit-transition:border 2s cubic-bezier(.28,.16,.42,.99);
    -o-transition:border 2s cubic-bezier(.28,.16,.42,.99);
    transition:border 2s cubic-bezier(.28,.16,.42,.99);
    /* background-color:#030512 */
}
.section.visible,.visible>.section{
    border:1px solid rgba(255,255,255,.5)
}
.title{
    font-family:proxima-nova,sans-serif;
    font-weight:700;
    text-align:center;
    text-transform:uppercase;
    letter-spacing:.22em;
    line-height:1.5;
    font-size:calc(.8em + .8vw);
    max-width:90%;
    margin:0 auto
}
.title.title--large{
    font-size:calc(1em + 1vw)
}
.section .title{
    padding:0 1em;
    position:relative;
    display:-webkit-inline-box;
    display:-ms-inline-flexbox;
    display:inline-flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    text-transform:uppercase;
    text-align:center;
    font-size:calc(.9em + 2vmin);
    margin-top:-1.5em;
    background:#030512;
    margin-bottom:5%;
    color:#fff;
    -webkit-transform:scale(.9);
    -ms-transform:scale(.9);
    transform:scale(.9);
    -webkit-transition:color 3s cubic-bezier(.28,.16,.42,.99),-webkit-transform 1s cubic-bezier(.28,.16,.42,.99);
    transition:color 3s cubic-bezier(.28,.16,.42,.99),-webkit-transform 1s cubic-bezier(.28,.16,.42,.99);
    -o-transition:color 3s cubic-bezier(.28,.16,.42,.99),transform 1s cubic-bezier(.28,.16,.42,.99);
    transition:color 3s cubic-bezier(.28,.16,.42,.99),transform 1s cubic-bezier(.28,.16,.42,.99);
    transition:color 3s cubic-bezier(.28,.16,.42,.99),transform 1s cubic-bezier(.28,.16,.42,.99),-webkit-transform 1s cubic-bezier(.28,.16,.42,.99);
    min-height:3em
}
@media (min-width: 765px){
    .section .title{
        margin-bottom:0
    }
}
.fr .section .title{
    font-size:calc(.7em + 2vmin)
}
.visible .title{
    -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1)
}
.decoration{
    position:absolute;
    left:5%;
    top:-10px;
    overflow:visible;
    width:53px;
    height:auto;
    background:#030512;
    padding-left:10px;
    z-index:1;
    color:#fff0;
    -webkit-transform:translateX(20px);
    -ms-transform:translateX(20px);
    transform:translate(20px);
    -webkit-transition:color 3s .5s cubic-bezier(.28,.16,.42,.99),-webkit-transform 3s .6s cubic-bezier(.28,.16,.42,.99);
    transition:color 3s .5s cubic-bezier(.28,.16,.42,.99),-webkit-transform 3s .6s cubic-bezier(.28,.16,.42,.99);
    -o-transition:color 3s .5s cubic-bezier(.28,.16,.42,.99),transform 3s .6s cubic-bezier(.28,.16,.42,.99);
    transition:color 3s .5s cubic-bezier(.28,.16,.42,.99),transform 3s .6s cubic-bezier(.28,.16,.42,.99);
    transition:color 3s .5s cubic-bezier(.28,.16,.42,.99),transform 3s .6s cubic-bezier(.28,.16,.42,.99),-webkit-transform 3s .6s cubic-bezier(.28,.16,.42,.99)
}
.visible .decoration{
    color:#fff;
    -webkit-transform:translateX(0px);
    -ms-transform:translateX(0px);
    transform:translate(0)
}
.decoration--right{
    right:5%;
    left:auto;
    -webkit-transform:rotate(180deg) translateX(20px);
    -ms-transform:rotate(180deg) translateX(20px);
    transform:rotate(180deg) translate(20px)
}
.visible .decoration--right{
    -webkit-transform:rotate(180deg) translateX(0px);
    -ms-transform:rotate(180deg) translateX(0px);
    transform:rotate(180deg) translate(0)
}
@media (max-width: 880px){
    .decoration{
        display:none
    }
    .section .title{
        padding:0 1em
    }
}
.planet-and-moon .moon--right{
    -webkit-animation:moonright 2s linear infinite forwards;
    animation:moonright 2s linear infinite forwards
}
@-webkit-keyframes moonright{
    0%{
        -webkit-transform:translate(0,0);
        transform:translate(0)
    }
    5%{
        -webkit-transform:translate(-1px,-1px);
        transform:translate(-1px,-1px)
    }
    16.66%{
        -webkit-transform:translate(-7px,-3px);
        transform:translate(-7px,-3px)
    }
    33.33%{
        -webkit-transform:translate(-18px,-6px);
        transform:translate(-18px,-6px)
    }
    50%{
        -webkit-transform:translate(-32.5px,-7px);
        transform:translate(-32.5px,-7px)
    }
    66.66%{
        -webkit-transform:translate(-47px,-6px);
        transform:translate(-47px,-6px)
    }
    83.33%{
        -webkit-transform:translate(-58px,-3px);
        transform:translate(-58px,-3px)
    }
    95%{
        -webkit-transform:translate(-64px,-1px);
        transform:translate(-64px,-1px)
    }
    to{
        -webkit-transform:translate(-65px,0px);
        transform:translate(-65px)
    }
}
@keyframes moonright{
    0%{
        -webkit-transform:translate(0,0);
        transform:translate(0)
    }
    5%{
        -webkit-transform:translate(-1px,-1px);
        transform:translate(-1px,-1px)
    }
    16.66%{
        -webkit-transform:translate(-7px,-3px);
        transform:translate(-7px,-3px)
    }
    33.33%{
        -webkit-transform:translate(-18px,-6px);
        transform:translate(-18px,-6px)
    }
    50%{
        -webkit-transform:translate(-32.5px,-7px);
        transform:translate(-32.5px,-7px)
    }
    66.66%{
        -webkit-transform:translate(-47px,-6px);
        transform:translate(-47px,-6px)
    }
    83.33%{
        -webkit-transform:translate(-58px,-3px);
        transform:translate(-58px,-3px)
    }
    95%{
        -webkit-transform:translate(-64px,-1px);
        transform:translate(-64px,-1px)
    }
    to{
        -webkit-transform:translate(-65px,0px);
        transform:translate(-65px)
    }
}
.planet-and-moon .moon--left{
    -webkit-animation:moonleft 2s linear infinite;
    animation:moonleft 2s linear infinite
}
@-webkit-keyframes moonleft{
    0%{
        -webkit-transform:translate(0,0);
        transform:translate(0)
    }
    5%{
        -webkit-transform:translate(1px,1px);
        transform:translate(1px,1px)
    }
    16.66%{
        -webkit-transform:translate(7px,3px);
        transform:translate(7px,3px)
    }
    33.33%{
        -webkit-transform:translate(18px,6px);
        transform:translate(18px,6px)
    }
    50%{
        -webkit-transform:translate(32.5px,7px);
        transform:translate(32.5px,7px)
    }
    66.66%{
        -webkit-transform:translate(47px,6px);
        transform:translate(47px,6px)
    }
    83.33%{
        -webkit-transform:translate(58px,3px);
        transform:translate(58px,3px)
    }
    95%{
        -webkit-transform:translate(64px,1px);
        transform:translate(64px,1px)
    }
    to{
        -webkit-transform:translate(65px,0px);
        transform:translate(65px)
    }
}
@keyframes moonleft{
    0%{
        -webkit-transform:translate(0,0);
        transform:translate(0)
    }
    5%{
        -webkit-transform:translate(1px,1px);
        transform:translate(1px,1px)
    }
    16.66%{
        -webkit-transform:translate(7px,3px);
        transform:translate(7px,3px)
    }
    33.33%{
        -webkit-transform:translate(18px,6px);
        transform:translate(18px,6px)
    }
    50%{
        -webkit-transform:translate(32.5px,7px);
        transform:translate(32.5px,7px)
    }
    66.66%{
        -webkit-transform:translate(47px,6px);
        transform:translate(47px,6px)
    }
    83.33%{
        -webkit-transform:translate(58px,3px);
        transform:translate(58px,3px)
    }
    95%{
        -webkit-transform:translate(64px,1px);
        transform:translate(64px,1px)
    }
    to{
        -webkit-transform:translate(65px,0px);
        transform:translate(65px)
    }
}
.section p{
    font-size:1.2em;
    opacity:.5;
    -webkit-transition:opacity 3s .5s cubic-bezier(.28,.16,.42,.99);
    -o-transition:opacity 3s .5s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 3s .5s cubic-bezier(.28,.16,.42,.99);
    max-width:38.5em;
    text-align:left
}
.visible p{
    opacity:1
}
.planet-and-moon{
    position:absolute;
    left:50%;
    width:140px;
    height:auto;
    bottom:-12px;
    -webkit-transform:translateX(-50%);
    -ms-transform:translateX(-50%);
    transform:translate(-50%);
    background:#000;
    padding:0 30px;
    overflow:visible;
    color:#030512;
    -webkit-transition:color 3s .7s cubic-bezier(.28,.16,.42,.99);
    -o-transition:color 3s .7s cubic-bezier(.28,.16,.42,.99);
    transition:color 3s .7s cubic-bezier(.28,.16,.42,.99)
}
.visible .planet-and-moon{
    color:#fff;
    opacity:1
}
.section--first{
    background:#000;
    mix-blend-mode:lighten;
    margin-bottom:10%
}
.section--first .decoration,.section--first .title{
    background:#000
}
.br .section--first .button text,.de .section--first .button text{
    font-size:.9rem
}
.fr .section--first .button text{
    font-size:.78rem
}
.de .section--first span{
    font-size:.8em
}

.pulse{
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    -webkit-box-shadow:0 0 1px rgba(0,0,0,0);
    box-shadow:0 0 1px #0000
}
.pulse:hover{
    -webkit-animation-name:pulse;
    animation-name:pulse;
    -webkit-animation-duration:1.5s;
    animation-duration:1.5s;
    -webkit-animation-timing-function:linear;
    animation-timing-function:linear;
    -webkit-animation-iteration-count:infinite;
    animation-iteration-count:infinite
}
@-webkit-keyframes pulse{
    25%{
        -webkit-transform:scale(1.1);
        transform:scale(1.1)
    }
    75%{
        -webkit-transform:scale(.9);
        transform:scale(.9)
    }
}
@keyframes pulse{
    25%{
        -webkit-transform:scale(1.1);
        transform:scale(1.1)
    }
    75%{
        -webkit-transform:scale(.9);
        transform:scale(.9)
    }
}
.footer .copyright,.hover-link{
    font-size:12px;
    letter-spacing:.1em;
    text-transform:uppercase;
    line-height:1.8
}
.footer .copyright{
    font-size:10px;
    color:#acb2d0
}
.hover-link{
    position:relative;
    text-shadow:1px 0 0 rgba(3,5,18,1),2px 0 0 rgba(3,5,18,1),3px 0 0 rgba(3,5,18,1),-1px 0 0 rgba(3,5,18,1),-2px 0 0 rgba(3,5,18,1),-3px 0 0 rgba(3,5,18,1)
}
.hover-link.hover-link--large{
    font-size:1.125rem;
    text-transform:uppercase;
    color:#fff;
    font-weight:700;
    word-break:break-all
}
.hover-link:before{
    content:"";
    position:absolute;
    z-index:-1;
    width:100%;
    height:1px;
    bottom:.2em;
    left:0;
    background-color:#acb2d0;
    visibility:hidden;
    -webkit-transform:scaleX(0);
    -ms-transform:scaleX(0);
    transform:scaleX(0);
    -webkit-transition:all .3s ease-in-out 0s;
    -o-transition:all .3s ease-in-out 0s;
    transition:all .3s ease-in-out 0s
}
.hover-link:hover:before{
    visibility:visible;
    -webkit-transform:scaleX(1);
    -ms-transform:scaleX(1);
    transform:scaleX(1)
}
.revert:before{
    content:"";
    position:absolute;
    z-index:-1;
    width:100%;
    height:1px;
    bottom:.2em;
    left:0;
    background-color:#acb2d0;
    visibility:visible;
    -webkit-transform:scaleX(1);
    -ms-transform:scaleX(1);
    transform:scaleX(1)
}
.revert:hover:before{
    visibility:hidden;
    -webkit-transform:scaleX(0);
    -ms-transform:scaleX(0);
    transform:scaleX(0);
    -webkit-transition:all .3s ease-in-out 0s;
    -o-transition:all .3s ease-in-out 0s;
    transition:all .3s ease-in-out 0s
}
.logo-wall-first{
    display:flex;
    gap:.5em
}
.logo-wall-two-columns{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.logo-wall{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    font-size:30vmin
}
@media (min-width: 600px){
    .logo-wall{
        font-size:20vmin
    }
}
.logo-wall .logo-wall__logo{
    width:auto;
    height:1em
}
.logo-wall a:first-child{
    padding:0 .275em
}
.endslate{
    width:90%;
    height:auto;
    margin:0 auto
}
@media (min-width: 600px){
    .endslate{
        width:50%
    }
}
.center-block{
    display:-webkit-box;
    display:-ms-flexbox;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    width:calc(600px + 5rem);
    max-width:100%;
    gap:0 2.5rem;
    display:flex;
    flex-direction:row;
    flex-wrap:wrap;
    align-self:center;
    justify-content:center;
    margin:auto
}
.space{
    margin-top:5vmin
}
.space-sm{
    margin-top:3.8vmin
}
.endslate-logos{
    font-size:9vmin
}
@media (min-width: 600px){
    .endslate-logos{
        font-size:5vmin
    }
}
.hover-icon{
    -webkit-transition:-webkit-transform .3s cubic-bezier(.28,.16,.42,.99);
    transition:-webkit-transform .3s cubic-bezier(.28,.16,.42,.99);
    -o-transition:transform .3s cubic-bezier(.28,.16,.42,.99);
    transition:transform .3s cubic-bezier(.28,.16,.42,.99);
    transition:transform .3s cubic-bezier(.28,.16,.42,.99),-webkit-transform .3s cubic-bezier(.28,.16,.42,.99);
    width:120px
}
@media (min-width: 600px){
    .hover-icon{
        width:200px
    }
}
.hover-icon:hover{
    -webkit-transform:scale(.95);
    -ms-transform:scale(.95);
    transform:scale(.95)
}
.endslate-logos--small{
    font-size:6vmin
}
@media (min-width: 600px){
    .endslate-logos--small{
        font-size:4vmin
    }
}
.endslate-logos--large{
    font-size:32vmin
}
@media (min-width: 600px){
    .endslate-logos--large{
        font-size:10vmin
    }
}
.endslate-logos--large-mobile{
    font-size:14vmin
}
@media (min-width: 600px){
    .endslate-logos--large-mobile{
        font-size:7vmin
    }
}
.endslate-logos svg{
    width:auto;
    height:1em;
    display:block;
    overflow:visible
}
.endslate-logos img{
    width:auto;
    height:.75em;
    display:block;
    overflow:visible;
    margin-left:.5em
}
.logo-fill{
    color:#fff
}
.endslate-logos__inline{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
.endslate-logos__row{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
@media (min-width: 600px){
    .endslate-logos__row{
        -webkit-box-orient:horizontal;
        -webkit-box-direction:normal;
        -ms-flex-direction:row;
        flex-direction:row
    }
}
.endslate-logos .title.title--small{
    font-size:.55em;
    line-height:1
}
.endslate-logos .endslate-logos__seperator{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
@media (min-width: 600px){
    .endslate-logos .endslate-logos__seperator:before{
        content:"";
        width:1px;
        height:.8em;
        margin-top:.1em;
        margin-right:2vmin;
        border-left:1px solid #6a6f87
    }
}
.styleframe{
    margin-top:15%;
    margin-bottom:7%;
    position:relative
}
@media (orientation: landscape){
    .styleframe{
        margin-top:4%
    }
}
.styleframe__image{
    width:100%;
    height:auto;
    margin:0;
    display:block;
    position:relative;
    z-index:1;
    -webkit-box-shadow:0 0px 20px 20px rgba(3,5,18,.4);
    box-shadow:0 0 20px 20px #03051266
}
.styleframe__wrap{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    margin-bottom:20%;
    z-index:2
}
@media (orientation: landscape){
    .styleframe__wrap{
        margin-bottom:10%
    }
}
.textlockup{
    font-size:5vw;
    font-family:proxima-nova,sans-serif;
    font-weight:700;
    text-align:center;
    text-transform:uppercase;
    letter-spacing:.1em;
    line-height:1.5
}
.textlockup .row{
    opacity:1;
    -webkit-transform:scale(.8);
    -ms-transform:scale(.8);
    transform:scale(.8);
    -webkit-transform-origin:center center;
    -ms-transform-origin:center center;
    transform-origin:center center;
    -webkit-transition:opacity 3s cubic-bezier(.28,.16,.42,.99),-webkit-transform 3s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 3s cubic-bezier(.28,.16,.42,.99),-webkit-transform 3s cubic-bezier(.28,.16,.42,.99);
    -o-transition:opacity 3s cubic-bezier(.28,.16,.42,.99),transform 3s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 3s cubic-bezier(.28,.16,.42,.99),transform 3s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 3s cubic-bezier(.28,.16,.42,.99),transform 3s cubic-bezier(.28,.16,.42,.99),-webkit-transform 3s cubic-bezier(.28,.16,.42,.99)
}
.textlockup .row:last-child{
    -webkit-transition-duration:3.5s;
    -o-transition-duration:3.5s;
    transition-duration:3.5s
}
.visible .textlockup .row{
    opacity:1;
    -webkit-transform:scale(1);
    -ms-transform:scale(1);
    transform:scale(1)
}
@media (orientation: landscape){
    .textlockup{
        font-size:2.5vw;
        letter-spacing:.22em
    }
}
.textlockup .row{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
.textlockup small{
    font-size:.7em;
    font-weight:400;
    margin:.05em .7em 0
}
.animatedline{
    width:80%;
    margin:0 auto;
    opacity:0;
    -webkit-transition:opacity .5s;
    -o-transition:opacity .5s;
    transition:opacity .5s
}
@media (orientation: landscape){
    .animatedline{
        width:40%
    }
}
.visible .animatedline{
    opacity:1
}
.animatedline.animatedline--space{
    margin-top:1em;
    margin-bottom:1em
}
.subscribevideo-wrapper{
    display:flex;
    justify-content:center;
    align-items:center
}
.subscribevideo{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    height:150vw;
    position:relative
}
@media (min-width: 600px){
    .subscribevideo{
        min-height:64vw;
        height:50vw
    }
}
@media (min-width: 1300px){
    .subscribevideo{
        margin-top:10vmin;
        margin-bottom:2vmin;
        max-width:1348px;
        height:884px;
        min-height:884px
    }
}
.subscribevideo .animatedline{
    margin-top:.6em;
    margin-bottom:.6em
}
.accollades{
    width:100%;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:1rem
}
.awards-block{
    z-index:1;
    position:relative;
    left:0;
    top:0;
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-around;
    align-items:flex-start;
    padding:5rem 2rem 10rem;
    height:100%;
    width:100%
}
.awards-block svg{
    width:50%
}
@media (min-width: 600px){
    .awards-block{
        max-width:600px;
        padding:14% 6%;
        gap:1rem
    }
    .accollades{
        padding:0 2rem
    }
}
@media (min-width: 400px){
    .awards-block svg{
        width:150px;
        height:80px
    }
}
@media (min-width: 900px){
    .accollades img{
        max-width:876px
    }
    .awards-block{
        max-width:100%;
        padding:14% 12%
    }
    .awards-block svg{
        width:193px;
        height:107px
    }
}
@media (min-width: 1300px){
    .awards-block{
        height:100%;
        padding:16% 14% 20%;
        gap:99px
    }
}
.over{
    position:relative;
    z-index:2
}
.frame{
    position:absolute;
    background-size:100% 100%;
    z-index:1
}
.frame__top{
    top:-1px;
    left:0;
    right:0;
    height:10%;
    background-image:url(/assets/images/frame/top.png);
    background-size:auto 100%;
    background-repeat:repeat no-repeat
}
.frame__bottom{
    bottom:-1px;
    left:0;
    right:0;
    height:20%;
    background-image:url(/assets/images/frame/bottom.png);
    background-size:auto 100%;
    background-repeat:repeat no-repeat
}
.frame__left{
    top:0;
    bottom:0;
    left:0;
    width:10%;
    background-image:url(/assets/images/frame/left.png);
    background-size:100% auto;
    background-repeat:no-repeat repeat
}
.frame__right{
    top:0;
    bottom:0;
    right:0;
    width:10%;
    background-image:url(/assets/images/frame/right.png);
    background-size:100% auto;
    background-repeat:no-repeat repeat
}
.frame:after,.frame:before{
    content:"";
    position:absolute;
    background-size:100%;
    background-repeat:no-repeat;
    width:20%;
    height:auto;
    padding-bottom:20%
}
.frame__top:before{
    background-image:url(/assets/images/frame/topleftcorner.png);
    top:21%;
    left:3%
}
.frame__top:after{
    background-image:url(/assets/images/frame/toprightcorner.png);
    top:13%;
    right:1%
}
.frame__bottom:before{
    background-image:url(/assets/images/frame/bottomleftcorner.png);
    bottom:2%;
    left:5%
}
.frame__bottom:after{
    background-image:url(/assets/images/frame/bottomrightcorner.png);
    bottom:0%;
    right:2%
}
.signup-menu{
    width:100%
}
.signup-menu p{
    font-family:proxima-nova,sans-serif
}
.title-menu{
    font-size:calc(1.125em + .7vw);
    text-transform:capitalize;
    font-family:proxima-nova,sans-serif;
    font-weight:700;
    text-align:center;
    text-transform:uppercase;
    letter-spacing:.22em;
    line-height:1.5;
    max-width:100%;
    margin:0 auto
}
.signup-button{
    display:none
}
@media (orientation: landscape){
    .signup-button{
        display:inline
    }
}
.mailform,.mailform-menu{
    margin:2em 0 0;
    -ms-flex-item-align:stretch;
    align-self:stretch;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
    -ms-flex-direction:column;
    flex-direction:column;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
@media (orientation: landscape){
    .mailform,.mailform-menu{
        -ms-flex-item-align:center;
        -ms-grid-row-align:center;
        align-self:center
    }
}
input::-webkit-input-placeholder{
    font-family:brandon-grotesque,sans-serif;
    font-weight:400
}
input::-moz-placeholder{
    font-family:brandon-grotesque,sans-serif;
    font-weight:400
}
input:-ms-input-placeholder{
    font-family:brandon-grotesque,sans-serif;
    font-weight:400
}
input::-ms-input-placeholder{
    font-family:brandon-grotesque,sans-serif;
    font-weight:400
}
input,input::placeholder{
    font-family:brandon-grotesque,sans-serif;
    font-weight:400
}
.mailform input,.mailform-menu input{
    -webkit-box-flex:2;
    -ms-flex-positive:2;
    flex-grow:2;
    width:100%;
    margin:auto;
    padding:1em 7%;
    line-height:1;
    border:none;
    font-size:16px;
    color:#fff;
    outline:none;
    opacity:1;
    -webkit-transition:opacity 3s .7s cubic-bezier(.28,.16,.42,.99);
    -o-transition:opacity 3s .7s cubic-bezier(.28,.16,.42,.99);
    transition:opacity 3s .7s cubic-bezier(.28,.16,.42,.99)
}
.visible .mailform input,.visible .mailform-menu input{
    opacity:1
}
.mailform input::-webkit-input-placeholder,.mailform-menu input::-webkit-input-placeholder{
    color:#fff;
    font-size:16px;
    font-family:proxima-nova,sans-serif
}
.mailform input::-moz-placeholder,.mailform-menu input::-moz-placeholder{
    color:#fff;
    font-size:16px;
    font-family:proxima-nova,sans-serif
}
.mailform input:-ms-input-placeholder,.mailform-menu input:-ms-input-placeholder{
    color:#fff;
    font-size:16px;
    font-family:proxima-nova,sans-serif
}
.mailform input::-ms-input-placeholder,.mailform-menu input::-ms-input-placeholder{
    color:#fff;
    font-size:16px;
    font-family:proxima-nova,sans-serif
}
.mailform input::placeholder,.mailform-menu input::placeholder{
    color:#fff;
    font-size:16px;
    font-family:proxima-nova,sans-serif
}
@media (min-width: 768px){
    .mailform input{
        width:495px
    }
}
.input__wrap{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-item-align:stretch;
    align-self:stretch
}
.mailform input[type=email],.mailform-menu input[type=email]{
    background:none;
    border:1px solid white;
    font-size:16px;
    font-weight:400
}
.mailform .checkbox-container{
    display:flex;
    flex-direction:row;
    gap:1em;
    background:none;
    font-size:16px;
    font-weight:400;
    width:100%;
    align-self:flex-start;
    justify-content:center;
    margin:2rem 0
}
.mailform-menu .checkbox-container{
    display:flex;
    flex-direction:row;
    gap:1em;
    background:none;
    font-size:16px;
    font-weight:400;
    width:100%;
    align-self:flex-start;
    justify-content:center;
    margin:1rem 0 2rem
}
.checkbox-wrapper{
    position:relative;
    width:1.75rem;
    height:1.75rem;
    padding:0;
    margin-top:.25rem
}
.mailform .checkbox-container input[type=checkbox],.mailform-menu .checkbox-container input[type=checkbox]{
    -webkit-appearance:none;
    -moz-appearance:none;
    appearance:none;
    background-color:transparent;
    margin:0;
    font:inherit;
    color:#fff;
    width:100%;
    height:1rem;
    border:1px solid white;
    border-radius:.25rem;
    transform:translateY(-.075em);
    display:grid;
    place-content:center;
    padding:.75rem
}
.mailform .checkbox-container input[type=checkbox]:before,.mailform-menu .checkbox-container input[type=checkbox]:before{
    content:"";
    width:.75rem;
    height:.75rem;
    clip-path:polygon(14% 44%,0 65%,50% 100%,100% 16%,80% 0%,43% 62%);
    transform:scale(0);
    transform-origin:bottom left;
    transition:.12s transform ease-in-out;
    box-shadow:inset 1rem 1rem #fff;
    background-color:CanvasText
}
.mailform .checkbox-container input[type=checkbox]:checked:before,.mailform-menu .checkbox-container input[type=checkbox]:checked:before{
    transform:scale(1)
}
.mailform .checkbox-container p,.mailform-menu .checkbox-container p{
    width:100%;
    margin:0;
    font-size:.875rem;
    display:flex;
    align-items:center;
    font-family:proxima-nova,sans-serif
}
.mailform .button__wrap,.mailform-menu .button__wrap{
    background:#030512;
    position:relative;
    bottom:-4.2em;
    margin-top:-2em
}
.visible .mailform .button__wrap{
    opacity:1;
    padding:0 1em
}
.button-block{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.button-block .button{
    margin:0
}
@media (orientation: landscape){
    .mailform .button__wrap{
        bottom:-3.9em
    }
}
.mailform .button{
    margin:0 auto;
    padding:0;
    display:block;
    -webkit-animation:none;
    animation:none;
    color:#000;
    -webkit-transition:color 2s .5s linear;
    -o-transition:color 2s .5s linear;
    transition:color 2s .5s linear
}
.mailform-menu .button{
    margin:0 auto;
    padding:0;
    display:block;
    -webkit-animation:none;
    animation:none;
    color:#fff;
    -webkit-transition:color 2s .5s linear;
    -o-transition:color 2s .5s linear;
    transition:color 2s .5s linear;
    opacity:1
}
.visible .mailform .button{
    color:#fff
}
@media (orientation: landscape){
    .mailform .button{
        margin:0
    }
}
.image-reveal{
    -webkit-mask-image:url(/assets/images/mask3-1920.png);
    mask-image:url(/assets/images/mask3-1920.png);
    -webkit-mask-size:400% 400%;
    mask-size:400% 400%;
    -webkit-mask-position:0% 0%;
    mask-position:0% 0%
}
@media (min-width: 500px){
    .image-reveal{
        -webkit-mask-image:url(/assets/images/mask3.png);
        mask-image:url(/assets/images/mask3.png)
    }
}
.visible .image-reveal,.image-reveal.visible{
    -webkit-animation:mask-playzero 1s 0s steps(1) forwards;
    animation:mask-playzero 1s 0s steps(1) forwards
}
@-webkit-keyframes mask-playzero{
    0%{
        -webkit-mask-position:0% 0%;
        mask-position:0% 0%
    }
    10%{
        -webkit-mask-position:33.33% 0%;
        mask-position:33.33% 0%
    }
    14%{
        -webkit-mask-position:66.66% 0%;
        mask-position:66.66% 0%
    }
    18%{
        -webkit-mask-position:100% 0%;
        mask-position:100% 0%
    }
    22%{
        -webkit-mask-position:0% 33.33%;
        mask-position:0% 33.33%
    }
    26%{
        -webkit-mask-position:33.33% 33.33%;
        mask-position:33.33% 33.33%
    }
    30%{
        -webkit-mask-position:66.66% 33.33%;
        mask-position:66.66% 33.33%
    }
    35%{
        -webkit-mask-position:100% 33.33%;
        mask-position:100% 33.33%
    }
    40%{
        -webkit-mask-position:0% 66.66%;
        mask-position:0% 66.66%
    }
    45%{
        -webkit-mask-position:33.33% 66.66%;
        mask-position:33.33% 66.66%
    }
    50%{
        -webkit-mask-position:66.66% 66.66%;
        mask-position:66.66% 66.66%
    }
    55%{
        -webkit-mask-position:100% 66.66%;
        mask-position:100% 66.66%
    }
    60%{
        -webkit-mask-position:0% 100%;
        mask-position:0% 100%
    }
    65%{
        -webkit-mask-position:33.33% 100%;
        mask-position:33.33% 100%
    }
    70%{
        -webkit-mask-position:66.66% 100%;
        mask-position:66.66% 100%
    }
    75%,to{
        -webkit-mask-position:100% 100%;
        mask-position:100% 100%
    }
}
@keyframes mask-playzero{
    0%{
        -webkit-mask-position:0% 0%;
        mask-position:0% 0%
    }
    10%{
        -webkit-mask-position:33.33% 0%;
        mask-position:33.33% 0%
    }
    14%{
        -webkit-mask-position:66.66% 0%;
        mask-position:66.66% 0%
    }
    18%{
        -webkit-mask-position:100% 0%;
        mask-position:100% 0%
    }
    22%{
        -webkit-mask-position:0% 33.33%;
        mask-position:0% 33.33%
    }
    26%{
        -webkit-mask-position:33.33% 33.33%;
        mask-position:33.33% 33.33%
    }
    30%{
        -webkit-mask-position:66.66% 33.33%;
        mask-position:66.66% 33.33%
    }
    35%{
        -webkit-mask-position:100% 33.33%;
        mask-position:100% 33.33%
    }
    40%{
        -webkit-mask-position:0% 66.66%;
        mask-position:0% 66.66%
    }
    45%{
        -webkit-mask-position:33.33% 66.66%;
        mask-position:33.33% 66.66%
    }
    50%{
        -webkit-mask-position:66.66% 66.66%;
        mask-position:66.66% 66.66%
    }
    55%{
        -webkit-mask-position:100% 66.66%;
        mask-position:100% 66.66%
    }
    60%{
        -webkit-mask-position:0% 100%;
        mask-position:0% 100%
    }
    65%{
        -webkit-mask-position:33.33% 100%;
        mask-position:33.33% 100%
    }
    70%{
        -webkit-mask-position:66.66% 100%;
        mask-position:66.66% 100%
    }
    75%,to{
        -webkit-mask-position:100% 100%;
        mask-position:100% 100%
    }
}
.wishlist-logo{
    font-size:calc(2em + 1vw);
    width:auto;
    height:1em
}
#language-picker{
    --button-size: 50px;
    background-color:#f8f8f8;
    border-radius:8px;
    max-height:calc(var(--language-count) * var(--button-size) + var(--button-size) + var(--button-size) + 16px + 2px);
    width:var(--button-size);
    transition:all .3s ease-in-out;
    overflow:hidden;
    position:relative
}
#language-picker-button{
    background:transparent;
    border:none;
    margin:0;
    padding:0;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:center;
    width:var(--button-size);
    height:var(--button-size)
}
#language-picker-button svg.chevron{
    margin-left:8px;
    transition:all .2s ease-in-out;
    stroke:#000
}
#language-picker-button svg.chevron *{
    stroke:#fff
}
#language-picker.collapsed #language-picker-button svg.chevron{
    transform:rotate(180deg)
}
#language-picker.collapsed #language-picker-button svg.chevron *{
    stroke:#fff
}
#language-picker.collapsed{
    border-color:transparent;
    border-radius:0;
    max-height:var(--button-size);
    background-color:transparent
}
#language-picker img{
    width:1.5rem;
    height:1.5rem
}
#language-picker svg.border{
    position:absolute;
    top:0;
    left:0;
    pointer-events:none;
    height:calc(var(--button-size) - 2px);
    width:calc(var(--button-size) - 2px)
}
#language-picker svg.border rect{
    width:calc(var(--button-size) - 2px);
    transition:all .3s ease-in-out
}
#language-picker.collapsed svg.border rect{
    height:calc(var(--button-size) - 2px)
}
#language-picker ul{
    padding:8px 0;
    margin:0;
    display:flex;
    justify-content:center;
    align-items:center;
    flex-flow:column;
    gap:16px;
    list-style:none
}
#language-picker ul a{
    list-style:none;
    margin:0;
    flex-direction:column;
    align-items:center;
    text-align:center;
    display:flex
}
#language-picker ul a li{
    display:flex;
    flex-flow:column;
    align-items:center;
    height:var(--button-size);
    width:var(--button-size)
}
#language-picker ul a:last-child{
    margin-bottom:4px
}
#language-picker .dot{
    display:none;
    width:6px;
    height:6px;
    border-radius:100%;
    background-color:#fff;
    margin-top:4px
}
#language-picker ul.active-en .item-en .dot,#language-picker ul.active-de .item-de .dot,#language-picker ul.active-br .item-br .dot,#language-picker ul.active-jp .item-jp .dot{
    display:block
}
.sticky-footer{
    left:0;
    right:0;
    bottom:0;
    height:124px;
    background-image:url(/assets/images/frame/bottom2.png);
    background-size:auto 100%;
    background-repeat:repeat no-repeat;
    width:100%;
    display:flex;
    flex-direction:row;
    justify-content:center;
    cursor:pointer;
    z-index:10;
    position:sticky;
    gap:1rem
}
.sticky-footer .button__block-hero{
    justify-content:flex-end!important
}
.sticky-footer a{
    padding:.5rem .5rem .8rem 1rem!important
}
.sticky-footer .button .icon{
    top:1.1rem!important
}
.fr .sticky-footer{
    text-align:center;
    font-size:.8rem;
    height:130px
}
 



/* SVG icons */
.cls-title {
	fill: #251e1c;
}		
.cls-1 {
  fill: #fff;
}

.cls-2 {
  fill: #e0b8ce;
  /* fill: #ccc;   */
  opacity: 0.7;
}
.cls-3 {
	fill: #d1d1d1;
}

.cls-4 {
	fill: #707070;
}

.cls-5 {
	fill: #d584a5;
}

.cls-6 {
	fill: none;
	stroke: #1f1f1f;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 0px;
}

.cls-7 {
	fill: #c73946;
}

.cls-8 {
	fill: #1f1f1f;
}		

.cls-a {
	fill: none;
	stroke: #9d9d9d;
	stroke-dasharray: 0 0 1.3 1.3;
	stroke-linecap: round;
	stroke-miterlimit: 10;
	stroke-width: .43px;
}

.cls-b {
	fill: #bdbebe;
}		
