/* Start:/local/templates/auto/css/base.css?167420880610443*/
a,
input {
  color: inherit
}
.circle-text,
.input-wrap,
html,
sup {
  position: relative
}
.circle-text,
.h1,
.h6,
h1,
h6 {
  text-transform: uppercase
}
a,
abbr,
acronym,
address,
applet,
article,
aside,
audio,
b,
big,
blockquote,
body,
canvas,
caption,
center,
cite,
code,
dd,
del,
details,
dfn,
div,
dl,
dt,
em,
embed,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
html,
i,
iframe,
img,
ins,
kbd,
label,
legend,
li,
mark,
menu,
nav,
object,
ol,
output,
p,
pre,
q,
ruby,
s,
samp,
section,
small,
span,
strike,
strong,
sub,
summary,
sup,
table,
tbody,
td,
tfoot,
th,
thead,
time,
tr,
tt,
u,
ul,
var,
video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block
}
table {
  border-collapse: collapse;
  border-spacing: 0
}
*,
:after,
:before {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden
}
:focus,
:hover {
  outline: 0
}
ol,
summary,
ul {
  list-style: none
}
blockquote,
q {
  quotes: none
}
blockquote:after,
blockquote:before,
q:after,
q:before {
  content: '';
  content: none
}
sup {
  top: -.6em;
  font-size: .5em;
  font-weight: inherit
}
b {
  font-weight: 700
}
button {
  cursor: pointer
}
a,
button,
input,
option,
select,
textarea {
  border: none;
  outline: 0;
  font: inherit;
  background: 0 0;
  color: inherit
}
body,
textarea {
  line-height: 1.2
}
.h1,
.h3,
.h4,
.h5,
h1,
h3,
h4,
h5 {
  font-weight: 700
}
input[type=checkbox],
input[type=file],
input[type=radio] {
  width: 1px!important;
  height: 1px!important;
  opacity: 0;
  position: absolute;
  top: 0;
  left: 0;
  border: none!important;
  padding: 0!important
}
input {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none
}
input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  margin: 0
}
input[type=number],
input[type=search] {
  -moz-appearance: textfield
}
input[type=date]::-webkit-calendar-picker-indicator,
input[type=date]::-webkit-inner-spin-button {
  display: none;
  -webkit-appearance: none
}
textarea {
  resize: none
}
::-webkit-input-placeholder {
  font-family: var(--placeholder-font);
  font-size: var(--placeholder-font-size);
  color: var(--placeholder-color);
  -webkit-transition: .2s;
  transition: .2s
}
::-moz-placeholder {
  font-family: var(--placeholder-font);
  font-size: var(--placeholder-font-size);
  color: var(--placeholder-color);
  -moz-transition: .2s;
  transition: .2s
}
:-ms-input-placeholder {
  font-family: var(--placeholder-font);
  font-size: var(--placeholder-font-size);
  color: var(--placeholder-color);
  -ms-transition: .2s;
  transition: .2s
}
:-moz-placeholder {
  font-family: var(--placeholder-font);
  font-size: var(--placeholder-font-size);
  color: var(--placeholder-color);
  -moz-transition: .2s;
  transition: .2s
}
.clear {
  clear: both
}
html {
  min-height: 100%;
  scroll-behavior: smooth;
  scroll-behavior: smooth
}
:not(input) {
  -moz-user-select: none;
  -webkit-user-select: none;
  -webkit-touch-callout: none;
  -ms-user-select: none;
  -o-user-select: none;
  user-select: none;
  -khtml-user-select: none
}
body {
  background: #1b1b1b;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  min-height: 100vh;
  font-family: 'Verano Sans',Arial,sans-serif;
  color: #fff;
  overflow-x: hidden;
  font-size: 14px
}
.input-wrap span,
img {
  display: inline-block
}
body.fixed {
  overflow: hidden;
  height: auto
}
body footer,
body header {
  -ms-flex-negative: 0;
  flex-shrink: 0
}
body main {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto;
  background: -o-linear-gradient(1.29deg,#74171a -39.42%,#292c37 68.38%,#495e6e 149.45%);
  background: linear-gradient(88.71deg,#74171a -39.42%,#292c37 68.38%,#495e6e 149.45%)
}
@font-face {
  font-family: 'Verano Sans';
  src: url(/local/templates/auto/css/../fonts/VeranoSans-Bold.woff2) format('woff2'),url(/local/templates/auto/css/../fonts/VeranoSans-Bold.woff) format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap
}
@font-face {
  font-family: 'Verano Sans';
  src: url(/local/templates/auto/css/../fonts/VeranoSans.woff2) format('woff2'),url(/local/templates/auto/css/../fonts/VeranoSans.woff) format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap
}
@font-face {
  font-family: 'Verano Sans';
  src: url(/local/templates/auto/css/../fonts/VeranoSans-Black.woff2) format('woff2'),url(/local/templates/auto/css/../fonts/VeranoSans-Black.woff) format('woff');
  font-weight: 900;
  font-style: normal;
  font-display: swap
}
@font-face {
  font-family: 'Verano Sans';
  src: url(/local/templates/auto/css/../fonts/VeranoSans-ExtraLight.woff2) format('woff2'),url(/local/templates/auto/css/../fonts/VeranoSans-ExtraLight.woff) format('woff');
  font-weight: 200;
  font-style: normal;
  font-display: swap
}
@font-face {
  font-family: 'Verano Sans';
  src: url(/local/templates/auto/css/../fonts/VeranoSans-Light.woff2) format('woff2'),url(/local/templates/auto/css/../fonts/VeranoSans-Light.woff) format('woff');
  font-weight: 300;
  font-style: normal;
  font-display: swap
}
@font-face {
  font-family: 'Proxima Nova';
  src: url(/local/templates/auto/css/../fonts/ProximaNova-Regular.woff2) format('woff2'),url(/local/templates/auto/css/../fonts/ProximaNova-Regular.woff) format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap
}
@font-face {
  font-family: 'Proxima Nova';
  src: url(/local/templates/auto/css/../fonts/ProximaNova-Bold.woff2) format('woff2'),url(/local/templates/auto/css/../fonts/ProximaNova-Bold.woff) format('woff');
  font-weight: 700;
  font-style: normal;
  font-display: swap
}
:root {
  --c-prmr-red: #c4383f;
  --c-ligth-red: #e35863;
  --placeholder-color: #fff
}
@media screen and (min-width:769px) and (max-width:1024px) {
  :root {
    --container-indent: 30px
  }
}
@media screen and (min-width:1025px) and (max-width:1439px) {
  :root {
    --container-indent: 50px
  }
}
@media screen and (min-width:1440px) {
  :root {
    --container-indent: 80px
  }
}
::-webkit-scrollbar {
  display: none
}
main {
  padding: 130px 0
}
@media screen and (min-width:1025px) {
  body {
    padding-left: 252px
  }
  main {
    padding: 117px 0 232px
  }
}
.container {
  max-width: 1438px;
  margin: 0 auto;
  padding: 0 10px
}
h1,
h2,
h3,
h4,
h5 {
  font-family: 'Proxima Nova',Arial,sans-serif
}
.h1,
h1 {
  font-size: 28px;
  line-height: 1
}
@media screen and (min-width:769px) {
  body main {
    background: -webkit-gradient(linear,left top,right top,from(#74171a),color-stop(50%,#292c37),to(#495e6e));
    background: -o-linear-gradient(left,#74171a 0,#292c37 50%,#495e6e 100%);
    background: linear-gradient(90deg,#74171a 0,#292c37 50%,#495e6e 100%)
  }
  .container {
    padding: 0 30px
  }
  .h1,
  h1 {
    font-size: 48px
  }
}
@media screen and (min-width:1441px) {
  .h1,
  h1 {
    font-size: 74px
  }
}
.h1 + .text,
h1 + .text {
  margin-top: 25px
}
.h1.txt-an-6,
h1.txt-an-6 {
  padding: 0
}
.h1.txt-an-6 span,
h1.txt-an-6 span {
  display: inline-block!important
}
.h1.txt-an-6 span:before,
h1.txt-an-6 span:before {
  content: var(--before-text)
}
.h1.txt-an-6 span:after,
h1.txt-an-6 span:after {
  content: var(--after-text)
}
@supports (-webkit-text-stroke:1px #fff) {
  .h1 span.transparent,
  .h1.txt-an-6 span:after,
  .h1.txt-an-6 span:before,
  h1 span.transparent,
  h1.txt-an-6 span:after,
  h1.txt-an-6 span:before {
    -webkit-text-stroke: 1px #fff;
    color: transparent
  }
}
h2 {
  font-size: 48px
}
.h3,
h3 {
  font-size: 36px
}
@media screen and (max-width:768px) {
  :root {
    --container-indent: 10px
  }
  h2 {
    font-size: 26px
  }
  .h3,
  h3 {
    font-size: 30px
  }
}
.h4,
h4 {
  font-size: 24px
}
.h5,
h5 {
  font-size: 18px
}
.h6,
h6 {
  font-weight: 400;
  font-size: 12px;
  letter-spacing: .1em
}
.text {
  line-height: 1.2
}
@media screen and (min-width:1024px) {
  .text {
    font-size: 18px
  }
}
a {
  text-decoration: none;
  -webkit-transition: .3s;
  -o-transition: .3s;
  transition: .3s
}
.img-box {
  font-size: 0
}
img {
  max-width: 100%;
  max-height: 100%;
  height: auto;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center;
  object-position: center
}
form {
  font-size: 16px
}
.input-wrap span {
  font-size: 16px;
  padding-bottom: 10px
}
.btn,
.input-wrap input {
  display: -webkit-box;
  display: -ms-flexbox
}
.input-wrap input {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 52px;
  padding: 0 15px;
  border: 1px solid #fff
}
.input-wrap input[type=password] {
  padding-right: 80px
}
.input-wrap input.validated {
  background: url(/local/templates/auto/css/../img/svg/noun-check.svg) right 20px center/20px no-repeat
}
.input-wrap .show-password {
  width: 20px;
  height: 20px;
  position: absolute;
  right: 50px;
  bottom: 16px;
  cursor: pointer;
  background: url(/local/templates/auto/css/../img/svg/eye.svg) center/cover no-repeat
}
.input-wrap .show-password.pushed {
  background-image: url(/local/templates/auto/css/../img/svg/eye-closed.svg)
}
.input-wrap.error .show-password {
  bottom: 40px
}
.input-wrap.error:after {
  content: 'Поле заполнено неверно';
  display: block;
  margin-top: 10px;
  color: var(--c-prmr-red);
  font-size: 14px;
  line-height: 1
}
.btn {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  height: 75px;
  -webkit-transition: .3s ease-in;
  -o-transition: .3s ease-in;
  transition: .3s ease-in
}
.btn-red {
  background-color: var(--c-prmr-red);
  color: #fff
}
.btn-red:hover {
  background-color: var(--c-ligth-red)
}
.circle-text {
  width: 170px;
  height: 170px;
  font-size: 14px;
  letter-spacing: .2em;
  -webkit-animation: 20s linear infinite rotate;
  animation: 20s linear infinite rotate
}
.circle-text span {
  position: absolute;
  left: 50%;
  -webkit-transform-origin: 0 85px;
  -ms-transform-origin: 0 85px;
  transform-origin: 0 85px
}
@-webkit-keyframes rotate {
  to {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
  from {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}
@keyframes rotate {
  to {
    -webkit-transform: rotate(0);
    transform: rotate(0)
  }
  from {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg)
  }
}
/* End */


/* Start:/local/templates/auto/css/styles.css?167420880623820*/
header .avatar,
header .notifications {
  position: relative;
  -webkit-transition: .3s ease-in;
  -o-transition: .3s ease-in
}
.index ul,
.nav ul {
  font-family: 'Proxima Nova'
}
.nav svg path,
header .notifications svg path {
  fill: currentColor
}
.directory-item,
.index ul li,
footer p {
  text-align: center
}
.modal-window,
.modal-window-close,
.modal-window-wrap {
  opacity: 0;
  visibility: hidden
}
.modal-window-wrap.show,
.modal-window.show,
.modal-window.show .modal-window-close {
  opacity: 1;
  visibility: visible
}
.go-back svg path,
.nav svg path {
  stroke: currentColor
}
header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: end;
  -ms-flex-pack: end;
  justify-content: flex-end;
  gap: 15px;
  position: absolute;
  z-index: 9
}
header .notifications {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  margin-right: 15px;
  cursor: pointer;
  transition: .3s ease-in;
  color: #fff
}
header .avatar,
header .notifications .counter {
  -webkit-box-align: center;
  border-radius: 50%;
  display: -webkit-box;
  display: -ms-flexbox
}
header .notifications .counter {
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: absolute;
  top: 0;
  right: 0;
  background-color: #000;
  font-family: 'Proxima Nova';
  font-weight: 700
}
header .avatar {
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  padding: 0;
  width: 33px;
  height: 33px;
  transition: .3s ease-in;
  background-color: rgba(255,255,255,.3)
}
.directory-item button:after,
header .avatar:after {
  -webkit-transition: .3s ease-in;
  -o-transition: .3s ease-in;
  content: ''
}
header .avatar img {
  border-radius: 50%;
  overflow: hidden
}
header .avatar:after {
  position: absolute;
  inset: 0;
  z-index: 2;
  border: 4px solid rgba(255,255,255,.1);
  border-radius: 50%;
  transition: .3s ease-in
}
header .avatar:hover:after {
  border-color: rgba(255,255,255,.7)
}
.nav,
.right-side-popup .layout {
  -webkit-transition: .3s ease-in-out;
  -o-transition: .3s ease-in-out
}
.nav {
  position: fixed;
  padding: 40px 15px;
  background: #1b1b1b;
  transition: .3s ease-in-out
}
@media screen and (max-width:1025px) {
  header {
    inset: 20px 10px auto
  }
  .nav {
    width: 100vw;
    height: calc(100vh - 125px);
    inset: 125px auto 0 101vw;
    z-index: 10
  }
  .nav.is-visible {
    left: 0
  }
}
.nav h4 {
  margin-bottom: 10px
}
.nav .pa-link {
  color: #6e7a8f
}
.nav .pa-link:hover,
.nav li a.active,
.nav li a:active,
.nav li a:focus,
.nav li a:hover {
  color: #fff
}
.directory-item .text:hover,
.directory-item button:hover,
.go-back:hover,
.nav li a,
.news .swiper-nav button:hover,
.videos-list li:hover h5 {
  color: #c3ccdd
}
.nav h5 {
  padding: 30px 14px 14px;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .03em;
  text-transform: uppercase
}
.nav li a {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 100%;
  height: 51px;
  padding: 0 14px;
  background-color: transparent
}
.nav li a.active {
  background-color: #222b31
}
.nav svg {
  display: inline-block;
  margin-right: 12px
}
.index h1 {
  max-width: 997px
}
.index-text {
  margin-top: 30px
}
@media screen and (min-width:769px) {
  footer,
  main {
    font-size: 18px
  }
  header p {
    display: none
  }
  header .notifications {
    width: 35px;
    height: 35px;
    margin-right: 20px
  }
  header .notifications .counter {
    width: 20px;
    height: 20px;
    font-size: 10px
  }
  header .avatar {
    width: 39px;
    height: 39px
  }
  .index-text {
    margin-top: 50px;
    max-width: 533px
  }
  .glitch-wrap:hover {
    -webkit-transform: scale(.95);
    -ms-transform: scale(.95);
    transform: scale(.95)
  }
  .glitch-wrap:hover .glitch__layer {
    -webkit-transform: scale(1.2);
    -ms-transform: scale(1.2);
    transform: scale(1.2)
  }
}
.index-text h3,
.news .swiper-nav {
  margin-bottom: 30px
}
.index ul {
  display: -ms-grid;
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(190px,190px));
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  gap: 40px;
  margin-top: 50px
}
@media screen and (min-width:1025px) {
  header {
    top: 35px;
    right: 15px
  }
  .nav {
    width: 252px;
    inset: 0 auto 0 0
  }
  .index-text {
    margin-top: 80px
  }
  .index-text h3 {
    margin-bottom: 50px
  }
  .index ul {
    grid-template-columns: repeat(auto-fill,minmax(251px,1fr))
  }
}
.directory ul,
.docs ul {
  gap: 40px;
  display: -ms-grid
}
.index ul li {
  font-weight: 600
}
@media screen and (min-width:1440px) {
  .index ul {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-grid-columns: 251px 8.802083333333334vw 393px 8.802083333333334vw 251px;
    grid-template-columns: 251px 393px 251px;
    gap: 8.802083333333334vw;
    margin-top: 112px
  }
  .index ul li {
    border-radius: 100vmax
  }
  .index ul li:nth-child(2),
  .index ul li:nth-child(6) {
    -ms-grid-column: 2;
    grid-column-start: 2;
    -ms-grid-row-span: 2;
    grid-row-end: span 2
  }
  .index ul li:nth-child(2) .img-box,
  .index ul li:nth-child(6) .img-box {
    width: 393px;
    height: 393px
  }
  .index ul li:nth-child(4) {
    -webkit-transform: translateX(140px);
    -ms-transform: translateX(140px);
    transform: translateX(140px)
  }
  .index ul li:nth-child(5) {
    -webkit-transform: translateX(-140px);
    -ms-transform: translateX(-140px);
    transform: translateX(-140px)
  }
}
.index ul .img-box {
  display: block;
  width: 190px;
  height: 190px;
  position: relative;
  border-radius: 50%;
  overflow: hidden;
  margin-bottom: 20px;
  -webkit-transition: .3s;
  -o-transition: .3s;
  transition: .3s
}
.glitch__layer,
.news .swiper-nav button {
  -webkit-transition: .3s;
  -o-transition: .3s
}
.index ul .img-box img,
.news-preview img,
.videos-list .video-box .preview img {
  width: 100%;
  height: 100%
}
.index ul .img-box canvas {
  position: absolute;
  inset: 0;
  z-index: 1
}
.index .container {
  position: relative
}
.index .circle-text {
  position: absolute;
  top: 274px;
  right: 30px
}
@media screen and (max-width:1024px) {
  header .burger {
    width: 34px;
    height: 34px;
    position: relative
  }
  header .burger .line {
    height: 2px;
    position: absolute;
    inset: 4px;
    margin: auto 0;
    background-color: #fff;
    border-radius: 50vmax;
    -webkit-transition: .3s ease-in;
    -o-transition: .3s ease-in;
    transition: .3s ease-in
  }
  header .burger .line:nth-child(1) {
    -webkit-transform: translateY(-8px);
    -ms-transform: translateY(-8px);
    transform: translateY(-8px)
  }
  header .burger .line:nth-child(2) {
    max-width: 18px
  }
  header .burger .line:nth-child(3) {
    max-width: 9px;
    -webkit-transform: translateY(8px);
    -ms-transform: translateY(8px);
    transform: translateY(8px)
  }
  header .burger.is-open .line:nth-child(1) {
    -webkit-transform: translateY(0) rotate(45deg);
    -ms-transform: translateY(0) rotate(45deg);
    transform: translateY(0) rotate(45deg)
  }
  header .burger.is-open .line:nth-child(2) {
    opacity: 0
  }
  header .burger.is-open .line:nth-child(3) {
    max-width: 26px;
    -webkit-transform: translateY(0) rotate(-45deg);
    -ms-transform: translateY(0) rotate(-45deg);
    transform: translateY(0) rotate(-45deg)
  }
  .index .circle-text {
    display: none
  }
}
.glitch__layers {
  display: inline-block;
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0
}
.glitch__layer {
  display: inline-block;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background-repeat: no-repeat;
  background-position: center;
  transition: .3s
}
.directory ul {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(188px,188px));
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  margin-top: 50px
}
.directory-item button {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 188px;
  height: 188px;
  position: relative;
  margin-bottom: 20px;
  border-radius: 50%
}
.directory-item button:after {
  position: absolute;
  inset: 0;
  border: 1px solid;
  border-radius: 50%;
  -webkit-clip-path: polygon(0 0,0 100%,100% 100%,100% 0);
  clip-path: polygon(0 0,0 100%,100% 100%,100% 0);
  -webkit-transform: rotate(40deg);
  -ms-transform: rotate(40deg);
  transform: rotate(40deg);
  transition: .3s ease-in
}
.directory-item button:hover:after {
  -webkit-clip-path: polygon(0 3%,0 100%,100% 100%,100% 2%);
  clip-path: polygon(0 3%,0 100%,100% 100%,100% 2%)
}
.docs h1,
.resources h1 {
  margin-bottom: 25px
}
.docs-inner {
  display: -ms-grid;
  display: grid;
  gap: 70px
}
@media screen and (min-width:1024px) {
  header .burger {
    display: none
  }
  .docs-inner {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: start;
    -ms-grid-columns: (1fr)[2];
    grid-template-columns: repeat(2,1fr);
    margin-top: 70px
  }
}
.news-list,
.videos-list {
  grid-template-columns: repeat(auto-fill,minmax(300px,1fr))
}
.docs h3 {
  margin-bottom: 35px
}
.docs p {
  font-size: 20px;
  margin-bottom: 15px
}
.docs ul {
  display: grid
}
.docs .downloads {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  gap: 10px;
  margin-bottom: 10px
}
@media screen and (min-width:768px) {
  .docs .downloads {
    margin-right: 25px
  }
}
.docs .downloads:before {
  content: '';
  display: inline-block;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  background: url(/local/templates/auto/css/../img/svg/download.svg) center/cover no-repeat
}
.docs .downloads:before + a {
  margin-left: 0
}
.docs .downloads a {
  padding-bottom: 1px;
  border-bottom: 1px solid
}
.docs .downloads a:hover {
  border-bottom-color: transparent
}
.resources ul {
  display: -ms-grid;
  display: grid;
  gap: 25px;
  margin-top: 66px
}
.resources .img-box,
.resources li {
  display: -webkit-box;
  display: -ms-flexbox
}
.resources li {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  gap: 25px 15px
}
.resources li:not(:last-child) {
  padding-bottom: 25px;
  border-bottom: 1px solid #fff
}
.resources .img-box {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 73px;
  height: 73px;
  border: 3px solid var(--c-prmr-red);
  border-radius: 50%;
  background-color: #fff;
  overflow: hidden
}
.video .sorting,
.videos-list .duration {
  display: -webkit-box;
  display: -ms-flexbox
}
.resources .text {
  -webkit-box-flex: 1;
  -ms-flex: 1 1 auto;
  flex: 1 1 auto
}
.resources .btn,
.resources .img-box {
  -ms-flex-negative: 0;
  flex-shrink: 0
}
.resources .btn {
  width: 300px;
  height: 61px
}
@media screen and (max-width:768px) {
  .text br {
    display: none
  }
  .directory {
    overflow: hidden
  }
  .docs .downloads,
  .resources .btn {
    width: 100%
  }
  .resources ul {
    grid-template-columns: repeat(auto-fit,minmax(300px,1fr))
  }
  .resources li {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: auto 1fr;
    grid-template-columns: auto 1fr
  }
  .resources li .btn {
    -ms-grid-column-span: 2;
    grid-column-end: span 2
  }
}
.video-inner {
  position: relative;
  margin-top: 50px
}
.video .sorting {
  display: flex;
  gap: 30px;
  margin-bottom: 33px
}
.video .sorting label,
.videos-list li {
  cursor: pointer
}
@media screen and (min-width:1280px) {
  .docs-item {
    gap: 0
  }
  .video h1 + .text {
    max-width: 600px
  }
  .video .sorting {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(100% + 37px);
    text-align: right;
    padding-left: 600px
  }
}
.video .sorting span {
  padding-bottom: 1px;
  border-bottom: 1px dashed transparent;
  -webkit-transition: .3s ease-in;
  -o-transition: .3s ease-in;
  transition: .3s ease-in
}
.video .sorting input:checked + span {
  border-bottom-color: currentColor
}
.videos-list {
  display: -ms-grid;
  display: grid;
  grid-gap: 30px
}
.videos-list .video-box {
  width: 100%;
  position: relative;
  padding-top: 56.25%;
  margin-bottom: 20px
}
.modal-window-content iframe,
.modal-window-content video,
.videos-list .video-box .preview {
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0
}
.videos-list .video-box .preview:after,
.videos-list .video-box .preview:before {
  content: '';
  position: absolute;
  inset: 0;
  -webkit-transition: .3s ease-in;
  -o-transition: .3s ease-in;
  transition: .3s ease-in
}
.videos-list .video-box .preview:before {
  background: -webkit-gradient(linear,left bottom,left top,from(rgba(71,90,106,.4)),to(rgba(71,90,106,.4)));
  background: -o-linear-gradient(bottom,rgba(71,90,106,.4),rgba(71,90,106,.4));
  background: linear-gradient(0deg,rgba(71,90,106,.4),rgba(71,90,106,.4))
}
.videos-list .video-box .preview:after {
  width: 45px;
  height: 45px;
  border-radius: 50%;
  background: url(/local/templates/auto/css/../img/svg/play.svg) center/18px auto no-repeat rgba(196,56,63,.85);
  margin: auto
}
.videos-list .video-box iframe {
  display: none
}
.videos-list h5 {
  -webkit-transition: .3s ease-in;
  -o-transition: .3s ease-in;
  transition: .3s ease-in
}
.videos-list .duration {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  margin-top: 10px
}
.modal-window-wrap,
.news .ticker {
  display: -webkit-box;
  display: -ms-flexbox
}
.news .swiper,
.news-inner {
  margin-top: 50px
}
.videos-list .duration:before {
  content: '';
  -ms-flex-negative: 0;
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  background: url(/local/templates/auto/css/../img/svg/clock.svg) center/cover no-repeat
}
.videos-list li:hover .preview:before {
  opacity: 0
}
.videos-list li:hover .preview:after {
  background-color: #c4383f
}
.news {
  overflow: hidden
}
.news-list {
  display: -ms-grid;
  display: grid;
  grid-gap: 70px 30px
}
.news-list li:nth-child(4n+4) {
  grid-column: 1/-1
}
.news-preview {
  display: -ms-grid;
  display: grid;
  gap: 30px
}
.news-preview .h5:hover {
  color: #d9d9d9
}
.news .ticker {
  display: flex;
  gap: 30px;
  -webkit-animation: 30s linear infinite ticker;
  animation: 30s linear infinite ticker
}
@supports (-webkit-text-stroke:1px var(--c-prmr-red)) {
  .news .ticker span {
    -webkit-text-stroke: 1px var(--c-prmr-red);
    color: transparent
  }
}
.news-text {
  font-size: 18px;
  max-width: 956px;
  font-weight: 300;
  line-height: 1.5
}
.news-text p:not(:first-child),
.news-text ul:not(:first-child) {
  padding-top: 30px
}
.news-text hr:not(:first-child),
.news-text img:not(:first-child) {
  margin-top: 30px;
  padding: 0!important
}
.news-text > img {
  max-width: 100%;
  height: auto;
  margin-bottom: 20px
}
.news-text .h2:not(:first-child),
.news-text .h3:not(:first-child),
.news-text .h4:not(:first-child),
.news-text .h5:not(:first-child),
.news-text h2:not(:first-child),
.news-text h3:not(:first-child),
.news-text h4:not(:first-child),
.news-text h5:not(:first-child) {
  margin-top: 20px
}
.news-text p img {
  margin: 0!important
}
.news-text ul {
  display: -ms-grid;
  display: grid;
  grid-gap: 15px
}
.news-text li {
  position: relative;
  padding-left: 15px
}
.news-text li:before {
  content: '-';
  position: absolute;
  top: 0;
  left: 0;
  vertical-align: middle
}
.news-text b {
  font-weight: 900
}
.news .swiper {
  margin-right: -20vw
}
.news .swiper-nav button {
  width: 60px;
  height: 60px;
  transition: .3s
}
.news .swiper-nav button svg {
  display: inline-block;
  width: 100%;
  height: 100%
}
.news .swiper-nav button svg path {
  stroke: currentColor;
  fill: currentColor
}
.news .swiper-slide {
  width: 222px;
  padding-right: 10px
}
footer {
  position: absolute;
  inset: auto 0 0 0
}
footer p {
  padding: 30px 0;
  border-top: 1px solid
}
@media screen and (min-width:1025px) {
  .index ul .img-box {
    width: 251px;
    height: 251px;
    margin-left: auto;
    margin-right: auto
  }
  .resources li {
    gap: 25px 15px
  }
  .video-inner {
    margin-top: 70px;
    max-width: 1238px
  }
  .videos-list {
    gap: 71px 31px
  }
  .videos-list .video-box .preview:after {
    width: 60px;
    height: 60px
  }
  .news .swiper,
  .news-inner {
    margin-top: 70px
  }
  .news-list {
    max-width: 1238px
  }
  .news-text > img {
    margin-bottom: 40px
  }
  .news-text .h2:not(:first-child),
  .news-text .h3:not(:first-child),
  .news-text .h4:not(:first-child),
  .news-text .h5:not(:first-child),
  .news-text h2:not(:first-child),
  .news-text h3:not(:first-child),
  .news-text h4:not(:first-child),
  .news-text h5:not(:first-child) {
    margin-top: 40px
  }
  .news .swiper-nav {
    margin-bottom: 50px
  }
  .news .swiper-nav button {
    width: 90px;
    height: 90px
  }
  .news .swiper-slide {
    width: 422px;
    padding-right: 30px
  }
  footer {
    left: 252px
  }
}
.modal-window {
  width: 80vw;
  max-width: 700px;
  position: relative;
  -webkit-transform: scaleY(0);
  -ms-transform: scaleY(0);
  transform: scaleY(0);
  -webkit-transform-origin: top center;
  -ms-transform-origin: top center;
  transform-origin: top center;
  -webkit-transition: .3s;
  -o-transition: .3s;
  transition: .3s;
  -ms-flex-negative: 0;
  flex-shrink: 0
}
.modal-window-wrap {
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  width: 100vw;
  height: 100vh;
  max-height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 0;
  -webkit-transition: .5s;
  -o-transition: .5s;
  transition: .5s
}
.modal-window-wrap.show {
  z-index: 55
}
.modal-window-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 0;
  background: rgba(0,0,0,.8)
}
.modal-window-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  margin-bottom: 25px
}
.modal-window.show {
  -webkit-transform: none;
  -ms-transform: none;
  transform: none
}
.modal-window-content {
  width: 100%;
  position: relative;
  padding-top: 56.25%
}
.modal-window-close {
  width: 40px;
  height: 40px;
  margin-left: auto;
  position: relative;
  -webkit-transition: opacity .3s linear .5s,-webkit-transform .3s;
  transition: opacity .3s linear .5s,transform .3s,-webkit-transform .3s;
  -o-transition: opacity .3s linear .5s,transform .3s;
  cursor: pointer;
  background-color: var(--c-prmr-red);
  color: #fff;
  border: 1px solid;
  border-radius: 50%
}
.modal-window-close:after,
.modal-window-close:before {
  content: '';
  display: block;
  width: 22px;
  height: 2px;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  border-radius: 1px;
  background-color: #fff
}
.modal-window-close:before {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg)
}
.modal-window-close:after {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg)
}
.modal-window-close:hover {
  -webkit-transform: scale(1.2);
  -ms-transform: scale(1.2);
  transform: scale(1.2)
}
.right-side-popup {
  position: fixed;
  inset: 0;
  visibility: hidden;
  z-index: -1
}
.right-side-popup .layout {
  background-color: rgba(34,43,49,0);
  position: absolute;
  inset: 0;
  transition: .3s ease-in-out
}
.right-side-popup .content-wrap {
  width: 100vw;
  max-width: 804px;
  height: 100vh;
  position: absolute;
  inset: 0 -101% 0 auto;
  padding: 65px 10px 130px;
  background: #1b1b1b;
  -webkit-transition: .3s ease-in-out;
  -o-transition: .3s ease-in-out;
  transition: .3s ease-in-out;
  overflow-x: hidden
}
.right-side-popup .close {
  width: 40px;
  height: 40px;
  position: absolute;
  top: 30px;
  right: 30px;
  border: none;
  outline: 0;
  background: url(/local/templates/auto/css/../img/svg/noun-close.svg) center/cover no-repeat
}
.right-side-popup.is-open {
  z-index: 10;
  visibility: visible
}
.right-side-popup.is-open .layout {
  background-color: rgba(34,43,49,.35)
}
.right-side-popup.is-open .content-wrap.is-visible {
  right: 0
}
.right-side-popup .links {
  display: -ms-grid;
  display: grid;
  justify-items: start;
  margin-top: 50px;
  gap: 24px
}
.right-side-popup .links a {
  padding-bottom: 3px;
  border-bottom: 1px solid
}
.right-side-popup .links a:hover {
  color: #c3ccdd;
  border-bottom-color: transparent
}
.passrec h1 + .text {
  font-size: 16px
}
.passrec-form {
  display: -ms-grid;
  display: grid;
  gap: 30px;
  max-width: 407px;
  margin-top: 50px
}
.go-back {
  display: -moz-inline-flex;
  display: -ms-inline-flex;
  display: -o-inline-flex;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  line-height: 23px;
  margin-bottom: 30px;
  -webkit-transition: .3s;
  -o-transition: .3s;
  transition: .3s
}
.go-back .svg-wrap {
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-right: 5px
}
.go-back svg {
  width: 24px;
  height: 24px
}
@media screen and (max-width:769px) {
  .go-top {
    display: none
  }
}
@media screen and (min-width:769px) {
  .directory ul {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
  }
  .right-side-popup .content-wrap {
    padding: 90px 16px 90px 60px
  }
  .passrec-form,
  .right-side-popup .links {
    margin-top: 70px
  }
  .go-top {
    width: 69px;
    height: 69px;
    bottom: 60px;
    right: 30px;
    position: fixed;
    background: var(--c-prmr-red) url(/local/templates/auto/css/../img/svg/chev-left.svg) no-repeat center/23px;
    border-radius: 100vmax;
    -webkit-box-shadow: 0 0 10px rgba(32,5,6,.2);
    box-shadow: 0 0 10px rgba(32,5,6,.2);
    -webkit-transform: translateY(0) rotate(90deg);
    -ms-transform: translateY(0) rotate(90deg);
    transform: translateY(0) rotate(90deg);
    -webkit-transition: .5s ease-in;
    -o-transition: .5s ease-in;
    transition: .5s ease-in
  }
  .go-top:hover {
    background-color: #e35863;
    -webkit-box-shadow: 0 0 10px rgba(32,5,6,0);
    box-shadow: 0 0 10px rgba(32,5,6,0)
  }
  .go-top:not(.is-visible) {
    opacity: 0;
    visibility: hidden;
    -webkit-transform: translateY(100px) rotate(90deg);
    -ms-transform: translateY(100px) rotate(90deg);
    transform: translateY(100px) rotate(90deg)
  }
}
@-webkit-keyframes ticker {
  0% {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    visibility: visible
  }
  100% {
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0)
  }
}
@keyframes ticker {
  0% {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
    visibility: visible
  }
  100% {
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0)
  }
}
/* End */


