@font-face {
    font-family: swiper-icons;
    src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA");
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff
}

.swiper {
    margin-left: auto;
    margin-right: auto;
    position: relative;
    overflow: hidden;
    list-style: none;
    padding: 0;
    z-index: 1
}

.swiper-vertical > .swiper-wrapper {
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: flex;
    transition-property: transform;
    box-sizing: content-box
}

.swiper-android .swiper-slide, .swiper-wrapper {
    transform: translate3d(0, 0, 0)
}

.swiper-pointer-events {
    touch-action: pan-y
}

.swiper-pointer-events.swiper-vertical {
    touch-action: pan-x
}

.swiper-slide {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
    transition-property: transform
}

.swiper-slide-invisible-blank {
    visibility: hidden
}

.swiper-autoheight, .swiper-autoheight .swiper-slide {
    height: auto
}

.swiper-autoheight .swiper-wrapper {
    align-items: flex-start;
    transition-property: transform, height
}

.swiper-backface-hidden .swiper-slide {
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-3d, .swiper-3d.swiper-css-mode .swiper-wrapper {
    perspective: 1200px
}

.swiper-3d .swiper-cube-shadow, .swiper-3d .swiper-slide, .swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top, .swiper-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-3d .swiper-slide-shadow, .swiper-3d .swiper-slide-shadow-bottom, .swiper-3d .swiper-slide-shadow-left, .swiper-3d .swiper-slide-shadow-right, .swiper-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-3d .swiper-slide-shadow {
    background: rgba(0, 0, 0, .15)
}

.swiper-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(to left, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(to right, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(to top, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, .5), rgba(0, 0, 0, 0))
}

.swiper-css-mode > .swiper-wrapper {
    overflow: auto;
    scrollbar-width: none;
    -ms-overflow-style: none
}

.swiper-css-mode > .swiper-wrapper::-webkit-scrollbar {
    display: none
}

.swiper-css-mode > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: start start
}

.swiper-horizontal.swiper-css-mode > .swiper-wrapper {
    scroll-snap-type: x mandatory
}

.swiper-vertical.swiper-css-mode > .swiper-wrapper {
    scroll-snap-type: y mandatory
}

.swiper-centered > .swiper-wrapper::before {
    content: '';
    flex-shrink: 0;
    order: 9999
}

.swiper-centered.swiper-horizontal > .swiper-wrapper > .swiper-slide:first-child {
    margin-inline-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-horizontal > .swiper-wrapper::before {
    height: 100%;
    min-height: 1px;
    width: var(--swiper-centered-offset-after)
}

.swiper-centered.swiper-vertical > .swiper-wrapper > .swiper-slide:first-child {
    margin-block-start: var(--swiper-centered-offset-before)
}

.swiper-centered.swiper-vertical > .swiper-wrapper::before {
    width: 100%;
    min-width: 1px;
    height: var(--swiper-centered-offset-after)
}

.swiper-centered > .swiper-wrapper > .swiper-slide {
    scroll-snap-align: center center;
    scroll-snap-stop: always
}

.swiper-virtual .swiper-slide {
    -webkit-backface-visibility: hidden;
    transform: translateZ(0)
}

.swiper-virtual.swiper-css-mode .swiper-wrapper::after {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none
}

.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after {
    height: 1px;
    width: var(--swiper-virtual-size)
}

.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after {
    width: 1px;
    height: var(--swiper-virtual-size)
}

:root {
    --swiper-navigation-size: 44px
}

.swiper-button-next, .swiper-button-prev {
    position: absolute;
    top: 50%;
    width: calc(var(--swiper-navigation-size) / 44 * 27);
    height: var(--swiper-navigation-size);
    margin-top: calc(0px - (var(--swiper-navigation-size) / 2));
    z-index: 10;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--swiper-navigation-color, var(--swiper-theme-color))
}

.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-next.swiper-button-hidden, .swiper-button-prev.swiper-button-hidden {
    opacity: 0;
    cursor: auto;
    pointer-events: none
}

.swiper-navigation-disabled .swiper-button-next, .swiper-navigation-disabled .swiper-button-prev {
    display: none !important
}

.swiper-button-next:after, .swiper-button-prev:after {
    font-family: swiper-icons;
    font-size: var(--swiper-navigation-size);
    text-transform: none !important;
    letter-spacing: 0;
    font-variant: initial;
    line-height: 1
}

.swiper-button-prev, .swiper-rtl .swiper-button-next {
    left: 10px;
    right: auto
}

.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {
    content: 'prev'
}

.swiper-button-next, .swiper-rtl .swiper-button-prev {
    right: 10px;
    left: auto
}

.swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
    content: 'next'
}

.swiper-button-lock {
    display: none
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s opacity;
    transform: translate3d(0, 0, 0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-pagination-disabled > .swiper-pagination, .swiper-pagination.swiper-pagination-disabled {
    display: none !important
}

.swiper-horizontal > .swiper-pagination-bullets, .swiper-pagination-bullets.swiper-pagination-horizontal, .swiper-pagination-custom, .swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullets-dynamic {
    overflow: hidden;
    font-size: 0
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transform: scale(.33);
    position: relative
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active {
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main {
    transform: scale(1)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev {
    transform: scale(.33)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next {
    transform: scale(.66)
}

.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next {
    transform: scale(.33)
}

.swiper-pagination-bullet {
    width: var(--swiper-pagination-bullet-width, var(--swiper-pagination-bullet-size, 8px));
    height: var(--swiper-pagination-bullet-height, var(--swiper-pagination-bullet-size, 8px));
    display: inline-block;
    border-radius: 50%;
    background: var(--swiper-pagination-bullet-inactive-color, #000);
    opacity: var(--swiper-pagination-bullet-inactive-opacity, .2)
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -webkit-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-bullet:only-child {
    display: none !important
}

.swiper-pagination-bullet-active {
    opacity: var(--swiper-pagination-bullet-opacity, 1);
    background: var(--swiper-pagination-color, var(--swiper-theme-color))
}

.swiper-pagination-vertical.swiper-pagination-bullets, .swiper-vertical > .swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0, -50%, 0)
}

.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {
    margin: var(--swiper-pagination-bullet-vertical-gap, 6px) 0;
    display: block
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    top: 50%;
    transform: translateY(-50%);
    width: 8px
}

.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-vertical > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    display: inline-block;
    transition: .2s transform, .2s top
}

.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 var(--swiper-pagination-bullet-horizontal-gap, 4px)
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic {
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap
}

.swiper-horizontal > .swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s transform, .2s left
}

.swiper-horizontal.swiper-rtl > .swiper-pagination-bullets-dynamic .swiper-pagination-bullet {
    transition: .2s transform, .2s right
}

.swiper-pagination-progressbar {
    background: rgba(0, 0, 0, .25);
    position: absolute
}

.swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    background: var(--swiper-pagination-color, var(--swiper-theme-color));
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top
}

.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top
}

.swiper-horizontal > .swiper-pagination-progressbar, .swiper-pagination-progressbar.swiper-pagination-horizontal, .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite, .swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-horizontal > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite, .swiper-pagination-progressbar.swiper-pagination-vertical, .swiper-vertical > .swiper-pagination-progressbar {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-lock {
    display: none
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0, 0, 0, .1)
}

.swiper-scrollbar-disabled > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-disabled {
    display: none !important
}

.swiper-horizontal > .swiper-scrollbar, .swiper-scrollbar.swiper-scrollbar-horizontal {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-scrollbar.swiper-scrollbar-vertical, .swiper-vertical > .swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0, 0, 0, .5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-scrollbar-lock {
    display: none
}

.swiper-zoom-container {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center
}

.swiper-zoom-container > canvas, .swiper-zoom-container > img, .swiper-zoom-container > svg {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain
}

.swiper-slide-zoomed {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent
}

.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader, .swiper:not(.swiper-watch-progress) .swiper-lazy-preloader {
    animation: swiper-preloader-spin 1s infinite linear
}

.swiper-lazy-preloader-white {
    --swiper-preloader-color: #fff
}

.swiper-lazy-preloader-black {
    --swiper-preloader-color: #000
}

.swiper .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-free-mode > .swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-grid > .swiper-wrapper {
    flex-wrap: wrap
}

.swiper-grid-column > .swiper-wrapper {
    flex-wrap: wrap;
    flex-direction: column
}

.swiper-fade.swiper-free-mode .swiper-slide {
    transition-timing-function: ease-out
}

.swiper-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity
}

.swiper-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-fade .swiper-slide-active, .swiper-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-cube {
    overflow: visible
}

.swiper-cube .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1;
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%
}

.swiper-cube .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-cube.swiper-rtl .swiper-slide {
    transform-origin: 100% 0
}

.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-cube .swiper-slide-active, .swiper-cube .swiper-slide-next, .swiper-cube .swiper-slide-next + .swiper-slide, .swiper-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-cube .swiper-slide-shadow-bottom, .swiper-cube .swiper-slide-shadow-left, .swiper-cube .swiper-slide-shadow-right, .swiper-cube .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    opacity: .6;
    z-index: 0
}

.swiper-cube .swiper-cube-shadow:before {
    content: '';
    background: #000;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    filter: blur(50px)
}

.swiper-flip {
    overflow: visible
}

.swiper-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-flip .swiper-slide-active, .swiper-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-flip .swiper-slide-shadow-bottom, .swiper-flip .swiper-slide-shadow-left, .swiper-flip .swiper-slide-shadow-right, .swiper-flip .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-creative .swiper-slide {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: hidden;
    transition-property: transform, opacity, height
}

.swiper-cards {
    overflow: visible
}

.swiper-cards .swiper-slide {
    transform-origin: center bottom;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    overflow: hidden
}

@-moz-keyframes swiper-preloader-spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes swiper-preloader-spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

@-o-keyframes swiper-preloader-spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

@keyframes swiper-preloader-spin {
    0% {
        transform: rotate(0)
    }
    100% {
        transform: rotate(360deg)
    }
}

.irs {
    position: relative;
    display: block;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    font-size: 12px;
    font-family: Arial, sans-serif
}

.irs-line {
    position: relative;
    display: block;
    overflow: hidden;
    outline: 0 !important
}

.irs-bar {
    position: absolute;
    display: block;
    left: 0;
    width: 0
}

.irs-shadow {
    position: absolute;
    display: none;
    left: 0;
    width: 0
}

.irs-handle {
    position: absolute;
    display: block;
    box-sizing: border-box;
    cursor: default;
    z-index: 1
}

.irs-handle.type_last {
    z-index: 2
}

.irs-max, .irs-min {
    position: absolute;
    display: block;
    cursor: default
}

.irs-min {
    left: 0
}

.irs-max {
    right: 0
}

.irs-from, .irs-single, .irs-to {
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    cursor: default;
    white-space: nowrap
}

.irs-grid {
    position: absolute;
    display: none;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 20px
}

.irs-with-grid .irs-grid {
    display: block
}

.irs-grid-pol {
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 8px;
    background: #000
}

.irs-grid-pol.small {
    height: 4px
}

.irs-grid-text {
    position: absolute;
    bottom: 0;
    left: 0;
    white-space: nowrap;
    text-align: center;
    font-size: 9px;
    line-height: 9px;
    padding: 0 3px;
    color: #000
}

.irs-disable-mask {
    position: absolute;
    display: block;
    top: 0;
    left: -1%;
    width: 102%;
    height: 100%;
    cursor: default;
    background: rgba(0, 0, 0, 0);
    z-index: 2
}

.lt-ie9 .irs-disable-mask {
    background: #000;
    cursor: not-allowed
}

.irs-disabled {
    opacity: .4
}

.irs-hidden-input {
    position: absolute !important;
    display: block !important;
    top: 0 !important;
    left: 0 !important;
    width: 0 !important;
    height: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden;
    outline: 0 !important;
    z-index: -9999 !important;
    background: 0 0 !important;
    border-style: solid !important;
    border-color: transparent !important
}

.irs--flat {
    height: 40px
}

.irs--flat.irs-with-grid {
    height: 60px
}

.irs--flat .irs-line {
    top: 25px;
    height: 12px;
    background-color: #e1e4e9;
    border-radius: 4px
}

.irs--flat .irs-bar {
    top: 25px;
    height: 12px;
    background-color: #ed5565
}

.irs--flat .irs-bar--single {
    border-radius: 4px 0 0 4px
}

.irs--flat .irs-shadow {
    height: 1px;
    bottom: 16px;
    background-color: #e1e4e9
}

.irs--flat .irs-handle {
    top: 22px;
    width: 16px;
    height: 18px;
    background-color: transparent
}

.irs--flat .irs-handle > i:first-child {
    position: absolute;
    display: block;
    top: 0;
    left: 50%;
    width: 2px;
    height: 100%;
    margin-left: -1px;
    background-color: #da4453
}

.irs--flat .irs-handle.state_hover > i:first-child, .irs--flat .irs-handle:hover > i:first-child {
    background-color: #a43540
}

.irs--flat .irs-max, .irs--flat .irs-min {
    top: 0;
    padding: 1px 3px;
    color: #999;
    font-size: 10px;
    line-height: 1.333;
    text-shadow: none;
    background-color: #e1e4e9;
    border-radius: 4px
}

.irs--flat .irs-from, .irs--flat .irs-single, .irs--flat .irs-to {
    color: #fff;
    font-size: 10px;
    line-height: 1.333;
    text-shadow: none;
    padding: 1px 5px;
    background-color: #ed5565;
    border-radius: 4px
}

.irs--flat .irs-from:before, .irs--flat .irs-single:before, .irs--flat .irs-to:before {
    position: absolute;
    display: block;
    content: "";
    bottom: -6px;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -3px;
    overflow: hidden;
    border: 3px solid transparent;
    border-top-color: #ed5565
}

.irs--flat .irs-grid-pol {
    background-color: #e1e4e9
}

.irs--flat .irs-grid-text {
    color: #999
}

.irs--big {
    height: 55px
}

.irs--big.irs-with-grid {
    height: 70px
}

.irs--big .irs-line {
    top: 33px;
    height: 12px;
    background-color: #fff;
    background: linear-gradient(to bottom, #ddd -50%, #fff 150%);
    border: 1px solid #ccc;
    border-radius: 12px
}

.irs--big .irs-bar {
    top: 33px;
    height: 12px;
    background-color: #92bce0;
    border: 1px solid #428bca;
    background: linear-gradient(to bottom, #fff 0, #428bca 30%, #b9d4ec 100%);
    box-shadow: inset 0 0 1px 1px rgba(255, 255, 255, .5)
}

.irs--big .irs-bar--single {
    border-radius: 12px 0 0 12px
}

.irs--big .irs-shadow {
    height: 1px;
    bottom: 16px;
    background-color: rgba(66, 139, 202, .5)
}

.irs--big .irs-handle {
    top: 25px;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(0, 0, 0, .3);
    background-color: #cbcfd5;
    background: linear-gradient(to bottom, #fff 0, #b4b9be 30%, #fff 100%);
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .2), inset 0 0 3px 1px #fff;
    border-radius: 30px
}

.irs--big .irs-handle.state_hover, .irs--big .irs-handle:hover {
    border-color: rgba(0, 0, 0, .45);
    background-color: #939ba7;
    background: linear-gradient(to bottom, #fff 0, #919ba5 30%, #fff 100%)
}

.irs--big .irs-max, .irs--big .irs-min {
    top: 0;
    padding: 1px 5px;
    color: #fff;
    text-shadow: none;
    background-color: #9f9f9f;
    border-radius: 3px
}

.irs--big .irs-from, .irs--big .irs-single, .irs--big .irs-to {
    color: #fff;
    text-shadow: none;
    padding: 1px 5px;
    background-color: #428bca;
    background: linear-gradient(to bottom, #428bca 0, #3071a9 100%);
    border-radius: 3px
}

.irs--big .irs-grid-pol {
    background-color: #428bca
}

.irs--big .irs-grid-text {
    color: #428bca
}

.irs--modern {
    height: 55px
}

.irs--modern.irs-with-grid {
    height: 55px
}

.irs--modern .irs-line {
    top: 25px;
    height: 5px;
    background-color: #d1d6e0;
    background: linear-gradient(to bottom, #e0e4ea 0, #d1d6e0 100%);
    border: 1px solid #a3adc1;
    border-bottom-width: 0;
    border-radius: 5px
}

.irs--modern .irs-bar {
    top: 25px;
    height: 5px;
    background: #20b426;
    background: linear-gradient(to bottom, #20b426 0, #18891d 100%)
}

.irs--modern .irs-bar--single {
    border-radius: 5px 0 0 5px
}

.irs--modern .irs-shadow {
    height: 1px;
    bottom: 21px;
    background-color: rgba(209, 214, 224, .5)
}

.irs--modern .irs-handle {
    top: 37px;
    width: 12px;
    height: 13px;
    border: 1px solid #a3adc1;
    border-top-width: 0;
    box-shadow: 1px 1px 1px rgba(0, 0, 0, .1);
    border-radius: 0 0 3px 3px
}

.irs--modern .irs-handle > i:nth-child(1) {
    position: absolute;
    display: block;
    top: -4px;
    left: 1px;
    width: 6px;
    height: 6px;
    border: 1px solid #a3adc1;
    background: #fff;
    transform: rotate(45deg)
}

.irs--modern .irs-handle > i:nth-child(2) {
    position: absolute;
    display: block;
    box-sizing: border-box;
    top: 0;
    left: 0;
    width: 10px;
    height: 12px;
    background: #e9e6e6;
    background: linear-gradient(to bottom, #fff 0, #e9e6e6 100%);
    border-radius: 0 0 3px 3px
}

.irs--modern .irs-handle > i:nth-child(3) {
    position: absolute;
    display: block;
    box-sizing: border-box;
    top: 3px;
    left: 3px;
    width: 4px;
    height: 5px;
    border-left: 1px solid #a3adc1;
    border-right: 1px solid #a3adc1
}

.irs--modern .irs-handle.state_hover, .irs--modern .irs-handle:hover {
    border-color: #7685a2;
    background: #c3c7cd;
    background: linear-gradient(to bottom, #fff 0, #919ba5 30%, #fff 100%)
}

.irs--modern .irs-handle.state_hover > i:nth-child(1), .irs--modern .irs-handle:hover > i:nth-child(1) {
    border-color: #7685a2
}

.irs--modern .irs-handle.state_hover > i:nth-child(3), .irs--modern .irs-handle:hover > i:nth-child(3) {
    border-color: #48536a
}

.irs--modern .irs-max, .irs--modern .irs-min {
    top: 0;
    font-size: 10px;
    line-height: 1.333;
    text-shadow: none;
    padding: 1px 5px;
    color: #fff;
    background-color: #d1d6e0;
    border-radius: 5px
}

.irs--modern .irs-from, .irs--modern .irs-single, .irs--modern .irs-to {
    font-size: 10px;
    line-height: 1.333;
    text-shadow: none;
    padding: 1px 5px;
    background-color: #20b426;
    color: #fff;
    border-radius: 5px
}

.irs--modern .irs-from:before, .irs--modern .irs-single:before, .irs--modern .irs-to:before {
    position: absolute;
    display: block;
    content: "";
    bottom: -6px;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -3px;
    overflow: hidden;
    border: 3px solid transparent;
    border-top-color: #20b426
}

.irs--modern .irs-grid {
    height: 25px
}

.irs--modern .irs-grid-pol {
    background-color: #dedede
}

.irs--modern .irs-grid-text {
    color: silver;
    font-size: 13px
}

.irs--sharp {
    height: 50px;
    font-size: 12px;
    line-height: 1
}

.irs--sharp.irs-with-grid {
    height: 57px
}

.irs--sharp .irs-line {
    top: 30px;
    height: 2px;
    background-color: #000;
    border-radius: 2px
}

.irs--sharp .irs-bar {
    top: 30px;
    height: 2px;
    background-color: #ee22fa
}

.irs--sharp .irs-bar--single {
    border-radius: 2px 0 0 2px
}

.irs--sharp .irs-shadow {
    height: 1px;
    bottom: 21px;
    background-color: rgba(0, 0, 0, .5)
}

.irs--sharp .irs-handle {
    top: 25px;
    width: 10px;
    height: 10px;
    background-color: #a804b2
}

.irs--sharp .irs-handle > i:first-child {
    position: absolute;
    display: block;
    top: 100%;
    left: 0;
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-top-color: #a804b2
}

.irs--sharp .irs-handle.state_hover, .irs--sharp .irs-handle:hover {
    background-color: #000
}

.irs--sharp .irs-handle.state_hover > i:first-child, .irs--sharp .irs-handle:hover > i:first-child {
    border-top-color: #000
}

.irs--sharp .irs-max, .irs--sharp .irs-min {
    color: #fff;
    font-size: 14px;
    line-height: 1;
    top: 0;
    padding: 3px 4px;
    opacity: .4;
    background-color: #a804b2;
    border-radius: 2px
}

.irs--sharp .irs-from, .irs--sharp .irs-single, .irs--sharp .irs-to {
    font-size: 14px;
    line-height: 1;
    text-shadow: none;
    padding: 3px 4px;
    background-color: #a804b2;
    color: #fff;
    border-radius: 2px
}

.irs--sharp .irs-from:before, .irs--sharp .irs-single:before, .irs--sharp .irs-to:before {
    position: absolute;
    display: block;
    content: "";
    bottom: -6px;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -3px;
    overflow: hidden;
    border: 3px solid transparent;
    border-top-color: #a804b2
}

.irs--sharp .irs-grid {
    height: 25px
}

.irs--sharp .irs-grid-pol {
    background-color: #dedede
}

.irs--sharp .irs-grid-text {
    color: silver;
    font-size: 13px
}

.irs--round {
    height: 50px
}

.irs--round.irs-with-grid {
    height: 65px
}

.irs--round .irs-line {
    top: 36px;
    height: 4px;
    background-color: #dee4ec;
    border-radius: 4px
}

.irs--round .irs-bar {
    top: 36px;
    height: 4px;
    background-color: #006cfa
}

.irs--round .irs-bar--single {
    border-radius: 4px 0 0 4px
}

.irs--round .irs-shadow {
    height: 4px;
    bottom: 21px;
    background-color: rgba(222, 228, 236, .5)
}

.irs--round .irs-handle {
    top: 26px;
    width: 24px;
    height: 24px;
    border: 4px solid #006cfa;
    background-color: #fff;
    border-radius: 24px;
    box-shadow: 0 1px 3px rgba(0, 0, 255, .3)
}

.irs--round .irs-handle.state_hover, .irs--round .irs-handle:hover {
    background-color: #f0f6ff
}

.irs--round .irs-max, .irs--round .irs-min {
    color: #333;
    font-size: 14px;
    line-height: 1;
    top: 0;
    padding: 3px 5px;
    background-color: rgba(0, 0, 0, .1);
    border-radius: 4px
}

.irs--round .irs-from, .irs--round .irs-single, .irs--round .irs-to {
    font-size: 14px;
    line-height: 1;
    text-shadow: none;
    padding: 3px 5px;
    background-color: #006cfa;
    color: #fff;
    border-radius: 4px
}

.irs--round .irs-from:before, .irs--round .irs-single:before, .irs--round .irs-to:before {
    position: absolute;
    display: block;
    content: "";
    bottom: -6px;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -3px;
    overflow: hidden;
    border: 3px solid transparent;
    border-top-color: #006cfa
}

.irs--round .irs-grid {
    height: 25px
}

.irs--round .irs-grid-pol {
    background-color: #dedede
}

.irs--round .irs-grid-text {
    color: silver;
    font-size: 13px
}

.irs--square {
    height: 50px
}

.irs--square.irs-with-grid {
    height: 60px
}

.irs--square .irs-line {
    top: 31px;
    height: 4px;
    background-color: #dedede
}

.irs--square .irs-bar {
    top: 31px;
    height: 4px;
    background-color: #000
}

.irs--square .irs-shadow {
    height: 2px;
    bottom: 21px;
    background-color: #dedede
}

.irs--square .irs-handle {
    top: 25px;
    width: 16px;
    height: 16px;
    border: 3px solid #000;
    background-color: #fff;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg)
}

.irs--square .irs-handle.state_hover, .irs--square .irs-handle:hover {
    background-color: #f0f6ff
}

.irs--square .irs-max, .irs--square .irs-min {
    color: #333;
    font-size: 14px;
    line-height: 1;
    top: 0;
    padding: 3px 5px;
    background-color: rgba(0, 0, 0, .1)
}

.irs--square .irs-from, .irs--square .irs-single, .irs--square .irs-to {
    font-size: 14px;
    line-height: 1;
    text-shadow: none;
    padding: 3px 5px;
    background-color: #000;
    color: #fff
}

.irs--square .irs-grid {
    height: 25px
}

.irs--square .irs-grid-pol {
    background-color: #dedede
}

.irs--square .irs-grid-text {
    color: silver;
    font-size: 11px
}

.irs--flat {
    height: 12px
}

.irs--flat .irs-line {
    height: 2px;
    background: #514e4b;
    top: 6px
}

.irs--flat .irs-handle {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--color-3);
    top: 1px;
    cursor: pointer
}

.irs--flat .irs-handle > i {
    opacity: 0;
    visibility: hidden
}

.irs--flat .irs-bar {
    height: 2px;
    background: var(--color-3);
    top: 6px
}

body.compensate-for-scrollbar {
    overflow: hidden
}

.fancybox-active {
    height: auto
}

.fancybox-is-hidden {
    left: -9999px;
    margin: 0;
    position: absolute !important;
    top: -9999px;
    visibility: hidden
}

.fancybox-container {
    -webkit-backface-visibility: hidden;
    height: 100%;
    left: 0;
    outline: 0;
    position: fixed;
    -webkit-tap-highlight-color: transparent;
    top: 0;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    transform: translateZ(0);
    width: 100%;
    z-index: 99992
}

.fancybox-container * {
    box-sizing: border-box
}

.fancybox-bg, .fancybox-inner, .fancybox-outer, .fancybox-stage {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}

.fancybox-outer {
    -webkit-overflow-scrolling: touch;
    overflow-y: auto
}

.fancybox-bg {
    background: #1e1e1e;
    opacity: 0;
    transition-duration: inherit;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.47, 0, .74, .71)
}

.fancybox-is-open .fancybox-bg {
    opacity: .9;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1)
}

.fancybox-caption, .fancybox-infobar, .fancybox-navigation .fancybox-button, .fancybox-toolbar {
    direction: ltr;
    opacity: 0;
    position: absolute;
    transition: opacity .25s ease, visibility 0s ease .25s;
    visibility: hidden;
    z-index: 99997
}

.fancybox-show-caption .fancybox-caption, .fancybox-show-infobar .fancybox-infobar, .fancybox-show-nav .fancybox-navigation .fancybox-button, .fancybox-show-toolbar .fancybox-toolbar {
    opacity: 1;
    transition: opacity .25s ease 0s, visibility 0s ease 0s;
    visibility: visible
}

.fancybox-infobar {
    color: #ccc;
    font-size: 13px;
    -webkit-font-smoothing: subpixel-antialiased;
    height: 44px;
    left: 0;
    line-height: 44px;
    min-width: 44px;
    mix-blend-mode: difference;
    padding: 0 10px;
    pointer-events: none;
    top: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.fancybox-toolbar {
    right: 0;
    top: 0
}

.fancybox-stage {
    direction: ltr;
    overflow: visible;
    transform: translateZ(0);
    z-index: 99994
}

.fancybox-is-open .fancybox-stage {
    overflow: hidden
}

.fancybox-slide {
    -webkit-backface-visibility: hidden;
    display: none;
    height: 100%;
    left: 0;
    outline: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: absolute;
    text-align: center;
    top: 0;
    transition-property: transform, opacity;
    white-space: normal;
    width: 100%;
    z-index: 99994
}

.fancybox-slide::before {
    content: '';
    display: inline-block;
    font-size: 0;
    height: 100%;
    vertical-align: middle;
    width: 0
}

.fancybox-is-sliding .fancybox-slide, .fancybox-slide--current, .fancybox-slide--next, .fancybox-slide--previous {
    display: block
}

.fancybox-slide--image {
    overflow: hidden;
    padding: 44px 0
}

.fancybox-slide--image::before {
    display: none
}

.fancybox-slide--html {
    padding: 6px
}

.fancybox-content {
    background: #fff;
    display: inline-block;
    margin: 0;
    max-width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: relative;
    text-align: left;
    vertical-align: middle
}

.fancybox-slide--image .fancybox-content {
    animation-timing-function: cubic-bezier(.5, 0, .14, 1);
    -webkit-backface-visibility: hidden;
    background: 0 0;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    left: 0;
    max-width: none;
    overflow: visible;
    padding: 0;
    position: absolute;
    top: 0;
    -ms-transform-origin: top left;
    transform-origin: top left;
    transition-property: transform, opacity;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 99995
}

.fancybox-can-zoomOut .fancybox-content {
    cursor: zoom-out
}

.fancybox-can-zoomIn .fancybox-content {
    cursor: zoom-in
}

.fancybox-can-pan .fancybox-content, .fancybox-can-swipe .fancybox-content {
    cursor: -webkit-grab;
    cursor: grab
}

.fancybox-is-grabbing .fancybox-content {
    cursor: -webkit-grabbing;
    cursor: grabbing
}

.fancybox-container [data-selectable=true] {
    cursor: text
}

.fancybox-image, .fancybox-spaceball {
    background: 0 0;
    border: 0;
    height: 100%;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none;
    padding: 0;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%
}

.fancybox-spaceball {
    z-index: 1
}

.fancybox-slide--iframe .fancybox-content, .fancybox-slide--map .fancybox-content, .fancybox-slide--pdf .fancybox-content, .fancybox-slide--video .fancybox-content {
    height: 100%;
    overflow: visible;
    padding: 0;
    width: 100%
}

.fancybox-slide--video .fancybox-content {
    background: #000
}

.fancybox-slide--map .fancybox-content {
    background: #e5e3df
}

.fancybox-slide--iframe .fancybox-content {
    background: #fff
}

.fancybox-iframe, .fancybox-video {
    background: 0 0;
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%
}

.fancybox-iframe {
    left: 0;
    position: absolute;
    top: 0
}

.fancybox-error {
    background: #fff;
    cursor: default;
    max-width: 400px;
    padding: 40px;
    width: 100%
}

.fancybox-error p {
    color: #444;
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    padding: 0
}

.fancybox-button {
    background: rgba(30, 30, 30, .6);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    height: 44px;
    margin: 0;
    padding: 10px;
    position: relative;
    transition: color .2s;
    vertical-align: top;
    visibility: inherit;
    width: 44px
}

.fancybox-button, .fancybox-button:link, .fancybox-button:visited {
    color: #ccc
}

.fancybox-button:hover {
    color: #fff
}

.fancybox-button:focus {
    outline: 0
}

.fancybox-button.fancybox-focus {
    outline: 1px dotted
}

.fancybox-button[disabled], .fancybox-button[disabled]:hover {
    color: #888;
    cursor: default;
    outline: 0
}

.fancybox-button div {
    height: 100%
}

.fancybox-button svg {
    display: block;
    height: 100%;
    overflow: visible;
    position: relative;
    width: 100%
}

.fancybox-button svg path {
    fill: currentColor;
    stroke-width: 0
}

.fancybox-button--fsenter svg:nth-child(2), .fancybox-button--play svg:nth-child(2) {
    display: none
}

.fancybox-button--fsexit svg:nth-child(1), .fancybox-button--pause svg:nth-child(1) {
    display: none
}

.fancybox-progress {
    background: #ff5268;
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -ms-transform-origin: 0;
    transform-origin: 0;
    transition-property: transform;
    transition-timing-function: linear;
    z-index: 99998
}

.fancybox-close-small {
    background: 0 0;
    border: 0;
    border-radius: 0;
    color: #ccc;
    cursor: pointer;
    opacity: .8;
    padding: 8px;
    position: absolute;
    right: -12px;
    top: -44px;
    z-index: 401
}

.fancybox-close-small:hover {
    color: #fff;
    opacity: 1
}

.fancybox-slide--html .fancybox-close-small {
    color: currentColor;
    padding: 10px;
    right: 0;
    top: 0
}

.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
    overflow: hidden
}

.fancybox-is-scaling .fancybox-close-small, .fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
    display: none
}

.fancybox-navigation .fancybox-button {
    background-clip: content-box;
    height: 100px;
    opacity: 0;
    position: absolute;
    top: calc(50% - 50px);
    width: 70px
}

.fancybox-navigation .fancybox-button div {
    padding: 7px
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 0;
    left: env(safe-area-inset-left);
    padding: 31px 26px 31px 6px
}

.fancybox-navigation .fancybox-button--arrow_right {
    padding: 31px 6px 31px 26px;
    right: 0;
    right: env(safe-area-inset-right)
}

.fancybox-caption {
    background: linear-gradient(to top, rgba(0, 0, 0, .85) 0, rgba(0, 0, 0, .3) 50%, rgba(0, 0, 0, .15) 65%, rgba(0, 0, 0, .075) 75.5%, rgba(0, 0, 0, .037) 82.85%, rgba(0, 0, 0, .019) 88%, rgba(0, 0, 0, 0) 100%);
    bottom: 0;
    color: #eee;
    font-size: 14px;
    font-weight: 400;
    left: 0;
    line-height: 1.5;
    padding: 75px 44px 25px 44px;
    pointer-events: none;
    right: 0;
    text-align: center;
    z-index: 99996
}

.fancybox-caption--separate {
    margin-top: -50px
}

.fancybox-caption__body {
    max-height: 50vh;
    overflow: auto;
    pointer-events: all
}

.fancybox-caption a, .fancybox-caption a:link, .fancybox-caption a:visited {
    color: #ccc;
    text-decoration: none
}

.fancybox-caption a:hover {
    color: #fff;
    text-decoration: underline
}

.fancybox-loading {
    animation: fancybox-rotate 1s linear infinite;
    background: 0 0;
    border: 4px solid #888;
    border-bottom-color: #fff;
    border-radius: 50%;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 50px;
    z-index: 99999
}

.fancybox-animated {
    transition-timing-function: cubic-bezier(0, 0, .25, 1)
}

.fancybox-fx-slide.fancybox-slide--previous {
    opacity: 0;
    transform: translate3d(-100%, 0, 0)
}

.fancybox-fx-slide.fancybox-slide--next {
    opacity: 0;
    transform: translate3d(100%, 0, 0)
}

.fancybox-fx-slide.fancybox-slide--current {
    opacity: 1;
    transform: translate3d(0, 0, 0)
}

.fancybox-fx-fade.fancybox-slide--next, .fancybox-fx-fade.fancybox-slide--previous {
    opacity: 0;
    transition-timing-function: cubic-bezier(.19, 1, .22, 1)
}

.fancybox-fx-fade.fancybox-slide--current {
    opacity: 1
}

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(1.5, 1.5, 1.5)
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(.5, .5, .5)
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1)
}

.fancybox-fx-rotate.fancybox-slide--previous {
    opacity: 0;
    -ms-transform: rotate(-360deg);
    transform: rotate(-360deg)
}

.fancybox-fx-rotate.fancybox-slide--next {
    opacity: 0;
    -ms-transform: rotate(360deg);
    transform: rotate(360deg)
}

.fancybox-fx-rotate.fancybox-slide--current {
    opacity: 1;
    -ms-transform: rotate(0);
    transform: rotate(0)
}

.fancybox-fx-circular.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0)
}

