*{
	margin: 0;
	padding: 0;
    max-width: 100%;
    font-family: 'Open Sans', sans-serif;
}
@media (min-width: 320px) and (max-width: 576px){

     .logo{
    width: 200px;
    display: block;
    margin-top: 5%;
    float: left;
    margin-left: 5%;
    }
    .#logo-foot {
    width: 100%;
}
    .header {
  height: 65px;
  background-color: black;
  position: relative;
    width: 100%;
}
    .board_icon{
        display: none;
    }
    #down{
        margin-top: 40vh;
    }
    #kostyl1{
        margin-top: 5%;
    }
.nav {
  width: 100%;
  box-shadow: inset 0 5px rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 100;
  display: none;
  margin-top: 6%;
}
.nav__item {
  display: block;
  height: 130px;
  font-weight: bold;
  color: orange;
  font-size: 14px;
  line-height: 135px;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  background-color: black;
  transition: background-color 0.1s linear, color 0.1s linear;
}
.nav__item:not(:first-of-type) {
  border-top: 1px solid black;
}
.nav__item:not(:last-of-type) {
  border-bottom: 1px solid black;
}
.nav__item:last-of-type {
  box-shadow: inset 0 -5px 10px -5px rgba(0, 0, 0, 0.4);
}
.nav__item:hover {
  background-color: gray;
}
.nav__item:active {
  background-color: #cf9f24;
  color: #fff;
}
.nav-burger {
  display: block;
  width: 25px;
  height: 23px;
  cursor: pointer;
  color: transparent;
  font-size: 0;
  background: url("images/icon-menu.svg") no-repeat;
  position: absolute;
  /* top: 16px; */
  right: 20px;
  z-index: 1;
}
.nav-burger__checkbox {
  display: none;
}
.nav-burger__checkbox:checked + .nav-burger {
  background-image: url("images/icon-cross.svg");
}
.nav-burger__checkbox:checked ~ .nav {
  display: block;
}
    .text{
        font-size: 0.9em;
    }
    .about_us{
        height: auto;
    }
    .about_us h1{
        text-align: center;
        padding-top: 3%;
    }
    .about_us p{
        margin-top: 3%;
        margin-left: 3%;
        margin-right: 3%;
        text-align: justify;
    }
    .features{
        /*! margin-top: 10%; */
        width: 100%;
        display: inline-block;
        
    }
    .field{
    margin: 0 auto;
    height: auto;
    width: 280px;
    }
    .quadrat{
        display: none;
    }
    #safe_car{
        margin: 0 auto;
        margin-top: 10%;
        width: 300px;
    }
          .character{
        color: orange;
        margin-top: 4%;
        margin-left: 31%;
        display: block;
        text-align: left;
        width: 73%;
    }
    .safety img{
        float: left;
        /*! margin-top: -2%; */
    }
    .quality img{
        float: left;
        margin-top: 1%;
        
    }
    .uniq img{
        float: left;
        margin-top: 3%;    
        width: 15%;
    }
    .garant img{
        float: left;
        margin-top: 7%;
    }
    .garant{
        margin-top: 0%;
    }
    .size img{
        float: left;
        margin-top: 3%;
        width: 15%;
    }
    .size{
        margin-top: 5%;
    }
    .quality{
        margin-top: 5%;
    }
    .uniq{
        margin-top: 5%;
    }
    #complect{
        height: auto;
}
        #complect h1{
    letter-spacing: 2px;
}
    .description{
        display: none;
    }
    #complect h2{
        text-align: center;
    }
    #good{
        width: 80%;
        height: auto;
    }
    #good h2{
        margin-top: 15%
    }
        .pan-model{
        width: 100%;
        height: auto;
    }
    .pan-model p{
        width: 100%;
        padding-bottom: 4%;
    }
    .pan-model img{
        /* max-width: 256px; */
        margin: 0 auto;
        display: block;
    }
    .modal__trigger {
display: block;
   width: 50%;
        padding: 0.5rem 2.4rem;
    }
    #accessory{
    height: auto;
    text-align: center;
}

    .things{
        width: 200px;
        height: 200px;
        margin: 0 auto;
        display: block;
        margin-top: 5%;
    }
    footer{
        margin-top: 10%;
    }
        #requisites h1{
        text-align: center;
    }

    .cont{
    margin: 0 auto;
    height: auto;
    width: 248px;
    }
    .cont h1{
        text-align: center;
    }
    .connect{
        margin-top: 10%;
        width: 100%;
        display: inline-block;
    }
    .connect img{
        float: left;
    }
    .point{
        margin-left: 2%;
    }
    .content {
  width: 800px;
  margin: 20px auto;
  z-index: 20;
}
.post {
  background: #F5F5F5;
  width: 100%;
  /*! padding: 20px; */
  float: left;
}
.description {
  color: #252736;
  font-size: 16px;
  line-height: 18px;
  margin-top: 10px;
}
/* Форма обратной связи */
#inline {
margin-left: 30px;
    width: 80%;
    margin: 0 auto;
    background: #fff;
    padding: 10px 20px;
}
.txt {
    display: inline-block;
    color: #676767;
    width: 202px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    margin-right: 5%;
}
.txtarea {
    display: inline-block;
    color: #676767;
    width: 617px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    height: 25px;
}
.txt:focus, .txtarea:focus {
 border-style: solid; 
 border-color: #bababa; 
 color: #444; 
 }
