body {
    font-family: 'Open Sans', sans-serif;
 }
 
* { padding: 0; margin: 0;}
iframe {margin:0; padding: 0;}

address {text-decoration:none;}

.vh {
  position: absolute;
  clip: rect(0 0 0 0);
  width: 1px;
  height: 1px;
  margin: -1px;
}

.top_line {
position: relative;
width: 100%;
height: 55px;
background-color: #ffeb33;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
text-align: center;
z-index: 10;
}

.ctr {text-align: center;}
.scf {width: 90%; height: auto;}

.top_line a {
position: relative;
top: 11px;
margin: 0 25px;
font-size: 24px;
color: #000;
text-decoration: none;
text-transform: uppercase;
}

.top_line a:hover {
color: #a19d42;
}

.header_container {
position: relative;
width: 1400px;
margin: 0 auto;
}

.pod_line {
width: 100%;
height: 6px;
background-color: #ffc000;
}

.tm_line {
width: 100%; height: 55px;
background-color: #3a3482;
text-align: center;
}

.tm_line a {
position: relative;
top: 9px;
margin: 0 25px;
font-size: 26px;
color: #fff;
text-decoration: none;
transition-duration: 0.2s;
}

.tm_line a:hover {
color: #807acb;
transition-duration: 0.2s;
}

