/* фиксация первой строки таблицы*/

.tab_fix {
        position:fixed;
        top: 113px;
        z-index: 1;
}

.tb_fix {
        position:fixed;
        top: 0px;
        z-index: 1;
		width: 100%;
}
.tb_fix_vertically {
        position:fixed;
        top: 140px;
		left: 0px;
        z-index: 1;
}


.tb_base {
		height: 120px;
		width: 100%;
}


/* Радио для выбора */
.radios-as-buttons {
    margin: 0px;
    font-family: Arial;
    font-size: 14px;
}
.radios-as-buttons div {
    float: left;
    width: 125px;
}
.radios-as-buttons input {
    position: absolute;
    left: -9999px;
}
.radios-as-buttons label {
    display: block;
    margin: 0 0 0 -1px;
    padding: 5px 10px;
    border: 1px solid #BBBBBB;
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .12);
    cursor: pointer;
    text-align: center;
}
.radios-as-buttons input:checked + label {
    background: white;
    box-shadow: inset 0 3px 6px rgba(0, 0, 0, .2);
}
.radios-as-buttons div:first-child label {
    margin-left: 0;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}
.radios-as-buttons div:last-child label {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.radios-as-buttons label:hover{
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(177,177,177,1) 100%);
}

.radios-as-buttons label:active{
    background: white;
    box-shadow: inset 0 3px 6px rgba(0, 0, 0, .1);
}


/* Радио для выбора вертикальная */
.radios-as-buttons-vertically {
    font-family: Arial;
    font-size: 14px;
}
.radios-as-buttons-vertically div {
    float: left;
    width: 200px;
    clear: both;
    border-left: 5px solid #fb9337;
}
.radios-as-buttons-vertically input {
    position: absolute;
    left: -9999px;
}
.radios-as-buttons-vertically label {
    display: block;
    /* height: 33px; */
    margin: 0 0 0 -1px;
    padding: 15px 5px 15px 5px;
    border-top: 1px solid #BBBBBB;
    background:#3c4f6d;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .12);
    cursor: pointer;
    text-align: center;
    color: #FFF;
    font-size: 100%;
}
.radios-as-buttons-vertically input:checked + label {
    background: #4e77ad;
    box-shadow: inset 0 3px 6px rgba(0, 0, 0, .2);
    color: #FFF;
}
.radios-as-buttons-vertically div:first-child label {
    border-top-right-radius: 4px;
}
.radios-as-buttons-vertically div:last-child label {
    border-bottom-right-radius: 4px;
}
.radios-as-buttons-vertically label:hover{
    background: #3e5f8a;
    color: #FFF;
}
.radios-as-buttons-vertically label:active{
    color: #000;
    background: #4e77ad;
    box-shadow: inset 0 3px 6px rgba(0, 0, 0, .1);
}


/* кнопка*/
.btn_tbl {
    height: 100%;
    width: 100%;
    display: block;
    margin: 0 0 0 0px;
    padding: 5px 3px;
    border: 1px solid #BBBBBB;
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%);
    box-shadow: 0 2px 5px rgba(0, 0, 0, .12);
    cursor: pointer;
    text-align: center;
	border-radius: 4px;
}

.btn_tbl:hover{
    background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(177,177,177,1) 100%);
}

.btn_tbl:active{
    background: white;
    box-shadow: inset 0 3px 6px rgba(0, 0, 0, .2);
}


.btn_tbl_disable {
    height: 100%;
    width: 100%;
    display: block;
    margin: 0 0 0 0px;
    padding: 5px 3px;
    border: 1px solid #BBBBBB;
    box-shadow: 0 2px 5px rgba(0, 0, 0, .12);
    cursor: pointer;
    text-align: center;
	border-radius: 4px;
}

