*, :after, :before {
    box-sizing: border-box
}

:after, :before {
    text-decoration: inherit;
    vertical-align: inherit
}

html {
    cursor: default;
    line-height: 1.5;
    -moz-tab-size: 4;
    -o-tab-size: 4;
    tab-size: 4;
    -webkit-tap-highlight-color: transparent;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    word-break: break-word
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

main {
    display: block
}

a {
    background-color: transparent
}

b {
    font-weight: bolder
}

code {
    font-family: monospace, monospace;
    font-size: 1em
}

img, svg {
    vertical-align: middle
}

img {
    border-style: none
}

svg:not([fill]) {
    fill: currentColor
}

svg:not(:root) {
    overflow: hidden
}

button, input {
    margin: 0
}

button {
    overflow: visible;
    text-transform: none
}

[type=button], [type=reset], [type=submit], button {
    -webkit-appearance: button
}

input {
    overflow: visible
}

[type=checkbox], [type=radio] {
    padding: 0
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto
}

::-webkit-input-placeholder {
    opacity: .54
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

::-moz-focus-inner {
    border-style: none;
    padding: 0
}

:-moz-focusring {
    outline: 1px dotted ButtonText
}

:-moz-ui-invalid {
    box-shadow: none
}

template {
    display: none
}

[tabindex], a, button, input, label {
    touch-action: manipulation
}

[hidden] {
    display: none
}

[aria-busy=true] {
    cursor: progress
}

[aria-controls] {
    cursor: pointer
}

[aria-disabled=true], [disabled] {
    cursor: not-allowed
}

[aria-hidden=false][hidden] {
    display: initial
}

[aria-hidden=false][hidden]:not(:focus) {
    clip: rect(0, 0, 0, 0);
    position: absolute
}

button, input {
    background-color: transparent;
    border: 1px solid WindowFrame;
    color: inherit;
    font: inherit;
    letter-spacing: inherit;
    padding: .25em .375em
}

::-ms-expand {
    display: none
}

:-ms-input-placeholder {
    color: rgba(0, 0, 0, .54)
}

html {
    font-family: system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji
}

code {
    font-family: Menlo, Consolas, Roboto Mono, "Ubuntu Monospace", Noto Mono, Oxygen Mono, Liberation Mono, monospace, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji
}

@font-face {
    font-family: Favorit;
    font-style: normal;
    src: url(/assets/fonts/FavoritPro-Light.woff2) format("woff2"), url(/assets/fonts/FavoritPro-Light.woff) format("woff")
}

@font-face {
    font-family: FavoritItalic;
    font-style: normal;
    src: url(/assets/fonts/FavoritPro-LightItalic.woff2) format("woff2"), url(/assets/fonts/FavoritPro-LightItalic.woff) format("woff")
}

body, html {
    font-family: Favorit, sans-serif
}

*, :after, :before {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    font-smoothing: antialiased
}

.mt-5 {
    margin-top: 5px
}

.mb-10 {
    margin-bottom: 10px
}

.mb-20 {
    margin-bottom: 20px
}

.ml-20 {
    margin-left: 20px
}

.mb-40 {
    margin-bottom: 40px
}

.mt-auto {
    margin-top: auto
}

.pt-10 {
    padding-top: 10px
}

.pt-15 {
    padding-top: 15px
}

.px-20 {
    padding-left: 20px;
    padding-right: 20px
}

.pb-20 {
    padding-bottom: 20px
}

.pt-20 {
    padding-top: 20px
}

.pr-20 {
    padding-right: 20px
}

.pt-50 {
    padding-top: 50px
}

.row {
    display: -webkit-box;
    display: flex;
    flex: 0 1 auto;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: 0;
    margin-right: 0
}

.col-12, .row {
    -webkit-box-flex: 0
}

.col-12 {
    box-sizing: border-box;
    flex: 0 0 auto;
    padding-left: 0;
    padding-right: 0;
    flex-basis: 100%;
    max-width: 100%
}

.hidden {
    display: none
}

.block {
    display: block
}

.flex {
    display: -webkit-box;
    display: flex
}

.overflow-hidden {
    overflow: hidden
}

.fixed {
    position: fixed
}

.absolute {
    position: absolute
}

.relative {
    position: relative
}

.pin-t {
    top: 0
}

.pin, .pin-r {
    right: 0
}

.pin {
    top: 0;
    bottom: 0;
    left: 0
}

.z-10 {
    z-index: 10
}

.z-20 {
    z-index: 20
}

.z-max {
    z-index: 2147483647
}

.flex-column {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

.justify-between {
    -webkit-box-pack: justify;
    justify-content: space-between
}

.items-center {
    -webkit-box-align: center;
    align-items: center
}

.h-full {
    height: 100%
}

.min-h-full {
    min-height: 100%
}

.text-center {
    text-align: center
}

body:after {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    width: 1px;
    height: 1px;
    margin: -1px 0 0 -1px;
    position: absolute;
    left: -1px;
    top: -1px;
    content: "all"
}

head {
    font-family: all
}

body {
    padding: 0;
    margin: 0
}

::-webkit-input-placeholder {
    opacity: 1;
    color: inherit
}

::-moz-placeholder {
    opacity: 1;
    color: inherit
}

:-ms-input-placeholder {
    opacity: 1;
    color: inherit
}

::-ms-input-placeholder {
    opacity: 1;
    color: inherit
}

::placeholder {
    opacity: 1;
    color: inherit
}

* {
    outline: none;
    -webkit-tap-highlight-color: transparent
}

a {
    text-decoration: none;
    color: inherit
}

input {
    padding: 0;
    margin: 0;
    border: none;
    background-color: transparent
}

input.-error {
    color: red
}

button {
    border: none;
    background-color: transparent;
    padding: 0;
    margin: 0;
    font-size: inherit;
    color: inherit;
    cursor: pointer
}

.text-medium {
    font-size: 26px;
    line-height: 35px
}

.text-lh-50 {
    line-height: 50px
}

.fz-md {
    font-size: 26px;
    line-height: 35px
}

.fg-muted, .gallery figcaption {
    color: #999
}

.icon {
    width: 40px;
    height: 40px
}

.icon--xs, .icon--xxs {
    width: 30px;
    height: 30px
}

.purchase-button {
    z-index: 999;
    position: fixed;
    display: none;
    bottom: 10px;
    left: 0;
    right: 0;
    text-align: center
}

.purchase-button button {
    height: 50px;
    display: block;
    margin: auto;
    padding: 0 15px;
    line-height: 44px;
    border: 1px solid #969696;
    border-radius: 54px;
    -webkit-transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1);
    transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1)
}

.no-touch .purchase-button button:hover, .touch .purchase-button button:active {
    background-color: #ddd;
    border-color: #ddd
}

.body--select-view .order-button, .body--success-view .order-button {
    display: none
}

.body--select-view .purchase-button, .body--success-view .purchase-button {
    display: block
}

.body--footer-view .order-button {
    display: none
}

.order-button {
    position: fixed;
    z-index: 999;
    right: 15px;
    bottom: 15px;
    -webkit-transition: .45s cubic-bezier(.68, -.55, .265, 1.55);
    transition: .45s cubic-bezier(.68, -.55, .265, 1.55);
    will-change: transform
}

.no-touch .order-button:hover, .touch .order-button:active {
    -webkit-transform: rotate(1turn);
    transform: rotate(1turn)
}

.order-icon {
    width: 100px;
    height: 100px
}

.side {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: 60px;
    box-sizing: border-box;
    padding: 20px 0 25px;
    border-right: 1px solid #969696;
    display: none
}

.logo-icon {
    height: 20px;
    width: 160px;
    display: block
}

.main {
    min-height: 100vh;
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

.main.main--full {
    position: fixed;
    min-height: auto;
    height: 100%
}

.tag-head {
    border-bottom: 1px solid #969696;
    padding: 0 20px;
    line-height: 60px
}

.nav {
    margin-top: auto
}

.nav-head {
    padding: 15px 20px 0
}

.nav-head.nav-head--slim {
    padding-top: 0
}

.nav-head-additional {
    top: -6px;
    right: 0
}

.nav-icon {
    position: absolute;
    right: 0;
    top: 0;
    margin-right: -45px;
    -webkit-transition: -webkit-transform .25s cubic-bezier(.165, .84, .44, 1);
    transition: -webkit-transform .25s cubic-bezier(.165, .84, .44, 1);
    transition: transform .25s cubic-bezier(.165, .84, .44, 1);
    transition: transform .25s cubic-bezier(.165, .84, .44, 1), -webkit-transform .25s cubic-bezier(.165, .84, .44, 1)
}

.nav-icon.-bomb {
    margin-right: -40px
}

.nav-item {
    border-top: 1px solid #969696;
    padding: 0 20px
}

.nav-a {
    display: inline-block;
    font-size: 24px;
    line-height: 45px;
    position: relative
}

.no-touch .nav-a:hover .nav-icon, .touch .nav-a:active .nav-icon {
    -webkit-transform: scale(1.3) rotate(5deg);
    transform: scale(1.3) rotate(5deg)
}

.border-r {
    border-right: 1px solid #969696
}

.c-2, .c-3, .c-half {
    float: left;
    width: 100%
}

.field-text {
    display: block;
    font-size: 36px;
    line-height: 50px;
    width: 100%
}

.field.-error {
    color: red
}

.submit {
    line-height: 50px;
    padding: 0 20px;
    white-space: nowrap;
    border-radius: 54px;
    border: 1px solid #969696;
    margin: auto;
    -webkit-transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1);
    transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1)
}