.fancybox-fx-circular.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(100%, 0, 0)
}

.fancybox-fx-circular.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1) translate3d(0, 0, 0)
}

.fancybox-fx-tube.fancybox-slide--previous {
    transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg)
}

.fancybox-fx-tube.fancybox-slide--next {
    transform: translate3d(100%, 0, 0) scale(.1) skew(10deg)
}

.fancybox-fx-tube.fancybox-slide--current {
    transform: translate3d(0, 0, 0) scale(1)
}

@media all and (max-height: 576px) {
    .fancybox-slide {
        padding-left: 6px;
        padding-right: 6px
    }

    .fancybox-slide--image {
        padding: 6px 0
    }

    .fancybox-close-small {
        right: -6px
    }

    .fancybox-slide--image .fancybox-close-small {
        background: #4e4e4e;
        color: #f2f4f6;
        height: 36px;
        opacity: 1;
        padding: 6px;
        right: 0;
        top: 0;
        width: 36px
    }

    .fancybox-caption {
        padding-left: 12px;
        padding-right: 12px
    }
}

.fancybox-share {
    background: #f4f4f4;
    border-radius: 3px;
    max-width: 90%;
    padding: 30px;
    text-align: center
}

.fancybox-share h1 {
    color: #222;
    font-size: 35px;
    font-weight: 700;
    margin: 0 0 20px 0
}

.fancybox-share p {
    margin: 0;
    padding: 0
}

.fancybox-share__button {
    border: 0;
    border-radius: 3px;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    line-height: 40px;
    margin: 0 5px 10px 5px;
    min-width: 130px;
    padding: 0 15px;
    text-decoration: none;
    transition: all .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

.fancybox-share__button:link, .fancybox-share__button:visited {
    color: #fff
}

.fancybox-share__button:hover {
    text-decoration: none
}

.fancybox-share__button--fb {
    background: #3b5998
}

.fancybox-share__button--fb:hover {
    background: #344e86
}

.fancybox-share__button--pt {
    background: #bd081d
}

.fancybox-share__button--pt:hover {
    background: #aa0719
}

.fancybox-share__button--tw {
    background: #1da1f2
}

.fancybox-share__button--tw:hover {
    background: #0d95e8
}

.fancybox-share__button svg {
    height: 25px;
    margin-right: 7px;
    position: relative;
    top: -1px;
    vertical-align: middle;
    width: 25px
}

.fancybox-share__button svg path {
    fill: #fff
}

.fancybox-share__input {
    background: 0 0;
    border: 0;
    border-bottom: 1px solid #d7d7d7;
    border-radius: 0;
    color: #5d5b5b;
    font-size: 14px;
    margin: 10px 0 0 0;
    outline: 0;
    padding: 10px 15px;
    width: 100%
}

.fancybox-thumbs {
    background: #ddd;
    bottom: 0;
    display: none;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 2px 2px 4px 2px;
    position: absolute;
    right: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    top: 0;
    width: 212px;
    z-index: 99995
}

.fancybox-thumbs-x {
    overflow-x: auto;
    overflow-y: hidden
}

.fancybox-show-thumbs .fancybox-thumbs {
    display: block
}

.fancybox-show-thumbs .fancybox-inner {
    right: 212px
}

.fancybox-thumbs__list {
    font-size: 0;
    height: 100%;
    list-style: none;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    position: absolute;
    position: relative;
    white-space: nowrap;
    width: 100%
}

.fancybox-thumbs-x .fancybox-thumbs__list {
    overflow: hidden
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
    width: 7px
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3)
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 10px
}

.fancybox-thumbs__list a {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: rgba(0, 0, 0, .1);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    float: left;
    height: 75px;
    margin: 2px;
    max-height: calc(100% - 8px);
    max-width: calc(50% - 4px);
    outline: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    width: 100px
}

.fancybox-thumbs__list a::before {
    border: 6px solid #ff5268;
    bottom: 0;
    content: '';
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: all .2s cubic-bezier(.25, .46, .45, .94);
    z-index: 99991
}

.fancybox-thumbs__list a:focus::before {
    opacity: .5
}

.fancybox-thumbs__list a.fancybox-thumbs-active::before {
    opacity: 1
}

@media all and (max-width: 576px) {
    .fancybox-thumbs {
        width: 110px
    }

    .fancybox-show-thumbs .fancybox-inner {
        right: 110px
    }

    .fancybox-thumbs__list a {
        max-width: calc(100% - 10px)
    }
}