input.error, textarea.error { 
    border-color: #973d3d; 
    border-style: solid; 
    background: #f0bebe; 
    color: #a35959; 
    }
input.error:focus, textarea.error:focus { 
    border-color: #973d3d; 
    color: #a35959;
     }
#send {
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
    margin: 0 auto;
}
    .cont{
        margin: 0 auto;
    }
    .composition{
        margin-top: 3%;
    }
    .composition p{
        color: white;
    }
    #blok img{
        max-width: 90px;
        margin: 0 auto;
    }
    #ri-1 img{
         max-width: 250px;
        margin: 0 auto;
    }
    #ps-330 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #metka img{
        max-width: 250px;
        margin: 0 auto;
    }
    #bt-01 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #d-030 p{
        text-align: justify;
    }
    .rights{
    width: 100%;
    height: auto;
    float: left;
}
.info{
    float: left;
    height: auto;
}
.logo-down{
    height: auto;
    width: 100%;
    float: left;
    margin-top: 3%;
    margin-bottom: 3%;
}
#logo-foot{
    width: 100%;
    }
#logo-foot img {
        width: 250px;
        display: block;
        margin: 0 auto;
    }

#info-text{
   width: 100%;
   height: inherit;
   margin-bottom: 5%;
   text-align: justify;
}
    #info-text p{
        width: 90%;
        margin: 0 auto
    }
}

@media (min-width: 577px) and (max-width: 768px){
     
       .logo{
    width: 200px;
    display: block;
    margin-top: 4%;
    float: left;
    margin-left: 5%;
    }
    .header {
  height: 65px;
  background-color: black;
  position: relative;
    width: 100%;
    }
   #kostyl1{
        margin-top: 1%;
    }
    .board_icon{
        display: none;
    }
    #down{
        margin-top:100px;
    }