.no-touch .submit:hover, .touch .submit:active {
    background-color: #ddd;
    border-color: transparent
}

.bg-imgs {
    position: absolute;
    overflow: hidden;
    height: 100%;
    width: 100%
}

.bg-imgs img {
    display: block;
    max-width: 35%;
    max-height: 45%
}

.bg-imgs img:first-child {
    margin-left: 98.9914038141%;
    margin-top: 10.2295860455%
}

.bg-imgs img:nth-child(2) {
    margin-left: 57.8164597207%;
    margin-top: 90.4516141772%
}

.bg-imgs img:nth-child(3) {
    margin-left: 44.445005318%;
    margin-top: 52.8051371562%
}

.bg-imgs img:nth-child(4) {
    margin-left: 56.0752436853%;
    margin-top: 21.5485087077%
}

.bg-imgs img:nth-child(5) {
    margin-left: 43.0586779976%;
    margin-top: 95.3443825205%
}

.bg-imgs img:nth-child(6) {
    margin-left: 60.7116429899%;
    margin-top: 48.7046053933%
}

.bg-imgs img:nth-child(7) {
    margin-left: 38.2478612852%;
    margin-top: 93.0263695137%
}

.bg-imgs img:nth-child(8) {
    margin-left: 36.1182919529%;
    margin-top: 66.2110352869%
}