@-moz-keyframes fancybox-rotate {
    100% {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes fancybox-rotate {
    100% {
        transform: rotate(360deg)
    }
}

@-o-keyframes fancybox-rotate {
    100% {
        transform: rotate(360deg)
    }
}

@keyframes fancybox-rotate {
    100% {
        transform: rotate(360deg)
    }
}

.compensate-for-scrollbar {
    margin-right: 0 !important
}

body.compensate-for-scrollbar {
    overflow: visible
}

.fancybox-slide--html .fancybox-button {
    top: 6px;
    right: 6px;
    padding: 5px;
    opacity: 1
}

.fancybox-slide--html .fancybox-button path {
    fill: $ _c7
}

.fancybox-is-open .fancybox-bg {
    opacity: .55;
    background: var(514 -e-4-b, #514e4b)
}

.fancybox-infobar {
    font-size: 18px;
    line-height: 24px;
    color: #fff;
    mix-blend-mode: unset;
    font-family: Rubik, arial
}

.fancybox-content {
    padding: 0;
    font-family: var(--font-1)
}

.jq-checkbox, .jq-radio {
    position: relative;
    display: inline-block;
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.jq-checkbox input, .jq-radio input {
    position: absolute;
    z-index: -1;
    margin: 0;
    padding: 0;
    opacity: 0
}

.jq-file {
    position: relative;
    display: inline-block;
    overflow: hidden
}

.jq-file input {
    position: absolute;
    top: 0;
    right: 0;
    height: auto;
    margin: 0;
    padding: 0;
    opacity: 0;
    font-size: 100px;
    line-height: 1em
}

.jq-file__name {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.jq-select-multiple, .jq-selectbox {
    position: relative;
    display: inline-block
}

.jq-select-multiple select, .jq-selectbox select {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    opacity: 0
}

.jq-select-multiple li, .jq-selectbox li {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap
}

.jq-selectbox {
    z-index: 10
}

.jq-selectbox__select {
    position: relative
}

.jq-selectbox__select-text {
    overflow: hidden;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
    text-overflow: ellipsis
}

.jq-selectbox__dropdown {
    position: absolute
}

.jq-selectbox__search input {
    -webkit-appearance: textfield
}

.jq-selectbox__search input::-webkit-search-cancel-button, .jq-selectbox__search input::-webkit-search-decoration {
    -webkit-appearance: none
}

.jq-selectbox__dropdown ul {
    position: relative;
    overflow: auto;
    overflow-x: hidden;
    list-style: none;
    -webkit-overflow-scrolling: touch
}

.jq-select-multiple ul {
    position: relative;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch
}

.jq-number {
    display: inline-block
}

.jq-number__field input {
    -moz-appearance: textfield;
    text-align: left
}

.jq-number__field input::-webkit-inner-spin-button, .jq-number__field input::-webkit-outer-spin-button {
    margin: 0;
    -webkit-appearance: none
}

.jq-checkbox, .jq-radio {
    vertical-align: -4px;
    width: 16px;
    height: 16px;
    margin: 0 4px 0 0;
    border: 1px solid #c3c3c3;
    background: linear-gradient(#fff, #e6e6e6);
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05), inset -1px -1px #fff, inset 1px -1px #fff;
    cursor: pointer
}

.jq-checkbox.focused, .jq-radio.focused {
    border: 1px solid #08c
}

.jq-checkbox.disabled, .jq-radio.disabled {
    opacity: .55
}

.jq-checkbox {
    border-radius: 3px
}

.jq-checkbox.checked .jq-checkbox__div {
    width: 8px;
    height: 4px;
    margin: 3px 0 0 3px;
    border-left: 2px solid #666;
    border-bottom: 2px solid #666;
    transform: rotate(-50deg)
}

.jq-radio {
    border-radius: 50%
}

.jq-radio.checked .jq-radio__div {
    width: 10px;
    height: 10px;
    margin: 3px 0 0 3px;
    border-radius: 50%;
    background: #777;
    box-shadow: inset 1px 1px 1px rgba(0, 0, 0, .7)
}

.jq-file {
    width: 270px;
    border-radius: 4px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1)
}

.jq-file input {
    cursor: pointer
}

.jq-file__name {
    box-sizing: border-box;
    width: 100%;
    height: 34px;
    padding: 0 80px 0 10px;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    background: #fff;
    box-shadow: inset 1px 1px #f1f1f1;
    font: 14px/32px Arial, sans-serif;
    color: #333
}

.jq-file__browse {
    position: absolute;
    top: 1px;
    right: 1px;
    padding: 0 10px;
    border-left: 1px solid #ccc;
    border-radius: 0 4px 4px 0;
    background: linear-gradient(#fff, #e6e6e6);
    box-shadow: inset 1px -1px #f1f1f1, inset -1px 0 #f1f1f1, 0 1px 2px rgba(0, 0, 0, .1);
    font: 14px/32px Arial, sans-serif;
    color: #333;
    text-shadow: 1px 1px #fff
}

.jq-file:hover .jq-file__browse {
    background: linear-gradient(#f6f6f6, #e6e6e6)
}

.jq-file:active .jq-file__browse {
    background: #f5f5f5;
    box-shadow: inset 1px 1px 3px #ddd
}

.jq-file.focused .jq-file__name {
    border: 1px solid #5794bf
}

.jq-file.disabled, .jq-file.disabled .jq-file__browse, .jq-file.disabled .jq-file__name {
    border-color: #ccc;
    background: #f5f5f5;
    box-shadow: none;
    color: #888
}

.jq-number {
    position: relative;
    vertical-align: middle;
    padding: 0 36px 0 0
}

.jq-number__field {
    width: 100px;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    box-shadow: inset 1px 1px #f1f1f1, 0 1px 2px rgba(0, 0, 0, .1)
}

.jq-number__field:hover {
    border-color: #b3b3b3
}

.jq-number__field input {
    box-sizing: border-box;
    width: 100%;
    padding: 8px 9px;
    border: none;
    outline: 0;
    background: 0 0;
    font: 14px Arial, sans-serif;
    color: #333
}

.jq-number__spin {
    position: absolute;
    top: 0;
    right: 0;
    width: 32px;
    height: 14px;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    background: linear-gradient(#fff, #e6e6e6);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
    box-shadow: inset 1px -1px #f1f1f1, inset -1px 0 #f1f1f1, 0 1px 2px rgba(0, 0, 0, .1);
    user-select: none;
    text-shadow: 1px 1px #fff;
    cursor: pointer
}

.jq-number__spin.minus {
    top: auto;
    bottom: 0
}

.jq-number__spin:hover {
    background: linear-gradient(#f6f6f6, #e6e6e6)
}

.jq-number__spin:active {
    background: #f5f5f5;
    box-shadow: inset 1px 1px 3px #ddd
}

.jq-number__spin:after {
    content: '';
    position: absolute;
    top: 4px;
    left: 11px;
    width: 0;
    height: 0;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #999;
    border-left: 5px solid transparent
}

.jq-number__spin.minus:after {
    top: 5px;
    border-top: 5px solid #999;
    border-right: 5px solid transparent;
    border-bottom: none;
    border-left: 5px solid transparent
}

.jq-number__spin.minus:hover:after {
    border-top-color: #000
}

.jq-number__spin.plus:hover:after {
    border-bottom-color: #000
}

.jq-number.focused .jq-number__field {
    border: 1px solid #5794bf
}

.jq-number.disabled .jq-number__field, .jq-number.disabled .jq-number__spin {
    border-color: #ccc;
    background: #f5f5f5;
    box-shadow: none;
    color: #888
}

.jq-number.disabled .jq-number__spin:after {
    border-bottom-color: #aaa
}

.jq-number.disabled .jq-number__spin.minus:after {
    border-top-color: #aaa
}

.jq-selectbox {
    vertical-align: middle;
    cursor: pointer
}

.jq-selectbox__select {
    height: 32px;
    padding: 0 45px 0 10px;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    background: linear-gradient(#fff, #e6e6e6);
    box-shadow: inset 1px -1px #f1f1f1, inset -1px 0 #f1f1f1, 0 1px 2px rgba(0, 0, 0, .1);
    font: 14px/32px Arial, sans-serif;
    color: #333;
    text-shadow: 1px 1px #fff
}

.jq-selectbox__select:hover {
    background: linear-gradient(#f6f6f6, #e6e6e6)
}

.jq-selectbox__select:active {
    background: #f5f5f5;
    box-shadow: inset 1px 1px 3px #ddd
}

.jq-selectbox.focused .jq-selectbox__select {
    border: 1px solid #5794bf
}

.jq-selectbox.disabled .jq-selectbox__select {
    border-color: #ccc;
    background: #f5f5f5;
    box-shadow: none;
    color: #888
}

.jq-selectbox__select-text {
    display: block;
    width: 100%
}

.jq-selectbox .placeholder {
    color: #888
}

.jq-selectbox__trigger {
    position: absolute;
    top: 0;
    right: 0;
    width: 34px;
    height: 100%;
    border-left: 1px solid #ccc
}

.jq-selectbox__trigger-arrow {
    position: absolute;
    top: 14px;
    right: 12px;
    width: 0;
    height: 0;
    border-top: 5px solid #999;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent
}

.jq-selectbox:hover .jq-selectbox__trigger-arrow {
    border-top-color: #000
}

.jq-selectbox.disabled .jq-selectbox__trigger-arrow {
    border-top-color: #aaa
}

.jq-selectbox__dropdown {
    box-sizing: border-box;
    width: 100%;
    margin: 2px 0 0;
    padding: 0;
    border: 1px solid #ccc;
    border-radius: 4px;
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, .2);
    font: 14px/18px Arial, sans-serif
}

.jq-selectbox__search {
    margin: 5px
}

.jq-selectbox__search input {
    box-sizing: border-box;
    width: 100%;
    margin: 0;
    padding: 5px 27px 6px 8px;
    border: 1px solid #ccc;
    border-radius: 3px;
    outline: 0;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAMCAYAAABiDJ37AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAO1JREFUeNqU078LAXEYx/FzYfNzk5TJaFNKYjFYSQZ/hvwBsvg1UCY2xT9gM8hukQGThWRjkcFw3pdnujhfT736Xn2fPvfc3fd07V0OFDDFAnM0ENYsZRiGLSc9OpqIYIA9fMhhjCrW2h9VlMlcH/aymMGtOqEugX08PwQucUZKdTozMIqdTc9WepQD7wjY9ARx+ydwhfyXfS+S0qMcOEQJGcueB3VccFINdMgal6NzkmPjRwJXxDBB7/2RDdtAp6wb+dpphHDASG5QQ0V6u2aoSqBZD/lDrNWRJynLK2qpBn4rc6K2XB9/Nb8EGABtf1thzY6X2AAAAABJRU5ErkJggg==) no-repeat 100% 50%;
    box-shadow: inset 1px 1px #f1f1f1;
    color: #333
}

.jq-selectbox__not-found {
    margin: 5px;
    padding: 5px 8px 6px;
    background: #f0f0f0;
    font-size: 13px
}

.jq-selectbox ul {
    margin: 0;
    padding: 0
}

.jq-selectbox li {
    min-height: 18px;
    padding: 5px 10px 6px;
    color: #231f20
}

.jq-selectbox li.selected {
    background-color: #a3abb1;
    color: #fff
}

.jq-selectbox li:hover {
    background-color: #08c;
    color: #fff
}

.jq-selectbox li.disabled {
    color: #aaa
}

.jq-selectbox li.disabled:hover {
    background: 0 0
}

.jq-selectbox li.optgroup {
    font-weight: 700
}

.jq-selectbox li.optgroup:hover {
    background: 0 0;
    color: #231f20;
    cursor: default
}

.jq-selectbox li.option {
    padding-left: 25px
}

.jq-select-multiple {
    box-sizing: border-box;
    padding: 1px;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    background: #fff;
    box-shadow: inset 1px 1px #f1f1f1, 0 1px 2px rgba(0, 0, 0, .1);
    font: 14px/18px Arial, sans-serif;
    color: #333;
    cursor: default
}

.jq-select-multiple.focused {
    border: 1px solid #5794bf
}

.jq-select-multiple.disabled {
    border-color: #ccc;
    background: #f5f5f5;
    box-shadow: none;
    color: #888
}

.jq-select-multiple ul {
    margin: 0;
    padding: 0
}

.jq-select-multiple li {
    padding: 3px 9px 4px;
    list-style: none
}

.jq-select-multiple li:first-child {
    border-radius: 3px 3px 0 0
}

.jq-select-multiple li:last-child {
    border-radius: 0 0 3px 3px
}

.jq-select-multiple li.selected {
    background: #08c;
    color: #fff
}

.jq-select-multiple li.disabled {
    color: #aaa
}

.jq-select-multiple li.optgroup {
    font-weight: 700
}

.jq-select-multiple li.option {
    padding-left: 25px
}

.jq-select-multiple li.selected.disabled, .jq-select-multiple.disabled li.selected {
    background: #ccc;
    color: #fff
}

input[type=email].styler, input[type=password].styler, input[type=search].styler, input[type=tel].styler, input[type=text].styler, input[type=url].styler, textarea.styler {
    padding: 8px 9px;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    box-shadow: inset 1px 1px #f1f1f1, 0 1px 2px rgba(0, 0, 0, .1);
    font: 14px Arial, sans-serif;
    color: #333
}

input[type=search].styler {
    appearance: none
}

textarea.styler {
    overflow: auto
}

input[type=email].styler:hover, input[type=password].styler:hover, input[type=search].styler:hover, input[type=tel].styler:hover, input[type=text].styler:hover, input[type=url].styler:hover, textarea.styler:hover {
    border-color: #b3b3b3
}

input[type=email].styler:hover:focus, input[type=password].styler:hover:focus, input[type=search].styler:hover:focus, input[type=tel].styler:hover:focus, input[type=text].styler:hover:focus, input[type=url].styler:hover:focus, textarea.styler:hover:focus {
    border-color: #ccc;
    border-top-color: #b3b3b3;
    outline: 0;
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .1)
}

button.styler, input[type=button].styler, input[type=reset].styler, input[type=submit].styler {
    overflow: visible;
    padding: 8px 11px;
    border: 1px solid #ccc;
    border-bottom-color: #b3b3b3;
    border-radius: 4px;
    outline: 0;
    background: linear-gradient(#fff, #e6e6e6);
    box-shadow: inset 1px -1px #f1f1f1, inset -1px 0 #f1f1f1, 0 1px 2px rgba(0, 0, 0, .1);
    font: 14px Arial, sans-serif;
    color: #333;
    text-shadow: 1px 1px #fff;
    cursor: pointer
}

button.styler.styler::-moz-focus-inner, input[type=button].styler.styler::-moz-focus-inner, input[type=reset].styler.styler::-moz-focus-inner, input[type=submit].styler.styler::-moz-focus-inner {
    padding: 0;
    border: 0
}

button.styler:not([disabled]):hover, input[type=button].styler:not([disabled]):hover, input[type=reset].styler:hover, input[type=reset].styler:not([disabled]):hover, input[type=submit].styler:not([disabled]):hover {
    background: linear-gradient(#f6f6f6, #e6e6e6)
}

button.styler:active, input[type=button].styler:active, input[type=reset].styler:active, input[type=submit].styler:active {
    background: #f5f5f5;
    box-shadow: inset 1px 1px 3px #ddd
}

button.styler[disabled], input[type=button].styler[disabled], input[type=submit].styler[disabled] {
    border-color: #ccc;
    background: #f5f5f5;
    box-shadow: none;
    color: #888
}

a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, input, ins, kbd, label, legend, li, main, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, textarea, tfoot, th, thead, time, tr, tt, u, ul, var, video {
    margin: 0;
    padding: 0;
    border: 0
}

article, aside, details, figcaption, figure, footer, header, hgroup, main, nav, section, summary {
    display: block
}

audio, canvas, progress, video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden], template {
    display: none
}

a:active, a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b, strong {
    font-weight: 700
}

dfn {
    font-style: italic
}

mark {
    background: #ff0;
    color: #000
}

li, ol, ul {
    list-style-type: none
}

svg:not(:root) {
    overflow: hidden
}

code, kbd, pre, samp {
    font-size: 1em
}

button, input[type=button], input[type=reset], input[type=submit] {
    -webkit-appearance: button;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: none;
    outline: 0
}

input[disabled] {
    cursor: default
}

button::-moz-focus-inner, input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input[type=checkbox], input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    -moz-box-sizing: content-box;
    -webkit-box-sizing: content-box;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver
}

legend {
    border: 0;
    padding: 0
}

input, textarea {
    outline: 0;
    box-shadow: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border: none
}

input::placeholder, textarea::placeholder {
    opacity: 1
}

input::-ms-clear, textarea::-ms-clear {
    display: none;
    width: 0;
    height: 0
}

input[type=number] {
    -moz-appearance: textfield
}

input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input, textarea {
    border: none;
    outline: 0
}

textarea {
    resize: none
}

optgroup {
    font-weight: 700
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

td, th {
    padding: 0
}

*, :after, :before {
    box-sizing: border-box
}

a[href^="http://maps.google.com/maps"] {
    display: none !important
}

a[href^="https://maps.google.com/maps"] {
    display: none !important
}

.gm-style-cc, .gmnoprint a, .gmnoprint span {
    display: none
}

.gmnoprint div {
    background: 0 0 !important
}

[class$='-gototech'] {
    display: none !important
}

[class$='-copyright__wrap'] {
    display: none !important
}

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

img {
    display: block;
    max-width: 100%
}

:root {
    --color-1: #000;
    --color-2: #514e4b;
    --color-3: #ff8204;
    --color-4: #cbcbcb;
    --color-5: #fff;
    --color-6: #6736dd;
    --color-7: #aeadf0;
    --color-8: #ff4b04;
    --color-9: #d2caca;
    --color-10: #656361;
    --color-11: #787675;
    --color-12: #00cc76;
    --font-1: font-1, arial;
    --container-width: 540px;
    --container-padding: 15px;
    --header-size: 48px;
    --transition: .2s;
    --border-color: #cbcbcb
}

@media all and (min-width: 768px) {
    :root {
        --container-width: 710px
    }
}

@media all and (min-width: 1024px) {
    :root {
        --container-width: 940px;
        --header-size: 60px
    }
}

@media all and (min-width: 1280px) {
    :root {
        --container-width-big: 1060px;
        --container-width: 990px;
        --header-size: 76px
    }
}

@media all and (min-width: 1820px) {
    :root {
        --container-width-big: 1620px;
        --container-width: 1520px;
        --header-size: 92px
    }
}

svg {
    transform: translate3d(0, 0, 0)
}

@font-face {
    font-family: font-1;
    src: url(../fonts/PFIsotextPro-Light.woff2) format('woff2'), url(../fonts/PFIsotextPro-Light.woff) format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: font-1;
    src: url(../fonts/PFIsotextPro-Regular.woff2) format('woff2'), url(../fonts/PFIsotextPro-Regular.woff) format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap
}

@font-face {
    font-family: font-1;
    src: url(../fonts/PFIsotextPro-Bold.woff2) format('woff2'), url(../fonts/PFIsotextPro-Bold.woff) format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap
}

body, html {
    height: 100%
}

.section {
    width: 100%
}

@media all and (min-width: 1280px) {
    .section {
        height: 100%
    }
}

.container {
    max-width: var(--container-width);
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: var(--container-padding);
    padding-left: var(--container-padding)
}

@media all and (min-width: 1280px) {
    .container_big {
        max-width: var(--container-width-big)
    }
}

.h0 {
    font-size: 34px;
    font-weight: 400;
    line-height: 48px;
    font-family: var(--font-1);
    text-transform: uppercase
}

@media all and (min-width: 768px) {
    .h0 {
        font-size: 52px;
        line-height: 66px
    }
}

@media all and (min-width: 1024px) {
    .h0 {
        font-size: 68px;
        line-height: 80px
    }
}

@media all and (min-width: 1280px) {
    .h0 {
        font-size: 84px;
        line-height: 100px
    }
}

@media all and (min-width: 1820px) {
    .h0 {
        font-size: 124px;
        line-height: 140px
    }
}

.h1, h1 {
    font-size: 28px;
    font-weight: 400;
    line-height: 36px;
    font-family: var(--font-1);
    text-transform: uppercase
}

@media all and (min-width: 1024px) {
    .h1, h1 {
        font-size: 34px;
        line-height: 44px
    }
}

@media all and (min-width: 1280px) {
    .h1, h1 {
        font-size: 44px;
        line-height: 56px
    }
}

@media all and (min-width: 1820px) {
    .h1, h1 {
        font-size: 50px;
        line-height: 64px
    }
}

.h2, h2 {
    font-size: 22px;
    font-weight: 400;
    line-height: 28px;
    font-family: var(--font-1)
}

@media all and (min-width: 1024px) {
    .h2, h2 {
        font-size: 28px;
        line-height: 36px
    }

    .h2_changed, h2_changed {
        font-size: 22px !important;
        line-height: 28px !important
    }
}

@media all and (min-width: 1280px) {
    .h2, h2 {
        font-size: 36px;
        line-height: 42px
    }
}

@media all and (min-width: 1820px) {
    .h2, h2 {
        font-size: 40px;
        line-height: 48px
    }

    .h2_changed, h2_changed {
        font-size: 28px !important;
        line-height: 36px !important
    }
}

.h3, h3 {
    font-size: 17px;
    font-weight: 400;
    line-height: 20px;
    font-family: var(--font-1)
}

.h3_orange, h3_orange {
    color: var(--color-3)
}

.h3_gray, h3_gray {
    color: var(--color-11)
}

@media all and (min-width: 1024px) {
    .h3, h3 {
        font-size: 20px;
        line-height: 26px
    }
}

@media all and (min-width: 1280px) {
    .h3, h3 {
        font-size: 22px;
        line-height: 28px
    }
}

@media all and (min-width: 1820px) {
    .h3, h3 {
        font-size: 24px;
        line-height: 32px
    }
}

.p-big {
    font-size: 15px;
    line-height: 20px
}

@media all and (min-width: 1024px) {
    .p-big {
        font-size: 16px;
        line-height: 22px
    }
}

@media all and (min-width: 1280px) {
    .p-big {
        font-size: 18px;
        line-height: 24px
    }
}

@media all and (min-width: 1820px) {
    .p-big {
        font-size: 20px;
        line-height: 24px
    }
}

.hidden {
    visibility: hidden;
    opacity: 0;
    pointer-events: none
}

.has-star:after {
    content: "*";
    margin-left: 4px;
    color: var(--color-1)
}

.has-star_orange:after {
    color: var(--color-3)
}

.pt {
    padding-top: 50px
}

@media all and (min-width: 1024px) {
    .pt {
        padding-top: 60px
    }
}

@media all and (min-width: 1280px) {
    .pt {
        padding-top: 90px
    }
}

@media all and (min-width: 1820px) {
    .pt {
        padding-top: 140px
    }
}

.ptm {
    padding-top: 50px
}

@media all and (min-width: 1024px) {
    .ptm {
        padding-top: 60px
    }
}

@media all and (min-width: 1820px) {
    .ptm {
        padding-top: 80px
    }
}

.pb {
    padding-bottom: 50px
}

@media all and (min-width: 1024px) {
    .pb {
        padding-bottom: 60px
    }
}

@media all and (min-width: 1280px) {
    .pb {
        padding-bottom: 90px
    }
}

@media all and (min-width: 1820px) {
    .pb {
        padding-bottom: 140px
    }
}

.pbm {
    padding-bottom: 50px
}

@media all and (min-width: 1024px) {
    .pbm {
        padding-bottom: 60px
    }
}

@media all and (min-width: 1820px) {
    .pbm {
        padding-bottom: 80px
    }
}

.pt-pb {
    padding-top: 50px;
    padding-bottom: 50px
}

@media all and (min-width: 1024px) {
    .pt-pb {
        padding-top: 60px;
        padding-bottom: 60px
    }
}

@media all and (min-width: 1280px) {
    .pt-pb {
        padding-top: 90px;
        padding-bottom: 90px
    }
}

@media all and (min-width: 1820px) {
    .pt-pb {
        padding-top: 140px;
        padding-bottom: 140px
    }
}

.ptm-pbm {
    padding-top: 50px;
    padding-bottom: 50px
}

@media all and (min-width: 1024px) {
    .ptm-pbm {
        padding-top: 60px;
        padding-bottom: 60px
    }
}

@media all and (min-width: 1820px) {
    .ptm-pbm {
        padding-top: 80px;
        padding-bottom: 80px
    }
}

@media all and (min-width: 1280px) {
    .pt-pb-lg {
        padding-top: 90px;
        padding-bottom: 90px
    }
}

@media all and (min-width: 1820px) {
    .pt-pb-lg {
        padding-top: 140px;
        padding-bottom: 140px
    }
}

.box-text {
    display: grid;
    gap: 12px
}

@media all and (min-width: 1820px) {
    .box-text {
        gap: 16px
    }
}

.d-block {
    display: block !important
}

.color-orange {
    color: var(--color-3)
}

.swiper-button-disabled {
    opacity: .5
}

.d-none {
    display: none !important
}

@media all and (min-width: 768px) {
    .d-sm-none {
        display: none !important
    }
}

@media all and (min-width: 768px) {
    .d-sm-block {
        display: block !important
    }
}

@media all and (min-width: 768px) {
    .d-sm-grid {
        display: grid !important
    }
}

@media all and (min-width: 768px) {
    .d-sm-inline {
        display: inline !important
    }
}

@media all and (min-width: 1024px) {
    .d-md-none {
        display: none !important
    }
}

@media all and (min-width: 1280px) {
    .d-lg-none {
        display: none !important
    }
}

@media all and (min-width: 1280px) {
    .d-lg-block {
        display: block !important
    }
}

@media all and (min-width: 1280px) {
    .d-lg-flex {
        display: flex !important
    }
}

@media all and (min-width: 1820px) {
    .d-xxl-none {
        display: none !important
    }
}

@media all and (min-width: 1280px) {
    .justify-lg-center {
        justify-content: center !important
    }
}

.text-border {
    padding-left: 12px;
    border-left: 2px solid var(--color-3)
}

.text-border_gray {
    border-color: var(--color-11)
}

@media all and (min-width: 1024px) {
    .text-border {
        padding-left: 16px
    }
}

@media all and (min-width: 1820px) {
    .text-border {
        padding-left: 20px
    }
}

.nav-buttons {
    display: flex;
    gap: 34px
}

table {
    width: 100%
}

.price {
    display: flex;
    align-items: baseline;
    gap: 4px
}

.price__text {
    font-size: 17px;
    line-height: 20px
}

.status {
    position: relative;
    padding-left: 14px;
    font-size: 16px;
    line-height: 18px;
    color: rgba(0, 0, 0, .5)
}

.status:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--color-12)
}

.status_orange:before {
    background: var(--color-3)
}

.status_red:before {
    background: var(--color-8)
}

.title-img {
    display: flex;
    align-items: baseline;
    gap: 12px
}

.title-img__icon {
    width: 40px;
    height: 40px
}

@media all and (min-width: 1820px) {
    .title-img {
        gap: 20px
    }

    .title-img__icon {
        width: 100px;
        height: 100px
    }
}

.row {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.to-up {
    transform: translateY(40px);
    opacity: 0;
    transition-duration: .6s;
    transition-delay: .2s
}

.to-up + .to-up {
    transition-delay: .4s
}

.to-up + .to-up + .to-up {
    transition-delay: .6s
}

.to-up + .to-up + .to-up + .to-up {
    transition-delay: .8s
}

.to-up + .to-up + .to-up + .to-up + .to-up {
    transition-delay: 1s
}

.to-up.start-anim {
    transform: translate(0);
    opacity: 1
}

.to-op {
    opacity: 0;
    transition-duration: .6s;
    transition-delay: .2s;
    transition-property: opacity
}

.to-op + .to-op {
    transition-delay: .4s
}

.to-op + .to-op + .to-op {
    transition-delay: .6s
}

.to-op + .to-op + .to-op + .to-op {
    transition-delay: .8s
}

.to-op + .to-op + .to-op + .to-op + .to-op {
    transition-delay: 1s
}

.to-op.start-anim {
    opacity: 1
}

.jcfe {
    justify-content: flex-end !important
}

.aifs {
    align-items: flex-start !important
}

.text-center {
    text-align: center
}

.color-gray {
    color: var(--color-11)
}

.grid-col-2 {
    grid-column: 2
}

@media all and (min-width: 1280px) {
    .grid-col-2 {
        grid-column: 3
    }
}

.grid-col-3 {
    grid-column: 3
}

@media all and (min-width: 1280px) {
    .grid-col-3 {
        grid-column: 4
    }
}

.grid-col-4 {
    grid-column: 4
}

@media all and (min-width: 1280px) {
    .grid-col-4 {
        grid-column: 5
    }
}

.content-block p {
    margin: 12px 0
}

@media all and (min-width: 1440px) {
    .content-block p {
        margin: 16px 0
    }
}

.content-block p:first-child {
    margin-top: 0
}

.content-block p:last-child {
    margin-bottom: 0
}

.content-block_services {
    max-width: 1480px
}

.content-block h2, .content-block h3 {
    margin-top: 50px
}

@media all and (min-width: 768px) {
    .content-block h2, .content-block h3 {
        margin-top: 60px
    }
}

ul {
    display: flex;
    flex-direction: column;
    gap: 12px
}

@media all and (min-width: 1280px) {
    ul {
        gap: 8px
    }
}

ul li {
    padding-left: 30px;
    position: relative
}

ul li::before {
    content: '';
    position: absolute;
    top: 11px;
    left: 15px;
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: var(--color-1)
}

@media all and (min-width: mobile px) {
    select {
        visibility: hidden
    }
}

.button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    width: fit-content;
    padding: 12px 28px;
    font-size: 20px;
    line-height: 24px;
    color: var(--color-3);
    user-select: none;
    border-radius: 48px;
    border: 2px solid rgba(239, 124, 0, .5);
    transition: var(--transition);
    cursor: pointer;
    font-weight: 400;
    font-family: var(--font-1)
}

.button_orange {
    color: var(--color-5);
    background: var(--color-3);
    transition: var(--transition)
}

.button_wide {
    width: 100%
}

@media all and (min-width: 1280px) {
    .button {
        padding: 16px 40px;
        font-size: 24px;
        line-height: 32px;
        transition: var(--transition)
    }

    .button:hover {
        background: var(--color-3);
        color: var(--color-5)
    }

    .button_orange:hover {
        background: var(--color-8)
    }
}

@media all and (min-width: 1820px) {
    .button {
        gap: 24px
    }
}

.button-pic {
    display: flex;
    align-items: flex-end;
    gap: 16px;
    font-size: 18px;
    line-height: 24px;
    color: var(--color-5);
    cursor: pointer;
    font-weight: 400
}

@media all and (min-width: 1820px) {
    .button-pic {
        font-size: 22px;
        line-height: 28px
    }
}

.button-pic img {
    opacity: .3
}

.button-pic.active img {
    opacity: 1
}

.button-arrow {
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 24px;
    line-height: 32px;
    color: var(--color-5)
}

.button-baloon {
    position: relative;
    display: flex;
    justify-content: center
}

.button-baloon__img {
    width: 100px
}

.button-baloon__text {
    position: absolute;
    top: 35px;
    color: var(--color-5, #fff);
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    line-height: 20px;
    text-transform: uppercase
}

@media all and (min-width: 1820px) {
    .button-baloon__img {
        width: 150px
    }

    .button-baloon__text {
        top: 45px;
        font-size: 20px;
        line-height: 28px
    }
}

.button-more {
    color: var(--color-3);
    font-size: 16px;
    font-weight: 400;
    line-height: 22px;
    text-transform: uppercase
}

@media all and (min-width: 1024px) {
    .button-more {
        font-size: 18px;
        line-height: 24px
    }
}

@media all and (min-width: 1820px) {
    .button-more {
        font-size: 20px;
        line-height: 28px
    }
}

.link {
    color: var(--color-3)
}

.link_big {
    font-size: 20px;
    line-height: 28px
}

@media all and (min-width: 1280px) {
    .link {
        transition: .5s ease-out
    }

    .link:hover {
        color: var(--color-8)
    }
}

.button-round {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 2px solid var(--color-3)
}

.button-gift {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--color-3)
}

.button-gift__icon {
    width: 16px;
    height: 20px;
    fill: var(--color-5)
}

@media all and (min-width: 768px) {
    .button-gift {
        width: 52px;
        height: 52px
    }
}

@media all and (min-width: 1820px) {
    .button-gift {
        width: 64px;
        height: 64px
    }
}

.button-set {
    display: flex;
    align-items: center;
    gap: 10px
}

@media all and (min-width: 1024px) {
    .button-set {
        gap: 24px
    }
}

@media all and (min-width: 1280px) {
    .button-set .button-round {
        transition: .5s ease-out
    }

    .button-set .button-round svg {
        transition: .5s ease-out
    }

    .button-set .h3 {
        transition: .5s ease-out
    }

    .button-set:hover .button-round {
        border: 2px solid var(--color-8)
    }

    .button-set:hover .button-round svg {
        fill: var(--color-8)
    }

    .button-set:hover .h3 {
        color: var(--color-8)
    }
}

.button-exit {
    display: flex;
    align-items: center;
    gap: 12px;
    width: fit-content
}

@media all and (min-width: 1024px) {
    .button-exit {
        gap: 16px
    }
}

.button-exit span {
    transition: color .5s ease-out
}

@media all and (min-width: 1280px) {
    .button-exit:hover span {
        color: var(--color-3)
    }
}

.page {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    height: auto;
    min-height: 100%;
    padding-top: var(--header-size);
    font-size: 15px;
    line-height: 20px;
    font-family: var(--font-1);
    font-weight: 300;
    color: var(--color-1);
    background: radial-gradient(100.27% 136.68% at 78.02% 216.06%, #fff 0, rgba(255, 255, 255, 0) 100%), radial-gradient(138.45% 102.22% at 118.36% -25.39%, rgba(255, 255, 255, .63) 0, rgba(255, 255, 255, 0) 100%), radial-gradient(238.72% 123.57% at -43.91% -8.06%, rgba(255, 255, 255, .8) 0, rgba(255, 255, 255, .62) 68.72%, rgba(255, 255, 255, 0) 100%), #eee
}

.page__title {
    margin-bottom: 24px
}

.page__main {
    flex: 1 0 auto
}

.page__wrap-pagination {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 60px;
    margin-top: 24px
}

.page__wrap-nav {
    display: none
}

.page_main .header__row_work {
    display: none
}

.page_work {
    overflow: hidden
}

.page_work .header__row_main {
    display: none
}

.page__crumbs {
    margin-bottom: 24px
}

.page__elem {
    margin-top: 24px
}

.page__head {
    margin-bottom: 16px
}

.page__grid {
    display: grid;
    gap: 16px
}

.page__more {
    margin-top: 24px;
    padding: 10px 28px
}

@media all and (min-width: 1280px) {
    .page__more {
        padding: 14px 28px
    }
}

.page__pagination {
    margin: 32px auto 0
}

.page__selects {
    display: flex !important;
    position: relative;
    max-width: 100%;
    margin-bottom: 20px
}

.page__row {
    margin-top: 50px;
    gap: 92px
}

@media all and (min-width: 768px) {
    .page__wrap-pagination {
        margin-top: 16px
    }

    .page__head {
        margin-bottom: 20px
    }

    .page__grid {
        gap: 20px
    }

    .page__selects {
        display: grid !important;
        margin-top: -60px;
        margin-bottom: 30px
    }

    .page__row {
        margin-top: 60px;
        gap: 20px
    }
}

@media all and (min-width: 1024px) {
    .page {
        font-size: 16px;
        line-height: 22px
    }

    .page__title {
        margin-bottom: 32px
    }

    .page__wrap-pagination {
        margin-top: 20px
    }

    .page__grid {
        gap: 24px
    }

    .page__more {
        margin-top: 32px
    }

    .page__selects {
        margin-top: -72px
    }
}

@media all and (min-width: 1280px) {
    .page {
        padding-top: 0;
        font-size: 18px;
        line-height: 24px
    }

    .page__main {
        width: calc(100% - var(--header-size) * 2);
        margin-right: auto;
        margin-left: auto
    }

    .page__title {
        margin-bottom: 48px
    }

    .page__head {
        margin-bottom: 40px
    }

    .page__wrap-nav {
        display: flex;
        gap: 60px
    }

    .page__wrap-pagination {
        display: none
    }

    .page__row-title {
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .page__footer {
        display: none
    }

    .page__grid {
        gap: 36px
    }

    .page__selects {
        margin-bottom: 70px
    }

    .page_work {
        padding-top: 100px;
        padding-left: var(--header-size)
    }

    .page_work .header__row_main {
        display: flex
    }

    .page_work .header__panel_right {
        display: none
    }

    .page_work .page__footer {
        display: block
    }

    .page_work .page__footer .container {
        max-width: var(--container-width-big)
    }

    .page.show-footer .page__footer {
        position: absolute;
        bottom: 0;
        left: 0;
        display: block;
        width: 100%;
        z-index: 10
    }

    .page.show-baloon .header__baloon {
        display: flex
    }

    .page.container-width .container_big, .page.container-width .page__footer .container {
        max-width: var(--container-width)
    }

    .page.container-width .header__row_work {
        max-width: var(--container-width);
        margin-left: calc(var(--header-size) / 2)
    }
}

@media all and (min-width: 1820px) {
    .page {
        font-size: 20px;
        line-height: 28px
    }

    .page_work {
        padding-top: 95px
    }

    .page__title {
        margin-bottom: 90px
    }

    .page__elem {
        margin-top: 40px
    }

    .page__more {
        margin-top: 60px
    }

    .page__pagination {
        max-width: 450px;
        margin: 40px auto 0
    }

    .page__row {
        margin-top: 80px
    }

    .page.overflow-xxl-hidden {
        overflow: hidden
    }
}

.reset-filter {
    position: absolute;
    top: 0;
    right: -66px;
    cursor: pointer;
    display: none;
    cursor: pointer
}

@media all and (min-width: 1280px) {
    .reset-filter {
        display: block
    }
}

.reset-filter.active svg {
    stroke: #000
}

.reset-filter svg {
    stroke: #cbcbcb
}

.page__title.--mini {
    margin-bottom: 20px
}

@media all and (min-width: 1024px) {
    .page__title.--mini {
        margin-bottom: 24px
    }
}

@media all and (min-width: 1280px) {
    .page__title.--mini {
        margin-bottom: 36px
    }
}

@media all and (min-width: 1280px) {
    .header__row {
        gap: 80px;
        justify-content: flex-start
    }
}

@media all and (min-width: 1280px) {
    .header__button-search.--mobile, .header__pagination.--mobile {
        display: none
    }
}

.header__panel {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
    width: 100%
}

.header__panel_right {
    display: none
}

.header__row {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--container-width);
    height: var(--header-size);
    margin-right: auto;
    margin-left: auto;
    padding-right: var(--container-padding);
    padding-left: var(--container-padding)
}

.header__row:before {
    content: "";
    position: absolute;
    top: 0;
    left: -500px;
    z-index: -1;
    width: calc(100% + 1000px);
    height: 100%;
    background: var(--color-2)
}

.header__row_work:before {
    background: var(--color-5)
}

.header__logo {
    max-width: 120px
}

.header__sub {
    position: absolute;
    top: var(--header-size);
    left: 0;
    z-index: 1;
    left: -100%;
    width: 100%;
    height: 100vh;
    visibility: hidden;
    transition: .3s ease-out;
    min-height: auto;
    overflow-y: auto;
    overflow-x: hidden;
    -ms-overflow-style: none;
    overflow: -moz-scrollbars-none;
    scrollbar-width: none
}

.header__sub::-webkit-scrollbar {
    display: none
}

.header__sub::-moz-scrollbar {
    width: 0;
    height: 0;
    margin-right: -16px
}

.header__sub_visible {
    visibility: visible;
    left: 0
}

.header__nav {
    top: 0
}

.header__button-search, .header__pagination {
    display: none
}

.header__button-phone {
    font-size: 0;
    font-family: var(--font-1)
}

.header__baloon {
    display: none
}

@media all and (min-width: 768px) {
    .header__button-phone {
        font-size: 18px;
        font-weight: 400;
        line-height: 24px;
        color: var(--color-2)
    }

    .header__button-phone svg {
        display: none
    }

    .header__submenu ul {
        max-width: var(--container-width);
        margin-right: auto;
        margin-left: auto
    }
}

@media all and (min-width: 1024px) {
    .header__button-phone svg {
        display: block
    }
}

@media all and (min-width: 1280px) {
    .header.open-menu .header__row_main {
        opacity: 0;
        visibility: hidden
    }

    .header.open-menu .nav__wrapper {
        transform: translateX(0)
    }

    .header.open-feedback .nav__wrapper {
        background: 0
    }

    .header.open-feedback .nav__row {
        justify-content: flex-start
    }

    .header.open-other .nav__wrapper {
        background: 0
    }

    .header.open-other .nav__row {
        justify-content: flex-start
    }

    .header.open-search .nav__wrapper {
        background: 0
    }

    .header.open-search .nav__row {
        justify-content: flex-start
    }

    .header__panel {
        width: var(--header-size);
        height: 100vh;
        --panel-padding: 64px 24px
    }

    .header__panel_right {
        right: 0;
        left: auto;
        display: flex;
        justify-content: center;
        align-items: center;
        background: var(--color-5)
    }

    .header__row {
        flex-direction: column;
        height: 100%;
        padding: var(--panel-padding);
        background: var(--color-2)
    }

    .header__row:before {
        display: none
    }

    .header__row_main {
        position: relative;
        z-index: 10;
        transition: var(--transition)
    }

    .header__row_work {
        position: fixed;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        flex-direction: row;
        max-width: var(--container-width-big);
        width: 100%;
        height: 100px;
        margin-left: calc(var(--header-size) / 2);
        padding: 0 var(--container-padding)
    }

    .header__row_work:before {
        display: block
    }

    .header__row_work .header__logo {
        display: block;
        max-width: 190px;
        width: 100%;
        margin-right: auto;
        margin-left: 230px
    }

    .header__row_work .header__logo img {
        width: 100%
    }

    .header__row_work .header__burger {
        display: none
    }

    .header__logo {
        display: none
    }

    .header__pagination {
        display: flex
    }

    .header__button-search {
        display: block
    }

    .header__sub {
        top: 0;
        width: 100%;
        opacity: 0;
        transition: opacity .3s ease-out
    }

    .header__sub.overflow-visible {
        overflow: visible
    }

    .header__sub_visible {
        opacity: 1
    }

    .header__nav {
        overflow: visible
    }

    .header__submenu {
        z-index: -1
    }

    .header__submenu.header__sub_visible {
        left: 100%
    }

    .header__baloon {
        position: absolute;
        top: 30px;
        right: 0
    }
}

@media all and (min-width: 1820px) {
    .header__row {
        --panel-padding: 100px 24px
    }

    .header__row_work {
        height: 100px
    }

    .header__row_work .header__logo {
        max-width: 202px;
        margin-left: 330px
    }

    .header__submenu {
        padding-top: 96px
    }

    .header__button-phone {
        font-size: 32px
    }

    .header__baloon {
        top: 30px
    }

    .header__baloon .button-baloon__img {
        width: 100px
    }

    .header__baloon .button-baloon__text {
        top: 35px;
        font-size: 14px;
        line-height: 20px
    }
}

.nav {
    background: var(--color-3);
    --nav-padding: var(--container-padding)
}

.nav__wrapper {
    max-width: var(--container-width);
    margin-right: auto;
    margin-left: auto
}

.nav__title {
    margin: 50px 0 34px;
    color: var(--color-5)
}

.nav__form-feedback, .nav__form-other, .nav__form-search {
    padding-right: var(--container-padding);
    padding-left: var(--container-padding);
    background: var(--color-3)
}

@media all and (min-width: 768px) {
    .nav__form-feedback, .nav__form-other, .nav__form-search {
        padding: 0 51px
    }
}

.nav__form-search {
    z-index: 10
}

.nav__buttons {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-top: 35px;
    padding-right: var(--nav-padding);
    padding-left: var(--nav-padding)
}

.nav__menu {
    margin-top: 40px
}

@media all and (min-width: 1280px) {
    .nav {
        background: 0 0
    }

    .nav__row {
        position: absolute;
        justify-content: flex-start;
        background: rgba(255, 130, 5, .89)
    }

    .nav__button-search {
        display: none
    }

    .nav__wrapper {
        position: absolute;
        top: 0;
        left: var(--header-size);
        transform: translateX(-100%);
        width: 500px;
        height: 100%;
        background: rgba(255, 130, 5, .97);
        transition: .3s ease-out
    }

    .nav__title {
        margin-top: 0
    }

    .nav__form-feedback, .nav__form-other, .nav__form-search {
        z-index: -1;
        transform: translateX(0);
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        pointer-events: none;
        opacity: 0;
        background: rgba(255, 130, 5, .97)
    }

    .nav__form-search.header__sub_visible {
        z-index: 1;
        pointer-events: auto;
        opacity: 1
    }

    .nav__form-feedback.header__sub_visible {
        z-index: 1;
        pointer-events: auto;
        opacity: 1
    }

    .nav__form-other.header__sub_visible {
        z-index: 1;
        pointer-events: auto;
        opacity: 1
    }

    .nav__row {
        width: 100%
    }
}

@media all and (min-width: 1820px) {
    .nav {
        --nav-padding: 60px
    }

    .nav__buttons {
        gap: 22px;
        padding-top: 100px
    }

    .nav__menu {
        margin-top: 120px
    }

    .nav__form-feedback, .nav__form-other, .nav__form-search {
        width: 800px;
        padding: var(--nav-padding)
    }

    .nav__title {
        margin-bottom: 40px
    }
}

.menu {
    display: block
}

.menu li {
    padding-left: 0;
    position: static
}

.menu li::before {
    display: none
}

.menu ul {
    display: block;
    padding-bottom: 120px
}

@media all and (min-width: 1280px) {
    .menu ul {
        padding-bottom: 0
    }
}

.menu-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: var(--transition);
    cursor: pointer
}

.menu-item:hover {
    background: var(--color-10)
}

.menu-item__cross {
    flex-shrink: 0;
    margin-right: var(--nav-padding)
}

.menu-link {
    display: block;
    width: 100%;
    padding: 8px var(--nav-padding);
    color: var(--color-5);
    font-size: 24px;
    font-weight: 400;
    line-height: 32px
}

.menu__button-arrow {
    margin: 50px 0 34px var(--nav-padding)
}

@media all and (min-width: 768px) {
    .menu__button-arrow {
        max-width: var(--container-width);
        margin-right: auto;
        margin-left: auto;
        padding: 0 var(--container-padding)
    }
}

@media all and (min-width: 1280px) {
    .menu__button-arrow {
        display: none
    }

    .menu-item_active {
        background: var(--color-10)
    }
}

@media all and (min-width: 1820px) {
    .menu-item__cross {
        margin-right: 38px
    }

    .menu-link {
        padding: 15px var(--nav-padding);
        font-size: 26px;
        line-height: 30px
    }

    .menu__button-arrow {
        margin-top: 112px;
        padding-left: var(--nav-padding)
    }
}

.submenu {
    background: var(--color-2)
}

.submenu-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    transition: var(--transition);
    cursor: pointer
}

.submenu-item:hover {
    background: var(--color-10)
}

.submenu-item__cross {
    margin-right: var(--nav-padding)
}

.submenu-item__nested {
    top: 48px;
    z-index: 1;
    background: #514e4b;
    position: fixed
}

@media all and (min-width: 1024px) {
    .submenu-item__nested {
        top: 60px
    }
}

.submenu-link {
    display: block;
    width: 100%;
    padding: 8px var(--nav-padding);
    color: var(--color-5);
    font-size: 20px;
    font-weight: 400;
    line-height: 24px
}

@media all and (min-width: 1280px) {
    .submenu {
        background: rgba(82, 79, 76, .95)
    }

    .submenu-item__nested {
        transform: translateX(-100%)
    }

    .submenu-item__nested.header__sub_visible {
        transform: translateX(0);
        left: 100%;
        position: fixed;
        top: 0
    }

    .submenu-item__nested .menu__button-arrow {
        display: flex
    }
}

@media all and (min-width: 1820px) {
    .submenu-item__cross {
        margin-right: var(--nav-padding)
    }

    .submenu-item__nested {
        opacity: 0;
        visibility: hidden;
        transition: opacity .5s ease-out
    }

    .submenu-item__nested.header__sub_visible {
        background: rgba(101, 99, 97, .95);
        transform: none;
        left: 200%;
        opacity: 1;
        visibility: visible;
        transition: opacity .5s ease-out
    }

    .submenu-link {
        padding: 15px 10px 15px var(--nav-padding);
        font-size: 22px;
        line-height: 28px
    }
}

.nested {
    background: rgba(101, 99, 97, .94)
}

.nested-item {
    transition: var(--transition)
}

.nested-item:hover {
    background: var(--color-11)
}

@media all and (min-width: 1280px) {
    .nested {
        background: rgba(101, 99, 97, .95)
    }
}

.header.open-menu .header__row::before {
    background: var(--color-3)
}

@media all and (min-width: 1280px) {
    .header.open-menu .header__row::before {
        background: var(--color-5)
    }
}

.page_work .header__logo {
    margin-left: -10px
}

@media all and (min-width: 768px) {
    .page_work .header__logo {
        margin-left: -140px
    }
}

@media all and (min-width: 1024px) {
    .page_work .header__logo {
        margin-left: -140px
    }
}

@media all and (min-width: 1280px) {
    .page_work .header__logo {
        margin-left: 330px
    }
}

@media all and (min-width: 1280px) {
    .submenu-item.active {
        background: var(--color-10)
    }
}

.header.open-menu .header__row.header__row_main {
    display: flex
}

@media all and (min-width: 1280px) {
    .header.open-menu .header__row.header__row_main {
        display: none
    }
}

.header.open-menu .header__row .burger, .header.open-menu .header__row .header__button-phone, .header.open-menu .header__row .header__logo {
    display: none
}

.header.open-menu .header__row .header__button-search {
    display: none
}

.header.open-menu .header__row .header__button-search.--mobile {
    display: flex;
    z-index: 20
}

.pagination-lines {
    position: relative;
    display: flex;
    justify-content: center;
    gap: 10px
}

.pagination-lines .swiper-pagination-bullet {
    position: relative;
    width: 60px;
    height: 2px;
    opacity: 1;
    border-radius: 32px;
    background: var(--color-5);
    background: rgba(255, 255, 255, .3);
    transition: var(--transition)
}

.pagination-lines .swiper-pagination-bullet:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: calc(100% + 40px)
}

.pagination-lines .swiper-pagination-bullet:after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 0%;
    height: 100%;
    background: #ef7c00
}

.pagination-lines .swiper-pagination-bullet-active {
    opacity: 1;
    background: rgba(255, 255, 255, .3)
}

.pagination-lines .swiper-pagination-bullet-active:after {
    width: 100%;
    animation: runningLine 7s forwards
}

@media all and (min-width: 768px) {
    .pagination-lines .swiper-pagination-bullet {
        width: 70px
    }
}

@media all and (min-width: 1280px) {
    .pagination-lines {
        gap: 20px
    }

    .pagination-lines .swiper-pagination-bullet {
        width: 100px
    }
}

@media all and (min-width: 1820px) {
    .pagination-lines .swiper-pagination-bullet {
        width: 160px
    }
}

.pagination-number {
    position: relative
}

.pagination-number__wrapper {
    position: relative
}

.pagination-number__round {
    position: absolute;
    top: 0;
    left: -7px;
    transform: translateY(-2px);
    width: 30px;
    height: 30px;
    background: var(--color-3);
    border-radius: 50%;
    transition: var(--transition)
}

.pagination-number__round:after, .pagination-number__round:before {
    content: "";
    position: absolute;
    bottom: -37px;
    left: 50%;
    transform: translateX(-50%);
    width: 2px;
    height: 30px;
    background: url(../image/main/delimiter.svg)
}

.pagination-number__round:before {
    top: -37px;
    bottom: auto;
    transform: scale(-1, -1);
    opacity: 0
}

.pagination-number__round.show-line-prev:before {
    opacity: 1
}

.pagination-number__round.hide-line-next:after {
    opacity: 0
}

.pagination-number__items {
    position: relative;
    inset: 0 !important;
    transform: none !important;
    display: flex;
    justify-content: center;
    flex-direction: column;
    gap: 50px
}

.pagination-number .swiper-pagination-bullet {
    position: relative;
    width: auto;
    height: auto;
    margin: 0 !important;
    background: 0 0;
    color: var(--color-1);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: center
}

.pagination-number .swiper-pagination-bullet:before {
    content: "0"
}

.pagination-number .swiper-pagination-bullet:nth-child(9) ~ .swiper-pagination-bullet:before {
    display: none
}

.pagination-number .swiper-pagination-bullet-active {
    color: var(--color-5)
}

.pagination-dots {
    display: flex;
    gap: 10px;
    width: fit-content !important
}

.pagination-dots .swiper-pagination-bullet {
    margin: 0 !important;
    opacity: 1;
    background: var(--color-2)
}

.pagination-dots .swiper-pagination-bullet-active {
    background: var(--color-3)
}

.box-quotes {
    position: relative;
    padding: 30px;
    background: var(--color-5)
}

.box-quotes:before {
    content: "";
    position: absolute;
    top: -10px;
    left: 30px;
    width: 43px;
    height: 32px;
    background: url(../image/main/02_company/quotes.svg)
}

.card {
    display: flex;
    flex-direction: column;
    height: 100%;
    padding: 14px 20px;
    background: var(--color-5)
}

.card__icon {
    width: 34px;
    height: 34px;
    margin-bottom: 14px
}

.card__title {
    margin-bottom: 16px;
    border-left: 2px solid var(--color-3)
}

.card__img {
    display: none
}

@media all and (min-width: 768px) {
    .card {
        padding: 20px
    }

    .card__icon {
        width: 40px;
        height: 40px
    }

    .card__text {
        word-break: normal;
        opacity: 1;
        visibility: visible
    }
}

@media all and (min-width: 1024px) {
    .card {
        padding: 28px
    }

    .card__icon {
        width: 54px;
        height: 54px
    }

    .card__title {
        margin-bottom: 24px
    }
}

@media all and (min-width: 1280px) {
    .card {
        position: relative
    }

    .card__img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        display: block;
        opacity: 0;
        pointer-events: none;
        transition: var(--transition)
    }

    .card:hover .card__img {
        opacity: 1
    }
}

@media all and (min-width: 1820px) {
    .card {
        padding: 32px
    }

    .card__icon {
        width: 61px;
        height: 68px
    }

    .card__title {
        margin-bottom: 32px
    }
}

.box {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 16px;
    background: var(--color-5)
}

.box:after {
    content: "";
    position: absolute;
    inset: 0;
    opacity: .85
}

.box_present::after {
    display: none
}

.box_lilac:after {
    background: #aeadf0
}

.box_red:after {
    background: #ff4b04
}

.box__img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.box__title {
    position: relative;
    z-index: 1;
    color: var(--color-5);
    transition: var(--transition);
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5;
    line-clamp: 5;
    -webkit-box-orient: vertical
}

@media all and (min-width: 768px) {
    .box__title {
        -webkit-line-clamp: 3;
        line-clamp: 3
    }
}

.box__info {
    position: absolute;
    bottom: 32px;
    left: 16px;
    z-index: 1;
    padding-left: 10px;
    color: var(--color-5);
    padding-right: 10px
}

.box__dsc {
    margin-bottom: 20px;
    padding-left: 10px
}

.box__play {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    margin: auto 0 0 auto
}

.box__icon {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    margin: 0 0 0 auto
}

.box_service {
    height: 218px;
    padding: 20px 32px;
    overflow: hidden
}

.box_service .card__text {
    opacity: 0;
    visibility: hidden
}

.box_indent {
    padding: 32px 8px 8px 32px
}

@media all and (min-width: 768px) {
    .box {
        align-items: flex-end
    }

    .box__info {
        left: 32px
    }

    .box_service {
        padding: 20px 24px 20px 30px
    }

    .box_indent {
        padding: 32px 16px 16px 32px
    }

    .box_news {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 32px
    }
}

@media all and (min-width: 1024px) {
    .box_service {
        height: 100%
    }

    .box__info {
        bottom: 40px
    }
}

@media all and (min-width: 1280px) {
    .box:after, .box__img_hover, .box__info {
        transition: var(--transition)
    }

    .box:hover:after {
        opacity: 0
    }

    .box:hover .box__img_hover, .box:hover .box__info {
        opacity: 0
    }

    .box:hover .box__title {
        opacity: 0
    }

    .box_service {
        align-items: flex-start
    }

    .box_service .card__text {
        opacity: 1;
        visibility: visible
    }
}

@media all and (min-width: 1820px) {
    .box {
        padding: 80px 50px
    }

    .box_present {
        padding: 16px
    }

    .box__info {
        left: 50px;
        padding-right: 20px;
        word-break: normal
    }

    .box__info br {
        display: none
    }

    .box__dsc br {
        display: none
    }

    .box_indent {
        padding: 48px 20px 20px 48px
    }
}

.team-box {
    display: block
}

.team-box__wrap-media {
    position: relative
}

.team-box__img {
    width: 100%;
    height: 120px;
    object-fit: cover
}

.team-box__img_2 {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}

.team-box__title {
    padding: 10px;
    text-align: center
}

@media all and (min-width: 1024px) {
    .team-box__img {
        height: 162px
    }
}

@media all and (min-width: 1280px) {
    .team-box:hover .team-box__img_2 {
        opacity: 1
    }

    .team-box__img_2 {
        transition: var(--transition)
    }
}

@media all and (min-width: 1820px) {
    .team-box__img {
        height: 220px
    }

    .team-box__title {
        padding: 20px
    }
}

.style-box {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px
}

.style-box__title {
    text-align: center
}

.style-box__icon {
    width: 100%;
    height: 70px;
    object-fit: contain
}

.style-box__text {
    text-align: center
}

@media all and (min-width: 1024px) {
    .style-box__icon {
        height: 110px
    }
}

@media all and (min-width: 1820px) {
    .style-box {
        gap: 60px
    }

    .style-box__icon {
        height: 180px
    }

    .style-box_breef {
        gap: 20px
    }
}

.js-go-feadback, .js-go-production {
    cursor: pointer;
    transition: var(--transition)
}

@media all and (min-width: 1280px) {
    .js-go-feadback:hover, .js-go-production:hover {
        color: var(--color-3)
    }
}

.title-logo {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 20px
}

.title-logo__img {
    max-width: 120px;
    width: 100%
}

@media all and (min-width: 768px) {
    .title-logo {
        gap: 30px
    }
}

@media all and (min-width: 1024px) {
    .title-logo__img {
        max-width: 140px
    }
}

@media all and (min-width: 1280px) {
    .title-logo {
        gap: 44px
    }

    .title-logo__img {
        max-width: 200px
    }
}

@media all and (min-width: 1820px) {
    .title-logo {
        gap: 58px
    }

    .title-logo__img {
        max-width: 300px
    }
}

.scroll-box {
    position: relative;
    overflow-x: scroll;
    transition: all .2s;
    will-change: transform;
    user-select: none;
    overflow: auto;
    scrollbar-color: var(--color-3) var(--color-2);
    scrollbar-width: thin
}

.scroll-box::-webkit-scrollbar-track {
    background-color: var(--color-2);
    border-radius: 6px
}

.scroll-box::-webkit-scrollbar-thumb {
    border-radius: 6px;
    background-color: var(--color-3)
}

.scroll-box::-webkit-scrollbar {
    width: 6px;
    border-radius: 6px
}

.scroll-box::-webkit-scrollbar:horizontal {
    height: 6px;
    background-color: var(--color-3);
    border-radius: 6px
}

.scroll-box::-webkit-scrollbar-thumb:horizontal {
    background: var(--color-3);
    border-radius: 10px
}

.scroll-box__item {
    display: inline-block;
    transform: translateX(-47px)
}

.scroll-box__item_active {
    cursor: grabbing;
    cursor: -webkit-grabbing
}

@media all and (min-width: 768px) {
    .scroll-box {
        overflow: visible
    }

    .scroll-box__item {
        transform: translateX(0)
    }
}

.steps-box {
    position: relative
}

.steps-box__img {
    min-width: 794px;
    height: 324px;
    pointer-events: none
}

.steps-box__item {
    position: absolute;
    bottom: 200px;
    width: max-content;
    color: #222;
    font-size: 17px;
    font-weight: 400;
    line-height: 20px
}

@media all and (min-width: 768px) {
    .steps-box__item {
        font-size: 14.569px;
        line-height: 19.425px;
        letter-spacing: .291px
    }
}

.steps-box__item._1 {
    bottom: 10px;
    left: 85px
}

.steps-box__item._2 {
    bottom: 114px;
    left: 135px
}

.steps-box__item._3 {
    bottom: 34px;
    left: 241px
}

.steps-box__item._4 {
    top: 115px;
    left: 307px
}

.steps-box__item._5 {
    top: 215px;
    left: 408px
}

.steps-box__item._6 {
    top: 71px;
    left: 476px
}

.steps-box__item._7 {
    top: 160px;
    left: 582px
}

.steps-box__item._8 {
    top: 90px;
    left: 647px
}

@media all and (min-width: 768px) {
    .steps-box__img {
        min-width: 645px
    }

    .steps-box__item._1 {
        bottom: 14px;
        left: 47px
    }

    .steps-box__item._2 {
        bottom: 116px;
        left: 101px
    }

    .steps-box__item._3 {
        bottom: 42px;
        left: 196px
    }

    .steps-box__item._4 {
        top: 115px;
        left: 260px
    }

    .steps-box__item._5 {
        top: 209px;
        left: 354px
    }

    .steps-box__item._6 {
        top: 71px;
        left: 413px
    }

    .steps-box__item._7 {
        top: 160px;
        left: 516px
    }

    .steps-box__item._8 {
        top: 90px;
        left: 581px
    }
}

@media all and (min-width: 1024px) {
    .steps-box__img {
        min-width: 910px;
        height: auto
    }

    .steps-box__item._1 {
        left: 58px
    }

    .steps-box__item._2 {
        bottom: 140px;
        left: 129px
    }

    .steps-box__item._3 {
        bottom: 52px;
        left: 257px
    }

    .steps-box__item._4 {
        top: 153px;
        left: 344px
    }

    .steps-box__item._5 {
        top: 262px;
        left: 469px
    }

    .steps-box__item._6 {
        top: 94px;
        left: 548px
    }

    .steps-box__item._7 {
        top: 210px;
        left: 687px
    }

    .steps-box__item._8 {
        top: 117px;
        left: 768px
    }
}

@media all and (min-width: 1280px) {
    .steps-box__img {
        transition-delay: .4s
    }

    .steps-box__item {
        font-size: 22px;
        line-height: 28px
    }

    .steps-box__item._1 {
        bottom: 9px;
        left: 65px;
        transition-delay: .6s
    }

    .steps-box__item._2 {
        bottom: 151px;
        left: 136px;
        transition-delay: .8s
    }

    .steps-box__item._3 {
        bottom: 38px;
        left: 276px;
        transition-delay: 1s
    }

    .steps-box__item._4 {
        top: 148px;
        left: 357px;
        transition-delay: 1.2s
    }

    .steps-box__item._5 {
        top: 277px;
        left: 499px;
        transition-delay: 1.4s
    }

    .steps-box__item._6 {
        top: 85px;
        left: 583px;
        transition-delay: 1.6s
    }

    .steps-box__item._7 {
        top: 218px;
        left: 730px;
        transition-delay: 1.8s
    }

    .steps-box__item._8 {
        top: 119px;
        left: 813px;
        transition-delay: 2s
    }
}

@media all and (min-width: 1820px) {
    .steps-box__item {
        font-size: 24px;
        line-height: 32px
    }

    .steps-box__item._1 {
        bottom: 28px;
        left: 104px
    }

    .steps-box__item._2 {
        bottom: 236px;
        left: 209px
    }

    .steps-box__item._3 {
        bottom: 85px;
        left: 432px
    }

    .steps-box__item._4 {
        top: 258px;
        left: 559px
    }

    .steps-box__item._5 {
        top: 435px;
        left: 778px
    }

    .steps-box__item._6 {
        top: 154px;
        left: 903px
    }

    .steps-box__item._7 {
        top: 334px;
        left: 1130px
    }

    .steps-box__item._8 {
        top: 186px;
        left: 1261px
    }
}

.crumbs {
    padding: 16px 0 24px;
    position: relative;
    z-index: 1
}

.crumbs__row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 24px
}

.crumbs__item {
    position: relative;
    display: flex;
    align-items: center;
    gap: 6px;
    padding-right: 20px;
    color: var(0, #000);
    font-size: 14px;
    font-style: normal;
    font-weight: 300;
    line-height: 22px;
    letter-spacing: .14px
}

.crumbs__icon {
    width: 14px;
    height: 9px;
    fill: $ _c2
}

@media all and (min-width: 768px) {
    .crumbs__item {
        font-size: 16px;
        line-height: 24px
    }
}

@media all and (min-width: 1024px) {
    .crumbs {
        padding-bottom: 32px
    }
}

@media all and (min-width: 1280px) {
    .crumbs {
        padding-top: 46px
    }

    .crumbs__row {
        gap: 0
    }

    .crumbs__item {
        padding: 0;
        font-size: 16px;
        line-height: 24px
    }

    .crumbs__item:not(:last-child) {
        position: relative;
        display: block;
        padding: 0 8px 0 0
    }

    .crumbs__item:not(:last-child):after {
        content: '/';
        margin-left: 4px;
        color: var(--color-3)
    }

    .crumbs__item:last-child {
        color: rgba(0, 0, 0, .5)
    }

    .crumbs__icon {
        display: none
    }
}

.table-titles {
    display: none
}

.table-tr {
    display: grid;
    grid-template-columns:80px repeat(2, 1fr) 20px;
    gap: 8px;
    padding: 10px 4px;
    background: var(--color-5)
}

.table-tr:not(:last-child) {
    border-bottom: 1px solid var(--border-color)
}

.table-tr_lk {
    padding: 20px 10px;
    border: 0 !important
}

.table-tr__media {
    grid-column: 1;
    grid-row: 1/5
}

.table-tr__close {
    grid-column: 4;
    grid-row: 1/5
}

.table-tr__img {
    width: 80px;
    height: 80px
}

.table-tr__articul, .table-tr__name {
    grid-column: span 2
}

.table-tr__name {
    font-weight: 400
}

.table-tr__articul {
    font-weight: 300
}

.table-tr__articul_span_3 {
    grid-column: span 3
}

.table-tr__price {
    display: flex;
    align-items: baseline;
    gap: 4px
}

.table-tr__close {
    cursor: pointer
}

@media all and (min-width: 768px) {
    .table-titles {
        display: grid;
        grid-template-columns:100px 200px 90px 60px 60px 54px;
        gap: 0;
        justify-content: space-between;
        padding-bottom: 16px
    }

    .table-titles__name {
        text-align: left;
        font-weight: 300
    }

    .table-titles__name:nth-child(1) {
        text-align: center
    }

    .table-tr {
        display: grid;
        grid-template-columns:100px 200px 90px 60px 60px 54px;
        gap: 0;
        justify-content: space-between;
        align-items: center;
        padding: 10px 0
    }

    .table-tr__articul, .table-tr__close, .table-tr__media, .table-tr__name {
        grid-column: unset;
        grid-row: unset
    }

    .table-tr__img {
        width: 100px;
        height: 100px
    }

    .table-tr__close {
        text-align: center
    }
}

@media all and (min-width: 1024px) {
    .table-titles {
        grid-template-columns:130px 280px 120px 60px 60px 54px
    }

    .table-tr {
        grid-template-columns:130px 280px 120px 60px 60px 54px
    }

    .table-tr__img {
        width: 130px;
        height: 130px
    }
}

@media all and (min-width: 1280px) {
    .table-titles {
        grid-template-columns:160px 320px 140px 70px 60px 54px
    }

    .table-tr {
        grid-template-columns:160px 320px 140px 70px 60px 54px
    }

    .table-tr__img {
        width: 160px;
        height: 160px
    }
}

@media all and (min-width: 1820px) {
    .table-titles {
        grid-template-columns:180px 500px 140px 70px 60px 74px
    }

    .table-tr {
        grid-template-columns:180px 500px 140px 70px 60px 74px
    }

    .table-tr__img {
        width: 180px;
        height: 180px
    }
}

.counter {
    display: grid;
    grid-template-columns:10px 20px 10px;
    gap: 16px
}

.counter-input {
    font-size: 18px;
    line-height: 24px;
    font-family: var(--font-1);
    text-align: center
}

.counter-minus, .counter-plus {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32px;
    line-height: 28px;
    opacity: .5;
    cursor: pointer;
    user-select: none
}

@media all and (min-width: 768px) {
    .counter {
        justify-content: space-between;
        gap: 0
    }

    .counter-minus {
        margin-bottom: 4px
    }
}

.select {
    width: 100%;
    height: 41px
}

.select .jq-selectbox {
    position: relative;
    z-index: 9;
    display: block
}

.select .jq-selectbox__select {
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0 !important;
    box-shadow: none !important
}

.select .jq-selectbox__select-text {
    max-width: 200px;
    color: rgba(87, 82, 76, .8);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    font-family: var(--font-1)
}

@media all and (min-width: 1820px) {
    .select .jq-selectbox__select-text {
        font-size: 20px;
        line-height: 24px
    }
}

.select .jq-selectbox__trigger {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 12px;
    height: 6px;
    background: url(../image/cart/arrow.svg) center/contain no-repeat;
    transition: var(--transtion);
    border: 0
}

.select .jq-selectbox__trigger-arrow {
    display: none
}

.select .jq-selectbox__dropdown {
    position: absolute
}

.select .jq-selectbox__dropdown ul {
    margin: 0
}

.select .jq-selectbox__dropdown li {
    cursor: pointer
}

.select .jq-selectbox__dropdown li:last-child {
    margin-bottom: 0
}

.select .jq-selectbox__input {
    width: 100%;
    height: 40px;
    padding: 8px 15px;
    font-size: 14px;
    line-height: 24px;
    color: $ _c1;
    background: $ _c6;
    border: 1px solid $ _c13
}

.select .jq-selectbox.opened .jq-selectbox__trigger {
    transform: translateY(-50%) rotate(180deg)
}

.select_mod {
    display: flex;
    align-items: flex-end;
    height: 36px;
    border-bottom: 1px solid rgba(87, 82, 76, .2)
}

.select_mod .jq-selectbox {
    width: 100%
}

.select_mod .jq-selectbox__select-text {
    color: var(--color-1)
}

.popup {
    display: flex;
    flex-direction: column;
    gap: 20px;
    max-width: 330px;
    width: 100%;
    padding: 24px;
    background: var(--color-5)
}

@media all and (min-width: 1820px) {
    .popup {
        max-width: 490px;
        padding: 70px
    }
}

.popup-box__row {
    max-width: 360px
}

@media all and (min-width: 768px) {
    .popup-box__row {
        display: grid;
        grid-template-columns:1fr 1fr;
        max-width: 760px
    }
}

@media all and (min-width: 1280px) {
    .popup-box__row {
        max-width: 1000px
    }
}

@media all and (min-width: 1820px) {
    .popup-box__row {
        max-width: 1250px
    }
}

.list {
    display: grid;
    gap: 8px
}

.list-item {
    position: relative;
    padding-left: 26px
}

.list-item:before {
    content: "";
    position: absolute;
    top: 2px;
    left: 0;
    width: 16px;
    height: 16px;
    background: url(../image/point.svg) center/contain no-repeat
}

@media all and (min-width: 768px) {
    .list-item:before {
        top: 6px
    }
}

.accordion {
    display: grid;
    gap: 20px
}

.accordion-item {
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border-color)
}

.accordion-item._active .cross__line_orange::before {
    opacity: 0;
    visibility: hidden
}

.accordion-item_lk {
    padding: 0
}

.accordion-item_lk:last-child {
    border-bottom: 0
}

.accordion-item_lk .accordion-item__content {
    padding-top: 0
}

.accordion-item_lk .accordion-item__btn {
    padding: 20px 12px;
    background: var(--color-5);
    transition: background var(--transition)
}

@media all and (min-width: 768px) {
    .accordion-item_lk .accordion-item__btn {
        padding: 24px
    }
}

@media all and (min-width: 1280px) {
    .accordion-item_lk .accordion-item__btn {
        padding: 36px 24px
    }
}

@media all and (min-width: 1820px) {
    .accordion-item_lk .accordion-item__btn {
        padding: 48px
    }
}

.accordion-item_lk._active .box-info__text {
    color: var(--color-3)
}

.accordion-item_lk._active .accordion-item__btn {
    background: 0 0
}

.accordion-item__btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    width: 100%;
    padding: 0 0 0 20px;
    text-align: left;
    border-width: 3px
}

