/********************** general *******************/
table{
	border-collapse: collapse;
	table-layout: auto;
    resize: none;
}

table.main{
	height: 100%;
	width: 100%;
}


.coldt{
	text-align: left;
	width: 76px;
	max-width: 76px;
	min-width: 76px;
}

.coltm{
	text-align: left;
	width: 50px;
	max-width: 50px;
	min-width: 50px;
}

.colnr{
	text-align: left;
	width: 80px;
	max-width: 80px;
	min-width: 80px;
}

.colhv{
	text-align: right;
	width: 55px;
	max-width: 55px;
	min-width: 55px;
}

.coldec{
	text-align: right;
	width: 86px;
	max-width: 86px;
	min-width: 86px;
}

.colper{
	text-align: left;
	width: 52px;
	max-width: 52px;
	min-width: 52px;
}

.colchar{
	text-align: left;
	width: 140px;
	max-width: 140px;
	min-width: 140px;
}

.colmediumchar{
	text-align: left;
	width: 180px;
	max-width: 180px;
	min-width: 180px;
}

.colsmallchar{
	text-align: left;
	width: 86px;
	max-width: 86px;
	min-width: 86px;
}

.coltxt{
	text-align: left;
	width: 250px;
	max-width: 250px;
	min-width: 250px;
}

/********************** EA record-window *******************/
table.earecord{
	border-bottom: 1px solid #aaa;
}

table.earecord th, table.earecord td{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 13px;
	/* line-height: 24px; */
	line-height: 16px;
	height: auto;
	vertical-align: middle;
	max-width: none;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
	background-color: #e9e9ef;
	border: 1px solid #bbb;
	padding: 3px;
}

.eahead{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 15.5px;
	line-height: 24px;
	font-weight: bold;
	padding: 7px 3px 3px 6px;
	text-shadow: 1px 1px 4px #ccc;
	border-top: 1px solid #888;
	border-bottom: 1px solid #aaa;
	background-color: #fff;
}

table.earecord th.easubhead{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 14.5px;
	line-height: 24px;
	font-weight: bold;
	padding: 5px 3px 2px 6px;
	text-shadow: 1px 1px 4px #ccc;
	border-top: 1px solid #888;
	border-bottom: 1px solid #aaa;
	background-color: #eee;
}

table.earecord th{
	font-weight: bold;
}

table.earecord div.label{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 13px;
	line-height: 24px;
	background-color: #e9e9ef;
	display: inline-block;
	/* border: 1px solid #aaa; */
	text-align: right;
	padding: 0 5px 0 10px;
	margin: 0 10px 0 5px;
}

table.earecord td.easubhead, div.easubhead{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 13.5px;
	line-height: 20px;
	font-weight: bold;
	padding: 5px 3px 2px 6px;
	text-shadow: 1px 1px 4px #ccc;
	border-top: 1px solid #888;
	border-bottom: 1px solid #aaa;
	background-color: #eee;
}

table.earecord td.label, table.earecord td.labelt{
	text-align: right;
	vertical-align: top;
	line-height: 24px;
}

table.earecord td.labelt{
	cursor: help;
}

table.earecord td.field{
	background-color: #fafaff;
}

table.earecord input, table.earecord textarea{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 13.5px;
	line-height: 22px;
	height: auto;
	border: 1px;
	padding: 0 4px;
	margin: 1px;
	max-width: 99%;
	border-style: solid;
	border-right-color: #aaa;
	border-bottom-color: #888;
	border-left-color: #ddd;
	border-top-color: #eee;
	border-radius: 5px; 
}

table.earecord select, table.earecord option{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 13.5px;
	line-height: 22px;
	padding: 2px;
}

@media only screen and (max-width: 500px) {
	table.earecord, table.earecord tbody, table.XXearecord tr, table.earecord td{
		display: block !important;
		width: 96vw;
	}
	table.XXearecord td{
		position: relative !important;
	}
	table.earecord td.label, table.earecord td.labelt{
		text-align: left;
		font-weight: bold;
		width: 96vw;
	}
	table.XXearecord select{
		min-width: 100%;
		width: 100%;
	}
	table.XXearecord input{
		min-width: 100%;
		width: 100%;
	}
}


