/* -------------------------------- LAYOUT ------------------------------ */
/* white = #fff */

body {
	color: #000; 
	margin: 5px; 
	padding: 0px;
	background-color: #fff;
	font-family: "Trebuchet MS", Trebuchet, Verdana, Arial, Helvetica, sans-serif;
	}

#header {
	clear: both;
	background-color: #fff;
	margin: 0px;
	padding-bottom: 10px;
	min-height: 75px;
	}
.headertext {
	vertical-align: middle;
	font-size: 125%;
    display:inline-block;
    vertical-align:text-bottom;
	}
.headerimg {
	padding-right: 5px;
	}

#main {
	text-align: left;
	margin: 0px 200px;
	clear: both;
	padding: 0px;
	padding-right: 10px;
	}

#content {
	clear: both;
	padding: 0px;
	margin: 0px;
	text-align: left;
	width: 83%;
	float: right;
	padding-left: 15px;
	}

#leftmenu {
	width: 15%; 
	float: left;
	margin: 0px;
	background-color: #fff;
	border-right: thin solid #369;
	padding: 10px 0 10px 0;
	}

#footer {
    clear: both;
    width: 98%;
    margin: 5px;
    padding: 1px 5px;
    text-align: center;
    border: 0px;
    color: #000;
    background-color: #fff;
    font-size: 90%;
    }

#footer .left {
    float: left;
    text-align: left;
    }

#footer .right {
    float: right;
    text-align: right;
    }

/* ------------------------------- FORMATTING ----------------------------- */

.Clear {clear: both;}

A:link {color: #00F;}
A:visited {color: #69F;}
A:hover {color: #FFFFFF; background-color: #36C;}
A:active {color: #FFFFFF; background-color: #36C;}

.AppName {font-size: 150%; font-weight: bold; color: #000; text-align: center; padding-top: 10px; padding-bottom: 20px;}
.Heading {font-size: 125%; font-weight: bold; color: #369; padding-bottom: 10px;}
.Heading:after {content: ""; display: block; width: 50%; padding-top: 10px; border-bottom-style: dotted; margin-bottom:10px;}
.SubHeading {font-size: 115%; font-weight: bold; padding-bottom:30px; color: #2372BF;}
.Title {font-weight: bold; padding-bottom: 5px;}
.p {padding-top: 5px; padding-bottom: 5px;}
.DoubleIndent {margin-left: 2em; margin-right: 2em;}
.RightLargeIndent {margin-right: 5em;}
.RightText {text-align: right;}
.LeftText {text-align: left;}
.CenteredText {text-align: center;}
.Note {font-size: 90%; color: #69f;}
.ImportantNote {font-weight: bold; color: #bb059d;}
.LargerPrint {font-size: 125%;}
.SmallPrint {font-size: 90%;}
.SmallerPrint {font-size: 80%;}
.FinePrint {font-size: 80%; color:#999;}
.Bold {font-weight: bold;}
.standout {font-weight: bold; font-size: 150%; color: #FF1493;}
.Italic {font-style: italic;}
.BoldItalic {font-weight: bold; font-style: italic;}
.GreyedOut {color:#999;}
.DropCap {color: #36C; padding-right: 2px; font-size: 2em; }
.NoLink {text-decoration:none; color:#000;}
.DataHeader {background-color: #ccc; font-weight: bold; font-size: 115%;}
.DataFor {color: #62AF89; font-weight: bold;}
.ActionMenu {font-size: 75%; color: #AFAFAF;}
.ActionMenu a {text-decoration:none; color: #AFAFAF;}
.Archived {font-style: italic; color:#aaa;}
.ErrorText {font-weight: bold; color: red;}

.DottedRule {clear:both; border-bottom: dotted #ccc; width: 81%; }

.FloatLeft {float: left;}
.FloatRight {float: right;}

.RightImage {float: right; padding-left: 1em;}
.CenterImage {text-align: center;}
.LeftImage {float: left; padding-right: 1em;}
.Image {border: 0;}
A.ImageLink:link {background-color: transparent;}
A.ImageLink:visited {background-color: transparent;}
A.ImageLink:hover {background-color: transparent;}
A.ImageLink:active {background-color: transparent;}
a img {background-color: #fff; text-decoration: none; border: 0;}
a img.appcontrol {background-color: #fff; text-decoration: none; border: 0;}

/* used on Forms */
div.Form {width: 80%; margin: 0px auto; padding-bottom: 5px; float: left; clear: both;}
div.FormRow {clear: both; padding-top: 5px; padding-bottom: 35px; width:100%;}
div.FormRow span.labelR {float: left; width: 28%; text-align: right;}
div.FormRow span.labelL {float: left; width: 28%; text-align: left;}
div.FormRow span.field {float: right; width: 70%; text-align: left;}
.FormError {color: #f00; font-weight: bold; width: 70%;}
.RequiredFieldNote {text-align: left; font-style: italic; font-size: 90%;}
.RequiredFieldMarker {color: #36C; font-weight: bold; font-style: normal; font-size: 150%;}
div.FormNoteRow {clear: both; padding-top: 5px; padding-bottom: 5px;}
.FormNote {font-size: 85%; color: #660000;}
input:focus, select:focus, textarea:focus {background: #efefef;}
fieldset {border-style: none;}

/* Footer Styles */
A.FooterLink:link {color: #000000; font-weight: normal;}
A.FooterLink:visited {color: #000000; font-weight: normal;}
A.FooterLink:hover {color: #000000; text-decoration: underline; background-color:transparent; font-weight: normal;}
A.FooterLink:active {color: #000000; background-color:transparent; font-weight: normal;}

/* --------------------------------- Tables ------------------------------- */

td.lcol {text-align: left;}
td.rcol {text-align: right;}
td.ccol {text-align: center;}
th.ccol {text-align: center;}

table.datalisting {border-collapse: collapse; background: #fff;}
table.datalisting th {font-size: 110%; font-weight: bold; color: #369; padding: 10px 15px;}
table.datalisting td {border-bottom: 1px solid #36C; padding: 10px 10px;}
table.datalisting thead, table.datalisting tfoot {
  background: #e2f7ff; font-size: 110%; font-weight: bold; color: #369; padding: 10px 15px; border-bottom: 2px solid #369; border-top: 2px solid #369;
}
table.datalisting thead {position: sticky; top: 0;}
table.datalisting tfoot {position: sticky; bottom: 0;}