/*
@font-face {
    font-family: HelveticaBold;
    src: url(/fonts/HelveticaBold.eot?278b159c92cc1d6ac256d312bcb9bd97);
    src: url(/fonts/HelveticaBold.eot?278b159c92cc1d6ac256d312bcb9bd97?#iefix) format("embedded-opentype"), url(/fonts/HelveticaBold.woff?c8af73bb79b69b1e860d7d9425baac4e) format("woff"), url(/fonts/HelveticaBold.ttf?7a242cbef983a4973faa81ebf5e5be18) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: HelveticaLight;
    src: url(/fonts/HelveticaLight.eot?414b464fdd0444f43a3cdcc80217ddd1);
    src: url(/fonts/HelveticaLight.eot?414b464fdd0444f43a3cdcc80217ddd1?#iefix) format("embedded-opentype"), url(/fonts/HelveticaLight.woff?d1cf9121e2bab06462e3ecc22941cbf8) format("woff"), url(/fonts/HelveticaLight.ttf?8937635a27aa4cc0f7655f5253b245dc) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: HelveticaRegular;
    src: url(/fonts/HelveticaRegular.eot?62e9a57d6e1a17e101c6c534c4b1a042);
    src: url(/fonts/HelveticaRegular.eot?62e9a57d6e1a17e101c6c534c4b1a042?#iefix) format("embedded-opentype"), url(/fonts/HelveticaRegular.woff?45028f0bd9cdb1adb2dc962a0665c533) format("woff"), url(/fonts/HelveticaRegular.ttf?55529b248297a63ba84e516608241db3) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: HelveticaBoldItalic;
    src: url(/fonts/HelveticaBoldItalic.eot?cad5c737c425f5d1c2cc2d600852aaa4);
    src: url(/fonts/HelveticaBoldItalic.eot?cad5c737c425f5d1c2cc2d600852aaa4?#iefix) format("embedded-opentype"), url(/fonts/HelveticaBoldItalic.woff?83c7fe8e3704212dbb38c722f3ae50a2) format("woff"), url(/fonts/HelveticaBoldItalic.ttf?1ff3f83fe2d578377039a2cdd6add769) format("truetype");
    font-weight: 400;
    font-style: normal;
    font-display: swap
}
*/

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

::selection {
    color: #fff;
    background: rgba(0, 0, 0, .99)
}

::-moz-selection {
    color: #fff;
    background: rgba(0, 0, 0, .99)
}

body,
html {
    position: relative;
    width: 100%;
    margin: 0!important;
    padding: 0
}

body {
    font-family: "Exo 2", sans-serif;
    -webkit-overflow-scrolling: touch;
    -webkit-font-smoothing: subpixel-antialiased;
    -webkit-text-size-adjust: 100%
}

body.lock {
    overflow: hidden
}

blockquote,
p {
    margin: 0
}

button,
input,
select,
textarea {
    font: inherit
}

input::-ms-clear {
    display: none
}

button:active,
button:focus,
input:active,
input:focus,
textarea:active,
textarea:focus {
    outline: none
}

input[type=email],
input[type=password],
input[type=tel],
input[type=text],
textarea {
    -webkit-appearance: none;
    -webkit-box-shadow: none!important;
    box-shadow: none!important;
    border-radius: 0!important
}

b,
h1,
h2,
h3,
h4,
h5,
h6,
strong {
    font-weight: 400;
}

mark {
    color: #fff;
    padding: 3px;
    background: red
}

a {
    color: red;
    text-decoration: none
}

a:active,
a:focus,
a:hover {
    outline-width: 0
}

li a:not([class]),
p a:not([class]) {
    text-decoration: underline;
    -webkit-transition: -webkit-text-decoration-color .25s ease-in-out;
    transition: -webkit-text-decoration-color .25s ease-in-out;
    transition: text-decoration-color .25s ease-in-out;
    transition: text-decoration-color .25s ease-in-out, -webkit-text-decoration-color .25s ease-in-out
}

li a:not([class]):active,
li a:not([class]):focus,
li a:not([class]):hover,
p a:not([class]):active,
p a:not([class]):focus,
p a:not([class]):hover {
    -webkit-text-decoration-color: transparent;
    text-decoration-color: transparent
}

.grecaptcha-badge {
    opacity: 0;
    visibility: hidden
}

.jq-ry-container {
    width: auto;
    cursor: pointer;
    position: relative
}

.jq-ry-container[readonly=readonly] {
    cursor: default
}

.jq-ry-group-wrapper {
    position: relative;
    width: 100%
}

.jq-ry-group {
    line-height: 0;
    position: relative;
    white-space: nowrap;
    z-index: 10
}

.jq-ry-group svg {
    display: inline-block
}

.jq-ry-group.jq-ry-normal-group {
    width: 100%
}

.jq-ry-group.jq-ry-rated-group {
    width: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 11
}

.likely,
.likely__widget {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    display: inline-block;
    margin: 0;
    padding: 0;
    text-indent: 0!important;
    list-style: none!important;
    font-weight: 400;
    font-size: inherit
}

.likely {
    opacity: 0;
    font-size: 0!important
}

.likely_visible {
    opacity: 1;
    -webkit-transition: opacity .1s ease-in;
    transition: opacity .1s ease-in
}

.likely>* {
    display: inline-block;
    visibility: hidden
}

.likely_visible>* {
    visibility: inherit
}

.likely__widget {
    display: inline-block;
    position: relative;
    white-space: nowrap
}

.likely__button,
.likely__counter {
    text-decoration: none;
    text-rendering: optimizeLegibility;
    display: inline-block;
    margin: 0;
    outline: 0
}

.likely__button {
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.likely__counter {
    display: none;
    position: relative;
    font-weight: 400
}

.likely_ready .likely__counter {
    display: inline-block
}

.likely_ready .likely__counter_empty {
    display: none
}

.likely__button,
.likely__counter,
.likely__icon,
.likely__widget {
    vertical-align: top
}

.likely__widget {
    -webkit-transition: background .33s ease-out, color .33s ease-out, fill .33s ease-out;
    transition: background .33s ease-out, color .33s ease-out, fill .33s ease-out
}

.likely__widget:active,
.likely__widget:focus,
.likely__widget:hover {
    -webkit-transition: none;
    transition: none;
    cursor: pointer
}

@media (hover:none) {
    .likely__widget:active,
    .likely__widget:focus,
    .likely__widget:hover {
        -webkit-transition: background .33s ease-out, color .33s ease-out, fill .33s ease-out;
        transition: background .33s ease-out, color .33s ease-out, fill .33s ease-out;
        cursor: unset
    }
}

.likely__icon {
    position: relative;
    text-align: left;
    display: inline-block
}

.likely svg {
    position: absolute
}

.likely__button,
.likely__counter {
    line-height: inherit;
    cursor: inherit
}

.likely__button:empty {
    display: none
}

.likely__counter {
    text-align: center
}

.likely .likely__widget {
    color: #000;
    background: hsla(0, 0%, 91%, .8)
}

.likely .likely__counter {
    background-size: 1px 1px;
    background-repeat: repeat-y;
    background-image: linear-gradient(90deg, rgba(0, 0, 0, .2), transparent .5px, transparent)
}

.likely-light .likely__widget {
    color: #fff;
    fill: #fff;
    background: hsla(0, 0%, 93%, .16);
    text-shadow: rgba(0, 0, 0, .2) 0 0 .33em
}

.likely-light .likely__counter {
    background-image: linear-gradient(90deg, hsla(0, 0%, 100%, .4), hsla(0, 0%, 100%, 0) .5px, hsla(0, 0%, 100%, 0))
}

.likely__widget_facebook {
    fill: #425497
}

.likely__widget_facebook:active,
.likely__widget_facebook:focus,
.likely__widget_facebook:hover {
    background: rgba(207, 212, 229, .8)
}

@media (hover:none) {
    .likely__widget_facebook:active,
    .likely__widget_facebook:focus,
    .likely__widget_facebook:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_facebook:active,
.likely-light .likely__widget_facebook:focus,
.likely-light .likely__widget_facebook:hover {
    text-shadow: #425497 0 0 .25em;
    background: rgba(66, 84, 151, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_facebook:active,
    .likely-light .likely__widget_facebook:focus,
    .likely-light .likely__widget_facebook:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_gplus {
    fill: #dd4241
}

.likely__widget_gplus:active,
.likely__widget_gplus:focus,
.likely__widget_gplus:hover {
    background: hsla(0, 68%, 89%, .8)
}

@media (hover:none) {
    .likely__widget_gplus:active,
    .likely__widget_gplus:focus,
    .likely__widget_gplus:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_gplus:active,
.likely-light .likely__widget_gplus:focus,
.likely-light .likely__widget_gplus:hover {
    text-shadow: #dd4241 0 0 .25em;
    background: rgba(221, 66, 65, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_gplus:active,
    .likely-light .likely__widget_gplus:focus,
    .likely-light .likely__widget_gplus:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_linkedin {
    fill: #0077b5
}

.likely__widget_linkedin:active,
.likely__widget_linkedin:focus,
.likely__widget_linkedin:hover {
    background: rgba(191, 221, 236, .8)
}

@media (hover:none) {
    .likely__widget_linkedin:active,
    .likely__widget_linkedin:focus,
    .likely__widget_linkedin:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_linkedin:active,
.likely-light .likely__widget_linkedin:focus,
.likely-light .likely__widget_linkedin:hover {
    text-shadow: #0077b5 0 0 .25em;
    background: rgba(0, 119, 181, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_linkedin:active,
    .likely-light .likely__widget_linkedin:focus,
    .likely-light .likely__widget_linkedin:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_odnoklassniki {
    fill: #f6903b
}

.likely__widget_odnoklassniki:active,
.likely__widget_odnoklassniki:focus,
.likely__widget_odnoklassniki:hover {
    background: hsla(27, 88%, 90%, .8)
}

@media (hover:none) {
    .likely__widget_odnoklassniki:active,
    .likely__widget_odnoklassniki:focus,
    .likely__widget_odnoklassniki:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_odnoklassniki:active,
.likely-light .likely__widget_odnoklassniki:focus,
.likely-light .likely__widget_odnoklassniki:hover {
    text-shadow: #f6903b 0 0 .25em;
    background: rgba(246, 144, 59, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_odnoklassniki:active,
    .likely-light .likely__widget_odnoklassniki:focus,
    .likely-light .likely__widget_odnoklassniki:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_pinterest {
    fill: #bd081c
}

.likely__widget_pinterest:active,
.likely__widget_pinterest:focus,
.likely__widget_pinterest:hover {
    background: rgba(238, 193, 198, .8)
}

@media (hover:none) {
    .likely__widget_pinterest:active,
    .likely__widget_pinterest:focus,
    .likely__widget_pinterest:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_pinterest:active,
.likely-light .likely__widget_pinterest:focus,
.likely-light .likely__widget_pinterest:hover {
    text-shadow: #bd081c 0 0 .25em;
    background: rgba(189, 8, 28, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_pinterest:active,
    .likely-light .likely__widget_pinterest:focus,
    .likely-light .likely__widget_pinterest:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_telegram {
    fill: #34abde
}

.likely__widget_telegram:active,
.likely__widget_telegram:focus,
.likely__widget_telegram:hover {
    background: rgba(204, 234, 246, .8)
}

@media (hover:none) {
    .likely__widget_telegram:active,
    .likely__widget_telegram:focus,
    .likely__widget_telegram:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_telegram:active,
.likely-light .likely__widget_telegram:focus,
.likely-light .likely__widget_telegram:hover {
    text-shadow: #34abde 0 0 .25em;
    background: rgba(52, 171, 222, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_telegram:active,
    .likely-light .likely__widget_telegram:focus,
    .likely-light .likely__widget_telegram:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_twitter {
    fill: #00b7ec
}

.likely__widget_twitter:active,
.likely__widget_twitter:focus,
.likely__widget_twitter:hover {
    background: rgba(191, 237, 250, .8)
}

@media (hover:none) {
    .likely__widget_twitter:active,
    .likely__widget_twitter:focus,
    .likely__widget_twitter:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_twitter:active,
.likely-light .likely__widget_twitter:focus,
.likely-light .likely__widget_twitter:hover {
    text-shadow: #00b7ec 0 0 .25em;
    background: rgba(0, 183, 236, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_twitter:active,
    .likely-light .likely__widget_twitter:focus,
    .likely-light .likely__widget_twitter:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_vkontakte {
    fill: #526e8f
}

.likely__widget_vkontakte:active,
.likely__widget_vkontakte:focus,
.likely__widget_vkontakte:hover {
    background: rgba(211, 218, 227, .8)
}

@media (hover:none) {
    .likely__widget_vkontakte:active,
    .likely__widget_vkontakte:focus,
    .likely__widget_vkontakte:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_vkontakte:active,
.likely-light .likely__widget_vkontakte:focus,
.likely-light .likely__widget_vkontakte:hover {
    text-shadow: #526e8f 0 0 .25em;
    background: rgba(82, 110, 143, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_vkontakte:active,
    .likely-light .likely__widget_vkontakte:focus,
    .likely-light .likely__widget_vkontakte:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely__widget_whatsapp {
    fill: #25d366
}

.likely__widget_whatsapp:active,
.likely__widget_whatsapp:focus,
.likely__widget_whatsapp:hover {
    background: rgba(200, 244, 216, .8)
}

@media (hover:none) {
    .likely__widget_whatsapp:active,
    .likely__widget_whatsapp:focus,
    .likely__widget_whatsapp:hover {
        background: hsla(0, 0%, 91%, .8)
    }
}

.likely-light .likely__widget_whatsapp:active,
.likely-light .likely__widget_whatsapp:focus,
.likely-light .likely__widget_whatsapp:hover {
    text-shadow: #25d366 0 0 .25em;
    background: rgba(37, 211, 102, .7)
}

@media (hover:none) {
    .likely-light .likely__widget_whatsapp:active,
    .likely-light .likely__widget_whatsapp:focus,
    .likely-light .likely__widget_whatsapp:hover {
        text-shadow: rgba(0, 0, 0, .2) 0 0 .33em;
        background: hsla(0, 0%, 93%, .16)
    }
}

.likely {
    margin: 0 -5px -10px
}

.likely .likely__widget {
    line-height: 20px;
    font-size: 14px;
    border-radius: 3px;
    height: 22px;
    margin: 0 5px 10px
}

.likely .likely__icon {
    width: 22px;
    height: 22px
}

.likely .likely__button {
    padding: 1px 4px 1px 0
}

.likely .likely__counter {
    padding: 1px 4px
}

.likely svg {
    left: 3px;
    top: 3px;
    width: 16px;
    height: 16px
}

.likely-big {
    margin: 0 -6px -12px
}

.likely-big .likely__widget {
    line-height: 28px;
    font-size: 18px;
    border-radius: 4px;
    height: 32px;
    margin: 0 6px 12px
}

.likely-big .likely__icon {
    width: 32px;
    height: 32px
}

.likely-big .likely__button {
    padding: 2px 6px 2px 0
}

.likely-big .likely__counter {
    padding: 2px 6px
}

.likely-big svg {
    left: 4px;
    top: 4px;
    width: 24px;
    height: 24px
}

.likely-small {
    margin: 0 -4px -8px
}

.likely-small .likely__widget {
    line-height: 14px;
    font-size: 12px;
    border-radius: 2px;
    height: 18px;
    margin: 0 4px 8px
}

.likely-small .likely__icon {
    width: 18px;
    height: 18px
}

.likely-small .likely__button {
    padding: 2px 3px 2px 0
}

.likely-small .likely__counter {
    padding: 2px 3px
}

.likely-small svg {
    left: 3px;
    top: 3px;
    width: 12px;
    height: 12px
}

.flickity-enabled {
    position: relative
}

.flickity-enabled.is-draggable {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    outline: none!important
}

.flickity-enabled.is-draggable .flickity-viewport {
    cursor: -webkit-grab;
    cursor: grab
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.flickity-viewport {
    height: 100%;
    overflow: hidden;
    position: relative
}

.flickity-slider {
    width: 100%;
    height: 100%;
    position: absolute
}

select {
    width: 100%;
    padding-left: 25px;
    padding-right: 60px
}

select.filter-select {
    height: 70px;
    line-height: 70px;
    font: 16px "Exo 2", sans-serif;
    letter-spacing: .02em
}

select.form-select {
    height: 80px;
    line-height: 80px;
    font-size: 16px;
    letter-spacing: .02em
}

.nice-select {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    cursor: pointer;
    position: relative;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    padding-left: 25px;
    padding-right: 60px;
    border: 1px solid #dadada;
    text-align: left!important;
    outline: none!important;
    -webkit-transition: border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-color .5s cubic-bezier(.4, 0, 0, 1);
    z-index: 3
}

.nice-select.filter-select {
    height: 70px;
    line-height: 70px;
    font: 16px "Exo 2", sans-serif;
    letter-spacing: .02em
}

.nice-select.form-select {
    height: 80px;
    line-height: 80px;
    font-size: 16px;
    letter-spacing: .02em
}

.nice-select:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 8px;
    top: 0;
    right: 25px;
    bottom: 0;
    margin: auto 0;
    background: url("/images/select-red.svg") no-repeat 50%;
    background-size: 100% 100%;
    -webkit-transform: rotate(0);
    transform: rotate(0);
    will-change: transform;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.nice-select.open {
    cursor: default
}

.nice-select.open:before {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

.nice-select.open .list {
    opacity: 1;
    pointer-events: all;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.nice-select.disabled,
.nice-select .list {
    pointer-events: none
}

.nice-select .list {
    position: absolute;
    width: 100%;
    max-height: 335px;
    top: 100%;
    left: 0;
    opacity: 0;
    z-index: 5;
    padding: 0;
    margin: -1px 0 0 1px;
    overflow-y: auto;
    overflow-x: hidden;
    list-style: none;
    background: #fff;
    border: 1px solid #dadada;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    will-change: opacity, transform;
    -webkit-transform: translate3d(0, 30px, 0);
    transform: translate3d(0, 30px, 0);
    -webkit-transition: opacity .15s ease-out, -webkit-transform .3s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .15s ease-out, -webkit-transform .3s cubic-bezier(.4, 0, 0, 1);
    transition: transform .3s cubic-bezier(.4, 0, 0, 1), opacity .15s ease-out;
    transition: transform .3s cubic-bezier(.4, 0, 0, 1), opacity .15s ease-out, -webkit-transform .3s cubic-bezier(.4, 0, 0, 1)
}

.nice-select .option {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    cursor: pointer;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding: 20px 25px;
    font: 14px "Exo 2", sans-serif;
    letter-spacing: .02em;
    will-change: color, background;
    -webkit-transition-property: color, background;
    transition-property: color, background;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1)
}

.nice-select .option.disabled {
    color: #eaeaea
}

.nice-select .option.disabled,
.nice-select .option.selected {
    pointer-events: none
}

.nice-select .option.focus,
.nice-select .option:hover {
    color: red
}

.nice-select .option.selected,
.nice-select .option:active {
    background: red;
    color: #fff
}

.nice-select .current {
    width: 100%;
    display: block;
    overflow: hidden;
    position: relative;
    line-height: 1.4
}

.nice-select .current:before {
    content: "";
    position: absolute;
    width: 20px;
    height: calc(100% - 2px);
    top: 1px;
    right: 0;
    z-index: 2;
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, 0)), to(#fff));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, 0) 0, #fff)
}

@media only screen and (max-width:1600px) {
    select.filter-select {
        height: 60px;
        font-size: 15px
    }
    select.form-select {
        height: 75px;
        font-size: 15px
    }
    .nice-select.filter-select {
        height: 60px;
        font-size: 15px;
        line-height: 60px
    }
    .nice-select.form-select {
        height: 75px;
        font-size: 15px;
        line-height: 75px
    }
}

@media only screen and (max-width:1440px) {
    .nice-select {
        padding-left: 15px;
        padding-right: 50px
    }
    .nice-select:before {
        right: 20px
    }
}

@media only screen and (max-width:1366px) {
    select.filter-select {
        height: 55px;
        font-size: 14px;
        padding-left: 20px;
        padding-right: 50px
    }
    select.form-select {
        height: 70px;
        font-size: 14px;
        padding-right: 50px
    }
    .nice-select.filter-select {
        height: 55px;
        font-size: 14px;
        line-height: 55px;
        padding-left: 20px;
        padding-right: 50px
    }
    .nice-select.form-select {
        height: 70px;
        font-size: 14px;
        line-height: 70px;
        padding-right: 50px
    }
    .nice-select:before {
        width: 11px;
        height: 8px;
        right: 20px
    }
    .nice-select .option {
        font-size: 13px;
        padding: 15px 20px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    select.form-select {
        height: 60px
    }
    .nice-select.form-select {
        height: 60px;
        line-height: 60px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    select.form-select {
        height: 60px
    }
    .nice-select.form-select {
        height: 60px;
        line-height: 60px
    }
}

[data-scrollbar] {
    display: block;
    position: relative
}

.scroll-content {
    overflow: hidden;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.scrollbar-track {
    width: 6px!important;
    background: none!important
}

.scrollbar-track.scrollbar-track-x {
    display: none!important
}

.scrollbar-thumb {
    width: 6px!important;
    background: red!important;
    border-radius: 0!important
}

.not-found-container {
    height: 100vh;
    overflow: hidden;
    padding-top: 62px;
    -webkit-box-orient: vertical;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.not-found-container,
.not-found-info {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal
}

.not-found-info {
    height: calc(100% - 260px);
    position: relative;
    padding: 0 60px;
    -webkit-box-orient: horizontal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    z-index: 3
}

.not-found-content,
.not-found-name {
    width: 100%;
    position: relative
}

.not-found-name {
    text-align: center;
    z-index: 1
}

.not-found-name h1 {
    margin: 0;
    color: #ececec;
    white-space: nowrap;
    display: inline-block;
    font-size: 470px
}

.not-found-name.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(.5);
    filter: brightness(.5);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.not-found-name.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.not-found-name.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.not-found-name.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.not-found-desc {
    position: absolute;
    width: 100%;
    top: 50%;
    left: 0;
    z-index: 2;
    -webkit-transform: translate3d(0, -25%, 0);
    transform: translate3d(0, -25%, 0)
}

.not-found-desc h2 {
    margin: 0 0 60px;
    font-size: 60px
}

.not-found-desc p {
    display: block;
    margin: 0 auto;
    max-width: 860px;
    font: 20px/1.6 "Exo 2", sans-serif;
    text-align: center
}

.not-found-desc p a {
    color: red;
    text-decoration: underline
}

.not-found-desc p a:hover {
    text-decoration: none
}

@media only screen and (max-width:1480px) {
    .not-found-desc h2 {
        margin: 0 0 35px
    }
    .not-found-desc p {
        font-size: 18px;
        line-height: 1.4
    }
}

@media only screen and (max-width:720px) {
    .not-found-desc {
        -webkit-transform: translate3d(0, -15%, 0);
        transform: translate3d(0, -15%, 0)
    }
    .not-found-desc h2 {
        margin: 0 0 20px
    }
    .not-found-desc p {
        margin: 0 0 12px;
        font-size: 16px;
        line-height: 24px
    }
}

@media only screen and (max-width:320px) {
    .not-found-desc {
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0)
    }
    .not-found-desc h2 {
        margin: 0
    }
    .not-found-desc p {
        display: none
    }
}

@media only screen and (max-height:425px) {
    .not-found-desc {
        -webkit-transform: translate3d(0, -50%, 0);
        transform: translate3d(0, -50%, 0)
    }
    .not-found-desc h2 {
        margin: 0
    }
    .not-found-desc p {
        display: none
    }
}

.not-found-desc-inner {
    width: 100%;
    text-align: center;
    position: relative
}

.not-found-desc-inner.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.2) translate3d(0, 30vh, 0);
    transform: scaleY(1.2) translate3d(0, 30vh, 0)
}

.not-found-desc-inner.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.not-found-desc-inner.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.not-found-desc-inner.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

@media only screen and (max-width:1600px) {
    .not-found-container {
        padding-top: 60px
    }
    .not-found-info {
        height: calc(100% - 220px);
        padding: 0 50px
    }
    .not-found-name h1 {
        font-size: 380px
    }
    .not-found-desc h2 {
        font-size: 45px
    }
}

@media only screen and (max-width:1366px) {
    .not-found-container {
        padding-top: 50px
    }
    .not-found-info {
        height: calc(100% - 185px);
        padding: 0 40px
    }
    .not-found-name h1 {
        font-size: 320px
    }
    .not-found-desc h2 {
        font-size: 40px
    }
}

@media only screen and (max-width:1024px) {
    .not-found-info {
        height: calc(100% - 160px)
    }
    .not-found-name h1 {
        font-size: 280px
    }
    .not-found-desc h2 {
        font-size: 35px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .not-found-container {
        padding-top: 42px
    }
    .not-found-info {
        height: calc(100% - 90px);
        padding: 0 25px
    }
    .not-found-name h1 {
        font-size: 50vw
    }
    .not-found-desc h2 {
        font-size: 21px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .not-found-container {
        padding-top: 42px
    }
    .not-found-info {
        height: calc(100% - 90px);
        padding: 0 25px
    }
    .not-found-name h1 {
        font-size: 19vw
    }
    .not-found-desc h2 {
        font-size: 18px
    }
}

.unit-container[data-page=blog] {
    padding-bottom: 145px
}

.blog-categories {
    width: 100%;
    padding-top: 40px;
    position: relative;
    -webkit-perspective: 100px;
    perspective: 100px;
    z-index: 2
}

.blog-categories .categories-desktop-list,
.blog-categories .categories-select-item {
    width: 100%
}

.blog-categories .categories-select-item:last-child .nice-select .list {
    left: 0
}

.blog-list {
    padding-bottom: 70px
}

.blog-list,
.blog-pagination {
    width: 100%;
    position: relative
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=blog] {
        padding-bottom: 125px
    }
    .blog-categories {
        padding-top: 30px
    }
    .blog-list {
        padding-bottom: 60px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=blog] {
        padding-bottom: 100px
    }
    .blog-list {
        padding-bottom: 50px
    }
    .blog-categories {
        padding-top: 25px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=blog] {
        padding-bottom: 60px
    }
    .blog-list {
        padding-bottom: 40px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=blog] {
        padding-bottom: 60px
    }
    .blog-list {
        padding-bottom: 40px
    }
}

.unit-container[data-page=about-en],
.unit-container[data-page=about-ru] {
    padding-bottom: 145px
}

.about-define {
    width: 100%;
    position: relative;
    z-index: 2
}

.about-define .section-define-title h1,
.about-define .section-define-title h2 {
    font-size: 50px
}

.about-define-container {
    width: 100%;
    padding-top: 62px;
    position: relative
}

.about-define-container:before {
    content: "";
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 1;
    background: #f9f9f9;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.about-define-container.animate-element:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    will-change: transform;
    -webkit-transform-origin: right center;
    transform-origin: right center
}

.about-define-container.animate-element[data-start=true]:before {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.about-define-container.animate-element[data-start=true].visible:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.about-define-container.animate-element[data-start=true].finished {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-excerption {
    position: relative;
    width: 100%;
    margin-bottom: 20px;
    z-index: 2;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.about-excerption.animate-element {
    visibility: hidden;
    -webkit-perspective: 400px;
    perspective: 400px;
    will-change: transform
}

.about-excerption.animate-element .about-excerption-full .about-excerption-words {
    -webkit-transform: translate3d(100vw, -25%, 0) skew(30deg, 5deg) rotateY(5deg);
    transform: translate3d(100vw, -25%, 0) skew(30deg, 5deg) rotateY(5deg)
}

.about-excerption.animate-element .about-excerption-half .about-excerption-words {
    -webkit-transform: translate3d(150vw, -25%, 0) skew(30deg, 5deg) rotateY(5deg);
    transform: translate3d(150vw, -25%, 0) skew(30deg, 5deg) rotateY(5deg)
}

.about-excerption.animate-element[data-start=true] {
    visibility: visible
}

.about-excerption.animate-element[data-start=true] .about-excerption-full .about-excerption-words,
.about-excerption.animate-element[data-start=true] .about-excerption-half .about-excerption-words {
    -webkit-transition: -webkit-transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s;
    transition: -webkit-transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s;
    transition: transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s;
    transition: transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s, -webkit-transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s
}

.about-excerption.animate-element[data-start=true].visible .about-excerption-full .about-excerption-words {
    -webkit-transform: translate3d(-50vw, 0, 0) rotateY(0) skew(0, 0) rotateY(0);
    transform: translate3d(-50vw, 0, 0) rotateY(0) skew(0, 0) rotateY(0)
}

.about-excerption.animate-element[data-start=true].visible .about-excerption-half .about-excerption-words {
    -webkit-transform: translateZ(0) rotateY(0) skew(0, 0) rotateY(0);
    transform: translateZ(0) rotateY(0) skew(0, 0) rotateY(0)
}

.about-excerption-full {
    position: relative;
    width: 50%;
    margin-left: 50%;
    overflow: hidden;
    z-index: 1
}

.about-excerption-full .about-excerption-words {
    color: #fff
}

.about-excerption-half {
    position: absolute;
    width: 50%;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: 3
}

.about-excerption-half .about-excerption-words {
    color: #000
}

.about-excerption-words {
    position: relative;
    margin-left: -.065em;
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    font: 24.5vw/1.12 "Exo 2", sans-serif;
}

.about-excerption-words,
.about-excerption-words span {
    display: inline-block;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform
}

.about-define-section {
    position: relative;
    width: 100%;
    z-index: 2
}

.about-define-info {
    position: relative;
    width: 100%;
    padding: 10px 0 145px
}

.about-define-info-center {
    width: 680px;
    margin: 0 auto;
    position: relative
}

.about-define-desc {
    width: 100%;
    position: relative
}

.about-define-desc p {
    margin: 25px 0;
    font-size: 16px;
    letter-spacing: .02em;
    line-height: 1.7
}

.about-define-desc.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.about-define-desc.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-define-desc.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.about-define-desc.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-info-button {
    width: 100%;
    padding-top: 50px;
    position: relative
}

.about-info-button.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.about-info-button.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-info-button.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.about-info-button.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-info-button-inner {
    width: 50%;
    position: relative
}

.about-define-image {
    width: 100%;
    position: relative
}

.about-define-image:before {
    content: "";
    position: absolute;
    width: 50%;
    height: 50%;
    top: 0;
    right: 0;
    z-index: 1;
    background: #f9f9f9;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.about-define-image-inner {
    width: 87.5%;
    height: 0;
    z-index: 2;
    overflow: hidden;
    padding-top: 47.5%;
    position: relative;
    background: #dadada
}

.about-define-image-inner img {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.about-define-image-inner.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(1.25);
    filter: brightness(1.25);
    will-change: filter, opacity, transform;
    -webkit-transform: translate3d(0, 20vh, 0);
    transform: translate3d(0, 20vh, 0)
}

.about-define-image-inner.animate-element img {
    -webkit-transform: scale(2);
    transform: scale(2);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.about-define-image-inner.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.about-define-image-inner.animate-element[data-start=true] img {
    -webkit-transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1), -webkit-transform 2s cubic-bezier(.4, 0, 0, 1)
}

.about-define-image-inner.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.about-define-image-inner.animate-element[data-start=true].visible img {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.about-define-image-inner.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-services {
    width: 100%;
    position: relative;
    padding-top: 145px;
    z-index: 1
}

.about-services:before {
    content: "";
    position: absolute;
    width: 62.25%;
    height: 100%;
    top: 0;
    left: 0;
    background: #f9f9f9;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.about-services .section-define-title h1,
.about-services .section-define-title h2 {
    font-size: 50px
}

.about-services.animate-element:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    will-change: transform;
    -webkit-transform-origin: left center;
    transform-origin: left center
}

.about-services.animate-element[data-start=true]:before {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.about-services.animate-element[data-start=true].visible:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.about-services.animate-element[data-start=true].finished {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-services-define {
    width: 100%;
    padding: 75px 0;
    position: relative
}

.about-services-list {
    -webkit-box-orient: vertical;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap
}

.about-services-list,
.about-services-row {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.about-services-row {
    margin: 75px 0;
    -webkit-box-orient: horizontal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-perspective: 50px;
    perspective: 50px
}

.about-services-row:first-child .about-service-item:nth-child(2) {
    height: 11.5vw
}

.about-service-item {
    position: relative;
    width: 33.333%;
    padding-right: 30px;
    z-index: 1
}

.about-service-item:first-child {
    z-index: 2
}

.about-service-item.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0);
    transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0)
}

.about-service-item.animate-element .service-excerption {
    -webkit-transform: translate3d(100%, -25%, 0) skewX(-40deg) rotateY(5deg);
    transform: translate3d(100%, -25%, 0) skewX(-40deg) rotateY(5deg)
}

.about-service-item.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-service-item.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .06666667s;
    transition-delay: .06666667s
}

.about-service-item.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .13333333s;
    transition-delay: .13333333s
}

.about-service-item.animate-element[data-start=true]:nth-child(3) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.about-service-item.animate-element[data-start=true] .service-excerption {
    -webkit-transition: -webkit-transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s;
    transition: -webkit-transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s;
    transition: transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s;
    transition: transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s, -webkit-transform 2.2s cubic-bezier(.4, 0, 0, 1) .1s
}

.about-service-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.about-service-item.animate-element[data-start=true].visible .service-excerption {
    -webkit-transform: translateZ(0) skewX(0) rotateY(0);
    transform: translateZ(0) skewX(0) rotateY(0)
}

.about-service-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-service-count {
    width: 100%;
    position: relative;
    margin-bottom: 5px
}

.about-service-count p {
    color: #908f8f;
    font: 16px "Exo 2", sans-serif;
    letter-spacing: .02em;
    line-height: 1.6
}

.about-service-title {
    position: relative;
    width: 100%;
    margin-bottom: 20px
}

.about-service-title a,
.about-service-title p {
    font: 30px/1.15 "Exo 2", sans-serif;
    color: #000
}

.about-service-title a {
    display: inline;
    -webkit-transition: all .5s cubic-bezier(.4, 0, 0, 1);
    transition: all .5s cubic-bezier(.4, 0, 0, 1);
    border-bottom: 1px solid #000
}

.about-service-title a:hover {
    color: red;
    border-bottom-color: transparent
}

.about-service-desc {
    position: relative;
    width: 100%;
    margin-bottom: 25px
}

.about-service-desc p {
    font: 16px/1.6 "Exo 2", sans-serif;
    letter-spacing: .02em
}

.about-service-link {
    position: relative;
    width: 100%
}

.about-service-link a {
    color: #000;
    font-size: 18px;
    position: relative;
    padding-bottom: 4px;
    display: inline-block;
    letter-spacing: .02em;
    text-decoration: none!important
}

.about-service-link a:before {
    content: "";
    position: absolute;
    width: calc(100% + 15px);
    height: 2px;
    left: 0;
    bottom: 0;
    background: #000;
    will-change: width;
    -webkit-transition: width .5s cubic-bezier(.4, 0, 0, 1);
    transition: width .5s cubic-bezier(.4, 0, 0, 1)
}

.about-service-link a:hover:before {
    width: 100%
}

.service-excerption {
    width: 100vw;
    position: absolute;
    top: -7.5vw;
    left: 0
}

.service-excerption-full {
    width: 100%;
    position: relative;
    z-index: 1
}

.service-excerption-full .service-excerption-words {
    color: #fff
}

.service-excerption-half {
    width: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 24.75%;
    z-index: 2
}

.service-excerption-half .service-excerption-words {
    color: #000;
    margin-left: -24.75%
}

.service-excerption-words {
    width: 100%;
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    font: 24.5vw/1.12 "Exo 2", sans-serif;
}

.about-clients {
    width: 100%;
    position: relative;
    padding: 160px 0 150px
}

.about-clients .section-define-title h1,
.about-clients .section-define-title h2 {
    font-size: 50px
}

.about-clients-list {
    width: 100%;
    padding-top: 50px;
    position: relative
}

.about-clients-list-inner {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.about-client-item {
    width: 16.666%;
    height: 0;
    overflow: hidden;
    padding-top: 14%;
    position: relative;
    margin: 0 -1px -1px 0;
    border: 1px solid #dadada
}

.about-client-item:first-child .about-client-item-inner.animate-element[data-start="true"] {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.about-client-item:nth-child(2) .about-client-item-inner.animate-element[data-start=true] {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.about-client-item:nth-child(3) .about-client-item-inner.animate-element[data-start=true] {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.about-client-item:nth-child(4) .about-client-item-inner.animate-element[data-start=true] {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.about-client-item:nth-child(5) .about-client-item-inner.animate-element[data-start=true] {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.about-client-item:nth-child(6) .about-client-item-inner.animate-element[data-start=true] {
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.about-client-item-inner {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.about-client-item-inner img {
    width: 55%;
    height: 55%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    -o-object-fit: contain;
    object-fit: contain
}

.about-client-item-inner.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 100%, 0);
    transform: scaleY(1.3) translate3d(0, 100%, 0)
}

.about-client-item-inner.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-client-item-inner.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.about-client-item-inner.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-clients-image {
    width: 100%;
    position: relative;
    padding-top: 150px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.about-clients-image-inner {
    width: 87.5%;
    height: 0;
    z-index: 1;
    overflow: hidden;
    padding-top: 47.5%;
    position: relative;
    background: #dadada;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.about-clients-image-inner img {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.about-clients-image-inner.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(1.25);
    filter: brightness(1.25);
    will-change: filter, opacity, transform;
    -webkit-transform: translate3d(0, 20vh, 0);
    transform: translate3d(0, 20vh, 0)
}

.about-clients-image-inner.animate-element img {
    -webkit-transform: scale(2);
    transform: scale(2);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.about-clients-image-inner.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.about-clients-image-inner.animate-element[data-start=true] img {
    -webkit-transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1), -webkit-transform 2s cubic-bezier(.4, 0, 0, 1)
}

.about-clients-image-inner.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.about-clients-image-inner.animate-element[data-start=true].visible img {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.about-clients-image-inner.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-clients-contact {
    width: 72%;
    height: 300px;
    overflow: hidden;
    background: #000;
    position: absolute;
    padding-left: 12.5%;
    left: 0;
    bottom: 0;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    cursor: pointer;
    border: none
}

.about-clients-contact:before {
    content: "";
    position: absolute;
    width: calc(100% + 2px);
    height: calc(400% + 2px);
    top: -1px;
    left: -1px;
    right: 0;
    bottom: 0;
    z-index: 1;
    margin: auto;
    background: red;
    border-radius: 50%;
    -webkit-transform: scale(0) skewY(-15deg);
    transform: scale(0) skewY(-15deg);
    will-change: transform, border-radius;
    -webkit-transition: border-radius .4s ease-out, -webkit-transform .6s ease-out;
    transition: border-radius .4s ease-out, -webkit-transform .6s ease-out;
    transition: border-radius .4s ease-out, transform .6s ease-out;
    transition: border-radius .4s ease-out, transform .6s ease-out, -webkit-transform .6s ease-out
}

.about-clients-contact span {
    color: #fff;
    white-space: nowrap;
    position: relative;
    display: inline-block;
    font: 80px "Exo 2", sans-serif;
    line-height: 1.15;
    z-index: 2;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.about-clients-contact:hover:before {
    border-radius: 0;
    -webkit-transform: scale(1) skewY(0);
    transform: scale(1) skewY(0);
    -webkit-transition: border-radius .4s ease-out .6s, -webkit-transform .6s cubic-bezier(.4, 0, 0, 1);
    transition: border-radius .4s ease-out .6s, -webkit-transform .6s cubic-bezier(.4, 0, 0, 1);
    transition: transform .6s cubic-bezier(.4, 0, 0, 1), border-radius .4s ease-out .6s;
    transition: transform .6s cubic-bezier(.4, 0, 0, 1), border-radius .4s ease-out .6s, -webkit-transform .6s cubic-bezier(.4, 0, 0, 1)
}

.about-clients-contact.animate-element {
    visibility: hidden;
    pointer-events: none;
    will-change: visibility, transform;
    -webkit-transform: scaleY(1.5) skew(0, 3deg) translate3d(0, 25vh, 0);
    transform: scaleY(1.5) skew(0, 3deg) translate3d(0, 25vh, 0)
}

.about-clients-contact.animate-element[data-start=true] {
    -webkit-transition-property: visibility, -webkit-transform;
    transition-property: visibility, -webkit-transform;
    transition-property: visibility, transform;
    transition-property: visibility, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-clients-contact.animate-element[data-start=true].visible {
    visibility: visible;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.about-clients-contact.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-awards {
    width: 100%;
    position: relative;
    padding-top: 160px
}

.about-awards .section-define-title h1,
.about-awards .section-define-title h2 {
    font-size: 50px
}

.about-awards-list {
    width: 100%;
    padding-top: 50px;
    position: relative
}

.about-awards-list-inner {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.about-awards-item {
    width: 25%;
    overflow: hidden;
    position: relative;
    margin: 0 -1px -1px 0;
    border: 1px solid #dadada
}

.about-awards-item-top {
    width: 100%;
    height: 0;
    position: relative;
    padding-top: 56.25%
}

.about-awards-item-top.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scale(0) translate3d(0, 100%, 0);
    transform: scale(0) translate3d(0, 100%, 0)
}

.about-awards-item-top.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-awards-item-top.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scale(1) translateZ(0);
    transform: scale(1) translateZ(0)
}

.about-awards-item-top.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-awards-item-inner {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.about-awards-item-center {
    padding: 0 25px 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.about-awards-item-center,
.about-awards-item-image {
    width: 100%;
    height: 100%;
    position: relative
}

.about-awards-item-image img {
    width: 40%;
    height: 40%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    -o-object-fit: contain;
    object-fit: contain
}

.about-awards-item-bottom {
    width: 100%;
    position: relative
}

.about-awards-item-bottom.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 100%, 0);
    transform: scaleY(1.3) translate3d(0, 100%, 0)
}

.about-awards-item-bottom.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-awards-item-bottom.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.about-awards-item-bottom.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-awards-item-title {
    width: 100%;
    position: relative;
    text-align: center
}

.about-awards-item-title p {
    color: red;
    white-space: nowrap;
    font: 80px "Exo 2", sans-serif;
    line-height: 1.15
}

.about-awards-item-desc {
    width: 100%;
    position: relative;
    text-align: center
}

.about-awards-item-desc p {
    font: 20px "Exo 2", sans-serif;
    line-height: 1.2
}

.about-philosophy {
    width: 100%;
    position: relative;
    padding-top: 160px
}

.about-philosophy .section-define-title h1,
.about-philosophy .section-define-title h2 {
    font-size: 50px
}

.about-philosophy-info {
    width: 100%;
    position: relative;
    padding-top: 80px
}

.about-info-section {
    width: 100%;
    position: relative;
    padding: 145px 0
}

.about-info-section:before {
    content: "";
    position: absolute;
    width: 62.25%;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 1;
    background: #f9f9f9;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.about-info-section.animate-element:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    will-change: transform;
    -webkit-transform-origin: right center;
    transform-origin: right center
}

.about-info-section.animate-element[data-start=true]:before {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.about-info-section.animate-element[data-start=true].visible:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.about-info-section.animate-element[data-start=true].finished {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.philosophy-excerption {
    width: 100%;
    position: relative;
    z-index: 2;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.philosophy-excerption.animate-element {
    -webkit-perspective: 400px;
    perspective: 400px;
    pointer-events: none;
    will-change: transform;
    -webkit-transform: scaleY(1.5) translate3d(0, 25vh, 0);
    transform: scaleY(1.5) translate3d(0, 25vh, 0)
}

.philosophy-excerption.animate-element[data-start=true] {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .2s;
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .2s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) .2s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) .2s, -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .2s
}

.philosophy-excerption.animate-element[data-start=true].visible {
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.philosophy-excerption.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.philosophy-excerption-full {
    width: 100%;
    position: relative;
    z-index: 1
}

.philosophy-excerption-full .philosophy-excerption-words {
    color: #fff
}

.philosophy-excerption-half {
    width: 37.75%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}

.philosophy-excerption-half .philosophy-excerption-words {
    color: #000
}

.philosophy-excerption-words {
    cursor: default;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    margin-left: -.065em;
    font: 24.5vw "Exo 2", sans-serif;
    line-height: 1.12
}

.about-info-desc {
    width: 100%;
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 3;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0)
}

.about-info-item {
    width: 50%;
    position: relative;
    padding-right: 12.5%
}

.about-info-item-title {
    width: 100%;
    position: relative;
    margin-bottom: 25px
}

.about-info-item-title p {
    font: 30px "Exo 2", sans-serif;
    line-height: 1.15
}

.about-info-item-title.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.about-info-item-title.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-info-item-title.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.about-info-item-title.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-info-item-desc {
    width: 100%;
    position: relative
}

.about-info-item-desc p {
    color: #908f8f;
    font: 16px "Exo 2", sans-serif;
    letter-spacing: .02em;
    line-height: 1.7
}

.about-info-item-desc.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.about-info-item-desc.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.about-info-item-desc.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.about-info-item-desc.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.about-portfolio {
    width: 100%;
    position: relative;
    -webkit-perspective: 100px;
    perspective: 100px
}

@media only screen and (max-width:1720px) {
    .about-clients-contact span {
        font-size: 64px
    }
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=about-en],
    .unit-container[data-page=about-ru] {
        padding-bottom: 125px
    }
    .about-define .section-define-title h1,
    .about-define .section-define-title h2 {
        font-size: 40px
    }
    .about-define-container {
        padding-top: 55px
    }
    .about-excerption {
        margin-bottom: 15px
    }
    .about-define-info {
        padding: 5px 0 125px
    }
    .about-define-info-center {
        width: 650px
    }
    .about-define-desc p {
        margin: 22px 0;
        font-size: 15px
    }
    .about-info-button {
        padding-top: 40px
    }
    .about-clients {
        padding: 145px 0 135px
    }
    .about-clients .section-define-title h1,
    .about-clients .section-define-title h2 {
        font-size: 40px
    }
    .about-clients-list {
        padding-top: 40px
    }
    .about-clients-image {
        padding-top: 135px
    }
    .about-clients-contact {
        height: 240px
    }
    .about-clients-contact span {
        font-size: 65px
    }
    .about-awards {
        padding-top: 145px
    }
    .about-awards .section-define-title h1,
    .about-awards .section-define-title h2 {
        font-size: 40px
    }
    .about-awards-list {
        padding-top: 40px
    }
    .about-awards-item-center {
        padding: 0 25px 40px
    }
    .about-awards-item-title p {
        font-size: 70px
    }
    .about-awards-item-desc p {
        font-size: 18px
    }
    .about-philosophy {
        padding-top: 145px
    }
    .about-philosophy .section-define-title h1,
    .about-philosophy .section-define-title h2 {
        font-size: 40px
    }
    .about-philosophy-info {
        padding-top: 70px
    }
    .about-info-section {
        padding: 125px 0
    }
    .about-info-item-title {
        margin-bottom: 20px
    }
    .about-info-item-title p {
        font-size: 25px
    }
    .about-info-item-desc p {
        font-size: 15px
    }
    .about-services {
        padding-top: 125px
    }
    .about-services .section-define-title h1,
    .about-services .section-define-title h2 {
        font-size: 40px
    }
    .about-services-define {
        padding: 65px 0
    }
    .about-services-row {
        margin: 65px 0
    }
    .about-service-item {
        padding-right: 25px
    }
    .about-service-count p {
        font-size: 15px
    }
    .about-service-title {
        margin-bottom: 15px
    }
    .about-service-title a,
    .about-service-title p {
        font-size: 26px
    }
    .about-service-desc {
        margin-bottom: 20px
    }
    .about-service-desc p {
        font-size: 15px
    }
    .about-service-link a {
        font-size: 16px
    }
}

@media only screen and (max-width:1480px) {
    .about-clients-contact {
        height: 200px
    }
    .about-clients-contact span {
        font-size: 52px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=about-en],
    .unit-container[data-page=about-ru] {
        padding-bottom: 100px
    }
    .about-define .section-define-title h1,
    .about-define .section-define-title h2 {
        font-size: 30px
    }
    .about-define-container {
        padding-top: 50px
    }
    .about-excerption {
        margin-bottom: 10px
    }
    .about-define-info {
        padding: 5px 0 100px
    }
    .about-define-info-center {
        width: 600px
    }
    .about-define-desc p {
        margin: 17px 0;
        font-size: 14px
    }
    .about-info-button {
        padding-top: 30px
    }
    .about-define-image-inner {
        width: calc(100% - 40px);
        padding-top: 52.7%
    }
    .about-clients {
        padding: 125px 0 110px
    }
    .about-clients .section-define-title h1,
    .about-clients .section-define-title h2 {
        font-size: 30px
    }
    .about-clients-list {
        padding-top: 30px
    }
    .about-clients-image {
        padding-top: 110px
    }
    .about-clients-image-inner {
        width: calc(100% - 40px);
        padding-top: 52.7%
    }
    .about-clients-contact {
        width: 75%;
        height: 220px;
        padding-left: 40px
    }
    .about-clients-contact span {
        font-size: 45px
    }
    .about-awards {
        padding-top: 125px
    }
    .about-awards .section-define-title h1,
    .about-awards .section-define-title h2 {
        font-size: 30px
    }
    .about-awards-list {
        padding-top: 30px
    }
    .about-awards-item-center {
        padding: 0 25px 30px
    }
    .about-awards-item-image img {
        width: 45%;
        height: 45%
    }
    .about-awards-item-title p {
        font-size: 50px
    }
    .about-awards-item-desc p {
        font-size: 16px
    }
    .about-philosophy {
        padding-top: 125px
    }
    .about-philosophy .section-define-title h1,
    .about-philosophy .section-define-title h2 {
        font-size: 30px
    }
    .about-philosophy-info {
        padding-top: 60px
    }
    .about-info-section {
        padding: 100px 0
    }
    .about-info-item-title {
        margin-bottom: 15px
    }
    .about-info-item-title p {
        font-size: 21px
    }
    .about-info-item-desc p {
        font-size: 14px
    }
    .about-services {
        padding-top: 100px
    }
    .about-services .section-define-title h1,
    .about-services .section-define-title h2 {
        font-size: 30px
    }
    .about-services-define {
        padding: 55px 0
    }
    .about-services-row {
        margin: 55px 0
    }
    .about-service-count p {
        font-size: 14px
    }
    .about-service-title {
        margin-bottom: 10px
    }
    .about-service-title a,
    .about-service-title p {
        font-size: 21px
    }
    .about-service-desc {
        margin-bottom: 15px
    }
    .about-service-desc p {
        font-size: 14px
    }
    .about-service-link a {
        font-size: 15px
    }
    .service-excerption-half {
        left: 27.85%
    }
    .service-excerption-half .service-excerption-words {
        margin-left: -27.85%
    }
}

@media only screen and (max-width:1024px) {
    .about-define-info-center {
        width: calc(100% - 80px)
    }
    .about-excerption-words {
        line-height: 1.2
    }
    .about-clients {
        padding: 100px 0 90px
    }
    .about-clients-image {
        padding-top: 90px
    }
    .about-clients-contact {
        width: calc(100% - 40px);
        height: 200px
    }
    .about-clients-contact span {
        font-size: 40px
    }
    .about-awards {
        padding-top: 100px
    }
    .about-awards-item-image img {
        width: 50%;
        height: 50%
    }
    .about-philosophy {
        padding-top: 100px
    }
    .about-info-section:before {
        width: 75%
    }
    .philosophy-excerption-half {
        width: 25%
    }
    .about-info-item {
        width: calc(75% - 40px);
        padding-right: 80px
    }
    .about-services {
        padding-top: 90px
    }
    .about-services:before {
        width: 50%
    }
    .about-services-define {
        padding: 80px 0 25px
    }
    .about-services-row {
        margin: 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
    .about-services-row:first-child {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
    }
    .about-services-row:first-child .about-service-item:nth-child(2) {
        height: 14vw
    }
    .about-service-item {
        width: 100%;
        margin-bottom: 55px
    }
    .service-excerption-half {
        left: calc(50% - 40px)
    }
    .service-excerption-half .service-excerption-words {
        margin-left: calc(-50% + 40px)
    }
}

@media only screen and (max-width:800px) {
    .about-client-item {
        width: 33.333%;
        padding-top: 28%
    }
    .about-client-item-inner img {
        width: 40%;
        height: 40%
    }
    .about-awards-item {
        width: 50%
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=about-en],
    .unit-container[data-page=about-ru] {
        padding-bottom: 60px
    }
    .about-define .section-define-title h1,
    .about-define .section-define-title h2 {
        font-size: 24px;
        line-height: 1.3
    }
    .about-define-container {
        padding-top: 67px
    }
    .about-excerption {
        margin-bottom: 10px
    }
    .about-define-info {
        padding: 5px 0 65px
    }
    .about-define-info-center {
        width: calc(100% - 50px)
    }
    .about-info-button-inner {
        width: 100%
    }
    .about-define-image-inner {
        width: calc(100% - 25px);
        padding-top: 54.7%
    }
    .about-clients {
        padding: 65px 0 60px
    }
    .about-clients .section-define-title h1,
    .about-clients .section-define-title h2 {
        font-size: 24px
    }
    .about-client-item-inner img {
        width: 55%;
        height: 55%
    }
    .about-clients-image {
        padding-top: 65px
    }
    .about-clients-image-inner {
        width: calc(100% - 25px);
        padding-top: 54.7%
    }
    .about-clients-contact {
        width: calc(100% - 25px);
        padding-left: 25px;
        height: 120px
    }
    .about-clients-contact span {
        font-size: 20px
    }
    .about-awards {
        padding-top: 65px
    }
    .about-awards .section-define-title h1,
    .about-awards .section-define-title h2 {
        font-size: 24px
    }
    .about-awards-list {
        padding-top: 25px
    }
    .about-awards-item-center {
        padding: 0 10px 25px
    }
    .about-awards-item-image img {
        width: 50%;
        height: 50%
    }
    .about-awards-item-title p {
        font-size: 40px
    }
    .about-awards-item-desc p {
        font-size: 13px
    }
    .about-philosophy {
        padding-top: 65px
    }
    .about-philosophy-info {
        padding-top: 45px
    }
    .about-info-section {
        padding: 0 0 45px
    }
    .about-info-section:before,
    .philosophy-excerption-half {
        width: 50%
    }
    .about-info-desc {
        top: unset;
        left: unset;
        -webkit-transform: none;
        transform: none;
        position: relative;
        margin-bottom: 50px
    }
    .about-info-item {
        width: calc(100% - 25px);
        padding-right: 25px
    }
    .about-services {
        padding-top: 65px
    }
    .about-services .section-define-title h1,
    .about-services .section-define-title h2 {
        font-size: 24px
    }
    .about-services-define {
        padding: 45px 0 25px
    }
    .about-service-item {
        margin-bottom: 45px
    }
    .service-excerption-half {
        left: calc(50% - 25px)
    }
    .service-excerption-half .service-excerption-words {
        margin-left: calc(-50% + 25px)
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=about-en],
    .unit-container[data-page=about-ru] {
        padding-bottom: 60px
    }
    .about-define .section-define-title h1,
    .about-define .section-define-title h2 {
        font-size: 24px;
        line-height: 1.3
    }
    .about-define-container {
        padding-top: 67px
    }
    .about-excerption {
        margin-bottom: 10px
    }
    .about-define-info {
        padding: 5px 0 65px
    }
    .about-define-info-center {
        width: calc(100% - 50px)
    }
    .about-define-image-inner {
        width: calc(100% - 25px);
        padding-top: 54.7%
    }
    .about-clients {
        padding: 65px 0 60px
    }
    .about-clients .section-define-title h1,
    .about-clients .section-define-title h2 {
        font-size: 24px
    }
    .about-clients-image {
        padding-top: 65px
    }
    .about-clients-image-inner {
        width: calc(100% - 25px);
        padding-top: 54.7%
    }
    .about-clients-contact {
        width: 75%;
        padding-left: 25px;
        height: 120px
    }
    .about-clients-contact span {
        font-size: 24px
    }
    .about-awards {
        padding-top: 65px
    }
    .about-awards .section-define-title h1,
    .about-awards .section-define-title h2 {
        font-size: 24px
    }
    .about-awards-list {
        padding-top: 25px
    }
    .about-awards-item-center {
        padding: 0 10px 25px
    }
    .about-awards-item-image img {
        width: 40%;
        height: 40%
    }
    .about-awards-item-title p {
        font-size: 40px
    }
    .about-awards-item-desc p {
        font-size: 14px
    }
    .about-philosophy {
        padding-top: 65px
    }
    .about-philosophy-info {
        padding-top: 45px
    }
    .about-info-section {
        padding: 0 0 45px
    }
    .about-info-section:before,
    .philosophy-excerption-half {
        width: 50%
    }
    .about-info-desc {
        top: unset;
        left: unset;
        -webkit-transform: none;
        transform: none;
        position: relative;
        margin-bottom: 50px
    }
    .about-info-item {
        width: calc(100% - 25px);
        padding-right: 25px
    }
    .about-services {
        padding-top: 65px
    }
    .about-services .section-define-title h1,
    .about-services .section-define-title h2 {
        font-size: 24px
    }
    .about-services-define {
        padding: 55px 0 25px
    }
    .about-service-item {
        margin-bottom: 45px
    }
    .service-excerption-half {
        left: calc(50% - 25px)
    }
    .service-excerption-half .service-excerption-words {
        margin-left: calc(-50% + 25px)
    }
}

.unit-container[data-page=talks] {
    padding-bottom: 145px
}

.talks-tags {
    padding-top: 60px;
    -webkit-perspective: 100px;
    perspective: 100px
}

.talks-list,
.talks-tags {
    width: 100%;
    position: relative
}

.talks-list {
    padding-bottom: 70px
}

.talks-pagination {
    width: 100%;
    position: relative
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=talks] {
        padding-bottom: 125px
    }
    .talks-tags {
        padding-top: 50px
    }
    .talks-list {
        padding-bottom: 60px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=talks] {
        padding-bottom: 100px
    }
    .talks-tags {
        padding-top: 40px
    }
    .talks-list {
        padding-bottom: 50px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=talks] {
        padding-bottom: 60px
    }
    .talks-list {
        padding-bottom: 40px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=talks] {
        padding-bottom: 60px
    }
    .talks-list {
        padding-bottom: 40px
    }
}

.unit-container[data-page=home] {
    padding-bottom: 145px
}

.index-define {
    position: relative;
    overflow: hidden;
    width: 100%;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.index-define-canvas {
    z-index: 1
}

.index-define-canvas,
.index-define-canvas:before {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: red
}

.index-define-canvas:before {
    content: "";
    display: block;
    z-index: 2;
    mix-blend-mode: multiply;
    pointer-events: none;
    -webkit-transition: opacity .5s ease-out;
    transition: opacity .5s ease-out;
    will-change: opacity;
    opacity: 0
}

.index-define-canvas.red:before {
    opacity: 1
}

.index-define-canvas iframe {
    position: absolute;
    display: block;
    width: 50%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 3
}

@media only screen and (max-width:1024px) {
    .index-define-canvas iframe {
        width: 100%
    }
}

@supports not (mix-blend-mode:multiply) {
    .index-define-canvas.red:before {
        opacity: .7
    }
}

.index-define-info {
    position: relative;
    width: 50%;
    height: 100%;
    z-index: 2;
    background: #fff;
    -webkit-transform-origin: right center;
    transform-origin: right center
}

.index-define-info,
.index-define-info .index-titles-inner {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.index-define-info .index-titles-inner {
    will-change: transform
}

.index-define-info.to-right {
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
}

.index-define-info.to-right .index-titles-inner {
    -webkit-transform: translate3d(300px, 0, 0);
    transform: translate3d(300px, 0, 0)
}

.index-define-info-inner {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    z-index: 2;
    padding: 200px 80px;
    -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
}

.index-titles {
    position: relative;
    width: 100%;
    height: 123px;
    margin-bottom: 30px
}

.index-titles.loading {
    opacity: 0
}

.index-titles-inner {
    position: relative;
    width: calc(100% + 300px);
    height: 100%;
    margin-left: -300px
}

.index-title {
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    will-change: transform
}

.index-title-white {
    position: absolute;
    width: 220px;
    top: 0;
    left: 0;
    overflow: hidden;
    z-index: 2;
    white-space: nowrap
}

.index-title-white a,
.index-title-white p {
    color: #fff;
    font: 100px/1.1 "Exo 2", sans-serif;
}

.index-title-black {
    position: relative;
    width: 100%;
    z-index: 1;
    white-space: nowrap
}

.index-title-black a,
.index-title-black p {
    color: #000;
    font: 100px/1.1 "Exo 2", sans-serif;
}

@media only screen and (max-width:1024px) {
    .index-title-black a,
    .index-title-black p {
        color: #fff
    }
}

.index-title-black a {
    -webkit-transition: color .8s cubic-bezier(.4, 0, 0, 1);
    transition: color .8s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: color;
    transition-property: color
}

.index-title-black a:hover {
    color: red
}

.index-descs {
    position: relative;
    width: 100%;
    height: 168px;
    margin-bottom: 90px
}

.index-descs.loading {
    opacity: 0
}

.index-desc {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    padding-right: 25%;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    will-change: transform
}

.index-desc-title {
    position: relative;
    width: 100%;
    height: 30px;
    overflow: hidden;
    margin-bottom: 20px;
    white-space: nowrap
}

.index-desc-title p {
    color: #908f8f;
    font: 20px/1.5 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.index-desc-desc {
    position: relative;
    width: 100%;
    height: 120px;
    overflow: hidden
}

.index-desc-desc h1,
.index-desc-desc p {
    font: 20px/1.5 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.index-examples {
    position: absolute;
    width: 100%;
    top: -20px;
    left: 0;
    -webkit-transform: translate3d(0, -100%, 0);
    transform: translate3d(0, -100%, 0)
}

.index-examples.loading {
    opacity: 0
}

.index-examples.visible .example-cursor {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.index-examples.visible .example-cursor:before {
    -webkit-animation: grabCursor 2s cubic-bezier(.4, 0, 0, 1) normal infinite 1.75s;
    animation: grabCursor 2s cubic-bezier(.4, 0, 0, 1) normal infinite 1.75s
}

.index-examples.visible .example-cursor:after {
    animation: grabCursor 2s cubic-bezier(.4, 0, 0, 1) reverse infinite 1.75s
}

@-webkit-keyframes grabCursor {
    0%,
    50% {
        opacity: 0
    }
    51%,
    to {
        opacity: 1
    }
}

@keyframes grabCursor {
    0%,
    50% {
        opacity: 0
    }
    51%,
    to {
        opacity: 1
    }
}

.index-examples.visible .example-rectangle-red {
    -webkit-animation: rectangleDirection 2s cubic-bezier(.4, 0, 0, 1) normal infinite 1.75s;
    animation: rectangleDirection 2s cubic-bezier(.4, 0, 0, 1) normal infinite 1.75s
}

.index-examples.visible .example-rectangle-red:before {
    -webkit-animation: rectangleActive 2s cubic-bezier(.4, 0, 0, 1) normal infinite 1.75s;
    animation: rectangleActive 2s cubic-bezier(.4, 0, 0, 1) normal infinite 1.75s
}

@-webkit-keyframes rectangleDirection {
    0% {
        top: -2px;
        left: -2px
    }
    50%,
    75% {
        top: -68px;
        left: -80px
    }
}

@keyframes rectangleDirection {
    0% {
        top: -2px;
        left: -2px
    }
    50%,
    75% {
        top: -68px;
        left: -80px
    }
}

@media only screen and (max-width:1400px) {
    @-webkit-keyframes rectangleDirection {
        0% {
            top: -2px;
            left: -2px
        }
        50%,
        75% {
            top: -60px;
            left: -60px
        }
    }
    @keyframes rectangleDirection {
        0% {
            top: -2px;
            left: -2px
        }
        50%,
        75% {
            top: -60px;
            left: -60px
        }
    }
}

@-webkit-keyframes rectangleActive {
    0%,
    50% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    75%,
    to {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
}

@keyframes rectangleActive {
    0%,
    50% {
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1)
    }
    75%,
    to {
        opacity: 0;
        -webkit-transform: scale(0);
        transform: scale(0)
    }
}

.index-example {
    position: relative;
    width: 141px;
    height: 42px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    will-change: transform
}

.example-rectangle-gray {
    position: relative;
    display: block;
    width: 30px;
    height: 100%;
    border: 2px solid #e8e8e8
}

.example-rectangle-red {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: -2px;
    left: -2px;
    z-index: 2;
    will-change: transform;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.example-rectangle-red:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: 2px solid red;
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
    -webkit-transform-origin: center center;
    transform-origin: center center;
    will-change: opacity, transform
}

.example-cursor {
    position: absolute;
    display: block;
    width: 30px;
    height: 32px;
    top: 29px;
    left: 0;
    right: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) 1s;
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) 1s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) 1s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) 1s, -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) 1s
}

.example-cursor:after,
.example-cursor:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 30px;
    height: 32px;
    background-repeat: no-repeat
}

.example-cursor:before {
    opacity: 0;
    z-index: 1;
    background-image: url("/images/grab-cursor.svg")
}

.example-cursor:after {
    opacity: 1;
    z-index: 2;
    background-image: url("/images/grabbing-cursor.svg")
}

.draggs-wrap {
    position: absolute;
    width: calc(100% - 160px);
    height: 170px;
    left: 80px;
    bottom: 60px
}

.index-draggs {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    bottom: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.index-draggs.loading {
    opacity: 0
}

.index-draggs.pointer-none {
    pointer-events: none
}

.index-drag-wrapper {
    position: relative;
    width: 120px;
    height: 100%;
    margin-right: 15px
}

.index-drag {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    top: 0;
    left: 0;
    background: #dadada;
    -webkit-transition: -webkit-box-shadow .25s;
    transition: -webkit-box-shadow .25s;
    transition: box-shadow .25s;
    transition: box-shadow .25s, -webkit-box-shadow .25s
}

.index-drag:before {
    content: "";
    position: absolute;
    width: calc(100% - 4px);
    height: calc(100% - 4px);
    top: 0;
    left: 0;
    opacity: 0;
    z-index: 2;
    border: 2px solid red;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, border-color;
    transition-property: opacity, border-color
}

.index-drag.active {
    pointer-events: none;
    cursor: -webkit-grab!important;
    cursor: grab!important
}

.index-drag.active:before {
    opacity: 1
}

.index-drag.contain:before {
    opacity: 1;
    border-color: #fff
}

.index-drag:active {
    cursor: -webkit-grabbing!important;
    cursor: grabbing!important
}

.index-drag.dragging {
    -webkit-box-shadow: 20px 20px 40px rgba(0, 0, 0, .15);
    box-shadow: 20px 20px 40px rgba(0, 0, 0, .15)
}

.index-drag img {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    -o-object-fit: cover;
    object-fit: cover
}

.index-buttons {
    position: relative;
    display: none;
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.index-buttons.loading {
    opacity: 0
}

.index-pagination {
    position: relative;
    display: block;
    width: 60px;
    height: 60px;
    padding: 0;
    margin: 0 5px;
    overflow: hidden;
    background: none;
    border-radius: 50%;
    border: 2px solid #fff;
    cursor: pointer
}

.index-pagination:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 8px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

.index-pagination:first-child {
    margin-left: 0
}

.index-pagination:last-child {
    margin-right: 0
}

.index-pagination:disabled {
    pointer-events: none
}

.index-pagination.active {
    opacity: .5;
    pointer-events: none
}

.index-pagination-prev:before {
    background: url("/images/prev-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.index-pagination-next:before {
    background: url("/images/next-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.index-info {
    position: relative;
    width: 100%;
    padding: 230px 0 290px
}

.index-info:before {
    content: "";
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    right: 0;
    background: #f6f6f6
}

.section-index-info {
    position: relative;
    width: 100%;
    padding-top: 100px;
    z-index: 2
}

.section-index-info-inner {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-index-info-item {
    position: relative;
    width: 50%;
    padding-right: 12.5%
}

.section-index-info-item:nth-child(2) {
    padding-left: 80px
}

.section-index-info-item.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0);
    transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0)
}

.section-index-info-item.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-index-info-item.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .06666667s;
    transition-delay: .06666667s
}

.section-index-info-item.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .13333333s;
    transition-delay: .13333333s
}

.section-index-info-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.section-index-info-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-index-info-item-inner,
.section-index-info-name {
    position: relative;
    width: 100%
}

.section-index-info-name {
    margin-bottom: 30px
}

.section-index-info-name p {
    color: red;
    font: 20px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-index-info-title {
    position: relative;
    width: 100%;
    margin-bottom: 30px
}

.section-index-info-title p {
    font: 40px/1.15 "Exo 2", sans-serif;
}

.section-index-info-desc {
    position: relative;
    width: 100%
}

.section-index-info-desc p {
    font: 20px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.index-portfolio,
.index-portfolio-first {
    position: relative;
    width: 100%
}

.index-portfolio-first {
    padding-bottom: 110px
}

.index-first-item {
    position: relative;
    width: 37.5%;
    overflow: hidden;
    margin-left: 12.5%
}

.index-first-item .index-item-image {
    padding-top: 130%
}

.infinite-line {
    position: absolute;
    top: 0;
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap
}

.infinite-line-white {
    left: -12.5vw;
    z-index: 3
}

.infinite-line-white .infinite-words {
    color: #fff
}

.infinite-line-black {
    left: 0;
    z-index: 1
}

.infinite-line-black .infinite-sentence {
    pointer-events: all
}

.infinite-line-black .infinite-sentence .infinite-words {
    color: #000
}

html.touch-device .infinite-sentence {
    pointer-events: none!important
}

.infinite-sentence {
    position: relative;
    display: inline-block;
    width: auto;
    cursor: -webkit-grab;
    cursor: grab;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    will-change: transform;
    white-space: nowrap
}

.infinite-sentence:active {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.infinite-words {
    position: relative;
    display: inline-block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    will-change: transform;
    -webkit-transform: skew(0, 0);
    transform: skew(0, 0);
    -webkit-transition: -webkit-transform .3s cubic-bezier(.455, .03, .515, .955);
    transition: -webkit-transform .3s cubic-bezier(.455, .03, .515, .955);
    transition: transform .3s cubic-bezier(.455, .03, .515, .955);
    transition: transform .3s cubic-bezier(.455, .03, .515, .955), -webkit-transform .3s cubic-bezier(.455, .03, .515, .955);
    font: 100px "Exo 2", sans-serif;
}

.infinite-words.curve-left {
    -webkit-transform: skewX(25deg);
    transform: skewX(25deg)
}

.infinite-words.curve-right {
    -webkit-transform: skewX(-25deg);
    transform: skewX(-25deg)
}

.index-portfolio-other {
    position: relative;
    width: 100%
}

.index-portfolio-define {
    position: absolute;
    width: 100%;
    padding-top: 10%;
    pointer-events: none;
    z-index: 2
}

.index-portfolio-define .section-define-name p,
.index-portfolio-define .section-define-title h1,
.index-portfolio-define .section-define-title h2 {
    pointer-events: all
}

.index-portfolio-define .section-define-title,
.index-portfolio-define .section-define-title h2 {
    pointer-events: none!important
}

.index-portfolio-define-center {
    position: relative;
    width: 45%;
    margin: 0 auto
}

.index-other-list {
    width: 100%;
    -webkit-box-orient: horizontal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap
}

.index-other-left,
.index-other-list,
.index-other-right {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.index-other-left,
.index-other-right {
    width: 50%;
    -webkit-box-orient: vertical;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap
}

.index-other-left {
    padding-top: 21.5%
}

.index-other-left .index-other-item {
    width: 73%
}

.index-other-left .index-other-item .index-item-image {
    padding-top: 134%
}

.index-other-left .index-other-item .index-item-desc,
.index-other-left .index-other-item .index-item-title {
    text-align: right
}

.index-other-right .index-other-item:nth-child(odd) {
    width: 100%
}

.index-other-right .index-other-item:nth-child(odd) .index-item-image {
    padding-top: 83%
}

.index-other-right .index-other-item:nth-child(2n) {
    width: 73%
}

.index-other-right .index-other-item:nth-child(2n) .index-item-image {
    padding-top: 134%
}

.index-other-item {
    position: relative;
    overflow: hidden;
    margin-bottom: 110px
}

.index-other-item.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(5);
    filter: brightness(5);
    will-change: filter, opacity, transform;
    -webkit-transform: translate3d(0, 30vh, 0);
    transform: translate3d(0, 30vh, 0)
}

.index-other-item.animate-element .index-item-image img {
    -webkit-transform: scale(1.5);
    transform: scale(1.5);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.index-other-item.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.index-other-item.animate-element[data-start=true] .index-item-image img {
    -webkit-transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1), -webkit-transform 2s cubic-bezier(.4, 0, 0, 1)
}

.index-other-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.index-other-item.animate-element[data-start=true].visible .index-item-image img {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.index-other-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.index-item-image {
    position: relative;
    width: 100%;
    height: 0;
    overflow: hidden;
    margin-bottom: 20px;
    background: #dadada
}

.index-item-link,
.index-item-link img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1
}

.index-item-link img {
    display: block;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -o-object-fit: cover;
    object-fit: cover
}

.index-item-link:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    opacity: 0;
    margin: auto;
    background: red;
    will-change: opacity;
    mix-blend-mode: multiply;
    -webkit-transition: opacity .5s ease-out .1s;
    transition: opacity .5s ease-out .1s
}

.index-item-link:hover:before {
    opacity: 1
}

@supports not (mix-blend-mode:multiply) {
    .index-item-link:hover:before {
        opacity: .7
    }
}

.index-item-title {
    position: relative;
    width: 100%
}

.index-item-title a {
    color: #000;
    border-bottom: 1px solid #000;
    letter-spacing: .02em;
    font: 20px/1.6 "Exo 2", sans-serif;;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1), border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1), border-color .5s cubic-bezier(.4, 0, 0, 1)
}

.index-item-title a:hover {
    color: red;
    border-bottom-color: transparent
}

.index-item-desc {
    position: relative;
    width: 100%
}

.index-item-desc p {
    font: 20px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.index-best {
    padding-top: 55px;
    -webkit-perspective: 50px;
    perspective: 50px
}

.index-best,
.index-showreel {
    position: relative;
    width: 100%
}

.index-showreel {
    -webkit-perspective: 100px;
    perspective: 100px
}

.index-education {
    position: relative;
    width: 100%;
    padding-top: 120px
}

.index-education .section-define-title h2 {
    font-size: 50px
}

.index-education-section {
    position: relative;
    width: 100%;
    padding-top: 50px
}

.index-education-inner {
    position: relative;
    width: 100%;
    -webkit-perspective: 50px;
    perspective: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.index-education-item {
    position: relative;
    width: 33.333%;
    padding-right: 80px
}

.index-education-item.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0);
    transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0)
}

.index-education-item.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.index-education-item.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .06666667s;
    transition-delay: .06666667s
}

.index-education-item.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .13333333s;
    transition-delay: .13333333s
}

.index-education-item.animate-element[data-start=true]:nth-child(3) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.index-education-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.index-education-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.index-education-title {
    position: relative;
    width: 100%;
    margin-bottom: 25px
}

.index-education-title a {
    color: #000;
    border-bottom: 2px solid #000;
    font: 30px/1.1 "Exo 2", sans-serif;;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1), border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1), border-color .5s cubic-bezier(.4, 0, 0, 1)
}

.index-education-title a:hover {
    color: red;
    border-bottom-color: transparent
}

.index-education-desc {
    position: relative;
    width: 100%;
    margin-bottom: 30px
}

.index-education-desc p {
    color: #908f8f;
    font: 16px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.index-education-link {
    position: relative;
    width: 100%
}

.index-education-link a {
    position: relative;
    padding-bottom: 7px;
    color: #000;
    font: 16px "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.index-education-link a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    bottom: 0;
    background: #000;
    -webkit-transform: scaleX(1.2);
    transform: scaleX(1.2);
    will-change: transform;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.index-education-link a:hover:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.index-blog {
    position: relative;
    width: 100%;
    padding-top: 120px
}

.index-blog .section-define-title h2 {
    font-size: 50px
}

.index-articles,
.index-blog-section {
    position: relative;
    width: 100%
}

.index-articles {
    padding-top: 120px;
    -webkit-perspective: 50px;
    perspective: 50px
}

.index-define-canvas .canvas-wrapper {
    z-index: 2;
    width: 50%;
    background: transparent;
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0
}

.index-define-canvas .canvas-wrapper #flyingDotsLogo {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    display: block
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=home] {
        padding-bottom: 125px
    }
    .index-info {
        padding: 180px 0 240px
    }
    .index-define-info-inner {
        padding: 145px 60px
    }
    .index-titles {
        height: 100px;
        margin-bottom: 25px
    }
    .index-titles-inner {
        width: calc(100% + 250px);
        margin-left: -250px
    }
    .index-title-white {
        width: 190px
    }
    .index-title-black a,
    .index-title-black p,
    .index-title-white a,
    .index-title-white p {
        font-size: 80px
    }
    .index-descs {
        height: 146px;
        margin-bottom: 70px
    }
    .index-desc {
        padding-right: 20%
    }
    .index-desc-title {
        height: 26px;
        margin-bottom: 15px
    }
    .index-desc-title p {
        font-size: 18px
    }
    .index-desc-desc {
        height: 108px
    }
    .index-desc-desc h1,
    .index-desc-desc p {
        font-size: 18px
    }
    .draggs-wrap {
        width: calc(100% - 120px);
        height: 150px;
        left: 60px;
        bottom: 60px
    }
    .index-drag-wrapper {
        width: 110px;
        margin-right: 12px
    }
    .section-index-info {
        padding-top: 80px
    }
    .section-index-info-item {
        padding-right: 10%
    }
    .section-index-info-item:nth-child(2) {
        padding-left: 70px
    }
    .section-index-info-name {
        margin-bottom: 25px
    }
    .section-index-info-name p {
        font-size: 18px
    }
    .section-index-info-title {
        margin-bottom: 25px
    }
    .section-index-info-title p {
        font-size: 35px
    }
    .section-index-info-desc p {
        font-size: 18px
    }
    .index-portfolio-first {
        padding-bottom: 90px
    }
    .infinite-words {
        font-size: 80px
    }
    .index-item-desc p,
    .index-item-title a {
        font-size: 18px
    }
    .index-other-item {
        margin-bottom: 90px
    }
    .index-best {
        padding-top: 45px
    }
    .index-education {
        padding-top: 100px
    }
    .index-education .section-define-title h2 {
        font-size: 40px
    }
    .index-education-section {
        padding-top: 40px
    }
    .index-education-item {
        padding-right: 60px
    }
    .index-education-title {
        margin-bottom: 20px
    }
    .index-education-title a {
        font-size: 25px
    }
    .index-education-desc {
        margin-bottom: 25px
    }
    .index-education-desc p,
    .index-education-link a {
        font-size: 15px
    }
    .index-blog .section-define-title h2 {
        font-size: 40px
    }
    .index-articles,
    .index-blog {
        padding-top: 110px
    }
}

@media only screen and (max-height:850px) {
    .index-define-info-inner {
        padding-top: 160px
    }
    .index-titles {
        margin-bottom: 15px
    }
}

@media only screen and (max-width:1440px) {
    .index-define-info-inner {
        padding-top: 125px
    }
    .draggs-wrap {
        height: 135px;
        bottom: 70px
    }
    .index-titles {
        height: 85px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=home] {
        padding-bottom: 100px
    }
    .index-info {
        padding: 140px 0 200px
    }
    .index-define-info-inner {
        padding: 125px 40px
    }
    .index-titles {
        height: 75px;
        margin-bottom: 20px
    }
    .index-titles-inner {
        width: calc(100% + 200px);
        margin-left: -200px
    }
    .index-title-white {
        width: 160px
    }
    .index-title-black a,
    .index-title-black p,
    .index-title-white a,
    .index-title-white p {
        font-size: 60px
    }
    .index-descs {
        height: 132px
    }
    .index-desc {
        padding-right: 15%
    }
    .index-desc-title {
        height: 24px
    }
    .index-desc-title p {
        font-size: 16px
    }
    .index-desc-desc {
        height: 96px
    }
    .index-desc-desc h1,
    .index-desc-desc p {
        font-size: 16px
    }
    .index-example {
        width: 122px;
        height: 37px
    }
    .example-rectangle-gray {
        width: 26px
    }
    .draggs-wrap {
        width: calc(100% - 80px);
        height: 130px;
        left: 40px;
        bottom: 50px
    }
    .index-drag-wrapper {
        width: 100px;
        margin-right: 10px
    }
    .section-index-info {
        padding-top: 60px
    }
    .section-index-info-item:nth-child(2) {
        padding-left: 60px
    }
    .section-index-info-name {
        margin-bottom: 20px
    }
    .section-index-info-name p {
        font-size: 16px
    }
    .section-index-info-title {
        margin-bottom: 20px
    }
    .section-index-info-title p {
        font-size: 30px
    }
    .section-index-info-desc p {
        font-size: 16px
    }
    .index-portfolio-first {
        padding-bottom: 70px
    }
    .infinite-line-white {
        left: -40px
    }
    .infinite-words {
        font-size: 65px
    }
    .index-first-item {
        width: calc(50% - 40px);
        margin-left: 40px
    }
    .index-item-desc p,
    .index-item-title a {
        font-size: 16px
    }
    .index-other-item {
        margin-bottom: 70px
    }
    .index-other-left .index-other-item,
    .index-other-right .index-other-item:nth-child(2n) {
        width: calc(100% - 40px)
    }
    .index-best {
        padding-top: 35px
    }
    .index-blog .section-define-title h2 {
        font-size: 30px
    }
    .index-education {
        padding-top: 80px
    }
    .index-education .section-define-title h2 {
        width: 75%;
        font-size: 30px
    }
    .index-education-section {
        padding-top: 30px
    }
    .index-education-item {
        padding-right: 50px
    }
    .index-education-title {
        margin-bottom: 15px
    }
    .index-education-title a {
        font-size: 21px
    }
    .index-education-desc {
        margin-bottom: 20px
    }
    .index-education-desc p,
    .index-education-link a {
        font-size: 14px
    }
    .index-articles,
    .index-blog {
        padding-top: 100px
    }
}

@media only screen and (max-width:1024px) {
    .index-define-canvas .canvas-wrapper {
        width: 100%
    }
    .index-define-canvas .canvas-wrapper #flyingDotsLogo {
        width: 194px;
        height: 315px;
        margin: auto;
        -webkit-transform: translateY(-75px);
        transform: translateY(-75px)
    }
    .index-info {
        padding: 100px 0 140px
    }
    .index-define-canvas {
        width: 100%
    }
    .index-define-info {
        width: 100%;
        background: none;
        position: relative
    }
    .index-define-info-inner {
        padding: 40px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        text-align: center
    }
    .index-titles-inner {
        width: 100%;
        margin-left: 0
    }
    .index-title-white {
        display: none
    }
    .index-title-black a,
    .index-title-black p {
        color: #fff
    }
    .index-title:first-child {
        margin-top: 90px
    }
    .index-desc:first-child {
        margin-top: 75px
    }
    .index-descs {
        height: auto;
        margin-bottom: 30px
    }
    .index-desc {
        padding-right: 0
    }
    .index-desc-title {
        margin-bottom: 0;
        height: auto;
        white-space: normal
    }
    .index-desc-title p {
        color: #fff;
        font-size: 14px
    }
    .index-desc-desc {
        display: none
    }
    .index-desc-desc h1,
    .index-desc-desc p {
        color: #fff;
        font-size: 15px
    }
    .draggs-wrap,
    .index-draggs,
    .index-examples {
        display: none
    }
    .index-buttons {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
    .index-pagination {
        width: 50px;
        height: 50px;
        background-color: #fff;
        margin: 0;
        border: none;
        border-radius: 0
    }
    .index-pagination-prev:before {
        background-image: url(/images/prev-black.svg)
    }
    .index-pagination-next:before {
        background-image: url(/images/next-black.svg)
    }
    .section-index-info-item {
        padding-right: 8.5%
    }
    .section-index-info-item:nth-child(2) {
        padding-left: 40px
    }
    .index-portfolio-define {
        position: relative;
        padding-top: 40px;
        padding-bottom: 60px
    }
    .index-portfolio-define-center {
        width: calc(100% - 80px)
    }
}

@media only screen and (max-width:820px) and (orientation:landscape) {
    .index-define-canvas .canvas-wrapper #flyingDotsLogo {
        width: 230px;
        height: 126px;
        -webkit-transform: translateY(-24px);
        transform: translateY(-24px)
    }
}

@media only screen and (max-width:800px) {
    .index-titles {
        height: 53px
    }
    .index-title-black a,
    .index-title-black p {
        font-size: 45px
    }
    .section-index-info-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .section-index-info-item {
        width: 100%;
        padding-right: 0;
        margin-bottom: 60px
    }
    .section-index-info-item:last-child {
        margin-bottom: 0
    }
    .section-index-info-item:nth-child(2) {
        padding-left: 0
    }
    .index-first-item {
        width: calc(100% - 40px);
        margin-left: 40px
    }
    .index-first-item .index-item-desc,
    .index-first-item .index-item-title {
        padding-right: 40px
    }
    .index-other-list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .index-other-left {
        width: 100%;
        padding-top: 0
    }
    .index-other-left .index-other-item .index-item-desc,
    .index-other-left .index-other-item .index-item-title {
        text-align: left;
        padding: 0 40px
    }
    .index-other-right {
        width: 100%
    }
    .index-other-right .index-other-item:nth-child(odd) {
        width: calc(100% - 40px);
        margin-left: 40px
    }
    .index-other-right .index-other-item:nth-child(odd) .index-item-desc,
    .index-other-right .index-other-item:nth-child(odd) .index-item-title {
        padding: 0 40px 0 0
    }
    .index-other-right .index-other-item:nth-child(2n) {
        width: calc(100% - 40px)
    }
    .index-other-right .index-other-item:nth-child(2n) .index-item-desc,
    .index-other-right .index-other-item:nth-child(2n) .index-item-title {
        padding: 0 40px
    }
    .index-education .section-define-title h2 {
        width: 100%
    }
    .index-education-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .index-education-item {
        width: 100%;
        padding-right: 0;
        margin-bottom: 50px
    }
    .index-blog {
        padding-top: 60px
    }
    .index-articles {
        padding-top: 90px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=home] {
        padding-bottom: 70px
    }
    .index-info {
        padding: 70px 0 90px
    }
    .index-define {
        height: 750px
    }
    .index-titles {
        height: 34px;
        margin-bottom: 5px
    }
    .index-title-black a,
    .index-title-black p {
        font-size: 28px
    }
    .index-desc {
        width: 100%
    }
    .index-descs {
        margin-top: 15px;
        margin-bottom: 20px
    }
    .section-index-info {
        padding-top: 40px
    }
    .section-index-info-item {
        margin-bottom: 50px
    }
    .section-index-info-name {
        margin-bottom: 15px
    }
    .section-index-info-title p {
        font-size: 26px
    }
    .index-first-item {
        width: calc(100% - 25px);
        margin-left: 25px
    }
    .index-first-item .index-item-desc,
    .index-first-item .index-item-title {
        padding-right: 25px
    }
    .index-portfolio-first {
        padding-bottom: 50px
    }
    .infinite-line-white {
        left: -25px
    }
    .infinite-words {
        font-size: 40px
    }
    .index-portfolio-define {
        padding-top: 30px;
        padding-bottom: 40px
    }
    .index-portfolio-define-center {
        width: calc(100% - 50px)
    }
    .index-other-item {
        margin-bottom: 50px
    }
    .index-other-left .index-other-item {
        width: calc(100% - 25px)
    }
    .index-other-left .index-other-item .index-item-desc,
    .index-other-left .index-other-item .index-item-title {
        padding: 0 25px
    }
    .index-other-right .index-other-item:nth-child(odd) {
        width: calc(100% - 25px);
        margin-left: 25px
    }
    .index-other-right .index-other-item:nth-child(odd) .index-item-desc,
    .index-other-right .index-other-item:nth-child(odd) .index-item-title {
        padding: 0 25px 0 0
    }
    .index-other-right .index-other-item:nth-child(2n) {
        width: calc(100% - 25px)
    }
    .index-other-right .index-other-item:nth-child(2n) .index-item-desc,
    .index-other-right .index-other-item:nth-child(2n) .index-item-title {
        padding: 0 25px
    }
    .index-best {
        padding-top: 25px
    }
    .index-education {
        padding-top: 60px
    }
    .index-blog .section-define-title h2,
    .index-education .section-define-title h2 {
        font-size: 24px
    }
    .index-education-section {
        padding-top: 30px
    }
    .index-education-title {
        margin-bottom: 15px
    }
    .index-education-title a {
        font-size: 18px
    }
    .index-education-desc {
        margin-bottom: 15px
    }
    .index-blog {
        padding-top: 30px
    }
    .index-articles {
        padding-top: 70px
    }
}

@media only screen and (max-width:414px) and (orientation:portrait) {
    .index-define {
        height: 620px
    }
}

@media only screen and (max-width:375px) and (orientation:portrait) {
    .index-define {
        min-height: 560px;
        height: 100vh
    }
}

@media only screen and (max-width:375px) and (min-height:750px) and (orientation:portrait) {
    .index-define {
        height: 750px
    }
}

@media only screen and (max-width:360px) and (orientation:portrait) {
    .index-define {
        height: 500px
    }
}

@media only screen and (max-width:320px) and (orientation:portrait) {
    .index-define {
        height: 550px
    }
}

@media only screen and (max-height:895px) {
    .draggs-wrap {
        -webkit-transform: translateY(20px);
        transform: translateY(20px)
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=home] {
        padding-bottom: 60px
    }
    .index-info {
        padding: 70px 0 90px
    }
    .index-define-info-inner {
        padding: 25px
    }
    .index-titles {
        height: 34px;
        margin-bottom: 5px
    }
    .index-title-black a,
    .index-title-black p {
        font-size: 28px
    }
    .index-desc-title {
        display: none
    }
    .index-desc {
        width: 100%
    }
    .index-descs {
        margin-top: 15px;
        margin-bottom: 20px
    }
    .section-index-info-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .section-index-info {
        padding-top: 40px
    }
    .section-index-info-item {
        width: 100%;
        padding-right: 0;
        margin-bottom: 50px
    }
    .section-index-info-item:last-child {
        margin-bottom: 0
    }
    .section-index-info-item:nth-child(2) {
        padding-left: 0
    }
    .section-index-info-name {
        margin-bottom: 15px
    }
    .section-index-info-title p {
        font-size: 26px
    }
    .index-first-item {
        width: calc(50% - 25px);
        margin-left: 25px
    }
    .index-first-item .index-item-desc,
    .index-first-item .index-item-title {
        padding-right: 25px
    }
    .index-portfolio-first {
        padding-bottom: 40px
    }
    .infinite-line-white {
        left: -25px
    }
    .infinite-words {
        font-size: 40px
    }
    .index-portfolio-define {
        padding-top: 30px;
        padding-bottom: 40px
    }
    .index-portfolio-define-center {
        width: calc(100% - 50px)
    }
    .index-other-list {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-flow: row nowrap;
        flex-flow: row nowrap
    }
    .index-other-item {
        margin-bottom: 50px
    }
    .index-other-left .index-other-item {
        width: calc(100% - 25px)
    }
    .index-other-left .index-other-item .index-item-desc,
    .index-other-left .index-other-item .index-item-title {
        padding: 0 25px
    }
    .index-other-right .index-other-item:nth-child(odd) {
        width: 100%;
        margin-left: 0
    }
    .index-other-right .index-other-item:nth-child(odd) .index-item-desc,
    .index-other-right .index-other-item:nth-child(odd) .index-item-title {
        padding: 0 25px 0 0
    }
    .index-other-right .index-other-item:nth-child(2n) {
        width: calc(100% - 25px)
    }
    .index-other-right .index-other-item:nth-child(2n) .index-item-desc,
    .index-other-right .index-other-item:nth-child(2n) .index-item-title {
        padding: 0 25px 0 0
    }
    .index-best {
        padding-top: 30px
    }
    .index-education {
        padding-top: 60px
    }
    .index-education .section-define-title h2 {
        width: 100%;
        font-size: 24px
    }
    .index-blog .section-define-title h2 {
        font-size: 24px
    }
    .index-education-section {
        padding-top: 30px
    }
    .index-education-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .index-education-item {
        width: 100%;
        padding-right: 0;
        margin-bottom: 50px
    }
    .index-education-title {
        margin-bottom: 15px
    }
    .index-education-title a {
        font-size: 18px
    }
    .index-education-desc {
        margin-bottom: 15px
    }
    .index-blog {
        padding-top: 30px
    }
    .index-articles {
        padding-top: 70px
    }
}

.unit-container[data-page=notes] {
    padding-bottom: 145px
}

.notes-info {
    width: 100%;
    padding-top: 60px;
    position: relative
}

.notes-info-section {
    width: 100%;
    padding-top: 70px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: reverse;
    -ms-flex-flow: row-reverse nowrap;
    flex-flow: row-reverse nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.notes-info-left {
    width: 66.667%;
    position: relative;
    padding-right: 120px;
    -webkit-perspective: 100px;
    perspective: 100px
}

.notes-info-right {
    width: 33.333%;
    position: relative
}

.notes-events,
.notes-events-title {
    width: 100%;
    position: relative
}

.notes-events-title {
    margin-bottom: 30px
}

.notes-events-title p {
    font: 30px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.1
}

.notes-events-title.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.notes-events-title.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.notes-events-title.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.notes-events-title.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.notes-tickets {
    width: 100%;
    position: relative;
    -webkit-perspective: 100px;
    perspective: 100px
}

.notes-ticket {
    width: 100%;
    position: relative;
    margin-bottom: 40px
}

.notes-ticket:last-child {
    margin-bottom: 0
}

.notes-ticket.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0);
    transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0)
}

.notes-ticket.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.notes-ticket.animate-element[data-start=true]:first-child,
.notes-ticket.animate-element[data-start=true]:first-child .section-ticket-image {
    -webkit-transition-delay: .06666667s;
    transition-delay: .06666667s
}

.notes-ticket.animate-element[data-start=true]:nth-child(2),
.notes-ticket.animate-element[data-start=true]:nth-child(2) .section-ticket-image {
    -webkit-transition-delay: .13333333s;
    transition-delay: .13333333s
}

.notes-ticket.animate-element[data-start=true]:nth-child(3),
.notes-ticket.animate-element[data-start=true]:nth-child(3) .section-ticket-image {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.notes-ticket.animate-element[data-start=true] .section-ticket-image {
    will-change: filter;
    -webkit-filter: brightness(5);
    filter: brightness(5);
    -webkit-transition: -webkit-filter 1.75s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-filter 1.75s cubic-bezier(.4, 0, 0, 1);
    transition: filter 1.75s cubic-bezier(.4, 0, 0, 1);
    transition: filter 1.75s cubic-bezier(.4, 0, 0, 1), -webkit-filter 1.75s cubic-bezier(.4, 0, 0, 1)
}

.notes-ticket.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.notes-ticket.animate-element[data-start=true].visible .section-ticket-image {
    -webkit-filter: brightness(1);
    filter: brightness(1)
}

.notes-ticket.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.notes-list,
.notes-list-item {
    width: 100%;
    position: relative
}

.notes-list-item {
    margin-bottom: 40px
}

.notes-list-item:last-child {
    margin-bottom: 0
}

.notes-list-item a {
    color: #000;
    font: 20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.2;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.notes-list-item a:hover {
    color: red
}

.notes-list-item strong {
    color: red;
    margin: 0 3px;
    display: inline-block
}

.notes-list-item.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.notes-list-item.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.notes-list-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.notes-list-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=notes] {
        padding-bottom: 125px
    }
    .notes-info {
        padding-top: 50px
    }
    .notes-info-left {
        padding-right: 100px
    }
    .notes-info-section {
        padding-top: 60px
    }
    .notes-list-item {
        margin-bottom: 30px
    }
    .notes-list-item a {
        font-size: 18px
    }
    .notes-events-title {
        margin-bottom: 25px
    }
    .notes-events-title p {
        font-size: 26px
    }
    .notes-ticket {
        margin-bottom: 35px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=notes] {
        padding-bottom: 100px
    }
    .notes-info {
        padding-top: 40px
    }
    .notes-info-left {
        padding-right: 80px
    }
    .notes-info-section {
        padding-top: 50px
    }
    .notes-ticket {
        margin-bottom: 30px
    }
    .notes-list-item a {
        font-size: 16px
    }
    .notes-events-title {
        margin-bottom: 20px
    }
    .notes-events-title p {
        font-size: 24px
    }
}

@media only screen and (max-width:1024px) {
    .notes-info-section {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-flow: column-reverse nowrap;
        flex-flow: column-reverse nowrap
    }
    .notes-info-left {
        width: 100%;
        padding-right: 0;
        margin-bottom: 80px
    }
    .notes-info-right {
        width: 100%
    }
    .notes-ticket {
        margin-bottom: 60px
    }
    .notes-list-item {
        margin-bottom: 40px
    }
    .notes-list-item a {
        font-size: 20px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=notes] {
        padding-bottom: 70px
    }
    .notes-info-left {
        margin-bottom: 60px
    }
    .notes-events-title p {
        font-size: 21px
    }
    .notes-ticket {
        margin-bottom: 40px
    }
    .notes-list-item {
        margin-bottom: 30px
    }
    .notes-list-item a {
        font-size: 16px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=notes] {
        padding-bottom: 60px
    }
    .notes-info-left {
        margin-bottom: 60px
    }
    .notes-events-title p {
        font-size: 21px
    }
    .notes-ticket {
        margin-bottom: 40px
    }
    .notes-list-item {
        margin-bottom: 30px
    }
    .notes-list-item a {
        font-size: 16px
    }
}

.unit-container[data-page=career] {
    padding-bottom: 145px
}

.unit-container[data-page=career] .section-define-title h1 {
    font-size: 50px
}

.section-career-top {
    width: 100%;
    position: relative
}

.section-career-top:before {
    content: "";
    position: absolute;
    width: 50%;
    height: 100%;
    top: 0;
    left: 0;
    background: #f9f9f9;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.section-career-top.animate-element:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    will-change: transform;
    -webkit-transform-origin: left center;
    transform-origin: left center
}

.section-career-top.animate-element[data-start=true]:before {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.section-career-top.animate-element[data-start=true].visible:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.section-career-top.animate-element[data-start=true].finished {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-info,
.section-career-bottom {
    width: 100%;
    position: relative
}

.career-info {
    padding: 40px 0 100px
}

.career-info-desc {
    width: 100%;
    position: relative
}

.career-info-desc p {
    font: 20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.7
}

.career-info-desc.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.career-info-desc.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.career-info-desc.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.career-info-desc.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-office,
.career-pictures {
    width: 100%;
    position: relative
}

.career-pictures {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    z-index: 1
}

.career-pictures-section {
    width: 87.5%;
    overflow: hidden;
    padding-top: 47%;
    position: relative;
    background: #dadada
}

.career-pictures-section.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(1.25);
    filter: brightness(1.25);
    will-change: filter, opacity, transform;
    -webkit-transform: translate3d(0, 20vh, 0);
    transform: translate3d(0, 20vh, 0)
}

.career-pictures-section.animate-element .career-pictures-inner {
    -webkit-transform: scale(2);
    transform: scale(2);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.career-pictures-section.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.career-pictures-section.animate-element[data-start=true] .career-pictures-inner {
    -webkit-transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1), -webkit-transform 2s cubic-bezier(.4, 0, 0, 1)
}

.career-pictures-section.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.career-pictures-section.animate-element[data-start=true].visible .career-pictures-inner {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.career-pictures-section.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-pictures-inner {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0
}

.career-pictures-inner.flickity-enabled .career-picture img,
.career-pictures-inner.flickity-enabled .career-picture video {
    -webkit-transform: skewX(20deg);
    transform: skewX(20deg);
    will-change: transform;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.career-pictures-inner.flickity-enabled .career-picture.is-selected img,
.career-pictures-inner.flickity-enabled .career-picture.is-selected video {
    -webkit-transform: skewX(0);
    transform: skewX(0)
}

.career-picture {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0
}

.career-picture img,
.career-picture video {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.career-texts {
    width: 100%;
    height: 0;
    margin-top: -8%;
    padding-top: 16%;
    position: relative;
    z-index: 2
}

.career-texts-section {
    width: 69%;
    height: 100%;
    overflow: hidden;
    background: #000;
    position: absolute;
    top: 0;
    left: 0;
    pointer-events: none!important
}

.career-texts-section:after,
.career-texts-section:before {
    content: "";
    position: absolute;
    height: 100%;
    top: 0;
    z-index: 3
}

.career-texts-section:before {
    width: 18.225%;
    left: 0;
    background: -webkit-gradient(linear, left top, right top, from(#000), to(transparent));
    background: linear-gradient(90deg, #000 0, transparent)
}

.career-texts-section:after {
    width: 120px;
    right: 0;
    background: -webkit-gradient(linear, left top, right top, from(transparent), to(#000));
    background: linear-gradient(90deg, transparent 0, #000)
}

.career-texts-section.animate-element {
    visibility: hidden;
    pointer-events: none;
    will-change: visibility, transform;
    -webkit-transform: scaleY(1.5) skew(0, 3deg) translate3d(0, 25vh, 0);
    transform: scaleY(1.5) skew(0, 3deg) translate3d(0, 25vh, 0)
}

.career-texts-section.animate-element[data-start=true] {
    -webkit-transition-property: visibility, -webkit-transform;
    transition-property: visibility, -webkit-transform;
    transition-property: visibility, transform;
    transition-property: visibility, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.career-texts-section.animate-element[data-start=true].visible {
    visibility: visible;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.career-texts-section.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-texts-inner {
    overflow: hidden
}

.career-text,
.career-texts-inner {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.career-text {
    padding: 0 120px 0 18.225%
}

.career-text-inner {
    width: 100%;
    height: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.career-text-inner p {
    color: #908f8f;
    font: 20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.7
}

.career-texts-buttons {
    width: 31%;
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    padding: 0 60px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.career-text-button {
    width: 90px;
    height: 90px;
    padding: 0;
    border: none;
    margin: 0 10px;
    display: none;
    cursor: pointer;
    overflow: hidden;
    background: none;
    position: relative
}

.career-text-button.activated {
    display: block
}

.career-text-button:first-child {
    margin-left: 0
}

.career-text-button:last-child {
    margin-right: 0
}

.career-text-button.disabled {
    pointer-events: none!important
}

.career-text-button.disabled .circle-button:before {
    opacity: .3
}

.career-text-button.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) skew(0, 10deg) translate3d(0, 20vh, 0);
    transform: scaleY(2) skew(0, 10deg) translate3d(0, 20vh, 0)
}

.career-text-button.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.career-text-button.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.career-text-button.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.career-text-button.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.career-text-button.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-search,
.career-search-title {
    width: 100%;
    position: relative
}

.career-search-title {
    margin-bottom: 60px
}

.career-search-title p {
    font: 80px "Exo 2", sans-serif;;
    line-height: 1.1
}

.career-search-title.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.career-search-title.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.career-search-title.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.career-search-title.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-search-info {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.career-search-vacancies {
    width: 75%;
    padding-right: 80px
}

.career-search-table {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.career-search-table.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.career-search-table.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.career-search-table.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.career-search-table.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-search-table-item {
    width: 50%;
    overflow: hidden;
    padding: 50px 30px 50px 60px;
    margin: 0 -1px -1px 0;
    border: 1px solid #dadada
}

.career-search-table-item:hover div {
    color: red
}

.career-search-table-item div {
    color: #000;
    position: relative;
    display: inline-block;
    font: 20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.2;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.career-search-table-item div.career-search-hot:before {
    content: "";
    position: absolute;
    width: 21px;
    height: 29px;
    top: -4px;
    left: -33px;
    background: url("/images/fire-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.career-search-others {
    width: 25%;
    position: relative
}

.career-other-item {
    width: 100%;
    position: relative;
    margin-bottom: 60px
}

.career-other-item:last-child {
    margin-bottom: 0
}

.career-other-item.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.career-other-item.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.career-other-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.career-other-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.career-other-item-link {
    position: relative;
    width: 100%;
    margin-bottom: 25px
}

.career-other-item-link a {
    display: inline-block;
    border-bottom: 1px solid #000;
    will-change: color, border;
    -webkit-transition: all .5s cubic-bezier(.4, 0, 0, 1);
    transition: all .5s cubic-bezier(.4, 0, 0, 1);
    font: 30px/1.1 "Exo 2", sans-serif;;
    color: #000
}

.career-other-item-link a:hover {
    color: red;
    border-bottom-color: transparent
}

.career-other-item-desc {
    position: relative;
    width: 100%
}

.career-other-item-desc p {
    font: 16px/1.7 "Exo 2", sans-serif;;
    color: #6d6d6d;
    letter-spacing: .02em
}

.career-showreel {
    position: relative;
    width: 100%;
    padding-top: 150px;
    -webkit-perspective: 100px;
    perspective: 100px
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=career] {
        padding-bottom: 125px
    }
    .unit-container[data-page=career] .section-define-title h1 {
        font-size: 40px
    }
    .career-info {
        padding: 30px 0 90px
    }
    .career-info-desc p {
        font-size: 18px
    }
    .career-texts-section:after {
        width: 100px
    }
    .career-text {
        padding: 0 100px 0 18.225%
    }
    .career-text-inner p {
        font-size: 18px
    }
    .career-texts-buttons {
        width: 31%;
        padding: 0 50px
    }
    .career-text-button {
        width: 80px;
        height: 80px;
        margin: 0 7px
    }
    .career-search-title {
        margin-bottom: 50px
    }
    .career-search-title p {
        font-size: 60px
    }
    .career-search-vacancies {
        padding-right: 60px
    }
    .career-search-table-item {
        padding: 40px 25px 40px 50px
    }
    .career-search-table-item div {
        font-size: 18px
    }
    .career-search-table-item div.career-search-hot:before {
        width: 18px;
        height: 25px;
        top: -3px;
        left: -28px
    }
    .career-other-item {
        margin-bottom: 50px
    }
    .career-other-item-link {
        margin-bottom: 20px
    }
    .career-other-item-link a {
        font-size: 26px
    }
    .career-other-item-desc p {
        font-size: 15px
    }
    .career-showreel {
        padding-top: 120px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=career] {
        padding-bottom: 100px
    }
    .unit-container[data-page=career] .section-define-title h1 {
        font-size: 30px
    }
    .career-info {
        padding: 20px 0 70px
    }
    .career-info-desc p {
        font-size: 16px
    }
    .career-pictures-section {
        width: calc(100% - 40px);
        padding-top: 52%
    }
    .career-texts-section:before {
        width: 40px
    }
    .career-texts-section:after {
        width: 80px
    }
    .career-text {
        padding: 0 80px 0 40px
    }
    .career-text-inner p {
        font-size: 16px
    }
    .career-texts-buttons {
        width: 31%;
        padding: 0 40px
    }
    .career-text-button {
        width: 70px;
        height: 70px
    }
    .career-search-title {
        margin-bottom: 40px
    }
    .career-search-title p {
        font-size: 50px
    }
    .career-search-vacancies {
        padding-right: 50px
    }
    .career-search-table-item {
        padding: 30px 20px 30px 30px
    }
    .career-search-table-item div {
        font-size: 16px
    }
    .career-search-table-item div.career-search-hot:before {
        width: 14px;
        height: 20px;
        top: -1px;
        left: -21px
    }
    .career-other-item {
        margin-bottom: 40px
    }
    .career-other-item-link {
        margin-bottom: 15px
    }
    .career-other-item-link a {
        font-size: 21px
    }
    .career-other-item-desc p {
        font-size: 14px
    }
    .career-showreel {
        padding-top: 100px
    }
}

@media only screen and (max-width:1024px) {
    .section-career-top:before {
        height: calc(100% - 110px)
    }
    .career-office.margin {
        padding-bottom: 110px
    }
    .career-texts {
        margin-top: 0;
        padding-top: 0;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    .career-texts-section {
        width: calc(100% - 40px);
        display: none
    }
    .career-texts-buttons {
        width: 100%;
        top: 110px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
    .career-search-info {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .career-search-vacancies {
        width: 100%;
        padding-right: 0;
        margin-bottom: 50px
    }
    .career-search-others {
        width: 100%
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=career] {
        padding-bottom: 60px
    }
    .unit-container[data-page=career] .section-define-title h1 {
        font-size: 24px
    }
    .career-office.margin {
        margin-bottom: -140px
    }
    .career-info {
        padding: 20px 0 50px
    }
    .career-pictures-section {
        width: calc(100% - 25px);
        padding-top: 54%
    }
    .career-texts {
        height: 80px;
        padding-top: 0
    }
    .career-texts-section {
        width: calc(100% - 25px)
    }
    .career-texts-section:before {
        width: 25px
    }
    .career-texts-section:after {
        width: 40px
    }
    .career-text {
        padding: 0 40px 0 25px
    }
    .career-texts-buttons {
        top: -10px;
        padding: 0 25px
    }
    .career-text-button {
        width: 60px;
        height: 60px
    }
    .career-search-title {
        margin-bottom: 30px
    }
    .career-search-title p {
        font-size: 30px
    }
    .career-search-table-item {
        width: 100%
    }
    .career-showreel {
        padding-top: 60px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=career] {
        padding-bottom: 60px
    }
    .unit-container[data-page=career] .section-define-title h1 {
        font-size: 24px
    }
    .career-info {
        padding: 20px 0 50px
    }
    .career-pictures-section {
        width: calc(100% - 25px);
        padding-top: 54%
    }
    .career-texts {
        height: 300px;
        padding-top: 0
    }
    .career-texts-section {
        width: calc(100% - 25px)
    }
    .career-texts-section:before {
        width: 25px
    }
    .career-texts-section:after {
        width: 40px
    }
    .career-text {
        padding: 0 40px 0 25px
    }
    .career-texts-buttons {
        top: 100px;
        padding: 0 25px
    }
    .career-text-button {
        width: 60px;
        height: 60px
    }
    .career-search-title {
        margin-bottom: 30px
    }
    .career-search-title p {
        font-size: 30px
    }
    .career-search-table-item {
        width: 100%
    }
    .career-showreel {
        padding-top: 60px
    }
}

.unit-container[data-page=contacts] {
    padding-bottom: 145px
}

.contacts-info {
    width: 100%;
    position: relative;
    padding: 50px 0 70px
}

.contacts-info-section {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.contacts-left {
    width: 550px;
    position: relative;
    -webkit-perspective: 100px;
    perspective: 100px
}

.contacts-emails-main {
    width: 100%;
    position: relative;
    margin-bottom: 40px
}

.contacts-emails-main-item {
    position: relative;
    width: 100%;
    margin-bottom: 20px
}

.contacts-emails-main-item:last-child {
    margin-bottom: 0
}

.contacts-emails-main-item a {
    display: inline-block;
    white-space: nowrap;
    border-bottom: 2px solid red;
    font: 40px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.1;
    -webkit-transition: all .5s cubic-bezier(.4, 0, 0, 1);
    transition: all .5s cubic-bezier(.4, 0, 0, 1)
}

.contacts-emails-main-item a:hover {
    border-bottom-color: transparent
}

.contacts-emails-main-item.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(.5);
    filter: brightness(.5);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.contacts-emails-main-item.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.contacts-emails-main-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.contacts-emails-main-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.contacts-emails-other {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 40px
}

.contacts-emails-other.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(.5);
    filter: brightness(.5);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.contacts-emails-other.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.contacts-emails-other.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.contacts-emails-other.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.contacts-emails-other-item {
    position: relative;
    margin-right: 80px
}

.contacts-emails-other-item:last-child {
    margin-right: 0
}

.contacts-emails-other-item p {
    color: #908f8f;
    font: 20px/1.7 "Exo 2", sans-serif;
    letter-spacing: .02em;
    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: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.contacts-emails-other-item p a {
    text-decoration: none;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: color, border-color;
    transition-property: color, border-color
}

.contacts-emails-other-item a {
    display: inline-block;
    border-bottom: 1px solid #000;
    color: #000;
    white-space: nowrap;
    line-height: 1.15;
    -webkit-transition: all .5s cubic-bezier(.4, 0, 0, 1);
    transition: all .5s cubic-bezier(.4, 0, 0, 1)
}

.contacts-emails-other-item a:hover {
    color: red;
    border-bottom-color: transparent
}

.contacts-right {
    width: calc(100% - 550px);
    position: relative;
    padding-left: 60px;
    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: end;
    -ms-flex-align: end;
    align-items: flex-end
}

.contacts-right,
.contacts-right .social-section {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.contacts-right .social-section {
    margin-top: 55px;
    padding-bottom: 8px
}

.contacts-right .social-link {
    margin-right: 44px
}

.contacts-addresses-item {
    position: relative
}

.contacts-addresses-item.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) skew(0, 10deg) translate3d(0, 20vh, 0);
    transform: scaleY(2) skew(0, 10deg) translate3d(0, 20vh, 0)
}

.contacts-addresses-item.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.contacts-addresses-item.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .06666667s;
    transition-delay: .06666667s
}

.contacts-addresses-item.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .13333333s;
    transition-delay: .13333333s
}

.contacts-addresses-item.animate-element[data-start=true]:nth-child(3) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.contacts-addresses-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.contacts-addresses-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.contacts-addresses-name {
    width: 100%;
    position: relative
}

.contacts-addresses-name p {
    font: 20px "Exo 2", sans-serif;
    letter-spacing: .02em;
    line-height: 1.6;
    color: #908f8f
}

.contacts-addresses-content {
    width: 100%;
    position: relative;
    font: 20px/1.7 "Exo 2", sans-serif;
    letter-spacing: .02em
}

.contacts-addresses-content a {
    white-space: nowrap
}

.contacts-addresses-map {
    color: #000;
    line-height: 1.15;
    display: inline-block;
    border-bottom: 1px solid #000;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1), border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1), border-color .5s cubic-bezier(.4, 0, 0, 1)
}

.contacts-addresses-map:hover {
    color: red;
    border-color: transparent
}

.contacts-buttons {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.contacts-buttons .icon-button {
    width: 590px
}

.contacts-buttons .icon-button.on-map-button {
    display: none
}

.contacts-buttons .icon-button-name {
    padding: 0 30px
}

.contacts-buttons.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(.5);
    filter: brightness(.5);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.contacts-buttons.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.contacts-buttons.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.contacts-buttons.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.yt-video-link {
    width: 80px;
    height: 80px;
    border: 1px solid #ccc;
    border-radius: 50%;
    position: relative;
    -ms-flex-negative: 0;
    flex-shrink: 0;
    -webkit-transition: border-color .25s ease-in-out;
    transition: border-color .25s ease-in-out
}

@media only screen and (max-width:1600px) {
    .yt-video-link {
        width: 75px;
        height: 75px
    }
}

@media only screen and (max-width:1366px) {
    .yt-video-link {
        width: 70px;
        height: 70px
    }
}

@media only screen and (max-width:425px) {
    .yt-video-link {
        width: 60px;
        height: 60px
    }
}

.yt-video-link:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 5px 0 5px 9px;
    border-color: transparent transparent transparent #000;
    -webkit-transition: border-color .25s ease-in-out;
    transition: border-color .25s ease-in-out
}

.yt-video-link:hover {
    border-color: red
}

.yt-video-link:hover:before {
    border-color: transparent transparent transparent red
}

.contacts-office {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-perspective: 100px;
    perspective: 100px
}

.contacts-office-section {
    width: 87.5%;
    overflow: hidden;
    padding-top: 870px;
    position: relative;
    background: #dadada
}

.contacts-office-section img {
    display: block;
    -o-object-fit: cover;
    object-fit: cover
}

.contacts-office-section iframe,
.contacts-office-section img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.contacts-office-section.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(1.25);
    filter: brightness(1.25);
    will-change: filter, opacity, transform;
    -webkit-transform: translate3d(0, 20vh, 0);
    transform: translate3d(0, 20vh, 0)
}

.contacts-office-section.animate-element img {
    -webkit-transform: scale(2);
    transform: scale(2);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.contacts-office-section.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.contacts-office-section.animate-element[data-start=true] img {
    -webkit-transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: transform 2s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: transform 2s cubic-bezier(.4, 0, 0, 1) .5s, -webkit-transform 2s cubic-bezier(.4, 0, 0, 1) .5s
}

.contacts-office-section.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.contacts-office-section.animate-element[data-start=true].visible img {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.contacts-office-section.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=contacts] {
        padding-bottom: 125px
    }
    .contacts-emails-main-item {
        margin-bottom: 15px
    }
    .contacts-emails-main-item a {
        font-size: 30px
    }
    .contacts-info {
        padding: 35px 0 60px
    }
    .contacts-left {
        width: 500px
    }
    .contacts-right {
        width: calc(100% - 500px);
        padding-left: 50px
    }
    .contacts-right .social-link {
        margin-right: 31px
    }
    .icon-button.download-presentation-button {
        width: 476px
    }
    .contacts-emails-main {
        margin-bottom: 30px
    }
    .contacts-addresses-content a,
    .contacts-addresses-content p,
    .contacts-addresses-name a,
    .contacts-addresses-name p,
    .contacts-emails-other-item p {
        font-size: 18px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=contacts] {
        padding-bottom: 100px
    }
    .contacts-emails-main-item {
        margin-bottom: 10px
    }
    .contacts-emails-main-item a {
        font-size: 26px
    }
    .contacts-info {
        padding: 35px 0 50px
    }
    .contacts-left {
        width: 480px
    }
    .contacts-right {
        width: calc(100% - 480px);
        padding-left: 40px
    }
    .contacts-right .social-link {
        margin-right: 44px
    }
    .icon-button.download-presentation-button {
        width: 590px
    }
    .contacts-emails-main {
        margin-bottom: 25px
    }
    .contacts-office-section {
        width: calc(100% - 40px);
        padding-top: 620px
    }
}

@media only screen and (max-width:1200px) {
    .contacts-right .social-link {
        margin-right: 25px
    }
    .icon-button.download-presentation-button {
        width: 419px
    }
}

@media only screen and (max-width:1024px) {
    .contacts-info-section {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .contacts-left {
        width: 100%;
        margin-bottom: 40px
    }
    .contacts-right {
        width: 100%;
        padding-left: 0;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
    .contacts-right .social-section {
        margin-top: 40px;
        padding-bottom: 0;
        width: 600px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
    .contacts-right .social-section a {
        margin-left: 0;
        margin-bottom: 0
    }
    .contacts-right .social-section a:last-child {
        margin-right: 0
    }
    .contacts-addresses-item {
        width: 100%;
        padding-left: 0;
        margin-bottom: 40px
    }
    .contacts-addresses-item:last-child {
        margin-bottom: 0
    }
    .contacts-buttons {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    .icon-button.download-presentation-button {
        width: 600px
    }
}

@media only screen and (max-width:750px) {
    .contacts-emails-other {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
    .contacts-emails-other-item {
        margin-right: 0;
        margin-bottom: 15px
    }
    .contacts-emails-other-item:last-child {
        margin-bottom: 0
    }
    .contacts-right .social-section {
        display: none
    }
    .contacts-addresses-content a {
        white-space: normal
    }
    .contacts-addresses-map {
        border-bottom: none;
        line-height: 1.7
    }
    .contacts-addresses-map:hover {
        color: #000
    }
    .contacts-buttons {
        width: 100%;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap
    }
    .contacts-buttons .icon-button.on-map-button {
        display: block;
        width: 100%
    }
    .icon-button.download-presentation-button {
        width: 100%;
        margin-top: 15px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=contacts] {
        padding-bottom: 40px
    }
    .contacts-info {
        padding: 25px 0 40px
    }
    .contacts-left {
        margin-bottom: 30px
    }
    .contacts-emails-main {
        margin-bottom: 20px
    }
    .contacts-emails-main-item a {
        font-size: 21px
    }
    .contacts-emails-other-item p {
        font-size: 16px
    }
    .contacts-addresses-item {
        margin-bottom: 30px
    }
    .contacts-addresses-content a,
    .contacts-addresses-content p,
    .contacts-addresses-name a,
    .contacts-addresses-name p {
        font-size: 16px
    }
    .contacts-office-section {
        width: calc(100% - 20px);
        padding-top: 200px
    }
    .contacts-buttons {
        margin-bottom: 0
    }
    .icon-button.on-map-button {
        width: calc(100% - 60px - 20px)
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=contacts] {
        padding-bottom: 40px
    }
    .contacts-info {
        padding: 25px 0 40px
    }
    .contacts-left {
        margin-bottom: 30px
    }
    .contacts-emails-main {
        margin-bottom: 20px
    }
    .contacts-emails-main-item a {
        font-size: 21px
    }
    .contacts-emails-other-item p {
        font-size: 16px
    }
    .contacts-addresses-item {
        margin-bottom: 30px
    }
    .contacts-addresses-content a,
    .contacts-addresses-content p,
    .contacts-addresses-name a,
    .contacts-addresses-name p {
        font-size: 18px
    }
    .contacts-office-section {
        width: calc(100% - 25px);
        padding-top: 474px
    }
    .contacts-buttons {
        width: 100%;
        margin-bottom: 0
    }
    .contacts-right .social-section {
        display: none
    }
}

.download-presentation-button:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 100%;
    width: 1px;
    background-color: #dadada
}

.unit-container[data-page=sitemap] {
    padding-bottom: 125px
}

.section-three {
    padding-top: 75px
}

.section-map,
.section-three {
    width: 100%;
    position: relative
}

.map-three {
    padding: 0
}

.map-three,
.map-three ul {
    width: 100%;
    margin: 0;
    list-style: none;
    position: relative
}

.map-three ul {
    padding: 0 0 0 30px
}

.map-three ul ul {
    padding: 0
}

.map-three ul ul li {
    padding-left: 0
}

.map-three ul>ul {
    padding: 0 0 0 30px
}

.map-three li {
    position: relative
}

.map-three li.expanded>.icon:before {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

.map-three>li {
    font-size: 20px;
    padding-left: 40px;
    letter-spacing: .02em;
    line-height: 1.6;
    margin-bottom: 30px
}

.map-three>li:last-child {
    margin-bottom: 0
}

.map-three>li>a {
    color: #000;
    display: inline;
    will-change: border-color;
    border-bottom: 1px solid transparent;
    -webkit-transition: border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-color .5s cubic-bezier(.4, 0, 0, 1)
}

.map-three>li>a:hover {
    border-color: #000
}

.map-three>li.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.map-three>li.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.map-three>li.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.map-three>li.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.map-three>li ul li>a {
    color: #000
}

.map-three>li ul li>a:hover span {
    text-decoration: underline
}

.map-three>li ul li ul a {
    color: #908f8f
}

.map-three>li li {
    font: 18px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em;
    margin: 25px 0;
    padding-left: 30px
}

.map-three>li li a:hover {
    text-decoration: underline
}

.map-three>li li .icon {
    left: 0;
    top: -2px
}

.map-three .icon {
    width: 30px;
    height: 30px;
    display: block;
    position: absolute;
    top: 0;
    left: 10px;
    z-index: 2;
    cursor: pointer
}

.map-three .icon:before {
    content: "";
    position: absolute;
    width: 10px;
    height: 8px;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto 0;
    background: url("/images/select-red.svg") no-repeat 50%;
    background-size: 100% 100%;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg);
    will-change: transform;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.map-three .map-three-name {
    cursor: pointer;
    display: inline-block
}

.map-three.animate-element {
    opacity: 0
}

.map-three.animate-element[data-start=true].visible {
    opacity: 1
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=sitemap] {
        padding-bottom: 100px
    }
    .section-three {
        padding-top: 65px
    }
    .map-three ul,
    .map-three ul>ul {
        padding: 0 0 0 25px
    }
    .map-three>li {
        font-size: 18px;
        padding-left: 30px;
        margin-bottom: 25px
    }
    .map-three>li li {
        font-size: 16px;
        margin: 20px 0;
        padding-left: 25px
    }
    .map-three>li li .icon {
        top: -1px
    }
    .map-three .icon {
        width: 25px;
        height: 25px;
        left: 5px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=sitemap] {
        padding-bottom: 80px
    }
    .section-three {
        padding-top: 55px
    }
    .map-three ul,
    .map-three ul>ul {
        padding: 0 0 0 20px
    }
    .map-three>li {
        font-size: 17px;
        padding-left: 25px;
        margin-bottom: 20px
    }
    .map-three>li li {
        font-size: 15px;
        margin: 15px 0;
        padding-left: 20px
    }
    .map-three>li li .icon {
        top: 2px
    }
    .map-three .icon {
        width: 20px;
        height: 20px;
        left: 0;
        top: 3px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=sitemap] {
        padding-bottom: 60px
    }
    .section-three {
        padding-top: 40px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=sitemap] {
        padding-bottom: 60px
    }
    .section-three {
        padding-top: 40px
    }
}

.unit-container[data-page=portfolio] {
    padding-bottom: 145px
}

.portfolio-categories {
    width: 100%;
    padding-top: 40px;
    position: relative;
    -webkit-perspective: 100px;
    perspective: 100px;
    z-index: 2
}

.portfolio-categories .categories-desktop-list {
    width: calc(100% - 400px)
}

.portfolio-categories .filter-link:last-child {
    -ms-flex-negative: 0.9;
    flex-shrink: 0.9
}

.portfolio-categories .nice-select {
    position: static
}

.portfolio-categories .nice-select .current {
    padding-top: 1px
}

@media only screen and (max-width:1600px) {
    .portfolio-categories .nice-select .current {
        padding-top: 0
    }
}

.portfolio-categories .nice-select .list {
    width: 399px
}

.portfolio-list {
    padding-bottom: 70px
}

.portfolio-list,
.portfolio-pagination,
.portfolio-submit {
    width: 100%;
    position: relative
}

.portfolio-submit {
    padding-top: 120px;
    -webkit-perspective: 50px;
    perspective: 50px
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=portfolio] {
        padding-bottom: 125px
    }
    .portfolio-categories {
        width: 100%;
        padding-top: 40px
    }
    .portfolio-categories .categories-desktop-list {
        width: calc(100% - 300px)
    }
    .portfolio-categories .nice-select .list {
        width: 299px
    }
    .portfolio-list {
        padding-bottom: 60px
    }
    .portfolio-submit {
        padding-top: 100px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=portfolio] {
        padding-bottom: 100px
    }
    .portfolio-categories {
        padding-top: 25px
    }
    .portfolio-categories .categories-desktop-list {
        width: calc(100% - 280px)
    }
    .portfolio-categories .nice-select .list {
        width: 279px
    }
    .portfolio-list {
        padding-bottom: 50px
    }
    .portfolio-submit {
        padding-top: 80px
    }
}

.mobile-filter {
    display: none
}

@media only screen and (max-width:1024px) {
    .mobile-filter {
        position: absolute;
        display: block;
        top: -70px;
        right: 40px;
        width: 55px;
        height: 55px;
        background: none;
        border: none;
        outline: none;
        font-size: 0;
        line-height: 0;
        cursor: pointer
    }
    .mobile-filter:before {
        content: "";
        position: absolute;
        display: block;
        width: 21px;
        height: 20px;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        background: url("/images/filter-tool.svg") 50% 50% no-repeat;
        background-size: contain
    }
    .mobile-wrap {
        display: none
    }
    .blog-categories,
    .portfolio-categories,
    .section-categories {
        padding-top: 0
    }
    .portfolio-categories .categories-desktop-list,
    .portfolio-categories .nice-select .list {
        width: 100%
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=portfolio] {
        padding-bottom: 60px
    }
    .mobile-filter {
        top: -51px;
        right: 20px;
        width: 39px;
        height: 39px
    }
    .portfolio-list {
        padding-bottom: 40px
    }
    .portfolio-submit {
        padding-top: 50px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=portfolio] {
        padding-bottom: 60px
    }
    .mobile-filter {
        top: -51px;
        width: 39px;
        height: 39px
    }
    .portfolio-list {
        padding-bottom: 40px
    }
    .portfolio-submit {
        padding-top: 50px
    }
}

.unit-container[data-page=blog-single] {
    padding-bottom: 145px
}

.blog-single-define {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
    background: #dadada
}

.blog-single-image {
    z-index: 1
}

.blog-single-image,
.blog-single-image img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.blog-single-image img {
    display: block;
    -o-object-fit: cover;
    object-fit: cover
}

.blog-single-image canvas {
    position: absolute;
    top: 0;
    left: 0
}

.blog-single-image:before {
    content: "";
    background: rgba(0, 0, 0, .75)
}

.blog-single-image:before,
.blog-single-info {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 2
}

.blog-single-info {
    padding-top: 124px
}

.blog-single-info-center {
    position: relative;
    width: 50%;
    height: 100%;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.blog-single-back {
    width: 100%;
    margin-bottom: 50px;
    text-align: center
}

.blog-single-back a {
    position: relative;
    display: inline-block;
    padding-bottom: 7px;
    color: #fff;
    font-size: 16px;
    letter-spacing: .02em
}

.blog-single-back a:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    left: 0;
    bottom: 0;
    background: #fff;
    -webkit-transform: scaleX(1.4);
    transform: scaleX(1.4);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.blog-single-back a:hover:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.blog-single-tags {
    position: relative;
    width: 100%;
    text-align: center;
    margin-bottom: 35px
}

.blog-single-tags a,
.blog-single-tags span {
    display: inline-block;
    color: #fff;
    margin: 0 10px;
    font: 18px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.blog-single-tags a:hover {
    text-decoration: underline
}

.blog-single-title {
    position: relative;
    width: 100%;
    margin-bottom: 45px;
    text-align: center
}

.blog-single-title h1 {
    margin: 0;
    color: #fff;
    font-size: 50px;
    line-height: 1.1
}

.blog-single-badges {
    position: relative;
    width: 100%;
    margin-bottom: 25px
}

.blog-single-badges .section-badges,
.blog-single-rate {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.blog-single-rate {
    position: relative;
    width: 116px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.blog-single-rate.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.blog-single-rate.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.blog-single-rate.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.blog-single-rate.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-rate-mini {
    position: relative;
    width: auto
}

.blog-single-author {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: calc(100% - 116px);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.blog-single-author:hover .blog-single-author-info {
    text-decoration: underline
}

.blog-single-author.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.blog-single-author.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.blog-single-author.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.blog-single-author.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.blog-single-author-image {
    position: relative;
    display: block;
    width: 56px;
    height: 56px;
    overflow: hidden;
    border-radius: 50%;
    border: 1px solid transparent;
    will-change: transform, border-color;
    -webkit-transform: scale(1) translateZ(0);
    transform: scale(1) translateZ(0);
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: border-color, -webkit-transform;
    transition-property: border-color, -webkit-transform;
    transition-property: transform, border-color;
    transition-property: transform, border-color, -webkit-transform
}

.blog-single-author-image img {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    -o-object-fit: cover;
    object-fit: cover
}

.blog-single-author-info {
    position: relative;
    top: 3px;
    display: inline-block;
    vertical-align: middle;
    padding-left: 15px;
    width: calc(100% - 56px);
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 15px;
    color: #000;
    font: 16px/1.3 "Exo 2", sans-serif;;
    letter-spacing: .02em;
    text-align: left
}

.blog-single-content {
    overflow: hidden;
    padding: 100px 0 145px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse
}

.blog-single-content,
.blog-single-content-container {
    position: relative;
    width: 100%
}

.blog-single-content-center {
    position: relative;
    width: 50%;
    margin: 0 auto
}

.section-blog-share {
    position: absolute;
    width: 90px;
    height: auto;
    top: 145px!important;
    left: calc(25% - 225px)
}

.section-blog-share-inner {
    position: relative;
    width: 100%
}

.section-blog-share-inner.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0);
    transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0)
}

.section-blog-share-inner.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-blog-share-inner.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.section-blog-share-inner.animate-element[data-start=true].finished {
    pointer-events: auto
}

.blog-subscribe {
    position: relative;
    width: 100%;
    padding-top: 70px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.blog-subscribe-right {
    position: relative;
    width: 87.5%;
    background: #f9f9f9;
    padding: 160px 0 160px 12.5%
}

.blog-subscribe-right.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0)
}

.blog-subscribe-right.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.blog-subscribe-right.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.blog-subscribe-right.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.blog-subscribe-item {
    position: relative;
    width: 66.75%
}

.blog-subscribe-item .form-message {
    background: #f9f9f9
}

.blog-subscribe-item .form-message .form-message-info {
    width: calc(75% - 50px)!important;
    text-align: left
}

.blog-subscribe-title {
    position: relative;
    width: 100%;
    margin-bottom: 15px
}

.blog-subscribe-title p {
    font: 30px/1.1 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.blog-subscribe-desc {
    position: relative;
    width: 100%;
    margin-bottom: 30px
}

.blog-subscribe-desc p {
    font: 14px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.blog-figure,
.blog-subscribe-content {
    position: relative;
    width: 100%
}

.blog-figure {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.blog-figure-input {
    position: relative;
    width: calc(100% - 230px)
}

.blog-figure-input .submit-input {
    background: none
}

.blog-figure-accept {
    position: relative;
    width: 230px
}

.blog-other {
    padding-top: 50px
}

.blog-other,
.blog-show {
    position: relative;
    width: 100%
}

.blog-show {
    padding-top: 145px;
    -webkit-perspective: 50px;
    perspective: 50px
}

.blog-single-content-comments {
    position: relative;
    width: 100%;
    padding-top: 100px
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=blog-single] {
        padding-bottom: 125px
    }
    .blog-single-content {
        padding: 80px 0 125px
    }
    .section-blog-share {
        width: 80px;
        top: 125px!important;
        left: calc(25% - 165px)
    }
    .blog-subscribe-right {
        padding: 140px 0 140px 12.5%
    }
    .blog-subscribe-title p {
        font-size: 26px
    }
    .blog-figure-input {
        width: calc(100% - 200px)
    }
    .blog-figure-accept {
        width: 200px
    }
    .blog-single-author-info {
        font-size: 14px;
        padding-left: 10px;
        padding-right: 10px
    }
    .blog-other {
        padding-top: 40px
    }
    .blog-show {
        padding-top: 125px
    }
    .blog-single-info {
        padding-top: 100px
    }
    .blog-single-back {
        margin-bottom: 40px
    }
    .blog-single-back a {
        font-size: 15px;
        padding-bottom: 6px
    }
    .blog-single-tags {
        margin-bottom: 30px
    }
    .blog-single-tags a,
    .blog-single-tags span {
        margin: 0 8px;
        font-size: 16px
    }
    .blog-single-title {
        margin-bottom: 35px
    }
    .blog-single-title h1 {
        font-size: 40px
    }
    .blog-single-badges {
        margin-bottom: 20px
    }
    .blog-single-author-image {
        width: 55px;
        height: 55px
    }
    .blog-single-author-info p {
        font-size: 15px
    }
    .blog-single-content-comments {
        padding-top: 80px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=blog-single] {
        padding-bottom: 100px
    }
    .blog-single-content {
        padding: 70px 0 110px
    }
    .blog-single-content-center {
        width: 75%
    }
    .section-blog-share {
        width: 70px;
        left: 40px;
        top: 105px!important
    }
    .blog-subscribe-right {
        width: 100%;
        padding: 120px 0
    }
    .blog-subscribe-item {
        width: 75%;
        margin: 0 auto
    }
    .blog-subscribe-item .form-message .form-message-info {
        width: 75%!important
    }
    .blog-subscribe-title {
        margin-bottom: 10px
    }
    .blog-subscribe-title p {
        font-size: 24px
    }
    .blog-figure-input {
        width: calc(100% - 180px)
    }
    .blog-figure-accept {
        width: 180px
    }
    .blog-other {
        padding-top: 30px
    }
    .blog-show {
        padding-top: 100px
    }
    .blog-single-info-center {
        width: 75%
    }
    .blog-single-back {
        margin-bottom: 35px
    }
    .blog-single-back a {
        font-size: 14px
    }
    .blog-single-tags {
        margin-bottom: 25px
    }
    .blog-single-tags a,
    .blog-single-tags span {
        font-size: 15px
    }
    .blog-single-title {
        margin-bottom: 30px
    }
    .blog-single-title h1 {
        font-size: 36px
    }
    .blog-single-badges {
        margin-bottom: 20px
    }
    .blog-single-author-image {
        width: 50px;
        height: 50px
    }
    .blog-single-author-info p {
        font-size: 14px
    }
    .blog-single-content-comments {
        padding-top: 70px
    }
}

@media only screen and (max-width:1024px) {
    .blog-single-content {
        padding: 50px 0 100px
    }
    .blog-single-content-center {
        width: calc(100% - 80px)
    }
    .section-blog-share {
        width: 100%;
        left: unset;
        position: relative;
        padding: 65px 40px 0;
        top: unset!important
    }
    .blog-subscribe-item {
        width: calc(100% - 80px)
    }
    .blog-subscribe-item .form-message .form-message-info {
        width: calc(100% - 80px)!important
    }
    .blog-single-define {
        height: auto
    }
    .blog-single-info {
        position: relative;
        padding: 150px 0 80px
    }
    .blog-single-info-center {
        width: calc(100% - 80px)
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=blog-single] {
        padding-bottom: 60px
    }
    .blog-single-content {
        padding: 40px 0 80px
    }
    .blog-single-content-center {
        width: calc(100% - 40px)
    }
    .section-blog-share {
        padding: 65px 25px 0
    }
    .blog-subscribe-right {
        padding: 100px 0
    }
    .blog-subscribe {
        padding-top: 35px
    }
    .blog-subscribe-item {
        width: calc(100% - 40px)
    }
    .blog-subscribe-item .form-message .form-message-info {
        width: calc(100% - 40px)!important
    }
    .blog-figure {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .blog-figure-accept,
    .blog-figure-input {
        width: 100%
    }
    .blog-figure-input {
        margin-bottom: 20px
    }
    .blog-other {
        padding-top: 10px
    }
    .blog-show {
        padding-top: 60px
    }
    .blog-single-author {
        width: 100%
    }
    .blog-single-info {
        position: relative;
        padding: 125px 0 55px
    }
    .blog-single-info-center {
        width: calc(100% - 50px)
    }
    .blog-single-title h1 {
        font-size: 26px;
        line-height: 1.2
    }
    .blog-single-content-comments {
        padding-top: 60px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=blog-single] {
        padding-bottom: 60px
    }
    .blog-single-content {
        padding: 40px 0 80px
    }
    .blog-single-content-center {
        width: calc(100% - 40px)
    }
    .section-blog-share {
        padding: 65px 25px 0
    }
    .blog-subscribe-right {
        padding: 100px 0
    }
    .blog-subscribe-item {
        width: calc(100% - 40px)
    }
    .blog-subscribe-item .form-message .form-message-info {
        width: calc(100% - 40px)!important
    }
    .blog-other {
        padding-top: 20px
    }
    .blog-show {
        padding-top: 60px
    }
    .blog-single-info {
        position: relative;
        padding: 125px 0 55px
    }
    .blog-single-info-center {
        width: calc(100% - 50px)
    }
    .blog-single-title h1 {
        font-size: 26px;
        line-height: 1.2
    }
    .blog-single-content-comments {
        padding-top: 60px
    }
}

.unit-container[data-page=blog-author] {
    padding-bottom: 145px
}

.blog-define {
    width: 100%;
    position: relative;
    -webkit-perspective: 100px;
    perspective: 100px
}

.blog-define-center {
    width: 50%;
    margin: 0 auto;
    position: relative
}

.blog-define-image {
    width: 100%;
    text-align: center;
    position: relative;
    margin-bottom: 30px
}

.blog-define-image.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(5);
    filter: brightness(5);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.blog-define-image.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.blog-define-image.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.blog-define-image.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.blog-define-image-item {
    width: 90px;
    height: 90px;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background: #dadada;
    display: inline-block
}

.blog-define-image-item img {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.blog-define-name {
    width: 100%;
    text-align: center;
    position: relative;
    margin-bottom: 40px
}

.blog-define-name h1 {
    margin: 0;
    font: 50px "Exo 2", sans-serif;;
    line-height: 1.1
}

.blog-define-name.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.blog-define-name.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.blog-define-name.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.blog-define-name.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.blog-define-desc,
.blog-define-position {
    width: 100%;
    text-align: center;
    position: relative
}

.blog-define-desc p,
.blog-define-position p {
    font: 20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.7
}

.blog-define-desc.animate-element,
.blog-define-position.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.blog-define-desc.animate-element[data-start=true],
.blog-define-position.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.blog-define-desc.animate-element[data-start=true].visible,
.blog-define-position.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.blog-define-desc.animate-element[data-start=true].finished,
.blog-define-position.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.blog-define-position {
    margin-bottom: 20px
}

.blog-define-desc {
    margin-bottom: 35px
}

.blog-define-info {
    width: 100%;
    text-align: center;
    position: relative
}

.blog-define-info .section-badges {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.blog-author-list {
    padding-bottom: 70px
}

.blog-author-list,
.blog-author-pagination {
    width: 100%;
    position: relative
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=blog-author] {
        padding-bottom: 125px
    }
    .blog-define-image-item {
        width: 80px;
        height: 80px
    }
    .blog-define-name {
        margin-bottom: 30px
    }
    .blog-define-name h1 {
        font-size: 40px
    }
    .blog-define-desc p,
    .blog-define-position p {
        font-size: 18px
    }
    .blog-define-position {
        margin-bottom: 15px
    }
    .blog-define-desc {
        margin-bottom: 30px
    }
    .blog-author-list {
        padding-bottom: 60px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=blog-author] {
        padding-bottom: 100px
    }
    .blog-define-center {
        width: 75%
    }
    .blog-define-image-item {
        width: 70px;
        height: 70px
    }
    .blog-define-name {
        margin-bottom: 25px
    }
    .blog-define-name h1 {
        font-size: 36px
    }
    .blog-define-desc p,
    .blog-define-position p {
        font-size: 16px
    }
    .blog-define-position {
        margin-bottom: 10px
    }
    .blog-define-desc {
        margin-bottom: 25px
    }
    .blog-author-list {
        padding-bottom: 50px
    }
}

@media only screen and (max-width:1024px) {
    .blog-define-center {
        width: calc(100% - 80px)
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=blog-author] {
        padding-bottom: 60px
    }
    .blog-define-center {
        width: calc(100% - 50px)
    }
    .blog-define-name {
        margin-bottom: 20px
    }
    .blog-define-name h1 {
        font-size: 30px
    }
    .blog-author-list {
        padding-bottom: 40px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=blog-author] {
        padding-bottom: 60px
    }
    .blog-define-center {
        width: calc(100% - 50px)
    }
    .blog-define-name {
        margin-bottom: 20px
    }
    .blog-define-name h1 {
        font-size: 30px
    }
    .blog-author-list {
        padding-bottom: 40px
    }
}

.unit-container[data-page=talks-single] {
    padding-bottom: 45px
}

.unit-container[data-page=talks-single]~#footer .footer-info:before {
    display: none
}

.talks-subscribe {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    padding-top: 65px
}

.talks-subscribe-right {
    width: 87.5%;
    position: relative;
    background: #f9f9f9;
    padding: 160px 0 160px 12.5%
}

.talks-subscribe-right.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0)
}

.talks-subscribe-right.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.talks-subscribe-right.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.talks-subscribe-right.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.talks-subscribe-item {
    width: 66.75%;
    position: relative;
    z-index: 2
}

.talks-subscribe-item .form-message {
    background: #f9f9f9
}

.talks-subscribe-item .form-message .form-message-info {
    width: 100%!important;
    text-align: center
}

.talks-subscribe-title {
    width: 100%;
    position: relative;
    margin-bottom: 15px
}

.talks-subscribe-title p {
    font: 30px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.1
}

.talks-subscribe-desc {
    width: 100%;
    position: relative;
    margin-bottom: 30px
}

.talks-subscribe-desc p {
    font: 14px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.7
}

.talks-subscribe-content {
    width: 100%;
    position: relative
}

.talks-figure {
    -webkit-box-orient: vertical;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap
}

.talks-figure,
.talks-figure-inner {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-direction: normal;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.talks-figure-inner {
    -webkit-box-orient: horizontal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    margin-bottom: 30px
}

.talks-figure-inner:last-child {
    margin-bottom: 0
}

.talks-figure-input {
    width: calc(50% - 15px);
    position: relative;
    margin-right: 30px
}

.talks-figure-input:last-child {
    margin-right: 0
}

.talks-figure-input .submit-input {
    background: none
}

.talks-single-direction {
    width: 100%;
    position: relative;
    margin-top: 60px;
    -webkit-perspective: 100px;
    perspective: 100px
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=talks-single] {
        padding-bottom: 25px
    }
    .talks-subscribe {
        padding-top: 55px
    }
    .talks-subscribe-right {
        padding: 125px 0 125px 12.5%
    }
    .talks-subscribe-title {
        margin-bottom: 10px
    }
    .talks-subscribe-title p {
        font-size: 26px
    }
    .talks-subscribe-desc {
        margin-bottom: 25px
    }
    .talks-figure-inner {
        margin-bottom: 20px
    }
    .talks-figure-input {
        width: calc(50% - 10px);
        margin-right: 20px
    }
}

@media only screen and (max-width:1366px) {
    .talks-subscribe {
        padding-top: 45px
    }
    .talks-subscribe-right {
        width: 100%;
        padding: 100px 0
    }
    .talks-subscribe-item {
        width: 75%;
        margin: 0 auto
    }
}

@media only screen and (max-width:1200px) {
    .unit-container[data-page=talks-single] {
        padding-bottom: 45px
    }
}

@media only screen and (max-width:1024px) {
    .talks-subscribe {
        padding-top: 80px
    }
    .talks-subscribe-item {
        width: calc(100% - 80px)
    }
    .talks-figure-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }
    .talks-figure-input {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px
    }
    .talks-figure-input:last-child {
        margin-bottom: 0
    }
    .talks-figure-input .submit-button {
        width: 50%
    }
    .talks-single-direction .section-direction {
        margin-top: 0
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .talks-subscribe {
        padding-top: 65px
    }
    .talks-subscribe-right {
        padding: 75px 0
    }
    .talks-subscribe-item {
        width: calc(100% - 50px)
    }
    .talks-figure-input .submit-button {
        width: 100%
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .talks-subscribe {
        padding-top: 65px
    }
    .talks-subscribe-right {
        padding: 75px 0
    }
    .talks-subscribe-item {
        width: calc(100% - 50px)
    }
}

.unit-container[data-page=notes-single] {
    padding-bottom: 45px
}

.unit-container[data-page=notes-single]~#footer .footer-info:before {
    display: none
}

.notes-single-direction {
    width: 100%;
    position: relative;
    padding-top: 160px;
    -webkit-perspective: 100px;
    perspective: 100px
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=notes-single] {
        padding-bottom: 25px
    }
    .notes-single-direction {
        padding-top: 125px
    }
}

@media only screen and (max-width:1366px) {
    .notes-single-direction {
        padding-top: 100px
    }
}

@media only screen and (max-width:1200px) {
    .unit-container[data-page=notes-single] {
        padding-bottom: 45px
    }
}

@media only screen and (max-width:1024px) {
    .notes-single-direction {
        padding-top: 120px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .notes-single-direction {
        padding-top: 60px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .notes-single-direction {
        padding-top: 60px
    }
}

.unit-container[data-page=career-single] {
    padding-bottom: 145px
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=career-single] {
        padding-bottom: 125px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=career-single] {
        padding-bottom: 100px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=career-single] {
        padding-bottom: 60px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=career-single] {
        padding-bottom: 60px
    }
}

.unit-container[data-page=portfolio-best] {
    height: 100vh;
    overflow: hidden
}

@-webkit-keyframes portfolio-button-square-to-visible {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2vw, 0) scale(0);
        transform: translate3d(0, -2vw, 0) scale(0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0) scale(1);
        transform: translateZ(0) scale(1)
    }
}

@keyframes portfolio-button-square-to-visible {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -2vw, 0) scale(0);
        transform: translate3d(0, -2vw, 0) scale(0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0) scale(1);
        transform: translateZ(0) scale(1)
    }
}

@-webkit-keyframes portfolio-button-square-to-hidden {
    0% {
        opacity: 1;
        -webkit-transform: translateZ(0) scale(1);
        transform: translateZ(0) scale(1)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2vw, 0) scale(0);
        transform: translate3d(0, -2vw, 0) scale(0)
    }
}

@keyframes portfolio-button-square-to-hidden {
    0% {
        opacity: 1;
        -webkit-transform: translateZ(0) scale(1);
        transform: translateZ(0) scale(1)
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(0, -2vw, 0) scale(0);
        transform: translate3d(0, -2vw, 0) scale(0)
    }
}

@-webkit-keyframes portfolio-item-to-left {
    0% {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
    50% {
        -webkit-transform: rotateX(-7deg) rotate(-5deg) skewX(-10deg);
        transform: rotateX(-7deg) rotate(-5deg) skewX(-10deg)
    }
    to {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
}

@keyframes portfolio-item-to-left {
    0% {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
    50% {
        -webkit-transform: rotateX(-7deg) rotate(-5deg) skewX(-10deg);
        transform: rotateX(-7deg) rotate(-5deg) skewX(-10deg)
    }
    to {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
}

@-webkit-keyframes portfolio-item-to-right {
    0% {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
    50% {
        -webkit-transform: rotateX(7deg) rotate(5deg) skewX(10deg);
        transform: rotateX(7deg) rotate(5deg) skewX(10deg)
    }
    to {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
}

@keyframes portfolio-item-to-right {
    0% {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
    50% {
        -webkit-transform: rotateX(7deg) rotate(5deg) skewX(10deg);
        transform: rotateX(7deg) rotate(5deg) skewX(10deg)
    }
    to {
        -webkit-transform: rotateX(0) rotate(0) skewX(0);
        transform: rotateX(0) rotate(0) skewX(0)
    }
}

@-webkit-keyframes portfolio-glitch-item-to-up {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    50% {
        -webkit-transform: translate3d(-2px, -4px, 0);
        transform: translate3d(-2px, -4px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes portfolio-glitch-item-to-up {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    50% {
        -webkit-transform: translate3d(-2px, -4px, 0);
        transform: translate3d(-2px, -4px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes portfolio-glitch-item-to-down {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    50% {
        -webkit-transform: translate3d(-2px, 4px, 0);
        transform: translate3d(-2px, 4px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes portfolio-glitch-item-to-down {
    0% {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    50% {
        -webkit-transform: translate3d(-2px, 4px, 0);
        transform: translate3d(-2px, 4px, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

.unit-portfolio-picture {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative
}

.picture-section-images {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    will-change: background;
    -webkit-transition: background .5s ease-out;
    transition: background .5s ease-out
}

.picture-section-images:before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    mix-blend-mode: multiply;
    background: red;
    pointer-events: none;
    -webkit-transition: opacity .5s ease-out;
    transition: opacity .5s ease-out;
    will-change: opacity;
    opacity: 0
}

.picture-section-images.red:before {
    opacity: 1
}

.picture-section-images canvas {
    height: 100%!important
}

@supports not (mix-blend-mode:multiply) {
    .picture-section-images.red:before {
        opacity: .7
    }
}

.picture-section-barrels {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: relative;
    z-index: 2
}

.picture-section-barrel-wrapper {
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0
}

.picture-section-barrel-wrapper:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    will-change: transform;
    -webkit-transform-origin: top center;
    transform-origin: top center;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.picture-section-barrel-wrapper.visible:before {
    -webkit-transform: scaleY(1);
    transform: scaleY(1)
}

.picture-section-barrel-wrapper-black {
    width: 50%;
    z-index: 2;
    pointer-events: none
}

.picture-section-barrel-wrapper-black:before {
    background: #fff
}

.picture-section-barrel-wrapper-black .picture-section-button {
    color: #000
}

.picture-section-barrel-wrapper-black .picture-section-button-inner:before {
    color: red
}

@media only screen and (max-width:1366px) {
    .picture-section-barrel-wrapper-black div.logo {
        width: 60px;
        height: 60px
    }
    .picture-section-barrel-wrapper-black div.logo:before {
        width: 13px;
        height: 33px
    }
}

.picture-section-barrel-wrapper-white {
    width: 100%;
    z-index: 1
}

.picture-section-barrel-wrapper-white .picture-section-button {
    color: #fff
}

.picture-section-barrel-wrapper-white .picture-section-button-inner:before {
    color: #000
}

.picture-section-barrel {
    width: 100%;
    height: 100%;
    position: relative;
    will-change: opacity
}

.picture-section-barrel.loading {
    opacity: 0
}

.picture-section-barrel-inner {
    width: 100%;
    height: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -ms-touch-action: pan-x;
    touch-action: pan-x;
    will-change: transform;
    -webkit-transition-property: -webkit-transform;
    transition-property: -webkit-transform;
    transition-property: transform;
    transition-property: transform, -webkit-transform;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.picture-section-section {
    width: 100%;
    height: auto;
    margin: 25px 0;
    position: relative;
    will-change: transform
}

.picture-section-section-inner {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-perspective: 100px;
    perspective: 100px
}

.picture-section-button {
    padding: 0;
    border: none;
    cursor: pointer;
    font: 3.5vw "Exo 2", sans-serif;;
    background: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline-block;
    will-change: transform;
    -webkit-transform: rotateX(0) rotate(0) skewX(0);
    transform: rotateX(0) rotate(0) skewX(0)
}

.picture-section-button.left {
    -webkit-animation: portfolio-item-to-left .75s ease-out normal forwards 1;
    animation: portfolio-item-to-left .75s ease-out normal forwards 1
}

.picture-section-button.left .picture-section-button-inner:before {
    -webkit-animation: portfolio-glitch-item-to-up .75s ease-out normal forwards 1;
    animation: portfolio-glitch-item-to-up .75s ease-out normal forwards 1
}

.picture-section-button.right {
    -webkit-animation: portfolio-item-to-right .75s ease-out normal forwards 1;
    animation: portfolio-item-to-right .75s ease-out normal forwards 1
}

.picture-section-button.right .picture-section-button-inner:before {
    -webkit-animation: portfolio-glitch-item-to-down .75s ease-out normal forwards 1;
    animation: portfolio-glitch-item-to-down .75s ease-out normal forwards 1
}

.picture-section-button.visible {
    cursor: default
}

.picture-section-button.visible .picture-section-button-inner:before {
    display: none
}

.picture-section-description {
    width: 100%;
    position: absolute;
    left: 0;
    opacity: 0;
    bottom: -1.7vw;
    text-align: center;
    will-change: opacity;
    -webkit-transition: opacity 1s ease-out;
    transition: opacity 1s ease-out
}

.picture-section-description>* {
    color: #fff;
    font-size: .46vw
}

.picture-section-description.visible {
    opacity: 1
}

.picture-section-button-inner {
    position: relative;
    display: inline-block
}

.picture-section-button-inner:before {
    content: attr(data-barrel-button);
    display: inline-block;
    position: absolute;
    z-index: -1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.best-cases-h1 {
    position: absolute;
    bottom: 8px;
    right: 10px;
    z-index: 2
}

.best-cases-h1 h1 {
    font-size: 16px;
    font-family: "Exo 2", sans-serif;
    color: hsla(0, 0%, 100%, .65);
    margin: unset
}

@media only screen and (max-width:1600px) {
    .picture-section-section {
        margin: 20px 0
    }
}

@media only screen and (max-width:1366px) {
    .touch-device .picture-section-barrel-wrapper-black {
        opacity: 0
    }
}

@media only screen and (max-width:425px) {
    .picture-section-barrel-wrapper-black {
        opacity: 0
    }
    .picture-section-button {
        font-size: 5.3vw
    }
    .picture-section-section {
        margin: 10px 0
    }
}

.unit-container[data-page=portfolio-single] {
    padding-bottom: 45px
}

.unit-container[data-page=portfolio-single]~#footer .footer-info:before {
    display: none
}

.portfolio-single-define {
    width: 100%;
    height: 100vh;
    overflow: hidden;
    position: relative;
    background: #dadada;
    z-index: 4
}

.portfolio-single-image {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1
}

.portfolio-single-image img {
    width: calc(100% + 10px);
    height: calc(100% + 10px);
    display: block;
    position: absolute;
    top: -5px;
    left: -5px;
    z-index: 1;
    -o-object-fit: cover;
    object-fit: cover
}

.portfolio-single-image canvas {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    will-change: opacity
}

.portfolio-single-info {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 60px;
    z-index: 2
}

.prev-next-links {
    position: fixed;
    display: block;
    z-index: 5;
    pointer-events: none;
    top: 0;
    bottom: 0;
    margin: auto;
    width: 76px;
    height: 78px;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    will-change: transform
}

.prev-next-links.load {
    pointer-events: all;
    -webkit-transform: translateZ(0)!important;
    transform: translateZ(0)!important
}

.prev-next-links_tablet {
    display: none
}

.prev-next-links[data-type=prev] {
    left: 0;
    -webkit-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0)
}

.prev-next-links[data-type=prev] .inn {
    right: 0
}

.prev-next-links[data-type=prev] .str:before {
    left: 7px
}

.prev-next-links[data-type=prev] .str:after {
    left: -7px;
    border-right: 6px solid #000;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent
}

.prev-next-links[data-type=prev] .img {
    right: 100%;
    -webkit-transform: translate3d(64px, 0, 0);
    transform: translate3d(64px, 0, 0)
}

.prev-next-links[data-type=next] {
    right: 0;
    -webkit-transform: translate3d(100%, 0, 0);
    transform: translate3d(100%, 0, 0)
}

.prev-next-links[data-type=next] .inn {
    left: 0
}

.prev-next-links[data-type=next] .str:before {
    right: 7px
}

.prev-next-links[data-type=next] .str:after {
    right: -7px;
    border-left: 6px solid #000;
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent
}

.prev-next-links[data-type=next] .img {
    left: 100%;
    -webkit-transform: translate3d(-64px, 0, 0);
    transform: translate3d(-64px, 0, 0)
}

.prev-next-links .inn {
    position: absolute;
    display: block;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    will-change: transform
}

.prev-next-links .str {
    position: absolute;
    display: block;
    background: #fff;
    z-index: 1;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    -webkit-transition: background .5s ease;
    transition: background .5s ease
}

.prev-next-links .str:after,
.prev-next-links .str:before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto
}

.prev-next-links .str:before {
    width: 11px;
    height: 2px;
    background: #000;
    -webkit-transition: background .5s ease;
    transition: background .5s ease
}

.prev-next-links .str:after {
    width: 0;
    height: 0;
    -webkit-transition: border-color .5s ease;
    transition: border-color .5s ease
}

.prev-next-links .img {
    position: absolute;
    display: block;
    width: 140px;
    z-index: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover;
    background-color: #d0d0d0;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    will-change: transform
}

.prev-next-links.hover[data-type=prev] .inn,
.prev-next-links:hover[data-type=prev] .inn {
    -webkit-transform: translate3d(140px, 0, 0);
    transform: translate3d(140px, 0, 0)
}

.prev-next-links.hover[data-type=next] .inn,
.prev-next-links:hover[data-type=next] .inn {
    -webkit-transform: translate3d(-140px, 0, 0);
    transform: translate3d(-140px, 0, 0)
}

.prev-next-links.hover .str,
.prev-next-links:hover .str {
    background: red
}

.prev-next-links.hover .str:before,
.prev-next-links:hover .str:before {
    background: #fff
}

.prev-next-links.hover .str:after,
.prev-next-links:hover .str:after {
    border-left-color: #fff;
    border-right-color: #fff
}

.prev-next-links.hover .img,
.prev-next-links:hover .img {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

body .portfolio-single-define.ajax-loading .prev-next-links[data-type=prev] {
    -webkit-transform: translate3d(-100%, 0, 0)!important;
    transform: translate3d(-100%, 0, 0)!important
}

body .portfolio-single-define.ajax-loading .prev-next-links[data-type=next] {
    -webkit-transform: translate3d(100%, 0, 0)!important;
    transform: translate3d(100%, 0, 0)!important
}

body .portfolio-single-define.ajax-loading .prev-next-links .inn {
    -webkit-transform: translateZ(0)!important;
    transform: translateZ(0)!important
}

body .portfolio-single-define.ajax-loading .portfolio-single-title.animate-element {
    opacity: 0;
    -webkit-transform: translate3d(0, 10vh, 0);
    transform: translate3d(0, 10vh, 0)
}

body .portfolio-single-define.ajax-loading .portfolio-single-desc.animate-element {
    opacity: 0;
    -webkit-transform: scaleY(1.2) translate3d(0, 20vh, 0);
    transform: scaleY(1.2) translate3d(0, 20vh, 0)
}

.portfolio-single-title {
    width: 100%;
    position: relative;
    text-align: center;
    margin: 25px 0
}

.portfolio-single-title p {
    color: #fff;
    font: 7.875vw/1 "Exo 2", sans-serif;
}

.portfolio-single-title.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: filter, opacity, transform;
    -webkit-transform: translate3d(0, 10vh, 0);
    transform: translate3d(0, 10vh, 0)
}

.portfolio-single-title.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform
}

.portfolio-single-title.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.portfolio-single-title.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.portfolio-single-desc {
    width: 100%;
    height: 0;
    position: relative;
    text-align: center
}

.portfolio-single-desc p {
    color: #fff;
    font: 20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.4
}

.portfolio-single-desc.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.2) translate3d(0, 20vh, 0);
    transform: scaleY(1.2) translate3d(0, 20vh, 0)
}

.portfolio-single-desc.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.portfolio-single-desc.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.portfolio-single-desc.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.portfolio-single-content {
    width: 100%;
    padding: 100px 0;
    overflow: hidden;
    position: relative
}

.portfolio-single-content .section-gallery-center {
    width: 75%;
    margin: 0 auto
}

.portfolio-single-content .section-content-center {
    width: 50%;
    margin: 0 auto
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=portfolio-single] {
        padding-bottom: 25px
    }
    .portfolio-single-info {
        padding: 0 50px
    }
    .portfolio-single-title {
        margin: 20px 0
    }
    .portfolio-single-desc p {
        font-size: 18px
    }
    .portfolio-single-content {
        padding: 60px 0
    }
}

@media only screen and (max-width:1366px) {
    .portfolio-single-info {
        padding: 0 40px
    }
    .portfolio-single-desc p {
        font-size: 16px
    }
    .portfolio-single-content {
        padding: 50px 0
    }
    .portfolio-single-content .section-content-center {
        width: 75%
    }
}

@media only screen and (max-width:1200px) {
    .unit-container[data-page=portfolio-single] {
        padding-bottom: 45px
    }
}

@media only screen and (max-width:1024px) {
    .prev-next-links {
        top: auto!important;
        position: absolute;
        display: none
    }
    .prev-next-links_tablet {
        display: block;
        bottom: 0!important
    }
    .portfolio-single-content {
        padding: 35px 0
    }
    .portfolio-single-content .section-content-center,
    .portfolio-single-content .section-gallery-center {
        width: calc(100% - 80px)
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .portfolio-single-info {
        padding: 0 25px
    }
    .portfolio-single-title p {
        font-size: 50px
    }
    .portfolio-single-content {
        padding: 20px 0
    }
    .portfolio-single-content .section-content-center {
        width: calc(100% - 20px)
    }
    .portfolio-single-content .section-gallery-center {
        width: 100%
    }
    .portfolio-single-content .section-gallery-button.section-gallery-prev {
        left: 10px!important
    }
    .portfolio-single-content .section-gallery-button.section-gallery-next {
        right: 10px!important
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .portfolio-single-info {
        padding: 0 25px
    }
    .portfolio-single-title p {
        font-size: 50px
    }
    .portfolio-single-content {
        padding: 20px 0
    }
    .portfolio-single-content .section-content-center,
    .portfolio-single-content .section-gallery-center {
        width: calc(100% - 50px)
    }
}

@media only screen and (max-width:414px) and (orientation:portrait) {
    .portfolio-single-define {
        height: 620px
    }
}

@media only screen and (max-width:375px) and (orientation:portrait) {
    .portfolio-single-define {
        height: 560px
    }
}

@media only screen and (max-width:375px) and (min-height:750px) and (orientation:portrait) {
    .portfolio-single-define {
        height: 750px
    }
}

@media only screen and (max-width:360px) and (orientation:portrait) {
    .portfolio-single-define {
        height: 500px
    }
}

@media only screen and (max-width:320px) and (orientation:portrait) {
    .portfolio-single-define {
        height: 550px
    }
}

body,
html {
    height: auto;
    overflow-y: auto
}

#app {
    height: auto;
    overflow: hidden;
    opacity: 1
}

#app,
#unit {
    position: relative;
    width: 100%
}

#unit {
    height: 100vh
}

#unit .scrollbar-track {
    z-index: 19;
    -webkit-transition: opacity .5s ease-out, -webkit-transform .25s ease-out;
    transition: opacity .5s ease-out, -webkit-transform .25s ease-out;
    transition: opacity .5s ease-out, transform .25s ease-out;
    transition: opacity .5s ease-out, transform .25s ease-out, -webkit-transform .25s ease-out;
    will-change: opacity, transform
}

body.loading #unit .scrollbar-track {
    opacity: 0;
    -webkit-transform: translate3d(120%, 0, 0);
    transform: translate3d(120%, 0, 0)
}

#ldr~#app #unit .scrollbar-track {
    opacity: 0
}

img[data-lazy] {
    opacity: 0;
    -webkit-transition: opacity .65s cubic-bezier(.23, 1, .32, 1);
    transition: opacity .65s cubic-bezier(.23, 1, .32, 1);
    background: #d6d6d6;
    font: 10px/1.6 HelveticaLight
}

img[data-lazy=loaded] {
    opacity: 1;
    background: none
}

.unit-container {
    position: relative;
    width: 100%
}

.unit-container.new-page-loading {
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transition: opacity .5s cubic-bezier(.23, 1, .32, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.23, 1, .32, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.23, 1, .32, 1), transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.23, 1, .32, 1), transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    will-change: opacity, transform
}

.unit-container.new-page-loading-start {
    opacity: 0;
    -webkit-transform: scaleY(1.25) translate3d(0, 35px, 0);
    transform: scaleY(1.25) translate3d(0, 35px, 0)
}

.unit-container.new-page-loading~#footer .footer-section {
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transition: opacity .5s cubic-bezier(.23, 1, .32, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.23, 1, .32, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.23, 1, .32, 1), transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.23, 1, .32, 1), transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    will-change: opacity, transform
}

.unit-container.new-page-loading-start~#footer .footer-section {
    opacity: 0;
    -webkit-transform: scaleY(1.35) translate3d(0, 35px, 0);
    transform: scaleY(1.35) translate3d(0, 35px, 0)
}

.section-begin {
    position: relative;
    width: 100%;
    padding-top: 135px;
    z-index: 2
}

[data-page=static] .section-begin {
    padding-top: 160px
}

.section-begin-inner,
.section-define {
    position: relative;
    width: 100%
}

.section-define {
    -webkit-perspective: 100px;
    perspective: 100px
}

.section-define-name {
    position: relative;
    width: 100%;
    margin-bottom: 30px
}

.section-define-name p {
    color: #908f8f;
    font: 20px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-define-name.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-define-name.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-define-name.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-define-name.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-define-name .breadcrumbs {
    color: #908f8f
}

.section-define-name .breadcrumbs:hover {
    color: red
}

.section-define-title {
    width: 100%;
    position: relative;
    margin-bottom: 30px
}

.section-define-title h1,
.section-define-title h2 {
    margin: 0;
    font-size: 80px;
    line-height: 1.1
}

.section-define-title strong {
    color: red
}

.section-define-title.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(0);
    filter: brightness(0);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-define-title.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.section-define-title.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-define-title.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-define-desc {
    width: 100%;
    position: relative
}

.section-define-desc p {
    font: 20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.7
}

.section-define-desc a:hover {
    text-decoration: underline
}

.section-define-desc.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-define-desc.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-define-desc.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-define-desc.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-define-left {
    width: 75%;
    position: relative
}

.section-follow {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch;
    padding: 60px 40px;
    margin-bottom: 60px;
    border: 1px solid #dadada
}

.section-follow.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0);
    transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0)
}

.section-follow.animate-element .section-follow-button,
.section-follow.animate-element .section-follow-follows,
.section-follow.animate-element .section-follow-image,
.section-follow.animate-element .section-follow-link,
.section-follow.animate-element .section-follow-name,
.section-follow.animate-element .section-follow-title {
    opacity: 0;
    will-change: filter, opacity
}

.section-follow.animate-element .section-follow-button,
.section-follow.animate-element .section-follow-image {
    -webkit-filter: brightness(5);
    filter: brightness(5)
}

.section-follow.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-follow.animate-element[data-start=true] .section-follow-button,
.section-follow.animate-element[data-start=true] .section-follow-follows,
.section-follow.animate-element[data-start=true] .section-follow-image,
.section-follow.animate-element[data-start=true] .section-follow-link,
.section-follow.animate-element[data-start=true] .section-follow-name,
.section-follow.animate-element[data-start=true] .section-follow-title {
    -webkit-transition-property: opacity, -webkit-filter;
    transition-property: opacity, -webkit-filter;
    transition-property: filter, opacity;
    transition-property: filter, opacity, -webkit-filter;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-follow.animate-element[data-start=true] .section-follow-name {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.section-follow.animate-element[data-start=true] .section-follow-title {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.section-follow.animate-element[data-start=true] .section-follow-follows {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.section-follow.animate-element[data-start=true] .section-follow-button {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.section-follow.animate-element[data-start=true] .section-follow-link {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.section-follow.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.section-follow.animate-element[data-start=true].visible .section-follow-button,
.section-follow.animate-element[data-start=true].visible .section-follow-image {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1)
}

.section-follow.animate-element[data-start=true].visible .section-follow-follows,
.section-follow.animate-element[data-start=true].visible .section-follow-link,
.section-follow.animate-element[data-start=true].visible .section-follow-name,
.section-follow.animate-element[data-start=true].visible .section-follow-title {
    opacity: 1
}

.section-follow.animate-element[data-start=true].finished {
    pointer-events: auto
}

.section-follow.animate-element[data-start=true].finished .section-follow-button,
.section-follow.animate-element[data-start=true].finished .section-follow-follows,
.section-follow.animate-element[data-start=true].finished .section-follow-link,
.section-follow.animate-element[data-start=true].finished .section-follow-name,
.section-follow.animate-element[data-start=true].finished .section-follow-title {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-follow-image {
    width: 100%;
    position: relative;
    text-align: center;
    margin-bottom: 25px
}

.section-follow-image-item {
    width: 140px;
    height: 140px;
    overflow: hidden;
    position: relative;
    border-radius: 50%;
    background: #dadada;
    display: inline-block
}

.section-follow-image-item img {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.section-follow-name {
    width: 100%;
    position: relative;
    text-align: center;
    margin-bottom: 20px
}

.section-follow-name p {
    font: 30px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.1
}

.section-follow-title {
    width: 100%;
    position: relative;
    text-align: center;
    margin-bottom: 20px
}

.section-follow-title p {
    font: 16px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.6
}

.section-follow-follows {
    width: 100%;
    position: relative;
    text-align: center;
    margin-bottom: 35px
}

.section-follow-follows p {
    font: 16px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.6
}

.section-follow-follows strong {
    color: red
}

.section-follow-button {
    position: relative;
    width: 100%;
    margin-bottom: 20px
}

.section-follow-link {
    position: relative;
    width: 100%;
    text-align: center
}

.section-follow-link a {
    display: inline;
    white-space: nowrap;
    border-bottom: 1px solid red;
    -webkit-transition: all .5s cubic-bezier(.4, 0, 0, 1);
    transition: all .5s cubic-bezier(.4, 0, 0, 1);
    font: 16px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-follow-link a:hover {
    border-bottom-color: transparent
}

.section-ticket,
.section-ticket-image {
    position: relative;
    width: 100%
}

.section-ticket-image {
    height: 0;
    padding-top: 56.25%;
    margin-bottom: 20px
}

.notes-info-right .section-ticket-image,
.talks-list .section-ticket-image {
    padding-top: 50%
}

.section-ticket-image-item {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
    background: #dadada
}

.section-ticket-image-item:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    opacity: 0;
    margin: auto;
    background: red;
    will-change: opacity;
    mix-blend-mode: multiply;
    -webkit-transition: opacity .5s ease-out .1s;
    transition: opacity .5s ease-out .1s
}

.section-ticket-image-item img {
    width: 100%;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    -o-object-fit: cover;
    object-fit: cover
}

.section-ticket-image-item:hover:before {
    opacity: 1
}

.section-ticket-image-item:hover~.section-mark {
    background: #fff
}

.section-ticket-image-item:hover~.section-mark span {
    color: red
}

@supports not (mix-blend-mode:multiply) {
    .section-ticket-image-item:hover:before {
        opacity: .7
    }
}

.section-ticket-date {
    position: relative;
    width: 100%;
    margin-bottom: 5px
}

.section-ticket-date p {
    font: 16px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em;
    color: #908f8f
}

.section-ticket-title {
    position: relative;
    width: 100%
}

.section-ticket-title a {
    display: inline;
    overflow: hidden;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1);
    font: 18px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em;
    color: #000
}

.section-ticket-title a:hover {
    color: red
}

.section-mark {
    width: auto;
    height: auto;
    background: red;
    overflow: hidden;
    padding: 11px 33px;
    display: inline-block;
    position: absolute;
    bottom: 20px;
    right: 20px;
    z-index: 2;
    will-change: background;
    -webkit-transition: background .5s cubic-bezier(.4, 0, 0, 1);
    transition: background .5s cubic-bezier(.4, 0, 0, 1)
}

.section-mark:before {
    content: "";
    position: absolute;
    width: calc(100% + 2px);
    height: calc(400% + 2px);
    top: -1px;
    left: -1px;
    right: 0;
    bottom: 0;
    z-index: 1;
    margin: auto;
    background: #000;
    border-radius: 50%;
    -webkit-transform: scale(0) skewY(-15deg);
    transform: scale(0) skewY(-15deg);
    will-change: transform, border-radius;
    -webkit-transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out, -webkit-transform .3s ease-out
}

.section-mark span {
    color: #fff;
    position: relative;
    display: inline-block;
    font: 16px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.6;
    z-index: 2;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.section-mark:hover:before {
    border-radius: 0;
    -webkit-transform: scale(1) skewY(0);
    transform: scale(1) skewY(0);
    -webkit-transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s;
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.d-block {
    display: block!important;
    padding-top: 10px
}

.section-tags {
    width: 100%;
    position: relative;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-tags,
.section-tags a {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.section-tags a {
    width: auto;
    color: #696969;
    padding: 0 19px;
    margin: 0 4px 4px 0;
    font-family: "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.6;
    will-change: color, background;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: color, background;
    transition-property: color, background;
    background: #f1f1f1
}

.section-tags a:hover {
    color: red
}

.section-tags a.active {
    pointer-events: none;
    background: red;
    color: #fff
}

.section-tags a.active:hover {
    background: #dadada
}

.section-tags a.active strong {
    color: #fff
}

.section-tags a strong {
    color: red;
    font-family: "Exo 2", sans-serif;;
    will-change: color;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: color;
    transition-property: color
}

.section-tags.section-tags-small a {
    font-size: 16px
}

.section-tags.section-tags-major a {
    font-size: 18px
}

.section-tags.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-tags.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-tags.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-tags.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-badges {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch
}

.section-badges.section-badges-major .section-badges-item {
    font-size: 16px
}

.section-badges.section-badges-small .section-badges-item {
    font-size: 14px
}

.section-badges.section-badges-black .section-badge-date:before {
    background: url("/images/date-black.svg") no-repeat 50%;
    background-size: 100%
}

.section-badges.section-badges-black .section-badge-views:before {
    background: url("/images/views-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-badges.section-badges-black .section-badge-comments:before {
    background: url("/images/comments-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-badges.section-badges-black .section-badge-time:before {
    background: url("/images/time-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-badges.section-badges-white .section-badges-item {
    color: #fff
}

.section-badges.section-badges-white .section-badge-date:before {
    background: url("/images/date-white.svg") no-repeat 50%;
    background-size: 100%
}

.section-badges.section-badges-white .section-badge-views:before {
    background: url("/images/views-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-badges.section-badges-white .section-badge-comments:before {
    background: url("/images/comments-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-badges.section-badges-white .section-badge-time:before {
    background: url("/images/time-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-badges.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.section-badges.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-badges.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-badges.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-single-data.section-single-data_pre-content {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.section-single-data.section-single-data_pre-content .section-single-data-left,
.section-single-data.section-single-data_pre-content .section-single-data-right {
    width: calc(50% - 15px)
}

.section-badges-item {
    position: relative;
    top: 3px;
    margin: 15px;
    display: inline-block;
    white-space: nowrap;
    font-size: 14px;
    letter-spacing: .02em
}

.section-badges-item:first-child {
    margin-left: 0
}

.section-badges-item:last-child {
    margin-right: 0
}

.section-badges-item:before {
    content: "";
    position: absolute;
    top: -4px;
    left: 0;
    bottom: 0;
    z-index: 2;
    margin: auto 0
}

.section-badges-item.section-badge-date {
    padding-left: 21px
}

.section-badges-item.section-badge-date:before {
    width: 16px;
    height: 16px
}

.section-badges-item.section-badge-views {
    padding-left: 27px
}

.section-badges-item.section-badge-views:before {
    width: 22px;
    height: 16px
}

.section-badges-item.section-badge-comments {
    padding-left: 23px
}

.section-badges-item.section-badge-comments:before {
    width: 18px;
    height: 16px
}

.section-badges-item.section-badge-time {
    padding-left: 21px
}

.section-badges-item.section-badge-time:before {
    width: 16px;
    height: 16px
}

.grid-updatable,
.section-grid {
    position: relative;
    width: 100%
}

.section-grid {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-grid-container {
    position: relative;
    width: 100%;
    padding-top: 70px;
    -webkit-transition: opacity .25s ease;
    transition: opacity .25s ease
}

body.loading .section-grid-container {
    opacity: 0
}

.section-grid-title {
    position: relative;
    width: 100%;
    margin-bottom: 40px
}

.section-grid-title p {
    font: 30px/1.1 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-grid-title.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-grid-title.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-grid-title.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-grid-title.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-grid-content,
.section-grid-row {
    position: relative;
    width: 100%
}

.section-grid-row {
    margin-bottom: 65px;
    -webkit-perspective: 50px;
    perspective: 50px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-grid-row:last-child {
    margin-bottom: 0
}

.section-grid-item {
    position: relative;
    width: calc((100% - 66px) / 3);
    margin-right: 33px
}

.section-grid-item:last-child {
    margin-right: 0
}

.section-grid-item.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0);
    transform: scaleY(2) skew(0, 10deg) translate3d(0, 30vh, 0)
}

.section-grid-item.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-grid-item.animate-element[data-start=true]:first-child,
.section-grid-item.animate-element[data-start=true]:first-child .section-ticket-image {
    -webkit-transition-delay: .06666667s;
    transition-delay: .06666667s
}

.section-grid-item.animate-element[data-start=true]:nth-child(2),
.section-grid-item.animate-element[data-start=true]:nth-child(2) .section-ticket-image {
    -webkit-transition-delay: .13333333s;
    transition-delay: .13333333s
}

.section-grid-item.animate-element[data-start=true]:nth-child(3),
.section-grid-item.animate-element[data-start=true]:nth-child(3) .section-ticket-image {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.section-grid-item.animate-element[data-start=true] .section-ticket-image {
    will-change: filter;
    -webkit-filter: opacity(.5) contrast(2) brightness(1.25);
    filter: opacity(.5) contrast(2) brightness(1.25);
    -webkit-transition: -webkit-filter 1.75s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-filter 1.75s cubic-bezier(.4, 0, 0, 1);
    transition: filter 1.75s cubic-bezier(.4, 0, 0, 1);
    transition: filter 1.75s cubic-bezier(.4, 0, 0, 1), -webkit-filter 1.75s cubic-bezier(.4, 0, 0, 1)
}

.section-grid-item.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.section-grid-item.animate-element[data-start=true].visible .section-ticket-image {
    -webkit-filter: opacity(1) contrast(1) brightness(1);
    filter: opacity(1) contrast(1) brightness(1)
}

.section-grid-item.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-pagination {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-pagination>a.animate-element,
.section-pagination>span.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.section-pagination>a.animate-element[data-start=true],
.section-pagination>span.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-pagination>a.animate-element[data-start=true]:first-child,
.section-pagination>span.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(2),
.section-pagination>span.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(3),
.section-pagination>span.animate-element[data-start=true]:nth-child(3) {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(4),
.section-pagination>span.animate-element[data-start=true]:nth-child(4) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(5),
.section-pagination>span.animate-element[data-start=true]:nth-child(5) {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(6),
.section-pagination>span.animate-element[data-start=true]:nth-child(6) {
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(7),
.section-pagination>span.animate-element[data-start=true]:nth-child(7) {
    -webkit-transition-delay: .35s;
    transition-delay: .35s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(8),
.section-pagination>span.animate-element[data-start=true]:nth-child(8) {
    -webkit-transition-delay: .4s;
    transition-delay: .4s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(9),
.section-pagination>span.animate-element[data-start=true]:nth-child(9) {
    -webkit-transition-delay: .45s;
    transition-delay: .45s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(10),
.section-pagination>span.animate-element[data-start=true]:nth-child(10) {
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(11),
.section-pagination>span.animate-element[data-start=true]:nth-child(11) {
    -webkit-transition-delay: .55s;
    transition-delay: .55s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(12),
.section-pagination>span.animate-element[data-start=true]:nth-child(12) {
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(13),
.section-pagination>span.animate-element[data-start=true]:nth-child(13) {
    -webkit-transition-delay: .65s;
    transition-delay: .65s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(14),
.section-pagination>span.animate-element[data-start=true]:nth-child(14) {
    -webkit-transition-delay: .7s;
    transition-delay: .7s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(15),
.section-pagination>span.animate-element[data-start=true]:nth-child(15) {
    -webkit-transition-delay: .75s;
    transition-delay: .75s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(16),
.section-pagination>span.animate-element[data-start=true]:nth-child(16) {
    -webkit-transition-delay: .8s;
    transition-delay: .8s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(17),
.section-pagination>span.animate-element[data-start=true]:nth-child(17) {
    -webkit-transition-delay: .85s;
    transition-delay: .85s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(18),
.section-pagination>span.animate-element[data-start=true]:nth-child(18) {
    -webkit-transition-delay: .9s;
    transition-delay: .9s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(19),
.section-pagination>span.animate-element[data-start=true]:nth-child(19) {
    -webkit-transition-delay: .95s;
    transition-delay: .95s
}

.section-pagination>a.animate-element[data-start=true]:nth-child(20),
.section-pagination>span.animate-element[data-start=true]:nth-child(20) {
    -webkit-transition-delay: 1s;
    transition-delay: 1s
}

.section-pagination>a.animate-element[data-start=true].visible,
.section-pagination>span.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-pagination>a.animate-element[data-start=true].finished,
.section-pagination>span.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.pagination-dotted,
.pagination-link {
    display: inline-block;
    margin: 17px;
    font-size: 20px;
    line-height: 1.6;
    letter-spacing: .02em;
    color: #908f8f
}

.pagination-link {
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.pagination-link:hover {
    color: #000
}

.pagination-link.active {
    color: red!important;
    pointer-events: none!important
}

.pagination-button {
    position: relative;
    width: 90px;
    height: 90px;
    margin: 17px;
    -webkit-perspective: 50px;
    perspective: 50px
}

.pagination-button.active {
    pointer-events: none!important
}

.pagination-button.active .circle-button:before {
    opacity: .3
}

.pagination-prev {
    margin-left: 0!important
}

.pagination-next {
    margin-right: 0!important
}

.section-categories {
    position: relative;
    width: 100%
}

.section-categories.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.section-categories.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-categories.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-categories.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.categories-desktop {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.categories-desktop.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) translate3d(0, 30vh, 0);
    transform: scaleY(2) translate3d(0, 30vh, 0)
}

.categories-desktop.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.categories-desktop.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.categories-desktop.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.categories-desktop-list {
    width: auto;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.categories-desktop-list,
.filter-link {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap
}

.filter-link {
    width: 100%;
    height: 70px;
    padding: 0 25px;
    overflow: hidden;
    margin-right: -1px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border: 1px solid #dadada;
    color: #fff
}

.filter-link.active {
    background: red
}

.filter-link.active:before {
    display: none
}

.filter-link:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 400%;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background: red;
    border-radius: 50%;
    will-change: transform, border-radius;
    -webkit-transform: scale(0) skewY(-15deg);
    transform: scale(0) skewY(-15deg);
    -webkit-transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out, -webkit-transform .3s ease-out
}

.filter-link span {
    display: inline-block;
    z-index: 2;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: color;
    font: 16px "Exo 2", sans-serif;;
    line-height: 1.2;
    letter-spacing: .02em;
    text-align: center;
    color: #000
}

.filter-link:last-child {
    margin-right: 0
}

.filter-link.active:before,
.filter-link:hover:before {
    border-radius: 0;
    -webkit-transform: scale(1) skewY(0);
    transform: scale(1) skewY(0);
    -webkit-transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s;
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.filter-link.active span,
.filter-link:hover span {
    color: #fff
}

.filter-link.active {
    pointer-events: none
}

.categories-mobile {
    position: relative;
    display: none;
    z-index: 5;
    width: 100%
}

.categories-desktop-selects {
    position: relative;
    width: 400px;
    margin-left: -2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.categories-select-item {
    position: relative;
    width: 50%;
    margin-right: -1px
}

.categories-select-item:first-child {
    z-index: 4
}

.categories-select-item:first-child .nice-select .list {
    left: -1px
}

.categories-select-item:last-child {
    z-index: 3;
    margin-right: -1px
}

.categories-select-item:last-child .nice-select .list {
    left: auto;
    right: 0
}

.section-showreel {
    position: relative;
    width: 100%;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.section-showreel.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(1.25);
    filter: brightness(1.25);
    will-change: filter, opacity, transform;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.section-showreel.animate-element .section-showreel-cover {
    -webkit-transform: scale(2);
    transform: scale(2);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.section-showreel.animate-element .section-showreel-desc,
.section-showreel.animate-element .section-showreel-title {
    opacity: 0;
    will-change: opacity, transform;
    -webkit-transform: scaleY(2) translate3d(0, 20vh, 0);
    transform: scaleY(2) translate3d(0, 20vh, 0)
}

.section-showreel.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.section-showreel.animate-element[data-start=true] .section-showreel-cover {
    -webkit-transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1);
    transition: transform 2s cubic-bezier(.4, 0, 0, 1), -webkit-transform 2s cubic-bezier(.4, 0, 0, 1)
}

.section-showreel.animate-element[data-start=true] .section-showreel-desc,
.section-showreel.animate-element[data-start=true] .section-showreel-title {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-showreel.animate-element[data-start=true] .section-showreel-title {
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

.section-showreel.animate-element[data-start=true] .section-showreel-desc {
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

.section-showreel.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.section-showreel.animate-element[data-start=true].visible .section-showreel-cover {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.section-showreel.animate-element[data-start=true].visible .section-showreel-desc,
.section-showreel.animate-element[data-start=true].visible .section-showreel-title {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-showreel.animate-element[data-start=true].finished {
    pointer-events: auto
}

.section-showreel.animate-element[data-start=true].finished,
.section-showreel.animate-element[data-start=true].finished .section-showreel-desc,
.section-showreel.animate-element[data-start=true].finished .section-showreel-title {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-showreel-content {
    position: relative;
    width: 87.5%;
    height: 0;
    overflow: hidden;
    padding-bottom: 49%;
    background: #dadada
}

.section-showreel-cover {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.section-showreel-image,
.section-showreel-image:before {
    position: absolute;
    z-index: 2;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.section-showreel-image:before {
    content: "";
    background: rgba(0, 0, 0, .5)
}

.section-showreel-image img,
.section-showreel-image video {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    -o-object-fit: cover;
    object-fit: cover
}

.section-showreel-left {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 0 120px 0 14.25%
}

.section-showreel-title {
    position: relative;
    width: 100%;
    margin-bottom: 50px
}

.section-showreel-title p {
    font: 80px "Exo 2", sans-serif;;
    line-height: 1.1;
    color: #fff
}

.section-showreel-desc {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.video-button {
    position: relative;
    z-index: 1;
    cursor: pointer;
    border: none;
    padding: 0;
    background: red;
    border-radius: 50%
}

.video-button:after,
.video-button:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto
}

.video-button:before {
    width: 12px;
    height: 14px;
    z-index: 2;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background: url("/images/play-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.video-button:after {
    width: 100%;
    height: 100%;
    z-index: 1;
    background: #000;
    border-radius: 50%;
    will-change: transform, border-radius;
    -webkit-transform: scale(0) skewX(-15deg);
    transform: scale(0) skewX(-15deg);
    -webkit-transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out, -webkit-transform .3s ease-out
}

.video-button.active:after,
.video-button:hover:after {
    border-radius: 50%;
    -webkit-transform: scale(1.01) skewX(0);
    transform: scale(1.01) skewX(0);
    -webkit-transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s;
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.video-button-desc {
    display: inline-block;
    padding-left: 25px;
    font: 28px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em;
    color: #fff
}

.video-button-major {
    width: 120px;
    height: 120px
}

.video-button-small {
    width: 100px;
    height: 100px
}

.section-content {
    position: relative;
    width: 100%;
    margin: 60px 0
}

.section-content:first-child {
    margin-top: 0
}

.section-content:last-child {
    margin-bottom: 0
}

.section-content.animate-element {
    opacity: 0;
    pointer-events: none
}

.section-content.animate-element[data-start=true].visible {
    opacity: 1
}

.section-content.animate-element[data-start=true].finished {
    pointer-events: auto
}

.section-content-top {
    margin: -20px 0 80px
}

.section-content-center,
.section-content-text {
    position: relative;
    width: 100%
}

.section-content-text>* {
    margin: 30px 0
}

.section-content-text>.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-text>.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-text>.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-text>.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-text figcaption,
.section-content-text ol li,
.section-content-text p,
.section-content-text ul li {
    font-size: 16px;
    letter-spacing: .02em;
    line-height: 1.7
}

.section-content-text p.sub-tit {
    margin: 20px 0;
    letter-spacing: .1em;
    font-size: 16px;
    color: #b3b3b3
}

.section-content-text p.colored-title {
    margin: 0 0 -75px;
    max-width: 1080px;
    font: 50px/1.2 "Exo 2", sans-serif;;
    color: #000
}

.section-content-text p.colored-title strong {
    font-weight: 400;
    color: red
}

.section-content-text p.colored-title+* {
    margin-top: 100px
}

@media only screen and (max-width:1280px) {
    .section-content-text p.colored-title {
        margin: 0 0 -35px
    }
}

@media only screen and (max-width:1366px) {
    .section-content-text p.colored-title {
        font-size: 46px
    }
}

@media only screen and (max-width:960px) {
    .section-content-text p.colored-title {
        font-size: 38px
    }
}

@media only screen and (max-width:425px) {
    .section-content-text p.colored-title {
        font-size: 32px
    }
}

.section-content-text h1 {
    font-size: 50px
}

.section-content-text h2 {
    font-size: 40px
}

.section-content-text h3 {
    font-size: 35px
}

.section-content-text h4 {
    font-size: 30px
}

.section-content-text h5 {
    font-size: 25px
}

.section-content-text h6 {
    font-size: 20px
}

.section-content-text ol,
.section-content-text ul {
    width: 100%;
    padding: 0;
    list-style: none
}

.section-content-text ol li,
.section-content-text ul li {
    position: relative;
    width: 100%;
    padding-left: 25px;
    margin-bottom: 10px
}

.section-content-text ol li:last-child,
.section-content-text ul li:last-child {
    margin-bottom: 0
}

.section-content-text ul li:before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    width: 6px;
    height: 6px;
    background: red;
    border-radius: 50%
}

.section-content-text ol {
    counter-reset: li
}

.section-content-text ol li:before {
    content: counter(li) ".";
    counter-increment: li;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0;
    left: 0;
    color: red;
    line-height: 25px
}

.section-content-text em,
.section-content-text i {
    font-style: italic
}

.section-content-text img {
    display: block;
    width: 100%;
    height: auto
}

.section-content-text figure {
    position: relative;
    width: 100%
}

.section-content-text figure iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: none
}

.section-content-text figure figcaption {
    margin-top: 20px
}

.section-content-text figure.section-video-figure {
    padding-bottom: 56.25%
}

.section-content-text blockquote {
    position: relative;
    width: 100%;
    padding: 145px 40px 60px;
    border: 2px solid #000;
    font: 20px/1.7 "Exo 2", sans-serif;;
    text-align: center
}

.section-content-text blockquote:before {
    content: "";
    position: absolute;
    width: 34px;
    height: 30px;
    top: 65px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: url("/images/quote-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-content-text .section-table {
    position: relative;
    width: 100%;
    overflow: hidden
}

.section-content-text .section-table table {
    width: 100%;
    border: 1px solid #dadada;
    border-collapse: collapse
}

.section-content-text .section-table table td,
.section-content-text .section-table table th {
    text-align: left;
    padding: 30px
}

.section-content-text .section-table table th {
    font: 14px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-text .section-table table td {
    border: 1px solid #dadada;
    font: 16px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-text .section-table table a {
    color: red;
    text-decoration: underline
}

.section-content-text .section-table table a:hover {
    text-decoration: none
}

.multi-text-black-link a {
    font: 30px/1.15 "Exo 2", sans-serif;;
    color: #000;
    display: inline;
    -webkit-transition: all .5s cubic-bezier(.4, 0, 0, 1);
    transition: all .5s cubic-bezier(.4, 0, 0, 1);
    border-bottom: 1px solid #000
}

.multi-text-black-link a:hover {
    color: red;
    border-bottom-color: transparent
}

@media only screen and (max-width:1600px) {
    .multi-text-black-link a {
        font-size: 26px
    }
}

.section-content-multi-text {
    position: relative;
    width: 100%
}

.section-content-multi-text.dashed-items .inner-multi {
    border: 1px solid #f4f4f4;
    padding: 45px 55px
}

@media only screen and (max-width:1440px) {
    .section-content-multi-text.dashed-items .inner-multi {
        padding: 40px 50px
    }
}

@media only screen and (max-width:1080px) {
    .section-content-multi-text.dashed-items .inner-multi {
        padding: 35px 45px
    }
}

@media only screen and (max-width:960px) {
    .section-content-multi-text.dashed-items .inner-multi {
        padding: 30px 40px
    }
}

@media only screen and (max-width:720px) {
    .section-content-multi-text.dashed-items .inner-multi {
        padding: 25px 35px
    }
}

@media only screen and (max-width:425px) {
    .section-content-multi-text.dashed-items .inner-multi {
        padding: 20px 30px
    }
}

.section-content-multi-text:not(.dashed-items) .inner-multi {
    padding-right: 70px;
    margin-bottom: 40px
}

.section-content-multi-text:not(.dashed-items) .inner-multi.multi-one {
    padding: 0
}

.section-content-multi-text:not(.dashed-items) .inner-multi.multi-dbl {
    padding-left: 0;
    padding-right: 35px
}

.section-content-multi-text:not(.dashed-items) .inner-multi.multi-dbl+.inner-multi.multi-dbl {
    padding-left: 35px;
    padding-right: 0
}

@media only screen and (max-width:960px) {
    .section-content-multi-text:not(.dashed-items) .inner-multi {
        padding-right: 35px
    }
}

@media only screen and (max-width:720px) {
    .section-content-multi-text:not(.dashed-items) .inner-multi {
        padding-right: 25px
    }
}

@media only screen and (max-width:425px) {
    .section-content-multi-text:not(.dashed-items) .inner-multi {
        padding-right: 0;
        padding-left: 0
    }
    .section-content-multi-text:not(.dashed-items) .inner-multi.multi-dbl ul {
        margin-top: 0
    }
    .section-content-multi-text:not(.dashed-items) .inner-multi.multi-dbl:nth-child(1n) {
        padding-right: 0;
        padding-left: 0;
        margin-bottom: 0
    }
    .section-content-multi-text:not(.dashed-items) .inner-multi.multi-dbl:nth-child(1n)+.inner-multi.multi-dbl {
        padding-left: 0;
        padding-right: 0
    }
}

.section-content-multi-text .wrap {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.section-content-multi-text .inner-multi {
    display: block;
    vertical-align: top;
    width: 33.33%;
    font-size: 16px;
    line-height: 30px
}

.section-content-multi-text .inner-multi.multi-one {
    display: block;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0
}

.section-content-multi-text .inner-multi.multi-one figure {
    float: left;
    width: auto
}

.section-content-multi-text .inner-multi.multi-dbl {
    width: 50%
}

@media only screen and (max-width:720px) {
    .section-content-multi-text .inner-multi {
        width: 50%
    }
}

@media only screen and (max-width:425px) {
    .section-content-multi-text .inner-multi,
    .section-content-multi-text .inner-multi.multi-dbl:nth-child(1n) {
        width: 100%
    }
}

.section-content-multi-text .inner-multi.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-multi-text .inner-multi.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-multi-text .inner-multi.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-multi-text .inner-multi.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-multi-text>.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-multi-text>.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-multi-text>.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-multi-text>.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-multi-text p {
    font-size: 16px;
    letter-spacing: .02em;
    line-height: 1.7
}

.section-content-multi-text p:not(:first-child) {
    margin-top: 35px
}

.section-content-multi-text p.number {
    font-style: normal;
    letter-spacing: .1em;
    font-size: 16px;
    color: #b3b3b3
}

.section-content-multi-text p.sub-tit {
    margin: 20px 0;
    letter-spacing: .1em;
    font-size: 16px;
    color: #b3b3b3
}

.section-content-multi-text p.colored-title {
    margin: 0 0 -75px;
    max-width: 1080px;
    font: 50px/1.2 "Exo 2", sans-serif;;
    color: #000
}

.section-content-multi-text p.colored-title strong {
    font-weight: 400;
    color: red
}

.section-content-multi-text p.colored-title+* {
    margin-top: 125px
}

@media only screen and (max-width:1280px) {
    .section-content-multi-text p.colored-title {
        margin: 0 0 -35px
    }
    .section-content-multi-text p.colored-title+* {
        margin-top: 80px
    }
}

@media only screen and (max-width:1366px) {
    .section-content-multi-text p.colored-title {
        font-size: 46px
    }
}

@media only screen and (max-width:960px) {
    .section-content-multi-text p.colored-title {
        font-size: 38px
    }
}

@media only screen and (max-width:425px) {
    .section-content-multi-text p.colored-title {
        font-size: 32px
    }
}

.section-content-multi-text h1,
.section-content-multi-text h2,
.section-content-multi-text h3,
.section-content-multi-text h4,
.section-content-multi-text h5,
.section-content-multi-text h6 {
    font-weight: 400;
    font-family: HelveticaBold;
    line-height: 1.3
}

.section-content-multi-text h1 {
    font-size: 50px
}

.section-content-multi-text h2 {
    font-size: 40px
}

.section-content-multi-text h3 {
    font-size: 35px
}

.section-content-multi-text h4 {
    font-size: 28px
}

.section-content-multi-text h5,
.section-content-multi-text h6 {
    font-size: 20px;
    margin: 20px 0
}

.section-content-multi-text ol,
.section-content-multi-text ul {
    width: 100%;
    padding: 0;
    list-style: none;
    margin-top: 28px
}

.section-content-multi-text ol li,
.section-content-multi-text ul li {
    position: relative;
    width: 100%;
    padding-left: 30px;
    margin-bottom: 15px
}

.section-content-multi-text ol li:last-child,
.section-content-multi-text ul li:last-child {
    margin-bottom: 0
}

.section-content-multi-text ul li:before {
    content: "";
    position: absolute;
    top: 9px;
    left: 0;
    width: 6px;
    height: 6px;
    background: red;
    border-radius: 50%
}

.section-content-multi-text ol {
    counter-reset: li
}

.section-content-multi-text ol li:before {
    content: counter(li) ".";
    counter-increment: li;
    position: absolute;
    width: 25px;
    height: 25px;
    top: 0;
    left: 0;
    color: red;
    line-height: 25px
}

.section-content-multi-text img {
    display: block;
    width: 100%;
    height: auto
}

.section-content-multi-text figure {
    position: relative;
    width: 100%
}

.section-content-multi-text figure iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border: none
}

.section-content-multi-text figure figcaption {
    margin-top: 20px
}

.section-content-multi-text figure.section-video-figure {
    padding-bottom: 56.25%
}

.section-content-multi-text blockquote {
    position: relative;
    width: 100%;
    padding: 145px 40px 60px;
    border: 2px solid #000;
    font: 20px/1.7 "Exo 2", sans-serif;;
    text-align: center
}

.section-content-multi-text blockquote:before {
    content: "";
    position: absolute;
    width: 34px;
    height: 30px;
    top: 65px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: url("/images/quote-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-content-multi-text .section-table {
    position: relative;
    width: 100%;
    overflow: hidden
}

.section-content-multi-text .section-table table {
    width: 100%;
    border: 1px solid #dadada;
    border-collapse: collapse
}

.section-content-multi-text .section-table table td,
.section-content-multi-text .section-table table th {
    text-align: left;
    padding: 30px
}

.section-content-multi-text .section-table table th {
    font: 14px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-multi-text .section-table table td {
    border: 1px solid #dadada;
    font: 16px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-multi-text .section-table table a {
    color: red;
    text-decoration: underline
}

.section-content-multi-text .section-table table a:hover {
    text-decoration: none
}

.section-content-quote {
    position: relative;
    width: 100%
}

.section-content-quote blockquote {
    position: relative;
    width: 100%;
    text-align: center;
    border: 2px solid #000;
    padding: 145px 40px 50px
}

.section-content-quote blockquote:before {
    content: "";
    position: absolute;
    width: 34px;
    height: 30px;
    top: 65px;
    left: 0;
    right: 0;
    margin: 0 auto;
    background: url("/images/quote-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-content-quote blockquote>p {
    font: 20px/1.7 "Exo 2", sans-serif;
}

.section-content-quote blockquote footer {
    position: relative;
    width: 100%;
    padding-top: 50px;
    font-size: 16px
}

.section-content-quote blockquote cite {
    position: relative;
    display: block;
    width: 100%;
    padding: 10px 0;
    font-style: normal;
    font-family: "Exo 2", sans-serif;
}

.section-content-quote blockquote cite a {
    color: #000;
    text-decoration: underline
}

.section-content-quote blockquote.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-quote blockquote.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-quote blockquote.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-quote blockquote.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-image {
    position: relative;
    width: 100%
}

.section-content-image img {
    display: block;
    width: 100%;
    height: auto
}

.section-content-image figure {
    position: relative;
    width: 100%;
    margin: 0
}

.section-content-image>.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: opacity(.5) contrast(2) brightness(1.25);
    filter: opacity(.5) contrast(2) brightness(1.25);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-image>.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.section-content-image>.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: opacity(1) contrast(1) brightness(1);
    filter: opacity(1) contrast(1) brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-image>.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-code {
    position: relative;
    width: 100%
}

.section-content-code iframe {
    position: relative;
    width: 100%;
    height: auto
}

.section-content-code.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-code.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-code.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-code.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-gallery,
.section-gallery-center {
    position: relative;
    width: 100%
}

.section-content-gallery {
    height: 0;
    padding-bottom: 56.25%
}

.section-content-gallery.animate-element {
    opacity: 0;
    pointer-events: none;
    -webkit-filter: brightness(0);
    filter: brightness(0);
    will-change: filter, opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-gallery.animate-element[data-start=true] {
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: opacity, -webkit-filter, -webkit-transform;
    transition-property: filter, opacity, transform;
    transition-property: filter, opacity, transform, -webkit-filter, -webkit-transform
}

.section-content-gallery.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-filter: brightness(1);
    filter: brightness(1);
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-gallery.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-gallery-inner {
    left: 0
}

.section-gallery-inner,
.section-gallery-slide {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    top: 0
}

.section-gallery-slide img {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.section-gallery-slide video {
    position: absolute;
    width: auto;
    height: 100%;
    min-width: 100%;
    top: 0;
    left: 50%;
    -webkit-transform: translate3d(-50%, 0, 0);
    transform: translate3d(-50%, 0, 0)
}

.section-content-play {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    will-change: opacity, transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1)
}

.section-content-play.playing {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    pointer-events: none
}

.section-gallery-button {
    position: absolute;
    display: none;
    width: 90px;
    height: 90px;
    padding: 0;
    top: 0;
    bottom: 0;
    border: none;
    margin: auto 0;
    cursor: pointer;
    background: none
}

.section-gallery-button.activated {
    display: block
}

.section-gallery-button.section-gallery-prev {
    left: -150px
}

.section-gallery-button.section-gallery-next {
    right: -150px
}

.unit-container[data-page=talks-single] .section-gallery-button {
    width: 64px;
    height: 64px
}

.unit-container[data-page=talks-single] .section-gallery-button.section-gallery-prev {
    left: -100px
}

.unit-container[data-page=talks-single] .section-gallery-button.section-gallery-next {
    right: -100px
}

.section-content-comments {
    position: relative;
    width: 100%
}

.section-content-comments.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-comments.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-comments.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-comments.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-comments-title {
    position: relative;
    width: 100%;
    margin-bottom: 60px
}

.section-content-comments-title p {
    font: 40px "Exo 2", sans-serif;
}

.section-content-awards,
.section-content-comments-content {
    position: relative;
    width: 100%
}

.section-content-awards.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-awards.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-awards.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-awards.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-awards-title {
    position: relative;
    width: 100%;
    margin-bottom: 40px
}

.section-content-awards-title p {
    font: 40px "Exo 2", sans-serif;
}

.section-content-awards-list {
    width: 100%;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

.section-content-awards-item,
.section-content-awards-list {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-content-awards-item {
    width: 50%;
    overflow: hidden;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    padding: 40px 30px;
    margin: 0 -1px -1px 0;
    border: 1px solid #dadada
}

a.section-content-awards-item {
    will-change: background;
    -webkit-transition: background .5s cubic-bezier(.4, 0, 0, 1);
    transition: background .5s cubic-bezier(.4, 0, 0, 1)
}

a.section-content-awards-item:hover .section-content-awards-info-title p {
    color: red
}

.section-content-awards-icon {
    position: relative;
    width: 72px;
    height: 72px
}

.section-content-awards-icon>* {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -o-object-fit: contain;
    object-fit: contain
}

.section-content-awards-info {
    position: relative;
    width: calc(100% - 72px);
    padding-left: 28px
}

.section-content-awards-info-title {
    position: relative;
    width: 100%
}

.section-content-awards-info-title p {
    color: #000;
    font: 20px/1.45 "Exo 2", sans-serif;;
    letter-spacing: .02em;
    -webkit-transition: color .25s ease-in-out;
    transition: color .25s ease-in-out
}

.section-content-awards-info-desc {
    position: relative;
    width: 100%
}

.section-content-awards-info-desc p {
    color: #908f8f;
    font: 16px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-statistic {
    position: relative;
    width: 100%
}

.section-content-statistic.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-statistic.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-statistic.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-statistic.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-statistic-title {
    position: relative;
    width: 100%;
    margin-bottom: 40px
}

.section-content-statistic-title p {
    font: 40px "Exo 2", sans-serif;
}

.section-content-statistic-list {
    width: 100%;
    -webkit-box-orient: horizontal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap
}

.section-content-statistic-item,
.section-content-statistic-list {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-content-statistic-item {
    width: 25%;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    padding: 50px 30px;
    margin: 0 -1px -1px 0;
    border: 1px solid #dadada
}

.section-content-statistic-item-title {
    position: relative;
    width: 100%;
    text-align: center
}

.section-content-statistic-item-title p {
    color: red;
    font: 50px/1.2 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-statistic-item-desc {
    position: relative;
    width: 100%;
    text-align: center
}

.section-content-statistic-item-desc p {
    color: #000;
    font: 16px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-marks {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-content-marks a {
    display: block;
    padding: 15px 35px;
    margin: 0 2px 2px 0;
    background: #f2f2f2;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1);
    font: 16px "Exo 2", sans-serif;;
    text-decoration: none!important;
    letter-spacing: .02em;
    color: #908f8f
}

.section-content-marks a:hover {
    color: #000
}

.section-content-visit {
    position: relative;
    width: 100%
}

.section-content-visit a {
    position: relative;
    display: inline-block;
    padding-bottom: 4px;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: #000;
    font-size: 18px;
    letter-spacing: .02em;
    text-decoration: none!important;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.section-content-visit a:before {
    content: "";
    position: absolute;
    width: calc(100% + 15px);
    height: 2px;
    left: 0;
    bottom: 0;
    background-color: #000;
    will-change: width;
    -webkit-transition: background-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: background-color .5s cubic-bezier(.4, 0, 0, 1)
}

.section-content-visit a:hover {
    color: red
}

.section-content-visit a:hover:before {
    background-color: transparent
}

.section-content-share {
    position: relative;
    width: 100%
}

.section-content-share .section-share {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-content-share.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0);
    transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0)
}

.section-content-share.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-share.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.section-content-share.animate-element[data-start=true].finished {
    pointer-events: auto
}

.section-direction {
    position: relative;
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-direction.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-direction.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-direction.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0);
    pointer-events: auto
}

.section-direction.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-direction-item {
    position: relative;
    width: 100%;
    padding: 100px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-direction-item:before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 0;
    background: #fff;
    -webkit-transition: background .8s cubic-bezier(.4, 0, 0, 1);
    transition: background .8s cubic-bezier(.4, 0, 0, 1)
}

.section-direction-item:last-child:before {
    background: #f9f9f9
}

.section-direction-item .section-direction-item-name p {
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.section-direction-item .section-direction-item-center {
    z-index: 1
}

.section-direction-item:hover:before {
    background: red
}

.section-direction-item:hover .section-direction-item-name p,
.section-direction-item:hover .section-direction-item-title p {
    color: #fff
}

.section-direction-item:hover .section-direction-icon:before {
    opacity: 0
}

.section-direction-item:hover .section-direction-icon:after {
    opacity: 1
}

.section-direction-item-center {
    position: relative;
    width: 50%
}

.section-direction-item-name {
    position: relative;
    width: 100%;
    margin-bottom: 40px;
    text-align: center
}

.section-direction-item-name p {
    color: #908f8f;
    font: 18px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-direction-item-title {
    position: relative;
    width: 100%;
    margin-bottom: 40px;
    text-align: center
}

.section-direction-item-title p {
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1);
    color: #000;
    font: 18px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-direction-item-icon {
    position: relative;
    width: 100%;
    text-align: center
}

.section-direction-icon {
    position: relative;
    display: inline-block;
    width: 33px;
    height: 8px
}

.section-direction-icon:after,
.section-direction-icon:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.section-direction-icon:after {
    opacity: 0
}

.section-direction-prev .section-direction-icon:before {
    background: url("/images/back-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-direction-prev .section-direction-icon:after {
    background: url("/images/back-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-direction-next .section-direction-icon:before {
    background: url("/images/forward-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-direction-next .section-direction-icon:after {
    background: url("/images/forward-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.section-content-author {
    position: relative;
    width: 100%
}

.section-content-author.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0
}

.section-content-author.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-content-author.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-content-author.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-content-author-define {
    position: relative;
    width: 100%;
    margin-bottom: 35px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-author-define-image {
    position: relative;
    width: 90px;
    height: 90px;
    overflow: hidden;
    border-radius: 50%
}

.section-author-define-image img {
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

.section-author-define-desc {
    position: relative;
    width: calc(100% - 285px);
    padding-left: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-author-define-name {
    position: relative;
    width: 100%
}

.section-author-define-name p {
    font: 20px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-author-define-position {
    position: relative;
    width: 100%
}

.section-author-define-position p {
    font: 16px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-author-define-rate {
    position: relative;
    width: 195px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-author-define-rate-name {
    position: relative;
    width: 100%;
    margin-bottom: 7px
}

.section-author-define-rate-name p {
    font: 16px/1.6 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-content-author-desc {
    position: relative;
    width: 100%
}

.section-content-author-desc p {
    font: 16px/1.7 "Exo 2", sans-serif;;
    letter-spacing: .02em
}

#a2apage_modal {
    width: 600px;
    border: none!important;
    margin-left: -300px!important;
    border-radius: 0!important
}

#a2apage_modal:before {
    content: "";
    position: absolute;
    width: 30px;
    height: 100%;
    top: 0;
    right: 0;
    z-index: 3;
    background: -webkit-gradient(linear, left top, right top, from(hsla(0, 0%, 100%, .7)), to(#fff));
    background: linear-gradient(90deg, hsla(0, 0%, 100%, .7) 0, #fff)
}

#a2apage_modal .a2a_copy_link_container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap
}

#a2apage_modal .a2a_copy_link_container #a2a_copy_link_icon {
    margin: 0!important;
    background: red!important
}

#a2apage_modal .a2a_copy_link_container #a2a_copy_link_icon svg {
    width: 80%!important;
    height: 80%!important;
    bottom: 0!important;
    margin: 10% 0 0 10%!important
}

#a2apage_modal .a2a_copy_link_container #a2a_copy_link_text {
    width: 100%!important;
    font: 18px "Exo 2", sans-serif;
}

@media only screen and (max-width:1800px) {
    .section-single-data_pre-content F .section-badges.section-badges-small .section-badges-item {
        font-size: 13px;
        margin: 15px 10px
    }
    .section-single-data_pre-content F .section-badges.section-badges-small .section-badges-item:first-child {
        margin-left: 0
    }
    .section-single-data_pre-content F .section-badges.section-badges-small .section-badges-item:last-child {
        margin-right: 0
    }
}

@media only screen and (max-width:1600px) {
    .section-begin {
        padding-top: 120px
    }
    .section-define-name {
        margin-bottom: 20px
    }
    .section-define-name p {
        font-size: 18px
    }
    .section-define-title {
        margin-bottom: 15px
    }
    .section-define-title h1,
    .section-define-title h2 {
        font-size: 60px
    }
    .section-define-desc p {
        font-size: 18px
    }
    .section-tags a {
        padding: 0 16px
    }
    .section-tags.section-tags-small a {
        font-size: 15px
    }
    .section-tags.section-tags-major a {
        font-size: 16px
    }
    .section-follow {
        padding: 50px 35px;
        margin-bottom: 50px
    }
    .section-follow-image {
        margin-bottom: 20px
    }
    .section-follow-image-item {
        width: 120px;
        height: 120px
    }
    .section-follow-name {
        margin-bottom: 15px
    }
    .section-follow-name p {
        font-size: 26px
    }
    .section-follow-title {
        margin-bottom: 15px
    }
    .section-follow-title p {
        font-size: 15px
    }
    .section-follow-follows {
        margin-bottom: 30px
    }
    .section-follow-follows p {
        font-size: 15px
    }
    .section-follow-button {
        margin-bottom: 15px
    }
    .section-follow-link a {
        font-size: 15px
    }
    .section-mark {
        padding: 9px 28px
    }
    .section-mark span {
        font-size: 15px
    }
    .section-ticket-image {
        margin-bottom: 15px
    }
    .section-ticket-date {
        margin-bottom: 0
    }
    .section-ticket-date p {
        font-size: 15px
    }
    .section-ticket-title a {
        font-size: 16px
    }
    .section-badges.section-badges-major .section-badges-item {
        font-size: 15px
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item {
        font-size: 12px;
        margin: 15px 8px
    }
    .section-single-data {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
    .section-single-data-left {
        width: 34%
    }
    .section-single-data-right {
        width: 65%
    }
    .section-badges-item {
        margin: 15px 12px;
        font-size: 13px
    }
    .section-badges.section-badges-small .section-badges-item {
        font-size: 13px
    }
    .section-badges-item {
        margin: 12px
    }
    .section-grid-container {
        padding-top: 60px
    }
    .section-grid-title {
        margin-bottom: 30px
    }
    .section-grid-title p {
        font-size: 26px
    }
    .section-grid-row {
        margin-bottom: 55px
    }
    .section-grid-item {
        width: calc((100% - 52px) / 3);
        margin-right: 26px
    }
    .pagination-dotted,
    .pagination-link {
        margin: 15px;
        font-size: 18px
    }
    .pagination-button {
        width: 80px;
        height: 80px;
        margin: 15px
    }
    .filter-link {
        height: 60px
    }
    .filter-link span {
        font-size: 15px
    }
    .categories-desktop-selects {
        width: 300px
    }
    .video-button-major {
        width: 100px;
        height: 100px
    }
    .video-button-small {
        width: 90px;
        height: 90px
    }
    .section-showreel-left {
        padding: 0 100px 0 14.25%
    }
    .section-showreel-title {
        margin-bottom: 40px
    }
    .section-showreel-title p {
        font-size: 65px
    }
    .video-button-desc {
        padding-left: 20px;
        font-size: 18px
    }
    .section-direction-item {
        padding: 140px 0
    }
    .section-direction-item-name {
        margin-bottom: 30px
    }
    .section-direction-item-name p {
        font-size: 16px
    }
    .section-direction-item-title {
        margin-bottom: 30px
    }
    .section-direction-item-title p {
        font-size: 16px
    }
    .section-content {
        margin: 50px 0
    }
    .section-content-top {
        margin: -20px 0 80px
    }
    .section-content-text>* {
        margin: 25px 0
    }
    .section-content-text figcaption,
    .section-content-text ol li,
    .section-content-text p,
    .section-content-text ul li {
        font-size: 15px
    }
    .section-content-text h1 {
        font-size: 40px
    }
    .section-content-text h2 {
        font-size: 37px
    }
    .section-content-text h3 {
        font-size: 32px
    }
    .section-content-text h4 {
        font-size: 27px
    }
    .section-content-text h5 {
        font-size: 22px
    }
    .section-content-text h6 {
        font-size: 17px
    }
    .section-content-text ol li,
    .section-content-text ul li {
        padding-left: 25px;
        margin-bottom: 8px
    }
    .section-content-text ul li:before {
        width: 5px;
        height: 5px
    }
    .section-content-text ol li:before {
        width: 20px;
        height: 20px;
        line-height: 25px
    }
    .section-content-text blockquote {
        padding: 125px 40px 50px;
        font-size: 18px
    }
    .section-content-text blockquote:before {
        width: 29px;
        height: 26px;
        top: 55px
    }
    .section-content-text .section-table table td,
    .section-content-text .section-table table th {
        padding: 26px
    }
    .section-content-text .section-table table th {
        font-size: 13px
    }
    .section-content-text .section-table table td {
        font-size: 14px
    }
    .section-content-marks a {
        padding: 12px 30px;
        font-size: 15px
    }
    .section-content-visit a {
        font-size: 16px
    }
    .section-content-comments-title {
        margin-bottom: 50px
    }
    .section-content-comments-title p {
        font-size: 35px
    }
    .section-content-awards-title {
        margin-bottom: 35px
    }
    .section-content-awards-title p {
        font-size: 35px
    }
    .section-content-awards-item {
        padding: 30px 25px
    }
    .section-content-awards-icon {
        width: 52px;
        height: 52px
    }
    .section-content-awards-info {
        width: calc(100% - 52px);
        padding-left: 25px
    }
    .section-content-awards-info-title p {
        font-size: 17px
    }
    .section-content-awards-info-desc p {
        font-size: 15px
    }
    .section-content-statistic-title {
        margin-bottom: 35px
    }
    .section-content-statistic-title p {
        font-size: 35px
    }
    .section-content-statistic-item {
        padding: 40px 25px
    }
    .section-content-statistic-item-title p {
        font-size: 40px
    }
    .section-content-statistic-item-desc p {
        font-size: 15px
    }
    .section-content-quote blockquote {
        padding: 125px 30px 40px
    }
    .section-content-quote blockquote:before {
        width: 29px;
        height: 26px;
        top: 55px
    }
    .section-content-quote blockquote>p {
        font-size: 18px
    }
    .section-content-quote blockquote footer {
        font-size: 15px;
        padding-top: 40px
    }
    .section-content-quote blockquote cite {
        padding: 7px 0
    }
    .section-gallery-button {
        width: 80px;
        height: 80px
    }
    .section-gallery-button.section-gallery-prev {
        left: -120px
    }
    .section-gallery-button.section-gallery-next {
        right: -120px
    }
    .unit-container[data-page=talks-single] .section-gallery-button {
        width: 64px;
        height: 64px
    }
    .unit-container[data-page=talks-single] .section-gallery-button.section-gallery-prev {
        left: -100px
    }
    .unit-container[data-page=talks-single] .section-gallery-button.section-gallery-next {
        right: -100px
    }
    .section-content-author-define {
        margin-bottom: 30px
    }
    .section-author-define-image {
        width: 80px;
        height: 80px
    }
    .section-author-define-desc {
        width: calc(100% - 275px);
        padding-left: 25px
    }
    .section-author-define-name p {
        font-size: 18px
    }
    .section-author-define-position p {
        font-size: 15px
    }
    .section-author-define-rate {
        width: 195px
    }
    .section-author-define-rate-name p,
    .section-content-author-desc p {
        font-size: 15px
    }
    #a2apage_modal .a2a_copy_link_container #a2a_copy_link_text {
        font-size: 16px
    }
}

@media only screen and (max-width:1480px) {
    .filter-link {
        padding: 0 15px
    }
    .section-badges.section-badges-small .section-badges-item {
        font-size: 11px
    }
    .section-badges-item {
        margin: 12px 8px
    }
}

@media only screen and (min-width:1367px) and (max-width:1480px) {
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item {
        font-size: 11px;
        margin: 15px 6px
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item:first-child {
        margin-left: 0
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item:last-child {
        margin-right: 0
    }
}

@media only screen and (max-width:1366px) {
    .section-badges.section-badges-small .section-badges-item {
        font-size: 13px
    }
    .section-badges-item {
        margin: 12px
    }
    .section-begin {
        padding-top: 110px
    }
    .section-define-name {
        margin-bottom: 15px
    }
    .section-define-name p {
        font-size: 16px
    }
    .section-define-title h1,
    .section-define-title h2 {
        font-size: 50px
    }
    .section-define-desc p {
        font-size: 16px
    }
    .section-tags a {
        padding: 0 14px
    }
    .section-tags.section-tags-small a {
        font-size: 14px
    }
    .section-tags.section-tags-major a {
        font-size: 15px
    }
    .section-follow {
        padding: 40px 30px;
        margin-bottom: 40px
    }
    .section-follow-image-item {
        width: 100px;
        height: 100px
    }
    .section-follow-name p {
        font-size: 24px
    }
    .section-follow-title p {
        font-size: 14px
    }
    .section-follow-follows {
        margin-bottom: 25px
    }
    .section-follow-follows p,
    .section-follow-link a {
        font-size: 14px
    }
    .section-mark {
        bottom: 15px;
        right: 15px;
        padding: 8px 24px
    }
    .section-mark span,
    .section-ticket-date p {
        font-size: 14px
    }
    .section-ticket-title a {
        font-size: 15px
    }
    .section-badges.section-badges-major .section-badges-item {
        font-size: 14px
    }
    .section-badges-item {
        margin: 10px
    }
    .section-grid-row {
        margin-bottom: 40px
    }
    .section-grid-item {
        width: calc((100% - 50px) / 3);
        margin-right: 25px
    }
    .pagination-dotted,
    .pagination-link {
        margin: 12px;
        font-size: 16px
    }
    .pagination-button {
        width: 70px;
        height: 70px;
        margin: 12px
    }
    .section-grid-container {
        padding-top: 50px
    }
    .section-grid-title {
        margin-bottom: 25px
    }
    .section-grid-title p {
        font-size: 24px
    }
    .filter-link {
        height: 55px;
        padding: 0 20px
    }
    .filter-link span {
        font-size: 14px
    }
    .categories-desktop-selects {
        width: 280px
    }
    .section-showreel-content {
        width: calc(100% - 40px);
        padding-bottom: 55%
    }
    .video-button-major {
        width: 90px;
        height: 90px
    }
    .video-button-small {
        width: 80px;
        height: 80px
    }
    .section-showreel-left {
        padding: 0 80px
    }
    .section-showreel-title {
        margin-bottom: 35px
    }
    .section-showreel-title p {
        font-size: 50px
    }
    .video-button-desc {
        font-size: 16px
    }
    .section-direction-item {
        padding: 120px 0
    }
    .section-direction-item-name {
        margin-bottom: 25px
    }
    .section-direction-item-name p {
        font-size: 15px
    }
    .section-direction-item-title {
        margin-bottom: 25px
    }
    .section-direction-item-title p {
        font-size: 15px
    }
    .section-content {
        margin: 40px 0
    }
    .section-content-top {
        margin: -10px 0 55px
    }
    .section-content-text>* {
        margin: 15px 0
    }
    .section-content-text figcaption,
    .section-content-text ol li,
    .section-content-text p,
    .section-content-text ul li {
        font-size: 14px
    }
    .section-content-text h1 {
        font-size: 35px
    }
    .section-content-text h2 {
        font-size: 30px
    }
    .section-content-text h3 {
        font-size: 27px
    }
    .section-content-text h4 {
        font-size: 23px
    }
    .section-content-text h5 {
        font-size: 20px
    }
    .section-content-text h6 {
        font-size: 15px
    }
    .section-content-text blockquote {
        padding: 125px 30px 40px;
        font-size: 16px
    }
    .section-content-text .section-table table td,
    .section-content-text .section-table table th {
        padding: 20px
    }
    .section-content-marks a {
        padding: 12px 25px;
        font-size: 14px
    }
    .section-content-visit a {
        font-size: 16px
    }
    .section-content-visit a:before {
        width: calc(100% + 10px)
    }
    .section-content-awards-title p,
    .section-content-comments-title p {
        font-size: 30px
    }
    .section-content-awards-icon {
        width: 42px;
        height: 42px
    }
    .section-content-awards-info {
        width: calc(100% - 42px)
    }
    .section-content-awards-info-title p {
        font-size: 15px
    }
    .section-content-awards-info-desc p {
        font-size: 14px
    }
    .section-content-statistic-title p {
        font-size: 30px
    }
    .section-content-statistic-item {
        padding: 30px 25px
    }
    .section-content-statistic-item-title p {
        font-size: 35px
    }
    .section-content-statistic-item-desc p {
        font-size: 14px
    }
    .section-content-quote blockquote>p {
        font-size: 16px
    }
    .section-content-quote blockquote footer {
        font-size: 14px;
        padding-top: 35px
    }
    .section-gallery-button {
        width: 75px;
        height: 75px
    }
    .section-gallery-button.section-gallery-prev {
        left: -110px
    }
    .section-gallery-button.section-gallery-next {
        right: -110px
    }
    .unit-container[data-page=talks-single] .section-gallery-button {
        width: 64px;
        height: 64px
    }
    .unit-container[data-page=talks-single] .section-gallery-button.section-gallery-prev {
        left: -100px
    }
    .unit-container[data-page=talks-single] .section-gallery-button.section-gallery-next {
        right: -100px
    }
    .section-content-author-define {
        margin-bottom: 25px
    }
    .section-author-define-image {
        width: 75px;
        height: 75px
    }
    .section-author-define-desc {
        width: calc(100% - 270px);
        padding-left: 20px
    }
    .section-author-define-name p {
        font-size: 16px
    }
    .section-author-define-position p,
    .section-author-define-rate-name p,
    .section-content-author-desc p {
        font-size: 14px
    }
    #a2apage_modal .a2a_copy_link_container #a2a_copy_link_text {
        font-size: 15px
    }
}

@media only screen and (max-width:1024px) {
    .section-grid {
        width: 100%;
        margin: 0 auto
    }
    .section-grid-row {
        -webkit-perspective: 200px;
        perspective: 200px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        margin-bottom: 60px
    }
    .section-grid-item {
        width: 100%;
        margin-right: 0;
        margin-bottom: 60px
    }
    .section-grid-item:last-child {
        margin-bottom: 0
    }
    .section-follow-title p {
        font-size: 16px
    }
    .section-follow-follows {
        margin-bottom: 30px
    }
    .section-follow-follows p,
    .section-follow-link a {
        font-size: 16px
    }
    .section-mark {
        bottom: 20px;
        right: 20px;
        padding: 10px 30px
    }
    .section-mark span {
        font-size: 16px
    }
    .section-ticket-date p {
        font-size: 18px
    }
    .section-ticket-title a {
        font-size: 19px
    }
    .section-pagination {
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
    .pagination-dotted,
    .pagination-link {
        display: none
    }
    .section-follow {
        margin-bottom: 60px
    }
    .section-categories {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-flow: column-reverse nowrap;
        flex-flow: column-reverse nowrap
    }
    .categories-desktop-list {
        display: none
    }
    .categories-mobile {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-flow: row nowrap;
        flex-flow: row nowrap;
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    .categories-desktop-selects {
        width: 100%;
        margin-left: 0;
        margin-top: 25px
    }
    .categories-select-item {
        margin: 0 12px
    }
    .categories-select-item:first-child {
        margin-left: 0
    }
    .categories-select-item:last-child {
        margin-right: 0
    }
    .categories-select-item:last-child .nice-select .list {
        left: 0
    }
    .section-showreel-content {
        padding-bottom: 65%
    }
    .section-showreel-left {
        padding: 0 40px
    }
    .section-showreel-title p {
        font-size: 40px
    }
    .section-direction {
        margin-top: 100px
    }
    .section-direction-item {
        background: #f9f9f9;
        padding: 30px 0
    }
    .section-direction-item-center {
        width: 100%
    }
    .section-direction-item-name {
        margin-bottom: 0
    }
    .section-direction-item-icon,
    .section-direction-item-title {
        display: none
    }
    .section-gallery-button {
        top: unset;
        bottom: -110px
    }
    .section-gallery-button.section-gallery-prev {
        left: 0!important
    }
    .section-gallery-button.section-gallery-next {
        right: 0!important
    }
    .section-content-text .section-table {
        overflow-x: auto;
        overflow-y: hidden
    }
    .section-content-text .section-table table {
        min-width: 900px
    }
    .section-gallery-center.margin {
        padding-bottom: 125px
    }
}

@media only screen and (min-width:801px) and (max-width:840px) {
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item {
        font-size: 11px;
        margin: 15px 9px
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item:first-child {
        margin-left: 0
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item:last-child {
        margin-right: 0
    }
}

@media only screen and (max-width:800px) {
    .section-define-left {
        width: 100%
    }
    .section-content-statistic-item {
        width: 50%
    }
    .section-content-author-define {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-bottom: 35px
    }
    .section-author-define-image {
        margin-bottom: 20px
    }
    .section-author-define-desc {
        width: 100%;
        padding-left: 0;
        margin-bottom: 25px
    }
    .section-author-define-name,
    .section-author-define-position,
    .section-author-define-rate-name,
    .section-content-author-desc {
        text-align: center
    }
    #a2apage_modal {
        width: calc(100% - 80px)!important;
        left: 40px!important;
        margin-left: 0!important
    }
    .section-single-data.section-single-data_pre-content .section-single-data-left,
    .section-single-data.section-single-data_pre-content .section-single-data-right {
        width: 100%
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item {
        font-size: 11px;
        margin: 15px 9px
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item:first-child {
        margin-left: 0
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item:last-child {
        margin-right: 0
    }
    .section-direction {
        margin-top: 80px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .section-showreel-image img,
    .section-showreel-image video {
        display: none
    }
    .section-showreel-image span {
        position: absolute;
        display: block;
        z-index: 1;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-position: 50% 50%;
        background-repeat: no-repeat;
        background-size: cover
    }
    .section-define-name {
        margin-bottom: 10px
    }
    .section-define-name p {
        font-size: 14px
    }
    .section-define-title {
        margin-bottom: 12px
    }
    .section-define-title h1,
    .section-define-title h2 {
        font-size: 36px
    }
    .section-follow-name p {
        font-size: 21px
    }
    .section-follow {
        padding: 25px
    }
    .section-follow-title p {
        font-size: 14px
    }
    .section-follow-follows {
        margin-bottom: 25px
    }
    .section-follow-follows p,
    .section-follow-link a {
        font-size: 14px
    }
    .section-mark {
        bottom: 15px;
        right: 15px;
        padding: 8px 24px
    }
    .section-mark span {
        font-size: 14px
    }
    .section-grid-item,
    .section-grid-row {
        margin-bottom: 40px
    }
    .section-ticket-date p {
        font-size: 14px
    }
    .section-ticket-title a {
        font-size: 16px
    }
    .pagination-button {
        width: 65px;
        height: 65px;
        margin: 10px
    }
    .section-follow {
        margin-bottom: 50px
    }
    .section-grid-title {
        margin-bottom: 20px
    }
    .section-grid-title p {
        font-size: 21px
    }
    .section-grid-container {
        padding-top: 40px
    }
    .categories-desktop-selects {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .categories-select-item {
        width: 100%;
        margin: 0 0 25px
    }
    .categories-select-item:last-child {
        margin-bottom: 0
    }
    .section-showreel-content {
        width: calc(100% - 25px);
        height: 350px;
        padding-bottom: 0
    }
    .video-button-major {
        width: 70px;
        height: 70px
    }
    .video-button-small {
        width: 60px;
        height: 60px
    }
    .section-showreel-left {
        padding: 0 25px
    }
    .section-showreel-title {
        margin-bottom: 30px
    }
    .section-showreel-title p {
        font-size: 24px;
        line-height: 1.2
    }
    .section-direction {
        margin-top: 60px
    }
    .section-direction-item {
        padding: 23px 0
    }
    .section-content {
        margin: 30px 0
    }
    .section-content-top {
        margin: -10px 0 60px
    }
    .section-content-text h1 {
        font-size: 35px
    }
    .section-content-text h2 {
        font-size: 28px
    }
    .section-content-text h3 {
        font-size: 27px
    }
    .section-content-text h4 {
        font-size: 23px
    }
    .section-content-text h5 {
        font-size: 20px
    }
    .section-content-text blockquote {
        padding: 80px 25px 30px
    }
    .section-content-text blockquote:before {
        width: 23px;
        height: 20px;
        top: 36px
    }
    .section-content-text .section-table table {
        min-width: 800px
    }
    .section-content-text .section-table table td,
    .section-content-text .section-table table th {
        padding: 15px
    }
    .section-content-text .section-table table td {
        font-size: 13px
    }
    .section-content-comments-title {
        margin-bottom: 35px
    }
    .section-content-comments-title p {
        font-size: 24px
    }
    .section-content-awards-title {
        margin-bottom: 30px
    }
    .section-content-awards-title p {
        font-size: 24px
    }
    .section-content-awards-list {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .section-content-awards-item {
        width: 100%;
        padding: 25px;
        margin: 0 0 -1px
    }
    .section-content-statistic-title {
        margin-bottom: 30px
    }
    .section-content-statistic-title p {
        font-size: 24px
    }
    .section-content-statistic-item {
        padding: 25px
    }
    .section-content-statistic-item-title p {
        font-size: 21px
    }
    .section-content-statistic-item-desc p {
        font-size: 13px;
        line-height: 1.2
    }
    .section-content-quote blockquote {
        padding: 80px 25px 30px
    }
    .section-content-quote blockquote:before {
        width: 23px;
        height: 20px;
        top: 36px
    }
    .section-content-quote blockquote footer {
        padding-top: 30px
    }
    .section-gallery-button {
        width: 60px!important;
        height: 60px!important;
        bottom: -85px
    }
    .section-badges-item {
        margin: 0 10px;
        min-width: 30px;
        text-align: center
    }
    .section-badges-item:before {
        right: 0;
        bottom: unset;
        margin: 0 auto
    }
    .section-badges-item.section-badge-comments,
    .section-badges-item.section-badge-date,
    .section-badges-item.section-badge-time,
    .section-badges-item.section-badge-views {
        padding-left: 0;
        padding-top: 30px
    }
    #a2apage_modal {
        width: calc(100% - 50px)!important;
        left: 25px!important
    }
    .section-gallery-center.margin {
        padding-bottom: 85px
    }
    .section-badges-item:before {
        top: -2px
    }
    .section-single-data_pre-content .section-badges {
        margin: 0 -8px
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item {
        font-size: 10px;
        margin: 5px 8px
    }
    .section-single-data_pre-content .section-badges.section-badges-small .section-badges-item:first-child {
        margin-left: 8px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .section-begin {
        padding-top: 110px
    }
    .section-define-name {
        margin-bottom: 10px
    }
    .section-define-name p {
        font-size: 14px
    }
    .section-define-title {
        margin-bottom: 12px
    }
    .section-define-title h1,
    .section-define-title h2 {
        font-size: 36px
    }
    .section-define-desc p {
        font-size: 16px
    }
    .section-follow {
        padding: 25px
    }
    .section-follow-name p {
        font-size: 21px
    }
    .section-follow-title p {
        font-size: 14px
    }
    .section-follow-follows {
        margin-bottom: 25px
    }
    .section-follow-follows p,
    .section-follow-link a {
        font-size: 14px
    }
    .section-mark {
        bottom: 15px;
        right: 15px;
        padding: 8px 24px
    }
    .section-mark span {
        font-size: 14px
    }
    .section-grid-item,
    .section-grid-row {
        margin-bottom: 40px
    }
    .section-ticket-date p {
        font-size: 14px
    }
    .section-ticket-title a {
        font-size: 16px
    }
    .pagination-button {
        width: 65px;
        height: 65px;
        margin: 10px
    }
    .section-follow {
        margin-bottom: 50px
    }
    .section-grid-title {
        margin-bottom: 20px
    }
    .section-grid-title p {
        font-size: 21px
    }
    .section-grid-container {
        padding-top: 40px
    }
    .section-showreel-content {
        width: calc(100% - 25px);
        height: 350px;
        padding-bottom: 0
    }
    .video-button-major {
        width: 70px;
        height: 70px
    }
    .video-button-small {
        width: 60px;
        height: 60px
    }
    .section-showreel-left {
        padding: 0 25px
    }
    .section-showreel-title {
        margin-bottom: 30px
    }
    .section-showreel-title p {
        font-size: 24px;
        line-height: 1.2
    }
    .section-direction-item {
        padding: 80px 25px
    }
    .section-content {
        margin: 30px 0
    }
    .section-content-top {
        margin: -10px 0 60px
    }
    .section-content-text h1 {
        font-size: 35px
    }
    .section-content-text h2 {
        font-size: 28px
    }
    .section-content-text h3 {
        font-size: 27px
    }
    .section-content-text h4 {
        font-size: 23px
    }
    .section-content-text h5 {
        font-size: 20px
    }
    .section-content-text blockquote {
        padding: 80px 25px 30px
    }
    .section-content-text blockquote:before {
        width: 23px;
        height: 20px;
        top: 36px
    }
    .section-content-text .section-table table td,
    .section-content-text .section-table table th {
        padding: 15px
    }
    .section-content-text .section-table table td {
        font-size: 13px
    }
    .section-content-comments-title {
        margin-bottom: 35px
    }
    .section-content-comments-title p {
        font-size: 24px
    }
    .section-content-awards-title {
        margin-bottom: 30px
    }
    .section-content-awards-title p {
        font-size: 24px
    }
    .section-content-awards-item {
        padding: 25px
    }
    .section-content-statistic-title {
        margin-bottom: 30px
    }
    .section-content-statistic-title p {
        font-size: 24px
    }
    .section-content-statistic-item {
        padding: 25px
    }
    .section-content-statistic-item-title p {
        font-size: 21px
    }
    .section-content-statistic-item-desc p {
        font-size: 13px;
        line-height: 1.2
    }
    .section-content-quote blockquote {
        padding: 80px 25px 30px
    }
    .section-content-quote blockquote:before {
        width: 23px;
        height: 20px;
        top: 36px
    }
    .section-content-quote blockquote footer {
        padding-top: 30px
    }
    .section-gallery-button {
        width: 60px!important;
        height: 60px!important;
        bottom: -85px
    }
    #a2apage_modal {
        width: calc(100% - 50px)!important;
        left: 25px!important
    }
    .section-gallery-center.margin {
        padding-bottom: 85px
    }
}

.overflow {
    opacity: 0;
    visibility: hidden;
    background: rgba(0, 0, 0, .45);
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 9;
    -webkit-transition: .5s;
    transition: .5s
}

.overflow_active {
    visibility: visible;
    opacity: 1
}

.modal-thanks {
    position: fixed;
    background-color: #f3f3f3;
    width: 520px;
    z-index: 9;
    top: 200px;
    left: 50%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    visibility: hidden;
    opacity: 0;
    -webkit-transition: .8s;
    transition: .8s;
    max-height: 80%;
    pointer-events: all
}

.modal-thanks_active {
    opacity: 1;
    visibility: visible
}

.close_rating {
    float: right;
    padding: 10px;
    font-size: 18px;
    cursor: pointer
}

.body_rating {
    text-align: center;
    margin: 60px auto 40px;
    width: 100%
}

.body_rating span.th {
    font-size: 24px;
    display: block;
    margin-bottom: 40px
}

.body_rating button {
    width: 220px;
    margin: auto;
    height: 55px
}

button.btn-rating {
    margin-top: 30px;
    font-size: 16px;
    background: red;
    color: #fff;
    border: unset;
    font-weight: 600;
    padding: 8px 24px;
    outline: none;
    cursor: pointer;
    -webkit-transition: .2s;
    transition: .2s
}

.section-content-faq-item {
    margin-bottom: 50px
}

.section-content-faq-item__title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 20px;
    line-height: 1.6
}

.section-content-faq-item__text p {
    font-size: 16px;
    letter-spacing: .02em;
    line-height: 1.8
}

.section-content-text-centered p {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 99%;
    padding: 30px 150px;
    margin: auto;
    border: 1px solid #dadada;
    text-align: center;
    font-size: 20px
}

.section-content-btn {
    width: 400px;
    margin: auto
}

@media only screen and (max-width:1600px) {
    .section-content-text-centered p {
        font-size: 18px
    }
}

@media only screen and (max-width:1366px) {
    .section-content-text-centered p {
        font-size: 16px
    }
}

@media only screen and (max-width:768px) {
    .section-content-text-centered {
        padding: 30px 70px
    }
}

@media only screen and (max-width:520px) {
    .section-content-btn {
        width: 100%
    }
    .section-content-text-centered {
        margin: 50px auto;
        padding: 15px
    }
    .modal-thanks {
        width: 95%
    }
}

#menu {
    position: fixed;
    z-index: 20;
    pointer-events: none;
    -webkit-transition: opacity 0s linear 1.5s;
    transition: opacity 0s linear 1.5s
}

#menu,
#menu:before {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0
}

#menu:before {
    content: "";
    position: absolute;
    z-index: 1;
    background: #fff;
    will-change: opacity;
    -webkit-transition: opacity 1.5s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: opacity 1.5s cubic-bezier(.4, 0, 0, 1) .37s
}

#menu.opened {
    pointer-events: all
}

#menu.opened,
#menu.opened:before {
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

#menu.opened:before {
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

#menu.opened .menu-container {
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    overflow-y: auto
}

.menu-container {
    width: 100%;
    height: 100%;
    z-index: 2;
    opacity: 0;
    padding-top: 124px;
    position: relative;
    -webkit-transition-delay: 1s;
    transition-delay: 1s
}

.menu-head {
    width: 100%;
    height: 124px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3;
    padding: 0 60px
}

.menu-head-section {
    width: 100%;
    height: 100%;
    position: relative
}

.menu-logo {
    position: absolute;
    display: block;
    width: 64px;
    height: 80px;
    padding-top: 60px;
    top: 0px;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    font-size: 0;
    line-height: 0
}

.menu-logo span {
    position: relative;
    display: block;
    width: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform, opacity;
    opacity: 0;
    -webkit-transform: scaleY(1.5) translate3d(0, 15px, 0);
    transform: scaleY(1.5) translate3d(0, 15px, 0);
    -webkit-transition: opacity .35s cubic-bezier(.4, 0, 0, 1), -webkit-transform .65s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .35s cubic-bezier(.4, 0, 0, 1), -webkit-transform .65s cubic-bezier(.4, 0, 0, 1);
    transition: transform .65s cubic-bezier(.4, 0, 0, 1), opacity .35s cubic-bezier(.4, 0, 0, 1);
    transition: transform .65s cubic-bezier(.4, 0, 0, 1), opacity .35s cubic-bezier(.4, 0, 0, 1), -webkit-transform .65s cubic-bezier(.4, 0, 0, 1);
    font: 18px/1 HelveticaBold;
    color: #000;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: .05em;
    text-align: center
}

.menu-logo:hover span {
    opacity: 1!important
}

.menu-logo:before {
    content: "";
    position: absolute;
    display: block;
    /*width: 65px;
    height: 47px;*/
    width: 75px;
    height: 60px;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    background: url("/images/logo-5.png") 50% no-repeat;
    background-size: 100% 100%
}

.menu-logo.active {
    pointer-events: none
}

#menu.opened .menu-logo span {
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0);
    opacity: 0
}

.menu-head-left,
.menu-head-right {
    width: auto;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    position: absolute;
    top: 0
}

.menu-head-left {
    left: 0
}

.menu-head-right {
    right: 0
}

.menu-languages {
    width: auto;
    padding-right: 80px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.menu-languages.animate-item-menu {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    will-change: transform;
    -webkit-transform: translate3d(0, calc(-50vh - 100%), 0) skewX(-15deg) rotateX(10deg);
    transform: translate3d(0, calc(-50vh - 100%), 0) skewX(-15deg) rotateX(10deg)
}

.menu-languages.animate-item-menu.success {
    -webkit-transition-delay: .5s;
    transition-delay: .5s;
    -webkit-transform: translateZ(0) skewX(0);
    transform: translateZ(0) skewX(0)
}

.menu-languages.animate-item-menu.finished {
    -webkit-transform: none;
    transform: none;
    -webkit-transition: none!important;
    transition: none!important
}

.menu-languages.animate-item-menu.finished a {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.menu-language-link {
    color: silver;
    margin-left: 20px;
    font: 16px/20px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.menu-language-link:first-child {
    margin-left: 0
}

.menu-language-link.active,
.menu-language-link:hover {
    color: #000
}

.menu-language-link.active {
    pointer-events: none
}

.menu-nav {
    padding: 0;
    border: none;
    display: block;
    cursor: pointer;
    background: none;
    position: relative;
    margin-right: 50px
}

.menu-nav:last-child {
    margin-right: 0
}

.menu-nav:hover .menu-nav-name {
    color: red
}

.menu-nav.animate-item-menu {
    opacity: 0;
    will-change: opacity, transform;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transform: translate3d(0, calc(-50vh - 100%), 0);
    transform: translate3d(0, calc(-50vh - 100%), 0)
}

.menu-nav.animate-item-menu:nth-child(3) {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.menu-nav.animate-item-menu:nth-child(2) {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.menu-nav.animate-item-menu:first-child {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.menu-nav.animate-item-menu.success {
    opacity: 1;
    -webkit-transform: scale(1) translateZ(0);
    transform: scale(1) translateZ(0)
}

.menu-nav.animate-item-menu.success:first-child {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.menu-nav.animate-item-menu.success:nth-child(2) {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.menu-nav.animate-item-menu.success:nth-child(3) {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.menu-nav.animate-item-menu.finished {
    -webkit-transform: none;
    transform: none;
    -webkit-transition: none!important;
    transition: none!important
}

.menu-nav.animate-item-menu.finished .menu-nav-name {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.menu-nav-portfolio {
    padding-left: 38px
}

.menu-nav-portfolio:hover .hp-square {
    background: red;
    border-color: red
}

.menu-nav-portfolio:hover .hp-square:first-child {
    -webkit-transition-delay: 75ms;
    transition-delay: 75ms;
    -webkit-transform: translate3d(-3px, -3px, 0);
    transform: translate3d(-3px, -3px, 0)
}

.menu-nav-portfolio:hover .hp-square:nth-child(2) {
    -webkit-transition-delay: .05s;
    transition-delay: .05s;
    -webkit-transform: translate3d(3px, -3px, 0);
    transform: translate3d(3px, -3px, 0)
}

.menu-nav-portfolio:hover .hp-square:nth-child(3) {
    -webkit-transition-delay: 25ms;
    transition-delay: 25ms;
    -webkit-transform: translate3d(-3px, 3px, 0);
    transform: translate3d(-3px, 3px, 0)
}

.menu-nav-portfolio:hover .hp-square:nth-child(4) {
    -webkit-transform: translate3d(3px, 3px, 0);
    transform: translate3d(3px, 3px, 0)
}

.menu-nav-portfolio .menu-nav-icon {
    width: 21px;
    height: 21px
}

.menu-nav-showreel {
    padding-left: 34px
}

.menu-nav-showreel:hover .ms-play:before {
    opacity: 0;
    -webkit-transform: scale(1.3) skewX(10deg);
    transform: scale(1.3) skewX(10deg)
}

.menu-nav-showreel:hover .ms-play:after {
    opacity: 1;
    -webkit-transform: scale(1.3) skewX(0);
    transform: scale(1.3) skewX(0)
}

.menu-nav-showreel .menu-nav-icon {
    width: 19px;
    height: 19px
}

.menu-nav-presentation {
    padding-left: 34px
}

.menu-nav-presentation:hover .ms-save:before {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2)
}

.menu-nav-presentation:hover .ms-save:after {
    opacity: 1
}

.menu-nav-presentation .menu-nav-icon {
    width: 17px;
    height: 24px
}

.menu-nav-icon {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    display: block;
    margin: auto 0
}

.menu-nav-name {
    width: auto;
    color: #000;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: .02em;
    white-space: nowrap;
    display: inline-block;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.ms-play {
    display: block
}

.ms-play,
.ms-play:after,
.ms-play:before {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ms-play:after,
.ms-play:before {
    content: "";
    will-change: opacity, transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1)
}

.ms-play:before {
    -webkit-transform: scale(1);
    transform: scale(1);
    background: url("/images/play-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.ms-play:after {
    opacity: 0;
    -webkit-transform: scale(1) skewX(10deg);
    transform: scale(1) skewX(10deg);
    background: url("/images/play-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.ms-save {
    display: block
}

.ms-save,
.ms-save:after,
.ms-save:before {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.ms-save:after,
.ms-save:before {
    content: "";
    will-change: opacity, transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1)
}

.ms-save:before {
    -webkit-transform: scale(1);
    transform: scale(1);
    background: url("/images/save-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.ms-save:after {
    opacity: 0;
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
    background: url("/images/save-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.menu-content {
    width: 100%;
    height: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.menu-content-section {
    height: calc(100% - 260px);
    min-height: 490px;
    padding: 0 60px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.menu-content-list-touch,
.menu-content-section {
    width: 100%;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.menu-content-list-touch {
    display: none;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-perspective: 100px;
    perspective: 100px
}

.menu-content-list-touch .sub-menu-ul {
    padding-bottom: 40px;
    display: none
}

.menu-content-list-touch .sub-menu-ul li {
    font-size: 14px
}

.menu-content-list-touch .sub-menu-ul a {
    padding-left: 30px
}

.menu-content-list-touch .sub-menu-ul:last-child {
    padding-top: 20px;
    padding-bottom: 0
}

.menu-content-list-touch ul {
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none
}

.menu-content-list-touch ul li {
    width: 100%;
    font-size: 24px;
    margin-bottom: 30px;
    letter-spacing: .02em;
    padding-left: 30px;
    cursor: pointer;
    position: relative
}

.menu-content-list-touch ul li:last-child {
    margin-bottom: 0
}

.menu-content-list-touch ul li.sub-menu-head:before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 6px 0;
    border-color: red transparent transparent;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    -webkit-transition: -webkit-transform .5s ease-in-out;
    transition: -webkit-transform .5s ease-in-out;
    transition: transform .5s ease-in-out;
    transition: transform .5s ease-in-out, -webkit-transform .5s ease-in-out;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%
}

.menu-content-list-touch ul li.sub-menu-head_active:before {
    -webkit-transform: translateY(-50%) rotate(180deg);
    transform: translateY(-50%) rotate(180deg)
}

.menu-content-list-touch ul li.sub-menu-head:nth-last-child(2) {
    margin-bottom: 0
}

.menu-content-list-touch ul li a {
    display: block;
    color: #000
}

.menu-content-list-touch ul li a.active_link,
.menu-content-list-touch ul li a.active_link strong {
    color: red!important
}

.menu-content-list-touch ul li a.active {
    pointer-events: none;
    color: red!important
}

.menu-content-list-touch ul li strong {
    display: inline-block
}

.menu-content-list-touch ul li a,
.menu-content-list-touch ul li strong {
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.menu-content-list-touch ul.animate-item-menu {
    opacity: 0;
    will-change: opacity, transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transform: translate3d(0, calc(-100vh - 100%), 0) skewX(-15deg) rotateX(10deg);
    transform: translate3d(0, calc(-100vh - 100%), 0) skewX(-15deg) rotateX(10deg)
}

.menu-content-list-touch ul.animate-item-menu.success {
    opacity: 1;
    -webkit-transform: translateZ(0) skewX(0);
    transform: translateZ(0) skewX(0)
}

.menu-content-list-touch ul.animate-item-menu.finished {
    -webkit-transition: none!important;
    transition: none!important
}

.menu-content-list {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-perspective: 100px;
    perspective: 100px
}

.menu-content-list ul {
    width: auto;
    padding: 0;
    margin: 0 4.5%;
    list-style: none;
    position: relative
}

.menu-content-list ul:first-child {
    margin-left: 0
}

.menu-content-list ul:last-child {
    margin-right: 0
}

.menu-content-list ul li {
    width: 100%;
    color: #6d6d6d;
    font-size: 18px;
    line-height: 20px;
    position: relative;
    margin-bottom: 18px;
    letter-spacing: .02em
}

.menu-content-list ul li:last-child {
    margin-bottom: 0
}

.menu-content-list ul li a {
    color: #6d6d6d
}

.menu-content-list ul li a:hover {
    color: red!important
}

.menu-content-list ul li a:hover strong {
    color: red
}

.menu-content-list ul li a.active_link,
.menu-content-list ul li a.active_link strong {
    color: red!important
}

.menu-content-list ul li a.active {
    color: red!important;
    pointer-events: none
}

.menu-content-list ul li a.active strong {
    color: red
}

.menu-content-list ul li strong {
    color: #000;
    display: inline-block;
    margin-bottom: 15px;
    font: 20px/20px "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.menu-content-list ul li a,
.menu-content-list ul li strong {
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.menu-content-list ul li.active a {
    pointer-events: none;
    color: red!important
}

.menu-content-list ul.animate-item-menu {
    opacity: 0;
    will-change: opacity, transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transform: translate3d(0, calc(-50vh - 100%), 0) skewX(-15deg) rotateX(10deg);
    transform: translate3d(0, calc(-50vh - 100%), 0) skewX(-15deg) rotateX(10deg)
}

.menu-content-list ul.animate-item-menu:nth-child(6) {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.menu-content-list ul.animate-item-menu:nth-child(5) {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.menu-content-list ul.animate-item-menu:nth-child(4) {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.menu-content-list ul.animate-item-menu:nth-child(3) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.menu-content-list ul.animate-item-menu:nth-child(2) {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.menu-content-list ul.animate-item-menu:first-child {
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.menu-content-list ul.animate-item-menu.success {
    opacity: 1;
    -webkit-transform: translateZ(0) skewX(0);
    transform: translateZ(0) skewX(0)
}

.menu-content-list ul.animate-item-menu.success:first-child {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.menu-content-list ul.animate-item-menu.success:nth-child(2) {
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.menu-content-list ul.animate-item-menu.success:nth-child(3) {
    -webkit-transition-delay: .35s;
    transition-delay: .35s
}

.menu-content-list ul.animate-item-menu.success:nth-child(4) {
    -webkit-transition-delay: .4s;
    transition-delay: .4s
}

.menu-content-list ul.animate-item-menu.success:nth-child(5) {
    -webkit-transition-delay: .45s;
    transition-delay: .45s
}

.menu-content-list ul.animate-item-menu.success:nth-child(6) {
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

.menu-content-list ul.animate-item-menu.finished {
    -webkit-transition: none!important;
    transition: none!important
}

.menu-content-languages {
    width: 100%;
    display: none;
    position: relative
}

.menu-content-languages.animate-item-menu {
    opacity: 0;
    will-change: opacity, transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: 1s cubic-bezier(.4, 0, 0, 1) .37s;
    -webkit-transform: translate3d(0, calc(-150vh - 100%), 0) skewX(-15deg) rotateX(10deg);
    transform: translate3d(0, calc(-150vh - 100%), 0) skewX(-15deg) rotateX(10deg)
}

.menu-content-languages.animate-item-menu.success {
    opacity: 1;
    -webkit-transition-delay: .1s;
    transition-delay: .1s;
    -webkit-transform: translateZ(0) skewX(0);
    transform: translateZ(0) skewX(0)
}

.menu-content-languages.animate-item-menu.finished {
    -webkit-transition: none!important;
    transition: none!important
}

.menu-content-languages-inner {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.menu-request {
    width: 100%;
    position: relative
}

.menu-request.animate-item-menu {
    opacity: 0;
    will-change: opacity, transform;
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) .37s, -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    -webkit-transform: translate3d(0, calc(-100vh - 100%), 0) rotateX(10deg);
    transform: translate3d(0, calc(-100vh - 100%), 0) rotateX(10deg)
}

.menu-request.animate-item-menu.success {
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: translateZ(0) rotateX(0);
    transform: translateZ(0) rotateX(0)
}

.menu-request.animate-item-menu.finished {
    -webkit-transition: none!important;
    transition: none!important
}

@media only screen and (max-width:1600px) {
    .menu-container {
        padding-top: 110px
    }
    .menu-head {
        height: 110px;
        padding: 0 50px
    }
    .menu-nav {
        margin-right: 40px
    }
    .menu-languages {
        padding-right: 60px
    }
    .menu-content-section {
        height: calc(100% - 220px);
        padding: 0 50px;
        min-height: 420px
    }
    .menu-content-list ul {
        margin: 0 4%
    }
    .menu-content-list ul li {
        font-size: 16px
    }
    .menu-content-list ul li strong {
        margin-bottom: 10px;
        font-size: 18px
    }
}

@media only screen and (max-width:1366px) {
    .menu-logo {
        width: 60px;
        padding-top: 50px;
        top: 47px
    }
    .menu-logo:before {
        width: 40px;
        height: 30px;
    }
    .menu-container {
        padding-top: 100px
    }
    .menu-head {
        height: 100px;
        padding: 0 40px
    }
    .menu-nav {
        margin-right: 35px
    }
    .menu-nav-name {
        font-size: 15px
    }
    .menu-nav-portfolio {
        padding-left: 34px
    }
    .menu-nav-portfolio .menu-nav-icon {
        width: 19px;
        height: 19px
    }
    .menu-nav-showreel {
        padding-left: 30px
    }
    .menu-nav-showreel .menu-nav-icon {
        width: 17px;
        height: 17px
    }
    .menu-nav-presentation {
        padding-left: 30px
    }
    .menu-nav-presentation .menu-nav-icon {
        width: 15px;
        height: 21px
    }
    .menu-languages {
        padding-right: 40px
    }
    .menu-language-link {
        font-size: 15px;
        margin-left: 16px
    }
    .menu-content-section {
        height: calc(100% - 185px);
        padding: 0 40px;
        min-height: 365px
    }
    .menu-content-list ul li {
        font-size: 14px;
        margin-bottom: 15px
    }
    .menu-content-list ul li strong {
        margin-bottom: 5px;
        font-size: 16px
    }
}

@media only screen and (max-width:1200px) {
    .menu-content {
        height: auto;
        min-height: 100%
    }
    .menu-container {
        overflow-y: auto;
        overflow-x: hidden;
        padding-top: 100px
    }
    .menu-content-section {
        height: auto;
        min-height: calc(100vh - 260px);
        padding: 50px 40px 60px
    }
    .menu-nav {
        margin-right: 25px
    }
    .menu-nav-portfolio {
        width: 19px;
        height: 19px;
        padding-left: 0
    }
    .menu-nav-portfolio .menu-nav-icon {
        width: 100%;
        height: 100%
    }
    .menu-nav-showreel {
        padding-left: 0
    }
    .menu-nav-showreel,
    .menu-nav-showreel .menu-nav-icon {
        width: 17px;
        height: 17px
    }
    .menu-nav-presentation {
        width: 15px;
        height: 21px;
        padding-left: 0
    }
    .menu-nav-presentation .menu-nav-icon {
        width: 15px;
        height: 21px
    }
    .menu-logo {
        height: 33px;
        padding-top: 0;
        top: 0
    }
    .menu-logo span,
    .menu-nav-name {
        display: none
    }
    .menu-languages {
        padding-right: 30px
    }
    .menu-content-list {
        display: none
    }
    .menu-content-list-touch {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media only screen and (max-width:768px) {
    .menu-content-list-touch ul.animate-item-menu {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    .menu-content-list-touch ul.animate-item-menu>* {
        -webkit-transform: translate3d(0, 50px, 0);
        transform: translate3d(0, 50px, 0);
        opacity: 0;
        -webkit-transition: opacity .35s ease, -webkit-transform .5s ease;
        transition: opacity .35s ease, -webkit-transform .5s ease;
        transition: transform .5s ease, opacity .35s ease;
        transition: transform .5s ease, opacity .35s ease, -webkit-transform .5s ease
    }
    .menu-content-list-touch ul.animate-item-menu>:first-child {
        -webkit-transition-delay: 75ms;
        transition-delay: 75ms
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(2) {
        -webkit-transition-delay: .15s;
        transition-delay: .15s
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(3) {
        -webkit-transition-delay: 225ms;
        transition-delay: 225ms
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(4) {
        -webkit-transition-delay: .3s;
        transition-delay: .3s
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(5) {
        -webkit-transition-delay: 375ms;
        transition-delay: 375ms
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(6) {
        -webkit-transition-delay: .45s;
        transition-delay: .45s
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(7) {
        -webkit-transition-delay: 525ms;
        transition-delay: 525ms
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(8) {
        -webkit-transition-delay: .6s;
        transition-delay: .6s
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(9) {
        -webkit-transition-delay: 675ms;
        transition-delay: 675ms
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(10) {
        -webkit-transition-delay: .75s;
        transition-delay: .75s
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(11) {
        -webkit-transition-delay: 825ms;
        transition-delay: 825ms
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(12) {
        -webkit-transition-delay: .9s;
        transition-delay: .9s
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(13) {
        -webkit-transition-delay: 975ms;
        transition-delay: 975ms
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(14) {
        -webkit-transition-delay: 1.05s;
        transition-delay: 1.05s
    }
    .menu-content-list-touch ul.animate-item-menu>:nth-child(15) {
        -webkit-transition-delay: 1125ms;
        transition-delay: 1125ms
    }
    .menu-content-list-touch ul.animate-item-menu.success>* {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    .menu-content-languages.animate-item-menu,
    .menu-request.animate-item-menu {
        -webkit-transform: translate3d(0, 50px, 0);
        transform: translate3d(0, 50px, 0)
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .menu-container {
        padding-top: 64px
    }
    .menu-content-section {
        padding: 25px 25px 35px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        min-height: calc(100vh - 175px)
    }
    .menu-head {
        height: 64px;
        padding: 0 25px
    }
    .menu-nav-presentation .menu-nav-icon {
        width: 12px;
        height: 18px
    }
    .menu-nav-showreel {
        margin-right: 20px
    }
    .menu-nav-showreel .menu-nav-icon {
        width: 12px;
        height: 14px
    }
    .close-accept.close-menu {
        width: 18px;
        height: 18px
    }
    .close-accept.close-menu .close-accept-line:first-child {
        width: 2px
    }
    .close-accept.close-menu .close-accept-line:nth-child(2) {
        height: 2px
    }
    .menu-languages {
        display: none
    }
    .menu-content-languages {
        display: block
    }
    .menu-language-link {
        margin: 0 10px;
        font-size: 17px
    }
    .menu-language-link:first-child {
        margin-left: 10px
    }
    .menu-content-list-touch .sub-menu-ul {
        padding-bottom: 20px
    }
    .menu-content-list-touch .sub-menu-ul a {
        padding-left: 15px
    }
    .menu-content-list-touch ul li {
        font-size: 16px;
        margin-bottom: 20px;
        padding-left: 20px
    }
    .menu-content-list-touch ul li.sub-menu-head:before {
        border-width: 5px 3px 0;
        -webkit-transform: translateY(-75%);
        transform: translateY(-75%)
    }
    .menu-content-list-touch ul li.sub-menu-head_active:before {
        -webkit-transform: translateY(-75%) rotate(180deg);
        transform: translateY(-75%) rotate(180deg)
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .menu-container {
        padding-top: 85px
    }
    .menu-content-section {
        padding: 35px 25px 50px;
        min-height: calc(100vh - 175px)
    }
    .menu-head {
        height: 85px;
        padding: 0 25px
    }
    .menu-content-list-touch ul li {
        font-size: 20px;
        margin-bottom: 20px
    }
    .menu-request.animate-item-menu {
        -webkit-transform: translate3d(0, calc(-150vh - 100%), 0) rotateX(10deg);
        transform: translate3d(0, calc(-150vh - 100%), 0) rotateX(10deg)
    }
}

#form {
    position: fixed;
    z-index: 20;
    overflow: hidden;
    pointer-events: none;
    -webkit-transition: opacity 0s linear 1.5s;
    transition: opacity 0s linear 1.5s
}

#form,
#form:before {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0
}

#form:before {
    content: "";
    position: absolute;
    z-index: 1;
    background: #fff;
    will-change: opacity;
    -webkit-transition: opacity 1.5s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: opacity 1.5s cubic-bezier(.4, 0, 0, 1) .37s
}

#form.opened {
    pointer-events: all
}

#form.opened,
#form.opened:before {
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

#form.opened:before {
    -webkit-transition-duration: .5s;
    transition-duration: .5s
}

#form.opened .form-container {
    opacity: 1;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

.form-figure-inner.mb-0 {
    margin-bottom: 0
}

span.private-google {
    font-size: 10px;
    display: block;
    margin-top: 8px;
    color: #afafaf;
    line-height: 1.4
}

span.private-google a {
    color: #636363;
    text-decoration: underline
}

span.private-google a:hover {
    text-decoration: none
}

.form-container {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 2;
    opacity: 0;
    -webkit-transition-delay: 1s;
    transition-delay: 1s
}

.form-content {
    width: 100%;
    height: 100%;
    overflow: hidden;
    -webkit-box-orient: horizontal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.form-content,
.form-content-section {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal
}

.form-content-section {
    width: 935px;
    -webkit-box-orient: vertical;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch;
    -webkit-perspective: 100px;
    perspective: 100px
}

.form-content-inner {
    width: 100%;
    position: relative
}

.form-content-title {
    margin-bottom: 40px
}

.form-content-title p {
    font: 50px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.2
}

.form-content-title.animate-item-form {
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1) .37s, -webkit-transform 1s cubic-bezier(.4, 0, 0, 1) .37s;
    -webkit-transform: translate3d(0, calc(100vh + 100%), 0);
    transform: translate3d(0, calc(100vh + 100%), 0)
}

.form-content-title.animate-item-form.success {
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.form-content-title.animate-item-form.finished {
    -webkit-transition: none!important;
    transition: none!important
}

.form-figure {
    width: 100%;
    padding: 0 1px;
    position: relative
}

.form-figure-list {
    -webkit-box-orient: vertical;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: stretch;
    -ms-flex-pack: stretch;
    justify-content: stretch
}

.form-figure-inner,
.form-figure-list {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-direction: normal
}

.form-figure-inner {
    -webkit-box-orient: horizontal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-bottom: 30px
}

.form-figure-inner:last-child {
    margin-bottom: 0
}

.form-figure-inner.animate-item-form {
    will-change: transform;
    -webkit-transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    -webkit-transform: translate3d(0, calc(100vh + 100%), 0);
    transform: translate3d(0, calc(100vh + 100%), 0)
}

.form-figure-inner.animate-item-form:nth-child(5) {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.form-figure-inner.animate-item-form:nth-child(4) {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.form-figure-inner.animate-item-form:nth-child(3) {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.form-figure-inner.animate-item-form:nth-child(2) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.form-figure-inner.animate-item-form:first-child {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.form-figure-inner.animate-item-form.success {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.form-figure-inner.animate-item-form.success:first-child {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.form-figure-inner.animate-item-form.success:nth-child(2) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.form-figure-inner.animate-item-form.success:nth-child(3) {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.form-figure-inner.animate-item-form.success:nth-child(4) {
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.form-figure-inner.animate-item-form.success:nth-child(5) {
    -webkit-transition-delay: .35s;
    transition-delay: .35s
}

.form-figure-inner.animate-item-form.finished {
    -webkit-transition: none!important;
    transition: none!important
}

.form-figure-input {
    width: 100%;
    position: relative;
    margin-right: 30px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.form-figure-input:last-child {
    margin-right: 0
}

.form-figure-accept {
    width: calc(50% - 15px);
    position: relative
}

@media only screen and (max-width:1600px) {
    .form-content-title {
        margin-bottom: 30px
    }
    .form-content-title p {
        font-size: 40px
    }
    .form-figure-inner {
        margin-bottom: 20px
    }
    .form-figure-inner.mb-0 {
        margin-bottom: 0
    }
    .form-figure-input {
        margin-right: 20px
    }
    .form-figure-accept {
        width: calc(50% - 10px)
    }
}

@media only screen and (max-width:1366px) {
    .form-container {
        overflow-y: auto;
        overflow-x: hidden
    }
    .form-content {
        height: auto;
        padding: 100px 0 50px;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start
    }
    .form-content-section {
        width: 760px
    }
    .form-content-title {
        margin-bottom: 25px
    }
    .form-content-title p {
        font-size: 35px;
        line-height: 1.15
    }
}

@media only screen and (max-width:1024px) {
    .form-content {
        padding: 100px 40px 50px
    }
    .form-content-section {
        width: 100%
    }
    .form-figure-inner {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .form-figure-input {
        margin-right: 0;
        margin-bottom: 20px
    }
    .form-figure-input:last-child {
        margin-bottom: 0
    }
    .form-figure-accept {
        width: 50%
    }
}

@media only screen and (max-width:425px) {
    .form-content {
        padding: 85px 25px 25px
    }
    .form-content-title p {
        font-size: 26px
    }
    .form-figure-accept {
        width: 100%
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .form-content {
        padding: 85px 25px 25px
    }
    .form-content-title p {
        font-size: 26px
    }
}

#cookie {
    width: 100%;
    height: auto;
    max-height: 100%;
    position: fixed;
    right: 0;
    bottom: 0;
    z-index: 20;
    overflow-y: auto;
    overflow-x: hidden;
    background: #ececec;
    padding: 5px 40px;
    will-change: transform;
    pointer-events: none;
    -webkit-transform: translate3d(0, 100vh, 0);
    transform: translate3d(0, 100vh, 0);
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

#cookie.opened {
    pointer-events: all;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

#cookie .cookie-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

#cookie .cookie-button {
    width: 140px;
    height: 42px
}

.cookie-info {
    width: calc(100% - 170px);
    position: relative;
    margin-right: 30px
}

.cookie-info p {
    font-size: 12px;
    letter-spacing: .02em;
    line-height: 1.7;
    color: #444;
    margin: 5px 0
}

.cookie-accept {
    width: 140px;
    position: relative
}

@media only screen and (max-width:800px) and (orientation:portrait) {
    .cookie-info {
        width: 100%;
        padding-right: 0;
        margin-right: unset
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    #cookie {
        padding: 10px
    }
    .cookie-accept {
        width: 100%
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    #cookie {
        padding: 10px
    }
    .cookie-info {
        padding-right: 25px
    }
    .cookie-submit {
        height: 60px
    }
}

@media only screen and (max-width:670px) and (max-height:320px) and (orientation:landscape) {
    #cookie {
        height: 100%
    }
}

#showreel {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 0s linear 1.5s;
    transition: opacity 0s linear 1.5s
}

#showreel.opened {
    opacity: 1;
    pointer-events: all;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

#showreel.opened .showreel-section {
    -webkit-transform: skewY(0) translateZ(0);
    transform: skewY(0) translateZ(0)
}

#showreel.opened .showreel-cover {
    opacity: 1
}

#showreel.opened .showreel-container {
    opacity: 1;
    pointer-events: all;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

.showreel-cover {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    will-change: opacity;
    background: rgba(0, 0, 0, .5);
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.showreel-container {
    width: 100%;
    height: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    opacity: 0;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    pointer-events: none;
    z-index: 2;
    -webkit-transition-delay: 1s;
    transition-delay: 1s
}

.showreel-section {
    width: calc(100% - 80px);
    height: calc(100% - 80px);
    max-height: calc(56.25vw - 80px);
    overflow: hidden;
    position: relative;
    will-change: transform;
    -webkit-transform: skewY(10deg) translate3d(0, calc(50vh + 100%), 0);
    transform: skewY(10deg) translate3d(0, calc(50vh + 100%), 0);
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.showreel-section.playing .showreel-section-content {
    pointer-events: none
}

.showreel-section.playing .showreel-section-content:before {
    background: transparent
}

.showreel-section.playing .close-accept:before {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.showreel-section.playing .close-accept .close-accept-line:before {
    background: #000
}

.showreel-section.playing .close-accept:hover .close-accept-line:before {
    background: red
}

.showreel-section.playing .showreel-button-desc {
    opacity: 0
}

.showreel-section.playing:hover {
    cursor: pointer
}

.showreel-section.paused .video-button {
    -webkit-transform: scale(1);
    transform: scale(1)
}

.showreel-section-image {
    z-index: 2;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.showreel-section-image,
.showreel-section-image img {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0
}

.showreel-section-image img {
    display: block;
    -o-object-fit: cover;
    object-fit: cover
}

.showreel-section-image.hidden {
    opacity: 0
}

.showreel-section-content {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 3
}

.showreel-section-content:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background: rgba(0, 0, 0, .3);
    will-change: background;
    -webkit-transition: background .5s cubic-bezier(.4, 0, 0, 1);
    transition: background .5s cubic-bezier(.4, 0, 0, 1)
}

.showreel-section-button {
    width: 120px;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 2
}

.showreel-section-button .video-button {
    margin: 20px 0;
    -webkit-transform: scale(0);
    transform: scale(0);
    will-change: transform;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.showreel-button-desc {
    height: 0;
    text-align: center;
    position: relative;
    display: inline-block;
    color: #fff;
    font-size: 20px;
    line-height: 1.6;
    letter-spacing: .02em
}

.showreel-button-desc,
.showreel-section-video {
    width: 100%;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.showreel-section-video {
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    pointer-events: none
}

.showreel-section-video.visible {
    opacity: 1;
    pointer-events: all
}

.showreel-movie {
    width: 101%;
    height: 101%;
    position: absolute;
    top: 0;
    left: 0;
    -o-object-fit: cover;
    object-fit: cover
}

@media only screen and (max-width:1600px) {
    .showreel-section-button {
        width: 100px
    }
    .showreel-section-button .video-button {
        margin: 15px 0
    }
    .showreel-button-desc {
        font-size: 18px
    }
}

@media only screen and (max-width:1366px) {
    .showreel-section-button {
        width: 90px
    }
    .showreel-section-button .video-button {
        margin: 10px 0
    }
    .showreel-button-desc {
        font-size: 16px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .showreel-section {
        width: 100%;
        height: 100%;
        max-height: 56.25vw
    }
    .showreel-section-button {
        width: 70px
    }
    .showreel-section-button .video-button {
        margin: 5px 0
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .showreel-section {
        width: calc(100% - 50px);
        height: calc(100% - 50px);
        max-height: calc(56.25vw - 50px)
    }
    .showreel-section-button {
        width: 70px
    }
    .showreel-section-button .video-button {
        margin: 5px 0
    }
}

#subscribe {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
    -webkit-transition: opacity 0s linear 1.5s;
    transition: opacity 0s linear 1.5s
}

#subscribe.opened {
    opacity: 1;
    pointer-events: all;
    -webkit-transition-delay: 0s;
    transition-delay: 0s
}

#subscribe.opened .subscribe-section {
    -webkit-transform: skewY(0) translateZ(0);
    transform: skewY(0) translateZ(0)
}

#subscribe.opened .subscribe-cover {
    opacity: 1
}

.subscribe-cover {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    will-change: opacity;
    background: rgba(0, 0, 0, .5);
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.subscribe-container {
    width: 100%;
    height: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    z-index: 2
}

.attach-content.error-validate {
    border: 1px solid red;
    color: red
}

.attach-content.error-validate .submit-input-error {
    opacity: 1
}

.subscribe-section {
    width: 1100px;
    height: auto;
    position: relative;
    background: #fff;
    padding: 100px 130px;
    will-change: transform;
    -webkit-transform: skewY(10deg) translate3d(0, calc(50vh + 100%), 0);
    transform: skewY(10deg) translate3d(0, calc(50vh + 100%), 0);
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.subscribe-section .form-message .form-message-info {
    width: 100%!important;
    text-align: left
}

.subscribe-center,
.subscribe-info,
.subscribe-inner {
    width: 100%;
    position: relative
}

.subscribe-title {
    margin-bottom: 15px
}

.subscribe-title p {
    font: 30px "Exo 2", sans-serif;;
    line-height: 1.2
}

.subscribe-desc {
    margin-bottom: 30px
}

.subscribe-desc p {
    font-size: 14px;
    line-height: 1.7
}

.subscribe-figure {
    width: 100%;
    height: 86px;
    padding: 2px;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    border: 1px solid #dadada;
    will-change: border-color;
    -webkit-transition: border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-color .5s cubic-bezier(.4, 0, 0, 1)
}

.subscribe-figure.error-validate {
    border-color: red
}

.subscribe-figure.error-validate .submit-input {
    color: red
}

.subscribe-figure.error-validate .submit-input:-moz-placeholder,
.subscribe-figure.error-validate .submit-input::-moz-placeholder {
    color: red
}

.subscribe-figure.error-validate .submit-input:-ms-input-placeholder {
    color: red
}

.subscribe-figure.error-validate .submit-input::-webkit-input-placeholder {
    color: red
}

.subscribe-figure.error-validate .submit-input-error {
    opacity: 1;
    pointer-events: all
}

.subscribe-input {
    width: calc(100% - 230px);
    position: relative
}

.subscribe-accept {
    width: 230px;
    position: relative
}

@media only screen and (max-width:1600px) {
    .subscribe-section {
        width: 900px;
        padding: 80px 100px
    }
    .subscribe-input {
        width: calc(100% - 200px)
    }
    .subscribe-title {
        margin-bottom: 10px
    }
    .subscribe-title p {
        font-size: 26px
    }
    .subscribe-desc {
        margin-bottom: 25px
    }
    .subscribe-figure {
        height: 81px
    }
    .subscribe-accept {
        width: 200px
    }
}

@media only screen and (max-width:1366px) {
    .subscribe-section {
        width: 700px;
        padding: 60px 80px
    }
    .subscribe-input {
        width: calc(100% - 180px)
    }
    .subscribe-title p {
        font-size: 24px
    }
    .subscribe-figure {
        height: 76px
    }
    .subscribe-accept {
        width: 180px
    }
}

@media only screen and (max-width:1024px) {
    .subscribe-section {
        width: 100%;
        height: 100%;
        padding: 100px 40px 40px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .subscribe-section {
        overflow-y: auto;
        padding: 85px 25px 25px;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    .subscribe-figure {
        height: 62px;
        padding: 0;
        margin-bottom: 84px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        -webkit-box-pack: stretch;
        -ms-flex-pack: stretch;
        justify-content: stretch
    }
    .subscribe-accept,
    .subscribe-input {
        width: 100%
    }
    .subscribe-input {
        margin-bottom: 25px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .subscribe-section {
        overflow-y: auto;
        padding: 85px 25px 25px;
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    .subscribe-figure {
        height: 66px
    }
}

@-webkit-keyframes anim-ldr {
    0% {
        background: #fff
    }
    50% {
        background: #f50d03
    }
}

@keyframes anim-ldr {
    0% {
        background: #fff
    }
    50% {
        background: #f50d03
    }
}

@-webkit-keyframes anim-ldr-i {
    0% {
        background: #f50d03
    }
    50% {
        background: #fff
    }
}

@keyframes anim-ldr-i {
    0% {
        background: #f50d03
    }
    50% {
        background: #fff
    }
}

@-webkit-keyframes anim-ldr-i-b {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
}

@keyframes anim-ldr-i-b {
    0% {
        opacity: 1
    }
    50% {
        opacity: 0
    }
}

@-webkit-keyframes anim-ldr-i-a {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
}

@keyframes anim-ldr-i-a {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
}

#singlePortfPopup {
    position: fixed;
    opacity: 0;
    will-change: transform, opacity;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    transform-origin: 0 0
}

#singlePortfPopup,
#singlePortfPopup i {
    display: block;
    z-index: 5;
    -webkit-transform-origin: 0 0
}

#singlePortfPopup i {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    will-change: transform;
    transform-origin: 0 0;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover
}

.close-accept {
    width: 30px;
    height: 30px;
    padding: 0;
    border: none;
    cursor: pointer;
    background: none;
    pointer-events: none;
    z-index: 5
}

.close-accept.close-form,
.close-accept.close-menu {
    position: relative
}

.close-accept.close-subscribe {
    position: absolute;
    top: 40px;
    right: 40px
}

.close-accept.close-showreel {
    position: absolute;
    top: 30px;
    right: 30px
}

.close-accept.close-showreel:before {
    content: "";
    position: absolute;
    width: 55px;
    height: 55px;
    top: -12px;
    left: -12px;
    background: #fff;
    border-radius: 50%;
    -webkit-transform: scale(0);
    transform: scale(0);
    will-change: transform;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.close-accept.close-showreel .close-accept-line:before {
    background: #fff
}

.close-accept:hover .close-accept-line:before {
    background: red
}

.close-accept.disabled {
    pointer-events: none
}

.close-accept.disabled .close-accept-line:first-child {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-animation: closeButtonLineToDisabled2 .2s ease-out 1 normal forwards;
    animation: closeButtonLineToDisabled2 .2s ease-out 1 normal forwards
}

.close-accept.disabled .close-accept-line:nth-child(2) {
    -webkit-animation: closeButtonLineToDisabled1 .2s ease-out 1 normal forwards;
    animation: closeButtonLineToDisabled1 .2s ease-out 1 normal forwards
}

.close-accept.allowed {
    pointer-events: all
}

.close-accept.allowed .close-accept-line:first-child {
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-animation: closeButtonLineToAllowed2 .3s cubic-bezier(.18, .89, .67, 1.16) .3s 1 normal forwards;
    animation: closeButtonLineToAllowed2 .3s cubic-bezier(.18, .89, .67, 1.16) .3s 1 normal forwards
}

.close-accept.allowed .close-accept-line:nth-child(2) {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    -webkit-animation: closeButtonLineToAllowed1 .3s cubic-bezier(.18, .89, .67, 1.16) .2s 1 normal forwards;
    animation: closeButtonLineToAllowed1 .3s cubic-bezier(.18, .89, .67, 1.16) .2s 1 normal forwards
}

.close-accept-rotate {
    width: 100%;
    height: 100%;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg)
}

.close-accept-line,
.close-accept-rotate {
    position: absolute;
    display: block;
    top: 0;
    left: 0
}

.close-accept-line {
    will-change: transform
}

.close-accept-line:first-child {
    width: 3px;
    height: 100%;
    top: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transform: scaleY(0);
    transform: scaleY(0)
}

.close-accept-line:nth-child(2) {
    width: 100%;
    height: 3px;
    bottom: 0;
    margin: auto 0;
    -webkit-transform: scaleX(0);
    transform: scaleX(0)
}

.close-accept-line:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: #000;
    will-change: background;
    -webkit-transition: background .5s cubic-bezier(.4, 0, 0, 1);
    transition: background .5s cubic-bezier(.4, 0, 0, 1)
}

@-webkit-keyframes closeButtonLineToAllowed1 {
    0% {
        -webkit-transform: scaleX(0) translateX(-10px);
        transform: scaleX(0) translateX(-10px);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
    to {
        -webkit-transform: scaleX(1) translateX(0);
        transform: scaleX(1) translateX(0);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
}

@keyframes closeButtonLineToAllowed1 {
    0% {
        -webkit-transform: scaleX(0) translateX(-10px);
        transform: scaleX(0) translateX(-10px);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
    to {
        -webkit-transform: scaleX(1) translateX(0);
        transform: scaleX(1) translateX(0);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
}

@-webkit-keyframes closeButtonLineToAllowed2 {
    0% {
        -webkit-transform: scaleY(0) translateY(-10px);
        transform: scaleY(0) translateY(-10px);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
    to {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
}

@keyframes closeButtonLineToAllowed2 {
    0% {
        -webkit-transform: scaleY(0) translateY(-10px);
        transform: scaleY(0) translateY(-10px);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
    to {
        -webkit-transform: scaleY(1) translateY(0);
        transform: scaleY(1) translateY(0);
        -webkit-transform-origin: 0 0;
        transform-origin: 0 0
    }
}

@-webkit-keyframes closeButtonLineToDisabled1 {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
    to {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
}

@keyframes closeButtonLineToDisabled1 {
    0% {
        -webkit-transform: scaleX(1);
        transform: scaleX(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
    to {
        -webkit-transform: scaleX(0);
        transform: scaleX(0);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
}

@-webkit-keyframes closeButtonLineToDisabled2 {
    0% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
    to {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
}

@keyframes closeButtonLineToDisabled2 {
    0% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
    to {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: 50% 50%;
        transform-origin: 50% 50%
    }
}

@media only screen and (max-width:1366px) {
    .close-accept {
        width: 26px;
        height: 26px
    }
    .close-accept.close-subscribe {
        top: 30px;
        right: 30px
    }
    .close-accept.close-showreel:before {
        width: 50px;
        height: 50px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .close-accept.close-subscribe {
        top: 30px;
        right: 25px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .close-accept.close-subscribe {
        right: 25px
    }
}

.unit-container[data-page=static] {
    padding-bottom: 145px
}

.static-request {
    padding-top: 100px;
    -webkit-perspective: 100px;
    perspective: 100px
}

@media only screen and (max-width:1600px) {
    .unit-container[data-page=static] {
        padding-bottom: 125px
    }
    .static-request {
        padding-top: 80px
    }
}

@media only screen and (max-width:1366px) {
    .unit-container[data-page=static] {
        padding-bottom: 100px
    }
    .static-request {
        padding-top: 60px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .unit-container[data-page=static] {
        padding-bottom: 60px
    }
    .static-request {
        padding-top: 30px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .unit-container[data-page=static] {
        padding-bottom: 60px
    }
    .static-request {
        padding-top: 40px
    }
}

#header {
    position: fixed;
    width: 100%;
    /*height: 124px;*/
    height: 100px;
    pointer-events: none;
    z-index: 10;
    top: 0;
    left: 0;
    padding: 0 60px;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    will-change: transform
}

#header:not(.in-top),
#header:not(.in-top) .header-menu,
#header:not(.in-top) .header-portfolio {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.header-section {
    position: relative;
    width: 100%;
    height: 100%
}

.header-portfolio {
    position: absolute;
    width: 19px;
    height: 19px;
    display: block;
    pointer-events: all;
    top: 0;
    left: 0;
    bottom: 0;
    margin: auto 0;
    -webkit-transform: scale(1);
    transform: scale(1);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.header-portfolio.disabled {
    -webkit-transform: scale(0);
    transform: scale(0);
    pointer-events: none
}

.header-portfolio.active {
    pointer-events: none
}

html:not(.touch-device) .header-portfolio:hover .hp-square:first-child {
    -webkit-transition-delay: 75ms;
    transition-delay: 75ms;
    -webkit-transform: translate3d(-3px, -3px, 0);
    transform: translate3d(-3px, -3px, 0)
}

html:not(.touch-device) .header-portfolio:hover .hp-square:nth-child(2) {
    -webkit-transition-delay: .05s;
    transition-delay: .05s;
    -webkit-transform: translate3d(3px, -3px, 0);
    transform: translate3d(3px, -3px, 0)
}

html:not(.touch-device) .header-portfolio:hover .hp-square:nth-child(3) {
    -webkit-transition-delay: 25ms;
    transition-delay: 25ms;
    -webkit-transform: translate3d(-3px, 3px, 0);
    transform: translate3d(-3px, 3px, 0)
}

html:not(.touch-device) .header-portfolio:hover .hp-square:nth-child(4) {
    -webkit-transform: translate3d(3px, 3px, 0);
    transform: translate3d(3px, 3px, 0)
}

html:not(.touch-device) .header-portfolio:hover .hp-square-title span,
html:not(.touch-device) .header-portfolio:hover h1 {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.hp-square-icon {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.hp-square {
    position: absolute;
    display: block;
    width: 7px;
    height: 7px;
    background: #000;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: background, border-color, transform;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: background, border-color, -webkit-transform;
    transition-property: background, border-color, -webkit-transform;
    transition-property: background, border-color, transform;
    transition-property: background, border-color, transform, -webkit-transform
}

.hp-square:nth-child(2) {
    -webkit-transition-delay: 25ms;
    transition-delay: 25ms
}

.hp-square:nth-child(3) {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.hp-square:nth-child(4) {
    -webkit-transition-delay: 75ms;
    transition-delay: 75ms
}

.hp-square:first-child,
.hp-square:nth-child(2) {
    top: 0
}

.hp-square:first-child,
.hp-square:nth-child(3) {
    left: 0
}

.hp-square:nth-child(2),
.hp-square:nth-child(4) {
    right: 0
}

.hp-square:nth-child(3),
.hp-square:nth-child(4) {
    bottom: 0
}

.hm-line-title,
.hp-square-title {
    position: absolute;
    width: auto;
    height: 100%;
    top: 0;
    overflow: hidden;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.hm-line-title h1,
.hm-line-title span,
.hp-square-title h1,
.hp-square-title span {
    opacity: 1;
    will-change: opacity, transform;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    color: #000;
    font-size: 16px;
    white-space: nowrap;
    letter-spacing: .02em;
    font-family: HelveticaRegular, sans-serif
}

.hp-square-title {
    left: 35px;
    padding-left: 10px
}

.hp-square-title h1,
.hp-square-title span {
    -webkit-transform-origin: left center;
    transform-origin: left center
}

.hm-line-title {
    right: 40px;
    padding-right: 15px
}

.hm-line-title span {
    -webkit-transform-origin: right center;
    transform-origin: right center
}

.header-menu {
    position: absolute;
    width: 32px;
    height: 19px;
    padding: 0;
    cursor: pointer;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto 0;
    border: none;
    background: none;
    pointer-events: all;
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.header-menu.disabled {
    -webkit-transform: scale(0);
    transform: scale(0);
    pointer-events: none
}

html:not(.touch-device) .header-menu:hover .hm-line:first-child {
    -webkit-transform: translate3d(7px, 0, 0);
    transform: translate3d(7px, 0, 0)
}

html:not(.touch-device) .header-menu:hover .hm-line:nth-child(2) {
    -webkit-transform: scaleX(1.2);
    transform: scaleX(1.2)
}

html:not(.touch-device) .header-menu:hover .hm-line:nth-child(3) {
    -webkit-transform: scaleX(1.2) translate3d(7px, 0, 0);
    transform: scaleX(1.2) translate3d(7px, 0, 0)
}

html:not(.touch-device) .header-menu:hover .hm-line-title span {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.hm-line-icon {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0
}

.hm-line {
    position: absolute;
    display: block;
    height: 3px;
    background: #000;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    will-change: background, border-color, transform;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: background, border-color, -webkit-transform;
    transition-property: background, border-color, -webkit-transform;
    transition-property: background, border-color, transform;
    transition-property: background, border-color, transform, -webkit-transform
}

.hm-line:first-child {
    width: 17px;
    top: 0;
    left: 10px;
    -webkit-transition-delay: 25ms;
    transition-delay: 25ms
}

.hm-line:nth-child(2) {
    width: 30px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    -webkit-transform-origin: right center;
    transform-origin: right center
}

.hm-line:nth-child(3) {
    width: 17px;
    bottom: 0;
    left: 4px
}

.header-logo {
    position: absolute;
    display: block;
    width: 67px;
    height: 67px;
    z-index: 3;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    pointer-events: all;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    -webkit-transition-property: visibility, opacity;
    transition-property: visibility, opacity
}

.header-logo.active {
    pointer-events: none
}

.header-logo.hidden {
    opacity: 0;
    visibility: hidden
}

.header-logo .half-logo {
    position: absolute;
    display: block;
    width: 50%;
    height: 150px;
    top: 0;
    left: 0;
    z-index: 3;
    -webkit-transition: opacity 1s ease;
    transition: opacity 1s ease;
    opacity: 0;
    pointer-events: none;
    overflow: hidden
}

.header-logo .half-logo:after,
.header-logo .half-logo:before {
    content: "";
    position: absolute;
    display: block;
    z-index: 2;
    width: 16px;
    height: 40px;
    opacity: 0;
    top: 13px;
    right: 0;
    -webkit-transform: translate(50%);
    transform: translate(50%);
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: contain
}

.header-logo .half-logo:before {
    background-image: url("/images/logo-black.svg");
    display: none
}

.header-logo .half-logo:after {
    background-image: url("/images/logo-white.svg");
    display: none
}

.header-logo .half-logo span {
    position: absolute;
    display: block;
    width: 167px;
    top: 70px;
    right: 0;
    text-align: center;
    overflow: hidden;
    z-index: 1;
    pointer-events: none;
    opacity: 0;
    font: 18px/1 HelveticaBold;
    color: transparent;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: .05em;
    -webkit-transform: scaleY(1.5) translate3d(50%, 15px, 0);
    transform: scaleY(1.5) translate3d(50%, 15px, 0);
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1), transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1), transform 1s cubic-bezier(.4, 0, 0, 1), -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.header-logo .half-logo[data-active=b]:before {
    opacity: 1
}

.header-logo .half-logo[data-active=b] span {
    color: #000
}

.header-logo .half-logo[data-active=w]:after {
    opacity: 1
}

.header-logo .half-logo[data-active=w] span {
    color: #fff;
    display: none
}

.header-logo:hover .half-logo span {
    opacity: 1!important
}

.header-logo[data-color=b] .header-logo-icon {
    opacity: 0;
    -webkit-transition: opacity .35s;
    transition: opacity .35s
}

.header-logo:hover .logo-company-name {
    opacity: 1
}

.header-logo-title {
    overflow: hidden;
    width: 0;
    height: 0;
    font-size: 0!important
}

.header-logo-icon {
    z-index: 2;
    width: 40px;
    height: 40px;
    bottom: 0;
    right: 0;
    margin: auto
}

.header-logo-icon,
.header-logo-icon img {
    position: absolute;
    display: block;
    left: 0;
    top: 0
}

.header-logo-icon img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover
}

.header-logo-icon i {
    position: fixed;
    display: block;
    height: 2px;
    width: 200%;
    top: 0;
    left: 0;
    pointer-events: none;
    overflow: hidden;
    -webkit-animation: trnslt .65s ease-in-out infinite;
    animation: trnslt .65s ease-in-out infinite
}

.header-logo-icon i:before {
    content: "";
    position: absolute;
    display: block;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    -webkit-transition: -webkit-transform .3s ease;
    transition: -webkit-transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease, -webkit-transform .3s ease;
    -webkit-transform: translate3d(0, -3px, 0);
    transform: translate3d(0, -3px, 0);
    will-change: transform;
    background: -webkit-gradient(linear, left top, right top, from(#fff), color-stop(25%, red), color-stop(50%, #fff), color-stop(75%, red), to(#fff));
    background: linear-gradient(90deg, #fff, red 25%, #fff 50%, red 75%, #fff)
}

.header-logo-icon:hover~.logo-company {
    opacity: 1;
    pointer-events: auto
}

.header-logo-icon:hover~.logo-company .logo-company-name {
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

body.loading .header-logo-icon i:before {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

@-webkit-keyframes trnslt {
    0% {
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes trnslt {
    0% {
        -webkit-transform: translate3d(-50%, 0, 0);
        transform: translate3d(-50%, 0, 0)
    }
    to {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

body:not(.loading) #header.in-top .header-logo .half-logo[data-active=b],
body:not(.loading) #header.in-top .header-logo .half-logo[data-active=w] {
    opacity: 1
}

@media only screen and (max-width:1024px) {
    #header {
        -webkit-transition: background 1s cubic-bezier(.4, 0, 0, 1);
        transition: background 1s cubic-bezier(.4, 0, 0, 1)
    }
    #header[data-color=b] {
        background: #fff
    }
}

#header.in-top .logo-company {
    opacity: 1
}

#header.to-up .logo-company {
    pointer-events: auto
}

#header.to-up .logo-company .logo-company-name {
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

#header.to-up .header-logo .half-logo span {
    opacity: 0;
    -webkit-transform: scaleY(1) translate3d(50%, 0, 0);
    transform: scaleY(1) translate3d(50%, 0, 0)
}

.logo-company {
    top: calc(100% + 12px);
    left: -50px;
    right: -50px;
    margin: auto;
    background: #fff;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.logo-company,
.logo-company-name {
    position: absolute;
    opacity: 0;
    pointer-events: none
}

.logo-company-name {
    display: block;
    width: 100%;
    overflow: hidden;
    z-index: 1;
    font: 18px/1 HelveticaBold;
    color: #000;
    white-space: nowrap;
    text-transform: uppercase;
    letter-spacing: .05em;
    text-align: center;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    will-change: transform;
    -webkit-transform: scaleY(1.5) translate3d(0, 15px, 0);
    transform: scaleY(1.5) translate3d(0, 15px, 0);
    -webkit-transition: opacity .35s, -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .35s, -webkit-transform 1s cubic-bezier(.4, 0, 0, 1);
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), opacity .35s;
    transition: transform 1s cubic-bezier(.4, 0, 0, 1), opacity .35s, -webkit-transform 1s cubic-bezier(.4, 0, 0, 1)
}

.header-portfolio[data-color=b] .hp-square {
    background: #000
}

.header-portfolio[data-color=w] .hp-square {
    background: #fff
}

.header-portfolio[data-color=w] .hp-square-title span,
.header-portfolio[data-color=w] h1 {
    color: #fff;
    fill: #fff
}

.header-portfolio[data-color=r] .hp-square {
    background: red
}

.header-portfolio[data-color=r] .hp-square-title span,
.header-portfolio[data-color=r] h1 {
    color: #fff
}

.header-menu[data-color=b] .hm-line {
    background: #000
}

.header-menu[data-color=w] .hm-line {
    background: #fff
}

.header-menu[data-color=w] .hm-line-title span {
    color: #fff
}

.header-menu[data-color=r] .hm-line {
    background: red
}

.header-menu[data-color=r] .hm-line-title span {
    color: #fff
}

.header-logo[data-color] .header-logo-icon:after,
.header-logo[data-color] .header-logo-icon:before,
.header-logo[data-color] .header-logo-icon img {
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.header-logo[data-color] .header-logo-icon:after,
.header-logo[data-color] .header-logo-icon:before {
    content: "";
    position: absolute;
    display: block;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0
}

.header-logo[data-color] .header-logo-icon:before {
    background-image: url("/images/logo-black.svg");
    display: none
}

.header-logo[data-color] .header-logo-icon:after {
    background-image: url("/images/logo-white.svg");
    display: none
}

.header-logo[data-color=b] .header-logo-icon img {
    opacity: 0
}

.header-logo[data-color=b] .header-logo-icon:before {
    opacity: 1
}

.header-logo[data-color=w] .header-logo-icon img {
    opacity: 0
}

.header-logo[data-color=w] .header-logo-icon:after {
    opacity: 1
}

.header-logo[data-color=w] .logo-company-name {
    color: #fff;
    fill: #fff
}

.header-logo[data-color=r] .header-logo-icon img {
    opacity: 1
}

@media only screen and (max-width:768px) {
    .hm-line-title h1,
    .hm-line-title span,
    .hp-square-title h1,
    .hp-square-title span {
        opacity: 0
    }
    .hp-square-title h1,
    .hp-square-title span {
        -webkit-transform: translate3d(-150%, 0, 0);
        transform: translate3d(-150%, 0, 0)
    }
    .hm-line-title {
        right: 40px;
        padding-right: 15px
    }
    .hm-line-title span {
        -webkit-transform: translate3d(150%, 0, 0);
        transform: translate3d(150%, 0, 0)
    }
}

@media only screen and (max-width:1600px) {
    #header {
        height: 110px;
        padding: 0 50px
    }
    #header:not(.in-top),
    #header:not(.in-top) .header-menu,
    #header:not(.in-top) .header-portfolio {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    .hm-line-title span,
    .hp-square-title span,
    h1 {
        font-size: 15px
    }
}

@media only screen and (max-width:1366px) {
    #header {
        height: 80px;
        padding: 0 40px
    }
    #header:not(.in-top),
    #header:not(.in-top) .header-menu,
    #header:not(.in-top) .header-portfolio {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    .header-portfolio {
        width: 19px;
        height: 19px
    }
    .header-logo {
        width: 60px;
        height: 60px
    }
    .header-logo-icon {
        width: 35px;
        height: 35px
    }
    .header-logo .half-logo {
        left: -10px;
        width: calc(50% + 10px)
    }
    .header-logo .half-logo:after,
    .header-logo .half-logo:before {
        width: 13px;
        height: 33px;
        top: 14px
    }
    .header-logo .half-logo span {
        top: 63px
    }
    .hm-line-title span,
    .hp-square-title span,
    h1 {
        font-size: 14px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    #header {
        height: 64px;
        padding: 0 22px
    }
    #header:not(.in-top),
    #header:not(.in-top) .header-menu,
    #header:not(.in-top) .header-portfolio {
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    #header {
        height: 85px;
        padding: 0 25px
    }
    .header-logo {
        width: 55px;
        height: 55px
    }
}

span.logo-company svg {
    width: 70px
}

#footer {
    overflow: hidden
}

#footer,
.footer-info,
.footer-section {
    width: 100%;
    position: relative
}

.footer-info {
    padding: 145px 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.footer-info:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    top: 0;
    left: 0;
    background: #eaeaea
}

.footer-info.animate-element:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.footer-info.animate-element[data-start=true]:before {
    -webkit-transition: -webkit-transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: -webkit-transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s, -webkit-transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s
}

.footer-info.animate-element[data-start=true].visible:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.footer-info.animate-element[data-start=true].finished:before {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.footer-social {
    width: 100%;
    padding: 70px 0;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.footer-social:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 1px;
    top: 0;
    left: 0;
    background: #eaeaea
}

.footer-social.animate-element:before {
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    will-change: transform;
    -webkit-transform-origin: center center;
    transform-origin: center center
}

.footer-social.animate-element[data-start=true]:before {
    -webkit-transition: -webkit-transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: -webkit-transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s;
    transition: transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s, -webkit-transform 1.5s cubic-bezier(.4, 0, 0, 1) .5s
}

.footer-social.animate-element[data-start=true].visible:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

.footer-social.animate-element[data-start=true].finished:before {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.footer-social-left {
    width: 60%;
    position: relative;
    padding-right: 30px
}

.footer-social-right {
    width: 40%;
    position: relative;
    text-align: right;
    padding-left: 30px
}

.footer-social-right p {
    color: #908f8f;
    font-size: 14px;
    line-height: 20px;
    letter-spacing: .02em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.footer-social-right.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.footer-social-right.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.footer-social-right.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.footer-social-right.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.footer-talk {
    width: 400px;
    position: relative;
    -webkit-perspective: 100px;
    perspective: 100px
}

.footer-talk-name {
    width: 100%;
    position: relative;
    margin-bottom: 20px
}

.footer-talk-name p {
    color: #908f8f;
    font-size: 14px;
    line-height: 1.7;
    letter-spacing: .02em
}

.footer-talk-name.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.footer-talk-name.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.footer-talk-name.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.footer-talk-name.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.footer-talk-link {
    width: 100%;
    position: relative;
    margin-bottom: 50px
}

.footer-talk-link.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.footer-talk-link.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.footer-talk-link.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.footer-talk-link.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.footer-talk-title {
    display: block;
    line-height: 1.1
}

.footer-talk-title,
.submit-talk {
    width: 100%;
    font: 60px "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.submit-talk {
    padding: 0;
    color: red;
    border: none;
    cursor: pointer;
    background: none;
    text-align: left;
    line-height: 1.3
}

.submit-talk span {
    display: inline;
    -webkit-transition: border-color .25s ease;
    transition: border-color .25s ease;
    border-bottom: 4px solid red
}

.submit-talk:hover span {
    border-bottom: 4px solid transparent
}

.footer-talk-share {
    width: 100%;
    position: relative
}

.footer-talk-share.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.footer-talk-share.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.footer-talk-share.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.footer-talk-share.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.footer-talk-share .fb-like {
    width: 100%;
    display: inline-block!important
}

.footer-talk-share .fb-like>span {
    width: auto!important
}

.footer-talk-share .fb-like>span iframe {
    width: auto!important;
    position: relative
}

.footer-menu {
    width: calc(100% - 400px);
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-perspective: 100px;
    perspective: 100px
}

.footer-menu ul {
    width: auto;
    padding: 0;
    margin: 0 0 0 6%;
    list-style: none;
    position: relative
}

.footer-menu ul:first-child {
    margin-left: 0
}

.footer-menu ul li {
    width: 100%;
    color: #6d6d6d;
    font-size: 14px;
    position: relative;
    margin-bottom: 20px;
    letter-spacing: .02em
}

.footer-menu ul li:last-child {
    margin-bottom: 0
}

.footer-menu ul li a {
    color: #6d6d6d
}

.footer-menu ul li a:hover {
    color: red!important
}

.footer-menu ul li a:hover strong {
    color: red
}

.footer-menu ul li a.active_link,
.footer-menu ul li a.active_link strong {
    color: red!important
}

.footer-menu ul li a.active {
    color: red!important;
    pointer-events: none
}

.footer-menu ul li a.active strong {
    color: red
}

.footer-menu ul li strong {
    color: #000;
    display: inline-block;
    margin-bottom: 10px;
    font: 16px "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.footer-menu ul li a,
.footer-menu ul li strong {
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.footer-menu ul li.active a {
    pointer-events: none;
    color: red!important
}

.footer-menu ul.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) translate3d(0, 20vh, 0)
}

.footer-menu ul.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.footer-menu ul.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .06666667s;
    transition-delay: .06666667s
}

.footer-menu ul.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .13333333s;
    transition-delay: .13333333s
}

.footer-menu ul.animate-element[data-start=true]:nth-child(3) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.footer-menu ul.animate-element[data-start=true]:nth-child(4) {
    -webkit-transition-delay: .26666667s;
    transition-delay: .26666667s
}

.footer-menu ul.animate-element[data-start=true]:nth-child(5) {
    -webkit-transition-delay: .33333333s;
    transition-delay: .33333333s
}

.footer-menu ul.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.footer-menu ul.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

@media only screen and (max-width:1600px) {
    .footer-info {
        padding: 125px 0
    }
    .footer-talk {
        width: 300px
    }
    .footer-menu {
        width: calc(100% - 300px)
    }
    .footer-menu ul {
        margin: 0 0 0 5%
    }
    .footer-menu ul li {
        font-size: 13px
    }
    .footer-menu ul li strong {
        font-size: 15px
    }
    .footer-talk-name {
        margin-bottom: 15px
    }
    .footer-talk-link {
        margin-bottom: 40px
    }
    .footer-talk-title,
    .submit-talk {
        font-size: 50px
    }
    .footer-social {
        padding: 60px 0
    }
    .footer-social-left {
        padding-right: 25px
    }
    .footer-social-right {
        padding-left: 25px
    }
}

@media only screen and (max-width:1366px) {
    .footer-info {
        padding: 100px 0
    }
    .footer-talk-link {
        margin-bottom: 35px
    }
    .footer-talk-title,
    .submit-talk {
        font-size: 45px
    }
    .footer-social {
        padding: 50px 0
    }
    .footer-social-left {
        padding-right: 20px
    }
    .footer-social-right {
        padding-left: 20px
    }
}

@media only screen and (max-width:1200px) {
    .footer-talk-share .fb-like>span iframe {
        -webkit-transform: translateX(21px);
        transform: translateX(21px)
    }
    .footer-info {
        padding: 70px 0;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .footer-talk {
        width: 100%;
        margin-bottom: 0
    }
    .footer-talk-name,
    .footer-talk-share,
    .footer-talk-title,
    .submit-talk {
        text-align: center
    }
    .footer-menu {
        display: none
    }
    .footer-social {
        -webkit-box-align: stretch;
        -ms-flex-align: stretch;
        align-items: stretch;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .footer-social-left {
        width: 100%;
        padding-right: 0;
        margin-bottom: 15px
    }
    .footer-social-right {
        width: 100%;
        padding-left: 0;
        text-align: center
    }
}

@media only screen and (max-width:1024px) {
    .footer-social-left {
        width: 100%;
        padding-right: 0;
        margin-bottom: 15px
    }
    .footer-social-right {
        width: 100%;
        padding-left: 0;
        text-align: center
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .footer-info {
        padding: 40px 0
    }
    .footer-talk-title,
    .submit-talk {
        font-size: 30px
    }
    .footer-social {
        padding: 40px 0 30px
    }
    .footer-social-left {
        margin-bottom: 15px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .footer-info {
        padding: 40px 0
    }
    .footer-talk-title,
    .submit-talk {
        font-size: 30px
    }
    .footer-social {
        padding: 40px 0 30px
    }
    .footer-social-left {
        margin-bottom: 15px
    }
}

@media only screen and (max-width:340px) {
    .footer-talk-share .fb-like>span iframe {
        -webkit-transform: translateX(17px);
        transform: translateX(17px)
    }
}

@media only screen and (max-width:330px) {
    .footer-talk-share .fb-like>span iframe {
        -webkit-transform: translateX(10px);
        transform: translateX(10px)
    }
}

.icon-button {
    width: 100%;
    height: 80px;
    cursor: pointer;
    position: relative;
    padding: 0 80px 0 0;
    text-overflow: ellipsis;
    border: 1px solid #dadada;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.icon-button:hover .icon-button-name {
    color: red
}

.icon-button:hover .icon-button-picture:before {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.icon-button:hover .icon-button-picture .icon-label-picture:before {
    opacity: 0;
    -webkit-transform: rotate(0) translate3d(0, 80px, 0);
    transform: rotate(0) translate3d(0, 80px, 0)
}

.icon-button:hover .icon-button-picture .icon-label-picture:after {
    opacity: 1;
    -webkit-transform: rotate(0) translateZ(0);
    transform: rotate(0) translateZ(0)
}

.icon-button-name {
    display: block;
    width: auto;
    height: 100%;
    padding: 0 20px;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1);
    font: 16px/80px "Exo 2", sans-serif;;
    white-space: nowrap;
    letter-spacing: .02em;
    color: #000
}

.icon-button-picture {
    width: 80px;
    height: 80px;
    overflow: hidden;
    position: absolute;
    top: -1px;
    right: 0;
    border-left: 1px solid #dadada
}

.icon-button-picture:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background: red;
    will-change: transform;
    -webkit-transform: translate3d(0, calc(100% - 2px), 0);
    transform: translate3d(0, calc(100% - 2px), 0);
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.dft-button,
.submit-button {
    width: 100%;
    height: 80px;
    border: none;
    overflow: hidden;
    padding: 0 20px;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    text-overflow: ellipsis
}

.dft-button:before,
.submit-button:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 400%;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    margin: auto;
    border-radius: 50%;
    -webkit-transform: scale(0) skewY(-15deg);
    transform: scale(0) skewY(-15deg);
    will-change: transform, border-radius;
    -webkit-transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, -webkit-transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out;
    transition: border-radius .2s ease-out, transform .3s ease-out, -webkit-transform .3s ease-out
}

.dft-button.submit-button-red,
.submit-button.submit-button-red {
    background: red
}

.dft-button.submit-button-red:before,
.submit-button.submit-button-red:before {
    background: #000
}

.dft-button.submit-button-red span,
.submit-button.submit-button-red span {
    color: #fff
}

.dft-button.submit-button-black,
.submit-button.submit-button-black {
    background: #000
}

.dft-button.submit-button-black:before,
.submit-button.submit-button-black:before {
    background: red
}

.dft-button.submit-button-black span,
.submit-button.submit-button-black span {
    color: #fff
}

.dft-button.submit-button-white,
.submit-button.submit-button-white {
    background: #fff
}

.dft-button.submit-button-white:before,
.submit-button.submit-button-white:before {
    background: #dadada
}

.dft-button.submit-button-white span,
.submit-button.submit-button-white span {
    color: #000
}

.dft-button span,
.submit-button span {
    z-index: 2;
    font-size: 16px;
    position: relative;
    white-space: nowrap;
    display: inline-block;
    letter-spacing: .02em
}

.dft-button:hover:before,
.submit-button:hover:before {
    border-radius: 0;
    -webkit-transform: scale(1) skewY(0);
    transform: scale(1) skewY(0);
    -webkit-transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s;
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), border-radius .2s ease-out .4s, -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.submit-button_loading {
    cursor: default;
    pointer-events: none
}

.submit-button_loading.submit-button-black {
    background-color: red
}

.submit-button_loading:after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 2;
    height: 28px;
    width: 28px;
    border: 2px solid hsla(0, 0%, 100%, .5);
    border-top: 2px solid #fff;
    border-radius: 50%;
    -webkit-animation: rotate-loader 1s infinite ease-in-out;
    animation: rotate-loader 1s infinite ease-in-out
}

.submit-button_loading span {
    display: none
}

@-webkit-keyframes rotate-loader {
    0% {
        -webkit-transform: translate(-50%, -50%) rotate(0deg);
        transform: translate(-50%, -50%) rotate(0deg)
    }
    to {
        -webkit-transform: translate(-50%, -50%) rotate(1turn);
        transform: translate(-50%, -50%) rotate(1turn)
    }
}

@keyframes rotate-loader {
    0% {
        -webkit-transform: translate(-50%, -50%) rotate(0deg);
        transform: translate(-50%, -50%) rotate(0deg)
    }
    to {
        -webkit-transform: translate(-50%, -50%) rotate(1turn);
        transform: translate(-50%, -50%) rotate(1turn)
    }
}

.submit-input {
    width: 100%;
    font-size: 16px;
    letter-spacing: .02em;
    border: none;
    z-index: 1;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.submit-input.submit-input-border {
    border: 1px solid #dadada;
    will-change: border-color;
    -webkit-transition: border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-color .5s cubic-bezier(.4, 0, 0, 1)
}

.submit-input.submit-input-border.error-validate {
    border-color: red
}

.submit-input.submit-input-border.error-validate:-moz-placeholder,
.submit-input.submit-input-border.error-validate::-moz-placeholder {
    color: red
}

.submit-input.submit-input-border.error-validate:-ms-input-placeholder {
    color: red
}

.submit-input.submit-input-border.error-validate::-webkit-input-placeholder {
    color: red
}

.submit-input.submit-input-border.error-validate~.submit-input-error {
    opacity: 1;
    pointer-events: all
}

input.submit-input {
    height: 80px;
    line-height: 20px;
    padding: 0 80px 0 25px;
    font-family: FontAwesome, sans-serif
}

textarea.submit-input {
    height: 170px;
    resize: none;
    padding: 25px 80px 25px 25px;
    line-height: 1
}

input:-moz-placeholder,
input::-moz-placeholder {
    opacity: 1;
    color: #000;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

input::-moz-placeholder {
    line-height: 1.3
}

input:-ms-input-placeholder {
    opacity: 1;
    line-height: 1.3;
    color: #000;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

input::-webkit-input-placeholder {
    opacity: 1;
    line-height: 1.3;
    color: #000;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

textarea:-moz-placeholder,
textarea::-moz-placeholder {
    opacity: 1;
    line-height: 1.3;
    color: #000;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

textarea:-ms-input-placeholder {
    opacity: 1;
    line-height: 1.3;
    color: #000;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

textarea::-webkit-input-placeholder {
    opacity: 1;
    line-height: 1.3;
    color: #000;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.submit-input-error {
    width: 80px;
    height: 80px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 0);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 0)
}

.submit-input-error:before {
    content: "!";
    position: absolute;
    width: 40px;
    height: 40px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 1;
    color: #fff;
    background: red;
    text-align: center;
    border-radius: 50%;
    white-space: nowrap;
    font-size: 17px;
    line-height: 40px
}

.shape-section {
    position: relative;
    width: 100%;
    overflow: hidden;
    z-index: 3
}

.shape-section[data-color=red] .shape-section-material {
    left: 0;
    background: red
}

.shape-section[data-color=black] {
    direction: rtl
}

.shape-section[data-color=black] .shape-section-material {
    right: 0;
    background: #000
}

.shape-section.animate-element {
    pointer-events: none
}

.shape-section.animate-element .shape-section-material {
    width: 100%;
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

.shape-section.animate-element[data-start=true].visible .shape-section-material {
    width: 50%
}

.shape-section.animate-element[data-start=true].finished {
    pointer-events: all
}

.shape-section.animate-element[data-start=true].finished.shape-section-material {
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.shape-section-button {
    position: relative;
    width: 100%;
    height: 260px;
    padding: 0;
    cursor: pointer;
    border: none;
    background: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.shape-section-button:hover .shape-section-material {
    width: 100%!important
}

.shape-section-letter {
    top: 50%;
    right: 0;
    left: 0;
    -webkit-transform: translate3d(0, -50%, 0);
    transform: translate3d(0, -50%, 0);
    width: 100vw;
    font: 60px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    text-align: center;
    white-space: nowrap;
    text-overflow: ellipsis
}

.shape-section-letter,
.shape-section-material {
    position: absolute;
    display: block;
    overflow: hidden
}

.shape-section-material {
    width: 50%;
    height: 100%;
    top: 0;
    will-change: width;
    -webkit-transition: width 1s cubic-bezier(.4, 0, 0, 1);
    transition: width 1s cubic-bezier(.4, 0, 0, 1)
}

.shape-section-material-inner {
    position: relative;
    display: block;
    width: 100%;
    height: 100%
}

.shape-section-letter-up {
    color: #000
}

.shape-section-letter-down {
    color: #fff
}

.attach-section {
    position: relative;
    width: 100%;
    height: 80px;
    border: 1px solid #dadada;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.attach-content {
    position: relative;
    overflow: hidden;
    width: calc(100% - 80px);
    height: 100%;
    border-right: 1px solid #dadada
}

.attach-message {
    position: absolute;
    width: 100%;
    height: 100%;
    overflow: hidden;
    top: 0;
    left: 0;
    opacity: 0;
    pointer-events: none;
    will-change: opacity;
    -webkit-transition: opacity .35s ease-out;
    transition: opacity .35s ease-out
}

.attach-message.active {
    opacity: 1;
    pointer-events: all
}

.attach-error,
.attach-placeholder {
    padding: 0 25px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.attach-error p,
.attach-placeholder p {
    overflow: hidden;
    font-size: 16px;
    line-height: 20px;
    white-space: nowrap;
    letter-spacing: .02em;
    text-overflow: ellipsis
}

.attach-error p,
.attach-placeholder,
.attach-placeholder p {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.attach-placeholder {
    -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: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.attach-placeholder p {
    margin-top: 2px
}

.attach-error p {
    color: red
}

.attach-uploaded {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.attach-action-icon {
    position: absolute;
    top: 0;
    left: 1px;
    width: 80px;
    height: 80px;
    z-index: 3;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    -webkit-transition-property: visibility, opacity;
    transition-property: visibility, opacity
}

.attach-action-icon:before {
    content: "";
    position: absolute;
    width: 42px;
    height: 47px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%
}

.attach-action-icon.doc:before {
    background-image: url("/images/attaches/doc.svg")
}

.attach-action-icon.docx:before {
    background-image: url("/images/attaches/docx.svg")
}

.attach-action-icon.jpeg:before {
    background-image: url("/images/attaches/jpeg.svg")
}

.attach-action-icon.jpg:before {
    background-image: url("/images/attaches/jpg.svg")
}

.attach-action-icon.numbers:before {
    background-image: url("/images/attaches/numbers.svg")
}

.attach-action-icon.page:before {
    background-image: url("/images/attaches/page.svg")
}

.attach-action-icon.pdf:before {
    background-image: url("/images/attaches/pdf.svg")
}

.attach-action-icon.png:before {
    background-image: url("/images/attaches/png.svg")
}

.attach-action-icon.rar:before {
    background-image: url("/images/attaches/rar.svg")
}

.attach-action-icon.unknown:before {
    background-image: url("/images/attaches/unknown.svg")
}

.attach-action-icon.xls:before {
    background-image: url("/images/attaches/xls.svg")
}

.attach-action-icon.xlsx:before {
    background-image: url("/images/attaches/xlsx.svg")
}

.attach-action-icon.zip:before {
    background-image: url("/images/attaches/zip.svg")
}

.attach-action-info {
    width: 100%;
    height: 100%;
    position: relative;
    padding: 0 25px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-flow: column nowrap;
    flex-flow: column nowrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.attach-action-file,
.attach-action-info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.attach-action-file {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 100%;
    margin-top: 5px
}

.attach-action-name,
.attach-action-size {
    overflow: hidden;
    position: relative;
    font-size: 16px;
    line-height: 1.5;
    white-space: nowrap;
    letter-spacing: .02em;
    text-overflow: ellipsis
}

.attach-action-name {
    display: inline-block;
    max-width: calc(100% - 30px)
}

.attach-action-remove {
    cursor: pointer;
    width: 20px;
    height: 20px;
    border: 1px solid #d2d2d2;
    border-radius: 50px;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-left: 10px;
    -webkit-transition: border-color .25s ease-in-out;
    transition: border-color .25s ease-in-out
}

@media only screen and (min-width:1024px) {
    .attach-action-remove:hover {
        border-color: red
    }
}

.attach-action-size {
    color: #908f8f;
    width: 100%;
    display: block
}

.attach-input {
    width: 80px;
    height: 80px;
    position: absolute;
    top: -1px;
    right: 0
}

.attach-file {
    width: calc(100% + 1px);
    height: 100%;
    position: absolute;
    top: 0;
    right: 0
}

.attach-file.error-validate .icon-label,
.attach-file.upload-validate .icon-label {
    opacity: 0;
    pointer-events: none
}

.attach-file.error-validate .submit-input-error,
.attach-file.upload-validate .submit-input-upload {
    opacity: 1;
    pointer-events: all
}

.attach-file.show-type:hover .icon-label:before {
    -webkit-transform: translate3d(0, calc(100% - 2px), 0);
    transform: translate3d(0, calc(100% - 2px), 0)
}

.attach-file.show-type .icon-label {
    pointer-events: none
}

.attach-file.show-type .icon-label .icon-label-picture {
    visibility: hidden
}

.attach-file.show-type .attach-action-icon {
    visibility: visible;
    opacity: 1
}

.attach-file:hover .icon-label:before {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.attach-file:hover .icon-label .icon-label-picture:before {
    opacity: 0;
    -webkit-transform: rotate(180deg) translate3d(0, -80px, 0);
    transform: rotate(180deg) translate3d(0, -80px, 0)
}

.attach-file:hover .icon-label .icon-label-picture:after {
    opacity: 1;
    -webkit-transform: rotate(-180deg) translateZ(0);
    transform: rotate(-180deg) translateZ(0)
}

.icon-label {
    width: 100%;
    height: 100%;
    display: block;
    cursor: pointer;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 0);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 0)
}

.icon-label:before {
    content: "";
    background: red;
    will-change: transform;
    -webkit-transform: translate3d(0, calc(100% - 2px), 0);
    transform: translate3d(0, calc(100% - 2px), 0);
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.icon-label:before,
.submit-file {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1
}

.submit-file {
    opacity: 0
}

.icon-label-picture {
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2
}

.icon-label-picture:after,
.icon-label-picture:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    will-change: opacity, transform;
    -webkit-transition: .85s cubic-bezier(.4, 0, 0, 1);
    transition: .85s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform
}

.icon-label-picture:before {
    -webkit-transform: rotate(0) translateZ(0);
    transform: rotate(0) translateZ(0)
}

.icon-label-picture:after {
    opacity: 0;
    -webkit-transform: rotate(0) translate3d(0, -80px, 0);
    transform: rotate(0) translate3d(0, -80px, 0)
}

.icon-label-file:after,
.icon-label-file:before {
    width: 16px;
    height: 16px
}

.icon-label-file:before {
    background: url("/images/add-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.icon-label-file:after {
    background: url("/images/add-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.icon-label-location:after,
.icon-label-location:before {
    width: 16px;
    height: 22px
}

.icon-label-location:before {
    background: url("/images/location-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.icon-label-location:after {
    background: url("/images/location-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.icon-label-download:after,
.icon-label-download:before {
    width: 16px;
    height: 22px
}

.icon-label-download:before {
    background: url("/images/save-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.icon-label-download:after {
    background: url("/images/save-white.svg") no-repeat 50%;
    background-size: 100% 100%
}

.submit-input-upload {
    width: 80px;
    height: 80px;
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    opacity: 0;
    pointer-events: none;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 0);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 0)
}

.submit-input-upload:before {
    content: "";
    position: absolute;
    width: 36px;
    height: 36px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    border-radius: 50%;
    border: 2px solid #fff;
    border-top: 2px solid red;
    -webkit-animation: submitUploadAnimation .5s linear infinite;
    animation: submitUploadAnimation .5s linear infinite
}

@-webkit-keyframes submitUploadAnimation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes submitUploadAnimation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.section-center-50 {
    width: 50%;
    margin: 0 auto;
    position: relative
}

.section-center-75 {
    width: 75%;
    margin: 0 auto;
    position: relative
}

.social-section {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-perspective: 50px;
    perspective: 50px
}

.social-section-grey .social-link:before {
    opacity: .4
}

.social-section-grey .social-link:hover:before {
    opacity: 0
}

.social-section-grey .social-link:hover:after {
    opacity: 1
}

.social-section-black .social-link:hover:before {
    opacity: 0
}

.social-section-black .social-link:hover:after {
    opacity: 1
}

.social-link {
    display: block;
    margin-right: 5.5%;
    position: relative
}

.social-link:last-child {
    margin-right: 0
}

.social-link:after,
.social-link:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1)
}

.social-link:after {
    opacity: 0
}

.social-link.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) rotate(-10deg) translate3d(0, 20vh, 0);
    transform: scaleY(1.3) rotate(-10deg) translate3d(0, 20vh, 0)
}

.social-link.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.social-link.animate-element[data-start=true]:first-child {
    -webkit-transition-delay: .05s;
    transition-delay: .05s
}

.social-link.animate-element[data-start=true]:nth-child(2) {
    -webkit-transition-delay: .1s;
    transition-delay: .1s
}

.social-link.animate-element[data-start=true]:nth-child(3) {
    -webkit-transition-delay: .15s;
    transition-delay: .15s
}

.social-link.animate-element[data-start=true]:nth-child(4) {
    -webkit-transition-delay: .2s;
    transition-delay: .2s
}

.social-link.animate-element[data-start=true]:nth-child(5) {
    -webkit-transition-delay: .25s;
    transition-delay: .25s
}

.social-link.animate-element[data-start=true]:nth-child(6) {
    -webkit-transition-delay: .3s;
    transition-delay: .3s
}

.social-link.animate-element[data-start=true]:nth-child(7) {
    -webkit-transition-delay: .35s;
    transition-delay: .35s
}

.social-link.animate-element[data-start=true]:nth-child(8) {
    -webkit-transition-delay: .4s;
    transition-delay: .4s
}

.social-link.animate-element[data-start=true]:nth-child(9) {
    -webkit-transition-delay: .45s;
    transition-delay: .45s
}

.social-link.animate-element[data-start=true]:nth-child(10) {
    -webkit-transition-delay: .5s;
    transition-delay: .5s
}

.social-link.animate-element[data-start=true]:nth-child(11) {
    -webkit-transition-delay: .55s;
    transition-delay: .55s
}

.social-link.animate-element[data-start=true]:nth-child(12) {
    -webkit-transition-delay: .6s;
    transition-delay: .6s
}

.social-link.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) rotate(0) translateZ(0);
    transform: scaleY(1) rotate(0) translateZ(0)
}

.social-link.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.social-link-facebook {
    width: 10px;
    height: 18px
}

.social-link-facebook:before {
    background: url("/images/facebook-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-facebook:after {
    background: url("/images/facebook-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-twitter {
    width: 18px;
    height: 15px
}

.social-link-twitter:before {
    background: url("/images/twitter-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-twitter:after {
    background: url("/images/twitter-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-youtube {
    width: 24px;
    height: 17px
}

.social-link-youtube:before {
    background: url("/images/youtube-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-youtube:after {
    background: url("/images/youtube-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-telegram {
    width: 21px;
    height: 18px
}

.social-link-telegram:before {
    background: url("/images/telegram-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-telegram:after {
    background: url("/images/telegram-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-linkedin {
    width: 20px;
    height: 20px
}

.social-link-linkedin:before {
    background: url("/images/linkedin-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-linkedin:after {
    background: url("/images/linkedin-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-instagram {
    width: 20px;
    height: 20px
}

.social-link-instagram:before {
    background: url("/images/instagram-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-instagram:after {
    background: url("/images/instagram-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-behance {
    width: 24px;
    height: 15px
}

.social-link-behance:before {
    background: url("/images/behance-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-behance:after {
    background: url("/images/behance-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-dribbble {
    width: 20px;
    height: 20px
}

.social-link-dribbble:before {
    background: url("/images/dribbble-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-dribbble:after {
    background: url("/images/dribbble-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-awwwards {
    width: 18px;
    height: 22px
}

.social-link-awwwards:before {
    background: url("/images/awwwards-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-awwwards:after {
    background: url("/images/awwwards-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.social-link-clutch {
    width: 18px;
    height: 20px
}

.social-link-clutch:before {
    background: url("/images/clutch-black.svg") no-repeat 50%;
    background-size: contain
}

.social-link-clutch:after {
    background: url("/images/clutch-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.circle-button {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    display: block;
    border-radius: 50%;
    border: 1px solid #dadada
}

.circle-button:after,
.circle-button:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 8px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    will-change: transform;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.circle-button:hover:after {
    -webkit-transform: translateX(0) rotate(0);
    transform: translateX(0) rotate(0)
}

.circle-button:hover .circle-button-svg path {
    stroke-dashoffset: 0;
    -webkit-transition-duration: 1.5s;
    transition-duration: 1.5s
}

.circle-button-prev:before {
    background: url("/images/prev-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.circle-button-prev:after {
    -webkit-transform: translateX(80px) rotate(180deg);
    transform: translateX(80px) rotate(180deg);
    background: url("/images/prev-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.circle-button-prev:hover:before {
    -webkit-transform: translateX(-80px) rotate(-180deg);
    transform: translateX(-80px) rotate(-180deg)
}

.circle-button-next:before {
    background: url("/images/next-black.svg") no-repeat 50%;
    background-size: 100% 100%
}

.circle-button-next:after {
    -webkit-transform: translateX(-80px) rotate(-180deg);
    transform: translateX(-80px) rotate(-180deg);
    background: url("/images/next-red.svg") no-repeat 50%;
    background-size: 100% 100%
}

.circle-button-next:hover:before {
    -webkit-transform: translateX(80px) rotate(180deg);
    transform: translateX(80px) rotate(180deg)
}

.circle-button-svg {
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    position: absolute;
    top: -1px;
    left: -1px;
    z-index: 2;
    pointer-events: none;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.circle-button-svg path {
    stroke-dasharray: 500;
    stroke-dashoffset: 500px;
    -webkit-transition: stroke-dashoffset 1s ease-out;
    transition: stroke-dashoffset 1s ease-out
}

.section-single,
.section-single-comments {
    width: 100%;
    position: relative
}

.section-single-comments {
    padding-top: 100px
}

.section-single-center {
    width: 50%;
    margin: 0 auto;
    position: relative
}

.section-single-content,
.section-single-info {
    width: 100%;
    position: relative
}

.section-single-content {
    padding-top: 25px;
    -webkit-transition: opacity .25s ease;
    transition: opacity .25s ease
}

body.loading .section-single-content {
    opacity: 0
}

.section-single-content.lichka-container {
    opacity: 0;
    -webkit-transition: opacity .65s ease;
    transition: opacity .65s ease
}

.section-single-back {
    position: relative;
    width: 100%
}

.section-single-back a.section-marks-item {
    padding-left: unset
}

.section-single-back a,
.section-single-back span {
    color: #908f8f;
    font-size: 16px;
    line-height: 1.2
}

.section-single-back a {
    padding-left: 45px;
    white-space: nowrap;
    letter-spacing: .02em;
    display: inline-block;
    will-change: color;
    -webkit-transition: color .5s cubic-bezier(.4, 0, 0, 1);
    transition: color .5s cubic-bezier(.4, 0, 0, 1)
}

.section-single-back a:before {
    content: "";
    position: absolute;
    width: 33px;
    height: 8px;
    top: 0;
    left: 0;
    bottom: 0;
    opacity: .3;
    margin: auto 0;
    will-change: opacity;
    -webkit-transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    transition: opacity .5s cubic-bezier(.4, 0, 0, 1);
    background: url("/images/back-black.svg") no-repeat 50%;
    background-size: contain
}

.section-single-back a span {
    display: inline;
    will-change: border-color;
    border-bottom: 1px solid transparent;
    -webkit-transition: border-color .5s cubic-bezier(.4, 0, 0, 1);
    transition: border-color .5s cubic-bezier(.4, 0, 0, 1)
}

.section-single-back a:hover {
    color: #000
}

.section-single-back a:hover:before {
    opacity: 1
}

.section-single-back a:hover span {
    border-color: #000
}

.section-single-back.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-single-back.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-single-back.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-single-back.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-single-title {
    position: relative;
    width: 100%;
    padding-top: 45px
}

.section-single-title h1 {
    margin: 0;
    font-size: 50px;
    line-height: 1.1
}

.section-single-title.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-single-title.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-single-title.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-single-title.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-single-data {
    width: 100%;
    padding-top: 30px;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-single-data,
.section-single-data-left,
.section-single-data-right {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap
}

.section-single-data-left,
.section-single-data-right {
    width: 50%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-single-data-left .section-archive {
    margin-right: 19px
}

.section-single-data-right .section-badges {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.section-archive {
    width: auto;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.section-archive span {
    width: 100%;
    height: 100%;
    color: #fff;
    cursor: default;
    background: red;
    overflow: hidden;
    padding: 11px 23px;
    display: inline-block;
    position: relative;
    font: 16px "Exo 2", sans-serif;;
    letter-spacing: .02em;
    line-height: 1.6
}

.section-archive.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 30vh, 0);
    transform: scaleY(1.3) translate3d(0, 30vh, 0)
}

.section-archive.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-archive.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-archive.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-single-tags {
    width: auto;
    max-width: 100%;
    position: relative
}

.section-single-tags_portfolio {
    margin-top: 30px
}

.section-single-form {
    width: 100%;
    position: relative;
    padding-top: 65px
}

.section-single-form .form-message {
    z-index: 4
}

.section-single-form .form-message .form-message-info {
    width: 100%!important;
    text-align: left
}

.section-single-form.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.3) translate3d(0, 25vh, 0);
    transform: scaleY(1.3) translate3d(0, 25vh, 0)
}

.section-single-form.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-single-form.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) translateZ(0);
    transform: scaleY(1) translateZ(0)
}

.section-single-form.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition-delay: 0s!important;
    transition-delay: 0s!important
}

.section-single-form-title {
    width: 100%;
    position: relative;
    margin-bottom: 50px
}

.section-single-form-title p {
    font: 40px "Exo 2", sans-serif;;
    line-height: 1.1
}

.section-single-share {
    width: 90px;
    height: auto;
    position: absolute;
    top: 70px!important;
    left: calc(25% - 225px)
}

.section-single-share-inner {
    width: 100%;
    position: relative
}

.section-single-share-inner.animate-element {
    opacity: 0;
    pointer-events: none;
    will-change: opacity, transform;
    -webkit-transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0);
    transform: scaleY(1.5) skew(0, 10deg) translate3d(0, 25vh, 0)
}

.section-single-share-inner.animate-element[data-start=true] {
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform;
    -webkit-transition: 1s cubic-bezier(.4, 0, 0, 1);
    transition: 1s cubic-bezier(.4, 0, 0, 1)
}

.section-single-share-inner.animate-element[data-start=true].visible {
    opacity: 1;
    -webkit-transform: scaleY(1) skew(0, 0) translateZ(0);
    transform: scaleY(1) skew(0, 0) translateZ(0)
}

.section-single-share-inner.animate-element[data-start=true].finished {
    pointer-events: auto;
    -webkit-transition: none!important;
    transition: none!important
}

.section-share {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-share-link {
    width: 90px;
    height: 90px;
    display: block;
    overflow: hidden;
    position: relative;
    margin: 0 -2px -2px 0;
    border: 1px solid #dadada
}

.section-share-link:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
    background: red;
    will-change: transform;
    -webkit-transform: translate3d(0, calc(100% - 2px), 0);
    transform: translate3d(0, calc(100% - 2px), 0);
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.section-share-link:hover:before {
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.section-share-link:hover .section-share-icon:before {
    opacity: 0;
    -webkit-transform: translate3d(0, 90px, 0);
    transform: translate3d(0, 90px, 0)
}

.section-share-link:hover .section-share-icon:after {
    opacity: 1;
    -webkit-transform: translateZ(0);
    transform: translateZ(0)
}

.section-share-icon {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    z-index: 2
}

.section-share-icon:after,
.section-share-icon:before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    will-change: opacity, transform;
    -webkit-transition: .5s cubic-bezier(.4, 0, 0, 1);
    transition: .5s cubic-bezier(.4, 0, 0, 1);
    -webkit-transition-property: opacity, -webkit-transform;
    transition-property: opacity, -webkit-transform;
    transition-property: opacity, transform;
    transition-property: opacity, transform, -webkit-transform
}

.section-share-icon:after {
    opacity: 0;
    -webkit-transform: translate3d(0, -90px, 0);
    transform: translate3d(0, -90px, 0)
}

.section-share-facebook .section-share-icon {
    width: 10px;
    height: 18px
}

.section-share-facebook .section-share-icon:before {
    background: url("/images/facebook-black.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-facebook .section-share-icon:after {
    background: url("/images/facebook-white.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-twitter .section-share-icon {
    width: 18px;
    height: 15px
}

.section-share-twitter .section-share-icon:before {
    background: url("/images/twitter-black.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-twitter .section-share-icon:after {
    background: url("/images/twitter-white.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-vk .section-share-icon {
    width: 22px;
    height: 13px
}

.section-share-vk .section-share-icon:before {
    background: url("/images/vk-black.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-vk .section-share-icon:after {
    background: url("/images/vk-white.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-telegram .section-share-icon {
    width: 21px;
    height: 18px
}

.section-share-telegram .section-share-icon:before {
    background: url("/images/telegram-black.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-telegram .section-share-icon:after {
    background: url("/images/telegram-white.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-google-plus .section-share-icon {
    width: 25px;
    height: 16px
}

.section-share-google-plus .section-share-icon:before {
    background: url("/images/google-plus-black.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-google-plus .section-share-icon:after {
    background: url("/images/google-plus-white.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-mail .section-share-icon {
    width: 20px;
    height: 15px
}

.section-share-mail .section-share-icon:before {
    background: url("/images/mail-black.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-mail .section-share-icon:after {
    background: url("/images/mail-white.svg") 50% no-repeat;
    background-size: 100% 100%
}

.section-share-copy .section-share-icon {
    width: 19px;
    height: 19px
}

.section-share-copy .section-share-icon:before {
    background: url("/images/copy-black.svg") 50% no-repeat;
    background-size: contain
}

.section-share-copy .section-share-icon:after {
    background: url("/images/copy-white.svg") 50% no-repeat;
    background-size: 100% 100%
}

.a2a_count {
    width: auto!important;
    height: auto!important;
    max-width: 100%!important;
    background: red!important;
    display: inline-block!important;
    position: absolute!important;
    top: 0!important;
    right: 0!important;
    z-index: 3!important;
    color: #fff!important;
    font-size: 10px!important;
    line-height: 10px!important;
    padding: 5px!important;
    border: none!important;
    margin-left: 0!important;
    border-radius: 0!important;
    white-space: nowrap!important;
    letter-spacing: .02em!important
}

.a2a_count.d-hide,
.a2a_count:after,
.a2a_count:before {
    display: none!important
}

.a2a_count span {
    display: inline!important
}

.section-rate {
    width: 100%;
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.section-scroll {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 4;
    pointer-events: none
}

.section-scroll-button {
    width: auto;
    height: 120px;
    border: none;
    overflow: hidden;
    background: none;
    position: absolute;
    left: 60px;
    bottom: 0;
    cursor: pointer;
    pointer-events: all;
    padding: 0 10px 0 25px;
    display: inline-block
}

.section-scroll-button:after,
.section-scroll-button:before {
    content: "";
    position: absolute;
    width: 2px;
    height: 100%;
    top: 0;
    left: 0
}

.section-scroll-button:before {
    background: hsla(0, 0%, 100%, .5)
}

.section-scroll-button:after {
    z-index: 2;
    background: #fff;
    -webkit-transform: scaleY(0);
    transform: scaleY(0);
    -webkit-animation: scrollDownLine 2s cubic-bezier(.4, 0, 0, 1) normal infinite .75s;
    animation: scrollDownLine 2s cubic-bezier(.4, 0, 0, 1) normal infinite .75s
}

.section-scroll-button span {
    color: #fff;
    position: relative;
    white-space: nowrap;
    padding-bottom: 5px;
    font: 18px "Exo 2", sans-serif;;
    letter-spacing: .02em
}

.section-scroll-button span:before {
    content: "";
    position: absolute;
    width: calc(100% + 10px);
    height: 2px;
    left: 0;
    bottom: 0;
    background: #fff;
    -webkit-transform: scaleX(0);
    transform: scaleX(0);
    will-change: transform;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: -webkit-transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1);
    transition: transform .5s cubic-bezier(.4, 0, 0, 1), -webkit-transform .5s cubic-bezier(.4, 0, 0, 1)
}

.section-scroll-button:hover span:before {
    -webkit-transform: scaleX(1);
    transform: scaleX(1)
}

@-webkit-keyframes scrollDownLine {
    0% {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top center;
        transform-origin: top center
    }
    50% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top center;
        transform-origin: top center
    }
    51% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom center;
        transform-origin: bottom center
    }
    to {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: bottom center;
        transform-origin: bottom center
    }
}

@keyframes scrollDownLine {
    0% {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: top center;
        transform-origin: top center
    }
    50% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: top center;
        transform-origin: top center
    }
    51% {
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
        -webkit-transform-origin: bottom center;
        transform-origin: bottom center
    }
    to {
        -webkit-transform: scaleY(0);
        transform: scaleY(0);
        -webkit-transform-origin: bottom center;
        transform-origin: bottom center
    }
}

.section-scroll-button_best-cases {
    pointer-events: none;
    z-index: 2
}

.section-scroll-button_best-cases:before {
    background: rgba(255, 0, 0, .5)
}

.section-scroll-button_best-cases:after {
    background: red
}

.section-scroll-button_best-cases span {
    color: red;
    padding-bottom: 0
}

.section-scroll-button_best-cases span:before {
    display: none
}

.section-static {
    padding-top: 40px
}

.section-static,
.section-static-content {
    width: 100%;
    position: relative
}

.form-message {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #fff;
    opacity: 0;
    will-change: opacity;
    pointer-events: none;
    -webkit-transition: opacity .5s ease-out;
    transition: opacity .5s ease-out
}

.form-message.opened {
    opacity: 1;
    pointer-events: all
}

.form-message.form-error .form-message-info {
    color: red
}

.form-message-info {
    width: calc(100% - 120px);
    position: relative;
    height: auto;
    text-align: center
}

.form-message-info p {
    font: 30px "Exo 2", sans-serif;
}

input::-moz-placeholder,
input::-webkit-input-placeholder {
    line-height: normal!important
}

input::-moz-placeholder,
input::-webkit-input-placeholder,
input::placeholder {
    line-height: normal!important
}

@media only screen and (max-width:1600px) {
    .icon-button {
        height: 75px
    }
    .icon-button-name {
        font-size: 15px;
        line-height: 75px
    }
    .icon-button-picture {
        width: 75px;
        height: 75px
    }
    .dft-button,
    .submit-button {
        height: 75px
    }
    .dft-button span,
    .submit-button span,
    .submit-input {
        font-size: 15px
    }
    input.submit-input {
        height: 75px;
        line-height: 20px;
        padding: 0 75px 0 25px
    }
    textarea.submit-input {
        height: 130px;
        padding: 25px 75px 25px 25px
    }
    .submit-input-error {
        width: 75px;
        height: 75px
    }
    .submit-input-error:before {
        width: 35px;
        height: 35px;
        font-size: 16px;
        line-height: 35px
    }
    .submit-input-upload {
        width: 75px;
        height: 75px
    }
    .submit-input-upload:before {
        width: 31px;
        height: 31px
    }
    .shape-section-button {
        height: 220px
    }
    .shape-section-letter {
        font-size: 50px
    }
    .attach-content {
        width: calc(100% - 75px)
    }
    .attach-section {
        height: 75px
    }
    .attach-input {
        width: 75px;
        height: 75px
    }
    .attach-error p,
    .attach-placeholder p {
        font-size: 15px
    }
    .attach-action-icon {
        width: 75px;
        height: 75px
    }
    .attach-action-icon:before {
        width: 37px;
        height: 42px
    }
    .attach-action-name,
    .attach-action-size {
        font-size: 15px
    }
    .icon-label-file:after,
    .icon-label-file:before {
        width: 15px;
        height: 15px
    }
    .section-single-tags_portfolio {
        margin-top: 15px
    }
    .section-archive span {
        font-size: 15px;
        padding: 9px 20px
    }
    .section-single-data-left .section-archive {
        margin-right: 16px
    }
    .section-single-back a {
        font-size: 15px
    }
    .section-single-title {
        padding-top: 40px
    }
    .section-single-title h1 {
        font-size: 40px
    }
    .section-single-data {
        padding-top: 25px
    }
    .section-single-content {
        padding-top: 20px
    }
    .section-single-share {
        width: 80px;
        top: 65px!important;
        left: calc(25% - 165px)
    }
    .section-share-link {
        width: 80px;
        height: 80px
    }
    .section-single-form {
        padding-top: 45px
    }
    .section-single-form-title {
        margin-bottom: 40px
    }
    .section-single-form-title p {
        font-size: 35px
    }
    .section-scroll-button {
        height: 100px;
        left: 50px;
        padding: 0 10px 0 20px
    }
    .section-scroll-button span {
        font-size: 16px
    }
    .section-static {
        padding-top: 30px
    }
    .section-single-comments {
        padding-top: 80px
    }
    .form-message-info {
        width: calc(100% - 100px)
    }
    .form-message-info p {
        font-size: 26px
    }
}

@media only screen and (max-width:1366px) {
    .icon-button {
        height: 70px
    }
    .icon-button-name {
        font-size: 14px;
        line-height: 70px
    }
    .icon-button-picture {
        width: 70px;
        height: 70px
    }
    .dft-button,
    .submit-button {
        height: 70px
    }
    .submit-input {
        font-size: 14px
    }
    input.submit-input {
        height: 70px;
        line-height: 20px;
        padding: 0 70px 0 25px
    }
    textarea.submit-input {
        padding: 25px 70px 25px 25px
    }
    .submit-input-error {
        width: 70px;
        height: 70px
    }
    .submit-input-error:before {
        width: 30px;
        height: 30px;
        font-size: 15px;
        line-height: 30px
    }
    .submit-input-upload {
        width: 70px;
        height: 70px
    }
    .submit-input-upload:before {
        width: 26px;
        height: 26px
    }
    .shape-section-button {
        height: 185px
    }
    .shape-section-letter {
        font-size: 45px
    }
    .attach-content {
        width: calc(100% - 70px)
    }
    .attach-section {
        height: 70px
    }
    .attach-input {
        width: 70px;
        height: 70px
    }
    .attach-error p,
    .attach-placeholder p {
        font-size: 14px
    }
    .attach-action-icon {
        width: 70px;
        height: 70px
    }
    .attach-action-icon:before {
        width: 32px;
        height: 37px
    }
    .attach-action-name,
    .attach-action-size {
        font-size: 14px;
        line-height: 1.4
    }
    .icon-label-file:after,
    .icon-label-file:before {
        width: 14px;
        height: 14px
    }
    .section-center-50,
    .section-center-75 {
        width: calc(100% - 80px)
    }
    .section-single-center {
        width: 75%
    }
    .section-archive span {
        font-size: 14px
    }
    .section-single-data-left .section-archive {
        margin-right: 14px
    }
    .section-single-back a {
        font-size: 14px
    }
    .section-single-title {
        padding-top: 35px
    }
    .section-single-title h1 {
        font-size: 36px
    }
    .section-single-share {
        width: 70px;
        left: 40px;
        top: 60px!important
    }
    .section-share-link {
        width: 70px;
        height: 70px
    }
    .section-single-form {
        padding-top: 25px
    }
    .section-single-form-title {
        margin-bottom: 35px
    }
    .section-single-form-title p {
        font-size: 30px
    }
    .section-scroll-button {
        height: 80px;
        left: 40px
    }
    .section-scroll-button span {
        font-size: 14px
    }
    .section-static {
        padding-top: 20px
    }
    .section-single-comments {
        padding-top: 70px
    }
    .form-message-info {
        width: calc(100% - 80px)
    }
    .form-message-info p {
        font-size: 21px
    }
}

@media only screen and (max-width:1200px) {
    .social-section-grey {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
    .social-section-grey .social-link {
        margin: 0 20px 20px
    }
    .social-section-grey .social-link:last-child {
        margin-right: 20px
    }
    .section-scroll-button_best-cases:before {
        background: hsla(0, 0%, 100%, .5)
    }
    .section-scroll-button_best-cases:after {
        background: #fff
    }
    .section-scroll-button_best-cases span {
        color: #fff
    }
}

@media only screen and (max-width:1024px) {
    .social-section-black {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
    .social-section-black .social-link {
        margin: 0 20px 20px
    }
    .social-section-black .social-link:last-child {
        margin-right: 20px
    }
    .shape-section-button {
        height: 160px
    }
    .shape-section-letter {
        font-size: 35px
    }
    .section-single-center {
        width: calc(100% - 80px)
    }
    .section-single-share {
        width: 100%;
        left: unset;
        position: relative;
        padding: 65px 40px 0;
        top: unset!important
    }
    .section-share {
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center
    }
    .section-single-form {
        padding-bottom: 10px
    }
    .section-scroll-button {
        left: 50px;
        height: 50px;
        padding: 0;
        width: calc(100vw - 100px)
    }
    .section-scroll-button:before {
        display: none
    }
    .section-scroll-button:after {
        -webkit-animation: none;
        animation: none
    }
    .section-scroll-button span {
        padding-bottom: 0
    }
    .section-scroll-button span:before {
        display: none
    }
    .section-scroll-button_best-cases {
        left: 40px;
        height: 50px;
        padding: 0 10px 0 20px;
        width: auto
    }
    .section-scroll-button_best-cases:before {
        display: block
    }
    .section-scroll-button_best-cases:after {
        -webkit-animation: scrollDownLine 2s cubic-bezier(.4, 0, 0, 1) normal infinite .75s;
        animation: scrollDownLine 2s cubic-bezier(.4, 0, 0, 1) normal infinite .75s
    }
    .section-single-comments {
        padding-top: 60px
    }
    .section-single {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
    }
}

@media only screen and (max-width:800px) {
    .section-single-data {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .section-single-data-left,
    .section-single-data-right {
        width: 100%
    }
    .section-single-data-right {
        padding-top: 30px
    }
    .section-single-data-right .section-badges {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    .section-scroll-button_best-cases {
        overflow: visible;
        padding: 0;
        height: auto;
        -webkit-transform: rotate(-90deg);
        transform: rotate(-90deg)
    }
    .section-scroll-button_best-cases.lang-en,
    .section-scroll-button_best-cases.lang-ru {
        bottom: 42px;
        left: -12px
    }
    .section-scroll-button_best-cases:after,
    .section-scroll-button_best-cases:before {
        height: 2px;
        width: 50px;
        top: 50%;
        margin-top: -3px
    }
    .section-scroll-button_best-cases:after {
        -webkit-animation: scrollRightLine 2s cubic-bezier(.4, 0, 0, 1) normal infinite .75s;
        animation: scrollRightLine 2s cubic-bezier(.4, 0, 0, 1) normal infinite .75s
    }
    .section-scroll-button_best-cases span {
        padding-left: 60px
    }
    @-webkit-keyframes scrollRightLine {
        0% {
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transform-origin: top left;
            transform-origin: top left
        }
        50% {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
            -webkit-transform-origin: top left;
            transform-origin: top left
        }
        51% {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
            -webkit-transform-origin: top right;
            transform-origin: top right
        }
        to {
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transform-origin: top right;
            transform-origin: top right
        }
    }
    @keyframes scrollRightLine {
        0% {
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transform-origin: top left;
            transform-origin: top left
        }
        50% {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
            -webkit-transform-origin: top left;
            transform-origin: top left
        }
        51% {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
            -webkit-transform-origin: top right;
            transform-origin: top right
        }
        to {
            -webkit-transform: scaleX(0);
            transform: scaleX(0);
            -webkit-transform-origin: top right;
            transform-origin: top right
        }
    }
}

@media only screen and (max-width:640px) {
    .portfolio-single-info .section-scroll {
        text-align: center
    }
    .portfolio-single-info .section-scroll-button {
        width: 160px;
        height: 64px;
        padding: 0 10px;
        left: 0;
        right: 0;
        margin: auto
    }
    .portfolio-single-info .section-scroll-button:before {
        display: none
    }
}

@media only screen and (max-width:414px) {
    .unit-container .section-single-share {
        padding-left: 15px;
        padding-right: 15px
    }
    .section-share-link {
        width: 56px;
        height: 56px
    }
}

@media only screen and (max-width:375px) {
    .unit-container .section-single-share {
        padding-left: 10px;
        padding-right: 10px
    }
    .section-share-link {
        width: 52px;
        height: 52px
    }
}

@media only screen and (max-width:360px) {
    .section-share-link {
        width: 50px;
        height: 50px
    }
}

@media only screen and (max-width:320px) {
    .section-share-link {
        width: 44px;
        height: 44px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .prev-next-links {
        width: 56px;
        height: 58px
    }
    .prev-next-links .img {
        display: none;
        background-image: none!important
    }
    .prev-next-links:hover .inn {
        -webkit-transform: none!important;
        transform: none!important
    }
    .prev-next-links[data-type=prev] .img {
        -webkit-transform: translate3d(44px, 0, 0);
        transform: translate3d(44px, 0, 0)
    }
    .prev-next-links[data-type=next] .img {
        -webkit-transform: translate3d(-44px, 0, 0);
        transform: translate3d(-44px, 0, 0)
    }
    .unit-container[data-page=talks-single] .section-content-image {
        width: calc(100% + 50px);
        margin: 0 -25px
    }
    .unit-container[data-page=talks-single] .section-content-image img {
        width: 100%
    }
    .section-share-facebook .section-share-icon {
        width: 8px;
        height: 16px
    }
    .section-share-twitter .section-share-icon {
        width: 16px;
        height: 14px
    }
    .section-share-vk .section-share-icon {
        width: 18px;
        height: 12px
    }
    .section-share-telegram .section-share-icon {
        width: 16px;
        height: 16px
    }
    .section-share-google-plus .section-share-icon {
        width: 20px;
        height: 14px
    }
    .section-share-mail .section-share-icon {
        width: 16px;
        height: 12px
    }
    .section-share-copy .section-share-icon {
        width: 17px;
        height: 17px
    }
    .icon-button {
        height: 60px
    }
    .icon-button-name {
        line-height: 60px
    }
    .icon-button-picture {
        width: 60px;
        height: 60px
    }
    .dft-button,
    .submit-button {
        height: 60px
    }
    .dft-button span,
    .submit-button span {
        font-size: 14px
    }
    input.submit-input {
        height: 60px;
        line-height: 20px;
        padding: 0 60px 0 25px
    }
    textarea.submit-input {
        padding: 20px 60px 25px 25px
    }
    .submit-input-error {
        width: 60px;
        height: 60px
    }
    .submit-input-error:before {
        width: 25px;
        height: 25px;
        font-size: 15px;
        line-height: 25px
    }
    .submit-input-upload {
        width: 60px;
        height: 60px
    }
    .submit-input-upload:before {
        width: 21px;
        height: 21px
    }
    .shape-section-button {
        height: 90px
    }
    .shape-section-letter {
        font-size: 18px
    }
    .attach-content {
        width: calc(100% - 60px)
    }
    .attach-section {
        height: 60px
    }
    .attach-action-icon,
    .attach-input {
        width: 60px;
        height: 60px
    }
    .attach-action-info {
        width: 100%;
        border-left: none
    }
    .section-center-50,
    .section-center-75 {
        width: calc(100% - 40px)
    }
    .section-single-center {
        width: calc(100% - 50px)
    }
    .section-single-title {
        padding-top: 30px
    }
    .section-single-title h1 {
        font-size: 26px;
        line-height: 1.2
    }
    .section-single-data-right {
        padding-top: 25px
    }
    .section-single-content {
        padding-top: 0
    }
    .section-single-share {
        padding: 40px 25px 0
    }
    .section-single-form {
        padding-top: 20px;
        padding-bottom: 20px
    }
    .section-single-form-title {
        margin-bottom: 30px
    }
    .section-single-form-title p {
        font-size: 24px
    }
    .section-single-data-left .section-archive {
        width: 100%;
        margin-right: 0;
        margin-bottom: 20px
    }
    .section-single-data-left .section-archive span {
        text-align: center
    }
    .section-single-data {
        padding-bottom: 25px
    }
    .section-single-tags {
        width: 100%
    }
    .section-single-tags_portfolio {
        margin-top: 15px
    }
    .section-single-data-right .section-badges {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }
    .section-single-data-right .section-badges-item {
        padding-top: 0;
        font-size: 12px;
        line-height: 1;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin: 0
    }
    .section-single-data-right .section-badges-item:before {
        position: relative;
        display: -webkit-inline-box;
        display: -ms-inline-flexbox;
        display: inline-flex;
        left: auto;
        right: auto;
        bottom: auto;
        margin-left: 0;
        margin-right: 5px
    }
    .section-single-data-right .section-badges-item.section-badge-date:before {
        width: 14px;
        height: 14px
    }
    .section-single-data-right .section-badges-item.section-badge-views:before {
        width: 22px;
        height: 11px
    }
    .section-single-data-right .section-badges-item.section-badge-comments:before {
        width: 15px;
        height: 13px
    }
    .section-single-data-right .section-badges-item.section-badge-time:before {
        width: 14px;
        height: 14px
    }
    .section-static {
        padding-top: 10px
    }
    .form-message-info {
        width: calc(100% - 50px)
    }
    .form-message-info p {
        font-size: 19px
    }
}

@media only screen and (max-width:900px) and (max-height:600px) and (orientation:landscape) {
    .icon-button {
        height: 60px
    }
    .icon-button-name {
        line-height: 60px
    }
    .icon-button-picture {
        width: 60px;
        height: 60px
    }
    .dft-button,
    .submit-button {
        height: 60px
    }
    .dft-button span,
    .submit-button span {
        font-size: 14px
    }
    input.submit-input {
        height: 60px;
        line-height: 20px;
        padding: 0 60px 0 25px
    }
    textarea.submit-input {
        padding: 20px 60px 25px 25px
    }
    .submit-input-error {
        width: 60px;
        height: 60px
    }
    .submit-input-error:before {
        width: 25px;
        height: 25px;
        font-size: 15px;
        line-height: 25px
    }
    .submit-input-upload {
        width: 60px;
        height: 60px
    }
    .submit-input-upload:before {
        width: 21px;
        height: 21px
    }
    .shape-section-button {
        height: 110px
    }
    .shape-section-letter {
        font-size: 25px
    }
    .attach-content {
        width: calc(100% - 60px)
    }
    .attach-section {
        height: 60px
    }
    .attach-action-icon,
    .attach-input {
        width: 60px;
        height: 60px
    }
    .attach-action-icon:before {
        width: 27px;
        height: 32px
    }
    .section-center-50,
    .section-center-75,
    .section-single-center {
        width: calc(100% - 50px)
    }
    .section-single-title {
        padding-top: 30px
    }
    .section-single-title h1 {
        font-size: 26px;
        line-height: 1.2
    }
    .section-single-data {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-flow: column nowrap;
        flex-flow: column nowrap
    }
    .section-single-data-left,
    .section-single-data-right {
        width: 100%
    }
    .section-single-data-right {
        padding-top: 30px
    }
    .section-single-data-right .section-badges {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: flex-start
    }
    .section-single-data-right {
        padding-top: 25px
    }
    .section-single-content {
        padding-top: 10px
    }
    .section-single-share {
        padding: 40px 25px 0
    }
    .section-static {
        padding-top: 10px
    }
    .form-message-info {
        width: calc(100% - 50px)
    }
    .form-message-info p {
        font-size: 19px
    }
}

.you-will-be-interested-in {
    margin-top: 80px
}

@media only screen and (max-width:1600px) {
    .you-will-be-interested-in {
        margin-top: 70px
    }
}

@media only screen and (max-width:1366px) {
    .you-will-be-interested-in {
        margin-top: 60px
    }
}

@media only screen and (max-width:750px) {
    .you-will-be-interested-in {
        margin-top: 50px
    }
}

.you-will-be-interested-in__head {
    margin-bottom: 50px
}

@media only screen and (max-width:1600px) {
    .you-will-be-interested-in__head {
        margin-bottom: 40px
    }
}

@media only screen and (max-width:1366px) {
    .you-will-be-interested-in__head {
        margin-bottom: 30px
    }
}

@media only screen and (max-width:750px) {
    .you-will-be-interested-in__head {
        margin-bottom: 20px
    }
}

.you-will-be-interested-in__title {
    font: 30px/1.1 "Exo 2", sans-serif;
}

@media only screen and (max-width:1600px) {
    .you-will-be-interested-in__title {
        font-size: 26px
    }
}

@media only screen and (max-width:1366px) {
    .you-will-be-interested-in__title {
        font-size: 24px
    }
}

.you-will-be-interested-in__body {
    background-color: #f5f5f5;
    border-left: 5px solid #f50d03;
    padding: 80px
}

@media only screen and (max-width:1600px) {
    .you-will-be-interested-in__body {
        padding: 70px
    }
}

@media only screen and (max-width:1366px) {
    .you-will-be-interested-in__body {
        padding: 60px
    }
}

@media only screen and (max-width:991px) {
    .you-will-be-interested-in__body {
        padding: 50px
    }
}

@media only screen and (max-width:750px) {
    .you-will-be-interested-in__body {
        padding: 30px
    }
}

.you-will-be-interested-in__body ol,
.you-will-be-interested-in__body ul {
    margin: 0;
    padding-left: 0;
    counter-reset: li;
    list-style: none;
    line-height: 2
}

@media only screen and (max-width:1600px) {
    .you-will-be-interested-in__body ol,
    .you-will-be-interested-in__body ul {
        font-size: 15px
    }
}

@media only screen and (max-width:1366px) {
    .you-will-be-interested-in__body ol,
    .you-will-be-interested-in__body ul {
        font-size: 14px
    }
}

.you-will-be-interested-in__body li {
    position: relative;
    padding-left: 20px;
    margin-bottom: 30px;
    counter-increment: li
}

.you-will-be-interested-in__body li:before {
    content: counter(li) ".";
    position: absolute;
    top: 0;
    left: 0;
    color: #f50d03
}

.you-will-be-interested-in__body li:last-child {
    margin-bottom: 0
}

@media only screen and (max-width:1600px) {
    .you-will-be-interested-in__body li {
        margin-bottom: 25px
    }
}

@media only screen and (max-width:1366px) {
    .you-will-be-interested-in__body li {
        margin-bottom: 20px
    }
}

.you-will-be-interested-in__body a {
    color: #000;
    text-decoration: underline;
    -webkit-transition: color .35s cubic-bezier(.4, 0, 0, 1);
    transition: color .35s cubic-bezier(.4, 0, 0, 1)
}

.you-will-be-interested-in__body a:hover {
    color: #f50d03
}

.link-readmore {
    font-family: "Exo 2", sans-serif;
    display: inline-block;
    position: relative
}

.link-readmore:after {
    content: "";
    display: block;
    position: absolute;
    top: calc(100% - 5px);
    left: 0;
    right: 0;
    height: 2px;
    background-color: red;
    -webkit-transition: opacity .25s ease-in-out;
    transition: opacity .25s ease-in-out
}

.link-readmore:hover:after {
    opacity: 0
}

.preloader {
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #f50d03;
    z-index: 30;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-transition: visibility 1.25s ease-in-out 1s, -webkit-transform 1.25s ease-in-out 1s;
    transition: visibility 1.25s ease-in-out 1s, -webkit-transform 1.25s ease-in-out 1s;
    transition: transform 1.25s ease-in-out 1s, visibility 1.25s ease-in-out 1s;
    transition: transform 1.25s ease-in-out 1s, visibility 1.25s ease-in-out 1s, -webkit-transform 1.25s ease-in-out 1s;
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%)
}

.preloader,
.preloader__head {
    position: fixed;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.preloader__head {
    left: 50%;
    z-index: 31;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-transition: top .75s ease-in-out 1.25s, opacity .35s ease-in-out 1.75s, visibility .35s ease-in-out 2s;
    transition: top .75s ease-in-out 1.25s, opacity .35s ease-in-out 1.75s, visibility .35s ease-in-out 2s;
    top: 90px;
    visibility: hidden;
    opacity: 0
}

.preloader__head .lines {
    width: 25px;
    height: 64px;
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.preloader__head .line {
    background-color: #fff;
    border-radius: 25px;
    height: 5px;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    position: absolute
}

.preloader__head .line_long {
    width: 33px
}

.preloader__head .line_short {
    width: 19px
}

.preloader__head .line_top {
    top: 10px;
    left: -4px;
    -webkit-animation: none;
    animation: none
}

.preloader__head .line_center {
    top: 30px;
    left: 3px;
    -webkit-animation: none;
    animation: none
}

.preloader__head .line_bottom {
    top: 49px;
    left: -4px;
    -webkit-animation: none;
    animation: none
}

.preloader__head #solar {
    opacity: 1;
    -webkit-transition: .55s ease-in-out .55s;
    transition: .55s ease-in-out .55s
}

.preloader__head #lines {
    opacity: 0
}

.preloader__body {
    position: relative;
    margin-top: 100px;
    text-align: center;
    -webkit-transition: .35s ease-in-out;
    transition: .35s ease-in-out;
    opacity: 0
}

.preloader__text {
    color: #fff;
    font-size: 20px;
    white-space: nowrap;
    opacity: 0;
    -webkit-animation: preloader-text-4 5s ease-in-out infinite;
    animation: preloader-text-4 5s ease-in-out infinite
}

.preloader__text_absolute {
    position: absolute;
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

.preloader__text_1 {
    -webkit-animation: preloader-text-1 5s ease-in-out infinite;
    animation: preloader-text-1 5s ease-in-out infinite
}

.preloader__text_2 {
    -webkit-animation: preloader-text-2 5s ease-in-out infinite;
    animation: preloader-text-2 5s ease-in-out infinite
}

.preloader__text_3 {
    -webkit-animation: preloader-text-3 5s ease-in-out infinite;
    animation: preloader-text-3 5s ease-in-out infinite
}

.preloader__text_4 {
    -webkit-animation: preloader-text-4 5s ease-in-out infinite;
    animation: preloader-text-4 5s ease-in-out infinite
}

.preloader-active .preloader {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    -webkit-transition: none;
    transition: none
}

.preloader-active .preloader__head {
    top: 50%;
    visibility: visible;
    opacity: 1;
    -webkit-transition: none;
    transition: none
}

.preloader-active .preloader__head .line_top {
    -webkit-animation: line .75s ease-in-out infinite;
    animation: line .75s ease-in-out infinite
}

.preloader-active .preloader__head .line_center {
    -webkit-animation: line .75s .15s ease-in-out infinite;
    animation: line .75s .15s ease-in-out infinite
}

.preloader-active .preloader__head .line_bottom {
    -webkit-animation: line .75s .3s ease-in-out infinite;
    animation: line .75s .3s ease-in-out infinite
}

.preloader-active .preloader__head #solar {
    opacity: 0;
    -webkit-transition: none;
    transition: none
}

.preloader-active .preloader__body {
    opacity: 1;
    -webkit-transition: none;
    transition: none
}

@-webkit-keyframes line {
    0% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }
    50% {
        -webkit-transform: rotate(-45deg) scale(1.3);
        transform: rotate(-45deg) scale(1.3)
    }
    to {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }
}

@keyframes line {
    0% {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }
    50% {
        -webkit-transform: rotate(-45deg) scale(1.3);
        transform: rotate(-45deg) scale(1.3)
    }
    to {
        -webkit-transform: rotate(-45deg);
        transform: rotate(-45deg)
    }
}

@-webkit-keyframes preloader-text-1 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 1
    }
    22.5% {
        opacity: 1
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 0
    }
    47.5% {
        opacity: 0
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 0
    }
    72.5% {
        opacity: 0
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 0
    }
    97.5% {
        opacity: 0
    }
    to {
        opacity: 0
    }
}

@keyframes preloader-text-1 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 1
    }
    22.5% {
        opacity: 1
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 0
    }
    47.5% {
        opacity: 0
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 0
    }
    72.5% {
        opacity: 0
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 0
    }
    97.5% {
        opacity: 0
    }
    to {
        opacity: 0
    }
}

@-webkit-keyframes preloader-text-2 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 0
    }
    22.5% {
        opacity: 0
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 1
    }
    47.5% {
        opacity: 1
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 0
    }
    72.5% {
        opacity: 0
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 0
    }
    97.5% {
        opacity: 0
    }
    to {
        opacity: 0
    }
}

@keyframes preloader-text-2 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 0
    }
    22.5% {
        opacity: 0
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 1
    }
    47.5% {
        opacity: 1
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 0
    }
    72.5% {
        opacity: 0
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 0
    }
    97.5% {
        opacity: 0
    }
    to {
        opacity: 0
    }
}

@-webkit-keyframes preloader-text-3 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 0
    }
    22.5% {
        opacity: 0
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 0
    }
    47.5% {
        opacity: 0
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 1
    }
    72.5% {
        opacity: 1
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 0
    }
    97.5% {
        opacity: 0
    }
    to {
        opacity: 0
    }
}

@keyframes preloader-text-3 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 0
    }
    22.5% {
        opacity: 0
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 0
    }
    47.5% {
        opacity: 0
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 1
    }
    72.5% {
        opacity: 1
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 0
    }
    97.5% {
        opacity: 0
    }
    to {
        opacity: 0
    }
}

@-webkit-keyframes preloader-text-4 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 0
    }
    22.5% {
        opacity: 0
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 0
    }
    47.5% {
        opacity: 0
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 0
    }
    72.5% {
        opacity: 0
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 1
    }
    97.5% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes preloader-text-4 {
    0% {
        opacity: 0
    }
    2.5% {
        opacity: 0
    }
    12.5% {
        opacity: 0
    }
    22.5% {
        opacity: 0
    }
    27.5% {
        opacity: 0
    }
    37.5% {
        opacity: 0
    }
    47.5% {
        opacity: 0
    }
    52.5% {
        opacity: 0
    }
    62.5% {
        opacity: 0
    }
    72.5% {
        opacity: 0
    }
    77.5% {
        opacity: 0
    }
    87.5% {
        opacity: 1
    }
    97.5% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

.mobile-filter-nav {
    display: none;
    position: absolute;
    top: -55px;
    right: 40px
}

@media only screen and (max-width:1024px) {
    .mobile-filter-nav {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .mobile-filter-nav {
        top: -44px;
        right: 20px
    }
}

.mobile-filter-nav__button {
    background-color: transparent;
    border: none;
    outline: none;
    cursor: pointer;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    -webkit-transition-property: visibility, opacity;
    transition-property: visibility, opacity
}

.mobile-filter-nav__button_hidden {
    opacity: 0;
    visibility: hidden
}

.mobile-filter-nav__button_clear {
    border: 1px solid #d2d2d2;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    margin-right: 15px
}

.mobile-filter-nav__button_toggle .mobile-filter-nav__img {
    width: 32px;
    height: 22px
}

.form-info {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #fff;
    will-change: opacity;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    -webkit-transition-property: visibility, opacity;
    transition-property: visibility, opacity;
    z-index: 20
}

.form-info.active {
    visibility: visible;
    opacity: 1
}

.form-info__content {
    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;
    max-width: 950px;
    text-align: center;
    padding: 50px 20px
}

@media only screen and (max-width:1439px) {
    .form-info__content {
        max-width: 730px
    }
}

.form-info__logo {
    display: block;
    margin-bottom: 120px
}

@media only screen and (max-width:1439px) {
    .form-info__logo {
        margin-bottom: 80px
    }
}

.form-info__title {
    font-size: 60px;
    font-family: "Exo 2", sans-serif;
    line-height: 60px;
}

@media only screen and (max-width:1439px) {
    .form-info__title {
        font-size: 60px
    }
}

@media only screen and (max-width:767px) {
    .form-info__title {
        font-size: 40px;
        line-height: 1.1
    }
}

.form-info__title-red {
    color: red
}

.form-info__text {
    margin-top: 45px;
    font-size: 20px;
    line-height: 1.4
}

@media only screen and (max-width:1439px) {
    .form-info__text {
        margin-top: 40px;
        font-size: 18px
    }
}

@media only screen and (max-width:767px) {
    .form-info__text {
        margin-top: 35px;
        font-size: 16px
    }
}

.form-info__back {
    margin-top: 90px;
    background-color: transparent;
    border: none;
    outline: none;
    padding: 0 0 0 45px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    font-size: 16px;
    font-family: "Exo 2", sans-serif;
    color: #908f8f;
    position: relative;
    cursor: pointer;
    -webkit-transition: color .25s ease-in-out;
    transition: color .25s ease-in-out
}

@media only screen and (max-width:1439px) {
    .form-info__back {
        margin-top: 80px
    }
}

@media only screen and (max-width:767px) {
    .form-info__back {
        margin-top: 70px
    }
}

@media only screen and (min-width:1200px) {
    .form-info__back:hover {
        color: red
    }
    .form-info__back:hover:before {
        border-color: transparent red transparent transparent
    }
    .form-info__back:hover:after {
        background-color: red
    }
}

.form-info__back:before {
    left: 0;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 4px 7px 4px 0;
    border-color: transparent #908f8f transparent transparent;
    -webkit-transition: border-color .25s ease-in-out;
    transition: border-color .25s ease-in-out
}

.form-info__back:after,
.form-info__back:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%)
}

.form-info__back:after {
    width: 26px;
    height: 2px;
    background-color: #908f8f;
    left: 7px;
    -webkit-transition: background-color .25s ease-in-out;
    transition: background-color .25s ease-in-out
}

.form-info__try-again {
    margin-top: 90px;
    background-color: transparent;
    border: none;
    outline: none;
    font-size: 20px;
    font-family: "Exo 2", sans-serif;
    position: relative;
    cursor: pointer;
    padding: 0;
    -webkit-transition: color .25s ease-in-out;
    transition: color .25s ease-in-out
}

@media only screen and (max-width:1439px) {
    .form-info__try-again {
        margin-top: 80px
    }
}

@media only screen and (max-width:767px) {
    .form-info__try-again {
        margin-top: 70px
    }
}

@media only screen and (min-width:1200px) {
    .form-info__try-again:hover {
        color: red
    }
    .form-info__try-again:hover:before {
        background-color: red
    }
}

.form-info__try-again:before {
    content: "";
    display: block;
    position: absolute;
    bottom: 1px;
    left: 0;
    right: 0;
    height: 1px;
    background-color: #000;
    -webkit-transition: background-color .25s ease-in-out;
    transition: background-color .25s ease-in-out
}

.job-form .form-figure-inner:nth-child(2) .form-figure-input {
    width: calc(50% - 15px)
}

@media only screen and (max-width:1600px) {
    .job-form .form-figure-inner:nth-child(2) .form-figure-input {
        width: calc(50% - 10px)
    }
}

@media only screen and (max-width:1024px) {
    .job-form .form-figure-inner:nth-child(2) .form-figure-input {
        width: 100%
    }
}

.job-form .nice-select {
    padding-left: 25px
}

.to-top {
    position: fixed;
    bottom: 3px;
    right: 6px;
    z-index: 4;
    width: 90px;
    height: 90px;
    background-color: transparent;
    border: none;
    outline: none;
    padding: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    border-radius: 0;
    opacity: 0;
    visibility: hidden;
    cursor: pointer;
    will-change: opacity;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    -webkit-transition-property: opacity, visibility;
    transition-property: opacity, visibility;
    /*border: solid 3px red;
    border-right: 0;
    border-bottom: 0;*/
}

.to-top.visible {
    opacity: 1;
    visibility: visible
}

.to-top.end-page:before {
    background-color: transparent
}

@media only screen and (max-width:1600px) {
    .to-top {
        width: 80px;
        height: 80px
    }
}

@media only screen and (max-width:1366px) {
    .to-top {
        right: 40px;
        width: 70px;
        height: 70px
    }
}

@media only screen and (max-width:425px) and (orientation:portrait) {
    .to-top {
        right: 20px;
        width: 60px;
        height: 60px
    }
}

.to-top:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-color: #fff;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-transition: background-color .25s ease-in-out;
    transition: background-color .25s ease-in-out
}

.to-top svg {
    display: block;
    -webkit-transform: rotate(-90deg);
    transform: rotate(-90deg)
}

.to-top svg path {
    stroke: #000;
    stroke-width: 1px;
    fill-rule: evenodd;
    -webkit-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
    -webkit-transition-property: stroke, fill;
    transition-property: stroke, fill
}

@media only screen and (min-width:1200px) {
    .to-top:hover:before {
        background-color: red
    }
    .to-top:hover svg path {
        fill: #fff;
        stroke: #fff
    }
}


/** ADD ON **/


html:not(.touch-device), body:not(.is_mobile), body:not(.is_mobile) #app{height: 100vh;overflow: hidden;margin: 0 !important;}
/*#app{opacity: 0;z-index: 0;}*/
#ldr { position: fixed; display: block; width: 100%; height: 100%; top: 0; left: 0; z-index: 11; overflow: hidden;
    pointer-events: none; opacity: 1;
    -webkit-transition: transform .5s ease, opacity 0s ease .5s; transition: transform .5s ease, opacity 0s ease .5s; }
#ldr:before {content: ''; position: fixed; display: block; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; background: #fff; }
#ldr.ended { opacity: 0;
    -webkit-transform: translate3d(0,calc(-50vh + 80px),0); transform: translate3d(0,calc(-50vh + 80px),0); }
#ldr.ended:before { opacity: 0;}
#ldr.ended .ldr-inn { -webkit-transform: translate3d(0,0,0) scale(.145); transform: translate3d(0,0,0) scale(.145); }
#ldr ~ #app .header-logo { -webkit-transition: opacity 0s ease .5s; transition: opacity 0s ease .5s; }
#ldr:not(.ended) ~ #app .header-logo {opacity: 0;}
#ldr.ended ~ #app .header-logo {opacity: 1;}

#ldr .ldr-inn { position: fixed; display: block; width: 320px; height: 320px;z-index: 1;
    top: 0; left: 0; right: 0; bottom: 0; margin: auto; opacity: 0;
    -webkit-transition: transform .5s ease, opacity .4s ease; transition: transform .5s ease, opacity .4s ease;
}
#ldr .ldr-inn .inn-wr { position: absolute; display: block; width: 100%; height: 100%;
    top: 50%; left: 0; right: 0; margin: auto;
    -webkit-transform: translate3d(0,-90%,0); transform: translate3d(0,-90%,0);
    -webkit-transition: transform .4s ease, opacity .4s ease .4s; transition: transform .4s ease, opacity .4s ease .4s;
    border-radius: 50%; background: url('/images/logo-6.png') 50% 50% no-repeat; background-size: 108px;}
#ldr .ldr-inn .inn-wr span,
#ldr .ldr-inn .inn-wr:before,
#ldr .ldr-inn .inn-wr:after { content: 'BENNY LIVE'; position: absolute; display: block;
    top: 125%; left: -30%; right: -30%; margin: auto;
    font: 132px / 1.2 "Exo 2", sans-serif; text-align: center;}
#ldr .ldr-inn .inn-wr span {z-index: 0; color: #000; }
#ldr .ldr-inn.sfr .inn-wr span{z-index: 5;}
#ldr .ldr-inn .inn-wr:before {z-index: 2; color: #f00;
    -webkit-animation: glitch-text-red .65s infinite -.5s ease alternate-reverse; animation: glitch-text-red .65s infinite -.5s ease alternate-reverse; }
#ldr .ldr-inn .inn-wr:after {z-index: 1; color: #fff; display: none;
    /*-webkit-animation: glitch-text-white .95s infinite linear; animation: glitch-text-white .95s infinite linear;*/
}
#ldr .ldr-inn i { position: absolute; display: block; opacity: 1;
    top: 0; left: 0; right: 0; bottom: 0; margin: auto; overflow: hidden; clip: rect(0,0,0,0);
    border-radius: 50%; background-repeat: no-repeat; background-position: 50% 50%; background-size: 110px; }
#ldr .ldr-inn i { /*background-color: #f00;!**/ background-image: url('//images/logo-5.png');
    -webkit-animation: glitch-logo .85s infinite -.2s ease alternate; animation: glitch-logo .85s infinite -.2s ease alternate; }

#ldr .ldr-inn i:nth-child(1):before{  -webkit-animation-delay: -0.37s; animation-delay: -0.37s; }
#ldr .ldr-inn i:nth-child(1):after{  -webkit-animation-delay: -0.18s; animation-delay: -0.18s; }
#ldr .ldr-inn i:nth-child(2):before{  -webkit-animation-delay: -0.46s; animation-delay: -0.46s; }
#ldr .ldr-inn i:nth-child(2):after{  -webkit-animation-delay: -0.59s; animation-delay: -0.59s; }
#ldr .ldr-inn i:nth-child(3):before{  -webkit-animation-delay: -0.75s; animation-delay: -0.75s; }
#ldr .ldr-inn i:nth-child(3):after{  -webkit-animation-delay: -0.81s; animation-delay: -0.81s; }

@-webkit-keyframes glitch-text-white {
    00.0% { clip: rect(160px, 512px, 160px, 0); }
    00.1% { clip: rect(16px, 512px, 42px, 0); }

    8.0% { clip: rect(16px, 512px, 42px, 0); }
    8.1% { clip: rect(35px, 512px, 95px, 0); }

    21.0% { clip: rect(35px, 512px, 95px, 0); }
    21.1% { clip: rect(100px, 512px, 110px, 0); }

    27.0% { clip: rect(100px, 512px, 110px, 0); }
    27.1% { clip: rect(62px, 512px, 65px, 0); }

    43.0% { clip: rect(62px, 512px, 65px, 0); }
    43.1% { clip: rect(25px, 512px, 35px, 0); }

    50.0% { clip: rect(25px, 512px, 35px, 0); }
    50.1% { clip: rect(115px, 512px, 125px, 0); }

    57.0% { clip: rect(115px, 512px, 125px, 0); }
    57.1% { clip: rect(95px, 512px, 105px, 0); }

    63.0% { clip: rect(95px, 512px, 105px, 0); }
    63.1% { clip: rect(72px, 512px, 78px, 0); }

    72.0% { clip: rect(72px, 512px, 78px, 0); }
    72.1% { clip: rect(41px, 512px, 63px, 0); }

    80.0% { clip: rect(41px, 512px, 63px, 0); }
    80.1% { clip: rect(120px, 512px, 135px, 0); }

    90.0% { clip: rect(120px, 512px, 135px, 0); }
    90.1% { clip: rect(131px, 512px, 145px, 0); }

    99.9% { clip: rect(131px, 512px, 145px, 0); }
    100% { clip: rect(160px, 512px, 160px, 0); }
}
@keyframes  glitch-text-white {
    /*/ cli( y1 , x2 , y2 , x1 ) /*/
    00.0% { clip: rect(160px, 512px, 160px, 0); }
    00.1% { clip: rect(16px, 512px, 42px, 0); }

    8.0% { clip: rect(16px, 512px, 42px, 0); }
    8.1% { clip: rect(35px, 512px, 95px, 0); }

    21.0% { clip: rect(35px, 512px, 95px, 0); }
    21.1% { clip: rect(100px, 512px, 110px, 0); }

    27.0% { clip: rect(100px, 512px, 110px, 0); }
    27.1% { clip: rect(62px, 512px, 65px, 0); }

    43.0% { clip: rect(62px, 512px, 65px, 0); }
    43.1% { clip: rect(25px, 512px, 35px, 0); }

    50.0% { clip: rect(25px, 512px, 35px, 0); }
    50.1% { clip: rect(115px, 512px, 125px, 0); }

    57.0% { clip: rect(115px, 512px, 125px, 0); }
    57.1% { clip: rect(95px, 512px, 105px, 0); }

    63.0% { clip: rect(95px, 512px, 105px, 0); }
    63.1% { clip: rect(72px, 512px, 78px, 0); }

    72.0% { clip: rect(72px, 512px, 78px, 0); }
    72.1% { clip: rect(41px, 512px, 63px, 0); }

    80.0% { clip: rect(41px, 512px, 63px, 0); }
    80.1% { clip: rect(120px, 512px, 135px, 0); }

    90.0% { clip: rect(120px, 512px, 135px, 0); }
    90.1% { clip: rect(131px, 512px, 145px, 0); }

    99.9% { clip: rect(131px, 512px, 145px, 0); }
    100% { clip: rect(160px, 512px, 160px, 0); }
}
@-webkit-keyframes glitch-text-red {
    /*/ cli( y1 , x2 , y2 , x1 ) /*/
    00.0% { clip: rect(160px, 512px, 160px, 0); }

    00.1% { clip: rect(16px, 512px, 54px, 0); }
    10.0% { clip: rect(16px, 512px, 54px, 0); }

    10.1% { clip: rect(35px, 512px, 85px, 0); }
    16.0% { clip: rect(35px, 512px, 85px, 0); }

    20.1% { clip: rect(100px, 512px, 110px, 0); }
    30.0% { clip: rect(100px, 512px, 110px, 0); -webkit-transform: translate(0,0); }

    30.1% { clip: rect(62px, 512px, 65px, 0); -webkit-transform: translate(0,0) scaleX(1.05); }
    40.0% { clip: rect(62px, 512px, 65px, 0); -webkit-transform: translate(0,0); }

    40.1% { clip: rect(25px, 512px, 35px, 0); }
    50.0% { clip: rect(25px, 512px, 35px, 0); }

    50.1% { clip: rect(115px, 512px, 125px, 0); }
    60.0% { clip: rect(115px, 512px, 125px, 0); -webkit-transform: translate(0,0); }

    60.1% { clip: rect(35px, 512px, 39px, 0); -webkit-transform: translate(-5px,0); }
    64.0% { clip: rect(35px, 512px, 39px, 0); -webkit-transform: translate(0,0); }

    65.0% { clip: rect(15px, 512px, 105px, 0); -webkit-transform: translate(10px,-5px) scale(.95,0.9) skewX(-20deg); }
    70.0% { clip: rect(15px, 512px, 105px, 0); -webkit-transform: translate(6px,0px) skewX(-20deg); }

    70.1% { clip: rect(95px, 512px, 125px, 0); }
    78.0% { clip: rect(95px, 512px, 125px, 0); -webkit-transform: translate(6px,0px) skewX(-20deg); }

    79.0% { clip: rect(47px, 512px, 61px, 0); -webkit-transform: translate(10px,-5px) scale(.95,0.9) skewX(-20deg); }
    80.0% { clip: rect(72px, 512px, 78px, 0); -webkit-transform: translate(0,0); }

    80.1% { clip: rect(120px, 512px, 135px, 0); }
    84.0% { clip: rect(120px, 512px, 135px, 0); -webkit-transform: translate(0,0); }

    86.0% { clip: rect(145px, 512px, 160px, 0); -webkit-transform: translate(0,5px) scaleY(1.05); }
    90.0% { clip: rect(145px, 512px, 160px, 0); }

    90.1% { clip: rect(131px, 512px, 145px, 0); }
    99.9% { clip: rect(131px, 512px, 145px, 0); -webkit-transform: translate(0,5px) scaleY(1.05); }

    100% { clip: rect(160px, 512px, 160px, 0); -webkit-transform: translate(0,0); }
}
@keyframes  glitch-text-red {
    /*/ cli( y1 , x2 , y2 , x1 ) /*/
    00.0% { clip: rect(160px, 512px, 160px, 0); }

    00.1% { clip: rect(16px, 512px, 54px, 0); }
    10.0% { clip: rect(16px, 512px, 54px, 0); }

    10.1% { clip: rect(35px, 512px, 85px, 0); }
    16.0% { clip: rect(35px, 512px, 85px, 0); }

    20.1% { clip: rect(100px, 512px, 110px, 0); }
    30.0% { clip: rect(100px, 512px, 110px, 0); transform: translate(0,0); }

    30.1% { clip: rect(62px, 512px, 65px, 0); transform: translate(0,0) scaleX(1.05); }
    40.0% { clip: rect(62px, 512px, 65px, 0); transform: translate(0,0); }

    40.1% { clip: rect(25px, 512px, 35px, 0); }
    50.0% { clip: rect(25px, 512px, 35px, 0); }

    50.1% { clip: rect(115px, 512px, 125px, 0); }
    60.0% { clip: rect(115px, 512px, 125px, 0); transform: translate(0,0); }

    60.1% { clip: rect(35px, 512px, 39px, 0); transform: translate(-5px,0); }
    64.0% { clip: rect(35px, 512px, 39px, 0); transform: translate(0,0); }

    65.0% { clip: rect(15px, 512px, 105px, 0); transform: translate(10px,-5px) scale(.95,0.9) skewX(-20deg); }
    70.0% { clip: rect(15px, 512px, 105px, 0); transform: translate(6px,0px) skewX(-20deg); }

    70.1% { clip: rect(95px, 512px, 125px, 0); }
    78.0% { clip: rect(95px, 512px, 125px, 0); transform: translate(6px,0px) skewX(-20deg); }

    79.0% { clip: rect(47px, 512px, 61px, 0); transform: translate(10px,-5px) scale(.95,0.9) skewX(-20deg); }
    80.0% { clip: rect(72px, 512px, 78px, 0); transform: translate(0,0); }

    80.1% { clip: rect(120px, 512px, 135px, 0); }
    84.0% { clip: rect(120px, 512px, 135px, 0); transform: translate(0,0); }

    86.0% { clip: rect(145px, 512px, 160px, 0); transform: translate(0,5px) scaleY(1.05); }
    90.0% { clip: rect(145px, 512px, 160px, 0); }

    90.1% { clip: rect(131px, 512px, 145px, 0); }
    99.9% { clip: rect(131px, 512px, 145px, 0); transform: translate(0,5px) scaleY(1.05); }

    100% { clip: rect(160px, 512px, 160px, 0); transform: translate(0,0); }
}
@-webkit-keyframes glitch-logo {
    05.0% { clip: rect(88px, 325px, 141px, 0); }

    05.1% { clip: rect(0px, 325px, 53px, 0); }
    15.0% { clip: rect(0px, 325px, 53px, 0); -webkit-transform: scaleX(1); }

    15.1% { clip: rect(0px, 325px, 192px, 0); -webkit-transform: translate3d(-4px,-4px,0) scaleX(1.03); }
    25.0% { clip: rect(0px, 325px, 192px, 0); -webkit-transform: scaleX(1); }

    25.1% { clip: rect(32px, 325px, 78px, 0); }
    35.0% { clip: rect(32px, 325px, 78px, 0); }

    35.1% { clip: rect(253px, 325px, 292px, 0); }
    45.0% { clip: rect(253px, 325px, 292px, 0); }

    45.1% { clip: rect(83px, 325px, 291px, 0); }
    65.0% { clip: rect(83px, 325px, 291px, 0); }

    65.1% { clip: rect(43px, 325px, 59px, 0); }
    70.0% { clip: rect(43px, 325px, 59px, 0); }

    70.1% { clip: rect(235px, 325px, 325px, 0); -webkit-transform: scaleX(1); }
    75.0% { clip: rect(235px, 325px, 325px, 0); -webkit-transform: translate3d(5px,2px,0) scaleX(.95); }

    75.1% { clip: rect(152px, 325px, 176px, 0); -webkit-transform: scaleX(1); }
    80.0% { clip: rect(152px, 325px, 176px, 0); }

    80.1% { clip: rect(137px, 325px, 228px, 0); }
    85.0% { clip: rect(137px, 325px, 228px, 0); }

    85.1% { clip: rect(73px, 325px, 131px, 0); }
    95.0% { clip: rect(73px, 325px, 131px, 0); }

    90.2% { clip: rect(222px, 325px, 233px, 0); }
    99.9% { clip: rect(222px, 325px, 233px, 0); }

    100% { clip: rect(88px, 325px, 141px, 0); }
}
@keyframes  glitch-logo {
    05.0% { clip: rect(88px, 325px, 141px, 0); }

    05.1% { clip: rect(0px, 325px, 53px, 0); }
    15.0% { clip: rect(0px, 325px, 53px, 0); transform: scaleX(1); }

    15.1% { clip: rect(0px, 325px, 192px, 0); transform: translate3d(-4px,-4px,0) scaleX(1.03); }
    25.0% { clip: rect(0px, 325px, 192px, 0); transform: scaleX(1); }

    25.1% { clip: rect(32px, 325px, 78px, 0); }
    35.0% { clip: rect(32px, 325px, 78px, 0); }

    35.1% { clip: rect(253px, 325px, 292px, 0); }
    45.0% { clip: rect(253px, 325px, 292px, 0); }

    45.1% { clip: rect(83px, 325px, 291px, 0); }
    65.0% { clip: rect(83px, 325px, 291px, 0); }

    65.1% { clip: rect(43px, 325px, 59px, 0); }
    70.0% { clip: rect(43px, 325px, 59px, 0); }

    70.1% { clip: rect(235px, 325px, 325px, 0); transform: scaleX(1); }
    75.0% { clip: rect(235px, 325px, 325px, 0); transform: translate3d(5px,2px,0) scaleX(.95); }

    75.1% { clip: rect(152px, 325px, 176px, 0); transform: scaleX(1); }
    80.0% { clip: rect(152px, 325px, 176px, 0); }

    80.1% { clip: rect(137px, 325px, 228px, 0); }
    85.0% { clip: rect(137px, 325px, 228px, 0); }

    85.1% { clip: rect(73px, 325px, 131px, 0); }
    95.0% { clip: rect(73px, 325px, 131px, 0); }

    90.2% { clip: rect(222px, 325px, 233px, 0); }
    99.9% { clip: rect(222px, 325px, 233px, 0); }

    100% { clip: rect(88px, 325px, 141px, 0); }
}

#ldr .ldr-txt{ position: absolute; display: block; width: 100%; height: 100%; left: 0; top: 0;}
#ldr .ldr-txt span { position: absolute; display: block; width: 80%; height: 100%; opacity: 0;
    left: -50%; right: -50%; top: -50%; bottom: -50%; margin: auto;
    font: 10vw / 1.2 "Exo 2", sans-serif; color: #fff; text-align: center;
}
#ldr .ldr-txt span svg{ position: absolute; display: block; width: 100%; height: 100%; top: 0; left: 0;}
#ldr .ldr-txt span.red{ color: #f00;}
#ldr .ldr-txt span.red svg{ fill: #f00;}
#ldr .ldr-txt span.black{ color: #000;}
#ldr .ldr-txt span.black svg{ fill: #000;}
#ldr .ldr-txt span.grey{ color: #aaa;}
#ldr .ldr-txt span.grey svg{ fill: #aaa;}

@media  only screen and (max-width: 1600px){
    #ldr.ended {transform: translate3d(0,calc(-50vh + 74px),0);}
}
@media  only screen and (max-width: 1366px){
    #ldr .ldr-inn .inn-wr span,
    #ldr .ldr-inn .inn-wr:before,
    #ldr .ldr-inn .inn-wr:after{font-size: 148px; top: 120%;}
    #ldr.ended .ldr-inn { transform: translate3d(0,0,0) scale(.13);}
    #ldr.ended {transform: translate3d(0,calc(-50vh + 68px),0);}
}
@media  only screen and (max-width: 425px) and (orientation: portrait){
    #ldr .ldr-inn{transform: scale(.5);}
    #ldr.ended {transform: translate3d(0,calc(-50vh + 50px),0);}

}
@media  only screen and (max-height: 425px) and (orientation: landscape){
    #ldr .ldr-inn .inn-wr{transform: translate3d(0,-50%,0);}
    #ldr.ended {transform: translate3d(0,calc(-50vh + 42px),0)}
    #ldr.ended .ldr-inn { transform: translate3d(0,0,0) scale(.128);}
}

.header-logo-icon {
    height: auto;
    width: 75px;
}
.is_mobile .header-logo-icon {
    width: 55px;
}

.header-logo-icon img {
    -o-object-fit: contain;
    object-fit: contain;
}

#header {
    background: #FFF;
    border-top: solid 3px #d60202;
    border-bottom: 0;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);

}
.scrollbar-thumb {
    background: #121212 !important;
}
#app {
    /*border: solid 3px #d60202;*/
}

.unit-container[data-page=static] {
    padding-bottom: 0px;
}

html.touch-device, body.is_mobile,  body.is_mobile #app {
    overflow: auto !important;
}


#form, #menu, #showreel {
    opacity: 0
}

.form-info {
    opacity: 0;
    visibility: hidden
}

.preloader__text {
    font-family: "Exo 2", sans-serif;
    font-size: 11px;
    color: #000;
}

.notif--error {
    background: red;
}

.text_red {
    color: red;
}

.text_green {
    color: green;
}


.submit_request_from_static.branding {
    background: #FFF;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.9);
}

.contact_static #form {
    display: block;
    opacity: 1;
    position: revert;
}

.contact_static #form,.contact_static #form * {
    z-index: auto;
}


/** BUY TICKETS **/
.route_buy .rbt-purchase {
    display: none !important;
}
.rbt-theme-dropdown,
.rbt-purchase {
    line-height: 42px;
    font-family: 'Heebo', sans-serif;
    display: block;
    width: 115px;
    -webkit-transform: translateX(100%);
    transform: translateX(100%);
    -webkit-transition: all .25s cubic-bezier(0.23, 1, 0.32, 1) .45s;
    transition: all .25s cubic-bezier(0.23, 1, 0.32, 1) .45s;
}

.rbt-loaded .rbt-theme-dropdown,
.rbt-loaded .rbt-purchase{
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.rbt-active .rbt-theme-dropdown,
.rbt-active .rbt-purchase {
    -webkit-transition: all .2s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all .2s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transform: translateX(73px);
    transform: translateX(73px);
}

.rbt-scrolled .rbt-theme-dropdown,
.rbt-scrolled .rbt-purchase {
    -webkit-transition: all .2s cubic-bezier(0.23, 1, 0.32, 1);
    transition: all .2s cubic-bezier(0.23, 1, 0.32, 1);
    -webkit-transform: translateX(73px);
    transform: translateX(73px);
}

.rbt-purchase {
    position: fixed;
    /*right: 135px;*/
    right: -100px;
    width: 135px;
    z-index: 6669992;
    font-size: 10px !important;
    letter-spacing: .11em;
    display: block;
    height: 42px;
    top: calc(50% - 40px);
    background-color: #fff;
    box-shadow: 0 0 9.8px 0.2px rgba(0, 0, 0, 0.3);
    font-weight: bold;
    font-family: 'Exo 2', sans-serif;
}
.page-loaded .rbt-purchase {
    right: 40px;
}
.rbt-purchase:hover {
    right: 135px !important;
}

.rbt-theme-dropdown {
    background-color: #ef2853;
}

.rbt-theme-dropdown .rbt-icon svg {
    transition: opacity .1s ease;
}


.rbt-theme-dropdown .rbt-icon svg:nth-child(2){
    opacity:0;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

.rbt-active .rbt-theme-dropdown .rbt-icon svg:nth-child(1) {
    opacity: 0;
    transition-delay: .2s;
}

.rbt-active .rbt-theme-dropdown .rbt-icon svg:nth-child(2) {
    opacity: 1;
    transition-delay: .3s;
}

.rbt-theme-dropdown .rbt-btn,
.rbt-purchase a {
    position: relative;
    display: block;
    cursor: pointer;
    font-size: 0 !important;
    line-height: 42px !important;
    font-weight: 500;
}

span.rbt-icon {
    color: #fff;
    width: 42px;
    display: inline-block;
    line-height: 1 !important;
    text-align: center;
    vertical-align: middle;
    position: relative;
}

span.rbt-purchase-text,
span.rbt-text-name {
    line-height: 1 !important;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
}

.rbt-active .rbt-purchase-text,
.rbt-active .rbt-text-name {
    opacity: 0;
    -webkit-transition: opacity .1s;
    transition: opacity .1s;
}

span.rbt-purchase-text {
    color: #000;
    font-size: 10px !important;    line-height: 1 !important;
    display: inline-block;
    vertical-align: middle;
    -webkit-transform: translateY(1px);
    transform: translateY(1px);
    font-weight: bold;
}

span.rbt-text-name {
    color: #fff;
    font-size: 10px !important;
    letter-spacing: .11em !important;
}

.rbt-list-holder {
    display: block;
    height: 100%;
    overflow: hidden;
    position: relative;
    z-index: 6669993;
    background-color: #fff;
}

.rbt-list {
    height: calc(100% - 40px - 11px);
    font-weight: 400;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 13px 29px;
    box-sizing: border-box;
    background-color: #fff;
    margin-right: -18px;
}


@media screen and (max-width: 500px) {
    .hide_mobile {
        display: none !important;
    }
}
.__mt {
    margin-top: 30px;
}
/* GIFT SECTION */
.gift_cards {
    /*width: 100%;
    min-height: 100vh;*/
    padding: 0;
    justify-content: center;
    /*align-items: start;
    flex-wrap: wrap;
    display: flex;*/
    font-family: "Exo 2", sans-serif;
    /*background-color: rgb(249, 250, 251);*/
    padding-bottom: 40px;
    border-bottom: solid 1px #CCC;
}
.gift_card {
    transition-duration: .1s;
    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms;

    --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --tw-ring-offset-shadow: 0 0 #0000;
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
    position: relative;
    max-width: 100%;
    height: 5rem;
    align-items: center;
    display: flex;
    border-radius: 0;
    background-color: rgba(255,255,255,1);
    flex: auto;
    /*margin: 0 30px;*/
}
.gift_card.error {
    box-shadow: 0 10px 15px -3px rgb(254 19 19 / 10%),0 4px 6px -2px rgba(0, 0, 0, 0.25);
}
.gift_card .claim:hover {
    background: #00bcd4;
}
.gift_card .claim {
    transition-duration: .1s;
    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms;
    margin-left: auto;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 30px;
    background: #0372a4;
    color: #FFF;
    text-decoration: none;
    font-size: 14px;
    /*border-left: solid 1px #4a4b4a;*/
}
.gift_card i.e {
    font-size: 16px;
    color: #333;
}
.gift_card .notif__actions .darker {
    background: rgb(139 2 2);
}
.gift_card .notif__actions {
    background: rgb(167 0 0);
    /*border-left: solid 1px #5e0000;*/
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.gift_card .error-msg {
    transition-duration: .1s;
    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms;
    margin-left: auto;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #A20000;
    text-decoration: none;
    font-size: 12px;
    /*border-left: solid 1px #4a4b4a;*/
}
.gift_card .error-msg span {
    padding-right: 30px;
}
.gift_card img.rounded-full{
    width: 3rem;
    height: 3rem;
    border-radius: 9999px;
    max-width: 100%;
    border-style: none;
    margin-left: 10px;
}
.gift_card p.ml-4 strong{
    font-weight: bold;
}
.gift_card p.ml-4{
    margin: 0;
    margin-left: 1rem;
}
.gift_card.error .gift_box_icon,
.gift_card.processing .gift_box_icon{
    display: none;
}
.gift_card .gift_box_icon{
    width: 2rem;
    --tw-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);
    box-shadow: var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);
    top: -8px;
    right: -8px;
    position: absolute;
    margin-right: -.25rem;
    margin-top: -.25rem;
    height: 2rem;
    justify-content: center;
    align-items: center;
    display: flex;
    border-radius: 9999px;
    /*background-color: rgba(167,139,250, 1);*/
    background-color: #FFF;
}
.gift_card .gift_box_icon svg{
    width: 1.25rem;
    height: 1.25rem;
    fill: #ff2a2a;
    display: block;
    vertical-align: middle;
    overflow: hidden;
}

.__processingBackDrop {
    transition-duration: .1s;
    transition-property: background-color,border-color,color,fill,stroke,opacity,box-shadow,transform;
    transition-timing-function: cubic-bezier(.4,0,.2,1);
    transition-duration: 150ms;
    border-radius: 0px;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #DDD;
    display: none;
    flex: 1;
}

.processing  .__processingBackDrop .spinner i,
.__processingBackDrop._show .spinner i {
    font-size: 30px;
    color: #c0c0c0;
}

.processing  .__processingBackDrop .spinner {
    width: 50px;
    height: 50px;
    text-align: center;
    display: block;
    margin: auto auto;
    margin-top: 25px;
}
.processing  .__processingBackDrop {
    display: block;
    opacity: .60;
}

.route_gifts .section-define-title h2 {
    font-size: 20px;
}



/* GROWL ALERT */
.growl-alert-container {
    font-family: "Exo 2", sans-serif;
    display: none;
    font-style: normal;
    font-stretch: normal;
    line-height: normal;
    letter-spacing: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}


.growl-alert-container {
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    -ms-border-radius: 0px;
    border-radius: 0px;
    box-shadow: 0 0 10px rgb(0 0 0 / 50%);
}

.growl-alert-container {
    background-color: #0372a4;
    color: #f8f8f8;
    position: absolute;
    top: -60px;
    left: 2%;
    width: 50%;
    margin: 0 25% 0 25%;
}
.growl-alert-container .growl-alert {
    text-align: center;
    padding: 17px 0 20px 0;
    margin: 0 25% 0 25%;
    font-size: 14px;
}


@media screen and (max-width: 500px) {
    .growl-alert-container {
        top: -100px;
        left: 0;
        width: 100%;
        margin: 0;
    }

    .growl-alert-container .growl-alert {
        margin: 0;
    }
    .route_gifts .rbt-purchase {
        display: none;
    }
    .gift_card .claim {
        padding: 0 10px;
        font-size: 11px;
        line-height: 11px;
        min-width: 120px;
    }

    .gift_card.error p.ml-4 {
        display: none !important;
    }
    .gift_card .error-msg span {
        text-align: center;
    }
    .gift_card .error-msg span,
    .gift_card p.ml-4 {
        margin-left: 1rem!important;
        margin-right: 1rem!important;
        font-size: 12px;
        line-height: 12px;
    }
}



/** TEST **/

.folder {
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    overflow: hidden;
    width: 100%;
    margin: 0 auto;
}
.folder-content .resend{
    color:#00bcd4;
    text-decoration: none;
}
.folder-content small{
    padding-bottom: 8px;
    display: block;
    font-size: 11px;
}
.folder-content {
    margin-left: 0;
    padding-left: 0;
    overflow: auto;
}
.shared-user {
    align-items: center;
    color: #6a696a;
    display: inline-flex;
    font-weight: 500;
    margin-left: 5px;
    outline: none;
    text-decoration: none;
}
.shared-user__avatar {
    width: 15px;
    height: 15px;
    margin-right: 3px;
}

.folder-summary {
    padding: 15px 20px 15px 15px;
    cursor: pointer;
    display: flex;
    line-height: 1;
    height: 80px;
    position: relative;
}
.folder-summary__start {
    position: relative;
}
.folder-summary__file-count {
    position: absolute;
    top: -3px;
}
.folder-summary__file-count__amount {
    color: #ffffff;
    font-size: 12px;
    left: 50%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
}
.folder-summary__file-count svg {
    color: #5166fa;
    height: 30px;
    width: auto;
}
.folder-summary__details {
    padding: 2px 0 0 13px;
}
.folder-summary__details__name {
    color: #393738;
    font-size: 20px;
    font-weight: 500;
}
.folder-summary__details__share {
    align-items: center;
    color: #b5b4b5;
    display: flex;
    font-size: 12px;
    margin-top: 8px;
}
.folder-summary__end {
    margin-left: auto;
}
.folder-summary__end svg {
    fill: #c3c2c3;
}
.folder-summary::after {
    /*background: #e6e6e6;*/
    bottom: -2px;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
}

.folder-collapse-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: transparent;
    border-radius: 30px;
    border: 0;
    cursor: pointer;
    height: 30px;
    opacity: 0;
    outline: none;
    position: absolute;
    position: relative;
    width: 30px;
    z-index: 1;
}
.folder-collapse-button::after {
    background: #efeff0;
    border-radius: 40px;
    content: "";
    height: 35px;
    left: 50%;
    opacity: 0;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    transition: all 0.2s ease-out;
    width: 35px;
}
.folder-collapse-button:hover::after {
    opacity: 1;
}
.folder-collapse-button svg {
    color: #9c9c9e;
    left: 50%;
    position: absolute;
    stroke-width: 3;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.folder-item {
    align-items: flex-start;
    display: flex;
    height: 80px;
    line-height: 1;
    opacity: 0;
    padding: 20px 25px;
    position: relative;
}
.folder-item__icon svg {
    display: block;
    height: 40px;
    width: auto;
}
.folder-item__icon img {
    border-radius: 9999px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}
.folder-item__details .error-msg{
    font-size: 11px !important;
    display: block;
    margin-bottom: 5px;
}
.folder-item__details {
    padding: 1px 0 0 25px;
    flex: 1;
}
.folder-item__details__name span.badge {
    padding: 5px;
    font-size: 8.5px;
    margin-right: 6px;
}
.folder-item__details__name {
    color: #393738;
    font-size: 12px;
    font-weight: 500;
    position: relative;
    text-transform: uppercase;
    font-weight: bold;
}
.folder-item__details__name svg {
    height: auto;
    position: absolute;
    top: 7px;
    transform: translate(5px, calc(-50% + 1px));
    width: 20px;
}
.uppercase {
   text-transform: uppercase;
}
.folder-item__details__date {
    color: #b5b4b5;
    font-size: 11px;
    margin-top: 8px;
}
.folder-item__size {
    color: #6a696a;
    font-weight: 500;
    margin-left: auto;
    margin-top: 2px;
}
.folder-item__size a.cancel {
    font-size: 9px;
    text-transform: uppercase;
}
.folder-item:not(:last-child):not(:first-child)::after {
    background: #edecee;
    bottom: 0;
    content: "";
    height: 1px;
    left: 0px;
    position: absolute;
    right: 0;
}


.clear {
    display: block;
    height: 50px;
    width: 100%;
    clear: both;
}


/* EMAIL INPUT */
.email-input {
    --text: #646B8C;
    --text-placeholder: #BBC1E1;
    --icon: #A6ACCD;
    --icon-focus: #646B8C;
    --icon-invalid: #F04949;
    --icon-valid: #16BF78;
    --background: #FFF;
    --border: #D1D6EE;
    --border-hover: #A6ACCD;
    --border-focus: #0180e5;
    --shadow-focus: rgba(39, 94, 254, 0.32);
    position: relative;
    max-width: 450px;
}
.email-folder-input button {
    position: absolute;
    left: 450px;
    top: -5px;
    height: 44px;
    border-radius: 0;
}
.folder-item:first-child {
    height: 140px;
}
.align-center {
    display: block;
    text-align: center;
    width: 100%;
    padding: 0 15px;
}
@media screen and (max-width: 500px) {
    .folder-item:first-child {
        height: 140px;
    }

    .email-folder-input button {
        position: unset;
        width: 100%;
    }
}

.email-folder-input {
    padding-left: 0px;
    /*background: #EEE;
    border-top: solid 1px #CCC;
    border-bottom: solid 1px #CCC;*/
}
.email-input input:focus + svg {
    --i: var(--border-focus);
}
.email-input input {
    width: 100%;
    -webkit-appearance: none;
    outline: none;
    display: block;
    font-size: 14px;
    font-family: inherit;
    margin: 0;
    padding: 8px 16px 8px 41px;
    line-height: 26px;
    border-radius: 0px;
    color: var(--text);
    border: 1px solid var(--bc, var(--border));
    background: var(--background);
    transition: border-color 0.3s, box-shadow 0.3s;
}
.email-input input::-moz-placeholder {
    color: var(--text-placeholder);
}
.email-input input:-ms-input-placeholder {
    color: var(--text-placeholder);
}
.email-input input::placeholder {
    color: var(--text-placeholder);
}
.email-input svg {
    width: 16px;
    height: 16px;
    top: 14px;
    left: 14px;
    display: block;
    position: absolute;
    fill: none;
    stroke: var(--i, var(--icon));
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-width: 1.6;
    transition: stroke 0.3s;
}
.email-input svg path {
    stroke-dasharray: 80;
    stroke-dashoffset: var(--path, 170);
    transition: stroke-dashoffset 0.5s ease var(--path-delay, 0.3s);
}
.email-input svg polyline {
    stroke-dasharray: 12;
    stroke-dashoffset: var(--tick, 12);
    transition: stroke-dashoffset 0.45s ease var(--tick-delay, 0s);
}
.email-input:hover {
    --bc: var(--border-hover);
}
.email-input:focus-within {
    --bc: var(--border-focus);
    --i: var(--icon-focus);
}
.email-input:focus-within input {
    box-shadow: 0 1px 6px -1px var(--shadow-focus);
}
/*.email-input:not(.valid) input {
    border: solid 1px var(--icon-invalid);
}*/
.email-input:not(.valid) input:not(:-moz-placeholder-shown):not(:focus) + svg {
    --i: var(--icon-invalid);
}
.email-input:not(.valid) input:not(:-ms-input-placeholder):not(:focus) + svg {
    --i: var(--icon-invalid);
}
.email-input:not(.valid) input:not(:placeholder-shown):not(:focus) + svg {
    --i: var(--icon-invalid);
}
.email-input:not(.valid) input:not(:placeholder-shown):not(:focus) {
    border: solid 1px var(--icon-invalid);
}
.email-input.valid + svg{
    --i: var(--icon-valid);
}
.email-input.valid input{
    border: solid 1px var(--icon-valid);
    /*color: var(--icon-valid);*/
}
.email-input.valid {
    --i: var(--icon-valid);
    --path: 132;
    --path-delay: 0s;
    --tick: 0;
    --tick-delay: .3s;
}
/*

.pulse-badge {
    position: absolute;
    top: -6px;
    right: -6px;
}
.pulse-orbit {
    position: absolute;
    top: -11px;
    right: -10px;
    height: 32px;
    width: 32px;
    z-index: 10;
    border: 1px solid green;
    border-radius: 70px;
    animation: pulse 1s ease-out infinite;
}

.pulse-nucleus {
    position: absolute;
    top: -0px;
    right: 1px;
    height: 18px;
    width: 18px;
    border-radius: 50%;
    background: green;
    font-size: 11px;
    color: white;
    text-align: center;
    line-height:18px;
}


@keyframes pulse {
    0% {
        -webkit-transform: scale(0);
        opacity: 0.0;
    }

    25% {
        -webkit-transform: scale(0.1);
        opacity: 0.1;
    }

    50% {
        -webkit-transform: scale(0.3);
        opacity: 0.3;
    }

    75% {
        -webkit-transform: scale(0.5);
        opacity: 0.5;
    }

    100% {
        -webkit-transform: scale(1);
        opacity: 0.0;
    }
}
*/

/* pulse in CSS */
.pulsating-circle {
    position: absolute;
    left: 38px;
    top: 4px;
    transform: translateX(-50%) translateY(-50%);
    width: 20px;
    height: 20px;
}
.pulsating-circle:before {
    content: "";
    position: relative;
    display: block;
    width: 300%;
    height: 300%;
    box-sizing: border-box;
    margin-left: -100%;
    margin-top: -100%;
    border-radius: 45px;
    background-color: #00bcd4;
    -webkit-animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
    animation: pulse-ring 1.25s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
}
.pulsating-circle:after {
    font-family: "Font Awesome 5 Pro";
    content: "\f058";
    position: absolute;
    color: #FFF;
    font-size: 14px;
    line-height: 20px;
    font-weight: normal;
    text-align: center;
    left: 0;
    top: 0;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #00bcd4;
    border-radius: 15px;
    box-shadow: 0 0 8px rgba(0, 0, 0, 0.3);
    -webkit-animation: pulse-dot 1.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) -0.4s infinite;
    animation: pulse-dot 1.25s cubic-bezier(0.455, 0.03, 0.515, 0.955) -0.4s infinite;
}
.pulsating-circle {display: none}
.notify .pulsating-circle {display: block;}
@-webkit-keyframes pulse-ring {
    0% {
        transform: scale(0.33);
    }
    80%, 100% {
        opacity: 0;
    }
}

@keyframes pulse-ring {
    0% {
        transform: scale(0.33);
    }
    80%, 100% {
        opacity: 0;
    }
}
@-webkit-keyframes pulse-dot {
    0% {
        transform: scale(0.8);
    }
    50% {
        transform: scale(1);
    }
    100% {
        transform: scale(0.8);
    }
}
@keyframes pulse-dot {
    0% {
        transform: scale(0.8);
    }
    50% {
        transform: scale(1);
    }
    100% {
        transform: scale(0.8);
    }
}