@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-ExtraBold.eot?9000ed2a78b7dba6fcd6ed726028dd56);
    src: local('Gilroy ExtraBold'), local('Gilroy-ExtraBold'),
        url(/fonts/Gilroy-ExtraBold.eot?9000ed2a78b7dba6fcd6ed726028dd56?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-ExtraBold.woff?cb761043a2e505ff53c1db3cb39673e6) format('woff'),
        url(/fonts/Gilroy-ExtraBold.ttf?0ac6879cd286550da90326ac0ba520e9) format('truetype');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-Heavy.eot?e5573649af7dcdf70fce9a45980a886e);
    src: local('Gilroy Heavy'), local('Gilroy-Heavy'),
        url(/fonts/Gilroy-Heavy.eot?e5573649af7dcdf70fce9a45980a886e?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-Heavy.woff?d7504387e1cad66d83bb8953f308820c) format('woff'),
        url(/fonts/Gilroy-Heavy.ttf?73c8d039d56e768155e71947246f00a5) format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-LightItalic.eot?485f80e442954003a71df09220148704);
    src: local('Gilroy Light Italic'), local('Gilroy-LightItalic'),
        url(/fonts/Gilroy-LightItalic.eot?485f80e442954003a71df09220148704?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-LightItalic.woff?3da028f10ef5201fe09e8f764a6f7f86) format('woff'),
        url(/fonts/Gilroy-LightItalic.ttf?181ce0ec04c8aae82d7a85a9cfdd1d31) format('truetype');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-ThinItalic.eot?074ed56dcf27e4eb60a9987041f60f50);
    src: local('Gilroy Thin Italic'), local('Gilroy-ThinItalic'),
        url(/fonts/Gilroy-ThinItalic.eot?074ed56dcf27e4eb60a9987041f60f50?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-ThinItalic.woff?934c6cd5b957baffdd3cb5e2a83083b0) format('woff'),
        url(/fonts/Gilroy-ThinItalic.ttf?746b432908b1935b54596b4d1ac63d48) format('truetype');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-BlackItalic.eot?8cac949fa0f2dc101aab7323c1c4eab2);
    src: local('Gilroy Black Italic'), local('Gilroy-BlackItalic'),
        url(/fonts/Gilroy-BlackItalic.eot?8cac949fa0f2dc101aab7323c1c4eab2?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-BlackItalic.woff?39c229f1b9cb6ad2727740a37e7237c1) format('woff'),
        url(/fonts/Gilroy-BlackItalic.ttf?0adb2dc396b0d50fd7c83998bec98bdc) format('truetype');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-BoldItalic.eot?7e335b28c8a0a45b54a529057b217e13);
    src: local('Gilroy Bold Italic'), local('Gilroy-BoldItalic'),
        url(/fonts/Gilroy-BoldItalic.eot?7e335b28c8a0a45b54a529057b217e13?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-BoldItalic.woff?82ec4c70dc3b4c6acf4bf1348f7930bb) format('woff'),
        url(/fonts/Gilroy-BoldItalic.ttf?6bea4a42006eead35863e5041cb1655e) format('truetype');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-SemiBold.eot?8134b9ab378c54626928c6a4e62b63bf);
    src: local('Gilroy SemiBold'), local('Gilroy-SemiBold'),
        url(/fonts/Gilroy-SemiBold.eot?8134b9ab378c54626928c6a4e62b63bf?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-SemiBold.woff?e38937dbf8202c1448029851a98cb96a) format('woff'),
        url(/fonts/Gilroy-SemiBold.ttf?6780292641f883b3dad36614cac8dd5a) format('truetype');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-UltraLightItalic.eot?0eaf6ee1ff3eea926e1778ae3656b863);
    src: local('Gilroy UltraLight Italic'), local('Gilroy-UltraLightItalic'),
        url(/fonts/Gilroy-UltraLightItalic.eot?0eaf6ee1ff3eea926e1778ae3656b863?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-UltraLightItalic.woff?371171f497213b33c43a7b5eb8c2606f) format('woff'),
        url(/fonts/Gilroy-UltraLightItalic.ttf?8c3864ffd690ca16c1880f53871a6bad) format('truetype');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-SemiBoldItalic.eot?2a3e284c8733dfc399f4f0a1f504d76f);
    src: local('Gilroy SemiBold Italic'), local('Gilroy-SemiBoldItalic'),
        url(/fonts/Gilroy-SemiBoldItalic.eot?2a3e284c8733dfc399f4f0a1f504d76f?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-SemiBoldItalic.woff?56127a256ebf94fa0f86f9afb2d261bd) format('woff'),
        url(/fonts/Gilroy-SemiBoldItalic.ttf?3de62e3c7749ac7c5e73e06992e11d6d) format('truetype');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-Light.eot?8862796bffbd019727b3b4516ada8089);
    src: local('Gilroy Light'), local('Gilroy-Light'),
        url(/fonts/Gilroy-Light.eot?8862796bffbd019727b3b4516ada8089?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-Light.woff?9df2f5dbbb9c90a6ede7c1348521d216) format('woff'),
        url(/fonts/Gilroy-Light.ttf?1b7fff53076b212839677d44fe93ad1c) format('truetype');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-MediumItalic.eot?656d4f138a8b7faa650bcb96cf59817b);
    src: local('Gilroy Medium Italic'), local('Gilroy-MediumItalic'),
        url(/fonts/Gilroy-MediumItalic.eot?656d4f138a8b7faa650bcb96cf59817b?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-MediumItalic.woff?84d4545b74fc0406d16eb0f287358631) format('woff'),
        url(/fonts/Gilroy-MediumItalic.ttf?055223ccbf36e5634a284a9616f22814) format('truetype');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-ExtraBoldItalic.eot?2b33fbbd258ef0002828a6e40a14221f);
    src: local('Gilroy ExtraBold Italic'), local('Gilroy-ExtraBoldItalic'),
        url(/fonts/Gilroy-ExtraBoldItalic.eot?2b33fbbd258ef0002828a6e40a14221f?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-ExtraBoldItalic.woff?2df7a557113fdb81a838cad8cfedf3e2) format('woff'),
        url(/fonts/Gilroy-ExtraBoldItalic.ttf?9c9417e446a6e199201a4aa25423d219) format('truetype');
    font-weight: 800;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-Regular.eot?1d051d9d4215c09cbcaa846199555107);
    src: local('Gilroy Regular'), local('Gilroy-Regular'),
        url(/fonts/Gilroy-Regular.eot?1d051d9d4215c09cbcaa846199555107?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-Regular.woff?31d54a4b841c0e438f130447e373792b) format('woff'),
        url(/fonts/Gilroy-Regular.ttf?b91b0127c56a8e5f9e83a2a49ba4e315) format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-HeavyItalic.eot?ede9efc5b390b58e7a1eb0120fd3acb6);
    src: local('Gilroy Heavy Italic'), local('Gilroy-HeavyItalic'),
        url(/fonts/Gilroy-HeavyItalic.eot?ede9efc5b390b58e7a1eb0120fd3acb6?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-HeavyItalic.woff?83e72a406b9dbf18b9f6c4f8b3f8ae3b) format('woff'),
        url(/fonts/Gilroy-HeavyItalic.ttf?86557514a7a1212cf2e88d4a569813da) format('truetype');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-Medium.eot?b84941b7bdcce7cbba6db36330079273);
    src: local('Gilroy Medium'), local('Gilroy-Medium'),
        url(/fonts/Gilroy-Medium.eot?b84941b7bdcce7cbba6db36330079273?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-Medium.woff?2bc7f5d7ea77ee1bddb3d9388913a8d1) format('woff'),
        url(/fonts/Gilroy-Medium.ttf?f9f832b0ed3f1ab138c962ada983dbcc) format('truetype');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-RegularItalic.eot?ddc7f8242457fe9b7fe23ccb97153130);
    src: local('Gilroy Regular Italic'), local('Gilroy-RegularItalic'),
        url(/fonts/Gilroy-RegularItalic.eot?ddc7f8242457fe9b7fe23ccb97153130?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-RegularItalic.woff?cd8c71a8df152621a239f0df1acb06be) format('woff'),
        url(/fonts/Gilroy-RegularItalic.ttf?8bbf15be10d36d90b3411e1fc7454c88) format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-UltraLight.eot?e7028e6c1a94b1d5845c845fa5b1b6ff);
    src: local('Gilroy UltraLight'), local('Gilroy-UltraLight'),
        url(/fonts/Gilroy-UltraLight.eot?e7028e6c1a94b1d5845c845fa5b1b6ff?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-UltraLight.woff?d23a0edf71fe026ab53fc1a744873fc0) format('woff'),
        url(/fonts/Gilroy-UltraLight.ttf?68e17ccd6916d61b26714bf54a5a6f89) format('truetype');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-Bold.eot?a732fed1bc6140852a0bcc237f16618e);
    src: local('Gilroy Bold'), local('Gilroy-Bold'),
        url(/fonts/Gilroy-Bold.eot?a732fed1bc6140852a0bcc237f16618e?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-Bold.woff?5fb38b9fa452b5814397d5bcce0d2d5e) format('woff'),
        url(/fonts/Gilroy-Bold.ttf?b900325e44ec0c673e88af6e02e3b453) format('truetype');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-Thin.eot?724e5c2f79549caa168ba421787665b3);
    src: local('Gilroy Thin'), local('Gilroy-Thin'),
        url(/fonts/Gilroy-Thin.eot?724e5c2f79549caa168ba421787665b3?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-Thin.woff?6e2e7d472d0beb6b3cef09352cc9ff4e) format('woff'),
        url(/fonts/Gilroy-Thin.ttf?a21a139f0613c0f6f97c8c8016705e86) format('truetype');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Gilroy';
    src: url(/fonts/Gilroy-Black.eot?724ac9b214f34923b443254a3bcef79a);
    src: local('Gilroy Black'), local('Gilroy-Black'),
        url(/fonts/Gilroy-Black.eot?724ac9b214f34923b443254a3bcef79a?#iefix) format('embedded-opentype'),
        url(/fonts/Gilroy-Black.woff?1f5dc7482c1aec4cc8276143ad398d57) format('woff'),
        url(/fonts/Gilroy-Black.ttf?bf3a5f799e6799d48062b7b638c979d9) format('truetype');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}


/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

@charset "UTF-8";
html {
  width: 100%;
  padding: 0;
  margin: 0;
}

html, body {
  overflow-x: hidden;
}

.svg_type_one path {
  fill: #7098E4;
}

.svg_type_two path, .svg_type_two rect, .svg_type_two line {
  stroke: #7098E4;
}

.svg_type_three path {
  fill: #7098E4;
}

.svg_type_four path, .svg_type_four rect, .svg_type_four line {
  stroke: #F878C2 !important;
}

.svg-path {
  fill: #7098E4;
}

.svg-g-stroke {
  stroke: #7098E4;
}

.test {
  background: #7098E4;
  border: none;
}

.l-2 {
  font-style: normal;
  font-weight: 800;
  font-size: 56px;
  line-height: 130%;
  color: #3F3D56;
}

.l-3 {
  font-style: normal;
  font-weight: 800;
  font-size: 36px;
  line-height: 130%;
  color: #3F3D56;
}

@media (max-width: 576px) {
  .l-3 {
    font-size: 20px !important;
  }
}
.l-4 {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 130%;
  color: #7098E4;
}

.l-5 {
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 130%;
  color: #9D9EA9;
}

@media (max-width: 576px) {
  .l-5 {
    font-size: 14px !important;
  }
}
.l-6 {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 130%;
  color: #9D9EA9;
}

.title-4 {
  font-style: normal;
  font-weight: bold;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
  line-height: 1;
  margin: 0;
}

.__layout {
  background: transparent;
  margin: 100px auto;
}

.__layout.__layout_limited {
  max-width: 1140px;
}

.__bg_content-block {
  background-color: #F8F8FB;
  border-radius: 60px;
}

@media (max-width: 576px) {
  .__bg_content-block {
    border-radius: 0;
  }
}
.__flex {
  display: flex;
  align-items: center;
}

.__flex.__flex-line {
  flex-wrap: wrap;
}

.__flex .flex-block {
  margin-right: 21px;
}

.__flex .flex-block-min {
  margin-right: 0;
}

.__flex.flex-top {
  align-items: start;
}

._margin_top_10 {
  margin-top: 10px;
}

._margin_top_20 {
  margin-top: 20px;
}

._margin_top_30 {
  margin-top: 30px;
}

._margin_top_40 {
  margin-top: 40px;
}

._margin_top_50 {
  margin-top: 50px;
}

._margin_top_60 {
  margin-top: 60px;
}

._margin_top_70 {
  margin-top: 70px;
}

._margin_top_80 {
  margin-top: 80px;
}

._margin_top_90 {
  margin-top: 90px;
}

._margin_top_100 {
  margin-top: 100px;
}

.opacities.middle {
  opacity: 0.5;
}

.opacities.top {
  opacity: 0.7;
}

.opacities.bottom {
  opacity: 0.3;
}

h1 {
  font-style: normal;
  font-weight: 750;
  font-size: 46px;
  line-height: 1.2;
  color: rgba(63, 61, 86, 0.9);
  width: 100%;
  max-width: 800px;
}

@media (max-width: 576px) {
  h1 {
    font-size: 24px !important;
  }
}
h1 span {
  display: block;
  font-family: "Caveat", cursive;
  font-style: italic;
  color: #7264D6;
  font-weight: 300;
}

h1 .constructor {
  color: #3F3D56;
  line-height: 120%;
  display: block;
  font-weight: 500;
}

h1 .typed {
  display: block;
}

h1 .typed-cursor {
  font-weight: 100;
}

@media (max-width: 576px) {
  h1 {
    font-size: 36px;
    font-weight: 700;
  }
}
h2 {
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 29px;
  color: #3F3D56;
}

@media (max-width: 576px) {
  h2 {
    font-size: 16px !important;
  }
}
h2.h2-main {
  font-weight: 500;
  color: rgba(63, 61, 86, 0.9);
  margin-top: 32px;
  width: 100%;
  max-width: 1000px;
  margin-bottom: 35px;
}

@media (max-width: 992px) {
  h2.h2-main {
    width: 100%;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
  }
}
@media (max-width: 766px) {
  h2.h2-main {
    margin-top: 20px;
    margin-bottom: 20px;
    width: 100%;
  }
}
@media (max-width: 992px) {
  h2.h2-main {
    width: 100%;
  }
}
h2.h2-rates {
  color: #9D9EA9;
}

h2.h2-questions {
  font-weight: normal;
  margin-top: -10px;
  margin-bottom: 47px;
}

@media (max-width: 576px) {
  h2.h2-questions {
    font-size: 16px;
    margin-top: 10px;
  }
}
h2.h2-possibilities {
  font-weight: normal;
  width: 100%;
  max-width: 427px;
}

@media (max-width: 576px) {
  h2.h2-possibilities {
    font-size: 16px;
    margin-bottom: 50px;
  }
}
h2.h2-examples {
  font-weight: normal;
  width: 100%;
  max-width: 924px;
}

@media (max-width: 576px) {
  h2.h2-examples {
    font-size: 16px;
    margin-bottom: 50px;
  }
}
@media (max-width: 768px) {
  h2.h2-examples {
    text-align: center;
  }
}
@media (max-width: 992px) {
  h2.h2-examples {
    text-align: left;
  }
}
@media (max-width: 576px) {
  h2 {
    font-size: 15px;
    line-height: 24px;
  }
}
body {
  width: 100%;
  overflow-x: hidden !important;
  font-family: Gilroy, serif;
  letter-spacing: 0.2px;
  color: #3F3D56;
}