/********************** EA list-window *******************/
table.eatable{
	background-color: #a3a3a3;
	border-bottom: 6px solid #ddd;
}

table.eatable tr:nth-child(even) {background-color: #f8f8fa}
table.eatable tr:nth-child(odd) {background-color: #fff}

table.eatable tr:nth-child(even).sel:hover {background-color: #edb}
table.eatable tr:nth-child(odd).sel:hover {background-color: #edb}

table.eatable tr{
	min-height: 22px;	
}

table.eatable *{
	font-family: ealato, calibri, arial, verdana, sans-serif;
	font-size: 13px;
	line-height: 17px;
}

table.eatable th, table.eatable td{
	height: auto;
	vertical-align: middle;
	max-width: none;
	white-space: nowrap;
	text-overflow: ellipsis;
	overflow: hidden;
}

table.eatable td span.bold{
	font-family: ealatobold, calibri, arial, verdana, sans-serif;
	font-weight: bold;
}

table.eatable th.top, table.eatable td.top{
	vertical-align: top;
}

table.eatable th{
	font-weight: bold;
	background-color: #e3e3e8;
	border: 1px solid #aaa;
	padding: 3px 3px 3px;
}

table.eatable td{
	border: 1px solid #bbb;
	padding: 1px 3px;
}

/********************** list-window *******************/
div.listtable{
	display:inline-block;
	position: relative;
	margin-top: 4px;
	margin-left: auto;
	margin-right: auto;
	box-shadow: 2px 1px 4px #777;
	background-color: #e3e3e3;
	width: auto;
	max-width: 100%;
	overflow:auto;
	padding: 0;
	padding-bottom: 10px;
}

div.listcolsdiv{
	display:inline-block;
	width:auto;
	padding:0;
	margin:0;
	background-color:white;
	max-height:96%;
	overflow:auto;
	resize: vertical;
}

table.listtable{
	background-color: #a3a3a3;
}


/*
table.listtable td, table.listtable th{
	user-select: none;
}

table.listtable tr:nth-child(even) {background-color: #f8f8fa}
table.listtable tr:nth-child(odd) {background-color: #fff}

table.listtable tr:nth-child(even).sel:hover {background-color: #edb}
table.listtable tr:nth-child(odd).sel:hover {background-color: #edb}
*/

table.listtable td.head{
    font: 13.5px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-weight: bold;
	line-height: 13px;
	max-width: none;

	padding-top: 2px;
	padding-bottom: 1px;

	color: white;
	vertical-align: middle;
	text-shadow: 0px 0px 3px black;
}

table.listtable caption.head span{
	color: white;
	text-shadow: 0px 0px 3px black;
}

table.listtable caption.head span.title{
    font: 13.5px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	font-weight: bold;
	line-height: 12px;
}

table.listtable caption.head span.cnt{
	font-size: 10px;
	padding: 0;
	margin-left: 8px;
}

table.listtable td.colhead{
	color: white;
	font:13px "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-shadow: 0px 0px 3px black;
}

table.listtable caption{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	line-height: 16px;
	text-shadow: 1px 1px 3px white;
	border: 1px solid #ccccdd;
	width: auto;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

table.listtable td{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
/*
    font: normal 0.95em / 1.45em BlinkMacSystemFont, -apple-system, 'Segoe UI', roboto, helvetica, arial, sans-serif;
*/
	line-height: 16px;
	text-shadow: 1px 1px 3px white;
	border: 1px solid #ccccdd;
	width: auto;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

table.listtable td a{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	line-height: 16px;
}


table.listtable td.smallhead{
	width: 38px;
	max-width: 38px;
	min-width: 38px;
	text-align: center;
	text-shadow: 0px 0px 3px #000000;
}

table.listtable td.smalldata{
	font-size: 11px;
	width: 38px;
	max-width: 38px;
	min-width: 38px;
	text-align: center;
}

table.listtable td.smalldata hr{
	margin-top: 8px;
	height: 1px;
	color: #aaa;
	background-color: #aaa;
}

table.listtable td.linebuttons{
	background-color: #dddddd;
	width: 96px;
	min-width: 96px;
	padding: 0;
	white-space: nowrap;
}

table.listtable td.headbuttons{
	width: 96px;
	min-width: 96px;
	padding: 0;
	text-shadow: 1px 1px 3px black;
}

table.listtable tr.header{
	background-color: #ebebf9;
	height: 20px;	
/*	background: linear-gradient(#ebebf9, #b1b1c3); */
}

table.foot{
	background-color: #a3a3a3;
}

tr.sort td{
	padding-top: 3px;
	padding-bottom: 2px;
	background-color: #67779c;
}

tr.sort td a{
	text-shadow: 1px 1px 3px black;
}

td.sort{
	color: white;

	border-top: 1px solid #ffffff;
	border-bottom: 1px solid #000077;

	background-color: #5E6F91;
/*	background: linear-gradient(#334455, #8899cc); */
}

table.listtable tr.tot{
	background-color: #e5e9ef;
}

table.listtable tfoot td{
	height: 4px;
	background-color: #555577;
	color: white;
}


/********************** find-window *******************/

#findtable{
	background-color: #e3e3f3;
}

#findtable td.head{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	line-height: 18px;
	max-width: none;
	background-color: #555577;
	color: white;
	font-size: 13px;
	font-weight: bold;
	height: 20px;
	padding: 1px 4px;
}

#findtable td.head img{
	height: 20px;
	border: 1px solid #bbbbcc;
	background-color: white;
	padding: 2px;
}

#findtable td{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	line-height: 17px;
	border: 1px solid #ccccdd;
	width: auto;
	height: 17px;	
	padding: 0px 1px;
}

#findtable td.label{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	color: #333;
	background-color: #eaeaef;
	padding: 2px 4px 1px 1px;
	text-align: right;
}

#findtable td.labelt{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	color: #333;
	background-color: #eaeaef;
	cursor: help;
	padding: 2px 4px 1px 1px;
	text-align: right;
}