.bg-imgs img:nth-child(9) {
    margin-left: 86.2894707434%;
    margin-top: 12.0661810765%
}

.bg-imgs img:nth-child(10) {
    margin-left: 67.3405165759%;
    margin-top: .8236154842%
}

.bg-imgs img:nth-child(11) {
    margin-left: 4.9128537227%;
    margin-top: 3.6963641372%
}

.bg-imgs img:nth-child(12) {
    margin-left: 61.6699244418%;
    margin-top: 31.2661951934%
}

.bg-imgs img:nth-child(13) {
    margin-left: 88.5060538133%;
    margin-top: 91.0561797637%
}

.bg-imgs img:nth-child(14) {
    margin-left: 47.1629483451%;
    margin-top: 38.6398863196%
}

.bg-imgs img:nth-child(15) {
    margin-left: 68.8615161462%;
    margin-top: 83.0846006327%
}

.bg-imgs img:nth-child(16) {
    margin-left: 23.4179566338%;
    margin-top: 29.7815109174%
}

.bg-imgs img:nth-child(17) {
    margin-left: 83.9612179249%;
    margin-top: 64.2223115725%
}

.bg-imgs img:nth-child(18) {
    margin-left: 21.4676978852%;
    margin-top: 35.625470362%
}

.bg-imgs img:nth-child(19) {
    margin-left: 47.2363561747%;
    margin-top: 92.7293653016%
}

.bg-imgs img:nth-child(20) {
    margin-left: 38.8446558038%;
    margin-top: 17.2912296472%
}

.bg-imgs img:nth-child(21) {
    margin-left: 90.1289594597%;
    margin-top: 13.4523672645%
}

.bg-imgs img:nth-child(22) {
    margin-left: 62.9166620051%;
    margin-top: 60.2026428057%
}

.bg-imgs img:nth-child(23) {
    margin-left: 97.4596852287%;
    margin-top: 62.9584980665%
}

.bg-imgs img:nth-child(24) {
    margin-left: 56.6929381665%;
    margin-top: 46.3966891226%
}

.bg-imgs img:nth-child(25) {
    margin-left: 99.78986659%;
    margin-top: 64.3150305251%
}

.bg-imgs img:nth-child(26) {
    margin-left: 45.5503414418%;
    margin-top: 93.1161448261%
}

.bg-imgs img:nth-child(27) {
    margin-left: 61.9782436284%;
    margin-top: 47.6051292312%
}

.bg-imgs img:nth-child(28) {
    margin-left: 85.1675171122%;
    margin-top: 21.9812017148%
}

.bg-imgs img:nth-child(29) {
    margin-left: 72.744379091%;
    margin-top: 68.1948652896%
}

.bg-imgs img:nth-child(30) {
    margin-left: 76.6240599419%;
    margin-top: 49.8228015556%
}

.bg-imgs img:nth-child(31) {
    margin-left: 85.5006624268%;
    margin-top: 21.4346905854%
}

.bg-imgs img:nth-child(32) {
    margin-left: 93.4005188057%;
    margin-top: 95.3457180217%
}

.bg-imgs img:nth-child(33) {
    margin-left: 22.3039542932%;
    margin-top: 57.5892366403%
}

.bg-imgs img:nth-child(34) {
    margin-left: 19.4842827799%;
    margin-top: 99.2501346541%
}

.bg-imgs img:nth-child(35) {
    margin-left: 72.4252804522%;
    margin-top: 9.9861538377%
}

.bg-imgs img:nth-child(36) {
    margin-left: 8.0257786048%;
    margin-top: 16.6660800696%
}

.bg-imgs img:nth-child(37) {
    margin-left: 8.8387680709%;
    margin-top: 90.4218809696%
}

.bg-imgs img:nth-child(38) {
    margin-left: 57.6732406345%;
    margin-top: 33.0821864566%
}

.bg-imgs img:nth-child(39) {
    margin-left: 14.5427035498%;
    margin-top: 41.3480923453%
}

.bg-imgs img:nth-child(40) {
    margin-left: 12.8842213354%;
    margin-top: 47.4401713701%
}

.bg-imgs img:nth-child(41) {
    margin-left: 78.6505152764%;
    margin-top: 50.0307868996%
}

.bg-imgs img:nth-child(42) {
    margin-left: 70.3565502192%;
    margin-top: 17.9459467352%
}

.bg-imgs img:nth-child(43) {
    margin-left: 34.0761046403%;
    margin-top: 2.8116630697%
}