body button, body a, body input {
  outline: none;
  text-decoration: none;
}

.content {
  margin-top: 150px;
}

.template {
  max-width: 1140px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .template {
    padding: 0 20px;
  }
}
@media (max-width: 992px) {
  .template {
    padding: 0 30px;
  }
}
@media (max-width: 1200px) {
  .template {
    padding: 0 30px;
  }
}
@media (max-width: 576px) {
  .template {
    width: 100%;
    padding: 0;
  }
}
.description-text-block {
  margin-bottom: 50px;
  margin-top: -30px;
}

.description-text-block .description-text {
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 22px;
  color: #9D9EA9;
}

.forAnchor .ant-anchor-wrapper {
  background: transparent !important;
}

.forAnchor .ant-anchor-ink {
  display: none;
}

.forAnchor .ant-anchor-link {
  padding: 0;
}

.animation {
  position: relative;
}

.loader {
  display: none;
  position: fixed;
  z-index: 1001;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(255, 255, 255, 0.8);
  transition: 0.5s all;
}

.loader .text-center {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
  width: 32px;
  height: 37px;
}

.loader.active {
  display: block;
}

h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 30px;
  line-height: 140%;
  color: #3F3D56;
}

@media (max-width: 576px) {
  h3 {
    font-size: 20px !important;
  }
}
h3 span {
  display: block;
  color: #F878C2;
}

h3 span.other {
  color: #7264D6;
}

h3 span.accent {
  color: #7098E4;
  font-size: 40px;
}

@media (max-width: 576px) {
  h3 span.accent {
    font-size: 20px !important;
  }
}
.tag {
  font-size: 13px;
  font-weight: 500;
  background-color: rgba(207, 220, 246, 0.6);
  border-radius: 500px;
  padding: 3px 7px;
  white-space: nowrap;
  display: inline-block;
  margin-bottom: 7px;
}

.tag.disabled {
  opacity: 0.4;
}

@keyframes header {
  0% {
    top: -200px;
  }
  100% {
    top: 24px;
  }
}
.logo {
  font-style: normal;
  font-weight: 800;
  font-size: 26px;
  line-height: 150%;
  color: #3F3D56;
  text-align: center;
  text-decoration: none;
}

.logo:hover {
  color: rgba(63, 61, 86, 0.8);
}

@media (max-width: 576px) {
  .logo {
    font-size: 24px;
  }
}
.header {
  position: fixed;
  top: 0px;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: 3;
  margin: 0;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.05);
  width: 100%;
  min-height: 80px;
  background: white;
}

@media (max-width: 992px) {
  .header {
    min-height: 80px;
  }
}
.header .dropdown-menu {
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 30px;
  border: none;
}

.header .dropdown-menu li a {
  width: auto;
}

.header .dropdown-menu .dropdown-item {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 34px;
  color: #9D9EA9;
  opacity: 0.7;
  background: transparent;
  padding-left: 30px;
  padding-right: 30px;
}

.header .dropdown-menu .dropdown-item.active {
  opacity: 1;
  font-weight: 600;
  background: transparent;
}

.header .right {
  text-align: right;
}

.header .in {
  padding-top: 30px;
}

.header .in.shadow-header {
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  transition: 1s all;
}

.header .in .hamburger-lines {
  height: 18px;
  width: 28px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.header .in .hamburger-lines .line {
  display: block;
  height: 2px;
  width: 100%;
  border-radius: 10px;
  background: #3F3D56;
  opacity: 0.8;
}

.header .in .hamburger-lines .line1 {
  transform-origin: 0 0;
  transition: transform 0.4s ease-in-out;
}

.header .in .hamburger-lines .line2 {
  transition: transform 0.2s ease-in-out;
}

.header .in .hamburger-lines .line3 {
  transform-origin: 0 100%;
  transition: transform 0.4s ease-in-out;
}

.header .in .mobile-menu {
  background: transparent;
  border: none;
}

.header .in .mobile-menu svg {
  width: 20px;
  height: 20px;
}

@media (max-width: 576px) {
  .header .in .mobile-center {
    text-align: center;
  }
}
@media (max-width: 768px) {
  .header .in .mobile-center {
    text-align: left;
  }
}
@media (max-width: 992px) {
  .header .in .mobile-center {
    text-align: left;
  }
}
@media (max-width: 576px) {
  .header .in {
    background: #F8F8FB;
    border-radius: 0 !important;
    padding: 12px;
    height: auto;
    top: 0 !important;
  }
}
@media (max-width: 992px) {
  .header .in {
    background: white;
    border-radius: 0 !important;
    padding: 12px;
    height: auto;
    top: 0;
  }
}
@media (max-width: 1200px) {
  .header .in {
    background: white;
    border-radius: 0 !important;
    padding: 12px;
    height: auto;
    top: 0;
  }
}
@media (max-width: 991px) {
  .header .in {
    height: 80px !important;
    border-radius: 0 !important;
    top: 0 !important;
    padding: 20px 20px;
  }
}
.header .in.active {
  position: fixed;
  top: 24px;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: 5;
  margin: 0 auto;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  max-width: 1362px;
  animation: header 1s forwards;
}

@media (max-width: 576px) {
  .header .in.active {
    left: 0;
    right: 0;
    top: 0;
  }
}
.header .select-language {
  text-transform: capitalize;
  border: 1px dashed #f1f1f1;
  background: transparent;
  color: #3F3D56;
  padding-left: 25px;
  padding-right: 25px;
  margin-right: 10px;
}

@media (max-width: 1158px) {
  .header .select-language {
    padding-left: 20px;
    padding-right: 20px;
  }
  .header .select-language span {
    display: none;
  }
  .header .select-language img {
    margin-right: 0 !important;
    top: 0;
  }
}
.header .select-language img {
  width: 15px;
  top: -2px;
  position: relative;
  margin-right: 7px;
}

.header .select-language:hover {
  color: #3F3D56;
}

.header .lang {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 12px;
  color: #9D9EA9;
  background: transparent;
  border: none;
  margin-left: 10px;
}

@media (max-width: 576px) {
  .header .lang {
    font-size: 12px;
  }
}
.header .signin {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 12px;
  color: #9D9EA9;
  padding: 16px 19px;
  border: none;
  background: white;
  border-radius: 17px;
  text-align: center;
  text-decoration: none;
}

@media (max-width: 1300px) {
  .header .signin {
    font-size: 14px;
    border-radius: 12px;
    padding: 14px;
  }
}
@media (max-width: 576px) {
  .header .signin {
    padding: 10px;
    font-size: 12px;
    border-radius: 7px;
  }
}
.header .signin:hover {
  cursor: pointer;
  color: #7264D6;
  transition: all 0.5s;
}

.header .signin:active {
  transition: all 0.5s;
}

.nav {
  text-align: center;
}

@media (max-width: 991px) {
  .nav {
    margin-top: 10px;
  }
}
@media (max-width: 991px) {
  .nav li.nav-item {
    width: 20%;
  }
}
.nav svg {
  position: relative;
  top: -2px;
  margin-right: 3px;
}

.nav .nav-link {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 130%;
  color: #9D9EA9;
  border-bottom: none;
}

@media (max-width: 1170px) {
  .nav .nav-link {
    font-size: 14px;
  }
}
@media (max-width: 1087px) {
  .nav .nav-link svg {
    display: none;
  }
}
@media (max-width: 1065px) {
  .nav .nav-link {
    font-size: 13px;
  }
}
@media (max-width: 1025px) {
  .nav .nav-link {
    font-size: 12px;
  }
}
@media (max-width: 991px) {
  .nav .nav-link {
    font-size: 16px;
  }
}
@media (max-width: 813px) {
  .nav .nav-link {
    font-size: 13px;
  }
}
@media (max-width: 731px) {
  .nav .nav-link {
    font-size: 12px;
  }
}
@media (max-width: 699px) {
  .nav .nav-link svg {
    display: none;
  }
}
.nav .nav-link svg g {
  stroke: #9D9EA9;
}

.nav .nav-link a {
  color: #9D9EA9;
}

.nav .nav-link.active {
  color: #3F3D56;
}

.nav .nav-link.active svg g {
  stroke: #3F3D56;
}

.nav .nav-link.active a {
  color: #3F3D56;
}

.ant-dropdown-menu {
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 30px;
  width: 149px;
  padding-top: 20px;
  margin-top: 15px;
}

.ant-dropdown-menu p {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #9D9EA9;
  text-align: center;
  opacity: 0.6;
}

.ant-dropdown-menu p:hover {
  cursor: pointer;
}

.ant-dropdown-menu p.active {
  font-weight: 600;
  opacity: 1;
}

.ant-dropdown-link {
  text-transform: capitalize;
}

.drawer-mobile {
  margin: 0;
  padding: 0;
}

.drawer-mobile li {
  list-style-type: none;
  line-height: 60px;
}

.drawer-mobile li a {
  color: #3F3D56;
}

.offcanvas-body .nav {
  text-align: left;
}

.offcanvas-body .nav svg {
  position: relative;
  top: -2px;
  margin-right: 3px;
}

@media (max-width: 576px) {
  .offcanvas-body .nav svg {
    display: none;
  }
}
.offcanvas-body .nav .nav-link {
  font-style: normal;
  font-weight: 700;
  font-size: 28px;
  line-height: 130%;
  color: #9D9EA9;
  border-bottom: none;
  line-height: 2;
}

.offcanvas-body .nav .nav-link svg g {
  stroke: #9D9EA9;
}

.offcanvas-body .nav .nav-link a {
  color: #9D9EA9;
}

.offcanvas-body .nav .nav-link.active {
  color: #3F3D56;
}

.offcanvas-body .nav .nav-link.active svg g {
  stroke: #3F3D56;
}

.offcanvas-body .nav .nav-link.active a {
  color: #3F3D56;
}

.upgrading p.update {
  font-style: normal;
  font-weight: 800;
  font-size: 36px;
  line-height: 130%;
  color: #3F3D56;
  width: 100%;
  max-width: 450px;
  margin-bottom: 35px;
}

.upgrading p.description {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 22px;
  color: #9D9EA9;
}

.upgrading p.description span {
  color: #3F3D56;
}

.upgrading .for-button {
  margin: 0;
  padding: 0;
}

.footer {
  margin-top: 70px;
}

.footer .top {
  margin-bottom: 25px;
}

@media (max-width: 576px) {
  .footer .iphone {
    margin: 30px 0;
  }
}
@media (max-width: 576px) {
  .footer .iphone .iphone-button {
    padding-right: 25px;
    text-align: right;
  }
}
.footer .links a {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
  color: #9D9EA9;
  margin-bottom: 8px;
  display: block;
  text-decoration: none;
}

@media (max-width: 576px) {
  .footer .links a {
    font-size: 12px;
    text-align: center;
    margin-bottom: 10px;
  }
}
.footer .email, .footer .phone {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 12px;
  color: #3F3D56;
  display: block;
  text-align: right;
  text-decoration: none;
}

@media (max-width: 576px) {
  .footer .email, .footer .phone {
    text-align: center;
    font-size: 12px;
    margin-top: 10px;
  }
}
.footer .email {
  margin-bottom: 24px;
}

.footer .title {
  font-style: normal;
  font-weight: bold;
  font-size: 16px;
  line-height: 12px;
  color: #3F3D56;
  display: flex;
  align-items: center;
  letter-spacing: -0.00636364em;
}

.footer .description {
  font-style: normal;
  font-weight: normal;
  font-size: 11px;
  line-height: 15px;
  color: #9D9EA9;
  display: flex;
  align-items: center;
  letter-spacing: -0.00636364em;
}

.footer .bottom {
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 130%;
  color: #9D9EA9;
  background: #3F3D56;
  padding-bottom: 40px;
}

@media (max-width: 576px) {
  .footer .bottom .saleskit-copyright {
    font-size: 12px;
    text-align: center;
  }
}
.footer .bottom p {
  margin: 15px;
}

.footer .bottom .right {
  text-align: right;
}

@media (max-width: 576px) {
  .footer .bottom .right {
    text-align: center;
    padding: 0 0 20px 0;
    font-size: 12px;
  }
}
.footer .bottom .right a {
  color: #9D9EA9;
}

.footer .bottom .right a strong {
  color: rgba(255, 255, 255, 0.9);
}

.main-top,
.main-done,
.main-scope,
.main-noCode,
.main-yourApp,
.main-animation-panel,
.main-instruments {
  opacity: 0;
  transition: 1s all;
}

.element-show {
  opacity: 1;
  transition: 1s all;
}

.arrow_custom {
  position: absolute;
  top: 20px;
  bottom: auto;
  right: auto;
  left: auto;
  z-index: 2;
  margin: 0;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  transform: matrix(-1, 0, 0, 1, 0, 0);
  width: 46px !important;
  height: 46px;
  display: inline-block;
  border-radius: 500px;
}

@media (max-width: 576px) {
  .arrow_custom {
    top: 0;
    width: 36px !important;
    height: 36px;
    z-index: 3;
  }
}
.arrow_custom:hover {
  cursor: pointer;
}

.arrow_custom.left {
  left: 350px;
}

@media (max-width: 576px) {
  .arrow_custom.left {
    left: auto;
    right: 15px;
  }
}
.arrow_custom.right {
  left: 290px;
}

@media (max-width: 576px) {
  .arrow_custom.right {
    left: auto;
    right: 55px;
  }
}
.arrow_custom svg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: auto;
}

.reviews .right {
  text-align: right;
}

.reviews .arrow_custom {
  top: 50%;
}

.reviews .arrow_custom.right {
  left: -20px;
}

.reviews .arrow_custom.left {
  left: auto;
  right: -20px;
}

@media (max-width: 576px) {
  .reviews .arrow_custom {
    top: 10px;
  }
  .reviews .arrow_custom.right {
    left: -50px;
    right: 0;
    margin: 0 auto;
  }
  .reviews .arrow_custom.left {
    left: 0;
    right: -50px;
    margin: 0 auto;
  }
}
.review_modal {
  padding: 50px;
  background: white;
  border-radius: 15px;
}

.review_modal .btn-close {
  position: absolute;
  top: 20px;
  bottom: auto;
  right: 20px;
  left: auto;
  z-index: 1;
  margin: 0;
}

.review_modal .btn-close:hover {
  cursor: pointer;
}

.offcanvas-header .btn-close {
  position: absolute;
  top: 20px;
  bottom: auto;
  right: 20px;
  left: auto;
  z-index: 1;
  margin: 0;
}

.review p.text, .review_modal p.text {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #9D9EA9;
  margin-bottom: 33px;
}

.review p.text span, .review_modal p.text span {
  color: #7098E4;
  text-decoration: underline;
  height: 500px;
}

.review p.text span:hover, .review_modal p.text span:hover {
  cursor: pointer;
}

@media (max-width: 576px) {
  .review p.text, .review_modal p.text {
    margin-top: 0;
  }
}
.review svg, .review_modal svg {
  width: 30px;
}

.review p.name, .review_modal p.name {
  font-style: normal;
  font-weight: 800;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
  color: #3F3D56;
}

.review p.project, .review_modal p.project {
  font-style: normal;
  font-weight: 500;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
}

.review p.text {
  margin-top: 64px;
}

@media (max-width: 576px) {
  .review p.text {
    margin-top: 0;
  }
}
.review {
  margin-top: 60px;
  background: #F8F8FB;
  border-radius: 60px;
  padding: 80px;
}

