/*отличие div_index и div_chistka */
/* - overflow: hidden; в div_index в html, body {....}*/


*{	margin:0; /*сбросить установленные по умолчанию браузерами расстояния */
	padding:0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}

html, body {
	/*  */
max-height: 100%;
margin: 0;
padding: 0;


	/* overflow: hidden; Отобр только область внутри элемента, остальное скрыто */
}
body {
    background:#f2f1ff url('../pict/f1.gif') no-repeat top center;
	-moz-background-size: 100%;/* Firefox 3.6+ */
    -webkit-background-size: 100%; /* Safari 3.1+ и Chrome 4.0+ */
    -o-background-size: 100% ; /* Opera 9.6+ */
    background-size: cover; /* Современные браузеры */


}

/* --------------  формируем максим ширину сайта:  2 варианта: с фоном и без -------------- */
@media screen and (min-width: 1400px) {		/* min-width:  ширина окна больше 1366 */

#container {		/* разместить блок в центре другого */
max-width: 1366px;	/* исх=1366px   1366/1920*100=71.145833333333333% */
/* height: 100%; */
height: 100%;

margin:0 auto;
background: #f2f1ff;
}
}

@media screen and (max-width: 1400px) {		/* max-width:  ширина окна меньше 1366 */
#container {		/* разместить блок в центре другого */
max-width: 100%;	/* исх=1366px   1366/1920*100=71.145833333333333% */
/* height: 100%; */

margin:0 auto;
background: #f2f1ff;		
}
}
/* ------------------------------------- */
#zaglav {		
max-width: 100%;		/*исходные: max-width: 1366px; height: 425px;*/
margin:0 auto;		/* разместить блок в центре другого */
		
}

/* flexible media */
 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { 
    display: block;
} 

img {
	max-width: 100%;
	height: auto;
}

.fon_nazv{
		max-width: 100%;
		color: #f2f1ff;
		}
@media screen and (min-width: 1400px) {			 
#nazv {
padding-top:25px;
}
}
@media screen and (min-width:700px) and (max-width: 1400px) {			 
#nazv {
padding-top:15px;
}
}

/* -----------  фон под названием  -------------- */
@media screen and (min-width: 1400px) {		/* min-width:  ширина окна больше 1366 max-height: 100%;*/
.fon_nazv{
		background: #f2f1ff url('../pict/fonsr3_7b.gif') no-repeat top center;/*1366*453*/
		/*background-size: cover;*/		/* массштабирует изображение фона: */
									/* растяг-ся на всю ширину и высоту блока, к кот приенено */	
		/*-webkit-background-size: cover;*/
		/*-moz-background-size: cover;*/
		/*-o-background-size: cover*/
		}
}


@media screen and (min-width:1300px) and (max-width: 1400px) {		/* max-width:  ширина окна меньше 1366 max-height: 100%;*/
.fon_nazv{
background: #f2f1ff url('../pict/fonsr3_7s.gif') no-repeat top center;	/*1366*360*/
}
}

@media screen and (min-width:1250px) and (max-width: 1300px) {		/* max-width:  ширина окна больше 1366 max-height: 100%;*/
.fon_nazv{
		background: #f2f1ff url('../pict/fonsr3_7ss.gif') no-repeat top center;	/*1280*360*/
		/*background-size: cover;*/		/* массштабирует изображение фона: */
									/* растяг-ся на всю ширину и высоту блока, к кот приенено */	
		/*-webkit-background-size: cover;*/
		/*-moz-background-size: cover;*/
		/*-o-background-size: cover*/
		}
}