.bg-imgs img:nth-child(44) {
    margin-left: 38.8491522711%;
    margin-top: 38.3417532138%
}

.bg-imgs img:nth-child(45) {
    margin-left: 58.5024789996%;
    margin-top: 4.5560801295%
}

.bg-imgs img:nth-child(46) {
    margin-left: 76.1854643624%;
    margin-top: 96.4666635902%
}

.bg-imgs img:nth-child(47) {
    margin-left: 86.2360393323%;
    margin-top: 10.512333396%
}

.bg-imgs img:nth-child(48) {
    margin-left: .3801801724%;
    margin-top: 32.5160819794%
}

.bg-imgs img:nth-child(49) {
    margin-left: 67.1457221649%;
    margin-top: 26.0314387296%
}

.bg-imgs img:nth-child(50) {
    margin-left: 2.0487795258%;
    margin-top: 30.3292273561%
}

.bg-imgs img:nth-child(51) {
    margin-left: 3.8753257704%;
    margin-top: 65.4835877241%
}

.bg-imgs img:nth-child(52) {
    margin-left: 80.0780893762%;
    margin-top: 57.9057601812%
}

.bg-imgs img:nth-child(53) {
    margin-left: 46.0285277313%;
    margin-top: 13.6272290905%
}

.bg-imgs img:nth-child(54) {
    margin-left: 38.3144033399%;
    margin-top: 81.5519285097%
}

.bg-imgs img:nth-child(55) {
    margin-left: 72.3973950947%;
    margin-top: 71.3401535475%
}

.bg-imgs img:nth-child(56) {
    margin-left: 83.9135392049%;
    margin-top: 25.7904430202%
}

.bg-imgs img:nth-child(57) {
    margin-left: 72.9491022298%;
    margin-top: 62.5493813295%
}

.bg-imgs img:nth-child(58) {
    margin-left: 11.590494034%;
    margin-top: 11.6711908353%
}

.bg-imgs img:nth-child(59) {
    margin-left: 15.7945429613%;
    margin-top: 97.689662577%
}

.bg-imgs img:nth-child(60) {
    margin-left: 80.7116979693%;
    margin-top: 57.9040728463%
}

.bg-imgs img:nth-child(61) {
    margin-left: 60.9798324976%;
    margin-top: 55.4815839064%
}

.bg-imgs img:nth-child(62) {
    margin-left: 81.7461948807%;
    margin-top: 95.2282872611%
}

.bg-imgs img:nth-child(63) {
    margin-left: 20.5842246975%;
    margin-top: 67.8598000639%
}

.bg-imgs img:nth-child(64) {
    margin-left: 77.1439615271%;
    margin-top: 73.4571688471%
}

.bg-imgs img:nth-child(65) {
    margin-left: 6.2346194504%;
    margin-top: 42.5951222662%
}

.bg-imgs img:nth-child(66) {
    margin-left: 91.1154078755%;
    margin-top: 83.6845601944%
}

.bg-imgs img:nth-child(67) {
    margin-left: 31.4870826429%;
    margin-top: 77.0394224764%
}

.bg-imgs img:nth-child(68) {
    margin-left: 82.7929350078%;
    margin-top: 5.6252537839%
}

.bg-imgs img:nth-child(69) {
    margin-left: 28.9416878359%;
    margin-top: 74.3018041776%
}

.bg-imgs img:nth-child(70) {
    margin-left: 96.1317738088%;
    margin-top: 26.110165374%
}

.bg-imgs img:nth-child(71) {
    margin-left: 37.908190004%;
    margin-top: 82.6677649983%
}

.bg-imgs img:nth-child(72) {
    margin-left: 38.44638743%;
    margin-top: 70.4907140281%
}

.bg-imgs img:nth-child(73) {
    margin-left: 76.1429584628%;
    margin-top: 90.8915557578%
}

.bg-imgs img:nth-child(74) {
    margin-left: 18.4244853803%;
    margin-top: 67.7351272657%
}

.bg-imgs img:nth-child(75) {
    margin-left: 90.6453083191%;
    margin-top: 20.2942016286%
}

.bg-imgs img:nth-child(76) {
    margin-left: 33.8919196713%;
    margin-top: 92.3408615423%
}

.bg-imgs img:nth-child(77) {
    margin-left: .6797239848%;
    margin-top: 80.0637110535%
}

.bg-imgs img:nth-child(78) {
    margin-left: 69.8959477772%;
    margin-top: 32.2706844685%
}

.bg-imgs img:nth-child(79) {
    margin-left: 10.0165495717%;
    margin-top: 95.541973896%
}

.bg-imgs img:nth-child(80) {
    margin-left: 86.7382019525%;
    margin-top: 56.7942365763%
}

.bg-imgs img:nth-child(81) {
    margin-left: 17.5426150026%;
    margin-top: 89.8222277497%
}

.bg-imgs img:nth-child(82) {
    margin-left: 98.2210045941%;
    margin-top: 81.1197732455%
}

.bg-imgs img:nth-child(83) {
    margin-left: 95.4121670174%;
    margin-top: 82.7553400545%
}