#findtable td.field{
	color: #3a3a3a;
	background-color: #f9f9f8;
}

#findtable td.field input{
	border-width: 1px;
	border-style: solid;
	border-top-color: #dddddd;
	border-left-color: #dddddd;
	border-right-color: #aaaaaa;
	border-bottom-color: #999999;
	background-color: white;
}

#findtable td img{
	height: 16px;
	padding: 0;
	margin: 0;
	border: 0;
	vertical-align: middle;
}

#findtable span{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	margin: 0 2px;
}

#findtable td input.find{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	background-color: #eeeeee;
	height: 16px;
	padding: 0;
	margin: 0;
	border-width: 0px 1px;
}

#findtable span.labelt{
	cursor: help;
}

#findtable label{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	margin-right: 10px;
}

/********************** record-window *******************/

table.recordsection{
	background-color: #f4f4f7;
	border: 1px solid #444455;
	width: 100%;
}

table.recordsection td.head{
    font: 13.5px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	line-height: 18px;
	background-color: #555577;
	color: white;
	font-size: 13px;
	font-weight: bold;
	height: 22px;
	padding: 1px 4px;
}

table.recordsection td.head img{
	height: 15px;
	border: 1px solid #bbbbcc;
	background-color: white;
	padding: 2px;
}

table.recordsection td{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	line-height: 17px;
	border: 1px solid #ccccdd;
	padding: 0px 1px;
}

table.recordsection td a{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
}

table.recordsection td.label{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	padding: 2px 4px 1px 1px;
	color: #333;
	background-color: #eaeaef;
	cursor: help;
	text-align: right;
	white-space: nowrap;
}

table.recordsection td.labelt{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	padding: 2px 4px 1px 1px;
	color: #333;
	background-color: #eaeaef;
	cursor: help;
	text-align: right;
	white-space: nowrap;
}

table.recordsection td.label span{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	color: #333;
	color: #4a4a4a;
}

table.recordsection td.labelt span{
    font: 13px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	color: #333;
	color: #4a4a4a;
}

table.recordsection td.labelt span.bold{
	font-family: ealatobold, calibri, arial, verdana, sans-serif;
	font-weight: bold;
}

table.recordsection td.label span.bold{
	font-family: ealatobold, calibri, arial, verdana, sans-serif;
	font-weight: bold;
}


table.recordsection td.field{
	line-height: 18px;
	color: #2a2a2a;
	background-color: #fafaf8;
	width: 240px;
	padding-top: 1px;
}