@media screen and (min-width:1180px) and (max-width: 1250px) {		/* max-width:  ширина окна больше 1366 max-height: 100%;*/
.fon_nazv{
		background: #f2f1ff url('../pict/fonsr3_7.gif') no-repeat top center;	/*1280*425*/
		/*background-size: cover;*/		/* массштабирует изображение фона: */
									/* растяг-ся на всю ширину и высоту блока, к кот приенено */	
		/*-webkit-background-size: cover;*/
		/*-moz-background-size: cover;*/
		/*-o-background-size: cover*/
		}
}
@media screen and (min-width:700px) and (max-width: 1180px) {		/* max-width:  ширина окна больше 1366 max-height: 100%;*/
.fon_nazv{
		background: #f2f1ff url('../pict/fonsr3_7.gif') no-repeat top center;	/*1280*425*/
		/*background-size: cover;*/		/* массштабирует изображение фона: */
									/* растяг-ся на всю ширину и высоту блока, к кот приенено */	
		/*-webkit-background-size: cover;*/
		/*-moz-background-size: cover;*/
		/*-o-background-size: cover*/
		}
}

@media screen and (min-width:500px) and (max-width: 700px) {			/* ширина окна меньше 720px max-height: 100%;*/
.fon_nazv{
		background: #f2f1ff url('../pict/fonsr3_7pl.gif') no-repeat top center;	/*720*239*/
		}
}

@media screen and (min-width:300px) and (max-width: 500px) {			/* ширина окна меньше 720px max-height: 100%;*/
.fon_nazv{
		background: #f2f1ff url('../pict/fonsr3_7pl.gif') no-repeat top center;	/*720*239*/
		}
}	
@media screen and (max-width: 300px) {			/* ширина окна меньше 300px */
.fon_nazv{	
		background:#f2f1ff url('../pict/fonsr3_7mob.gif') no-repeat top center; /*114*20*/
		}
}	
		
@media only screen and (-webkit-min-device-pixel-ratio: 2),
	   only screen and (-webkit-min-device-pixel-ratio: 1.5),
	   only screen and (-moz-min-device-pixel-ratio: 2),
	   only screen and (-o-min-device-pixel-ratio: 3/2),
	   only screen and (-o-min-device-pixel-ratio: 2/1),
	   only screen and (min--moz-device-pixel-ratio: 1.5),
	   only screen and (min-device-pixel-ratio: 1.5), 
	   only screen and (min-device-pixel-ratio: 2),
	   only screen and (min-resolution: 192dpi),
	   only screen and (min-resolution: 2dppx) { 

  		.fon_nazv {
  			background: #f2f1ff url("../pict/fonsr3_7mob.gif") no-repeat top center;
  			background-size: 150px 50px;
  		}
}
/* ------------------------------------- */

/* горизонтальное меню */
@media screen and (min-width:1400px){			/* ширина окна больше 500px */

.nav ul{
	position:relative;	
margin:0px auto;
width: 730px;
height:100px;			/* дает расстояние от меню до content */	

}

.nav li{
display:table;
width: 140px;
height:46px;
float: left;
padding-left: 30px;						/*смещение гориз полосы*/
background-image: url(../pict/polgor.gif);
background-repeat: no-repeat;
background-position: 2% 25px;			/*позиция гориз полосы по гориз и вертик*/	
padding-bottom: 5px;
				
}
.nav a{
display:table-cell;
text-align:left;
padding-left: 7px;		/*отcтуп от вертикальной полосы*/
vertical-align:top;	
	
	font-size:0.8em; 		/*  12px 11px=11/16=0,69em Verbana цвет тоже белый   */
	font-family:arial,Helvetica,sans-serif;
	letter-spacing: 0.01em;		/* 1px добавила интервал между символами  */
list-style-type: none;		/*отмена маркера*/
text-decoration: none;		/*мигающий текст*/
}
/*.nav a:hover {				 наведении на него курсора мыши 
	color: #000;
}*/
}