.nav {
  width: 100%;
  box-shadow: inset 0 5px rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 100;
  display: none;
  margin-top: 7%;
}
.nav__item {
  display: block;
  height: 140px;
  font-weight: bold;
  /*! color: orange; */
  font-size: 16px;
  line-height: 156px;
  text-align: center;
  text-transform: uppercase;
  text-decoration: none;
  background-color: black;
  transition: background-color 0.1s linear, color 0.1s linear;
}
.nav__item:not(:first-of-type) {
  border-top: 1px solid black;
}
.nav__item:not(:last-of-type) {
  border-bottom: 1px solid black;
}
.nav__item:last-of-type {
  box-shadow: inset 0 -5px 10px -5px rgba(0, 0, 0, 0.4);
}
.nav__item:hover {
  background-color: gray;
}
.nav__item:active {
  background-color: orange;
  color: #fff;
}
.nav-burger {
  display: block;
  width: 25px;
  height: 23px;
  cursor: pointer;
  color: transparent;
  font-size: 0;
  background: url("images/icon-menu.svg") no-repeat;
  position: absolute;
  top: 16px;
  right: 20px;
  z-index: 1;
}
.nav-burger__checkbox {
  display: none;
}
.nav-burger__checkbox:checked + .nav-burger {
  background-image: url("images/icon-cross.svg");
}
.nav-burger__checkbox:checked ~ .nav {
  display: block;
}
.nav__item:checked ~ .nav {
  display: block;
}
    .text{
        font-size: 2.8vh;
    }
    .about_us{
        height: auto;
    }
    
    .about_us h1{
        text-align: center;
        padding-top: 3%;
    }
    .about_us p{
        margin-top: 3%;
        margin-left: 3%;
        margin-right: 3%;
        text-align: justify;
        line-height: 1.5;
    }
    .character{
        color: orange;
        text-align: center;

    }
     .features{
        /*! margin-top: 5%; */
        width: 100%;
        display: inline-block;
        
        height: 90px;
        vertical-align: middle;
    }
    .field{
    margin: 0 auto;
    height: auto;
    width: 280px;
    }
    .quadrat{
        display: none;
    }
    #safe_car{
        margin: 0 auto;
        margin-top: 10%;
        width: 300px;
    }
        .character{
        color: orange;
        margin-top: 4%;
        margin-left: 31%;
        display: block;
        text-align: left;
        width: 100%;
    }
    .safety img{
        float: left;
        /*! margin-top: -2%; */
    }
    .quality img{
        float: left;
        margin-top: 1%;
        
    }
    .uniq img{
        float: left;
        margin-top: 3%;    
        width: 15%;
    }
    .garant img{
        float: left;
        margin-top: 7%;
    }
    .garant{
        margin-top: -12%;
    }
    .size img{
        float: left;
        margin-top: 3%;
        width: 15%;
    }
    .quality{
        margin-top: -10%;
    }
    .uniq{
        margin-top: -8%;
    }
     #complect{
        height: auto;
}
    #complect h2{
        text-align: center;
    }
        #complect h1{
    letter-spacing: 2px;
}
    #compl1{
        text-align: center;
    }
    #good{
        width: 80%;
        height: auto;
    }
    #good h2{
        margin-top: 15%
    }
        .pan-model{
        height: auto;
    }
    .pan-model p{
        padding-bottom: 4%;
    }
    .pan-model img{
        /* max-width: 256px; */
        margin: 0 auto;
        display: block;
    }
    .modal__trigger {
display: block;
   width: 50%;
        padding: 0.5rem 2.4rem;
    }
    
    #accessory{
    height: auto;
    text-align: center;
    margin-top: 5%;
}
    .things{
      width: 370px;
    height: auto;
        margin: 0 auto;
        display: inline-block;
        margin: 2%;
    }
    .things p{
    padding-bottom: 4%;
    }
     .cont{
    margin: 0 auto;
    height: auto;
    width: 501px;
    }
    .connect{
        margin-top: 3%;
        display: inline-block;

    }
    .telefon{
    margin-left: 3%;
    float: right;
    width: 39%;
    }
    .pochta{
        width: 50%;
    }
    footer{
        margin-top: 10%;
    }
.content {
  width: 800px;
  margin: 20px auto;
  z-index: 20;
}
.post {
  background: #F5F5F5;
  width: 100%;
  /*! padding: 20px; */
  float: left;
}
.description {
  font-size: 16px;
  line-height: 1.5;
  margin-top: 10px;
  width: 86%
}
    .composition{
        width: 100%;
        margin-top: 10%
        
    }
       #blok img{
        max-width: 90px;
        margin: 0 auto;
    }
    .composition img{
        width: 200px;
        margin: 0 auto;
        
    }
    #ri-1 p{
        width: 90%;
        font-size
    }

/* Форма обратной связи */
#inline {
    margin-left: 30px;
    width: 57%;
    margin: 0 auto;
    background: #fff;
    /*! padding: 10px 20px; */
    }
.txt {
    display: inline-block;
    color: #676767;
    width: 300px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
}
.txtarea {
    display: inline-block;
    color: #676767;
    width: 450px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    height: 25px;
}
.txt:focus, .txtarea:focus {
 border-style: solid; 
 border-color: #bababa; 
 color: #444; 
 }
input.error, textarea.error { 
    border-color: #973d3d; 
    border-style: solid; 
    background: #f0bebe; 
    color: #a35959; 
    }
input.error:focus, textarea.error:focus { 
    border-color: #973d3d; 
    color: #a35959;
     }
#send {
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
    margin: 0 auto;
}
#send:hover {
    background: #979797;
}
/* Форма обратной связи */
     .rights{
    width: 100%;
    height: auto;
    float: left;
}
.info{
    float: left;
    height: auto;
}
.logo-down{
    height: auto;
    width: 100%;
    float: left;
    /* margin-top: 0%; */
    /* margin-bottom: 0%; */
}
#logo-foot{
    width: 100%;
    }
