/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
.swiper-container-cube,
.swiper-container-flip,
button,
hr,
input {
    overflow: visible
}

progress,
sub,
sup {
    vertical-align: baseline
}

html,
legend {
    box-sizing: border-box
}

.swiper-slide,
.swiper-wrapper {
    height: 100%;
    position: relative;
    transition-property: transform;
    width: 100%
}

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

.black .portfolio-page__scroll-mouse::after,
.black p::before {
    background-color: #333
}

a:active,
a:hover {
    color: #a62e41
}

.button,
.cube span,
.h2,
.stages__text h2,
.teams__wrapper h3,
h2 {
    letter-spacing: .05em
}

.portfolio-page__box-add .portfolio-page__button-next span:last-child,
.portfolio-page__box-add .portfolio-page__button-prev span:last-child {
    padding-top: 0;
    grid-row: 1;
    align-self: center
}

html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%
}

hr {
    box-sizing: content-box;
    height: 0
}

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

a {
    background-color: transparent;
    text-decoration: none;
    color: #333
}

abbr[title] {
    border-bottom: none;
    text-decoration: underline;
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted
}

b,
strong {
    font-weight: bolder
}

small {
    font-size: 80%
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative
}

sub {
    bottom: -.25em
}

sup {
    top: -.5em
}

img {
    border-style: none;
    width: 100%;
    height: auto
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 100%;
    line-height: 1.15;
    margin: 0
}

button,
select {
    text-transform: none
}

.about-us__nav-list a,
.box__link,
.h2,
.intro__box h1,
.teams__wrapper h2,
.teams__wrapper h3,
h2 {
    text-transform: uppercase
}

[type=button],
[type=reset],
[type=submit],
button {
    -webkit-appearance: button
}

[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner,
button::-moz-focus-inner {
    border-style: none;
    padding: 0
}

[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring,
button:-moz-focusring {
    outline: ButtonText dotted 1px
}

fieldset {
    padding: .35em .75em .625em
}

legend {
    color: inherit;
    display: table;
    max-width: 100%;
    padding: 0;
    white-space: normal
}

textarea {
    overflow: auto
}

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

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

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

.about-us__box-text p strong,
.about-us__box-text strong,
.business__list p,
.business__list--mobile p,
.h2,
.main-footer--2 .main-footer__contacts ul:first-child li:first-child a,
.main-footer--2 .main-footer__nav ul li:first-child a,
.main-footer--2 .main-footer__phone span,
.main-footer__phone span,
.main-header__box-tablet span,
.main-header__tel span,
h1,
h2 {
    font-family: ProximaNova-Bold, arial, sans-serif
}

details {
    display: block
}

summary {
    display: list-item
}

[hidden],
template {
    display: none
}

@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") format("woff");
    font-weight: 400;
    font-style: normal
}

:root {
    --swiper-theme-color: #007aff;
    --swiper-navigation-size: 44px
}

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

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

.swiper-wrapper {
    z-index: 1;
    display: flex;
    box-sizing: content-box
}

.swiper-container-multirow>.swiper-wrapper {
    flex-wrap: wrap
}

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

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

.swiper-slide {
    flex-shrink: 0
}

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

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

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

.swiper-container-3d {
    perspective: 1200px
}

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

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

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

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

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

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

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

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

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

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

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

.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(-1 * 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))
}

.main-header__tel .main-header__phone-box,
.mse2_pagination,
.swiper-button-lock,
.swiper-pagination-lock,
.swiper-scrollbar-lock {
    display: none
}

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

.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;
    text-transform: none;
    font-variant: initial;
    line-height: 1
}

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

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

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

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

.swiper-button-next.swiper-button-white,
.swiper-button-prev.swiper-button-white {
    --swiper-navigation-color: #ffffff
}

.swiper-button-next.swiper-button-black,
.swiper-button-prev.swiper-button-black {
    --swiper-navigation-color: #000000
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: opacity .3s;
    z-index: 10
}

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

.swiper-container-horizontal>.swiper-pagination-bullets,
.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,
.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main,
.tabs li input:checked+label:hover,
.tags li input:checked+label:hover {
    transform: scale(1)
}

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

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

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2
}

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

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

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

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

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 6px 0;
    display: block
}

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

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

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 4px
}

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

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

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

.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-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
    transform-origin: right top
}

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

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

.swiper-pagination-white {
    --swiper-pagination-color: #ffffff
}

.swiper-pagination-black {
    --swiper-pagination-color: #000000
}

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

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

.swiper-container-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,
.swiper-slide-zoomed {
    cursor: move
}

.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%;
    -o-object-fit: contain;
    object-fit: contain
}

.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%;
    -webkit-animation: 1s linear infinite swiper-preloader-spin;
    animation: 1s linear infinite swiper-preloader-spin;
    box-sizing: border-box;
    border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color));
    border-radius: 50%;
    border-top-color: transparent
}

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

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

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

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

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

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

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

.swiper-container-cube .swiper-slide .swiper-slide,
.swiper-container-fade .swiper-slide .swiper-slide,
.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

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

.swiper-container-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-container-cube.swiper-container-rtl .swiper-slide {
    transform-origin: 100% 0
}

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

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

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .6;
    filter: blur(50px);
    z-index: 0
}

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

/*!
* lazyYT (lazy load YouTube videos)
* v1.0.1 - 2014-12-30
* (CC) This work is licensed under a Creative Commons Attribution-ShareAlike 4.0 International License.
* http://creativecommons.org/licenses/by-sa/4.0/
* Contributors: https://github.com/tylerpearson/lazyYT/graphs/contributors || https://github.com/daugilas/lazyYT/graphs/contributors
*/
.lazyYT-container {
    direction: ltr;
    position: relative;
    display: block;
    height: 0;
    padding: 0 0 56.25%;
    overflow: hidden;
    background-color: #000
}

.gray-box,
.main-header {
    background-color: #f5f9ff
}

.lazyYT-container iframe {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0
}

.lazyYT-container .html5-info-bar {
    position: absolute;
    top: 0;
    z-index: 935;
    width: 100%;
    height: 30px;
    overflow: hidden;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #fff;
    background-color: rgba(0, 0, 0, .8);
    transition: opacity .25s cubic-bezier(0, 0, .2, 1)
}

.lazyYT-container .html5-title {
    padding-right: 6px;
    padding-left: 12px
}

.lazyYT-container .html5-title-text-wrapper {
    overflow: hidden;
    text-overflow: ellipsis;
    word-wrap: normal;
    white-space: nowrap
}

.lazyYT-container .html5-title-text {
    width: 100%;
    font-size: 13px;
    line-height: 30px;
    color: #ccc;
    text-decoration: none
}

.lazyYT-container .html5-title-text:hover {
    color: #fff;
    text-decoration: underline
}

.ytp-thumbnail {
    padding-bottom: inherit;
    cursor: pointer;
    background-position: 50% 50%;
    background-repeat: no-repeat;
    background-size: cover
}

.ytp-large-play-button {
    position: absolute;
    top: 50% !important;
    left: 50% !important;
    width: 86px !important;
    height: 60px !important;
    padding: 0 !important;
    margin: -29px 0 0 -42px !important;
    font-size: normal !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    opacity: .9
}

.h2,
.h3,
body,
h2,
h3 {
    margin: 0
}

.ytp-large-play-button-svg {
    opacity: .9;
    fill: #1f1f1f
}

.lazyYT-image-loaded:hover .ytp-large-play-button-svg,
.ytp-large-play-button:focus .ytp-large-play-button-svg {
    opacity: 1;
    fill: #cc181e
}

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

body,
html {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

a:active {
    font-weight: 800
}

h1 {
    margin: 25px 0;
    font-size: 48px;
    line-height: 48px;
    font-weight: 400;
    text-align: center
}

.h2,
h2 {
    font-size: 24px;
    line-height: 24px;
    color: #000
}

.black,
.black a,
body {
    color: #333
}

.h3,
.main-header__list a,
h3 {
    font-size: 18px;
    line-height: 18px
}

body {
    min-width: 320px;
    -webkit-touch-callout: none;
    min-height: 100vh;
    font-family: ProximaNova-Regular, arial, sans-serif;
    font-size: 18px;
    line-height: 24px;
    font-weight: 400;
    display: flex;
    flex-direction: column;
    overflow-x: hidden
}

.main-header__tel .main-header__phone-box a img,
main {
    display: block
}

main {
    flex-grow: 1
}

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    white-space: nowrap;
    border: 0;
    clip: rect(0 0 0 0);
    -webkit-clip-path: inset(100%);
    clip-path: inset(100%)
}

.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 30px
}

.gray-box {
    z-index: 0
}

.overflow-hidden {
    overflow: hidden
}

.page-main {
    position: absolute;
    top: 65px;
    left: 0;
    z-index: -2
}

.black+.portfolio-page__box h1,
.white+.portfolio-page__box h1 {
    padding-bottom: 10px;
    position: relative;
    display: inline-block
}

.black+.portfolio-page__box h1::after {
    width: 0;
    height: 2px;
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    background-color: transparent;
    transition: .3s linear
}

.black+.portfolio-page__box h1:hover::after {
    width: 100%;
    background-color: #333
}

.white,
.white a {
    color: #fff
}

.white p::before {
    background-color: #fff
}

.main-header__tel button::after,
.main-header__tel button::before {
    top: 9px;
    background-color: #0a3d76;
    content: "";
    width: 10px;
    height: 2px
}

.white+.portfolio-page__box h1::after {
    width: 0;
    height: 2px;
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    background-color: transparent;
    transition: .3s linear
}

.white+.portfolio-page__box h1:hover::after {
    width: 100%;
    background-color: #fff
}

.black .portfolio-page__scroll-mouse {
    border: 2px solid #333
}

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

#__replain_widget {
    -webkit-animation: 1.5s 7s forwards coffeeOpacity;
    animation: 1.5s 7s forwards coffeeOpacity;
    opacity: 0
}

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

@font-face {
    font-family: ProximaNova-Bold;
    font-style: normal;
    font-weight: 800;
    font-display: swap;
    src: local("ProximaNova-Bold"), local("ProximaNova Bold"), url("../fonts/ProximaNova-Bold.woff2") format("woff2"), url("../fonts/ProximaNova-Bold.woff") format("woff")
}

@font-face {
    font-family: Mistral;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: local("Mistral"), local("Mistral"), url("../fonts/Mistral.woff2") format("woff2"), url("../fonts/Mistral.woff") format("woff")
}

@-webkit-keyframes services-icon-show {
    0% {
        transform: translateY(15%);
        opacity: 0
    }

    100% {
        transform: translateY(5%);
        opacity: 1
    }
}

@keyframes services-icon-show {
    0% {
        transform: translateY(15%);
        opacity: 0
    }

    100% {
        transform: translateY(5%);
        opacity: 1
    }
}

@-webkit-keyframes services-icon-movement {
    0% {
        transform: translateY(5%)
    }

    100% {
        transform: translateY(13%)
    }
}

@keyframes services-icon-movement {
    0% {
        transform: translateY(5%)
    }

    100% {
        transform: translateY(13%)
    }
}

@-webkit-keyframes teams-svg-top {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(30%)
    }
}

@keyframes teams-svg-top {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(30%)
    }
}

@-webkit-keyframes teams-svg-smm {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(4%)
    }
}

@keyframes teams-svg-smm {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(4%)
    }
}

@-webkit-keyframes teams-svg-developers {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(100%)
    }
}

@keyframes teams-svg-developers {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(100%)
    }
}

@-webkit-keyframes rotateClose {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(180deg)
    }
}

@keyframes rotateClose {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(180deg)
    }
}

@-webkit-keyframes rotateRight1 {
    0% {
        transform: rotate(90deg)
    }

    50% {
        transform: rotate(270deg)
    }

    100% {
        transform: rotate(450deg)
    }
}

@keyframes rotateRight1 {
    0% {
        transform: rotate(90deg)
    }

    50% {
        transform: rotate(270deg)
    }

    100% {
        transform: rotate(450deg)
    }
}