.accordion-item__content {
    display: none;
    padding-top: 16px;
    padding: 20px 20px 50px 20px;
    background: var(--color-5);
    margin-top: 14px
}

@media all and (min-width: 1280px) {
    .accordion-item__content {
        margin-top: 20px;
        padding: 20px 20px 60px 20px;
        gap: 20px
    }
}

.accordion-item__content-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.accordion-item__content-wrapper > div {
    display: flex;
    flex-direction: column;
    gap: 8px
}

.tabs-row {
    display: flex;
    flex-direction: column-reverse;
    gap: 20px
}

.tabs__row {
    margin-bottom: 16px
}

.tabs__btns {
    display: flex;
    justify-content: space-between;
    max-width: 330px;
    width: 100%
}

.tabs__btn {
    border-bottom: 2px solid transparent;
    transition: var(--transition)
}

.tabs__btn_active {
    color: var(--color-1);
    border-bottom: 2px solid var(--color-3)
}

.tabs__item {
    display: none
}

.tabs__item_active {
    display: block
}

@media all and (min-width: 768px) {
    .tabs-row {
        flex-direction: row;
        justify-content: space-between;
        align-items: center
    }

    .tabs__row {
        margin-bottom: 20px
    }

    .tabs__btns {
        margin-bottom: 0
    }
}

@media all and (min-width: 1024px) {
    .tabs__btns {
        justify-content: flex-start;
        gap: 40px;
        max-width: 100%;
        width: auto
    }
}

@media all and (min-width: 1280px) {
    .tabs__row {
        margin-bottom: 40px
    }
}

@media all and (min-width: 1820px) {
    .tabs__items {
        position: relative;
        z-index: 1
    }

    .tabs__items:after {
        content: "";
        position: absolute;
        bottom: -60px;
        right: -176px;
        z-index: -1;
        width: 260px;
        height: 473px;
        background: url(../image/lk/img_background.svg)
    }
}

.box-info {
    display: grid;
    grid-template-columns:1fr 1fr;
    column-gap: 14px
}

.box-info__text {
    transition: var(--transition)
}

.box-info__price {
    display: flex;
    align-items: center;
    grid-column: 2;
    grid-row: 1/3;
    border-width: 1px
}

@media all and (min-width: 768px) {
    .box-info {
        display: flex;
        gap: 8px;
        align-items: center
    }

    .box-info__price {
        padding-left: 20px;
        margin-left: 12px
    }
}

.video-catalog__slides {
    display: grid;
    gap: 4px
}

.video-catalog__slide {
    display: grid;
    gap: 4px;
    grid-auto-rows: 190px
}

.video-catalog__slide:nth-child(3n+1) .box:nth-child(1):after {
    background: linear-gradient(0, rgba(0, 0, 0, .5) 0, rgba(0, 0, 0, .5) 100%)
}

.video-catalog__slide:nth-child(3n+1) .box:nth-child(2):after {
    background: linear-gradient(0, rgba(255, 75, 4, .85) 0, rgba(255, 75, 4, .85) 100%), #d3d3d3 -2.319px -48.352px/107.307% 126.897% no-repeat
}

.video-catalog__slide:nth-child(3n+1) .box:nth-child(3):after {
    background: linear-gradient(0, rgba(174, 173, 240, .85) 0, rgba(174, 173, 240, .85) 100%), #d3d3d3 -2.579px -52.169px/107.307% 126.897% no-repeat
}

.video-catalog__slide:nth-child(3n+2) .box:nth-child(1):after {
    background: linear-gradient(0, rgba(103, 54, 221, .85) 0, rgba(103, 54, 221, .85) 100%), #d3d3d3 -2.579px -52.169px/107.307% 126.897% no-repeat
}