@media (max-width: 576px) {
  .review {
    padding: 20px;
    border-radius: 30px;
  }
}
.review .possibilities-element {
  margin-bottom: 80px;
}

@media (max-width: 576px) {
  .review .possibilities-element {
    display: none;
  }
}
.review img {
  box-shadow: none;
}

.review .inl {
  display: flex;
}

@media (max-width: 576px) {
  .review .inl {
    display: none;
  }
}
.review .inl svg {
  margin-right: 10px;
}

.link_to {
  color: #8B7FE4;
  text-decoration: underline;
}

.btn-review {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 12px;
  color: #3F3D56;
  margin-top: 20px;
  border: none;
  display: block;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 17px;
  padding: 18px 16px;
}

.btn-review svg {
  margin-right: 7px;
}

.btn-review svg path {
  stroke: #9D9EA9;
}

.btn-review:hover {
  color: #7098E4;
}

.btn-review:hover svg path {
  stroke: #7098E4;
}

.form {
  position: relative;
  background: #7264D6;
  border-radius: 30px;
  padding-bottom: 50px;
  padding-right: 20px;
}

.form .error-div {
  background: white;
  font-weight: bold;
}

.form .form-component {
  margin-right: 40px;
}

.form .form-component .p_legal {
  color: white;
}

.form .form-component a {
  color: white;
  text-decoration: underline;
}

.form .form-success {
  color: white !important;
}

.form .rel {
  position: relative;
}

@media (max-width: 1114px) {
  .form {
    background: #7264D6;
    padding: 30px;
    height: auto;
    border-radius: 17px;
  }
}
.form .background {
  position: absolute;
  top: 0px;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: -1;
  margin: 0;
  width: 100%;
}

@media (max-width: 1114px) {
  .form .background {
    display: none;
  }
}
.form .title {
  text-align: center;
  padding: 53px 15px 46px;
}

@media (max-width: 576px) {
  .form .title {
    text-align: left;
    padding: 33px 0 0;
  }
}
.form .title h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 30px;
  line-height: 130%;
  color: white;
}

.form .fix {
  max-width: 358px;
  margin: 0 auto;
  padding-top: 0;
}

@media (max-width: 576px) {
  .form .fix {
    max-width: 100%;
  }
}
@media (max-width: 768px) {
  .form .fix {
    max-width: 100%;
    text-align: center;
    padding-top: 10px;
  }
}
@media (max-width: 992px) {
  .form .fix {
    text-align: left;
    max-width: 358px;
    margin: 0 auto;
    padding-top: 0;
  }
}
.form .fix .text {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  color: white;
}

.form .fix .free {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: rgba(255, 255, 255, 0.6);
  margin-top: 30px;
}

.form .fix-form {
  max-width: 506px;
}

@media (max-width: 768px) {
  .form .fix-form {
    max-width: 100%;
    margin-top: 30px;
  }
}
@media (max-width: 992px) {
  .form .fix-form {
    max-width: 506px;
    margin-top: auto;
  }
}
.form .fix-form input {
  background: white;
  border-radius: 17px;
  border: none;
  padding: 12px 23px;
  display: block;
  width: 100%;
  outline: none;
  position: relative;
}

.form .fix-form .required {
  position: absolute;
  top: 13px;
  bottom: auto;
  right: 30px;
  left: auto;
  z-index: 1;
  margin: 0;
  opacity: 0.6;
}

.form .fix-form .required:after {
  content: "*";
  font-size: 20px;
  color: #FC8B8A;
}

.form .fix-form textarea {
  background: white;
  border-radius: 17px;
  border: none;
  padding: 12px 23px;
  display: block;
  width: 100%;
  outline: none;
}

.form .fix-form p {
  font-style: normal;
  font-weight: normal;
  font-size: 14px;
  line-height: 20px;
  color: rgba(255, 255, 255, 0.6);
}

.form .fix-form .button {
  text-align: right;
}

@media (max-width: 576px) {
  .form {
    border-radius: 0;
  }
}
.rating {
  margin-top: 100px;
  position: relative;
}

.rating .control {
  position: absolute;
  top: 0px;
  bottom: auto;
  right: auto;
  left: auto;
  z-index: 1;
  margin: 0;
  background: white;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  border-radius: 500px;
  border: none;
  width: 31px;
  height: 31px;
}

@media (max-width: 576px) {
  .rating .control {
    top: 80px;
  }
}
.rating .control svg {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
}

.rating .control.left {
  right: 60px;
}

.rating .control.left svg {
  right: 3px;
}

.rating .control.right {
  right: 10px;
}

.rating .rating-elements {
  display: flex;
  min-width: 100%;
  overflow-x: auto;
  padding-top: 50px;
  padding-bottom: 50px;
  position: relative;
  -ms-overflow-style: none;
}

.rating .rating-elements::-webkit-scrollbar {
  display: none;
  width: 0;
}

.rating .rating-elements .rating-element {
  position: relative;
  min-width: 240px;
  height: 262px;
  padding: 30px 21px;
  background: white;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  border-radius: 34px;
  margin-right: 20px;
}

@media (max-width: 576px) {
  .rating .rating-elements .rating-element {
    margin-right: 10px;
    margin-left: 10px;
  }
}
.rating .rating-title {
  margin-bottom: 31px;
}

.rating .rating-number {
  color: white;
  -webkit-text-stroke-width: 1.4px;
  -webkit-text-stroke-color: #3F3D56;
}

.rating .ratings-description {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 130%;
  color: #9D9EA9;
  width: 100%;
  max-width: 217px;
}

.rating .icon {
  position: absolute;
  top: 15px;
  bottom: auto;
  right: auto;
  left: 130px;
  z-index: 1;
  margin: 0;
  width: 56px;
  height: 56px;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 20px;
  text-align: center;
}

.rating .icon img {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
}

div.message {
  position: fixed;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: 1s all;
  opacity: 1;
}

div.message.closed {
  top: -100px;
  opacity: 0;
  transition: 1s all;
}

div.message.hidden {
  display: none;
  transition: 1s all;
}

div.message div.element {
  position: absolute;
  top: auto;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
  background-color: white;
  border-radius: 28px;
  width: 100%;
  max-width: 655px;
  height: auto;
  padding: 40px;
  text-align: center;
}

div.message div.element svg {
  position: absolute;
  top: 40px;
  bottom: auto;
  right: 32px;
  left: auto;
  z-index: 1;
  margin: 0;
  width: 16px;
  height: 16px;
  transform: rotate(0deg);
  transition: 0.5s transform;
}

div.message div.element svg:hover {
  cursor: pointer;
  transform: rotate(90deg);
  transition: 0.5s transform;
}

div.message div.element a {
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 130%;
  color: white;
  background: #F878C2;
  border-radius: 17px;
  padding: 14px 19px;
  border: none;
  transition: 1s background-color;
}

div.message div.element a:hover {
  transition: 1s background-color;
  background: rgba(248, 120, 194, 0.7);
}

div.message div.element p {
  width: 100%;
  margin: 0 auto;
}

div.message div.element p.hello {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
  width: 100%;
  max-width: 480px;
}

div.message div.element p.thanks {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 130%;
  color: #3F3D56;
  margin-top: 19px;
  max-width: 423px;
}

div.message div.element p.manager {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 130%;
  color: #9D9EA9;
  margin-top: 25px;
  max-width: 485px;
}

div.message div.element p.formDescription {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 130%;
  color: #3F3D56;
  margin-top: 26px;
  margin-bottom: 39px;
  max-width: 398px;
}

.s-button {
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 12px;
  color: white;
  position: relative;
  text-align: center;
  border-radius: 17px;
  padding-left: 33px;
  padding-right: 33px;
  border: none;
  transition: all 0.3s;
  outline: none;
  text-decoration: none;
  display: inline-block;
  height: 54px;
  max-height: 54px;
  line-height: 54px;
  margin-top: 5px;
  margin-bottom: 5px;
}

@media (max-width: 576px) {
  .s-button {
    height: 44px;
    line-height: 44px;
  }
}
.s-button:hover {
  color: white;
}

@media (max-width: 645px) {
  .s-button {
    display: block;
    width: 100%;
  }
}
.s-button:hover {
  cursor: pointer;
  transition: all 0.3s;
}

.s-button:active {
  transition: all 0.3s;
}

.s-button.s-accordion {
  color: white;
  background-color: #8B7FE4;
}

.s-button.s-accordion::after {
  content: "";
  width: 8px;
  height: 6px;
  margin-left: 15px;
  background-image: url("data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M7.05554 6H1.34446C0.778143 6 0.446236 5.36252 0.770997 4.89858L3.62654 0.819232C3.90521 0.42113 4.49479 0.421131 4.77346 0.819232L7.629 4.89858C7.95376 5.36252 7.62186 6 7.05554 6Z' fill='%23FFFFFF'/></svg>");
  background-size: 8px;
}

.s-button.s-accordion:focus {
  background-color: #F8F8FB;
  color: #9D9EA9;
}

.s-button.s-start {
  color: #3F3D56;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  margin-left: 15px;
}

@media (max-width: 1300px) {
  .s-button.s-start {
    border-radius: 12px;
    font-size: 13px;
  }
}
@media (max-width: 576px) {
  .s-button.s-start {
    display: none;
  }
}
@media (max-width: 992px) {
  .s-button.s-start {
    display: inline-block;
  }
}
@media (max-width: 768px) {
  .s-button.s-start {
    display: none;
  }
}
.s-button.s-start:hover {
  color: #8B7FE4;
}

.s-button.s-main {
  background: #7264D6;
}

.s-button.s-main:hover {
  color: white;
  background: rgba(114, 100, 214, 0.7);
}

.s-button.s-white {
  background: rgba(255, 255, 255, 0.9);
  color: #3F3D56;
}

.s-button.s-white:hover {
  color: #3F3D56;
  background: rgb(255, 255, 255);
}

.s-button.s-form {
  background: #F878C2;
}

.s-button.s-form:hover {
  background: #8B7FE4;
}

.s-button.s-form span {
  margin-left: 15px;
}

.s-button.s-telegram {
  white-space: nowrap;
  background: #7098E4;
}

.s-button.s-telegram svg {
  width: 27px;
  margin-right: 10px;
}

.s-button.s-instagram {
  display: inline-block;
  width: 54px;
  height: 54px;
  padding: 0;
  border-radius: 500px;
  background: #f09433;
  background: linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#f09433", endColorstr="#bc1888",GradientType=1 );
}

.s-button.s-instagram svg {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
  width: 28.8px;
  height: 28.8px;
}

.s-button.s-sub {
  background: #7264D6;
}

@media (max-width: 576px) {
  .s-button {
    display: block;
    width: 100%;
  }
}
.links-store {
  margin-top: 25px;
}

.redirect-store {
  position: relative;
  background: #F8F8FB;
  border-radius: 6px;
  width: 50px;
  height: 50px;
  margin-right: 12px;
  display: inline-block;
  align-items: center;
  justify-content: center;
}

.redirect-store img {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
}

.redirect-store svg {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
}

.redirect-store.apple svg {
  top: -3px;
}

.redirect-store.google img {
  border-radius: 0;
}

.redirect-store.web {
  position: relative;
  display: inline-flex;
  width: 155px;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 17px;
  align-items: center;
  justify-content: center;
  margin: 0;
}

.redirect-store.web p {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 12px;
  color: #3F3D56;
  margin: 0;
}

.redirect-store.web svg.panel {
  position: absolute;
  top: 16px;
  bottom: auto;
  right: auto;
  left: 17px;
  z-index: 1;
  margin: 0;
}

.redirect-store.web svg.arrow {
  position: absolute;
  top: 20px;
  bottom: auto;
  right: 21px;
  left: auto;
  z-index: 1;
  margin: 0;
}

.work-margin {
  margin-top: 150px;
  margin-bottom: 50px;
}

@media (max-width: 576px) {
  .work-margin {
    margin-top: 0;
    margin-bottom: 0;
  }
}
.examples {
  margin-top: 250px;
  margin-bottom: 100px;
}

@media (max-width: 576px) {
  .examples {
    margin-top: 120px;
    margin-bottom: 50px;
  }
}
.examples .for-nav {
  width: 100%;
  text-align: center;
  margin-bottom: 50px;
}

.examples .for-nav li {
  margin-top: 30px;
}

@media (max-width: 576px) {
  .examples .for-nav li {
    margin-top: 10px;
  }
}
.examples .tab {
  left: 0;
  right: 0;
  margin: 58px auto 0;
}

@media (max-width: 576px) {
  .examples .tab {
    margin-top: 0;
  }
}
.examples .tab.nav {
  display: inline-flex;
  width: auto;
  text-align: center;
}

.examples .tab-nav {
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 130%;
  color: #3F3D56;
  border: 1px solid #D4D3E3;
  box-sizing: border-box;
  border-radius: 10px;
  margin: 0 7px 14px;
  padding: 10px 20px;
  text-align: center;
  background-color: transparent;
}

@media (max-width: 576px) {
  .examples .tab-nav {
    padding: 4px 10px;
    border-radius: 10px;
    font-size: 14px;
    margin: 7px 7px;
  }
}
.examples .tab-nav.active {
  background: #7098E4;
  color: white;
  border-color: #7098E4;
}

.examples .work .for-text {
  text-align: right;
}

@media (max-width: 576px) {
  .examples .work .for-text {
    text-align: center;
  }
}
.examples .work .for-text .work-text {
  max-width: 430px;
  display: inline-block;
  text-align: left;
}

@media (max-width: 576px) {
  .examples .work .for-text .work-text {
    text-align: center;
  }
}
.examples .work .for-text .work-text h3 {
  font-size: 34px;
}

@media (max-width: 576px) {
  .examples .work .for-text .work-text h3 {
    font-size: 28px;
  }
}
.examples .work .for-text .work-text h4 {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 29px;
  color: #9D9EA9;
  margin-bottom: 10px;
}

@media (max-width: 576px) {
  .examples .work .for-text .work-text h4 {
    font-size: 14px;
  }
}
.examples .work .for-text .work-text h7 {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 29px;
  color: #7098E4;
}

@media (max-width: 576px) {
  .examples .work .for-text .work-text h7 {
    font-size: 14px;
  }
}
.examples .legal {
  font-size: 16px;
  line-height: 200%;
}

.examples h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 34px;
  line-height: 130%;
  color: #3F3D56;
}

@media (max-width: 768px) {
  .examples h3 {
    margin-top: 50px;
    font-size: 26px;
    text-align: center;
  }
}
@media (max-width: 992px) {
  .examples h3 {
    margin-top: auto;
    text-align: left;
  }
}
.examples .images {
  text-align: center;
  position: relative;
  min-height: 600px;
}

@media (max-width: 576px) {
  .examples .images {
    min-height: 650px;
  }
}
.examples .images .figures svg {
  position: absolute;
  top: auto;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: 0 auto;
}

.examples .images .figures svg.main {
  z-index: -1;
}

.examples .images .figures svg.one {
  z-index: -2;
}

.examples .images .figures svg.two {
  z-index: -2;
}

.examples .images .figures.left svg.main {
  top: 0;
  right: 70px;
}

.examples .images .figures.left svg.one {
  top: -40px;
  right: -40px;
}

.examples .images .figures.left svg.two {
  top: 280px;
  right: 140px;
}

.examples .images .figures.right svg.main {
  top: 240px;
  left: 185px;
}