#logo-foot img {
        width: 250px;
        display: block;
        margin: 0 auto;
    }

#info-text{
   width: 100%;
   height: inherit;
   /* margin-bottom: 5%; */
   text-align: justify;
}
    #info-text p{
        width: 90%;
        margin: 0 auto
    }
}
 
@media (min-width: 769px) and (max-width: 992px) {
      .logo{
        width: 40%;
    display: block;
    padding: 3%; 
        margin: 0 auto;
    }
    .nav{
    background-color: black;
        width: 100%;
        text-align: center;
        height: 70px;
        font-size: 100%;
        margin-top: -2%;
}
    .nav__item{
        display: inline-block;
        text-align: center;
        width: 24.5%;
        margin-top: 3vh;
    }
    .board_icon{
    width: 9%;
    min-width: 6%;
}
.board_icon a{
    color: white;
    text-align: center;
    text-decoration: none;
    display: block;
}
    .board_icon img{
        max-width: 36%;
        margin-top: 39vh;
    }
     .about_us{
        height: auto;
    }
    .about_us h1{
        text-align: center;
        padding-top: 3%;
    }
    #text1{
        margin-top: 3%;
        margin-left: 3%;
        margin-right: 3%;
        text-align: justify;
        width:  60%;
        float: left;
    }
    #text2{
    margin-top: 3%;
    margin-left: 3%;
    margin-right: 3%;
    text-align: justify;
    width: 94%;
    float: left;
    margin-bottom: 3%;
    }
    .character{
        color: orange;
        text-align: center;
        font-size: 17px;
    }
    .features img{
        width: 25%;
        display: block;
        margin: 0 auto;
    }
    
    .features{
        display: inline-block;
        width: 19%;
        height: 125px;
        vertical-align: bottom;
    }
    .quadrat{
    width: 200px;
    height: 200px;
         left: 68%;
    top: -30px;
    }
     #safe_car{
       width: 200px;
    }
    .field{
        width: 814px;
        margin: 0 auto;
        margin-top: 35%;
    }
    #good{
        width: 95%;
        height: 430px;
    }
    #good h2{
        margin-top: 15%
    }
.description {
  font-size: 16px;
  line-height: 1.5;
  margin-top: 10px;
  width: 77%;
  height: 70px;
}
        #compl1{
        text-align: center;
    }

           .pan-model{
     width: 47%;
    }
    #pandect-profi-plus{
        margin-left: 5%;
    }
.pan-model p {
    padding-bottom: 4%;
    }
    .modal__trigger {
display: block;
   width: 50%;
        padding: 0.5rem 2.4rem;
    }
  #accessory{
    height: auto;
    text-align: center;
    margin-top: 6%;
}
     .things{
      width: 460px;
      height: auto;
      margin: 0 auto;
      display: inline-block;
      margin: 2%;
    }
    .things p{
    padding-bottom: 4%;
    }
     .cont{
    margin: 0 auto;
    height: auto;
    width: 501px;
    }
    .connect{
        margin-top: 3%;
        display: inline-block;

    }
    .telefon{
    margin-left: 3%;
    float: right;
    width: 39%;
    }
    .pochta{
        width: 50%;
    }
    footer{
        margin-top: 10%;
    }
.content {
  width: 800px;
  margin: 20px auto;
  z-index: 20;
}
.post {
  background: #F5F5F5;
  width: 100%;
  /*! padding: 20px; */
  float: left;
}


/* Форма обратной связи */
#inline {
    margin-left: 30px;
    width: 65%;
    margin: 0 auto;
    background: #fff;
    /*! padding: 10px 20px; */
    }
.txt {
    display: inline-block;
    color: #676767;
    width: 183px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    margin-left: 55%;
}
.txtarea {
    display: inline-block;
    color: #676767;
    width: 54%;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    height: 25px;
    float: left;
    margin-top: -46px;
}
.txt:focus, .txtarea:focus {
 border-style: solid; 
 border-color: #bababa; 
 color: #444; 
 }
input.error, textarea.error { 
    border-color: #973d3d; 
    border-style: solid; 
    background: #f0bebe; 
    color: #a35959; 
    }
input.error:focus, textarea.error:focus { 
    border-color: #973d3d; 
    color: #a35959;
     }