.bg-imgs img:nth-child(84) {
    margin-left: 44.3461381693%;
    margin-top: 58.7985689969%
}

.bg-imgs img:nth-child(85) {
    margin-left: 55.2412566027%;
    margin-top: 4.4228945411%
}

.bg-imgs img:nth-child(86) {
    margin-left: 90.443171378%;
    margin-top: 36.8080835836%
}

.bg-imgs img:nth-child(87) {
    margin-left: 44.9493199742%;
    margin-top: 48.3724999969%
}

.bg-imgs img:nth-child(88) {
    margin-left: 20.0583258554%;
    margin-top: 14.6640247113%
}

.bg-imgs img:nth-child(89) {
    margin-left: 97.0520022545%;
    margin-top: 90.6724468085%
}

.bg-imgs img:nth-child(90) {
    margin-left: 39.2885805847%;
    margin-top: 15.0175643523%
}

.bg-imgs img:nth-child(91) {
    margin-left: 55.4942248665%;
    margin-top: 35.1694303116%
}

.bg-imgs img:nth-child(92) {
    margin-left: 51.9938321616%;
    margin-top: 15.395295382%
}

.bg-imgs img:nth-child(93) {
    margin-left: 80.3934641397%;
    margin-top: 89.1728831498%
}

.bg-imgs img:nth-child(94) {
    margin-left: 84.5996347056%;
    margin-top: 96.9861462063%
}

.bg-imgs img:nth-child(95) {
    margin-left: 59.7938539206%;
    margin-top: 75.7156692644%
}

.bg-imgs img:nth-child(96) {
    margin-left: 85.4501107565%;
    margin-top: 36.6282427628%
}

.bg-imgs img:nth-child(97) {
    margin-left: 3.0345128413%;
    margin-top: 90.4555200029%
}

.bg-imgs img:nth-child(98) {
    margin-left: 59.3811193386%;
    margin-top: 91.0386737748%
}

.bg-imgs img:nth-child(99) {
    margin-left: 29.3985968177%;
    margin-top: 17.0420226768%
}

.bg-imgs img:nth-child(100) {
    margin-left: 48.5235849558%;
    margin-top: 55.8460163191%
}

.sorry-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
}

.button {
    padding: 0 15px;
    border: 1px solid #969696;
    border-radius: 54px;
    -webkit-transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1);
    transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1)
}

.button--is-active, .no-touch .button:hover, .touch .button:active {
    background-color: #ddd;
    border-color: transparent
}

.button--is-active {
    pointer-events: none
}

.button--with-icon {
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center
}

[data-vjuh-body] {
    position: fixed;
    top: 0;
    right: 0;
    left: 0
}

[data-behavior=showifhide] {
    display: none
}

.tbrl, [data-behavior=showifhide].is-visible {
    display: block
}

.tbrl {
    -webkit-writing-mode: tb;
    -ms-writing-mode: tb;
    writing-mode: tb;
    line-height: 59px;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.tbrl-icon {
    display: block;
    margin-left: -10px
}

.images {
    top: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    display: none
}

.images, .images > * {
    position: absolute
}

.images > :first-child {
    width: 30%;
    top: 10%;
    left: 30%
}

.images > :nth-child(2) {
    width: 19%;
    top: 96%;
    left: 5%
}

.images > :nth-child(3) {
    width: 40%;
    top: 162%;
    left: 42%
}

.images > :nth-child(4) {
    width: 28%;
    top: 228%;
    left: 36%
}

.images > :nth-child(5) {
    width: 19%;
    top: 300%;
    left: -1%
}

.images > :nth-child(6) {
    width: 48%;
    left: 40%;
    top: 336%
}

.images > :nth-child(7) {
    top: 395%;
    width: 27%;
    left: 8%
}

.images > :nth-child(8) {
    top: 490%;
    width: 22%;
    left: 47%
}

.images > :nth-child(9) {
    top: 543%;
    width: 23%;
    right: 1%
}

.images > :nth-child(10) {
    width: 25%;
    top: 601%
}

.images > :nth-child(11) {
    width: 40%;
    top: 669%;
    left: 39%
}

.images > :nth-child(12) {
    width: 27%;
    top: 767%
}

.images > :nth-child(13) {
    width: 23%;
    left: 58%;
    top: 846%
}

.images > :nth-child(14) {
    width: 40%;
    top: 935%
}

.images > :nth-child(15) {
    width: 27%;
    left: 44%;
    top: 1129%
}

.inst-mobile {
    top: 20px;
    right: 20px
}

.kt-block p {
    margin: 0 0 50px
}

.kt-block p:last-child {
    margin-bottom: 0
}

.about-head-content {
    max-width: 900px;
    padding-right: 35px
}

.cancel-button {
    display: inline-block;
    margin-top: 10px;
    line-height: 20px
}

.footer {
    margin-top: auto
}

.footer:before {
    content: "";
    display: block;
    width: 100%;
    height: 1px;
    background-color: #969696;
    margin-top: -1px
}

.footer__content {
    padding: 20px 20px 25px
}

em, i {
    font-family: FavoritItalic;
    font-style: normal
}

.kt-content a {
    border: 1px solid #969696;
    padding: 0 5px;
    border-radius: 1em;
    -webkit-transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1);
    transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1)
}

