@charset "UTF-8";
/*===== GOOGLE FONTS =====*/
@import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600&display=swap");
/*===== VARIABLES CSS =====*/
:root {
  --header-height: 3rem;
  /*========== Colors ==========*/
  --first-color: #00C1C2;
  --first-color-alt: #3476D9;
  --two-color: #0000;
  --title-color: #393939;
  --text-color: #707070;
  --text-color-light: #A6A6A6;
  --body-color: hsl(220, 100%, 99%);
  --container-color: #FFFFFF;
  --Soft: hsl(174, 77%, 80%);
  --Strong: hsl(174, 88%, 44%);
  --Ligh-light-orange: hsl(14, 92%, 95%);
  --Light-orange: hsl(15, 100%, 70%);
  --Pale: hsl(226, 100%, 87%);
  --White: hsl(0, 0%, 100%);
  --Very: hsl(230, 100%, 99%);
  --Light:hsl(224, 65%, 95%);
  --Light-light: hsl(223, 50%, 87%);
  --Grayish:hsl(225, 20%, 60%);
  --Dark:hsl(227, 35%, 25%);
  /*========== Box-shadow ==========*/
  --main-shadow: 6.006px 18.017px 66.73px -8.675px rgba(22, 52, 80, 0.1);
  --button-shadow: 1px 2px 5px rgb(96 195 255 / 33%);
  --button-shadow-alt: 1px 2px 5px rgb(0 193 194);
  --button-shadow-blue: 1px 2px 5px rgb(41 169 255);
  /*========== Font and typography ==========*/
  --body-font: "Montserrat", normal;
  --biggest-font-size: 1.5rem;
  --section-title: 1.25rem;
  --h1-font-size: 1rem;
  --h2-font-size: 1.25rem;
  --h3-font-size: 1rem;
  --normal-font-size: .938rem;
  --small-font-size: .813rem;
  --smaller-font-size: .75rem;
  /*========== Font weight ==========*/
  --font-medium: 500;
  --font-semi-bold: 600;
  /*========== Margenes ==========*/
  --mb-1: .5rem;
  --mb-2: 1rem;
  --mb-3: 1.5rem;
  --mb-4: 2rem;
  --mb-5: 2.5rem;
  --mb-6: 3rem;
  /*========== z index ==========*/
  --z-tooltip: 10;
  --z-fixed: 100;
}
@media screen and (min-width: 768px) {
  :root {
    --biggest-font-size: 2.5rem;
    --section-title: 1.75rem;
    --h1-font-size: 1.25rem;
    --h2-font-size: 1.5rem;
    --h3-font-size: 1.25rem;
    --normal-font-size: 1rem;
    --small-font-size: .875rem;
    --smaller-font-size: .813rem;
  }
}

/*========== BASE ==========*/
*, ::before, ::after {
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

/*========== Variables Dark theme ==========*/
body.dark-theme {
  --title-color: #F1F3F2;
  --text-color: #C7D1CC;
  --body-color: #1D2521;
  --container-color: #27302C;
}

/*========== Button Dark/Light ==========*/
.change-theme {
  position: absolute;
  right: 1rem;
  top: 1.8rem;
  color: var(--text-color);
  font-size: 1rem;
  cursor: pointer;
}


/*========== TILDA ==========*/


.card .pageview1 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: center;
    /* padding: 2rem 0; */
    padding-top: 2rem;
    padding-bottom: 2.75rem;
    font-size: 1rem;
    color: #00c1c2;
}

.tariff__border {
    padding-top: 5px;
    font-size: 10px;
    margin-left: auto;
    color: black;
    margin-right: auto;
    /* padding-top: 40px; */
    margin-top: 1rem;
    width: 128px;
    height: 30px;
    -ms-flex-negative: 0;
    /* flex-shrink: 0; */
    border-radius: 40px;
    border: 1px solid #E8C2FF;
}

.card .slider__container .pageview {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    /* padding: 2rem 0; */
    font-size: 1rem;
    padding-top: 2rem;
    color: #00c1c2;
}


.t738.t738__witharrows {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    
    
} 

.t-name {
    font-family: 'Montserrat',Arial,sans-serif;
    font-weight: 400;
    color: #fafcff;
}

.t-name_xl {
   font-size: var(--normal-font-size) !important;
    /* line-height: 1.35; */
}

.t1029__bgimg {
    margin-bottom: 35px;
    width: 220px;
    height: 100px;
    max-width: 100%;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}
    
    
    .t282__menu__content {
    z-index: 15;
    max-width: 1280px;
        position: relative;
    margin: 0 auto;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
}
.t282__logo__img {
    display: block;
    height: 50px !important;
}
    
    p.people__description {
    font-size: 20px;
}

.div4 h3 {
    font-size: 32px;
}



body {
  margin: var(--header-height) 0 0 0;
  font-family: var(--body-font);
  font-size: var(--normal-font-size);
  background-color: var(--body-color);
  color: var(--text-color);
  line-height: 1.6;
}

h1, h2, h3, ul, p {
  margin: 0;
}

ul {
  padding: 0;
  list-style: none;
}

a {
  text-decoration: none;
}

img {
  max-width: 100%;
  height: auto;
}

/*========== CLASS CSS ==========*/
.section {
  padding: 4rem 0 2rem;
}
.section-title, .section-subtitle {
  text-align: center;
}
.section-title {
  font-size: var(--section-title);
  color: var(--title-color);
  margin-bottom: var(--mb-3);
}
.section-subtitle {
  display: block;
  color: var(--first-color);
  font-weight: var(--font-medium);
  margin-bottom: var(--mb-1);
}
.section-subtitle1 {
  font-size: 2rem;
  color: var(--first-color);
  font-style: normal;
  font-weight: 600;
  line-height: normal;
}

/*========== LAYOUT ==========*/
.bd-container {
  max-width: 1200px;
  width: calc(100% - 2rem);
  margin-left: var(--mb-2);
  margin-right: var(--mb-2);
}

.bd-grid {
  display: -ms-grid;
  display: grid;
  gap: 2.5rem;
}

.l-header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: var(--z-fixed);
  background-color: var(--body-color);
}

