html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; vertical-align: baseline; }

body, html { height: 100%; }

img, fieldset, a img { border: none; }

input[type="submit"], button { cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
input[type="submit"]::-moz-focus-inner, button::-moz-focus-inner { padding: 0; border: 0; }

textarea { overflow: auto; }

input, button { margin: 0; padding: 0; border: 0; }

div, input, textarea, select, button, h1, h2, h3, h4, h5, h6, a, span, a:focus { outline: none; }

ul, ol { list-style-type: none; }

@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { * { -webkit-text-size-adjust: none; } }
table { border-spacing: 0; border-collapse: collapse; width: 100%; }

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); -webkit-tap-highlight-color: transparent; }

input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus, select:-webkit-autofill, select:-webkit-autofill:hover, select:-webkit-autofill:focus { -webkit-text-fill-color: inherit !important; -webkit-box-shadow: 0 0 0px 1000px #fff inset; }

a, a:before, a:after, a:hover, a:focus { text-decoration: none; color: inherit; -moz-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; transition: all 0.3s; }

body { font-family: "Inter", sans-serif; font-weight: 400; font-size: 12px; line-height: 1.2; color: #1F2533; background: url(../img/grid.png) left top #F0F0F0; }

@-webkit-keyframes showLogoLeft { 0% { -moz-transform: translateX(-150px); -ms-transform: translateX(-150px); -webkit-transform: translateX(-150px); -o-transform: translateX(-150px); transform: translateX(-150px); -webkit-transform: translateX(-150px); -o-transform: translateX(-150px); transform: translateX(-150px); opacity: 0; }
  100% { -webkit-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); opacity: 1; } }
@keyframes showLogoLeft { 0% { -webkit-transform: translateX(-150px); -o-transform: translateX(-150px); transform: translateX(-150px); opacity: 0; }
  100% { -webkit-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); opacity: 1; } }
@-webkit-keyframes showLogoTop { 0% { -webkit-transform: translateY(-150px); -o-transform: translateY(-150px); transform: translateY(-150px); opacity: 0; }
  100% { -webkit-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } }
@keyframes showLogoTop { 0% { -webkit-transform: translateY(-150px); -o-transform: translateY(-150px); transform: translateY(-150px); opacity: 0; }
  100% { -webkit-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } }
@-webkit-keyframes showLogoBottom { 0% { -webkit-transform: translateY(150px); -o-transform: translateY(150px); transform: translateY(150px); opacity: 0; }
  100% { -webkit-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } }
@keyframes showLogoBottom { 0% { -webkit-transform: translateY(150px); -o-transform: translateY(150px); transform: translateY(150px); opacity: 0; }
  100% { -webkit-transform: translateY(0px); -o-transform: translateY(0px); transform: translateY(0px); opacity: 1; } }
@-webkit-keyframes showText { 0% { -webkit-transform: translateX(200px); -o-transform: translateX(200px); transform: translateX(200px); opacity: 0; }
  100% { -webkit-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); opacity: 1; } }
@keyframes showText { 0% { -webkit-transform: translateX(200px); -o-transform: translateX(200px); transform: translateX(200px); opacity: 0; }
  100% { -webkit-transform: translateX(0px); -o-transform: translateX(0px); transform: translateX(0px); opacity: 1; } }
