/* Global Settings */
body {
	margin: 0;
	font-family: Tahoma, sans-serif;
	font-size: 14px;
	min-width: 300px;
}

h2 	{font-size: 24px; line-height: 22px; color: #09194E}
h3 	{font-size: 22px; line-height: 20px;}

.main 	{text-align: center}


a 	{background-color: inherit; color: #555; }
a:hover {text-decoration: none;}

/* Wrapper Settings */
#wrapper {
	background: #fff;
	padding: 0;
	margin: 0 auto;
	width: 90%;
	width: 1055px;
	overflow: hidden;
}

#body {
	margin: 0;
}

#container {
	position: relative;
	padding: 0;
	margin: 0;
}

/* top menu*/

.vector	 	{position: absolute; display: none; top: 33%; left: 15px; width: 32px; height: 20px; background: url(/images/vector.png) no-repeat}
.close-menu	{z-index: 6; position: absolute; display: none; top: 0px; left: 0px; width: 100%; height: 100%}
.close-menu div	{z-index: 6; position: absolute; display: none; top: 0px; left: 240px; font-size: 60px; color: #fff; line-height: 0.8em}

.top_menu 	{position: relative; padding: 0; width: 100%; height: 59px; color: #fff; background: #F9FCFE; border-bottom: #e0e0e0 2px solid}
.top_logo 	{float: left; width: 15%; height: 100%; font-size: 16px; background: url(/images/logo.png) 5% 50% no-repeat; background-size: 30%}
.top_logo p 	{margin-left: 60px; margin-top: 10px; color: #0041C7} 
.top_logo p span	{color: #FE6E0A}

.top_nav	{position: absolute; left: 17%; width: 54%; height: 100%; overflow: hidden;}

.top_tel	{position: absolute; right: 150px; width: 166px; height: 100%; background: url(/images/tel.png) 0 55% no-repeat}
.top_tel a	{line-height: 3.7em; margin-left: 20px; font-size: 16px; color: #000; text-decoration: none;}

.top_zvonok	{position: absolute; top: 20px; right: 0; width: 150px}
.top_zvonok a	{white-space: nowrap; font-size: 16px; padding: 7px 10px 9px 10px; margin-left: 7px; background: #0041C7; color: #fff; text-decoration: none; border-radius: 7px}

/* Other Settings*/

#banner {
	position: relative;
	width: 100%;
	height: 330px;
	color: #6A6F84;
	background: url(/images/big_top_img.jpg) right no-repeat;
}

#banner .zag {
	position: absolute;
	color: #0B224C;
	font-size: 34px;
	margin-top: 35px;
	margin-left: 40px;
	line-height: 1.3em;
	text-shadow: 1px 1px 1px #202020;
}

#banner div span {color: #6193E8;}

#banner .zag1 {position: absolute; width: 330px; margin-top: 180px; margin-left: 40px;}
#banner .knopki {position: absolute; bottom: 60px; margin-left: 40px}
#banner .knopki a {text-decoration: none;}
.knopki .ask	{border-radius: 7px; color: #fff; background: #0551BC; padding: 9px 20px}
.knopki .zvon	{border-radius: 7px; color: #0551BC; background: #fff; padding: 8px 18px 8px 35px; border: #0551BC 2px solid; margin-left: 20px; background: url(/images/tel.png) 8% 50% no-repeat; background-size: 12%}
#banner .dop 	{position: absolute; bottom: 10px; margin-left: 40px}
.dop div 	{float: left; padding-left: 20px; font-size: 11px}

.dop .b1 	{background: url(/images/b1.png) -2px 50% no-repeat; background-size: 22px}
.dop .b2 	{background: url(/images/b2.png) -2px 50% no-repeat; background-size: 22px; margin-left: 20px}
.dop .b3 	{background: url(/images/b3.png) -2px 50% no-repeat; background-size: 22px; margin-left: 20px}

/* main menu*/

ul#topnav {
	list-style-type: none;
	margin-left: 2%;
	margin-top: 18px;
	display: table;
	padding: 0;
	width: 90%;
}

ul#topnav li {
	display: table-cell;
	text-align: center;
	white-space: nowrap;
}

ul#topnav li a {
	color: #444;
	border: none;
	display: block;
	margin-right: 5px;
	padding: 5px 0px;
	font-size: 14px;
}

ul#topnav li a.active,
ul#topnav li a.active:hover {
	color: #000;
}

ul#topnav li a:hover {
	color: #000;
}


/* end main menu*/

#content {
	text-align: left;
	padding: 10px;
	min-height: 600px;
	color: #222;
}