/* таблица*/
.p_tbl{
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
.p_tbl tr.is_enable,
.p_tbl td.is_enable{
	background: rgba(0,255,0,0.2);
}
.p_tbl tr.is_disable,
.p_tbl td.is_disable{
	background: rgba(255,0,0,0.2);
}
.p_tbl th, .p_tbl td{
	padding: 7px 3px;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.p_tbl th{
	background: #fcfcfc;
	color: #333;
	font-weight: bold;
}
/* Цвет фона при наведении  чередование*/
.p_tbl tr:nth-child(2n) {
    background: #f0f0f0; /* Цвет фона */
   } 
.p_tbl tr:hover {
    background: rgba(200,200,200,1); /* Цвет фона при наведении */
}






.p_tbl_c{
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
.p_tbl_c tr.is_enable,
.p_tbl_c td.is_enable{
	background: rgba(0,255,0,0.2);
}
.p_tbl_c tr.is_disable,
.p_tbl_c td.is_disable{
	background: rgba(255,0,0,0.2);
}
.p_tbl_c th, .p_tbl_c td{
	padding: 5px 3px;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.p_tbl_c th{
	background: #fcfcfc;
	color: #333;
	font-weight: bold;
}
.p_tbl_c tr:hover {
    background: rgba(200,200,200,1); /* Цвет фона при наведении */
}


.p_tbl_c0{
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
.p_tbl_c0 tr.is_enable,
.p_tbl_c0 td.is_enable{
	background: rgba(0,255,0,0.2);
}
.p_tbl_c0 tr.is_disable,
.p_tbl_c0 td.is_disable{
	background: rgba(255,0,0,0.2);
}
.p_tbl_c0 th, .p_tbl_c0 td{
	padding: 6px 3px;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.p_tbl_c0 th{
	background: #fcfcfc;
	color: #333;
	font-weight: bold;
}
/* Цвет фона при наведении  чередование*/
.p_tbl_c0 tr:nth-child(2n) {
    background: #f0f0f0; /* Цвет фона */
   } 
.p_tbl_c0 tr:hover {
    background: rgba(200,200,200,1); /* Цвет фона при наведении */
}










/* таблица простая*/
.tbl{
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
.tbl th, .tbl td{
	padding: 7px 5px;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.tbl th{
	background: #fcfcfc;
	color: #333;
	font-weight: bold;
}




.foot{
	width: 820px;
    margin-left: calc(50% - 410px);
    /* text-align: center; */
    margin-top: 25px;
    /* margin: 15px; */
    font-weight: bold;
    font-size: 150%;
    color: #34445e;
}

.txt_2{
	width: 820px;
    margin-left: calc(50% - 410px);
    text-indent: 5px;
	
	font-size: 150%;
	line-height: 175%;
	margin-top: 50px;
}	
.txt{
	text-indent: 50px;
	font-size: 150%;
	width: 50%;
	margin-left: 25%;
	line-height: 175%;
	margin-top: 50px;
}

.ttl{
	margin: 15px;
	width: 100%;
	text-align: center;
	font-size: 200%;
	font-weight: bold;
	color: #34445e;
}

/* поиск */
.filt_inp{
    width: 250px;
    height: 30px;
    font-size: 17px;
    border: 1px solid #a9a9a9;
    padding: 0 0 0 5px;
}
.filt_inp:focus{
  outline: none;
  border: 1px solid #3c4f6d;
}

.filt_inp_x{
	cursor: pointer;
	background: rgba(255, 255, 0, 0);
	color: #a9a9a9;
	top: 2px;
	left: 259px;
	height:34px;
	width:34px;
	display:inline-block;
 	position: relative;
	text-align: center;
	font-weight: bold;
	font-size: 200%;
  }
  
.filt_inp_x:hover{
    color: #fb9337;
}

/*выделение*/
.highlight{
	background-color:#f0801d;
}


.tr_filt_w{
	background: #fff; /* Цвет фона */
}
.tr_filt_g{
	background: #f0f0f0; /* Цвет фона */
}
.tr_filt_w:hover {
	background: rgba(200,200,200,1); /* Цвет фона при наведении */
}
.tr_filt_g:hover {
	background: rgba(200,200,200,1); /* Цвет фона при наведении */
}


/*легкая тавлица*/
.p_tbl_lite {
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
.p_tbl_lite th, .p_tbl_lite td {
	padding: 7px 5px;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
.p_tbl_lite th {
	background: #fcfcfc;
	color: #333;
	font-weight: bold;
}


.fiend_head{
	position: fixed;
    z-index: 5;
    top: 67px;
    right: 110px;
}

.balans_adm_head{
	position: fixed;
    z-index: 5;
    top: 15px;
    right: 20px;
}


/* модальное окно*/
.modalDialog {
	position: fixed;
	font-family: Arial, Helvetica, sans-serif;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 7;
	transition: opacity 400ms ease-in;
}
.modal_frame {
	position: fixed;
	left: calc(50% - 600px);
	top: 12px; 
	padding: 5px;
	background: #34445e;
	width: 1200px; 
	height: 95%;
/* 	min-height: 675px;
	max-height: 725px; */
	box-shadow: 0 0 2px rgba(0,0,0,0.3);
	border-radius:2px;
}
.modal_frame_2 {
	width: calc(100% - 20px);
	height:  calc(100% - 20px);
	padding: 10px;
	background: #fff;
	border-radius:5px;
}
.modal_close_x {
	cursor: pointer;
	background:  linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(229,229,229,1) 100%);
	color: #000000;
	line-height: 25px;
	position: absolute;
	right: -12px;
	text-align: center;
	top: -10px;
	width: 24px;
	text-decoration: none;
	font-weight: bold;
	font-size: 200%;
	border-radius: 12px;
	box-shadow: 1px 1px 3px #000;
}
.modal_close_x:hover {
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(177,177,177,1) 100%); 
}
.modal_close_x:active {
	background: white; 
}

.modal_close {
	position: absolute;
	bottom: 5px;
	left: 20px;
	width: 100px;
	cursor: pointer;
	background: #fb9337;
	border: 0;
	padding:  12px 10px 12px 10px;
	margin: 5px 5px 5px 0px;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-transform: uppercase;
	border-radius: 2px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.4);
}
.modal_close:hover {
	background: #f0801d; 
}
.modal_close:active {
	background: #f06c1d; 
}
.modal_reset {
	position: absolute;
	bottom: 5px;
	left: 137px;
	width: 100px;
	cursor: pointer;
	background: #fb9337;
	border: 0;
	padding: 12px 10px 12px 10px;
	margin: 5px 5px 5px 0px;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-transform: uppercase;
	border-radius: 2px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.4);
}
.modal_reset:hover {
	background: #f0801d; 
}
.modal_reset:active {
	background: #f06c1d; 
}
.modal_save {
	position: absolute;
	bottom: 5px;
	left: 254px;
	width: 100px;
	cursor: pointer;
	background: #fb9337;
	border: 0;
	padding:  12px 10px 12px 10px;
	margin: 5px 5px 5px 0px;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-transform: uppercase;
	border-radius: 2px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.4);
}
.modal_save:hover {
	background: #f0801d; 
}
.modal_save:active {
	background: #f06c1d; 
}


.modal_status, .modal_status_driver, .modal_status_rates {
	position: absolute;
	bottom: -50px;
	left: 0px;
	width: calc(100% - 20px);
	background: #70bb70; /* зеленый */
	background: #ff8989; /* красный */
	padding:  12px 10px 12px 10px;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	text-transform: uppercase;
	border-radius: 7px;
	box-shadow: 0 1px 2px rgba(0,0,0,0.4);
}







.modal_frame_offset {
	position: fixed;
	left: calc(50% - 577px);
	top: 35px; 
	padding: 5px;
	background: #34445e;
	width: 1200px; 
	height: 95%;
/* 	min-height: 675px;
	max-height: 725px; */
	box-shadow: 0 0 2px rgba(0,0,0,0.3);
	border-radius:2px;
}

/* для карты */
.modal_frame_big {
	position: fixed;
	left: 5%;
	top: 15px; 
	padding: 5px;
	background: #34445e;
	width: 90%; 
	height: calc(100% - 70px);
/* 	min-height: 675px;
	max-height: 725px; */
	box-shadow: 0 0 2px rgba(0,0,0,0.3);
	border-radius:2px;
}

.modal_frame_verify {
	position: fixed;
	left: calc(50% - 165px);
	top: 25%; 
	padding: 5px;
	background: #34445e;
	width: 375px; 
	height: 175px;
	box-shadow: 0 0 2px rgba(0,0,0,0.3);
	border-radius:2px;
}






.left_block_big {
	float:left;
	width:625px;
	padding: 0px 0px 0px 5px;
}
.right_block_big {
	float:left;
	width:calc(100% - 650px);
	padding: 0px;
}



/*//////////////////////////////////////////////*/

.tooltip {
	border-bottom: 1px dotted #000000; color: #000000; outline: none;
	cursor: help; text-decoration: none;
	position: relative;
}
.tooltip span {
	margin-left: -999em;
	position: absolute;
}
.tooltip:hover span {
	border-radius: 5px 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; 
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1); -webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
	font-family: Calibri, Tahoma, Geneva, sans-serif;
	position: absolute; left: 1em; top: 3em; z-index: 99;
	margin-left: 0; width: 250px;
}
/* .tooltip:hover img {
	border: 0; margin: -10px 0 0 -55px;
	float: left; position: absolute;
} */
.tooltip:hover em {
	font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1.2em; font-weight: bold;
	display: block; padding: 0.2em 0 0.6em 0;
}
.classic { padding: 0.8em 1em; }
.custom { padding: 0.5em 0.8em 0.8em 2em; }
* html a:hover { background: transparent; }
/* .classic {background: #FFFFAA; border: 1px solid #FFAD33; } */
.classic { background: #9FDAEE; border: 1px solid #2BB0D7;	}
.critical { background: #FFCCAA; border: 1px solid #FF3334;	}
.help { background: #9FDAEE; border: 1px solid #2BB0D7;	}
.info { background: #9FDAEE; border: 1px solid #2BB0D7;	}
.warning { background: #FFFFAA; border: 1px solid #FFAD33; }





/*-------------------------
	Дизайн подсказки 2
--------------------------*/

.help-tip{
	position: relative;
}

.help-tip:hover p{
	display:block;
	transform-origin: 100% 0%;

	-webkit-animation: fadeIn 0.3s ease-in-out;
	animation: fadeIn 0.3s ease-in-out;

}

.help-tip p{
	display: none;
	text-align: left;
	background-color: #9FDAEE;
	padding: 10px;
	width: 150px;
	position: absolute;
	border-radius: 3px;
	box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
	left: -170px;
	top: -25px;
	color:#354560;
	font-size: 13px;
	line-height: 1.4;
}


@-webkit-keyframes fadeIn {
	0% { 
		opacity:0; 
		transform: scale(0.6);
	}

	100% {
		opacity:100%;
		transform: scale(1);
	}
}

@keyframes fadeIn {
	0% { opacity:0; }
	100% { opacity:100%; }
}


/* 			<div class="help-tip" style="    margin-left: 500px;">
				<p>Текстовая подсказка</p>111
			</div>
 */




        /* Базовый контейнер табов */

.tabs {
	min-width: 320px;
	max-width: 800px;
	padding: 0px;
	margin: 0 auto;
}
        /* Стили секций с содержанием */
        
.tabs > section {
	display: none;
	padding: 5px;
	background: #fff;
	border: 1px solid #ddd;
}

.tabs > section > p {
	margin: 0 0 5px;
	line-height: 1.5;
	color: #383838;
	/* прикрутим анимацию */
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
}
/* Описываем анимацию свойства opacity */

@-webkit-keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes fadeIn {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

/* Прячем чекбоксы */

.tabs > input {
	display: none;
	position: absolute;
}
/* Стили переключателей вкладок (табов) */

.tabs > label {
	display: inline-block;
	margin: 0 0 -1px;
	padding: 7px;
	font-weight: 600;
	text-align: center;
	color: #aaa;
	border: 0px solid #ddd;
	border-width: 1px 1px 1px 1px;
	background: #f1f1f1;
	border-radius: 3px 3px 0 0;
}
/* Шрифт-иконки от Font Awesome в формате Unicode */

.tabs > label:before {
	font-family: fontawesome;
	font-weight: normal;
	margin-right: 10px;
}

/* Изменения стиля переключателей вкладок при наведении */

.tabs > label:hover {
	color: #888;
	cursor: pointer;
}
/* Стили для активной вкладки */

.tabs > input:checked + label {
	color: #555;
	border-top: 1px solid #3e5f8a;
	border-bottom: 1px solid #fff;
	background: #fff;
}
/* Активация секций с помощью псевдокласса :checked */

	#tab1:checked ~ #content-tab1,
	#tab2:checked ~ #content-tab2,
	#tab3:checked ~ #content-tab3,
	#tab4:checked ~ #content-tab4,
	#tab5:checked ~ #content-tab5,
	#tab6:checked ~ #content-tab6,
	#tab7:checked ~ #content-tab7 {
		display: block;
	}



/*        <div class="tabs">
            <input id="tab1" type="radio" name="tabs" checked>
            <label for="tab1">Wordpress</label>
            <input id="tab2" type="radio" name="tabs">
            <label for="tab2">Windows</label>
            <section id="content-tab1">
                <p> WordPress — система управления содержимым сайта с открытым исходным кодом, распространяемая под GNU GPL. Написана на PHP, в качестве базы данных использует MySQL. </p>
                <p> Сфера применения — от блогов до достаточно сложных новостных ресурсов и интернет-магазинов. Встроенная система «тем» и «плагинов» вместе с удачной архитектурой позволяет конструировать практически любые проекты. WordPress выпущен под лицензией GPL версии 2. </p>
            </section>
            <section id="content-tab2">
                <p> Microsoft Windows (произносится [майкрософт ви́ндоус]) — семейство проприетарных операционных систем корпорации Microsoft, ориентированных на применение графического интерфейса при управлении. </p>
                <p> Изначально Windows была всего лишь графической надстройкой для MS-DOS. По состоянию на март 2013 года под управлением операционных систем семейства Windows по данным ресурса NetMarketShare (Net Applications) работает около 90 % персональных компьютеров[1]. Операционные системы Windows работают на платформах x86, x86-64, IA-64, ARM. </p>
            </section>

        </div>*/





.background_9ede9a{background: #9ede9a;}
.background_f0e68c{background: #f0e68c;}
.background_9999ff{background: #9999ff;}
.background_2683ec{background: #2683ec;}
.background_30bfef{background: #30bfef;}
.background_ec8f26{background: #ec8f26;}
.background_baff1d{background: #baff1d;}
.background_f9e532{background: #f9e532;}
.background_e24646{background: #e24646;}

.display_off{
	display: none !important;
}





.chckbx {
	vertical-align: top;
	width: 17px;
	height: 17px;
	margin: 0 3px 0 0;
}
.chckbx + label {
	cursor: pointer;
	display: block;
	margin: 15px 0 15px 0;
}
.chckbx:not(checked) {
	position: absolute;
	opacity: 0;
}
.chckbx:not(checked) + label {
	position: relative;
	padding: 0 0 0 55px;
}
.chckbx:not(checked) + label:before {
	content: '';
	position: absolute;
	top: -4px;
	left: 0;
	width: 50px;
	height: 26px;
	border-radius: 13px;
	background: #CDD1DA;
	box-shadow: inset 0 2px 3px rgba(0,0,0,.2);
}
.chckbx:not(checked) + label:after {
	content: '';
	position: absolute;
	top: -2px;
	left: 2px;
	width: 22px;
	height: 22px;
	border-radius: 10px;
	background: #FFF;
	box-shadow: 0 2px 5px rgba(0,0,0,.3);
	transition: all .2s;
}
.chckbx:checked + label:before {
	background: #34445e;
}
.chckbx:checked + label:after {
	left: 26px;
}