.video-catalog__slide:nth-child(3n+2) .box:nth-child(2):after {
    background: linear-gradient(0, rgba(255, 130, 4, .85) 0, rgba(255, 130, 4, .85) 100%), #d3d3d3 -2.579px -52.169px/107.307% 126.897% no-repeat
}

.video-catalog__slide:nth-child(3n+2) .box:nth-child(3):after {
    background: linear-gradient(0, rgba(0, 0, 0, .5) 0, rgba(0, 0, 0, .5) 100%)
}

@media all and (min-width: 768px) {
    .video-catalog__slides {
        grid-template-columns:1fr 1fr
    }
}

@media all and (min-width: 1024px) {
    .video-catalog__slide {
        grid-template-columns:repeat(2, minmax(0, 1fr))
    }

    .video-catalog__slide:nth-child(odd) {
        grid-template-rows:256px 130px
    }

    .video-catalog__slide:nth-child(odd) .box:nth-child(1) {
        grid-column: span 2
    }

    .video-catalog__slide:nth-child(even) {
        grid-template-rows:130px 256px
    }

    .video-catalog__slide:nth-child(even) .box:nth-child(3) {
        grid-column: span 2
    }
}

@media all and (min-width: 1820px) {
    .video-catalog__slide:nth-child(odd) {
        grid-template-rows:414px 200px
    }

    .video-catalog__slide:nth-child(odd) .box:nth-child(1) {
        height: auto
    }

    .video-catalog__slide:nth-child(even) {
        grid-template-rows:200px 414px
    }

    .video-catalog__slide:nth-child(even) .box:nth-child(3) {
        height: auto
    }
}

.pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 330px
}

@media all and (min-width: 768px) {
    .pagination {
        max-width: 376px
    }
}

@media all and (min-width: 1280px) {
    .pagination {
        max-width: 545px
    }
}

.pagination-items {
    display: flex;
    gap: 24px;
    margin: 0 24px
}

@media all and (min-width: 768px) {
    .pagination-items {
        gap: 32px;
        margin: 0 32px
    }
}

.pagination-item {
    font-size: 15px;
    line-height: 20px
}

@media all and (min-width: 768px) {
    .pagination-item {
        font-size: 16px;
        line-height: 22px
    }
}

@media all and (min-width: 1280px) {
    .pagination-item {
        font-size: 24px;
        line-height: 32px
    }
}

.pagination-item._active {
    color: var(--color-3)
}

.pagination .button-round {
    width: 48px;
    height: 48px
}

@media all and (min-width: 1280px) {
    .pagination .button-round {
        width: 58px;
        height: 58px
    }
}

.present-items {
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media all and (min-width: 768px) {
    .present-items {
        display: grid;
        grid-template-columns:repeat(3, 1fr)
    }
}

.box-wrap {
    display: grid;
    grid-template-rows:180px auto;
    gap: 14px
}

@media all and (min-width: 768px) {
    .box-wrap {
        grid-template-rows:120px auto
    }
}

@media all and (min-width: 1024px) {
    .box-wrap {
        grid-template-rows:180px auto
    }
}

@media all and (min-width: 1280px) {
    .box-wrap:hover .h3 {
        color: var(--color-3)
    }
}

@media all and (min-width: 1820px) {
    .box-wrap {
        grid-template-rows:260px auto
    }
}

.box-wrap .h3 {
    transition: var(--transition)
}

.round {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--color-5)
}

@media all and (min-width: 768px) {
    .round {
        top: -10px;
        right: -10px
    }
}

@media all and (min-width: 1280px) {
    .round {
        top: 0;
        right: 0
    }
}

.round_dark {
    color: var(--color-5);
    text-align: center;
    line-height: 12px;
    background: rgba(0, 0, 0, .5)
}

.round_big {
    width: 48px;
    height: 48px
}

@media all and (min-width: 1280px) {
    .round_big {
        width: 60px;
        height: 60px
    }
}

@media all and (min-width: 1820px) {
    .round {
        width: 48px;
        height: 48px;
        font-size: 18px;
        line-height: 24px
    }

    .round_dark {
        line-height: 14px
    }
}

.grid {
    display: grid;
    gap: 16px
}

@media all and (min-width: 768px) {
    .grid {
        gap: 20px
    }
}

@media all and (min-width: 768px) {
    .grid_news {
        display: flex;
        align-items: flex-start;
        padding: 32px
    }

    .grid_news .h3 {
        transition: color .5s ease-out
    }
}

@media all and (min-width: 1280px) {
    .grid_news:hover .h3 {
        color: var(--color-3)
    }
}

.box-items {
    display: grid;
    grid-template-columns:repeat(3, 1fr);
    gap: 12px
}

@media all and (min-width: 768px) {
    .box-items {
        grid-template-columns:repeat(4, 1fr)
    }
}

@media all and (min-width: 1024px) {
    .box-items {
        grid-auto-rows: 250px;
        gap: 20px
    }

    .box-items_auto-rows_no {
        grid-auto-rows: unset !important
    }
}

@media all and (min-width: 1280px) {
    .box-items {
        grid-template-columns:repeat(5, 1fr);
        grid-auto-rows: 270px
    }
}

@media all and (min-width: 1820px) {
    .box-items {
        gap: 40px
    }
}

.news-box {
    display: grid;
    gap: 24px
}

.news-box__img {
    width: 100%;
    height: 320px;
    object-fit: cover
}

.news-box__img_min {
    height: 200px
}

.news-box__date {
    display: flex;
    gap: 40px
}

@media all and (min-width: 768px) {
    .news-box {
        grid-template-columns:290px 1fr;
        grid-column-gap: 42px
    }

    .news-box__img {
        grid-row: 1/4;
        height: 280px
    }
}

@media all and (min-width: 1820px) {
    .news-box {
        grid-template-columns:440px 1fr;
        grid-column-gap: 100px
    }

    .news-box__img {
        height: 430px
    }

    .news-box__img_min {
        height: 296px
    }
}

.news-box iframe {
    aspect-ratio: 560/315;
    height: auto;
    max-width: 100%;
    width: 100%
}

@media all and (min-width: 768px) {
    .news-box.--empty {
        grid-template-columns:1fr
    }
}

@media all and (min-width: 1820px) {
    .news-box.--empty {
        grid-template-columns:1fr
    }
}

@-moz-keyframes runningLine {
    0% {
        width: 0%
    }
    100% {
        width: 100%
    }
}

@-webkit-keyframes runningLine {
    0% {
        width: 0%
    }
    100% {
        width: 100%
    }
}

@-o-keyframes runningLine {
    0% {
        width: 0%
    }
    100% {
        width: 100%
    }
}

@keyframes runningLine {
    0% {
        width: 0%
    }
    100% {
        width: 100%
    }
}

.burger {
    position: relative;
    width: 28px;
    height: 28px;
    padding: 0
}

.burger__line {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    width: 100%;
    height: 2px;
    background: var(--color-5);
    transition: ease .2s
}

.burger__line:after, .burger__line:before {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    background: var(--color-5);
    transition: ease .2s
}

.burger__line:before {
    top: -6px
}

.burger__line:after {
    bottom: -6px
}

.burger_dark .burger__line {
    background: var(--color-2)
}

.burger_dark .burger__line:after, .burger_dark .burger__line:before {
    background: var(--color-2)
}

.burger_active .burger__line {
    background: 0 0
}

.burger_active .burger__line:before {
    transform: rotate(45deg);
    top: 0
}

.burger_active .burger__line:after {
    transform: rotate(-45deg);
    bottom: 0
}

.page {
    inputinput: autofill;
    input: -webkit-autofill
}

.page input:-internal-autofill-selected, .page input:-webkit-autofill:active, .page input:-webkit-autofill:focus, .page input:-webkit-autofill:hover {
    background-color: transparent !important;
    background: 0 0 !important;
    box-shadow: none !important;
    -webkit-background: none !important;
    -webkit-box-shadow: none !important;
    -webkit-outline: none !important;
    -webkit-text-fill-color: #fff !important;
    color: #fff !important;
    color-scheme: only dark;
    outline: 0 !important
}

.form .form-error {
    color: red
}

.form .form-error.alert-callback {
    line-height: 16px;
    margin: -20px 0 -10px
}

.form .form-sub-block {
    display: flex;
    gap: 24px;
    flex-wrap: wrap
}

.form .form-sub-block > * {
    width: 100%
}

.form__inner {
    display: flex;
    flex-direction: column;
    gap: 24px
}

.form__contacts {
    display: grid;
    gap: 10px;
    margin-bottom: 24px
}

.form-text {
    font-size: 17px;
    font-weight: 400;
    line-height: 20px
}

.form-text_orange {
    color: var(--color-3)
}

.form__address {
    font-size: 15px;
    font-weight: 300;
    line-height: 20px;
    display: flex;
    align-items: center;
    gap: 12px
}

.form__address span {
    font-weight: 400
}

.form__address-icon {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 50px
}

.form__text {
    margin-bottom: 16px
}

.form__box {
    max-width: 400px
}

.form-contact {
    width: 100vw;
    padding: 32px 32px 50px 32px;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    background: var(--color-5)
}

.form-order {
    max-width: 540px;
    padding: 32px 16px;
    background: var(--color-5)
}

.form-order__info {
    margin-bottom: 16px
}

.form_indent {
    padding: 48px 32px
}

.form_padding {
    padding: 24px
}

.form_light {
    background: var(--color-5)
}