@media screen and (min-width:1300px) and (max-width: 1400px) {			/* ширина окна больше 500px */

.nav ul{
	position:relative;	
margin:0px auto;
width: 730px;
height:70px;			/* дает расстояние от меню до content */	

}

.nav li{
display:table;
width: 140px;
height:46px;
float: left;
padding-left: 30px;						/*смещение гориз полосы*/
background-image: url(../pict/polgor.gif);
background-repeat: no-repeat;
background-position: 2% 25px;			/*позиция гориз полосы по гориз и вертик*/	
padding-bottom: 5px;
				
}
.nav a{
display:table-cell;
text-align:left;
padding-left: 7px;		/*отcтуп от вертикальной полосы*/
vertical-align:top;	
	
	font-size:0.74em; 		/*  12px 11px=11/16=0,69em Verbana цвет тоже белый   */
	font-family:arial,Helvetica,sans-serif;
	letter-spacing: 0.07em;		/* 1px добавила интервал между символами  */
list-style-type: none;		/*отмена маркера*/
text-decoration: none;		/*мигающий текст*/
}
/*.nav a:hover {				 наведении на него курсора мыши 
	color: #000;
}*/
}

@media screen and (min-width:1250px) and (max-width: 1300px) {			/* ширина окна больше 500px */

.nav ul{
	position:relative;	
margin:0px auto;
width: 730px;
height:90px;			/* дает расстояние от меню до content */	

}

.nav li{
display:table;
width: 140px;
height:46px;
float: left;
padding-left: 30px;						/*смещение гориз полосы*/
background-image: url(../pict/polgor.gif);
background-repeat: no-repeat;
background-position: 2% 25px;			/*позиция гориз полосы по гориз и вертик*/	
padding-bottom: 5px;
				
}
.nav a{
display:table-cell;
text-align:left;
padding-left: 7px;		/*отcтуп от вертикальной полосы*/
vertical-align:top;	
	
	font-size:0.74em; 		/*  12px 11px=11/16=0,69em Verbana цвет тоже белый   */
	font-family:arial,Helvetica,sans-serif;
	letter-spacing: 0.07em;		/* 1px добавила интервал между символами  */
list-style-type: none;		/*отмена маркера*/
text-decoration: none;		/*мигающий текст*/
}
/*.nav a:hover {				 наведении на него курсора мыши 
	color: #000;
}*/
}

@media screen and (min-width:700px) and (max-width: 1250px) {			/* ширина окна больше 500px */

.nav ul{
	position:relative;	
margin:0px auto;
width: 730px;
height:100px;			/* дает расстояние от меню до content */	

}

.nav li{
display:table;
width: 140px;
height:46px;
float: left;
padding-left: 30px;						/*смещение гориз полосы*/
background-image: url(../pict/polgor.gif);
background-repeat: no-repeat;
background-position: 2% 25px;			/*позиция гориз полосы по гориз и вертик*/	
padding-bottom: 5px;
				
}
.nav a{
display:table-cell;
text-align:left;
padding-left: 7px;		/*отcтуп от вертикальной полосы*/
vertical-align:top;	
	
	font-size:0.74em; 		/*  12px 11px=11/16=0,69em Verbana цвет тоже белый   */
	font-family:arial,Helvetica,sans-serif;
	letter-spacing: 0.07em;		/* 1px добавила интервал между символами  */
list-style-type: none;		/*отмена маркера*/
text-decoration: none;		/*мигающий текст*/
}
/*.nav a:hover {				 наведении на него курсора мыши 
	color: #000;
}*/
}

/* вертикальное меню */
@media screen and (max-width: 700px) {			/* ширина окна меньше 480px */
#nazv {
max-width: 65%;
padding-left: 20px;
float: left;
/* border: 4px double grey;*/	
}