.examples .images .figures.right svg.one {
  top: -20px;
  left: 60px;
}

.examples .images .figures.right svg.two {
  top: 320px;
  left: -130px;
}

.examples .images img {
  width: 100%;
}

.examples .images img.screen {
  border-radius: 30px;
}

.examples .images .background {
  position: absolute;
  top: auto;
  bottom: auto;
  right: auto;
  left: auto;
  z-index: 1;
  margin: 0 auto;
  background-color: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  width: 240px;
  opacity: 1;
  transition: all 1s;
  border-radius: 40px;
  padding: 10px;
}

.examples .images .background.one {
  top: 30px;
  left: -180px;
  right: 0;
}

@media (max-width: 576px) {
  .examples .images .background.one {
    left: 0;
    right: auto;
    transition: all 0.5s;
  }
}
.examples .images .background.two {
  top: 98px;
  left: 0;
  right: -180px;
}

.examples .images .background.two img.logo {
  position: absolute;
  top: -85px;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: 0 auto;
  width: 70px;
  height: 70px;
  border-radius: 15px;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
}

@media (max-width: 576px) {
  .examples .images .background.two img.logo {
    display: none;
  }
}
@media (max-width: 576px) {
  .examples .images .background.two {
    left: auto;
    right: 0;
    transition: all 0.5s;
  }
}
.examples .images .images-bg-one .one {
  position: absolute;
  top: 200px;
  bottom: auto;
  right: auto;
  left: 120px;
  z-index: 1;
  margin: 0;
}

.examples .images .images-bg-one .two {
  position: absolute;
  top: -50px;
  bottom: auto;
  right: auto;
  left: 80px;
  z-index: 1;
  margin: 0;
}

.examples .images .images-bg-one .three {
  position: absolute;
  top: 300px;
  bottom: auto;
  right: auto;
  left: 80px;
  z-index: 1;
  margin: 0;
}

.legal {
  margin-top: 150px;
  margin-bottom: 50px;
}

.legal p {
  margin-top: 30px;
}

.main_picture {
  position: relative;
  width: 100%;
  max-width: 641px;
}

@media (max-width: 991px) {
  .main_picture {
    display: none;
  }
}
.main_picture .screens {
  position: absolute;
  top: -268px;
  bottom: auto;
  right: 531px;
  left: auto;
  z-index: -1;
  margin: 0;
}

@media (max-width: 992px) {
  .main_picture .screens {
    right: auto !important;
    left: 0 !important;
  }
}
.main_picture .screens .first {
  top: 94px !important;
  z-index: -1 !important;
}

@media (max-width: 992px) {
  .main_picture .screens .first {
    right: auto !important;
    left: 156px !important;
  }
}
.main_picture .screens .second {
  top: 53px !important;
  left: 217px !important;
  z-index: -2 !important;
}

@media (max-width: 992px) {
  .main_picture .screens .second {
    right: auto !important;
    left: 365px !important;
  }
}
.main_picture img.item {
  position: absolute;
  top: auto;
  bottom: auto;
  right: auto;
  left: auto;
  z-index: 0;
  margin: 0;
}

.main_picture img.item.item_moon {
  display: none;
  width: 101px;
  height: 101px;
  top: -122px;
  right: 557px;
}

@media (max-width: 1110px) {
  .main_picture img.item.item_moon {
    display: none;
  }
}
.main_picture img.item.item_man {
  width: 311px;
  height: 311px;
  top: -108px;
  right: 365px;
}

@media (max-width: 992px) {
  .main_picture img.item.item_man {
    right: auto;
    left: 0;
  }
}
@media (max-width: 1045px) {
  .main_picture img.item.item_man {
    display: none;
  }
}
.main_picture img.item.item_girl {
  width: 346px;
  height: 346px;
  top: -50px;
  right: -108px;
}

@media (max-width: 992px) {
  .main_picture img.item.item_girl {
    right: auto !important;
    left: 445px !important;
  }
}
.main_picture img.item.item_transport {
  width: 319px;
  height: 319px;
  top: 138px;
  right: 376px;
}

@media (max-width: 1110px) {
  .main_picture img.item.item_transport {
    right: auto !important;
    left: -42px !important;
  }
}
.main_picture img.item.item_phone {
  width: 100px;
  height: 100px;
  top: -253px;
  right: -1px;
}

@media (max-width: 992px) {
  .main_picture img.item.item_phone {
    right: auto !important;
    left: 616px !important;
  }
}
.main_picture img.item.item_planet {
  width: 174px;
  height: 174px;
  top: -310px;
  right: 27px;
}

@media (max-width: 992px) {
  .main_picture img.item.item_planet {
    right: auto !important;
    left: 517px !important;
  }
}
.scope h5 {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
  width: 100%;
  max-width: 380px;
}

.scope h5 span {
  color: #7098E4;
}

.scope-image {
  width: 100%;
}

.home-top {
  margin-top: 300px;
  margin-bottom: 250px;
}

.home-top.landing {
  position: relative;
  margin-bottom: 150px;
}

@media (max-width: 576px) {
  .home-top.landing {
    margin-bottom: 50px;
  }
}
.home-top .center {
  text-align: center;
}

.home-top.landing .center {
  text-align: center;
}

.home-top h1, .home-top h2 {
  margin-left: auto;
  margin-right: auto;
}

.home-top.landing h1 {
  margin: 0 auto;
  font-weight: 600;
  line-height: 1;
  text-align: left;
}

@media (max-width: 576px) {
  .home-top.landing h1 {
    font-size: 42px !important;
  }
}
.home-top.landing h2 {
  margin-top: 40px;
  margin-bottom: 40px;
  line-height: 1.3;
  text-align: left;
}

.home-top.landing .example {
  width: 260px;
  position: absolute;
  top: auto;
  bottom: auto;
  right: 0px;
  left: auto;
  z-index: 2;
  margin: 0 auto;
}

.home-top.landing h1 {
  font-size: 60px;
}

.home-top.landing h1 span {
  color: rgba(114, 100, 214, 0.8);
  font-family: inherit;
  font-style: normal;
  font-weight: inherit;
}

@media (max-width: 992px) {
  .home-top {
    margin-top: 140px !important;
  }
}
@media (max-width: 576px) {
  .home-top {
    margin-top: 120px !important;
    margin-bottom: 60px;
    height: auto;
    min-height: auto;
  }
  .home-top h1 {
    font-size: 22px;
    text-align: left;
  }
  .home-top h2 {
    font-size: 16px;
    text-align: left;
  }
}
.done {
  margin-top: 68px;
}

@media (max-width: 576px) {
  .done .backgroundMain {
    display: none;
  }
}
.done .in {
  position: relative;
  padding-top: 30px;
  padding-left: 10px;
}

.done .in .title {
  font-style: normal;
  font-weight: bold;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
  margin-top: 38px;
  width: 100%;
  max-width: 230px;
}

@media (max-width: 576px) {
  .done .in .title {
    margin-top: 12px;
    margin-bottom: 10px;
    font-size: 18px;
  }
}
.done .in span {
  position: absolute;
  top: 0px;
  bottom: auto;
  right: auto;
  left: 10px;
  z-index: 1;
  margin: 0;
  font-style: normal;
  font-weight: 800;
  font-size: 24px;
  line-height: 130%;
  color: #7098E4;
  transition: all 0.2s;
}

.done .in svg {
  position: absolute;
  top: 6px;
  bottom: auto;
  right: auto;
  left: 50px;
  z-index: 1;
  margin: 0;
  transition: all 0.2s;
}

.done .in:hover span {
  top: -6px;
  transition: all 0.2s;
}

.done .in:hover img {
  left: 55px;
  top: 7px;
  transform: scale(1.2);
  transition: all 0.2s;
}

.done h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
  margin-bottom: 76px;
}

@media (max-width: 576px) {
  .done h3 {
    font-size: 30px;
    margin-bottom: 36px;
  }
}
.done.demo {
  margin-top: 150px;
}

.done.demo h3 {
  margin-bottom: 26px;
}

@media (max-width: 576px) {
  .done.demo {
    margin-top: 70px;
  }
}
.done .description {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  color: #9D9EA9;
}

@media (max-width: 576px) {
  .done .description {
    font-size: 14px;
  }
}
.done h4 {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
}

.done .example {
  margin-top: 150px;
}

@media (max-width: 576px) {
  .done .example {
    margin-top: 50px;
    border-radius: 0;
  }
}
.done .fix {
  max-width: 407px;
  margin-bottom: 40px;
}

.done .animate {
  height: 667px;
  position: relative;
}

.done .animate .rel {
  position: relative;
}

@media (max-width: 576px) {
  .done .animate {
    height: auto;
    min-height: 400px;
  }
}
@keyframes infinity {
  from {
    stroke-dasharray: 0 100;
    stroke-dashoffset: 50;
  }
  to {
    stroke-dasharray: 100 0;
    stroke-dashoffset: 150;
  }
}
@keyframes infinity-double-lines {
  from {
    stroke-dasharray: 0 53 0 47;
    stroke-dashoffset: 37;
  }
  to {
    stroke-dasharray: 553 0 47 0;
    stroke-dashoffset: 160;
  }
}
@keyframes infinity-double-lines-two {
  from {
    stroke-dasharray: 0 53 0 47;
    stroke-dashoffset: 37;
  }
  to {
    stroke-dasharray: 553 0 47 0;
    stroke-dashoffset: 160;
  }
}
@keyframes example {
  0% {
    z-index: 3;
    right: 260px;
  }
  50% {
    z-index: 5;
    right: 310px;
  }
  100% {
    z-index: 5;
    right: 260px;
  }
}
.done svg .infinity {
  animation: infinity-double-lines 8s ease-in-out 0s alternate infinite;
  stroke: #FFF5C2;
}

.done svg .infinity-two {
  animation: infinity-double-lines-two 8s ease-in-out 0s alternate infinite;
  stroke: #FED4D4;
}

.done .itemOne {
  position: absolute;
  top: 10px;
  bottom: auto;
  right: 30px;
  left: auto;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .done .itemOne {
    margin: 0 auto;
    right: 10px;
    left: 0;
  }
}
.done .itemTwo {
  position: absolute;
  top: 330px;
  bottom: auto;
  right: 220px;
  left: auto;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .done .itemTwo {
    margin: 0 auto;
    right: 100px;
    left: 0;
  }
}
.done .itemThree {
  position: absolute;
  top: 30px;
  bottom: auto;
  right: 70px;
  left: auto;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .done .itemThree {
    margin: 0 auto;
    right: 70px;
    left: 0;
  }
}
.done div.app {
  max-width: 240px;
  padding: 11px 10px;
  border-radius: 40px;
  width: 100%;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
}

.done div.app div.bang {
  position: absolute;
  top: auto;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: 2;
  margin: 0 auto;
  background: white;
  box-shadow: none;
  width: 120px;
  height: 17px;
  border-radius: 0 0 15px 15px;
}

.done div.app img {
  width: 100%;
  border-radius: 30px;
}

.done .phoneOne {
  position: absolute;
  top: 30px;
  bottom: auto;
  right: 260px;
  left: auto;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .done .phoneOne {
    max-width: 55% !important;
    top: 10px !important;
    left: 0;
    right: auto;
    transition: all 0.5s;
  }
}
.done .phoneTwo {
  position: absolute;
  top: 80px;
  bottom: auto;
  right: 60px;
  left: auto;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .done .phoneTwo {
    max-width: 55% !important;
    top: 10px !important;
    left: auto;
    right: 0;
    transition: all 0.5s;
  }
}
.done .example {
  background-color: #F8F8FB;
  border-radius: 60px;
  padding: 65px 50px 58px;
}

@media (max-width: 1029px) {
  .done .example {
    border-radius: 40px;
    padding: 35px 20px 28px;
  }
  .done .example .phoneTwo {
    display: none;
  }
  .done .example .phoneOne {
    right: 100px;
    top: 76px;
  }
}
@media (max-width: 767px) {
  .done .example {
    border-radius: 40px;
    padding: 35px 20px 28px;
  }
  .done .example .animate {
    max-width: 300px;
    margin: 0 auto;
  }
  .done .example .animate .app {
    border-radius: 30px;
  }
  .done .example .phoneTwo {
    display: block;
  }
  .done .example .phoneOne {
    right: 260px;
    top: 30px;
  }
}
@media (max-width: 576px) {
  .done .example {
    border-radius: 0;
  }
}
.done .example .example_title p.logo_title {
  font-style: normal;
  font-weight: 700;
  font-size: 28px;
  line-height: 40px;
  color: #3F3D56;
}

@media (max-width: 576px) {
  .done .example .example_title p.logo_title {
    text-align: center;
    font-size: 18px;
  }
}
@media (max-width: 576px) {
  .done .example .example_title p.description {
    text-align: center;
  }
}
.done .example .example_title .forLogo {
  width: 91px;
  height: 91px;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  position: relative;
  border-radius: 30px;
}

@media (max-width: 576px) {
  .done .example .example_title .forLogo {
    width: 51px;
    height: 56px;
    border-radius: 20px;
  }
}
@media (max-width: 576px) {
  .done .example .example_title .forLogo {
    margin: 0 auto;
  }
}
.done .example .example_title .forLogo img {
  position: absolute;
  top: 12.48px;
  bottom: auto;
  right: auto;
  left: 9.36px;
  z-index: 1;
  margin: 0;
  width: 70.2px;
  height: 66.06px;
}

@media (max-width: 576px) {
  .done .example .example_title .forLogo img {
    width: 30px;
    height: auto;
  }
}
.done .example .example_title div.stores {
  display: flex;
}

.done .example .example_title div.stores div.store {
  position: relative;
  width: 50px;
  height: 50px;
  background: white;
  border-radius: 12px;
  margin-right: 12px;
}

.done .example .example_title div.stores div.store img {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
  width: 30px;
}

.instruments {
  margin-bottom: 150px;
  position: relative;
}

@media (max-width: 576px) {
  .instruments {
    margin-bottom: 80px;
  }
}
.instruments .rel {
  position: relative;
}

.instruments img {
  width: 150px;
}

.instruments .img-one {
  width: 130.88px;
  height: 115.82px;
}

.instruments .img-two {
  width: 143.02px;
  height: 129.82px;
}

.instruments .img-three {
  width: 141.1px;
  height: 113.95px;
}

.instruments .img-four-one {
  position: absolute;
  top: 20px;
  bottom: auto;
  right: 80px;
  left: auto;
  z-index: 1;
  margin: 0;
  width: 67px;
  height: 65px;
}

.instruments .img-four-two {
  position: absolute;
  top: auto;
  bottom: auto;
  right: 30px;
  left: auto;
  z-index: 1;
  margin: 0;
  width: 80px;
  height: 90px;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 17px;
}

.instruments h5 {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
  text-align: left;
}

@media (max-width: 576px) {
  .instruments h5 {
    font-size: 26px;
  }
}
.instruments .title {
  font-style: normal;
  font-weight: bold;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
}

@media (max-width: 576px) {
  .instruments .title {
    font-size: 18px;
  }
}
.instruments .in {
  margin-top: 70px;
}

@media (max-width: 576px) {
  .instruments .in {
    margin-top: 10px;
  }
}
.instruments p {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 22px;
  color: #9D9EA9;
}

.instruments p.icons .number {
  font-style: normal;
  font-weight: 800;
  font-size: 24px;
  line-height: 130%;
  color: #7098E4;
  margin-right: 10px;
}

.instruments p.icons .icon img {
  margin-top: -10px;
}

