.main__section {
    height: calc(100vh - 5.72917vw);
    margin: 0 auto;
    max-height: 1080px;
    overflow: hidden;
    width: 100%
}

@media screen and (min-width: 1921px) {
    .main__section {
        height: calc(100vh - 90px)
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .main__section {
        height: auto
    }
}

@media screen and (max-width: 960px) {
    .main__section {
        height: auto
    }
}

.main .bg-container {
    left: 50%;
    margin: 0 auto;
    max-width: 1920px;
    overflow: hidden;
    transform: translateX(-50%);
    width: 100vw
}

.main .bg, .main .bg-container {
    height: 100%;
    position: absolute;
    top: 0
}

.main .bg {
    left: 0;
    width: 100%
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .main .bg {
        position: relative
    }
}

@media screen and (max-width: 960px) {
    .main .bg {
        position: relative
    }
}

.main .bg img, .main .bg video {
    height: auto;
    left: 50%;
    min-height: 100%;
    min-width: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: auto
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .main .bg img, .main .bg video {
        left: auto;
        -o-object-fit: unset;
        object-fit: unset;
        position: relative;
        top: auto;
        transform: none
    }
}

@media screen and (max-width: 960px) {
    .main .bg img, .main .bg video {
        left: auto;
        -o-object-fit: unset;
        object-fit: unset;
        position: relative;
        top: auto;
        transform: none
    }
}

.main .bg video {
    max-height: 100%;
    max-width: 100%
}

.Banners {
    position: relative
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Banners .bg-container {
        position: relative
    }
}

@media screen and (max-width: 960px) {
    .Banners .bg-container {
        position: relative
    }
}

.Banners .bg-container video {
    top: calc(50% + 1px)
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Banners .bg-container video {
        margin-bottom: -1%
    }
}

@media screen and (max-width: 960px) {
    .Banners .bg-container video {
        margin-bottom: -1%
    }
}

.Banners .container {
    height: 100%;
    margin: 0 auto;
    max-width: 80%;
    position: relative
}

@media screen and (min-width: 1921px) {
    .Banners .container {
        max-width: 1536px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Banners .container {
        max-width: 94%
    }
}

@media screen and (max-width: 960px) {
    .Banners .container {
        max-width: 94%
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Banners .container {
        left: 0;
        max-width: 100%;
        padding: 0 10%;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 2
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait)and (min-width: 1921px) {
    .Banners .container {
        width: 1536px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait)and (max-width: 1024px)and (orientation: portrait) {
    .Banners .container {
        padding: 0 3%
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait)and (max-width: 960px) {
    .Banners .container {
        padding: 0 3%
    }
}

@media screen and (max-width: 960px) {
    .Banners .container {
        left: 0;
        max-width: 100%;
        padding: 0 10%;
        position: absolute;
        top: 0;
        width: 100%;
        z-index: 2
    }
}

@media screen and (max-width: 960px)and (min-width: 1921px) {
    .Banners .container {
        width: 1536px
    }
}

@media screen and (max-width: 960px)and (max-width: 1024px)and (orientation: portrait) {
    .Banners .container {
        padding: 0 3%
    }
}

@media screen and (max-width: 960px)and (max-width: 960px) {
    .Banners .container {
        padding: 0 3%
    }
}

@media screen and (max-width: 568px) {
    .Banners .container {
        position: relative
    }
}

.Banners .section-content {
    height: 100%;
    width: 100%
}

@media screen and (max-width: 960px)and (orientation: landscape) {
    .Banners .section-content {
        width: 94%
    }
}

.Banners .section-content__title {
    margin: 0;
    position: absolute
}

@media screen and (max-width: 568px) {
    .Banners .section-content__title {
        position: relative
    }
}

@media screen and (max-width: 960px) {
    .Banners .section-content__title {
        margin-bottom: 4.6875vw;
        margin-top: 9.8958333333vw
    }
}

@media screen and (max-width: 568px) {
    .Banners .section-content__title {
        margin-bottom: 4.4014084507vw;
        margin-top: 5.2816901408vw
    }
}

@media screen and (max-width: 375px) {
    .Banners .section-content__title {
        margin-bottom: 6.6666666667vw;
        margin-top: 8vw
    }
}

.Banners .section-content__title_top-right {
    bottom: auto;
    left: auto;
    right: 0;
    top: 20%
}

.Banners .section-content__title_middle-right {
    bottom: 55%;
    left: auto;
    right: 0;
    top: auto
}

.Banners .section-content__title_bottom-right {
    bottom: 25%;
    left: auto;
    right: 0;
    top: auto
}

.Banners .section-content__title_top-left {
    bottom: auto;
    left: 0;
    right: auto;
    top: 20%
}

.Banners .section-content__title_middle-left {
    bottom: 55%;
    left: 0;
    right: auto;
    top: auto
}

.Banners .section-content__title_bottom-left {
    bottom: 25%;
    left: 0;
    right: auto;
    top: auto
}

.Banners .section-content__title_top-middle {
    bottom: auto;
    left: 50%;
    right: auto;
    top: 20%;
    transform: translateX(-50%)
}

.Banners .section-content__title_middle-middle {
    bottom: 55%;
    left: 50%;
    right: auto;
    top: auto;
    transform: translateX(-50%)
}

.Banners .section-content__title_bottom-middle {
    bottom: 25%;
    left: 50%;
    right: auto;
    top: auto;
    transform: translateX(-50%)
}

.Banners .section-content .arrows, .Banners .section-content__btn {
    left: 0;
    position: absolute;
    transition: opacity 1.5s linear
}

@media screen and (max-width: 568px) {
    .Banners .section-content .arrows, .Banners .section-content__btn {
        position: relative
    }
}

.Banners .section-content__btn {
    margin: 0;
    transition: all .3s linear;
    transition-delay: .5s;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

.Banners .section-content__btn_top-right {
    bottom: auto;
    left: auto;
    right: 0;
    top: 35%
}

.Banners .section-content__btn_middle-right {
    bottom: 40%;
    left: auto;
    right: 0;
    top: auto
}

@media screen and (max-width: 960px)and (orientation: landscape) {
    .Banners .section-content__btn_middle-right {
        bottom: 30%
    }
}

.Banners .section-content__btn_bottom-right {
    bottom: 25%;
    left: auto;
    right: 0;
    top: auto
}

@media screen and (max-width: 960px) {
    .Banners .section-content__btn_bottom-right {
        bottom: 20%
    }
}

.Banners .section-content__btn_top-left {
    bottom: auto;
    left: 0;
    right: auto;
    top: 35%
}

.Banners .section-content__btn_middle-left {
    bottom: 40%;
    left: 0;
    right: auto;
    top: auto
}

@media screen and (max-width: 960px)and (orientation: landscape) {
    .Banners .section-content__btn_middle-left {
        bottom: 30%
    }
}

.Banners .section-content__btn_bottom-left {
    bottom: 25%;
    left: 0;
    right: auto;
    top: auto
}

@media screen and (max-width: 960px) {
    .Banners .section-content__btn_bottom-left {
        bottom: 20%
    }
}

.Banners .section-content__btn_top-middle {
    bottom: auto;
    left: 50%;
    right: auto;
    top: 35%;
    transform: translateX(-50%)
}

.Banners .section-content__btn_middle-middle {
    bottom: 40%;
    left: 50%;
    right: auto;
    top: auto;
    transform: translateX(-50%)
}

@media screen and (max-width: 960px)and (orientation: landscape) {
    .Banners .section-content__btn_middle-middle {
        bottom: 30%
    }
}

.Banners .section-content__btn_bottom-middle {
    bottom: 25%;
    left: 50%;
    right: auto;
    top: auto;
    transform: translateX(-50%)
}

@media screen and (max-width: 960px) {
    .Banners .section-content__btn_bottom-middle {
        bottom: 20%
    }
}

.Banners .section-content .arrows {
    bottom: 5%;
    margin: 0
}

@media screen and (max-width: 960px)and (orientation: landscape) {
    .Banners .section-content .arrows {
        bottom: 12%
    }
}

@media screen and (max-width: 568px) {
    .Banners .section-content .arrows {
        display: none
    }
}

.Banners .section-content_appear {
    opacity: 1
}

.Banners .section-content_appear-2 {
    transition-delay: .5s
}

.Banners .section-content .main-button {
    opacity: 1;
    transition: opacity .3s linear, text-shadow .3s linear
}

.Banners .section-content .main-button_hidden {
    opacity: 0
}

.Banners .main-screen-arrow {
    align-items: center;
    cursor: pointer;
    display: flex;
    height: 20px;
    opacity: .6;
    transition: .3s linear
}

.Banners .main-screen-arrow:hover {
    opacity: 1
}

.Banners .main-screen-arrow div {
    background-color: #000;
    height: 1px;
    max-width: 50px;
    position: relative;
    width: 2.6041666667vw
}

.Banners .main-screen-arrow div:after, .Banners .main-screen-arrow div:before {
    background-color: inherit;
    border-radius: 5px;
    content: "";
    height: 1px;
    position: absolute;
    width: .78125vw
}

.Banners .main-screen-arrow div:hover {
    opacity: 1
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Banners .main-screen-arrow div {
        max-width: 33px;
        width: 3.22265625vw
    }
}

@media screen and (max-width: 960px) {
    .Banners .main-screen-arrow div {
        max-width: 33px;
        width: 3.4375vw
    }
}

@media screen and (max-width: 568px) {
    .Banners .main-screen-arrow div {
        max-width: 50px;
        width: 8.8028169014vw
    }
}

.Banners .main-screen-arrow_left div {
    transform-origin: right
}

.Banners .main-screen-arrow_left div:after, .Banners .main-screen-arrow_left div:before {
    transform-origin: left
}

.Banners .main-screen-arrow_left div:before {
    left: 0;
    top: 0;
    transform: rotate(40deg)
}

.Banners .main-screen-arrow_left div:after {
    left: 0;
    top: 0;
    transform: rotate(-40deg)
}

.Banners .main-screen-arrow_right div {
    transform-origin: left
}

.Banners .main-screen-arrow_right div:after, .Banners .main-screen-arrow_right div:before {
    transform-origin: right
}

.Banners .main-screen-arrow_right div:before {
    right: 0;
    top: 0;
    transform: rotate(40deg)
}

.Banners .main-screen-arrow_right div:after {
    right: 0;
    top: 0;
    transform: rotate(-40deg)
}

.Categories {
    position: relative
}

.Categories .bg {
    background-color: #000
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Categories .bg {
        position: absolute
    }
}

@media screen and (max-width: 960px) {
    .Categories .bg {
        position: absolute
    }
}

.Categories .bg img {
    height: auto;
    left: 50%;
    max-height: 1080px;
    max-width: 1920px;
    min-height: 100%;
    min-width: 100%;
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: auto
}

.Categories .container {
    height: 100%;
    margin: 0 auto;
    max-width: 80%;
    position: relative
}

@media screen and (min-width: 1921px) {
    .Categories .container {
        max-width: 1536px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Categories .container {
        max-width: 94%
    }
}

@media screen and (max-width: 960px) {
    .Categories .container {
        max-width: 94%
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Categories .container {
        padding: 4.8828125vw 0
    }
}

@media screen and (max-width: 960px) {
    .Categories .container {
        padding: 5.2083333333vw 0
    }
}

@media screen and (max-width: 768px) {
    .Categories .container {
        padding: 5.2083333333vw 0
    }
}

@media screen and (max-width: 568px) {
    .Categories .container {
        padding: 7.0422535211vw 0
    }
}

@media screen and (max-width: 375px) {
    .Categories .container {
        padding: 9.3333333333vw 0
    }
}

.Categories .categories {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding: 30px 0;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Categories .categories {
        margin: 0 auto;
        position: relative;
        top: auto;
        transform: none;
        width: 94%
    }
}

@media screen and (max-width: 960px) {
    .Categories .categories {
        margin: 0 auto;
        position: relative;
        top: auto;
        transform: none;
        width: 94%
    }
}

@media screen and (max-width: 568px) {
    .Categories .categories {
        display: block;
        padding: 0;
        width: 100%
    }
}

.Categories .categories__category {
    cursor: pointer;
    display: block;
    height: 20.3645833333vw;
    margin-bottom: 1.5625vw;
    max-height: 391px;
    max-width: 654px;
    position: relative;
    width: calc(43.5% - .78125vw)
}

@media screen and (min-width: 1921px) {
    .Categories .categories__category {
        margin-bottom: 30px;
        width: calc(50% - 30px)
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Categories .categories__category {
        height: 23.4375vw;
        width: calc(50% - 1.46484vw)
    }
}

@media screen and (max-width: 960px) {
    .Categories .categories__category {
        height: 25vw;
        width: calc(50% - 1.5625vw)
    }
}

@media screen and (max-width: 768px) {
    .Categories .categories__category {
        height: 24.0885416667vw;
        width: calc(50% - 1.95313vw)
    }
}

@media screen and (max-width: 568px) {
    .Categories .categories__category {
        height: 58.0985915493vw;
        margin-bottom: 7.0422535211vw;
        width: 100%
    }
}

@media screen and (max-width: 375px) {
    .Categories .categories__category {
        height: 66.6666666667vw;
        margin-bottom: 8vw
    }
}

.Categories .categories__category__img {
    height: 100%;
    overflow: hidden;
    position: relative;
    transition: transform .3s linear;
    width: 100%
}

.Categories .categories__category__img img {
    height: 100%;
    -o-object-fit: cover;
    object-fit: cover;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 100%
}

@media screen and (max-width: 568px) {
    .Categories .categories__category__img img {
        width: 100%
    }
}

.Categories .categories__category__title {
    background-color: #000;
    box-shadow: 15px 12px 0 0 rgba(0, 0, 0, .5);
    cursor: text;
    padding: .5208333333vw 1.0416666667vw;
    position: absolute;
    right: -10%;
    top: 5%;
    transform: skewX(-10deg);
    transition: opacity .1s linear;
    z-index: 2
}

@media screen and (min-width: 1921px) {
    .Categories .categories__category__title {
        padding: 10px 20px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Categories .categories__category__title {
        box-shadow: 8px 8px 0 0 rgba(0, 0, 0, .5);
        padding: .78125vw 1.46484375vw
    }
}

@media screen and (max-width: 960px) {
    .Categories .categories__category__title {
        box-shadow: 8px 8px 0 0 rgba(0, 0, 0, .5);
        padding: .8333333333vw 1.5625vw
    }
}

@media screen and (max-width: 768px) {
    .Categories .categories__category__title {
        padding: .78125vw 1.5625vw
    }
}

@media screen and (max-width: 568px) {
    .Categories .categories__category__title {
        left: 50%;
        padding: 1.7605633803vw;
        right: auto;
        top: -10%;
        transform: skewX(-10deg) translateX(-50%)
    }
}

.Categories .categories__category__title span {
    color: #fff;
    cursor: text;
    font-family: PragmaticaB, sans-serif;
    font-size: 42px;
    line-height: 100%;
    text-transform: uppercase
}

@media (min-width: 768px) {
    .Categories .categories__category__title span {
        font-size: 90px;
        font-size: calc(4.16667vw + 10px)
    }
}

@media (min-width: 1920px) {
    .Categories .categories__category__title span {
        font-size: 90px
    }
}

@media screen and (max-width: 568px) {
    .Categories .categories__category__title span {
        font-size: 34px
    }
}

@media screen and (max-width: 568px)and (min-width: 320px) {
    .Categories .categories__category__title span {
        font-size: 42px;
        font-size: calc(1.78571vw + 28.28571px)
    }
}

@media screen and (max-width: 568px)and (min-width: 768px) {
    .Categories .categories__category__title span {
        font-size: 42px
    }
}

.Categories .categories__category__back-conrainer {
    height: 100%;
    left: 0;
    overflow: hidden;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: -1
}

.Categories .categories__category__back-conrainer .back {
    background-color: #fff;
    height: 100%;
    left: -100%;
    overflow: hidden;
    padding: 5% 0;
    position: absolute;
    right: 0;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 3
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Categories .categories__category__back-conrainer .back {
        padding: 3% 0
    }
}

@media screen and (max-width: 960px) {
    .Categories .categories__category__back-conrainer .back {
        padding: 3% 0
    }
}

.Categories .categories__category__back-conrainer .back__title {
    font-size: 24px;
    left: 100%;
    margin-bottom: .78125vw;
    position: relative
}

@media (min-width: 768px) {
    .Categories .categories__category__back-conrainer .back__title {
        font-size: 48px;
        font-size: calc(2.08333vw + 8px)
    }
}

@media (min-width: 1920px) {
    .Categories .categories__category__back-conrainer .back__title {
        font-size: 48px
    }
}

@media screen and (min-width: 1921px) {
    .Categories .categories__category__back-conrainer .back__title {
        margin-bottom: 15px
    }
}

@media screen and (max-width: 568px) {
    .Categories .categories__category__back-conrainer .back__title {
        font-size: 18px
    }
}

@media screen and (max-width: 568px)and (min-width: 320px) {
    .Categories .categories__category__back-conrainer .back__title {
        font-size: 24px;
        font-size: calc(2.41935vw + 10.25806px)
    }
}

@media screen and (max-width: 568px)and (min-width: 568px) {
    .Categories .categories__category__back-conrainer .back__title {
        font-size: 24px
    }
}

.Categories .categories__category__back-conrainer .back__img {
    left: -100%;
    margin-bottom: 1.5625vw;
    position: relative;
    width: 100%
}

@media screen and (min-width: 1921px) {
    .Categories .categories__category__back-conrainer .back__img {
        margin-bottom: 30px
    }
}

.Categories .categories__category__back-conrainer .back__img img {
    margin: 0 auto;
    width: 55%
}

@media screen and (max-width: 1024px) {
    .Categories .categories__category__back-conrainer .back__img img {
        width: 50%
    }
}

.Categories .categories__category__back-conrainer .back__btn {
    left: 100%;
    position: relative
}

.Categories .categories a:nth-last-of-type(-n+2) {
    margin-bottom: 0
}

@media screen and (max-width: 568px) {
    .Categories .categories a:nth-last-of-type(-n+2) {
        margin-bottom: 7.0422535211vw
    }
}

@media screen and (max-width: 375px) {
    .Categories .categories a:nth-last-of-type(-n+2) {
        margin-bottom: 8vw
    }
}

.Categories .categories a:nth-of-type(odd) {
    margin-right: 1.5625vw
}

.Categories .categories a:nth-of-type(odd) img {
    right: 0
}

.Categories .categories a:nth-of-type(odd) .categories__category__title {
    left: -10%;
    right: auto
}

@media screen and (max-width: 568px) {
    .Categories .categories a:nth-of-type(odd) .categories__category__title {
        left: 0
    }
}

.Categories .categories__pagination {
    display: none
}

@media screen and (max-width: 568px) {
    .Categories .categories__pagination {
        align-items: center;
        display: flex;
        justify-content: center
    }
}

.Categories .categories__pagination__item {
    background-color: #000;
    border: 3px solid #fff;
    border-radius: 9999px;
    height: 12px;
    margin: 0 3px;
    transition: background-color .3s linear, width .3s linear, height .3s linear;
    width: 12px
}

.Categories .categories__pagination__item_active {
    background-color: #fff;
    height: 15px;
    width: 15px
}

.Categories .categories > :nth-child(2n) {
    margin-left: .78125vw
}

@media screen and (max-width: 568px) {
    .Categories .categories > :last-child {
        margin-bottom: 0
    }
}

.Bestsellers {
    height: auto;
    padding-bottom: 1.0416666667vw;
    padding-top: 1.0416666667vw
}

@media screen and (min-width: 1921px) {
    .Bestsellers {
        padding-bottom: 80px;
        padding-top: 40px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Bestsellers {
        padding-bottom: 4.8828125vw;
        padding-top: 4.8828125vw
    }
}

@media screen and (max-width: 960px) {
    .Bestsellers {
        padding-bottom: 5.2083333333vw;
        padding-top: 5.2083333333vw
    }
}

@media screen and (max-width: 768px) {
    .Bestsellers {
        padding-bottom: 5.2083333333vw;
        padding-top: 5.2083333333vw
    }
}

.Bestsellers .container {
    height: 100%;
    margin: 0 auto;
    max-width: 80%;
    position: relative;
    transform-origin: center
}

@media screen and (min-width: 1921px) {
    .Bestsellers .container {
        max-width: 1536px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Bestsellers .container {
        max-width: 94%
    }
}

@media screen and (max-width: 960px) {
    .Bestsellers .container {
        max-width: 94%
    }
}

.Bestsellers .title {
    color: #000;
    font-weight: 700;
    left: 0;
    padding-top: 1.5625vw;
    position: absolute;
    top: 0;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    z-index: 2
}

@media screen and (min-width: 1921px) {
    .Bestsellers .title {
        padding-top: 30px
    }
}

@media screen and (max-width: 568px) {
    .Bestsellers .title {
        transform: translateX(38.7323943662vw);
        width: 50%
    }
}

.Bestsellers .title__text {
    display: block;
    font-size: 29px;
    line-height: 130%;
    text-transform: uppercase
}

@media (min-width: 768px) {
    .Bestsellers .title__text {
        font-size: 80px;
        font-size: calc(4.42708vw - 5px)
    }
}

@media (min-width: 1920px) {
    .Bestsellers .title__text {
        font-size: 80px
    }
}

@media screen and (max-width: 568px) {
    .Bestsellers .title__text {
        display: inline-block;
        font-weight: 400
    }
}

.Bestsellers .title__text_most-popular {
    font-family: PragmaticaB, sans-serif;
    font-size: 55px;
    line-height: 100%
}

@media (min-width: 768px) {
    .Bestsellers .title__text_most-popular {
        font-size: 140px;
        font-size: calc(7.37847vw - 1.66667px)
    }
}

@media (min-width: 1920px) {
    .Bestsellers .title__text_most-popular {
        font-size: 140px
    }
}

@media screen and (max-width: 568px) {
    .Bestsellers .title__text_most-popular {
        font-family: Pragmatica, sans-serif
    }
}

.Bestsellers .title__text_with-buttons {
    display: flex;
    justify-content: space-between
}

.Bestsellers .title .arrows_bestsellers {
    margin-bottom: 0
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Bestsellers .title .arrows_bestsellers {
        position: absolute;
        right: -40%;
        top: -9.765625vw
    }
}

@media screen and (max-width: 960px) {
    .Bestsellers .title .arrows_bestsellers {
        position: absolute;
        right: -40%;
        top: -10.4166666667vw
    }
}

@media screen and (max-width: 768px) {
    .Bestsellers .title .arrows_bestsellers {
        top: -11.71875vw
    }
}

@media screen and (max-width: 568px) {
    .Bestsellers .title .arrows_bestsellers {
        display: none
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Bestsellers .title .arrows_bestsellers .arrow {
        height: 4.8828125vw;
        width: 2.9296875vw
    }
}

@media screen and (max-width: 960px) {
    .Bestsellers .title .arrows_bestsellers .arrow {
        height: 5.2083333333vw;
        width: 3.125vw
    }
}

@media screen and (max-width: 768px) {
    .Bestsellers .title .arrows_bestsellers .arrow {
        height: 5.2083333333vw;
        width: 3.2552083333vw
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Bestsellers .title .arrows_bestsellers > :first-child {
        margin-right: 2.44140625vw
    }
}

@media screen and (max-width: 960px) {
    .Bestsellers .title .arrows_bestsellers > :first-child {
        margin-right: 2.6041666667vw
    }
}

.About {
    position: relative
}

.About .bg-container {
    background-color: #ecf0f1
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .About .bg-container {
        position: relative
    }
}

@media screen and (max-width: 960px) {
    .About .bg-container {
        position: relative
    }
}

.About .container {
    height: 100%;
    margin: 0 auto;
    max-width: 80%;
    position: relative
}

@media screen and (min-width: 1921px) {
    .About .container {
        max-width: 1536px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .About .container {
        max-width: 94%
    }
}

@media screen and (max-width: 960px) {
    .About .container {
        max-width: 94%
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .About .container {
        position: static
    }
}

@media screen and (max-width: 960px) {
    .About .container {
        position: static
    }
}

@media screen and (max-width: 568px) {
    .About .container {
        position: relative
    }
}

.About .section-content__text {
    max-width: 45% !important
}

@media screen and (max-width: 960px) {
    .About .section-content__text {
        max-width: 35% !important
    }
}

@media screen and (max-width: 568px) {
    .About .section-content__text {
        max-width: 100% !important
    }
}

.About .section-content__btn {
    margin-bottom: 0
}

.Collections {
    height: auto;
    max-height: none;
    position: relative
}

.Collections .container {
    height: 100%;
    margin: 0 auto;
    max-width: 80%;
    position: relative
}

@media screen and (min-width: 1921px) {
    .Collections .container {
        max-width: 1536px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Collections .container {
        max-width: 94%
    }
}

@media screen and (max-width: 960px) {
    .Collections .container {
        max-width: 94%
    }
}

.Collections .banners {
    display: flex;
    justify-content: space-between;
    margin-bottom: 5.2083333333vw;
    margin-top: 5.2083333333vw
}

@media screen and (min-width: 1921px) {
    .Collections .banners {
        margin-bottom: 100px;
        margin-top: 100px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Collections .banners {
        margin-bottom: 4.8828125vw
    }
}

@media screen and (max-width: 960px) {
    .Collections .banners {
        margin-bottom: 5.2083333333vw
    }
}

@media screen and (max-width: 768px) {
    .Collections .banners {
        margin-bottom: 5.2083333333vw
    }
}

@media screen and (max-width: 568px) {
    .Collections .banners {
        display: block
    }
}

.Collections .technologies {
    background-color: #ecf0f1;
    height: calc(100vh - 5.72917vw);
    margin-bottom: 6.25vw;
    max-height: 1080px;
    position: relative;
    width: 100%
}

@media screen and (min-width: 1921px) {
    .Collections .technologies {
        height: calc(100vh - 90px)
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Collections .technologies {
        height: auto
    }
}

@media screen and (max-width: 960px) {
    .Collections .technologies {
        height: auto
    }
}

@media screen and (min-width: 1921px) {
    .Collections .technologies {
        margin-bottom: 120px
    }
}

.Collections .technologies .bg img {
    height: auto;
    left: auto;
    max-height: 100%;
    max-width: 100%;
    position: relative;
    top: auto;
    transform: none;
    width: auto;
    width: 100%
}

.Collections .technologies .container {
    left: 0;
    max-width: 100%;
    padding: 0 10%;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 2
}

@media screen and (min-width: 1921px) {
    .Collections .technologies .container {
        width: 1536px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .Collections .technologies .container {
        padding: 0 3%
    }
}

@media screen and (max-width: 960px) {
    .Collections .technologies .container {
        padding: 0 3%
    }
}

@media screen and (max-width: 568px) {
    .Collections .technologies .container {
        padding-bottom: px2v(15px, sm);
        position: relative
    }
}

.section-content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

@media screen and (max-width: 568px) {
    .section-content {
        position: relative;
        top: auto;
        transform: none
    }
}

.section-content__title {
    font-size: 28px;
    font-weight: 400;
    line-height: 100%;
    margin-bottom: 3.6458333333vw
}

@media (min-width: 768px) {
    .section-content__title {
        font-size: 66px;
        font-size: calc(3.29861vw + 2.66667px)
    }
}

@media (min-width: 1920px) {
    .section-content__title {
        font-size: 66px
    }
}

@media screen and (min-width: 1921px) {
    .section-content__title {
        margin-bottom: 70px;
        margin-top: 210px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .section-content__title {
        margin-bottom: 4.39453125vw;
        margin-top: 9.27734375vw
    }
}

@media screen and (max-width: 960px) {
    .section-content__title {
        margin-bottom: 4.6875vw;
        margin-top: 9.8958333333vw
    }
}

@media screen and (max-width: 768px) {
    .section-content__title {
        font-size: 28px
    }
}

@media screen and (max-width: 768px)and (min-width: 320px) {
    .section-content__title {
        font-size: 30px;
        font-size: calc(.44643vw + 26.57143px)
    }
}

@media screen and (max-width: 768px)and (min-width: 768px) {
    .section-content__title {
        font-size: 30px
    }
}

@media screen and (max-width: 568px) {
    .section-content__title {
        margin-bottom: 4.4014084507vw;
        margin-top: 5.2816901408vw
    }
}

@media screen and (max-width: 375px) {
    .section-content__title {
        margin-bottom: 6.6666666667vw;
        margin-top: 8vw
    }
}

.section-content__title b, .section-content__title strong {
    font-weight: 700
}

.section-content__title b, .section-content__title span {
    display: block
}

.section-content__text {
    font-size: 18px;
    line-height: 130%;
    margin-bottom: 4.1666666667vw;
    max-width: 35%
}

@media (min-width: 768px) {
    .section-content__text {
        font-size: 32px;
        font-size: calc(1.21528vw + 8.66667px)
    }
}

@media (min-width: 1920px) {
    .section-content__text {
        font-size: 32px
    }
}

@media screen and (min-width: 1921px) {
    .section-content__text {
        margin-bottom: 80px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .section-content__text {
        margin-bottom: 2.9296875vw
    }
}

@media screen and (max-width: 960px) {
    .section-content__text {
        margin-bottom: 3.125vw
    }
}

@media screen and (max-width: 768px) {
    .section-content__text {
        font-size: 16px
    }
}

@media screen and (max-width: 768px)and (min-width: 320px) {
    .section-content__text {
        font-size: 18px;
        font-size: calc(.44643vw + 14.57143px)
    }
}

@media screen and (max-width: 768px)and (min-width: 768px) {
    .section-content__text {
        font-size: 18px
    }
}

@media screen and (max-width: 568px) {
    .section-content__text {
        margin-bottom: 5.2816901408vw;
        max-width: 100%
    }
}

@media screen and (max-width: 375px) {
    .section-content__text {
        margin-bottom: 8vw
    }
}

.section-content__btn {
    margin-bottom: 10.4166666667vw
}

@media screen and (min-width: 1921px) {
    .section-content__btn {
        margin-bottom: 200px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .section-content__btn {
        margin-bottom: 0;
        padding-bottom: 2.9296875vw
    }
}

@media screen and (max-width: 960px) {
    .section-content__btn {
        margin-bottom: 0;
        padding-bottom: 3.125vw
    }
}

.section-content .arrows {
    margin-top: 10.4166666667vw
}

@media screen and (min-width: 1921px) {
    .section-content .arrows {
        margin-top: 200px
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .section-content .arrows {
        margin-top: 2.9296875vw
    }
}

@media screen and (max-width: 960px) {
    .section-content .arrows {
        margin-top: 3.125vw
    }
}

@media screen and (max-width: 568px) {
    .section-content .arrows {
        margin-bottom: 3.125vw
    }
}

.ball-bestsellers1 {
    left: -20% !important;
    top: 55% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers1 {
        left: -12% !important;
        top: 78% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers1 {
        left: -12% !important;
        top: 78% !important
    }
}

.ball-bestsellers1 canvas {
    height: 10.4166666667vw !important;
    width: 10.4166666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-bestsellers1 canvas {
        height: 200px !important;
        width: 200px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers1 canvas {
        height: 14.6484375vw !important;
        width: 14.6484375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers1 canvas {
        height: 15.625vw !important;
        width: 15.625vw !important
    }
}

.ball-bestsellers2 {
    left: 93% !important;
    top: 10% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers2 {
        left: 80% !important;
        top: -10% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers2 {
        left: 80% !important;
        top: -10% !important
    }
}

.ball-bestsellers2 canvas {
    height: 3.125vw !important;
    width: 3.125vw !important
}

@media screen and (min-width: 1921px) {
    .ball-bestsellers2 canvas {
        height: 60px !important;
        width: 60px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers2 canvas {
        height: 4.8828125vw !important;
        width: 4.8828125vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers2 canvas {
        height: 5.2083333333vw !important;
        width: 5.2083333333vw !important
    }
}

.ball-bestsellers3 {
    left: 100% !important;
    top: 30% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers3 {
        left: 85% !important;
        top: -3% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers3 {
        left: 85% !important;
        top: -3% !important
    }
}

.ball-bestsellers3 canvas {
    height: 4.1666666667vw !important;
    width: 4.1666666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-bestsellers3 canvas {
        height: 80px !important;
        width: 80px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers3 canvas {
        height: 6.8359375vw !important;
        width: 6.8359375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers3 canvas {
        height: 7.2916666667vw !important;
        width: 7.2916666667vw !important
    }
}

.ball-bestsellers4 {
    left: 93% !important;
    top: 35% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers4 {
        left: 74% !important;
        top: -4% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers4 {
        left: 74% !important;
        top: -4% !important
    }
}

.ball-bestsellers4 canvas {
    height: 4.6875vw !important;
    width: 4.6875vw !important
}

@media screen and (min-width: 1921px) {
    .ball-bestsellers4 canvas {
        height: 90px !important;
        width: 90px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers4 canvas {
        height: 7.8125vw !important;
        width: 7.8125vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers4 canvas {
        height: 8.3333333333vw !important;
        width: 8.3333333333vw !important
    }
}

.ball-bestsellers5 {
    left: 99% !important;
    top: 60% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers5 {
        left: 89% !important;
        top: -14% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers5 {
        left: 89% !important;
        top: -14% !important
    }
}

.ball-bestsellers5 canvas {
    height: 7.2916666667vw !important;
    width: 7.2916666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-bestsellers5 canvas {
        height: 140px !important;
        width: 140px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers5 canvas {
        height: 11.71875vw !important;
        width: 11.71875vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers5 canvas {
        height: 12.5vw !important;
        width: 12.5vw !important
    }
}

.ball-bestsellers6 {
    left: 105% !important;
    top: 58% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers6 {
        left: 83% !important;
        top: 2% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers6 {
        left: 83% !important;
        top: 2% !important
    }
}

.ball-bestsellers6 canvas {
    height: 3.125vw !important;
    width: 3.125vw !important
}

@media screen and (min-width: 1921px) {
    .ball-bestsellers6 canvas {
        height: 60px !important;
        width: 60px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-bestsellers6 canvas {
        height: 4.8828125vw !important;
        width: 4.8828125vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-bestsellers6 canvas {
        height: 5.2083333333vw !important;
        width: 5.2083333333vw !important
    }
}

.ball-collections1 {
    left: -19% !important;
    top: 16% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections1 {
        left: -12% !important;
        top: 87% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections1 {
        left: -12% !important;
        top: 87% !important
    }
}

.ball-collections1 canvas {
    height: 6.25vw !important;
    width: 6.25vw !important
}

@media screen and (min-width: 1921px) {
    .ball-collections1 canvas {
        height: 120px !important;
        width: 120px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections1 canvas {
        height: 9.765625vw !important;
        width: 9.765625vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections1 canvas {
        height: 10.4166666667vw !important;
        width: 10.4166666667vw !important
    }
}

.ball-collections2 {
    left: -20% !important;
    top: 23% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections2 {
        left: -20% !important;
        top: 86% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections2 {
        left: -20% !important;
        top: 86% !important
    }
}

.ball-collections2 canvas {
    height: 4.1666666667vw !important;
    width: 4.1666666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-collections2 canvas {
        height: 80px !important;
        width: 80px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections2 canvas {
        height: 6.8359375vw !important;
        width: 6.8359375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections2 canvas {
        height: 7.2916666667vw !important;
        width: 7.2916666667vw !important
    }
}

.ball-collections3 {
    left: -12% !important;
    top: 30% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections3 {
        left: -17% !important;
        top: 70% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections3 {
        left: -17% !important;
        top: 70% !important
    }
}

.ball-collections3 canvas {
    height: 4.1666666667vw !important;
    width: 4.1666666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-collections3 canvas {
        height: 80px !important;
        width: 80px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections3 canvas {
        height: 6.8359375vw !important;
        width: 6.8359375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections3 canvas {
        height: 7.2916666667vw !important;
        width: 7.2916666667vw !important
    }
}

.ball-collections4 {
    left: -16% !important;
    top: 43% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections4 {
        left: -19% !important;
        top: 49% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections4 {
        left: -19% !important;
        top: 49% !important
    }
}

.ball-collections4 canvas {
    height: 4.1666666667vw !important;
    width: 4.1666666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-collections4 canvas {
        height: 80px !important;
        width: 80px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections4 canvas {
        height: 6.8359375vw !important;
        width: 6.8359375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections4 canvas {
        height: 7.2916666667vw !important;
        width: 7.2916666667vw !important
    }
}

.ball-collections5 {
    left: 106% !important;
    top: 63% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections5 {
        left: 86% !important;
        top: -13% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections5 {
        left: 86% !important;
        top: -13% !important
    }
}

.ball-collections5 canvas {
    height: 4.1666666667vw !important;
    width: 4.1666666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-collections5 canvas {
        height: 80px !important;
        width: 80px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections5 canvas {
        height: 6.8359375vw !important;
        width: 6.8359375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections5 canvas {
        height: 7.2916666667vw !important;
        width: 7.2916666667vw !important
    }
}

.ball-collections6 {
    left: 103% !important;
    top: 66% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections6 {
        left: 85% !important;
        top: -4% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections6 {
        left: 85% !important;
        top: -4% !important
    }
}

.ball-collections6 canvas {
    height: 4.1666666667vw !important;
    width: 4.1666666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-collections6 canvas {
        height: 80px !important;
        width: 80px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections6 canvas {
        height: 6.8359375vw !important;
        width: 6.8359375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections6 canvas {
        height: 7.2916666667vw !important;
        width: 7.2916666667vw !important
    }
}

.ball-collections7 {
    left: 100% !important;
    top: 72% !important
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections7 {
        left: 84% !important;
        top: -16% !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections7 {
        left: 84% !important;
        top: -16% !important
    }
}

.ball-collections7 canvas {
    height: 4.1666666667vw !important;
    width: 4.1666666667vw !important
}

@media screen and (min-width: 1921px) {
    .ball-collections7 canvas {
        height: 80px !important;
        width: 80px !important
    }
}

@media screen and (max-width: 1024px)and (orientation: portrait) {
    .ball-collections7 canvas {
        height: 6.8359375vw !important;
        width: 6.8359375vw !important
    }
}

@media screen and (max-width: 960px) {
    .ball-collections7 canvas {
        height: 7.2916666667vw !important;
        width: 7.2916666667vw !important
    }
}

.custom-img-leave-active {
    -webkit-animation: img-out 0.5s;
    animation: img-out 0.5s;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
    opacity: 1
}

.custom-img-enter-active {
    -webkit-animation: img-in 1.0s;
    animation: img-in 1.0s;
    opacity: 0
}


.Banners {
    min-height: 51vw !important;
}

@-webkit-keyframes img-out {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes img-out {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@-webkit-keyframes img-in {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes img-in {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.custom-text-1-leave-active {
    -webkit-animation: text-out 0.5s;
    animation: text-out 0.5s;
    -webkit-animation-delay: 0;
    animation-delay: 0;
    transform-origin: bottom
}

.custom-text-1-enter-active {
    -webkit-animation: text-in 0.5s;
    animation: text-in 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-2-leave-active {
    -webkit-animation: text-out 0.5s;
    animation: text-out 0.5s;
    -webkit-animation-delay: .2s;
    animation-delay: .2s;
    transform-origin: bottom
}

.custom-text-2-enter-active {
    -webkit-animation: text-in 0.5s;
    animation: text-in 0.5s;
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-3-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: .4s;
    animation-delay: .4s;
    transform-origin: bottom
}

.custom-text-3-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-4-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: .6s;
    animation-delay: .6s;
    transform-origin: bottom
}

.custom-text-4-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-5-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: .8s;
    animation-delay: .8s;
    transform-origin: bottom
}

.custom-text-5-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-6-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: 1s;
    animation-delay: 1s;
    transform-origin: bottom
}

.custom-text-6-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-7-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: 1.2s;
    animation-delay: 1.2s;
    transform-origin: bottom
}

.custom-text-7-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-8-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: 1.4s;
    animation-delay: 1.4s;
    transform-origin: bottom
}

.custom-text-8-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-9-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: 1.6s;
    animation-delay: 1.6s;
    transform-origin: bottom
}

.custom-text-9-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

.custom-text-10-leave-active {
    -webkit-animation: text-out 1s;
    animation: text-out 1s;
    -webkit-animation-delay: 1.8s;
    animation-delay: 1.8s;
    transform-origin: bottom
}

.custom-text-10-enter-active {
    -webkit-animation: text-in 1s;
    animation: text-in 1s;
    -webkit-animation-delay: 3s;
    animation-delay: 3s;
    transform: rotateX(90deg) translateY(20%);
    transform-origin: bottom
}

@-webkit-keyframes text-out {
    to {
        transform: rotateX(90deg) translateY(20%)
    }
}

@keyframes text-out {
    to {
        transform: rotateX(90deg) translateY(20%)
    }
}

@-webkit-keyframes text-in {
    to {
        transform: rotateX(0deg) translateY(0)
    }
}

@keyframes text-in {
    to {
        transform: rotateX(0deg) translateY(0)
    }
}

.bg-container video {
    opacity: 1;
    transition: opacity .3s linear
}

.bg-container_hidden video {
    display: none;
    opacity: 0
}