/* theTree */

@font-face {
    font-family: myFont;
    src: url(/..theTree/fonts/Formata-Light.otf);
}
@font-face {
    font-family: myFont2;
    src: url(/..theTree/fonts/frutigeropen.ttf);
}
::selection { color:#333; background:#ffd17f; }
* {
	font-family:myFont, Verdana, 'Helvetica Neue', Helvetica, sans-serif;
	color:#333;
	scrollbar-color: #333 #eee;
}

::-webkit-scrollbar {
	background-color: #eee;
}
::-webkit-scrollbar-thumb { background: #333; }
html { font:87.5% myFont, Verdana, 'Helvetica Neue', Helvetica, sans-serif;
}
body {
	padding:4em 0 0;
}
#bodyMain {
	top: 4em;
	position: absolute;
	width:100%;
}
#themenu {
    bottom: 0;
    top: 0;
}
.main {
    top: 0;
	overflow: auto;
}
#mainDoc {
	width:100%;	/* Should width be set in local.css? */
	overflow: auto;
}

/*******************/
.bcol-320- {width: calc(320px - .5em); min-width: calc(320px - .5em);}



*[otype="5"] { padding: 0 .5ch; } /* overflow-y: auto; } */



.data {
/*	overflow-y: hidden!important; 
	display: flex;
	flex-direction: column;*/
	padding-top: 0;
}
.dbbar {
	margin: unset;
	top:unset;
	border-bottom: solid 1px #ddd;
	height: calc(2.75em + 1px);
}
.stickyHdr, .stickySummary {
	position: sticky;
	display: inline-table;
	top: 0;
	width: 100%;
	background: #fff5e5;
	z-index: 9;
	border-bottom: solid 1px #ddd;
}
.stickySummary {
	bottom: 0;
	border-top: solid 1px #ddd;
	display: flex;
	justify-content: space-between;
	padding: 0 7px 5px;
	align-items: baseline;
/*	margin: auto auto 1em;*/
}
.stickySummary>li {
	margin-top: .15em;
}
.stickyHdr, .stickySummary { background: unset; }

.theTreeList {
	overflow-y: hidden!important;
	display: flex;
	flex-direction: column;
}
/*
.theTreeList>ul {
	overflow-y: auto;
	padding: 0 7px;
}
*/
.theTreeList>ul.theTreeBody {
	overflow-y: auto;
	height:100%;
}
.theTreeList[otype="2"]>ul.theTreeBody {
	padding: 5px .7em 1em 5px;
}
.theTreeListHdr {
	display:flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	border-bottom: solid 1px #ddd;
	padding:0 .5em;
}
[otype="5"] > .theTreeListHdr {
 	justify-content: center;
}
[otype="5"] > .theTreeListHdr.kk {
	position: absolute;
	z-index: 99;
	margin-top: -2.85em;
	width: 100%;
}
.theTreeListHdr ul {
	display:flex;
	flex-direction: row;
}
.dataQuery {
}
.dataQuery .theTreeListHdr, .lookupDataQuery .theTreeListHdr {
	justify-content: right;
}

.lookupDataQuery>ul:first-child {
/*	height: 100%;*/
}

.lookupDataQuery .theTreeListHdr {
	justify-content: right;
/*	position: sticky;*/
	top: 0;
	z-index: 5;
	background: antiquewhite;
}
.lookupDataQuery .inlineDataForm {
	overflow-y: auto;
	height: 90vh;
	padding: 2vh 1vw;
}
.lookupDataQuery .field input[type="text"], .lookupDataQuery  .field textarea {
	border: solid 1px #aaa !important;
}
.lookupDataQuery .lookupDataField {
	margin-top: 1vh;
	padding-top:1vh;
	border-top: solid 1px #ddd;
}
.lookupDataQuery .lookupDataField .groupTitle{
	text-align: center;
	font-variant: all-small-caps;
	text-decoration: underline;
	text-underline-offset: 3px;
	margin-bottom: .5vh;
}
.dataQueryForm {
	display:none;
	max-width: 480px;
	margin: 0 auto;
	padding: 0 0 .5em .5em !important;
}
.dataQueryForm.show {
	display:block;
}
.dataQueryForm.inline {
	border-bottom: none;
	margin-bottom: 2vh;
}
.dataQueryForm .theTreeListHdr, .theSelectTreeHeader .theTreeListHdr {
	justify-content: right;
	border: none;
	position: relative;
	padding-right: .75em;
}
.dataQueryForm .theTreeListHdr li {
	opacity:1!important;
	height:1em;
}
.dataQueryForm .field>span:first-child {
	overflow-x: clip;
	text-overflow: "..:";
	white-space: nowrap;
}
.dataQueryForm .field input[type], .dataQueryForm .field textarea, .dataQueryForm .field select {
	border:solid 1px #ccc !important;
}
.dataQueryForm .field input[type="checkbox"] {
	border: none !important;
}