.no-touch .kt-content a:hover, .touch .kt-content a:active {
    background-color: #ddd;
    border-color: transparent
}

.gallery {
    -webkit-box-flex: 1;
    flex-grow: 1;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center
}

.gallery img {
    display: block;
    width: 100%
}

.gallery figure {
    margin: 0;
    padding: 0
}

.gallery figcaption {
    padding: 10px 20px
}

.project-link {
    -webkit-transition: background-color .2s cubic-bezier(.39, .575, .565, 1);
    transition: background-color .2s cubic-bezier(.39, .575, .565, 1)
}

.no-touch .project-link:hover, .touch .project-link:active {
    background-color: rgba(0, 0, 0, .033)
}

.turbolinks-progress-bar {
    height: 2px;
    background-color: #000
}

img[data-src] {
    opacity: 0
}

.overlay {
    position: fixed;
    bottom: 10px;
    left: 10px;
    right: 10px;
    display: -webkit-box;
    display: flex;
    border: 1px solid #969696;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    background-color: #fff;
    z-index: 9999;
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: opacity .15s, -webkit-transform .25s;
    transition: opacity .15s, -webkit-transform .25s;
    transition: opacity .15s, transform .25s;
    transition: opacity .15s, transform .25s, -webkit-transform .25s
}

.is-hidden .overlay {
    opacity: 0;
    -webkit-transform: translate3d(0, 20px, 0);
    transform: translate3d(0, 20px, 0)
}

.overlay-body {
    padding: 20px
}

.overlay-text {
    font-size: 18px;
    line-height: 25px
}

.overlay-footer {
    max-width: 350px;
    margin: auto
}

.cells {
    margin-right: -1px
}

.cell {
    border-bottom: 1px solid #969696;
    border-right: 1px solid #969696;
    background-repeat: no-repeat;
    background-size: contain;
    background-position: 50%;
    position: relative;
    box-sizing: border-box
}

.cell.h-1\/2, .cell.h-full {
    height: 300px
}

.cell-same {
    display: none;
    position: absolute;
    bottom: 20px;
    left: 20px;
    -webkit-transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1);
    transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1);
    border: 1px solid #969696;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    border-radius: 100px;
    box-sizing: border-box;
    font-size: 16px;
    letter-spacing: .025em
}

.no-touch .cell-same:hover, .touch .cell-same:active {
    background-color: #ddd;
    border-color: #ddd
}

.no-touch .body--same-view .cell:hover .cell-same {
    display: block
}

.cell-select {
    display: none;
    bottom: 20px;
    left: 20px
}

.cell-select, .cell-select input {
    cursor: pointer;
    position: absolute
}

.cell-select input {
    opacity: 0;
    width: 100%;
    height: 100%
}

.cell-select span {
    display: inline-block;
    -webkit-transition: .25s cubic-bezier(.165, .84, .44, 1);
    transition: .25s cubic-bezier(.165, .84, .44, 1);
    border: 1px solid #969696;
    height: 30px;
    line-height: 28px;
    padding: 0 10px;
    border-radius: 100px;
    font-size: 16px;
    letter-spacing: .025em;
    -webkit-transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1);
    transition: background-color .2s cubic-bezier(.39, .575, .565, 1), border-color .2s cubic-bezier(.39, .575, .565, 1)
}

.no-touch .cell-select span:hover, .touch .cell-select span:active {
    background-color: #ddd;
    border-color: #ddd
}

.cell-select input:checked + span {
    background-color: #000;
    color: #fff;
    border-color: transparent
}

.body--select-view .cell-select {
    display: block
}

@media only screen and (min-width: 667px) {
    .xs\:pt-20 {
        padding-top: 20px
    }

    .xs\:hidden {
        display: none
    }

    .xs\:block {
        display: block
    }

    body:after {
        content: "xs"
    }

    head {
        font-family: xs
    }

    .fz-md {
        font-size: 36px;
        line-height: 45px
    }

    .icon {
        width: 45px;
        height: 45px
    }

    .icon--xs {
        width: 35px;
        height: 35px
    }

    .purchase-button {
        bottom: 25px;
        left: 60px
    }

    .order-button {
        right: 30px;
        bottom: 30px
    }

    .order-icon {
        width: 120px;
        height: 120px
    }

    .side {
        display: block
    }

    .logo.\--from-xs {
        display: none
    }

    .logo-icon {
        height: 160px;
        width: 20px;
        margin: auto
    }

    .main {
        padding-left: 60px
    }

    .nav-head {
        padding: 0 20px;
        line-height: 50px
    }

    [data-vjuh-body] {
        left: 60px
    }

    .overlay {
        left: auto;
        right: 30px;
        bottom: 30px
    }

    .overlay-body {
        padding: 35px;
        max-width: 550px
    }
}