#send {
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
    margin: 0 auto;
}
#send:hover {
    background: #979797;
}
/* Форма обратной связи */
  .composition{
        margin-top: 3%;
    }
    #blok img{
        max-width: 80px;
        margin: 0 auto;
    }
    #ri-1 img{
         max-width: 250px;
        margin: 0 auto;
    }
    #ps-330 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #metka img{
        max-width: 250px;
        margin: 0 auto;
    }
    #bt-01 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #d-030 p{
        text-align: justify;
    }
    .rights{
    width: 100%;
    height: auto;
    float: left;
}
.info{
    float: left;
}
.logo-down{
    height: auto;
    width: 80%;
    float: left;
    margin-top: 20%;
    margin-left: 10%;
    /* margin: 10%; */
}
#logo-foot{width: 20%;height: inherit;}
#logo-foot img{
}

#info-text{
   width: 80%;
   height: inherit;
}
    

}

@media (min-width: 993px)and (max-width: 1200px)  {
         .logo{
             width: 25%;
             float: left;
             padding-top: 2%;
             margin-left: 10%;
    }
.nav{
        width: 65%;
        text-align: center;
        /*! height: 7%; */
        float: left;
        padding-top: 2%;
        z-index: 100;
}
    .nav__item{
        text-align: center;
        font-size: 24px;
        margin-left: 4%;
    }
      .board_icon{
    width: 6%;
    min-width: 6%;
}
.board_icon a{
    color: white;
    text-align: center;
    text-decoration: none;
    display: block;
}
    .board_icon img{
        max-width: 55%;
        margin-top: 35vh;
    }
         .about_us{
        height: auto;
    }
    .about_us h1{
        text-align: center;
        padding-top: 3%;
    }
    #text1{
        margin-top: 3%;
        margin-left: 3%;
        margin-right: 3%;
        text-align: justify;
        width: 57%;
        float: left;
    }
      #text2{
    margin-top: 3%;
    margin-left: 3%;
    margin-right: 3%;
    text-align: justify;
    width: 94%;
    float: left;
    margin-bottom: 3%;
    }
    .character{
        color: orange;
        /*! padding-left: 10%; */
        text-align: center;
        font-size: 20px;
    }
    .safety img{
        display: block;
        margin: 0 auto;
    }
    .quality img{
        display: block;
        margin: 0 auto;
    }
    .uniq img{
        display: block;
        margin: 0 auto;
    }
    .garant img{
        display: block;
        margin: 0 auto;
    }
    .size img{
        display: block;
        margin: 0 auto;
    }
    .features{
        display: inline-block;
        width: 185px;
        height: 135px;
        vertical-align: bottom;
    }
      .quadrat{
    width: 300px;
    height: 300px;
  left: 68%;
 top: -30px;
    }
     #safe_car{
       width: 300px;
    }
   .field{
        width: 960px;
        margin: 0 auto;
        /* margin-top: 5%; */
    }
    #good{
        width: 75%;
        height: 430px;
    }
    #good h2{
        margin-top: 15%
    }
    .description {
  font-size: 16px;
  line-height: 1.5;
  margin-top: 10px;
  width: 77%;
  height: 70px;
}
        #compl1{
        text-align: center;
    }
        #complect h1{
    letter-spacing: 1px;
}

    .pan-model{
     width: 47%;
    }
    #pandect-profi-plus{
        margin-left: 5%;
    }
.pan-model p {
    padding-bottom: 4%;
    }
    .modal__trigger {
display: block;
   width: 50%;
        padding: 0.5rem 2.4rem;
    }
  #accessory{
    height: 300px;
    text-align: center;
    margin-top: 5%;
}
    .things{
        width: 175px;
        height: 175px;
        margin: 0 auto;
        display: inline-block;
        margin: 1%;
        box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1);
    }
    #requisites {
    width: 846px;
    margin: 0 auto;
}
   .cont{
    height: 71px;
    width: 625px;
    float: left;
    margin-top: 41px;
    margin-left: 10%;
    }
    .connect{
        margin-top: 3%;
        display: inline-block;
        margin-right: ;
    }
.telefon {
    margin-left: 3%;
    float: right;
    width: 27%;
    }
    .pochta{
        width: 41%;
    }
    
    footer h1{
    width: 16%;
    /*! margin-left: 11%; */
    padding-top: 54px;
    display: block;
    float: left;
    }
    .content {
  width: 100%;
  margin: 20px auto;
  z-index: 20;
}
.post {
  background: #F5F5F5;
  width: 100%;
  /*! padding: 20px; */
  float: left;
  margin-top: 5%;
}

