@font-face {
  font-family: 'Helveticaneuecyr-Roman';
  src: url('../fonts/helveticaneuecyr_roman.eot');
  src: url('../fonts/helveticaneuecyr_roman.eot?#iefix') format('embedded-opentype'),
       url('../fonts/helveticaneuecyr_roman.woff2') format('woff2'),
       url('../fonts/helveticaneuecyr_roman.woff') format('woff');
        font-display: swap;
}

@font-face {
  font-family: 'Helveticaneuecyr-Light';
  src: url('../fonts/helveticaneuecyr_light.eot');
  src: url('../fonts/helveticaneuecyr_light.eot?#iefix') format('embedded-opentype'),
       url('../fonts/helveticaneuecyr_light.woff2') format('woff2'),
       url('../fonts/helveticaneuecyr_light.woff') format('woff');
        font-display: swap;
}

@font-face {
  font-family: 'Helveticaneuecyr-Bold';
  src: url('../fonts/helveticaneuecyr_bold.eot');
  src: url('../fonts/helveticaneuecyr_bold.eot?#iefix') format('embedded-opentype'),
       url('../fonts/helveticaneuecyr_bold.woff2') format('woff2'),
       url('../fonts/helveticaneuecyr_bold.woff') format('woff');
        font-display: swap;
}

@font-face {
  font-family: 'Helveticaneuecyr-Medium';
  src: url('../fonts/helveticaneuecyr_medium.eot');
  src: url('../fonts/helveticaneuecyr_medium.eot?#iefix') format('embedded-opentype'),
       url('../fonts/helveticaneuecyr_medium.woff2') format('woff2'),
       url('../fonts/helveticaneuecyr_medium.woff') format('woff');
        font-display: swap;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
  outline: none;
}

ul {
  list-style: none;
}

body {
  min-width: 330px;
  font-family: 'Helveticaneuecyr-Light';
  font-weight: 100;
  -webkit-font-smoothing: antialised;
}

.hid {
  overflow: hidden;
}

a {
  text-decoration: none;
  outline: none;
  -webkit-appearance: none;
  -webkit-tap-highlight-color: transparent;
}

strong {
  font-family: 'Helveticaneuecyr-Bold';
}

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

h1,h2,h3,h4,h5,h6 {
  font-weight: 100;
  -webkit-font-smoothing: antialised;
}

h2 {
  font-family: 'Helveticaneuecyr-Light';
  font-size: 65px;
  line-height: 1;
}

@media(max-width: 1500px) {
  h2 {
    font-size: 55px;
  }
}

@media(max-width: 1260px) {
  h2 {
    font-size: 45px;
  }
}

@media(max-width: 767px) {
  h2 {
    font-size: 37px;
  }
}

h6 {
  font-family: 'Helveticaneuecyr-Medium';
  font-size: 28px;
  line-height: 1.1;
  margin-top: 30px;
}

h6:first-child {
  margin-top: 0;
}

@media(max-width: 1500px) {
  h6 {
    font-size: 24px;
  }
}

@media(max-width: 1260px) {
  h6 {
    font-size: 22px;
  }
}

@media(max-width: 991px) {
  h6 {
    font-size: 21px;
  }
}

@media(max-width: 767px) {
  h6 {
    font-size: 20px;
  }
}

.container, .container-slider {
  position: relative;
  max-width: 1490px;
  width: 100%;
  padding: 0 15px;
  margin: 0 auto;
  box-sizing: border-box;
}

.container-slider {
  max-width: 1610px;
}

@media (max-width:1260px){
  .container {
    max-width: 990px;
    width: 100%;
  }  
}

@media (max-width: 991px){
  .container {
    max-width:760px;
    width: 100%;
  }
  h1,h2,h3,h4,h5,h6 {
    text-align: center;
  }
  br {
    display: none;
  }
}

@media (max-width: 767px){
  .container  {
    max-width: 510px;
  }
}
p {
  font-size: 25px;
  color: #181818;
  line-height: 1.7;
  margin-top: 25px;
}

@media(max-width: 1500px) {
  p {
    font-size: 20px;
  }
}

p:first-child {
  margin-top: 0;
}

.text-white p, .text-white h1, .text-white h2, .text-white h3, 
.text-white h4, .text-white h5, .text-white h6 {
  color: #fff;
}

section {
  position: relative;
}

.fl {
  display: flex;
  flex-wrap: wrap;
  flex-wrap: wrap;
}