.theTreeListHdr .thumb, .dbbar li img{
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
	opacity:0.5;
	height: 1.75em;
	width: 1.75em;
	display:block;
	margin: .5em 0;
}
.dataQuery .theTreeListHdr .thumb {
	margin: .75em;
}
.theTreeListHdr .thumb:hover, .dbbar li:hover img{
	opacity:.8!important;
}
.dbbar li:hover p{ text-shadow: 0px 0px 1px; }
.theTreeListHdr li.active .thumb{
	opacity:1;
}
.theTreeListHdr .thumb.add{
	background-image:url(/..theTree/img/plus.png);
}
.theTreeListHdr .thumb.refresh{
	background-image:url(/..theTree/img/refresh.png);
}
.theTreeListHdr .thumb.filter{
	background-image:url(/..theTree/img/findK80.png);
}
.lookupDataQuery .theTreeListHdr .thumb {
	height: 100%;
	margin:0;
}
.dataQueryForm .theTreeListHdr .thumb.applyQuery, .lookupDataQuery .theTreeListHdr .thumb.applyQuery {
	background-image:url(/..theTree/img/findK80.png);
	height:1.75em;
}
.dataQueryForm .theTreeListHdr .thumb.clearQuery, .lookupDataQuery .theTreeListHdr .thumb.clearQuery {
	background-image:url(/..theTree/img/findCancel.png);
}
.dataQueryForm .theTreeListHdr .thumb.closeQuery, .lookupDataQuery .theTreeListHdr .thumb.closeQuery {
	background-image:url(/..theTree/img/arrow.png);
	background-size: 60%;
}
.menuQuery {
	display: flex;
	justify-content: center;
	align-content: center;
}
.menuQuery .fieldset input[type="radio"] {
	display: none;
}
.menuQuery .fieldset label {
	border: solid 1px transparent;
	padding: 7px 10px;
	margin: 0 5px;
}
/*
.menuQuery .field label:first-child {
	text-align: unset;
	width: unset;
	margin-left: unset;
}
*/
.theSelectTreeHeader .theTreeListHdr .thumb.check{
	background-image:url(/..theTree/img/checkW.png);
}
.theSelectTreeHeader .theTreeListHdr .thumb.refresh{
	background-image:url(/..theTree/img/refreshW.png);
}
.theSelectTreeHeader .theTreeListHdr .thumb.close{
	background-image:url(/..theTree/img/closeW.png);
}
.theTreeListHdr .alpha{
	height: 1.4em;
	width: 1.4em;
	border-radius: 0.8em;
	margin: .5em 0;
	font-size: 1.2em;
	line-height: 1.4;
	text-align: center;
}
.theTreeListHdr .alpha:hover{
	background:#dfe6ec;
}
.theTreeListHdr .alpha.active{
	background:#5f7991;
	color:#ddd;
}

.theTreeElm {
	display:flex;
	flex-direction: column;
/*	padding: .1em .5em .1em 0;*/
}
.dataQuery .theTreeElm {
/*	line-height: 2;*/
}