table.recordsection td.field select{
	max-width: 230px;
}

table.recordsection td img.button{
	height: 16px;
	padding: 0;
	margin: 0;
	border: 0;
	vertical-align: middle;
}

table.recordsection td img.button{
	border: 1px solid #aaaacc;
}

table.recordsection div{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
}

table.recordsection span{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	margin: 0 2px;
}

table.recordsection span img{
	height: 20px;
	padding: 0;
	margin: 0;
	border: 0;
	vertical-align: middle;
}

/* CKEditor 5 */
table.recordsection div img{
	height: auto;
}

div.recordmain{
	margin-top: 6px;
	margin-bottom: 6px;
	box-shadow: 2px 2px 5px #777, -1px -1px 0px #abc;
	display:inline-block;
/*	border: 1px outset #004c88; */
	background-color: white;
}

div.recordchild{
	box-shadow: 2px 1px 4px #777;
	display:inline-block;
	border: 1px outset #004c88;
	background-color: white;
}

div.grouppane{
	width: auto;
	min-width: 580px;
	max-width: 100%;
	position:relative;
	padding: 0;
}

div.group{
	width: 100%;
	position:absolute;
	top: -1px;
/*	left: -1px; */
	padding: 0;
	background-color: #ccc;
	box-shadow: 2px 2px 5px #777, -1px 0px 0px #abc;
	min-height: 40px;
}

div.groupselect{
	display: flex;
	flex-flow: row wrap;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-start;
	width: 100%;
	border-bottom: 1px solid #ccd;
	padding: 0;
	margin: 0;
	background-color: #dde;
}

div.groupselect div{
	flex:1 1 auto;
	white-space: nowrap;
	display:inline-block;
}

div.groupselect a, div.groupselect a:link, div.groupselect a:visited{
    font: 14px ealatobold, 'Trebuchet MS', Arial, Helvetica, sans-serif;
 	text-shadow: 0px 0px 2px #333;
	text-decoration: none;
	padding: 4px 2px;
	color: white;
	margin: 0;
	display: block;
	vertical-align:middle;
	text-align:center;
	background-color: #99a;
	border-width: 0 1px 1px;
	border-style: solid;
	border-color: #555;
	/* border-radius: 6px 6px 0 0; */
	clip-path: polygon(
		0% 8px,                 /* top left */
		3px 0%,                 /* top left */
		calc(100% - 3px) 0%,    /* top right */
		100% 8px,               /* top right */
		100% 100%,				/* bottom right */
		100% 100%,				/* bottom right */
		0 100%,					/* bottom left */
		0 100%					/* bottom left */
	)
}

div.groupselect a:hover{
	background-color: #bbc;
	/* border-style: inset; */
}

div.groupselect a.selected{
	color: #112;
	/* border-style: inset; */
	background-color: #ccd;
	text-shadow: 0px 0px 2px #fff;
}


/********************** sub-table *******************/

table.subtable{
	border-collapse: collapse;
	width: 100%;
	border: 0;
}

/*
table.subtable tr:nth-child(even) {background-color: #f8f8fa}
table.subtable tr:nth-child(odd) {background-color: #fff}

table.listtable tr:nth-child(even).sel:hover {background-color: #edb}
table.listtable tr:nth-child(odd).sel:hover {background-color: #edb}
*/

table.subtable tr.head{
	background-color: #607194;
/*	background: linear-gradient(#bbbbcc, #666677); */
}

table.subtable tr{
	height: 22px;
	min-height: 22px;
}

table.subtable td.head{
    font: 13.5px 'Trebuchet MS', Arial, Helvetica, sans-serif;
	line-height: 17px;
	color: white;
	text-shadow: 0px 0px 3px black;
	background-color: transparent;
	padding: 0px 2px;
	cursor: default;
}

table.subtable td.head a img{
	height: 16px;
	padding: 0;
	border: 0;
}

table.subtable td.childbuttons{
	width: 64px;
	white-space: nowrap;
	padding: 0;
	background-color: #dddddd;
}

table.subtable td a{
	width: 30px;
	height: 17px;
	padding: 0;
}

table.subtable td a img{
	height: 16px;
	padding: 1px 0 0;
	border: 0;
}