.va, nav ul, .spb {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.spb {
  justify-content: space-between;
}

.jc {
  justify-content: center;
}

.fl-end {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-end;
}

header {
  background: linear-gradient(45deg, #5a06a0 20%, #0291bd);
  background-color: #5a06a0;
  padding-top: 52px;
}

.logo img {
  max-height: 185px;
}

@media(max-width: 1500px) {
  header {
    padding-top: 30px;
  }
  .logo img {
    max-height: 120px;
  }
}

@media(max-width: 991px) {
  .logo img {
    max-height: 70px;
  }
}

@media(max-width: 767px) {
  .logo img {
    max-height: 60px;
  }
}

nav a {
  position: relative;
  font-size: 25px;
  line-height: 1.1;
  color: #fff;
}

@media(max-width: 1500px) {
  nav a {
    font-size: 20px;
  }
}

nav a:after {
  content: '';
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 3px;
  background-color: #ffb800;
  transition: .3s;
}

.logo:after {
  display: none;
}

nav a:hover:after {
  width: 100%;
  transition: .3s;
}

nav li {
  margin-right: 55px;
}

@media(max-width: 1260px) {
  nav li {
    margin-right: 40px;
  }
}

nav li:last-child {
  margin-right: 0;
}

nav ul {
  flex: 1 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  border-bottom: 1px solid rgba(255,255,255,0.5);
  margin-bottom: 25px;
  margin-left: 30px;
}

@media(max-width: 991px) {
  nav ul {
    display: none;
  }
}

/*mobile*/
.menu-toggle {
  display: none;
}

@media(max-width: 991px) {
  .menu-toggle {
    display: block;
  }
}

.menu-toggle {
  height: 38px;
  width: 42px;
  cursor: pointer;
  margin-left: 15px;
}

.menu-toggle:after {
  display: none;
}

.menu-toggle, .menu-toggle:hover {
  color: #000;
}

.menu-toggle-bar {
  display: block;
  position: absolute;
  top: 50%;
  margin-top: -1px;
  right: 0;
  width: 100%;
  height: 3px;
  border-radius: 4px;
  background-color: #fff;
  transition: all 0.3s ease;
}

.menu-toggle:hover .menu-toggle-bar {
  background-color: #ffb800;
}

.menu-toggle-bar.menu-toggle-bar--top {
  transform: translate(0, -11px);
}

.menu-toggle-bar.menu-toggle-bar--bottom {
  transform: translate(0, 11px);
}

.nav-open .menu-toggle-bar.menu-toggle-bar--top {
  transform: translate(0, 0) rotate(45deg);
}

.nav-open .menu-toggle-bar.menu-toggle-bar--middle {
  opacity: 0;
}

.nav-open .menu-toggle-bar.menu-toggle-bar--bottom {
  transform: translate(0, 0) rotate(-45deg);
}
/**/

nav {
  position: relative;
  z-index: 100005;
}

@media(max-width: 991px) {
  nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
}

.sidenav {
  position: absolute;
  z-index: 100000;
  min-height: 100vh;
  width: 100%;
  opacity: 0;
  top: -200%;
  left: auto;
  right: 0;
  background: rgba(0,0,0,0.8);
  overflow-x: hidden;
  transition: 0.3s;
  padding: 135px 0 30px 0;
}

@media (max-width: 767px) {
  .sidenav {
    padding-top: 120px;
  }
}

.nav-open .sidenav {
  top: 0;
  opacity: 1;
  transition: 0.3s;
}

@media(min-width: 992px) {
  .nav-open .sidenav {
    top: -200%;
    opacity: 0;
  }
}

.sidenav a {
  display: block;
  font-size: 21px;
  line-height: 1.1;
  color: #fff;
  padding: 15px 0 15px 0;
}

@media (max-width: 767px) {
  .sidenav a {
      font-size: 20px;
  }
}

.sidenav a:hover {
  color: #ffb800;
}

.sidenav ul {
  width: 100%;
  max-width: 760px;
  padding: 0 15px;
  margin: 0 auto;
}

@media (max-width: 767px) {
  .sidenav ul {
      max-width: 510px;
  }
}

.sidenav li {
  width: 100%;
  border-top: 1px solid rgba(255,255,255,0.3);
  text-align: left;
}

.sidenav li:last-child {
  border-bottom: 1px solid rgba(255,255,255,0.3);
}

.sidenav .closebtn {
  display: block;
  font-size: 30px;
  line-height: 1;
  font-weight: bold;
  text-align: center;
  margin-top: 33px;
}

.sidenav .closebtn:hover {
  color: #128bc3;
}

.menu-burger {
  display: none;
}

.menu-burger svg {
  width: 40px;
  height: 40px;
}

.menu-burger svg:hover {
  fill: #128bc3;
}

.green {
  background: linear-gradient(45deg, #00ce9a, #00ce58);
  background-color: #00ce8d;
}

.violet-blue {
  background: linear-gradient(50deg, #570ba1, #0094be);
  background-color: #570ba1;
}

/*header-content*/
.header-content {
  padding: 50px 0 400px 0;
}

.header-content .btn {
  width: 100%;
}

@media(max-width: 1260px) {
  .header-content {
      padding: 40px 0 300px 0;
  }
}

@media(max-width: 991px) {
  .header-content {
    padding: 40px 0 170px 0;
  }
  .header-content .btn-name {
    min-width: 60%;
    text-align: center;
    padding-left: 0;
    padding-right: 15px;
  }
}

@media(max-width: 767px) {
  .header-content {
    padding: 40px 0 55px 0;
  }
}

@media(max-width: 410px) {
  .header-content {
    padding-bottom: 0;
  }
}

.zind-top {
  position: relative;
  z-index: 3500;
}

.text-block {
  width: 100%;
  position: relative;
}

.maxw {
  max-width: 650px;
}

.maxw1 {
  max-width: 540px;
}

.maxw2 {
  max-width: 460px;
}

.header-content h2 {
  text-align: left;
}

@media(max-width: 991px) {
  .text-block {
      max-width: 100%;
  }
  .header-content.text-block {
      max-width: 460px;
  }
}

@media(max-width: 767px) {
  .header-content.text-block {
    max-width: 330px;
  }
}

@media(max-width: 410px) {
  .header-content.text-block {
    max-width: 100%;
  }
}

.abs {
  max-width: none;
  max-height: 100%;
  position: absolute;
  bottom: 0;
}

@media(max-width: 991px) {
  section .abs {
      max-height: 500px;
      position: relative;
      right: auto !important;
      left: 50% !important;
      transform: translateX(-50%);
  }
}

@media(max-width: 410px) {
  header .abs {
    max-height: 300px;
    position: relative;
    right: auto !important;
    left: 50% !important;
    transform: translateX(-50%);
    margin-top: 20px;
  }
}

@media(max-width: 767px) {
  .abs {
      max-height: 360px;
  }
}

header {
  overflow: hidden;
}

.circle {
  max-width: 1200px;
  position: absolute;
  top: 5%;
  left: 75%;
  /*animation: rotate 4s linear infinite;*/
}
/*
@keyframes rotate{
  from { transform: rotate(-360deg); }
  to { transform: rotate(360deg); }
}
*/
@media(max-width: 1260px) {
  .circle {
    max-width: 950px;
    left: 68%;
  }
}

@media(max-width: 991px) {
  .circle {
    max-width: 950px;
    left: 86%;
  }
}

@media(max-width: 767px) {
  .circle {
    display: none;
  }
}

.header-images img {
  position: absolute;
  transform: 0;
  transition: .5s;
}


.left, .right2 {
  position: relative;
  opacity: 0;
  transition: .3s;
}

.left {
  left: -200px;
}

.left.show, .right2.show {
  opacity: 1;
  transition: .3s;
}

.left.show {
  left: 0;
}

.right2 {
  right: -200px;
}

.right2.show {
  right: 0;
}

.bottom {
  position: relative;
  opacity: 0;
  bottom: -30px;
  transition: .4s;
}

.bottom.show {
  bottom: 0;
  opacity: 1;
  transition: .4s;
}

.opacity {
  opacity: 0;
  transition: .2s;
}

.opacity.show {
  opacity: 1;
  transition: .2s;
}

.opacity2 {
  opacity: 0;
  transition: .5s;
}

.opacity2.show {
  opacity: 1;
  transition: .5s;
}

.show .item3-cont {
  position: relative;
  opacity: 0;
  bottom: -40px;
  animation: solutions .2s linear;
  animation-fill-mode: forwards;
}

.show .item3-cont.solution2 {
  animation-delay: .2s;
}

.show .item3-cont.solution3 {
  animation-delay: .4s;
}

.show .item3-cont.solution4 {
  animation-delay: .6s;
}

.show .item3-cont.solution5 {
  animation-delay: .8s;
}

.show .item3-cont.solution6 {
  animation-delay: 1s;
}

.show .item3-cont.solution7 {
  animation-delay: 1.2s;
}

.show .item3-cont.solution8 {
  animation-delay: 1.4s;
}

.show .item3-cont.solution9 {
  animation-delay: 1.6s;
}

.show .item3-cont.solution10 {
  animation-delay: 1.8s;
}

.show .item3-cont.solution11 {
  animation-delay: 2s;
}

.show .item3-cont.solution12 {
  animation-delay: 2.2s;
}

@keyframes solutions {
  0% {
    opacity: 0;
    bottom: 40px;
  }
  100% { 
    opacity: 1;
    bottom: 0;
  }
}

.header-images {
  position: absolute;
  height: 100%;
  top: 0;
  left: 39%;
  width: 1600px;
}

@media(max-width: 1260px) {
  .header-images {
    width: 1100px;
    left: 36%;
  }
}

@media(max-width: 991px) {
  .header-images {
    left: 65%;
  }
}

@media(max-width: 767px) {
  .header-images {
    left: 3%;
    opacity: 0.3;
  }
}

@media (max-width: 410px) {
  .header-images {
    height: 320px;
    width: 650px;
    opacity: 1;
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    margin-top: 15px;
  }
}

.header-images .image1 {
  z-index: 300;
  height: 70%;
  bottom: -17%;
  left: 0;
}

.header-images .image2 {
  z-index: 500;
  height: 116%;
  left: 23%;
  bottom: -61%;
}

.header-images .image3 {
  z-index: 300;
  height: 108%;
  left: 30%;
  bottom: -12%;
}

.header-images .image4 {
  z-index: 500;
  height: 95%;
  left: 57%;
  bottom: -12%;
}


/*
.head-img {
  left: 28%;
}

@media(max-width: 991px) {
  .head-img {
    left: 57%;
  }
}

@media(max-width: 767px) {
  .head-img {
    min-height: 100%;
    left: 3%;
    opacity: 0.3;
  }
}

@media(max-width: 410px) {
  .head-img {
    opacity: 1;
  }
}*/







