@font-face {
font-family: 'Montserrat';
src: url('fonts/subset-Montserrat-Regular.eot');
src: url('fonts/subset-Montserrat-Regular.eot?#iefix') format('embedded-opentype'),
url('fonts/subset-Montserrat-Regular.woff2') format('woff2'),
url('fonts/subset-Montserrat-Regular.woff') format('woff'),
url('fonts/subset-Montserrat-Regular.ttf') format('truetype');
font-weight: normal;font-style: normal;font-display: swap;}

@font-face {
    font-family: 'Unbounded SemiBold';
    src: url('fonts/Unbounded-SemiBold.eot');
    src: url('fonts/Unbounded-SemiBold.eot?#iefix') format('embedded-opentype'),
         url('fonts/Unbounded-SemiBold.woff2') format('woff2'),
         url('fonts/Unbounded-SemiBold.woff') format('woff'),
         url('fonts/Unbounded-SemiBold.ttf')  format('truetype'),
         url('fonts/Unbounded-SemiBold.svg#Unbounded SemiBold') format('svg');}

body {
	scrollbar-base-color: #CC0202;
	scrollbar-base-color: #CC0202;
	scrollbar-3dlight-color: #CC0202;
	scrollbar-highlight-color: #CC0202;
	scrollbar-track-color: #EBEBEB;
	scrollbar-arrow-color: black;
	scrollbar-shadow-color: #C0C0C0;
	scrollbar-dark-shadow-color: #CC0202;
}

::-webkit-scrollbar {
	width: 7px;
	height: 3px;
}
::-webkit-scrollbar-button {
	height: 3px;
	background-color: #CC0202;
}
::-webkit-scrollbar-track {
	background-color: #EFEFEF;
}
::-webkit-scrollbar-track-piece {
	background-color: #ffffff;
}
::-webkit-scrollbar-thumb {
	height: 50px;
	background-color: #CC0202;
	border-radius: 3px;
}
::-webkit-scrollbar-corner {
	background-color: #CC0202;
}}
::-webkit-resizer {
	background-color: #666;
}

@-moz-document url-prefix(http://),url-prefix(https://) {
scrollbar {
-moz-appearance: none !important;
background: rgb(0,255,0) !important;
}
thumb,scrollbarbutton {
-moz-appearance: none !important;
background-color: rgb(239,99,2) !important;
}

thumb:hover,scrollbarbutton:hover {
-moz-appearance: none !important;
background-color: rgb(239,99,2) !important;
}

scrollbarbutton {
display: none !important;
}

scrollbar[orient="vertical"] {
min-width: 15px !important;
}
}