/* Start:/local/templates/auto/css/presentation.css?16742088066404*/
body,
main {
  padding: 0
}
.presentation {
  min-height: 100vh;
  padding: 130px 0 57px;
  background: center/cover no-repeat
}
.presentation .container {
  width: 100%;
  max-width: 1680px
}
.presentation a {
  padding-bottom: 3px 3s;
  border-bottom: 1px solid
}
.presentation a:active,
.presentation a:focus,
.presentation a:hover,
.presentation-form .go-back:hover,
.presentation-form .pass-rec:hover {
  border-bottom-color: transparent
}
@media screen and (max-width:1024px) {
  .presentation h1.animated-title {
    max-width: 420px
  }
}
@media screen and (min-width:1440px) {
  .presentation h1.animated-title {
    max-width: 650px
  }
}
.presentation h1.animated-title>span:after,
.presentation h1.animated-title>span:before {
  letter-spacing: .02em
}
.presentation-content {
  -webkit-box-flex: 0;
  -ms-flex: 0;
  flex: 0;
  display: -ms-grid;
  display: grid;
  justify-items: start;
  gap: 30px
}
.presentation-content .text {
  margin-top: 0
}
.presentation-content ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: flex-start;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between
}
@supports (gap:50px) {
  .presentation-content ul {
    gap: 50px
  }
}
@supports not (gap:50px) {
  .presentation-content ul li:not(:first-child) {
    margin-left: 50px
  }
}
.presentation-content li {
  display: -ms-grid;
  display: grid;
  justify-items: start;
  position: relative;
  scroll-snap-align: start
}
.presentation-content li span {
  display: inline-block;
  padding-bottom: 20px;
  margin-bottom: 20px;
  position: relative;
  font-family: 'Proxima Nova';
  font-size: 28px;
  font-weight: 700;
  line-height: 1
}
@media screen and (min-width:769px) {
  .presentation-content .text {
    font-size: 18px
  }
  .presentation-content li span {
    font-size: 48px
  }
}
@media screen and (min-width:1441px) {
  .presentation-content li span {
    font-size: 74px
  }
}
.presentation-content li span:after {
  content: '';
  width: auto;
  height: 1px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: 100%;
  background-color: #fff;
  -webkit-transition: .3s ease-out;
  -o-transition: .3s ease-out;
  transition: .3s ease-out
}
.presentation-content li:nth-child(1) span:after {
  -webkit-transition-delay: 4s;
  -o-transition-delay: 4s;
  transition-delay: 4s
}
@supports (-webkit-text-stroke:1px #fff) {
  .presentation-content li:nth-child(2) span {
    -webkit-text-stroke: 1px #fff;
    color: transparent
  }
}
.presentation-content li:nth-child(2) span:after {
  -webkit-transition-delay: 4.3s;
  -o-transition-delay: 4.3s;
  transition-delay: 4.3s
}
.presentation-content li:nth-child(3) span:after {
  -webkit-transition-delay: 4.6s;
  -o-transition-delay: 4.6s;
  transition-delay: 4.6s
}
.presentation-content ul.animated span:after {
  right: 0
}
.presentation-forms {
  display: -ms-grid;
  display: grid;
  position: relative
}
@media screen and (max-width:1280px) {
  .presentation-forms .circle-text {
    display: none
  }
}
@media screen and (min-width:128px) {
  .presentation-forms .circle-text {
    position: absolute;
    bottom: -10px;
    right: calc(100% + 6.0416vw)
  }
}
.presentation-form {
  -ms-grid-row: 1;
  -ms-grid-column: 1;
  grid-area: 1/1;
  display: -ms-grid;
  display: grid;
  -webkit-box-align: start;
  -ms-flex-align: start;
  align-items: start;
  -ms-flex-line-pack: start;
  align-content: start;
  gap: 30px;
  max-width: 517px;
  padding: 30px 20px;
  border: 1px solid;
  margin: 0 auto
}
@media screen and (max-width:768px) {
  .presentation {
    text-align: center;
    position: relative
  }
  .presentation:before {
    content: '';
    width: 278px;
    height: 188px;
    position: absolute;
    top: 0;
    right: 42px;
    background: url(/local/templates/auto/css/../img/pres-bg.png) top left/100% auto no-repeat;
    mix-blend-mode: exclusion
  }
  .presentation-content ul {
    max-width: calc(100vw - 20px);
    margin-top: 60px;
    overflow-x: auto;
    -ms-scroll-snap-type: x mandatory;
    scroll-snap-type: x mandatory
  }
  .presentation-form .input-wrap {
    text-align: left
  }
  .presentation-form .input-wrap span,
  .presentation-form h4 {
    font-size: 14px
  }
}
@media screen and (min-width:768px) {
  .presentation {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-image: url(/local/templates/auto/css/../img/main_page.jpg);
    padding: 150px 0;
    font-size: 18px
  }
  .presentation-form,
  .presentation-form .input-wrap span,
  .presentation-form h4 {
    font-size: 18px
  }
}
.presentation-form:not(.visible) {
  opacity: 0;
  visibility: hidden
}
@media screen and (max-width:1025px) {
  .presentation-content {
    justify-items: center
  }
  .presentation-content .text {
    text-align: center
  }
  .presentation-content li {
    justify-items: center;
    text-align: center
  }
  .presentation-form {
    margin-top: 70px
  }
}
@media screen and (min-width:1025px) {
  .presentation .container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
  }
  .presentation-content {
    gap: 40px;
    margin-right: 40px
  }
  .presentation-form {
    width: 100vw;
    padding: 85px 55px;
    margin: 0 0 0 auto
  }
}
.presentation-form .pass-rec {
  -ms-grid-column-align: center;
  justify-self: center;
  cursor: pointer;
  border-bottom: 1px solid
}
.presentation-form .form-link {
  display: inline;
  text-align: center;
  text-decoration: underline;
  border-bottom: none
}
.presentation-form .form-link:hover {
  text-decoration: none
}
.presentation-form .go-back {
  -ms-grid-column-align: start;
  justify-self: start;
  position: relative;
  margin-left: 25px;
  cursor: pointer;
  border-bottom: 1px solid
}
.presentation-form .go-back:before {
  content: '';
  width: 20px;
  height: 20px;
  position: absolute;
  inset: 0 calc(100% + 5px) 0 auto;
  background: url(/local/templates/auto/css/../img/svg/chev-left.svg) center/cover no-repeat
}
.presentation-form.message {
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-line-pack: center;
  align-content: center
}
/* End */


/* Start:/local/templates/auto/styles.css?1674208806192*/
.border-text {
  display: block;
  border: 1px solid;
  padding: 20px!important;
  margin-top: 30px;
}
@media screen and (min-width:768px) {
  .border-text {
    padding: 50px!important;
  }
}
/* End */
/* /local/templates/auto/css/base.css?167420880610443 */
/* /local/templates/auto/css/styles.css?167420880623820 */
/* /local/templates/auto/css/presentation.css?16742088066404 */
/* /local/templates/auto/styles.css?1674208806192 */