@media (max-width: 992px) {
  .main {
    position: absolute;
    top: 100px;
    right: 30px;
    z-index: -1;
  }
}
@media (max-width: 766px) {
  .main {
    left: 300px;
    right: auto;
    transform: scale(1.5);
  }
}
.main-noCode {
  margin-top: 200px;
}

@media (max-width: 576px) {
  .main-noCode {
    margin-top: 50px;
  }
}
.nocode {
  margin-top: 50px;
  margin-bottom: 60px;
  position: relative;
}

@media (max-width: 576px) {
  .nocode {
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
.nocode .left h4 {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
  width: 100%;
  max-width: 396px;
}

@media (max-width: 576px) {
  .nocode .left h4 {
    font-size: 30px;
  }
}
.nocode .left h4 span {
  color: #7098E4;
}

.nocode .left p {
  font-style: normal;
  font-weight: 800;
  font-size: 56px;
  line-height: 130%;
  color: #3F3D56;
  margin-top: 46px;
  margin-bottom: 60px;
}

@media (max-width: 576px) {
  .nocode .left p {
    font-size: 46px;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}
@media (max-width: 991px) {
  .nocode .right {
    margin-top: 80px;
  }
}
.nocode .right .in {
  margin-bottom: 42px;
  padding-left: 60px;
  position: relative;
}

.nocode .right .in:hover img {
  left: 5px;
  transition: all 0.3s;
}

.nocode .right .in img {
  position: absolute;
  top: 4px;
  bottom: auto;
  right: auto;
  left: 10px;
  z-index: 1;
  margin: 0;
  transition: all 0.3s;
}

.nocode .right .in .title {
  font-style: normal;
  font-weight: bold;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
  font-style: normal;
  font-weight: bold;
  font-size: 22px;
  line-height: 130%;
}

.nocode .right .in .title span {
  color: #F878C2;
}

.nocode .right .in p {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 22px;
  color: #9D9EA9;
  margin-top: -10px;
}

.main-panel {
  max-width: 1140px;
  background: transparent;
  margin: 100px auto 100px auto;
}

@media (max-width: 576px) {
  .main-panel {
    margin: 100px 0 100px;
  }
}
.main-panel h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 36px;
  line-height: 130%;
  color: #3F3D56;
}

.main-panel h4 {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 22px;
  color: #9D9EA9;
  width: 100%;
  max-width: 416px;
  margin-top: 20px;
}

.main-panel .flex {
  margin-top: 40px;
}

.main-panel a.panel-click {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 12px;
  color: #7098E4;
  display: block;
  margin-top: 12px;
}

.main-panel a.panel-click svg path {
  stroke: #7098E4;
}

.found {
  margin-top: 200px;
  margin-bottom: 100px;
  text-align: center;
}

.found .number {
  font-size: 300px;
  font-weight: 800;
  line-height: 110%;
}

@media (max-width: 576px) {
  .found .number {
    font-size: 150px;
  }
}
.found .number span {
  color: #8B7FE4;
}

.found .text {
  font-style: normal;
  font-weight: bold;
  font-size: 18px;
  line-height: 29px;
  color: #3F3D56;
}

.possibilities {
  margin-top: 250px;
}

@media (max-width: 576px) {
  .possibilities {
    margin-top: 120px;
  }
}
@media (max-width: 576px) {
  .possibilities-element .listing-element_item {
    background-color: #f9f9f9;
    border-radius: 500px;
    padding: 0 15px !important;
    margin-bottom: 5px;
  }
}
.possibilities-element h7 {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 29px;
  color: #7098E4;
}

@media (max-width: 576px) {
  .possibilities-element h7 {
    font-size: 14px;
  }
}
.possibilities-element .description {
  margin-bottom: 31px;
}

.possibilities-element img {
  color: black;
}

.possibilities-element .pictures {
  position: relative;
  min-height: 530px;
}

@media (max-height: 398px) {
  .possibilities-element .pictures {
    min-height: 450px;
  }
}
.possibilities-element .pictures div {
  width: 240px;
}

.possibilities-element .pictures div .app {
  padding: 11px 10px;
  border-radius: 40px;
  width: 100%;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
}

@media (max-width: 576px) {
  .possibilities-element .pictures div .app {
    border-radius: 30px;
  }
}
@media (max-width: 576px) {
  .possibilities-element .pictures div .app div.bang {
    width: 100px;
  }
}
.possibilities-element .pictures div .app.black {
  background: #312F44;
}

.possibilities-element .pictures div .app.black div.bang {
  background: #312F44;
}

.possibilities-element .pictures div .app img {
  position: relative;
  width: 100%;
  border-radius: 30px;
}

@media (max-width: 576px) {
  .possibilities-element .pictures div .app img {
    border-radius: 25px;
  }
}
.possibilities-element .pictures img {
  max-width: 310px;
}

.possibilities-element .pictures img.logo {
  position: absolute;
  top: 0px;
  bottom: auto;
  right: auto;
  left: 270px;
  z-index: 1;
  margin: 0;
  width: 77px;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 25px;
}

@media (max-width: 576px) {
  .possibilities-element .pictures img.logo {
    display: none;
  }
}
.possibilities-element .pictures .noActive {
  opacity: 0.5;
}

@media (max-width: 576px) {
  .possibilities-element .pictures.example-work .first, .possibilities-element .pictures.example-work .second, .possibilities-element .pictures.example-work .first-hidden, .possibilities-element .pictures.example-work .second-hidden {
    top: 30px !important;
  }
}
@media (max-width: 576px) {
  .possibilities-element .pictures .first, .possibilities-element .pictures .second, .possibilities-element .pictures .first-hidden, .possibilities-element .pictures .second-hidden {
    max-width: 55%;
    top: 40px !important;
  }
}
.possibilities-element .pictures .first, .possibilities-element .pictures .second {
  opacity: 1;
}

.possibilities-element .pictures .first-hidden, .possibilities-element .pictures .second-hidden {
  opacity: 0;
}

.possibilities-element .pictures .first-hidden {
  position: absolute;
  top: 60px;
  bottom: auto;
  right: auto;
  left: 10px;
  z-index: 1;
  margin: 0;
  transition: all 1s;
}

@media (max-width: 576px) {
  .possibilities-element .pictures .first-hidden {
    left: -30px;
    right: auto;
    transition: all 0.5s;
  }
}
.possibilities-element .pictures .second-hidden {
  position: absolute;
  top: 68px;
  bottom: auto;
  right: auto;
  left: 190px;
  z-index: 1;
  margin: 0;
  transition: all 1s;
}

@media (max-width: 576px) {
  .possibilities-element .pictures .second-hidden {
    left: auto;
    right: -10px;
    transition: all 0.5s;
  }
}
.possibilities-element .pictures .first {
  position: absolute;
  top: 30px;
  bottom: auto;
  right: auto;
  left: 10px;
  z-index: 1;
  margin: 0;
  opacity: 1;
  transition: all 1s;
}

@media (max-width: 576px) {
  .possibilities-element .pictures .first {
    left: 0;
    right: auto;
    transition: all 0.5s;
  }
}
.possibilities-element .pictures .second {
  position: absolute;
  top: 98px;
  bottom: auto;
  right: auto;
  left: 190px;
  z-index: 2;
  margin: 0;
  opacity: 1;
  transition: all 1s;
}

@media (max-width: 576px) {
  .possibilities-element .pictures .second {
    left: auto;
    right: 0;
    transition: all 0.5s;
  }
}
.possibilities-element .text {
  min-height: 600px;
}

.possibilities-element .text .items div {
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 37px;
  color: #3F3D56;
  padding-left: 10px;
  transition: all 0.5s;
}

@media (max-width: 576px) {
  .possibilities-element .text .items div {
    font-size: 12px;
    display: inline-block;
  }
}
.possibilities-element .text .items div .dependences {
  color: #9D9EA9;
}

.possibilities-element .text .items div img {
  max-width: 20px;
  position: relative;
  top: 0;
  right: 10px;
  opacity: 0.5;
  transition: all 0.5s;
}

@media (max-width: 576px) {
  .possibilities-element .text .items div img {
    display: none;
  }
}
.possibilities-element .text .items div.no-active {
  cursor: default !important;
  color: #9D9EA9;
}

.possibilities-element .text .items div.no-active:hover {
  cursor: default !important;
  color: #9D9EA9;
}

.possibilities-element .text .items div:hover {
  cursor: pointer;
  color: rgba(112, 152, 228, 0.7);
  transition: all 0.5s;
}

.possibilities-element .text .items div:hover img {
  opacity: 1;
  transition: all 0.5s;
}

.possibilities-element .text .items div.active {
  color: #7098E4;
  transition: all 0.5s;
}

.possibilities-element .text .items div.active p {
  color: #7098E4;
}

@media (max-width: 576px) {
  .possibilities-element .text .items div.active svg {
    display: none;
  }
}
.possibilities-element .text .items div.active svg g {
  opacity: 1;
  transition: all 0.5s;
}

.possibilities-element .text .items div.active img {
  opacity: 1;
  transition: all 0.5s;
}

.opportunities-panel {
  background: #F8F8FB;
  padding: 109px 0;
  margin-top: 109px;
}

@media (max-width: 576px) {
  .opportunities-panel {
    margin-top: 30px;
    padding: 30px 0;
  }
}
.opportunities-panel h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
}

.opportunities-panel h4 {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 29px;
  color: #9D9EA9;
  width: 100%;
  max-width: 501px;
  margin-bottom: 32px;
}

.opportunities-panel p {
  font-style: normal;
  font-weight: bold;
  font-size: 18px;
  line-height: 130%;
  color: #3F3D56;
}

@media (max-width: 576px) {
  .opportunities-panel p {
    font-size: 14px;
  }
}
.opportunities-panel p span {
  display: inline-block;
  padding: 14px 20px;
  border: 1px solid #D4D3E3;
  border-radius: 17px;
  margin: 0 14px 14px 0;
}

@media (max-width: 576px) {
  .opportunities-panel p span {
    padding: 9px 13px;
    border-radius: 10px;
  }
}
.dashboard img {
  width: 100%;
  border-radius: 16px;
}

.opportunities-images {
  min-height: 600px;
}

.opportunities-images .noActive {
  opacity: 0.5 !important;
}

@media (max-width: 576px) {
  .opportunities-images {
    height: auto;
    min-height: 100px;
  }
}
.opportunities-images h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 34px;
  line-height: 130%;
  color: #3F3D56;
}

.opportunities-images h4 {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 29px;
  color: #9D9EA9;
  margin-top: -15px;
  margin-bottom: 35px;
}

.opportunities-images .index-no {
  opacity: 0.3 !important;
}

.opportunities-images img {
  max-width: 310px;
}

.opportunities-images .images-hidden-left,
.opportunities-images .images-hidden-right {
  opacity: 0.5;
}

@media (max-width: 576px) {
  .opportunities-images .images-hidden-left,
  .opportunities-images .images-hidden-right {
    max-width: 70%;
  }
}
.opportunities-images .images-hidden-left.disable,
.opportunities-images .images-hidden-right.disable {
  opacity: 0 !important;
}

@media (max-width: 576px) {
  .opportunities-images .index-one,
  .opportunities-images .index-two {
    max-width: 70%;
    top: 10px !important;
  }
}
.opportunities-images .index-one {
  position: absolute;
  top: 98px;
  bottom: auto;
  right: auto;
  left: 190px;
  z-index: 1;
  margin: 0;
  opacity: 1;
  transition: all 1s;
}

@media (max-width: 576px) {
  .opportunities-images .index-one {
    left: -20px;
    right: auto;
    transition: all 0.5s;
  }
}
.opportunities-images .index-two {
  position: absolute;
  top: 30px;
  bottom: auto;
  right: auto;
  left: 10px;
  z-index: 1;
  margin: 0;
  opacity: 1;
  transition: all 1s;
}

@media (max-width: 576px) {
  .opportunities-images .index-two {
    left: auto;
    right: 0;
    transition: all 0.5s;
  }
}
.opportunities-images .index-three {
  position: absolute;
  top: 30px;
  bottom: auto;
  right: auto;
  left: 10px;
  z-index: 1;
  margin: 0;
  transition: all 1s;
}

.opportunities-images .images-hidden-left {
  position: absolute;
  top: 98px;
  bottom: auto;
  right: auto;
  left: 190px;
  z-index: 1;
  margin: 0;
  opacity: 0.5;
  transition: all 1s;
}

.opportunities-images .images-hidden-left.disable {
  top: 68px;
  left: 190px;
}

@media (max-width: 576px) {
  .opportunities-images .images-hidden-left {
    left: -30px;
    right: auto;
    transition: all 0.5s;
  }
}
.opportunities-images .images-hidden-right {
  position: absolute;
  top: 30px;
  bottom: auto;
  right: auto;
  left: 10px;
  z-index: 1;
  margin: 0;
  opacity: 0.5;
  transition: all 1s;
}

.opportunities-images .images-hidden-right.disable {
  top: 60px;
  left: 10px;
}

@media (max-width: 576px) {
  .opportunities-images .images-hidden-right {
    left: auto;
    right: -10px;
    transition: all 0.5s;
  }
}
.opportunities-images .images {
  text-align: center;
  position: relative;
  min-height: 600px;
}

.opportunities-images .images div {
  width: 240px;
}

.opportunities-images .images div .app {
  padding: 11px 10px;
  border-radius: 40px;
  width: 100%;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
}

.opportunities-images .images div .app.black {
  background: #312F44;
}

.opportunities-images .images div .app.black div.bang {
  background: #312F44;
}

.opportunities-images .images div .app img {
  position: relative;
  width: 100%;
  border-radius: 30px;
}

@media (max-width: 576px) {
  .opportunities-images .images {
    min-height: 480px;
  }
}
@media (max-width: 576px) {
  .opportunities-images .images .images-bg-one {
    display: none;
  }
}
.opportunities-images .images .images-bg-one .one {
  position: absolute;
  top: 200px;
  bottom: auto;
  right: auto;
  left: 120px;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .opportunities-images .images .images-bg-one .one {
    width: 1px;
  }
}
.opportunities-images .images .images-bg-one .two {
  position: absolute;
  top: -50px;
  bottom: auto;
  right: auto;
  left: 80px;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .opportunities-images .images .images-bg-one .two {
    width: 1px;
  }
}
.opportunities-images .images .images-bg-one .three {
  position: absolute;
  top: 300px;
  bottom: auto;
  right: auto;
  left: 80px;
  z-index: 1;
  margin: 0;
}

@media (max-width: 576px) {
  .opportunities-images .images .images-bg-one .three {
    width: 1px;
  }
}
.opportunities-images .animation svg {
  margin-right: 10px;
}

@media (max-width: 576px) {
  .opportunities-images .animation svg {
    display: none;
  }
}
.opportunities-images .animation svg g {
  opacity: 0.7;
  transition: all 0.5s;
}

.opportunities-images .animation div {
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 37px;
  color: #3F3D56;
  padding-left: 10px;
  transition: all 0.5s;
}

@media (max-width: 576px) {
  .opportunities-images .animation div {
    font-size: 12px;
    display: inline-block;
  }
}
.opportunities-images .animation div .dependences {
  color: #9D9EA9;
}

.opportunities-images .animation div img {
  max-width: 20px;
  position: relative;
  top: 0;
  right: 10px;
  opacity: 0.5;
  transition: all 0.5s;
}

.opportunities-images .animation div.no-active {
  cursor: default !important;
  color: #9D9EA9;
}

