:root 
{ 
	--theme-color-normal: #0eaf79; 
	--theme-color-dark: #0b9265; 	
	--theme-color-dark2: #077b55;
	--theme-color-light: #10cc8d; 
	--theme-color-light2: #1ae09d; 
	--theme-color-faint: #e8f9f3;
	--theme-color-faint2: #d3f3e8;
}

@media only screen and (max-device-width: 720px) {
	html { font-size: 2.4vmin; }	
}

body, button { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 1em; }
body { margin: 1em 1em }

::placeholder {
	font-style: italic;
	color: #aaa;
}

#WA_NavBar { position: fixed; height: 2.5em; color: white; top: 0; left: 0; right: 0; overflow: hidden; box-shadow: 0 0 0.25em black; z-index: 2; background-color: var(--theme-color-dark); }
#WA_NavBar > table { width: 100%; border-collapse: collapse; border: none }
#WA_NavBar > table tr { border: none; }
#WA_NavBar > table td { border: none; padding: 0; }
#WA_NavBar td.WA_NavBar_Button { width: 1px; cursor: pointer }
#WA_NavBar td.WA_NavBar_Button:hover { background-color: var(--theme-color-normal) }
#WA_NavBar td.WA_NavBar_Button img { display: block; width: 1.4em; height: 1.4em; border-right: 1px solid var(--theme-color-dark2); padding: 0.6em; }
#WA_NavBar td.WA_NavBar_Icon { width: 1px; }
#WA_NavBar td.WA_NavBar_Icon img { width: auto; height: 1.5em; padding-left: 0.95em; padding-top: 0.2em; }
#WA_NavBar td.WA_NavBar_Title { max-width: 0; padding: 0 0.8em; height: 2.5em; border-right: 1px solid var(--theme-color-dark2); }
#WA_NavBar td.WA_NavBar_Title.Pulsable:hover { cursor: pointer; background-color: var(--theme-color-normal) }
#WA_NavBar td.WA_NavBar_Title > div { font-size: 1.25em; height: 1em; padding-bottom: 0.2em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#WA_NavBar td.WA_NavBar_UserButton { width: 2.5em; cursor: pointer; text-align: center; }
#WA_NavBar td.WA_NavBar_UserButton:hover { background-color: var(--theme-color-normal) }
#WA_NavBar td.WA_NavBar_UserButton img { width: 1.5em; height: 1.5em; /*position: absolute; right: 0.5em; top: 0.3em;*/ }
#WA_NavBar td.WA_NavBar_UserButton div { font-size: 0.6em; margin-top: -0.5em; /*text-align: center; position: relative; top: 1.2em;*/ }


.WA_Button { cursor: pointer; /*vertical-align: middle;*/ }
/*button.WA_Button, a.WA_Button { display: inline-block; background-color: white; border: none; box-shadow: 0 0 0.25em var(--theme-color-dark); font-size: 1em; cursor: pointer; padding: 0.25em 0.5em; margin: 0; color: var(--theme-color-normal); outline: none; text-decoration: none; }
	.WA_Button:hover { background-color: var(--theme-color-faint); }*/
button.WA_Button, a.WA_Button { display: inline-block; background-color: var(--theme-color-faint); border: none; box-shadow: 0 0 0.125em var(--theme-color-dark); font-size: 1em; cursor: pointer; padding: 0.25em 0.5em; margin: 0; color: black; outline: none; text-decoration: none; }
	.WA_Button:hover { background-color: var(--theme-color-faint2); }
	button.WA_Button.Default, a.WA_Button.Default { color: white; background-color: var(--theme-color-normal); }
		button.WA_Button.Default:hover, a.WA_Button.Default:hover { background-color: var(--theme-color-light); }
tr.WA_Button > td.WA_Button { background-color: white; }
tr.WA_Button > td.WA_Button:hover { background-color: var(--theme-color-faint2); }