/* Форма обратной связи */
#inline {
margin-left: 30px;
    width: 844px;
    margin: 0 auto;
    background: #fff;
    /*! padding: 10px 20px; */
}
.txt { 
    display: inline-block;
    color: #676767;
    width: 190px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    margin-left: 77%;
    float: left;
}
.txtarea { 
    display: inline-block;
    color: #676767;
    width: 570px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    height: 26px;
    margin-top: -5.81%;
    float: left;
}
.txt:focus, .txtarea:focus {
 border-style: solid; 
 border-color: #bababa; 
 color: #444; 
 }
input.error, textarea.error { 
    border-color: #973d3d; 
    border-style: solid; 
    background: #f0bebe; 
    color: #a35959; 
    }
input.error:focus, textarea.error:focus { 
    border-color: #973d3d; 
    color: #a35959;
     }
#send { 
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
}
#send:hover {
    background: #979797;
}
/* Форма обратной связи */
  .composition{
        margin-top: 3%;
    }
    #blok img{
        max-width: 95px;
        margin: 0 auto;
    }
    #ri-1 img{
         max-width: 250px;
        margin: 0 auto;
    }
    #ps-330 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #metka img{
        max-width: 250px;
        margin: 0 auto;
    }
    #bt-01 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #d-030 p{
        text-align: justify;
    }
        #kostyl3{
        display: inline-block;
        margin: 1%;
    }
   .rights{
    width: 100%;
    height: auto;
    float: left;
}
.info{
    float: left;
}
.logo-down{
    height: 54px;
    width: 80%;
    float: left;
    margin-top: 16%;
    margin-left: 10%;
    /* margin: 10%; */
}
#logo-foot{width: 20%;height: 86px;}
#logo-foot img{
}

#info-text{
   width: 80%;
   height: inherit;
}
    
}

@media (min-width: 1201px) {
    .header{
        height: auto;
    }
    .logo{
             width: 24%;
             float: left;
            padding-top:1%;
             /*! padding-left: 1%; */
             margin-left: 10%;
             padding-bottom: 1%;
    }
    .nav{
        width: 66%;
        text-align: center;
        float: left;
        padding-top: 1%;
        padding-bottom: 1%;
}
    .nav__item{
        text-align: center;
        font-size: 27px;
        margin-left: 5%;
    }
       .board_icon{
    width: 20%;
    min-width: 6%;
}
    .board_icon p{
        
font-size: 80%;
    }
.board_icon a{
    color: white;
    text-align: center;
    text-decoration: none;
    display: block;
    font-size: 2em;
}
    .board_icon img{
        max-width: 9%;
        margin-top: 45vh;
    }
            .about_us{
        height: auto;
    }
    .about_us h1{
        text-align: center;
        padding-top: 3%;
    }
    #text1{
        margin-top: 3%;
        margin-left: 10%;
        /*! margin-right: 3%; */
        text-align: justify;
        width:  45%;
        float: left;
        line-height: 2;
    }
     #text2{
        margin-top: 3%;
        margin-left: 10%;
        margin-bottom: 3%;
        text-align: justify;
        width:  80%;
        float: left;
        line-height: 2;
    }
    .character{
        color: orange;
        text-align: center;
    }
    .safety img{
        display: block;
        margin: 0 auto;
    }
    .quality img{
        display: block;
        margin: 0 auto;
    }
    .uniq img{
        display: block;
        margin: 0 auto;
    }
    .garant{
        margin-top: 2%;
    }
    .garant img{
        display: block;
        margin: 0 auto;
    }
    .size img{
        display: block;
        margin: 0 auto;
        width: 48px;
        margin-bottom: 1%;
    }
    .features{
        display: inline-block;
        width: 19%;
        height: 135px;
        vertical-align: bottom;
    }
        .quadrat{
    width: 300px;
    height: 300px;
  left: 64%;
     top: -34px;
    }
     #safe_car{
       width: 300px;
       left: 7%;
    }
  .field{
        width: 85%;
        margin: 0 auto;
        margin-top: 13%;
        position: relative;
    }
     #good{
        width: 75%;
        height: 430px;
    }
    #good h2{
        margin-top: 15%
    }
    .description {
  line-height: 1.5;
  margin-top: 10px;
  width: 77%;
  height: 70px;
}
        #compl1{
        text-align: center;
    }
        #complect h1{
    letter-spacing: 2px;
}

    .pan-model{
     width: 47%;
    }
    .pan-model img{
        margin: 0 auto;
        display: block;
        min-width: 100%;
    }
    #pandect-profi-plus{
        margin-left: 5%;
    }