.nav {
margin-left: 66%;				/* Отступ слева для начала след блока*/
position: relative;
z-index: 999;
min-height: 80px;		/* ????????  верхний отступ - расширяет фон*/							
width: 32%;
font-size: 100%;
/* border: 4px double yellow;*/	
}
.nav ul {
		width: 110px;			/* width: 40px; ширина кнопки*/
		padding: 15px 0;		/* высота кнопки*/
		position: absolute;
		top: 28px;				/* отступ кнопки*/
		left: 0px;
		
		background: url(../pict/xls3.jpg) no-repeat 35px 1px;	/* #f2f1ff - фон мой, отступ изобр слева и сверху */
		/*border: solid 1px #aaa;			 окантовка кнопки
		border-radius: 5px;
		box-shadow: 0 1px 2px rgba(0,0,0,.3);*/

		
		
	}
	.nav li {
		display: none; /* скрыть все <li> пункты */
		margin: 0px;
		top: 1px;				/* отступ кнопки*/
		left: 1px;
		
	}

	.nav a {
		display: block;
		
		padding: 5px 5px 5px 10px;		/* 10px отступ слева */
		text-align: left;
		/*border: 4px double black;*/
	}
	.nav .current a {
		
		background: none;
					/* color: #666; подсветка при наведении мыши - есть в теле head */
	}
 
	/* при наведении на пункты меню */
	.nav ul:hover {
		width: 110px;			/* width: 110px; ширина столбца*/
		
		background-image: none;
		background-color:#f2f1ff ;	/*	 фон меню*/
		border: solid 1px #aaa;		/*	 окантовка меню*/
		border-radius: 5px;
		box-shadow: 0 1px 2px rgba(0,0,0,.3);
	}
	.nav ul:hover li {
		display: block;
		
		margin: 0 0 50px;		/* width: 50px; ширина между строк*/
	}
	.nav ul:hover .current {
		/*background: url(../pict/xls3.jpg) no-repeat 5px 1px;*/
	}
 
	/* адаптивное меню справа */
	.nav.right ul {
		left: auto;
		right: 0;
	}

}

@media screen and (max-width: 300px) {			/* ширина окна меньше 300px */
#nazv {
width: 40%;
float: left;
/*border: 4px double grey;*/
}

#gormenu {
margin-left: 41%;				/* Отступ слева для начала след блока*/
width: 58%;
font-size: 70%;
}

#gormenu li{
height: 20px;
padding-left: 20px;							/*смещение текста и верт полосы*/
text-align:left;
background-image: url(../pict/polgor.gif);
background-repeat: no-repeat;
background-position: 2% 19px;			/*позиция гориз полосы по гориз и вертик(отст сверху)*/
padding-bottom: 1px;
list-style-type: none;			/*убрать маркер - точка слева*/
}

#gormenu li a{
text-align:left;				/*выравн по вертик:  главная услуги ...*/
text-decoration: none;					/*мигающий текст*/
dusplay: block;			/*переопред строч элем на блочные, чтоб не наводить курсор точно на текст*/
}
}
#opisanie
{
margin:30px 0px 1.7px 250px; 				/* 30px - отступ от верх, 1.7px - низ*/
	font-size:0.7em; 		/*  12px 11px=11/16=0,69em Verbana цвет тоже белый   */
	font-family:arial,Helvetica,sans-serif;
	line-height:1.5em;	 /*  18px 14px=14/16=0.88em межстрочн интерв=(line-height/font-size)/2 расст поля с надп с маленьк фото*/
	letter-spacing: 0.01em;	
}
#pol1
{
margin:30px 0px 1.7px 0px; 				/* 30px - отступ от верх, 1.7px - низ*/
height: 2px;
background:#f2f1ff url(../pict/polosa_s.gif) left ;
}
#pol2{
height: 2px;
background:#f2f1ff url(../pict/polosa_s.gif) ;
}
#foot{
	
margin:10px 0px 0px 0px; 
height: 50px; 
font-size: 0.35em; 		/*  12px 11px=11/16=0,69em Verbana цвет тоже белый   */
font-family: arial,Helvetica,sans-serif;
letter-spacing: 0.07em;
font-weight: bold;
}

.tel{
float: left;
width: 30%;
height: 40px;
padding-left: 50px;
background-image: url(../pict/telefon7.png);
background-repeat: no-repeat;
background-position: 25px -3px;		/*  20px отступ по гориз, 1рх отступ по вертие   */
}
.god{
padding-right: 20px;
float: right;
width: 30%;
}
/*#content*/
/*{*/
/*padding-top: 10px;*/			/*отступ от низа фона*/
/*margin:0px auto;*/
/*width: 960px;	*/			/* ????????  почему, но нормально*/				
/*}*/