@media only screen and (min-width: 768px) {
    .row {
        margin-left: 0;
        margin-right: 0
    }

    .col-12 {
        padding-left: 0;
        padding-right: 0
    }

    body:after {
        content: "sm"
    }

    head {
        font-family: sm
    }

    .c-3 {
        width: 60%
    }

    .c-2 {
        width: 40%
    }

    .c-half {
        width: 50%
    }

    .images {
        display: block
    }

    .footer__content {
        width: 60%
    }

    .cell.h-1\/2 {
        height: 250px
    }

    .cell.h-full {
        height: 500px
    }
}

@media only screen and (min-width: 900px) {
    .md\:col {
        -webkit-box-flex: 0;
        flex: 0 0 auto;
        -webkit-box-flex: 1;
        flex-grow: 1;
        flex-basis: 0;
        max-width: 100%
    }

    .md\:col, .md\:col-1 {
        box-sizing: border-box;
        padding-left: 0;
        padding-right: 0
    }

    .md\:col-1 {
        -webkit-box-flex: 0;
        flex: 0 0 auto;
        flex-basis: 8.3333333333%;
        max-width: 8.3333333333%
    }

    body:after {
        content: "md"
    }

    head {
        font-family: md
    }
}

@media only screen and (min-width: 900px) and (min-width: 768px) {
    .md\:col, .md\:col-1 {
        padding-left: 0;
        padding-right: 0
    }
}

#neworder {
    position: fixed;
    right: 30px;
    bottom: 30px;
    width: 120px;
    height: 120px;
    background: #fff;
    border-radius: 50%;
    padding: 0;
    border: none;
    cursor: pointer;
    z-index: 10;
    transition: 0.35s cubic-bezier(0.37, -0.75, 0.63, 1.62);
    will-change: transform;
}
#neworder:hover {
    transform: rotate(1turn);
}
#neworder svg {
    width: 100%;
    height: 100%;
    display: block;
}

.modal-overlay {
    opacity: 0;
    position: fixed;
    right: 0;
    bottom: 0;
    top: 0;
    left: 0;
    z-index: 19;
    background-color: rgb(250 250 255 / 63%);
    transition: opasity 0.45s, transform 0.25s ease-out;
    visibility: hidden;
}
.modal-overlay.show {
    opacity: 1;
    transition: opasity 0.45s;
    visibility: visible;
}

body.open-modal {
    overflow: hidden;
}

body.open-modal .main {
    filter: grayscale(1);
    opacity: .1;
}

body.open-modal .images {
    filter: grayscale(1);
    opacity: .5;
}

.modal {
    pointer-events: none;
    opacity: 0;
    display: flex;
    flex-direction: column;
    position: fixed;
    right: 0;
    bottom: 0;
    top: 0;
    z-index: 20;
    border-left: 1px solid #e1e1e1;
    background-color: #fff;
    transform: translate3d(32px, 0, 0);
    padding: 48px 24px 36px 24px;
    max-width: 544px;
    transition: opasity 0.45s, transform 0.35s ease-in-out;
}

@media only screen and (min-width: 768px){
    .modal {
        padding: 48px 36px 36px 36px;
    }
}


.modal.show {
    opacity: 1;
    transform: translateZ(0);
    pointer-events: all;
}

.modal .lw_info {
    margin: 0 0 36px;
    font-size: 21px;
    line-height: 32px;
}
.modal form {
    display: flex;
    flex-direction: column;
    margin-top: auto;
}
.modal form label {
    margin: 0 0 12px;
    font-size: 21px;
    line-height: 32px;
}
.modal form input {
    display: block;
    font-size: 36px;
    font-family: inherit;
    width: 100%;
    border: 1px solid #ededed;
    padding: 6px 12px;
    line-height: 1;
    outline: none;
    background: #fff;
    transition: border-color 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
}
.modal form input:hover {
    border: 1px solid #d0d0d0;
}
.modal form input:active, .modal form input:focus {
    border: 1px solid #b5b5b5;
}
.modal form input::placeholder {
    color: #969696;
    line-height: 1;
}
.modal form input:invalid ~ button {
    opacity: 0.5;
}
.modal form button.lw_order_btn {
    padding: 6px 24px;
    white-space: nowrap;
    border-radius: 54px;
    border: 1px solid #000;
    margin: 0 16px 0 0;
    font-size: 36px;
    line-height: 45px;
    background: transparent;
    font-family: inherit;
    display: block;
    cursor: pointer;
    outline: none;
    transition: background-color 0.1s cubic-bezier(0.39, 0.575, 0.565, 1), border-color 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
}
.modal form button.lw_order_btn:hover, .modal form button.lw_order_btn:focus {
    color: #616161;
    border-color: #616161;
}
.modal form .validate_message {
    opacity: 0;
    transition: opacity 0.1s cubic-bezier(0.39, 0.575, 0.565, 1);
    color: #ed6a6a;
    line-height: 16px;
    margin: 4px 0 12px;
}
.modal form .validate_message.show {
    opacity: 1;
}
.modal .close {
    position: absolute;
    right: 8px;
    top: 8px;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
}
.modal .close__path {
    fill: #b5b5b5;
}
.modal .close:hover .close__path {
    fill: #969696;
}
.modal .close svg {
    display: block;
    width: 100%;
    height: 100%;
}


.no-touch .body--same-view .cell:hover .lw_btns {
    display: flex
}

