/*----------*/
/* Site CSS */
/*----------*/

body {
	font-size: .9em;
	font-family: Verdana, Helvetica, Sans-Serif;
	margin: 0;
	padding: 0;
	color: var(--default_text_color);
	background-color: var(--default_back_color);
}

p {
	margin: 0;
}

.widgethdr {
	width: 100%;
	margin: 0 auto;
	color: #FFFFFF;
	padding: 4px 3px 0px 3px;
	font-size: 1.0em;
	font-family: Verdana, Helvetica, Sans-Serif;
	font-weight: bold;
	text-align: left;
	text-indent: 10px;
	vertical-align: bottom;
	border-right: #d3d3d3 1px solid;
	border-top: #d3d3d3 1px solid;
	border-left: #d3d3d3 1px solid;
}

.widgetbdy {
	width: 100%;
	margin-left: 1px;
	padding: 0px 2px 2px 2px;
	border: 1px solid #D3D3D3;
}

a {
	text-decoration: underline;
	cursor: pointer;
	color: var(--default_text_color);
}

	a.reminder {
		font-size: 0.8em;
		font-weight: bold;
		cursor: pointer;
	}


.page {
	width: 100%;
	/*margin-left: auto;  Auto Margins cause problems with Absolute positioning in IE8
    margin-right: auto;*/
}

.pagebyline {
	font-family: Verdana, Helvetica, Sans-Serif;
	font-size: .8em;
	font-weight: bold;
}

.btn {
	font-size: 1em;
	color: var(--default_text_color);
}

.clear {
	clear: both;
}

.copyright {
	font-size: .7em;
	color: var(--default_dark_gray_back_color);
}

.error {
	font-size: 1.0em;
	font-weight: bold;
	color: #CC0000;
}

.aefieldset {
	border: solid 1px;
	background-color: var(--lightHighlight_back_color);
	border-color: black;
}

.aehidden {
	display: none;
}

.hdr {
	font-size: 1em;
	font-weight: bold;
	background-color: var(--mediumHighlight_back_color);
	color: var(--default_light_text_color);
}

.leftTable {
	float: left;
	width: 49%;
}

.aelegend {
	font-size: 1em;
	font-weight: bold;
	padding: 2px 2px 2px 2px;
	border: solid 1px;
	background-color: var(--mediumNeutral_back_color);
	border-color: black;
}

.listtbl {
	font-size: .9em;
	border-color: var(--lightHighlight_border_color);
}

	.listtbl th {
		font-weight: bold;
		padding: 2px 2px 2px 2px;
		text-align: left;
		vertical-align: top;
		white-space: nowrap;
		background-color: var(--mediumNeutral_back_color);
	}

	.listtbl td {
		padding: 2px 2px 2px 2px;
		cursor: default;
	}

	.listtbl tr.odd td {
		background-color: var(--default_back_color);
	}

	.listtbl tr.even td {
		background-color: var(--lightNeutral_back_color);
	}

	.listtbl tr:hover td {
		background-color: var(--mediumNeutral_back_color);
	}

	.listtbl tr.selected td {
		background-color: var(--lightHighlight_back_color);
	}

.displaytbl {
	border: solid 1px;
	border-color: var(--darkHighlight_border_color);
}

	.displaytbl th {
		font-weight: bold;
		white-space: nowrap;
		background-color: var(--lightHighlight_back_color);
	}

.displaytblopen {
	background-color: #FCFCFC;
	background-image: url(../Images/gradientReportOptions.jpg);
	background-position: left;
	background-repeat: repeat-y;
}

.rightDetails {
	margin-left: 50%;
	width: 50%;
}

.stdtbl {
	font-size: .9em;
	border-color: black;
}

	.stdtbl th {
		font-weight: bold;
		white-space: nowrap;
		border-color: black;
		background-color: var(--mediumNeutral_back_color);
	}

	.stdtbl td {
		font-weight: normal;
		border-color: black;
	}

	.stdtbl tr:hover td {
		background-color: var(--mediumNeutral_back_color);
	}

	.stdtbl tr.selected td {
		background-color: var(--lightHighlight_back_color);
	}