#content h1 {
	font: normal 22px Arial, sans-serif;
	padding: 0;
}

#content ul {
	list-style: none;
}

#content ul li {
	padding: 2px 0 2px 10px;
	margin: 0;
}

#content .item {
	line-height: 1.25em;
	margin-left: 30px;
}

#content .item p {
	text-align: justify;
}

#footer {
	position: relative;
	background: #F9FCFE;
	height: 95px;
	padding-top: 5px;
	color: #444;
	font-size: 12px;
	margin-top: 8px;
	border-top: #e0e0e0 1px solid;
	border-bottom: #e0e0e0 1px solid;
}

#footer a {
	background-color: inherit;
	color: #333;
}

#footer a:hover {
	background-color: inherit;
	color: #888;
	text-decoration: none;
}

#footer span.left {
	text-align: left;
	padding-left: 15px;
	float: left;
}

#footer .f1	{float: left; width: 180px; height: 100%;
	background: url(/images/top_logo.png) 2% 7% no-repeat;
}

#footer .f1 span	{color: #FE6E0A}
#footer .f1 p.t1	{margin-left: 55px; margin-top: 4px; font-size: 16px; line-height: 0.9em}
#footer .f1 p.t2	{margin-left: 5px;  font-size: 12px;}
#footer .f1 p.t3	{display: none; margin-left: 35px; margin-top: -7px; font-size: 14px}

#footer .f2	{float: left; margin-left: 75px; margin-top: 5px; width: 17%; height: 100%}
#footer .f3	{float: left; margin-left: 75px; margin-top: 5px; width: 17%; height: 100%}
#footer .f4	{position: absolute; width: 160px; height: 100%; right: 90px}
.f4 span	{font-size: 11px; color: #777}
#footer .f5	{position: absolute; display: flex; align-items: center; width: 90px; height: 100%; right: 0;}

#bottom {
	position: relative;
	height: 20px;
	color: #777;
	font-size: 12px;
	margin-top: 4px;
}

#bottom a {
	background-color: inherit;
	color: #777;
	text-decoration: none;
}

#bottom a:hover {
	background-color: inherit;
	color: #000;
	text-decoration: none;
}

#bottom .b1 {
	position: absolute;
	left: 0;
	width: 65%;
}

#bottom .b2 {
	position: absolute;
	right: 0;
	width: 35%;
	text-align: right;
}