.touch .body--same-view .cell .lw_btns {
    display: flex
}


.lw_btns {
    display: none;
    column-gap: 8px;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20px;
    width: 100%;
    justify-content: space-between;
}

.lw_btns > div {
    display: flex;
    column-gap: 8px;
}


.lw_s_btn {
    transition: background-color 0.2s cubic-bezier(0.39, 0.575, 0.565, 1), border-color 0.2s cubic-bezier(0.39, 0.575, 0.565, 1);
    border: 1px solid #969696;
    height: 30px;
    line-height: 30px;
    padding: 0 10px;
    border-radius: 100px;
    font-size: 16px;
    letter-spacing: 0.025em;
    cursor: pointer;
    background: #fff;
    display: inline-flex;
}
.lw_info .lw_s_btn {
    cursor: default;
}
.lw_s_btn:hover {
    background-color: #ddd;
    border-color: #ddd;
}
.lw_s_btn.active {
    background-color: #000;
    border-color: #000;
    color: #fff;
}

.lw_works_intro {
    margin: 0 0 18px;
    font-size: 21px;
    line-height: 32px;
}

.lw_works {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    height: 100%;
    overflow-y: auto;
    align-content: start;
    padding: 8px;
    margin: -8px -8px 16px;
}
.lw_works__item {
    position: relative;
    padding: 8px;
    border: 1px solid #ededed;
    border-radius: 16px;
}
.lw_works__item.lw_works__hover_del {
    border-color: #ed6a6a;
}
.lw_works__item.lw_works__hover_revert {
    border-color: #53a24f;
}
.lw_works__item.lw_works__del .lw_works__inner {
    opacity: 0.2;
}
.lw_works__item.lw_works__del .lw_works__revert {
    display: flex;
    background: #c3ddc1;
    color: #53a24f;
}
.lw_works__item img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}
.lw_works__item_default {
    border-radius: 16px;
    background: #ededed;
    height: 128px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
}
.lw_works__close {
    display: flex;
    width: 24px;
    height: 24px;
    border: none;
    background: #ededed;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    top: -8px;
    right: -8px;
    padding: 0;
    align-items: center;
    justify-content: center;
}
.lw_works__close:hover {
    background: #ddd;
}
.lw_works__close svg {
    width: 12px;
    height: 12px;
    fill: black;
    display: block;
}
.lw_works__revert {
    display: none;
    width: 24px;
    height: 24px;
    border: none;
    background: #ededed;
    border-radius: 50%;
    cursor: pointer;
    position: absolute;
    top: -8px;
    right: -8px;
    padding: 0;
    align-items: center;
    justify-content: center;
}
.lw_works__revert:hover {
    background: #ddd;
}
.lw_works__revert svg {
    width: 10px;
    height: 10px;
    fill: black;
    display: block;
}

.lw_order_wrap {
    display: flex;
    align-items: baseline;
}
.lw_order_wrap__text {
    font-size: 21px;
    visibility: hidden;
    opacity: 0;
}

.lw_order_wrap__text.show {
    visibility: visible;
    opacity: .5;
    transition: opacity 1s;
}

.lw_input_error {
    border-color: #ed6a6a;
}

/*

 */
.loading-animation {
    position: absolute;
    background: rgb(255 255 255 / 80%);
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    visibility: hidden;
    pointer-events: none;
    display: none;
}

.loading-animation.show {
    visibility: visible;
    pointer-events: all;
    display: block;
}

.loading-animation svg {
    width: 100px;
    height: 100px;
    display: inline-block;
    fill: black;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -50px 0 0 -25px;
}

.success-animation {
    position: absolute;
    background: rgb(255 255 255 / 80%);
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    visibility: hidden;
    pointer-events: none;
    display: none;
}

.success-animation.show {
    visibility: visible;
    pointer-events: all;
    display: block;
}

.checkmark {
    width: 140px;
    height: 140px;
    border-radius: 50%;
    display: block;
    stroke-width: 2px;
    stroke: #53a24f;
    stroke-miterlimit: 10;
    box-shadow: inset 0 0 0 #53a24f;
    animation: fill .4s ease-in-out .4s forwards, scale .3s ease-in-out .9s both;
    position: absolute;
    top: 50%;
    left: 50%;
    margin: -70px;
}
.checkmark__circle {
    stroke-dasharray: 166;
    stroke-dashoffset: 166;
    stroke-width: 2;
    stroke-miterlimit: 10;
    stroke: #53a24f;
    fill: #fff;
    animation: stroke 0.6s cubic-bezier(0.65, 0, 0.45, 1) forwards;
}

.checkmark__check {
    transform-origin: 50% 50%;
    stroke-dasharray: 48;
    stroke-dashoffset: 48;
    animation: stroke 0.3s cubic-bezier(0.65, 0, 0.45, 1) 0.8s forwards;
}

@keyframes stroke {
    100% {
        stroke-dashoffset: 0;
    }
}

@keyframes scale {
    0%, 100% {
        transform: none;
    }

    50% {
        transform: scale3d(1.1, 1.1, 1);
    }
}

@keyframes fill {
    100% {
        box-shadow: inset 0px 0px 0px 30px #4bb71b;
    }
}