.brdrtbl {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: .9em;
	border: 1px solid Black;
}

	.brdrtbl th {
		font-weight: bold;
		border: 1px solid Black;
	}

	.brdrtbl td {
		border: 1px solid Black;
	}

.scheddiv {
	width: 100%;
	padding-bottom: 5px;
}

.schedimg {
	cursor: pointer;
}

.schedtblhdr {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: .9em;
	font-weight: normal;
}

.schedtbl {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: .9em;
	font-weight: normal;
	background-color: var(--default_back_color);
	border-color: black;
}

	.schedtbl th {
		font-weight: bold;
		padding-left: 2px;
		padding-right: 2px;
		border-color: black;
		background-color: var(--mediumNeutral_back_color);
	}

	.schedtbl td {
		border-color: black;
	}

	.schedtbl .colhdr {
		border-color: black;
		background-color: var(--lightNeutral_back_color);
	}

.altRowBackground {
	background-color: var(--lightNeutral_back_color);
}

.altRow {
	background-color: var(--lightNeutral_back_color);
}

.bigmsg {
	font-size: .9em;
	font-weight: bold;
	color: Gray;
}

.smallmsg {
	font-size: .7em;
	font-weight: bold;
	color: Gray;
}

.xsmallmsg {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: .6em;
	font-weight: bold;
}

.smalltxt {
	font-family: Verdana, Helvetica, sans-serif;
	font-size: .7em;
	font-weight: normal;
}

.tblinset {
	border: none;
	padding-left: 2px;
	padding-right: 2px;
}

	.tblinset td {
		border: none;
		padding-left: 0px;
		padding-right: 0px;
	}

tr.over td {
	cursor: pointer;
	background-color: var(--mediumNeutral_back_color);
}

tr.selected td {
	background-color: var(--lightHighlight_back_color);
}

.selected {
	background-color: var(--lightHighlight_back_color);
}

.txtin {
	font-family: Verdana, Helvetica, Sans-Serif;
	font-size: 1em;
	border: solid 1px;
	color: var(--default_text_color);
	border-color: var(--default_medium_gray_border_color);
}

.txtin2 {
	font-family: Verdana, Helvetica, Sans-Serif;
	font-size: 1em;
	color: var(--default_text_color);
	border-color: var(--default_medium_gray_border_color);
}

.txtin3 {
	font-family: Verdana, Helvetica, Sans-Serif;
	font-size: .9em;
	color: var(--default_text_color);
}

.smalltxt {
	font-family: Verdana, Helvetica, Sans-Serif;
	font-size: .8em;
}

.viewport {
	width: 80%;
	height: 200px;
	overflow: auto;
	position: relative;
	border: solid 1px black;
	background-color: var(--lightNeutral_back_color);
}

.appblank {
	font-size: 2.5em;
	font-weight: bold;
	filter: shadow(OffX=3, OffY=3, Color='#cccccc', Positive='true');
	text-shadow: -3px 3px #cccccc;
	color: var(--mediumHighlight_color);
}

.banner {
	font-size: 1.1em;
	font-weight: bold;
	text-align: center;
	background-color: var(--lightNeutral_back_color);
}

.errtbl {
	border: solid 1px;
	font-size: .9em;
	background-color: var(--lightNeutral_back_color);
	border-color: #999966;
}

	.errtbl th {
		font-weight: bold;
		padding: 0px 2px 0px 2px;
		vertical-align: top;
		white-space: nowrap;
	}

	.errtbl td {
		padding: 0px 2px 0px 2px;
		vertical-align: top;
	}

.reportparmstbl {
	border: solid 1px;
}

	.reportparmstbl th {
		font-weight: bold;
		white-space: nowrap;
	}

.hidex::-ms-clear {
	display: none;
}
/*Added for version 4.1.0*/
.datepick-trigger {
	margin-top: 1px;
	margin-left: 2px;
	vertical-align: top;
	cursor: pointer;
}

