/*common elements*/
html, body {
    margin: 0;
    padding: 0;
    border: none;
    height: 100%;
}
body, table, tr, td, th, input, select, textarea, button, form, ul, li, p {
	font-size: 11px; 
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	color:black;
}
form {margin: 0;padding:0;}
p {margin: 0.5em;}
table {border-collapse: collapse;}
img {border: none; margin: 0; vertical-align: middle;}
a, a:link, a:visited {color: #111111; text-decoration: underline;}
a:hover {color: #ff7600; text-decoration: underline;}


/* form elements  */
input {color: black; padding: 0 0.3em; }
input:read-only {color:#555; background-color:#f0f0f0;}
input:disabled {color:#555; background-color:#f0f0f0;}
select:disabled {color:#555;}
select option[disabled] { color:#ddd;}

.detail .td input[type="text"]:disabled {border:1px solid #aaa; color:#555;} 
.textbox-disabled {display:inline-block; border: 1px solid #aaa; color:#555; background-color:#f0f0f0; padding:.1em;}

/*layout*/

div.vspacer {height:5px;}

ul#mainmenu {
	list-style-type:none;
	padding:0;
	margin:0;
	display:block;
	width:100%;
}
ul#mainmenu li {
	text-align:right; 
	vertical-align:baseline; 
	padding:.2em 15px .2em 0 ;
	margin:.3em 0; 
	background: url('../img/sarrow.gif') center right no-repeat;
	font-size:120%;
	font-weight:normal;
	font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif;
	line-height: 1.1em;
}
ul#mainmenu li a{/*display:block;*/color:#cde;text-decoration:none;}
ul#mainmenu li a:hover{text-decoration:underline;}
ul#mainmenu li.selected {color: /*#4682b4;*/ #fa6 /*#00f*/;}
ul#mainmenu li.menu-item-ext {background: url('../img/external.gif') center right no-repeat;}
ul#mainmenu li.menu-item-noaction {background: none; color: #777;}
ul#mainmenu li.menu-title {
	color: #111; 
	background:none white;
	margin:.5em 0 0 0;
	/*font-weight: bold;*/
	/*border:1px solid #ccc;*/
}

.page {display:table; table-layout: fixed; width:100%; height:100%;}

.page-main {display:table-row; height:100%;}

.page-footer {display:table-row; height:1px;}

.menu {display:table-cell; width:150px; padding:0 0 0 .5em; background-color: #012; -border:1px solid red;}

.content {display:table-cell; height:100%; vertical-align:top; padding: 3px;}

.header {display:block; /*background:url('../img/portlet_dot.gif') center left no-repeat; padding-left:33px;*/ line-height: 21px; font-family: Verdana, Tahoma, sans-serif;}

.control-bar {display:table; width:100%; color:/*#559*/white; /*border:1px solid #ccc;*/ height:19px; }
.header .control-bar a:link, .header .control-bar a:visited {color:white; padding: .2em .5em;}
.header .control-bar a:hover {background:white;color:#f90; padding: .2em .5em;}

.title {display:table-cell; padding:1px 12px; vertical-align:middle; font-size:110%; background-color:#aaa/*#ccc*//*rgb(117,147,156)*/; /*color:#fa6;*/ border: 1px solid #bbb; border-right:none;}
.title b {color:#026;}

.main-controls {display:table-cell;  padding:0 7px; text-align:right; vertical-align: middle; background-color:#aaa/*rgb(117,147,156)*/; border: 1px solid #bbb; border-left:none;}

.footer {height:21px; line-height: 21px; background-color:#e0e0e0; border:1px solid #bbb; text-align: right; vertical-align: middle; padding:0 3px;}


.table {display:table;}
.tr {display:table-row;}
.td, .th {display:table-cell; padding: 0 0.5em; vertical-align:top;}


.detail {
	display:table; 
	width:100%; 
	margin: 3px 0; 
	border:1px solid #ddd; 
	border-collapse: collapse;
}
.detail  .tr{
	line-height: 1.5em;
}
.detail .th {
	display:table-cell; 
	text-align:right; 
	background-color:#e0e0e0; 
	padding:0.35em 0.5em; 
	border:none; 
	/*color: #5f5f5f;*/
	font-weight:normal; 
	vertical-align:top;
	/*border:1px solid red;*/
}
.detail .td {
	display:table-cell; 
	background-color:#e7e7e7; 
	padding:0.2em 0.5em; 
	border:1px solid #ddd; 
	vertical-align:baseline;
}
.detail .td input, .detail .td select, .detail .td img, .detail .td button, .detail .td div, .detail .td span {
	vertical-align: baseline; 
	margin: 0 0.3em;
}

.detail .td label {
	vertical-align: baseline; 
	margin: 0 0.3em 0 0;	
	line-height:normal;
}

.detail .td input[type="checkbox"] {
	vertical-align: top; margin: 0 0 0 0.3em;
}

/*.detail .td input[type="text"] {
	width: 97%;
}*/

.detail .td textarea {
	color: black; 
	width: 97%;
	margin-left: 0.2em;
	padding: 0.2em 0.5em;
}
/***hack*/
.detail .td a img {vertical-align:text-bottom;}

.filter {background-color: #f7f7f7;}
.disabled, tr.disabled  td, tr.disabled  th {color: #888;}
.plate {background-color:#f0f0f0; padding:.1em; border:1px solid #ddd;}

button, .button, .content a.button:link {
    background: #fafafa;  
    -background: -webkit-linear-gradient(top,  #fafafa 0%, #f4f4f4 40%,#e5e5e5 100%); 
	background:-webkit-linear-gradient(top, #dde 0%, #cde 40%,#bcd 100%);	
    border: 1px solid #aad;  
    padding: 1px 10px;  
    color: #black;  
    border-radius: 3px;  
    box-shadow: 0 1px 1px #ddd; 
	}

button:disabled, .button:disabled, .maincontrol:disabled {  
    background: #fafafa;  
    background: -webkit-linear-gradient(top,  #fafafa 0%,#f4f4f4 40%,#e5e5e5 100%);  
    border-color: #aaa;  
    color: #999;  
    box-shadow: none;  
}  
      
button:not(:disabled):hover, 
.button:not(:disabled):hover, 
.maincontrol:not(:disabled):hover
{  
    background: #fefefe;  
    background: -webkit-linear-gradient(top,  #fefefe 0%,#f8f8f8 40%,#e9e9e9 100%);  
    box-shadow: 0 1px 3px rgba(7, 7, 7, 0.35);  
    border: 1px solid #aaa;  
	color: #ff7600;
}  
      
button:not(:disabled):active, .button:not(:disabled):active {  
    background: #f4f4f4;  
    background: -webkit-linear-gradient(top,  #f4f4f4 0%,#efefef 40%,#dcdcdc 100%);  
    box-shadow: inset 0 1px 3px rgba(7, 7, 7, 0.35);  
}  

button.maincontrol {
	/*background-color:#c3c82f; 
	background:-webkit-linear-gradient(top, #cd6 0%, #cd6 40%,#bc5 100%);*/
	-background-color:#6fa0f0; 
	background-color:#6fa0f0; 
	background:-webkit-linear-gradient(top, #dde 0%, #cde 40%,#bcd 100%);
	color: black;
}

button.maincontrol:hover {
	
}


/*не совсем аккуратно, при нажатии выглядит чуть иначе, чем кнопка*/
.content button a, .content button a:link, .content button a:visited  {color: #790; text-decoration:none; cursor:default;}
.content button:hover a, .content button:active {color: #ff7600; text-decoration:none; cursor:default;} 
.content button.maincontrol a, .content button.maincontrol a:link,.content button.maincontrol a:visited {color: black;} 
.content button.maincontrol:hover a, .content button.maincontrol:active a {color: #ff7600;}

.submitnew {
	background-image:url('../img/new.gif'); 
	width:13px; height:13px; border:none; padding:0; color:transparent; cursor:pointer;
}
.submitsave {
	background-image:url('../img/save.gif'); 
	width:14px; height:14px; border:none; padding:0; color:transparent; cursor:pointer;
}
.submitdel {
	background-image:url('../img/del.gif'); 
	width:13px; height:13px; border:none; padding:0; color:transparent; cursor:pointer;
}
.submitminus {
	background-image:url('../img/minus.gif'); 
	width:13px; height:13px; border:none; padding:0; color:transparent; cursor:pointer;
}

.content a, .content a:link, .content a:visited  {color: #1111ee; text-decoration: none;}
.content a:hover {color: #ff7600; text-decoration: underline;}
.content h4 {margin-block-end: .5em;}
.content i {color:#555;}

.cell {border: 1px solid #ddd; width:100%; padding: 0.2em;}

.l,  td.l, th.l{text-align: left;}
.r,  td.r, th.r{text-align: right;}
.c,  td.c, th.c{text-align: center;}
.nw {white-space: nowrap;}
.b {font-weight:bold;}
.i {font-style:italic;}
.wide {min-width:100%}
.wh100 {width:100%; height:100%;}
.table {display:table}
.tcell {display:table-cell}
.mid {vertical-align:middle} /*используется для заполнения ячейки таблицы якорем a href*/

.err {color: red;}
.warn {color: #f80;}

a.up {background: url('../img/up.gif') center right no-repeat; padding-right: 7px;}
a.add {background: url('../img/add.gif') center right no-repeat; width:13px; height:13px; display:inline-block;}
a.edit {background: url('../img/edit.gif') center right no-repeat; width:13px; height:13px; display:inline-block;}
a.view {background: url('../img/view.gif') center right no-repeat; width:13px; height:13px; display:inline-block;}
a.del {background: url('../img/del.gif') center right no-repeat; width:13px; height:13px; display:inline-block;}


/* worktable classes */

table.worktable {border-collapse:separate; border-spacing:0; border-left:1px solid #ddd;}

table.worktable th,
table.worktable td {
  border-bottom: thin solid #ddd;
  border-right: thin solid #ddd;
}
table.worktable thead th,
table.worktable thead td {
  box-shadow: 0 -1px 0 0 #ddd;
}
table.worktable thead {
  top: 0;
  left: 0;
  position: sticky;  
  z-index: 1;
}

table.worktable td p {margin:0;}

table.worktable thead  tr td, table.worktable  tr  th{padding: 3px; background-color: #999;}

table.worktable tr {height: 1.7em;	background-color: white;}

table.worktable tr td {padding:0.1em 0.3em; height:2em;}

table.worktable tr:hover, table.worktable tr td:hover {background-color:#e5e5e5;}

table.worktable th {font-weight:500; color:white;}

/*double borders - not tested with border-collapse:separate*/
table.worktable tbody  tr td.lbd,
table.worktable thead  tr td.lbd
	{border-left: double #ccc;} 

table.worktable tbody  tr td.rbd,
table.worktable thead  tr td.rbd
	{border-right: double #ccc;} 

table.worktable tbody  tr td.tbd,
table.worktable thead  tr td.tbd,
table.worktable tbody  tr.tbd td,
table.worktable thead  tr.tbd td
	{border-top: double #ccc;} 

table.worktable tbody  tr td.bbd,
table.worktable thead  tr td.bbd,
table.worktable tbody  tr.bbd td,
table.worktable thead  tr.bbd td
	{border-bottom: double #ccc;} 
	
table.worktable tr.hist {background-color: #f6f6f6;}
table.worktable tr.hist:hover, table.worktable tr.hist:hover  td, table.worktable tr.comment:hover{background-color:#efefef;}
table.worktable tr.hist td.marked {background: #ddf5c0;}
table.worktable tr.hist:hover td.marked{background-color:#d0f0b9;}	


@media print {
  #mainmenu, .menu, .page-footer, .control-bar, .noprint  {display:none;}
}