html {}
body, input, select, optgroup, textarea, a {margin: 0;font-style: normal;font-weight: 400;font-family: 'Montserrat',sans-serif;font-size: 20px;line-height: 1.6;}
main {}
p, li {color: #333;}
a {text-decoration:none;}
h1, h2, h3, h4, h5, h6, .toptel a, .toptext p {line-height: 1.4;color: #111;font-family: 'Unbounded SemiBold';}
h1 {color: #fff;font-size:6.7rem;margin: 0;line-height: 1.1;}
h1 span {letter-spacing: 3px;font-size:1.2em;}
h2, .h2 {font-size: 2.5rem;}
h2 span, .h2 span, h3 span{color:#cc0202;}
.subh2 {font-family: 'Montserrat',sans-serif;color:#111;font-size: 2rem;}
h3 {font-size: 1.8rem;}
.h3 {font-size: 1.8rem;font-family: 'Unbounded SemiBold';padding: .5rem 0;}
h4, .h4 {font-family: 'Unbounded SemiBold';font-size: 1.2rem;}
.toptext p {line-height: 1.5;}
b,strong {font-weight:700;}
header {height:74px;background: rgba(255,255,255,0);display: flex;transition: .5s all;position:fixed;width:100%;z-index: 100;}
.headfix {height:74px;position:fixed;background: rgba(255,255,255,.7);backdrop-filter: blur(10px);}
/* По умолчанию белый цвет */
.logo-img .a {fill: #fff;transition: fill 0.5s ease;}
/* При скролле цвет меняется */
.headfix .logo-img .a {fill: #CC0202;}
.top-foot {background: #19222b;color:#fff;}
.top-foot h2, .top-foot p, .top-foot h3, .top-foot a {color:#fff;}
.butflex {display: flex;justify-content: center;}
.inhead {display: flex;justify-content: space-between;align-items: center;align-content: center;width: 100%;padding: 0 30px;}
.topcontact {display: flex;align-items: center;}
.logo-img {cursor: pointer;/*padding: 5px;border-radius: 3rem;background: rgba(255, 255, 255, .7);*/width:42px; height:54px;}
.hom01 {margin:0;background: #000;height: 100vh;width: 100%;position: relative;justify-content: center;background-image: url(../img/head.webp);
background-position: center bottom; background-repeat: no-repeat;}
.inhom01 {background-image: url(../img/grid-70.png);height: 100%;display: flex;flex-direction: column;}
.toptext {text-align:center;margin: auto;z-index: 10;padding: 20px;}
.toptext p {color: #fff;font-size:2rem;margin: 1rem 0 0 0;}
.toptel {padding: 5px 12px;border-radius: 2rem;background: rgba(255, 255, 255, .7);font-size: 20px;}
.topmess {display: flex;height: 44px;}
.mess-img {padding: 0 0 0 10px;}
.container {
  position: relative;
  width: 24px;
  height: 24px;
  bottom: 60px;
  margin: 0 auto;}

.chevron {
  position: absolute;
  width: 28px;
  height: 8px;
  opacity: 0;
  transform: scale3d(0.5, 0.5, 0.5);
  animation: move 3s ease-out infinite;
}

.chevron:first-child {
  animation: move 3s ease-out 1s infinite;
}

.chevron:nth-child(2) {
  animation: move 3s ease-out 2s infinite;
}

.chevron:before,
.chevron:after {
  content: ' ';
  position: absolute;
  top: 0;
  height: 100%;
  width: 51%;
  background: #fff;
}

.chevron:before {
  left: 0;
  transform: skew(0deg, 30deg);
}

.chevron:after {
  right: 0;
  width: 50%;
  transform: skew(0deg, -30deg);
}

@keyframes move {
  25% {
    opacity: 1;

  }
  33% {
    opacity: 1;
    transform: translateY(30px);
  }
  67% {
    opacity: 1;
    transform: translateY(40px);
  }
  100% {
    opacity: 0;
    transform: translateY(55px) scale3d(0.5, 0.5, 0.5);
  }
}
#particle-canvas {
  width: 100%;
  height: 100vh;
  vertical-align: middle;position: absolute;}

.white {background:#fff;}
.grey {background:#f6f8fa;}
.sq-bg {background-image: linear-gradient(rgba(255, 255, 255, 1) 2px, transparent 2px), linear-gradient(90deg, rgba(255, 255, 255, 1) 2px, transparent 2px);
 background-size: 3em 3em;}

.insect {max-width: 1600px;margin: 0 auto; padding:50px 30px;}
.padd-50-30 {}
.padd-0-30 {padding:0 30px;}
.padd-0-30-50-30 {padding:0 30px 50px 30px;}
.grid2 {display: grid;grid-template-columns: repeat(2, 1fr);grid-gap: 3rem;}
.grid3 {display: grid;grid-template-columns: repeat(3, 1fr);grid-gap: 3rem;margin: 3rem 0 1rem 0;}
.grid4 {display: grid;grid-template-columns: repeat(4, 1fr);grid-gap: 3rem;margin: 3rem 0 1rem 0;}
.grid-foot {margin:0;}
.grid6 {display: grid;grid-template-columns: repeat(6, 1fr);grid-gap: 3rem;}
.grid3	h3 {font-size: 1.5rem;}
.imgblock {max-width:100%;height: auto;border-radius: 2rem;}
.bord {border: 1px solid #d9dee3;margin-top: 2rem;}
.whiteblok {background: #fff;padding: 1rem 2.5rem;border-radius: 2rem;-webkit-box-shadow: 0px 0rem 2.5rem rgb(0 0 0 / 10%);box-shadow: 0px 0rem 2.5rem rgb(0 0 0 / 10%);}
.cent {text-align:center;}
.m-top-1 {margin-top:1rem;}
.m-top-2 {margin-top:2rem;}
.m-top-3 {margin-top:3rem;}
li {padding-bottom: .5rem;}
ul li::marker {color:#cc0202;font-size: 30px;}
ol li::marker {color: #cc0202;font-family: 'Unbounded SemiBold';font-size: 1.2em;}
.m3020{margin: 3rem 0 2rem 0;}
.m-top-3 {margin-top: 3rem;}
.m-top-4 {margin-top: 4rem;}

/*Modal Start*/
.butcont {margin: 2rem 0 3rem 0;}
.btn {width:auto; padding:20px 25px 19px 25px;margin: 10px 5px;height: auto;cursor: pointer;border-radius: 2rem;border: none;background:#cc0202;;color:#fff;font-size: 1.25rem;-webkit-transition: all .1s ease;transition: all .1s ease;text-decoration:none;line-height: 1;}
.btn:hover {background:#f00;}
.greybut {background: #3a3a3a;}
.greybut:hover {background: #5d5c5c;}
.modal {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.85);
  opacity: 0;
  visibility: hidden;
  transform: scale(1.1);
  transition: visibility 0s linear 0.25s, opacity 0.25s 0s, transform 0.25s;z-index: 100;
}
.modal-content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: white;
  padding: 1.2rem 1.2rem 1rem 1.2rem;
  width: 18em;
  border-radius: 1.5rem;
  border-bottom: 3px solid var(--clr-dark);
}
.close-button {
  float: right;
  width: 1.5rem;
font-size: 1.7em;
line-height: 1;
  padding: .2em .3em;
  text-align: center;
  cursor: pointer;
  border-radius: 50%;
  background-color: var(--clr-neutral);
  color: var(--clr-dark);
  transition: color 0.12s ease-in-out;font-family: "Rubik", sans-serif;}
.close-button:hover {color: var(--clr-main);}
.show-modal {opacity: 1;visibility: visible;transform: scale(1.0);transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;}
.headform {margin: 7px 5px 5px 0;font-weight: 700;color: #111;text-align: left;font-size: 24px;}
input {width: 90%;margin: 6px 0;height: 34px;padding: 1% 4%;font-size: 16px;border: 1px solid #aaa;}
textarea {width: 90%;padding: 1% 4%;margin-top: 6px;font-size: 16px;border: 1px solid #aaa;}
input:focus, textarea:focus {
outline-color:#e00;
}
.modalform {text-align:center;}
.small, .small a {font-size: 11px;margin-top: 0;}
.btn:disabled {background-color: #ccc;}
#agreeCheckbox {height: 22px;width: 22px;float: left;margin: 0 6px;}
/*Modal Fin*/
.bottom-foot {background: #000;padding: 25px 0;color: #eee;text-align: center;font-size: .9em;}
table {
	width: 100%;
	border: none;
	margin-bottom: 20px;
	border-collapse: separate;
border-radius: 2rem;
	margin: 2rem 0;
background: #f6f8fa;
}
table thead th {
	font-weight: bold;
	text-align: left;
	border: none;
	padding: 0.8rem;
	background: #EDEDED;

}
td {border: 1px solid #d9dee3;}
tr th:first-child {
	border-radius: 1rem 0 0 0;
}
tr th:last-child {
	border-radius: 0 1rem 0 0;
}
td {
	text-align: left;
	padding: 1rem 1.5rem;

	vertical-align: top;
}
table tbody tr:nth-child(even) {
	background: #fff;
}
table tbody tr:nth-child(even) p {color: #fff;}

table tbody tr:last-child td:first-child {
	border-radius: 0 0 0 1rem;
}
table tbody tr:last-child td:last-child {
	border-radius: 0 0 1rem 0;
}
table p {padding:0; margin:0;}
.bord1 {border-radius: 2rem 0 0 0;}
.bord2 {border-radius: 0 2rem 0 0;}
.myimg {max-width:100%; height:auto;}


@media (max-width: 1600px) {
.grid3 h3 {font-size: 1.4rem;}


}

@media (max-width: 1500px) {


}

@media (max-width: 1400px) {
.grid3 h3 {font-size: 1.25rem;}

}

@media (max-width: 1300px) {
.grid-prim {grid-template-columns: repeat(2, 1fr);}


}

@media (max-width: 1200px) {
h1 {font-size: 6rem;}
.toptext p {line-height: 1.2;}
h2, .h2 {font-size: 2rem;}
td {padding: .75rem .5rem;line-height: 1.3;}
body, input, select, optgroup, textarea, a {font-size: 18px;}

}

@media (max-width: 1100px) {
h1 {font-size: 5rem;}
.gridtop {grid-template-columns: repeat(1, 1fr);grid-gap: 0;justify-items: center;}
.grid4 {grid-template-columns: repeat(2, 1fr);grid-gap: 1rem;}
}

@media (max-width: 1000px) {
.toptext p {font-size: 2rem;}
.insect {padding: 30px;}
.subh2 {font-size: 1.7rem;}
}

@media (max-width: 900px) {
h1 {font-size: 4rem;}
.grid2, .grid3 {grid-template-columns: repeat(1, 1fr);grid-gap: 1rem;}
.grid-prim {grid-template-columns: repeat(1, 1fr);}
.grid-tara {grid-template-columns: repeat(3, 1fr);grid-gap: 1rem;}
h2, .h2 {font-size: 2rem;}
.subh2 {font-size: 1.5rem;}
table {font-size: 17px;}
}



@media (max-width: 800px){
.logo-img {width: 34px;height: 44px;}
.inhead {padding: 0 20px;}
.h4 {font-size: 1rem;}
.table-wrap {max-width: 800px;width: 100%;overflow: auto;}
}


@media (max-width: 700px) {
.toptel span {display:none;}
.grid-tara {grid-template-columns: repeat(1, 1fr);grid-gap: 1rem;}
.m-top-4 {margin-top: 1rem;}
.grid3 {margin: 0;}
h1 {font-size: 3rem;}
.toptext p {font-size: 1.75rem;}
.grid4 {grid-template-columns: repeat(1, 1fr);grid-gap: 1rem;justify-items: center;}
}

@media (max-width:800px) and (orientation: landscape){

}

@media (max-width:600px){
header, .headfix {height: 60px;}
h1 {font-size: 40px;}
.toptext p {font-size: 24px;}
h1 span {font-size: 1.5em;}
.butflex {flex-direction: column;}
}

@media (max-width:500px){
h1 {font-size: 36px;}
.toptext p {font-size: 24px;}
h2, .h2 {font-size: 1.75rem;}
h3, .h3 {font-size: 1.6rem;}
.grid3 h3 {font-size: 1.1rem;}
.subh2 {font-size: 1.4rem;}
}

@media (max-width:425px) {
.logo-img {display:none;}
.inhead {justify-content: center;padding: 0 10px;}
.mess-img {padding: 0 0 0 5px;}	
h2, .h2 {font-size: 1.5rem;}
.subh2 {font-size: 1.3rem;}
}


@media (max-width:400px){
h1 {font-size: 32px;}
.toptext p {font-size: 22px;}

}

@media (max-width:360px) {
.toptel, .toptel a {font-size: 16px;}
.mess-img {padding: 0 0 0 2px;height: 40px;}	
}