h1 {
	font-size: 19.44px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

h2 {
	font-size: 14.4px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

:focus {
	outline: 1px #333333 solid;
}

#logo {
	background-image: url(../../../images/logopage.jpg);
	background-repeat: no-repeat;
	background-position: center center;
	height: 250px;
	width: 250px;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}

a.clsHeaderLink {
	padding: 5px 8px;
	font-size: 0.9em;
	font-weight: bold;
	cursor: pointer;
	text-decoration: none;
	border-radius: 15px;
}

	a.clsHeaderLink:hover {
		background-color: var(--darkNeutral_back_color);
		color: var(--darkNeutral_text_color);
	}

/*============================================================================================*/
/* Input validation classes                                                                   */
/* 01/22/2014  JKM	Collect here from Site.css and AppContent.css and from the theme          */
/*					versions of these. Background-colors changed from #ffeeee to #ffdddd.     */
/*					Because of CSS precidence rules, make sure .input-required-field is       */
/*					declared before .input-validation-error.                                  */
/* 12/02/2024  JKM	Change backcolor from #ffdddd to #ffe6e6 and forecolor from #ff0000 to    */
/*					#d80000 to create enough color contrast to pass WCAG AA criteria in WAVE. */
/* 07/02/2025  JKM	Add .input-required-label definition                                      */
/* 07/11/2025  JKM	Replace .input-required-label definition with CSS to add an asterisk to   */
/*					the parent of an input-required-field.                                    */
/*					Move this entire block of validation CSS to bottom of this file so it     */
/*					will be after .txtin definition so the borders of .input-validation-error */
/*					are not overridden.                                                       */
/*--------------------------------------------------------------------------------------------*/
	.appValidationError {
		display: none;
		width: 100%;
		background-color: #ffe6e6;
		color: #d80000;
	}

	.validationSummary {
		padding: 0px;
		overflow: hidden;
		background-color: #ffe6e6;
		color: #d80000;
	}

		.validationSummary ul {
			list-style: none;
		}

	.input-required-field {
		background-color: #ffffdd;
	}
	/* Below adds an asterisk before the label of a required field. Decided we liked the next option better. */
	/*.input-required-label::before {
		content: "*";
		color:#d80000; 
		font-weight:bold; 
		font-size:1.2em;
		vertical-align:middle;
	}
	*/
	/*	Input fields cannot have ::after. So these definitions target parents that contain required input fields
		(usually td tags) to add an asterisk and then position it off the upper right corner of the input field. 
		If the input field is not the last thing in the parent, a span or div will need to be added around it. 
	*/
	:has(> .input-required-field:not(.hidden))::after {
		content: "*";
		color: #990000;
		font-weight: bold;
		position: relative;
		vertical-align: top;
		top: -5px;
		left: -5px;
	}
	/* Fieldsets need different offset because of the legend and border. Also note, they must be display:inline-block. */
	:has(> fieldset.input-required-field:not(.hidden))::after {
		top: 3px;
		left: -8px;
	}
	/* Extension fields do not have a carriage return between the input and the </td>, so need less left offset. */
	:has(> .input-required-field.ExtensionField)::after {
		left: -1px;
	}
	/* Need a couple settings different for mobile views. */
	@media (max-width: 767px) {
		:has(> .input-required-field:not(.hidden))::after {
			font-family: Verdana, Helvetica, sans-serif
		}

		:has(> fieldset.input-required-field:not(.hidden))::after {
			top: -6px;
			left: -7px;
		}
	}

	.input-validation-error {
		border: 2px solid;
		border-color: #d80000;
		background-color: #ffe6e6;
	}

	.validation-summary-errors {
		font-weight: bold;
		color: #d80000;
	}

	.field-validation-error {
		color: #d80000;
	}

	.validate-error {
		background-color: #ffe6e6;
	}
/*============================================================================================*/

/*============================================================================================*/
/* 07/11/2025  JKM	Force the SmartyStreets check down and squish it a bit so the             */
/*					.input-required-field asterisk defined above can be seen above it.        */
/*--------------------------------------------------------------------------------------------*/
	.smarty-tag {
		height: 16px;
		top: 3px;
	}
/*============================================================================================*/