.theTreeElm.listElm {
	line-height: 1.25;
	padding: 3px 7px;
	border-bottom: solid 1px #ddd;
}
.dataQuery .listElm {
	padding: .5em 1em .5em 2em;
}
.theTreeElm.selected>ul:first-child .content{
	text-shadow:0px 0px 1px;
}
.theTreeElm>ul{
	display:none;
	flex-direction: column;
	padding-left:1em;
}
.theTreeElm>ul:first-child{
	display:flex;
	flex-direction: row;
	padding-left:0;
	align-items: center;
}
.theTreeElm .thumb, .field.treeField .thumb{
	background-position:center;
	background-repeat:no-repeat;
	background-size:contain;
/*	padding: .25em 1.25em .25em 0;*/
	padding-right:1.25em;
	opacity:0;
	height:1.5em;
/*	display:none;*/
}
.theTreeElm>ul:first-child:hover .thumb{
	opacity:0.5;
/*	display:block;*/
}
.theTreeElm .content{
	width:100%;
	display:flex;
}
.theTreeElm.listElm.selected {background-color:#ddd;}
.theTreeElm.listElm.selected>ul:first-child .content{
	text-shadow:none;
}
.theTreeElm.listElm .content{
	flex-direction:column;
}
.theTreeElm>ul:first-child:hover .content{
	text-shadow:0px 0px 1px;
}
.theTreeElm .content li{
	overflow: hidden;
	text-overflow: ellipsis;
/*	white-space: nowrap; */
}
.theTreeElm .content li.field{
	width: 100%;
}
.theTreeElm .content li.field input[type="text"]{
	width: 100%;
}
.theTreeElm .content li.field input[type="text"]:hover{
	border-style: dotted !important;
	cursor: context-menu;
}
.theTreeElm .content li.field input[type="text"]:focus{
	border-style: solid !important;
	cursor: default;
}
.theTreeElm>ul>.thumb.children{
	background-image:url(/..theTree/img/selectarrow.png);
	transform: rotate(-90deg);
/*	transition: all 0.25s; */
	opacity:0.5;
	display:block;
	visibility: hidden;
	margin-bottom: 0.1em;
}
.selectTree .theTreeElm>ul>.thumb.children{ background-image:url(/..theTree/img/selectarrowW.png); }
.dataQuery .theTreeElm>ul>.thumb.children{
	background-image:url(/..theTree/img/dropDown.png);
	transform: rotate(0);
	visibility: visible;
}
.theTreeElm.haschildren>ul>.thumb.children{
	visibility: visible !important;
}
.theTreeElm.showChildren>ul{
	display:flex;
}
.theTreeElm.showChildren>ul>.thumb.children{
	transform: rotate(-45deg);
}
.dataQuery .theTreeElm.showChildren>ul>.thumb.children{
	transform: rotate(-180deg);
}

.theTreeElm .thumb.add, .field.treeField .thumb.add{
	background-image:url(/..theTree/img/plus.png);
}
.theTreeElm .thumb.delete, .field.treeField .thumb.delete{
	background-image:url(/..theTree/img/trash.png);
}
.theTreeElm.haschildren>ul>.thumb.delete{
	display: none;
}
.theTreeElm .thumb.refresh{
	background-image:url(/..theTree/img/refresh.png);
	display: none;
}
.theTreeElm>ul:first-child:hover .thumb.refresh{
	display:none;
}

.theTreeElm.showChildren>ul:first-child:hover .thumb.refresh{
	display: block;
}

.theTreeElm .thumb:hover{
	opacity:1!important;
}

.theSelectTreeHeader {
	position: sticky;
	top: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: solid 1px #ddd;
	padding-left: 1em;
	background: #666;
	z-index: 1;
}
.kTable {
	margin-top:.25em;
}
/*.kTable caption { height: 1.35em; }*/
.kTable caption ul:last-child {
/*	height: 1.35em;*/
	display:inline-flex;
	font-size: 1em;
	align-items: center;
	width: 100%;
	justify-content: space-between;
	padding: 0 5px;
/*	height:inherit;*/
}
.kTable caption ul * {
	/*height:inherit;*/
	line-height: 1.25;
}
.kTable caption ul li img {
	height: 1.35em;
	opacity:0.5;
}
.kTable caption ul li img:hover {
	opacity:1;
}
.kTable tr { height:1.5em; }
.kTable tr:hover *.hiddenCell {
	opacity:0.5;
	display:block!important;
}
.kTable thead tr:hover *.hiddenCell,
.kTable tfoot tr:hover *.hiddenCell {
	background:inherit;
	opacity:0.5;
	display:none!important;
}
.kTable tfoot tr:hover td {
	background:inherit;
}
.kTable tr:hover *.hiddenCell img:hover{
	opacity:1;
}
.kTable.print {
	border-spacing: 5px 5rem !important;
	border-collapse: unset !important;
}
.noborder.kTable td,.noborder.kTable th {
	border:none!important;
	background-color:transparent!important;
}

.noborder.kTable caption {
	text-align:center!important;
}

/* FORMS */


field [class*="bcol-"] {
	border:none;
}

.field input[type="text"].date { width:6em!important;text-align: center; }
.field input[type="text"].dateTime{ width:9em!important;text-align: center; }
.field input[type="text"][class^="float."] { width:6em!important;text-align: right; }
.field input[type="text"][class^="smallFloat."] { width:4em!important;text-align: right; }
.field input[type="text"][class^="undefFloat."] { text-align: right; }
.field input[type="text"].float { width:6em!important;text-align: right; }
.field input[type="text"].smallFloat { width:4em!important;text-align: right; }
.field input[type="text"].undefFloat {text-align: right; }
.field input[type="text"].int { width:6em!important;text-align: right; }
.field input[type="text"].smallInt, .field input[type="text"].smallText { width:3em!important;text-align: right; }
.field input[type="text"].longInt { width:9em!important;text-align: right; }
.field input[type="text"].doubleInt { width:12em!important;text-align: right; }
.field *.shortText { width:6em!important; }
.field *.mediumText { width:9em!important; }
.field *.longText { width:12em!important; }
.field *.wideText { width:18em!important; }
.field *.doubleText { width:24em!important; }

.field.float input[type="text"] { width:8em!important;text-align: right; }
.field.date input[type="text"] { width:6em!important;text-align: center; }
.field.dateTime input[type="text"] { width:9em!important;text-align: center; }
.field.tiny input[type="text"] { width:2em!important;text-align: right; }
.field.smallInt input[type="text"] { width:4em!important;text-align: right; }
.field.shortTxt input[type="text"], .field.shortTxt select { width:6em!important; }

.field.bold * { text-shadow:0px 0px 1px; }
.field *.readonly:hover {
	border:solid 1px transparent!important;
	background:none!important;
	cursor:default!important;
}
.field.buttonField span:first-child { display: none; }
.field.centerAlign { justify-content: center; }

ul.theInfo>li { padding:1em; }
/*ul.theInfo ul>li:first-child { padding-top:1em; }
/*.theInfo>li li { padding:0 0 1em 1em; }
/*.theInfo>ul ul li { padding-top:1em; }*/
/*
ul.theInfo>li>ul>li { padding-bottom:1em; }
ul.theInfo>li>ul>li:first-child { padding-top:1.5em; }
*/
#waitImg {
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	background-color:#000;
	cursor:default;
	z-index:11500;
	display:none;
	opacity:0.70;
	background-image:url(/..theTree/img/ajax_loader_icon.gif);
	background-position:50% 75%;;
	background-repeat:no-repeat;
}