table.subtable td{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	text-shadow: 0px 0px 3px white;
	padding: 1px 2px 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	border: 1px solid #bbc;
	vertical-align:middle;
}

table.subtable tr.tot{
	background-color: #eeeeff;
}

table.subtable tr.tot td{
	padding: 3px 2px 2px;
	border-width: 1px 0 0;
}

table.subtable tr.tot td.tot{
	border-width: 1px 1px 0;
	background-color: #ffffff;
}

/********************** fk-window *******************/
#fktable{
	background-color: #e3e3e3;
	width: auto;
	min-width: 300px;
	box-shadow: 2px 1px 4px #777;
	display: inline-block;
}

#fktable td.head{
	max-width: none;
	background-color: #555577;
	color: white;
	font-size: 13px;
	font-weight: bold;
	height: 22px;
}

/********************** index *******************/
table.indexblock{
	min-width: 160px;
	margin: 8px;
	padding: 2px 4px 10px;
	background-color: white;
}

table.indexblock td{
	font-size: 13.5px;
	padding-bottom: 3px;
	vertical-align: middle;
}

table.indexblock div{
	color: #999;
	font-size: 13px;
	padding: 5px 4px;
	margin: 0;
	display: block;
	text-align: left;
	border-left: 1px solid #eee;
	border-top: 1px solid #eee;
	box-shadow: 2px 1px 1px 0px #ddd;
	cursor: help;
}

table.indexblock a{
	text-decoration: none;
	font-size: 13.5px;
	color: #447;
	padding: 4px 4px;
	margin: 0;
	display: block;
	text-align: left;
/*	border-left: 3px double #bbb;
	border-bottom: 1px solid #d4d4ff;
	border-right: 1px solid #d4d4ff;
	box-shadow: 2px 1px 1px 0px #bbb, -1px -1px 1px 0px #ddd; */
	border-left: 1px solid #eee;
	border-top: 1px solid #eee;
	box-shadow: 2px 1px 1px 0px #ddd;
}

table.indexblock a.disabled{
	color: #777;
	cursor: default;
}

table.indexblock a:hover{
	border-left: 1px solid #aaa;
	border-top: 1px solid #aaa;
	box-shadow: 2px 1px 1px 0px #555;
	background-color: #f5f5f8;
	color: black;
/*
	text-decoration: underline;
	border-bottom: 0;
	border-left-color: #3366cc;
*/
    transition: background-color 0.3s, color:0.3s;
}

table.indexblock a.disabled:hover{
	box-shadow: 2px 1px 1px 0px #ddd;
	background-color: #fff;
	color: #777;
}

div.indexblock table{
	box-shadow: none;
	margin: 0;
}

tr {
}

.line{
	background-color: #ffffff;	
}

.linex{
	background-color: #f8f8fa;	
}

tr.dline{
	background-color: #ffffff;	
}

tr.dlinex{
	background-color: #f8f8fa;	
}

tr.linesel{
	cursor: pointer;
	background-color: #ccddff;	
}

tr.linesel:hover{
	background-color: #d1d9d1;	
}


caption{
	text-align: left;
}

th{
	vertical-align: top;
	text-align: left;
	padding: 1px 2px;	
}

td{
	vertical-align: top;
	text-align: left;
	padding: 1px 2px;	
}

td.spacer{
	height: 10px;
	padding: 0;
}

td.cal{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	text-align:center;
	height:20px;
	width:12%;
	background-color:#ffffff;
}

td.calh{
	font-family: Arial, Verdana, sans-serif;
	font-size: 13px;
	text-align:center;
	background-color:#dddddd;
}

td.calg{
	font-family: Arial, Verdana, sans-serif;
	font-size: 11.5px;
	text-align:center;
	height:20px;
	width:12%;
	background-color:#eeeeee;
}

table.borders td{
	font-family: Arial, Verdana, sans-serif;
	font-size: 11.5px;
	border: 1px solid #bbb;
}

@media only screen and (min-width: 800px) {
	table.earecord th, table.earecord td{
		line-height: 16px;
		padding: 1px 3px;
	}

	table.earecord input, table.earecord textarea, table.earecord select, table.earecord option{
		line-height: 19px;
	}
}
