@import "../css/reset.css";@import "../css/grid_24.css";@import "../css/superfish.css";@import url(http://fonts.googleapis.com/css?family=Varela);
/* Getting the new tags to behave */
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video {display:block}
mark, rp, rt, ruby, summary, time {display:inline}
/* Left & Right alignment */
.left {float:left}
.right {float:right}
.wrapper {width:100%;overflow:hidden}
.wrap{overflow:hidden;width:965px;margin-left:-5px;padding-left:5px}
/* Global properties */
body {background:url(../images/bg_bot.jpg) center 0 repeat #faf3ed;border:0;font:14px Georgia, "Times New Roman", Times, serif;color:#200;line-height:24px}
.ic, .ic a {border:0;float:right;background:#fff;color:#f00;width:50%;line-height:10px;font-size:10px;margin:-220% 0 0 0;overflow:hidden;padding:0}
.css3{border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;box-shadow:0 0 4px rgba(0, 0, 0, .4);-moz-box-shadow:0 0 4px rgba(0, 0, 0, .4);-webkit-box-shadow:0 0 4px rgba(0, 0, 0, .4);position:relative}
/* Global Structure */
.main {	margin:0 auto;	width:960px}
.body1 {background:url(../images/bg_top_img.jpg) top center no-repeat}
.body2 {background:#faf3ed} 
.body3 {
	background-image: url(../images/bg_bot_img.jpg);
	background-repeat: repeat;
	background-position: center top;
}
.body4 {background:url(../images/bg_bot_img.jpg) top center no-repeat}
.body5 {background:url(../images/slider_shadow.png) center 508px no-repeat}
.body6 {background:url(../images/bg_top.jpg) top repeat-x}
/* main layout */
a {color:#a80002;text-decoration:none;outline:none}
h1 {
	font-size:36px;
	line-height:1.2em;
	color:#FFF;
	padding:16px 0 12px 0;
	letter-spacing:-2px
}
h2 {
	font-size:36px;
	line-height:1.2em;
	color:#200000;
	padding:16px 0 12px 0;
	letter-spacing:-2px
}
h2.letter_spacing {letter-spacing:-3px}
h3 {font-size:27px;color:#230000;line-height:1.2em;padding:20px 0 9px 0;letter-spacing:-1px}
h3 span {color:#a80002}
h4 {
	font-size:36px;
	line-height:1.2em;
	color:#FFF;
	padding:16px 0 12px 0;
	letter-spacing:-2px
}
h5 {
	font-size:16px;
	line-height:1.2em;
	color:#000000;
}
p {
	padding-bottom:24px;
}
/* header */
header {height:121px;padding-top:31px;width:100%;overflow:hidden}
#logo {display:block;background:url(../images/logo.png) 0 0 no-repeat;width:259px;height:94px;text-indent:-9999px}
#top_nav {float:right;padding:4px 43px 30px 0}
#top_nav li {float:left;padding:3px 26px 5px 0;background:url(../images/top_line.gif) right 0 no-repeat;margin-right:25px}
#top_nav li a {display:block;line-height:0}
#top_nav .end {background:none;padding-right:0;margin-right:0}
#menu {width:633px;float:right;padding:0 0 0 0}
#menu li {float:left;padding-left:3px}
#menu li a {display:block;font-size:24px;color:#faf3ed;line-height:40px;padding:0 20px;height:44px;letter-spacing:-1px}
#menu li a:hover, #menu .active a {text-decoration:none;background:url(../images/menu_bg.png) repeat}
.slider_bg {
	width:100%;
	height:405px;
	background:url(../images/bg_slider.jpg) 0 0 no-repeat;
	position:relative;
	overflow:hidden;
	box-shadow:0 0 5px rgba(0, 0, 0, .4);
	-moz-box-shadow:0 0 5px rgba(0, 0, 0, .4);
	-webkit-box-shadow:0 0 5px rgba(0, 0, 0, .4);
	margin-bottom:35px
}
.slider {top:10px;right:10px;position:absolute;z-index:1;width:920px}
.slider .items {display:none}
.slider .pic {float:right;position:relative}
.banner {left:0px;top:0;position:absolute;width:271px;z-index:2;text-align:center}
.banner strong {font-size:32px;color:#bf0f0a;display:block;line-height:1.2em;text-transform:uppercase;padding:55px 0 0 0;letter-spacing:-2px}
.banner strong span {display:block;margin-top:-16px}
.banner b {display:block;font-size:14px;color:#312826;text-transform:uppercase;padding:0 0 23px 0;line-height:1.2em;letter-spacing:-1px}
.banner p {background:url(../images/quot1.png) 0 0 no-repeat}
.banner p span {display:block;background:url(../images/quot2.png) right bottom no-repeat;padding:0 0 0 0;color:#6c5f5b;padding-bottom:2px}
.slider .pagination {position:absolute;z-index:2;bottom:10px;left:107px}
.slider .pagination li {float:left;padding-right:3px}
.slider .pagination a {display:block;width:17px;height:17px;text-indent:-9999px;background:url(../images/buttons.png) right 0 no-repeat}
.slider .pagination a:hover, .slider .pagination .current a {background-position:left}
/* content */
#content {
	padding-bottom:40px;
	color: #A8000A;
}
#content2 {padding-bottom:31px}
.pad_left1 {padding-left:30px}
.pad_bot1 {padding-bottom:13px}
.pad_bot2 {padding-bottom:24px}
.pad_bot222 {
	padding-bottom:13px;
	color: #06C;
}
.pad_bot333 {
	padding-bottom:13px;
	color: #093;
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
}
.pad_bot444 {
	padding-bottom:13px;
	color: #F00;
	font-size: 15px;
	font-weight: bold;
}
.pad_bot455 {
	padding-left:255px;
	padding-bottom:15px;
	color: #06F;
	font-size: 24px;
	font-weight: bold;
	font-style: italic;
}
.pad_bot555 {
	padding-bottom:13px;
	color: #000;
	font-size: 14px;
}
.pad_bot77 {
	padding-bottom:13px;
	color: #F00;
	font-size: 24px;
	font-weight: bold;
}
.pad_bot87 {
	font-size:36px;
	line-height:1.2em;
	font-weight: bold;
	color:#A8000A;
	padding:16px 0 12px 0;
	letter-spacing:-2px
}
.pad_bot87 span {color:#FFF}
a {
	color:#000;
	outline:none;
	text-decoration:none;
	cursor:pointer;
}
a:hover{
	color:#09F;
	text-decoration:none;
}
.button{
	display:inline-block;
	box-shadow: 1px 1px 1px #c4c4c4;
	padding:8px 18px 9px;
	margin: 23px 0 3px 0;
	font-size: 14px;
	line-height: 17px;
	color:#fff;
	text-transform:uppercase;
	background-color: #06C;
	background-repeat: repeat-x;
}
.button:hover{ background:#f7355a; color:#FFFFFF;}

a.knopka {
  color: #fff; /* цвет текста */
  font-size: 19px;
  text-decoration: none; /* убирать подчёркивание у ссылок */
  user-select: none; /* убирать выделение текста */
  background: rgb(212,75,56); /* фон кнопки */
  padding: .7em 1.5em; /* отступ от текста */
  outline: none; /* убирать контур в Mozilla */
} 
a.knopka:hover { background: rgb(232,95,76); } /* при наведении курсора мышки */
a.knopka:active {
	background: rgb(152,15,0);
} /* при нажатии */

a.knopka1 {
	color: #fff; /* цвет текста */
	font-size: 15px;
	text-decoration: none; /* убирать подчёркивание у ссылок */
	user-select: none; /* фон кнопки */
	padding: .7em 1.5em; /* отступ от текста */
	outline: none; /* убирать контур в Mozilla */
	background-color: #06C;
} 
a.knopka1:hover {
	background-color: #09F;
} /* при наведении курсора мышки */
a.knopka1:active {
	background-color: #3C6;
} /* при нажатии */

a.knopka2 {
	color: #fff; /* цвет текста */
	font-size: 15px;
	text-decoration: none; /* убирать подчёркивание у ссылок */
	user-select: none; /* фон кнопки */
	padding: .7em 1.5em; /* отступ от текста */
	outline: none; /* убирать контур в Mozilla */
	background-color: #06C;
} 
a.knopka2:hover {
	background-color: #09F;
} /* при наведении курсора мышки */
a.knopka2:active {
	background-color: #3C6;
} /* при нажатии */

a.size9 {
	display:inline-block;
	box-shadow: 1px 1px 1px #c4c4c4;
	padding:2px 2px 9px;
	margin: 2px 0 0px 0;
	font-size: 10px;
	line-height: 12px;
	color:#fff;
	text-transform:uppercase;
	background-color: #06C;
	background-repeat: repeat-x;
}
a.size9:hover { background:#f7355a; color:#FFFFFF;}

.but_ind{ margin-top:19px}
a.size9 {
	display:inline-block;
	box-shadow: 1px 1px 1px #c4c4c4;
	padding:2px 2px 9px;
	margin: 2px 0 0px 0;
	font-size: 10px;
	line-height: 12px;
	color:#fff;
	text-transform:uppercase;
	background-color: #06C;
	background-repeat: repeat-x;
}
a.size9:hover { background:#f7355a; color:#FFFFFF;}

a.size8 {
color: #430069;
padding: 2px;
font-size:18px;
}
a.size8:hover {
	background-color: #FF6600;
	color: white;
	font-size: 18px;
}
.marg_right1 {margin-right:20px}
.box {background:url(../images/box_bg.png) repeat;color:#faf3ed;box-shadow:0 0 5px rgba(0, 0, 0, .4);-moz-box-shadow:0 0 5px rgba(0, 0, 0, .4);-webkit-box-shadow:0 0 5px rgba(0, 0, 0, .4)}
.box > div {background:url(../images/box_top.png) 0 top no-repeat;padding:30px;padding-top:0;overflow:hidden}
.box h2 {color:#a80002;padding:15px 0 12px 0}
.box h2 span {color:#faf3ed}
.box figure {padding-bottom:13px}
.list1 li a {font-style:italic;padding-left:12px;background:url(../images/marker_1.gif) 1px 8px no-repeat;color:#faf3ed}
.list_1 {color:#fff}
.list_1:hover {text-decoration:none}
.button1 {display:inline-block;font-size:20px;color:#faf3ed;line-height:34px;padding:0 15px;background:#a80002;letter-spacing:-1px}
.button1:hover {text-decoration:none;color:#1e0000;background:#faf3ed}
.testimonials li span {float:left;width:40px;height:40px;font-size:30px;color:#faf3ed;line-height:34px;text-align:center;background:#a80002;margin-right:20px}
.testimonials li p {float:left;width:180px;padding-bottom:15px}
.testimonials li img {padding-top:2px}
.line1 {background:url(../images/line_vert1.gif) 285px 0 repeat-y}
.line2 {background:url(../images/line_vert1.gif) 615px 0 repeat-y}
.price {margin-top:-7px}
.price li {overflow:hidden;background:url(../images/price_bg.gif) 0 -6px repeat-x}
.price a {float:left;color:#220000;background:url(../images/marker_2.gif) 1px 11px no-repeat #faf3ed;padding-left:12px}
.price a:hover {text-decoration:none;color:#a80002}
.price span {float:right;background:#faf3ed}
.address {padding-bottom:0}
.address span {float:left;width:84px}
/* footer */
footer {height:138px;font:13px "Trebuchet MS", Arial, Helvetica, sans-serif;color:#696969;line-height:18px}

footer a:hover {text-decoration:none}
#icons {padding:5px 0 0 0}
#icons li {float:left;padding-right:9px}
/* Tooltips */
.aToolTip {background:#a80002;color:#fff;	margin:0;padding:2px 10px 3px;font-size:11px;position:absolute;line-height:17px}
.aToolTip .aToolTipContent {position:relative;	margin:0;padding:0}
/* forms */
#ContactForm {margin-top:-5px;width:910px}
#ContactForm span {float:left;width:111px;line-height:20px}
#ContactForm .wrapper {min-height:24px}
#ContactForm .textarea_box {min-height:170px;width:100%;overflow:hidden;padding-bottom:9px}
#ContactForm {}
#ContactForm a {margin-left:20px;float:right}
#ContactForm .input {width:399px;height:18px;background:#faf3ed;padding:1px 5px;color:#220000;font:14px Georgia, "Times New Roman", Times, serif;margin:0;float:left}
#ContactForm textarea {overflow:auto;width:789px;height:163px;background:#faf3ed;padding:1px 5px;color:#220000;font:14px Georgia, "Times New Roman", Times, serif;margin:0}
/*================================>> GOOGLE FONTS  <<========================================*/
.sf-menu>li>a{font-family: 'Varela', sans-serif;}

/*********************************page_1*************************************/
/*================================>> LISTS <<========================================*/
.list1{}
.list1 li{margin-bottom:9px;}
.list1 a{
	background:url(../images/marker1.png) 0 -20px no-repeat;
	display:block;
	padding:4px 0 5px 10px;
	font-size: 10px;
	line-height: 12px;
	color:#000;
	text-transform:uppercase;
}
.list1 a:hover{ background-position: 13px 8px; background-color:#f7355a; color:#FFFFFF; padding-left:21px;}
.list2 a{ background:url(../images/marker1.png) 0 -20px no-repeat;  display:inline-block; padding:4px 10px 5px 10px;font-size: 10px; line-height: 12px; color:#757575; text-transform:uppercase;}
.list2 li{ margin-bottom:3px;}
.list2 a:hover{ background-position: 13px 7px; background-color:#f7355a; color:#FFFFFF; padding-left:21px;}
.list3 a{
	background:url(../images/marker1.png) 0 -20px no-repeat;
	display:inline-block;
	padding:4px 10px 5px 12px;
	font-size: 12px;
	line-height: 12px;
	color:#000;
	text-transform:uppercase;
}
.list3 li{ margin-bottom:5px; background:url(../images/list3_li.png) 0 bottom repeat-x; padding-bottom:4px;}
.list3 a:hover{
	background-position: 13px 8px;
	background-color:#f7355a;
	color:#000;
	padding-left:21px;
}
.title{
	font-size: 18px;
	line-height: 21px;
	color:#06F;
	font-family:"Times New Roman", Times, serif;
	margin-bottom:7px;
}
.extra_container{ overflow:hidden;}
.extra_container>figure{ float:left;}
.extra_container>div{
	float:left;
}
.map_wrapper,.product>figure, .services>figure,.harmony>figure,.img_wrap{ display:inline-block;border: 1px solid #eeeeee; background:#fff; padding:4px;}

.black{font-size: 16px; line-height: 21px; color:#212121; display:inline-block; margin-bottom:1px;}

strong{
	color:#000;
}
.product{}
.product>figure{}
.product>div{width:266px;}
.prod_box{ margin-bottom:21px;}

 .leftimg {
    float:left; /* Выравнивание по левому краю */
    margin: 7px 7px 7px 0; /* Отступы вокруг картинки */
   }
   .rightimg  {
    float: right; /* Выравнивание по правому краю  */ 
    margin: 7px 0 7px 7px; /* Отступы вокруг картинки */
   }
a#vverh { display: none; position: fixed; margin-left: -54%; /* своё значение */ margin-left: calc(-100% - 17em); /* вместо 7em своё значение */ padding: 100% 1% 0 99%; bottom: 0; font: 11px/100% Arial, Helvetica, sans-serif; text-decoration: none; color: #bbb; -webkit-transition: 1s; transition: 1s; } a#vverh:before { position: absolute; content: url(http://3.bp.blogspot.com/-Q0hVWzKDCJo/Tpar8l5wvJI/AAAAAAAACZ4/LbpuEBAIQAU/s60/strelka.png); margin: -55px 0 0 -12px; } 
a#vverh:hover {color: #000; background-color: rgba(0,0,0,.3);} 
  button.new {
   background: -moz-linear-gradient(#D0ECF4, #5BC9E1, #D0ECF4);
   background: -webkit-gradient(linear, 0 0, 0  100%, from(#D0ECF4), to(#D0ECF4), color-stop(0.5, #5BC9E1));
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00BBD6', endColorstr='#EBFFFF');
   padding: 3px 7px;
   color: #333;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border-radius: 5px;
   border: 1px solid #666;
  }
.flex{
	display: flex;
}


@media screen and (max-width: 960px){
	*{
		box-sizing: border-box;
	}
	img{max-width: 100%}
	.main {
		margin: 0 auto;
		width: 100%;
		padding: 0 20px;
	}
	.body5 #content .wrap{ display: none;}
	.body5 .main table{ width: 100%}
	.body5 .main table th:nth-child(2){display: none}
	.body5 .main table img{ height:  auto; margin: 0 auto;}
	.body5 .main nav .sf-menu>li>a {
		padding: 8px 12px;
		width: 170px;
		background: #00000020;
		border-radius: 4px;
	}
	.body5 .main nav {
		padding: 30px 0;
		border-bottom: 2px solid #aaa;
	}
	.body5 .main nav ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		gap: 10px;
	}

	#content2  div  article br{ display: none}
	#content2 > div > article{
		width: 100% !important;
		display: grid !important;
		grid-template-columns: 1fr 1fr 1fr;
		place-items: center;
		align-items: start;
		padding-top: 50px;
		border-top: 2px solid #aaa;
		margin-top: 20px;
		padding-bottom: 30px;
	}
	.col1 {
		width: 100%;
	}
	.col1.pad_left1{
		padding-left: 0;
	}
	body{font-size: 18px}
}


@media screen and (max-width: 630px){
	.col1 {
		width: 100%;
	}

	.pad_left1{
		padding-left: 0;
	}

	#content2 > div > article{
		grid-template-columns: 1fr 1fr;
	}
	#content2 > div > article > article:nth-child(7){
		padding-top: 20px;
		grid-column: 1 / -1;   /* растянуть на оба столбца */
	}



}
@media screen and (max-width: 480px){
	.flex {
		flex-wrap: wrap;
	}
	footer > article{
		width: 100%;
		margin-top: 40px;
	}
}