/*========== NAV ==========*/
.nav {
  max-width: 1200px;
  height: var(--header-height);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .nav__menu {
    position: fixed;
    top: -100%;
    left: 0;
    width: 100%;
    padding: 1.5rem 0 1rem;
    text-align: center;
    background-color: var(--body-color);
    -webkit-transition: 0.4s;
    transition: 0.4s;
    -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
            box-shadow: 0 4px 4px rgba(0, 0, 0, 0.1);
    border-radius: 0 0 1rem 1rem;
    z-index: var(--z-fixed);
  }
}
.nav__item {
  margin-bottom: var(--mb-2);
}
.nav__link, .nav__logo, .nav__toggle {
  color: var(--text-color);
  font-weight: var(--font-medium);
}
.nav__logo:hover {
  color: var(--first-color);
}
.nav__link {
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.nav__link:hover {
  color: var(--first-color);
}
.nav__toggle {
  font-size: 1.3rem;
  cursor: pointer;
}

/* Show menu */
.show-menu {
  top: var(--header-height);
}

/* Active menu */
.active-link {
  color: var(--first-color);
}

/* Change background header */
.scroll-header {
  -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
          box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Scroll top */
.scrolltop {
  position: fixed;
  right: 1rem;
  bottom: -20%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  padding: 0.3rem;
  background: rgba(0, 193, 194, 0.3882352941);
  border-radius: 0.4rem;
  z-index: var(--z-tooltip);
  -webkit-transition: 0.4s;
  transition: 0.4s;
  visibility: hidden;
}
.scrolltop:hover {
  background-color: var(--first-color-alt);
}
.scrolltop__icon {
  font-size: 1.8rem;
  color: var(--body-color);
}

.show-scroll {
  visibility: visible;
  bottom: 1.5rem;
}

/*========== HOME ==========*/
.home {
  background-image: url(https://static.tildacdn.com/tild3834-6335-4633-b534-386561393933/bg_1.png);
  background-size: no-repeat;
  background-position: center;
  background-size: cover;
}
.home__container {
  height: calc(100vh - var(--header-height));
  -ms-flex-line-pack: center;
  align-content: center;
  background-size: auto;
}
.home__title {
  font-size: var(--biggest-font-size);
  color: var(--first-color);
  margin-bottom: var(--mb-1);
}
.home__subtitle {
  font-size: var(--h1-font-size);
  color: var(--title-color);
  margin-bottom: var(--mb-4);
}
.home__img {
  width: 300px;
  -ms-grid-column-align: center;
      justify-self: center;
}

/*========== BUTTONS ==========*/
.button {
  display: inline-block;
  background: rgb(52, 118, 217);
  background: -webkit-gradient(linear, left top, right top, from(rgb(52, 118, 217)), to(rgb(0, 206, 206)));
  background: linear-gradient(90deg, rgb(52, 118, 217) 0%, rgb(0, 206, 206) 100%);
  color: #FFF !important;
  padding: 0.75rem 1rem;
  border-radius: 1.8rem;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.button:hover {
  -webkit-box-shadow: var(--button-shadow-blue);
          box-shadow: var(--button-shadow-blue);
}

/*========== ABOUT ==========*/
.about__data {
  text-align: center;
  padding: 20px;
}
.about__data h2 {
  font-size: 1.5rem;
}
.about__description {
  text-align: left;
  margin-bottom: var(--mb-3);
}
.about__description li {
  list-style: disc;
  /* list-style-position: revert; */
  /* list-style-type: inherit; */
}
.about__img {
  width: auto;
  border-radius: 0.5rem;
  -ms-grid-column-align: center;
      justify-self: center;
}

/*========== SERVICES ==========*/
.services__container {
  row-gap: 2.5rem;
  -ms-grid-columns: minmax(330px, 1fr) [auto-fit];
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
}
@media screen and (max-width: 768px) {
  .services__container {
    -ms-grid-columns: minmax(230px, 1fr) [auto-fit];
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  }
}
.services__content {
  text-align: center;
  -webkit-box-shadow: 6.006px 18.017px 66.73px -8.675px rgba(22, 52, 80, 0.1);
          box-shadow: 6.006px 18.017px 66.73px -8.675px rgba(22, 52, 80, 0.1);
  background-color: white;
  border-radius: 1.8rem;
  padding: 20px;
}
.services__img {
  width: 64px;
  height: 64px;
  fill: var(--first-color);
  margin-bottom: var(--mb-2);
}
.services__title {
  font-size: var(--h3-font-size);
  color: var(--title-color);
  margin-bottom: var(--mb-1);
}
.services__description {
  padding: 0 1.5rem;
}

/*========== TARIFF ==========*/
.tariff {
  /*.tariff__border h3{
      padding-top: 7px;
      font-size: 10px;
      color: black;
      width: 128px;
      height: 30px;
      flex-shrink: 0;
      border-radius: 40px;
      border: 1px solid #E8C2FF;


  }
  */
}
.tariff__container {
  row-gap: 2.5rem;
  -ms-grid-columns: minmax(330px, 1fr) [auto-fit];
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
}
@media screen and (max-width: 1101px) {
  .tariff__container {
    -ms-grid-columns: max-content;
    grid-template-columns: -webkit-max-content;
    grid-template-columns: max-content;
    margin-left: auto;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    /* align-items: center; */
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin-right: auto;
    /* grid-auto-flow: column; */
    /* grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); */
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
}
.tariff .tariff__text {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: start;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  color: #00c1c2;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  gap: 4rem;
}
.tariff .tariff__data ul li {
  padding-top: 1rem;
}
.tariff__content {
  text-align: center;
  -webkit-box-shadow: 6.006px 18.017px 66.73px -8.675px rgba(22, 52, 80, 0.1);
          box-shadow: 6.006px 18.017px 66.73px -8.675px rgba(22, 52, 80, 0.1);
  background-color: white;
  border-radius: 1.8rem;
  padding: 20px;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-line-pack: stretch;
  align-content: stretch;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}
.tariff__img {
  width: 64px;
  height: 64px;
  fill: var(--first-color);
  margin-bottom: var(--mb-2);
}
.tariff__title {
  font-size: var(--h3-font-size);
  color: var(--title-color);
  margin-bottom: var(--mb-3);
}
.tariff__description {
  padding: 0 1.5rem;
}

/*========== MENU ==========*/
.menu__container {
  -ms-grid-columns: 1fr [2];
  grid-template-columns: repeat(2, 1fr);
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.menu__content {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  background-color: var(--container-color);
  border-radius: 1.8rem;
  -webkit-box-shadow: 6.006px 18.017px 66.73px -8.675px rgba(22, 52, 80, 0.1);
          box-shadow: 6.006px 18.017px 66.73px -8.675px rgba(22, 52, 80, 0.1);
  padding: 0.75rem;
}
.menu__line {
  /* height: 1px; */
  /* background-color: #E9F5FF; */
  margin-bottom: 20px;
  border-top: solid #E9F5FF;
}
.menu__img {
  width: 100px;
  -ms-flex-item-align: center;
  -ms-grid-row-align: center;
  align-self: center;
  margin-bottom: var(--mb-2);
}
.menu__name, .menu__preci {
  font-weight: var(--font-semi-bold);
  color: var(--title-color);
}
.menu__name {
  font-size: var(--normal-font-size);
}
.menu__detail, .menu__preci {
  font-size: var(--small-font-size);
}
.menu__detail {
  margin-bottom: var(--mb-1);
}
.menu__button {
  background-color: white;
  color: black;
  -webkit-box-shadow: var(--button-shadow);
          box-shadow: var(--button-shadow);
  bottom: 0;
  right: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  font-size: 1rem;
  border-radius: 1.8rem;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  /* 
   &:hover{
       color: white;
       background-color: var(--first-color);
   } 

   */
}
.menu__button:hover {
  -webkit-box-shadow: var(--button-shadow-alt);
          box-shadow: var(--button-shadow-alt);
  background-color: white;
}

/*========== APP ==========*/
.app__data {
  text-align: center;
}
.app__description {
  margin-bottom: var(--mb-5);
}
.app__stores {
  margin-bottom: var(--mb-4);
}
.app__store {
  width: 120px;
  margin: 0 var(--mb-1);
}
.app__img {
  width: auto;
  -ms-grid-column-align: center;
      justify-self: center;
}

/*=============== CATEGORY ===============*/
.category__container {
  -ms-grid-columns: 1fr [2];
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem 2rem;
  margin-left: auto;
  margin-right: auto;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.category__content {
  text-align: center;
}
.category__content:hover .category__img {
  -webkit-transform: translateY(-0.5rem);
  transform: translateY(-0.5rem);
}
.category__img {
  width: 120px;
  margin-bottom: var(--mb-0-75);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.category__title {
  font-size: var(--h3-font-size);
  color: var(--first-color);
  margin-bottom: var(--mb-1);
}

/*=============== PEOPLE ===============*/
.people__container {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr [2];
  grid-template-columns: repeat(2, 1fr);
  -ms-grid-rows: 1fr [2];
  grid-template-rows: repeat(2, 1fr);
  grid-column-gap: 60px;
  grid-row-gap: 40px;
}
.people__content {
  text-align: left;
}
.people__content:hover .people__img {
  -webkit-transform: translateY(-0.5rem);
  transform: translateY(-0.5rem);
}
.people__img {
  width: auto;
  margin-bottom: var(--mb-0-75);
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.people__title {
  font-size: var(--h3-font-size);
  color: #000000;
  margin-bottom: var(--mb-1);
}

.frame_content {
  display: inline-block;
}

.people__content {
  padding: 40px;
  background-color: white;
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  border-radius: 1.8rem;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 1/1/3/2;
}

.people__content2 {
  padding: 20px;
  background-color: white;
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  border-radius: 1.8rem;
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-area: 1/2/2/3;
}

.people__content3 {
  padding: 20px;
  background-color: white;
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  border-radius: 1.8rem;
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-area: 2/2/3/3;
}

/*========== SLIDER ==========*/
.osnovaniye {
  height: 100%;
  padding: 50px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

.slick-slider {
  min-width: 0;
}

.slick-list {
  overflow: hidden;
}

.slick-track {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.slider {
  position: relative;
  padding: 0px 60px;
}

@media (max-width: 767px) {
  .slider {
    padding: 0px 40px;
  }
}
.slider .slick-arrow {
  position: absolute;
  top: 50%;
  margin: -20px 0px 0px 0px;
  z-index: 10;
  border-radius: 15.077px;
  background: #FFF;
  -webkit-box-shadow: 2.56px 7.681px 28.447px -3.698px rgba(22, 52, 80, 0.1);
          box-shadow: 2.56px 7.681px 28.447px -3.698px rgba(22, 52, 80, 0.1);
  font-size: 0;
  width: 58.5px;
  border: none;
  height: 58.5px;
  /* width: 30px; */
  /* height: 30px; */
}

.slider .slick-arrow.slick-prev {
  left: 0;
  background-image: url(assets/img/slider/icon/left.png);
  background-repeat: no-repeat;
  /* margin: 10px; */
  background-position: center center;
  /* padding: 10px; */
  /* align-items: center; */
}

.slider .slick-arrow.slick-next {
  right: 0;
  background-image: url(assets/img/slider/icon/right.png);
  background-repeat: no-repeat;
  /* margin: 10px; */
  background-position: center center;
  /* padding: 10px; */
  /* align-items: center; */
}

.slider .slick-arrow.slick-disabled {
  opacity: 0.2;
}

.moving_slayda {
  padding: 0px 15px;
}

.moving_slayda img {
  max-width: 100%;
  height: 100%;
}

@media (max-width: 767px) {
  .osnovaniye {
    padding: 50px 10px;
  }
  .slider {
    padding: 0px 40px;
  }
}
/*========== FAQ ==========*/
.faq-content {
  /* display: grid; */
  -ms-grid-columns: 1.3fr 1fr;
  grid-template-columns: 1.3fr 1fr;
  width: 100%;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.faq-box {
  padding: 35px;
  background: rgba(255, 255, 255, 0.4);
  border: 1px solid #FFFFFF;
  -webkit-box-shadow: 14px 14px 60px rgba(42, 97, 130, 0.06);
          box-shadow: 14px 14px 60px rgba(42, 97, 130, 0.06);
  border-radius: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  width: 100%;
  margin-bottom: 20px;
}

.faq-box:last-child {
  margin-bottom: 0px;
}

.faq-box-question {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 30px;
  grid-template-columns: 1fr 30px;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.faq-box-answer {
  max-height: 0px;
  overflow: hidden;
  -webkit-transition: all ease-in-out 0.5s;
  transition: all ease-in-out 0.5s;
}

.faq-img {
  width: 100%;
  overflow: hidden;
  border-radius: 27px 0px 0px 27px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-shadow: 14px 14px 60px rgba(59, 42, 130, 0.06);
          box-shadow: 14px 14px 60px rgba(59, 42, 130, 0.06);
}

.faq-box-container {
  /* margin-right: 40px; */
  /*  margin-top: 70px;*/
}

.faq-img img {
  width: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: right;
  object-position: right;
}

.faq-box-icon {
  display: block;
  position: relative;
  height: 3px;
  -webkit-transition: background 0.2s ease-out;
  transition: background 0.2s ease-out;
  width: 23px;
  margin-left: auto;
}

.faq-box-icon::before,
.faq-box-icon::before, .faq-box-icon::after {
  background: #00c1c2;
  content: "";
  position: absolute;
  height: 100%;
  -webkit-transition: all ease-out 0.2s;
  transition: all ease-out 0.2s;
  width: 100%;
  border-radius: 3px;
}

.faq-box-icon::before {
  top: 0px;
}

.faq-box-icon::after {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
  top: 0px;
}

.faq-box-question.active h4 {
  color: #00c1c2;
}

.faq-box-question.active .faq-box-icon::after {
  -webkit-transform: rotate(0deg);
  transform: rotate(0deg);
}

@media (max-width: 1200px) {
  #faq {
    padding: 84px 0px 144px 20px;
  }
}
@media (max-width: 800px) {
  #faq {
    padding: 84px 0px 144px 20px;
  }
  .faq-content {
    -ms-grid-columns: 1fr;
    grid-template-columns: 1fr;
  }
  .faq-box-container {
    margin-right: 0px;
    padding-right: 20px;
  }
  .faq-img {
    margin-top: 25px;
  }
}
@media (max-width: 724px) {
  #faq {
    padding: 82px 0px 80px 20px;
  }
  .faq-img {
    border-radius: 18.0651px 0px 0px 18.0651px;
  }
  .faq-heading {
    padding: 0px 20px;
  }
  .faq-heading h3 {
    font-weight: 700;
    font-size: 26.2px;
    line-height: 33px;
  }
  .faq-box-question h4 {
    font-weight: 700;
    font-size: 19px;
    line-height: 26px;
  }
  .faq-box {
    padding: 24px 21px;
  }
  .faq-box-icon {
    width: 16px;
  }
  .faq-box-question {
    -ms-grid-columns: 1fr 16px;
    grid-template-columns: 1fr 16px;
  }
}
/*========== EMAIL ==========*/
/* Стили самой формы */
.email {
  /*  Попробовать сделать div c фоном 
      background-image: url(../img/bg/2.png);
      background-position: center;
      background-size: cover;
      min-height: 600px;*/
}
.email__container {
  max-width: -webkit-max-content;
  max-width: -moz-max-content;
  max-width: max-content;
  /* max-height: 520px; */
  margin-left: auto;
  margin-right: auto;
}

.content {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: unset;
  -ms-flex-align: unset;
  align-items: unset;
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  background: #fff;
  padding: 40px;
  border-radius: 1.8rem;
  /* box-shadow: 4px 4px 8px 0 rgba(34, 60, 80, 0.2); */
}

.content img {
  position: absolute;
}

.content h4 {
  font-size: 2rem;
}

/* Стили левой колонки */
.left-side {
  width: 55%;
  height: 100%;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

/* Стили правой колонки */
.right-side {
  width: 45%;
  /* margin-left: 75px; */
}

/* Элементы левой колонки: адрес, телефон, email */
.details {
  margin-bottom: 15px;
  text-align: center;
}

/* Общие стили для иконок */
.details i {
  font-size: 25px; /* задаем размер */
  color: #3e2093; /* задаем цвет */
  margin-bottom: 10px;
}

/* Стили для заголовков левой колонки */
.topic {
  font-size: 18px;
  font-weight: 500;
  margin-bottom: 7px; /* отступ снизу 7px */
}

/* Стили для текста левой колонки */
.text-one,
.text-two {
  font-size: 14px;
  color: #afafb6;
}

.input-box input, .input-box textarea {
  color: var(--Black-2, #ABAFB1);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: normal;
}

.checkbox {
  height: 15px;
  width: 100%;
  margin-bottom: 20px;
}

/* Стили для input и textarea (поле сообщение) */
.input-box input,
.input-box textarea {
  height: 100%; /* растягиваем на всю высоту контейнера 50px */
  width: 100%; /* растягиваем на всю ширину */
  border: none; /* убираем внешние края */
  border-radius: 5px; /* скругляем края */
  background: #f0f1f8; /* задаем цвет фона */
  padding: 10px; /* отступ справа и слева 20px */
  margin-bottom: 10px;
  margin-top: 10px;
}

/* Отдельно стилизуем поле сообщение */
.input-box textarea {
  resize: none; /* чтобы нельзя было менять высоту */
  padding: 20px;
  font-family: "Roboto", sans-serif;
}

/* Это контейнер для поля сообщение */
.message-box {
  min-height: 110px; /* минимальная высота 110px */
}

/* Меняем стили при ширине экрана меньше 800px */
@media (max-width: 800px) {
  /* Теперь форма (правая колонка) будет сверху, а элементы (левая колонка) снизу */
  .content {
    height: 100%;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column; /* располагаем в колонку сверху */
  }
  /* Внутри левой колонки внутренние элементы располагаем в ряд */
  .left-side {
    margin-top: 50px;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row; /* располагаем элементы (адрес, телефон, email) в ряд */
    width: 100%; /* левая колонка на всю ширину */
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap; /* перенос элементов, если не хватит места */
  }
  .details {
    margin-right: 20px;
  }
  .details:last-child {
    margin-right: 0;
  }
  /* Убираем разделительную линию */
  .left-side::before {
    display: none;
  }
  /* Правая колонка теперь на всю ширину и не имеет отступа слева */
  .right-side {
    margin-left: 0;
  }
}
@media (max-width: 800px) and (max-width: 576px) {
  .contact__title.xm__screen h3 {
    font-size: 1.5rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 8px;
    color: black;
  }
  .section-subtitle1 {
    font-size: 1.5rem;
    color: var(--first-color);
    font-style: normal;
    font-weight: 600;
    line-height: normal;
  }
}
/*========== BANNER ==========*/
.banner_parent {
  display: -ms-grid;
  display: grid;
  -ms-grid-columns: 1fr 0px 1fr 0px 1fr 0px 1fr 0px 1fr;
  grid-template-columns: repeat(3, 1fr);
  -ms-grid-rows: 1fr 0px 1fr 0px 1fr 0px 1fr 0px 1fr;
  grid-template-rows: repeat(1, 1fr);
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  background: rgb(84, 176, 217);
  background: -webkit-gradient(linear, left top, right top, from(rgb(84, 176, 217)), to(rgb(189, 232, 238)));
  background: linear-gradient(90deg, rgb(84, 176, 217) 0%, rgb(189, 232, 238) 100%);
  border-radius: 1.8rem;
  margin-top: 4rem;
}
.banner_parent .start__trial .start__trial__button a {
  /* font-size: 0.7rem; */
  /* font-weight: 800; */
  color: var(--text-color) !important;;
  background: hsl(0, 0%, 100%);
  border-radius: 2rem;
  padding: 0.6rem 3.2rem;
  -webkit-box-shadow: var(--button-shadow-blue);
  box-shadow: var(--button-shadow-blue);
}
.banner_parent .start__trial .start__trial__button:hover a {
  color: black !important;;
  -webkit-box-shadow: var(--button-shadow-blue);
  box-shadow: var(--button-shadow-blue);
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}

.banner_div1 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 3;
  grid-area: 1/1/2/4;
}

.banner_div2 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 1/1/2/2;
  padding-top: 40px;
  padding-left: 60px;
}

.banner_div3 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-area: 1/2/2/3;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.banner_div4 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-area: 1/3/2/4;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.banner__container {
  text-align: center;
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  /*background-color: #cff7f8;*/
  background: rgb(84, 176, 217);
  background: -webkit-gradient(linear, left top, right top, from(rgb(84, 176, 217)), to(rgb(189, 232, 238)));
  background: linear-gradient(90deg, rgb(84, 176, 217) 0%, rgb(189, 232, 238) 100%);
  margin-top: 4rem;
  border-radius: 1.8rem;
  color: white;
}
.banner__container .start__trial__button {
  margin: 2.2rem 0;
}
.banner__container .start__trial .start__trial__button a {
  /* font-size: 0.7rem; */
  /* font-weight: 800; */
  color: var(--text-color);
  background: hsl(0, 0%, 100%);
  border-radius: 2rem;
  padding: 0.6rem 3.2rem;
  -webkit-box-shadow: var(--button-shadow);
  box-shadow: var(--button-shadow);
}
.banner__description {
  margin-bottom: var(--mb-3);
  color: white;
}
.banner__data {
  padding: 40px;
}

.banner-title.contact__initial {
  color: white;
  font-size: var(--section-title);
  margin-bottom: 20px;
}

/*========== CONTACT ==========*/
.contact__container {
  text-align: center;
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  /*background-color: #cff7f8;*/
  border-radius: 1.8rem;
}
.contact__description {
  margin-bottom: var(--mb-3);
}
.contact__data {
  padding: 40px;
}

/*========== FOOTER ==========*/
.footer__container {
    -ms-grid-columns: minmax(220px, 1fr) [auto-fit];
    /* grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); */
    row-gap: 2rem;
}

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

.footer__cont {
    font-size: var(--small-font-size);
}

.footer__logo {
  font-size: var(--h3-font-size);
  color: var(--first-color) !important;;
  font-weight: var(--font-semi-bold);
}
.footer__description {
  display: block;
  font-size: var(--small-font-size);
  margin: 0.25rem 0 var(--mb-3);
}
.footer__social {
  font-size: 1.5rem;
  color: var(--title-color);
  margin-right: var(--mb-2);
}
.footer__title {
  font-size: var(--h2-font-size);
  color: var(--title-color);
  margin-bottom: var(--mb-2);
}
.footer__link {
  display: inline-block;
  color: var(--text-color);
  margin-bottom: var(--mb-1);
}
.footer__link:hover {
  color: var(--first-color);
}
.footer__copy {
  text-align: center;
  font-size: var(--small-font-size);
  color: var(--text-color-light);
  margin-top: 3.5rem;
}

/*========== MEDIA QUERIES ==========*/
@media screen and (min-width: 576px) {
  .home__container,
  .about__container,
  .app__container {
    -ms-grid-columns: 1fr [2];
    grid-template-columns: repeat(2, 1fr);
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .about__data, .about__initial,
  .app__data, .app__initial,
  .contact__container, .banner__container, .contact__initial {
    text-align: initial;
  }
  .about__img, .app__img {
    width: auto;
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1;
  }
  .about__img1 {
    width: auto;
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: 1;
  }
  .contact__container {
    -ms-grid-columns: 1.75fr 1fr;
    grid-template-columns: 1.75fr 1fr;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .contact__button {
    -ms-grid-column-align: center;
        justify-self: center;
  }
  .banner__container {
    -ms-grid-columns: 1.75fr 1fr;
    grid-template-columns: 1.75fr 1fr;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .banner__button {
    -ms-grid-column-align: center;
        justify-self: center;
  }
}
@media screen and (min-width: 768px) {
  body {
    margin: 0;
  }
  .section {
    padding-top: 8rem;
  }
  .nav {
    height: calc(var(--header-height) + 1.5rem);
  }
  .nav__list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }
  .nav__item {
    margin-left: var(--mb-5);
    margin-bottom: 0;
  }
  .nav__toggle {
    display: none;
  }
  .change-theme {
    position: initial;
    margin-left: var(--mb-2);
  }
  .home__container {
    height: 100vh;
    -ms-grid-column-align: center;
    justify-items: center;
  }
  .services__container,
  .menu__container {
    margin-top: var(--mb-6);
  }
  .people__container {
    margin-top: var(--mb-6);
  }
  .tariff__container {
    margin-top: var(--mb-6);
  }
  .menu__container {
    -ms-grid-columns: 210px [3];
    grid-template-columns: repeat(3, 210px);
    -webkit-column-gap: 4rem;
    -moz-column-gap: 4rem;
    column-gap: 4rem;
  }
  .menu__content {
    padding: 1.5rem;
  }
  .menu__img {
    width: 130px;
  }
  .app__store {
    margin: 0 var(--mb-1) 0 0;
  }
}
@media screen and (max-width: 568px) {
  /*========== PEOPLE ==========*/
  .people__container {
    display: inline;
  }
  .people__content {
    text-align: center;
  }
  .people__content:hover .people__img {
    -webkit-transform: translateY(-0.5rem);
    transform: translateY(-0.5rem);
  }
  .people__img {
    width: auto;
    margin-bottom: var(--mb-0-75);
    -webkit-transition: 0.3s;
    transition: 0.3s;
    padding-top: 20px;
  }
  .people__img2 {
    padding-top: 20px;
  }
  .people__img3 {
    padding-top: 20px;
  }
  .people__title {
    font-size: 1.5rem;
    color: #000000;
    margin-bottom: var(--mb-1);
  }
  .banner_parent {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  .banner_parent .banner_div3 {
    padding-bottom: 40px;
  }
  .banner_parent .banner_div4 {
    padding-bottom: 40px;
  }
  .people__content {
    margin-bottom: 20px;
  }
  .people__content2 {
    margin-bottom: 20px;
  }
  .people__content3 {
    margin-bottom: 20px;
  }
  /*========== HOME ==========*/
  .home__container {
    text-align: center;
  }
  /*========== Category ==========*/
  .category__container {
    -ms-grid-columns: 1fr [2];
    grid-template-columns: repeat(1, 1fr);
    gap: 1rem 2rem;
    margin-left: auto;
    margin-right: auto;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
  }
  /*========== Banner ==========*/
  .banner_parent {
    text-align: center;
  }
  .banner_div2 {
    padding-left: 0px;
  }
}
/*========== Возможности ==========*/
.parent {
  display: -ms-grid;
  display: grid;
  /*grid-template-columns: repeat(5, 1fr);*/
  -ms-grid-rows: 1fr 40px 1fr;
  grid-template-rows: repeat(2, 1fr);
  padding-top: 20px;
  grid-column-gap: 60px;
  grid-row-gap: 40px;
}
@media screen and (max-width: 960px) {
  .parent {
    display: inline;
  }
}

.div1 {
  min-height: 400px;
  background-color: white;
  -webkit-box-shadow: var(--main-shadow);
  box-shadow: var(--main-shadow);
  border-radius: 1.8rem;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  padding: 20px;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}

.div_par {
  display: inline-block;
  -ms-grid-row: 1;
  -ms-grid-row-span: 2;
  -ms-grid-column: 1;
  -ms-grid-column-span: 2;
  grid-area: 1/1/3/3;
}
@media screen and (max-width: 960px) {
  .div_par {
    display: inline;
  }
}

.div_child {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
      justify-content: space-around;
}

.div2 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-area: 1/3/2/5;
  background-color: white;
  -webkit-box-shadow: var(--main-shadow);
  box-shadow: var(--main-shadow);
  border-radius: 1.8rem;
  /*
  @media screen and (max-width: 960px){
   margin-top: 40px;
   padding-bottom: 20px;

   721
  }*/
}
@media screen and (max-width: 960px) {
  .div2 {
    margin-top: 40px;
    padding-bottom: 20px;
  }
}

.div3 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 3;
  -ms-grid-column-span: 2;
  grid-area: 2/3/3/5;
  background-color: white;
  -webkit-box-shadow: var(--main-shadow);
  box-shadow: var(--main-shadow);
  border-radius: 1.8rem;
  /*
  @media screen and (max-width: 960px){
   margin-top: 40px;
   padding-bottom: 20px;
  }*/
}
@media screen and (max-width: 960px) {
  .div3 {
    margin-top: 40px;
    padding-bottom: 20px;
  }
}

.div4 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 1;
  -ms-grid-column-span: 1;
  grid-area: 1/1/2/2;
  padding-top: 100px;
  padding-left: 20px;
}

.div5 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 2;
  -ms-grid-column-span: 1;
  grid-area: 1/2/2/3;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.div6 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-area: 1/3/2/4;
  padding-top: 20px;
  padding-left: 20px;
}

.div7 {
  -ms-grid-row: 1;
  -ms-grid-row-span: 1;
  -ms-grid-column: 4;
  -ms-grid-column-span: 1;
  grid-area: 1/4/2/5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.div8 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 3;
  -ms-grid-column-span: 1;
  grid-area: 2/3/3/4;
  padding-top: 20px;
  padding-left: 20px;
}

.div9 {
  -ms-grid-row: 2;
  -ms-grid-row-span: 1;
  -ms-grid-column: 4;
  -ms-grid-column-span: 1;
  grid-area: 2/4/3/5;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

/*========== SLIDER ==========*/
.wrapper {
  max-width: 999px;
  background: #fff;
  padding: 20px 36px;
  border-radius: 1.8rem;
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  border: 2px solid #fff;
  margin: 10px;
  -webkit-transition: 0.3s;
  transition: 0.3s;
}

.wrapper___container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-column-gap: 30px;
  -moz-column-gap: 30px;
  column-gap: 30px;
}

.wrapper___container .container__col {
  width: 50%;
  /**  padding: 0px 20px; **/
}

.contact__title {
  padding: 10px 0px;
}

.contact__title h3 {
  font-size: 2rem;
  font-style: normal;
  font-weight: 600;
  line-height: normal;
  margin-bottom: 8px;
  color: black;
}

.contact__title p {
  font-size: 16px;
  font-weight: 400;
}

.xm__screen {
  display: none;
}

.xs__screen {
  display: block;
}

.contact__form {
  padding: 10px 0px;
  display: block;
}

.contact__form__item {
  margin: 10px 0px;
}

.contact__form__item input,
.contact__form__item textarea {
  width: 100%;
  font-family: "Montserrat";
  font-size: 0.85rem;
  min-height: 42px;
  border-radius: 4px;
  border-radius: 8px;
  padding: 6px 10px;
  border: none;
  /* border-radius: 4px; */
  background-color: rgba(239, 241, 249, 0.6);
}

.contact__form__item input:focus,
.contact__form__item textarea:focus {
  outline: none;
  border: 2px solid #00C1C2;
}

.contact__form__item label {
  display: inline;
  padding: 2px 0px;
  font-size: 15px;
  font-weight: 500;
}

.contact__form__submit {
  width: 60%;
  padding: 8px 12px;
  background: rgb(52, 118, 217);
  background: -webkit-gradient(linear, left top, right top, from(rgb(52, 118, 217)), to(rgb(0, 206, 206)));
  background: linear-gradient(90deg, rgb(52, 118, 217) 0%, rgb(0, 206, 206) 100%);
  color: #FFF;
  border-radius: 1.8rem;
  font-family: inherit;
  border: none;
  font-size: 1rem;
  cursor: pointer;
}

.contact__form__submit:hover {
  -webkit-box-shadow: var(--button-shadow-blue);
          box-shadow: var(--button-shadow-blue);
}

lottie-player {
  width: 100%;
  height: 300px;
}

.contact__info___list {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
}

.contact__info__list__items {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-column-gap: 15px;
  -moz-column-gap: 15px;
  column-gap: 15px;
  margin: 8px 0px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: stretch;
      -ms-flex-align: stretch;
          align-items: stretch;
  -webkit-box-pack: space-evenly;
      -ms-flex-pack: space-evenly;
          justify-content: space-evenly;
}

.contact__info__list__items i {
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  font-size: 24px;
  padding: 14px;
  background: #cff7f8;
  border-radius: 100%;
  color: #00c1c2;
}

.contact__info__list__items p {
  font-size: 1rem;
}

.contact__info__list__items p a {
  text-decoration: none;
  color: #000;
}

/*========== PRICE CARD ==========*/

/*
.tariff__border {
  padding-top: 5px;
  font-size: 10px;
  color: black;
  width: 128px;
  height: 30px;
  -ms-flex-negative: 0;
  /* flex-shrink: 0; */
 /* border-radius: 40px;
  border: 1px solid #E8C2FF;
}
*/





.card {
  text-align: center;
  max-width: 70vh;
  color: var(--Grayish) !important;
  /*margin: 2rem auto;*/
  background: var(--White);
  -webkit-box-shadow: var(--main-shadow);
          box-shadow: var(--main-shadow);
  border-radius: 1.8rem;
  padding: 20px;
  /*

      h3 {
          padding: 2rem 0;
          font-size: .8rem;
      }
  */
}
.card:hover {
  /* border: solid var(--first-color);*/
  -webkit-box-shadow: var(--button-shadow-alt);
          box-shadow: var(--button-shadow-alt);
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
 /* .card .pageview1 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: center;
  padding: 2rem 0;
  font-size: 1rem;
  color: #00c1c2;
}
*/
.card p {
  font-weight: 600;
  font-size: 0.7rem;
  margin: 0.5rem;
}
.card .slider__container {
  padding: 0 1.5rem;
  display: -ms-grid;
  display: grid;
}
 /*
.card .slider__container .pageview {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: 2rem 0;
  font-size: 1rem;
  color: #00c1c2;
}
*/
.card .slider__container .pageview .thousand {
  margin-right: 0.2rem;
}
.card .slider__container .price__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin: 0;
  padding: 1rem 1rem 1rem 1rem;
  font-size: 2rem;
  font-weight: 800;
  color: hsl(0, 0%, 0%);
}
.card .slider__container .price__container h2 {
  font-size: 2rem;
  font-weight: 800;
}
.card .slider__container .price__container p {
  color: var(--text-color);
  font-weight: 400;
  font-size: 1rem;
}
.card .slider__container .range {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  height: 7px;
  width: 100%;
  border-radius: 1rem;
  background: -webkit-gradient(linear, left top, right top, color-stop(50%, hsl(174, 77%, 80%)), color-stop(50%, hsl(223, 50%, 87%)));
  background: linear-gradient(90deg, hsl(174, 77%, 80%) 50%, hsl(223, 50%, 87%) 50%);
  opacity: 0.7;
  outline: none;
}
.card .slider__container .range::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 35px;
  height: 35px;
  background: var(--Strong);
  border-radius: 2rem;
  -webkit-box-shadow: 0px 20px 36px 0px var(--Strong);
          box-shadow: 0px 20px 36px 0px var(--Strong);
  background-image: url("../img/icon-slider.svg");
  background-repeat: no-repeat;
  background-position: center center;
  cursor: pointer;
}
.card .slider__container .range::-moz-range-thumb {
  height: 25px;
  width: 25px;
  background: var(--Soft);
}
.card .billing__container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  text-align: center;
  margin: 2rem 0;
  margin-top: 0.5rem;
}
.card .billing__container p {
  font-weight: 600;
}
.card .billing__container .yearly {
  margin-right: 0.4rem;
}
.card .billing__container .switch {
  position: relative;
  display: inline-block;
  width: 40px;
  height: 20px;
  margin: 0 5px;
}
.card .billing__container .switch .slider {
  margin: 0;
  position: absolute;
  cursor: pointer;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: var(--Pale);
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
  border-radius: 34px;
}
.card .billing__container .switch input {
  display: none;
}
.card .billing__container .switch .slider:before {
  position: absolute;
  content: "";
  height: 15px;
  width: 15px;
  left: 3px;
  bottom: 2.25px;
  background: white;
  -webkit-transition: 0.4s ease-in-out;
  transition: 0.4s ease-in-out;
  border-radius: 50px;
}
.card .billing__container .switch input:checked + .slider {
  background: var(--Strong);
}
.card .billing__container .switch input:checked + .slider:before {
  -webkit-transform: translateX(19px);
  transform: translateX(19px);
}
.card .billing__container .-discount {
  margin: 0;
  font-size: 0.7rem;
  padding: 0.2rem 0.5rem;
  border-radius: 1rem;
  color: var(--Light-orange);
  font-weight: 800;
  background: var(--Ligh-light-orange);
}
.card .billing__container .discount {
  margin: 0;
  display: none;
  font-size: 0.7rem;
  padding: 0.2rem 0.5rem;
  border-radius: 1rem;
  color: var(--Light-orange);
  font-weight: 800;
  background: var(--Ligh-light-orange);
}
.card .start__trial {
  border-top: 1px solid var(--Light);
  /* padding: 1.5rem; */
  margin: 0;
}
.card .start__trial .start__trial__button:hover a {
  color: black;
  -webkit-box-shadow: var(--button-shadow-alt);
          box-shadow: var(--button-shadow-alt);
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
.card .start__trial ul li {
  font-size: 0.8rem;
  margin-bottom: 0.8rem;
}
.card .start__trial ul li img {
  margin-right: 15px;
}
.card .start__trial .start__trial__button {
  margin: 2.2rem 0;
}
.card .start__trial .start__trial__button a {
  /* font-size: 0.7rem; */
  /* font-weight: 800; */
  color: var(--text-color) !important;
  background: hsl(0, 0%, 100%);
  border-radius: 2rem;
  padding: 0.6rem 3.2rem;
  -webkit-box-shadow: var(--button-shadow);
          box-shadow: var(--button-shadow);
}
.card .start__trial .start__trial__button:hover a {
  color: black;
  -webkit-box-shadow: var(--button-shadow-alt);
          box-shadow: var(--button-shadow-alt);
  -webkit-transition: all 0.3s ease 0s;
  transition: all 0.3s ease 0s;
}
@media screen and (min-width: 768px) {
  .card body {
    background-size: 100% 55%;
  }
  .card .intro__text {
    margin-top: 2rem;
    padding: 2rem;
    padding-bottom: 2rem;
    background-position: center 20%;
    background-size: 6rem;
  }
  .card .intro__text h3 {
    font-size: 1.2rem;
  }
  .card .intro__text p {
    font-size: 0.66rem;
  }
  .card .card {
    max-width: 460px;
    margin: 0.5rem auto;
  }
  .card .card .slider__container {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
        grid-template-areas: "pv price_container" "ranged ranged";
  }
  .card .card .slider__container .pageview {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    grid-area: pv;
  }
  .card .card .slider__container .pageview .thousand {
    margin-right: 0.2rem;
  }
  .card .card .slider__container .price__container {
    grid-area: price_container;
    padding: 0 0 0 0;
    font-size: 1.5rem;
  }
  .card .card .slider__container h2 {
    font-size: 1.5rem;
    font-weight: 800;
  }
  .card .card .slider__container p {
    color: var(--Grayish);
    font-weight: 600;
    font-size: 0.5rem;
  }
  .card .card .slider__container .range {
    width: 90%;
    grid-area: ranged;
    margin: 1rem auto;
  }
  .card .card .billing__container {
    margin: 1.3rem 0;
    margin-bottom: 1.5rem;
  }
  .card .card .billing__container .monthly {
    margin-left: 4.1rem;
  }
  .card .card .billing__container .-discount {
    display: none;
    margin: 0;
    font-size: 0.7rem;
    padding: 0.2rem 0.5rem;
    border-radius: 1rem;
    color: var(--Light-orange);
    font-weight: 800;
    background: var(--Ligh-light-orange);
  }
  .card .card .billing__container .discount {
    display: inline;
    font-size: 0.5rem;
    padding: 0.2rem 0.5rem;
    border-radius: 1rem;
    color: var(--Light-orange);
    font-weight: 800;
    background: var(--Ligh-light-orange);
  }
  .card .card .start__trial {
    display: -ms-grid;
    display: grid;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-grid-columns: 50% 50%;
    grid-template-columns: 50% 50%;
  }
  .card .card .start__trial ul {
    text-align: start;
  }
  .card .card .start__trial ul li {
    margin: 0.5rem 0;
    font-size: 0.6rem;
  }
}
@media screen and (min-width: 768px){
  .card .card .slider__container .pageview {
    -ms-grid-row: 1;
    -ms-grid-column: 1;
  }
  .card .card .slider__container .price__container {
    -ms-grid-row: 1;
    -ms-grid-column: 2;
  }
  .card .card .slider__container .range {
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
  }
}

/** Mobile Device **/
@media only screen and (max-width: 768px) {
  .wrapper {
    width: auto;
    padding: 20px 12px;
    margin: 10px;
  }
  .wrapper___container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    -ms-flex-direction: column-reverse;
    flex-direction: column-reverse;
  }
  .wrapper___container .container__col {
    width: 100%;
    padding: 0px 10px;
  }
  .xm__screen {
    display: block;
  }
  .xs__screen {
    display: none;
  }
  .start__trial__img {
    width: 50%;
  }
  /**========== BANNER ==========**/
  .banner_parent {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
  }
  .banner_div3 {
    padding-bottom: 40px;
  }
  .banner_div4 {
    padding-bottom: 40px;
  }
}
@media screen and (min-width: 960px) {
  .bd-container {
    margin-left: auto;
    margin-right: auto;
  }
  .home__img {
    width: 600px;
  }
  .about__container, .app__container {
    -webkit-column-gap: 7rem;
    -moz-column-gap: 7rem;
    column-gap: 7rem;
  }
}
/* For tall screens on mobiles y desktop*/
@media screen and (min-height: 721px) {
.home__container {
    height: 640px;
    /* padding-top: 150px; */
}
}
/** client logos **/
#clients {
  display: block;
  margin-bottom: 15px;
}

#clients .clients-wrap {
  display: block;
  width: 1000px;
  margin: 0 auto;
  overflow: hidden;
  margin-top: 6rem;
  border-top: 1px solid var(--Light);
  border-bottom: 1px solid var(--Light);
  padding-top: 20px;
  padding-bottom: 20px;
}
@media screen and (max-width: 999px) {
  #clients .clients-wrap {
    width: auto;
  }
}

#clients .clients-wrap ul {
  display: block;
  list-style: none;
  position: relative;
}

#clients .clients-wrap ul li {
  display: block;
  float: left;
  position: relative;
  width: 140px;
  height: 55px;
  line-height: 55px;
  text-align: center;
}

#clients .clients-wrap ul li img {
  vertical-align: middle;
  max-width: 100%;
  max-height: 100%;
  padding-left: 2rem;
  -webkit-transition: all 0.3s linear;
  transition: all 0.3s linear;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";
  filter: alpha(opacity=65);
  opacity: 0.65;
}

/**
 * При наведении курсора или нажатии, останавливает слайдер
 * 
#clients .clients-wrap ul li img:hover {
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
  filter: alpha(opacity=100); 
  opacity: 1.0;
}
*/
/** clearfix **/
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}

.clearfix {
  display: inline-block;
}

html[xmlns] .clearfix {
  display: block;
}

* html .clearfix {
  height: 1%;
}