.preloader { position: fixed; left: 0; top: 0; right: 0; bottom: 0; z-index: 100000; background: #3F93E1; overflow: hidden; display: flex; align-items: center; padding: 20px; justify-content: center; }
.preloader .preloader__logo { display: flex; align-items: center; font-size: 0; }
.preloader .preloader__image { width: 72px; height: 42px; position: relative; }
.preloader .preloader__image img { width: 100%; opacity: 0; animation-fill-mode: forwards; animation-delay: 0.5s; animation-duration: 1s; position: absolute; }
.preloader .preloader__image img:nth-child(1) { animation-name: showLogoLeft; width: 30px; left: 0; top: 3px; }
.preloader .preloader__image img:nth-child(2) { animation-name: showLogoTop; width: 66px; left: 1px; top: 0; }
.preloader .preloader__image img:nth-child(3) { width: 72px; animation-name: showLogoBottom; top: 2px; right: 0; }
.preloader .preloader__text { padding-left: 25px; }
.preloader .preloader__text img { height: 28px; opacity: 0; animation-fill-mode: forwards; animation-name: showText; animation-delay: 1.75s; animation-duration: 0.5s; }

.out { width: 100%; min-width: 320px; margin: 0 auto; overflow: hidden; opacity: 0; -moz-transition: opacity 0.3s; -o-transition: opacity 0.3s; -webkit-transition: opacity 0.3s; transition: opacity 0.3s; }
.out.ready { opacity: 1; }

.container { max-width: 1200px; padding: 0 20px; margin: 0 auto; }

.openmenu { overflow: hidden; height: 100%; position: fixed; left: 0; right: 0; top: 0; bottom: 0; }

.mobmenu-toggle { display: none; position: relative; z-index: 11; width: 32px; height: 28px; }
.mobmenu-toggle span { position: absolute; top: 50%; margin-top: -1px; display: block; height: 3px; width: 100%; background: #1F2533; -moz-transition: background 0s 0.3s; -o-transition: background 0s 0.3s; -webkit-transition: background 0s; -webkit-transition-delay: 0.3s; transition: background 0s 0.3s; }
.mobmenu-toggle span:before, .mobmenu-toggle span:after { content: ""; position: absolute; left: 0; right: 0; height: 3px; background: #1F2533; -moz-transition-duration: 0.3s, 0.3s; -o-transition-duration: 0.3s, 0.3s; -webkit-transition-duration: 0.3s, 0.3s; transition-duration: 0.3s, 0.3s; -moz-transition-delay: 0.3s, 0s; -o-transition-delay: 0.3s, 0s; -webkit-transition-delay: 0.3s, 0s; transition-delay: 0.3s, 0s; }
.mobmenu-toggle span:before { top: -8px; -moz-transition-property: top, -moz-transform, background; -o-transition-property: top, -o-transform, background; -webkit-transition-property: top, -webkit-transform, background; transition-property: top, transform, background; }
.mobmenu-toggle span:after { bottom: -8px; -moz-transition-property: bottom, -moz-transform, background; -o-transition-property: bottom, -o-transform, background; -webkit-transition-property: bottom, -webkit-transform, background; transition-property: bottom, transform, background; }

.mobmenu-toggle.active span { background: none !important; }
.mobmenu-toggle.active span:before { top: 0; -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); }
.mobmenu-toggle.active span:after { bottom: 0; -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg); }
.mobmenu-toggle.active span:before, .mobmenu-toggle.active span:after { -moz-transition-delay: 0s, 0.3s; -o-transition-delay: 0s, 0.3s; -webkit-transition-delay: 0s, 0.3s; transition-delay: 0s, 0.3s; }

.mobmenu { background: #fff; display: none; position: fixed; left: 0; top: 0; height: 100%; width: 100%; overflow: hidden; text-align: center; z-index: 9; -webkit-transform: translateY(-120%); -o-transform: translateY(-120%); transform: translateY(-120%); -moz-transition: 0.6s; -o-transition: 0.6s; -webkit-transition: 0.6s; transition: 0.6s; }
.mobmenu .mobmenu__content { height: 100%; width: 100%; overflow: auto; position: relative; }
.mobmenu .container { padding: 70px 20px 0; }
.mobmenu .mobmenu__nav { text-align: center; font-weight: 500; font-size: 18px; padding-bottom: 40px; }
.mobmenu .mobmenu__nav li + li { margin-top: 20px; }
.mobmenu .mobmenu__contacts { text-align: center; font-size: 16px; font-weight: 700; padding: 15px 0; }

.mobmenu.open { -webkit-transform: translateY(0); -o-transform: translateY(0); transform: translateY(0); }

.cr { position: relative; }
.cr:before { content: ""; position: absolute; right: 0; top: 0; width: 37px; height: 37px; border-top: 2px solid #1F2533; border-right: 2px solid #1F2533; }

.mt { margin-top: 150px; padding-top: 50px; }

.mainblock { position: relative; }
.mainblock:before { content: ""; position: absolute; left: 0; top: 0; width: 50%; height: 100%; background: url(../img/mainblock.png) center center no-repeat; background-size: cover; }

.header { padding: 27px 0; display: flex; align-items: center; justify-content: space-between; }
.header .header__logo { font-size: 0; width: 50%; padding-right: 15px; display: flex; align-items: center; position: relative; z-index: 1; }
.header .header__logo img { max-width: 36px; position: relative; top: -2px; }
.header .header__logo p { font-weight: 600; font-size: 18px; letter-spacing: -0.02em; text-transform: uppercase; color: #fff; margin-left: 12px; line-height: 1; }
.header .header__nav { width: 50%; font-weight: 500; font-size: 16px; padding-left: 40px; }
.header .header__nav ul { display: flex; }
.header .header__nav li { margin: 0 35px 0 0; }
.header .header__nav a:hover { color: #000; }

.offer { padding: 10px 0 50px calc(50% + 40px); max-height: 1000px; display: table; }
.offer .offer__content { display: table-cell; vertical-align: middle; }
.offer .offer__title { padding: 40px 0 0; }
.offer h1 { font-weight: 400; font-size: 70px; letter-spacing: -0.02em; text-transform: uppercase; }
.offer .offer__text { font-size: 18px; max-width: 350px; line-height: 1.4; margin-top: 40px; }
.offer .offer__arrow { display: block; width: 78px; height: 78px; border-radius: 50%; background: url(../img/icons/arrow-down.svg) center center no-repeat #F3D65C; margin-top: 96px; }

.found .found__content { max-width: 1080px; margin: 0 auto; padding: 35px; font-size: 26px; line-height: 1.4; text-align: center; background: #EEEDE4; border: 1px solid #1F2533; }
.found .found__content p + p { margin-top: 15px; }

.services { position: relative; }
.services:before, .services:after { content: ""; position: absolute; width: 500px; height: 500px; background-size: contain !important; }
.services:before { top: -40px; left: 100%; margin-left: -150px; background: url(../img/circles/1.svg) center center no-repeat; }
.services:after { bottom: -40px; right: 100%; margin-right: -150px; background: url(../img/circles/2.svg) center center no-repeat; }

.service { color: #000; padding-top: 50px; margin-top: -50px; }
.service:nth-child(odd) { padding-right: calc(50% + 40px); }
.service:nth-child(even) { padding-left: calc(50% + 40px); }
.service + .service { margin-top: -166px; }
.service .service__icon { font-size: 0; width: 112px; }
.service .service__icon img { max-width: 100%; }
.service .service__title { margin-top: 60px; }
.service .service__title h2 { font-size: 60px; text-transform: uppercase; font-weight: 400; }
.service .service__text { font-size: 16px; line-height: 1.5; margin-top: 30px; max-width: 450px; }
.service .service__text p + *, .service .service__text * + p, .service .service__text ul + *, .service .service__text * + ul, .service .service__text ol + *, .service .service__text * + ol { margin-top: 15px; }
.service .service__text ul { padding-left: 10px; }
.service .service__text li { padding-left: 20px; position: relative; }
.service .service__text li:before { content: ""; position: absolute; left: 0; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: #3F93E1; }
.service .service__text li + li { margin-top: 10px; }

.warranty .warranty__content { max-width: 900px; margin: 0 auto; font-size: 26px; line-height: 1.4; text-align: center; }

.footer { padding-bottom: 35px; text-align: center; color: #000; line-height: 1.4; }
.footer .footer__requisites { font-size: 18px; max-width: 600px; margin: 0 auto; padding: 45px; background: #EEEDE4; border: 1px solid #1F2533; }
.footer .footer__requisites b { font-weight: 700; }
.footer .footer__requisites p + p { margin-top: 15px; }
.footer .footer__copyright { margin-top: 33px; font-size: 14px; }

@media screen and (max-width: 1500px) { .cr:before { width: 32px; height: 32px; }
  .mt { margin-top: 140px; padding-top: 40px; }
  .header { padding: 25px 0; }
  .offer h1 { font-size: 60px; }
  .offer .offer__arrow { width: 65px; height: 65px; margin-top: 80px; }
  .found .found__content { max-width: 1080px; padding: 35px; font-size: 24px; }
  .service { padding-top: 40px; margin-top: -40px; }
  .service + .service { margin-top: -156px; }
  .service .service__icon { width: 110px; }
  .service .service__title { margin-top: 55px; }
  .service .service__title h2 { font-size: 55px; }
  .warranty .warranty__content { max-width: 850px; font-size: 24px; } }
@media screen and (max-width: 1199px) { .container { max-width: 992px; }
  .mobmenu-toggle, .mobmenu { display: block; }
  .cr:before { width: 27px; height: 27px; }
  .mt { margin-top: 130px; padding-top: 30px; }
  .header .header__logo img { max-width: 32px; top: -1px; }
  .header .header__logo p { font-size: 16px; }
  .header .header__nav { display: none; }
  .offer { padding: 10px 0 50px calc(50% + 40px); }
  .offer .offer__title { padding-top: 20px; }
  .offer h1 { font-size: 50px; }
  .offer .offer__arrow { width: 60px; height: 60px; margin-top: 70px; }
  .found .found__content { max-width: 1080px; padding: 35px; font-size: 22px; }
  .service { padding-top: 40px; margin-top: -40px; }
  .service + .service { margin-top: -145px; }
  .service .service__icon { width: 100px; }
  .service .service__title { margin-top: 50px; }
  .service .service__title h2 { font-size: 45px; }
  .warranty .warranty__content { max-width: 850px; font-size: 22px; }
  .footer .footer__requisites { max-width: 550px; padding: 40px; } }
@media screen and (max-width: 991px) { .container { max-width: 768px; }
  .cr:before { width: 22px; height: 22px; }
  .mt { margin-top: 110px; }
  .header .header__logo img { max-width: 28px; }
  .header .header__logo p { font-size: 15px; }
  .offer h1 { font-size: 40px; }
  .offer .offer__arrow { width: 55px; height: 55px; margin-top: 60px; }
  .found .found__content { padding: 30px; font-size: 20px; }
  .service { padding-top: 40px; margin-top: -40px; }
  .service + .service { margin-top: -132px; }
  .service .service__icon { width: 90px; }
  .service .service__title { margin-top: 45px; }
  .service .service__title h2 { font-size: 35px; }
  .warranty .warranty__content { max-width: 800px; font-size: 20px; }
  .footer .footer__requisites { max-width: 500px; font-size: 16px; padding: 35px; } }
@media screen and (max-width: 767px) { .preloader .preloader__text { display: none; }
  .container { max-width: 575px; }
  .cr:before { width: 17px; height: 17px; }
  .mt { margin-top: 90px; }
  .offer { padding: 10px 0 40px calc(50% + 30px); max-height: 850px; }
  .offer h1 { font-size: 32px; }
  .offer .offer__text { font-size: 16px; margin-top: 30px; }
  .offer .offer__arrow { width: 50px; height: 50px; margin-top: 50px; }
  .found .found__content { font-size: 18px; }
  .services:before, .services:after { width: 350px; height: 350px; }
  .services:before { top: -20px; margin-left: -80px; }
  .services:after { bottom: -20px; margin-right: -80px; }
  .service { padding-top: 40px; margin-top: 0; }
  .service:nth-child(odd) { padding-right: 100px; }
  .service:nth-child(even) { padding-left: 100px; }
  .service + .service { margin-top: 40px; }
  .service .service__icon { width: 80px; }
  .service .service__title { margin-top: 40px; }
  .service .service__title h2 { font-size: 30px; }
  .warranty .warranty__content { max-width: 400px; font-size: 18px; }
  .footer .footer__requisites { max-width: 450px; padding: 30px; } }
@media screen and (max-width: 574px) { .container { max-width: 425px; }
  .cr:before { border-color: #fff; }
  .mt { margin-top: 70px; }
  .mobmenu-toggle { width: 30px; height: 26px; }
  .mobmenu-toggle span { background: #fff; }
  .mobmenu-toggle span:before, .mobmenu-toggle span:after { background: #fff; }
  .mobmenu-toggle.active span:before, .mobmenu-toggle.active span:after { background: #1F2533; }
  .mainblock:before { width: 100%; }
  .mainblock:after { content: ""; position: absolute; left: 0; top: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.3); }
  .header .header__logo { width: auto; }
  .offer { padding: 10px 0 150px; color: #fff; position: relative; z-index: 1; text-align: center; }
  .offer h1 { font-size: 40px; }
  .offer .offer__text { font-size: 18px; max-width: 280px; margin: 30px auto 0; }
  .offer .offer__arrow { position: absolute; left: 50%; bottom: 35px; margin: 0 0 0 -25px; }
  .found .found__content { padding: 20px; }
  .services:before, .services:after { width: 200px; height: 200px; }
  .services:before { top: 0; margin-left: -60px; }
  .services:after { display: none; }
  .service { padding-top: 30px; margin-top: 0; }
  .service:nth-child(odd) { padding-right: 0; }
  .service:nth-child(even) { padding-left: 0; }
  .service + .service { margin-top: 40px; }
  .service .service__icon { width: 70px; }
  .service .service__title { margin-top: 35px; }
  .service .service__title h2 { font-size: 25px; }
  .footer .footer__requisites { padding: 25px; } }
@media screen and (max-width: 359px) { .header .header__logo img { max-width: 20px; top: -1px; }
  .header .header__logo p { font-size: 14px; margin-left: 10px; } }
@media screen and (min-width: 1200px) { .openmenu { overflow: auto !important; height: auto !important; position: static !important; } }