.opportunities-images .animation div.no-active:hover {
  cursor: default !important;
  color: #9D9EA9;
}

.opportunities-images .animation div:hover {
  cursor: pointer;
  color: #7098E4;
  transition: all 0.5s;
}

.opportunities-images .animation div:hover img {
  opacity: 1;
  transition: all 0.5s;
}

.opportunities-images .animation div.active {
  color: #7098E4;
  transition: all 0.5s;
}

@media (max-width: 576px) {
  .opportunities-images .animation div.active svg {
    display: none;
  }
}
.opportunities-images .animation div.active svg g {
  opacity: 1;
  transition: all 0.5s;
}

.opportunities-images .animation div.active img {
  opacity: 1;
  transition: all 0.5s;
}

.dependences {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 29px;
  color: #9D9EA9;
  margin-top: 30px;
  margin-left: 15px;
}

.opportunities-integrations {
  max-width: 100%;
  padding: 32px 0;
}

@media (max-width: 576px) {
  .opportunities-integrations {
    padding: 15px 0;
  }
}
.opportunities-integrations .icons_block {
  margin-bottom: 16px;
}

.opportunities-integrations .icons_block.first {
  margin-top: 36px;
}

.opportunities-integrations.min {
  margin-top: -45px;
}

.opportunities-integrations.descriptions {
  padding: 16px 0 32px;
}

.opportunities-integrations h3 {
  font-style: normal;
  font-weight: 800;
  font-size: 38px;
  line-height: 130%;
  color: #3F3D56;
  margin-top: 80px;
}

@media (max-width: 576px) {
  .opportunities-integrations h3 {
    font-size: 30px;
    margin-top: 30px;
  }
}
.opportunities-integrations h4 {
  font-style: normal;
  font-weight: normal;
  font-size: 18px;
  line-height: 29px;
  color: #3F3D56;
  width: 100%;
  max-width: 633px;
  margin-bottom: 70px;
}

@media (max-width: 576px) {
  .opportunities-integrations h4 {
    font-size: 16px;
  }
}
.opportunities-integrations .name-integration {
  font-style: normal;
  font-weight: bold;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
}

@media (max-width: 576px) {
  .opportunities-integrations .name-integration {
    font-size: 18px;
  }
}
.opportunities-integrations .name-integration-description {
  font-style: normal;
  font-weight: 400;
  font-size: 18px;
  line-height: 130%;
  color: #9D9EA9;
}

.opportunities-integrations .forImage {
  display: flex;
}

@media (max-width: 576px) {
  .opportunities-integrations .forImage {
    display: inline-block;
  }
}
.opportunities-integrations .forImage .image {
  margin-left: 25px;
  position: relative;
}

@media (max-width: 576px) {
  .opportunities-integrations .forImage .image {
    display: inline-block;
    margin-left: 0;
    margin-bottom: 15px;
    margin-right: 15px;
  }
}
.opportunities-integrations .forImage .image .forImageBG {
  position: absolute;
  top: 8px;
  bottom: 8px;
  right: 8px;
  left: 8px;
  z-index: -1;
  margin: 0;
  background: white;
  box-shadow: 0 0 45px rgba(0, 0, 0, 0.12);
  border-radius: 20px;
  white-space: pre-line;
}

.opportunities-integrations .forImage .image img {
  max-width: 73px;
}

@media (max-width: 576px) {
  .opportunities-integrations .forImage .image img {
    margin-left: 0;
    margin-right: 7px;
    border-radius: 10px;
    max-width: 50px;
  }
}
.questions {
  margin-top: 250px;
  margin-bottom: 50px;
}

@media (max-width: 576px) {
  .questions {
    margin-top: 130px;
  }
}
.questions .ant-collapse {
  border: none;
  border-bottom: 0;
  border-radius: 17px 17px 17px 17px !important;
  background: transparent;
}

.questions .ant-collapse > .ant-collapse-item {
  border-bottom: none;
  margin-top: 11px;
}

.questions .ant-collapse > .ant-collapse-item > .ant-collapse-header {
  font-style: normal;
  font-weight: bold;
  font-size: 18px;
  line-height: 22px;
  color: #3F3D56;
  border-radius: 17px 17px 17px 17px;
  background-color: #F8F8FB;
  padding: 19px 29px;
}

@media (max-width: 576px) {
  .questions .ant-collapse > .ant-collapse-item > .ant-collapse-header {
    font-size: 16px;
  }
}
.questions .ant-collapse > .ant-collapse-item-active > .ant-collapse-header {
  border-radius: 17px 17px 0 0 !important;
  color: #7264D6 !important;
}

.questions .content-box {
  position: relative;
  border: none;
  background-color: #F8F8FB;
  border-radius: 17px;
  margin-bottom: 10px;
}

.questions .content-box p {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  color: #9D9EA9;
  padding-left: 10px;
}

.questions .box {
  font-style: normal;
  font-weight: bold;
  font-size: 18px;
  line-height: 22px;
  color: #3F3D56;
  padding: 19px 29px;
  display: block;
  width: 100%;
  border: none;
  border-radius: 17px;
  text-align: left;
  background: #F8F8FB;
}

@media (max-width: 576px) {
  .questions .box {
    font-size: 14px;
  }
}
.questions .ant-collapse-icon-position-right > .ant-collapse-item > .ant-collapse-header .ant-collapse-arrow {
  right: 23px;
  top: 11px;
}

.rates {
  margin-top: 280px;
}

.rates p.count {
  height: 40px;
  position: relative;
  white-space: normal !important;
}

.rates p.count.daw svg {
  position: relative !important;
}

.rates p.count.count_title {
  margin-left: 40px !important;
}

.rates p.count.count_title svg {
  position: absolute !important;
  top: 2px !important;
  left: -35px;
}

.rates .rates_list {
  position: relative;
  margin-top: 50px;
}

.rates .rates_list .line {
  position: absolute;
  top: 126px;
  bottom: 0px;
  right: 30px;
  left: auto;
  z-index: -1;
  margin: 0 auto;
  background: #E2EAF9;
  height: 48px;
  border-radius: 20px;
}

.rates .rate {
  background: rgba(255, 255, 255, 0.2);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  border-radius: 20px;
}

@media (max-width: 576px) {
  .rates .rate {
    border-radius: 0;
  }
}
.rates .rate a {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 12px;
  color: #7264D6;
  background: #E8E6FF;
  border-radius: 14px;
  width: 100%;
  display: block;
  padding: 13px 10px;
  text-align: center;
  margin-bottom: 30px;
}

.rates .rate button {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 12px;
  color: #7264D6;
  background: #E8E6FF;
  border-radius: 14px;
  width: 100%;
  display: block;
  padding: 13px 10px;
  text-align: center;
  margin-bottom: 30px;
  border: none;
}

.rates .rate.rate-opacity {
  background: rgb(255, 255, 255) !important;
}

.rates .rate .rate_description {
  font-style: normal;
  font-weight: 500;
  font-size: 14px;
  line-height: 44px;
  color: white;
  height: 44px;
  border-radius: 20px 20px 0 0;
  color: white;
  padding: 0 19px;
  white-space: nowrap;
}

.rates .rate .rate_description.blue {
  background: #7098E4;
}

.rates .rate .rate_description.blue_two {
  background: #7264D6;
}

.rates .rate .rate_description svg {
  position: relative;
  top: -2px;
  margin-right: 7px;
}

.rates .rate .rate_title {
  font-style: normal;
  font-weight: 800;
  font-size: 26px;
  line-height: 29px;
  color: #3F3D56;
  margin-bottom: 34px;
}

.rates .accordion-main {
  text-align: center;
  margin-top: 47px;
}

.rates .pricing-accordion {
  margin-top: 50px;
}

.rates .pricing-accordion .accordion-item {
  margin-top: 20px;
  border: none;
  position: relative;
}

.rates .pricing-accordion .accordion-item .element {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 40px;
  color: #3F3D56;
}

.rates .pricing-accordion .accordion-item .accordion-collapse {
  background: white;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  border-radius: 20px;
}

.rates .pricing-accordion .accordion-item .accordion-button {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 29px;
  color: #8B7FE4;
  outline: none;
}

.rates .pricing-accordion .accordion-item .accordion-button.accordion-button-one {
  color: #7264D6;
}

.rates .pricing-accordion .accordion-item .accordion-button.accordion-button-one::after {
  background-image: url("data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M7.05554 6H1.34446C0.778143 6 0.446236 5.36252 0.770997 4.89858L3.62654 0.819232C3.90521 0.42113 4.49479 0.421131 4.77346 0.819232L7.629 4.89858C7.95376 5.36252 7.62186 6 7.05554 6Z' fill='%237264D6'/></svg>");
}

.rates .pricing-accordion .accordion-item .accordion-button::after {
  content: "";
  width: 8px;
  height: 6px;
  margin-left: 15px;
  background-image: url("data:image/svg+xml;utf8,<svg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'><path d='M7.05554 6H1.34446C0.778143 6 0.446236 5.36252 0.770997 4.89858L3.62654 0.819232C3.90521 0.42113 4.49479 0.421131 4.77346 0.819232L7.629 4.89858C7.95376 5.36252 7.62186 6 7.05554 6Z' fill='%238B7FE4'/></svg>");
  background-size: 8px;
}

.rates .pricing-accordion .accordion-item .accordion-button:focus {
  border: none;
  box-shadow: none;
}

.rates .pricing-accordion .accordion-item .accordion-button:not(.collapsed) {
  background-color: transparent;
  box-shadow: none;
}

.rates .row {
  position: relative;
}

.rates .privilege {
  position: absolute;
  top: 100px;
  bottom: auto;
  right: 0px;
  left: 100px;
  z-index: 1;
  margin: 0 auto;
  width: 236px;
  background: white;
  border: 1px solid #E5E2F8;
  border-radius: 20px;
  text-align: center;
  padding: 30px 24px 20px;
}

@media (max-width: 576px) {
  .rates .privilege {
    display: none;
  }
}
.rates .privilege img {
  width: 100%;
  max-width: 70px;
  margin-bottom: 10px;
}

.rates .privilege p.privilege-title {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 130%;
  color: rgba(114, 100, 214, 0.7);
}

.rates .privilege p.privilege-price {
  font-style: normal;
  font-weight: 800;
  font-size: 28px;
  line-height: 130%;
  color: #7264D6;
}

.rates .privilege p.privilege-price span {
  font-size: 16px;
  font-weight: 600;
}

.rates .accordion_price {
  font-style: normal;
  font-weight: 800;
  font-size: 14px;
  line-height: 27px;
  color: #8B7FE4;
  text-align: left;
}

.rates div.tab {
  margin-top: 3px;
  padding-left: 22px;
  padding-right: 22px;
}

@media (max-width: 576px) {
  .rates div.tab {
    padding-left: 18px;
    padding-right: 18px;
  }
}
.rates div.tab svg {
  width: 10px;
  position: relative;
  top: 7px;
  margin-left: 5px;
  margin-right: 5px;
}

.rates div.tab .row {
  height: 40px;
}

@media (max-width: 576px) {
  .rates div.tab .row {
    height: auto;
  }
}
.rates div.tab.bg {
  background: rgba(245, 245, 248, 0.6);
}

.rates div.tab p.tab {
  font-style: normal;
  font-weight: 800;
  font-size: 22px;
  line-height: 29px;
  color: #3F3D56;
}

.rates div.tab .center {
  text-align: center;
}

@media (max-width: 576px) {
  .rates div.tab .center {
    height: 40px;
  }
}
.rates .in {
  padding: 27px 20px;
}

.rates p.price, .rates p.price-all, .rates p.price_year, .rates p.price_month, .rates p.pay_month, .rates p.pay_year, .rates p.count {
  white-space: nowrap;
}

@media (max-width: 576px) {
  .rates p.price, .rates p.price-all, .rates p.price_year, .rates p.price_month, .rates p.pay_month, .rates p.pay_year, .rates p.count {
    margin-top: -15px !important;
    margin-bottom: 30px !important;
  }
}
.rates p.price {
  font-style: normal;
  font-weight: 800;
  font-size: 22px;
  line-height: 150%;
  color: #7098E4;
  margin-bottom: 0;
}

.rates p.price span {
  font-size: 16px;
  font-weight: 500;
}

.rates p.price-all {
  font-style: normal;
  font-weight: 800;
  font-size: 28px;
  line-height: 130%;
  color: #7264D6;
  margin-bottom: 65px;
}

.rates p.price-all span {
  font-size: 16px;
  font-weight: 500;
}

.rates p.price_year {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 150%;
  color: #7098E4;
}

.rates p.price_year span {
  font-size: 12px;
}

.rates p.price_month {
  font-style: normal;
  font-weight: 800;
  font-size: 22px;
  line-height: 22px;
  color: #9D9EA9;
  margin-top: 23px;
}

.rates p.price_month.second {
  margin-bottom: 43px;
}

.rates p.price_month span {
  font-size: 16px;
  font-weight: 500;
}

.rates p.pay_month {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
  color: #9D9EA9;
  margin-top: 30px;
}

.rates p.pay_month.second {
  margin-bottom: 44px;
}

.rates p.pay_year {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
  color: #7098E4;
  margin-bottom: 31px;
}

.rates p.count {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
  color: #3F3D56;
}

.rates p.count svg {
  position: relative;
  margin-right: 7px;
  top: -2px;
}

@media (max-width: 576px) {
  .rates {
    margin-top: 80px;
  }
}
.rates .top {
  background: white;
  border-radius: 34px;
  margin-top: 44px;
}

@media (max-width: 576px) {
  .rates .top {
    border-radius: 15px;
    padding: 0 15px 0 0 !important;
  }
}
.rates .top.development-block {
  margin-top: 131px !important;
  margin-bottom: 131px !important;
}

.rates .top.development-block h3 {
  width: 100%;
  max-width: 450px;
}

.rates .top p.package {
  font-style: normal;
  font-weight: 600;
  font-size: 18px;
  line-height: 29px;
  color: #7098E4;
  margin: 44px 33px 25px;
}

@media (max-width: 576px) {
  .rates .top p.package {
    margin: 20px 15px;
  }
}
.rates .top.box {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
  margin-bottom: 50px;
}

.rates .top p {
  margin-top: auto;
  margin-bottom: auto;
}

.rates .top .mobile {
  padding: 20px 0 15px;
  border-bottom: 1px dashed #e1e1e1;
}

.rates .top .mobile .mobile-title {
  margin-bottom: 15px;
}

@media (max-width: 576px) {
  .rates .top {
    margin: 24px 0 0 0;
    padding: 24px 0;
  }
}
.rates .top p.development {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 25px;
  color: #3F3D56;
  margin: 15px 0 0;
  position: relative;
}

@media (max-width: 576px) {
  .rates .top .prices {
    margin-top: 15px;
  }
}
.rates .top .prices .title {
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 50%;
  color: #7264D6;
  opacity: 0.5;
}

.rates .top .prices .price {
  font-style: normal;
  font-weight: 800;
  font-size: 18px;
  line-height: 50%;
  color: #7264D6;
}

.rates .top .prices .price span {
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 130%;
  color: #7264D6;
  opacity: 0.6;
}

.rates .top .prices .price span.currency {
  font-size: 16px;
}

.rates .top .items {
  padding-left: 78px;
  padding-right: 38px;
}

@media (max-width: 576px) {
  .rates .top .items {
    padding-left: 20px;
    padding-right: 20px;
  }
}
.rates .top .items svg path {
  stroke: #7098E4;
}

