@charset "UTF-8";
body {
  font-family: 'PT Root UI'; font-weight: 300;
  margin: 0 auto;
  padding: 0;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  min-height: 2000px;
}

/*BOOT STYLE*/
.form-check-input:checked {background-color: #000;border-color: #000;border-top-color: rgb(0, 0, 0);border-right-color: rgb(0, 0, 0);border-bottom-color: rgb(0, 0, 0);border-left-color: rgb(0, 0, 0);}
.form-check {font-size: 14px;}
p {margin-bottom: 0;}
.offcanvas-body a {font-size: 20px;  color: #000; text-decoration: none;line-height: 2;padding-left: 35px;}
.offcanvas-body a:hover {color:#e20613;}
.card-text {padding-bottom: 10px;}
.product {position: relative;}
.img-fluid {position: sticky;left: 0;top: 80px;}
.modal-header { align-items: normal !important;}
.card-body li {list-style-type:none;}
.card-body img {width: 100%; max-width: 150px;}
.product p {padding-bottom: 10px;}
.btn-check:checked + .btn-outline-primary {
    color: #000 !important;
    background-color: #fff;
    border-color: #fff;
}

.btn-outline-primary {
    color: #fff !important;
    border-color: #fff !important;
}

.btn-outline-primary:hover, .btn-outline-primary:active {
    font-weight: 500; 
    background-color: #e20613;
    border-color: #e20613;
}


/*STATIC STYLE*/
.dashed {border-bottom: 1px dashed;}
img {width: 100%;}
.gray {filter: grayscale(100%);}
.clearfix {clear: both;}
.mw-300 {max-width: 300px;}
.font300 { font-family: 'PT Root UI'; font-weight: 300;}
.font400 { font-family: 'PT Root UI'; font-weight: 400;}
.font500 { font-family: 'PT Root UI'; font-weight: 500;}
.font700 { font-family: 'PT Root UI'; font-weight: 700;}
.none {text-decoration: none; color: #000;}
.sm1920 {max-width: 1920px;}
.sm1700 {max-width: 1700px;}
h1 {font-size: 30px;font-family: 'PT Root UI';font-weight: 400;text-transform: uppercase;}
h2 {font-size: 20px;font-family: 'PT Root UI';font-weight: 400;text-transform: uppercase; text-align: left;}
h3 {font-size: 18px;font-family: 'PT Root UI';font-weight: 400;}

/*TAMPLATE STYLE*/
.greenes {background: #15a904;color: #fff;padding: 5px;margin: 5px;font-size: 16px;}
.redes {background: #e20613;color: #fff;padding: 5px;margin: 5px;font-size: 16px;}
.calc {background-color: #e20613; margin: 0 auto; /*background-image: url(../images/fon-calc.png);background-repeat: repeat;background-size: inherit;*/}

.calc img {width: 100%;}
.calc p {font-size: 18px;color: #fff;}

.calc .gl-h2, .calc .form-check-label  , .calc .none, hr {color: #fff !important;}
.calc .calc-image p {
padding: 10px;
text-align: center;
line-height: 1;
font-size: 18px;
color: #fff;
}
.product-zakaz {padding-bottom:1%;}
.product-zakaz  span {cursor:pointer; }
.product-zakaz  .number{margin:100px 30%;}
.product-zakaz  .minus, .product-zakaz  .plus{
  width:10px;
  height:10px;
background: #fff;
border-radius: 4px;
padding: 3px 10px 3px 10px;
border: 1px solid #fff;
color: #000;
}
.product-zakaz  input{
  height:24px;
  border:1px solid #ddd;
  border-radius:4px;
  padding:0 2px;
  text-align: center;
}
.border-px {border: 1px solid #ececec; padding: 5px;border-radius: 15px;}



.sp_red {background-color: #e20613;padding: 5px;color: #fff;font-weight: 500;font-size: 35px; line-height: 2;}
.sm_header {position: fixed;background: #fff;width: 100%;padding-bottom: 5px;box-shadow: 0px 5px 20px 5px rgba(155, 155, 155, 0.2);z-index: 9;}
.sm_header a {color: #000; padding: 0 10px;}
.sm_icon {float: right; text-align: right;display: contents;}
.sm_logo {padding: 5px 0px 0px 5px;}
.sm_logo img {width: auto; max-height: 70px;}
.sm_menu, .sm_phone, .sm_wapp, .sm_email {background: #fff;border: none;display: inline-flex; text-decoration: none;}
.img_menu, .img_phone, .img_wapp, .img_email {height: 35px;padding-left: 50px; text-align:left;line-height: 1;font-size: 14px; position: relative;}
.img_svid img {width: 100%; max-width: 450px;}
.img_email::before, .img_menu::before, .img_phone::before, .img_wapp::before{width: 40px;height: 40px;content: '';position: absolute;left: 0;top: 0;border-radius: 50px;}
.img_email::before {border: 1px solid #000; background: url(../images/email.svg);background-size: 65%;background-position: center;background-repeat: no-repeat;}
.img_menu::before {border: 1px solid #000; background: url(../images/burger.svg);background-size: 65%;background-position: center;background-repeat: no-repeat;}
.img_phone::before {background-color: #e41125; background-image: url(../images/phone.svg);background-size: 50%;background-position: center;background-repeat: no-repeat;}
.img_wapp::before {background-color: #67C15E; background-image: url(../images/wapp.svg);background-size: 75%;background-position: center;background-repeat: no-repeat;}
.img_text1{font-size: 20px; line-height: 1.3; text-align: center;}
.img_text2 {font-size: 14px; line-height: 1;text-align: center;}


.gl_fon {margin: 0 auto;width: 100%;max-width: 1920px;background-color: #fff;background-image:url(../images/fon_glav.jpg);background-repeat: no-repeat;background-size: cover;background-position: right; height: 800px;}
.marketing {margin: 0 auto;position: relative;  height: 600px;}
.marketing-text {position: absolute;top: 50%;left: 0;max-width: 700px;background: #00000096;padding: 40px 25px;color: #fff !important;}
h1 {font-size: 30px;font-family: 'PT Root UI';font-weight: 300;text-transform: uppercase;}
.marketing-text li {font-size: 24px;font-family: 'PT Root UI';font-weight: 300;}
.marketing-text ul >li, .marketing-text a {transform: translateX(-300%);}
.marketing-text ul>li:nth-child(1) {animation: ani 1.5s ease-in-out forwards;}
.marketing-text ul>li:nth-child(2) {animation: ani 1.5s forwards 0.5s;}
.marketing-text ul>li:nth-child(3) {animation: ani 1.5s forwards 1s;}
.marketing-text ul>li:nth-child(4) {animation: ani 1.5s forwards 1.5s;}
.marketing-text ul>li:nth-child(5) {animation: ani 1.5s forwards 2s;}
.marketing-text a {animation: ani 1.5s forwards 2.5s;}
@keyframes ani {
  0% {transform: translateX(-300%);}
  15% {transform: translateX(5%);}
  30% {transform: translateX(-5%);}
  45% {transform: translateX(3%);}
  60% {transform: translateX(-3%);}
  75% {transform: translateX(1%);}
  85% {transform: translateX(-1%);}
  100% {transform: translateX(0);}
}

.custom-btn {
   -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    text-align: center;
    cursor: pointer;
    overflow: hidden;
    -webkit-transition: ease 0.3s;
    transition: ease 0.3s;
    z-index: 0;
    width: 100%;
}

.custom-btn:after {
    content: "";
    display: block;
    width: 30px;
    height: 300px;
    margin-left: 60px;
    background: #fff;
    background: -moz-linear-gradient(top, rgba(255,255,255,0.7) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0.7) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0.7) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0.7) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0.7) 0%,rgba(255,255,255,1) 50%,rgba(255,255,255,0.7) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3ffffff', endColorstr='#b3ffffff',GradientType=0 );
    position: absolute;
    left: -40px;
    top: -150px;
    z-index: 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all 0.1s;
    transition: all 0.1s;
    -webkit-animation-name: slideme;
    animation-name: slideme;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-delay: 0.05s;
    animation-delay: 0.05s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
}
@-webkit-keyframes slideme {
    0% { left: -30px; margin-left: 0px; }
    30% { left: 110%; margin-left: 80px; }
    100% { left: 110%; margin-left: 80px; } 
}
.btn-sm {color: #000;font-size: 18px !important;border-radius: 50px;width: 100%; border: 1px solid #7b7b7b;}
.btn-sm:hover {background-color: #e20613;color: #fff;}
.btn-sm1 {color: #fff;font-size: 18px !important;border-radius: 50px;width: 100%; border: 1px solid #7b7b7b;}
.btn-sm1:hover {background-color: #e20613;color: #fff;}
.btn-sm2 {color: #fff;font-size: 18px !important;border-radius: 50px;width: 100%; background-color: #e20613;}
.btn-sm2:hover {background-color: #fff;color: #000; border: 1px solid #7b7b7b;}
.btn-sm3 {color: #fff;font-size: 18px !important;border-radius: 50px;width: 100%; border: 1px solid #fff;}
.btn-sm3:hover {color: #fff;  border: 1px solid #fff; box-shadow:0 0 10px #fff;}

.sm_manager img {width: 100%;}
.footer {background: #f4f4f4;}
.footer form {width: 90%;}

@media (max-width: 1500px) {
  .sm_logo {padding-left: 10px;}
    .marketing {height: 500px;}
    .marketing-text {top: 40%;
  }
@media (max-width: 1300px) {
 .sm_icon p {display: none; visibility: hidden;}
  }
@media (max-width: 992px) {
.footer form {width: 100%;}
}
@media (max-width: 700px) {
  .marketing {height: 400px;}
  h1, h2  {font-size: 20px;}
  h3  {font-size: 16px;}
  .sm_header a {padding: 0 5px;}
  .marketing-text li {font-size: 18px;}
}
@media (max-width: 550px) {
  .gl_fon {height: 500px;}
  .btn-sm,.btn-sm1,.btn-sm2,.btn-sm3 {font-size: 14px !important;}
  .card-body ul {padding-left: 0;}
  h1, h2 {font-size: 16px;}
  .marketing-text li {font-size: 14px;}
  .sm_logo img {max-height: 40px;}
  .img_menu::before, .img_phone::before, .img_wapp::before , .img_email::before {width: 30px;height: 30px;}
  .img_menu, .img_phone, .img_wapp, .img_email {height: 25px;padding-left: 30px;}
  .sm_header a { padding: 0 2px;}
}
@media (max-width: 302px) {
.img_email {display: none;}
}