@-webkit-keyframes rotateLeft {
    0% {
        transform: rotate(0)
    }

    50% {
        transform: rotate(-180deg)
    }

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

@keyframes rotateLeft {
    0% {
        transform: rotate(0)
    }

    50% {
        transform: rotate(-180deg)
    }

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

@-webkit-keyframes rotateRight {
    0% {
        transform: rotate(0)
    }

    50% {
        transform: rotate(180deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@keyframes rotateRight {
    0% {
        transform: rotate(0)
    }

    50% {
        transform: rotate(180deg)
    }

    100% {
        transform: rotate(360deg)
    }
}

@-webkit-keyframes rotate {

    0%,
    100% {
        transform: rotate(0) translate3d(0, 0, 0)
    }

    25% {
        transform: rotate(3deg) translate3d(0, 0, 0)
    }

    50% {
        transform: rotate(-3deg) translate3d(0, 0, 0)
    }

    75% {
        transform: rotate(1deg) translate3d(0, 0, 0)
    }
}

@keyframes rotate {

    0%,
    100% {
        transform: rotate(0) translate3d(0, 0, 0)
    }

    25% {
        transform: rotate(3deg) translate3d(0, 0, 0)
    }

    50% {
        transform: rotate(-3deg) translate3d(0, 0, 0)
    }

    75% {
        transform: rotate(1deg) translate3d(0, 0, 0)
    }
}

@-webkit-keyframes rotateSeo {
    0% {
        transform: rotate(12deg)
    }

    100% {
        transform: rotate(-12deg)
    }
}

@keyframes rotateSeo {
    0% {
        transform: rotate(12deg)
    }

    100% {
        transform: rotate(-12deg)
    }
}

@-webkit-keyframes rotateQuadrocopter {
    0% {
        transform: rotate(12deg) translate(20px, 30px)
    }

    100% {
        transform: rotate(-12deg) translate(0, 0)
    }
}

@keyframes rotateQuadrocopter {
    0% {
        transform: rotate(12deg) translate(20px, 30px)
    }

    100% {
        transform: rotate(-12deg) translate(0, 0)
    }
}

@-webkit-keyframes rotateSeo1 {
    0% {
        transform: rotate(-12deg) translateY(30%)
    }

    100% {
        transform: rotate(12deg) translateY(0)
    }
}

@keyframes rotateSeo1 {
    0% {
        transform: rotate(-12deg) translateY(30%)
    }

    100% {
        transform: rotate(12deg) translateY(0)
    }
}

@-webkit-keyframes rotateKaterina {
    0% {
        transform: rotate(-2deg)
    }

    100% {
        transform: rotate(2deg)
    }
}

@keyframes rotateKaterina {
    0% {
        transform: rotate(-2deg)
    }

    100% {
        transform: rotate(2deg)
    }
}

@-webkit-keyframes rotateCoffeePrice {
    0% {
        transform: rotate(2deg) translate(5px, 0)
    }

    100% {
        transform: rotate(-3deg)
    }
}

@keyframes rotateCoffeePrice {
    0% {
        transform: rotate(2deg) translate(5px, 0)
    }

    100% {
        transform: rotate(-3deg)
    }
}

@-webkit-keyframes rotateKaterina1 {
    0% {
        transform: rotate(-3deg)
    }

    100% {
        transform: rotate(3deg)
    }
}

@keyframes rotateKaterina1 {
    0% {
        transform: rotate(-3deg)
    }

    100% {
        transform: rotate(3deg)
    }
}

@-webkit-keyframes storm {

    0%,
    100% {
        transform: translate3d(0, 0, 0) translateZ(0)
    }

    25% {
        transform: translate3d(4px, 0, 0) translateZ(0)
    }

    50% {
        transform: translate3d(-3px, 0, 0) translateZ(0)
    }

    75% {
        transform: translate3d(1px, 0, 0) translateZ(0)
    }
}

@keyframes storm {

    0%,
    100% {
        transform: translate3d(0, 0, 0) translateZ(0)
    }

    25% {
        transform: translate3d(4px, 0, 0) translateZ(0)
    }

    50% {
        transform: translate3d(-3px, 0, 0) translateZ(0)
    }

    75% {
        transform: translate3d(1px, 0, 0) translateZ(0)
    }
}

@-webkit-keyframes stage-show-elements-1 {
    0% {
        opacity: 0;
        transform: translateY(35%)
    }

    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

@keyframes stage-show-elements-1 {
    0% {
        opacity: 0;
        transform: translateY(35%)
    }

    100% {
        opacity: 1;
        transform: translateY(0)
    }
}

@-webkit-keyframes coffeeOpacity {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes coffeeOpacity {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes stage-show-elements-2 {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes stage-show-elements-2 {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes stage-show-elements-3 {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes stage-show-elements-3 {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes stage-show-elements-4 {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(45%)
    }
}

@keyframes stage-show-elements-4 {
    0% {
        transform: translateY(0)
    }

    100% {
        transform: translateY(45%)
    }
}

@-webkit-keyframes show {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes show {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@-webkit-keyframes show-1 {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes show-1 {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes scale {
    0% {
        transform: scale(.8)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes scale {
    0% {
        transform: scale(.8)
    }

    100% {
        transform: scale(1)
    }
}

@-webkit-keyframes scale2 {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(1.2)
    }
}

@keyframes scale2 {
    0% {
        transform: scale(1)
    }

    100% {
        transform: scale(1.2)
    }
}

@-webkit-keyframes scale3 {
    0% {
        transform: scale(.6)
    }

    100% {
        transform: scale(.8)
    }
}

@keyframes scale3 {
    0% {
        transform: scale(.6)
    }

    100% {
        transform: scale(.8)
    }
}

@-webkit-keyframes scale4 {
    0% {
        transform: scale(.8)
    }

    100% {
        transform: scale(1)
    }
}

@keyframes scale4 {
    0% {
        transform: scale(.8)
    }

    100% {
        transform: scale(1)
    }
}

@-webkit-keyframes showBox {
    0% {
        transform: translateY(-170px)
    }

    100% {
        transform: translateY(0)
    }
}

@keyframes showBox {
    0% {
        transform: translateY(-170px)
    }

    100% {
        transform: translateY(0)
    }
}

@-webkit-keyframes trackBallSlide {

    0%,
    100%,
    28%,
    29.99%,
    30%,
    58%,
    59.99%,
    60%,
    88% {
        opacity: 1;
        transform: scale(1) translateY(-7px)
    }

    36%,
    6%,
    66% {
        opacity: 1;
        transform: scale(.9) translateY(1.75px)
    }

    14%,
    44%,
    74% {
        opacity: 0;
        transform: scale(.4) translateY(14px)
    }

    15%,
    19%,
    45%,
    49%,
    75%,
    79% {
        opacity: 0;
        transform: scale(.4) translateY(-7px)
    }
}

@keyframes trackBallSlide {

    0%,
    100%,
    28%,
    29.99%,
    30%,
    58%,
    59.99%,
    60%,
    88% {
        opacity: 1;
        transform: scale(1) translateY(-7px)
    }

    36%,
    6%,
    66% {
        opacity: 1;
        transform: scale(.9) translateY(1.75px)
    }

    14%,
    44%,
    74% {
        opacity: 0;
        transform: scale(.4) translateY(14px)
    }

    15%,
    19%,
    45%,
    49%,
    75%,
    79% {
        opacity: 0;
        transform: scale(.4) translateY(-7px)
    }
}

@-webkit-keyframes nudgeMouse {

    0%,
    30%,
    60%,
    90% {
        transform: translateY(0)
    }

    20%,
    50%,
    80% {
        transform: translateY(4px)
    }
}

@keyframes nudgeMouse {

    0%,
    30%,
    60%,
    90% {
        transform: translateY(0)
    }

    20%,
    50%,
    80% {
        transform: translateY(4px)
    }
}

@-webkit-keyframes rotate1 {
    0% {
        transform: rotateX(0) rotateY(0)
    }

    100% {
        transform: rotateX(360deg) rotateY(360deg)
    }
}

@keyframes rotate1 {
    0% {
        transform: rotateX(0) rotateY(0)
    }

    100% {
        transform: rotateX(360deg) rotateY(360deg)
    }
}

@-webkit-keyframes rotate2 {
    0% {
        transform: rotateZ(0) rotateY(0)
    }

    100% {
        transform: rotateZ(360deg) rotateY(360deg)
    }
}

@keyframes rotate2 {
    0% {
        transform: rotateZ(0) rotateY(0)
    }

    100% {
        transform: rotateZ(360deg) rotateY(360deg)
    }
}

@-webkit-keyframes rotate3 {
    0% {
        transform: rotateX(0) rotateZ(0)
    }

    100% {
        transform: rotateX(360deg) rotateZ(360deg)
    }
}

@keyframes rotate3 {
    0% {
        transform: rotateX(0) rotateZ(0)
    }

    100% {
        transform: rotateX(360deg) rotateZ(360deg)
    }
}

@-webkit-keyframes sliderSkew {
    0% {
        transform: skew(15deg, -10deg)
    }

    100% {
        transform: skew(0deg, 0deg)
    }
}

@keyframes sliderSkew {
    0% {
        transform: skew(15deg, -10deg)
    }

    100% {
        transform: skew(0deg, 0deg)
    }
}

@-webkit-keyframes span-first-off {
    0% {
        transform: translate(-50%, -50%) rotate(-45deg)
    }

    30% {
        transform: translate(-50%, -50%) rotate(0)
    }

    100% {
        transform: translate(-50%, -400%)
    }
}

@keyframes span-first-off {
    0% {
        transform: translate(-50%, -50%) rotate(-45deg)
    }

    30% {
        transform: translate(-50%, -50%) rotate(0)
    }

    100% {
        transform: translate(-50%, -400%)
    }
}

@-webkit-keyframes span-second-off {
    0% {
        transform: translate(-150%, -50%) scale(0)
    }

    50% {
        transform: translate(-50%, -50%) scale(1)
    }

    100% {
        transform: translate(-50%, -50%)
    }
}

@keyframes span-second-off {
    0% {
        transform: translate(-150%, -50%) scale(0)
    }

    50% {
        transform: translate(-50%, -50%) scale(1)
    }

    100% {
        transform: translate(-50%, -50%)
    }
}

@-webkit-keyframes span-third-off {
    0% {
        transform: translate(-50%, -50%) rotate(45deg)
    }

    30% {
        transform: translate(-50%, -50%) rotate(0)
    }

    100% {
        transform: translate(-50%, 330%)
    }
}

@keyframes span-third-off {
    0% {
        transform: translate(-50%, -50%) rotate(45deg)
    }

    30% {
        transform: translate(-50%, -50%) rotate(0)
    }

    100% {
        transform: translate(-50%, 330%)
    }
}

@-webkit-keyframes span-first-on {
    0% {
        transform: translate(-50%, -300%)
    }

    30% {
        transform: translate(-50%, -50%)
    }

    100% {
        transform: translate(-50%, -50%) rotate(-45deg)
    }
}

@keyframes span-first-on {
    0% {
        transform: translate(-50%, -300%)
    }

    30% {
        transform: translate(-50%, -50%)
    }

    100% {
        transform: translate(-50%, -50%) rotate(-45deg)
    }
}

@-webkit-keyframes span-second-on {
    0% {
        transform: translate(-50%, -50%)
    }

    50% {
        transform: translate(-50%, -50%) scale(1)
    }

    100% {
        transform: translate(-150%, -50%) scale(0)
    }
}

@keyframes span-second-on {
    0% {
        transform: translate(-50%, -50%)
    }

    50% {
        transform: translate(-50%, -50%) scale(1)
    }

    100% {
        transform: translate(-150%, -50%) scale(0)
    }
}

@-webkit-keyframes span-third-on {
    0% {
        transform: translate(-50%, 200%)
    }

    30% {
        transform: translate(-50%, -50%)
    }

    100% {
        transform: translate(-50%, -50%) rotate(45deg)
    }
}

@keyframes span-third-on {
    0% {
        transform: translate(-50%, 200%)
    }

    30% {
        transform: translate(-50%, -50%)
    }

    100% {
        transform: translate(-50%, -50%) rotate(45deg)
    }
}

@-webkit-keyframes armRight {
    0% {
        right: -45%
    }

    100% {
        right: -75px
    }
}

@keyframes armRight {
    0% {
        right: -45%
    }

    100% {
        right: -75px
    }
}

@-webkit-keyframes flickers {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

@keyframes flickers {
    0% {
        opacity: 0
    }

    100% {
        opacity: 1
    }
}

.main-header {
    width: 100%;
    box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20
}

.main-header__wrapper {
    display: grid;
    grid-template-columns: 17% auto;
    align-items: center;
    padding-top: 5px;
    padding-bottom: 5px
}

@media (max-width:1200px) {
    .main-header__wrapper {
        grid-template-columns: 15% auto
    }
}

@media (max-width:1025px) {
    .overflow-hidden {
        overflow: auto
    }

    .main-header__wrapper {
        min-height: 65px;
        padding: 0 15px;
        grid-gap: 0 20px;
        grid-template-columns: 1fr auto;
        box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
        background-color: #f5f9ff
    }
}

.main-header__tel {
    display: flex;
    align-items: center;
    gap: 0 15px;
    font-size: 16px;
    line-height: 21px;
    position: relative
}

@media (max-width:1025px) {
    .main-header__tel {
        padding: 10px;
        position: absolute;
        top: 65px;
        right: 20px;
        grid-template-columns: 1fr;
        justify-items: flex-end;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px;
        background-color: #f5f9ff;
        box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
        display: none;
        font-size: 18px;
        line-height: 21px
    }

    .main-header__tel>.main-header__link-phone img:first-child {
        display: none
    }
}

@media (max-width:1025px) and (max-width:1025px) {
    .main-header__tel {
        right: 0
    }
}

.main-header__tel span {
    color: #0a3d76;
    display: block;
    padding-left: 5px
}

.main-header__tel a {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.main-header__tel button {
    width: 20px;
    height: 20px;
    border: none;
    padding: 0;
    position: relative;
    background-color: transparent
}

.main-header__tel button::before {
    position: absolute;
    left: 0;
    transform: rotate(45deg)
}

.main-header__tel button::after {
    position: absolute;
    left: 6px;
    transform: rotate(-45deg)
}

.main-header__tel .main-header__phone-box a {
    justify-content: flex-start;
    margin: 2px 0
}

.main-header__tel .main-header__phone-box .socia-list {
    justify-content: flex-start;
    margin: 5px 0
}

.main-header__tel--active,
.main-header__tel--active .main-header__phone-box {
    display: grid;
    grid-gap: 10px 0
}

.main-header__tel a:hover {
    font-weight: 400;
    color: #a62e41
}

.main-header__socia {
    grid-row: 1;
    grid-gap: 0 5px;
    grid-template-columns: 1fr;
    display: none
}

@media (max-width:1025px) {
    .main-header__tel button {
        display: none
    }

    .main-header__tel a:hover {
        color: #a62e41
    }

    .main-header__socia {
        display: grid;
        margin-top: 5px
    }
}

.main-header__socia ul {
    margin: 0;
    padding: 10px;
    list-style: none;
    position: absolute;
    top: 65px;
    right: 140px;
    background-color: #f5f9ff;
    box-shadow: 0 2px 4px rgba(0, 0, 0, .1);
    display: none;
    grid-template-columns: repeat(5, 30px);
    grid-gap: 0 15px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px
}

.main-header__socia .main-header__social-btn {
    padding-right: 10px;
    position: relative
}

.main-header__socia .main-header__social-btn::before {
    width: 8px;
    height: 2px;
    position: absolute;
    content: "";
    top: 16px;
    right: -2px;
    background-color: #1e4180;
    transform: rotate(45deg)
}

.main-header__socia .main-header__social-btn::after {
    width: 8px;
    height: 2px;
    position: absolute;
    content: "";
    top: 16px;
    right: -7px;
    background-color: #1e4180;
    transform: rotate(-45deg)
}

.main-header__socia .main-header__social-btn img {
    max-width: 35px
}

.main-header__socia img {
    max-width: 35px;
    display: block
}

.main-header__social--active ul {
    display: grid
}

.main-header__link-phone {
    width: 100%
}

.main-header__link-phone:hover {
    color: red
}

.main-header__link-phone img:first-child {
    max-width: 25px
}

.main-header__link-phone img:last-child {
    margin-left: 5px;
    max-width: 20px;
    box-shadow: 1px 1px 2px rgba(0, 0, 0, .15)
}

.main-header__services-list a:active,
.main-header__stage-list a:active {
    box-shadow: inset -5px -5px 5px rgba(240, 242, 243, .5), inset 5px 5px 10px rgba(166, 180, 200, .75)
}

.main-header__nav-box {
    display: grid;
    grid-template-columns: 66% auto
}

@media (max-width:1200px) {
    .main-header__nav-box {
        grid-template-columns: 63% auto
    }
}

@media (max-width:1025px) {
    .main-header__socia ul {
        right: 0
    }

    .main-header__link-phone {
        position: relative;
        grid-template-columns: auto auto
    }

    .main-header__nav-box {
        grid-gap: 0 30px;
        grid-template-columns: repeat(2, auto)
    }
}

.main-header__logo {
    max-width: 140px
}

.main-header__logo img {
    display: block
}

.main-header__list {
    margin: 0;
    padding: 0;
    list-style: none;
    max-width: 640px;
    display: grid;
    grid-template-columns: repeat(7, auto);
    flex-wrap: wrap;
    text-align: center
}

.main-header__list .main-header__item-active a {
    font-weight: 800;
    color: #a62e41
}

.contacts__info h3 span,
.contacts__info span.h3,
.main-header__services-list a:hover,
.main-header__stage-list a:hover {
    color: #0a3d76
}

.main-header__wrap-menu-nav {
    display: grid;
    align-items: center;
    padding-top: 10px
}

.main-header__box {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: flex-end
}

.main-header__box .main-header__box-phone,
.main-header__box .main-header__box-phone img {
    display: none
}

@media (max-width:1025px) {
    .main-header__logo {
        max-width: 120px
    }

    .main-header__list {
        max-width: 100%;
        width: 100%;
        padding-top: 40px;
        grid-template-columns: auto
    }

    .main-header__list a {
        padding: 10px 0;
        font-size: 24px;
        line-height: 24px;
        color: #fff;
        font-family: ProximaNova-Bold, arial, sans-serif;
        display: block
    }

    .main-header__list .main-header__item-active a {
        color: rgba(232, 169, 180, .6)
    }

    .main-header__wrap-menu-nav {
        grid-column: 3;
        padding-top: 0
    }

    .main-header__box {
        grid-column: 2;
        grid-row: 1;
        align-items: center
    }

    .main-header__box .main-header__box-phone {
        padding-right: 10px;
        position: relative;
        display: grid
    }

    .main-header__box .main-header__box-phone::before {
        width: 8px;
        height: 2px;
        position: absolute;
        content: "";
        top: 13px;
        right: 5px;
        background-color: #1e4180;
        transform: rotate(45deg)
    }

    .main-header__box .main-header__box-phone::after {
        width: 8px;
        height: 2px;
        position: absolute;
        content: "";
        top: 13px;
        right: 0;
        background-color: #1e4180;
        transform: rotate(-45deg)
    }
}

@media (max-width:1025px) and (max-width:767px) {

    .main-header__box .main-header__box-phone::after,
    .main-header__box .main-header__box-phone::before {
        top: 12px
    }
}

.main-footer--2 .main-footer__link-location::before,
.main-footer__link-location::before {
    width: 11px;
    height: 16px;
    top: 4px;
    background-image: url("../img/svg/icon-marker.svg");
    background-repeat: no-repeat;
    content: ""
}

.main-header__box-tablet {
    display: none;
    padding-bottom: 70px
}

.main-header__box-tablet span {
    border-bottom: 1px dashed #fff
}

.main-header__box-tablet .main-header__box-info,
.main-header__services-box {
    display: none
}

.main-header__btn {
    display: none;
    width: 25px;
    height: 25px;
    padding: 0;
    border: none;
    background-color: transparent;
    cursor: pointer;
    outline: 0;
    position: relative
}

.main-footer,
.main-header__stage-nav {
    background-color: #f5f9ff
}

.main-header__services-list a,
.main-header__stage-list a {
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8);
    border-radius: 10px
}

.main-header__services-nav {
    width: 100%;
    height: 100vh;
    padding-top: 65px;
    position: absolute;
    top: 0;
    left: 0;
    background-color: #f5f9ff;
    z-index: -2
}

.main-header__services-nav h1 {
    margin: 0;
    padding: 25px 0
}

.main-header__services-nav--closed {
    display: none
}

.main-header__services-nav--opened {
    display: grid;
    grid-template-rows: 70px auto;
    overflow-y: scroll
}

.main-header__services-list {
    margin: 0;
    padding: 0 30px 30px;
    list-style: none;
    display: grid;
    grid-gap: 25px 0
}

.main-header__services-list li {
    width: 100%
}

.main-header__services-list a {
    padding-left: 25px;
    font-size: 16px;
    line-height: 16px;
    display: grid;
    grid-gap: 0 10px;
    grid-template-columns: 50px 130px;
    justify-content: center;
    align-items: center
}

.main-header__services-list img {
    max-width: 48px
}

.main-header__stage-box {
    width: 100%;
    padding-top: 65px;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1
}

.main-header__stage-nav {
    height: 100vh
}

.main-header__stage-nav h1 {
    margin: 0;
    padding: 25px 0
}

.main-header__link-services ul,
.main-header__link-stage,
.main-header__services,
.main-header__stage-link ul,
.main-header__stage-nav--closed {
    display: none
}

.main-header__stage-nav--opened {
    display: grid;
    grid-template-rows: 70px auto;
    overflow-y: scroll
}

.main-header__stage-list {
    margin: 0;
    padding: 0 30px 90px;
    list-style: none;
    display: grid;
    grid-gap: 25px 0
}

.main-header__stage-list li {
    width: 100%
}

.main-header__stage-list a {
    padding: 10px 0;
    font-size: 24px;
    line-height: 24px;
    text-align: center;
    display: grid
}

.main-footer__box p,
.main-footer__box span {
    font-size: 13px;
    line-height: 16px;
    color: #787878
}

.main-footer,
.main-footer--2 {
    border-top: 2px solid #0a3d76;
    z-index: 0
}

.advantages__box,
.business__box,
.card-box__box {
    box-shadow: -4px -4px 8px rgba(0, 0, 0, .15), 4px 4px 8px rgba(0, 0, 0, .15);
    border-radius: 5px
}

.main-header__link-services,
.main-header__stage-link {
    position: relative;
    padding-bottom: 10px
}

@media (min-width:1025px) {
    .main-header__tel:hover button::before {
        transform: rotate(-45deg)
    }

    .main-header__tel:hover button::after {
        transform: rotate(45deg)
    }

    .main-header__tel:hover .main-header__phone-box {
        width: 300px;
        padding: 2px 25px 10px;
        display: flex;
        flex-direction: column;
        gap: 2px 0;
        position: absolute;
        top: 35px;
        right: 2px;
        background-color: #f5f9ff;
        z-index: 10;
        box-shadow: 1px 1px 2px rgba(0, 0, 0, .15);
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px
    }

    .main-header__link-services:hover ul,
    .main-header__stage-link:hover ul {
        margin: 0;
        padding: 15px 0;
        list-style: none;
        width: 355px;
        position: absolute;
        top: 34px;
        left: 0;
        background-color: #f5f9ff;
        box-shadow: 0 2px 6px rgba(0, 0, 0, .1);
        border-bottom-right-radius: 5px;
        border-bottom-left-radius: 5px;
        -moz-columns: 2;
        columns: 2;
        display: inline-block
    }

    .main-header__link-services:hover ul a,
    .main-header__stage-link:hover ul a {
        padding-left: 15px;
        border-left: 2px solid transparent;
        display: block;
        margin-bottom: 10px;
        text-align: left;
        color: #333;
        font-weight: 400
    }

    .main-header__link-services:hover ul a:hover,
    .main-header__stage-link:hover ul a:hover {
        color: #a62e41;
        border-left: 2px solid #1e4180
    }
}

.main-footer__wrapper {
    padding: 10px 30px;
    display: grid;
    grid-template-columns: 25% auto 36%;
    grid-column-gap: 5%
}

@media (max-width:1200px) {
    .main-header__list {
        margin: 0 auto
    }

    .main-footer__wrapper {
        grid-template-columns: 25% auto 42%;
        grid-column-gap: 0
    }
}

@media (max-width:1025px) {
    .main-header__box .main-header__box-phone img {
        max-width: 27px;
        display: block
    }

    .main-header__box-tablet {
        display: grid
    }

    .main-header__box-tablet a {
        padding: 10px 0;
        font-family: ProximaNova-Bold, arial, sans-serif;
        font-size: 24px;
        line-height: 24px;
        text-align: center;
        color: #fff;
        display: block
    }

    .main-header__box-tablet a:active {
        color: #0a3d76
    }

    .main-header__box-tablet .main-header__box-info,
    .main-header__btn--closed {
        display: block
    }

    .main-header__wrap-menu {
        width: 100%;
        height: 100vh;
        position: absolute;
        top: 65px;
        left: 0;
        display: none;
        overflow-y: scroll
    }

    .main-header__wrap-menu--active {
        display: grid;
        z-index: -2;
        background-image: linear-gradient(271.23deg, #a62e41 4.07%, #e13152 96.09%)
    }

    .main-header__btn--closed span {
        position: absolute;
        width: 25px;
        height: 2px;
        top: 14px;
        left: 13px;
        background-color: #333;
        border-radius: 2px;
        overflow: hidden;
        transition: 1s linear
    }

    .main-header__btn--closed span::before {
        content: "";
        position: absolute;
        width: 0;
        top: 0;
        left: 0;
        transition: .7s linear
    }

    .main-header__btn--closed span:first-child {
        -webkit-animation: .5s ease-in-out forwards span-first-off;
        animation: .5s ease-in-out forwards span-first-off
    }

    .main-header__btn--closed span:nth-child(2) {
        -webkit-animation: .5s ease-in-out forwards span-second-off;
        animation: .5s ease-in-out forwards span-second-off
    }

    .main-header__btn--closed span:nth-child(3) {
        -webkit-animation: .5s ease-in-out forwards span-third-off;
        animation: .5s ease-in-out forwards span-third-off
    }

    .main-header__btn--opened {
        display: block
    }

    .main-header__btn--opened span {
        position: absolute;
        width: 25px;
        height: 2px;
        top: 14px;
        left: 13px;
        background-color: #333;
        border-radius: 2px;
        overflow: hidden;
        transition: 1s linear
    }

    .main-header__btn--opened span::before {
        content: '';
        position: absolute;
        width: 0;
        top: 0;
        left: 0;
        transition: .7s linear
    }

    .main-header__btn--opened span:first-child {
        -webkit-animation: .5s ease-in-out forwards span-first-on;
        animation: .5s ease-in-out forwards span-first-on
    }

    .main-header__btn--opened span:nth-child(2) {
        -webkit-animation: .5s ease-in-out forwards span-second-on;
        animation: .5s ease-in-out forwards span-second-on
    }

    .main-header__btn--opened span:nth-child(3) {
        -webkit-animation: .5s ease-in-out forwards span-third-on;
        animation: .5s ease-in-out forwards span-third-on
    }

    .main-footer__wrapper {
        padding: 15px 30px;
        grid-template-columns: 32% 57%;
        align-items: center;
        justify-content: space-between
    }
}

.main-footer__box p {
    padding: 0;
    margin: 0
}

.main-footer__image {
    max-width: 115px
}

@media (max-width:1025px) {
    .main-footer__image {
        max-width: 125px
    }
}

.main-footer__nav {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: 40% 50%;
    grid-template-rows: 35px 30px 30px;
    justify-content: center
}

.main-footer__link-location {
    margin: 0;
    padding-left: 20px;
    color: #000;
    position: relative
}

.main-footer__link-location::before {
    position: absolute;
    left: 0
}

.main-footer__link-mail {
    padding-left: 22px;
    display: block;
    color: #000;
    position: relative
}

.main-footer__link-mail::before {
    width: 16px;
    height: 11px;
    position: absolute;
    content: "";
    top: 7px;
    left: -3px;
    background-image: url("../img/svg/icon-mail.svg");
    background-repeat: no-repeat
}

.main-footer__link-phone {
    padding-left: 20px;
    color: #333
}

.main-footer__link-phone:hover {
    font-weight: 400;
    color: #a62e41
}

.main-footer__phone {
    display: grid;
    position: relative
}

.main-footer__phone::before {
    width: 25px;
    height: 25px;
    position: absolute;
    content: "";
    top: 10px;
    left: -6px;
    background-image: url("../img/svg/icon-mobile.svg");
    background-repeat: no-repeat;
    background-size: 25px
}

.main-footer__phone span {
    color: #0a3d76
}

.main-footer__link-box {
    display: grid;
    grid-template-columns: 275px auto;
    align-items: center
}

.main-footer__link-box .socia-list {
    width: auto;
    min-height: auto;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(24px, auto));
    position: static;
    background-color: transparent;
    box-shadow: none
}

.confidence,
.main-footer--2 .confidence {
    background-color: #0a3d76
}

.advantages__box,
.card-box__box,
.main-footer--2,
.services__nav-box {
    background-color: #f5f9ff
}

.confidence .confidence__text {
    padding: 10px 0;
    display: flex;
    justify-content: space-between
}

.confidence .confidence__text p {
    margin: 0;
    font-size: 14px;
    line-height: 18px;
    color: #fff
}

.confidence .confidence__text a {
    font-size: 14px;
    line-height: 18px;
    color: #fff;
    text-decoration: underline
}

.main-footer--2 .main-footer__wrapper {
    padding: 30px;
    display: grid;
    grid-template-columns: 15% auto 25%;
    grid-column-gap: 5%
}

@media (max-width:1200px) {
    .main-footer--2 .main-footer__wrapper {
        padding: 30px 10px;
        grid-template-columns: 17% auto 28%;
        grid-column-gap: 2%
    }
}

@media (max-width:1025px) {
    .main-footer__nav {
        display: none
    }

    .main-footer__link-phone:hover {
        color: #a62e41;
        font-weight: 800
    }

    .main-footer--2 .main-footer__wrapper {
        padding: 15px 30px;
        grid-template-columns: 190px 290px;
        align-items: center;
        justify-content: space-between
    }
}

.main-footer--2 .main-footer__image {
    max-width: 160px;
    margin: 0 auto 10px
}

.main-footer--2 .main-footer__nav,
.services-wrapper {
    display: flex;
    justify-content: space-between
}

@media (max-width:1025px) {
    .main-footer--2 .main-footer__nav {
        display: none
    }
}

.main-footer--2 .main-footer__nav ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px 0
}

.main-footer--2 .main-footer__contacts {
    display: grid;
    grid-gap: 10px 0
}

@media (max-width:767px) {
    h1 {
        font-size: 24px;
        line-height: 24px
    }

    .h2,
    h2 {
        font-size: 16px;
        line-height: 24px
    }

    body {
        font-size: 16px
    }

    .container {
        padding: 0 15px
    }

    .main-footer__contacts,
    .page-main {
        display: none
    }

    .main {
        background-image: url("../img/svg/bckg-main.svg");
        background-repeat: no-repeat;
        background-size: cover;
        background-attachment: fixed
    }

    .main-header__wrapper {
        grid-gap: 0;
        grid-template-columns: 1fr auto auto
    }

    .main-header__tel {
        width: 320px;
        right: 0;
        justify-items: center
    }

    .main-header__tel a {
        justify-content: center
    }

    .main-header__socia {
        margin-top: 3px
    }

    .main-header__socia ul {
        border-bottom-right-radius: 0
    }

    .main-header__socia .main-header__social-btn::after,
    .main-header__socia .main-header__social-btn::before {
        top: 14px
    }

    .main-header__nav-box {
        grid-gap: 0 20px;
        grid-template-columns: 1fr
    }

    .main-header__box {
        grid-gap: 0 0;
        grid-template-columns: 1fr
    }

    .main-header__box-tablet .main-header__box-info a {
        font-size: 18px;
        line-height: 18px
    }

    .main-header__box-tablet .main-header__box-info a:nth-child(4) {
        font-size: 24px;
        line-height: 24px
    }

    .main-header__services-box {
        display: grid
    }

    .main-header__link-stage,
    .main-header__services {
        width: 64px;
        height: 64px;
        display: grid;
        position: absolute;
        top: 65px;
        left: 0;
        z-index: 2;
        background-color: #f5f9ff;
        box-shadow: 0 2px 4px rgba(0, 0, 0, .2);
        border-bottom-right-radius: 65px
    }

    .main-header__link-stage--closed,
    .main-header__services--closed {
        background-image: url("../img/svg/icon-stage.svg");
        background-repeat: no-repeat;
        background-position: 12px 14px
    }

    .main-header__link-stage--opened,
    .main-header__services--opened {
        background-image: url("../img/svg/icon-stage-active.svg");
        background-repeat: no-repeat;
        background-position: 12px 14px;
        box-shadow: none
    }

    .main-footer__wrapper {
        padding: 10px 15px;
        grid-template-columns: 1fr
    }

    .main-footer__box-image {
        display: grid;
        grid-template-columns: auto 1fr;
        align-items: center;
        grid-column-gap: 4%
    }

    .main-footer__image {
        max-width: 115px
    }

    .confidence .confidence__text {
        flex-direction: column;
        gap: 10px 0
    }

    .main-footer--2 .main-footer__wrapper {
        padding: 10px 15px;
        grid-template-columns: 1fr
    }

    .main-footer--2 .main-footer__image {
        margin: 0
    }

    .main-footer--2 .main-footer__contacts {
        display: none
    }
}

.main-footer--2 .main-footer__contacts ul:first-child {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 10px 0
}

.main-footer--2 .main-footer__link-location {
    margin: 0;
    padding-left: 20px;
    color: #000;
    position: relative
}

.main-footer--2 .main-footer__link-location::before {
    position: absolute;
    left: 0
}

.main-footer--2 .main-footer__link-mail {
    padding-left: 22px;
    color: #000;
    position: relative
}

.main-footer--2 .main-footer__link-mail::before {
    width: 16px;
    height: 11px;
    position: absolute;
    content: "";
    top: 7px;
    left: -3px;
    background-image: url("../img/svg/icon-mail.svg");
    background-repeat: no-repeat
}

.main-footer--2 .main-footer__link-phone {
    padding-left: 20px;
    color: #333
}

.main-footer--2 .main-footer__link-phone:hover {
    font-weight: 400;
    color: #a62e41
}

.main-footer--2 .main-footer__phone {
    display: grid;
    position: relative
}

.main-footer--2 .main-footer__phone::before {
    width: 25px;
    height: 25px;
    position: absolute;
    content: "";
    top: 10px;
    left: -6px;
    background-image: url("../img/svg/icon-mobile.svg");
    background-repeat: no-repeat;
    background-size: 25px
}

.main-footer--2 .main-footer__phone span {
    color: #0a3d76
}

.intro__link-box:hover h2,
.intro__list p strong {
    color: #a62e41
}

.main-footer--2 .main-footer__link-box {
    display: grid;
    grid-template-columns: 275px;
    align-items: center;
    grid-gap: 10px 0
}

.main-footer--2 .main-footer__link-box .socia-list {
    margin-left: 22px;
    padding: 0;
    justify-content: flex-start
}

.main-footer--2 .confidence .confidence__text {
    padding: 10px 0;
    display: flex;
    justify-content: space-between
}

.main-footer--2 .confidence .confidence__text p {
    margin: 0;
    font-size: 14px;
    line-height: 18px;
    color: #fff
}

.main-footer--2 .confidence .confidence__text a {
    font-size: 14px;
    line-height: 18px;
    color: #fff;
    text-decoration: underline
}

.intro__wrapper {
    height: 100vh;
    display: grid;
    align-items: center;
    justify-content: center;
    grid-template-columns: 54% 42%;
    grid-gap: 0 4%
}

@media (max-width:1200px) {
    .intro__wrapper {
        grid-gap: 0 0;
        grid-template-columns: 50% 44%
    }
}

.intro__wrapper .intro__link--tablet {
    display: none
}

.intro__box h1 {
    margin: 0 0 30px;
    font-size: 36px;
    line-height: 54px
}

@media (max-width:1025px) {
    .main-footer--2 .main-footer__contacts ul:first-child {
        display: none
    }

    .main-footer--2 .main-footer__link-phone:hover {
        color: #a62e41;
        font-weight: 800
    }

    .intro__wrapper {
        margin-top: 130px;
        pangbottom: 200px;
        grid-template-columns: 1fr
    }

    .intro__wrapper .intro__link {
        display: none
    }

    .intro__wrapper .intro__link--tablet {
        display: grid
    }

    .intro__box h1 {
        font-size: 30px;
        line-height: 36px;
        max-width: 580px;
        margin: 0 auto;
        text-align: center
    }
}

.intro__list {
    margin: 0;
    padding: 0;
    list-style: none
}

.intro__list .h2,
.intro__list h2 {
    margin-bottom: 5px;
    font-size: 18px;
    line-height: 23px
}

.intro__list p {
    margin: 0
}

.intro__link-box {
    margin-left: 12px;
    display: grid;
    grid-template-columns: 140px 1fr;
    grid-gap: 0 30px;
    align-items: center
}

.intro__link-box img {
    max-width: 140px
}

.intro__link-box:hover {
    color: #333;
    font-weight: 400
}

.intro__box-swiper-wrapper {
    height: 410px;
    position: relative;
    background-image: url("../img/svg/bckg-slide-main.svg");
    background-repeat: no-repeat;
    background-size: contain;
    background-position: bottom
}

.button,
.contacts-btn button {
    background-image: linear-gradient(90deg, #8d2716 5.41%, #c9081f 89.5%)
}

.intro__box-swiper-wrapper .swiper-container {
    position: static;
    height: 160px;
    margin-top: 60px
}

.intro__box-swiper-wrapper .swiper-slide-active .intro__text {
    color: #000;
    -webkit-animation: 1.5s 1s forwards sliderSkew;
    animation: 1.5s 1s forwards sliderSkew
}

.intro__box-swiper-wrapper .swiper-slide-active img {
    -webkit-animation: 1.2s .8s forwards services-icon-show;
    animation: 1.2s .8s forwards services-icon-show;
    opacity: 0
}

.intro__box-swiper-wrapper .swiper-slide-active h2 {
    -webkit-animation: 1.3s 1.2s forwards services-icon-show;
    animation: 1.3s 1.2s forwards services-icon-show;
    opacity: 0
}

.intro__box-swiper-wrapper .swiper-slide-active p {
    -webkit-animation: 1.3s 1.7s forwards services-icon-show;
    animation: 1.3s 1.7s forwards services-icon-show;
    opacity: 0
}

.intro__box-swiper-wrapper .swiper-pagination {
    right: -35px;
    display: flex;
    flex-direction: column;
    align-items: flex-end
}

.intro__box-swiper-wrapper .swiper-pagination-bullet {
    background: #0a3d76;
    opacity: 1;
    width: 12px;
    height: 5px;
    border-radius: 0;
    outline: 0
}

.intro__box-swiper-wrapper .swiper-pagination-bullet:hover {
    background: #a62e41;
    width: 20px
}

.intro__box-swiper-wrapper .swiper-pagination-bullet-active {
    background: #a62e41;
    width: 20px;
    height: 7px
}

@media (max-width:1025px) {
    .intro__box-swiper-wrapper {
        height: 330px;
        margin: 0 auto
    }

    .intro__box-swiper-wrapper .swiper-container {
        margin-top: 0
    }

    .card-box__wrapper {
        padding: 0 100px
    }
}

@media (max-width:767px) {
    .main-footer--2 .confidence .confidence__text {
        flex-direction: column;
        gap: 10px 0
    }

    .intro__wrapper {
        height: auto;
        max-width: 430px;
        padding: 20px 15px 90px
    }

    .intro__wrapper .intro__link--tablet {
        max-width: 200px;
        margin-top: 30px
    }

    .intro__box h1 {
        font-size: 22px;
        line-height: 32px;
        text-align: left
    }

    .intro__box-swiper-wrapper {
        display: none
    }

    .card-box__wrapper {
        max-width: 520px;
        padding: 0 5px
    }
}

.card-box__box {
    position: relative
}

.card-box__inner {
    max-width: 1100px;
    margin: 0 auto 100px 0;
    padding: 50px 100px 30px;
    display: grid;
    align-items: center;
    grid-gap: 0 17%;
    grid-template-columns: 37% 42%;
    position: relative
}

@media (max-width:1200px) {
    .intro__link-box {
        margin-left: 0;
        grid-template-columns: 150px 250px;
        justify-content: center
    }

    .intro__link-box img {
        max-width: 140px
    }

    .card-box__inner {
        padding: 60px 80px 40px;
        grid-template-columns: 44% 400px;
        grid-gap: 0 8%
    }
}

.card__box-text h2 {
    max-width: 300px
}

.advantages__wrapper {
    max-width: 1000px
}

.advantages__wrapper h2,
.services-keys table td:nth-child(2),
.services-keys table td:nth-child(3) {
    text-align: center
}

.advantages__box-list {
    margin: 40px 0 100px;
    display: grid;
    grid-gap: 30px 5%;
    grid-template-columns: repeat(3, 24%);
    justify-content: space-between
}

@media (max-width:1025px) {
    .card-box__inner {
        grid-template-columns: 1fr;
        grid-gap: 20px 0
    }

    .advantages__box-list {
        grid-template-columns: repeat(2, 225px);
        justify-content: center
    }

    .advantages__box:last-child {
        max-width: 225px;
        grid-column: 1/3;
        justify-self: center
    }
}

.advantages__box {
    padding: 30px 15px;
    display: grid;
    grid-template-rows: 100px auto;
    justify-items: center
}

.advantages__box img {
    max-width: 100px;
    display: block;
    text-align: center
}

.advantages__box p {
    margin: 24px 0 0;
    line-height: 18px;
    text-align: center
}

@media (max-width:1025px) {
    .business__wrapper {
        padding: 0 100px
    }
}

@media (max-width:767px) {
    .card-box__inner {
        padding: 80px 15px 60px
    }

    .card__box-text h2 {
        max-width: 225px
    }

    .advantages__box-list {
        grid-template-columns: 77%
    }

    .advantages__box:last-child {
        max-width: 100%;
        grid-column: auto;
        justify-self: normal
    }

    .business__wrapper {
        max-width: 520px;
        padding: 0 5px
    }
}

.business__box {
    display: grid;
    grid-template-columns: 730px auto;
    position: relative
}

.business__box h2 {
    line-height: 31px;
    text-align: center
}

.business__box-info {
    padding: 60px 130px 80px 140px;
    display: grid;
    grid-gap: 100px 0;
    justify-items: center;
    border-right: 2px solid #a62e41
}

@media (max-width:1200px) {
    .business__box {
        grid-template-columns: 610px auto
    }

    .business__box-info {
        padding: 60px 20px 80px 0
    }
}

@media (max-width:1025px) {
    .business__box {
        grid-template-columns: 1fr;
        grid-gap: 30px 0
    }

    .business__box-info {
        grid-gap: 70px 0;
        padding: 60px 0 50px;
        border-right: none;
        border-bottom: 2px solid #a62e41
    }
}

@media (max-width:767px) {
    .business__box h2 {
        line-height: 24px
    }

    .business__box-info {
        grid-gap: 60px 0;
        padding: 60px 15px 50px
    }
}

.business__box-info h2 {
    max-width: 410px
}

.business__box-image {
    display: grid;
    position: relative
}

.box img,
.business__box-image img {
    display: block
}

.business__box-image img:first-child {
    max-width: 405px;
    -webkit-animation: 45s linear infinite rotateRight1;
    animation: 45s linear infinite rotateRight1
}

@media (max-width:1200px) {
    .business__box-image img:first-child {
        max-width: 330px
    }
}

@media (max-width:1025px) {
    .business__box-image img:first-child {
        max-width: 280px
    }
}

@media (max-width:767px) {
    .business__box-image img:first-child {
        max-width: 225px
    }
}

.business__box-image img:nth-child(2) {
    max-width: 240px;
    margin: -280px 0 0 65px
}

@media (max-width:1200px) {
    .business__box-image img:nth-child(2) {
        max-width: 210px;
        margin: -240px 0 0 50px
    }
}

@media (max-width:1025px) {
    .business__box-image img:nth-child(2) {
        max-width: 170px;
        margin: -200px 0 0 45px
    }
}

@media (max-width:767px) {
    .business__box-image img:nth-child(2) {
        max-width: 155px;
        margin: -165px 0 0 25px
    }
}

.business__box-image-tablet,
.business__list--mobile {
    display: none
}

.business__list--mobile li {
    display: grid;
    grid-template-columns: 40px auto;
    grid-gap: 0 15px;
    align-items: center
}

.business__list--mobile p {
    margin: 0;
    font-size: 14px;
    line-height: 18px;
    color: #0a3d76
}

.box__list,
.business__list {
    margin: 0;
    padding: 0;
    list-style: none;
    position: absolute;
    top: 0;
    left: 0
}

@media (max-width:1025px) {
    .business__list {
        left: -20px
    }
}

.business__list li:first-child {
    width: 182px;
    position: absolute;
    top: 340px;
    left: -90px
}

@media (max-width:1200px) {
    .business__list li:first-child {
        top: 280px
    }
}

@media (max-width:1025px) {
    .business__list li:first-child {
        top: 220px
    }
}

@media (max-width:767px) {
    .business__box-image-tablet {
        display: grid
    }

    .business__list {
        left: -5px
    }

    .business__list p {
        font-size: 14px;
        line-height: 18px
    }

    .business__list li:first-child {
        top: 195px;
        left: -75px
    }
}

.business__list li:nth-child(2) {
    width: 182px;
    position: absolute;
    top: 175px;
    left: -120px
}

@media (max-width:1200px) {
    .business__list li:nth-child(2) {
        top: 130px
    }
}

@media (max-width:1025px) {
    .business__list li:nth-child(2) {
        top: 105px;
        left: -100px
    }
}

@media (max-width:767px) {
    .business__list li:nth-child(2) {
        width: 100px;
        top: 80px;
        left: -100px
    }
}

.business__list li:nth-child(3) {
    width: 175px;
    position: absolute;
    top: 10px;
    left: -50px
}

@media (max-width:1200px) {
    .business__list li:nth-child(3) {
        top: 0;
        left: -60px
    }
}

@media (max-width:1025px) {
    .business__list li:nth-child(3) {
        left: -45px
    }
}

@media (max-width:767px) {
    .business__list li:nth-child(3) {
        width: 115px;
        left: -40px;
        top: -5px
    }
}

.business__list li:nth-child(4) {
    width: 175px;
    position: absolute;
    top: -50px;
    left: 225px
}

@media (max-width:1200px) {
    .business__list li:nth-child(4) {
        left: 175px
    }
}

@media (max-width:1025px) {
    .business__list li:nth-child(4) {
        left: 180px
    }
}

@media (max-width:767px) {
    .business__list li:nth-child(4) {
        left: 130px;
        top: -35px
    }
}

.business__list li:nth-child(5) {
    width: 175px;
    position: absolute;
    top: 70px;
    left: 400px
}

@media (max-width:1200px) {
    .business__list li:nth-child(5) {
        left: 325px
    }
}

@media (max-width:1025px) {
    .business__list li:nth-child(5) {
        top: 40px;
        left: 290px
    }
}

@media (max-width:767px) {
    .business__list li:nth-child(5) {
        width: 125px;
        left: 225px;
        top: 38px
    }
}

.business__list li:nth-child(6) {
    width: 175px;
    position: absolute;
    top: 280px;
    left: 400px
}

@media (max-width:1200px) {
    .business__list li:nth-child(6) {
        top: 250px;
        left: 310px
    }
}

@media (max-width:1025px) {
    .business__list li:nth-child(6) {
        top: 210px;
        left: 285px
    }
}

@media (max-width:767px) {
    .business__list li:nth-child(6) {
        width: 100px;
        top: 165px;
        left: 220px
    }
}

.business__list li:nth-child(7) {
    width: 175px;
    position: absolute;
    top: 410px;
    left: 240px
}

@media (max-width:1200px) {
    .business__list li:nth-child(7) {
        top: 330px;
        left: 190px
    }
}

@media (max-width:1025px) {
    .business__list li:nth-child(7) {
        top: 280px;
        left: 170px
    }
}

@media (max-width:767px) {
    .business__list li:nth-child(7) {
        top: 230px;
        left: 115px
    }
}

.business__list p {
    font-size: 16px;
    margin: 0;
    color: #0a3d76
}

.business__box-form {
    display: grid;
    grid-gap: 30px 0;
    align-self: center
}

.business__box-form form {
    max-width: 330px;
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-gap: 30px 0
}

@media (max-width:1200px) {
    .business__box-form form {
        max-width: 270px
    }

    .about-us__image {
        max-width: 580px
    }
}

@media (max-width:1025px) {
    .business__box-form form {
        max-width: 100%;
        padding: 0 110px 50px
    }
}

.business__box-form input,
.business__box-form textarea {
    width: 100%;
    padding: 0;
    background-color: transparent;
    outline: 0
}

.business__box-form label {
    position: absolute;
    top: -5px;
    left: 0;
    cursor: text;
    transition: .3s linear;
    color: #0a3d76
}

.business__box-form input {
    border: none;
    border-bottom: 1px solid #0a3d76
}

.business__box-form input:required~label::after {
    position: absolute;
    content: "*";
    top: 0;
    right: -8px
}

.business__box-form input.not-empty~label,
.business__box-form input:focus~label {
    font-size: 15px;
    transform: translateY(-15px);
    transition: .3s linear
}

.business__box-form textarea {
    min-height: 100px;
    margin: 0;
    border: none;
    border-bottom: 1px solid #0a3d76;
    transition: .3s linear;
    resize: none
}

.business__box-form textarea.not-empty+label,
.business__box-form textarea:focus+label {
    font-size: 15px;
    transform: translateY(-15px);
    transition: .3s linear
}

.about-us {
    margin-top: 95px
}

.about-us .breadcrumbs,
.article__inner .breadcrumbs,
.blog .breadcrumbs,
.contacts .breadcrumbs {
    margin-left: 0
}

.about-us__box {
    display: grid;
    grid-template-columns: 40% 1fr;
    align-items: center;
    justify-items: center
}

.about-us__box p {
    margin: 0 0 15px
}

.about-us__box-text h4 {
    margin: 0 0 20px;
    font-size: 24px;
    line-height: 36px;
    color: #a62e41
}

.about-us__box-text p strong {
    font-size: 17px;
    line-height: 17px;
    color: #0a3d76
}

.about-us__box-text strong {
    font-size: 24px;
    line-height: 36px;
    color: #a62e41
}

@media (max-width:1025px) {
    .about-us__box {
        grid-template-columns: 1fr
    }

    .about-us__box-text {
        padding: 0 90px
    }
}

.about-us__image {
    position: relative
}

.about-us__nav-list {
    margin: 0;
    padding: 0;
    list-style: none;
    width: 50%;
    height: 95px;
    position: absolute
}

.about-us__nav-list li {
    position: absolute
}

.about-us__nav-list li:nth-child(6) {
    left: 200px;
    top: -45px
}

.about-us__nav-list li:nth-child(7) {
    right: 62px;
    top: -30px
}

.about-us__nav-list li:nth-child(8) {
    top: 0;
    right: 65px
}

.about-us__nav-list li:nth-child(9) {
    top: 45px;
    right: 27px
}

.about-us__nav-list li:nth-child(10) {
    top: 85px;
    right: 45px
}

.about-us__nav-list a {
    max-width: 100px;
    font-size: 12px;
    line-height: 12px;
    letter-spacing: .05em;
    text-align: center;
    position: absolute
}

.benefit__wrapper article p,
.box,
.map,
.teams__box--mans .teams__katerina,
.teams__box-text a,
.teams__image,
.teams__image--marketing {
    position: relative
}

@media (max-width:1200px) {
    .about-us__nav-list li:first-child {
        left: 11px;
        top: 53px
    }

    .about-us__nav-list li:nth-child(2) {
        left: 20px;
        top: 17px
    }

    .about-us__nav-list li:nth-child(3) {
        left: 5px;
        top: -27px
    }

    .about-us__nav-list li:nth-child(4) {
        top: -44px;
        left: 55px
    }

    .about-us__nav-list li:nth-child(5) {
        top: -62px;
        left: 95px
    }

    .about-us__nav-list li:nth-child(6) {
        left: 160px;
        top: -41px
    }

    .about-us__nav-list li:nth-child(7) {
        right: 54px;
        top: -25px
    }

    .about-us__nav-list li:nth-child(8) {
        right: 60px
    }

    .about-us__nav-list li:nth-child(9) {
        top: 47px;
        right: 28px
    }

    .about-us__nav-list li:nth-child(10) {
        top: 72px;
        right: 40px
    }

    .about-us__nav-list a {
        font-size: 11px
    }
}

@media (max-width:1025px) {
    .about-us__image {
        max-width: 710px;
        grid-row: 1;
        margin: 0 auto
    }

    .about-us__nav-list li:first-child {
        left: 20px;
        top: 67px
    }

    .about-us__nav-list li:nth-child(2) {
        top: 21px;
        left: 27px
    }

    .about-us__nav-list li:nth-child(3) {
        left: 15px;
        top: -28px
    }

    .about-us__nav-list li:nth-child(4) {
        top: -50px;
        left: 70px
    }

    .about-us__nav-list li:nth-child(5) {
        top: -72px;
        left: 124px
    }

    .about-us__nav-list li:nth-child(6) {
        top: -46px;
        left: 197px
    }

    .about-us__nav-list li:nth-child(7) {
        right: 65px
    }

    .about-us__nav-list li:nth-child(10) {
        top: 90px;
        right: 48px
    }

    .about-us__nav-list a {
        font-size: 12px
    }

    .benefit__wrapper {
        padding: 0 120px
    }
}

.benefit__wrapper h2 {
    margin: 40px 0 30px;
    text-align: center
}

.benefit__wrapper article p {
    margin: 0 0 5px;
    padding-left: 20px
}

.benefit__wrapper article p::before {
    width: 10px;
    height: 2px;
    position: absolute;
    content: "";
    top: 10px;
    left: 0;
    background-color: #a62e41
}

.benefit__wrapper .benefit__box {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: 0 40px
}

.teams {
    margin-bottom: 70px
}

.teams__wrapper h2 {
    text-align: center
}

.teams__wrapper h3 {
    margin-bottom: 10px;
    font-family: Mistral, arial, sans-serif;
    font-size: 48px;
    line-height: 48px;
    font-weight: 400
}

.teams__box {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    grid-column-gap: 6%
}

.teams__box--mans {
    grid-template-columns: 1fr
}

.teams__box--mans .teams__box-text {
    margin-bottom: -154px;
    max-width: 400px;
    justify-self: flex-end
}

@media (max-width:1025px) {

    .benefit__wrapper .benefit__box,
    .teams__box {
        grid-template-columns: 1fr
    }

    .teams__wrapper {
        display: grid;
        grid-row-gap: 30px
    }

    .teams__wrapper h2 {
        margin: 60px 0 0
    }

    .teams__box--mans .teams__box-text {
        margin: 0;
        padding: 0 90px;
        max-width: 100%;
        justify-self: flex-start
    }

    .teams__box--mans .teams__box-text:first-child {
        display: none
    }
}

.teams__box--mans .teams__image-svg-animate {
    margin-top: -240px;
    display: grid;
    grid-template-columns: 27% 49% auto;
    position: relative
}

@media (max-width:1200px) {
    .teams__box--mans .teams__image-svg-animate {
        margin-top: -200px
    }
}

@media (max-width:1025px) {
    .teams__box--mans .teams__image-svg-animate {
        max-width: 600px;
        margin: -130px auto 0;
        grid-template-columns: 27% 62%
    }
}

.teams__box--mans .teams__image-svg-animate img:first-child {
    max-width: 280px;
    margin-top: 30px
}

.teams__box--mans .teams__image-svg-animate img:nth-child(2) {
    width: 215px;
    height: 135px;
    position: absolute;
    top: 138px;
    left: 55px;
    -webkit-animation: 2s ease-in-out infinite alternate rotateKaterina;
    animation: 2s ease-in-out infinite alternate rotateKaterina
}

@media (max-width:1200px) {
    .teams__box--mans .teams__image-svg-animate img:first-child {
        max-width: 260px
    }

    .teams__box--mans .teams__image-svg-animate img:nth-child(2) {
        width: 204px;
        height: 124px;
        top: 131px;
        left: 51px
    }
}

@media (max-width:1025px) {
    .teams__box--mans .teams__image-svg-animate img:first-child {
        max-width: 300px
    }

    .teams__box--mans .teams__image-svg-animate img:nth-child(2) {
        width: 126px;
        height: 76px;
        top: 93px;
        left: 32px
    }
}

.teams__box--mans .teams__katerina img:first-child {
    max-width: 100%
}

.teams__box--mans .teams__katerina img:last-child {
    width: 90px;
    height: 155px;
    position: absolute;
    top: 24.5%;
    left: 70%;
    -webkit-animation: 2s ease-in-out infinite alternate rotateKaterina;
    animation: 2s ease-in-out infinite alternate rotateKaterina
}

@media (max-width:1200px) {
    .teams__box--mans .teams__katerina img:last-child {
        top: 25%;
        left: 69%
    }
}

.teams__box-text a::after,
.teams__box-text a:hover::after {
    width: 24px;
    height: 24px;
    background-repeat: no-repeat;
    transition: .2s linear;
    position: absolute;
    content: ""
}

@media (max-width:1025px) {
    .teams__box--mans .teams__katerina img:first-child {
        max-width: 320px
    }

    .teams__box--mans .teams__katerina img:last-child {
        width: 55px;
        height: 90px;
        top: 27.5%;
        left: 60%
    }

    .teams__box-text {
        padding: 0 90px
    }
}

@media (max-width:767px) {
    .business__box-form form {
        padding: 0 15px 70px
    }

    .about-us__box p {
        margin-bottom: 15px
    }

    .about-us__box-text h4 {
        font-size: 18px;
        line-height: 21px
    }

    .about-us__box-text strong {
        font-size: 20px;
        line-height: 24px
    }

    .about-us__box-text,
    .teams__box--mans .teams__box-text {
        padding: 0
    }

    .about-us__nav-list,
    .teams__box--mans .teams__image-svg-animate,
    .teams__image--marketing img:first-child {
        display: none
    }

    .benefit__wrapper {
        padding: 0 15px
    }

    .teams {
        margin-bottom: 40px
    }

    .teams__wrapper h3 {
        font-size: 36px;
        line-height: 36px;
        text-align: center
    }

    .teams__box-text {
        padding: 15px 0 0
    }
}

.teams__box-text p {
    margin: 0
}

.teams__box-text a {
    margin-top: 5px;
    font-weight: 800;
    color: #0a3d76;
    padding-right: 35px;
    display: inline-block
}

.services__box-text .services__data-text p strong,
.teams__box-text a:hover {
    color: #a62e41
}

.teams__box-text a::after {
    top: 0;
    right: 10px;
    background-image: url("../img/svg/next-icon-blue.svg")
}

.teams__box-text a:hover::after {
    top: 0;
    right: 5px;
    background-image: url("../img/svg/next-icon-red.svg")
}

.teams__box-text--tablet {
    padding: 0;
    display: none
}

.teams__box-text--animate {
    margin: 70px 0 0 10px;
    align-self: center
}

.teams__image {
    z-index: -1
}

.teams__image--marketing img:first-child {
    margin-left: -80px
}

.teams__image--marketing img:nth-child(2) {
    width: 200px;
    height: 97px;
    position: absolute;
    top: 0;
    right: 100px;
    -webkit-animation: 2s ease-in-out infinite alternate teams-svg-top;
    animation: 2s ease-in-out infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--marketing img:nth-child(2) {
        width: 160px;
        top: -10px
    }

    .teams__image--marketing img:nth-child(3) {
        max-width: 160px
    }
}

@media (max-width:1025px) {
    .teams__box-text--tablet {
        display: block
    }

    .teams__box-text--tablet h3 {
        margin-top: 20px
    }

    .teams__box-text--animate {
        display: none
    }

    .teams__image {
        max-width: 500px;
        margin: 0 auto
    }

    .teams__image:nth-child(2n) {
        grid-row: 1
    }

    .teams__image--box {
        max-width: 600px
    }

    .teams__image--marketing {
        grid-row: 1
    }

    .teams__image--marketing img:first-child {
        margin-left: 0
    }

    .teams__image--marketing img:nth-child(2) {
        right: 40px
    }
}

.teams__image--marketing img:nth-child(3) {
    width: 200px;
    height: 97px;
    position: absolute;
    top: 116px;
    right: 30px;
    -webkit-animation: 2s ease-in-out .8s infinite alternate teams-svg-top;
    animation: 2s ease-in-out .8s infinite alternate teams-svg-top
}

@media (max-width:1025px) {
    .teams__image--marketing img:nth-child(3) {
        right: -10px
    }
}

.teams__image--marketing img:nth-child(4) {
    width: 200px;
    height: 97px;
    position: absolute;
    top: 240px;
    right: 0;
    -webkit-animation: 2s ease-in-out 1.2s infinite alternate teams-svg-top;
    animation: 2s ease-in-out 1.2s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--marketing img:nth-child(4) {
        width: 160px
    }
}

.teams__image--designers img:nth-child(9),
.teams__image--marketing img:nth-child(5) {
    display: none
}

@media (max-width:1025px) {
    .teams__image--marketing img:nth-child(4) {
        right: -40px
    }

    .teams__image--designers {
        margin-top: 110px
    }
}

.teams__image--designers img:nth-child(2) {
    width: 30px;
    height: 38px;
    position: absolute;
    top: 38%;
    left: 0;
    -webkit-animation: 1.4s ease-in-out infinite alternate teams-svg-top;
    animation: 1.4s ease-in-out infinite alternate teams-svg-top
}

.teams__image--designers img:nth-child(3) {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 10%;
    left: -15px;
    -webkit-animation: 1.5s ease-in-out .5s infinite alternate teams-svg-top;
    animation: 1.5s ease-in-out .5s infinite alternate teams-svg-top
}

.teams__image--designers img:nth-child(4) {
    width: 40px;
    height: 40px;
    position: absolute;
    top: -30px;
    left: 16%;
    -webkit-animation: 1.5s ease-in-out .8s infinite alternate teams-svg-top;
    animation: 1.5s ease-in-out .8s infinite alternate teams-svg-top
}

.teams__image--designers img:nth-child(5) {
    width: 36px;
    height: 36px;
    position: absolute;
    top: 0;
    right: 5%;
    -webkit-animation: 1.5s ease-in-out 1.2s infinite alternate teams-svg-top;
    animation: 1.5s ease-in-out 1.2s infinite alternate teams-svg-top
}

.teams__image--designers img:nth-child(6) {
    width: 50px;
    height: 45px;
    position: absolute;
    top: 31%;
    right: 0;
    -webkit-animation: 2s ease-in-out 1.5s infinite alternate teams-svg-top;
    animation: 2s ease-in-out 1.5s infinite alternate teams-svg-top
}

.teams__image--designers img:nth-child(7) {
    width: 115px;
    height: 85px;
    position: absolute;
    top: -15%;
    right: 44%;
    -webkit-animation: 2s ease-in-out 1.1s infinite alternate teams-svg-top;
    animation: 2s ease-in-out 1.1s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--designers img:nth-child(7) {
        top: -17%;
        right: 44%
    }
}

.teams__image--designers img:nth-child(8) {
    width: 70px;
    height: 80px;
    position: absolute;
    top: -23%;
    right: 18%;
    -webkit-animation: 2s ease-in-out 1.4s infinite alternate teams-svg-top;
    animation: 2s ease-in-out 1.4s infinite alternate teams-svg-top
}

@media (max-width:767px) {

    .teams__image--marketing img:nth-child(2),
    .teams__image--marketing img:nth-child(3),
    .teams__image--marketing img:nth-child(4) {
        display: none
    }

    .teams__image--marketing img:nth-child(5) {
        display: grid
    }

    .teams__image--designers {
        margin-top: auto
    }

    .teams__image--designers img:first-child,
    .teams__image--designers img:nth-child(2),
    .teams__image--designers img:nth-child(3),
    .teams__image--designers img:nth-child(4),
    .teams__image--designers img:nth-child(5),
    .teams__image--designers img:nth-child(6),
    .teams__image--designers img:nth-child(7),
    .teams__image--designers img:nth-child(8) {
        display: none
    }

    .teams__image--designers img:nth-child(9) {
        display: grid
    }

    .teams__image--developers img {
        display: none
    }
}

@media (max-width:1200px) {
    .teams__image--designers img:nth-child(8) {
        top: -25%
    }

    .teams__image--developers img:first-child {
        max-width: 480px
    }
}

.teams__image--developers img:nth-child(2) {
    width: 110px;
    height: 20px;
    position: absolute;
    top: 210px;
    left: -30px;
    -webkit-animation: 2s ease-in-out .5s infinite alternate teams-svg-developers;
    animation: 2s ease-in-out .5s infinite alternate teams-svg-developers
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(2) {
        width: 100px;
        height: 17px;
        left: -45px
    }
}

.teams__image--developers img:nth-child(3) {
    width: 60px;
    height: 45px;
    position: absolute;
    top: 100px;
    left: 60px;
    -webkit-animation: 2.3s ease-in-out .3s infinite alternate teams-svg-top;
    animation: 2.3s ease-in-out .3s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(3) {
        width: 50px;
        height: 45px;
        left: 10px
    }
}

.teams__image--developers img:nth-child(4) {
    width: 125px;
    height: 35px;
    position: absolute;
    top: 0;
    left: 110px;
    -webkit-animation: 2s ease-in-out infinite alternate teams-svg-top;
    animation: 2s ease-in-out infinite alternate teams-svg-top
}

.teams__image--developers img:nth-child(5),
.teams__image--operators img:nth-child(3) {
    -webkit-animation: 2s ease-in-out .5s infinite alternate teams-svg-top;
    position: absolute
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(4) {
        width: 110px;
        height: 30px;
        top: -10px;
        left: 70px
    }
}

.teams__image--developers img:nth-child(5) {
    width: 55px;
    height: 65px;
    top: 45px;
    left: 175px;
    animation: 2s ease-in-out .5s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(5) {
        width: 50px;
        height: 55px;
        top: 33px;
        left: 105px
    }
}

@media (max-width:1025px) {
    .teams__image--developers img:nth-child(5) {
        top: 40px
    }
}

.teams__image--developers img:nth-child(6) {
    width: 45px;
    height: 35px;
    position: absolute;
    top: 80px;
    left: 360px;
    -webkit-animation: 1.7s ease-in-out .3s infinite alternate teams-svg-top;
    animation: 1.7s ease-in-out .3s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(6) {
        top: 65px;
        left: 300px
    }
}

.teams__image--developers img:nth-child(7) {
    width: 110px;
    height: 30px;
    position: absolute;
    top: 20px;
    left: 360px;
    -webkit-animation: 1.8s ease-in-out infinite alternate teams-svg-top;
    animation: 1.8s ease-in-out infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(7) {
        top: 15px;
        left: 300px
    }
}

@media (max-height:1025px) {
    .teams__image--developers img:nth-child(7) {
        top: 5px
    }
}

.teams__image--developers img:nth-child(8) {
    width: 50px;
    height: 40px;
    position: absolute;
    top: 110px;
    left: 470px;
    -webkit-animation: 1.8s ease-in-out .5s infinite alternate teams-svg-top;
    animation: 1.8s ease-in-out .5s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(8) {
        left: 425px
    }
}

.teams__image--developers img:nth-child(9) {
    width: 50px;
    height: 40px;
    position: absolute;
    top: 215px;
    left: 500px;
    -webkit-animation: 2s ease-in-out .3s infinite alternate teams-svg-top;
    animation: 2s ease-in-out .3s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--developers img:nth-child(9) {
        left: 440px
    }
}

.teams__image--developers img:last-child,
.teams__image--seo img:nth-child(7) {
    display: none
}

@media (max-width:1025px) {
    .teams__image--developers img:nth-child(9) {
        left: 455px
    }

    .teams__image--seo {
        margin-top: 85px
    }
}

.teams__image--seo img:nth-child(2) {
    width: 42px;
    height: 42px;
    position: absolute;
    top: 50%;
    left: 15%;
    -webkit-animation: 1.4s ease-in-out infinite alternate teams-svg-top;
    animation: 1.4s ease-in-out infinite alternate teams-svg-top
}

.teams__image--seo img:nth-child(3) {
    width: 62px;
    height: 53px;
    position: absolute;
    top: -3%;
    left: 3%;
    -webkit-animation: 2.1s ease-in-out .3s infinite alternate teams-svg-top;
    animation: 2.1s ease-in-out .3s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--seo img:nth-child(3) {
        width: 58px;
        height: 48px
    }
}

.teams__image--seo img:nth-child(4) {
    width: 75px;
    height: 75px;
    position: absolute;
    top: -22%;
    left: 33%;
    -webkit-animation: 2.4s ease-in-out .6s infinite alternate teams-svg-top;
    animation: 2.4s ease-in-out .6s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--seo img:nth-child(4) {
        width: 70px;
        height: 70px;
        top: -22%
    }
}

.teams__image--seo img:nth-child(5) {
    width: 65px;
    height: 80px;
    position: absolute;
    top: -27%;
    left: 65%;
    -webkit-animation: 2.5s ease-in-out 1s infinite alternate teams-svg-top;
    animation: 2.5s ease-in-out 1s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--seo img:nth-child(5) {
        width: 60px;
        height: 75px;
        top: -28%
    }
}

.teams__image--seo img:nth-child(6) {
    width: 61px;
    height: 78px;
    position: absolute;
    top: 29%;
    left: 16%;
    -webkit-animation: 1.7s ease-in-out infinite alternate rotateSeo;
    animation: 1.7s ease-in-out infinite alternate rotateSeo
}

@media (max-width:1200px) {
    .teams__image--seo img:nth-child(6) {
        width: 50px;
        height: 65px;
        top: 29%;
        left: 16%
    }
}

@media (max-width:767px) {
    .teams__image--developers img:last-child {
        display: block
    }

    .teams__image--seo {
        margin-top: auto
    }

    .teams__image--seo img {
        display: none
    }

    .teams__image--seo img:nth-child(7) {
        display: grid
    }
}

@media (max-width:1025px) {
    .teams__image--seo img:nth-child(6) {
        top: 29.5%;
        left: 17%
    }

    .teams__image--context {
        margin-top: 110px
    }
}

.teams__image--context img:first-child {
    margin-top: 100px
}

.teams__image--context img:nth-child(2) {
    width: 70px;
    height: 70px;
    position: absolute;
    top: 11%;
    left: 0;
    -webkit-animation: 2s ease-in-out infinite alternate teams-svg-top;
    animation: 2s ease-in-out infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--context img:nth-child(2) {
        width: 65px;
        height: 65px;
        top: 40px
    }
}

@media (max-width:1025px) {
    .teams__image--context img:first-child {
        margin-top: 0
    }

    .teams__image--context img:nth-child(2) {
        top: 0
    }
}

.teams__image--context img:nth-child(3) {
    width: 75px;
    height: 90px;
    position: absolute;
    top: -6%;
    left: 30%;
    -webkit-animation: 2s ease-in-out .3s infinite alternate teams-svg-top;
    animation: 2s ease-in-out .3s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--context img:nth-child(3) {
        width: 70px;
        height: 85px;
        top: -5%
    }
}

@media (max-width:1025px) {
    .teams__image--context img:nth-child(3) {
        top: -25%
    }
}

.teams__image--context img:nth-child(4) {
    width: 75px;
    height: 90px;
    position: absolute;
    top: 2%;
    right: 18%;
    -webkit-animation: 2s ease-in-out .6s infinite alternate teams-svg-top;
    animation: 2s ease-in-out .6s infinite alternate teams-svg-top
}

@media (max-width:1200px) {
    .teams__image--context img:nth-child(4) {
        width: 70px;
        height: 85px;
        top: 0
    }
}

@media (max-width:1025px) {
    .teams__image--context img:nth-child(4) {
        top: -16%
    }
}

.teams__image--context img:nth-child(5) {
    width: 55px;
    height: 55px;
    position: absolute;
    top: 30%;
    right: 9%;
    -webkit-animation: 2s ease-in-out 1s infinite alternate teams-svg-top;
    animation: 2s ease-in-out 1s infinite alternate teams-svg-top
}

@media (max-width:1025px) {
    .teams__image--context img:nth-child(5) {
        top: 12%
    }
}

.teams__image--context img:nth-child(6),
.teams__image--operators img:nth-child(4),
.teams__image--smm img:last-child {
    display: none
}

.teams__image--operators img:nth-child(3) {
    width: 135px;
    height: 105px;
    top: 30%;
    right: 29%;
    animation: 2s ease-in-out .5s infinite alternate teams-svg-top
}

@media (max-width:1025px) {
    .teams__image--operators img:nth-child(3) {
        width: 77px;
        height: 80px;
        top: 25%
    }
}

@media (max-width:767px) {
    .teams__image--context {
        margin-top: 0
    }

    .teams__image--context img {
        display: none
    }

    .teams__image--context img:nth-child(6) {
        display: grid
    }

    .teams__image--operators img {
        display: none
    }

    .teams__image--operators img:nth-child(4) {
        display: grid
    }
}

.teams__image--operators .teams__image-quadrocopter {
    width: 125px;
    height: 87px;
    position: absolute;
    top: 22%;
    left: 25%;
    -webkit-animation: 2s ease-in-out .5s infinite alternate teams-svg-top;
    animation: 2s ease-in-out .5s infinite alternate teams-svg-top
}

.teams__image--operators .teams__image-quadrocopter img {
    width: 125px;
    height: 87px;
    position: absolute;
    top: 0;
    left: 0;
    -webkit-animation: 2s ease-in-out infinite alternate forwards rotateQuadrocopter;
    animation: 2s ease-in-out infinite alternate forwards rotateQuadrocopter
}

@media (max-width:1025px) {
    .teams__image--operators .teams__image-quadrocopter img {
        width: 80px;
        height: 60px
    }

    .teams__image--smm {
        margin: 100px auto 0 20%
    }
}

.teams__image--smm img:first-child {
    margin-top: 70px;
    max-width: 340px
}

.teams__image--smm img:nth-child(2) {
    width: 440px;
    height: 340px;
    position: absolute;
    top: -30%;
    left: 20px;
    -webkit-animation: 2s ease-in-out .5s infinite alternate teams-svg-smm;
    animation: 2s ease-in-out .5s infinite alternate teams-svg-smm
}

@media (max-width:1200px) {
    .teams__image--smm img:first-child {
        margin-top: 65px
    }

    .teams__image--smm img:nth-child(2) {
        top: -160px
    }
}

.teams__image--smm img:nth-child(3) {
    width: 72px;
    height: 72px;
    position: absolute;
    top: 65px;
    left: 30px;
    -webkit-animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale4;
    animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale4;
    opacity: 0
}

@media (max-width:1200px) {
    .teams__image--smm img:nth-child(3) {
        top: 60px
    }
}

.teams__image--smm img:nth-child(4) {
    width: 100px;
    height: 100px;
    position: absolute;
    top: -56px;
    left: 30px;
    -webkit-animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale;
    animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale;
    opacity: 0
}

@media (max-width:1200px) {
    .teams__image--smm img:nth-child(4) {
        top: -60px
    }
}

.teams__image--smm img:nth-child(5) {
    width: 72px;
    height: 72px;
    position: absolute;
    top: -50px;
    left: 155px;
    -webkit-animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale3;
    animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale3;
    opacity: 0
}

.teams__image--smm img:nth-child(6),
.teams__image--smm img:nth-child(8) {
    -webkit-animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale;
    position: absolute;
    opacity: 0
}

@media (max-width:1200px) {
    .teams__image--smm img:nth-child(5) {
        top: -60px
    }
}

.teams__image--smm img:nth-child(6) {
    width: 90px;
    height: 90px;
    top: -90px;
    left: 270px;
    animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale
}

@media (max-width:1200px) {
    .teams__image--smm img:nth-child(6) {
        top: -100px
    }
}

.teams__image--smm img:nth-child(7) {
    width: 74px;
    height: 74px;
    position: absolute;
    top: 15px;
    left: 275px;
    -webkit-animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale3;
    animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale3;
    opacity: 0
}

@media (max-width:1200px) {
    .teams__image--smm img:nth-child(7) {
        top: 12px
    }
}

.teams__image--smm img:nth-child(8) {
    width: 73px;
    height: 71px;
    top: 25px;
    left: 395px;
    animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale
}

@media (max-width:1200px) {
    .teams__image--smm img:nth-child(8) {
        top: 20px
    }
}

.teams__image--smm img:nth-child(9) {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 75px;
    left: 310px;
    -webkit-animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale;
    animation: 1s linear forwards show, 1.7s ease-in-out infinite alternate forwards scale;
    opacity: 0
}

.teams__image--row {
    grid-row: 1
}

@media (max-width:1025px) {
    .teams__image--row {
        grid-row: auto
    }

    .box {
        max-width: 450px;
        margin: 0 auto;
        grid-row: 1;
        display: grid;
        justify-content: center
    }

    .box img {
        max-width: 410px
    }
}

@media (max-width:767px) {
    .teams__image--smm {
        margin: 0 auto
    }

    .teams__image--smm img {
        display: none
    }

    .teams__image--smm img:last-child {
        display: block
    }

    .box {
        max-width: 345px
    }
}

.box__link {
    font-size: 14px;
    line-height: 14px;
    text-align: center
}

@media (max-width:767px) {
    .box__link {
        font-size: 12px;
        line-height: 12px
    }
}

.box__link--design {
    position: absolute;
    top: 170px;
    left: -15px
}

@media (max-width:1200px) {
    .teams__image--smm img:nth-child(9) {
        top: 85px
    }

    .box__link--design {
        top: 180px
    }
}

@media (max-width:1025px) {
    .box__link--design {
        top: 185px
    }
}

@media (max-width:767px) {
    .box__link--design {
        top: 160px;
        left: -20px
    }
}

@media (max-width:480px) {

    .business__wrapper,
    .card-box__wrapper {
        max-width: 375px
    }

    .business__box-info {
        grid-gap: 30px 0
    }

    .business__box-image {
        display: none
    }

    .business__box-image img:first-child {
        max-width: 165px
    }

    .business__box-image img:nth-child(2) {
        max-width: 115px;
        margin: -118px 0 0 17px
    }

    .business__list--mobile {
        margin: 0;
        padding: 0;
        list-style: none;
        display: grid
    }

    .business__list li:first-child {
        width: 100px;
        top: 150px;
        left: -55px
    }

    .business__list li:nth-child(2) {
        width: 90px;
        top: 55px;
        left: -62px
    }

    .business__list li:nth-child(3) {
        left: -55px;
        top: -12px
    }

    .business__list li:nth-child(4) {
        width: 85px;
        left: 100px;
        top: -55px
    }

    .business__list li:nth-child(5) {
        width: 65px;
        left: 175px;
        top: 15px
    }

    .business__list li:nth-child(6) {
        width: 65px;
        top: 117px;
        left: 167px
    }

    .business__list li:nth-child(7) {
        width: 85px;
        top: 167px;
        left: 90px
    }

    .teams__box--mans .teams__image-svg-animate {
        margin-top: -70px;
        grid-template-columns: 31% 57%
    }

    .box {
        max-width: 230px
    }

    .box__link {
        font-size: 11px;
        line-height: 11px
    }

    .box__link--design {
        top: 105px
    }
}

.box__link--seo {
    position: absolute;
    top: 110px;
    left: -10px
}

@media (max-width:1200px) {
    .box__link--seo {
        top: 115px
    }
}

@media (max-width:1025px) {
    .box__link--seo {
        top: 120px
    }
}

@media (max-width:767px) {
    .box__link--seo {
        top: 102px;
        left: -20px
    }
}

@media (max-width:480px) {
    .box__link--seo {
        top: 65px;
        left: -10px
    }
}

.box__link--sales {
    position: absolute;
    top: 40px;
    left: -15px
}

@media (max-width:1200px) {
    .box__link--sales {
        top: 44px
    }
}

@media (max-width:1025px) {
    .box__link--sales {
        top: 45px
    }
}

@media (max-width:767px) {
    .box__link--sales {
        top: 40px;
        left: -20px
    }
}

@media (max-width:480px) {
    .box__link--sales {
        top: 23px;
        left: -20px
    }
}

.box__link--context {
    position: absolute;
    top: 15px;
    left: 50px
}

@media (max-width:1200px) {
    .box__link--context {
        top: 20px
    }
}

@media (max-width:1025px) {
    .box__link--context {
        top: 15px;
        left: 60px
    }
}

@media (max-width:767px) {
    .box__link--context {
        top: 15px;
        left: 40px
    }
}

@media (max-width:480px) {
    .box__link--context {
        top: 5px;
        left: 20px
    }
}

.box__link--marketing {
    position: absolute;
    top: -20px;
    left: 120px
}

@media (max-width:1200px) {
    .box__link--marketing {
        left: 140px
    }
}

@media (max-width:767px) {
    .box__link--marketing {
        top: -15px;
        left: 110px
    }
}

@media (max-width:480px) {
    .box__link--marketing {
        top: -15px;
        left: 65px
    }
}

.box__link--analytics {
    position: absolute;
    top: 15px;
    left: 215px
}

@media (max-width:1200px) {
    .box__link--analytics {
        top: 20px;
        left: 230px
    }
}

@media (max-width:1025px) {
    .box__link--analytics {
        top: 20px;
        left: 240px
    }
}

@media (max-width:767px) {
    .box__link--analytics {
        top: 20px;
        left: 195px
    }
}

@media (max-width:480px) {
    .box__link--analytics {
        top: 5px;
        left: 125px
    }
}

.box__link--social {
    position: absolute;
    top: 40px;
    left: 335px
}

@media (max-width:1200px) {
    .box__link--social {
        left: 355px;
        top: 35px
    }
}

@media (max-width:1025px) {
    .box__link--social {
        left: 350px;
        top: 35px
    }
}

@media (max-width:767px) {
    .box__link--social {
        top: 35px;
        left: 300px
    }
}

@media (max-width:480px) {
    .box__link--social {
        top: 17px;
        left: 200px
    }
}

.box__link--strategy {
    position: absolute;
    top: 95px;
    left: 365px
}

@media (max-width:1200px) {
    .box__link--strategy {
        left: 375px;
        top: 86px
    }
}

@media (max-width:1025px) {
    .box__link--strategy {
        left: 365px;
        top: 90px
    }
}

@media (max-width:767px) {
    .box__link--strategy {
        top: 75px;
        left: 310px
    }
}

@media (max-width:480px) {
    .box__link--strategy {
        top: 47px;
        left: 200px
    }
}

.box__link--crm {
    position: absolute;
    top: 145px;
    left: 385px
}

@media (max-width:1200px) {
    .box__link--crm {
        top: 155px;
        left: 405px
    }
}

@media (max-width:1025px) {
    .box__link--crm {
        top: 160px;
        left: 417px
    }
}

@media (max-width:767px) {
    .box__link--crm {
        top: 135px;
        left: 351px
    }
}

@media (max-width:480px) {
    .box__link--crm {
        top: 88px;
        left: 235px
    }
}

.box__link--site {
    position: absolute;
    top: 203px;
    left: 355px
}

@media (max-width:1200px) {
    .box__link--site {
        top: 215px;
        left: 375px
    }
}

@media (max-width:1025px) {
    .box__link--site {
        top: 225px;
        left: 385px
    }
}

@media (max-width:767px) {
    .box__link--site {
        top: 190px;
        left: 325px
    }
}

.blog,
.contacts,
.portfolio,
.stages {
    margin: 95px 0 70px
}

.contacts__box-info {
    display: grid;
    grid-template-columns: 31% 33% auto
}

@media (max-width:1200px) {
    .contacts__box-info {
        grid-template-columns: 31% 27% auto
    }
}

@media (max-width:1025px) {
    .contacts__box-info {
        grid-template-columns: 354px 50%;
        grid-gap: 30px 0;
        justify-content: center
    }

    .contacts__box-info .main-footer__link-box {
        grid-template-columns: 1fr;
        grid-gap: 10px 0
    }
}

.contacts__box-info .h2,
.contacts__box-info h2 {
    text-align: center;
    text-transform: capitalize
}

.contacts__box-info h2 span,
.contacts__box-info span.h2 {
    font-size: 16px;
    line-height: 16px;
    text-transform: lowercase
}

.contacts__box-info .socia-list {
    justify-content: flex-start
}

#cookie__notification.show,
.contacts__box-info .main-footer__contacts {
    display: grid
}

.contacts__social {
    position: relative;
    margin: 46% 50% 0 0
}

@media (max-width:1200px) {
    .contacts__social {
        margin: 60% 31% 0 0
    }
}

@media (max-width:1025px) {
    .contacts__image {
        display: none
    }

    .contacts__social {
        margin: 60% 0 0
    }
}

.contacts__social .h2:nth-child(2),
.contacts__social h2:nth-child(2) {
    display: none
}

.contacts__social .footer-socia {
    width: 280px;
    height: 280px;
    position: absolute;
    top: -110px;
    left: -40px;
    -webkit-animation: 20s linear infinite rotateRight1;
    animation: 20s linear infinite rotateRight1
}

@media (max-width:1200px) {
    .contacts__social .footer-socia {
        left: -50px
    }

    .services__box {
        align-items: center
    }
}

.contacts__social .footer-socia li {
    width: 50px;
    height: 50px;
    position: absolute
}

.contacts__social .footer-socia li:first-child {
    top: 125px;
    left: -20px;
    -webkit-animation: 4s linear infinite rotateLeft;
    animation: 4s linear infinite rotateLeft
}

.contacts__social .footer-socia li:nth-child(2) {
    bottom: -15px;
    left: 80px;
    -webkit-animation: 4.5s linear infinite rotateLeft;
    animation: 4.5s linear infinite rotateLeft
}

.contacts__social .footer-socia li:nth-child(3) {
    top: -11px;
    left: 70px;
    -webkit-animation: 4s linear infinite rotateLeft;
    animation: 4s linear infinite rotateLeft
}

.contacts__social .footer-socia li:nth-child(4) {
    bottom: 45px;
    left: 230px;
    -webkit-animation: 4.5s linear infinite rotateLeft;
    animation: 4.5s linear infinite rotateLeft
}

.contacts__social .footer-socia li:nth-child(5) {
    top: 40px;
    right: 5px;
    -webkit-animation: 4s linear infinite rotateLeft;
    animation: 4s linear infinite rotateLeft
}

.contacts__social .footer-socia img {
    border-radius: 15px;
    transition: .3s linear;
    box-shadow: 0 0 8px rgba(0, 0, 0, .5)
}

.contacts__social .footer-socia img:hover,
.footer-socia img:hover,
.socia-list img:hover {
    transform: scale(1.2);
    transition: .3s linear
}

.contacts__info .contacts__text {
    margin-bottom: 20px
}

.contacts__info .contacts__text p {
    margin: 0;
    max-width: 360px;
    color: #333
}

.contacts__info .button {
    margin-top: 30px;
    max-width: 350px
}

.contacts__info .h2,
.contacts__info h2 {
    margin-bottom: 10px;
    font-size: 24px;
    line-height: 24px;
    font-weight: 400;
    font-family: ProximaNova-Regular, arial, sans-serif;
    text-align: left
}

.contacts__info .h3,
.contacts__info h3,
.services .h2,
.services .h3,
.services h1,
.services h2,
.services h3,
.services-keys .services-keys__text p strong,
.services__box-text .h3,
.services__box-text .services__data-text p,
.services__box-text h3,
.services__price article .services__text strong,
.services__price-box .services__span span,
.services__price-box strong,
.services__price-text2 p,
.services__price-wrap .services__price-tooltip p {
    font-family: ProximaNova-Bold, arial, sans-serif
}

.contacts__info .h3,
.contacts__info h3 {
    margin-bottom: 10px;
    font-size: 36px;
    line-height: 36px;
    color: #a62e41
}

@media (max-width:1025px) {
    .contacts__social .footer-socia {
        left: 28px
    }

    .contacts__info {
        max-width: 430px;
        width: 100%;
        margin: 0 auto
    }

    .contacts__info .h3,
    .contacts__info h3 {
        font-size: 33px;
        line-height: 33px
    }
}

.contacts__form {
    margin-top: 30px;
    display: grid;
    grid-gap: 40px 0;
    border: 2px solid #fff
}

.contacts__form form {
    max-width: 350px;
    display: grid;
    grid-gap: 30px 0
}

.map h2 {
    margin: 0 0 30px;
    color: #0a3d76;
    font-size: 24px;
    line-height: 24px;
    text-align: center
}

.map .ymaps-2-1-78-ground-pane {
    filter: grayscale(1)
}

.map--color-none .ymaps-2-1-78-ground-pane {
    filter: grayscale(0)
}

.contacts-btn {
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 20px 0;
    position: absolute;
    top: 165px;
    left: 95px;
    z-index: 1
}

.services__box-text,
.services__image,
.services__info p {
    position: relative
}

.contacts-btn button {
    min-width: 200px;
    padding: 12px 0;
    margin: 0;
    cursor: pointer;
    color: #fff;
    font-size: 16px;
    line-height: 18px;
    border: none;
    border-radius: 8px;
    box-shadow: -4px -4px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(0, 0, 0, .25);
    outline: 0
}

.contacts-btn button:hover {
    background-image: linear-gradient(90.02deg, #e2031e 5.42%, #8d1400 94.13%);
    box-shadow: -6px -6px 20px rgba(255, 255, 255, .8), 8px 8px 16px rgba(0, 0, 0, .3)
}

.button:active,
.contacts-btn .btn-active,
.contacts-btn button:active {
    box-shadow: inset -3px -3px 5px rgba(255, 85, 106, .4), inset 5px 5px 10px rgba(80, 20, 11, .4)
}

.services-keys .services-keys__box article,
.services__box-text .services__image-seo img,
.services__price article {
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8)
}

.button:disabled,
.contacts-btn button:disabled {
    background: #a0a0a0
}

.contacts-btn .btn-active {
    background-image: linear-gradient(90deg, #8d2716 0, #8d2716 100%)
}

.services {
    margin-top: 95px;
    width: 100%
}

@media (max-width:767.98px) {
    .services .breadcrumbs {
        margin-left: 70px
    }
}

@media (max-width:1650px) and (min-width:767.98px) {
    .services {
        padding-left: 225px
    }
}

.services h1 {
    margin-bottom: 40px;
    font-size: 48px;
    line-height: 48px;
    text-align: center;
    color: #333
}

@media (max-width:1025px) {
    .services h1 {
        margin: 20px 0;
        font-size: 36px;
        line-height: 36px;
        text-align: center
    }
}

.services .h2,
.services .h3,
.services h2,
.services h3 {
    font-size: 24px;
    line-height: 24px;
    text-align: center;
    color: #0a3d76
}

.services__box {
    max-width: 1140px;
    display: grid;
    grid-template-columns: 1fr 57%;
    margin: 30px 0 0
}

.services__box-text .h3,
.services__box-text h3 {
    text-align: left;
    color: #1e4180
}

.services__box-text .services__image-seo img {
    display: block;
    cursor: pointer;
    border-radius: 10px
}

.services__boxes img:last-child,
.services__price article .services__btn-more {
    display: none
}

.services__box-text .services__data-text {
    margin-bottom: 20px;
    display: grid;
    grid-template-columns: 60% auto;
    align-items: center;
    grid-gap: 0 7%
}

.services__box-images {
    margin: 0 auto 0 0;
    max-width: 340px
}

.services__box-images img {
    display: block
}

.services__image {
    margin: 0 auto -18%;
    -webkit-animation: 2.5s .5s forwards services-icon-show, 3.2s linear 3.5s infinite alternate forwards services-icon-movement;
    animation: 2.5s .5s forwards services-icon-show, 3.2s linear 3.5s infinite alternate forwards services-icon-movement;
    opacity: 0
}

.services__price {
    max-width: 1140px;
    margin: 30px 0 0
}

@media (max-width:1025px) {
    .services__box {
        grid-template-columns: 1fr
    }

    .services__box-images {
        margin: 0 auto
    }

    .services__price {
        margin: 60px 0 0
    }
}

.services__price .h3,
.services__price h3 {
    text-align: center;
    color: #0a3d76
}

.services__price p:nth-child(3) span,
.services__price-wrap .services__price-tooltip .services__mark {
    color: #a62e41
}

.services__price .services__price-grid {
    margin: 30px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-gap: 30px 2.5%;
    grid-template-columns: repeat(4, 23%)
}

@media (max-width:1200px) {
    .services__image {
        margin-bottom: -20%
    }

    .services__price .services__price-grid {
        justify-content: center;
        grid-template-columns: repeat(2, 350px);
        grid-gap: 30px 30px
    }
}

@media (max-width:1025px) {
    .services__price .services__price-grid {
        grid-template-columns: repeat(2, auto)
    }
}

.services__price article {
    min-height: 380px;
    background-image: linear-gradient(134.17deg, #f1f7ff 4.98%, #f5f9ff 94.88%);
    border-radius: 10px;
    display: flex;
    flex-direction: column
}

@media (max-width:1025px) {
    .services__price article {
        min-height: 400px
    }
}

@media (max-width:767px) {
    .contacts {
        margin-bottom: 40px
    }

    .contacts__box-info {
        grid-template-columns: 1fr;
        grid-gap: 20px 0
    }

    .contacts__box-info .h2,
    .contacts__box-info h2 {
        font-size: 14px;
        line-height: 21px
    }

    .contacts__social {
        width: 100%;
        max-width: 430px;
        margin: 0 auto
    }

    .contacts__social h2 {
        font-family: ProximaNova-Regular, arial, sans-serif;
        margin: 0 auto 10px;
        font-size: 16px;
        line-height: 21px;
        font-weight: 400;
        text-transform: none;
        text-align: left
    }

    .contacts__social h2:first-child {
        display: none
    }

    .contacts__social h2:nth-child(2) {
        display: block
    }

    .contacts__social .footer-socia {
        width: auto;
        height: auto;
        position: static;
        -webkit-animation: none;
        animation: none;
        grid-gap: 0 20px;
        grid-template-columns: repeat(5, minmax(5%, 35px))
    }

    .contacts__social .footer-socia li {
        width: auto;
        height: auto;
        position: static
    }

    .contacts__social .footer-socia li:first-child,
    .contacts__social .footer-socia li:nth-child(2),
    .contacts__social .footer-socia li:nth-child(3),
    .contacts__social .footer-socia li:nth-child(4),
    .contacts__social .footer-socia li:nth-child(5) {
        position: static;
        -webkit-animation: none;
        animation: none
    }

    .contacts__social .footer-socia img {
        border-radius: 10px;
        max-width: 40px
    }

    .contacts__info h2 {
        font-size: 16px;
        line-height: 16px
    }

    .contacts__info .h3,
    .contacts__info h3 {
        font-size: 24px;
        line-height: 24px
    }

    .map h2 {
        font-size: 20px;
        line-height: 20px
    }

    .contacts-btn {
        top: 100px;
        left: 50%;
        transform: translateX(-50%);
        grid-template-columns: repeat(3, 92px);
        grid-gap: 0 10px;
        padding: 0 10px
    }

    .contacts-btn button {
        min-width: auto;
        padding: 7px 0
    }

    .services {
        margin-top: 90px
    }

    .services h1 {
        margin-top: 10px;
        margin-left: 0;
        padding: 0 20px;
        font-size: 24px;
        line-height: 24px
    }

    .services h3 {
        font-size: 18px;
        line-height: 18px
    }

    .services__box {
        margin: 0
    }

    .services__box-text {
        margin: 0 auto;
        padding: 0 10px
    }

    .services__box-text .h3,
    .services__box-text h3 {
        text-align: center
    }

    .services__box-text .services__image-seo {
        max-width: 350px;
        margin: 0 auto
    }

    .services__box-text .services__data-text {
        grid-template-columns: 1fr;
        text-align: center
    }

    .services__box-text .services__data-text a {
        max-width: 150px;
        font-size: 16px
    }

    .services__box-images {
        display: none
    }

    .services__price {
        margin: 60px auto 0;
        padding: 0 15px
    }

    .services__price .services__price-grid {
        grid-template-columns: minmax(0, 350px)
    }

    .services__price article {
        min-height: auto
    }

    .services__price article .services__btn-more {
        width: 24px;
        height: 24px;
        margin: 0 auto 5px;
        border: none;
        background-color: transparent;
        display: block;
        outline: 0;
        cursor: pointer;
        background-image: url("../img/svg/icon-more.svg");
        background-repeat: no-repeat;
        transform: rotate(180deg)
    }
}

.services__price article .services__btn-more--active {
    transform: rotate(0)
}

.services__price article .services__text {
    padding: 15px 0;
    background-color: #0a3d76;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px
}

.services__price article .services__text strong {
    font-size: 18px;
    line-height: 18px;
    text-align: center;
    color: #fff;
    display: block
}

.services__price article .services__text-image {
    margin-top: 85px
}

.services__price article .services__text-image img {
    width: 100%;
    max-width: 125px;
    margin: 0 auto;
    display: block
}

.services__price-box {
    margin-bottom: 15px;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    justify-items: center
}

.services__price-box .services__price-text {
    padding: 5px 10px;
    background-color: #0a3d76;
    border-bottom-left-radius: 10px;
    border-top-right-radius: 10px;
    white-space: nowrap
}

.services__price-box .services__span {
    display: flex;
    gap: 3px;
    justify-content: center
}

.services__price-box .services__span:first-child {
    border-bottom: 2px dashed #fff
}

.services__price-box .services__span span {
    padding: 5px 0;
    display: block;
    color: #fff;
    font-size: 14px;
    line-height: 14px;
    letter-spacing: .03em;
    text-transform: uppercase;
    text-align: center
}

.services__price-box .services__span span:first-child {
    text-transform: lowercase
}

.services__price-box strong {
    font-size: 18px;
    line-height: 18px;
    color: #a62e41;
    text-align: center
}

.services__price-wrap {
    margin-bottom: auto;
    display: flex;
    flex-direction: column;
    flex-grow: 1
}

@media (max-width:767px) {
    .services__price-wrap {
        display: none
    }
}

.services__price-wrap--active {
    display: block
}

.services__price-wrap ul {
    margin: 0;
    padding: 0;
    list-style: none;
    flex-grow: 1
}

.services__price-wrap li {
    margin-bottom: 10px;
    overflow: hidden
}

.services__price-wrap li p {
    margin: 0;
    padding: 0 10px 0 30px;
    font-size: 14px;
    line-height: 16px
}

.services__price-wrap .button {
    max-width: 150px;
    margin: 0 auto 20px
}

.services__price-wrap .services__price-tooltip {
    display: flex;
    align-items: center
}

.services__price-wrap .services__price-tooltip p {
    margin: 0;
    padding: 0 20px 0 30px;
    font-size: 14px;
    line-height: 14px;
    color: #0a3d76;
    position: relative
}

.services__price-wrap .services__price-tooltip p::before {
    width: 10px;
    height: 10px;
    position: absolute;
    content: "";
    top: 0;
    left: 13px;
    background-image: url("../img/svg/icon-arrow-green.svg");
    background-repeat: no-repeat
}

.services__price-wrap .services__price-tooltip p strong {
    font-size: 14px;
    line-height: 14px;
    color: #a62e41
}

.services__price-wrap .services__text-box {
    max-height: 0
}

.services__price-wrap .services__text-box p {
    padding-top: 10px
}

.services__price-wrap .services__text-box--active {
    max-height: 300px
}

.services__price-wrap .services__btn-tooltip {
    margin: 0 5px;
    width: 15px;
    height: 15px;
    padding: 0;
    border: none;
    background-color: transparent;
    background-image: url("../img/svg/icon-tooltip.svg");
    background-repeat: no-repeat;
    background-size: 14px 14px;
    cursor: pointer;
    outline: 0;
    position: absolute
}

.services__price-wrap .services__btn-tooltip--active {
    background-image: url("../img/svg/icon-tooltip-blue.svg")
}

.services__price-text2 {
    max-width: 670px;
    margin: 60px auto;
    display: grid;
    grid-gap: 0 30px;
    grid-template-columns: 80px auto;
    align-items: center
}

.services__price-text2 p {
    margin: 0;
    font-size: 24px;
    line-height: 36px;
    color: #a62e41
}

.services-keys {
    max-width: 1140px;
    margin: 0
}

.services-keys .services-keys__box {
    margin: 30px 0;
    display: flex;
    gap: 25px
}

.services-keys .services-keys__box article {
    width: 100%;
    padding: 20px 20px 30px;
    border-radius: 10px;
    background-image: linear-gradient(134.17deg, #f1f7ff 4.98%, #f5f9ff 94.88%)
}

@media (max-width:1025px) {
    .services-keys .services-keys__box {
        flex-wrap: wrap;
        gap: 15px;
        justify-content: center
    }

    .services-keys .services-keys__box article {
        width: 48%
    }
}

.services-keys .services-keys__text strong {
    margin-bottom: 10px;
    text-align: center;
    color: #a62e41;
    display: block
}

.services-keys .services-keys__text strong a {
    color: #a62e41
}

.services-keys .services-keys__text strong a:hover {
    color: #0a3d76
}

.services-keys .services-keys__text p {
    margin: 0 0 10px;
    font-size: 14px;
    line-height: 17px
}

.services-keys .services-keys__text p strong {
    display: inline;
    color: #0a3d76
}

.services-keys .services-keys__image img {
    border-radius: 10px;
    box-shadow: 0 0 5px rgba(0, 0, 0, .2);
    display: block
}

.services__info img:last-child,
.services__nav-box li:last-child::after {
    display: none
}

.services-keys table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 14px
}

.services-keys table tr:last-child td {
    border-bottom: none
}

.services-keys table th {
    padding: 0;
    text-align: left;
    color: #0a3d76;
    border-bottom: 1px solid rgba(10, 61, 118, .1)
}

.services-keys table td {
    padding: 10px 0;
    border-bottom: 1px solid rgba(10, 61, 118, .1)
}

.services-keys table td:first-child {
    max-width: 120px
}

.services-keys table td img {
    max-width: 50px
}

.services__info {
    max-width: 1200px;
    margin: 75px 0 0;
    display: grid;
    grid-template-columns: 57% 1fr
}

@media (max-width:1025px) {
    .services__info {
        grid-template-columns: 1fr;
        grid-template-rows: 1fr 200px;
        grid-gap: 30px 0;
        margin: 75px 0 0
    }

    .services__info article:last-child {
        width: 240px;
        margin: 0 auto
    }
}

.services__info h3 {
    margin-bottom: 20px;
    color: #0a3d76
}

.services__info ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.services__info p {
    margin: 0 0 10px;
    padding-left: 20px
}

.services__info p::before {
    width: 10px;
    height: 2px;
    position: absolute;
    content: "";
    top: 10px;
    left: 0;
    background-color: #a62e41
}

.services__info article:last-child {
    position: relative
}

.services__info img {
    max-width: 160px;
    position: absolute
}

.services__info img:first-child {
    top: -20px;
    left: 75px;
    -webkit-animation: 2s ease-in-out infinite alternate forwards rotateKaterina;
    animation: 2s ease-in-out infinite alternate forwards rotateKaterina
}

.services__info img:nth-child(2) {
    top: 40px;
    left: 140px;
    -webkit-animation: 2s ease-in-out infinite alternate forwards rotateKaterina1;
    animation: 2s ease-in-out infinite alternate forwards rotateKaterina1
}

.services__nav-box {
    max-width: 245px;
    width: 100%;
    height: 1400px;
    position: absolute;
    top: 65px;
    left: 0;
    box-shadow: 2px 2px 6px rgba(0, 0, 0, .1)
}

.services__nav-box ul {
    margin: 0 0 0 15px;
    padding: 0 0 40px;
    list-style: none;
    position: sticky;
    top: 50%;
    left: 0;
    transform: translateY(-39%)
}

.article__box-article,
.page-unavailable__image,
.services__nav-box li,
.sharing-list li,
.stages__coffee-image {
    position: relative
}

.services__nav-box li::after {
    width: 2px;
    height: 30px;
    position: absolute;
    content: "";
    bottom: -30px;
    left: 16px;
    background-color: #1e4180
}

.services__nav-box li .services__link-active {
    color: #a62e41;
    transform: translateX(5px)
}

.services__nav-box li .services__link-active img:nth-child(2),
.services__nav-box li .services__link-active img:nth-child(5),
.services__nav-box li .services__link-active:hover img:nth-child(2) {
    display: block
}

.services__nav-box a:hover img:first-child,
.services__nav-box a:hover img:nth-child(2),
.services__nav-box a:hover img:nth-child(4),
.services__nav-box li .services__link-active img:first-child,
.services__nav-box li .services__link-active img:nth-child(4),
.services__nav-box li .services__link-active:hover img:nth-child(3) {
    display: none
}

.services__nav-box a {
    display: flex;
    align-items: center;
    margin-bottom: 30px;
    transform: translateX(0);
    transition: .3s linear
}

@media (max-width:1440px) {
    .services__nav-box {
        max-width: 230px
    }

    .services__nav-box a {
        font-size: 16px;
        line-height: 21px
    }
}

.services__nav-box a:hover {
    transform: translateX(5px);
    transition: .3s linear
}

.feedback-slider__swiper-container .swiper-slide .play-button::before,
.feedback__box .youtube .play-button::before,
.feedback__box .youtube:hover .play-button::before,
.services__slide-image a::before {
    height: 50px;
    transform: translate(-50%, -50%);
    background-repeat: no-repeat
}

.services__nav-box a:hover img:nth-child(3),
.services__nav-box a:hover img:nth-child(5),
.services__nav-box:hover+.services__box-images img:last-child {
    display: block
}

.services__nav-box img {
    max-width: 35px;
    display: block
}

.services__nav-box img:nth-child(2),
.services__nav-box img:nth-child(3),
.services__nav-box img:nth-child(5),
.services__nav-box:hover+.services__box-images img:first-child {
    display: none
}

.services__slide-image img {
    display: block;
    border-radius: 15px;
    box-shadow: -5px -5px 10px rgba(151, 165, 185, .3), 5px 5px 10px rgba(151, 165, 185, .3)
}

.services__slide-image a {
    display: block;
    position: relative
}

.services__slide-image a::before {
    width: 50px;
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transition: .2s linear;
    background-image: url("../img/svg/play-button.svg")
}

.services__slide-image a:hover::before {
    transition: .2s linear;
    transform: translate(-50%, -50%) scale(1.1)
}

.services__developers .services__developers-box a:hover,
.services__promotion .services__promotion-box a:hover,
.services__social .services__social-box a:hover {
    transform: scale(1.05)
}

.feedback-slider,
.services__slider {
    max-width: 1150px;
    margin-top: 60px
}

.services__slider ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.feedback-slider__wrapper,
.services__slider-wrapper {
    padding: 0 40px;
    position: relative
}

.feedback-slider__swiper-container,
.services__swiper-container {
    position: static;
    padding: 30px 15px
}

.services__swiper-container .swiper-slide iframe {
    width: 100%;
    height: 300px;
    border: none;
    display: block
}

.feedback-slider__swiper-button-prev,
.services__swiper-button-prev {
    left: 0
}

.services__swiper-button-prev::after {
    color: #0a3d76;
    font-size: 24px;
    font-weight: 800
}

.services__swiper-button-prev:hover::after {
    color: #a62e41
}

.feedback-slider__swiper-button-next,
.services__swiper-button-next {
    right: 0
}

.services__swiper-button-next::after {
    color: #0a3d76;
    font-size: 24px;
    font-weight: 800
}

.services__swiper-button-next:hover::after {
    color: #a62e41
}

.services__box-portfolio {
    margin: 70px auto
}

.services__box-portfolio h2 {
    max-width: 500px;
    margin: 0 auto;
    text-transform: none;
    text-align: center;
    line-height: 36px
}

.services__box-portfolio a {
    color: #0a3d76;
    text-transform: uppercase
}

.services__box-portfolio a:hover {
    color: #a62e41
}

.services__info-1 {
    max-width: 1200px;
    margin: 75px 0 0
}

.services__context .services__context-box,
.services__context .services__sites-box,
.services__developers .services__developers-box,
.services__promotion .services__promotion-box,
.services__sites .services__context-box,
.services__sites .services__sites-box {
    margin: 30px 0 60px;
    display: flex;
    justify-content: center;
    gap: 0 30px
}

.services__context .services__context-box a,
.services__context .services__sites-box a,
.services__sites .services__context-box a,
.services__sites .services__sites-box a {
    width: 100%;
    max-width: 230px;
    padding: 35px 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: ProximaNova-Bold, arial, sans-serif;
    font-size: 24px;
    line-height: 24px;
    text-align: center;
    color: #0a3d76;
    background-image: linear-gradient(134.17deg, #f1f7ff 4.98%, #f5f9ff 94.88%);
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8);
    border-radius: 10px;
    transition: .2s linear
}

.services__context .services__context-box a:hover,
.services__context .services__sites-box a:hover,
.services__sites .services__context-box a:hover,
.services__sites .services__sites-box a:hover {
    color: #a62e41;
    transform: scale(1.05)
}

.services__developers .services__developers-box a {
    width: 100%;
    max-width: 230px;
    padding: 15px 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background-image: linear-gradient(134.17deg, #f1f7ff 4.98%, #f5f9ff 94.88%);
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8);
    border-radius: 10px;
    transition: .2s linear
}

.services__promotion .services__promotion-box a,
.services__social .services__social-box a {
    width: 100%;
    padding: 25px 20px;
    color: #333;
    background-image: linear-gradient(134.17deg, #f1f7ff 4.98%, #f5f9ff 94.88%);
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8);
    transition: .2s linear;
    display: flex;
    font-family: ProximaNova-Bold, arial, sans-serif;
    border-radius: 10px
}

.services__developers .services__developers-box a img {
    max-width: 130px
}

.services__promotion .services__promotion-box a {
    max-width: 230px;
    align-items: center;
    justify-content: space-between;
    font-size: 18px;
    line-height: 21px
}

.services__promotion .services__promotion-box a img {
    max-width: 48px;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, .2), inset -4px -4px 8px rgba(0, 0, 0, .15);
    border-radius: 10px
}

.services__social .services__social-box {
    max-width: 500px;
    margin: 30px auto 60px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 30px
}

.services__social .services__social-box a {
    max-width: 230px;
    align-items: center;
    justify-content: space-between;
    font-size: 18px;
    line-height: 21px
}

.services__social .services__social-box a img {
    max-width: 48px;
    border-radius: 10px;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, .2), inset -4px -4px 8px rgba(0, 0, 0, .15)
}

.services__info-list {
    margin: 30px 0 60px;
    gap: 50px 6%;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.services__info-list article {
    width: 29%
}

@media (max-width:1025px) {
    .services__info img:first-child {
        top: 0;
        left: -15px
    }

    .services__info img:nth-child(2) {
        top: 60px;
        left: 55px
    }

    .services__nav-box {
        max-width: 215px;
        top: 65px
    }

    .services__slide-image a::before {
        width: 40px;
        height: 40px;
        background-size: 40px 40px
    }

    .services__box-portfolio h2 {
        font-size: 18px;
        line-height: 24px;
        max-width: 350px
    }

    .services__info-list article {
        width: 45%
    }
}

.services__info-list img {
    max-width: 200px;
    margin: 0 auto;
    display: block
}

.services__info-list strong {
    margin: 20px 0 10px;
    font-family: ProximaNova-Bold, arial, sans-serif;
    font-size: 17px;
    line-height: 17px;
    text-align: center;
    color: #a62e41;
    display: block
}

.services__info-list p {
    margin: 0
}

.services__info-text {
    max-width: 700px;
    margin: 0 auto
}

@media (max-width:1025px) {
    .services__info-list img {
        max-width: 150px
    }

    .services__info-text {
        padding: 0 30px
    }
}

.services__info-text .h2,
.services__info-text .h3,
.services__info-text h2,
.services__info-text h3 {
    margin: 60px 0 15px
}

.services__info-text h3 strong {
    max-width: 415px;
    font-family: ProximaNova-Bold, arial, sans-serif;
    font-size: 17px;
    line-height: 22px;
    text-align: left;
    color: #0a3d76
}

.services__info-text h4 {
    font-family: ProximaNova-Bold, arial, sans-serif;
    font-size: 17px;
    line-height: 24px;
    color: #a62e41
}

.services__info-text strong {
    margin: 10px 0 0;
    display: block;
    color: #a62e41;
    font-family: ProximaNova-Bold, arial, sans-serif
}

.stages__image a:hover,
.stages__image--active a:hover {
    color: #000
}

.services__info-text p {
    margin: 10px 0 0
}

.services__info-text p strong {
    display: inline;
    font-family: ProximaNova-Bold, arial, sans-serif;
    color: #333
}

.feedback-slider ul,
.services__info-text ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.services__info-text ul p {
    padding-left: 20px;
    position: relative
}

.services__info-text ul p::before {
    width: 10px;
    height: 2px;
    position: absolute;
    content: "";
    top: 10px;
    left: 0;
    background-color: #a62e41
}

.services__info-text ol {
    margin: 0 0 60px;
    padding: 0;
    list-style: none;
    counter-reset: num
}

.services__info-text ol li {
    margin-bottom: 10px
}

.services__info-text ol li::before {
    content: counter(num) ". ";
    counter-increment: num;
    font-family: ProximaNova-Bold, arial, sans-serif;
    color: #a62e41
}

@media (max-width:1200px) {
    .services__nav-box ul {
        margin-left: 10px
    }

    .services__swiper-button-next {
        right: 15px
    }

    .stages h1 {
        margin-left: 23%
    }
}

@media (max-width:1025px) {
    .stages h1 {
        margin-left: 28%
    }
}

.stages__nav-box {
    width: 125px;
    height: 1200px;
    position: absolute;
    top: 90px;
    left: 40px
}

.stages__nav-list {
    margin: 0;
    padding: 0;
    list-style: none;
    position: sticky;
    top: 100px
}

.stages__box {
    max-width: 1000px;
    margin: 0 10% 0 24%;
    display: grid;
    grid-template-columns: 1fr;
    justify-items: center;
    position: relative
}

.stages__box:nth-child(5) {
    display: none
}

@media (max-width:1200px) {
    .stages__box {
        margin: 50px 0 0 20%
    }
}

@media (max-width:1025px) {
    .stages__box {
        margin: 0 0 0 25%
    }
}

@media (max-width:767px) {
    .services__price-text2 p {
        font-size: 18px;
        line-height: 27px
    }

    .services-keys {
        margin: 0 auto
    }

    .services-keys .services-keys__box {
        padding: 0 15px
    }

    .services-keys .services-keys__box article {
        width: 100%;
        max-width: 350px
    }

    .services__info {
        margin: 0 auto;
        padding: 0 10px
    }

    .services__info h3 {
        margin-top: 30px
    }

    .services__info img:first-child,
    .services__info img:nth-child(2) {
        display: none;
        -webkit-animation: none;
        animation: none
    }

    .services__info img:last-child {
        max-width: 240px;
        margin: 0 auto;
        display: block;
        position: static
    }

    .services__nav-box,
    .stages__nav-box {
        display: none
    }

    .services__swiper-container {
        padding: 30px 0 0
    }

    .services__swiper-container .swiper-slide iframe {
        height: 250px
    }

    .services__swiper-button-prev {
        left: 5px
    }

    .services__swiper-button-next {
        right: 6px
    }

    .services__info-1 {
        margin: 30px 0 0
    }

    .services__context .services__context-box,
    .services__context .services__sites-box,
    .services__developers .services__developers-box,
    .services__promotion .services__promotion-box,
    .services__sites .services__context-box,
    .services__sites .services__sites-box,
    .services__social .services__social-box {
        flex-direction: column;
        align-items: center;
        gap: 30px 0
    }

    .services__context .services__context-box a,
    .services__context .services__sites-box a,
    .services__sites .services__context-box a,
    .services__sites .services__sites-box a {
        max-width: 200px;
        padding: 25px 10px;
        font-size: 18px;
        line-height: 18px
    }

    .services__developers .services__developers-box a {
        max-width: 200px
    }

    .services__promotion .services__promotion-box a {
        max-width: 200px;
        font-size: 14px;
        line-height: 16px
    }

    .services__promotion .services__promotion-box a img {
        max-width: 40px
    }

    .services__social .services__social-box a {
        max-width: 200px;
        font-size: 14px;
        line-height: 16px
    }

    .services__social .services__social-box a img {
        max-width: 40px
    }

    .services__info-list {
        padding: 0 15px;
        margin-bottom: 30px
    }

    .services__info-list article {
        width: 100%
    }

    .services__info-text {
        padding: 0 15px;
        margin-left: auto
    }

    .services__info-text h3 strong,
    .services__info-text h4 {
        font-size: 16px
    }

    .services__info-text ol {
        margin-bottom: 30px
    }

    .stages {
        margin: 90px 0 40px
    }

    .stages h1 {
        margin-left: 0
    }

    .stages__box:nth-child(5) {
        display: block
    }

    .stages__box {
        margin: 0 auto
    }

    .stages__box:nth-child(3),
    .stages__box:nth-child(4) {
        display: none
    }
}

.stages__box--design,
.stages__box--developers,
.stages__box--strategy {
    margin-top: 60px
}

.stages__box--analysis img:first-child {
    max-width: 750px;
    -webkit-animation: 2s 1s forwards stage-show-elements-2;
    animation: 2s 1s forwards stage-show-elements-2;
    opacity: 0
}

.stages__box--analysis img:nth-child(2) {
    margin-top: -180px;
    z-index: -1;
    -webkit-animation: 1.5s .5s forwards stage-show-elements-1;
    animation: 1.5s .5s forwards stage-show-elements-1;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--analysis img:nth-child(2) {
        margin-top: -140px
    }

    .stages__box--strategy img:first-child {
        margin-right: 40px
    }
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(2) {
        margin-top: -110px
    }
}

.stages__box--analysis img:nth-child(3) {
    max-width: 65px;
    position: absolute;
    top: 35%;
    left: 0;
    -webkit-animation: 2s 1.2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(3) {
        max-width: 50px;
        left: 30px
    }
}

@media (max-width:767px) {
    .stages__box--analysis img:nth-child(2) {
        margin-top: -60px
    }

    .stages__box--analysis img:nth-child(3) {
        max-width: 40px
    }
}

.stages__box--analysis img:nth-child(4) {
    max-width: 50px;
    position: absolute;
    top: 50%;
    left: 18%;
    -webkit-animation: 2s 1.5s forwards stage-show-elements-3, 2.1s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.5s forwards stage-show-elements-3, 2.1s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(4) {
        max-width: 45px
    }
}

.stages__box--analysis img:nth-child(5) {
    max-width: 60px;
    position: absolute;
    top: 5%;
    left: 5%;
    -webkit-animation: 2s 1.8s forwards stage-show-elements-3, 2.6s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.8s forwards stage-show-elements-3, 2.6s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(5) {
        max-width: 50px
    }
}

@media (max-width:767px) {
    .stages__box--analysis img:nth-child(5) {
        max-width: 40px
    }
}

.stages__box--analysis img:nth-child(6) {
    max-width: 70px;
    position: absolute;
    top: 19%;
    left: 17%;
    -webkit-animation: 2s 2.1s forwards stage-show-elements-3, 2.5s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.1s forwards stage-show-elements-3, 2.5s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(6) {
        max-width: 55px
    }
}

@media (max-width:767px) {
    .stages__box--analysis img:nth-child(6) {
        max-width: 40px
    }
}

.stages__box--analysis img:nth-child(7) {
    max-width: 90px;
    position: absolute;
    top: 0;
    left: 29%;
    -webkit-animation: 2s 2.4s forwards stage-show-elements-3, 1.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.4s forwards stage-show-elements-3, 1.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(7) {
        max-width: 75px
    }
}

@media (max-width:767px) {
    .stages__box--analysis img:nth-child(7) {
        max-width: 50px
    }
}

.stages__box--analysis img:nth-child(8) {
    max-width: 190px;
    position: absolute;
    top: 0;
    right: 18%;
    -webkit-animation: 2s 2.7s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.7s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(8) {
        max-width: 135px
    }
}

@media (max-width:767px) {
    .stages__box--analysis img:nth-child(8) {
        max-width: 75px
    }
}

.stages__box--analysis img:nth-child(9) {
    max-width: 90px;
    position: absolute;
    top: 45%;
    right: 10%;
    -webkit-animation: 2s 3s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 3s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--analysis img:nth-child(9) {
        max-width: 60px
    }
}

@media (max-width:767px) {
    .stages__box--analysis img:nth-child(9) {
        max-width: 35px
    }

    .stages__box--promotions .footer-socia {
        display: none
    }
}

.stages__box--strategy img:first-child {
    margin-top: 30px;
    max-width: 600px;
    -webkit-animation: 2s 1.5s forwards stage-show-elements-2;
    animation: 2s 1.5s forwards stage-show-elements-2;
    opacity: 0
}

.stages__box--strategy img:nth-child(2) {
    margin-top: -230px;
    margin-left: 80px;
    z-index: -1;
    -webkit-animation: 2s .3s forwards stage-show-elements-1;
    animation: 2s .3s forwards stage-show-elements-1;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--strategy img:nth-child(2) {
        margin-top: -200px;
        margin-left: 0
    }
}

.stages__box--strategy img:nth-child(3) {
    width: 62px;
    height: 62px;
    position: absolute;
    top: 100px;
    left: 85px;
    -webkit-animation: 2s 1.2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--strategy img:first-child {
        margin-right: 0
    }

    .stages__box--strategy img:nth-child(2) {
        margin-top: -155px;
        margin-left: 30px
    }

    .stages__box--strategy img:nth-child(3) {
        width: 50px;
        height: 50px;
        top: -25px;
        left: 105px
    }
}

.stages__box--strategy img:nth-child(4) {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 260px;
    left: 190px;
    -webkit-animation: 2s 1.5s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.5s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--strategy img:nth-child(4) {
        left: 160px
    }
}

.stages__box--strategy img:nth-child(5) {
    width: 68px;
    height: 68px;
    position: absolute;
    top: 15px;
    right: 80px;
    -webkit-animation: 2s 1.8s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.8s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--strategy img:nth-child(4) {
        left: 65px
    }

    .stages__box--strategy img:nth-child(5) {
        width: 50px;
        height: 50px
    }
}

.stages__box--strategy img:nth-child(6) {
    width: 40px;
    height: 30px;
    position: absolute;
    top: 250px;
    right: 130px;
    -webkit-animation: 2s 2.1s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.1s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--strategy img:nth-child(6) {
        right: 65px
    }

    .stages__box--strategy img:nth-child(7) {
        display: none
    }
}

@media (max-width:1025px) {
    .stages__box--strategy img:nth-child(6) {
        right: 35px;
        top: 170px
    }
}

.stages__box--strategy img:nth-child(7) {
    width: 30px;
    height: 30px;
    position: absolute;
    top: 175px;
    right: 220px;
    -webkit-animation: 2s 2.4s forwards show, 1s ease-in-out infinite alternate forwards scale2;
    animation: 2s 2.4s forwards show, 1s ease-in-out infinite alternate forwards scale2;
    opacity: 0
}

.stages__box--strategy img:nth-child(8) {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 95px;
    left: 220px;
    -webkit-animation: 2s 2.7s forwards show, 1s ease-in-out infinite alternate forwards scale2;
    animation: 2s 2.7s forwards show, 1s ease-in-out infinite alternate forwards scale2;
    opacity: 0
}

.stages__box--design img:first-child {
    max-width: 775px;
    -webkit-animation: 2s 1.5s forwards stage-show-elements-2;
    animation: 2s 1.5s forwards stage-show-elements-2;
    opacity: 0
}

.stages__box--design img:nth-child(2) {
    margin-top: -190px;
    z-index: -1;
    -webkit-animation: 2s .3s forwards stage-show-elements-1;
    animation: 2s .3s forwards stage-show-elements-1;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--design img:nth-child(2) {
        margin-top: -160px
    }
}

@media (max-width:1025px) {
    .stages__box--strategy img:nth-child(8) {
        left: 50px
    }

    .stages__box--design {
        max-width: 630px
    }

    .stages__box--design img:nth-child(2) {
        margin-top: -100px
    }
}

.stages__box--design img:nth-child(3) {
    max-width: 40px;
    position: absolute;
    top: 39%;
    left: 11%;
    -webkit-animation: 2s 2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--design img:nth-child(3) {
        top: 50%;
        left: 10%
    }
}

.stages__box--design img:nth-child(4) {
    max-width: 75px;
    position: absolute;
    top: 10%;
    left: 14%;
    -webkit-animation: 2s 2.3s forwards stage-show-elements-3, 2.3s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.3s forwards stage-show-elements-3, 2.3s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--design img:nth-child(4) {
        max-width: 50px;
        left: 10%
    }
}

.stages__box--design img:nth-child(5) {
    max-width: 55px;
    position: absolute;
    top: 5%;
    left: 32%;
    -webkit-animation: 2s 2.6s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.6s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--design img:nth-child(5) {
        max-width: 45px
    }
}

.stages__box--design img:nth-child(6) {
    max-width: 56px;
    position: absolute;
    top: 23%;
    right: 26%;
    -webkit-animation: 2s 2.9s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.9s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--design img:nth-child(6) {
        max-width: 45px;
        right: 24%
    }
}

.stages__box--design img:nth-child(7) {
    max-width: 40px;
    position: absolute;
    top: 10%;
    right: 14%;
    -webkit-animation: 2s 3.2s forwards stage-show-elements-3, 2s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 3.2s forwards stage-show-elements-3, 2s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

.stages__box--design img:nth-child(8) {
    max-width: 73px;
    position: absolute;
    top: 45%;
    left: 20%;
    -webkit-animation: 2s 3.5s forwards stage-show-elements-3, 2.2s ease-in-out infinite alternate forwards teams-svg-top;
    animation: 2s 3.5s forwards stage-show-elements-3, 2.2s ease-in-out infinite alternate forwards teams-svg-top;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--design img:nth-child(7) {
        right: 6%
    }

    .stages__box--design img:nth-child(8) {
        max-width: 50px;
        top: 50%;
        left: 21%
    }
}

.stages__box--design img:nth-child(9) {
    max-width: 73px;
    position: absolute;
    top: 58%;
    left: 52%;
    -webkit-animation: 2s 3.8s forwards stage-show-elements-3, 2.5s ease-in-out infinite alternate forwards teams-svg-top;
    animation: 2s 3.8s forwards stage-show-elements-3, 2.5s ease-in-out infinite alternate forwards teams-svg-top;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--design img:nth-child(9) {
        max-width: 50px
    }
}

.stages__box--design img:nth-child(10) {
    max-width: 225px;
    position: absolute;
    top: 57%;
    left: 22%;
    -webkit-animation: 2s 2.3s forwards stage-show-elements-3, 2s ease-in-out 2.3s infinite alternate forwards rotateKaterina;
    animation: 2s 2.3s forwards stage-show-elements-3, 2s ease-in-out 2.3s infinite alternate forwards rotateKaterina;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--design img:nth-child(10) {
        left: 19%
    }
}

@media (max-width:1025px) {
    .stages__box--design img:nth-child(10) {
        max-width: 160px;
        left: 120px;
        top: 60%
    }
}

.stages__box--design img:nth-child(11) {
    max-width: 220px;
    position: absolute;
    top: 71%;
    left: 31%;
    -webkit-animation: 2s 2.5s forwards stage-show-elements-3, 2s ease-in-out 2.5s infinite alternate forwards rotateKaterina1;
    animation: 2s 2.5s forwards stage-show-elements-3, 2s ease-in-out 2.5s infinite alternate forwards rotateKaterina1;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--design img:nth-child(11) {
        max-width: 160px
    }

    .stages__box--developers {
        margin-top: 40px
    }
}

.stages__box--automation,
.stages__box--promotions,
.stages__box--support {
    margin-top: 60px
}

.stages__box--developers img:first-child {
    max-width: 610px;
    -webkit-animation: 2s 1s forwards stage-show-elements-2;
    animation: 2s 1s forwards stage-show-elements-2;
    opacity: 0
}

.stages__box--developers img:nth-child(2) {
    margin-top: -210px;
    z-index: -1;
    -webkit-animation: 2s .2s forwards stage-show-elements-1;
    animation: 2s .2s forwards stage-show-elements-1;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--developers img:first-child {
        max-width: 460px
    }

    .stages__box--developers img:nth-child(2) {
        margin-top: -145px
    }
}

.stages__box--developers img:nth-child(3) {
    max-width: 90px;
    position: absolute;
    top: 50%;
    left: 5%;
    -webkit-animation: 2s 1.2s forwards stage-show-elements-3, 1.8s ease-in-out 2s infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.2s forwards stage-show-elements-3, 1.8s ease-in-out 2s infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--developers img:nth-child(3) {
        top: 54%
    }
}

@media (max-width:1025px) {
    .stages__box--developers img:nth-child(3) {
        max-width: 60px;
        top: 57%
    }
}

.stages__box--developers img:nth-child(4) {
    max-width: 110px;
    position: absolute;
    top: 20%;
    left: 10%;
    -webkit-animation: 2s 1.5s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.5s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--developers img:nth-child(4) {
        max-width: 75px;
        top: 21%;
        left: 8%
    }
}

.stages__box--developers img:nth-child(5) {
    max-width: 95px;
    position: absolute;
    top: -40px;
    left: 57%;
    -webkit-animation: 2s 1.8s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.8s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--developers img:nth-child(5) {
        max-width: 75px
    }
}

.stages__box--developers img:nth-child(6) {
    max-width: 95px;
    position: absolute;
    top: 20%;
    right: 7%;
    -webkit-animation: 2s 2.1s forwards stage-show-elements-3, 2.1s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.1s forwards stage-show-elements-3, 2.1s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--developers img:nth-child(6) {
        right: 0
    }
}

@media (max-width:1025px) {
    .stages__box--developers img:nth-child(6) {
        max-width: 75px
    }
}

.stages__box--developers img:nth-child(7) {
    max-width: 80px;
    position: absolute;
    top: 45%;
    right: 13%;
    -webkit-animation: 2s 2.5s forwards stage-show-elements-3, 2.5s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.5s forwards stage-show-elements-3, 2.5s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--developers img:nth-child(7) {
        top: 52%;
        right: 10%
    }
}

.stages__box--promotions .footer-socia {
    grid-template-columns: repeat(4, 22%);
    grid-gap: 0;
    position: absolute;
    top: 15%;
    left: 50%;
    transform: translateX(-50%)
}

.stages__box--promotions .footer-socia li:first-child {
    margin-top: 80px;
    margin-right: 25px
}

@media (max-width:1025px) {
    .stages__box--developers img:nth-child(7) {
        max-width: 60px;
        top: 55%;
        right: 10%
    }

    .stages__box--promotions .footer-socia {
        grid-template-columns: repeat(4, 19%);
        top: 11%;
        left: 53%
    }

    .stages__box--promotions .footer-socia li:first-child {
        margin-top: 60px;
        margin-right: 15px
    }
}

.stages__box--promotions .footer-socia li:first-child img {
    -webkit-animation: 7s linear infinite forwards rotateRight, 3s 1.5s forwards show;
    animation: 7s linear infinite forwards rotateRight, 3s 1.5s forwards show
}

.stages__box--promotions .footer-socia li:nth-child(2) {
    margin-right: 25px
}

.stages__box--promotions .footer-socia li:nth-child(2) img {
    -webkit-animation: 6.5s linear infinite forwards rotateRight, 3s 1.5s forwards show;
    animation: 6.5s linear infinite forwards rotateRight, 3s 1.5s forwards show
}

.stages__box--promotions .footer-socia li:nth-child(3) {
    margin-left: 25px
}

@media (max-width:1025px) {
    .stages__box--promotions .footer-socia li:nth-child(2) {
        margin-right: 15px
    }

    .stages__box--promotions .footer-socia li:nth-child(3) {
        margin-left: 15px
    }
}

.stages__box--promotions .footer-socia li:nth-child(3) img {
    -webkit-animation: 7s linear infinite forwards rotateRight, 3s 1.5s forwards show;
    animation: 7s linear infinite forwards rotateRight, 3s 1.5s forwards show
}

.stages__box--promotions .footer-socia li:nth-child(4) {
    margin-top: 80px;
    margin-left: 25px
}

.stages__box--promotions .footer-socia li:nth-child(4) img {
    -webkit-animation: 6.5s linear infinite forwards rotateRight, 3s 1.5s forwards show;
    animation: 6.5s linear infinite forwards rotateRight, 3s 1.5s forwards show
}

.stages__box--promotions .footer-socia img {
    margin-top: 0;
    z-index: 0;
    border-radius: 10px
}

.stages__box--promotions img:first-child {
    max-width: 800px;
    -webkit-animation: 2s 1s forwards stage-show-elements-2;
    animation: 2s 1s forwards stage-show-elements-2;
    opacity: 0
}

.stages__box--promotions img:nth-child(2) {
    margin-top: -250px;
    z-index: -1;
    -webkit-animation: 2s .2s forwards stage-show-elements-1;
    animation: 2s .2s forwards stage-show-elements-1;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--promotions .footer-socia li:nth-child(4) {
        margin-top: 60px;
        margin-left: 15px
    }

    .stages__box--promotions img:nth-child(2) {
        margin-top: -160px
    }
}

.stages__box--promotions img:nth-child(3) {
    max-width: 65px;
    position: absolute;
    top: 37%;
    left: 26%;
    -webkit-animation: 2s 2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--promotions img:nth-child(3) {
        left: 21%
    }
}

.stages__box--promotions img:nth-child(4) {
    max-width: 55px;
    position: absolute;
    top: 3%;
    left: 20%;
    -webkit-animation: 2s 2.3s forwards stage-show-elements-3, 2.2s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.3s forwards stage-show-elements-3, 2.2s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--promotions img:nth-child(4) {
        left: 17%
    }
}

.stages__box--promotions img:nth-child(5) {
    max-width: 40px;
    position: absolute;
    top: -40px;
    left: 47%;
    -webkit-animation: 2s 2.6s forwards stage-show-elements-3, 2.6s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.6s forwards stage-show-elements-3, 2.6s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--promotions img:nth-child(5) {
        top: -50px
    }
}

.stages__box--promotions img:nth-child(6) {
    max-width: 65px;
    position: absolute;
    top: 15%;
    right: 26%;
    -webkit-animation: 2s 2.9s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.9s forwards stage-show-elements-3, 2.4s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--promotions img:nth-child(6) {
        right: 22%
    }
}

.stages__box--promotions img:nth-child(7) {
    max-width: 50px;
    position: absolute;
    top: 47%;
    right: 21%;
    -webkit-animation: 2s 3.2s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 3.2s forwards stage-show-elements-3, 2.7s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

.stages__box--automation img:first-child {
    max-width: 720px;
    -webkit-animation: 2s 1s forwards stage-show-elements-2;
    animation: 2s 1s forwards stage-show-elements-2;
    opacity: 0
}

.stages__box--automation img:nth-child(2) {
    margin-top: -190px;
    z-index: -1;
    -webkit-animation: 2s .2s forwards stage-show-elements-1;
    animation: 2s .2s forwards stage-show-elements-1;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--promotions img:nth-child(7) {
        top: 50%;
        right: 15%
    }

    .stages__box--automation img:first-child {
        max-width: 680px
    }

    .stages__box--automation img:nth-child(2) {
        margin-top: -170px
    }
}

.stages__box--automation img:nth-child(3) {
    max-width: 90px;
    position: absolute;
    top: 0;
    left: 20%;
    -webkit-animation: 6s linear infinite forwards rotateRight, 3s 1.7s forwards show;
    animation: 6s linear infinite forwards rotateRight, 3s 1.7s forwards show;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--automation img:nth-child(3) {
        left: 17%
    }
}

@media (max-width:1025px) {
    .stages__box--automation img:nth-child(2) {
        margin-top: -125px
    }

    .stages__box--automation img:nth-child(3) {
        max-width: 60px;
        left: 14%
    }
}

.stages__box--automation img:nth-child(4) {
    max-width: 41px;
    position: absolute;
    top: -15px;
    left: 53%;
    -webkit-animation: 6s linear infinite forwards rotateRight, 3s 2s forwards show;
    animation: 6s linear infinite forwards rotateRight, 3s 2s forwards show;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--automation img:nth-child(4) {
        max-width: 40px;
        top: -30px
    }
}

.stages__box--automation img:nth-child(5) {
    max-width: 81px;
    position: absolute;
    top: 10%;
    right: 10%;
    -webkit-animation: 2s 2.4s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.4s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--automation img:nth-child(5) {
        max-width: 60px;
        top: 6%;
        right: 8%
    }
}

.stages__box--support img:first-child {
    max-width: 860px;
    -webkit-animation: 2s 1.2s forwards stage-show-elements-2;
    animation: 2s 1.2s forwards stage-show-elements-2;
    opacity: 0
}

.stages__box--support img:nth-child(2) {
    margin-top: -170px;
    margin-right: 50px;
    z-index: -1;
    -webkit-animation: 2s .2s forwards stage-show-elements-1;
    animation: 2s .2s forwards stage-show-elements-1;
    opacity: 0
}

@media (max-width:1200px) {
    .stages__box--support img:nth-child(2) {
        margin-top: -150px
    }
}

.stages__box--support img:nth-child(3) {
    max-width: 56px;
    position: absolute;
    top: 17%;
    left: 10%;
    -webkit-animation: 2s 1.6s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 1.6s forwards stage-show-elements-3, 1.8s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--support img:nth-child(2) {
        margin-top: -115px;
        margin-right: 20px
    }

    .stages__box--support img:nth-child(3) {
        max-width: 45px;
        top: 12%;
        left: 7%
    }
}

.stages__box--support img:nth-child(4) {
    max-width: 100px;
    position: absolute;
    top: 25%;
    left: 50%;
    -webkit-animation: 2s 2s forwards stage-show-elements-3, 2s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2s forwards stage-show-elements-3, 2s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--support img:nth-child(4) {
        max-width: 55px;
        top: 28%
    }
}

.stages__box--support img:nth-child(5) {
    max-width: 22px;
    position: absolute;
    top: 30%;
    right: 16%;
    -webkit-animation: 2s 2.3s forwards stage-show-elements-3, 2.2s ease-in-out infinite alternate forwards stage-show-elements-4;
    animation: 2s 2.3s forwards stage-show-elements-3, 2.2s ease-in-out infinite alternate forwards stage-show-elements-4;
    opacity: 0
}

@media (max-width:1025px) {
    .stages__box--support img:nth-child(5) {
        top: 17%;
        right: 10%
    }
}

.stages__box--support img:nth-child(6) {
    max-width: 65px;
    position: absolute;
    top: 0;
    left: 34%;
    -webkit-animation: 7s linear infinite forwards rotateRight, 3.3s 2.6s forwards show;
    animation: 7s linear infinite forwards rotateRight, 3.3s 2.6s forwards show;
    opacity: 0
}

.stages__box--support .stages__image-add {
    width: 140px;
    position: absolute;
    top: 0;
    right: 20%;
    -webkit-animation: 3.3s 3s forwards show;
    animation: 3.3s 3s forwards show;
    opacity: 0
}

.page-unavailable__image-box1::before,
.page-unavailable__image-box2::before {
    width: 90px;
    height: 90px;
    top: -10px;
    background-image: radial-gradient(49.33% 49.33% at 50% 50.67%, #fe7405 -30%, rgba(255, 186, 132, 0) 100%);
    content: ""
}

.stages__box--support .stages__image-add img:first-child {
    -webkit-animation: none;
    animation: none;
    opacity: 1
}

.stages__box--support .stages__image-add img:nth-child(2) {
    max-width: 35px;
    margin-top: 0;
    margin-right: 0;
    position: absolute;
    bottom: -10px;
    left: -10px;
    z-index: 1;
    -webkit-animation: 1s linear forwards show, 1s ease-in-out 1s infinite alternate forwards scale2;
    animation: 1s linear forwards show, 1s ease-in-out 1s infinite alternate forwards scale2;
    opacity: 0
}

.stages__box--support .stages__image-add img:nth-child(3) {
    max-width: 33px;
    margin-top: 0;
    margin-right: 0;
    position: absolute;
    top: 5px;
    bottom: 0;
    left: 30px;
    z-index: 1;
    -webkit-animation: 1s linear forwards show, 1s ease-in-out infinite alternate forwards scale;
    animation: 1s linear forwards show, 1s ease-in-out infinite alternate forwards scale;
    opacity: 0
}

.stages__box--support .stages__image-add img:nth-child(4) {
    max-width: 35px;
    position: absolute;
    top: 58%;
    left: 62%;
    -webkit-animation: 1s linear forwards show, 1s ease-in-out 2s infinite alternate forwards scale2;
    animation: 1s linear forwards show, 1s ease-in-out 2s infinite alternate forwards scale2;
    opacity: 0
}

.stages__box--support .stages__image-add img:nth-child(5) {
    max-width: 33px;
    position: absolute;
    top: -16%;
    right: -16px;
    -webkit-animation: 1s linear forwards show, 1s ease-in-out 1s infinite alternate forwards scale;
    animation: 1s linear forwards show, 1s ease-in-out 1s infinite alternate forwards scale;
    opacity: 0
}

.stages__image a {
    position: relative;
    color: #000
}

.stages__image a span {
    width: 122px;
    padding: 20px 0;
    position: absolute;
    transform: translate(0, 64px);
    transition: .4s linear;
    z-index: 1;
    font-family: ProximaNova-Bold, arial, sans-serif;
    font-size: 15px;
    line-height: 15px;
    text-align: center
}

.stages__image a:hover img {
    transform: translateX(30px);
    transition: .4s linear
}

.stages__image a:hover span {
    transform: translate(30px, 64px);
    transition: .4s linear;
    background-color: #d6516b
}

.stages__image a img {
    width: 150px;
    display: grid;
    transition: .4s linear
}

.stages__image--active a span {
    width: 122px;
    transform: translate(0, 95px);
    font-size: 16px;
    line-height: 16px
}

@media (max-width:1025px) {
    .stages__box--support img:nth-child(6) {
        max-width: 50px;
        top: -20px;
        left: 31%
    }

    .stages__image a span {
        width: 110px;
        padding: 18px 0;
        font-size: 14px;
        line-height: 14px;
        transform: translate(0, 57px)
    }

    .stages__image a:hover span {
        transform: translate(30px, 57px)
    }

    .stages__image a img {
        width: 135px
    }

    .stages__image--active a span {
        width: 110px;
        font-size: 15px;
        line-height: 15px;
        transform: translate(0, 90px)
    }
}

.stages__image--active a img {
    width: 230px;
    transform: translateX(-40px)
}

.stages__image--active a:hover img {
    transform: translateX(-40px);
    transition: .4s linear
}

.stages__image--active a:hover span {
    transform: translate(0, 95px);
    transition: .4s linear;
    background-color: transparent
}

.stages__text {
    max-width: 1000px;
    margin: 45px 10% 0 23%
}

@media (max-width:1025px) {
    .stages__image--active a img {
        width: 215px
    }

    .stages__image--active a:hover span {
        transform: translate(0, 90px)
    }

    .stages__text {
        margin: 40px 5% 0 30%
    }
}

.stages__text ol {
    padding: 0;
    margin: 0 0 30px 20px
}

.stages__text ol p {
    margin: 0
}

.stages__text ul {
    margin: 0 0 30px;
    padding: 0;
    list-style: none
}

.stages__text h2,
.stages__text p {
    margin-bottom: 10px
}

.stages__text ul p {
    margin: 0;
    padding-left: 20px;
    position: relative
}

.stages__text ul p::before {
    width: 10px;
    height: 2px;
    position: absolute;
    content: "";
    top: 10px;
    left: 0;
    background-color: #a62e41
}

.stages__text h2 {
    font-family: Mistral, arial, sans-serif;
    font-size: 36px;
    line-height: 36px;
    font-weight: 400
}

.blog__text p,
.blog__time time,
.breadcrumbs__list .breadcrumbs__link,
.cookie h3,
.feedback__box article p,
.feedback__box-title strong,
.feedback__title strong,
.pagination__list a,
.stages__coffee-box p {
    font-family: ProximaNova-Bold, arial, sans-serif
}

.stages__text strong {
    color: #0a3d76
}

@media (max-width:767px) {
    .stages__text {
        margin: 0 auto;
        padding: 0 10px
    }

    .stages__text a {
        margin: 0 auto
    }

    .stages__coffee {
        max-width: 470px;
        margin: 0 auto
    }
}

.stages__coffee-box {
    margin: 100px 0 20px;
    display: grid;
    grid-template-columns: 260px auto;
    grid-gap: 0 24px;
    align-items: center
}

.stages__coffee-box p {
    font-size: 24px;
    line-height: 31px;
    color: #0a3d76
}

.feedback-slider__swiper-button-prev:hover::after,
.stages__coffee-box strong {
    color: #a62e41
}

.stages__coffee-image img:first-child {
    max-width: 170px
}

.stages__coffee-image img:nth-child(2) {
    max-width: 130px;
    position: absolute;
    top: -40px;
    right: 0;
    -webkit-animation: 1.5s ease-in-out infinite alternate forwards rotateCoffeePrice;
    animation: 1.5s ease-in-out infinite alternate forwards rotateCoffeePrice
}

.stages__coffee-image img:nth-child(3) {
    max-width: 35px;
    position: absolute;
    top: -75px;
    left: 70px;
    -webkit-animation: 2s ease-in-out infinite alternate forwards coffeeOpacity;
    animation: 2s ease-in-out infinite alternate forwards coffeeOpacity;
    opacity: 0
}

.stages__coffee-image img:nth-child(4) {
    max-width: 35px;
    position: absolute;
    top: -85px;
    left: 68px;
    -webkit-animation: 2s ease-in-out 2s infinite alternate forwards coffeeOpacity;
    animation: 2s ease-in-out 2s infinite alternate forwards coffeeOpacity;
    opacity: 0
}

.stages__coffee-image img:nth-child(5) {
    max-width: 260px;
    display: none
}

.breadcrumbs__list .breadcrumbs__link--active::after,
.breadcrumbs__list .breadcrumbs__link--active::before,
.feedback .main-footer__nav,
.page-unavailable__image img:nth-child(7) {
    display: none
}

.pagination__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(7, 3%);
    justify-content: center
}

@media (max-width:1025px) {
    .pagination__list {
        grid-template-columns: repeat(7, 5%)
    }
}

.pagination__list li {
    border-radius: 5px
}

.pagination__list a {
    padding: 7px 0;
    display: block;
    text-align: center
}

.pagination__list span {
    margin-top: 7px;
    display: block;
    text-align: center
}

.pagination__list .pagination__link-active {
    background-color: #0a3d76
}

.pagination__list .pagination__link-active a {
    color: #fff
}

.breadcrumbs__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap
}

.breadcrumbs__list .breadcrumbs__link {
    padding-right: 30px;
    color: #0a3d76;
    position: relative
}

.breadcrumbs__list .breadcrumbs__link::before {
    width: 8px;
    height: 2px;
    position: absolute;
    content: "";
    top: 9px;
    right: 10px;
    background-color: #0a3d76;
    transform: rotate(45deg)
}

.breadcrumbs__list .breadcrumbs__link::after {
    width: 8px;
    height: 2px;
    position: absolute;
    content: "";
    top: 14px;
    right: 10px;
    background-color: #0a3d76;
    transform: rotate(-45deg)
}

.breadcrumbs__list .breadcrumbs__link--active {
    font-family: ProximaNova-Regular, arial, sans-serif;
    color: #000
}

.breadcrumbs__list .breadcrumbs__link--active:active {
    font-weight: 400
}

.page-unavailable__wrapper {
    height: 79vh;
    margin-top: 75px;
    display: grid;
    grid-gap: 0 2%;
    align-items: center;
    grid-template-columns: 51% auto
}

@media (max-width:1025px) {
    .page-unavailable__wrapper {
        height: auto;
        margin-top: 65px;
        grid-template-columns: 1fr;
        padding: 100px 120px
    }

    .page-unavailable__box-text h1 {
        margin-top: 0
    }
}

.page-unavailable__image img:nth-child(2) {
    position: absolute;
    top: 15px;
    left: 0;
    z-index: 1;
    -webkit-animation: 2.5s .5s forwards services-icon-show, 3.2s linear 3.5s infinite alternate forwards services-icon-movement;
    animation: 2.5s .5s forwards services-icon-show, 3.2s linear 3.5s infinite alternate forwards services-icon-movement;
    opacity: 0
}

.page-unavailable__image img:nth-child(3) {
    max-width: 80px;
    position: absolute;
    top: 40px;
    left: 40px;
    -webkit-animation: 6s linear 1s infinite forwards rotateRight, 3s 2s forwards show;
    animation: 6s linear 1s infinite forwards rotateRight, 3s 2s forwards show;
    opacity: 0
}

.page-unavailable__image img:nth-child(4) {
    max-width: 60px;
    position: absolute;
    top: 0;
    left: 120px;
    -webkit-animation: 6s linear 1s infinite forwards rotateLeft, 3s 2s forwards show;
    animation: 6s linear 1s infinite forwards rotateLeft, 3s 2s forwards show;
    opacity: 0
}

.page-unavailable__image img:nth-child(5) {
    max-width: 60px;
    position: absolute;
    top: -60px;
    right: 15%;
    -webkit-animation: 6s linear 1s infinite forwards rotateLeft, 3s 2s forwards show;
    animation: 6s linear 1s infinite forwards rotateLeft, 3s 2s forwards show;
    opacity: 0
}

.page-unavailable__image img:nth-child(6) {
    max-width: 80px;
    position: absolute;
    top: -4%;
    left: 84%;
    -webkit-animation: 6s linear 1s infinite forwards rotateRight, 3s 2s forwards show;
    animation: 6s linear 1s infinite forwards rotateRight, 3s 2s forwards show;
    opacity: 0
}

.page-unavailable__image-box1 {
    width: 70px;
    height: 70px;
    position: absolute;
    top: 45%;
    left: 15%
}

.page-unavailable__image-box1::before {
    position: absolute;
    left: 0;
    -webkit-animation: 1s linear infinite alternate flickers;
    animation: 1s linear infinite alternate flickers
}

.page-unavailable__image-box1 img {
    max-width: 70px;
    position: absolute
}

.page-unavailable__image-box2 {
    width: 85px;
    height: 85px;
    position: absolute;
    top: 50%;
    right: 15%
}

.page-unavailable__image-box2::before {
    position: absolute;
    left: 10px;
    -webkit-animation: 1s linear infinite alternate flickers;
    animation: 1s linear infinite alternate flickers
}

.page-unavailable__image-box2 img {
    max-width: 85px;
    position: absolute
}

.page-unavailable__box-text h1 {
    margin: 0;
    font-size: 36px;
    line-height: 44px;
    text-align: left
}

.page-unavailable__box-text p {
    margin: 15px 0 30px;
    font-size: 18px;
    line-height: 24px
}

.feedback {
    display: grid;
    grid-template-columns: 1fr 1fr;
    background-color: #f5f9ff
}

@media (max-width:1200px) {
    .stages__box--support .stages__image-add {
        top: -30px;
        right: 13%
    }

    .stages__coffee-box {
        grid-gap: 0 10px
    }

    .page-unavailable__image-box1 {
        top: 35%;
        left: 12%
    }

    .page-unavailable__image-box1 img {
        top: 44%;
        left: 9%
    }

    .page-unavailable__image-box2 {
        top: 34%
    }

    .page-unavailable__image-box2 img {
        top: 44%;
        left: 9%
    }

    .feedback {
        grid-template-columns: 40% auto
    }
}

.feedback__wrapper-box {
    height: 100vh;
    padding: 100px 30px 20px
}

@media (max-width:1025px) {
    .feedback {
        grid-template-columns: 1fr
    }

    .feedback__wrapper-box {
        height: auto;
        padding: 100px 100px 20px
    }
}

.feedback__wrapper-left {
    margin: 0 0 0 auto;
    max-width: 860px;
    width: 100%;
    overflow-y: scroll
}

.feedback__wrapper-left h1,
.portfolio-page__cell,
.sharing-list a img:nth-child(3),
.sharing-list a:hover img:nth-child(2) {
    display: none
}

.feedback__wrapper-left::-webkit-scrollbar {
    width: 5px;
    background-color: #f5f9ff
}

.feedback__wrapper-left::-webkit-scrollbar-thumb {
    background-color: #0a3d76;
    border-radius: 10px
}

.feedback__wrapper-right {
    padding-top: 75px;
    display: grid;
    box-shadow: -2px 0 8px rgba(0, 48, 121, .3)
}

.article__title h1,
.feedback__wrapper-right h1 {
    text-align: left
}

.feedback__wrapper-right .main-footer {
    align-self: flex-end
}

.feedback__wrapper-right .main-footer .main-footer__wrapper {
    padding: 10px 110px 10px 30px;
    grid-template-columns: repeat(2, auto)
}

.feedback__box-title {
    padding-bottom: 25px;
    display: grid;
    grid-template-columns: repeat(2, auto);
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #0a3d76
}

.feedback__box-title strong {
    font-size: 24px;
    line-height: 24px
}

.feedback__box-title a {
    width: 200px;
    padding: 13px 0;
    font-size: 16px;
    line-height: 16px
}

.feedback__box-logotypes {
    margin: 30px 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(230px, auto));
    justify-content: center;
    grid-gap: 30px 30px
}

.feedback__box-logotypes article {
    min-height: 130px;
    background-color: #f5f9ff;
    border: 1px solid #fff;
    border-radius: 5px;
    box-shadow: -10px -10px 20px rgba(255, 255, 255, .3), 10px 10px 20px rgba(68, 69, 70, .15), inset 4px 4px 15px rgba(255, 255, 255, .3);
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: 1fr 0;
    justify-content: center;
    align-items: center;
    overflow: hidden;
    transition: background-color .3s linear
}

.feedback__box-logotypes img {
    -o-object-fit: none;
    object-fit: none;
    transition: .3s linear
}

.feedback__box-logotypes p {
    padding: 5px;
    margin: 0;
    text-align: center;
    font-size: 16px;
    line-height: 21px;
    background-color: #f5f9ff;
    transform: translateY(55%);
    transition: .3s linear
}

.cube div,
.cubs--odc .cube div {
    box-sizing: border-box;
    padding: 10px;
    width: 100%
}

.feedback__box-logotypes a {
    display: block
}

.feedback__box-logotypes .feedback__box-info--active .red p,
.feedback__box-logotypes a:hover .red p {
    background-color: #b51a1a
}

.feedback__box-logotypes .feedback__box-info--active .orange p,
.feedback__box-logotypes a:hover .orange p {
    background-color: #f17401
}

.feedback__box-logotypes a:hover .yellow p {
    background: #e7d801;
    color: #000;
    font-weight: 800
}

.feedback__box-logotypes .feedback__box-info--active .green p,
.feedback__box-logotypes a:hover .green p {
    background-color: #238800
}

.feedback__box-logotypes .feedback__box-info--active .dark-green p,
.feedback__box-logotypes a:hover .dark-green p {
    background-color: #07655b
}

.feedback__box-logotypes .feedback__box-info--active .light-blue p,
.feedback__box-logotypes a:hover .light-blue p {
    background-color: #0197f1
}

.feedback__box-logotypes .feedback__box-info--active .blue p,
.feedback__box-logotypes a:hover .blue p {
    background-color: #1e4180
}

.feedback__box-logotypes .feedback__box-info--active .violet p,
.feedback__box-logotypes a:hover .violet p {
    background-color: #4b176c
}

.feedback__box-logotypes .feedback__box-info--active .dark-pink p,
.feedback__box-logotypes a:hover .dark-pink p {
    background-color: #960679
}

.feedback__box-logotypes a:hover .brown p {
    background-color: #3e3728;
    font-weight: 400
}

.feedback__box-logotypes .feedback__box-info--active .black p,
.feedback__box-logotypes a:hover .black p {
    background-color: #000
}

.feedback__box-logotypes a:hover img {
    transform: translateY(-30%);
    transition: .3s linear
}

.feedback__box-logotypes a:hover p {
    transition: .3s linear;
    transform: translateY(-50%);
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    line-height: 21px
}

.feedback__box-logotypes .feedback__box-info--active img {
    transform: translateY(-30%)
}

.feedback__box-logotypes .feedback__box-info--active p {
    transform: translateY(-50%);
    color: #fff;
    font-weight: 400;
    font-size: 16px;
    line-height: 21px
}

.feedback__box-logotypes .feedback__box-info--active .yellow p {
    background: #e7d801;
    color: #000;
    font-weight: 800;
    font-size: 16px;
    line-height: 21px
}

.feedback__box-logotypes .feedback__box-info--active .brown p {
    background-color: #3e3728;
    font-weight: 400;
    font-size: 16px;
    line-height: 21px
}

.feedback__box {
    position: relative;
    max-width: 800px;
    padding: 0 70px
}

@media (max-width:1200px) {
    .feedback__box-title strong {
        font-size: 20px;
        line-height: 20px
    }

    .feedback__box-logotypes {
        padding-bottom: 30px
    }

    .feedback__box {
        padding: 0 30px
    }

    .feedback-slider__swiper-button-next {
        right: 15px
    }
}

@media (max-width:1025px) {
    .feedback__wrapper-left {
        max-width: 100%
    }

    .feedback__wrapper-left h1 {
        margin: 0 0 30px;
        display: block
    }

    .feedback__wrapper-right {
        height: auto;
        padding-top: 0;
        box-shadow: none
    }

    .feedback__box-logotypes,
    .feedback__wrapper-right h1 {
        display: none
    }

    .feedback__box {
        padding: 0 100px;
        max-width: 100%;
        margin: 0 auto
    }
}

.feedback__box article {
    margin-bottom: 60px;
    display: none
}

.feedback__box article p {
    max-width: 550px;
    margin: 15px 0 30px;
    font-style: italic;
    grid-column: 1/3
}

.feedback__box article iframe {
    width: 100%;
    height: 400px;
    border: none;
    display: block
}

.feedback__box .youtube {
    position: relative;
    cursor: pointer
}

.feedback__box .youtube img {
    max-width: 670px;
    height: 500px;
    display: block
}

@media (max-width:1025px) {
    .feedback__box article {
        display: block
    }

    .feedback__box .youtube img {
        height: 460px
    }
}

.feedback__box .youtube:hover .play-button::before {
    width: 70px;
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    background-image: url("../img/svg/play-button-2.svg")
}

.feedback__box .youtube .play-button::before {
    width: 70px;
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    background-image: url("../img/svg/play-button.svg")
}

.feedback__box .feedback-active {
    display: block
}

.feedback__title {
    display: grid;
    grid-template-columns: auto;
    align-items: center
}

.feedback__title strong {
    font-size: 24px;
    line-height: 36px
}

.feedback__title span {
    display: block;
    margin-bottom: 15px
}

.feedback-slider__swiper-container .swiper-slide {
    position: relative;
    cursor: pointer
}

.feedback-slider__swiper-container .swiper-slide:hover .play-button::before {
    width: 70px;
    height: 50px;
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-image: url("../img/svg/play-button-2.svg");
    background-repeat: no-repeat
}

.feedback-slider__swiper-container .swiper-slide .play-button::before {
    width: 70px;
    position: absolute;
    content: "";
    top: 50%;
    left: 50%;
    background-image: url("../img/svg/play-button.svg")
}

.feedback-slider__swiper-container .swiper-slide img,
.sharing-list a:hover img:nth-child(3) {
    display: block
}

.feedback-slider__swiper-container .swiper-slide iframe {
    width: 100%;
    height: 380px;
    border: none;
    display: block
}

.feedback-slider__swiper-button-prev::after {
    color: #0a3d76;
    font-size: 24px;
    font-weight: 800
}

.custom-service .swiper-button-prev:after,
.feedback-slider__swiper-button-next::after,
.swiper-button-next:after {
    color: #0a3d76;
    font-size: 24px;
    font-weight: 800
}

.feedback-slider__swiper-button-next:hover::after {
    color: #a62e41
}

.cookie {
    width: 100%;
    max-width: 1100px;
    padding: 0 15px;
    position: fixed;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: none
}

.cookie h3 {
    display: grid;
    grid-template-columns: 24px auto;
    align-items: center;
    grid-gap: 0 10px;
    font-size: 24px;
    line-height: 24px;
    color: #0a3d76
}

.cookie .cookie__btn {
    background-color: transparent;
    border: none;
    outline: 0;
    cursor: pointer;
    right: 25px
}

.cookie__inner {
    padding: 24px 30px;
    background-color: #f5f9ff;
    box-shadow: -2px -2px 6px rgba(0, 0, 0, .1), 6px 6px 15px rgba(0, 0, 0, .1);
    border-radius: 10px;
    display: grid;
    grid-template-columns: 75% auto;
    grid-gap: 0 30px;
    align-items: center
}

.button {
    max-width: 235px;
    width: 100%;
    padding: 15px 0;
    font-family: ProximaNova-Regular, arial, sans-serif;
    font-size: 18px;
    line-height: 18px;
    text-transform: uppercase;
    color: #f5f9ff;
    border: none;
    box-shadow: -4px -4px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(0, 0, 0, .3);
    border-radius: 8px;
    cursor: pointer;
    outline: 0;
    display: grid;
    justify-content: center;
    justify-self: center
}

.button:hover {
    -webkit-animation: .7s ease-in-out both rotate;
    animation: .7s ease-in-out both rotate;
    background-image: linear-gradient(90.02deg, #e2031e 5.42%, #8d1400 94.13%);
    box-shadow: -6px -6px 20px rgba(255, 255, 255, .8), 8px 8px 16px rgba(0, 0, 0, .3)
}

.tabs li input:checked+label,
.tabs__btn:focus,
.tags li input:checked+label {
    box-shadow: inset -5px -5px 5px rgba(240, 242, 243, .5), inset 5px 5px 10px rgba(166, 180, 200, .75);
    font-weight: 800
}

.button:hover span {
    -webkit-animation: .7s ease-in-out 60ms both storm;
    animation: .7s ease-in-out 60ms both storm;
    color: #fff
}

.button--order,
.button--order:hover {
    background-image: none;
    background-color: #a62e41
}

.back,
.front {
    background: linear-gradient(180deg, #0a3d76 0, #0c53a3 100%)
}

.cubs {
    position: absolute;
    top: 25px;
    left: 45%;
    perspective: 1000px;
    perspective-origin: 50% 50%
}

.cube,
.cubs--acca .cube {
    position: relative;
    height: 110px;
    width: 110px;
    transform-style: preserve-3d;
    margin: auto
}

.cube {
    -webkit-animation: 20s linear infinite rotate1;
    animation: 20s linear infinite rotate1
}

.cube div,
.cubs--acca,
.cubs--odc,
.cubs--odc .cube div {
    position: absolute
}

.cube div {
    height: 100%;
    color: #fff;
    display: grid;
    justify-content: center;
    align-items: center
}

.cube span {
    display: block;
    font-size: 20px;
    line-height: 23px;
    text-align: center
}

.front {
    transform: translateZ(10px)
}

.back {
    transform: translateZ(-100px) rotateY(180deg)
}

.right {
    transform: rotateY(-270deg) translateX(100px);
    transform-origin: top right;
    background: linear-gradient(134.29deg, #0a3d76 6.98%, #1072df 88.54%)
}

.left {
    transform: rotateY(270deg) translateX(-100px);
    transform-origin: center left;
    background: linear-gradient(180deg, #0a3d76 0, #0c53a3 100%)
}

.top {
    transform: rotateX(-270deg) translateY(-100px);
    transform-origin: top center;
    background: linear-gradient(180deg, #0a3d76 0, #0067db 100%)
}

.bottom {
    transform: rotateX(270deg) translateY(100px);
    transform-origin: bottom center;
    background: linear-gradient(180deg, #0a3d76 0, #0d65c7 100%)
}

.cubs--acca {
    top: 205px;
    left: 36%;
    perspective: 1000px;
    perspective-origin: 50% 50%
}

@media (max-width:1200px) {
    .cubs--acca {
        top: 210px;
        left: 35%
    }
}

.cubs--acca .cube {
    -webkit-animation: 10s linear .5s infinite rotate1;
    animation: 10s linear .5s infinite rotate1
}

.cubs--acca .cube div {
    position: absolute;
    box-sizing: border-box;
    height: 100%;
    width: 100%;
    color: #fff
}

.cubs--acca .front {
    transform: translateZ(10px);
    background: linear-gradient(271.23deg, #a62e41 4.07%, #e13152 96.09%)
}

@media (max-width:1025px) {
    .cookie__inner {
        grid-template-columns: 1fr
    }

    .cube,
    .cubs--acca .cube {
        width: 90px;
        height: 90px
    }

    .cubs--acca .front,
    .front {
        transform: translateZ(-10px)
    }
}

.cubs--acca .back {
    transform: translateZ(-100px) rotateY(180deg);
    background: linear-gradient(314.81deg, #8f1a2d 10.67%, #e13152 92.69%)
}

.cubs--acca .right {
    transform: rotateY(-270deg) translateX(100px);
    transform-origin: top right;
    background: linear-gradient(310.84deg, #a62e41 5.99%, #fd224b 96.13%)
}

.cubs--acca .left {
    transform: rotateY(270deg) translateX(-100px);
    transform-origin: center left;
    background: linear-gradient(271.23deg, #961d30 4.07%, #e13152 96.09%)
}

.cubs--acca .top {
    transform: rotateX(-270deg) translateY(-100px);
    transform-origin: top center;
    background: linear-gradient(289.84deg, #891b2d 15.52%, #e13152 93.43%)
}

.cubs--acca .bottom {
    transform: rotateX(270deg) translateY(100px);
    transform-origin: bottom center;
    background: linear-gradient(307.94deg, #892031 12.72%, #e13152 91.13%)
}

.cubs--odc .back,
.cubs--odc .front {
    background: linear-gradient(179.71deg, #b4d1fa .25%, #69a7ff 94.22%)
}

.cubs--odc {
    top: 170px;
    left: 57%;
    perspective: 1000px;
    perspective-origin: 50% 50%
}

.cubs--odc .cube {
    margin: auto;
    position: relative;
    height: 110px;
    width: 110px;
    transform-style: preserve-3d;
    -webkit-animation: 10s linear .5s infinite rotate3;
    animation: 10s linear .5s infinite rotate3
}

.cubs--odc .cube div {
    height: 100%;
    color: #fff
}

.cubs--odc .front {
    transform: translateZ(10px)
}

@media (max-width:1025px) {
    .cubs--odc .cube {
        width: 90px;
        height: 90px
    }

    .cubs--odc .front {
        transform: translateZ(-10px)
    }
}

.cubs--odc .back {
    transform: translateZ(-100px) rotateY(180deg)
}

.cubs--odc .left,
.cubs--odc .right {
    background: linear-gradient(254.83deg, #b4d1fa 8.51%, #69a7ff 93.05%)
}

.cubs--odc .right {
    transform: rotateY(-270deg) translateX(100px);
    transform-origin: top right
}

.cubs--odc .left {
    transform: rotateY(270deg) translateX(-100px);
    transform-origin: center left
}

.cubs--odc .top {
    transform: rotateX(-270deg) translateY(-100px);
    transform-origin: top center;
    background: linear-gradient(179.71deg, #b4d1fa .25%, #69a7ff 94.22%)
}

.cubs--odc .bottom {
    transform: rotateX(270deg) translateY(100px);
    transform-origin: bottom center;
    background: linear-gradient(179.89deg, #b4d1fa -5.51%, #69a7ff 58.32%)
}

.portfolio-page__image::after,
.portfolio-page__image::before {
    width: 45px;
    height: 615px;
    background-image: url("../img/svg/latch.svg");
    content: ""
}

.advantages__header,
.blog__box,
.portfolio-page__development {
    margin-bottom: 60px
}

.blog__list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, 32%);
    grid-gap: 30px
}

@media (max-width:1025px) {
    .blog__list {
        grid-template-columns: repeat(2, 1fr)
    }
}

.blog__card {
    height: 100%;
    min-height: 260px;
    border: 4px solid #fff;
    border-radius: 10px;
    box-shadow: -10px -10px 20px rgba(255, 255, 255, .5), 10px 10px 20px rgba(68, 69, 70, .1), inset 4px 4px 15px rgba(255, 255, 255, .4);
    transition: .2s linear;
    background-color: #f0f6ff
}

@media (max-width:1025px) {
    .blog__card {
        min-height: 220px
    }
}

.blog__card:hover img {
    transform: scale(1.1);
    transition: 1s
}

.blog__image {
    position: relative;
    overflow: hidden;
    border-top-right-radius: 5px;
    border-top-left-radius: 5px
}

.blog__image img {
    display: block;
    filter: brightness(.5);
    transition: 1s
}

.blog__text p {
    margin: 0;
    padding: 15px 25px;
    font-size: 24px;
    line-height: 29px
}

.blog__time {
    position: absolute;
    bottom: 2%;
    right: 4%
}

.blog__time time {
    color: #fff
}

.article {
    margin: 80px 0 70px
}

.article__title a {
    display: grid;
    grid-template-columns: 48px auto;
    grid-gap: 0 20px;
    align-items: center
}

.article__title a img {
    display: grid;
    transition: .2s linear
}

.article__title a:hover img {
    transform: translateX(-10px);
    transition: .2s linear
}

.article__box-sharing {
    margin-top: 20px;
    display: grid;
    grid-template-columns: 14% 16%;
    grid-gap: 0 10px;
    align-items: center
}

@media (max-width:1200px) {
    .cubs--odc {
        left: 62%
    }

    .article__box-sharing {
        grid-template-columns: 16% 18%
    }
}

@media (max-width:1025px) {
    .blog__text p {
        font-size: 16px;
        line-height: 19px
    }

    .blog__time time {
        font-size: 14px;
        line-height: 17px
    }

    .article__box-sharing {
        grid-template-columns: 170px 1fr
    }
}

.article__box-sharing time {
    font-family: ProximaNova-Regular, arial, sans-serif;
    color: #a62e41
}

.article__box-articles .article__box-wrapper h3,
.article__box-text h3,
.article__box-text strong,
.portfolio-page__advantages p,
.portfolio-page__box .portfolio-page__order-image span,
.portfolio-page__box p,
.portfolio-page__box-add h2,
.portfolio-page__box-add h3,
.portfolio-page__box-add p,
.portfolio-page__box-info .portfolio-page__box-text a,
.portfolio-page__feedback .feedback__title p,
.portfolio-page__info h3,
.portfolio-page__leadmagnit a,
.portfolio-page__scroll p,
.portfolio-page__tags span,
.portfolio__card-perspective p,
.tags li label {
    font-family: ProximaNova-Bold, arial, sans-serif
}

.article__box-articles {
    width: 270px;
    min-height: 500px;
    position: absolute;
    top: 0;
    right: 30px
}

.article__box-articles .article__box-wrapper {
    position: sticky;
    top: 110px
}

.article__box-articles .article__box-wrapper h3 {
    margin-top: 15px;
    margin-bottom: 15px;
    font-size: 24px;
    line-height: 24px;
    color: #0a3d76
}

.article__box-articles .blog__list {
    grid-template-columns: 1fr
}

@media (max-width:1025px) {
    .article__box-articles {
        height: auto;
        width: auto;
        min-height: auto;
        position: static
    }

    .article__box-articles .article__box-wrapper h3 {
        text-align: center
    }

    .article__box-articles .blog__list {
        grid-template-columns: repeat(2, 1fr)
    }
}

.article__box-articles .blog__list p {
    font-size: 16px;
    line-height: 24px
}

.article__box-articles .blog__card {
    min-height: auto
}

.article__box-text {
    padding-right: 270px
}

.article__box-text h2 {
    margin-top: 20px;
    margin-bottom: 10px;
    max-width: 800px;
    font-size: 36px;
    line-height: 36px;
    text-transform: none;
    letter-spacing: 0
}

.article__box-text h3 {
    margin: 30px 0 10px;
    font-size: 24px;
    line-height: 24px;
    color: #0a3d76
}

.article__box-text p,
.article__box-text ul>li {
    max-width: 750px;
    margin: 0 0 10px
}

.article__box-text strong {
    margin: 15px 0 10px
}

.article__box-text span {
    max-width: 600px;
    padding-left: 40px;
    font-size: 18px;
    line-height: 27px;
    display: grid;
    position: relative
}

.article__box-text span::before {
    width: 2px;
    height: 100%;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-color: #a62e41
}

.article__box-text ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.article__box-text ul p {
    padding-left: 25px;
    position: relative
}

.article__box-text ul p::before {
    width: 10px;
    height: 2px;
    position: absolute;
    content: "";
    top: 10px;
    left: 0;
    background-color: #a62e41
}

.sharing-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 0 15px
}

@media (max-width:1025px) {
    .article__box-text {
        padding-right: 0
    }

    .article__box-text p,
    .article__box-text ul>li {
        max-width: 750px
    }

    .article__box-text span {
        max-width: 700px;
        padding-left: 20px
    }

    .sharing-list {
        grid-template-columns: repeat(5, 20px)
    }
}

.sharing-list a:hover img {
    transform: scale(1.2)
}

.user-button {
    display: block;
    position: relative;
    cursor: pointer
}

.user-button span {
    width: 300px;
   /* top: -30px;*/
    /* left: -75px;*/
    position: absolute;
    display: none;
    font-weight: 800;
    color: #a62e41
}

.portfolio .breadcrumbs {
    margin: 0 auto
}

.portfolio__list {
    margin: 60px 0 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, 32%);
    grid-gap: 23px 23px
}

@media (max-width:1025px) {
    .portfolio__list {
        grid-template-columns: repeat(2, 1fr)
    }
}

.portfolio__list a:hover h2 {
    color: #a62e41
}

.portfolio__list a:hover p {
    color: #333
}

.portfolio__list a:hover img {
    transform: scale(1.02);
    transition: .3s
}

.portfolio__list a:hover .portfolio__box-card--project p,
.white button {
    color: #fff
}

.portfolio__box-card {
    height: 100%;
    perspective: 1000px;
    transform-style: preserve-3d
}

.portfolio__box-card--project .portfolio__card-perspective {
    display: grid;
    grid-template-rows: 1fr auto
}

.portfolio__box-card--project .portfolio__image {
    display: grid;
    justify-items: center;
    align-items: center
}

.portfolio__box-card--project .portfolio__image p {
    font-size: 30px;
    line-height: 36px;
    text-align: center;
    color: #fff
}

.portfolio__box-card--project .button {
    margin: 20px auto 30px
}

.portfolio__card,
.services__price article {
    height: 100%
}

.portfolio__card-perspective {
    height: 100%;
    box-shadow: -10px -10px 20px rgba(255, 255, 255, .3), 10px 10px 20px rgba(68, 69, 70, .15), inset 4px 4px 15px rgba(255, 255, 255, .3);
    border-radius: 10px;
    border: 4px solid #fff;
    background-repeat: no-repeat;
    background-size: cover;
    transition: transform .2s
}

.portfolio__card-perspective h2 {
    padding: 10px 0;
    font-size: 24px;
    line-height: 24px;
    color: #0a3d76;
    text-transform: none;
    text-align: center
}

.portfolio__card-perspective p {
    margin: 0;
    padding: 0 16px 15px;
    text-align: center
}

.portfolio__image {
    padding: 15px 10px 0
}

.portfolio__image img {
    display: block;
    border: 4px solid #eee;
    border-radius: 5px;
    transition: .3s
}

.portfolio-page {
    margin-top: 75px
}

.portfolio-page__wrapper {
    height: 100vh;
    max-width: 100%;
    padding: 0 20px;
    position: relative;
    display: grid;
    align-items: center;
    grid-template-columns: 20% 30% auto
}

@media (max-width:1440px) {
    .portfolio-page__wrapper {
        grid-template-columns: 10% 40% auto
    }
}

@media (max-width:1200px) {
    .portfolio-page__wrapper {
        grid-template-columns: 5% 40% auto
    }
}

@media (max-width:1025px) {
    .portfolio-page {
        margin-top: 65px
    }

    .portfolio-page__wrapper {
        margin: 0;
        padding: 70px 30px 120px;
        grid-template-columns: 1fr
    }

    .portfolio-page__cell {
        margin-bottom: 60px;
        display: block
    }

    .portfolio-page__cell p {
        padding-left: 20px;
        position: relative
    }

    .portfolio-page__cell p::before {
        width: 10px;
        height: 2px;
        position: absolute;
        content: "";
        top: 10px;
        left: 0;
        background-color: #a62e41
    }
}

.portfolio-page__wrapper--active {
    transform: translateY(0);
    transition: 1s linear
}

.portfolio-page__wrapper--active .portfolio-page__image a:hover::before {
    width: 100%;
    height: 100%;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    background-image: url("../img/svg/icon-eye.svg");
    background-repeat: no-repeat;
    background-position: 46% 50%
}

.portfolio-page__cell ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.portfolio-page__button-next a::before,
.portfolio-page__button-prev a::before {
    width: 13px;
    height: 20px;
    background-image: url("../img/svg/icon-arrow-portfolio.svg")
}

.portfolio-page__box {
    max-width: 500px;
    margin-left: 10%;
    transition: .6s linear
}

@media (max-width:1200px) {
    .portfolio-page__box {
        margin-left: 19%
    }
}

@media (max-width:1025px) {
    .portfolio-page__box {
        max-width: 550px;
        margin: 0 auto
    }
}

.portfolio-page__box h1 {
    margin: 0 0 15px;
    font-size: 48px;
    line-height: 48px;
    text-align: left
}

@media (max-width:1200px) {
    .portfolio-page__box h1 {
        font-size: 44px;
        line-height: 44px
    }
}

@media (max-width:1025px) {
    .portfolio-page__box h1 {
        font-size: 36px;
        line-height: 36px
    }
}

.portfolio-page__box p {
    margin: 0 0 16px;
    font-size: 18px;
    line-height: 23px;
    letter-spacing: .05em
}

@media (max-width:767px) {
    .stages__coffee-box {
        grid-gap: 0 14px;
        margin-top: 30px
    }

    .stages__coffee-box p {
        font-size: 20px;
        line-height: 24px
    }

    .page-unavailable__image img:first-child,
    .page-unavailable__image img:nth-child(2),
    .page-unavailable__image img:nth-child(3),
    .page-unavailable__image img:nth-child(4),
    .page-unavailable__image img:nth-child(5),
    .page-unavailable__image img:nth-child(6),
    .page-unavailable__image-box1,
    .stages__coffee-image img:first-child {
        display: none
    }

    .stages__coffee-image img:nth-child(2),
    .stages__coffee-image img:nth-child(3),
    .stages__coffee-image img:nth-child(4) {
        display: none;
        -webkit-animation: none;
        animation: none
    }

    .page-unavailable__image img:nth-child(7),
    .stages__coffee-image img:nth-child(5) {
        display: block
    }

    .pagination__list {
        grid-template-columns: repeat(7, 10%)
    }

    .breadcrumbs__wrapper {
        margin-bottom: 20px
    }

    .breadcrumbs__list li {
        font-size: 14px;
        line-height: 16px
    }

    .breadcrumbs__list .breadcrumbs__link::before {
        width: 7px;
        top: 6px
    }

    .breadcrumbs__list .breadcrumbs__link::after {
        width: 7px;
        top: 10px
    }

    .page-unavailable__wrapper {
        padding: 0 20px;
        margin: 100px auto 65px
    }

    .page-unavailable__image img {
        -webkit-animation: none;
        animation: none
    }

    .page-unavailable__image-box1::before,
    .page-unavailable__image-box2::before {
        -webkit-animation: none;
        animation: none
    }

    .feedback .main-footer__contacts,
    .page-unavailable__image-box1 img,
    .page-unavailable__image-box2,
    .page-unavailable__image-box2 img {
        display: none
    }

    .page-unavailable__box-text {
        display: grid
    }

    .page-unavailable__box-text h1 {
        font-size: 24px;
        line-height: 29px
    }

    .page-unavailable__box-text p {
        font-size: 17px;
        line-height: 24px
    }

    .feedback__wrapper-box {
        padding: 100px 15px 20px
    }

    .feedback__wrapper-right .main-footer .main-footer__wrapper {
        padding: 10px 15px
    }

    .blog__list,
    .feedback__box-title {
        grid-template-columns: 1fr
    }

    .feedback__box-title strong {
        grid-row: 2;
        margin-top: 30px;
        text-align: center
    }

    .feedback__box {
        padding: 0 15px
    }

    .blog,
    .feedback__box article {
        margin-bottom: 40px
    }

    .feedback__box .youtube img {
        height: 250px
    }

    .article__box-text span,
    .feedback__title strong {
        font-size: 16px;
        line-height: 24px
    }

    .feedback__title span {
        font-size: 14px;
        line-height: 21px
    }

    .feedback-slider__swiper-container {
        padding: 30px 0 0
    }

    .feedback-slider__swiper-container .swiper-slide iframe {
        height: 250px
    }

    .feedback-slider__swiper-button-prev {
        left: 5px
    }

    .feedback-slider__swiper-button-next {
        right: 6px
    }

    .cookie h3 {
        font-size: 20px;
        line-height: 20px
    }

    .blog__card {
        min-height: 200px
    }

    .article {
        margin: 65px 0 30px
    }

    .article__title h1 {
        margin: 16px 0
    }

    .article__title a {
        grid-gap: 0 10px;
        grid-template-columns: 30px auto
    }

    .article__title a:hover img {
        transform: translateX(0)
    }

    .article__box-sharing {
        margin-top: 16px;
        grid-template-columns: 140px auto
    }

    .article__box-sharing time {
        font-size: 14px;
        line-height: 20px
    }

    .article__box-articles .blog__list,
    .portfolio__list {
        grid-template-columns: 1fr
    }

    .article__box-text h2 {
        font-size: 20px;
        line-height: 22px
    }

    .article__box-text h3,
    .portfolio__box-card--project .button {
        font-size: 16px;
        line-height: 16px
    }

    .sharing-list {
        grid-gap: 0 10px;
        grid-template-columns: repeat(5, 17px)
    }

    .user-button span {
        top: -25px
    }

    .portfolio {
        margin: 90px 0 40px
    }

    .portfolio__box-card--project .portfolio__image p {
        font-size: 24px;
        line-height: 30px
    }

    .portfolio__card-perspective {
        min-height: 300px
    }

    .portfolio-page__wrapper {
        padding: 70px 15px 120px;
        grid-template-rows: 1fr 1fr;
        grid-gap: 15px 0
    }

    .portfolio-page__box {
        max-width: 360px
    }

    .portfolio-page__box h1 {
        font-size: 24px;
        line-height: 24px
    }

    .portfolio-page__box p {
        font-size: 16px;
        line-height: 16px
    }
}

.portfolio-page__box--active {
    max-width: 100%;
    grid-template-columns: 28%;
    transition: .1s;
    transform: translate(0, 6%);
    -webkit-animation: 1s .7s forwards stage-show-elements-2;
    animation: 1s .7s forwards stage-show-elements-2;
    opacity: 0
}

.portfolio-page__box--active h1 {
    font-size: 36px;
    line-height: 36px
}

.portfolio-page__box--active p {
    font-size: 18px;
    line-height: 23px;
    letter-spacing: normal
}



.portfolio-page__box--active img,
.portfolio-page__box--active>a,
.portfolio-page__box--active>strong,
.portfolio-page__box--active>ul {
    display: grid
}

.modal__user-comment,
.modal__user-company,
.modal__user-email,
.modal__user-name,
.modal__user-name2,
.modal__user-phone,
.modal__user-phone2,
.modal__user-position,
.modal__user-site,
.portfolio-page__box .portfolio-page__order-image {
    position: relative
}

.portfolio-page__box .portfolio-page__order-image img {
    max-width: 265px
}

.portfolio-page__box .portfolio-page__order-image span {
    position: absolute;
    top: 15px;
    left: 30px;
    color: #fff;
    font-size: 28px;
    line-height: 28px
}

.portfolio-page__box-add h2,
.portfolio-page__button-prev span:nth-child(2) {
    font-size: 24px;
    line-height: 24px
}

.portfolio-page__box-add {
    max-width: 450px;
    margin: 0 auto;
    transform: translateY(5%);
    display: grid;
    align-self: flex-start;
    visibility: hidden;
    opacity: 0;
    transition: .6s
}

.portfolio-page__box-add img {
    max-width: 220px;
    margin: 10px auto;
    display: block
}

.portfolio-page__box-add h2 {
    text-transform: none
}

.portfolio-page__box-add p {
    font-size: 16px;
    line-height: 21px
}

.portfolio-page__box-add h3 {
    margin: 0 0 10px;
    font-size: 18px;
    line-height: 18px;
    letter-spacing: .05em;
    text-transform: uppercase
}

.portfolio-page__box-add ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.portfolio-page__box-add ul li {
    margin-bottom: 10px
}

.portfolio-page__box-add ul li p {
    margin: 0;
    padding-left: 20px;
    font-family: ProximaNova-Regular, arial, sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 21px;
    position: relative
}

.portfolio-page__box-add ul li p::before {
    width: 10px;
    height: 2px;
    position: absolute;
    content: "";
    top: 10px;
    left: 0
}

.portfolio-page__box-add--active {
    transition: 1s 0.6s;
    visibility: visible;
    opacity: 1
}

.modal-question h3,
.modal-question p,
.portfolio-page__box-add .portfolio-page__controls {
    margin-bottom: 20px
}

.portfolio-page__box-add .portfolio-page__button-next,
.portfolio-page__box-add .portfolio-page__button-prev {
    grid-gap: 0 10px
}

.portfolio-page__box-add .portfolio-page__button-prev a {
    grid-row: 1
}

.portfolio-page__box-add .portfolio-page__button-next a {
    grid-row: 1
}

.portfolio-page__box-add.black h2 a,
.portfolio-page__box-add.white h2 a {
    padding-bottom: 5px;
    position: relative
}

.portfolio-page__box-add.white h2 a::after {
    width: 0;
    height: 2px;
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    background-color: transparent;
    transition: .3s linear
}

.portfolio-page__box-add.white h2 a:hover::after {
    width: 100%;
    background-color: #fff
}

.portfolio-page__box-add.black h2 a::after {
    width: 0;
    height: 2px;
    position: absolute;
    content: "";
    bottom: 0;
    left: 0;
    background-color: transparent;
    transition: .3s linear
}

.portfolio-page__box-add.black h2 a:hover::after {
    width: 100%;
    background-color: #333
}

.portfolio-page__scroll {
    display: grid;
    grid-template-columns: 42% auto;
    align-items: center
}

.portfolio-page__scroll p {
    margin: 0;
    font-size: 16px;
    line-height: 21px;
    letter-spacing: normal
}

.portfolio-page__box-image {
    transition: .6s linear;
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 20px 0
}

@media (max-width:1200px) {
    .portfolio-page__box-add {
        transform: translateY(3%)
    }

    .portfolio-page__box-add ul li p {
        font-size: 16px;
        line-height: 21px
    }

    .portfolio-page__scroll {
        grid-template-columns: 50% auto
    }

    .portfolio-page__box-image {
        min-width: 470px
    }
}

@media (max-width:1025px) {
    .portfolio-page__box-add {
        display: none
    }

    .portfolio-page__box-image {
        min-width: auto;
        max-width: 550px;
        width: 100%;
        margin: 0 auto;
        grid-template-columns: 1fr;
        grid-gap: 15px 0;
        position: relative
    }
}

.portfolio-page__image {
    border: 8px solid #eee;
    border-radius: 10px;
    box-shadow: -8px -8px 20px rgba(0, 0, 0, .2), 8px 8px 20px rgba(0, 0, 0, .2);
    -webkit-animation: 1.5s showBox;
    animation: 1.5s showBox;
    transform: translateY(0)
}

.portfolio-page__button-next a,
.portfolio-page__button-prev a {
    background-color: rgba(255, 255, 255, .6);
    border-radius: 50%;
    position: relative;
    grid-row: 1/3
}

.portfolio-page__image::before {
    position: absolute;
    top: -612px;
    left: 8%;
    background-repeat: no-repeat
}

.portfolio-page__image::after {
    position: absolute;
    top: -612px;
    left: 85%;
    background-repeat: no-repeat
}

@media (max-width:1025px) {
    .portfolio-page__image::before {
        left: 7%
    }

    .portfolio-page__image::after {
        left: 86%
    }
}

.portfolio-page__image img {
    display: block
}

.portfolio-page__image a {
    display: grid;
    position: relative
}

.portfolio-page__image a:hover::before {
    width: 100%;
    height: 100%;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .5);
    background-image: url("../img/svg/icon-eye.svg");
    background-repeat: no-repeat;
    background-position: 50% 50%
}

.portfolio-page__button-next a:hover::before,
.portfolio-page__button-prev a:hover::before {
    background-image: url("../img/svg/icon-arrow-portfolio-2.svg");
    background-repeat: no-repeat
}

.portfolio-page__controls {
    display: grid;
    grid-template-columns: 1fr 1fr
}

.portfolio-page__button-prev {
    display: grid;
    grid-template-columns: 40px auto;
    align-items: center;
    grid-gap: 0 15px
}

.portfolio-page__button-prev a {
    width: 40px;
    height: 40px;
    display: grid
}

.portfolio-page__button-prev a::before {
    position: absolute;
    content: "";
    top: 10px;
    left: 13px;
    background-repeat: no-repeat;
    transform: rotate(180deg)
}

.portfolio-page__button-prev a:hover::before {
    transform: rotate(0)
}

.portfolio-page__button-prev span:last-child {
    padding-top: 5px;
    font-size: 14px;
    line-height: 14px;
    grid-column: 2
}

.portfolio-page__button-next {
    justify-self: right;
    display: grid;
    grid-template-columns: auto 40px;
    align-items: center;
    grid-gap: 0 15px
}

.portfolio-page__title,
.portfolio-page__title a {
    grid-gap: 0 20px;
    grid-template-columns: 48px auto;
    display: grid
}

.portfolio-page__button-next a {
    width: 40px;
    height: 40px;
    display: grid;
    grid-column: 2
}

.portfolio-page__button-next a::before {
    position: absolute;
    content: "";
    top: 10px;
    left: 15px;
    background-repeat: no-repeat
}

.portfolio-page__development p::before,
.portfolio-page__purposes p::before,
.portfolio-page__trabls p::before {
    width: 10px;
    height: 2px;
    position: absolute;
    background-color: #a62e41;
    content: ""
}

.portfolio-page__button-next a:hover::before {
    transform: rotate(180deg)
}

.portfolio-page__button-next span:nth-child(2) {
    font-size: 24px;
    line-height: 24px;
    text-align: right
}

.portfolio-page__button-next span:last-child {
    padding-top: 5px;
    font-size: 14px;
    line-height: 14px;
    grid-column: 1;
    text-align: right
}

.portfolio-page__company {
    padding-top: 75px;
    width: 100%;
    height: 100vh;
    overflow-y: scroll;
    overflow-x: hidden;
    position: fixed;
    top: 0;
    right: -110%;
    box-shadow: -2px 0 8px rgba(0, 48, 121, .3);
    transition: 1s linear
}

@media (max-width:1200px) {
    .portfolio-page__company {
        right: -140%
    }
}

@media (max-width:1025px) {
    .portfolio-page__company {
        padding-top: 50px;
        position: static;
        overflow: inherit;
        overflow-x: hidden;
        height: auto
    }
}

.portfolio-page__company--active {
    transition: 1s linear;
    width: calc(100% / 1.42);
    position: fixed;
    top: 0;
    right: 0
}

.portfolio-page__company::-webkit-scrollbar {
    width: 5px;
    background-color: #f5f9ff
}

.portfolio-page__company::-webkit-scrollbar-thumb {
    background-color: #0a3d76;
    border-radius: 10px
}

.portfolio-page__title {
    padding: 25px 70px 40px
}

@media (max-width:1025px) {
    .portfolio-page__title {
        padding-top: 15px
    }
}

.portfolio-page__title a {
    align-items: center
}

.tabs li,
.tags li {
    grid-template-columns: 1fr
}

.portfolio-page__title a img {
    display: grid;
    transition: .2s linear
}

.portfolio-page__title a:hover h2 {
    color: #a62e41
}

.portfolio-page__title a:hover img {
    transform: translateX(-10px);
    transition: .2s linear
}

.tabs li label:hover,
.tabs__btn:hover,
.tags li label:hover {
    transform: scale(1.02)
}

.portfolio-page__title h2 {
    font-size: 48px;
    line-height: 48px;
    text-transform: none
}

.portfolio-page__info {
    padding: 0 70px
}

.portfolio-page__info h3 {
    margin-bottom: 15px;
    font-size: 24px;
    line-height: 31px;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #0a3d76
}

.portfolio-page__info p {
    margin: 0 0 10px
}

.portfolio-page__tags ul {
    margin: 0 0 30px;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 15px
}

.portfolio-page__tags span {
    display: block;
    padding: 10px 15px;
    font-size: 16px;
    line-height: 16px;
    text-align: center;
    border-radius: 10px;
    background-image: linear-gradient(134.17deg, #f5f9ff 4.98%, #f0f6ff 94.88%);
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8);
    color: #0a3d76
}

.footer-socia img,
.socia-list img {
    box-shadow: 4px 4px 8px rgba(0, 0, 0, .2);
    transition: .3s linear
}

.feedback__image-arm {
    height: 175px;
    margin-bottom: 60px;
    position: relative
}

.feedback__image-arm picture {
    width: 1300px;
    position: absolute;
    top: -30px;
    left: 0
}

.portfolio-page__trabls img {
    margin-top: 30px
}

.portfolio-page__trabls p {
    font-size: 18px;
    line-height: 16px;
    padding-left: 20px;
    position: relative
}

.portfolio-page__trabls p::before {
    top: 10px;
    left: 0
}

.portfolio-page__purposes {
    margin: 60px 0
}

.portfolio-page__purposes ul {
    margin: 0;
    padding: 0;
    list-style: none
}

.portfolio-page__development p,
.portfolio-page__purposes p {
    padding-left: 20px;
    position: relative
}

.portfolio-page__purposes p {
    line-height: 16px;
    letter-spacing: .05em
}

@media (max-width:1025px) {
    .portfolio-page__purposes p {
        line-height: 18px
    }
}

.portfolio-page__purposes p::before {
    top: 7px;
    left: 0
}

.portfolio-page__advantages img {
    margin: 20px 0 60px
}

.portfolio-page__advantages p {
    font-size: 17px;
    line-height: 24px;
    position: relative
}

.portfolio-page__advantages p strong {
    color: #a62e41;
    display: inline
}

.portfolio-page__advantages .portfolio-page__image-box {
    max-width: 600px;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 0 30px
}

.portfolio-page__advantages .portfolio-page__image-box img {
    max-width: 180px;
    box-shadow: 2px 2px 10px rgba(5, 56, 102, .5);
    border-radius: 5px
}

.portfolio-page__development p::before {
    top: 10px;
    left: 0
}

.portfolio-page__developers .portfolio-page__box-developers {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(auto, 125px));
    grid-gap: 30px 30px;
    margin-bottom: 60px
}

.portfolio-page__developers img {
    margin: 0;
    max-width: 125px
}

.portfolio-page__developers strong {
    display: block;
    text-align: center;
    font-size: 16px;
    color: #a62e41
}

.portfolio-page__box-info {
    margin: 40px 0 0;
    padding-top: 40px;
    display: grid;
    grid-template-columns: 45% 45%;
    justify-content: center;
    align-items: center;
    border-top: 1px solid #999
}

.portfolio-page__box-info .portfolio-page__box-button,
.portfolio-page__box-info .portfolio-page__box-text {
    display: grid;
    justify-content: center
}

.portfolio-page__box-info .portfolio-page__box-text p {
    margin-bottom: 20px;
    font-size: 24px;
    line-height: 24px
}

.portfolio-page__box-info .portfolio-page__box-text a {
    font-size: 24px;
    line-height: 36px;
    letter-spacing: .05em;
    color: #0a3d76
}

.portfolio-page__box-info .portfolio-page__box-text a:hover {
    color: #a62e41
}

.portfolio-page__box-info .portfolio-page__box-button p {
    margin: 0 0 20px;
    font-family: ProximaNova-Bold, arial, sans-serif;
    font-size: 24px;
    line-height: 24px;
    color: #0a3d76
}

.portfolio-page__feedback {
    max-width: 100%;
    padding: 0
}

.portfolio-page__feedback article {
    display: block
}

.portfolio-page__feedback a:last-child {
    margin-top: 30px;
    display: none;
    font-weight: 800;
    color: #0a3d76;
    position: relative;
    text-align: center
}

.portfolio-page__feedback .youtube img {
    max-width: 100%;
    height: 600px;
    -o-object-fit: cover;
    object-fit: cover
}

.portfolio-page__feedback .youtube iframe {
    height: 600px
}

.portfolio-page__feedback .feedback__title {
    display: flex;
    gap: 0 100px;
    align-items: flex-start;
    position: relative
}

.portfolio-page__feedback .feedback__title img {
    max-width: 380px;
    position: absolute;
    top: -150px;
    left: 25px
}

.portfolio-page__feedback .feedback__title p {
    max-width: 400px;
    margin: 0;
    position: absolute;
    top: -125px;
    left: 80px;
    font-size: 20px;
    line-height: 26px;
    color: #f5f9ff;
    font-style: normal
}

.portfolio-page__feedback .feedback__title a {
    margin-top: 35px;
    padding-right: 25px;
    text-align: right;
    display: inline-block;
    font-weight: 800;
    color: #0a3d76;
    position: relative
}

.portfolio-page__feedback .feedback__title a::after {
    width: 24px;
    height: 24px;
    position: absolute;
    content: "";
    top: 0;
    right: 0;
    background-image: url("../img/svg/next-icon-blue.svg");
    background-repeat: no-repeat;
    transition: .2s linear
}

.exim,
.exim .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #feed01 0, #c1b500 100%)
}

.portfolio-page__feedback .feedback__title a:hover::after {
    right: -5px;
    background-image: url("../img/svg/next-icon-red.svg")
}

.portfolio-page__feedback .feedback__title a:hover,
.tags .tag_0:hover span,
.tags .tag_10:hover span,
.tags .tag_11:hover span,
.tags .tag_12:hover span,
.tags .tag_13:hover span,
.tags .tag_14:hover span,
.tags .tag_15:hover span,
.tags .tag_16:hover span,
.tags .tag_17:hover span,
.tags .tag_18:hover span,
.tags .tag_19:hover span,
.tags .tag_1:hover span,
.tags .tag_20:hover span,
.tags .tag_21:hover span,
.tags .tag_22:hover span,
.tags .tag_23:hover span,
.tags .tag_24:hover span,
.tags .tag_25:hover span,
.tags .tag_26:hover span,
.tags .tag_27:hover span,
.tags .tag_28:hover span,
.tags .tag_29:hover span,
.tags .tag_2:hover span,
.tags .tag_30:hover span,
.tags .tag_31:hover span,
.tags .tag_32:hover span,
.tags .tag_33:hover span,
.tags .tag_34:hover span,
.tags .tag_35:hover span,
.tags .tag_36:hover span,
.tags .tag_37:hover span,
.tags .tag_38:hover span,
.tags .tag_39:hover span,
.tags .tag_3:hover span,
.tags .tag_40:hover span,
.tags .tag_41:hover span,
.tags .tag_42:hover span,
.tags .tag_43:hover span,
.tags .tag_44:hover span,
.tags .tag_45:hover span,
.tags .tag_46:hover span,
.tags .tag_47:hover span,
.tags .tag_48:hover span,
.tags .tag_49:hover span,
.tags .tag_4:hover span,
.tags .tag_5:hover span,
.tags .tag_6:hover span,
.tags .tag_7:hover span,
.tags .tag_8:hover span,
.tags .tag_9:hover span {
    color: #a62e41
}

.portfolio-page__leadmagnit {
    display: none;
    margin-bottom: 50px;
    grid-template-columns: 200px auto;
    align-items: center;
    grid-gap: 0 80px
}

.portfolio-page__leadmagnit p {
    display: grid;
    grid-template-rows: auto auto;
    text-align: center
}

.portfolio-page__leadmagnit a {
    color: #a62e41;
    font-size: 18px;
    line-height: 22px
}

.portfolio-page__leadmagnit a:hover {
    color: #0a3d76
}

@media (max-width:1025px) {
    .portfolio-page__advantages p {
        font-size: 16px
    }

    .portfolio-page__leadmagnit {
        grid-template-columns: repeat(2, 200px);
        display: grid
    }
}

.portfolio-page__footer .main-footer__wrapper {
    padding: 10px 50px;
    grid-template-columns: 24% auto 42%;
    grid-column-gap: 0
}

@media (max-width:1440px) {
    .portfolio-page__feedback .feedback__title {
        justify-content: space-between;
        gap: 0 50px
    }

    .portfolio-page__footer .main-footer__wrapper {
        grid-template-columns: 31% auto;
        padding: 10px 100px 10px 50px
    }

    .portfolio-page__footer .main-footer__nav {
        display: none
    }
}

@media (max-width:1200px) {
    .portfolio-page__box-info {
        grid-template-columns: 40% 55%;
        justify-content: space-between
    }

    .portfolio-page__feedback .youtube iframe,
    .portfolio-page__feedback .youtube img {
        height: 450px
    }

    .portfolio-page__footer .main-footer__wrapper {
        padding: 10px 40px;
        grid-template-columns: 45% 49%;
        justify-content: space-between
    }
}

.portfolio-page__footer .footer-socia {
    grid-template-columns: repeat(6, 25px)
}

.portfolio-page__footer .socia-list {
    grid-template-columns: repeat(4, 25px);
    justify-content: flex-start
}

.portfolio-page__footer .main-footer__nav {
    grid-template-columns: 30% auto
}

.portfolio-page__footer .main-footer__contacts {
    justify-self: flex-end
}

.portfolio-page__scroll-mouse {
    border: 2px solid #fff;
    position: relative;
    width: 20px;
    height: 33px;
    border-radius: 100px;
    background-size: 100% 200%;
    -webkit-animation: 6s ease-out infinite nudgeMouse;
    animation: 6s ease-out infinite nudgeMouse
}

.portfolio-page__scroll-mouse::after,
.portfolio-page__scroll-mouse::before {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto
}

.portfolio-page__scroll-mouse::before {
    width: 20px;
    height: 33px;
    background-color: transparent;
    border-radius: 100px
}

.portfolio-page__scroll-mouse::after {
    background-color: #fff;
    width: 4px;
    height: 4px;
    border-radius: 100%;
    -webkit-animation: 6s linear infinite trackBallSlide;
    animation: 6s linear infinite trackBallSlide
}

.exim .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.yartruba,
.yartruba .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #00a0ff 0, #011c3b 100%)
}

.yartruba .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.vodadom,
.vodadom .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #fda905 0, #ee7900 100%)
}

.vodadom .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.les,
.prodoors {
    background-image: linear-gradient(90deg, #54b1a9 0, #175a53 93.23%)
}

.les .portfolio-page__advantages p::before,
.prodoors .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(90deg, #54b1a9 0, #175a53 93.23%)
}

.torwood,
.torwood .portfolio-page__advantages p::before {
    background-image: linear-gradient(114.3deg, #bcaea8 4.25%, #3e3728 93.37%)
}

.torwood .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.grosspofit,
.grosspofit .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #feed01 0, #008cc4 .01%, #004966 100%)
}

.grosspofit .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.eramarket,
.eramarket .portfolio-page__advantages p::before {
    background-image: linear-gradient(89.79deg, #f64b03 .21%, #f46001 99.84%)
}

.eramarket .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.cdg,
.cdg .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #1e3c72 0, #1b54b7 100%)
}

.cdg .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.deepsleep,
.deepsleep .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #49166b 0, #54186f 51.56%, #aa007b 100%)
}

.deepsleep .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.techimport,
.techimport .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #6eb039 0, #4a9b3c 100%)
}

.techimport .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.pasena,
.pasena .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #0e4d70 0, #56829b 100%)
}

.pasena .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.mexp,
.mexp .portfolio-page__advantages p::before {
    background-image: linear-gradient(89.82deg, #232e4a .19%, #172340 99.87%)
}

.mexp .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.domlaminata,
.domlaminata .portfolio-page__advantages p::before {
    background-image: linear-gradient(90.08deg, #f78c2d .69%, #c63d0e 102.63%)
}

.domlaminata .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.chicago,
.chicago .portfolio-page__advantages p::before {
    background-image: linear-gradient(271.23deg, #7e0019 4.07%, #db0025 96.09%)
}

.chicago .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.vseremonty,
.vseremonty .portfolio-page__advantages p::before {
    background-image: linear-gradient(116.5deg, #ff774d 4.08%, #ff5824 85.47%)
}

.vseremonty .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.avtostiklevo,
.avtostiklevo .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #c52c2c 1.15%, #d90203 98.61%)
}

.avtostiklevo .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.bars,
.bars .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #fae3d6 0, #f3b188 100%)
}

.bars .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.coffee,
.coffee .portfolio-page__advantages p::before {
    background-image: linear-gradient(90deg, #ff9c40 45.45%, #ffca8a 100%)
}

.coffee .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.kolesnik {
    background-image: linear-gradient(90deg, #b84d83 24.76%, #7d2d55 80.88%)
}

.hipee .portfolio-page__advantages p::before,
.kolesnik .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(90deg, #b84d83 24.76%, #7d2d55 80.88%)
}

.hipee {
    background-image: linear-gradient(88.59deg, #d3d4fd 25.05%, #d2e7f7 99.04%)
}

.tabs {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-gap: 0 20px
}

@media (max-width:1025px) {
    .tabs {
        grid-template-columns: repeat(2, 1fr);
        grid-gap: 20px 20px
    }
}

.tabs li label,
.tabs__btn {
    padding: 15px 0;
    display: grid;
    grid-template-columns: 30px auto;
    font-size: 20px;
    border-radius: 10px;
    background-image: linear-gradient(134.17deg, #f5f9ff 4.98%, #f0f6ff 94.88%);
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8);
    cursor: pointer;
    line-height: 24px
}

.tabs li {
    width: 100%;
    display: grid;
    border-radius: 10px
}

.tabs li img,
.tags li img {
    max-width: 24px
}

.tabs li label {
    justify-content: center
}

.tabs li input:checked+label {
    color: #0a3d76
}

.tabs__btn {
    justify-content: center;
    border: none
}

.tabs__btn:focus {
    outline: 0;
    color: #0a3d76;
    transform: scale(1)
}

.tags {
    margin: 30px 0 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 15px
}

.tags li {
    display: grid;
    border-radius: 10px
}

.tags li label {
    padding: 10px 15px;
    font-size: 16px;
    line-height: 16px;
    text-align: center;
    border-radius: 10px;
    background-image: linear-gradient(134.17deg, #f5f9ff 4.98%, #f0f6ff 94.88%);
    box-shadow: -8px -8px 16px rgba(255, 255, 255, .8), 8px 8px 16px rgba(186, 198, 216, .8);
    cursor: pointer;
    color: #0a3d76
}

.tags li input:checked+label,
.tags li label:hover {
    color: #a62e41
}

.tags .tag_0 label,
.tags .tag_0 span {
    color: #f2994a
}

.tags .tag_1 label,
.tags .tag_1 span {
    color: #2d9cdb
}

.tags .tag_2 label,
.tags .tag_2 span {
    color: #77d203
}

.tags .tag_3 label,
.tags .tag_3 span {
    color: #590ca2
}

.tags .tag_4 label,
.tags .tag_4 span {
    color: #00d0b7
}

.tags .tag_5 label,
.tags .tag_5 span {
    color: #d203a5
}

.tags .tag_6 label,
.tags .tag_6 span {
    color: #0021d0
}

.tags .tag_7 label,
.tags .tag_7 span {
    color: #219653
}

.tags .tag_8 label,
.tags .tag_8 span {
    color: #d75abb
}

.tags .tag_9 label,
.tags .tag_9 span {
    color: #89008c
}

.tags .tag_10 label,
.tags .tag_10 span {
    color: #006c5f
}

.tags .tag_11 label,
.tags .tag_11 span {
    color: #9b51e0
}

.tags .tag_12 label,
.tags .tag_12 span {
    color: #dd5143
}

.tags .tag_13 label,
.tags .tag_13 span {
    color: #8b1e56
}

.tags .tag_14 label,
.tags .tag_14 span {
    color: #62295c
}

.tags .tag_15 label,
.tags .tag_15 span {
    color: #7aa8dd
}

.tags .tag_16 label,
.tags .tag_16 span {
    color: #21304e
}

.tags .tag_17 label,
.tags .tag_17 span {
    color: #0084ac
}

.tags .tag_18 label,
.tags .tag_18 span {
    color: #3daa4b
}

.tags .tag_19 label,
.tags .tag_19 span {
    color: #7cb82f
}

.tags .tag_20 label,
.tags .tag_20 span {
    color: #5d6821
}

.tags .tag_21 label,
.tags .tag_21 span {
    color: #ccd613
}

.tags .tag_22 label,
.tags .tag_22 span {
    color: #a09407
}

.tags .tag_23 label,
.tags .tag_23 span {
    color: #474041
}

.tags .tag_24 label,
.tags .tag_24 span {
    color: #916224
}

.tags .tag_25 label,
.tags .tag_25 span {
    color: #ba6a2f
}

.tags .tag_26 label,
.tags .tag_26 span {
    color: #7e3d3c
}

.tags .tag_27 label,
.tags .tag_27 span {
    color: #cb34be
}

.tags .tag_28 label,
.tags .tag_28 span {
    color: #4c1e52
}

.tags .tag_29 label,
.tags .tag_29 span {
    color: #045
}

.tags .tag_30 label,
.tags .tag_30 span {
    color: #336447
}

.tags .tag_31 label,
.tags .tag_31 span {
    color: #39470f
}

.tags .tag_32 label,
.tags .tag_32 span {
    color: #a9af12
}

.tags .tag_33 label,
.tags .tag_33 span {
    color: #29b5cf
}

.tags .tag_34 label,
.tags .tag_34 span {
    color: #1f4980
}

.tags .tag_35 label,
.tags .tag_35 span {
    color: #964b57
}

.tags .tag_36 label,
.tags .tag_36 span {
    color: #d3697f
}

.tags .tag_37 label,
.tags .tag_37 span {
    color: #e9a800
}

.tags .tag_38 label,
.tags .tag_38 span {
    color: #6f4f5e
}

.tags .tag_39 label,
.tags .tag_39 span {
    color: #694991
}

.tags .tag_40 label,
.tags .tag_40 span {
    color: #4c347a
}

.tags .tag_41 label,
.tags .tag_41 span {
    color: #5670af
}

.tags .tag_42 label,
.tags .tag_42 span {
    color: #0069ad
}

.tags .tag_43 label,
.tags .tag_43 span {
    color: #587528
}

.tags .tag_44 label,
.tags .tag_44 span {
    color: #a57e4d
}

.tags .tag_45 label,
.tags .tag_45 span {
    color: #dd6d72
}

.tags .tag_46 label,
.tags .tag_46 span {
    color: #ba5390
}

.tags .tag_47 label,
.tags .tag_47 span {
    color: #5f599b
}

.tags .tag_48 label,
.tags .tag_48 span {
    color: #f4e42c
}

.tags .tag_49 label,
.tags .tag_49 span {
    color: #3d3a61
}

.socia-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(26px, 26px));
    justify-content: center;
    grid-column-gap: 10px
}

.socia-list img {
    border-radius: 7px
}

.footer-socia {
    margin: 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(26px, 26px));
    grid-gap: 10px
}

.footer-socia img {
    border-radius: 5px
}

@media (max-width:1025px) {
    .socia-list {
        justify-content: flex-start;
        grid-template-columns: repeat(auto-fit, minmax(30px, 30px))
    }

    .footer-socia {
        grid-template-columns: repeat(auto-fit, minmax(30px, 30px))
    }

    .intro__wrapper {
        margin-top: 66px
    }
}

.modal-development .modal__wrapper,
.modal-question .modal__wrapper,
.modal__wrapper {
    grid-template-columns: 70% auto;
    border-radius: 10px
}

.modal {
    padding: 0 10px;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, .7);
    z-index: 50;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0
}

.modal h3 {
    font-size: 24px;
    line-height: 24px;
    text-align: center;
    color: #0a3d76
}

.h2_title,
.modal__box h3 {
    line-height: 24px;
    font-family: ProximaNova-Bold, arial, sans-serif
}

.modal form {
    margin-right: 0
}

.modal__box h3,
.modal__box p {
    margin: 0 0 10px
}

.modal__btn-closed::after,
.modal__btn-closed::before {
    width: 19px;
    height: 2px;
    top: 9px;
    background-color: #333;
    left: 0;
    content: ""
}

.modal-analysis__wrapper,
.modal-consultation__wrapper,
.modal-feedback__wrapper {
    max-width: 400px;
    width: 100%;
    position: relative
}

.modal-consultation__wrapper .contacts__form {
    margin-top: 0;
    box-shadow: none
}

.custom-service .swiper-button-next,
.modal-analysis,
.modal-consultation__wrapper .contacts__form form::after,
.modal-consultation__wrapper .contacts__form form::before,
.modal-consultation__wrapper .contacts__form::after,
.modal-consultation__wrapper .contacts__form::before,
.modal-development,
.modal-feedback,
.modal-question,
.modal-services-order,
.modal-thanks,
.swiper-button-prev {
    display: none
}

.modal__btn-closed {
    width: 20px;
    height: 20px;
    display: block;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 1
}

.modal__btn-closed:hover {
    -webkit-animation: .3s ease-out rotateClose;
    animation: .3s ease-out rotateClose
}

.modal__btn-closed::before {
    position: absolute;
    transform: rotate(45deg)
}

.modal__btn-closed::after {
    position: absolute;
    transform: rotate(-45deg)
}

.modal-thanks .modal__image {
    margin-top: 40px;
    grid-row: 2;
    grid-column: 1/3;
    justify-self: flex-end;
    display: grid
}

.modal-development .modal__image img:first-child,
.modal-thanks .modal__image img:first-child {
    justify-self: self-end;
    -webkit-animation: 2.5s ease-in-out infinite alternate forwards services-icon-movement
}

.modal-thanks .modal__image img {
    max-width: 400px;
    display: block;
    border-bottom-right-radius: 10px
}

.modal-thanks .modal__image img:first-child {
    max-width: 165px;
    margin: 0 10px -70px 0;
    z-index: 1;
    animation: 2.5s ease-in-out infinite alternate forwards services-icon-movement
}

.modal__wrapper {
    position: relative;
    max-width: 550px;
    width: 100%;
    background-color: #fff;
    display: grid
}

.modal__box {
    margin: 40px 0 -60px 40px;
    position: relative;
    z-index: 1;
    grid-column: 1;
    grid-row: 1/3
}

.modal__box h3 {
    font-size: 24px;
    text-align: left;
    color: #0a3d76
}

.modal__box img {
    display: block
}

.modal__box .button {
    max-width: 210px
}

.modal-development p {
    max-width: 275px
}

.modal-development .modal__image,
.modal-question .modal__image {
    margin-top: 70px;
    grid-row: 2;
    grid-column: 1/3;
    justify-self: flex-end;
    display: grid
}

.modal-development .modal__image img {
    max-width: 400px;
    display: block;
    border-bottom-right-radius: 10px
}

.modal-development .modal__image img:first-child {
    max-width: 150px;
    margin: 0 15px -70px 0;
    animation: 2.5s ease-in-out infinite alternate forwards services-icon-movement
}

.modal-question .modal__box {
    max-width: 286px;
    margin: 40px 40px -60px
}

.modal-question .modal__box .button {
    margin: 30px auto 0
}

@media (max-width:767px) {
    .portfolio-page__box .portfolio-page__order-image img {
        max-width: 200px
    }

    .portfolio-page__box .portfolio-page__order-image span {
        font-size: 20px;
        line-height: 20px;
        top: 13px
    }

    .portfolio-page__box-info,
    .portfolio-page__scroll,
    .tabs {
        grid-template-columns: 1fr
    }

    .portfolio-page__feedback .feedback__title a,
    .portfolio-page__scroll p {
        display: none
    }

    .portfolio-page__box-image {
        max-width: 360px
    }

    .portfolio-page__image {
        border-radius: 5px;
        border: 5px solid #eee
    }

    .portfolio-page__image::before {
        top: -609px
    }

    .portfolio-page__image::after {
        top: -609px;
        left: 76%
    }

    .portfolio-page__controls {
        align-items: center
    }

    .portfolio-page__button-prev {
        grid-template-columns: 30px auto
    }

    .portfolio-page__button-prev a {
        width: 30px;
        height: 30px
    }

    .portfolio-page__button-prev a::before {
        top: 5px;
        left: 7px
    }

    .portfolio-page__button-prev span:nth-child(2) {
        font-size: 14px;
        line-height: 14px;
        display: none
    }

    .portfolio-page__button-prev span:last-child {
        grid-row: 1/3;
        padding-top: 0
    }

    .portfolio-page__button-next {
        grid-template-columns: auto 30px
    }

    .portfolio-page__button-next a {
        width: 30px;
        height: 30px
    }

    .portfolio-page__button-next a::before {
        top: 5px;
        left: 10px
    }

    .portfolio-page__button-next span:nth-child(2) {
        font-size: 14px;
        line-height: 14px;
        display: none
    }

    .portfolio-page__button-next span:last-child {
        grid-row: 1/3;
        padding-top: 0
    }

    .portfolio-page__title {
        padding: 15px 15px 0;
        grid-gap: 0;
        grid-template-columns: 35px auto
    }

    .portfolio-page__title h2 {
        padding: 0 15px;
        font-size: 24px;
        line-height: 24px
    }

    .portfolio-page__info {
        padding: 0 15px
    }

    .portfolio-page__info h3 {
        margin: 40px 0 15px;
        font-size: 20px;
        line-height: 20px
    }

    .feedback__image-arm {
        height: 90px
    }

    .feedback__image-arm picture {
        max-width: 750px
    }

    .portfolio-page__trabls p {
        font-size: 16px;
        line-height: 24px
    }

    .portfolio-page__purposes {
        padding: 30px 10px
    }

    .portfolio-page__purposes h3 {
        margin-top: 0
    }

    .portfolio-page__purposes p {
        line-height: 21px
    }

    .portfolio-page__advantages .portfolio-page__image-box {
        grid-gap: 0 15px
    }

    .portfolio-page__developers .portfolio-page__box-developers {
        justify-content: center
    }

    .portfolio-page__box-info .portfolio-page__box-text {
        grid-row: 2
    }

    .portfolio-page__box-info .portfolio-page__box-text p {
        margin-bottom: 5px;
        text-align: center
    }

    .portfolio-page__box-info .portfolio-page__box-button {
        margin-bottom: 20px
    }

    .portfolio-page__feedback a:last-child {
        display: block;
        max-width: 300px;
        margin: 0 auto
    }

    .portfolio-page__feedback a:last-child::after {
        width: 24px;
        height: 24px;
        position: absolute;
        content: "";
        top: 0;
        right: 60px;
        background-image: url("../img/svg/next-icon-blue.svg");
        background-repeat: no-repeat;
        transition: .2s linear
    }

    .portfolio-page__feedback a:last-child:hover::after {
        right: 55px;
        background-image: url("../img/svg/next-icon-red.svg")
    }

    .portfolio-page__feedback a:last-child:hover {
        color: #a62e41
    }

    .portfolio-page__feedback .youtube iframe,
    .portfolio-page__feedback .youtube img {
        height: 270px
    }

    .portfolio-page__feedback .feedback__title img {
        top: -110px;
        left: 0;
        max-width: 290px
    }

    .portfolio-page__feedback .feedback__title p {
        font-size: 16px;
        line-height: 20px;
        top: -90px;
        left: 40px;
        max-width: 290px
    }

    .portfolio-page__leadmagnit {
        grid-template-columns: 1fr;
        grid-gap: 0 15px;
        justify-items: center
    }

    .portfolio-page__footer .main-footer__wrapper {
        padding: 10px 15px;
        grid-template-columns: 1fr
    }

    .portfolio-page__scroll-mouse {
        width: 19px;
        height: 29px;
        justify-self: center
    }

    .portfolio-page__scroll-mouse::before {
        width: 15px;
        height: 25px
    }

    .portfolio-page__scroll-mouse::after {
        width: 3px;
        height: 3px
    }

    .tabs li label {
        padding: 15px 0 15px 40px;
        grid-gap: 0 5px;
        grid-template-columns: 30px 165px
    }

    .tabs__btn {
        padding: 15px 60px 15px 40px;
        grid-gap: 0 5px;
        text-align: left;
        grid-template-columns: 30px auto
    }

    .social-list--tablet {
        width: auto;
        padding: 0;
        display: grid;
        grid-gap: 0 30px;
        grid-template-columns: repeat(auto-fit, minmax(35px, 35px));
        position: static;
        justify-content: center;
        background-color: transparent;
        box-shadow: none
    }

    .footer-socia {
        grid-template-columns: repeat(5, minmax(5%, 35px));
        grid-gap: 0 5px
    }

    .footer-socia img {
        max-width: 30px
    }

    .modal h3 {
        font-size: 20px;
        line-height: 20px
    }

    .modal .button {
        font-size: 16px;
        line-height: 16px;
        width: 200px
    }

    .modal__btn-closed {
        top: 10px;
        right: 10px
    }

    .modal__wrapper .modal__btn-closed {
        top: 7px;
        right: 10px
    }

    .modal__box .button {
        max-width: 180px
    }

    .modal__box .button span {
        font-size: 16px;
        line-height: 16px
    }

    .modal-question .modal__box form {
        max-width: 210px
    }
}

.contacts__form label,
.modal-question label,
.modal__form label {
    position: absolute;
    top: -5px;
    left: 0;
    cursor: text;
    transition: .3s linear
}

.contacts__form input,
.modal-question input,
.modal__form input {
    width: 100%;
    padding: 0;
    border: none;
    border-bottom: 1px solid #333;
    outline: 0;
    background-color: transparent
}

.modal-question input:required~label::after {
    position: absolute;
    content: "*";
    top: 0;
    right: -8px
}

.contacts__form input.not-empty~label,
.contacts__form input:focus~label,
.contacts__form textarea.not-empty+label,
.contacts__form textarea:focus+label,
.modal-question input.not-empty~label,
.modal-question input:focus~label,
.modal__form input.not-empty~label,
.modal__form input:focus~label,
.modal__form textarea.not-empty+label,
.modal__form textarea:focus+label {
    color: #666;
    font-size: 15px;
    transform: translateY(-15px);
    transition: .3s linear
}

.modal-question .modal__image img {
    max-width: 400px;
    display: block;
    border-bottom-right-radius: 10px
}

.modal-question .modal__image img:first-child {
    max-width: 150px;
    margin: 0 15px -70px 0;
    justify-self: self-end;
    -webkit-animation: 2.5s ease-in-out infinite alternate forwards services-icon-movement;
    animation: 2.5s ease-in-out infinite alternate forwards services-icon-movement
}

@media (max-width:480px) {
    .box__link--site {
        top: 125px;
        left: 218px
    }

    .modal-development p,
    .stages__coffee {
        max-width: 235px
    }

    .stages__coffee-box {
        grid-template-columns: 1fr
    }

    .stages__coffee-box p {
        text-align: center
    }

    .modal-consultation__wrapper .contacts__form {
        padding: 40px
    }

    .modal-thanks .modal__image {
        grid-row: 3;
        background-color: #fff;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px
    }

    .modal-thanks .modal__image img:first-child {
        max-width: 120px;
        margin: 0 5px -55px 0
    }

    .modal__wrapper {
        max-width: 320px;
        grid-template-columns: 1fr;
        grid-template-rows: 1fr
    }

    .modal-development .modal__wrapper,
    .modal-question .modal__wrapper {
        grid-template-columns: 1fr;
        grid-template-rows: 67% 1fr
    }

    .modal-development .modal__image,
    .modal-question .modal__image {
        grid-row: 3;
        background-color: #fff;
        margin-top: 0;
        border-bottom-left-radius: 10px;
        border-bottom-right-radius: 10px
    }

    .modal-development .modal__image img:first-child {
        max-width: 130px;
        margin: 0 5px -70px 0
    }

    .modal-question .modal__box form {
        max-width: 100%
    }

    .modal-question .modal__image img:first-child {
        max-width: 130px;
        margin: 0 5px -70px 0
    }
}

.modal-services-order .modal__wrapper {
    max-width: 390px;
    grid-template-columns: 1fr
}

.modal-services-order .contacts__form {
    margin-top: 0
}

.contacts__form,
.modal__form {
    padding: 30px 50px;
    display: grid;
    grid-gap: 25px 0;
    background-color: #f5f9ff;
    border-radius: 10px;
    position: relative
}

.contacts__form form,
.modal__form form {
    display: grid;
    grid-gap: 30px 0
}

.contacts__form input:required~label::after,
.modal__form input:required~label::after {
    position: absolute;
    content: "*";
    top: 0;
    right: -8px
}

.contacts__form textarea,
.modal__form textarea {
    width: 100%;
    min-height: 100px;
    padding: 0;
    margin: 0;
    border: none;
    border-bottom: 1px solid #333;
    outline: 0;
    background-color: transparent;
    transition: .3s linear;
    resize: none
}

.modal__user-company .error,
.modal__user-name .error,
.modal__user-name2 .error,
.modal__user-phone .error,
.modal__user-phone2 .error,
.modal__user-position .error {
    border-bottom: 1px solid #a62e41;
    color: #333
}

.modal__user-company #user_company-error,
.modal__user-name #user_name-error,
.modal__user-name2 #user_name2-error,
.modal__user-phone #user_phone-error,
.modal__user-phone #user_phone-question-error,
.modal__user-phone #user_phone2-error,
.modal__user-phone2 #user_phone2-error,
.modal__user-position #user_position-error {
    border: none;
    font-size: 14px;
    line-height: 14px;
    color: #a62e41
}

.portfolio-page__title .h2,
.services__box-portfolio .h2 {
    max-width: 500px;
    margin: 0 auto;
    text-transform: none;
    text-align: center;
    line-height: 36px
}

.article__box-article ul>li {
    list-style: disc
}

.article__box-wrapper ul>li {
    list-style: none
}

.article__box-text a {
    font-weight: 600;
    color: #a92e43
}

.advantages__header p,
.h2_title,
.main-footer--2_custom h3 {
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #000
}

.h2_title {
    margin-bottom: 5px;
    font-size: 18px
}

.select-active {
    -webkit-user-select: text;
    -khtml-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text
}

.computrols {
    background: linear-gradient(90.76deg, #f5f6fa .73%, #c5d9ed 99.45%)
}

.salutminsk {
    background: linear-gradient(89.88deg, #735cff .1%, #3735ae 99.9%)
}

.custom-service .swiper-slide {
    width: 100% !important
}

.services-keys>.services-keys__box article {
    width: 93%;
    display: flex;
    justify-content: space-around
}

.custom-service .services-keys__text {
    max-width: 275px;
    width: 100%
}

.custom-service .services-keys__image {
    max-width: 600px;
    width: 100%
}

.custom-service>.swiper-container {
    position: static;
    padding-bottom: 30px
}

.custom-service>.swiper-container .swiper-slide {
    display: flex;
    align-items: center;
    justify-content: center
}

.custom-service .swiper-pagination .swiper-pagination-bullet {
    border: 1px solid #b4d1fa;
    filter: drop-shadow(2px 2px 5px rgba(186, 198, 216, .8));
    background: 0 0;
    width: 20px;
    height: 20px;
    opacity: 1
}

.custom-service .swiper-pagination .swiper-pagination-bullet-active {
    border: 1px solid #a62e41;
    filter: drop-shadow(2px 2px 5px rgba(186, 198, 216, .8))
}

.custom-service .swiper-pagination .swiper-pagination-bullet-active:after {
    content: '';
    background: #a62e41;
    position: absolute;
    top: 2px;
    left: 13%;
    bottom: 0;
    width: 14px;
    height: 14px;
    border-radius: 50%
}

.custom-service .swiper-pagination {
    display: block;
    bottom: -10px
}

.advantages__header p {
    font-size: 24px;
    line-height: 100%;
    font-family: ProximaNova-Bold, arial, sans-serif;
    text-align: center;
    margin: 0 auto
}

.portfolio_custom {
    padding: 80px 0 110px;
    background: #fff;
    margin: 0;
    border-top: 1px solid #094573
}

.portfolio_custom .button {
    margin: 50px auto 0
}

.advantages_custom {
    background: #f5f9ff;
    padding-bottom: 50px
}

.business__box {
    background-color: transparent;
    box-shadow: none
}

.business__box-info,
.portfolio_custom {
    border: none
}

.business__box-form {
    box-shadow: -10px -10px 20px rgb(255 255 255 / 30%), 10px 10px 20px rgb(68 69 70 / 15%), inset 4px 4px 15px rgb(255 255 255 / 30%);
    border-radius: 5px;
    background: #f5f9ff;
    border: 3px solid #fff;
    align-self: end;
    margin-bottom: 50px;
    padding: 40px 0
}

.business__box-form form {
    grid-gap: 16px
}

.business__box-form label {
    font-size: 16px
}

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

.services_custom-item {
    max-width: 683px
}

.services__close--active {
    -webkit-line-clamp: inherit !important
}

.main-footer--2_custom .services__close {
    -webkit-line-clamp: 1
}

.main-footer--2_custom .services {
    margin: 0 auto
}

.main-footer--2_custom h3 {
    text-align: center;
    font-size: 24px;
    line-height: 100%;
    margin-bottom: 50px
}

.main-footer--2_custom {
    padding: 50px 0;
    background-color: #fff
}

.advantages_custom .services__info-list strong {
    color: #094573
}

.feedback__box-logotypes__custom {
    display: inherit;
    margin-top: 50px
}

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

.review__custom {
    padding-top: 110px;
    margin-bottom: 76px;
    border-top: 1px solid #094573
}

.advantages_custom .services__info-list {
    margin-top: 0
}

@media(max-width:1023px) {
    .portfolio_custom {
        padding-bottom: 70px
    }

    .advantages_custom {
        padding-bottom: 20px
    }

    .review__custom {
        padding-top: 80px;
        margin-bottom: 40px
    }

    .feedback__box-logotypes__custom {
        padding-bottom: 0;
        margin-bottom: 0
    }
}

@media(max-width:767px) {
    .portfolio__list {
        margin-top: 50px
    }

    .portfolio_custom {
        padding-bottom: 70px
    }

    .feedback__box-logotypes__custom {
        padding-bottom: 0;
        margin-bottom: 0
    }

    .review__custom {
        margin-bottom: 0;
        padding-top: 60px
    }

    .business__box-form form {
        padding-bottom: 0
    }

    .main-footer.main-footer--2 img {
        display: none
    }
}

.main-footer--2 .main-footer__nav {
    display: flex;
    justify-content: space-around
}

.food375 {
    background: linear-gradient(101.64deg, #2f8a2b 3.46%, #006c43 87.27%)
}

.food375 .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(101.64deg, #2f8a2b 3.46%, #006c43 87.27%)
}

.turbo {
    background: linear-gradient(101.64deg, #81929c 3.46%, #373d41 87.27%)
}

.turbo .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(101.64deg, #81929c 3.46%, #373d41 87.27%)
}

.cm_kristal {
    background: linear-gradient(90deg, #106596 0, #1d89c7 100%)
}

.cm_kristal .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(90deg, #106596 0, #1d89c7 100%)
}

.sv_buznes {
    background: linear-gradient(88.48deg, #00b191 .54%, #00cabe 103.22%)
}

.sv_buznes .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(88.48deg, #00b191 .54%, #00cabe 103.22%)
}

.aprotek {
    background: linear-gradient(101.68deg, #3f92d1 4.33%, #046099 77.84%)
}

.aprotek .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(101.68deg, #3f92d1 4.33%, #046099 77.84%)
}

.freeco {
    background: linear-gradient(101.62deg, #898e92 4.07%, #a3a8ab 87%)
}

.freeco .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px;
    background-image: linear-gradient(101.62deg, #898e92 4.07%, #a3a8ab 87%)
}

.erra_app,
.erra_app .portfolio-page__advantages p::before {
    background: linear-gradient(101.42deg, #fff7ac 3.89%, #f4b513 86.29%)
}

.about-us__nav-list {
    top: 25%;
    left: 30%
}

.intro__media,
.intro__media::after {
    top: 0;
    left: 0;
    height: 100%;
    position: absolute;
    width: 100%
}

.about-us__nav-list li:first-child {
    left: 4%;
    top: -23px
}

.about-us__nav-list li:nth-child(2) {
    top: -70px;
    left: 13%
}

.about-us__nav-list li:nth-child(3) {
    left: 39%;
    top: -77px
}

.about-us__nav-list li:nth-child(4) {
    top: -55px;
    left: 52%
}

.about-us__nav-list li:nth-child(5) {
    left: 67%;
    top: -35px
}

.erra_app .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.NaBee,
.NaBee .portfolio-page__advantages p::before {
    background: linear-gradient(89.85deg, #2582ee 7.92%, #2ea6fe 89.12%)
}

.NaBee .portfolio-page__advantages p::before {
    width: 55px;
    height: 10px;
    position: absolute;
    content: "";
    top: 6px;
    left: -70px
}

.intro__media {
    overflow: hidden;
    background-color: #202020;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center
}

.intro__media-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center
}

.intro__media::after {
    content: '';
    background-color: rgba(0, 0, 0, .5)
}

.intro__edges {
    position: relative;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    bottom: 95px;
    margin-bottom: -95px
}

.intro__edges-item img {
    position: absolute;
    max-width: 200px;
    width: 100%;
    top: -75px;
    left: 50%;
    transform: translateX(-50%)
}

.intro__edges-item h3 {
    color: #fff;
    margin-bottom: 10px
}

.intro__edges-item p {
    color: rgba(236, 241, 249, .7)
}

.intro__edges-item {
    position: relative;
    text-align: center;
    max-width: 371px;
    flex: 0 1 32%;
    background: #1758a0;
    box-shadow: -4px -4px 15px rgb(255 255 255 / 20%), 0 4px 10px rgb(0 0 0 / 20%);
    border-radius: 10px;
    padding: 77px 35px 16px
}

.intro__wrapper {
    position: relative;
    grid-template-columns: 1fr
}

.intro__box {
    display: flex;
    flex-direction: column;
    align-items: center
}

.intro__box h1 {
    color: #f5f9ff;
    text-align: center
}

.intro__inner {
    padding: 354px 0 401px
}

@media only screen and (max-width:75em) {
    .intro__inner {
        padding: 150px 0 200px
    }
}

@media only screen and (max-width:48em) {
    .intro__inner {
        padding: 100px 0 150px
    }

    .intro__media {
        display: none
    }
}

@media only screen and (max-width:64em) {
    .intro {
        padding-bottom: 0
    }

    .intro__edges-item {
        flex: 0 1 100%;
        margin-bottom: 0
    }

    .intro__edges {
        justify-content: center;
        bottom: -15px;
        gap: 100px 20px;
        margin-bottom: -15px
    }
}

.wrapper {
    background-color: #f6f9ff
}

.business__box {
    margin-bottom: 0
}

.intro__content {
    position: relative;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center
}

.main {
    background: 0 0
}

@media (max-width:767px) {

    .contacts__form,
    .modal__form {
        padding: 30px
    }

    .intro__wrapper .intro__link--tablet {
        max-width: 270px
    }
}

.teams__wrapper h2 {
    margin: 40px 0 170px
}

@media (max-width:1025px) {
    .teams__wrapper h2 {
        margin-bottom: 30px
    }
}

.services__price-box strong {
    padding: 0 5px 0 10px
}

@media (max-width:1599.98px) {
    .services__price .services__price-grid {
        grid-gap: 15px
    }

    .services__price-box strong {
        font-size: 16px
    }
}

@media (max-width:1499.98px) {
    .services__price-box .services__span span {
        font-size: 13px
    }
}

@media (max-width:1399.98px) {
    .services__price-box strong {
        font-size: 14px
    }
}

@media (max-width:1299.98px) {
    .services__price .services__price-grid {
        justify-content: center;
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width:575.98px) {
    .services__price .services__price-grid {
        grid-template-columns: repeat(1, 1fr)
    }
}

.modal-consultation,
.portfolio-page__box--active>.portfolio-page__scroll {
    display: none
}

.modal-active {
    display: flex
}


.portfolio__header p{
    font-size: 24px;
    line-height: 100%;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    font-family: "ProximaNova-Bold", arial, sans-serif;
    color: #000000;
    text-align:center;
    margin:0 auto;
}