.WA_RecordTable { border-collapse: collapse; margin-top: 1em; }
	.WA_RecordTable > tbody > tr > td { border: 1px solid #aaa; padding: 0.1em 0.5em; text-align: left; }
	.WA_RecordTable > tbody > tr > th { padding: 0.1em 0.5em; text-align: left; font-size: 0.9em; font-weight: bold; background-color: var(--theme-color-dark); color: white; border: 1px solid #aaa; }
	.WA_RecordTable > tbody > tr > td.Center, .WA_RecordTable > tbody > tr > th.Center { text-align: center; }
	.WA_RecordTable > tbody > tr > td.Right, .WA_RecordTable > tbody > tr > th.Right { text-align: right; }
	.WA_RecordTable > tbody > tr > td.Red, .WA_RecordTable > tbody > tr > th.Red { color: red }
	.WA_RecordTable th.WA_Sort_Text:hover, .WA_RecordTable th.WA_Sort_Number:hover, .WA_RecordTable th.WA_Sort_Checkbox:hover, .WA_RecordTable th.WA_Button:hover { cursor: pointer; background-color: var(--theme-color-normal); }
	.WA_RecordTable .NOBR { white-space: nowrap }

.WA_FieldTable { vertical-align: top; border-collapse: collapse; }
	.WA_FieldTable > tbody > tr:first-child > th { padding-top: 0 }
	.WA_FieldTable > tbody > tr > th { text-align: left; padding-bottom: 0.5em; padding-top: 1em; color: var(--theme-color-normal); text-decoration: underline; }
	.WA_FieldTable > tbody > tr > td:first-child { text-align: right; padding-right: 1em; color: var(--theme-color-normal); font-size: 0.9em; vertical-align: top; padding-top: 0.25em; max-width: 30em; }
	.WA_FieldTable > tbody > tr > td { max-width: 50em; }
	.WA_FieldTable .NOBR { white-space: nowrap }
	.WA_FieldTable.Compact > tbody > tr > td:first-child { max-width: inherit; padding-top: 0.165em; }
	.WA_FieldTable.Compact > tbody > tr > td { border: 1px solid #ccc; padding: 0 0.5em; }
	
h2 { color: var(--theme-color-normal); font-size: 1.25em; }
	h2 .WA_Button { box-shadow: none; vertical-align: inherit; text-decoration: underline; font-size: 0.75em; font-style: italic; font-weight: normal; background-color: white; color: var(--theme-color-normal) }
	h2 .WA_Button:hover { background-color: var(--theme-color-faint) }

.WA_HtmlContainer > :first-child { margin-top: 0 }
.WA_HtmlContainer > :last-child { margin-bottom: 0 }
img.WA_InlineIcon { height: 1.2em; width: auto; vertical-align: bottom }

div.WA_SelectAction_Title { color: white; padding: 0.35em 0.5em; font-size: 1.25em; border: 1px solid black; background-color: var(--theme-color-dark); background: linear-gradient(to bottom, var(--theme-color-light) 0%, var(--theme-color-dark) 12%, var(--theme-color-dark) 86%, var(--theme-color-dark2) 100%); }
div.WA_SelectAction_Window { background-color: rgba(239, 239, 239, 0.7); position: relative; box-shadow: black 0px 0px 0.5em; display: inline-block; max-width: 90%; overflow: auto; margin-left: auto; margin-right: auto; border-radius: 0.25em; border: 0.25em solid var(--theme-color-faint); }
	div.WA_SelectAction_Button { padding: 0.35em 1em; border-top: 1px solid white; color: #3c3c3c; border-bottom: 1px solid #888; border-left: 1px solid #000; border-right: 1px solid #000; cursor: pointer; }
	div.WA_SelectAction_Button.Cancel { color: #545454; background-color: rgba(162, 162, 162, 0.25); border-top: 1px solid #efefef; }
	div.WA_SelectAction_Button:hover { background-color: rgba(255, 255, 255, 0.5); color: black; }
	div.WA_SelectAction_Button.WithImages > img.WA_InlineIcon { position: absolute; left: 0.75em; }
	div.WA_SelectAction_Button.WithImages { padding-left: 2.66em; text-align: left; }
	div.WA_SelectAction_Button.WithSubmenus { padding-right: 1.5em; }
.WA_SelectAction_Header { border-bottom: 1px solid black; padding: 0.75em 0.5em 0.25em 0.5em; background-color: #d7d7d7; color: grey; font-size: 0.8em; /* border: 1px solid black; */ text-align: left; border-left: 1px solid #9e9e9e; border-right: 1px solid #9e9e9e; }

div.WA_Pagination { margin: 0.5em 0; font-size: 0.8em; }
	div.WA_Pagination div.Link { display: inline-block; cursor: pointer; float: left; clear: none; min-width: 1.5em; text-align: center; border: 1px solid #ccc; padding: 0.25em; margin: 0 0.1em; border-radius: 0.3em; }
		div.WA_Pagination div.Link:hover { background-color: #c1dff1; }
	div.WA_Pagination span { display: inline-block; float: left; clear: none; }
	div.WA_Pagination div.Link.Active { background-color: var(--theme-color-normal); color: white; cursor: default; }