.rates .top .items p {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 25px;
  color: #3F3D56;
  position: relative;
  margin-bottom: 20px;
}

@media (max-width: 576px) {
  .rates .top .items p {
    font-size: 14px;
    margin-left: 45px;
  }
}
.rates .top .items p svg {
  position: absolute;
  top: 3px;
  bottom: auto;
  right: auto;
  left: -40px;
  z-index: 1;
  margin: 0;
}

.rates .top .items p.other {
  font-style: normal;
  font-weight: normal;
  font-size: 16px;
  line-height: 25px;
  color: #9D9EA9;
  position: relative;
}

.rates .top .items p.other.left {
  margin-left: 10px;
}

.rates .top .items p.other span {
  font-weight: 600;
  white-space: nowrap;
}

.rates .top .items p.other svg {
  position: absolute;
  top: 12px;
  bottom: auto;
  right: auto;
  left: -37px;
  z-index: 1;
  margin: 0;
}

.rates .top p.base {
  font-style: normal;
  font-weight: 800;
  font-size: 32px;
  line-height: 150%;
  color: #F878C2;
}

.rates .top p.base span {
  font-style: normal;
  font-weight: bold;
  font-size: 16px;
  line-height: 150%;
  color: #F878C2;
  opacity: 0.5;
}

.rates .top p.base span.currency {
  color: #F878C2;
  font-size: 24px;
}

.additionally {
  margin-top: 73px !important;
  margin-bottom: 110px;
}

.additionally .additionally-text {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 130%;
  color: #3F3D56;
  margin-top: 36px;
  position: relative;
  padding-left: 40px;
  margin-bottom: 15px;
}

.additionally .additionally-text.two {
  margin-top: 45px;
}

.additionally .additionally-text svg {
  position: absolute;
  left: 0;
}

.additionally .description {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #8B7FE4;
}

.additionally p.price {
  font-style: normal;
  font-weight: 800;
  font-size: 32px;
  line-height: 100%;
  color: #7098E4;
}

.additionally p.price span.currency {
  font-size: 24px;
}

.additionally p.price span.year {
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 130%;
  color: #8B7FE4;
}

.additionally .promotion {
  margin-top: 50px;
}

.additionally .promotion .promotion_element {
  margin-bottom: 56px;
}

.additionally .promotion .service_logotype {
  display: block;
  margin-bottom: 20px;
}

.additionally .promotion .service_logotype_space {
  display: inline-block;
  margin-bottom: 20px;
  margin-right: 15px;
}

.additionally .promotion .descriptor {
  display: flex;
}

.additionally .promotion .descriptor .icon {
  width: 35px;
}

.additionally .promotion .descriptor .title {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 25px;
  color: #3F3D56;
}

.additionally .shadow {
  padding: 50px;
  border-radius: 34px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.08);
}

.additionally .play {
  display: flex;
  margin-top: 10px;
  margin-bottom: 20px;
}

.additionally .play div.store {
  position: relative;
  background: #FAFAFA;
  width: 38px;
  height: 38px;
  margin-right: 8px;
  border-radius: 6px;
}

.additionally .play div.store svg {
  position: absolute;
  top: 0px;
  bottom: 0px;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: auto;
}

.additionally .play div.offer {
  margin-left: 10px;
}

div.bang {
  position: absolute;
  top: auto;
  bottom: auto;
  right: 0px;
  left: 0px;
  z-index: 1;
  margin: 0 auto;
  background: white;
  box-shadow: none;
  width: 120px !important;
  height: 17px;
  border-radius: 0 0 15px 15px;
}

.align-center {
  text-align: center;
}

.align-right {
  text-align: right;
}

@media (max-width: 576px) {
  .align-right {
    text-align: left;
  }
}
.eshop {
  margin-top: 130px;
  background-color: #F8F8FB;
  border-radius: 60px;
  padding: 50px 60px;
}

@media (max-width: 768px) {
  .eshop {
    padding: 40px 25px;
  }
}
@media (max-width: 576px) {
  .eshop {
    border-radius: 0;
  }
}
.eshop img.eshop-example {
  width: 90%;
}

.eshop .eshop-top img {
  position: relative;
  top: -10px;
  height: 56px;
}

.eshop .eshop-top p.eshop-pre_title {
  font-style: normal;
  font-weight: 800;
  font-size: 24px;
  line-height: 1;
  color: #7098E4;
}

.eshop h3 {
  font-size: 38px;
  margin-top: 19px;
}

@media (max-width: 576px) {
  .eshop h3 {
    font-size: 30px;
    margin-bottom: 36px;
  }
}
.eshop .eshop-description {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #9D9EA9;
  margin-top: 27px;
}

.flex {
  display: flex;
  align-items: center;
}

.flex .flex-block {
  margin-right: 21px;
}

.flex .flex-block img {
  width: 60px;
}

.flex.flex-top {
  align-items: start;
}

.eAdmin_icon {
  box-shadow: 0 0 35px 0 rgba(0, 0, 0, 0.08);
  border-radius: 16px;
}

.main-applications .formats img {
  width: 63px;
}

.main-applications .__bg_content-block {
  display: inline-block;
  min-width: 10px;
  max-width: 100%;
  width: auto;
  margin: 0 auto;
  padding: 60px;
}

@media (max-width: 576px) {
  .main-applications .__bg_content-block {
    padding: 20px;
    margin-top: 30px;
  }
}
.main-applications .main-applications__icon_application {
  padding: 8px;
}

.main-applications .main-applications__icon_application img {
  max-width: 63px;
}

.main-self_application .__flex img {
  width: 52px;
}

.main-self_application .__bg_content-block {
  padding: 80px;
}

@media (max-width: 576px) {
  .main-self_application .__bg_content-block {
    padding: 30px;
  }
}
.main-self_application img.self_application_image {
  width: 90%;
  margin-top: -100px;
}

.main-self_application p.is_self {
  font-style: normal;
  font-weight: 800;
  font-size: 24px;
  line-height: 130%;
  color: #7098E4;
  line-height: 1;
  margin: 0;
}

.main-self_application h3 {
  margin-top: 30px;
  margin-bottom: 30px;
}

.main-self_application h4 {
  font-style: normal;
  font-weight: 400;
  font-size: 16px;
  line-height: 22px;
  color: #9D9EA9;
}

.main-self_application p.bonus {
  font-style: normal;
  font-weight: 700;
  font-size: 22px;
  line-height: 130%;
  color: #3F3D56;
  margin-top: 20px;
  margin-bottom: 40px;
}

.qr__code {
  margin-top: 30px;
}

.qr__image .ant-qrcode {
  background-color: white !important;
}

.qr__text {
  font-style: normal;
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
  color: #3F3D56;
}

p.download {
  font-style: normal;
  font-weight: 600;
  font-size: 16px;
  line-height: 140%;
  color: #3F3D56;
  margin: 0;
}

.__little_price {
  padding: 30px;
  border-radius: 30px;
  margin-bottom: 20px;
  transition: all 0.5s;
  border: 3px dashed #ebecec;
}

@media (max-width: 576px) {
  .__little_price {
    border-radius: 0;
  }
}
@media (max-width: 576px) {
  .__little_price .price_element {
    margin-top: 20px;
  }
}
.__little_price:hover {
  transition: all 0.5s;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.12);
  border: 3px dashed rgba(114, 100, 214, 0.2);
}

.__little_price p.__little_price-title {
  font-size: 16px;
  font-weight: 500;
  line-height: 1;
}

.__little_price p.__little_price-price {
  font-size: 22px;
  font-weight: 800;
  line-height: 1;
  margin-bottom: 0;
}

.__little_price p.__little_price-price.select {
  color: #7264D6;
}

.__little_price p.description {
  font-size: 14px;
  color: rgba(63, 61, 86, 0.7);
}

.__little_price_title {
  margin-bottom: 30px;
}

.tab-content .little_form {
  margin-top: 100px;
}

@media (max-width: 576px) {
  .tab-content .little_form {
    margin-top: -20px;
    margin-bottom: 40px;
  }
}
@media (max-width: 576px) {
  .listing-elements .little_form {
    margin-top: -20px;
    margin-bottom: 20px;
  }
}
.little_form {
  border-radius: 60px;
  padding: 40px 60px;
  background-color: rgba(139, 127, 228, 0.2);
  margin-top: 50px;
}

.little_form ::-moz-placeholder {
  color: rgba(0, 0, 0, 0.5) !important;
}

.little_form ::placeholder {
  color: rgba(0, 0, 0, 0.5) !important;
}

.little_form.__little_form-name {
  background-color: transparent;
  margin-top: 0;
  padding: 0;
  border-radius: 0;
}

@media (max-width: 576px) {
  .little_form {
    border-radius: 0;
    padding: 20px;
  }
}
.little_form p.description {
  color: rgba(63, 61, 86, 0.7);
}

.error_message {
  border: 2px solid #FD8BA2 !important;
}

.form_react {
  position: relative;
}

.form_react p.error_message_text {
  position: absolute;
  top: 14px;
  right: 30px;
  font-size: 12px;
  font-weight: 500;
  color: #FD8BA2;
}

.form_react p.error_message_text.__error_message_text {
  top: -20px !important;
}

.form_react p.legal_text {
  font-size: 12px !important;
  color: rgba(63, 61, 86, 0.5) !important;
}

.trial {
  margin-top: 30px;
  text-align: left;
}

.trial span {
  background-color: rgba(248, 120, 194, 0.8);
  padding: 7px 20px;
  font-weight: 500;
  color: white;
  border-radius: 10px;
}

.blog .__flex {
  align-items: center;
  flex-wrap: wrap;
  gap: 40px;
}

.blog a.blog-category {
  color: rgba(63, 61, 86, 0.8);
  text-decoration: underline;
  font-size: 14px;
}

.blog h1 {
  margin-bottom: 0;
}

.blog h2 {
  font-size: 18px;
  color: rgba(63, 61, 86, 0.8);
  font-weight: 400;
  line-height: 150%;
  margin-top: 15px;
  margin-bottom: 60px;
  max-width: 600px;
  width: 100%;
}

.blog .blog_title {
  margin-bottom: 30px;
}

.blog .blog_title p {
  font-size: 28px;
  margin: 0;
}

.blog .blog_element-list {
  margin-bottom: 60px;
  border-radius: 20px;
  transition: box-shadow 0.5s;
}

.blog .blog_element-list .blog_element-list-image {
  padding: 0;
}

.blog .blog_element-list:hover {
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  transition: box-shadow 0.5s;
}

.blog .blog_line {
  background-color: #ebecec;
  height: 1px;
}

.blog.blog_list {
  margin-bottom: 40px;
}

.blog.blog_list a {
  color: #3F3D56;
}

.blog.blog_list a:hover {
  color: #3F3D56;
}

.blog.blog_list img {
  border-radius: 20px;
}

.blog.blog_list .blog_list_data {
  padding: 15px 30px;
}

.blog p.blog_list-date {
  font-size: 12px;
  font-weight: 500;
}

.blog p.blog_list-annotation {
  font-weight: 500;
  color: rgba(63, 61, 86, 0.8);
  margin-top: 10px;
}

.record_text div {
  margin-bottom: 30px;
}

.record_text img {
  width: 100%;
  border-radius: 30px;
}

.breadcrumb-item {
  font-size: 12px;
}

.breadcrumb-item a {
  color: #3F3D56;
  text-decoration: underline;
}

.marquiz__container_inline {
  max-width: 100% !important;
  border-radius: 60px;
}

.screens {
  margin-top: 120px;
}

@media (max-width: 576px) {
  .screens {
    margin-top: 40px;
  }
}
.screens .slick-slide {
  height: auto;
}

.screens div.element {
  outline: none;
  margin: 40px 20px;
  text-align: center;
}

.screens div.element p {
  font-family: "Caveat", cursive;
  font-size: 20px;
  line-height: 1.2;
  text-align: center;
  width: 100%;
  max-width: 160px;
  margin: 30px auto 0 auto;
}

@media (max-width: 576px) {
  .screens div.element {
    margin-left: 7px;
    margin-right: 7px;
  }
}
.screens img {
  width: 220px;
  border-radius: 35px;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  margin: 0 auto;
}

@media (max-width: 576px) {
  .screens img {
    width: 200px;
  }
}
.screens_list {
  display: flex;
  overflow-x: auto;
}

.screens_list::-webkit-scrollbar {
  display: none;
}

.screens_list div {
  border-radius: 30px;
  margin-top: 80px;
  margin-bottom: 80px;
  margin-left: 20px;
  margin-right: 20px;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
}

@media (max-width: 576px) {
  .screens_list div {
    margin-left: 7px;
    margin-right: 7px;
  }
}
.form-control {
  font-size: 14px !important;
}

.form-control::-moz-placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.form-control::placeholder {
  color: rgba(0, 0, 0, 0.5);
}

.react-tel-input {
  position: relative;
  margin-top: 5px;
}

.slick-arrow {
  width: 50px;
  height: 50px;
  border-radius: 500px;
  background: white;
  position: absolute;
  top: 50%;
  border: none;
  z-index: 2;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
}

.slick-arrow.slick-next {
  right: 50px;
}

.slick-arrow.slick-prev {
  left: 50px;
}

.fop .modal-content {
  border-radius: 30px;
  padding: 30px;
  position: relative;
}

@media (max-width: 576px) {
  .fop .modal-content {
    padding: 15px;
  }
}
.fop .modal-content .btn-close {
  position: absolute;
  top: 0;
  right: 0;
}

.fop .modal-content .title {
  font-style: normal;
  font-weight: 750;
  font-size: 46px;
  line-height: 1.1;
  color: rgba(63, 61, 86, 0.9);
}

@media (max-width: 576px) {
  .fop .modal-content .title {
    font-size: 18px;
  }
}
@media (max-width: 576px) {
  .fop .modal-content .description {
    font-size: 14px;
    color: rgba(63, 61, 86, 0.6);
  }
}
.relative {
  position: relative;
}

.one_day {
  position: absolute;
  top: -50px;
  right: 0;
  left: 50px;
  display: inline-block;
  border: 2px dashed rgba(248, 120, 194, 0.6);
  color: rgba(248, 120, 194, 0.8);
  padding: 6px 12px;
  font-size: 16px;
  border-radius: 15px;
  font-weight: 600;
}

.sms_block,
.payments_block {
  border-radius: 60px;
  padding: 60px;
  margin-top: 50px;
}

@media (max-width: 576px) {
  .sms_block,
  .payments_block {
    padding: 40px;
  }
}
.sms_block {
  background: #7098E4;
}

.sms_block_heading {
  max-width: 600px;
  margin-bottom: 18px;
  color: #F5F5F8;
  font-size: 40px;
  font-weight: 600;
  line-height: 42px;
}

@media (max-width: 576px) {
  .sms_block_heading {
    font-size: 32px;
    line-height: 34px;
  }
}
.sms_block_subheading {
  max-width: 500px;
  margin-bottom: 18px;
  color: #F5F5F8;
  font-size: 20px;
  font-weight: 500;
  line-height: 1.4;
}

.sms_block .s-button {
  padding: 16px 22px;
  display: flex;
  align-items: center;
  gap: 10px;
  background: #F5F5F8;
  color: #7098E4;
  font-size: 14px;
  font-weight: 700;
  line-height: 1;
  box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.0784313725);
  border-radius: 25px;
}

@media (max-width: 576px) {
  .sms_block .s-button {
    width: -moz-fit-content;
    width: fit-content;
    margin-bottom: 40px;
  }
}
.payments_block {
  background-color: #f9f9f9;
}