.pan-model p {
    padding-bottom: 3%;
    }
    .modal__trigger {
        display: block;
        width: 50%;
        padding: 0.5rem 2.4rem;
        
    }
  #accessory{
    height: auto;
    text-align: center;
    margin-top: 5%;
}
      .things{
        width: 210px;
        height: 210px;
        margin: 0 auto;
        display: inline-block;
        margin: 1%;
        box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1);
    }
 .cont{
    /*! margin: 0 auto; */
    height: 71px;
    width: 625px;
    float: left;
    margin-top: 41px;
    margin-left: 10%;
    }
    .connect{
        margin-top: 3%;
        /*! width: 48%; */
        display: inline-block;
        margin-right: ;
    }
    .telefon{
        margin-left: 3%;
        float: right;
        width: 27%;
    }
    footer h1{
        /*! width: 13%; */
        /*! margin-left: 17%; */
        padding-top: 54px;
        display: block;
        float: left;
    }
    .content {
  width: 100%;
  margin: 20px auto;
  z-index: 20;
}
.post {
  background: #F5F5F5;
  width: 100%;
  /*! padding: 20px; */
  float: left;
  margin-top: 5%;
}
.description {
  font-size: 16px;
  line-height: 18px;
  margin-top: 10px;
}


    #requisites{
        
    width: 867px;
    margin: 0 auto;
    }
    .pochta{
    width: 41%;
    }
    .telefon{
        
    }

/* Форма обратной связи */
#inline {
margin-left: 30px;
    width: 865px;
    margin: 0 auto;
    background: #fff;
    /*! padding: 10px 20px; */
}
.txt { 
    display: inline-block;
    color: #676767;
    width: 190px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    margin-left: 77%;
    float: left;
}
.txtarea { 
    display: inline-block;
    color: #676767;
    width: 563px;
    margin-bottom: 10px;
    border: 1px solid #ccc;
    padding: 5px 9px;
    font-size: 15px!important;
    line-height: 1.4em;
    height: 26px;
    margin-top: -5.81%;
    float: left;
}
.txt:focus, .txtarea:focus {
 border-style: solid; 
 border-color: #bababa; 
 color: #444; 
 }
input.error, textarea.error { 
    border-color: #973d3d; 
    border-style: solid; 
    background: #f0bebe; 
    color: #a35959; 
    }
input.error:focus, textarea.error:focus { 
    border-color: #973d3d; 
    color: #a35959;
     }
#send { 
    color: #FFFFFF;
    display: block;
    cursor: pointer;
    padding: 5px 11px;
    font-size: 1.2em;
    border: solid 1px #F9F9F9;
    border-radius: 2px;
    background: #70C6B9;
    width: 210px;
    margin-bottom: 20px;
}
#send:hover {
    background: #979797;
}
/* Форма обратной связи */
  .composition{
        margin-top: 3%;
    }
    #blok img{
        max-width: 80px;
        margin: 0 auto;
    }
    #ri-1 img{
         max-width: 250px;
        margin: 0 auto;
    }
    #ps-330 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #metka img{
        max-width: 250px;
        margin: 0 auto;
    }
    #bt-01 img{
        max-width: 250px;
        margin: 0 auto;
    }
    #d-030 p{
        text-align: justify;
    }
    #kostyl3{
        display: inline-block;
        margin: 1%;
    }
    .rights{
    width: 100%;
    height: auto;
    float: left;
}
.info{
    float: left;
    height: auto;
}
.logo-down{
    height: auto;
    width: 80%;
    float: left;
    /* padding-top: 2%; */
    margin-left: 10%;
    /*! margin: 10%; */
}
#logo-foot{
width: 20%;
margin-top: 3.5%;
}
#logo-foot img{
}