.m_logo { display: none;}
.m_menu { display: none; width: 45px; height: 100%; position: absolute; top: 0; left: 10px; cursor:pointer;}
.but_line {margin: 5px 0 0 0; width: 100%; height: 4px; background-color:#3a3482;}
.m_menu p {margin:0; text-align: center; font-size: 13px; color: #3a3482; font-weight: 800;}

.header_info {
position: relative;
width: 100%;
height: 300px;
}

.header_info p {
position: relative; top: 160px; left: 7px;
margin: 0;
text-transform: uppercase;
font-size: 28px;
color: #3a3482;
font-weight: 600;
}

.cont {
position: absolute;
bottom: 10px; left: 7px;
width: 100%;
}

.cont li {list-style: none; display: inline;}

.cont a {
font-size: 24px;
margin-right: 20px;
text-decoration: none;
color: #000;
}

.cont a:hover {
color: #999;
}

.prod {
position: absolute;
top: 7px; right: 0;
height: 260px; width: auto;
}

.logo {
position: absolute;
top: 40px;  left: 7px;
height: 100px; width: auto;	
z-index: 2;
}

.logo img {width: auto; height: 100%;}

.tel {height: 24px; width: auto; position: relative; top: 3px; margin-right: 5px;}

.content {
position: relative;
width: 1400px;
margin: 0 auto;
min-height: 300px;
display: flex;
justify-content: space-between;
}

.navigation {
width: 240px;
display: block;
height: auto;
}

.int_navigation {
width: 100%;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
margin: 0;
height: auto;
padding-bottom: 1px;
}

.main_container {
width: 1130px; height: auto;
}

.box_name {
position: relative;
width: 100%;
height: 55px;
background-color: #cecce0;
}

.box_name p {
position: relative; top: 10px; left: 12px;
font-size: 24px;
text-transform: uppercase;
}

.int_navigation li {
list-style: none;
position: relative; top: 0; left: 12px;
font-size: 18px;
margin-top: 12px;
}
.int_navigation li:last-child {margin-bottom: 12px;}

.int_navigation a { color: #000; text-decoration: none; transition-duration: 0.2s;}
.int_navigation a:hover { color: #999; transition-duration: 0.2s;}

.block_line {
width: 100%;
height: auto;
display: grid;
grid-template-columns: auto auto auto;
justify-content: space-between;
}

.info_block {
position: relative;
width: 360px;
height: 385px;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
margin-top: 20px;
}

.info_block span {font-size: 22px; color: #000; position: absolute; bottom: 70px; left: 20px; font-weight: 600;}

.info_block img {width: 100%; height: auto; position: relative; top: 0; left: 0;}
/* background-color: #fcff00; */
.detail {position: absolute; bottom: 20px; left: 20px; font-size: 18px; text-decoration: none; text-transform: uppercase; background-color: #fcff99; color: #a28200; font-weight: 600; padding: 5px 20px;}
.detail:hover {background-color: #eeee99; transition-duration: 0.2s;} 
.info_block img:hover {opacity: 0.5; transition-duration: 0.2s;}

.fon {position: fixed; top: 0; left: 0; background-color: #000; opacity: 0.5; z-index: 1; width: 100%; height:100%; display: none;}
.m_kont {display:none;}

.close {position: fixed; top: 55px; left: 308px;  z-index: 999; cursor: pointer; width: 40px; height: 40px; background-color: #999; border-radius: 20px; border: solid 1px #fff; display:none;}
.close span {color: #fff; font-weight: 400; font-size: 30px; position: absolute; top: -1px; left: 11px; margin:0;}

.for_us {width: 100%; height: auto; min-height: 100px; background-color: #e8e5f4; margin-top: 20px; text-align: center; padding-bottom: 60px;}
.why_us {position: relative; top: 30px; left: 0; color: #000; font-size: 48px; font-weight: 800;}
.w_line {position: relative; top: 30px; margin: 15px auto 0px auto; background-color: #3a3482; width: 320px; height: 6px; }

.w_colo {
width: 100%; height: auto;
display: grid;
grid-template-columns: auto auto auto auto;
justify-content: space-around; }

.colo {margin: 60px auto 0 auto; width: 190px; height: 190px; background-color: #ffee44; background: linear-gradient(#fef579, #ffeb37); border-radius: 90px;}
.colo img {width: 130px; height: auto; margin-top: 30px;}
.colo_line {width: 90px; height: 5px; background-color: #BD9928; margin: 20px auto;}
.colo_p {width: 100%; height: 30px; margin: 20px auto;}
.colo_p {font-size: 16px; font-weight: 800; margin: 0;}

.fut {width: 100%; height: auto; margin:0;}
.fut_line {width: 100%; height: 5px; background-color:#ffd200; margin:0;}
.fut_info_line {width: 100%; height: auto; background-color:#fff463; padding-bottom: 20px;}
.g_fut {
width: 100%; height: auto;
display: grid;
grid-template-columns: 20% 30% 30%;
justify-content: space-between; }

.fut_logo {height: 40px; width: auto;}
.f_kont {font-size: 24px; color: #000; font-weight: 800;}
.gr {margin-top: 20px;}
.fh_kont {text-decoration: none; color:#000;}
.fh_kont:hover {color:#999; transition-duration: 0.2s;}

.map {width: 100%; height: 500px;}
#map {width: 100%; height: 100%;}

.info_text {width: 100%; position: relative; top: 20px; padding-bottom: 40px;}
.info_text h1,  .info_text h2 {font-size: 28px; color: #000; margin:0; font-weight: 800;}
.info_text p {font-size: 24px; color: #000; margin-top: 20px; text-align: justify;}
.info_prod {float: right; margin-left: 30px; width: 370px; height: auto;}

.promo {
margin-top: 40px;
width: 100%; height: 50px;
background-color: #fff5c8;
display: grid;
grid-template-columns: 47%  47%;
justify-content: space-around;
}


.in_promo p { margin-top: 7px; font-size: 24px; font-weight: 800; color: #000;}
.in_promo img {float: left; margin-right: 15px; width: 36px; height: auto; margin-top: 7px;}

.fop_grid {
width: 100%; height: auto;
display: grid;
grid-template-columns: 49%  49%;
justify-content: space-between;
}

.in_bl {margin-top: 20px;}

.ftitle_bl {height: 40px; border-bottom: solid 3px #3a3482;}
.ftitle_bl p {font-size: 24px; color: #3a3482; font-weight: 800;}
.fops_bl {margin-top: 20px;}
.fops_bl  p {font-size: 24px; color: #000; text-align: justify;}

.maket_grid {
margin-top: 20px;
width: 100%; height: auto;
display: grid;
grid-template-columns: auto auto auto auto;
justify-content: space-between;	
}

.maket {
box-shadow: 0 0 10px rgba(0,0,0,0.1);
width: 270px; height: 350px;
margin-bottom: 20px;
position: relative;
}
.maket img {margin: 15px; width: 240px; height: auto;}

.add_to_order {width: 210px; height:50px; margin: 0 auto; border: solid 2px #3a3482; text-align: center; cursor: pointer;}
.add_to_order span {font-size: 24px; color: #3a3482; font-weight: 800; text-transform: uppercase; position: relative; top: 8px;}
.maket_num {position: absolute; bottom: 90px; right: 40px; font-size: 18px; color: #3a3482; z-index:1;}

.add_to_order:hover {background-color:#3a3482;  transition-duration: 0.5s;}
.add_to_order:hover span {color:#fff; transition-duration: 0.5s;}
.cl_bl {display: block;}
 
.foto_block {
margin-top: 20px;
display: grid;
grid-template-columns: auto auto auto;
justify-content: space-between;	
}

.foto_block img {
width: 98%; height: auto;
border: solid 1px #DCDCDC;
}

.foto_block2 {
position: relative;
left: 50%;
top: 20px;
margin-left: -250px;
width: 500px; height: auto;
}

.p_ord_inc {
	width: 30%; height: auto;
	margin: 0 auto;
}

.cn {margin: 0 auto;}

.port {
width: 100%; height: auto;
display: grid;
grid-template-columns: 30% 30% 30%;
justify-content: space-around; 
}

.pf {margin-top: 10%;}
.pf img {width: 100%; height: auto; }

/*============= New Online Form ==============*/
.new_fon {
z-index: 99;
position: fixed; top:0; left:0;
width: 100%; height: 100%;
background-color: #000;
opacity: 0.5;
display: none;
}

.OnlineForm {
display:none;
position: fixed; top:58px; left: 0; right: 0;
margin: 0 auto; 
width: 550px; height: 500px;
border: solid 2px #3a3482;
border-radius: 7px;
z-index: 100;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}

.add_new_osn img {
position: relative; top: 0; left: 0;
margin: 10px;
width: 50px; height: 50px;
}


.win_name_form {
position: absolute; top: 5px; left: 10px;
font-family: 'Exo 2', Arial; font-size: 24px; color: #3a3482;
}

.add_maket {
position: absolute; top: 70px; left: 10px;
width: 250px; height: 250px;
border: 0;
border-radius: 5px;
}

.add_osn {
position: absolute; top: 70px; right: 10px;
width: 250px; height: 250px;
border: 0;
border-radius: 5px;
display:none;
}

.top_razom {
position: absolute;
top: 0; right: 0;
height: 50px;
width: 200px;
background-color: #3a3482;
z-index: 1;
}

.top_razom_tripple {
position: absolute;
top: 0; right: 200px;
	width: 0;
	height: 0;
	border-top: 50px solid #3a3482; 
	border-left: 50px solid transparent;
z-index: 1;
}

.new_sum {
position: absolute;
top: 5px; right: 40px;
font-size: 30px;
color: #ff0;
z-index: 2;
}

.new_osn_line {
position: absolute; bottom: 85px; left: 0px;
width: 100%; height: 60px;
border: 0;
}

.add_new_osn {
display: inline-block;
position: relative; top: 0; left: 0;
margin-left: 10px;
width: 60px; height: 60px;
border: solid 1px #3a3482;
border-radius: 3px;
cursor: pointer;
}

.add_new_osn:hover {
opacity: 0.5;
}

.add_but {
position: absolute; right: 10px; bottom: 10px;
width: 200px; height: 40px;
background-color: #3a3482;
border-radius: 7px;
text-align: center;
cursor: pointer;
}

.add_but:hover {
background-color: #0250cc;
}

.add_but span {
position: relative; top: 5px;
font-size: 24px; color: #fff;
}

.add-farb {
position: absolute; bottom: 45px; left: 10px;
width: 300px; height: 30px; cursor: pointer;
}

.add-case {
position: absolute; bottom: 10px; left: 10px;
width: 300px; height: 30px; cursor: pointer;
display:block;
}

.add-farb span, .add-case span {position: absolute; left: 40px; font-size: 24px; color: #3a3482;}
.add-farb span:hover, .add-case span:hover {color: #029950;}
.add-farb img, .add-case img {position: absolute; left: 4px; top: 0px; width: 27px; height: auto; display: none;}

.add_new_order { 
display:none;
position: fixed; top: 58px; left: 0; right: 0;
margin: 0 auto; 
width: 350px; min-height: 100px;
border: solid 2px #3a3482;
z-index: 100;
background-color: #fff;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
padding-bottom: 80px;
z-index: 100;
}

.form_line {
position: relative;
top: 5px; left: 10px;
width: 330px; height: 50px;
border-bottom: solid 2px #3a3482;
}

.form_itogo {
position: relative;
top: 5px; left: 10px;
width: 330px; height: 50px;
border: 0;
}

.form_line input, .form_line select {
position: absolute;
top: 10px; left: 10px;
width: 310px; height: 37px; 
border: 0;
font-family: 'Exo 2', Calibri;
font-size: 20px;
color: #3a3482;
}

.form_line select {cursor:pointer; color: #5099cc;}

.new_sub_title {
position: absolute;
bottom: -15px; left: 20px;
font-size: 18px;
color: #3a3482;
}

.new_sub_file {
position: absolute;
bottom: -5px; left: 20px;
font-size: 18px;
color: #3a3482;
}

.total_order {
position: absolute;
bottom: 10px; left: 10px;
height: 50px; width: 150px;
border: solid 2px #090;
}

.new_sub_line {
position: relative; top: 0; left: 0;
width: 100%; height: 40px;
border: 0;
}

.itogo_sum {
	position: absolute; top: 5px; left: 17px; 
	font-size: 12px; color: #090;
}

.itogo_suma {
	position: absolute; top: 16px; left: 10px; 
	font-size: 22px; color: #090;
}

/*============= New Foot Form ==============*/

.NewOnlineBlock {
margin-top: 20px;
height: 210px;
width: 100%; 
background-color: #FFF6C7;
position: relative;
}

.NewOnlineBlock2 {
margin-top: 20px;
height: 390px;
width: 100%; 
background-color: #FFF6C7;
border: solid 2px #3a3482;
position: relative;
}

.but_new_order { height: 45px; width: 300px; font-size: 16px; }
.but_new_order:hover {color: #fff;}

.ord_form_text { width: 97%; height: 100px; background-color: #fff; margin: 20px auto;}
.ord_form_text textarea {width: 100%; height: 100%; font-family: 'Open Sans', sans-serif; color: #3a3482; border: solid 1px #3a3482; font-size: 14px; padding: 4px; box-sizing: border-box; resize: none;}

.ord_form_line {
margin-top: 40px;
display: grid;
grid-template-columns: 47% 47%;
justify-content: space-around;	
}

.ord_inp {
width: 100%; height: 100%;
background-color: #fff;
font-family: 'Open Sans', sans-serif;
font-size: 18px;
color: #3a3482;
border: 0;
padding-left: 4px;
box-sizing: border-box;
border: solid 1px #3a3482;
}

.form_bl {border:0; width: 100%; height: 40px; margin-top: 10px;}

.form_bl2 {border:0; width: 100%; height: 20px; margin-top: 10px; display:block;}
.form_bl2 span {margin-left: 10px; font-size: 16px; color:#3a3482; font-weight: 800;}

.input__wrapper {
  width: 100%;
  position: relative;
  margin: 15px 0;
  text-align: center;
}
 
.input__file {
  opacity: 0;
  visibility: hidden;
  position: absolute;
}
 
.input__file-icon-wrapper {
  height: 40px;
  width: 40px;
  margin-right: 25px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  border-right: 1px solid #3a3482;
}
 
.input__file-button-text {
  line-height: 1;
  margin-top: 1px;
}
 
.input__file-button {
  width: 100%;
  height: 40px;
  background: #fff;
  border: solid 1px #3a3482;
  color: #3a3482;
  font-size: 1.125rem;
  font-weight: 700;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: start;
      -ms-flex-pack: start;
          justify-content: flex-start;
  cursor: pointer;
  margin: 0 auto;
}

.NewBut2 {
border: solid 1px #3a3482;
font-family: 'Exo 2', Calibri;
font-size: 22px;
color: #fff;
position: absolute;
bottom: 20px; right:30px;
width: 220px; height:60px;
box-sizing: border-box;
padding: 5px;
text-align: center;
cursor: pointer;
background-color: #3a3482;
}

.NewBut2:hover {
background-color: #3a34a2;	
}

.NewTitleOn {
font-size: 22px;
color: #3a3482;
margin: 0;
position: absolute;
top: 10px; left:20px;
font-weight: 800;
}

.NewOnlineOption {
font-size: 16px;
color: #000;
margin: 0;
position: absolute;
top: 50px; left:20px;
width: 600px; height: 40px;
border: solid 1px #DCDCDC;
}

.NewKol {
font-size: 22px;
color: #3a3482;
position: absolute;
top: 110px; left:20px;	
}

.NewKolN {
font-size: 22px;
color: #3a3482;
position: absolute;
top: 110px; left: 250px;	
}

.NewKolDisc {
font-size: 14px;
color: #3a3482;
position: absolute;
top: 118px; left: 300px;	
}

.NewKolIn {
border: solid 1px #DCDCDC;
font-size: 16px;
color: #000;
position: absolute;
top: 105px; left:170px;
width: 50px; height: 40px;
box-sizing: border-box;
padding: 5px;
text-align: center;
}

.NewDiz {
font-size: 24px;
color: #3a3482;
position: absolute;
top: 170px; left: 70px;
cursor: pointer;
}

.NewItogo {
font-size: 24px;
color: #e00;
position: absolute;
bottom: 20px; left: 20px;
font-weight: 800;	
}

.NewBut {
border: solid 1px #3a3482;
font-family: 'Exo 2', Calibri;
font-size: 22px;
color: #fff;
position: absolute;
bottom: 20px; right:30px;
width: 220px; height:60px;
box-sizing: border-box;
padding: 5px;
text-align: center;
cursor: pointer;
background-color: #3a3482;
}

.NewBut:hover {
background-color: #3a34a2;	
}

.img_subl {
float:right;
margin: 5px;
width: 300px; height: auto;
}

.img_subl_bot {
margin: 5px;
width: auto; height: 250px;
}

.img_subl_fut {
margin: 5px;
width: 270px; height: auto;
}

.finFonZak {
position: fixed;
top:0; left:0;
bottom:0; right:0;
width: 100%; height: 100%;
z-index: 998;
background-color: #000;
opacity: 0.7;
display: none;
}

.winFRzak {
position: fixed;
top:60px; left:0; right:0;
width: 350px;
min-height: 100px;
margin: 0 auto;
z-index: 999;
background-color: #fff;
border: solid 2px #3a3482;
padding-bottom: 100px;
display: none;
}

.NewChk {
position: absolute;
top: 170px; left: 20px;
width: 35px; height: 35px;
cursor: pointer;
display: block;
}

.C_Off {
display: none;	
}

/*============= Magazin ==============*/
.magazin {
margin-top: 20px;
width: 100%; height: auto;
display: grid;
grid-template-columns: auto auto auto auto;
justify-content: space-between;	
}

.tovar {
box-shadow: 0 0 10px rgba(0,0,0,0.1);
width: 270px; height: 400px;
margin-bottom: 20px;
position: relative;
}

.tovar img {
width: 100%; height: auto;
position: relative; top: 0; left: 0;
margin: 0;
}

#t_name {
margin: 2px;
font-size: 18px;
color: #3a3482;
font-weight: 800;
width: 100%;
text-align: center;
}

#t_price {
margin: 2px;
font-size: 22px;
color: #3aa234;
font-weight: 800;
width: 100%;
text-align: center;
}

.but_new_order {
position: absolute;
bottom: 10px; left: 10px;
height: 54px; width: 330px;
border: 0;
background-color: #3a3482;
font-family: 'Exo 2', Calibri;
font-size: 22px;
color: #ff0;
cursor: pointer;
}

.but_new_order:hover {color: #fff;}

/*** Widtch < 1450 *****************************/
@media screen and (max-width:1450px){
.top_line { height: 47px; }	
.top_line a {
top: 9px;
font-size: 21px; }
.f_kont {font-size: 21px; }
.header_container { width: 1200px;}
.content {width: 1200px;}
.pod_line { height: 5px;}
.tm_line {height: 47px;}
.tm_line a { font-size: 21px; top: 8px;}

.logo { top: 36px; height: 90px; }
.prod { height: 230px; }
.header_info { height: 270px; }
.cont a { font-size: 21px;}
.tel {height: 21px;}
.header_info p { top: 145px; font-size: 25px; }

.navigation {display: block; width: 215px;}
.main_container { width: 970px;}
.box_name {height: 50px;}
.box_name p { top: 9px; left: 10px; font-size: 21px;}
.int_navigation li { left: 10px; font-size: 18px; margin-top: 10px; }
.int_navigation li:last-child {margin-bottom: 10px;}

.info_block { width: 310px; height: 325px; margin-top: 15px; }
.info_block span {font-size: 20px; bottom: 55px; left: 15px; }
.detail {bottom: 15px; left: 15px; font-size: 16px; padding: 5px 20px;}

.for_us {padding-bottom: 40px;}
.why_us {top: 20px; font-size: 40px;}
.w_line {top: 20px; margin: 15px auto 0px auto; width: 280px; height: 5px; }

.map {height: 450px;}

.info_text h1 {font-size: 26px;}
.info_text p {font-size: 22px;}
.info_prod {margin-left: 30px; width: 330px; }

.fops_bl  p {font-size: 22px;}

.maket {
width: 230px; height: 300px;
margin-bottom: 20px;
}
.maket img {margin: 10px; width: 210px;}

.add_to_order {width: 180px; height:40px;}
.add_to_order span {font-size: 20px; top: 6px;}
.maket_num {bottom: 75px; right: 25px; font-size: 16px;}

.tovar { width: 230px; height: 350px;}
#t_name { font-size: 16px; }
#t_price { font-size: 20px;}
}

/*** Widtch < 1250 *****************************/
@media screen and (max-width:1250px){
.top_line { height: 35px; }
.top_line a {
top: 7px;
font-size: 15px; }
.f_kont {font-size: 15px; }
.header_container { width: 1000px;}
.content {width: 1000px;}
.pod_line { height: 4px;}
.tm_line {height: 35px;}
.tm_line a { font-size: 15px; top: 6px; margin: 0 18px;}

.logo { top: 26px; height: 70px; }
.prod { height: 200px; }
.header_info { height: 235px; }
.cont a { font-size: 18px;}
.tel {height: 18px;}
.header_info p { top: 120px; font-size: 21px; }

.navigation {display: block; width: 180px;}
.main_container { width: 810px;}
.box_name {height: 40px;}
.box_name p { top: 9px; left: 8px; font-size: 16px;}
.int_navigation li { left: 8px; font-size: 15px; margin-top: 8px; }
.int_navigation li:last-child {margin-bottom: 8px;}

.info_block { width: 260px; height: 270px; margin-top: 15px; }
.info_block span {font-size: 17px; bottom: 43px; left: 10px; }
.detail {bottom: 10px; left: 10px; font-size: 14px; padding: 3px 15px;}

.for_us {padding-bottom: 50px;}
.why_us {top: 15px; font-size: 35px;}
.w_line {top: 15px; margin: 10px auto 0px auto; width: 220px; height: 4px; }

.colo {margin: 40px auto 0 auto; width: 140px; height: 140px;}
.colo img {width: 90px; margin-top: 25px;}
.colo_line {width: 60px; height: 3px; margin: 10px auto;}
.colo_p {height: 20px; margin: 10px auto;}
.colo_p {font-size: 14px;}

.map {height: 350px;}

.info_text {top: 10px;}
.info_text h1 {font-size: 18px;}
.info_text p {font-size: 18px; margin-top: 10px; }
.info_prod {margin-left: 15px; width: 300px; }

.promo { height: 40px;}

.in_promo p { margin-top: 7px; font-size: 18px;}
.in_promo img {width: 26px; margin-top: 7px;}

.in_bl {margin-top: 10px;}

.ftitle_bl {height: 30px;}
.ftitle_bl p {font-size: 18px;}
.fops_bl {margin-top: 10px;}
.fops_bl  p {font-size: 18px;}

.maket_grid { margin-top: 10px; }

.maket {
width: 170px; height: auto; padding: 10px;
margin-bottom: 20px;
}
.maket img {margin: 5px; width: 160px;}

.add_to_order {width: 150px; height:30px;}
.add_to_order span {font-size: 16px; top: 4px;}
.maket_num {bottom: 50px; right: 25px; font-size: 13px;}

.tovar { width: 180px; height: 280px;}
#t_name { font-size: 12px; }
#t_price { font-size: 16px;}
}

/*** Widtch < 1050 *****************************/
@media screen and (max-width:1050px){
.top_line {  height: 35px; }
.top_line a {
top: 7px;
font-size: 15px; }
.header_container { top: 35px; padding-bottom: 35px; width: 95%;}
.content {width: 95%;}
.pod_line { height: 4px;}
.tm_line {height: 35px;}
.tm_line a { font-size: 15px; top: 6px; margin: 0 12px;}

.logo { top: 22px; height: 60px; }
.prod { height: 180px; }
.header_info { height: 215px; }
.cont a { font-size: 16px;}
.tel {height: 16px;}
.header_info p { top: 105px; font-size: 19px; }

.main_container { width: 79%;}

.info_block { width: 230px; height: 230px; margin-top: 10px; }
.info_block span {font-size: 14px; bottom: 33px; left: 5px; }
.detail {bottom: 5px; left: 5px; font-size: 12px; padding: 3px 10px;}

.box_name {height: 30px;}
.box_name p { top: 4px; left: 4px; font-size: 16px;}
.int_navigation li { left: 4px; font-size: 15px; margin-top: 4px; }
.int_navigation li:last-child {margin-bottom: 4px;}

.for_us {padding-bottom: 35px;}
.why_us {top: 5px; font-size: 25px;}
.w_line {top: 5px; margin: 5px auto 0px auto; width: 180px; height: 3px; }

.colo {margin: 20px auto 0 auto; width: 110px; height: 110px;}
.colo img {width: 70px; margin-top: 20px;}
.colo_line {width: 40px; height: 3px; margin: 5px auto;}
.colo_p {height: 15px; margin: 5px auto;}
.colo_p {font-size: 11px;}

.map {height: 300px;}

.info_text {top: 10px;}
.info_text h1 {font-size: 12px;}
.info_text p {font-size: 12px; margin-top: 10px; }
.info_prod {margin-left: 10px; margin-bottom: 20px; width: 180px; }

.promo { width: 97%; margin: 0 auto; height: 30px;}

.in_promo p { margin-top: 6px; font-size: 12px;}
.in_promo img {width: 20px; margin-top: 5px;}

.ftitle_bl {height: 25px;}
.ftitle_bl p {font-size: 12px;}
.fops_bl  p {font-size: 12px;}

.maket {
width: 120px; height: auto; padding: 10px;
margin-bottom: 10px;
}
.maket img {margin: 5px; width: 110px;}
.maket_grid {width: 97%; margin: 5px auto; justify-content: space-around;}
.fop_grid {width: 97%; justify-content: space-around; margin: 0 auto;}
.info_text {width: 97%; margin: 0 auto; margin-bottom: 20px;}
.add_to_order {width: 100px; height:30px;}
.add_to_order span {font-size: 10px; top: 3px;}
.maket_num {bottom: 45px; right: 20px; font-size: 11px;}

/*============= New Foot Form ==============*/
.NewOnlineBlock { height: 220px; }
.NewTitleOn { font-size: 16px; }
.NewOnlineOption { font-size: 14px; top: 40px; width: calc(100% - 40px); height: 35px;}
.NewKol { font-size: 16px; top: 100px; }
.NewKolN { font-size: 16px; top: 100px; left: 200px; }

.NewKolIn { font-size: 16px; top: 95px; left:120px; width: 50px; height: 35px;}
.NewKolDisc { font-size: 14px; top: 135px; left: 20px;	}

.NewBut { font-size: 16px; bottom: 20px; right:20px; width: 180px; height:40px; }
.NewItogo {font-size: 16px;}

.tovar { width: 160px; height: 240px;}
#t_name { font-size: 10px; }
#t_price { font-size: 12px;}
}

.action_price_new {
    position: relative;
    bottom: 80px; left: 280px;
    font-size: 36px;
    line-height: 0.8;
    text-decoration: none;
    color: #000;
}

/*** Widtch < 960 *****************************/
@media screen and (max-width:960px){
.main_container { width: 76%;}
.info_block { width: 170px; height: 180px;}
.info_block span {font-size: 12px; bottom: 27px; left: 3px; }
.detail {bottom: 3px; left: 3px; font-size: 10px; padding: 3px 7px;}
.block_line {justify-content: space-around;}
.maket_grid { grid-template-columns: auto auto auto; }

.tovar { width: 135px; height: 210px;}
#t_name { font-size: 8px; }
#t_price { font-size: 10px;}
}

/*** Widtch < 760 *****************************/
@media screen and (max-width:760px){
body {overflow-x: hidden;}
.top_line { position: fixed; top: 0; left: 0; height: 45px; }
.top_line a { display: none; }
.tm_line {display: none;}

.header_container { width: 100%; margin: 0;}
.content {width: 100%;}

.logo { display:none; }
.prod { display:none; }
.header_info { height: 180px; text-align: center; 
background-image: url(img/fon.png);
background-position: top center;
background-size: 100%;
}
.cont li { display: block; left: 0px;}
.cont a { font-size: 14px; margin: 0;}
.tel {height: 14px;}
.header_info p { top: 30px; font-size: 16px; left: 0;}
.m_logo { display: block; width: auto; height: 30px; position: absolute; top: 7px; right: 10px;}
.m_menu { display: block;}

.navigation { position: fixed; top: 45px; left: 0px; overflow-x: hidden; overflow-y: auto; width: 300px; height: calc(100% - 45px); z-index: 2; background-color: #fff; display:none;}
.main_container { width: 100%;}

.fop_grid {grid-template-columns: 47% 47%;}

.info_block { width: 260px; height: 270px; margin-top: 15px; }
.info_block span {font-size: 17px; bottom: 43px; left: 10px; }
.detail {bottom: 10px; left: 10px; font-size: 14px; padding: 3px 15px;}
.block_line { grid-template-columns: auto auto; }
.tr_block {display:none;}
.m_kont {display:block;}

.g_fut { grid-template-columns: 100%; }
.gr {margin: 0; text-align: center;}
.maket_grid { grid-template-columns: auto auto auto auto; }

/*============= New Online Form ==============*/
.OnlineForm {
width: 300px; height: 350px;
border-radius: 4px;
}

.win_name_form {
position: absolute; top: 5px; left: 10px; font-size: 15px;
}

.top_razom {
height: 30px;
width: 100px;
}

.top_razom_tripple {
	right: 100px;
	border-top: 30px solid #3a3482; 
	border-left: 30px solid transparent;
}

.new_sum {
top: 0px; right: 10px;
font-size: 20px;
}

.add_maket {
top: 35px; left: 15px;
width: 120px; height: 120px;
}

.add_osn {
top: 35px; right: 15px;
width: 125px; height: 125px;
}

.new_osn_line {
position: absolute; bottom: 135px; left: 0px;
width: 100%; height: 35px;
border: 0;
}

.add_new_osn img {
margin: 5px;
width: 30px; height: 30px;
}

.add_new_osn {
margin-left: 5px;
width: 35px; height: 35px;
}

.add_but {
right: 50px;
}

.add-farb {
position: absolute; bottom: 90px; left: 10px;
width: 100%; height: 30px; cursor: pointer;
}

.add-case {
position: absolute; bottom: 60px; left: 10px;
width: 100%; height: 30px; cursor: pointer;
display:block;
}

.add-farb span, .add-case span {position: absolute; left: 35px; font-size: 20px; color: #3a3482;}
.add-farb span:hover, .add-case span:hover {color: #029950;}
.add-farb img, .add-case img {position: absolute; left: 4px; top: 3px; width: 20px; height: auto; display: none;}

.add_new_order { width: 320px;}
.form_line { width: 300px; height: 40px; }
.form_itogo { width: 300px; height: 40px;}

.form_line input, .form_line select {
width: 290px; height: 30px; 
font-family: 'Exo 2', Calibri;
font-size: 16px;
}

.new_sub_title { font-size: 15px;}
.new_sub_file { font-size: 15px;}
.but_new_order { height: 45px; width: 300px; font-size: 16px; }
.itogo_suma {font-size: 18px;}
.new_sub_line {height: 35px;}

.magazin {
grid-template-columns: auto auto auto;
justify-content: space-around;	
}

.tovar { width: 180px; height: 280px;}
#t_name { font-size: 12px; }
#t_price { font-size: 16px;}
}

/*** Widtch < 620 *****************************/
@media screen and (max-width:620px){ 
.maket_grid { grid-template-columns: auto auto auto; }

.magazin {
grid-template-columns: auto auto;
justify-content: space-around;	
}
}

/*** Widtch < 550 *****************************/
@media screen and (max-width:550px){ 
.info_block {width: 170px; height: 180px;}
.info_block span {font-size: 12px; bottom: 27px; left: 3px; }
.detail {bottom: 3px; left: 3px; font-size: 10px; padding: 3px 7px;}
.w_colo { grid-template-columns: auto auto;}
.promo {grid-template-columns: 90%; height: auto; padding-bottom: 3px;}
.info_prod {display: none;}
.cl_bl {display: none;}
.maket_grid { grid-template-columns: auto auto; }

.maket {
width: 150px; height: auto; padding: 10px;
margin-bottom: 20px;
}
.maket img {margin: 5px; width: 140px;}

.add_to_order {width: 120px; height:30px;}
.add_to_order span {font-size: 16px; top: 4px;}
.maket_num {bottom: 50px; right: 25px; font-size: 13px;}

.foto_block2 {
left: 0px;
margin-left: 0px;
width: 100%; height: auto;
}
.ord_form_line {
margin-top: 50px;
grid-template-columns: 97%;
justify-content: space-around;	
}

.cln_b {display:none;}

.NewOnlineBlock2 {
height: 500px;
}

.NewBut2 {
left: 0; right: 0;
margin: 0 auto;
}

}