.payments_block h3 {
  margin-bottom: 20px;
}

.payments_block_section {
  margin: 20px 0;
}

.payments_block_section:last-child {
  margin-bottom: 0;
}

.payments_block_heading {
  margin-bottom: 20px;
  color: #9D9EA9;
  font-size: 14px;
  font-weight: 600;
  line-height: 12px;
  text-transform: uppercase;
}

.payments_block_list {
  display: flex;
  flex-flow: column;
  gap: 6px;
}

.payments_block_list .item {
  padding: 10px;
  background: #CFDCF6;
  display: flex;
  align-items: center;
  gap: 10px;
  border-radius: 12px;
}

.payments_block_list .item_icon {
  width: 32px;
  height: 32px;
}

.payments_block_list .item_icon img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.payments_block_list .item_name {
  color: #3F3D56;
  font-size: 18px;
  font-weight: 600;
  line-height: 20px;
}

@media (max-width: 576px) {
  .payments_block_list .item_name {
    font-size: 14px;
  }
}
.payments_block_list .item_percent {
  margin-left: auto;
  padding: 10px;
  background: #F5F5F8;
  color: #3F3D56;
  font-size: 18px;
  font-weight: 600;
  line-height: 20px;
  border-radius: 12px;
}

.payments_block_list_small {
  gap: 16px;
}

.payments_block_list_small .item {
  padding: 0;
  background: unset;
}

.payments_block_list_small .item_icon {
  width: 22px;
  height: 22px;
}

.payments_block .align-right img {
  width: 100%;
}

.payments_block .s-button {
  min-width: 210px;
  background: #7098E4;
}

.yookassa_block {
  position: relative;
  border-radius: 60px;
  padding: 60px 60px;
  background-color: #f9f9f9;
  margin-top: 50px;
}

.yookassa_block h3 {
  margin-bottom: 20px;
}

.yookassa_block h3 span {
  display: inline;
  text-decoration: underline;
  color: #3F3D56;
  text-decoration-color: #7264D6;
}

.yookassa_block p {
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: #9D9EA9;
}

.yookassa_block p span.color {
  color: #7264D6;
}

.yookassa_block p span.through {
  text-decoration: line-through;
}

.yookassa_block button {
  margin-top: 20px;
}

@media (max-width: 767px) {
  .yookassa_block .align-right {
    text-align: left !important;
  }
}
.yookassa_block img {
  width: 90%;
}

@media (max-width: 767px) {
  .yookassa_block img {
    width: 160px;
    margin-bottom: 40px;
  }
}
.little_big {
  margin-top: 150px;
  margin-bottom: 50px;
}

@media (max-width: 767px) {
  .little_big {
    margin-top: 50px;
  }
}
.done__demo_access {
  background-color: white;
  border-radius: 40px;
  padding: 40px 60px;
}

.done__demo_access p.level_1 {
  font-size: 32px;
  font-weight: 700;
  line-height: 40px;
}

.done__demo_access p.level_1 img {
  margin-right: 15px;
}

.done__demo_access p.level_2 {
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  color: #9D9EA9;
}

.set_center {
  text-align: center;
}

.gray_span {
  color: #9D9EA9 !important;
}

.accordion_number {
  color: #8B7FE4;
  font-weight: 700;
}

.possibilities_relative {
  position: relative;
}

.possibilities_relative p {
  margin-left: 30px;
}

@media (max-width: 576px) {
  .possibilities_relative p {
    margin-left: 0;
  }
}
.possibilities_relative p.main_text {
  margin-top: 14px;
  line-height: 26px;
  margin-bottom: 0 !important;
}

@media (max-width: 576px) {
  .possibilities_relative p.main_text {
    margin-top: 0;
  }
}
.possibilities_relative p.description_text {
  font-size: 14px;
  color: #9D9EA9;
  font-weight: 400;
  line-height: 16px;
}

@media (max-width: 576px) {
  .possibilities_relative p.description_text {
    display: none;
  }
}
.possibilities_relative img {
  position: absolute !important;
  top: 3px !important;
  left: 0px;
}

@media (max-width: 576px) {
  .possibilities_relative img {
    display: none;
  }
}
.left_accordion {
  text-align: left;
}

.reviews_custom_block .custom_review {
  position: relative;
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 15px;
  border: none;
  padding: 25px;
}

.reviews_custom_block .custom_review .custom_review_text {
  font-size: 14px;
  color: #9D9EA9;
  font-weight: 400;
  line-height: 16px;
}

.reviews_custom_block .custom_review .custom_review_name {
  font-size: 16px;
  font-weight: 600;
}

.reviews_custom_block .custom_review .stars {
  position: absolute;
  top: 20px;
  bottom: auto;
  right: 20px;
  left: auto;
  z-index: 1;
  margin: 0;
}

.header_development {
  font-size: 14px;
  max-width: 250px;
  margin: 0;
}

.header_development span {
  font-weight: 600;
}

.landing_phone {
  color: rgba(0, 0, 0, 0.85);
  font-size: 18px;
  font-weight: 800;
}

@media (max-width: 576px) {
  .landing_phone {
    font-size: 16px;
  }
}
.landing_contacts {
  text-align: right;
}

.landing_contacts a {
  display: block;
}

.landing-button-call {
  font-style: normal;
  font-weight: 500;
  font-size: 12px;
  line-height: 12px;
  color: #8B7FE4;
  position: relative;
  text-align: center;
  border-radius: 0;
  padding-left: 0;
  padding-right: 0;
  border: none;
  transition: all 0.3s;
  outline: none;
  text-decoration: none;
  display: inline-block;
  background-color: transparent;
  height: 28px;
  max-height: 28px;
  line-height: 28px;
}

.popover_rec {
  font-size: 12px;
}

.rec_span {
  position: absolute;
  bottom: 50px;
  right: 50px;
  opacity: 0.6;
}

.rec_span img {
  width: 20px;
}

.landing-nav .nav {
  border-top: 1px solid #ebecec;
  margin-top: 30px;
  padding: 15px 0;
  display: flex;
  justify-content: space-between;
  list-style: none;
  width: 100%;
}

@media (max-width: 992px) {
  .landing-nav .nav {
    flex-direction: column;
    align-items: flex-start;
  }
}
.landing-nav ul {
  gap: 40px;
  margin-top: 12px;
}

@media (max-width: 992px) {
  .landing-nav ul {
    flex-direction: column;
    gap: 20px;
    width: 100%;
  }
}
@media (max-width: 1200px) {
  .landing-nav ul {
    gap: 10px;
  }
}
.landing-nav ul li {
  padding: 8px 16px 8px 0;
}

.landing-nav ul li a {
  font-weight: 500;
  font-size: 16px;
  color: #3F3D56;
}

@media (max-width: 1200px) {
  .landing-nav ul li a {
    font-size: 14px;
  }
}
.landing-nav ul li a.active {
  text-decoration: underline;
}

.landing-main-screens {
  position: relative;
}

.landing-main-screens img {
  position: absolute;
  top: 0;
}

@media (max-width: 576px) {
  .landing-main-screens img {
    position: relative;
    display: inline-block;
  }
}
.landing-main-screens img.landing-main-screens_left {
  right: 280px;
  top: -40px;
}

@media (max-width: 1200px) {
  .landing-main-screens img.landing-main-screens_left {
    right: 160px;
  }
}
@media (max-width: 992px) {
  .landing-main-screens img.landing-main-screens_left {
    right: 20px;
  }
}
@media (max-width: 576px) {
  .landing-main-screens img.landing-main-screens_left {
    width: 40% !important;
    right: 0px;
  }
}
.landing-main-screens img.landing-main-screens_right {
  right: 20px;
}

@media (max-width: 576px) {
  .landing-main-screens img.landing-main-screens_right {
    width: 40% !important;
    right: 0px;
  }
}
.landing .__flex-line {
  position: relative;
  margin-bottom: 30px;
}

@media (max-width: 576px) {
  .landing .__flex-line {
    margin-top: 60px;
  }
}
.landing_example-span {
  position: absolute;
  top: 30px;
  font-family: "Caveat", cursive;
  font-style: italic;
  color: #7264D6;
  font-weight: 300;
  font-size: 22px;
  left: 300px;
  max-width: 150px;
  line-height: 1;
}

@media (max-width: 576px) {
  .landing_example-span {
    top: -30px;
    max-width: 100%;
    left: 0px;
  }
}
.landing_example-span svg {
  display: block;
  position: absolute;
  left: -20px;
  top: -20px;
}

@media (max-width: 576px) {
  .landing_example-span svg {
    display: none;
  }
}
.landing_example-span svg g g {
  fill: #7264D6;
}

.landing_about {
  background: white;
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.08);
  border-radius: 30px;
  border: none;
  padding: 40px;
  margin-bottom: 120px;
}

@media (max-width: 576px) {
  .landing_about {
    border-radius: 0;
  }
}
.landing_about .landing_about-text {
  font-size: 56px;
  font-weight: 900;
  line-height: 0.8;
  text-transform: uppercase;
  opacity: 0.2;
}

@media (max-width: 576px) {
  .landing_about .landing_about-text {
    font-size: 42px;
  }
}
.landing_about .landing_about-title {
  font-size: 20px;
  font-weight: 500;
}

.landing_about .landing_about-description {
  margin-top: 30px;
  font-size: 16px;
  max-width: 500px;
}

.landing .clients img {
  width: 50px;
  border-radius: 15px;
}

@media (max-width: 576px) {
  .landing-padding {
    padding: 0 30px;
  }
}
@media (max-width: 576px) {
  .landing-padding-little {
    padding: 0 15px;
  }
}
.landing_h3 {
  font-size: 56px !important;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  opacity: 0.6;
  color: #7264D6 !important;
  width: 100%;
  max-width: 600px;
  margin-bottom: 30px;
}

@media (max-width: 576px) {
  .landing_h3 {
    font-size: 36px !important;
  }
}
.landing_best {
  margin-bottom: 120px;
}

@media (max-width: 576px) {
  .landing_best {
    margin-bottom: 60px;
  }
}
@media (max-width: 576px) {
  .landing_best .landing_best-block {
    margin-bottom: 60px;
  }
}
.landing_best .landing_best-block .landing_best-number {
  font-size: 62px;
  font-weight: 900;
  transition: color 0.3s;
}

@media (max-width: 576px) {
  .landing_best .landing_best-block .landing_best-number {
    font-size: 42px;
  }
}
.landing_best .landing_best-block a {
  color: #3F3D56;
  transition: color 0.3s;
}

.landing_best .landing_best-block:hover .landing_best-number {
  color: rgba(114, 100, 214, 0.7);
}

.landing_best .landing_best-block:hover a {
  color: #7264D6;
}

.landing_best .landing_best-description {
  font-size: 16px;
  color: rgba(63, 61, 86, 0.7);
}

@media (max-width: 576px) {
  .landing_best .landing_best-description {
    font-size: 14px;
  }
}
.header_for_enter {
  text-align: right;
}

.__button {
  border-radius: 10px;
  border: none;
  padding: 9px 30px;
  display: inline-block;
  position: relative;
  transition: all 0.5s;
  font-size: 16px;
  font-weight: 500;
}

@media (max-width: 992px) {
  .__button {
    display: block;
    width: 100%;
    margin-top: 30px;
  }
}
.__button.primary {
  background-color: #7264D6;
  color: white;
}

.__button.primary:hover {
  background-color: rgba(114, 100, 214, 0.7);
  transition: all 0.5s;
}

.__button-link {
  background-color: white;
  box-sizing: border-box;
  border-radius: 10px;
  border: none;
  color: #7264D6;
  padding: 9px 40px 9px 18px;
  display: inline-block;
  position: relative;
  transition: all 0.5s;
  font-size: 16px;
  font-weight: 500;
  margin-left: 30px;
}

@media (max-width: 992px) {
  .__button-link {
    margin-left: 0;
    display: block;
    width: 100%;
    margin-top: 15px;
    border: 1px dashed #7264D6;
  }
}
.__button-link:hover {
  color: #7264D6;
  transition: all 0.5s;
}

.__button-link:hover svg g g {
  fill: rgba(114, 100, 214, 0.8);
  transition: all 0.5s;
}

.__button-link._block {
  display: block;
}

.__button-link svg {
  position: absolute;
  right: 18px;
  top: 0;
  bottom: 0;
  margin-top: auto;
  margin-bottom: auto;
  width: 12px;
}

.__button-link svg g g {
  fill: rgba(114, 100, 214, 0.5);
  transition: all 0.5s;
}

.header_phone_block {
  text-align: right;
}

.header_phone {
  font-size: 20px;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.8);
}

.layout_dialog {
  background: white;
  border-radius: 30px;
  width: 100%;
  max-width: 900px;
  padding: 50px;
  position: relative;
}

.layout_dialog .layout_dialog-title {
  font-size: 72px;
  font-weight: 200;
  line-height: 1;
  margin-bottom: 30px;
}

@media (max-width: 576px) {
  .layout_dialog .layout_dialog-title {
    font-size: 36px;
  }
}
.layout_dialog .layout_dialog-description {
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
  margin-top: 20px;
}

.layout_logo_text {
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  width: 100%;
  max-width: 200px;
  color: #7264D6;
  margin: 0;
}

@media (max-width: 576px) {
  .layout_logo_text {
    font-size: 16px;
    max-width: 100%;
    margin-top: 15px;
  }
}
.modal-dialog-close {
  position: absolute;
  top: 30px;
  right: 30px;
}

.modal-content {
  border-radius: 0;
  border: none;
  background: transparent;
}

.header_button_menu {
  text-align: right;
}

.header_button_menu button {
  border: none;
  background: transparent;
  border-radius: 0;
}

.header_button_menu button img {
  width: 30px;
}

.layout_dialog_in {
  background: white;
}

.modal-form {
  background: white;
  padding: 30px;
  border-radius: 30px;
}

.modal-form .modal-header {
  border-bottom: 0;
}

.cookie-consent {
  position: fixed;
  bottom: 30px;
  left: 30px;
  background: white;
  padding: 30px;
  width: 100%;
  max-width: 350px;
  border-radius: 20px;
  font-size: 14px;
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
}

@media (max-width: 576px) {
  .cookie-consent {
    left: 0;
  }
}
.cookie-consent button {
  background: #7264D6;
  padding: 7px 12px;
  color: white;
  font-size: 14px;
  border: none;
  border-radius: 9px;
  max-width: 100%;
  min-width: 150px;
}

.legal_table .row > div {
  border: 1px solid #ccc;
  padding: 10px;
}

.form-component .form-control {
  padding: 10px 20px;
  border: 1px solid #e1e1e1;
  border-radius: 10px;
}

.form-component .p_legal {
  margin: 0;
  font-size: 12px;
}

.form-component .form-check {
  display: flex;
  align-items: center;
  gap: 0.5rem; /* отступ между чекбоксом и текстом */
}

.form-component .form-check-input {
  margin-top: 0 !important;
  transform: translateY(0.1em); /* слегка приподнять или опустить */
}

.error-div {
  font-size: 12px;
  color: rgba(255, 0, 0, 0.7);
  margin-bottom: 20px;
}

.form-success {
  font-size: 24px;
  color: #7264D6;
}

.percents_pay {
  padding: 30px;
}

.percents_pay .percent {
  color: #7264D6;
  font-size: 30px;
}

.percents_pay .percent_description {
  font-size: 14px;
}