#info-text{
   width: 80%;
   height: inherit;
}
    #info-text p{
        width: 90%;
        text-align: justify
    }
}
.header{
    position: fixed;
    width: 100%;
    background-color: black;
    z-index: 100;
}
.start_screen{
    width: 100%;
    height: 100vh;
    background: url(images/Car.jpg) center;
    background-size: cover;
    background-color: #cf9f24;
}
 #slogan{
    color: white;
    text-transform: uppercase;
    line-height: 6vh;
    font-size: 4vh;
   	margin-left: 10%;
    padding-top: 24vh;
}
.board_icon{
    overflow: hidden;
    margin: 0 auto;
}
label{
    display: none;
}
input{
    display: none;
}
.nav{
    float: right;
}
.nav__item{
    text-decoration: none;
    color: #cf9f24;
}
.nav__item:hover {
  background-color: gray;
}
.nav__item:active {
  background-color: orange;
  color: #fff;
}
.nav__item:before{
    opacity: 0;
}
.about_us{
    width: 100%;
    background-color: white;
}
         .about_us h1{
        text-align: center;
        padding-top: 3%;
    }

.challenge{
    width: 100%;
    height: 180px;
    background: url(images/Car3.jpg) center no-repeat;
    background-size: cover;
    margin-top: 5%;
}
.numbers{
    display: inline-block;
    width: 32.4%;
    padding-top: 54px;
}
.count{
    color: orange;
    text-align: center;
}
.text{
    text-align: center;
    color: white;
    font-size: 0.9em;
}
.quadrat{
    border: 5px solid #cf9f24;
    position: absolute;
}
#safe_car{
    position: relative;
    display: block;
    z-index: 1;
}
#complect{
    height: auto; 
}
#complect h2{
    text-align: center;
    margin-top: 3%;
}
#complect h1{
    color: #cf9f24;
    text-align: center;
    margin-top: 3%;
}
.price{
    color: lightgray;
    text-align: center;
    font-size: 19px;
}
.description{
    color: lightgray;
    margin: 0 auto;
    line-height: 1.5;
}
.composition{
    height: auto;
}
.composition img{
    display: block;
}
.composition h4{
    text-align: center;
    color: #cf9f24
}
    .composition p{
        color: white;
    }
#accessory h2{
    margin-top: 3%;
    margin-bottom: 3%
    
}
#good{
 margin: 0 auto;
height: auto;
}
#good h2{
    text-align: center;
    color:white;
}
.pan-model{
    display: inline-block;
    margin: 0 auto;
    margin-top: 5%;
    background-color: black;
    height: auto;
    /**box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1);**/
}
.things{
background-color: black;
    box-shadow: 0 0 10px 5px rgba(221, 221, 221, 1);
}
.things h3{
    color: #cf9f24;
    margin-bottom: 5%;
    font-size: 16px;
}
footer{background-color: black;width: 100%;color: white;margin-top: 0%;}
.connect img{
    float: left;
}
.post {
    background: black;
    color: white;
    /*! height: 500px; */
    }
#inline {
    background: black;
}
    .txt{
background: black;
border-top: 0;
border-left: 0;
border-right: 0;
        
    }
    .txtarea{
background: black;
border-top: 0;
border-left: 0;
border-right: 0;  
    }
    #send{
    background: black;
border:0;
    }
.point{
    text-decoration: none;
    color: white;display: block;
    margin-top: 2%;
    float: left;
    margin-left: 3%;
}
.modal__acss{
    padding: 0.2rem 1.2rem;
    margin-top: 1%;
}
#map h2{
    text-transform: uppercase;
    padding-top: 3%;
    margin-bottom: 3%;
    text-align: center;
    color: #adadad;
    /* height: 1%; */
}
#map{
    height: auto;
    width: 100%;
    background-color: #333333;
    margin-top: 3%;
}
#video{
    width: 100%;
    background-color: black;
    margin-top: 3%;
}
#video h2{
    color: white;
    text-align: center;
    padding-top: 3%;
    margin-bottom: 1%;
}
#vid-pan{
 position: relative;
    padding-bottom: 36.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
    width: 68%;
    margin: 0 auto;
}
#vid-pan iframe{
    position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.rights{
    background-color: black;
}
.info{
    background-color: black;
    margin-top: 3%;
}
 #info-text p{
        text-align: justify;
     width: 90%;
    }
#info-text{
    margin-bottom: 3%;
}
/**nav.navShadow {
  box-shadow: 0 4px 30px -5px rgba(0, 0, 0, 0.2);
  height: 100px;
}**\