.form_gray {
    background: var(--bg-gray, radial-gradient(100.27% 136.68% at 78.02% 216.06%, #fff 0, rgba(255, 255, 255, 0) 100%), radial-gradient(138.45% 102.22% at 118.36% -25.39%, rgba(255, 255, 255, .63) 0, rgba(255, 255, 255, 0) 100%), radial-gradient(238.72% 123.57% at -43.91% -8.06%, rgba(255, 255, 255, .8) 0, rgba(255, 255, 255, .62) 68.72%, rgba(255, 255, 255, 0) 100%), #eee)
}

.form_grid {
    display: grid;
    gap: 30px
}

.form-subs {
    display: grid;
    gap: 20px
}

.form__button {
    margin-top: 20px
}

.form-decor {
    position: relative;
    max-width: 360px;
    padding: 130px 32px 300px
}

.form-decor:after {
    content: "";
    position: absolute;
    right: -45px;
    bottom: 140px;
    width: 322px;
    height: 112px;
    background: url(../image/lk/img_pop-up.svg) center/contain no-repeat
}

@media all and (min-width: 768px) {
    .form-contact {
        max-width: 390px;
        width: 100%;
        padding: 58px;
        padding: 40px 32px;
        margin-left: 0;
        margin-right: 0
    }

    .form-order {
        padding: 70px
    }

    .form-decor {
        max-width: 600px;
        padding: 80px 80px 200px
    }

    .form-decor:after {
        right: 0;
        bottom: 0;
        width: 357px;
        height: 172px
    }
}

@media all and (min-width: 1280px) {
    .form-contact {
        max-width: 540px;
        padding: 70px
    }

    .form-text {
        font-size: 22px;
        line-height: 28px
    }

    .form__address {
        font-size: 18px;
        line-height: 24px
    }

    .form__contacts {
        margin-bottom: 40px
    }

    .form_padding {
        padding: 40px
    }

    .form-subs {
        padding-bottom: 100px;
        gap: 36px
    }

    .form__button {
        margin-top: 30px
    }
}

@media all and (min-width: 1820px) {
    .form__inner {
        gap: 32px
    }

    .form__inner_gap_min {
        gap: 26px
    }

    .form-contact {
        max-width: 620px;
        padding: 40px 80px
    }

    .form-text {
        font-size: 24px;
        line-height: 32px
    }

    .form__address {
        font-size: 20px;
        line-height: 28px
    }

    .form__contacts {
        margin-bottom: 60px
    }

    .form__text {
        margin-bottom: 40px
    }

    .form-order__info {
        margin-bottom: 40px
    }

    .form_indent {
        padding: 80px 100px
    }

    .form_padding {
        padding: 70px
    }

    .form_grid {
        gap: 60px
    }

    .form-subs {
        padding-bottom: 120px
    }

    .form__button {
        margin-top: 40px
    }
}

.input {
    width: 100%;
    padding: 8px 0;
    color: var(--color-5, #fff);
    font-family: var(--font-1);
    font-size: 20px;
    font-weight: 400;
    line-height: 24px;
    background: 0 0 !important;
    border-bottom: 1px solid var(--color-5, #fff)
}

.input_dark {
    color: var(--color-1);
    border-color: rgba(87, 82, 76, .8)
}

@media all and (min-width: 1820px) {
    .input {
        font-size: 20px;
        line-height: 24px
    }
}

.label-box {
    position: relative;
    display: flex;
    align-items: flex-end;
    gap: 16px
}

.label-box__input:[data-required]:focus ~ label, .label-box__input:[data-required]:valid ~ label, .label-box__input:not([data-not-required]):focus ~ label, .label-box__input:not([data-not-required]):valid ~ label {
    font-size: 14px;
    transform: translateY(-20px)
}

.label-box__input.focused ~ label {
    font-size: 14px;
    transform: translateY(-20px)
}

.label-box.focused .label-box__input ~ label, .label-box.focused label {
    font-size: 14px;
    transform: translateY(-20px)
}

.label-box__text {
    position: absolute;
    left: 0;
    top: 8px;
    color: var(--color-5, #fff);
    font-family: var(--font-1);
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    pointer-events: none;
    transition: var(--transition)
}

.label-box__text_dark {
    color: rgba(87, 82, 76, .8)
}

.label-box__text_error {
    transform: translateY(40px);
    color: var(--color-1);
    opacity: 0
}

.label-box__text_orange {
    color: var(--color-3)
}

.label-box_error .label-box__text_error.label-box__text_dark {
    color: var(--color-3)
}

.label-box_error .label-box__text_error {
    opacity: 1
}

.label-box_error .input {
    border-color: var(--color-1)
}

.label-box_error .input_dark {
    border-color: var(--color-8)
}

.label-box_success .input_dark {
    border-color: var(--color-3)
}

@media all and (min-width: 1820px) {
    .label-box__text {
        top: 0;
        font-size: 20px;
        line-height: 24px
    }
}

.alert {
    display: none
}

.alert.form-error {
    color: red;
    display: block;
    margin: 0 0 30px
}

.header__sub .alert.form-error {
    color: #fff;
    margin: 0 0 30px
}

.check {
    display: flex;
    align-items: center
}

@media all and (min-width: 1280px) {
    .check {
        align-items: flex-start
    }
}

.check__input {
    position: absolute;
    z-index: -1;
    width: 0;
    height: 0;
    opacity: 0
}

.check__input:checked ~ .check__square {
    background: var(--color-3);
    border: 1px solid transparent
}

.check__input:checked ~ .check__square:after {
    opacity: 1
}

.check__square {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: 24px;
    height: 24px;
    margin-right: 12px;
    border: 1px solid var(--color-4);
    transition: var(--transition)
}

.check__square:after {
    content: url(../image/main/menu/check.svg);
    display: block;
    margin-top: 3px;
    opacity: 0;
    transition: ease .3s
}

@media all and (min-width: 1440px) {
    .check__square:after {
        margin-top: 0
    }
}

.check__text {
    color: var(--ffffff, #fff);
    font-size: 16px;
    font-weight: 300;
    line-height: 22px;
    color: var(--color-5);
    user-select: none
}

.check__text .check__link {
    color: var(--color-3);
    transition: .5s ease-out
}

@media all and (min-width: 1280px) {
    .check__text .check__link:hover {
        color: var(--color-8)
    }
}

.check__text_dark {
    color: rgba(87, 82, 76, .8);
    font-size: 12px;
    line-height: 18px
}

@media all and (min-width: 1280px) {
    .check__text_dark {
        font-size: 16px;
        line-height: 22px
    }
}

.check_error .check__square {
    border-color: var(--color-1)
}

.cross {
    position: relative;
    display: inline-flex;
    width: 30px;
    height: 30px
}

.cross__line {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    height: 2px
}

.cross__line:after, .cross__line:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    transform: rotate(45deg);
    width: 100%;
    height: 2px;
    background: var(--color-5);
    transition: var(--transition)
}

.cross__line:after {
    transform: rotate(-45deg)
}

.cross__line_minus:before {
    opacity: 0
}

.cross__line_dark:after, .cross__line_dark:before {
    background: var(--color-1);
    opacity: .5;
    border-radius: 6px
}

.cross__line_orange {
    width: 10px
}

.cross__line_orange:after, .cross__line_orange:before {
    background: var(--color-8);
    border-radius: 6px
}

.cross_plus {
    transform: rotate(45deg);
    width: 20px;
    height: 20px
}

@media all and (min-width: 768px) {
    .cross_plus {
        width: 32px;
        height: 32px
    }
}

.cross_plus:before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 48px;
    height: 48px
}

.cross_medium {
    width: 15px;
    height: 15px
}

.cross_round {
    border-radius: 50%;
    border: 2px solid rgba(255, 130, 4, .5)
}

@media all and (min-width: 1280px) {
    .cross_round {
        border: 2px solid rgba(255, 130, 4, .5)
    }
}

@media all and (min-width: 768px) {
    .cross_medium {
        width: 20px;
        height: 20px
    }
}

@media all and (min-width: 1024px) {
    .cross_medium {
        width: 24px;
        height: 24px
    }
}

@media all and (min-width: 1280px) {
    .cross_round {
        width: 40px;
        height: 40px
    }

    .cross__line_orange {
        width: 15px
    }
}

.icon {
    display: inline-flex;
    width: 28px;
    height: 28px;
    fill: var(--color-5)
}

.icon_orange {
    fill: var(--color-3)
}

.icon_dark {
    fill: var(--color-2)
}

.icon-loop {
    fill: transparent;
    stroke: var(--color-5)
}

.icon-arrow {
    width: 22px;
    height: 16px;
    fill: var(--color-3)
}

.icon-baloon {
    width: 30px
}

@media all and (min-width: 1820px) {
    .icon-baloon {
        width: 38px;
        height: 42px
    }
}

.icon-gift {
    width: 30px
}

@media all and (min-width: 1820px) {
    .icon-gift {
        width: 38px;
        height: 34px
    }
}

.icon-nav {
    width: 40px;
    height: 8px
}

.icon-nav_right {
    transform: scale(-1, -1)
}

.icon-star {
    width: 20px;
    height: 20px;
    fill: var(--color-5)
}

.icon-email {
    width: 23px;
    height: 16px;
    fill: var(--color-5)
}

.icon-sitemap {
    width: 23px;
    height: 16px
}

.icon-ang {
    width: 16px;
    height: 16px
}

.icon-ang_left {
    transform: scale(-1, -1)
}

.icon-ang_down {
    transform: rotate(90deg)
}

.icon-eye {
    stroke: var(--color-2)
}

.icon-play {
    width: 32px;
    height: 32px;
    fill: rgba(255, 255, 255, .9)
}

.slider-vertical__wrapper {
    display: block
}

@media all and (min-width: 1280px) {
    .slider-vertical {
        height: 100vh
    }

    .slider-vertical__wrapper {
        display: flex
    }

    .slider-vertical__slide {
        display: flex;
        justify-content: center;
        align-items: center
    }

    .slider-vertical__section {
        width: 100%
    }

    .slider-vertical .swiper-slide-active .anim-top {
        transform: translateY(0)
    }

    .slider-vertical .swiper-slide-active .anim-op-line:after {
        opacity: 1
    }

    .slider-vertical .swiper-slide-active .anim-to-op {
        opacity: 1
    }
}

.screen-contact.swiper-slide-active .main-logo__mask {
    transform: scale(1)
}

@media all and (min-width: 1820px) {
    .screen-contact.swiper-slide-active .main-logo__mask {
        top: -461px;
        left: -346px
    }
}

.screen-about.swiper-slide-active .main-about__wrap-sl:before {
    opacity: 1
}

.screen-about.swiper-slide-active .main-about__box-quotes {
    transform: translate(0)
}

@media all and (min-width: 1280px) {
    .anim-top {
        transform: translateY(460px);
        transition: 1s
    }
}

@media all and (min-width: 1280px) {
    .anim-op-line:after {
        opacity: 0;
        transition: .6s .8s
    }
}

@media all and (min-width: 1280px) {
    .anim-to-op {
        opacity: 0;
        transition: .6s
    }
}

.slider-min {
    display: none
}

@media all and (min-width: 768px) {
    .slider-min {
        display: block;
        width: 150px
    }

    .slider-min__nav {
        margin-bottom: 20px
    }

    .slider-min__slide {
        display: flex;
        align-items: center;
        gap: 10px;
        cursor: pointer
    }

    .slider-min__img {
        width: 46px;
        height: 46px;
        border-radius: 50%
    }

    .slider-min__text {
        color: var(--color-1, #000);
        font-size: 12px;
        font-weight: 300;
        line-height: 18px;
        letter-spacing: .12px
    }
}

@media all and (min-width: 1024px) {
    .slider-min {
        width: 210px
    }

    .slider-min__img {
        width: 62px;
        height: 62px
    }

    .slider-min__text {
        padding-right: 60px;
        font-size: 14px
    }
}

@media all and (min-width: 1280px) {
    .slider-min__img {
        width: 66px;
        height: 66px
    }
}

@media all and (min-width: 1820px) {
    .slider-min {
        width: 306px
    }

    .slider-min__nav {
        margin-bottom: 50px
    }

    .slider-min__slide {
        gap: 14px
    }

    .slider-min__img {
        width: 100px;
        height: 100px
    }

    .slider-min__text {
        padding-right: 0;
        font-size: 16px;
        line-height: 22px
    }
}

.slider-logos .swiper-wrapper {
    transition-timing-function: linear !important;
    align-items: center
}

.slider-logos .swiper-slide {
    width: auto
}

.slider-logos .swiper-slide img {
    height: 36px;
    filter: grayscale(100%)
}

@media all and (min-width: 1440px) {
    .slider-logos .swiper-slide img {
        height: 44px
    }
}

.main-media {
    position: relative
}

.main-media:after, .main-media:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: .5;
    background: linear-gradient(137deg, rgba(0, 0, 0, .5) 0, rgba(0, 0, 0, 0) 100%);
    z-index: 1
}

.main-media:after {
    background: var(--main-color-1, #11100f)
}

.main-media__pic {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    width: 100%;
    height: 100%;
    object-fit: cover
}

.main-media__sl {
    height: 100%
}

.main-intro {
    position: relative;
    padding: 160px 0 80px;
    overflow: hidden
}

.main-intro__phone {
    z-index: 1
}

.main-intro__logo {
    z-index: 1
}

.main-intro__logo img {
    width: 100%;
    filter: brightness(0) invert(1)
}

.main-intro__container {
    padding: 0 50px
}

.main-intro__head {
    display: none
}

.main-intro__sl {
    overflow: visible
}

.main-intro__media {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none
}

.main-intro__title {
    margin-bottom: 30px;
    color: var(--color-5);
    transform: translateY(40px);
    transition: .6s
}

.main-intro__text {
    margin-bottom: 60px;
    color: var(--main-color-5, #fff);
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
    transform: translateY(40px);
    transition: .6s
}

.main-intro__button {
    transition: .6s;
    transform: translateY(40px)
}

.main-intro__pagination {
    margin-top: 60px;
    z-index: 10
}

.main-intro__baloon {
    display: none
}

.main-intro .swiper-slide-active .main-intro__button {
    transform: translateY(0)
}

.main-intro .swiper-slide-active .main-intro__text {
    transform: translateY(0)
}

.main-intro .swiper-slide-active .main-intro__title {
    transform: translateY(0)
}

@media all and (min-width: 768px) {
    .main-intro {
        padding: 86px 0 54px
    }

    .main-intro__container {
        position: relative;
        padding: 0 var(--container-padding)
    }

    .main-intro__title {
        margin-bottom: 0
    }

    .main-intro__baloon {
        position: absolute;
        top: 0;
        right: 0;
        z-index: 10;
        display: flex
    }
}

@media all and (min-width: 1280px) {
    .main-intro {
        height: 100%;
        padding: 60px 0
    }

    .main-intro__container {
        height: 100%
    }

    .main-intro__head {
        display: flex;
        align-items: center;
        gap: 180px;
        margin-bottom: 136px
    }

    .main-intro__phone {
        color: var(--color-5, #fff);
        font-size: 24px;
        font-weight: 400;
        line-height: 32px
    }

    .main-intro__logo {
        width: 190px
    }

    .main-intro__text {
        font-size: 26px;
        line-height: 32px
    }

    .main-intro__pagination {
        margin-top: 160px
    }
}

@media all and (min-width: 1820px) {
    .main-intro__head {
        gap: 330px;
        margin-bottom: 178px
    }

    .main-intro__phone {
        font-size: 30px;
        line-height: 44px
    }

    .main-intro__logo {
        width: 300px
    }

    .main-intro__text {
        margin-bottom: 70px;
        font-size: 36px;
        line-height: 50px
    }

    .main-intro__pagination {
        margin-top: 130px
    }
}

.main-about__box-quotes {
    margin-top: 20px;
    z-index: 1
}

.main-about .page__row-title {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center
}

.main-about .page__row-title img {
    width: 150px
}

@media all and (min-width: 1280px) {
    .main-about .page__row-title img {
        width: 422px
    }
}

@media all and (min-width: 768px) {
    .main-about__box-quotes {
        margin-top: 0
    }
}

.main-about__row {
    margin-bottom: 20px
}

.main-about__text {
    margin-bottom: 24px
}

.main-about__author {
    margin-bottom: 16px
}

.main-about__wrap-sl {
    position: relative;
    max-width: 330px;
    width: 100%;
    margin: auto
}

.main-about__wrap-sl:after {
    top: 43px;
    z-index: 0;
    background: url(../image/main/02_company/illustration_1.svg) center/contain no-repeat
}

.main-about__wrap-sl._active:before {
    opacity: 0 !important
}

.main-about__wrap-sl._active:after {
    opacity: 1
}

.main-about__wrap-img {
    position: relative
}

.main-about__wrap-img::before {
    content: "";
    position: absolute;
    top: -5px;
    left: -394px;
    z-index: 1;
    width: 998px;
    height: 507px;
    background: url(../image/main/02_company/illustration_2.svg) center/contain no-repeat;
    transition: var(--transtion);
    pointer-events: none;
    opacity: 1;
    visibility: visible;
    transition: .4s
}

@media all and (min-width: 768px) {
    .main-about__wrap-img::before {
        top: 48px;
        left: -474px;
        width: 1075px;
        height: 267px
    }
}

@media all and (min-width: 1024px) {
    .main-about__wrap-img::before {
        top: 67px;
        left: -481px;
        width: 1137px;
        height: 375px
    }
}

@media all and (min-width: 1280px) {
    .main-about__wrap-img::before {
        top: 75px;
        left: -470px;
        width: 1137px;
        height: 427px
    }
}

.main-about__wrap-img::after {
    content: '';
    position: absolute;
    background: url(../image/main/02_company/illustration_1.svg) center/contain no-repeat;
    transition: var(--transtion);
    pointer-events: none;
    opacity: 0;
    visibility: hidden;
    transition: .4s
}

@media all and (min-width: 1280px) {
    .main-about__wrap-img::after {
        top: 75px;
        left: -470px;
        width: 1137px;
        height: 427px
    }
}

@media all and (min-width: 1280px) {
    .main-about__wrap-img:hover::before {
        opacity: 0;
        visibility: hidden
    }

    .main-about__wrap-img:hover::after {
        opacity: 1;
        visibility: visible
    }
}

@media all and (min-width: 1820px) {
    .main-about__wrap-img::before {
        content: "";
        position: absolute;
        top: 112px;
        left: -677px;
        z-index: 1;
        width: 1644px;
        height: 635px;
        background: url(../image/main/02_company/illustration_2.svg) center/contain no-repeat;
        transition: var(--transtion);
        pointer-events: none;
        opacity: 1;
        visibility: visible;
        transition: .4s
    }

    .main-about__wrap-img::after {
        content: "";
        position: absolute;
        top: 112px;
        left: -677px;
        z-index: 1;
        width: 1644px;
        height: 635px;
        background: url(../image/main/02_company/illustration_1.svg) center/contain no-repeat;
        transition: var(--transtion);
        pointer-events: none;
        opacity: 0;
        visibility: hidden;
        transition: .4s
    }
}

.main-about__img {
    left: -7px;
    position: relative;
    top: -2px;
    transition: var(--transition)
}

.main-about__img_2 {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0
}

@media all and (min-width: 768px) {
    .main-about__row {
        display: grid;
        grid-template-columns:215px 1fr;
        justify-content: space-between;
        gap: 50px;
        margin-bottom: 16px
    }

    .main-about__text {
        margin-bottom: 32px
    }

    .main-about__text p:nth-child(2) {
        display: none
    }

    .main-about__wrap-sl {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        max-width: 360px;
        min-width: 0
    }

    .main-about__sl {
        width: 210px
    }

    .main-about__box-quotes {
        margin-top: -110px;
        margin-left: 140px;
        width: 280px;
        padding: 22px 30px
    }

    .main-about__box-quotes:before {
        left: 22px;
        width: 20px;
        height: 15px;
        background-size: contain
    }

    .main-about__pagination {
        display: none
    }
}

@media all and (min-width: 1024px) {
    .main-about__row {
        grid-template-columns:380px 1fr;
        gap: 90px;
        margin-bottom: 60px
    }

    .main-about__text p:nth-child(2) {
        display: block
    }

    .main-about__wrap-sl {
        max-width: 100%
    }

    .main-about__wrap-sl:before {
        top: -3px;
        left: -481px;
        width: 1137px;
        height: 426px
    }

    .main-about__sl {
        width: 280px
    }

    .main-about__wrap-img {
        margin-top: 20px
    }

    .main-about__box-quotes {
        width: 360px;
        margin-top: -134px;
        margin-left: 164px;
        padding: 30px 50px 30px 40px
    }

    .main-about__box-quotes:before {
        left: 40px;
        width: 26px;
        height: 20px
    }
}

@media all and (min-width: 1280px) {
    .main-about__row {
        margin-bottom: 0
    }

    .main-about__text {
        margin-bottom: 40px
    }

    .main-about__author {
        font-size: 20px;
        line-height: 26px
    }

    .main-about__box-quotes {
        transform: translate(80px, 80px);
        transition: 1s;
        width: 382px;
        margin-left: 192px
    }

    .main-about__wrap-sl:after, .main-about__wrap-sl:before {
        top: 2px;
        left: -445px;
        width: 1060px;
        height: 553px
    }

    .main-about__wrap-sl:after {
        top: 40px
    }

    .main-about__sl {
        width: 324px
    }

    .main-about__wrap-img {
        margin-top: 20px
    }

    .main-about__wrap-img:hover .main-about__img_1 {
        opacity: 0
    }

    .main-about__wrap-img:hover .main-about__img_2 {
        opacity: 1
    }

    .main-about__img {
        transition: var(--transition)
    }

    .main-about__info-row {
        display: none
    }
}

@media all and (min-width: 1820px) {
    .main-about {
        padding-top: 60px
    }

    .main-about__row {
        grid-template-columns:490px 1fr;
        gap: 144px
    }

    .main-about__author {
        margin-bottom: 0;
        font-size: 24px;
        line-height: 32px
    }

    .main-about__wrap-sl:after, .main-about__wrap-sl:before {
        left: -676px;
        width: 1644px;
        height: 744px;
        opacity: 0
    }

    .main-about__wrap-sl:after {
        top: 60px
    }

    .main-about__sl {
        width: 486px
    }

    .main-about__wrap-img {
        margin-top: -20px
    }

    .main-about__box-quotes {
        width: 566px;
        margin-left: 380px;
        padding: 50px 60px
    }

    .main-about__box-quotes:before {
        top: -17px;
        left: 60px;
        width: 42px;
        height: 32px
    }
}

.main-prod {
    display: block;
    overflow: hidden
}

.main-prod__sl .swiper-slide {
    height: auto
}

.main-prod__slider-logos {
    margin-top: 24px
}

@media all and (min-width: 768px) {
    .main-prod__sl {
        overflow: hidden
    }
}

@media all and (min-width: 1280px) {
    .main-prod__container {
        position: relative
    }

    .main-prod__container:after {
        content: "";
        position: absolute;
        top: -44px;
        right: -105px;
        width: 695px;
        height: 151px;
        pointer-events: none;
        background: url(../image/main/03_production/illustration_3.svg) center/contain no-repeat
    }
}

@media all and (min-width: 1280px) {
    .main-prod__slider-logos {
        margin-top: 36px
    }
}

@media all and (min-width: 1820px) {
    .main-prod__container:after {
        top: -90px;
        width: 1125px;
        height: 200px
    }

    .main-prod__slider-logos {
        margin-top: 90px
    }
}

.main-catalog {
    display: block
}

.main-catalog__slide {
    display: grid;
    grid-template-rows:repeat(3, 106px);
    gap: 4px
}

.main-catalog__slide:nth-child(3n+1) .box:nth-child(1):after {
    background: var(--color-8)
}

.main-catalog__slide:nth-child(3n+1) .box:nth-child(2):after {
    background: var(--color-3)
}

.main-catalog__slide:nth-child(3n+1) .box:nth-child(3):after {
    background: var(--color-6)
}

.main-catalog__slide:nth-child(3n+2) .box:nth-child(1):after {
    background: var(--color-8)
}

.main-catalog__slide:nth-child(3n+2) .box:nth-child(2):after {
    background: var(--color-7)
}

.main-catalog__slide:nth-child(3n+2) .box:nth-child(3):after {
    background: var(--color-3)
}

.main-catalog__slide:nth-child(3n+3) .box:nth-child(1):after {
    background: var(--color-3)
}

.main-catalog__slide:nth-child(3n+3) .box:nth-child(2):after {
    background: var(--color-6)
}

.main-catalog__slide:nth-child(3n+3) .box:nth-child(3):after {
    background: var(--color-8)
}

@media all and (min-width: 768px) {
    .main-catalog__sl {
        overflow: hidden
    }

    .main-catalog__slide {
        grid-template-columns:1fr 1fr;
        grid-template-rows:160px 160px
    }

    .main-catalog__slide .box {
        display: block;
        padding: 70px 20px
    }

    .main-catalog__slide:nth-child(3n+1) .box:nth-child(1) {
        grid-column: 1;
        grid-row: 1/3
    }

    .main-catalog__slide:nth-child(3n+2) .box:nth-child(2) {
        grid-column: 1;
        grid-row: 1/3
    }

    .main-catalog__slide:nth-child(3n+3) .box:nth-child(2) {
        grid-column: 1;
        grid-row: 1/3
    }
}

@media all and (min-width: 1280px) {
    .main-catalog {
        height: 100%;
        overflow: hidden
    }

    .main-catalog__container {
        position: relative
    }

    .main-catalog__container:after {
        content: "";
        position: absolute;
        right: -458px;
        bottom: -257px;
        width: 795px;
        height: 260px;
        background: url(../image/main/04_catalog/illustration_4.svg) center/contain no-repeat
    }

    .main-catalog__slide {
        grid-template-rows:180px 180px
    }
}

@media all and (min-width: 1820px) {
    .main-catalog__container:after {
        right: -539px;
        bottom: -370px;
        width: 1036px;
        height: 388px
    }

    .main-catalog__slide {
        grid-template-rows:240px 240px
    }

    .main-catalog__slide .box {
        padding: 110px 60px
    }
}

.main-portfolio__slide:nth-child(odd) .box:after {
    background: var(--color-8)
}

.main-portfolio__slide:nth-child(even) .box:after {
    background: var(--color-3)
}

.main-portfolio__slide .box {
    align-items: flex-start;
    height: 160px;
    padding: 26px
}

.main-portfolio__button {
    margin: 24px 0 0 auto
}

.main-portfolio__slider-logos {
    margin-top: 24px
}

@media all and (min-width: 768px) {
    .main-portfolio__sl {
        overflow: hidden
    }
}

.main-portfolio__slide .box {
    height: 158px;
    padding: 26px
}

@media all and (min-width: 1024px) {
    .main-portfolio__slide .box {
        height: 214px;
        padding: 30px
    }
}

@media all and (min-width: 1280px) {
    .main-portfolio {
        height: 100%
    }

    .main-portfolio__container {
        position: relative
    }

    .main-portfolio__container:after {
        content: "";
        position: absolute;
        bottom: 120px;
        left: -220px;
        width: 802px;
        height: 86px;
        background: url(../image/main/05_portfolio/snake.svg) center/contain no-repeat
    }

    .main-portfolio__slide .box {
        height: 222px
    }

    .main-portfolio__button {
        margin-top: 40px
    }

    .main-portfolio__slider-logos {
        margin-top: 80px
    }
}

@media all and (min-width: 1820px) {
    .main-portfolio__container:after {
        width: 832px;
        height: 129px;
        bottom: 80px
    }

    .main-portfolio__slide .box {
        height: 357px;
        padding: 60px 50px
    }

    .main-portfolio__button {
        margin-top: 60px
    }
}

.main-service__slide {
    height: auto
}

.main-service__slide:nth-child(odd) .box:after {
    background: var(--color-6)
}

.main-service__slide:nth-child(even) .box:after {
    background: var(--color-7)
}

@media all and (min-width: 768px) {
    .main-service__sl {
        overflow: hidden
    }
}

@media all and (min-width: 1280px) {
    .main-service {
        height: 100%
    }

    .main-service__container {
        position: relative
    }

    .main-service__container:after {
        content: "";
        position: absolute;
        bottom: -184px;
        right: -379px;
        width: 802px;
        height: 86px;
        pointer-events: none;
        background: url(../image/main/06_services/illustration_6.svg) center/contain no-repeat
    }
}

@media all and (min-width: 1820px) {
    .main-service__container:after {
        bottom: -239px;
        right: -579px;
        width: 1203px;
        height: 129px
    }
}

.main-team__items {
    display: grid;
    grid-template-columns:1fr 1fr;
    gap: 10px;
    margin-bottom: 26px
}

.main-team__sl {
    overflow: hidden
}

.main-team__slide {
    height: auto
}

@media all and (min-width: 768px) {
    .main-team__items {
        grid-template-columns:repeat(4, 1fr);
        gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .main-team__items {
        gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .main-team {
        height: 100%
    }

    .main-team__container {
        position: relative
    }

    .main-team__container:after {
        content: "";
        position: absolute;
        top: -30px;
        left: -26px;
        width: 550px;
        height: 130px;
        pointer-events: none;
        background: url(../image/main/07_team/illustration_7.svg) center/contain no-repeat
    }
}

@media all and (min-width: 1820px) {
    .main-team__container:after {
        top: -56px;
        left: -126px;
        width: 823px;
        height: 197px
    }

    .main-team__items {
        gap: 32px;
        margin-bottom: 32px
    }
}

.main-style__sl {
    overflow: hidden
}

.main-style__slide {
    width: auto
}

@media all and (min-width: 768px) {
    .main-style__sl {
        margin-bottom: 24px
    }
}

@media all and (min-width: 1024px) {
    .main-style__sl {
        margin-bottom: 32px
    }
}

@media all and (min-width: 1280px) {
    .main-style__slide:nth-child(1) {
        transition-delay: .2s
    }

    .main-style__slide:nth-child(2) {
        transition-delay: .4s
    }

    .main-style__slide:nth-child(3) {
        transition-delay: .6s
    }

    .main-style__slide:nth-child(4) {
        transition-delay: .8s
    }

    .main-style__slide:nth-child(5) {
        transition-delay: 1s
    }

    .main-style__slide:nth-child(6) {
        transition-delay: 1.2s
    }
}

@media all and (min-width: 1820px) {
    .main-style__sl {
        margin-bottom: 90px
    }
}

.main-client {
    overflow: hidden
}

@media all and (min-width: 1280px) {
    .main-client {
        height: 100%
    }
}

@media all and (min-width: 1820px) {
    .main-client__scroll-box {
        margin-top: -50px
    }
}

.main-logo {
    position: relative;
    overflow: hidden
}

.main-logo__title {
    position: relative;
    z-index: 1
}

.main-logo__box {
    position: relative
}

.main-logo__box.start-anim .main-logo__mask {
    transform: scale(1)
}

.main-logo__mask {
    position: absolute;
    top: -106px;
    left: -68px;
    transform: scale(2.8);
    min-width: 445px;
    transition: 1.4s .2s;
    pointer-events: none
}

@media all and (min-width: 380px) {
    .main-logo__mask {
        min-width: 490px
    }
}

@media all and (min-width: 768px) {
    .main-logo__mask {
        top: -228px;
        left: -161px;
        min-width: 980px
    }
}

@media all and (min-width: 1024px) {
    .main-logo__mask {
        top: -299px;
        left: -210px;
        min-width: 1300px;
        transform: scale(3)
    }
}

@media all and (min-width: 1280px) {
    .main-logo {
        height: 100%
    }

    .main-logo__mask {
        top: -309px;
        left: -225px;
        min-width: 1372px
    }

}

@media all and (min-width: 1820px) {
    .main-logo {
        height: 100%
    }

    .main-logo__mask {
        top: 944px;
        left: -953px;
        min-width: 2134px;
        transform: scale(23)
    }

}

.ymaps-2-1-79-map::before {
    content: '';
    width: 100%;
    height: 140px;
    background: linear-gradient(180deg, rgba(245, 245, 245, .9) 0, rgba(245, 245, 245, .7) 60.65%, rgba(245, 245, 245, 0) 100%);
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    pointer-events: none
}

@media all and (min-width: 768px) {
    .ymaps-2-1-79-map::before {
        height: 200px
    }
}

@media all and (min-width: 1280px) {
    .ymaps-2-1-79-map::before {
        width: 100%;
        height: 343px;
        background: linear-gradient(180deg, rgba(245, 245, 245, .9) 0, rgba(245, 245, 245, .7) 60.65%, rgba(245, 245, 245, 0) 100%)
    }
}

@media all and (min-width: 768px) {
    .ymaps-2-1-79-map:after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        z-index: 1;
        transform: rotate(-90deg);
        width: 568px;
        height: 100%;
        pointer-events: none;
        background: linear-gradient(180deg, rgba(245, 245, 245, .45) 0, rgba(245, 245, 245, .35) 60.65%, rgba(245, 245, 245, 0) 100%)
    }
}

@media all and (min-width: 1024px) {
    .ymaps-2-1-79-map:after {
        width: 630px
    }
}

@media all and (min-width: 1280px) {
    .ymaps-2-1-79-map:after {
        width: 800px
    }
}

@media all and (min-width: 1820px) {
    .ymaps-2-1-79-map:after {
        left: -500px;
        width: calc(1080px + 500px)
    }
}

.main-contact {
    position: relative;
    overflow: hidden;
    padding-top: 0;
    padding-bottom: 0
}

@media all and (min-width: 768px) {
    .main-contact {
        padding-top: 50px;
        padding-bottom: 50px
    }
}

@media all and (min-width: 1024px) {
    .main-contact {
        padding-top: 60px;
        padding-bottom: 60px
    }
}

@media all and (min-width: 1280px) {
    .main-contact {
        padding-top: 90px;
        padding-bottom: 90px
    }
}

.main-contact__title {
    position: relative;
    margin-bottom: 190px;
    position: absolute;
    top: 50px;
    pointer-events: none
}

.main-contact__map {
    width: 100%;
    height: 462px;
    transition: var(--transition)
}

.main-contact__map .ymaps-2-1-79-map-copyrights-promo {
    display: none
}

.main-contact__map:hover:after {
    opacity: 0
}

.main-contact__form {
    position: relative
}

@media all and (min-width: 768px) {
    .main-contact__title {
        top: 0;
        margin-bottom: 24px;
        position: relative
    }

    .main-contact__map {
        position: absolute;
        top: 0;
        left: -100px;
        width: calc(100% + 400px);
        height: 100%
    }
}

@media all and (min-width: 1280px) {
    .main-contact {
        height: 100%
    }

    .main-contact__title {
        margin-bottom: 50px
    }

    .main-contact__map {
        left: 0
    }
}

@media all and (min-width: 1820px) {
    .main-contact__title {
        margin-bottom: 50px
    }
}

.marque {
    padding-bottom: 20px
}

@media all and (min-width: 768px) {
    .marque {
        position: absolute;
        top: -50px;
        right: 0;
        width: 100%;
        padding-left: 199px
    }
}

@media all and (min-width: 1024px) {
    .marque {
        top: -68px;
        padding-left: 225px
    }
}

@media all and (min-width: 1280px) {
    .marque {
        top: -75px;
        padding-left: 300px
    }
}

@media all and (min-width: 1440px) {
    .marque {
        padding-left: 320px
    }
}

.marque__text {
    color: #ff8204
}

.marque__sl {
    overflow: hidden;
    position: relative
}

.marque__sl-slide {
    width: auto
}

@media all and (min-width: 768px) {
    .marque__sl::before {
        content: '';
        position: absolute;
        left: -15px;
        top: -15px;
        width: 101px;
        height: 51px;
        background: linear-gradient(270.66deg, rgba(249, 249, 249, .16) .49%, rgba(249, 249, 249, .8) 59.95%);
        z-index: 2
    }
}

@media all and (min-width: 768px) {
    .marque__sl::after {
        content: '';
        position: absolute;
        right: 0;
        top: -15px;
        width: 149px;
        height: 51px;
        background: linear-gradient(270.66deg, rgba(249, 249, 249, .16) .49%, rgba(249, 249, 249, .8) 59.95%);
        z-index: 2;
        transform: rotate(180deg)
    }
}

.marque .swiper-wrapper {
    transition-timing-function: linear
}

.footer {
    padding: 16px 0;
    background: var(--color-2)
}

.footer__icons {
    display: flex;
    flex-direction: column;
    justify-content: space-between
}

.footer__row {
    display: flex;
    gap: 42px
}

.footer__menu {
    display: grid;
    gap: 8px
}

.footer-text {
    color: var(--color-5)
}

@media all and (min-width: 768px) {
    .footer__icons {
        display: flex;
        flex-direction: row;
        gap: 40px
    }

    .footer__row {
        display: flex;
        justify-content: space-between
    }

    .footer__menu {
        display: flex;
        gap: 40px
    }
}

@media all and (min-width: 1024px) {
    .footer {
        padding: 20px 0
    }

    .footer__menu {
        gap: 60px
    }
}

@media all and (min-width: 1024px) {
    .footer__menu {
        gap: 80px
    }
}

@media all and (min-width: 1820px) {
    .footer {
        padding: 34px 0
    }

    .footer__menu {
        gap: 190px
    }

    .footer-text {
        font-size: 16px;
        line-height: 22px
    }
}

.cart-section__th {
    display: none
}

.cart-total {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 10px;
    padding: 12px 0;
    border-bottom: 1px solid var(--border-color)
}

.cart-total__text {
    font-size: 22px;
    line-height: 28px;
    font-weight: 400;
    opacity: .5
}

@media all and (min-width: 768px) {
    .cart-total {
        justify-content: flex-end;
        padding: 20px 0
    }
}

@media all and (min-width: 1024px) {
    .cart-total {
        justify-content: flex-end;
        gap: 20px;
        padding: 24px 0
    }

    .cart-total__text {
        font-size: 28px;
        line-height: 36px
    }

    .cart-total__sum span {
        font-size: 20px;
        line-height: 26px
    }
}

@media all and (min-width: 1280px) {
    .cart-total__text {
        font-size: 36px;
        line-height: 42px
    }

    .cart-total__sum p {
        font-size: 44px;
        line-height: 56px
    }

    .cart-total__sum span {
        font-size: 22px;
        line-height: 28px
    }
}

.cart-buttons {
    display: grid;
    grid-template-columns:repeat(2, auto);
    gap: 24px;
    padding: 20px 0;
    padding-bottom: 0
}

.cart-buttons__order {
    grid-row: 1;
    grid-column: span 2;
    margin: auto
}

.cart-buttons__pdf {
    justify-content: flex-end
}

@media all and (min-width: 768px) {
    .cart-buttons {
        display: flex;
        gap: 0;
        padding: 26px 0;
        padding-bottom: 0
    }

    .cart-buttons__order {
        margin: unset
    }

    .cart-buttons__pdf {
        margin-left: 34px
    }

    .cart-buttons__order {
        margin-left: auto
    }
}

@media all and (min-width: 1024px) {
    .cart-buttons__pdf {
        margin-left: 80px
    }
}

@media all and (min-width: 1280px) {
    .cart-buttons__pdf {
        margin-left: 150px
    }
}

@media all and (min-width: 1280px) {
    .cart-buttons {
        padding: 40px 0;
        padding-bottom: 0
    }
}

.cart-box {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    padding: 8px 14px;
    background: var(--color-5)
}

.cart-box__img {
    width: 116px;
    height: 116px;
    margin: 0 auto;
    object-fit: contain
}

.cart-box__title {
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical
}

.cart-box__footer {
    display: flex;
    align-items: center;
    justify-content: space-between
}

@media all and (min-width: 768px) {
    .cart-box {
        padding: 14px 20px
    }

    .cart-box__img {
        width: 156px;
        height: 156px
    }
}

@media all and (min-width: 1820px) {
    .cart-box {
        padding: 24px 30px
    }

    .cart-box__img {
        width: 194px;
        height: 194px
    }
}

.cart-sl .swiper-slide {
    height: auto;
    display: flex;
    flex-direction: column;
    align-items: stretch
}

.cart-sl .swiper-slide .catalog-item {
    display: flex;
    flex-direction: column;
    height: 100%
}

.about-section__title {
    margin-bottom: 14px
}

.about-section__text {
    margin-bottom: 20px
}

@media all and (min-width: 768px) {
    .about-section__list {
        position: relative;
        display: grid;
        grid-template-columns:1fr 1fr;
        column-gap: 24px;
        padding-right: 170px;
        display: block;
        column-count: 2;
        gap: 24px
    }

    .about-section__list .list-item {
        break-inside: avoid-column;
        margin-bottom: 8px
    }

    .about-section__list:after {
        content: "";
        position: absolute;
        top: 74px;
        right: -280px;
        width: 450px;
        height: 90px;
        background: url(../image/about/img_background.svg) center/contain no-repeat;
        pointer-events: none
    }
}

@media all and (min-width: 1024px) {
    .about-section__title {
        margin-bottom: 20px
    }

    .about-section__text {
        margin-bottom: 32px
    }
}

@media all and (min-width: 1280px) {
    .about-section__text {
        margin-bottom: 40px
    }

    .about-section__list {
        padding-right: 290px
    }

    .about-section__list:after {
        right: -406px;
        width: 684px;
        height: 122px
    }
}

@media all and (min-width: 1820px) {
    .about-section__text {
        gap: 16px
    }

    .about-section__list {
        padding-right: 370px;
        gap: 80px
    }

    .about-section__list:after {
        right: -708px;
        width: 1125px;
        height: 200px
    }
}

.about-breef__text {
    margin-bottom: 24px
}

@media all and (min-width: 768px) {
    .about-breef__text {
        margin-bottom: 40px
    }
}

@media all and (min-width: 1820px) {
    .about-breef__text {
        margin-bottom: 60px
    }
}

.about-question__content {
    max-width: 506px
}

@media all and (min-width: 768px) {
    .about-question__container {
        position: relative
    }

    .about-question__container:after {
        content: "";
        position: absolute;
        bottom: 0;
        right: -120px;
        width: 552px;
        height: 60px;
        background: url(../image/about/img_background2.svg) center/contain no-repeat;
        pointer-events: none
    }
}

@media all and (min-width: 1024px) {
    .about-question__content {
        max-width: 700px
    }
}

@media all and (min-width: 1820px) {
    .about-question__content {
        max-width: 750px
    }

    .about-question__container:after {
        right: -120px;
        width: 803px;
        height: 86px
    }
}

@media all and (min-width: 1440px) {
    .vacancies {
        max-width: 1290px
    }
}

.production {
    max-width: 1480px;
    overflow: hidden
}

.production__title-wrap {
    display: flex;
    align-items: flex-end
}

@media all and (min-width: 768px) {
    .production__title-wrap {
        gap: 102px;
        justify-content: space-between
    }
}

@media all and (min-width: 1024px) {
    .production__title-wrap {
        gap: 203px
    }
}

@media all and (min-width: 1280px) {
    .production__title-wrap {
        gap: 156px
    }
}

@media all and (min-width: 1440px) {
    .production__title-wrap {
        gap: 266px
    }
}

.production__content {
    margin-top: 16px
}

@media all and (min-width: 768px) {
    .production__content {
        margin-top: 20px
    }
}

@media all and (min-width: 1024px) {
    .production__content {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .production__content {
        margin-top: 36px
    }
}

.production-page {
    overflow: hidden
}

.production__nav {
    display: none
}

@media all and (min-width: 768px) {
    .production__nav {
        display: flex
    }
}

.production-order {
    display: flex;
    position: relative
}

@media all and (min-width: 768px) {
    .production-order {
        justify-content: space-between;
        align-items: center;
        gap: 16px
    }
}

@media all and (min-width: 1280px) {
    .production-order {
        gap: 24px
    }
}

@media all and (min-width: 1440px) {
    .production-order {
        gap: 72px
    }
}

.production-order__img {
    display: none
}

@media all and (min-width: 768px) {
    .production-order__img {
        display: flex
    }
}

.production-order__img img {
    position: absolute;
    top: 0;
    right: 0;
    width: 447px;
    height: 88px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: -40px
}

@media all and (min-width: 768px) {
    .production-order__img img {
        right: -190px
    }
}

@media all and (min-width: 1024px) {
    .production-order__img img {
        right: -230px
    }
}

@media all and (min-width: 1280px) {
    .production-order__img img {
        width: 684px;
        height: 121px;
        right: -280px
    }
}

@media all and (min-width: 1820px) {
    .production-order__img img {
        width: 1124px;
        height: 200px;
        right: -310px;
        top: 95px;
        transform: translateY(0)
    }
}

.production-order__content {
    margin-top: 16px
}

@media all and (min-width: 768px) {
    .production-order__content {
        margin-top: 20px
    }
}

@media all and (min-width: 1024px) {
    .production-order__content {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .production-order__content {
        margin-top: 36px
    }
}

@media all and (min-width: 768px) {
    .production-order__wrapper {
        max-width: 506px
    }
}

@media all and (min-width: 1024px) {
    .production-order__wrapper {
        max-width: 744px
    }
}

@media all and (min-width: 1820px) {
    .production-order__wrapper {
        max-width: 994px
    }
}

.production-detail__wrapper {
    padding: 20px 16px;
    background: var(--color-5);
    display: flex;
    gap: 12px;
    border-left: 3px solid var(--color-3)
}

@media all and (min-width: 768px) {
    .production-detail__wrapper {
        padding: 20px;
        gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .production-detail__wrapper {
        padding: 32px;
        gap: 26px
    }
}

@media all and (min-width: 1280px) {
    .production-detail__wrapper {
        padding: 30px 26px
    }
}

@media all and (min-width: 1440px) {
    .production-detail__wrapper {
        padding: 42px 42px 48px 42px;
        gap: 40px
    }
}

.production-detail__image {
    flex-shrink: 0;
    width: 34px;
    height: 34px
}

@media all and (min-width: 768px) {
    .production-detail__image {
        width: 40px;
        height: 40px
    }
}

@media all and (min-width: 1024px) {
    .production-detail__image {
        width: 54px;
        height: 54px
    }
}

@media all and (min-width: 1280px) {
    .production-detail__image {
        width: 44px;
        height: 44px
    }
}

@media all and (min-width: 1440px) {
    .production-detail__image {
        width: 66px;
        height: 66px
    }
}

.production-material__main {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px
}

@media all and (min-width: 768px) {
    .production-material__main {
        flex-direction: row;
        gap: 26px
    }
}

@media all and (min-width: 1024px) {
    .production-material__main {
        margin-top: 24px;
        gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .production-material__main {
        margin-top: 36px;
        gap: 23px
    }
}

@media all and (min-width: 1440px) {
    .production-material__main {
        gap: 129px
    }
}

.production-material__content {
    order: 1;
    position: relative;
    width: 100%;
    z-index: 1
}

.production-material__content ul {
    margin-top: 20px
}

@media all and (min-width: 1024px) {
    .production-material__content ul {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .production-material__content ul {
        margin-top: 36px
    }
}

.production-material__content ul li {
    padding-left: 25px
}

.production-material__content ul li::before {
    content: '';
    width: 16px;
    height: 16px;
    background: url(../image/production_item/point.svg) no-repeat 0 0;
    left: 0;
    top: 3px
}

@media all and (min-width: 1820px) {
    .production-material__content ul li::before {
        top: 6px
    }
}

@media all and (min-width: 768px) {
    .production-material__content {
        order: 0
    }
}

.production-material__image {
    display: flex;
    flex-direction: column;
    gap: 20px;
    position: relative
}

@media all and (min-width: 768px) {
    .production-material__image {
        flex-shrink: 0;
        width: 332px;
        margin-top: -40px
    }
}

@media all and (min-width: 1024px) {
    .production-material__image {
        width: 345px;
        margin-top: -48px
    }
}

@media all and (min-width: 1280px) {
    .production-material__image {
        width: 456px;
        margin-top: -70px
    }
}

@media all and (min-width: 1440px) {
    .production-material__image {
        width: 610px
    }
}

.production-material__image::before {
    content: '';
    position: absolute;
    bottom: -228px;
    right: -40px;
    width: 209px;
    height: 145px;
    background: url(../image/production_item/Component.svg) no-repeat 0 0;
    background-size: contain
}

@media all and (min-width: 768px) {
    .production-material__image::before {
        bottom: 0;
        left: -182px;
        right: 0
    }
}

@media all and (min-width: 1024px) {
    .production-material__image::before {
        width: 275px;
        height: 200px;
        left: -241px
    }
}

@media all and (min-width: 1820px) {
    .production-material__image::before {
        width: 473px;
        height: 332px;
        left: -414px
    }
}

.iframe-wrapper {
    margin: 20px 0;
    padding: 56.25% 0 0;
    position: relative
}

.iframe-wrapper iframe {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%
}

@media all and (min-width: 1024px) {
    .iframe-wrapper {
        margin: 30px 0;
        padding: 0;
        position: static
    }

    .iframe-wrapper iframe {
        height: auto;
        max-width: 853px;
        position: static;
        width: 100%
    }
}

.production-type__content {
    margin-top: 20px
}

@media all and (min-width: 1024px) {
    .production-type__content {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .production-type__content {
        margin-top: 36px
    }
}

.production-type-sl .box {
    padding: 70px 20px
}

@media all and (min-width: 768px) {
    .production-type-sl .box {
        align-items: flex-start
    }
}

@media all and (min-width: 1024px) {
    .production-type-sl .box {
        padding: 72px 20px 71px 20px
    }
}

@media all and (min-width: 1280px) {
    .production-type-sl .box {
        padding: 76px 20px 74px 20px
    }
}

@media all and (min-width: 1820px) {
    .production-type-sl .box {
        padding: 120px 60px
    }
}

.production-type-sl .box._yellow::after {
    background: var(--color-3)
}

.production-type-sl .box._blue::after {
    background: var(--color-6)
}

.production-type-sl .box._light-blue::after {
    background: #aeadf0
}

.production-type-sl .box._orange::after {
    background: var(--color-8)
}

.production-type-sl .box._gray::after {
    background: var(--color-7)
}

.production-detail-slider {
    padding: 0 0 50px
}

.production-detail-slider .page__title {
    margin-bottom: 20px
}

.production-detail-slider .page__row-title {
    display: flex
}

.production-detail-slider .page__row-title .page__wrap-nav {
    display: flex
}

.production-detail-slider .main-portfolio__slide .box {
    height: 300px;
    padding: 26px
}

.production-detail-slider .main-portfolio__slide .box:after {
    display: none
}

@media all and (min-width: 768px) {
    .production-detail-slider .main-portfolio__slide .box {
        height: 271px;
        padding: 30px
    }
}

@media all and (min-width: 1024px) {
    .production-detail-slider .main-portfolio__slide .box {
        height: 271px;
        padding: 30px
    }
}

@media all and (min-width: 1280px) {
    .production-detail-slider .main-portfolio__slide .box {
        height: 358px
    }
}

@media all and (min-width: 1440px) {
    .production-detail-slider .main-portfolio__slide .box {
        height: 480px
    }
}

@media all and (min-width: 1820px) {
    .production-detail-slider .main-portfolio__slide .box {
        height: 480px;
        padding: 60px 50px
    }
}

.clients__content {
    margin-top: 16px
}

@media all and (min-width: 768px) {
    .clients__content {
        margin-top: 20px
    }
}

@media all and (min-width: 1024px) {
    .clients__content {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .clients__content {
        margin-top: 36px
    }
}

@media all and (min-width: 1440px) {
    .clients__content {
        margin-top: 32px
    }
}

.services-block {
    max-width: 1480px
}

.services-block .box_service {
    min-height: 218px
}

@media all and (min-width: 1024px) {
    .services-block .box_service {
        min-height: 295px
    }
}

@media all and (min-width: 1280px) {
    .services-block .box_service {
        min-height: 370px
    }
}

@media all and (min-width: 1440px) {
    .services-block .box_service {
        min-height: 478px
    }
}

.select .jq-selectbox__dropdown ul li:before {
    display: none
}

.select .jq-selectbox__dropdown ul {
    gap: 0;
    border: 1px solid var(--border-color)
}

.jq-selectbox__dropdown {
    border-radius: 0;
    box-shadow: none;
    background: #fff;
    border: none;
    top: 31px
}

.jq-selectbox li {
    padding: 8px 8px 8px 20px;
    font-size: 18px;
    line-height: 24px;
    font-weight: 300;
    color: rgba(0, 0, 0, .5);
    font-family: font-1;
    border-bottom: 1px solid #cbcbcb
}

.jq-selectbox li:last-child {
    border-bottom: none
}

.jq-selectbox li.selected {
    background: var(--color-3)
}

.jq-selectbox li:hover {
    background-color: var(--color-3)
}

.select_mod .jq-selectbox__select-text {
    color: rgba(0, 0, 0, .5)
}

@media all and (min-width: 1280px) {
    .select_mod .jq-selectbox__select-text {
        font-size: 18px;
        line-height: 24px
    }
}

@media all and (min-width: 1440px) {
    .select_mod .jq-selectbox__select-text {
        font-size: 20px;
        line-height: 28px
    }
}

.jq-selectbox.changed .jq-selectbox__select-text {
    color: var(--color-1)
}

.select .jq-selectbox__select {
    border-bottom: 1px solid rgba(87, 82, 76, .8) !important;
    border-radius: 0
}

@media all and (min-width: 1280px) {
    .select .jq-selectbox__select {
        height: 41px
    }
}

@media all and (min-width: 1280px) {
    .select .jq-selectbox__trigger {
        top: calc(50% - 5px)
    }
}

.portfolio-page {
    max-width: 1480px
}

.portfolio-page__content {
    display: flex;
    flex-direction: column;
    gap: 14px
}

@media all and (min-width: 768px) {
    .portfolio-page__content {
        gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .portfolio-page__content {
        gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .portfolio-page__content {
        gap: 24px
    }
}

@media all and (min-width: 1440px) {
    .portfolio-page__content {
        gap: 32px
    }
}

.portfolio-page__content-row {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    column-gap: 14px;
    row-gap: 14px
}

@media all and (min-width: 768px) {
    .portfolio-page__content-row {
        grid-template-columns:repeat(4, minmax(0, 1fr));
        column-gap: 16px;
        row-gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .portfolio-page__content-row {
        column-gap: 20px;
        row-gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .portfolio-page__content-row {
        column-gap: 24px;
        row-gap: 24px
    }
}

@media all and (min-width: 1440px) {
    .portfolio-page__content-row {
        column-gap: 32px;
        row-gap: 32px
    }
}

.portfolio-page__content-row:nth-child(odd) .main-portfolio__slide:nth-child(1) .box:after {
    background: var(--color-8)
}

.portfolio-page__content-row:nth-child(odd) .main-portfolio__slide:nth-child(2) .box:after {
    background: var(--color-3)
}

.portfolio-page__content-row:nth-child(odd) .main-portfolio__slide:nth-child(3) .box:after {
    background: var(--color-3)
}

@media all and (min-width: 768px) {
    .portfolio-page__content-row:nth-child(odd) .main-portfolio__slide:nth-child(3) .box:after {
        background: var(--color-8)
    }
}

.portfolio-page__content-row:nth-child(odd) .main-portfolio__slide:nth-child(4) .box:after {
    background: var(--color-8)
}

@media all and (min-width: 768px) {
    .portfolio-page__content-row:nth-child(odd) .main-portfolio__slide:nth-child(4) .box:after {
        background: var(--color-3)
    }
}

.portfolio-page__content-row:nth-child(even) .main-portfolio__slide .main-portfolio__slide .box:after, .portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(1) .box:after {
    background: var(--color-8)
}

@media all and (min-width: 768px) {
    .portfolio-page__content-row:nth-child(even) .main-portfolio__slide .main-portfolio__slide .box:after, .portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(1) .box:after {
        background: var(--color-3)
    }
}

.portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(2) .box:after {
    background: var(--color-3)
}

@media all and (min-width: 768px) {
    .portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(2) .box:after {
        background: var(--color-8)
    }
}

.portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(3) .box:after {
    background: var(--color-3)
}

@media all and (min-width: 768px) {
    .portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(3) .box:after {
        background: var(--color-3)
    }
}

.portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(4) .box:after {
    background: var(--color-8)
}

@media all and (min-width: 768px) {
    .portfolio-page__content-row:nth-child(even) .main-portfolio__slide:nth-child(4) .box:after {
        background: var(--color-8)
    }
}

.porftolio-p {
    overflow: hidden
}

.porftolio-p .slider-logos {
    max-width: 1490px
}

.porftolio-p .page__selects {
    max-width: 1480px
}

.portfolio-detail__images {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 1480px
}

@media all and (min-width: 768px) {
    .portfolio-detail__images {
        display: grid;
        grid-template-columns:repeat(2, minmax(0, 1fr));
        column-gap: 40px
    }
}

.team-page {
    display: flex;
    flex-direction: column;
    gap: 24px;
    position: relative
}

@media all and (min-width: 768px) {
    .team-page {
        gap: 116px;
        flex-direction: row
    }
}

@media all and (min-width: 1024px) {
    .team-page {
        gap: 136px
    }
}

@media all and (min-width: 1280px) {
    .team-page {
        gap: 192px
    }
}

@media all and (min-width: 1820px) {
    .team-page {
        gap: 336px
    }
}

.team-page::before {
    content: '';
    position: absolute;
    top: 0;
    right: -70px;
    width: 200px;
    height: 81px;
    background: url(../image/team/element.svg) no-repeat 0 0;
    background-size: cover
}

@media all and (min-width: 768px) {
    .team-page::before {
        right: -80px
    }
}

@media all and (min-width: 1024px) {
    .team-page::before {
        width: 244px;
        height: 99px;
        right: -60px
    }
}

@media all and (min-width: 1280px) {
    .team-page::before {
        right: -90px
    }
}

@media all and (min-width: 1440px) {
    .team-page::before {
        right: -170px
    }
}

@media all and (min-width: 1820px) {
    .team-page::before {
        width: 483px;
        height: 196px;
        right: -120px
    }
}

.team-item {
    position: relative
}

@media all and (min-width: 1280px) {
    .team-item:hover .team-item__black {
        opacity: 0;
        visibility: hidden
    }
}

.team-item__image {
    position: relative;
    width: 232px;
    height: 266px
}

@media all and (min-width: 1024px) {
    .team-item__image {
        width: 312px;
        height: 358px
    }
}

@media all and (min-width: 1280px) {
    .team-item__image {
        width: 360px;
        height: 412px
    }
}

@media all and (min-width: 1820px) {
    .team-item__image {
        width: 404px;
        height: 464px
    }
}

.team-item__black {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 1;
    visibility: visible;
    transition: var(--transition)
}

.team-item__info {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 20px;
    background: var(--color-5);
    min-width: 196px;
    max-width: 196px
}

@media all and (min-width: 768px) {
    .team-item__info {
        right: -80px;
        bottom: -18px
    }
}

@media all and (min-width: 1024px) {
    .team-item__info {
        padding: 24px;
        min-width: 214px;
        max-width: 214px;
        right: -58px;
        bottom: -24px
    }
}

@media all and (min-width: 1280px) {
    .team-item__info {
        padding: 32px;
        min-width: 288px;
        max-width: 288px;
        right: -120px;
        bottom: -28px
    }
}

@media all and (min-width: 1820px) {
    .team-item__info {
        min-width: 336px;
        max-width: 336px;
        right: -188px;
        bottom: -56px
    }
}

.team-item__info-text {
    margin-top: 16px
}

@media all and (min-width: 1024px) {
    .team-item__info-text {
        margin-top: 20px
    }
}

.team-item__info-contacts {
    display: inline-block;
    margin-top: 4px
}

@media all and (min-width: 1024px) {
    .team-item__info-contacts {
        margin-top: 8px
    }
}

.team-sub-page {
    background: var(--color-5);
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    padding: 50px 0 60px 0
}

@media all and (min-width: 768px) {
    .team-sub-page {
        padding: 60px 0 82px 0
    }
}

@media all and (min-width: 1024px) {
    .team-sub-page {
        padding: 60px 0 60px 0
    }
}

@media all and (min-width: 1440px) {
    .team-sub-page {
        padding: 80px 0 80px 0
    }
}

.team-sub-page__wrapper {
    max-width: 1480px
}

.team-sub-page__top {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    column-gap: 14px;
    row-gap: 24px
}

@media all and (min-width: 768px) {
    .team-sub-page__top {
        grid-template-columns:repeat(4, minmax(0, 1fr));
        column-gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .team-sub-page__top {
        column-gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .team-sub-page__top {
        column-gap: 24px
    }
}

@media all and (min-width: 1440px) {
    .team-sub-page__top {
        column-gap: 32px
    }
}

.team-sub-page__bottom {
    margin-top: 24px;
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    column-gap: 14px;
    row-gap: 24px
}

@media all and (min-width: 768px) {
    .team-sub-page__bottom {
        margin-top: 40px;
        grid-template-columns:repeat(3, minmax(0, 1fr));
        column-gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .team-sub-page__bottom {
        column-gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .team-sub-page__bottom {
        margin-top: 60px;
        column-gap: 24px
    }
}

@media all and (min-width: 1440px) {
    .team-sub-page__bottom {
        column-gap: 32px
    }
}

@media all and (min-width: 1280px) {
    .team-sub:hover .team-sub__black {
        opacity: 0;
        visibility: hidden
    }
}

.team-sub__image {
    position: relative;
    display: flex
}

.team-sub__image img {
    width: 100%;
    aspect-ratio: 3/2;
    object-fit: cover;
    object-position: top center
}

.team-sub__black {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 1;
    visibility: visible;
    transition: var(--trasition)
}

.team-sub__info {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    align-items: center
}

@media all and (min-width: 1024px) {
    .team-sub__info {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .team-sub__info {
        margin-top: 32px
    }
}

.team-sub__info-text {
    margin-top: 16px;
    text-align: center
}

@media all and (min-width: 1024px) {
    .team-sub__info-text {
        margin-top: 20px
    }
}

.team-sub__info-contacts {
    margin-top: 4px
}

@media all and (min-width: 1024px) {
    .team-sub__info-contacts {
        margin-top: 8px
    }
}

.contacts-page .main-contact {
    position: relative;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 870px;
    overflow: hidden;
    background: var(--color-5)
}

@media all and (min-width: 768px) {
    .contacts-page .main-contact {
        padding-top: 123px;
        padding-bottom: 60px;
        min-height: 570px
    }
}

@media all and (min-width: 1024px) {
    .contacts-page .main-contact {
        padding-top: 138px;
        padding-bottom: 80px;
        min-height: 634px
    }
}

@media all and (min-width: 1280px) {
    .contacts-page .main-contact {
        padding-top: 182px;
        padding-bottom: 60px;
        min-height: 708px
    }
}

@media all and (min-width: 1440px) {
    .contacts-page .main-contact {
        padding-top: 190px;
        padding-bottom: 80px;
        min-height: 931px
    }
}

.contacts-page .main-contact__map {
    opacity: 1
}

.contacts-page .crumbs {
    pointer-events: none;
    position: absolute;
    width: auto;
    padding-left: 17px;
    padding-right: 17px
}

@media all and (min-width: 768px) {
    .contacts-page .crumbs {
        width: 100vw
    }
}

@media all and (min-width: 1280px) {
    .contacts-page .crumbs {
        width: calc(100vw - 76px)
    }
}

@media all and (min-width: 1440px) {
    .contacts-page .crumbs {
        width: calc(100vw - 125px)
    }
}

@media all and (min-width: 1820px) {
    .contacts-page .crumbs {
        width: calc(100vw - 115px)
    }
}

@media all and (min-width: 1280px) {
    .contacts-page .page__main {
        width: 100%
    }
}

@media all and (min-width: 1440px) {
    .contacts-page .page__main {
        overflow: hidden
    }
}

@media all and (min-width: 1280px) {
    .contacts-page .form-contact {
        margin-left: -36px
    }
}

@media all and (min-width: 1440px) {
    .contacts-page .form-contact {
        margin-left: -60px
    }
}

.contacts-info {
    background: var(--color-5);
    padding: 50px 0;
    position: relative
}

.contacts-info::after {
    content: '';
    position: absolute;
    top: 0;
    left: 32px;
    width: calc(100% - 64px);
    height: 1px;
    border-top: 1px solid var(--border-color)
}

@media all and (min-width: 768px) {
    .contacts-info::after {
        display: none
    }
}

@media all and (min-width: 768px) {
    .contacts-info {
        padding: 60px 0;
        border-top: none
    }
}

@media all and (min-width: 1440px) {
    .contacts-info {
        padding: 80px 0
    }
}

.contacts-info::before {
    content: '';
    position: absolute;
    bottom: 0;
    right: 17px;
    width: 202px;
    height: 105px;
    background: url(../image/contacts/element.svg) no-repeat 0 0;
    background-size: cover
}

@media all and (min-width: 768px) {
    .contacts-info::before {
        width: 347px;
        height: 180px;
        right: 44px
    }
}

@media all and (min-width: 1024px) {
    .contacts-info::before {
        right: 55px
    }
}

@media all and (min-width: 1280px) {
    .contacts-info::before {
        right: 76px
    }
}

@media all and (min-width: 1820px) {
    .contacts-info::before {
        width: 472px;
        height: 246px;
        right: 171px
    }
}

.contacts-info__content {
    margin-top: 16px
}

@media all and (min-width: 768px) {
    .contacts-info__content {
        margin-top: 20px
    }
}

@media all and (min-width: 1024px) {
    .contacts-info__content {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .contacts-info__content {
        margin-top: 36px
    }
}

.contacts-info .container {
    display: flex;
    flex-direction: column;
    gap: 50px
}

@media all and (min-width: 1280px) {
    .contacts-info .container {
        display: grid;
        grid-template-columns:auto 1fr;
        column-gap: 36px
    }
}

@media all and (min-width: 1820px) {
    .contacts-info .container {
        column-gap: 40px
    }
}

@media all and (min-width: 768px) {
    .office {
        display: grid;
        grid-template-columns:274px 1fr;
        column-gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .office {
        grid-template-columns:292px 1fr;
        column-gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .office {
        column-gap: 36px;
        grid-template-columns:252px 444px
    }
}

@media all and (min-width: 1820px) {
    .office {
        column-gap: 148px;
        grid-template-columns:296px 700px
    }
}

.office__row {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    column-gap: 16px
}

@media all and (min-width: 768px) {
    .office__row {
        display: flex;
        flex-direction: column;
        gap: 24px
    }
}

@media all and (min-width: 1280px) {
    .office__row {
        gap: 32px
    }
}

.office__row:nth-child(2) {
    display: block;
    margin-top: 16px
}

@media all and (min-width: 768px) {
    .office__row:nth-child(2) {
        margin-top: 0
    }
}

.office__row-wrapper {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    column-gap: 16px;
    row-gap: 24px
}

@media all and (min-width: 768px) {
    .office__row-wrapper {
        grid-template-columns:repeat(2, 138px);
        column-gap: 24px
    }
}

@media all and (min-width: 1024px) {
    .office__row-wrapper {
        grid-template-columns:repeat(2, 210px)
    }
}

@media all and (min-width: 1820px) {
    .office__row-wrapper {
        grid-template-columns:repeat(2, 256px);
        column-gap: 40px
    }
}

.office__row-title {
    font-size: 15px;
    line-height: 20px;
    font-weight: 300;
    color: rgba(0, 0, 0, .5)
}

@media all and (min-width: 1024px) {
    .office__row-title {
        font-size: 16px;
        line-height: 22px
    }
}

@media all and (min-width: 1280px) {
    .office__row-title {
        font-size: 18px;
        line-height: 24px
    }
}

@media all and (min-width: 1440px) {
    .office__row-title {
        font-size: 20px;
        line-height: 28px
    }
}

.office__btn {
    margin-top: 28px;
    max-height: 48px
}

@media all and (min-width: 1024px) {
    .office__btn {
        margin-top: 42px
    }
}

@media all and (min-width: 1280px) {
    .office__btn {
        margin-top: 48px;
        max-height: 64px
    }
}

@media all and (min-width: 1820px) {
    .office__btn {
        margin-top: 52px
    }
}

.contacts-item__title {
    font-size: 15px;
    line-height: 20px;
    font-weight: 300;
    color: rgba(0, 0, 0, .5)
}

@media all and (min-width: 1024px) {
    .contacts-item__title {
        font-size: 16px;
        line-height: 22px
    }
}

@media all and (min-width: 1280px) {
    .contacts-item__title {
        font-size: 18px;
        line-height: 24px
    }
}

@media all and (min-width: 1440px) {
    .contacts-item__title {
        font-size: 20px;
        line-height: 28px
    }
}

.contacts-item__name {
    margin-top: 14px;
    font-size: 17px;
    line-height: 20px;
    font-weight: 400
}

@media all and (min-width: 1024px) {
    .contacts-item__name {
        margin-top: 16px;
        font-size: 20px;
        line-height: 26px
    }
}

@media all and (min-width: 1280px) {
    .contacts-item__name {
        margin-top: 20px;
        font-size: 22px;
        line-height: 28px
    }
}

@media all and (min-width: 1440px) {
    .contacts-item__name {
        font-size: 24px;
        line-height: 32px
    }
}

.contacts-item__contacts {
    margin-top: 8px;
    font-size: 17px;
    line-height: 20px;
    font-weight: 400;
    display: inline-block
}

@media all and (min-width: 1024px) {
    .contacts-item__contacts {
        font-size: 20px;
        line-height: 26px
    }
}

@media all and (min-width: 1280px) {
    .contacts-item__contacts {
        font-size: 22px;
        line-height: 28px
    }
}

@media all and (min-width: 1440px) {
    .contacts-item__contacts {
        font-size: 24px;
        line-height: 32px
    }
}

.contacts-item__phone {
    margin-top: 8px;
    font-size: 17px;
    line-height: 20px;
    font-weight: 400;
    display: block
}

@media all and (min-width: 1024px) {
    .contacts-item__phone {
        font-size: 20px;
        line-height: 26px
    }
}

@media all and (min-width: 1280px) {
    .contacts-item__phone {
        font-size: 22px;
        line-height: 28px
    }
}

@media all and (min-width: 1440px) {
    .contacts-item__phone {
        font-size: 24px;
        line-height: 32px
    }
}

.page-404__wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: var(--color-5);
    align-items: center;
    padding: 40px 31.5px
}

@media all and (min-width: 768px) {
    .page-404__wrapper {
        flex-direction: row;
        gap: 61px;
        padding: 0 0;
        background: 0 0
    }
}

@media all and (min-width: 1024px) {
    .page-404__wrapper {
        gap: 104px
    }
}

@media all and (min-width: 1280px) {
    .page-404__wrapper {
        gap: 80px
    }
}

@media all and (min-width: 1820px) {
    .page-404__wrapper {
        gap: 189px
    }
}

@media all and (min-width: 768px) {
    .page-404__image {
        width: 245px;
        flex-shrink: 0;
        margin-top: -16px
    }
}

@media all and (min-width: 1024px) {
    .page-404__image {
        width: 318px;
        margin-top: -30px
    }
}

@media all and (min-width: 1280px) {
    .page-404__image {
        width: 381px;
        margin-top: -38px
    }
}

@media all and (min-width: 1820px) {
    .page-404__image {
        width: 582px;
        margin-top: -86px
    }
}

.page-404__content {
    order: 1
}

@media all and (min-width: 768px) {
    .page-404__content {
        order: 0;
        padding: 40px 32px;
        background: var(--color-5)
    }
}

@media all and (min-width: 1024px) {
    .page-404__content {
        padding: 40px
    }
}

@media all and (min-width: 1280px) {
    .page-404__content {
        padding: 60px
    }
}

@media all and (min-width: 1820px) {
    .page-404__content {
        padding: 96px 108px
    }
}

.page-404__content-search {
    margin-top: 24px
}

@media all and (min-width: 1024px) {
    .page-404__content-search {
        margin-top: 40px
    }
}

.page-404__content-search .label-box input {
    border-bottom: 1px solid var(--border-color);
    color: var(--color-1)
}

.page-404__content-search .label-box__text {
    color: var(--border-color)
}

.page-404__content-search .icon-loop {
    stroke: #000
}

.page-404__content-text {
    margin-top: 8px
}

@media all and (min-width: 1024px) {
    .page-404__content-text {
        margin-top: 20px
    }
}

.sitemap {
    background: var(--color-5);
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    position: relative
}

.sitemap a {
    transition: color .5s ease-out
}

@media all and (min-width: 1280px) {
    .sitemap a:hover {
        color: var(--color-3)
    }
}

@media all and (min-width: 768px) {
    .sitemap::before {
        content: '';
        position: absolute;
        bottom: 133px;
        right: 0;
        width: 220px;
        height: 146px;
        background: url(../image/404/element.svg) no-repeat 0 0;
        background-size: cover
    }
}

@media all and (min-width: 1024px) {
    .sitemap::before {
        width: 408px;
        bottom: 47px
    }
}

@media all and (min-width: 1280px) {
    .sitemap::before {
        width: 579px;
        height: 195px;
        bottom: 60px
    }
}

.sitemap__content {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 20px
}

@media all and (min-width: 768px) {
    .sitemap__content {
        margin-top: 20px;
        flex-direction: row;
        flex-wrap: wrap;
        row-gap: 32px
    }
}

@media all and (min-width: 1024px) {
    .sitemap__content {
        margin-top: 24px
    }
}

@media all and (min-width: 1280px) {
    .sitemap__content {
        margin-top: 36px
    }
}

.sitemap__link {
    padding-left: 20px;
    border-left: 3px solid #ef7c00
}

.sitemap__item {
    display: flex;
    flex-direction: column;
    gap: 20px
}

@media all and (min-width: 768px) {
    .sitemap__item_last {
        margin-left: 133px;
        gap: 24px
    }
}

@media all and (min-width: 1024px) {
    .sitemap__item_last {
        margin-left: auto;
        gap: 32px
    }
}

@media all and (min-width: 1280px) {
    .sitemap__item_last {
        margin-left: 82px
    }
}

@media all and (min-width: 1820px) {
    .sitemap__item_last {
        margin-left: 140px
    }
}

@media all and (min-width: 1024px) {
    .sitemap__item_second {
        gap: 32px
    }
}

@media all and (min-width: 1280px) {
    .sitemap__item_second {
        margin-left: 89px
    }
}

@media all and (min-width: 1820px) {
    .sitemap__item_second {
        margin-left: 220px
    }
}

.sitemap__item-wrapper {
    display: flex;
    flex-direction: column;
    gap: 14px
}

@media all and (min-width: 768px) {
    .sitemap__item-wrapper {
        gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .sitemap__item-wrapper {
        gap: 20px
    }
}

.sitemap__item-lists {
    gap: 8px
}

.sitemap__item-lists li {
    padding-left: 23px
}

@media all and (min-width: 1280px) {
    .sitemap__item-lists li {
        max-width: 219px
    }
}

@media all and (min-width: 1820px) {
    .sitemap__item-lists li {
        max-width: 315px
    }
}

.sitemap__item-lists li::before {
    top: 8px;
    background: #514e4b;
    left: 10px
}

.sitemap__item-lists li a {
    color: #514e4b
}

@media all and (min-width: 768px) {
    .sitemap__item-lists_catalog {
        display: grid;
        grid-template-columns:238px 100px 1fr;
        grid-template-rows:repeat(9, auto);
        column-gap: 86px;
        grid-auto-flow: column
    }
}

@media all and (min-width: 1024px) {
    .sitemap__item-lists_catalog {
        grid-template-columns:254px 237px;
        grid-template-rows:repeat(13, auto);
        column-gap: 40px
    }
}

@media all and (min-width: 1280px) {
    .sitemap__item-lists_catalog {
        display: flex;
        flex-direction: column;
        gap: 8px;
        flex-wrap: wrap;
        max-height: 515px;
        column-gap: 40px
    }
}

@media all and (min-width: 1820px) {
    .sitemap__item-lists_catalog {
        max-height: 500px;
        column-gap: 80px;
        min-width: 674px
    }
}

.sitemap-page .sitemap {
    background: 0 0
}

.sitemap-page .sitemap__content {
    margin-top: 0
}

.search-page__container {
    max-width: 1292px
}

.search-page__result {
    margin-top: 14px
}

@media all and (min-width: 768px) {
    .search-page__result {
        margin-top: 16px
    }
}

@media all and (min-width: 1024px) {
    .search-page__result {
        margin-top: 20px
    }
}

.search-page__form .label-box input {
    border-bottom: 1px solid var(--border-color);
    color: var(--color-1)
}

.search-page__form .label-box__text {
    color: var(--border-color)
}

.search-page__form .button-clear {
    display: flex;
    opacity: 0;
    visibility: hidden;
    position: absolute;
    bottom: 14px;
    right: 44px;
    gap: 18px;
    cursor: pointer;
    transition: .5s ease-out
}

.search-page__form .button-clear.active {
    opacity: .5;
    visibility: visible;
    transition: .5s ease-out
}

.search-page__form .button-clear::after {
    content: '';
    width: 1px;
    height: 20px;
    border-right: 1px solid var(--border-color)
}

.search-page__form .button-pic {
    position: relative;
    top: -9px
}

.search-page__form .button-pic svg {
    stroke: #000
}

.catalog-main-slide {
    display: block;
    padding: 0 0 40px;
    text-align: center
}

.catalog-main-slide img {
    display: block;
    margin: auto;
    max-width: 100%
}

.catalog-main__container {
    margin-top: 20px;
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    column-gap: 10px;
    row-gap: 20px
}

@media all and (min-width: 768px) {
    .catalog-main__container {
        margin-top: 26px;
        grid-template-columns:repeat(3, minmax(0, 1fr));
        column-gap: 16px
    }
}

@media all and (min-width: 1024px) {
    .catalog-main__container {
        grid-template-columns:repeat(4, minmax(0, 1fr));
        column-gap: 20px
    }
}

@media all and (min-width: 1280px) {
    .catalog-main__container {
        margin-top: 36px;
        column-gap: 30px;
        row-gap: 28px
    }
}

@media all and (min-width: 1820px) {
    .catalog-main__container {
        column-gap: 38px;
        row-gap: 32px
    }
}

.catalog-main__content {
    margin-top: 50px
}

@media all and (min-width: 768px) {
    .catalog-main__content {
        margin-top: 60px
    }
}

@media all and (min-width: 1440px) {
    .catalog-main__content {
        margin-top: 80px
    }
}

.catalog-main__content ul {
    display: grid;
    grid-template-columns:192px auto;
    column-gap: 16px;
    row-gap: 6px
}

.catalog-main__content ul li {
    padding-left: 26px
}

.catalog-main__content ul li::before {
    content: '';
    width: 16px;
    height: 16px;
    background: url(../image/catalog_category-tile/point.svg) no-repeat 0 0;
    background-size: cover;
    top: 4px;
    left: 0
}

@media all and (min-width: 1280px) {
    .catalog-main__content ul li::before {
        top: 8px
    }
}

.catalog-main__content ul li a {
    color: var(--color-3)
}

@media all and (min-width: 1280px) {
    .catalog-main__content ul li a:hover {
        color: var(--color-8)
    }
}

.catalog-main.lists .catalog-main__container {
    display: flex;
    flex-direction: column;
    gap: 20px
}

.catalog-main.lists .catalog-item {
    display: grid;
    grid-template-columns:129px 1fr
}

@media all and (min-width: 768px) {
    .catalog-main.lists .catalog-item {
        grid-template-columns:173px .5fr .5fr;
        padding-top: 4px;
        padding-bottom: 4px;
        padding-left: 20px;
        padding-right: 20px
    }
}

@media all and (min-width: 1280px) {
    .catalog-main.lists .catalog-item {
        padding-left: 36px;
        padding-right: 36px;
        grid-template-columns:140px .5fr .5fr
    }
}

@media all and (min-width: 1440px) {
    .catalog-main.lists .catalog-item {
        grid-template-columns:215px 1fr .5fr
    }
}

.catalog-main.lists .catalog-item__main {
    align-self: center
}

@media all and (min-width: 1440px) {
    .catalog-main.lists .catalog-item__main {
        padding-left: 66px;
        padding-right: 94px
    }
}

.catalog-main.lists .catalog-item__buy {
    grid-column: 1/3
}

@media all and (min-width: 768px) {
    .catalog-main.lists .catalog-item__buy {
        grid-column: auto;
        padding-left: 0
    }
}

.catalog-main.lists .catalog-item__counts {
    display: block;
    min-width: 70px
}

@media all and (min-width: 1280px) {
    .catalog-main.lists .catalog-item__btn {
        right: 0
    }
}

.catalog-header {
    display: grid;
    grid-template-columns:1fr 60px;
    justify-content: space-between;
    column-gap: 20px;
    row-gap: 20px
}

@media all and (min-width: 768px) {
    .catalog-header {
        display: flex;
        gap: 0;
        justify-content: flex-start
    }
}

.catalog-header__filter {
    order: 1;
    grid-column: 1/3;
    display: grid;
    grid-template-columns:repeat(2, 1fr);
    column-gap: 71px
}

@media all and (min-width: 768px) {
    .catalog-header__filter {
        order: 0;
        margin-left: auto;
        display: flex;
        align-items: center;
        gap: 32px
    }
}

@media all and (min-width: 1024px) {
    .catalog-header__filter {
        gap: 60px
    }
}

.catalog-header__view-btn {
    display: flex;
    align-items: center;
    gap: 21px
}

@media all and (min-width: 768px) {
    .catalog-header__view-btn {
        margin-left: 49px
    }
}

@media all and (min-width: 1024px) {
    .catalog-header__view-btn {
        margin-left: 39px
    }
}

.catalog-header__view-item {
    display: flex;
    cursor: pointer
}

.catalog-header__view-item svg {
    fill: var(--color-1)
}

.catalog-header__view-item.active svg {
    fill: var(--color-3)
}

.catalog-header__result {
    color: var(--color-2)
}

.catalog-header__countpage {
    display: flex;
    align-items: center;
    gap: 12px;
    cursor: pointer
}

.catalog-header__countpage span {
    color: var(--color-2)
}

.catalog-header__countpage-drop {
    position: relative
}

@media all and (min-width: 1280px) {
    .catalog-header__countpage-drop-item:hover {
        color: var(--color-3)
    }
}

.catalog-header__countpage-drop-active {
    color: var(--color-3)
}

.catalog-header__countpage-drop-lists {
    position: absolute;
    top: 100%;
    left: -5px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 5px 10px;
    background: var(--color-5);
    opacity: 0;
    visibility: hidden;
    transition: .5s ease-out;
    z-index: 1;
    border: 1px solid var(--border-color)
}

.catalog-header__countpage-drop-lists.active {
    opacity: 1;
    visibility: visible;
    transition: .5s ease-out
}

.catalog-header__sorting {
    position: relative;
    cursor: pointer
}

@media all and (min-width: 1280px) {
    .catalog-header__sorting-item:hover {
        color: var(--color-3)
    }
}

.catalog-header__sorting span {
    display: flex;
    align-items: center;
    gap: 12px;
    color: var(--color-2)
}

.catalog-header__sorting span svg {
    transform: rotate(180deg)
}

.catalog-header__sorting-drop {
    position: absolute;
    top: 100%;
    left: -5px;
    padding: 5px 10px;
    border: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    gap: 4px;
    background: var(--color-5);
    min-width: calc(100% + 5px);
    opacity: 0;
    visibility: hidden;
    white-space: nowrap;
    z-index: 1
}

.catalog-header__sorting-drop.active {
    opacity: 1;
    visibility: visible
}

.catalog-header__sorting.active span svg {
    transform: rotate(0)
}

.catalog-item {
    padding: 8px 0 4px 0;
    background: var(--color-5);
    display: block
}

@media all and (min-width: 768px) {
    .catalog-item {
        padding: 8px 0 14px 0
    }
}

@media all and (min-width: 1024px) {
    .catalog-item {
        padding: 8px 0 10px 0
    }
}

@media all and (min-width: 1280px) {
    .catalog-item {
        padding: 8px 23px 9px 23px
    }

    .catalog-item:hover .catalog-item__title {
        color: var(--color-3)
    }
}

@media all and (min-width: 1440px) {
    .catalog-item {
        padding: 10px 27px 6px 27px
    }
}

.catalog-item_little .catalog-item__status::before {
    background: var(--color-3)
}

.catalog-item_ended .catalog-item__status::before {
    background: var(--color-8)
}

.catalog-item.active .catalog-item__btn {
    background: 0 0;
    border: 2px solid rgba(239, 124, 0, .5)
}

.catalog-item.active .catalog-item__btn svg {
    fill: var(--color-3)
}

.catalog-item__image {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 129px;
    height: 129px;
    position: relative;
    margin: 0 auto
}

@media all and (min-width: 768px) {
    .catalog-item__image {
        width: 173px;
        height: 173px
    }
}

@media all and (min-width: 1280px) {
    .catalog-item__image {
        width: 140px;
        height: 140px
    }
}

@media all and (min-width: 1440px) {
    .catalog-item__image {
        width: 215px;
        height: 215px
    }
}

.catalog-item__image img {
    max-width: 90%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

.catalog-item__main {
    padding: 0 14px;
    display: flex;
    flex-direction: column;
    gap: 8px
}

@media all and (min-width: 768px) {
    .catalog-item__main {
        padding: 0 20px
    }
}

@media all and (min-width: 1280px) {
    .catalog-item__main {
        padding: 0 0
    }
}

.catalog-item__title {
    font-weight: 400;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    transition: color .5s ease-out;
    min-height: 40px
}

@media all and (min-width: 768px) {
    .catalog-item__title {
        min-height: 44px
    }
}

@media all and (min-width: 1280px) {
    .catalog-item__title {
        min-height: 48px
    }
}

@media all and (min-width: 1820px) {
    .catalog-item__title {
        min-height: 56px
    }
}

.catalog-item__status {
    font-size: 16px;
    line-height: 18px;
    display: flex;
    gap: 7px;
    align-items: center;
    color: rgba(0, 0, 0, .5)
}

@media all and (min-width: 1280px) {
    .catalog-item__status {
        line-height: 22px
    }
}

.catalog-item__status::before {
    content: '';
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: var(--color-12)
}

@media all and (min-width: 1440px) {
    .catalog-item__status::before {
        width: 6px;
        height: 6px
    }
}

.catalog-item__buy {
    padding: 0 6px 0 16px;
    margin-top: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center
}

@media all and (min-width: 768px) {
    .catalog-item__buy {
        padding: 0 6px 0 20px
    }
}

@media all and (min-width: 1280px) {
    .catalog-item__buy {
        padding: 0 0
    }
}

.catalog-item__counts {
    display: none
}

.catalog-item__btn {
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color-3);
    border-radius: 50%;
    cursor: pointer
}

@media all and (min-width: 768px) {
    .catalog-item__btn {
        width: 51px;
        height: 51px
    }
}

@media all and (min-width: 1280px) {
    .catalog-item__btn {
        position: relative;
        right: -17px;
        transition: background .5s ease-out
    }

    .catalog-item__btn:hover {
        background: var(--color-8)
    }
}

@media all and (min-width: 1440px) {
    .catalog-item__btn {
        width: 64px;
        height: 64px;
        right: -19px
    }
}

.catalog-item__btn svg {
    width: 22px;
    height: 22px;
    fill: var(--color-5)
}

.catalog-item__price {
    display: flex;
    align-items: baseline;
    gap: 3px
}

@media all and (min-width: 1440px) {
    .catalog-item__price {
        gap: 4px
    }
}

.catalog-item__price span {
    font-size: 12px;
    line-height: 16px;
    font-weight: 300
}

@media all and (min-width: 1440px) {
    .catalog-item__price span {
        font-size: 15px;
        line-height: 20px
    }
}

@media all and (min-width: 1280px) {
    .catalog-page__content {
        display: grid;
        grid-template-columns:221px 1fr;
        column-gap: 43px
    }
}

@media all and (min-width: 1440px) {
    .catalog-page__content {
        grid-template-columns:255px 1fr;
        column-gap: 40px
    }
}

@media all and (min-width: 1280px) {
    .catalog-page .catalog-main__container {
        grid-template-columns:repeat(3, minmax(0, 1fr))
    }
}

@media all and (min-width: 1820px) {
    .catalog-page .catalog-main__container {
        grid-template-columns:repeat(4, minmax(0, 1fr))
    }
}

.catalog-page .catalog-header__result {
    display: none
}

@media all and (min-width: 1280px) {
    .catalog-page .catalog-header__result {
        display: block
    }
}

.catalog-page .catalog-header__mobile-filter {
    display: flex;
    align-items: center;
    gap: 10px
}

@media all and (min-width: 1280px) {
    .catalog-page .catalog-header__mobile-filter {
        display: none
    }
}

.catalog-page .catalog-header__mobile-filter-count {
    display: flex;
    justify-content: center;
    align-items: center;
    background: var(--color-3);
    width: 24px;
    height: 24px;
    color: var(--color-5);
    font-weight: 400;
    border-radius: 50%
}

.catalog-filter {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 11;
    background: rgba(81, 78, 75, .55);
    opacity: 0;
    visibility: hidden;
    transition: opacity .5s ease-out
}

@media all and (min-width: 1280px) {
    .catalog-filter {
        position: static;
        width: auto;
        height: auto;
        background: 0 0;
        z-index: auto;
        opacity: 1;
        visibility: visible
    }
}

.catalog-filter.active {
    opacity: 1;
    visibility: visible;
    transition: opacity .5s ease-out
}

.catalog-filter__wrapper {
    background: var(--color-5);
    width: 100%;
    height: 100%;
    padding: 12px 24px 50px 24px;
    overflow-y: auto;
    overflow-x: hidden;
    display: flex;
    flex-direction: column;
    gap: 24px
}

@media all and (min-width: 768px) {
    .catalog-filter__wrapper {
        max-width: 360px
    }
}

@media all and (min-width: 1024px) {
    .catalog-filter__wrapper {
        max-width: 424px;
        padding: 12px 32px 56px 32px;
        gap: 32px
    }
}

@media all and (min-width: 1280px) {
    .catalog-filter__wrapper {
        background: 0 0;
        padding: 0 0;
        overflow: visible
    }
}

.catalog-filter__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
    padding-bottom: 12px
}

@media all and (min-width: 1280px) {
    .catalog-filter__header {
        display: none
    }
}

.catalog-filter__header::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: -24px;
    width: 100vw;
    height: 1px;
    border-bottom: 1px solid var(--border-color)
}

@media all and (min-width: 1024px) {
    .catalog-filter__header::before {
        left: -32px
    }
}

.catalog-filter__header-reset {
    font-size: 16px;
    line-height: 22px;
    color: var(--color-2)
}

.catalog-filter__header-close {
    width: 32px;
    height: 32px;
    display: flex
}

.filter-tags {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--border-color)
}

@media all and (min-width: 1024px) {
    .filter-tags {
        padding-bottom: 32px
    }
}

@media all and (min-width: 1280px) {
    .filter-tags {
        gap: 14px
    }
}

.filter-tags__item {
    display: flex;
    gap: 12px;
    justify-content: space-between
}

@media all and (min-width: 1440px) {
    .filter-tags__item {
        gap: 16px
    }
}

.filter-tags__item-title {
    font-weight: 400
}

.filter-tags__item-count {
    color: rgba(0, 0, 0, .5)
}

.filter-item {
    padding-bottom: 24px;
    border-bottom: 1px solid var(--border-color);
    display: flex;
    flex-direction: column;
    gap: 14px
}

@media all and (min-width: 1024px) {
    .filter-item {
        padding-bottom: 32px
    }
}

@media all and (min-width: 1280px) {
    .filter-item {
        gap: 16px
    }
}

.filter-range__wrapper {
    display: flex;
    flex-direction: column;
    gap: 14px
}

@media all and (min-width: 1280px) {
    .filter-range__wrapper {
        gap: 16px
    }
}

.filter-range__inputs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px
}

.filter-range__inputs-sep {
    width: 11px;
    height: 1px;
    border-bottom: 1px solid rgba(0, 0, 0, .5);
    flex-shrink: 0
}

.filter-range input {
    width: 100%;
    padding: 10px 8px;
    font-family: font-1;
    font-weight: 300;
    color: rgba(0, 0, 0, .5);
    border: 1px solid rgba(0, 0, 0, .5);
    background: 0 0;
    font-size: 15px;
    line-height: 20px
}

@media all and (min-width: 768px) {
    .filter-range input {
        font-size: 16px;
        line-height: 22px
    }
}

@media all and (min-width: 1280px) {
    .filter-range input {
        font-size: 18px;
        line-height: 24px
    }
}

@media all and (min-width: 1820px) {
    .filter-range input {
        font-size: 20px;
        line-height: 28px
    }
}

.filter-accord {
    gap: 0
}

.filter-accord__wrapper {
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: space-between;
    cursor: pointer
}

.filter-accord__content {
    display: none;
    margin-top: 14px
}

@media all and (min-width: 1280px) {
    .filter-accord__content {
        margin-top: 16px
    }
}

.filter-accord__icon {
    transition: .5s ease-out;
    transform: rotate(0)
}

.filter-accord.active .filter-accord__icon {
    transition: .5s ease-out;
    transform: rotate(180deg)
}

.filter-maker {
    display: flex;
    flex-direction: column;
    gap: 12px
}

@media all and (min-width: 1280px) {
    .filter-maker {
        gap: 14px
    }
}

.filter-maker .check {
    cursor: pointer
}

.filter-maker .check__text {
    color: #000;
    font-size: 15px;
    line-height: 20px;
    font-weight: 300
}

@media all and (min-width: 1024px) {
    .filter-maker .check__text {
        font-size: 16px;
        line-height: 22px
    }
}

@media all and (min-width: 1280px) {
    .filter-maker .check__text {
        font-size: 18px;
        line-height: 24px
    }
}

@media all and (min-width: 1440px) {
    .filter-maker .check__text {
        font-size: 20px;
        line-height: 28px
    }
}

.filter-colors {
    display: flex;
    flex-wrap: wrap;
    gap: 14px
}

.filter-colors .check {
    cursor: pointer;
    width: 24px;
    height: 24px
}

.filter-colors .check__square {
    position: relative
}

.filter-colors .check__square::after {
    content: '';
    position: absolute;
    top: -6px;
    left: -3px;
    width: 28px;
    height: 28px;
    border: 1px solid var(--border-color)
}

.filter-btns {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px
}

.filter-btns__clear {
    display: none
}

@media all and (min-width: 1280px) {
    .filter-btns__clear {
        display: flex
    }
}

@media all and (min-width: 1280px) {
    .filter-btns__apply {
        max-width: 187px
    }
}

.popap-add-basket {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 11;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(0, 0, 0, .3);
    opacity: 0;
    visibility: hidden
}

.popap-add-basket.active {
    opacity: 1;
    visibility: visible
}

.popap-add-basket__wrapper {
    padding: 40px;
    background: var(--color-5);
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center
}

@media all and (min-width: 768px) {
    .popap-add-basket__wrapper {
        padding: 100px 126px 113px 126px
    }
}

.popap-add-basket__close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 20px;
    height: 20px;
    display: flex;
    cursor: pointer
}

@media all and (min-width: 768px) {
    .popap-add-basket__close {
        top: 20px;
        right: 20px;
        width: 24px;
        height: 24px
    }
}

.popap-add-basket__order {
    margin-top: 40px
}

.popap-add-basket__return {
    display: flex;
    align-items: center;
    gap: 24px;
    margin-top: 32px;
    cursor: pointer
}

.popap-add-basket__return svg {
    width: 20px;
    height: 20px;
    flex-shrink: 0
}

@media all and (min-width: 1280px) {
    .popap-add-basket__return svg {
        width: 40px;
        height: 40px
    }
}

.catalog-detail__content {
    display: flex;
    flex-direction: column;
    gap: 50px
}

@media all and (min-width: 768px) {
    .catalog-detail__content {
        display: grid;
        grid-template-columns:332px 1fr;
        column-gap: 74px
    }
}

@media all and (min-width: 1024px) {
    .catalog-detail__content {
        grid-template-columns:448px 1fr;
        column-gap: 98px
    }
}

@media all and (min-width: 1280px) {
    .catalog-detail__content {
        grid-template-columns:480px 1fr;
        column-gap: 96px
    }
}

@media all and (min-width: 1820px) {
    .catalog-detail__content {
        grid-template-columns:740px 1fr;
        column-gap: 109px
    }
}

.catalog-detail-sl {
    overflow: hidden
}

.catalog-detail-sl__img {
    position: relative;
    width: 100%;
    height: 266px;
    background: var(--color-5);
    overflow: hidden
}

@media all and (min-width: 1024px) {
    .catalog-detail-sl__img {
        height: 362px
    }
}

@media all and (min-width: 1280px) {
    .catalog-detail-sl__img {
        height: 388px
    }
}

@media all and (min-width: 1820px) {
    .catalog-detail-sl__img {
        height: 600px
    }
}

.catalog-detail-sl__img img {
    max-width: 50%;
    max-height: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%)
}

@media all and (min-width: 768px) {
    .catalog-detail-sl__img img {
        max-width: 67.5%;
        max-height: 67.5%
    }
}

@media all and (min-width: 1820px) {
    .catalog-detail-sl__img img {
        max-width: 83%;
        max-height: 83%
    }
}

.catalog-detail-sl__pag {
    margin-top: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px
}

@media all and (min-width: 768px) {
    .catalog-detail-sl__pag {
        display: none
    }
}

.catalog-detail-sl__pag .swiper-pagination-bullet {
    margin: 0 0 !important;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    opacity: 1;
    background: var(--color-2)
}

.catalog-detail-sl__pag .swiper-pagination-bullet-active {
    background: var(--color-3)
}

.catalog-detail-thumb {
    display: none;
    width: 100%
}

@media all and (min-width: 768px) {
    .catalog-detail-thumb {
        display: block;
        margin-top: 20px
    }
}

@media all and (min-width: 1024px) {
    .catalog-detail-thumb {
        margin-top: 28px
    }
}

.catalog-detail-thumb .swiper-wrapper {
    width: 100%;
    flex-wrap: wrap;
    gap: 14px
}

@media all and (min-width: 1024px) {
    .catalog-detail-thumb .swiper-wrapper {
        gap: 22px
    }
}

@media all and (min-width: 1280px) {
    .catalog-detail-thumb .swiper-wrapper {
        gap: 20px
    }
}

.catalog-detail-thumb .swiper-slide-thumb-active {
    border: 2px solid var(--color-3)
}

.catalog-detail-thumb__slide {
    display: flex;
    width: 72px;
    height: 72px;
    overflow: hidden;
    cursor: pointer
}

@media all and (min-width: 1280px) {
    .catalog-detail-thumb__slide {
        width: 80px;
        height: 80px
    }
}

@media all and (min-width: 1820px) {
    .catalog-detail-thumb__slide {
        width: 100px;
        height: 100px
    }
}

.catalog-detail-thumb__img {
    width: 72px;
    height: 72px;
    position: relative;
    background: var(--color-5)
}

@media all and (min-width: 1280px) {
    .catalog-detail-thumb__img {
        width: 80px;
        height: 80px
    }
}

@media all and (min-width: 1820px) {
    .catalog-detail-thumb__img {
        width: 100px;
        height: 100px
    }
}

.catalog-detail-thumb__img img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 90%
}

.catalog-info__price span {
    font-size: 17px;
    line-height: 20px;
    font-weight: 400
}

@media all and (min-width: 1024px) {
    .catalog-info__price span {
        font-size: 20px;
        line-height: 26px
    }
}

@media all and (min-width: 1280px) {
    .catalog-info__price span {
        font-size: 22px;
        line-height: 28px
    }
}

@media all and (min-width: 1820px) {
    .catalog-info__price span {
        font-size: 24px;
        line-height: 32px
    }
}

.catalog-info__count {
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 20px
}

@media all and (min-width: 1280px) {
    .catalog-info__count {
        margin-top: 20px
    }
}

.catalog-info__count .counter {
    gap: 20px;
    max-width: 136px;
    min-width: 136px;
    grid-template-columns:16px 64px 16px
}

.catalog-info__count .counter-input {
    background: 0 0;
    border-bottom: 2px solid var(--color-3)
}

.catalog-info__count .counter-minus, .catalog-info__count .counter-plus {
    opacity: 1;
    width: 16px;
    flex-shrink: 0
}

.catalog-info__btn-question {
    margin-top: 16px
}

@media all and (min-width: 1280px) {
    .catalog-info__btn-question {
        margin-top: 20px
    }
}

.catalog-info__btn-question button {
    width: 100%
}

@media all and (min-width: 1024px) {
    .catalog-info__btn-question button {
        max-width: 292px
    }
}

@media all and (min-width: 1280px) {
    .catalog-info__btn-question button {
        max-width: 320px
    }
}

.catalog-info__btn-buy {
    margin-top: 16px
}

@media all and (min-width: 1280px) {
    .catalog-info__btn-buy {
        margin-top: 20px
    }
}

.catalog-info__btn-buy button {
    width: 100%
}

@media all and (min-width: 1024px) {
    .catalog-info__btn-buy button {
        max-width: 292px
    }
}

@media all and (min-width: 1280px) {
    .catalog-info__btn-buy button {
        max-width: 320px
    }
}

.catalog-info__specification {
    margin-top: 40px
}

@media all and (min-width: 1280px) {
    .catalog-info__specification {
        margin-top: 60px
    }
}

.catalog-info__colors {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 16px
}

.catalog-info__colors-wrap {
    display: flex;
    flex-wrap: wrap;
    gap: 14px
}

.catalog-info__colors-item {
    display: flex;
    position: relative;
    width: 64px;
    height: 64px;
    border: 1px solid var(--border-color)
}

.catalog-info__colors-item img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.catalog-info__colors-item:hover,
.catalog-info__colors-item:focus-visible,
.catalog-info__colors-item.active {
    border: 2px solid var(--color-3);
}

.catalog-info__colors-item:focus-visible {
    outline: 2px solid var(--color-3);
    outline-offset: 2px;
}

.catalog-info__tabs {
    margin-top: 40px
}

@media all and (min-width: 1280px) {
    .catalog-info__tabs {
        margin-top: 60px
    }
}

.catalog-info__tabs-btn {
    display: flex;
    align-items: center;
    gap: 40px
}

.catalog-info__tabs-content {
    margin-top: 20px
}

.catalog-info__tab {
    font-size: 17px;
    line-height: 20px;
    font-weight: 400;
    color: rgba(0, 0, 0, .5);
    cursor: pointer
}

@media all and (min-width: 1024px) {
    .catalog-info__tab {
        font-size: 20px;
        line-height: 26px
    }
}

@media all and (min-width: 1280px) {
    .catalog-info__tab {
        font-size: 22px;
        line-height: 28px
    }
}

@media all and (min-width: 1820px) {
    .catalog-info__tab {
        font-size: 24px;
        line-height: 32px
    }
}

.catalog-info__tab.active {
    border-bottom: 2px solid var(--color-3);
    color: #000
}

.catalog-info__content {
    display: none
}

.catalog-info__content.active {
    display: block
}

.catalog-info__social {
    display: flex;
    align-items: center;
    gap: 20px;
    flex-wrap: wrap;
    margin-top: 20px
}

.catalog-page-d__content {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap: 4px
}

@media all and (min-width: 768px) {
    .catalog-page-d__content {
        grid-template-columns:repeat(4, minmax(0, 1fr));
        gap: 3px
    }
}

@media all and (min-width: 1024px) {
    .catalog-page-d__content {
        grid-template-columns:repeat(5, minmax(0, 1fr))
    }
}

.catalog-page-d__content .box {
    min-height: 106px
}

@media all and (min-width: 768px) {
    .catalog-page-d__content .box {
        min-height: 158px;
        align-items: flex-start
    }
}

@media all and (min-width: 1024px) {
    .catalog-page-d__content .box {
        min-height: 170px
    }
}

@media all and (min-width: 1820px) {
    .catalog-page-d__content .box {
        min-height: 277px
    }
}

@media all and (min-width: 768px) {
    .catalog-page-d__content .box:nth-child(1) {
        grid-row: 1/3
    }
}

@media all and (min-width: 768px) {
    .catalog-page-d__content .box:nth-child(3) {
        grid-row: 2/3
    }
}

@media all and (min-width: 768px) {
    .catalog-page-d__content .box:nth-child(4) {
        grid-row: 1/3;
        grid-column: 3/4
    }
}

@media all and (min-width: 1024px) {
    .catalog-page-d__content .box:nth-child(7) {
        grid-row: 1/3;
        grid-column: 5/6
    }
}

.catalog-page-d__content .box::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.catalog-page-d__content .box__title {
    margin-top: auto
}

@media all and (min-width: 768px) {
    .catalog-page-d__content .box__title {
        margin-top: 30%
    }
}

@media all and (min-width: 1820px) {
    .catalog-page-d__content .box__title {
        margin-top: 10%
    }
}

.catalog-page-d__content .box_yellow::after {
    background: #ff8204
}

.catalog-page-d__content .box_orange::after {
    background: #ff4b04
}

.catalog-page-d__content .box_blue::after {
    background: #6736dd
}

.catalog-page-d__content .box_light-blue::after {
    background: #aeadf0
}

.page__main.--catalog {
    position: relative
}

.screen-video .screen-video__slider {
    overflow: hidden
}

.screen-video .page__wrap-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 20px
}

@media all and (min-width: 768px) {
    .screen-video .page__wrap-nav {
        display: flex;
        gap: 40px;
        align-items: center;
        justify-content: flex-start;
        margin-top: 0
    }
}

@media all and (max-width: 768px) {
    .screen-video .page__wrap-nav .button-more {
        order: -1
    }
}

@media all and (min-width: 768px) {
    .screen-video .page__title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 40px
    }
}

@media all and (max-width: 768px) {
    .screen-video .video-catalog__slides {
        display: grid;
        grid-template-columns:repeat(2, minmax(0, 1fr))
    }
}

@media all and (max-width: 768px) {
    .screen-video .video-catalog__slides .box_indent {
        padding: 16px;
        overflow: hidden
    }
}

@media all and (max-width: 768px) {
    .screen-video .video-catalog__slides .box__title {
        font-size: 17px;
        line-height: 17px
    }
}

@media all and (max-width: 768px) {
    .screen-video .video-catalog__slide {
        grid-auto-rows: 150px
    }
}

@media all and (min-width: 768px) {
    .screen-video .screen-video__pagination {
        display: none
    }
}

.screen-video .nav-buttons {
    display: none
}

@media all and (min-width: 768px) {
    .screen-video .nav-buttons {
        display: flex
    }
}

.cookie-block {
    padding: 20px;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #fff;
    box-shadow: 4px 0 30px 0 rgba(0, 0, 0, .149);
    z-index: 10;
    display: none
}

.cookie-block.--show {
    display: block
}

.cookie-block__container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
    align-items: center
}

.cookie-block__button {
    flex-shrink: 0
}

.cookie-block__text {
    display: flex;
    flex-wrap: wrap;
    gap: 6px
}

.cookie-block__text a {
    color: #ff8204;
    text-decoration: underline;
    cursor: pointer
}