/* additional */
.features	{overflow: hidden; width: 100%; margin: 0 auto; padding: 5px 0; text-align: center}
.features div	{overflow: hidden; display: inline-block; vertical-align: top; text-align: left; color: #333; width: 17%; height: 80px; padding: 4px; border: none; border-radius: 15px; box-shadow: 0px 0px 13px #c0c0c0;}

.feat1		{background: url(/images/feat1.jpg) 2% 50% no-repeat; background-size: 40px; margin: 8px 8px 8px 0}
.feat1 p	{margin-left: 45px; margin-top: 10px}
.feat2		{background: url(/images/feat2.jpg) 2% 50% no-repeat; background-size: 40px; margin: 8px 8px;}
.feat2 p	{margin-left: 45px; margin-top: 10px }
.feat3		{background: url(/images/feat3.jpg) 2% 50% no-repeat; background-size: 40px; margin: 8px 8px;}
.feat3 p	{margin-left: 45px; margin-top: 10px}
.feat4		{background: url(/images/feat4.jpg) 2% 50% no-repeat; background-size: 40px; margin: 8px 8px;}
.feat4 p	{margin-left: 42px; margin-top: 10px }
.feat5		{background: url(/images/feat5.jpg) -2% 50% no-repeat; background-size: 40px; margin: 8px 0 8px 8px}
.feat5 p	{margin-left: 35px; margin-top: 10px }

.respond	{overflow: hidden; width: 100%; margin: 0 auto; padding: 5px 0; text-align: center}
.respond div	{overflow: hidden; display: inline-block; vertical-align: top; text-align: left; color: #333; width: 296px; height: 120px; padding: 0px; border: none; border-radius: 15px; box-shadow: 0px 0px 12px #d8d8d8;}

.resp1		{background: url(/images/resp2.png) 2% 9% no-repeat; margin: 8px 8px 8px 0}
.resp2		{background: url(/images/resp1.png) 2% 9% no-repeat; margin: 8px 8px}
.resp3		{background: url(/images/resp3.png) 2% 9% no-repeat; margin: 8px 0 8px 8px}
p.r1 	 	{background: url(/images/stars.png) 90% 40% no-repeat; margin: 5px 0 0 5px; padding: 5px 0 0 50px; height: 40px}
p.r2 		{margin: 0 4px 0 8px}
.r1 span	{color: #888; font-size: 11px}

#zayavka	{display: none}
.zayav		{width: 90%; margin: 0 auto; color: #333; padding: 10px; border-radius: 10px; box-shadow: 0px 0px 10px #e0e0e0;}
.zayav	input	{width: 43%; padding: 5px; margin: 8px 0; border: #666 1px solid}
.zayav	textarea	{margin: 8px 0; width: 100%; height: 50px; padding: 5px; border: #666 1px solid; box-sizing: border-box;}
.zayav_sbmt	{font-size: 16px; padding: 3px 0; background: #0551BC; color: #fff; border: none; border-radius: 10px;}

.zakaz		{width: 80%; margin: 0 auto; margin-top: 40px; color: #333; padding: 10px; border-radius: 10px; box-shadow: 0px 0px 15px #2870CF}
.zakaz	input	{width: 30%; padding: 5px; margin: 8px 0; border: #666 1px solid}
.zakaz	textarea	{ margin: 8px 0; width: 100%; height: 80px; padding: 5px; border: #666 1px solid; box-sizing: border-box;}
#zakaz_sbmt	{font-size: 16px; padding: 10px 0; width: 170px; background: #0551BC; color: #fff; border: none; border-radius: 10px;}
#zakaz_sbmt:hover	{cursor: pointer}
.inp_mrg	{margin-left: 2%}

div.agree	{height: 30px}
div.agree input	{position: absolute; width: 12px; margin-top: 2px}
div.agree div	{position: absolute; font-size: 13px; margin-left: 20px}

.obrat		{margin-bottom: 17px; position: relative; padding: 3px 0}
.obrat	div	{top: 0; left: 120px; position: absolute}
.obrat	input	{width: 170px; padding: 4px; border: #666 1px solid; font-size: 16px;}
#cod		{margin-left: 30px}

input.submit	{font-size: 18px; padding: 10px; cursor: pointer; background: #fff; border: #0551BC 1px solid; color: #0551BC}
input.submit:hover	{background: #0551BC; color: #fff}
.txtarea	{font-size: 16px; width: 450px; height: 150px; padding: 4px; border: #666 1px solid}
.hgt		{height: 170px}
.tel_hid	{display: none}
.eml_hid	{display: none}
.img_tr		{display: block; width: 300px; margin: auto; margin-bottom: 10px; border-radius: 10px; box-shadow: 0px 0px 10px #b0b0b0;}
.det		{width: 60%; margin: 0 auto; margin-top: 40px; border: #ddd 1px solid; font-size: 18px; color: #555; border-radius: 10px; box-shadow: 0px 0px 15px #e0e0e0;}
.det p		{padding: 0 10px}

.zag_itm	{margin: 5px 0; height: 40px; overflow: hidden}
.zag_itm a	{font-family: Roboto, tahoma; font-weight: normal; font-size: 12px; line-height: 1em; color: #303030; text-decoration: none}
.price		{font-family: Roboto, tahoma; font-size: 14px; color: #020831}


/* модал окно для меню в шапке*/
.modal-top {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 5; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.8); /* Black w/ opacity */
}

.modal-topmenu {
    position: relative;
    z-index: 7; /* Sit on top */
    padding: 0;
    left: 2px;
    top: 2px;
    width: 230px; /* Full width */
    background: #f0f0f0;
    overflow: auto;
    opacity:0;
    animation: show 0.6s 1;
    animation-fill-mode: forwards;
}

@keyframes show{
from{
opacity:0;
}
to{
opacity:1;
}
}

/*  меню каталога в шапке */

.dws-menu1 *{
 position: relative;
 margin: 0;
 padding: 0;
 list-style: none;
}

.tgl_font	{font-family: Roboto; font-size: 18px; color: #4D4125; border-bottom: 1px solid #C4C4C4; padding: 10px 0 10px 30px;}

/* позвонить в шапке */

.whatsapp-button {
    position: absolute;
    display: none;
    right: 2%;
    top: 30px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    width: 40px; /*ширина кнопки*/
    height: 40px; /*высота кнопки*/
    color: #fff;
    text-align: center;
    line-height: 53px; /*центровка иконки в кнопке*/
    font-size: 35px; /*размер иконки*/
    background: url(/images/tel2.png) no-repeat center;
    background-size: 50%;
    background-color: #0041C7;
    z-index: 1;
}
.whatsapp-button a {
    color: #fff;
}
.whatsapp-button:before,
.whatsapp-button:after {
    content: " ";
    display: block;
    position: absolute;
    border: 50%;
    border: 1px solid #0041C7; /*цвет анимированных волн от кнопки*/
    left: -10px;
    right: -10px;
    top: -10px;
    bottom: -10px;
    border-radius: 50%;
    animation: animate 1.5s linear infinite;
    opacity: 0;
    backface-visibility: hidden; 
}
 
.whatsapp-button:after{
    animation-delay: .5s;
}
 
@keyframes animate
{
    0%
    {
        transform: scale(0.5);
        opacity: 0;
    }
    50%
    {
        opacity: 1;
    }
    100%
    {
        transform: scale(1.2);
        opacity: 0;
    }
}


/* карусель */

.amazingcarousel-image {	
	position: relative;
	padding: 0px;
}

.amazingcarousel-image img {
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border-radius: 5px;
}

.amazingcarousel-container {
	margin: 10px 30px; 
}

.amazingcarousel-hid	{display:none; position:relative; width:100%; max-width:1000px; margin:0px auto}

.amazingcarousel-list-container { 
	padding: 10px 0;
}

.amazingcarousel-item-container {
	text-align: center;
	border-radius: 5px;
	padding: 7px;
	overflow: hidden;
	box-shadow: 0px 0px 10px #e0e0e0;
	border: #f8f8f8 1px solid;
}

.amazingcarousel-prev {
	left: 0%;
	top: 50%;
	margin-left: -50px;
	margin-top: -24px;
}

.amazingcarousel-next {
	right: 0%;
	top: 50%;
	margin-right: -50px;
	margin-top: -24px;
}

/* Begin responsive styles */
@media screen and (max-width: 1055px){
#wrapper	 {width: 100%;}
}

@media screen and (max-width: 1000px){

.top_logo p 	{margin-left: 55px; color: #0041C7} 
.top_tel	{right: 130px}
.top_zvonok	{width: 130px}
.top_zvonok a	{font-size: 15px; margin-left: 0; padding: 7px 8px 9px 8px;}

#banner		{background: url(/images/big_top_img.jpg) 115% no-repeat }
#banner .zag 	{margin-left: 30px}
#banner .zag1 	{margin-left: 30px}
#banner .knopki {margin-left: 30px;}
#banner .dop 	{margin-left: 30px;}

#content	{padding: 15px;}
#content .item  {margin-left: 15px}
.zakaz		{width: 85%}

.feat1		{margin: 8px 6px 8px 0}
.feat2		{margin: 8px 6px 8px 6px}
.feat3		{margin: 8px 6px 8px 6px}
.feat4		{margin: 8px 6px 8px 6px}
.feat5		{margin: 8px 0 8px 6px}

.feat1 p	{margin-left: 42px; margin-top: 2px}
.feat2 p	{margin-left: 42px; margin-top: 2px}
.feat3 p	{margin-left: 42px; margin-top: 2px}
.feat4 p	{margin-left: 42px; margin-top: 2px}
.feat5 p	{margin-left: 35px; margin-top: 2px}

.respond div	{width: 30%}

#footer .f2	{margin-left: 65px;}
#footer .f3	{margin-left: 65px;}
}

@media screen and (max-width: 900px){

.top_logo	{width: 158px}
.top_tel	{right: 120px}
.top_zvonok	{width: 110px; right: 10px}
.top_zvonok a	{letter-spacing: -1px;}

#banner		{height: 290px; background-size: 60% 95%}
#banner .zag 	{margin-left: 20px; margin-top: 30px; font-size: 32px; line-height: 1.2em;}
#banner .zag1 	{margin-left: 20px; margin-top: 155px}
#banner .knopki {margin-left: 20px;}
#banner .dop 	{margin-left: 20px;}
.knopki .ask	 {padding: 8px 18px}
.knopki .zvon	 {padding: 7px 16px 7px 32px; margin-left: 10px;}

#content 	{padding: 10px}
.inp_mrg	{margin-left: 1.7%}


.features div	{font-size: 13px}
.feat1 p	{margin-left: 30px; margin-top: 5px}
.feat2 p	{margin-left: 30px; margin-top: 5px}
.feat3 p	{margin-left: 30px; margin-top: 5px}
.feat4 p	{margin-left: 30px; margin-top: 5px}
.feat5 p	{margin-left: 27px; margin-top: 5px}

.feat1		{background-size: 21%}
.feat2		{background-size: 21%}
.feat3		{background-size: 21%}
.feat4		{background-size: 21%}
.feat5		{background-size: 21%}

#content .item  {margin-left: 10px;}

.txtarea	{width: 450px; height: 120px}
.hgt		{height: 130px}

#footer .f2	{margin-left: 40px; width: 20%}
#footer .f3	{margin-left: 30px;}

}

@media screen and (max-width: 850px){
.top_logo p 	{margin-left: 50px} 
.top_nav	{width: 50%; left: 150px}
ul#topnav 	{margin-left: 1%;}
ul#topnav li a 	{margin-right: 2px;}
.top_tel	{width: 155px; right: 125px}
.top_tel a	{letter-spacing: -1px;}

.zakaz	input	{width: 29.7%}
.inp_mrg	{margin-left: 2%}

#footer .f2	{margin-left: 30px}
#footer .f3	{margin-left: 20px;}

}

@media screen and (max-width: 800px){
.top_nav	{width: 46%;}
ul#topnav .hid_fld1 {display: none}

.top_logo p 	{margin-left: 55px; letter-spacing: -1px}
.top_zvonok	{right: 15px}

#banner		{height: 250px}
#banner .zag 	{margin-top: 15px; font-size:30px; line-height: 1.1em;}
#banner .zag1 	{margin-top: 120px}
#banner .knopki {bottom: 45px;}
.dop .b2,.dop .b3 	{margin-left: 10px}


.feat1 p	{margin-left: 25px; margin-top: 1px}
.feat2 p	{margin-left: 25px; margin-top: 1px}
.feat3 p	{margin-left: 25px; margin-top: 1px}
.feat4 p	{margin-left: 25px; margin-top: 1px}
.feat5 p	{margin-left: 20px; margin-top: 1px}

.feat1		{background-size: 19%; margin: 8px 4px 8px 0}
.feat2		{background-size: 19%; margin: 8px 4px 8px 4px}
.feat3		{background-size: 19%; margin: 8px 4px 8px 4px}
.feat4		{background-size: 19%; margin: 8px 4px 8px 4px}
.feat5		{background-size: 19%; margin: 8px 0 8px 4px}

.zakaz	input	{width: 29.8%}
.inp_mrg	{margin-left: 1.5%}

.respond div	{width: 296px}
.resp2		{margin: 8px 0 8px 8px}
.resp3		{margin: 8px 8px}

#footer .f2	{margin-left: 25px; width: 20%}
#footer .f3	{margin-left: 5px;}

}

@media screen and (max-width: 750px){
.top_nav	{width: 42%;}
ul#topnav .hid_fld2 {display: none}
}

@media screen and (max-width: 700px){

body		 {font-size: 15px;}

.top_nav	{width: 55%;}
.top_tel	{width: 155px; right: 0}
.top_zvonok	{display: none}

#banner {height: 220px; background-size: 55%; background-position: 110% 10%}
#banner .zag {margin-left: 10px; margin-top: 1px; font-size:28px; line-height: 1.0em;}
#banner .zag1 {margin-left: 10px; margin-top: 90px}
#banner .knopki {margin-left: 10px; bottom: 35px;}
#banner .dop 	{margin-left: 10px; bottom: 5px;}
.knopki .ask	 {padding: 5px 14px}
.knopki .zvon	 {padding: 4px 12px 4px 28px; background-position: 2% 50%}

#content	{padding: 7px}
#content .item  {margin-left: 7px; margin-right: 7px}

.zakaz		{width: 90%}
.zakaz	input	{width: 29.8%}
.inp_mrg	{margin-left: 1%}
.det		{width: 80%;}

.features div	{width: 26%; font-size: 14px}
.feat1 p	{margin-left: 25%; margin-top: 2px}
.feat2 p	{margin-left: 25%; margin-top: 2px}
.feat3 p	{margin-left: 25%; margin-top: 2px}
.feat4 p	{margin-left: 25%; margin-top: 2px}
.feat5 p	{margin-left: 21%; margin-top: 2px}

.feat1		{background-size: 22%; margin: 8px 10px 8px 0}
.feat2		{background-size: 22%; margin: 8px 10px 8px 10px}
.feat3		{background-size: 22%; margin: 8px 10px 8px 10px}
.feat4		{background-size: 22%; margin: 8px 10px 8px 10px}
.feat5		{background-size: 22%; margin: 8px 0 8px 10px}

.respond div	{font-size: 14px}
div.resp1, div.resp2	{width: 47%}

.obrat	div	{width: 70%}
.obrat	input	{width: 70%}
.txtarea	{width: 98%}
#cod		{margin-left: 24px}

#footer .f2	{margin-left: 10px}
#footer .f3	{margin-left: 10px}
#footer .f4	{width: 100px}

#bottom .b1 	{margin-left: 3px}
#bottom .b2 	{margin-right: 3px}

}

@media screen and (max-width: 600px){

#banner 	{height: 200px;}
#banner .zag {font-size:26px;}
#banner .zag1 {margin-top: 86px; width: 260px; height: 40px; overflow: hidden}
.knopki .ask	 {padding: 3px 12px 5px 12px}
.knopki .zvon	 {padding: 2px 10px 4px 26px}

ul#topnav 	{margin-left: 5px;}
.top_nav	{width: 45%;}
ul#topnav .hid_fld4 {display: none}
ul#topnav li a 	{margin-right: 0;}

.features div	{width: 28%; font-size: 14px}
.feat1 p	{margin-left: 40px; margin-top: 2px}
.feat2 p	{margin-left: 40px; margin-top: 2px}
.feat3 p	{margin-left: 37px; margin-top: 2px}
.feat4 p	{margin-left: 38px; margin-top: 2px}
.feat5 p	{margin-left: 32px; margin-top: 2px}

.feat1		{background-size: 22%; margin: 8px 5px 8px 0}
.feat2		{background-size: 22%; margin: 8px 5px 8px 5px}
.feat3		{background-size: 22%; margin: 8px 5px 8px 5px}
.feat4		{background-size: 22%; margin: 8px 5px 8px 5px}
.feat5		{background-size: 22%; margin: 8px 0 8px 5px}

.det		{width: 90%}
.zakaz		{width: 95%}
.zakaz	input	{width: 29.8%}
.inp_mrg	{margin-left: 0.5%}

div.resp1, div.resp2	{width: 296px; margin: 8px 0}
.resp3		{margin: 8px 8px}

#footer .f2	{width: 23%}
#footer .f3	{width: 19%}
#footer .f4	{right: 0}
#footer .f5	{display: none}

}

@media screen and (max-width: 550px){
.top_tel	{width: 150px}

}

@media screen and (max-width: 500px){

h2 		{font-size: 20px}
#wrapper 	{padding: 0px; }
#container 	{margin-top: 60px;}

.top_menu	{z-index: 3; position: fixed; top: 0; min-width: 300px}
.top_menu a	{text-decoration: none;}
.vector	 	{display: block}

#banner		{display: none}

.top_logo 	{float: none; margin: 0 auto; width: 170px; background-position: 0px;}
.top_logo p	{margin: 0 0 0 60px; padding-top: 10px; letter-spacing: normal} 


.top_nav	{display: none}
.top_tel	{display: none}
.whatsapp-button	{display: block}

#content { padding: 5px; }
#content .item {margin: 0}

.img_tr		{width: 70%}
.det		{width: auto; margin-left: 10px; margin-right: 10px}
.zakaz		{width: auto; margin-left: 10px; margin-right: 10px}
.zakaz	input	{width: 40%}
.inp_mrg	{margin-left: 3%}

.features div	{width: 45%;}
.feat1 p	{margin-left: 21%; margin-top: 5px}
.feat2 p	{margin-left: 21%; margin-top: 5px}
.feat3 p	{margin-left: 21%; margin-top: 5px}
.feat4 p	{margin-left: 21%; margin-top: 5px}

.feat1		{background-size: 18%; margin: 8px 7px 8px 0}
.feat2		{background-size: 18%; margin: 8px 0 8px 7px}
.feat3		{background-size: 18%; margin: 8px 7px 8px 0}
.feat4		{background-size: 18%; margin: 8px 0 8px 7px}

#ft5_hid	{display: none}
#zayavka	{display: block}

.zag_itm a	{font-size: 14px}
.price		{font-size: 15px}

.obrat	div	{left: 100px;}
#cod		{margin-left: 3px}

#footer 	{height: 70px;}
#footer .f1 p.t2	{display: none}
#footer .f1 p.t3	{display: block}
#footer .f2		{width: 30%; margin-left: 2%; margin-top: 0}
#footer .f3		{width: 21%; margin-left: 5px; margin-top: 0}
#footer .f4		{display: none}

#bottom  	{height: auto}
#bottom .b1 	{position: relative; width: 100%}
#bottom .b2 	{position: relative; right: auto; padding-top: 5px; text-align: center; width: 100%; margin: 0 auto}

}

@media screen and (max-width: 450px){

#footer .f2		{margin-left: 1px; width: 31%;}
#footer .f3		{margin-left: 1px; width: 22%;}

}

@media screen and (max-width: 400px){

.whatsapp-button	{right: -5px}

#banner {height: 170px}
#banner div.zag { margin-top: 10px; margin-bottom: 10px; font-size: 20px;}

.features div	{width: 44%;}
.feat1 p	{margin-left: 35px; margin-top: 2px}
.feat2 p	{margin-left: 35px; margin-top: 2px}
.feat3 p	{margin-left: 35px; margin-top: 2px}
.feat4 p	{margin-left: 35px; margin-top: 2px}

.feat1		{background-size: 19%; margin: 8px 4px 8px 0}
.feat2		{background-size: 19%; margin: 8px 0 8px 4px}
.feat3		{background-size: 19%; margin: 8px 4px 8px 0}
.feat4		{background-size: 19%; margin: 8px 0 8px 4px}

.det p		{padding: 0 7px}
.zakaz	input	{width: 80%}
.inp_mrg	{margin-left: 0}

.respond div	{width: 90%}
.resp1		{margin: 8px 0}
.resp2		{margin: 8px 0}
#res5_hid	{display: none}
.zayav	input	{width: 70%}

.obrat		{margin-bottom: 7px}
.obrat div	{left: 0px; position: relative; width: 100%}
.txtarea	{width: 100%; box-sizing: border-box}
.hgt		{height: 150px}

#footer .f2		{width: 38%; margin-left: 7%}
#footer .f3		{display: none}

}

@media screen and (max-width: 350px){

.features	{display: none}
.feat1 p	{margin-left: 30px; margin-top: 0}
.feat2 p	{margin-left: 30px; margin-top: 0}
.feat3 p	{margin-left: 30px; margin-top: 0}
.feat4 p	{margin-left: 30px; margin-top: 0}

.det		{margin-left: 5px; margin-right: 5px}
div.agree div	{width: 78%}

.respond div	{width: 94%}

#footer .f2	{width: 36%; margin-left: 2%;}

}

@media screen and (max-width: 320px){
#footer .f1	{width: 170px; letter-spacing: -1px} 
#footer .f2	{width: 39%; margin-left: 1px;}

}
