@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100; 0,300; 0,400; 0,500; 0,700; 0,900; 1,100; 1,300; 1,400; 1,500; 1,700; 1,900&display=swap'); :root { --color_1: #1434CB; }
* { margin: 0; padding: 0; box-sizing: border-box; }
body { -webkit-font-smoothing: antialiased; font-family: "Roboto", sans-serif; background-color: #000; color: #fff }
section { position: relative; overflow: hidden; }
a { text-decoration:none }
.btn,
.light,
header { color: #fff }
header { z-index: 5; align-items: inherit; border-bottom: 1px solid #ffffff1c; padding: 20px; position: fixed; width: 100%; background: #000; display: grid; grid-template-columns: 1fr 330px 1fr; align-items: center; }
.head_2 { display: grid; grid-template-columns: repeat(4,1fr); grid-gap:32px }
.head_2 > * { width:fit-content; }
.head_3 { justify-self: end; }
.ta_c { text-align: center; }
.ai_c { align-items: center; }
.w100 { width: 100% }
.wrap { max-width: 1440px; margin: 0 auto; grid-gap: 80px; padding: 112px 20px; }
.grid { display:grid; }
.grid_tc2 { grid-template-columns: 1fr 1fr; grid-gap: 40px; }
.grid_tc3 { grid-template-columns: repeat(3,1fr); grid-gap: 40px; }
.blocks>* { width: 32%; margin-right: 20px; }
.blocks img { width: 100%; }
.blocks p { font-weight: bold; letter-spacing: 2px; margin-top: 20px; }
h1 { font-size: 56px; }
p { font-size: 18px; line-height: 27px; }
section.services:after { background: linear-gradient(to bottom, #000000c7 35%, #000000 100%); }
section.services:after { z-index: 1; }
.about.static .btn { background: #000; }
.btn { display: inline-block; padding: 20px 40px; border-radius: 3px; font-weight: 700; margin-top: 20px; position: relative; display: inline-flex; align-items: center; border: 1px solid var(--color_1); }
a.btn:hover { border: 1px solid #fff; background-color: transparent; cursor:pointer; }
a.btn2:hover,.__btn .btn:hover { border: 1px solid #000; background: #000; }
.fnav div:hover,.head_2 > div:hover { cursor:pointer; opacity:.6 }
header .logo svg { width: 200px; height: auto; filter: invert(1); }
@keyframes an1 {
 100% { transform: translateX(0); opacity: 1 }
 }
.close svg,
.m.menu svg { width: 30px; height: 30px; vertical-align: bottom }
.hero .btn,
.services .btn { background: var(--color_1) }
.logo img { width: 140px }
.hp { font-size: 30px }
section.wu:after { background: #fff }
section.contact:after { background: linear-gradient(to bottom, #0063ff 35%, #0063ff4d 100%); }
.acs>div { position: absolute; z-index: 99; background: red; padding: 50px }
.contact { z-index: -1 }
.preloader { background: #fff; width: 100%; height: 100vh; top: 0; left: 0; position: fixed; display: flex; align-items: center; justify-content: center; z-index: 3; opacity: 1; transition: all .3s ease; }
.preloader.ready { opacity: 0; z-index: -99 }
.pw { display: flex; align-items: center; justify-content: center; }
.pw svg { width: 70px; height: auto; position: absolute; }
.loader { border: 2px solid #f3f3f3; border-top: 2px solid var(--color_1); border-top: 2px solid #000; border-radius: 50%; width: 200px; height: 200px; animation: spin 2s linear infinite; }
@keyframes spin {
 0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
 }
.bg3:after { content: ''; background: linear-gradient(131deg, #222222d1 45.06%, #222222d1 100%), url(./media/bg3.webp); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; z-index: -1; background-repeat: no-repeat; background-position: bottom; }
.bg4:after { content: ''; background: linear-gradient(131deg, #1434cbeb 45.06%, #1434cbeb 100%), url(./media/bg4.webp); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; z-index: -1; background-repeat: no-repeat; background-position: center; background-size: cover; }
.bg5:after { content: ''; background: linear-gradient(131deg, #222222d1 45.06%, #222222d1 100%), url(./media/bg5.webp); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; z-index: -1; background-repeat: no-repeat; background-position: top; background-size: cover; }
.bg6:after { content: ''; background: linear-gradient(131deg, #222222d1 45.06%, #222222d1 100%), url(./media/bg6.webp); position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); min-width: 100%; min-height: 100%; z-index: -1; background-repeat: no-repeat; background-position: top; background-size: cover; }
.logo_menu_mo { display: none; }
.hero_image { position: relative; overflow: hidden; min-height: 650px; }
.hero_image img { position: absolute; top:50%; left:50%; transform: translate(-50%,-50%); min-width: 100%; min-height: 100%; }
.resources .grid { grid-gap: 20px; }
.solid_bg svg { margin-bottom:24px }
.solid_bg h2 { margin-bottom:24px; font-size:32px }
.features > div { display:grid; grid-template-columns: 32px 1fr; margin-bottom:16px; align-items: baseline; }
.features > div span { display:block; font-weight: 600; }
.features > div { font-size: 20px; }
.flist > p { margin:24px 0 32px 0 }
.flist h2 { margin: 40px 0 50px; }
.flist h5 { margin-bottom:32px }
.flist .btn { background-color: var(--color_1); }
.btn2 { border: 1px solid; background: transparent; }
.resources .grid p { margin:24px 0 8px 0; font-size:24px; }
.resources .grid p + small { font-size:16px }
header .btn2 { background: var(--color_1); padding: 10px 20px; border: none; color: #fff; border: 1px solid var(--color_1); }
header .btn2:hover { border:1px solid #fff; }
.c_grid01 { grid-template-columns:60% 40%; }
.resources .c_grid01 p { font-size:16px }
.c_grid01 { margin-bottom:80px; }
.__btn { display: grid; align-items: flex-end; }
.__btn .btn { justify-self: end; border:1px solid #fff; background:transparent; }
.solid_bg .btn { background:#000; margin-top:80px }
.solid_bg h1 { margin-bottom:40px; }
.solid_bg p { max-width: 600px; margin: 0 auto; }
.footer1 { display:grid; }
.fnav { display: grid; grid-template-columns: 1fr 1fr 1fr 1fr 1fr; justify-self: end; grid-gap: 32px; }
.fnav a { color:#fff }
.footer2 { border-top: 1px solid var(--color_1); padding-top: 32px; display: block; margin-top: 80px; }
footer .wrap { padding:0; }
footer { padding:80px 20px }
.m { display: none; }
header svg.menu { width: 32px; filter: invert(1); justify-self: end; }
.shelf { background: var(--color_1); color: #fff; position: fixed; right: -100%; transition: all .3s ease; max-width: 500px; height: 100vh; display: flex; flex-direction: column; justify-content: center; top: 0; z-index: 6; padding: 20px; width: 100%; }
.show .shelf { right: 0; }
.close svg { position: absolute; top: 0; right: 0; margin: 20px; width: 30px; height: 30px; vertical-align: bottom; filter:invert(1) }
.slinks div { padding:15px 0 }
.slinks > p { margin-top:40px; font-size:12px; }
.overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: #0000009c; z-index: 3; opacity: 0; visibility: hidden; }
.show .overlay { opacity: 1; visibility: visible; }
.footer2 { text-align:center; }
.footer2 > * { color:#fff; padding:20px; display:block; }
.footer2 p { font-size:12px; opacity:.8 }
.footer2 span { margin-right:10px; opacity:.5 }
._header{display:block;margin-bottom:10px}
@media screen and (max-width:1024px) {
 .grid_tc3,.grid_tc2 { grid-template-columns: 1fr; grid-gap: 80px; }
h1 { font-size: 36px; }
.solid_bg h2 { font-size: 24px; }
.m { display: block; }
.shelf img { width: 170px; margin-bottom: 20px; }
.head_2, header .btn2 { display:none }
header { display: flex; justify-content: space-between; }
footer { text-align:center; }
.fnav { grid-template-columns: 1fr; justify-self:unset; }
.footer1 img { margin:0 auto; }
.__btn .btn { justify-self: baseline; }
 }
@media screen and (max-width:768px) {
 .solid_bg h2 { margin-bottom: 14px; }
.flist h5 { margin-bottom: 24px; }
.resources .grid { grid-gap: 60px; }
 }
@media screen and (max-width:425px) {
 .btn { width: 100%; justify-content: center; }
.hero_image { min-height: 420px; }
.wrap {padding: 60px 20px;}
.hero.bg3 .grid_tc2 {grid-gap: 40px;}
 }
