/*учет отступов и границ в блочной модели*/
* {
	-webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
	box-sizing: border-box;
}
/**********************
 сброс стилей браузера 
***********************/
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1.2;
}
ol { 
	padding-left: 1.4em;
	list-style: decimal;
}
ul {
	padding-left: 1.4em;
	list-style: square;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

button { /*сброс стилей кн - button */
	background: none; border: none; margin: 0; 
	padding: 0; font-size: 0; line-height: 0; 
	width: auto; overflow: visible; 
}
/* конец кода сброса стилей браузера */

html { height: 100%; }

body {
	font-family: Times New Roman, Arial, Verdana;
	font-size: 1em;
	color: #000; 
	background-color: #ccc;
	height: 100%;
	width: 100%; /*вся ширина экрана*/
	margin: 0;
	padding: 0;	
}

/*заголовки*/
h1 { font-size: 1.5em; }
h2 { font-size: 1.4em; text-align: center; margin-top: 20px; }
h2 span { font-size: 0.8em; }
h3 { font-size: 1.3em; }
h4 { font-size: 1.2em; margin: 0 0 10px 5%; }
h4 span {font-size: 0.8em; }

/*абзац*/
p {                           /*красн. строка*/
	margin: 1em 0; 
	text-indent: 20px; 
	text-align: justify;
}
.noident {                   /*без отступа*/
	margin: 1em 0;
	text-indent: 0; 
	text-align: justify;
}
.slant {font-style: italic;} /*наклонный текс*/

hr {width: 75%;}

a {color: #00f;}
.form_element a, .chatBlock a {color: #00f;}

/*номерной список - развязка от календаря*/
div ol { 
	width: 100%;
	font-family: Times New Roman, Arial, Verdana;
	font-size: 1em;	
}

/*-----------------------------------------------
цветовое выделение данных и сообщений
-------------------------------------------------*/
.msg_red, .msg_green, .msg_lime, .white{ font-weight: bolder; }
.msg_red     { color: #f63; }  /*красно оранж.*/
.msg_green { color: #090; }  /*темно зелен.*/
.msg_lime   { color: lime; }   
.white        { color: #fff; }  /*белый цвет шрифта*/

/*************
элементы форм
**************/
/*кнопка красная*/
input[type=reset], .button_red {
	padding: 5px 20px;
	background: #f00;
	color: #fff;
	font-weight: bold;
	background: linear-gradient(to bottom, #c00 40%, #f96);
	text-decoration: none; 
	border-radius: 5px;
}
/*кнопка красная при наведении*/
input[type=reset]:hover,  .button_red:hover {
	background: #cfc;
	color: #fff;
	font-weight: bold;
	background: linear-gradient(to top, #c00 40%, #f96);
}
/*кнопка зеленая*/
input[type="submit"], .button_green  {
	padding: 5px  20px;
	margin-bottom: 10px;
	background: #cfc;
	color: #fff;
	font-weight: bold;
	background: linear-gradient(to bottom, #063 40%, #9c9);
	border-radius: 5px;
	text-decoration: none;
}
/*кнопка зеленая при наведении*/	
input[type="submit"]:hover, .button_green:hover {
	background: #cfc;
	color: #fff;
	font-weight: bold;
	background: linear-gradient(to top, #063 40%, #9c9);	
}

/*текстовое поле*/
textaria {resize: none}/*запрет растягивания*/

/*******
таблицы
********/
table {
	background-color: #ccc;
	width: 100%;
	color: #000;         /*обязательно*/
}
caption {                 /*заголовок табл.*/
	padding: 1%;
	background: #9fc;
	font-size: 1.1em;
	font-weight: bold;
}
caption a {color: #000;}  /*ссылка в заголовке табл.*/
th {                     /*шапка табл.*/
	background: #999;
	text-align:  center;
	border-bottom: 1px solid #000;
	padding: 0px 1%;
}
tr { border-bottom: 1px solid #000; }              /*выделение нижней границы строки*/
tr.total_green { color: #060; font-weight: bold; } /*выделение итоговой строки зел.*/
tr.total_red { color: #f00;font-weight: bold; }    /*выделение итоговой строки крас*/
tr:hover { background-color:#fff; }	              /*выделение строки при наведении бел*/
tr.separator {                                     /*верхний разделитель итогового ряда*/
	border-top: 2px solid #f00;
	color: #f00;
	font-weight: bold;
	background: #fff;
}
tr.allot_ye{ background-color:#ff9 }    /*програмное выделение строки*/
tr.allot_bl{ background-color:#9cf }  
tr.allot_or{ background-color:#f93 }   
tr.allot_black {background-color:#333;}
tr.allot_black td a{color: #fff;}        /*цветовое выделение ссылки в ячейке бел*/
td {
	text-align: center; 
	border: 1px solid #000;       
	vertical-align: middle;
	padding-right: 1%;
}
td:first-child {        /*выделение 1-й ячейки, столбца*/
	padding: 0px 1%;
	border-left: none;
}
td a:first-child {      /*ссылка в 1-й ячейке, столбце*/
	color: #000;
	text-decoration: none;
	font-weight: bold;
}
td a.login_link { color: #069; } /*выделение ссылок в ячейках син.*/
td a.ban_link { color: #f00; }   /*выделение забаненых ссылок в ячейках крас.*/

/*таблица с выделением ячеек цветом*/
table.sel_color {
	background-color: #ccc;
	width: 100%;
}
table.sel_color th {
	height:28px;
	padding-top: 7px;
}
table.sel_color  tr  td.colgreen { background-color: #0f0; }              /*выделение ячейки зеленым*/
table.sel_color  tr  td.colred { background-color: #f00; }                /*выделение ячейки красным*/
table.sel_color  tr  td.colblue { background-color: #39f; }               /*выделение ячейки синим*/
table.sel_color  tr  td.colorange { background-color: #fc0 }              /*выделение ячейки оранжевым*/
table.sel_color  tr  td.colblack { background-color: #000; color: #fff }  /*выделение ячейки черным*/
table.sel_color  tr  td.colmarine { background-color: #0ff }              /*выделение ячейки морской волны*/
table.sel_color  tr  td.coldarkgreen { background-color: #093 }           /*выделение ячейки темно зел*/	
table.sel_color  tr  td.colyellow { background-color: #ff0 }              /*выделение ячейки желтым*/

/*таблица графана*/
.marks {float: left; width: 3%; height: 260px;}      /*положение контейнера масштбных меток по у*/
.graf {margin-left: 3%; width: 97%; height: 260px;}  /*положение контейнера таблицы графана*/

table.grafan {   
	background-color: #333;
	width: 100%;
	height: 100%;
	table-layout: fixed;	
}
table.grafan tr td:first-child {  /*1-й столбец - ось у, метки по у*/
	padding: 0px;
	width: 5px;
}
table.grafan tr td {
	padding: 0%;
	width: 3px;               /*задает ширину ячейки*/
	font-size: 3px;           /*задает высоту ячейки*/
	border: 1px solid #333;   /*задает мелкую сетку таблицы*/	
}
table.grafan tr td.scaleX {      /*шкала оси х*/	
	font-size: 14px;          /*размер меток оси х*/
	color: #fff;                   
}

table.scaleY  {                 /*шкала у (только метки)*/
	background-color: #333;
	height: 100%;
	table-layout: fixed;	
}
table.scaleY tr {border: none;}
table.scaleY tr td.marksY {      /*метки оси у*/
	border: none;
	font-size: 14px;          /*размер меток оси у*/
	color: #fff; 
	vertical-align:top;
}

/*вложенная таблица графана*/
table.invest {background-color: #333; width: 100%;}        /*столбец значений*/

table.invest tr td.gridY,              /*выделение сетки по оси y, примыкание к сетке по у, по ху*/
table.invest tr td.gridblue_y, 
table.invest tr td.colgreen_gridy, 
table.invest tr td.colyellow_gridy,
table.invest tr td.gridblue_xy, 
table.invest tr td.colgreen_gridxy, 
table.invest tr td.colyellow_gridxy {border-bottom: 1px solid #9cf;}

table.invest tr td.gridY,            /*выделение сетки по оси x, примыкание к сетке по х, по ху*/
table.invest tr td.axisY,
table.invest tr td.gridblue_x,           
table.invest tr td.colgreen_gridx ,
table.invest tr td.colyellow_gridx,
table.invest tr td.gridblue_xy, 
table.invest tr td.colgreen_gridxy,
table.invest tr td.colyellow_gridxy { border-right: 1px solid #9cf;} 
 	
table.invest tr td.colgreen,         /*выделение ячейки значения зеленым*/
table.invest tr td.colgreen_gridx,
table.invest tr td.colgreen_gridy, 
table.invest tr td.colgreen_gridxy {background-color: #0f0;}	

table.invest tr td.colyellow,       /*выделение ячейки значения желтым*/
table.invest tr td.colyellow_gridx, 
table.invest tr td.colyellow_gridy, 
table.invest tr td.colyellow_gridxy { background-color: #ff0;}                                      

/*таблица загрузки*/
table.half { width: 50%; }

/*таблица склад*/
table.stock  { border: 0px; }
table.stock th {
	background-color: #666;
	border-top: 0px; 
	border-bottom: 0px;
	padding: 0px;
}
table.stock td {padding-right: 0;}

/*вложенная таблица*/
table tr td table.internal { border: 0px; }
table tr td table.internal tr { border: 0px; }
table tr td table.internal tr td {
	border-top: 0px; 
	border-bottom: 0px; 
	font-weight: normal;
}

/*стиль таблиц файлов ошибки*/
table.error {
	width: 100%;
	border: 2px solid #808080;
	font-weight: bold;
	margin: 10px auto;
} 
table.error tr td {
	text-align: center;
	padding: 20px 0;	
}
table.error tr td.list {text-align: left;}
td.list p {padding: 0 20px;}
td.list ol {
	padding: 0 20px;
	margin-top: -20px;
}

/************************
классы разметки страницы 
*************************/
/*суперобертка*/
.wrapper {
	margin: 0 auto;    /*центровка по горизонтали*/
	max-width: 1100px; /*ограничение макс. ширины*/
	min-width: 200px;  /*далее гориз. полоса прокрутки*/
	min-height: 100%;
	background-color: #fff;/*цвет над body, если не задан bg content, то это цвет content*/
	position: relative;
}

/*шапка*/
header {
	height: 110px;
	width: 100%;
	background: #c1cdc1;
	background-image: linear-gradient(to right, #000, #fff 90%);	
	clear: both;
}

/*слоган*/
.slogan { text-align: center; }
.slogan h1 {
	font-size: 3.8em;
	color: #7fff00;
	font-style: italic;
}
.slogan a {text-decoration:none;}
	
/*левый логотип контейнер*/
.logo_left {
	position: absolute;
	left: 0;					      /*положение относит. wrapper*/
	top: 0;	
	width: 120px;
	height: 110px;
	background-image: url(../img/logo_left.jpg);
	background-repeat: no-repeat;
}
	
/*правый логотип контейнер*/
.logo_right {
	position: absolute;
	right: 0;					      /*положение относит. wrapper*/
	top: 0;	
	width: 120px;
	height: 110px;
	background-image: url(../img/logo_right.jpg);
	background-repeat: no-repeat;
}

/*основное горизонтальное меню*/
.menu {
	float:left;
	width:100%;
	margin-top: -2px;
	background-color: #696;
	overflow:hidden;
	position:relative;     /*относ. позиц. - не выведен из потока*/
	height: 32px;
}
.menu ul {
	clear:left;
	float:left;
	list-style:none;
	padding: 1px 0;
	position:relative;
	left:50%;
	text-align:center;
}
.menu ul li {
	display:block;
	float:left;
	position:relative;
	right:50%;
}
.menu ul li a {
   display:block;
   margin:0 0 0 1px;
   padding: 3px;
   background:#ddd;
   color:#000;           /*ссылка не наследует цвет*/  
   text-decoration:none;
   line-height:24px;     /*высота линии ссылок*/
}
.menu ul li a:hover {
   	color:#fff;
	background: #666;
	-moz-transition: all 1s; /*для FF*/
	-ms-transition: all 1s;  /* для ИЭ*/
	-o-transition: all 1s;   /*для opera*/
	transition: all 1s;      /*аним всех парам*/
}
.menu ul li a.active,
.menu ul li a.active:hover {
   color:#fff;
   background:#066;
   font-weight:bold;
 }

/*дополнительное горизонтальное меню */
.menu_dop {                  /*класс списка */
	text-align: left;       /*центрирование списка*/
	list-style-type: none;  /*убираем маркеры*/
	padding: 5px 0 ;
	height: 33px;
	margin-left: 10px;
}
.menu_dop li {               /*класс элементов списка */
	display: inline;         /*элементы списка-строчный элемент*/
	margin-left: -5px;       /*убираем промежуток пробельных символов*/
	line-height: 15px;       /*центрируем по высоте */
}
.menu_dop a {   			 /*класс ссылки */
	display: inline-block;   /*для форм-ния ссылок как блоков*/
	text-decoration: none;   /*убираем подчеркивание*/
	padding: 4px 3px;        /*внутренний отступ*/
	background-color: #099;
	border-left: 2px solid #0cc;
}
.menu_dop a:hover { background: #9cc; }

/*-----------------------------------------------------------
идентификация активных страниц с меню польз. и с меню админа
-------------------------------------------------------------*/
.main .mainLink,          /*осн меню польз.*/
.samples .samplesLink,         
.user .userLink,
.report .reportLink,
.help .helpLink,

.orders .userLink,        /*доп меню личный кабинет*/ 
.rty .userLink, 
.execution .userLink,
.albums .userLink, 
.notice .userLink,
.chat .userLink,  
.privatemsg .userLink,
.mail .userLink, 
.unit .albumsLink,
 
.admin .adminLink,       /*осн. меню админа*/  
.mode .modeLink,
.mngsamples .mngsamplesLink,
.clients .clientsLink,
.mnghelp .mnghelpLink,
 
.mngorders .clientsLink,  /*доп меню админ/клиенты*/
.hardware .clientsLink,
.timeline .clientsLink,
.mngcatalog .clientsLink,
.contacts .clientsLink,
.mngnotice .clientsLink,
.mngprivatemsg .clientsLink,
 
.mngunit .mngcatalogLink { /*доп меню админ/экземпляр */
	background: #366;
	color: #fff;
	font-weight: bold;
}

/*------------
блок контента
--------------*/
.content {
	padding: 0 10px 140px 10px; /*110px - привязка футера*/
	position: relative;
	overflow: hidden;           /*предотвращение схлопывания родителя*/
	min-height: 100%;           /*устанавливаем минимальную высоту !*/
}

/*смещение контента - левое смещение*/
.locate_float {
	float: left;
	width: 50%;
	padding-right: 10px;
}
.wrap_left, .wrap_left28, .wrap_left36, .wrap_left64 { float: left;padding-right: 10px;}
.wrap_left   {width: 50%;}
.wrap_left28 {width: 28%; margin-top: 20px;}
.wrap_left36 {width: 36%;}              
.wrap_left64 {width: 64%;}

/*смещение контента - правое смещение*/
.locate_margin {
	margin-left: 52%;
	width: 48%;        
}
.wrap_right {  
	margin-left: 52%;
	width: 48%;
	margin-top: 20px;
}
.wrap_right72 {  
	float: right;
	width: 72%;
	margin-top: 20px;
}
.cleave_right { float: right; } /*правое прилипание*/
.center { text-align: center; } /*расположение по центру*/

/*нижний колонтитул*/
footer {
	position: absolute;
	left: 0;					      /*положение относит. wrapper*/
	bottom: 0;						  /*положение относит. wrapper*/
	width: 100%;
	height: 140px;    			      /*фиксированная высота*/
	background: #000;
	background-image: linear-gradient(to right, #000, #999 90%);
	color: #fff;
}
/*перенаправление*/
.fork {
	background-image: linear-gradient(to left, #000, #999 90%);
	padding: 5px;
	height: 30px;
	text-align: center;
	font-weight:bold;
}
.fork a {
	color: #fff;
	text-decoration:none;
	font-weight: bolder;
}
.footer_inf {
	float: left;
	width: 81%;
	padding-left: 1%;
	padding-top: 5px;
}
.footer_inf a {
	color: #7FFF00;
	text-decoration:none;
	font-weight: bolder;
}
/*счетчик*/
.countY {
	margin-left:81%;
	margin-top: -10px;
}
.countY p {
	text-align: right;
	padding-right: 5px;
}
.countY p img{
	width:88px; 
	height:31px; 
	border:0;
}

/********************
компоненты контента
*********************/
article { 
	border-bottom : 1px solid #066;
	margin: 0 1% 1em 1%;
}
article h4 { margin: 20px 5px 5px 25px; }

/*контейнер ссылка - мини img*/
figure { 
	display: inline-block;
	vertical-align: top;
	width: 10%;                  /* задает размер контейнера */
	margin: 1%;
}
figure a { text-decoration: none;} /* ссылка - мини img */
figure a img {                     /* мини img */
	width: 100%;				 /* задает размер */
	height: auto;				 /* задает размер */
	border: 1px solid #666;
	margin: 0 5px 5px 0;
	padding: 4px;
	box-shadow: 2px 2px 4px rgba(0,0,0,.5);
}
figure figcaption { /*подписи под мини */
	background-image: linear-gradient(to bottom, #cfc, #ccc);
	text-align:center; 
	font-weight: bold;
	padding: 5px;
	color: #000;
}

.online {
	display: inline-block;
	vertical-align: top;
	width: 20%;                 /* задает размер контейнера */
	margin: 1%;
}

/*-----------------
переключатель стр.
-------------------*/
.PageSelector {margin: 10px; }
.swichItemCur, .swichItem {
	padding: 2px 15px;
	background: #999;
	color: #fff;
	text-decoration: none;
	margin-left: 2px;
}
.swichItemCur {background: #099;}

/*-----------------------------
вывод рис. и инф. по элементу
-----------------------------*/
.img_big img {                            /* большее фото - полный размер */
	width: 100%;
	height: auto;
}
.img_stop img {                           /* обертка заглушки,  большой размер */
	width: 80%;
	height: auto;
	margin: 20px auto ;
}
.img_smok {                              /* непрозрачный рис. */
	padding: 3px;
	opacity: 0.2; 	                     /* прозрачность элемента 20% */
	border: 2px solid #000;
}
.img_ava {                               /* аватар */
	width: 100px; 
	height: 100px;
}
.ava_mini {                              /* уменьш. аватар (в таблицах) */
	width: 50px; 
	height: 50px;
	padding-top: 5px;
}
.admin_mini {                           /* уменьш. аватар админа (в шапке) */
	width: 30px; 
	height: 30px;
}
.img_control {                          /* элементы упр. в таблицах и блоках сообщений */
	width: 20px; 
	height: 20px;
	vertical-align: -5px;
}
.intext {                               /* рис. указатели в тексте (ссылка, скачать) */
	float:left;
	margin-top:-5px;
} 
.wrap_right img { 					   /* логотип в накладной */
	width: 80px; 
	height: auto;
}
.img_noact  { border: 2px solid #f00;} /* выделение красн. цветом - блокированные*/
.img_online { border: 2px solid #ff0;} /* выделение зел. цветом - онлайн*/
.pay { vertical-align: -6px;}          /* рис. метки источника оплаты на форме оплаты*/

/*-----
формы
------*/
.form_element {
	display: table;
	width: 98%;
	background-color: #cfc;
	padding: 15px;
	border: 1px solid #ccc;
	border-radius: 10px;
	color: #000;
}
.form_element h4 { margin: -5px 0 15px 5%;}
.form {
	margin: 10px auto;
	width: 170px;
}
/*многострочное текстовое поле*/
.msgText  { 
	width: 98%;
	padding: 2%;
	height: 100px;
	resize: none; /*запрет растягивания*/
}

/*--------------------------------------------------------
контейнеры сообщений (комент, уведомления, личка, помощь)
----------------------------------------------------------*/
.chatBox, .chatBox_auto {    /*контейнер элементов чата и др. c высотой по заполнению - не более 8*/
	overflow: auto;
	border: 1px solid #666;
	padding: 5px;
	background-color: #999;
}
.chatBox { height: 600px; }  /*контейнер элементов чата и др. c постоянной высотой - верт. прокруткой*/

.chatBlockAdd, .chatBlockFor { /*контейнер сообщения*/
	border: 1px solid #696;
	color: #000;
	margin: 5px;
	padding: 5px;
}
.chatBlockAdd {background-color: rgb(225,240,255);} 		/*контейнер для ввода сообщения*/
.chatBlockFor { background-color: #cfc;	margin-left: 40px;}	/*контейнер для чтения ответа*/

/*-------------
сообщение чата
---------------*/
.addChat {						    /*аватар отправителя*/
	float: left;
	width: 11%;
}
.atrChat { 	                        /*атрибуты отправления*/
	color: #369;
	font-size: 0.8em;
	font-weight: bolder;
	margin:  5px 5px 0 0;
	text-align: center;
}
.textChat, .textChatAdm {			/*текст cообщения*/
	width: 100%;
	text-align: justify;
}	
.delChat {float: right;}           /*cc удалить*/
.delChat a {
	text-decoration: none;
	vertical-align: -5px;/**/
} 
.continueChat {                   /*выделение цветом активного ответа*/
	background-color: #ff9;
	padding: 3px 0 0 3px ;	
} 
	
/*-------------------------------------------------------------
коментарии к экземпляру каталога, вопросы и ответы стр. помощь
---------------------------------------------------------------*/
.addComm {						/*данные отправителя*/
	float: left;
	width: 28%;
	margin-top: 0px;
}
.addComm img {					/*аватар отправителя*/
	float: left; 
	margin-right: 5px	
}
.addComm span {					/*подпись отправителя*/
	color: #369;
	font-size: 0.8em;
	font-weight: bolder;
	margin:  5px 5px 0 0;
}
.textComm {						/*текст комментария*/
	margin: 0 5% 0 28%;         /*margin-left: 28%;*/
	margin-top: 0px;
	padding-left: 5px;
	border-left: 1px solid #999;
}
.textComm span {               /*id комментария*/
	color: #f00;
	font-weight: bolder;
}
.controlComm {
	float: right;
	width: 5%;
	margin-right: 2%;
}

/*---------------------------
уведомления, личка(сообщения)
-----------------------------*/
.addNotMsg {						/*данные отправителя*/
	float: left;
	width: 28%;
	margin-top: 0px;
}
.addNotMsg img {					/*аватар отправителя*/
	float: left; 
	margin-right: 5px	
}
.addNotMsg span {					/*подпись отправителя*/
	color: #369;
	font-size: 0.8em;
	font-weight: bolder;
	margin:  5px 5px 0 0;
}
.textNotMsg {						/*текст сообщения*/
	margin: 0 5% 0 28%;
	padding-left: 5px;
	border-left: 1px solid #999;
}
.textNotMsg span {               	/*id сообщения*/
	color: #f00;
	font-weight: bolder;
}
.controlNotMsg {                    /*управление, действие*/
	float: right;
	width: 5%;
	margin-right: 2%;
}

/*-------------
личка(диалоги) 
---------------*/
.addDialog {						/*данные диалога*/
	float: left;
	width: 60%;
}
.img_bl1 {					       /*аватар отправителя, имя*/
	float: left;
	width: 35%;
}
.img_bl2 {					       /*стрелка, № диалога*/
	float: left;
	width: 20%;
}
.img_bl3 {					       /*аватар получателя, имя*/
	float: left;
	width: 45%;
}
.addDialog .img_bl1 span,          /*подпись отправителя*/
.addDialog .img_bl2 span,
.addDialog .img_bl3 span {		   
	color: #369;
	font-size: 0.8em;
	font-weight: bolder;
}
.textDialog {					  /*текст*/
	margin: 0 7% 0 60%;
	border-left: 1px solid #999;
	padding-left: 5px;
}
.controlDialog {                  /*упр: блокировать, удалить*/
	float: right;
	width: 7%;
}
.controlDialog a {text-decoration: none;}

/*пустой блок*/
.empty_block {
	background-color: #ccc;
	width: 98%;
	height: auto;
	padding: 10px;
}
/*блок информации - текстовая информация*/
.block_inf { padding-top: 0px; }
.block_inf p {margin-top: 10px;  text-indent: 10px;}

/*всплывающее окошко*/
#wrap, #window {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	padding: 16px;
	overflow-y: auto;
	display: none;
}
#wrap {
	background-color: rgba(1, 1, 1, 0.6);
	z-index: 100;	
}
#window {
	width: 40%;
	height: 300px;
	margin: 10% auto;
	background: #fff;
	border: 1px #fff solid;
	border-radius: 5px;
	z-index: 200;
}
#window h3 {color: #f00;}

/*всплывающее окошко сообщений*/
#wrap_msg, #window_msg {
	position: fixed;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	padding: 16px;
	overflow-y: auto;
	display: none;
}
#wrap_msg {
	background-color: rgba(1, 1, 1, 0.6);
	z-index: 100;	
}
#window_msg {
	color: #fff;
	width: 40%;
	height: 250px;
	margin: 10% auto;
	border: 1px #fff solid;
	border-radius: 5px;
	z-index: 200;	
}
.msg_err #window_msg  {background: #f00;} /*красн тип 1*/
.msg_inf #window_msg  {background: #369;} /*син тип 2*/
.msg_res #window_msg  {background: #666;} /*серый тип 3*/
.msg_inf #window_msg  p, .msg_err #window_msg p, .msg_res #window_msg  p {text-indent: 0;}
.close {
	position: relative; 
	float: right;
	margin-top: -5px;
	margin-right: -5px;
	cursor: pointer;
}

/*всплывающее окошко сообщений о непрочитанных уведомлениях*/
.wrap_notice { 
	padding: 35px 10px 7px 10px;
	width: 35%;
}
#window_notice {
	color: #fff;
	background: #369;
	margin: 2px 5px;
	padding: 3px ;
	border: 1px #f00 solid;
	text-align: center;
	border-radius: 5px;
}

/*всплывающая форма*/
#hidden_form { display: none; }

/*блок ошибок*/
.block_err {
	background-color: #666;
	position: relative;
	padding: 10px;
	font-weight: bold; 
	color:#fff;
	text-align: left;
	border: #999 4px solid;
}
.block_err h3, .block_err p, .block_err a {color: #ff0;}

/*очистка потока*/
.clear {clear: both;}

/*ссылка без подчеркивания*/
.slaider  {text-decoration: none;}

/*элементы формы уст. статуса заказа*/
.form_order .label {
	display: inline-block;
	width: 40%;
	vertical-align: top;
	text-align: right;
	margin-right: 10px;
}
.form_order input[type="text"] {
	margin-bottom: 3px;
	border: 1px #063 solid;
}
.form_order input[type="text"].stock {background-color: #ff9;}
.form_order input[type="text"].disp  {background-color: #cff;}
.form_order input[type="text"].tehn  {background-color: #fcc;}
.form_order input[type="text"]:focus {
	background-color: #cfc;
	color: #000;
	border: 2px #360 solid;
}
.form_order fieldset {
	width: auto;
	border: 2px #063 dotted;
	background: #cfc;
	background: linear-gradient(to left, #cfc , #fff);
	border-radius: 10px;
}
.form_order legend {
	color: #fff;
	font-weight: bold;
	background: linear-gradient(to bottom, #063 40%, #9c9);
	border-radius: 5px;
	padding: 5px 20px;
	margin-left: 30px;
}

/*раскрывающийся ответ FAQ */
.hide {display: none;}                   /*скрываем чекбоксы и блоки с содержанием*/
.hide + label ~ div{display: none;}
.hide + label {             				 /*оформляем текст label*/
    border-bottom: 1px dotted green;
    padding: 0;
    color: green;
    cursor: pointer;
    display: inline-block; 
}
.hide:checked + label {      				/*вид текста label при активном переключателе*/
    color: red;
    border-bottom: 0;
}
.hide:checked + label + div { 				/*когда чекбокс активен показываем блоки с содержанием */
    display: block; 
    background: #efefef;
    -moz-box-shadow: inset 3px 3px 10px #7d8e8f;
    -webkit-box-shadow: inset 3px 3px 10px #7d8e8f;
    box-shadow: inset 3px 3px 10px #7d8e8f;
    padding: 10px;
	color: #000;
}
.faq {margin: 0 1%;} 					/*FAQ контейнер*/

/*раскрывающийся список equipment */
.hide_eq {display: none;}                   /*скрываем чекбоксы и блоки с содержанием*/
.hide_eq + label ~ div{display: none;}
.hide_eq + label {             				 /*оформляем текст label*/ 
    padding: 0;
    color: #f00;
    cursor: pointer;
    display: inline-block; 
}
.hide_eq:checked + label {      				/*вид текста label при активном переключателе*/
    color: #00f;
    border-bottom: 0;
}
.hide_eq:checked + label + div { 				/*когда чекбокс активен показываем блоки с содержанием */
    display: block; 
    padding: 10px 0px 10px 0px;
	color: #000;
}
.equipment{margin: 0px;} 		

.screencast{
	width: 102%;
	height: 710px;
	margin: 0 0 0 -10px;
	background-image: url(../img/screencast.jpg);
	background-size: 100% 100%;/**/
	background-repeat: no-repeat;
	color: #fff;
	padding-left: 10px;
}
.screencast ol a {
	text-decoration: none;
	color: #fff;
}
.screencast ol a:hover {
	background: #9cf;
	color: #000;
}
.list_screen {
	position: relative; 
	left: 0px;
	top: 10px;/**/
}
.title_screen {              /*заставка при записи скринкаста*/
	position: absolute;  
	left: 35%; 
	top: 70px;
	padding: 0 10px 15px 10px;
	font-weight: bold; 
	color:#fff;
	border: #fff 2px solid;	
}

/*стиль ф-ции debug*/
.show_tsv {
	background-color: #708090;
	font: bold 1em Courier New; 
	color:#fff;
	position: relative;
	width: 100%;
	padding: 10px;
	margin: 10px;
	text-align: left;
	text-indent: 0;
	border: 6px double;
}

/*вывод инф. по ошибке*/
.show_error {
	margin: 5px auto;
	background-color: #369;
	font: bold 1em Courier New; 
	color:#fff;
	width: 100%;
	padding: 10px;
	text-align: left;
	border: 6px double;
}

/*********
адаптация
**********/
@media (max-width:896px) {
	figure {width: 11.7%;}
}

@media (max-width:768px) {
	figure {width: 14%;}
	.locate_float {
		float: none;
		width: auto;
		padding-right: 10px;
	}
	.locate_margin {margin-left: 0; width: auto;}
	.slogan h1 {font-size: 2.9em; padding-top: 12px;}
	.wrap_notice {width: 55%}
}

@media (max-width:640px) {
	figure {width: 17%;}
	.slogan h1 {font-size: 2.9em;}
	.wrap_notice {width: 55%}
}

@media (max-width:512px) {
	header nav ul li a span {display: none;}
	figure {width: 21.5%;}
	.slogan h1 {font-size: 2.4em; padding-top: 15px;}
	footer .countY p img{
		width:74px; 
		height:31px; 
		border:0;
	}
	#window {width: 80%;}
	.wrap_notice {width: 65%}
}	

@media (max-width: 400px) {
	body {font-size: 0.8em;}
	header {height: 54px;}
	header nav ul li a span {display: none;}
	nav {height: 50px;}
	figure {width: 28%; margin: 1% 1.8%; }
	.logo_right {
		width: 60px;
		height: 55px;
		background-size: 60px 55px;
		background-image: url(../img/logo_right.jpg);
	}
	.logo_left {
		width: 60px;
		height: 55px;
		background-size: 60px 55px;
		background-image: url(../img/logo_left.jpg);
	}
	.slogan h1 {font-size: 1.7em; padding-top: 0px;}	
	.ask .wrap_left28, .ask .wrap_right72 {float: none; width: auto;}
	.ask .wrap_right72 {margin-top: 0;}
	.footer_inf {float: left; width: 70%;}
	.countY {margin-left:70%; width: 30%;}
	.cleave_right{float: none;}
	.wrap_notice {width: 80%}	
}

@media (max-width:320px) {
	header {height: 55px;}
	.slogan h1 { 
		font-size: 1.5em;
		padding-top: 4px;
		padding-left: 10%;
	}	
	.menu {
		font-size: 1.2em;
		height: auto;
		float: none;
		width: 100%;
		background: #999;
	}
	.menu li { 
		display: block;
		width: 60%;		
		text-align: left;
		margin: 1px 1%;
	}
	.menu a { 
		text-decoration: none;      
		padding: 0 4%;              
		color: #000;              
		width: 90%; 
	}
	figure {width: 35%; margin: 1% 6%;}
	.msg {padding: 2%;}
	.footer_inf {float: none; width: 100%;}
	.countY {display: none}
	.wrap_notice {width: 100%}	
}	
@media (max-width:240px) {
	.slogan {display: none}
	.wrap_notice {width: 100%}	
}