.selectTree {
	position:fixed;
	user-select: none;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: #6665;
	padding: 25vh 38vw;
	cursor:default;
	z-index:115;
	display:none;
}

.selectTree * { color:#fff; }
.selectTree>ul {
	height:50vh;
	background: #666;
	scrollbar-color: #333 #666;
	overflow-y: auto;
}
.theFrame, .theMailFrame {
	position:fixed;
	top:0;
	left:0;
	width:100vw;
	height:100vh;
	background-color:rgba(0, 0, 0, 0.85);
	cursor:default;
	z-index:9100;
	display:none;
	justify-content: center;
	align-items: center;
}
.theFrame.show, .theMailFrame.show {
	display: flex;
}
.theMailContainer {
	background: #1f3549;
	width: 640px;
	height: 480px;
	padding: 1vh;
	overflow-y: scroll;
}

.theMailContainer * {
	color: #fff;
}

.theMailContainer #mailHeader {
	position: relative;
}
.theMailContainer #mailHeader .closeBtn {
	position: absolute;
	top: 0;
	right: 0;
	height: 2vw;
	width: 2vw;
	background-image: url(/..theTree/img/closeW.png);
	background-size: 100%;
}
.theMailContainer .theForm {
	margin: 1vh auto;
	padding: 1vh 0;
	border-top: solid 1px #777;
	border-bottom: solid 1px #777;
}
.theMailContainer .theForm .field { display: flex; margin-bottom: 0.5vh; }
.theMailContainer .theForm input, .theMailContainer .theForm textarea, .theMailContainer .theForm input:hover, .theMailContainer .theForm textarea:hover {
	background: rgba(255, 255, 255, 0.1);
}
.theMailContainer .theForm .field textarea { height: 6vh; }
.theMailContainer .theForm .field.buttonField {
	width: fit-content;
	margin: 1vh auto !important;
}
.hide {
	display:none;
}

@media screen and (max-width:480px) {
	.theMailContainer {
		width: 100vw !important;
		height: 100vh !important;
		padding: 1vh 2vw;
		font-size: 1.25em;
	}
	.theMailContainer #mailHeader .closeBtn {
		width: 4vh;
		height: 4vh;
		background-repeat: no-repeat;
	}
	.theMailContainer .theForm .field {
		flex-direction: column;
		width: 96vw;
		margin .5vh 1vw;
	}
	.theMailContainer .theForm .field span:first-child {
		text-align: left;
		width: 100%;
		padding:.5vh 1vw 0;
	}
	.theMailContainer .theForm .field input[type="text"],
	.theMailContainer .theForm .field textarea {
		width: 95vw;
		margin: 0 .5vw;	
	}
	.theMailContainer .theForm .field textarea {
		height: 16vh;
	}
	.theMailContainer .theForm .field.buttonField { margin: 2vh auto !important; }
}