@charset "utf-8";
/* CSS Document */
:root{
	--papayawhip_10percent: #fbf2e2;
	--papayawhip_20percent: #f1e9da;
	--papayawhip_25percent: #d0c3ad;	
	--papayawhip_30percent: #b5a594;
	--papayawhip_40percent: #a09685;	
	--papayawhip_50percent: #908375;	
}
body{
	font-family:Arial, Helvetica, sans-serif;
	font-size:14px;
	margin:0px;
	background-color: #FAFAFA; /*From TylerTech Forge - background for scrolling content*/
}
table{
	font-size: 14px;
}
::-webkit-scrollbar {
	width: 10px;
    height: 10px;
} 
::-webkit-scrollbar-track {
    background-color: #fff;
}
 
::-webkit-scrollbar-thumb {
	background-color: #BBB;
}
select{}

/* for desribing the area at the top of a page */
.AreaTitle{
	/*This has been Tylerized*/
	/*This puts an abs pos title right below the standard (no-tabs) omnibar*/
	position: absolute;
    top: 48px;
    left: 0px;
    right: 0px;
    height: 24px;
    font-size: 16px;
    text-align: center;
    border-bottom: 1px solid silver;
    padding-top: 5px;
    box-sizing: border-box;
    color: #444;
}
.AreaTitle_Rel{
	/*This puts a rel pos title in the page*/
	position: relative;
    left: 0px;
    right: 0px;
    height: 42px;
	line-height: 42px;
    font-size: 16px;
    text-align: center;
    border-bottom: 1px solid silver;
    box-sizing: border-box;
    color: #444;	
}

.CardTitle{
	/*This has been Tylerized*/
	font-size: 16.6px;
	font-weight: bold;
	color: black;
	margin: 16px 0px 16px 0px;
}
.CardSubTitle{
	/*This has been Tylerized*/
	font-size: 14px;
	font-weight: bold;
	color: #0000008a;
	margin: 14px 0px 14px 0px;
}

.HTMLNoiOSRubberBand{
	/*This goes on the HTML tag*/
	position: fixed;
	width: 100%;
	height:100%;
	overflow:hidden;	
}

.HTMLNoiOSRubberBand body{
	width: 100%;
	margin: 0px;
	position:fixed;
	height:100%;
	overflow:hidden;
}

/*--------------INTERIM Omnibar TABS A+ TylerTech-looking tabs--------------------*/
.TTTabTable{
	background-color: #283593;
    box-shadow: 0px 0px 9px 1px black;
	border: 0px;
	width: 100%;
	z-index: 9002;
}
.TTTabs_Cold{
	width:80px;
	height:40px;
	text-align:center;
}
.TTTabs_Cold a{
	color:#CCCCCC;
	text-decoration:none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;	
}
.TTTabs_Hot{
	width:80px;
	height:40px;
	font-family:Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-size:12px;
	font-weight:bold;
	text-align:center;
    border-bottom: 2px solid white;
    cursor: pointer;	
}

/*--------------INTERIM Data/View TABS A+ TylerTech-looking tabs--------------------*/
.MiniTabWrapper{
	position: relative;
	height: 100px; /*Default height. Override this with css attribute style in your specific implemenation if the default is not ideal*/
	overflow: hidden;
}
.MiniTab{
	position: relative;
	height: 24px;
	overflow: hidden;
	padding: 0px 12px 0px 0px;
	display: inline-block;
	cursor: pointer;
	border-bottom: 2px solid #5047db;
	box-sizing: border-box;
	margin: 0px;
	color: #5775df;
}
.ColdTab{
	color: gray;
	border-bottom: 1px solid silver;
}
.MiniCard{
	position: absolute;
	width: 100%;
	box-sizing: border-box;
	top: 24px;
	padding: 2px;
	left:0px;
	transition: left .5s, color .0s;
}
.addrblockVerf{
	position: absolute;
    left: 0px;	
    border: 1px solid #61b500;
    border-radius: 6px 0px 6px 6px;
    padding: 2px;
}
.addrblockNotVerf{
	position: absolute;
    left: 0px;	
    border: 0px solid gray;
    border-radius: 6px 0px 6px 6px;
    padding: 3px;
}


/*----- Data Grid -----*/

.DataGrid_FocusHeader{
	/*When normal data grids are "focused" to a specific ID this style is used for the focus note*/
    color: white;
    font-weight: bold;
    height: 30px;
    text-align: center;
    line-height: 30px;
    position: absolute;
    width: 100%;
    top: 90px;	
}
.DataGrid_Wrapper{
	position: relative;
	width: 100%;
	min-height:220px;
}
.DataGrid_Wrapper_NoScoller{
	/*Use in place of DataGrid_Wrapper - when we don't want any consrained scrolling sub areas*/
	position: relative;
	width: 100%;
}

.DataGrid_ColsScroller{
	position:absolute;
	top:39px;
	left:0px; 
	right: 16px; /*accounts for the data's scroll bar*/
    height: 39px;
    overflow: hidden;
    margin-left: 1px;
}
.DataGrid_ColsNoScroller{
	/*Use in place of DataGrid_ColsScroller - when we don't want any consrained scrolling sub areas*/
    height: 39px;
    overflow: hidden;
    margin-left: 1px;
}


.DataGrid_DataScroller{
	position:absolute;
	top:79px;
	left:0px;
	right:0px;
	bottom:0px;
	overflow-y: scroll; /*we force a vertical scroll - header is 16 pixes shorter assuming vert scroll is always there.*/
    overflow-x: auto; /*horizontal scroll is optional and can be auto*/
    border: 1px solid black;
    margin-bottom: 10px;
    box-sizing: border-box;
    box-shadow: inset 0px 0px 15px 3px grey;
	-webkit-overflow-scrolling: touch;
}
.DataGrid_DataNoScroller{
	/*Use in place of DataGrid_DataScroller - when we don't want any consrained scrolling sub areas*/
    border: 1px solid black;
    margin-bottom: 10px;
    box-sizing: border-box;
    overflow-x: auto; /*horizontal scroll is optional and can be auto*/
}

.DataGrid_ColsTable{
	border-collapse: collapse;
	padding:1px;
	height:100%;
	table-layout:fixed;
}
.DataGrid_ColsTable tbody td{
	font-weight:bold;
	text-align:left;
	vertical-align:bottom;
	padding:1px 5px 1px 5px;

	word-wrap:break-word;
	overflow:hidden;
}
.DataGrid_SortingColHead{
	color: maroon; 
}
.DataGrid_SortingColHead table td{
	padding:0px;
	text-decoration: underline; 
	cursor: pointer;	
}

.DataGrid_NonSortingColHead{
	color: black; 
}

.DataGrid_NonSortingColHead table td{
	padding:0px;
}

.DataGrid_ColsTable tbody td input[type='checkbox']{
	height:25px;
	width:25px;
	margin-left:5px;
}

.DataGrid_Sorter{
	cursor:pointer;
	height:20px;
	width:20px;
	display:inline;
}
.DataGrid_DataTable{
	border-collapse: collapse;
	padding:1px;
	table-layout:fixed;
}
.DataGrid_DataTable tbody td{
	text-align:left;
	vertical-align:top;
	border-bottom: 1px solid silver;
	padding:1px 5px 1px 5px;

	word-wrap:break-word;
	overflow:hidden;
	min-height: 35px;
}
.DataGrid_DataTable tbody td input[type=checkbox]{
	height:25px;
	width:25px;
	vertical-align: middle;
	margin-left:5px;
}
.DataGrid_UrgentBackground{
	background-color: rgba(255,0,153,0.13);
}
.DataGrid_LtBlueBackground{
	background-color:#C9EFEE;
}
.DataGrid_WaitingForCommitBackground{
	background-color: rgba(255,255,255,0.5);
}

/*---------------------*/

.Filter_Sorters {
    position: absolute;
    top: 20px;
    right: -85px;
}

.Form_Instructions{
	padding: 4px;
	border-radius: 4px;
	border: 1px solid black;
	color: white;
	font-style: italic;
	margin: 10px 10px 20px 10px;
	background-color: var(--papayawhip_50percent);
	box-shadow: 0px 2px 6px 3px var(--papayawhip_30percent);
}

.Form_Header{
	background-color: var(--papayawhip_25percent);
	height:40px;
	line-height:40px;
	position:relative;
}
.Form_Header_LandmarkArea {
    font-size: 12px;
    background: var(--papayawhip_25percent);
    margin-bottom: 5px;
    margin-top: 0px;
    padding: 2px;
    position: relative;
    top: 0px;
}

.Landmark_label {
    float: left;
    width: 40px;
    margin-right: 5px;
    text-align: right;
    font-weight: bold;
}
.Landmark_data {
    float: left;
    text-align: left;
}


.Form_Header_TitleText{
	color: black;
	font-size: 18px;
	font-weight:bold;
	text-align:center;
}

.Form_Header_DoneLeftIcon{
	position: absolute;
	top: 6px;
	left: 5px;
	width: 55px;
	text-align:left;
	cursor:pointer;
}
.Form_Header_DoneLeftIcon img{
	width:55px;
	height:30px;
}

.Form_Row{
	margin-top: 6px;
	margin-bottom:15px;
	width:250px;
	position:relative;
	min-width:250px;
	padding-left: 12px;
	box-sizing:border-box;
	min-height: 54px;
}
.Form_Row_ChecksRadios{
	margin-top: 6px;
	margin-bottom:15px;
	width:250px;
	position:relative;
	min-width:250px;
	padding-top: 10px;
	padding-left: 12px;
	box-sizing:border-box;
	min-height: 54px;
}
fieldset div.Form_Row{
	padding-left: 0px; /* Form_Row inside a fields ste should have 0 padding */
}

.Form_Row_NoBotMarg{ /* Very handy for putting a Form_Heading over a test area and putting field manipulation tools in the heading (see code comments MEMobile_Inspect_Checklist.asp*/
	width:250px;
	position:relative;
	min-width:250px;
	padding-left: 12px;
	box-sizing:border-box;
}
fieldset div.Form_Row_NoBotMarg{
	padding-left: 0px; /* Form_Row inside a fields ste shoudl have 0 padding */
}

.Form_Row_ForFloatBox{
	margin-bottom:15px;
	position:relative;
	margin-right: 15px;
}

.Form_Label{
	/*This has been Tylerized*/
	/*font-style: italic; */
    color: #333;
    /* width: 100%; */
    font-size: 11px;
    margin-left: 10px;
    position: absolute;
    top: -6px;
    background: white;
    display: inline-block;
    padding: 0px 4px 0px 4px;
	border-radius: 4px;
	z-index: 1;
}
.Form_Label_Radios{
	font-style: italic;
    color: #333;
    width: 100%;
    font-size: 16px;
    margin-left: 0px;
    position: absolute;
    top: -6px;
}
.HotLabel{
	color: blue;
}

.Form_Input{
	box-sizing:border-box;
	width:100%;	
    border-radius: 4px; 
    font-size: 20px;
    border: 2px solid silver;
	background-color:white;
    padding: 5px;	
}

.Form_Input_FakeDisplayOnly{
	box-sizing:border-box;
	width:100%;	
    border: none;
    border-radius: 4px; 
    font-size: 20px;
    border: 2px dotted var(--papayawhip_25percent);
	background-color:bisque;
	padding: 5px;
}

.Form_Input_OPRList{
	box-sizing:border-box;
	width:60px;	
    border-radius: 4px; 
    font-size: 20px;
    border: 2px solid silver;
	background-color:white;
    padding: 5px;	
}

.Form_FloatBox{
	display: inline-block;
	width:100px;
	margin-right:15px;
	vertical-align:top;
}
.Form_Input_Errored{
	box-sizing:border-box;
	width:100%;	
    border-radius: 4px; 
    font-size: 20px;
    border: 2px solid red;
	background-color:pink;
    padding: 5px;	
}

.Form_XCharsIndicator {
    color: gray;
    font-style: italic;
    font-size: 12px;
    position: absolute;
    top: 16px;
    right: -57px;
	line-height:8px;
}
.Form_ValueDisplayOnly{
	box-sizing:border-box;
	width:100%;	
    border: none;
    border-radius: 4px; 
    font-size: 20px;
    border: 2px dotted var(--papayawhip_25percent);
    padding: 5px;
	min-height:	37px;
	max-height:300px; 
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;	
}
.Form_ValueDisplayOnly_Errored{
	box-sizing:border-box;
	width:100%;	
    border: none;
    border-radius: 4px; 
    font-size: 20px;
    border: 2px dotted red;
    padding: 5px;
	min-height:	37px;
	background-color:pink;
	max-height:300px; 
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;	
}

.Form_TextArea{
	box-sizing:border-box;
	width:100%;	
    border: none;
    border-top-left-radius: 4px; 
    border-bottom-left-radius: 4px; 
    font-size: 20px;
    border: 2px solid silver;
	background-color:white;
    padding: 5px;	
	height: 100px;
	font-family:inherit;
}

.Form_InputCheckboxLabel{
	display: inline-block;
	font-size:14px;
}

.Form_InputCheckboxLabel input{
	height:25px;
	width:25px;
	vertical-align: middle;
	margin-left:0px;
}

.Form_InputRadioLabel{
	display: block;
	font-size:14px;
}

.Form_InputRadioLabel input{
	height:25px;
	width:25px;
	vertical-align: middle;
	margin-left:0px;
}

.Form_Comment_Form{ 
	/*PURPOSE: for comments/messages above a form*/
	box-sizing:border-box;
	margin-top: 15px;
    margin-bottom: 15px;
    width: 100%;
    position: relative;
    border-width: 0px;
    padding: 5px 15px 5px 15px;
	font-style:italic;
    color: #444444;
	font-weight: bold;
    /*text-shadow: 1px 1px rgba(255,255,255,.3);*/
	box-shadow: inset 0px 0px 8px grey;
	border-top: 1px dashed gray;
	border-bottom: 1px dashed gray;
}
.Form_NeutralMsg {
   /* border-color: burlywood;*/
    background-color: papayaWhip;
	border-top: 1px dashed rgba(0, 0, 0, .0);
	border-bottom: 1px dashed rgba(0, 0, 0, .0);
}
.Form_WarningMsg {
    /*border-color: #FF0099;*/
    background-color: #FF99FF;
}
.Form_PositiveMsg {
    /*border-color: #669900;*/
    background-color: #99FF00;
}

/*This is the style for the outter dov wrapper for a read only checkbox*/
.Form_DisplayCheckmark{
    font-size: 24px;
	min-width:32px;
	height:32px;
    border-radius: 4px; 
    border: 2px dotted var(--papayawhip_25percent);
	display:inline-block;
	margin-right:5px;
	background-color: white;
	box-sizing:border-box;
	vertical-align:middle;
	line-height:23px;
}
/*This goes around a div INSIDE the Form_DisplayCheckmark and serves as a display only checkbox*/
.Form_ReadOnlyCheckbox{
	width:26px; 
	height: 26px; 
	display: inline-block; 
	margin-top: 1px;
    border-radius: 4px;
}

/*This would go in a spot where a checkbox is not displayed because its not applicable*/
.Form_NotApplicableCheckbox{
    margin-left: 8px;
    font-size: 16px;
    color: silver;
    margin-top: 10px;
	cursor: pointer;
}

.Form_Suggestion {
    border: 1px solid black;
    height: 32px;
	font-size: 18px;
    margin-top: 4px;
    padding: 2px;
    color: white;
    background-color: maroon;
    border-radius: 5px;
    font-style: italic;
	cursor:pointer;
	width:100%;
	text-align:left;
}

.Form_FixedBottomControls{
	/*for fixing buttons to bottm of a page*/
	/*When you need buttons at the end of form (and not fixed to the bottom of the page) use Form_UnFixedControls*/
	position:fixed; 
	bottom:0px; 
	text-align:right; 
	background-color:white; 
	box-sizing:border-box;
	width:100%; 
	height:50px; 
	box-shadow: 0px 0px 8px 0px black; 
	padding: 6px;
}

.Form_UnFixedControls{
	/*For buttons at the end of a form (when NOT using Form_FixedBottomControls) */
	text-align:right; 
    padding: 5px; 
    box-sizing:border-box;
	width: 100%;	
}

.Form_RangeSlider_ValueDisplay{
    font-size: 18px;
    display: inline-block;
    position: relative;
    top: -10px;
}

.Form_PLSummary_Single{
	font-style: italic;
    color: blue;
    max-height: 100px;
    overflow-x: auto;
    border-radius: 5px;
    margin-top: 5px;
    /*box-shadow: inset 0px 0px 19px -3px black;*/
	padding: 5px 5px 5px 11px;
    text-indent: -6px;
}

.Form_PLSummary_Multiple{
	font-style: italic;
    color: blue;
    border-radius: 5px;
    margin-top: 5px;
    /*box-shadow: inset 0px 0px 19px -3px black;*/
	padding: 5px 5px 5px 11px;
    text-indent: -6px;
}

.Form_PLSummary:empty{
	display: none;
}

.MEBulletList{
	margin:0px 0px 0px -30px;
}
.MEBulletList li{
	list-style-type:decimal;
	padding-left: 10px;
	text-indent: 0px;
	margin-left: 25px;
}
.MEBulletList li:nth-child(even){
	background-color:antiqueWhite;
}
.MEBulletList li:nth-child(odd){
}

.YesOrNo {
	text-align:center;
}

.NoData{
	font-style: italic;
	color: gray;
}

.Form_Comment_Underfield{
	font-style: italic;
	color: gray;
	line-height:14px;
	font-size:14px;
	margin-top: 2px;
}

.Form_ErrorMessage{
	font-style: italic;
	color: red;
    line-height: 12px;
}

.FormRow_HR{
    width: 90%;
    border: 0;
    height: 3px;
    background-image: linear-gradient(to right, rgba(50, 50, 50, 0), rgba(50, 50, 50, 0.75), rgba(50, 50, 50, 0));	
}

/*--- Custom Swtich Control ---*/
.Form_Switch{
    width: 100%;
    height: 30px;
	position: relative;
}
.Form_Switch .groove{
	z-index: 2;
	position: absolute;
	height: 14px;
	width: 50px;
	border-radius: 8px;
	top: 8px;
	left: 12px;
}
.Form_Switch .groove.left{
	background-color: #AAAAAA;
}
.Form_Switch .groove.right{
	background-color: #a3b1fe;
}
.disc{
	z-index: 1;
	position: absolute;
	height: 20px;
	width: 20px;
	border-radius: 16px;
	box-shadow: 1px 2px 7px 2px silver;
	top: -4px;
	transition: 0.3s;
	border: 1px solid #c1c1c1;
}
.Form_Switch .cold{
	background-color: white;
	left: 0px;
}
.Form_Switch .hot{
	background-color: #536dfe;
	left: 30px;
}
.Form_Switch span{
	position: absolute;
	left: 80px;
	top: 7px;
	font-family: arial;
	right: 0px;
}

/*----- Field Menu -----*/
.Field_Menu_Opener {
    width: 80px;
    position: absolute;
    top: 0px;
    bottom: 5px;
    right: 5px;
    border: 1px solid black;
    background-color: white;
    z-index: 100;
    font-size: 12px;
    box-shadow: inset 0px 0px 10px black;
    color: maroon;
	cursor: pointer;
	border-top-left-radius:6px;
	border-top-right-radius:6px;
	padding-left:5px;
	box-sizing:border-box;
}
.Field_Menu_Opener div {
    display: inline-block;
    position: absolute;
    top: 6px;
    left: 5px;
    width: 30px;
}
.Field_Menu_Opener img {
    position: absolute;
    top: 0px;
    right: 6px;
}

.Field_FieldTool{
    position: absolute;
    top: -28px;
    right: -4px;
    height: 35px;
}
.Field_Menu_Contents{
	transition-duration: 0.5s;
	width: 0px;
	position:absolute;
	top: 28px;
	right:5px;
	text-align:left;
	border:2px solid black;
	background-color:white;
	overflow:hidden;
	z-index:101; /*contents go ABOVE the opener*/
	box-shadow: 5px 5px 10px black;
}

/*----- Form Menu -----*/
.Form_Menu_Opener {
    width: 80px;
    position: absolute;
    top: 5px;
    bottom: 5px;
    right: 5px;
    border: 1px solid black;
    background-color: white;
    z-index: 100;
    font-size: 12px;
    box-shadow: inset 0px 0px 10px black;
    color: maroon;
	cursor: pointer;
	padding-left:5px;
	box-sizing:border-box;
}
.Form_Menu_Opener div {
    display: inline-block;
    position: absolute;
    top: -5px;
    left: 5px;
    width: 30px;
}
.Form_Menu_Opener img {
    position: absolute;
    top: 2px;
    right: 6px;
}

.Form_Menu_Contents{
	transition-duration: 0.5s;
	width: 0px;
	position:absolute;
	top: 33px;
	right:5px;
	text-align:left;
	border:2px solid black;
	background-color:white;
	overflow:hidden;
	z-index:99;
	box-shadow: 5px 5px 10px black;
}
.Form_Menu_Heading{
    margin: 0px;
    width: 100%;
    padding: 0px 0px 0px 3px;
    display: block;
    background-color: white;
    color: black;
    border: 0px;
	text-align:left;
	border-bottom: 1px solid #ccc;
	font-size: 16px;
	white-space:normal;
	line-height:32px;
    white-space: nowrap;
	font-weight:bold;
	background-color:#eee;
}
.Form_Menu_Contents_Button {
	-webkit-appearance:none;
    margin: 0px;
    width: 100%;
    padding: 5px;
    display: block;
    background-color: white;
    color: maroon;
    border: 0px;
	height:32px;
	cursor: pointer;
	text-align:left;
	border-bottom: 1px solid #ccc;
	font-size: 16px;
	white-space:normal;
	line-height:12px;
    white-space: nowrap;
}
.Form_Menu_Contents_Button_Disabled {
	-webkit-appearance:none;
    margin: 0px;
    width: 100%;
    padding: 5px;
    display: block;
    background-color: white;
	font-style:italic;
    color: gray;
    border: 0px;
	height:32px;
	cursor: pointer;
	text-align:left;
	border-bottom: 1px solid #ccc;
	font-size:16px;
}
.Form_TellMeMore {
    display: inline-block;
    margin-left: 8px;
    font-style: normal;
    position: absolute;
    right: -52px;
    bottom: 0px;
    cursor:pointer;
	top: 4px;
    height: 30px;
}
/*Used by TrackPermits_CheckUniqueness_Functions*/
.SmallRedText {
	color: red;
}
/*---------------------*/

/*---- These styles are used by javascript constructed elements for reporting validation errors ----*/ 
.Val_ErrorsSummary_Wrapper {
    margin-left: 20px;
    border: 1px solid maroon;
    margin-bottom: 5px;
    cursor: pointer;
    box-shadow: 0px 0px 10px black;
    box-sizing: border-box;
    margin-right: 20px;
}
.Val_ErrorsSummary_Header{
	background-color: maroon;
	color: white;
	padding: 5px;
}
.Val_ErrorsSummary_Body{
	background-color: white;
	padding: 5px;
}
.Val_ErrorList{
	padding-left: 20px;
	margin-top:0px;
	margin-bottom:0px;
}
.Val_Pointer{
	position:absolute;
	top: -21px;
	left:0px;
}
/*---- end ----*/

.BasicFieldSet{
	display:inline-block; 
    vertical-align:top;
	border:1px solid #777;
	border-radius:6px;
	margin-bottom: 5px;
}        

/***** WE shoudl no longer need this ****/

.FieldSet_Visible{
	box-sizing:border-box;
	position:relative;
	border: 1px solid gray;
	border-radius: 8px; 
	margin-top:15px;
	margin-bottom:15px;
	padding-top:25px;
}
.FieldSet_Visible legend{ /*This is a fix for IE 10 - presense of a a legend prevents border radius... so this resolves that*/
    float: left;
    margin-top: -36px;
    font-size: 16px;
    font-weight: bold;
    color: gray;
    font-style: italic;
    /*
	color: white;
	text-shadow: 0px 1px 3px black;
	*/
}

.Background_A{ /*generally used on legends inside fieldsets to mask the round border*/
	background-color: white;
}
.Background_B{ /*generally used on legends inside fieldsets to mask the round border*/
	background-color: white;
}
.Background_C {
	background-color: white;
}

/*----- Page Controls -----*/
.PageControl_Wrapper{
	text-align:center;
	height:40px;
	position:relative;
	padding-top:2px;
}

.PagControl_FilterDrawerOpener{
	position:absolute;
	top:0px;
	left:0px;
	width: 36px;
	overflow: hidden;
}

.PagControl_FilterDrawerOpener i{
	cursor: pointer;
	font-size: 38px;
}
.PageControl_CloseFilterDrawerIcon{
	cursor: pointer;
	position:absolute;
	top:0px;
	right:0px;
}
.PageControl_AdvSorting{
	position: absolute;
	top: 2px;
	left: 40px;
}
.PageControl_1OfX{
	font-size: 10px;
}
.PageControl_RecordCount_Label{
    position: absolute;
    top: 2px;
    right: 2px;
    font-size: 10px;
	font-weight: bold;
    font-style: italic;
    padding: 2px 3px 0px 3px;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 6px 6px 0px 0px;
    width: 90px;
    height: 17px;
    overflow: hidden;
    background-color: rgba(255,255,255,.3);
    box-sizing: border-box;
}
.PageControl_RecordCount{
    position: absolute;
    bottom: 6px;
    right: 2px;
    font-size: 12px;
    font-style: italic;
    padding: 2px 3px 0px 3px;
    border: 1px solid rgba(0,0,0,.1);
    border-radius: 0px 0px 6px 6px;
    width: 90px;
    height: 19px;
    overflow: hidden;
    background-color: rgba(255,255,255,.3);
    box-sizing: border-box;
}
.PageControl_PageGoTos_Scroller{
    overflow-y: auto;
	-webkit-overflow-scrolling: touch;
    height: 179px;
	padding-top:40px;
}
.PageControl_PageGoTos{
	position:relative;
	margin-left:auto;
	margin-right:auto;
	z-index:999;
	width:80%;
	border:2px solid black;
	background-color: #f3f3f3;
	text-align:left;
	box-shadow:0px 10px 30px black;
	border-radius:10px;
	top: 10px;
}
.PageControl_PageGoTos_ButtonWrapper{
	-webkit-appearance: none;
    margin: 2px;
    border-radius: 4px;
    font-size: 14px;
    border: 2px solid black;
    padding: 5px;
    width: 41px;
}

.PageControl_PrevNext{
	display:inline-block;
	height: 26px;
	width: 20px;
	margin: 0px 20px 0px 20px;
	cursor: pointer;
}
/*-------------------------*/

/*Slide out Filter Styling*/
.SO_Wrapper{
	position: fixed;
    bottom: 0px;
    min-height: 50px;
    box-sizing: border-box;
    background: white;
    border: 0px;
    box-shadow: silver 0px 0px 4px 2px;
    padding: 0px;
    transition: all 1s ease 0s;
	border-right: 1px solid silver;
}
.SO_DrawerBody{
	width: 100%;
	font-size: 12px;
	font-family: Arial;
	color: black;
	height: 100%;
}
.SO_Title{
	font-size: 14px; 
	border-bottom: 1px solid black; 
	height: 20px; 
	padding-top: 4px; 
	padding-left: 4px;
}
.SO_QuoteHelp{
	font-style: italic; 
	color: #333; 
	padding-left: 3px;
}
.SO_Scroller{
	position: absolute; 
	top: 52px; 
	bottom: 44px; 
	overflow-y: scroll;
	-webkit-overflow-scrolling: touch; 
	width: 100%;
}
/*------------------------*/

/*------- Modal elements -------*/
.Modal_Blocker{
    left: 0px;
    top: 0px;
    right: 0px;
    bottom: 0px;
    position: fixed;
    z-index: 9000; /*usually overriden by creation js*/
    opacity: 0.6;
    background-color: #555555;
	overflow:hidden;
}

.Modal_Wrapper{
    left: 0px;
    top: 100px; /*usually overriden by creation js*/
    width: 100%;
    bottom: 100px; /*usually overriden by creation js*/
    position: fixed;
    z-index: 9001; /*usually overriden by creation js*/
	overflow: hidden;
	padding: 8px;
	box-sizing:border-box;
}

.Modal_Div{
    padding-top: 0px;
    padding-right: 0px;
    padding-bottom: 0px;
    padding-left: 0px;
    font-family: Arial;
    font-size: 12px;
    margin-top: auto;
    margin-right: auto;
    margin-bottom: auto;
    margin-left: auto;
    position: relative;
    z-index: 9001;
    min-height: 100px;
    border-radius: 4px;
    box-shadow: 0px 0px 10px black;
    background-color: #FAFAFA;
	box-sizing:border-box;
	overflow:hidden;
}
.Modal_GoAwayX{
    top: 0px;
    width: 40px;
    height: 40px;
    text-align: center;
    right: 0px;
    color: white;
    line-height: 40px;
    font-size: 30px;
    font-weight: bold;
    position: absolute;
    cursor: pointer;
    background-color: maroon;
	z-index:9005;
	border-bottom-left-radius: 8px;	
}
.Modal_TitleBar{
    width: 100%;
    height: 36px;
    overflow: hidden;
    padding-top: 3px;
    position: absolute;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    background-color: white;
	z-index:9004;
}
.Modal_TitleText{
    text-align: left;;
    color: #5F5F5F;
    line-height: 38px;
    font-family: Arial;
    font-size: 18px;
    font-weight: bold;
	padding-left:10px;
}
.Modal_ContentWrapper{
    left: 0px;
    top: 41px;
    right: 0px;
    bottom: 50px;
    position: absolute;
    /*overflow-y: auto;*/ /*this is now an option in TM_modal_v2*/
	-webkit-overflow-scrolling: touch;	
	z-index:9003;
	font-size:18px;
	padding:5px;
	text-align:center;
}
.Modal_FixedArea{
    position: absolute;
    bottom: 0px;
    left: 0px;
	right: 0px;
	height: 50px;
	border-top: 1px solid silver;
    width: 100%;
	text-align:right;
	background-color: white;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	z-index:9002;
    box-sizing: border-box;
    padding: 5px;	
}
/*-------------------------*/

.required{
	color:maroon;
	font-weight:bold;
}
.required:before{
	content:"\25BA ";
}

/******** TylerTech-like buttons *********/
.TTButton_HighEmphasis{
	-webkit-appearance:none;
	color: white;
	background-color: #3f51b5;
    border-radius: 4px; 
    font-size: 14px;
    border: 0px;
	margin: 2px 0px 2px 2px;
    padding: 0px 16px 0px 16px;	
	cursor: pointer;	
	box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12);
	box-sizing:border-box;	
	height: 36px;
	min-width: 64px;
}

.TTButton_HighEmphasis:hover{
	background-color: #4E5FBB;	
}
.TTButton_MediumEmphasis{
	-webkit-appearance:none;
	color: #3f51b5;
	background-color: white;
    border-radius: 4px; 
    font-size: 14px;
    border: 1px solid #3F51B5;
	margin: 2px 0px 2px 2px;
    padding: 0px 16px 0px 16px;	
	cursor: pointer;
	box-sizing:border-box;	
	height: 36px;
	min-width: 64px;
}
.TTButton_MediumEmphasis:hover{
	background-color: #DDD;	/*this is a guess*/
}
.TTButton__MediumEmphasis_ForAnchorLinks{
	-webkit-appearance:none;
	color: #3f51b5;
	background-color:white;
    border-radius: 4px; 
    font-size: 14px;
    border: 1px solid #3F51B5;
    padding: 9px 16px 9px 16px;	
	vertical-align: top;
	height:36px;
	cursor:pointer;
	text-decoration: none;
	box-sizing: border-box;
}

.TTButton_LowEmphasis{
	-webkit-appearance:none;
	color: #3F51B5;
	background-color: white;
    border: none;
    border-radius: 4px; 
    font-size: 14px;
	margin: 2px 0px 2px 2px;
    padding: 0px 16px 0px 16px;	
	cursor: pointer;
	box-sizing:border-box;	
	height: 36px;
	min-width: 64px;
}
.TTButton_LowEmphasis:hover{
	background-color: #DDD;	/*this is a guess*/
}

.TTButton_DialogNeutral{
	-webkit-appearance:none;
	color: #3f51b5;
	background-color: white;
    border-radius: 4px; 
    font-size: 14px;
    border: 0px;
	margin: 2px 0px 2px 0px;
    padding: 0px 16px 0px 16px;	
	cursor: pointer;
	box-sizing:border-box;	
	height: 36px;
	min-width: 64px;
	font-weight:bold;
}
.TTButton_DialogNeutral:hover{
	background-color: #E8EAF6;
}

.TTButton_Link_HighEmphasis{            /*used to make an href look like a regular high emphasis button*/
    -webkit-appearance: none;
    color: white;
    background-color: #3f51b5;
    border-radius: 4px;
    font-size: 14px;
    border: 0px;
	margin: 2px 0px 2px 0px;
    padding: 9px 16px 0px 16px;
    vertical-align: bottom;
    height: 22px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
	box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12);
	box-sizing:border-box;	
	min-width: 64px;
	height: 36px;
}
.TTButton_Link_HighEmphasis:hover{
	background-color: #4E5FBB;	
}

.TTButton_Link_MediumEmphasis{            /*used to make an href look like a regular medium emphasis button*/
    -webkit-appearance: none;
    color: white;
    color: #3f51b5;
    background-color: white;
    border-radius: 4px;
    font-size: 14px;
    border: 1px solid #3F51B5;
	margin: 2px 0px 2px 0px;
    padding: 9px 16px 0px 16px;
    vertical-align: bottom;
    height: 22px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
	box-sizing:border-box;	
	min-width: 64px;
	height: 36px;
}
.TTButton_Link_MediumEmphasis:hover{
	background-color: #DDD;	
}


.TTButton_OpenPageGoTos {
	/* This is not "official" - I need something to make the button look Tyler ish, but Tyler Forge shows this as little dinky set of arrrow at Bot R*/
	/* Those arrows do not look WACAG compliant (too low contrast)*/
	-webkit-appearance:none;	
    color: #3f51b5;
    background-color: white;
    border-radius: 4px;
    font-size: 14px;
	height:40px;
    border: 1px solid #3F51B5;
    padding: 2px;
	line-height:14px;
	vertical-align:top;
	cursor:pointer;
}
.TTButton_OpenPageGoTos_COLD{
    color: gray;
    background-color: none;
	font-style:italic;
	cursor: default;
	border: 1px solid silver;
	border-radius: 4px;
	height: 40px;
}

.TTButton_WithIcon{
	-webkit-appearance:none;
	color:white;
	background-color: #3F51B5;
    border-radius: 4px; 
    font-size: 18px;
    border: 0px;
	vertical-align: top;	
	
	padding: 0px; 
	height:	36px; 
	width: 36px;
	cursor: pointer;
}
.TTButton_WithIcon img{
	width: 30px;
	height: 30px;
}

.TTButton_WithIcon_Cold{
	-webkit-appearance:none;
	color:white;
	background-color:gray;
    border-radius: 4px; 
    font-size: 18px;
    border: 0px;
	vertical-align: top;	
	
	padding: 0px; 
	height:	36px; 
	width: 36px;
	cursor: pointer;
}
.TTButton_WithIcon_Cold img{
	width: 30px;
	height: 30px;
}

.TTButton_HighEmphasis_WithIconANDText{
	-webkit-appearance:none;
	color:white;
	background-color: #3F51B5;
    border-radius: 4px; 
    font-size: 14px;
    border: 0px;
	vertical-align: top;	
	margin: 2px 0px 2px 0px;
    padding: 0px 16px 0px 16px;
	height:	36px; 
	cursor: pointer;
    width: 330px;
	text-align:left;
    position: relative;	
	box-sizing: border-box;
	min-width: 64px;
}
.TTButton_MediumEmphasis_WithIconANDText{
	-webkit-appearance:none;
	color: #3F51B5;
	background-color: white;
    border-radius: 4px; 
    font-size: 14px;
    border: 1px solid #3F51B5;
	vertical-align: top;	
	margin: 2px 0px 2px 0px;
    padding: 0px 16px 0px 16px;
	height:	36px; 
	cursor: pointer;
	text-align:left;
    position: relative;	
	box-sizing: border-box;
	min-width: 64px;
}
.TTButton_LowEmphasis_WithIconANDText{
	-webkit-appearance:none;
	color:white;
	background-color: #3F51B5;
    border-radius: 4px; 
    font-size: 14px;
    border: 0px;
	vertical-align: top;	
	margin: 2px 0px 2px 0px;
    padding: 0px 16px 0px 16px;
	height:	36px; 
	cursor: pointer;
    width: 330px;
	text-align:left;
    position: relative;	
	box-sizing: border-box;
	min-width: 64px;
}
.TTButton_WithIconANDText img{
	width: 30px;
	height: 30px;
	margin-left: 0px;
}
.TTButton_HighEmphasis_WithIconANDText div{
    position: absolute;
    top: 10px;
    left: 45px;	
}
.TTButton_MediumEmphasis_WithIconANDText div{
    position: absolute;
    top: 10px;
    left: 45px;	
}
.TTButton_LowEmphasis_WithIconANDText div{
    position: absolute;
    top: 10px;
    left: 45px;	
}
.TTButton_COLD {
	/* TylerForge does not have an example of a disabled button - so this is non-standard at the moment*/
    color: gray;
    background-color: none;
	font-style:italic;
	font-size: 14px;
	cursor: default;
	border: 1px solid silver;
	border-radius: 4px;
	margin: 2px 0px 2px 2px;
    padding: 0px 16px 0px 16px;
	height: 36px;
	box-sizing: border-box;
}
.TTButton_HOT {
    color: white;
    background-color: #3F51B5;
	cursor: pointer;
}

/*This very non-Tyler Forge - its smaller than offical sizes*/
.TTButton_MediumEmphasis_SmallFont{
	-webkit-appearance:none;
	color: #3f51b5;
	background-color: white;
    border-radius: 4px; 
    font-size: 9px;
    border: 1px solid #3F51B5;
	/*margin: 2px 0px 2px 2px;*/
    /*padding: 0px 16px 0px 16px;*/
	cursor: pointer;
	box-sizing:border-box;	
	height: 14px;
	min-width: 30px;
}

.TTButton_Resubscribe{
	color: black;
	background-color: yellow;
    border-radius: 4px;
    font-size: 12px;
    border: 0px;
	margin: 0px 0px 0px 0px;
    padding: 4px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
	box-shadow: 0 2px 4px -1px rgba(0,0,0,.2), 0 4px 5px 0 rgba(0,0,0,.14), 0 1px 10px 0 rgba(0,0,0,.12);
	box-sizing:border-box;	
	min-width: 64px;
	height: 56px;
}

/* end buttons */

.MEButton{
	/*DEPRECATED - use TTButton family of css*/
	-webkit-appearance:none;
	color:white;
	background-color:maroon;
    border-radius: 6px; 
    font-size: 18px;
    border: 2px solid black;
    padding: 5px;	
	vertical-align: top;
	height:36px;
	cursor:pointer;
}
.MEButton_Mini{
    -webkit-appearance: none;
    color: white;
    background-color: maroon;
    border-radius: 6px;
    font-size: 16px;
    border: 2px solid black;
    padding: 0px;
    vertical-align: top;
    /* height: 26px; */
    cursor: pointer;
}
.MEButton_ForAnchorLinks{
	-webkit-appearance:none;
	color:white;
	background-color:maroon;
    border-radius: 6px; 
    font-size: 18px;
    border: 2px solid black;
    padding: 5px;	
	vertical-align: top;
	height:36px;
	cursor:pointer;
	text-decoration: none;
}
.MEButton_DataChunk{
	font-style:italic;
	border: 1px dashed silver;
	font-size:14px;
	border-radius:5px;
	margin-top:5px;
}

.MEButton_FileOpen{
	text-decoration:none; 
	display:block; 
	position:relative; 
	width:310px;
	margin-bottom:10px;
}
.MEButton_FileOpen button{
	width: 300px; 
	text-align:left; 
	font-size:12px; 
	position:relative;
	min-height:48px;
	cursor:pointer;
	
	color:white;
	background-color:maroon;
	margin-left:5px;
    border-radius: 6px; 
    font-size: 20px;
    border: 2px solid black;
    padding: 5px;		
	
}
.MEButton_FileOpen_TypeIcon_Small{
    height: 25px;
    width: 25px;
    border-radius: 3px;
    position: absolute;
    bottom: 0px;
    right: -10px;
}
.MEButton_FileOpen_TypeIcon_Big{
	width: 50px; 
	height: 50px;
	cursor: pointer; 
	border: 3px solid white; 
	background-color: white;
	border-radius: 3px; 
}

.MEButton_FileOpen_Caption{
	color:white; 
	font-style:italic;	
	font-size: 12px;
	width:215px;
}

.MEButton_FileOpen_Thumbnail{
	width: auto; 
	cursor: pointer; 
	border: 3px solid white; 
	background-color: white;
	border-radius: 3px; 
}
.MEButton_FileOpen_Wrapper{
    position: relative;
    width: 50px;
    height: 50px;
	display:inline-table;
}
.MEButton_FileOpen_MissingFile{
	width:60px;
	height:38px;
	border: 1px solid black;
	font-size: 20px;
	padding-top:20px;
	color:black;
	text-align:center;
	margin-top:2px;
	border-radius:3px;
	background-color:#999;
	font-style:italic;
	display:inline-block;
}

.MEButton_COLD {
    color: black;
    background-color: silver;
	cursor: pointer: default;
}
.MEButton_HOT {
    color: white;
    background-color: maroon;
	cursor: pointer;
}
.MEButton_ExpandCollapse_Container{
	width: 900px;
	position: relative;
	margin-top: 10px;
	margin-left: 10px;
	border: 1px solid black;
	border-radius: 9px;
	box-shadow: 1px 2px 6px 0px gray;
}
.MEButton_ExpandCollapse{
	border-width: 0px 1px 0px 0px;
	border-color: black;
	background-color: #3F51B5;
	color: white;
	text-align:center;
	border-radius: 8px 0px 0px 8px;
	position: absolute;
	width: 35px;
	top: 0px;
	bottom: 0px;
	left: 0px;
	box-sizing: border-box;
	display: table-cell;
	vertical-align: middle;
	font-size: 12px;
	font-style:  italic;
	padding-top: 6px;
	cursor:pointer;
}
.MEButton_ExpandCollapse_Target{
	padding: 5px;
	box-sizing:border-box;
	padding-left:45px;
}

.MEButton_Link{            /*used to make an href look like a reguar button*/
    -webkit-appearance: none;
    color: white;
    background-color: maroon;
    border-radius: 6px;
    font-size: 18px;
    border: 2px solid black;
    padding: 5px;
    vertical-align: top;
    height: 22px;
    cursor: pointer;
    text-decoration: none;
    display: inline-block;
}
	
/*--- Post Form processing comfirmation ---*/
.PostForm_ConfirmMessages{
	padding:5px;
	text-align:center;
}
.PostForm_ConfirmMessages h3{
	text-align: center;
}
.PostForm_ConfirmMessages_ButtonLayout{
	width:100%;
    margin-bottom: 5px; /*puts a gap in the stacks*/
}

/*--- View Buttons ---*/
.MenuViewButton {
    background: white;
    color: #3f51b5;
}
.MenuViewButton:hover {
    background-color: #DDD;
}
.MenuViewButton_hot {
    background: silver;
    color: black;
	text-shadow: 1px 1px silver, -1px -1px silver, 1px -1px silver, -1px 1px silver;
}

.ViewButton {
    -webkit-appearance: none;
    font-family: Arial, Helvetica, sans-serif;
    font-weight: bold;
    font-size: 14px;
    border-radius: 4px;
    border: 1px solid #3F51B5;
    margin-top: 5px;
    overflow: hidden;
    height: 40px;
    vertical-align: top;
    position: relative;
	cursor:pointer;
}

.ViewButtonLabel {
    position: relative;
    z-index: 2;
}

.ViewButtonLabel_hot {
    position: relative;
    z-index: 2;
}


.BigNum {
    position: absolute;
    font-size: 35px;
    font-weight: bold;
    top: -1px;
    left: 3px;
    width: 10px;
    z-index: 1;
    letter-spacing: -5px;
}

.ViewButtonBigNumColor {
    color: silver;
}

.ViewButtonBigNumColor_hot {
    color: #555;
}

/*--- Accordion Stylings ---*/
.Accordion_Header{
	background: var(--papayawhip_25percent);
	min-height: 30px;
	border: 1px solid var(--papayawhip_25percent);
	cursor:pointer;
	transition: all 1s;
	position:relative;
	border-bottom:1px solid var(--papayawhip_40percent);
	border-top:1px solid var(--papayawhip_10percent);
	box-sizing:border-box;
}
.Accoridan_Header_Title{
	text-shadow: 1px 1px white;
	color:black;
	text-align:center;
	line-height:15px;
	font-size: 16px;
	width:84%;
	margin:5px auto 5px auto;
}

.Accordian_Header_SummaryArea {
    font-size: 12px;
    line-height: 10px;
    text-align: left;
    margin: 0px 0px 5px 0px;
    padding: 2px;
    font-style: italic;
    color: #333;
	text-shadow:none;
}

.Accordion_Header_ReadyToOpen{
	background: var(--papayawhip_25percent);
	text-shadow: 1px 1px white;
	min-height: 30px;
	color:gray;
	text-align:center;
	border: 1px solid var(--papayawhip_25percent);
	cursor:pointer;
	line-height:30px;
	font-size: 18px;
	/*box-shadow: inset 0px 0px 15px maroon;*/
	transition: all 1s;
	position:relative;
	border-bottom:1px solid var(--papayawhip_40percent);	
	border-top:1px solid var(--papayawhip_10percent);	
	box-sizing:border-box;
}

.Accordion_Area{
	border-left: 1px solid var(--papayawhip_25percent);
	border-right: 1px solid var(--papayawhip_25percent);
	border-bottom: 1px solid var(--papayawhip_25percent);
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;		
	box-shadow: inset 0px 0px 10px 3px grey;
	box-sizing:border-box;
	position:relative;
}
.Accordion_ChevronL{
	position:absolute;
	left:5px;
	top:1px;
}
.Accordion_ChevronR{
	position:absolute;
	right:5px;
	top:1px;
}

/*--- Accordion_2 Stylings ---*/
.Accordion_2_Header{
    min-height: 25px;
    cursor: pointer;
    line-height: 30px;
    font-size: 18px;
    transition: all 1s;
    position: relative;
    box-sizing: border-box;
}
.Accordion_2_Header_Title{
	color:black;
	line-height:15px;
	font-size: 16px;
	margin:5px;
}

.Accordion_2_Area{
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;		
	box-sizing:border-box;
	position:relative;
    border-bottom: 1px solid silver;	
}
.Accordion_2_ChevronR{
	position:absolute;
	right:0px;
	top:-4px;
	width: 36px;
	overflow: hidden;
}
.Accordion_2_Chevron_Opened{
	color: #444;
    transition-duration: .4s;
    -webkit-transform: rotate(0deg);
    pointer-events: none;
}
.Accordion_2_Chevron_Closed{
	color: #444;
    transition-duration: .4s;
    -webkit-transform: rotate(180deg);
    pointer-events: none;
}
/* --------- HELP STuff ----*/
.MEHelpOverlay {
    background: #555555;
    margin: 0px;
    cursor: pointer;
    height: 100%;
    width: 100%;
    text-align: center;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 0px;
    top: 0px;
    z-index: 50;
    filter: alpha(opacity=60);
    opacity: 0.6;
}
.MEHelpContainer {
    height: 100%;
    width: 100%;
    position: absolute;
    z-index: 99;
    opacity: 1;
    filter: alpha(opacity=100);
    left: auto;
    right: 0px;
    bottom: 0px;
    top: 0px;
}



/*---------- Tell me more box ---------------*/
.TellMeMore_Blocker{
	position:fixed;
	top:48px;
	bottom: 0px;
	left: 0px;
	right:0px;
	background-color: rgba(8,8,8,0.5);
	z-index:9002;
}

.TellMeMore_PositioningWrapper{
	position:absolute;
	top:100px;
	left:50%;
}
.TellMeMore_Wrapper{
	box-shadow: 0px 0px 20px black;
	width: 380px;
	background-color:papayaWhip;
	margin-left: -192px;
	top:100px;
	position: fixed;
	border:2px solid black;
	border-radius: 10px;
	z-index:1000;
	font-family:Arial, Helvetica, sans-serif;
}
.TellMeMore_Title{
	position: relative;
	top:0px;
	left:0px;
	right:20px;
	height:20px;
	line-height:20px;
	text-align:center;
	background-color:var(--papayawhip_25percent);
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	font-size:14px;
	font-weight:bold;
	border-bottom:2px solid black;
}
.TellMeMore_Message{
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	position:absolute;
	bottom:40px;
	left:0px;
	right:0px;
	top:22px;
	padding:10px;
	font-size: 14px;
	
}
.TellMeMore_Controls{
	position:absolute;
	bottom:0px;
	left:0px;
	right: 0px;
	height:40px;
	text-align:center;
}
/*--------------- Fail coutn indicators ---------------*/
.FailCountWrapper {
    background-color: red;
    height: 19px;
    display: inline-block;
    border-radius: 10px;
    border: 1px solid black;
    line-height: 19px;
    margin-left: 5px;
	margin-right:5px;
    text-shadow: none;
    color: black;
    padding: 0px 5px 0px 5px;
}
/*-------------- Progress/Status bar --------------------*/
.StatusBarWrapper{
	background-color: black;
	width:300px;
	margin: 20px auto 20px auto;
	border: 1px solid black;
	border-radius: 5px;
	height:20px;
	position:relative;
}
.StatusBarDone{
    background-color: mediumseagreen;
    margin: 0px;
    border-radius: 5px;
    height: 20px;
    position: absolute;
    top: 0px;
    left: 0px;
    bottom: 0px;
    z-index: 1;
    box-shadow: inset 0px 0px 7px 4px darkgreen;
}
.PercentText{
	position: absolute;
	top:0px;
	left:0px;
	right:0px;
	bottom:0px;
	text-align:center;
	color:white;
	font-weight:bold;
	z-index:2;
	height:20px;
	margin-top:3px;
	text-shadow: 1px 1px black;
}
/*-------------- little box data ----------------------*/
.littlebox{
    display: inline-block;
    border: 1px solid gray;
    width: 100%;
    margin: 1px 1px 3px 1px;
    border-radius: 6px;
	box-sizing:border-box;
}
.littlebox_label{
    background-color: rgba(255,255,255,0.4);
    border-bottom: 1px solid gray;
    text-align: center;
    /* font-weight: bold; */
    color: gray;
    font-style: italic;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
    font-size: 10px;
}
.littlebox_data{
    min-height: 10px;
    text-align: center;
    font-size: 12px;	
    background-color: rgba(255,255,255,0.2);
}
.littlebox_data_left{
    min-height: 10px;
    text-align: left;
    font-size: 12px;	
    background-color: rgba(255,255,255,0.2);
}
.littlebox_simple{
    display: inline-block;
    border: 0px;
    width: 80px;
    margin: 1px 1px 3px 1px;
    border-radius: 6px;
    box-shadow: 1px 3px 3px 0px grey;
    text-align:center;
    font-size:12px;
    font-weight:bold;
}
.littlebox_singleitem{
    margin: 0px;
    border: 1px solid silver;
    border-radius: 6px;
    background-color: rgba(255,255,255,0.36);
    padding: 3px;
    font-size: 12px;
	font-style: italic;
    box-sizing: border-box;
}
/*----------- Drag And Drop ---------------------*/
.Grippy{
	position:absolute;
	top:2px;
	left:2px;
	bottom:2px;
	width:20px;
	background: gray; /* Old browsers */
	background-image: repeating-linear-gradient(180deg, gray, gray 2px, silver,3px, silver 4px);
	border: 1px solid black; /*Chrome, Safari*/
}
.DragBoxType{
	padding: 4px;
	border: 1px solid black;
	min-height:20px;
	background-color:white;
	position:relative;
}
.DragBoxType_text{
	margin: 0px 25px 0px 25px;
}
.DropZone{
    border: 1px dashed var(--papayawhip_40percent);
    background-color: rgba(192, 192, 192,.5);
	font-size:14px;
	font-style:italic;
	text-align: center;
	background-color: #CCC;
	color:gray;	
}
.DropZoneTiny{
    border: 1px dashed var(--papayawhip_40percent);
    background-color: rgba(192, 192, 192,.5);
	font-size:9px;
	font-style:italic;
	text-align: center;
	background-color: #CCC;
	color:gray;	
}

/*----------------- Red/Green Indicators ---------------------*/
.IndicatorBall {
    border-radius: 22px;
    cursor: pointer;
    width: 22px;
    height: 22px;
    font-size: 19px;
    line-height: 23px;
	display:inline-block;
	vertical-align: top;
	position:absolute;
	top: 2px;
	left: 2px;
}
.IndicatorBallTweak { /*Modifies MEButton*/
	height: auto; 
	width: 100%; 
	margin-bottom: 2px;
	position: relative;
	height: 35px;
}
.IndicatorBall_text{
	position:absolute;
	top: 5px;
	left: 35px;
	right: 5px;
	display: inline-block;
	font-style:italic;
	font-size: 12px;
	text-align: left;
}
.GrayBall {	
    border: 2px solid #666;
    color: #666;
}
.RedBall {	
    border: 2px solid white;
    color: white;
}
/*---- START PROGRESS BAR Styles -------*/
.ProgBar_Wrapper{
	width:300px; 
	border-radius:8px; 
	border:1px solid black; 
	box-shadow: inset 0px 0px 14px black; 
	background-color:#555; 
	height:20px; 
	position:relative;
}
.ProgBar_Bar_Green{
	background-color:green; 
	background: linear-gradient(to bottom, #bfd255 0%,#8eb92a 50%,#72aa00 51%,#9ecb2d 100%); 
	border-radius:8px; 
	box-shadow:inset 0px 0px 5px black; 
	height:100%;
}
.ProgBar_Bar_Red{
	background-color: maroon; 
	background: linear-gradient(to bottom, #d25555 0%,#b92a2a 50%,#aa0000 51%,#cb2d2d 100%);
	border-radius:8px; 
	box-shadow:inset 0px 0px 5px black; 
	height:100%;
}
.ProgBar_Text{
	width:100%; 
	color: white; 
	text-shadow: black 1px 1px, black -1px -1px, black 1px -1px,black -1px 1px; 
	font-weight:bold; 
	text-align:center; 
	position:absolute; 
	z-index:1; 
	top:3px;
}
/*---- END PROGRESS BAR Styles -------*/

/*----------------- Table Stylings ---------------------*/
.MELite_Table_Basic{
	border: 2px solid black;
	border-collapse: collapse;
	font-size: 14px;
	/*width: calc(100%-5px);*/
	width: 100%;
	margin-bottom:2px;
	box-sizing:border-box;
}
.MELite_Table_Basic caption{
	font-size:18px;
	font-weight:bold;
}
.MELite_Table_Basic thead td{
	font-weight: bold;
	height:36px;
	vertical-align:bottom;
}
.MELite_Table_Basic td{
	border: 1px solid silver;
	padding-left: 2px;
	padding-right:2px;
}
.MELite_Table_Basic tbody td{
	vertical-align:top;
}
.MELite_Table_Basic tbody tr:nth-child(even){
	background-color:  white;
}
.MELite_Table_Basic tbody tr:nth-child(odd){
	background-color: #dbdbdb;	
}
.MELite_Table_Basic_NoLines{
	border: 0px;
	border-collapse: collapse;
	font-size: 14px;
	/*width: calc(100%-5px);*/
	width: 100%;
	margin-bottom:2px;
	box-sizing:border-box;
}
.MELite_Table_Basic_NoLines thead td{
	font-weight: bold;
	height:36px;
	vertical-align:bottom;
}
.MELite_Table_Basic_NoLines td{
	border: 0px;
	padding-left: 2px;
	padding-right:2px;
}
.MELite_Table_Basic_NoLines tbody td{
	vertical-align:top;
}
.MELite_Table_Basic_NoLines tbody tr:nth-child(even){
	/*-- none --*/
}
.MELite_Table_Basic_NoLines tbody tr:nth-child(odd){
	background-color: var(--papayawhip_20percent);
}

.MELite_Table_Basic_ForPrint{
	border: 2px solid black;
	border-collapse: collapse;
	font-size: 14px;
	/*width: calc(100%-5px);*/
	width: 100%;
	margin-bottom:2px;
	box-sizing:border-box;
}
.MELite_Table_Basic_ForPrint thead td{
	font-weight: bold;
	height:36px;
	vertical-align:bottom;
}
.MELite_Table_Basic_ForPrint td{
	border: 1px solid gray;
	padding-left: 2px;
	padding-right:2px;
}
.MELite_Table_Basic_ForPrint tbody td{
	vertical-align:top;
}

/*---   START Stylings for RMS ID Displays ---*/
.RMS_IDS_Table{
    background-color: bisque;
    border: 1px solid black;
	border-collapse:collapse;
}
.RMS_IDS_Table thead td{
	text-align: center; 
	font-weight: bold;
	font-style: italic;
	color: black;
	background-color:burlywood;
	padding:2px;
	font-size:10px;
}
.RMS_IDS_Table tbody td{
	padding:2px;
	font-size:10px;
}
.RMS_IDS_Table tbody td input{
	font-size: 10px;
}

.RMS_ID_Display {
	font-size: 10px; 
	color: #555;
	vertical-align:top;
}
.RMS_ID_Label{
	text-align:right;
	font-weight: bold;
	vertical-align:top;
}
.RMS_ID_Display_LotsOFIDs{
	max-width:300px;
	max-height:100px;
	overflow-y: auto;
	font-size: 10px; 
	color: #555;
}

.RMS_IDS_Table tbody tr:nth-child(even){
	background-color: rgba(0,0,0,0);
}
.RMS_IDS_Table tbody tr:nth-child(odd){
	background-color: rgba(0,0,0,0);
}

/*---   END Stylings for RMS ID Displays ---*/

.MELite_Table_Basic_ForPrint{
	border: 2px solid black;
	border-collapse: collapse;
	font-size: 14px;
	/*width: calc(100%-5px);*/
	width: 100%;
	margin-bottom:2px;
	box-sizing:border-box;
}
.MELite_Table_Basic_ForPrint thead td{
	font-weight: bold;
	height:36px;
	vertical-align:bottom;
}
.MELite_Table_Basic_ForPrint td{
	border: 1px solid gray;
	padding-left: 2px;
	padding-right:2px;
}
.MELite_Table_Basic_ForPrint tbody td{
	vertical-align:top;
}

/********* TylerTech-like "Cards" -------------------*/
/** for typography on cards see CardTitle and CardSubTitle **/
.TTCard_v2{
	/* PREFERED OVER TTCard as it is closer to Tyler Style*/
    box-shadow: 2px 2px 3px -1px #aaa;
    border: 1px solid silver;
    margin: 10px;
    box-sizing: border-box;
    background-color: white;
    padding: 14px;
    border-radius: 4px;
}

.TTCard{
	/* Use TTCard_v2 whenever possible */
	box-shadow: 0px 0px 5px 3px #AAA;
	border: 1px solid silver;
	margin:10px;
	box-sizing:border-box;
	background-color: white;
}


.TTCard_UnderTab{
	/*This is meant to compliment TTInpageTabTable and should fit right underneath*/
	box-shadow: 0px 0px 5px 3px #AAA;
	border: 1px solid silver;
	margin: 0px 10px 10px 10px;
	box-sizing:border-box;
	background-color: white;
}

.TTCardPadding{
	/*Use this wtih TTCard (et.al. to add some much needed padding to a TTcard*/
    padding: 5px;
}

.TTCard_Title{
	/*For section headers on a card*/
	font-size: 14px;
    border-bottom: 1px solid silver;
    font-style: italic;
    color: silver;
    margin: 6px 0px;
}

/*--INTERIM TAB A+ TylerTech-looking tabs (for tabs in a page------*/
.TTInPageTabTable{
	background-color: white;
	border: 0px;
	width: 100%;
	z-index: 9002;
	margin-bottom: 0px;
}
.TTInPageTabs_Cold{
	width:80px;
	height:40px;
	text-align:center;
	padding: 0px 5px 0px 5px;
	cursor: pointer;
	border-right: 1px solid #EEE; /*Not Tyler style, but will help our users in the transition*/
	color:#6F7072;
	text-decoration:none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;	
}
.TTInPageTabs_Cold:hover{
	background-color:#F2F3F7;
}
.TTInPageTabs_Hot{
	width:80px;
	height:40px;
	font-family:Arial, Helvetica, sans-serif;
	background-color: #E3E5F1;
	color:#3F51B5;
	font-size:12px;
	font-weight:bold;
	text-align:center;
	padding: 0px 5px 0px 5px;
    border-bottom: 2px solid #3F51B5;
    cursor: pointer;	
	border-right: 1px solid #EEE; /*Not Tyler style, but will help our users in the transition*/
}
/*--------------end INTERIM TAB --------------------------------------*/

/*----------- START badge stylings ------------*/
.TTBadge{
    border-radius: 9px;
    color: white;
    text-align: center;
	font-weight: bold;
	padding: 0px 7px;
}
.VerifiedAddrBadge{
	background-color: #61b500;
    color: white;
    width: 16px;
    height: 16px;
    font-size: 12px;
    border-radius: 8px;
    padding: 0px;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	position: absolute;
    top: 0px;
    left: -18px;	
}
.VerifiedAddrBadge2{
	background-color: #61b500;
    color: white;
    width: 16px;
    height: 16px;
    font-size: 12px;
    border-radius: 0px 8px 8px 0px;
    padding: 0px;
	text-align: center;
	font-weight: bold;
	cursor: pointer;
	position: absolute;
    top: -1px;
    right: -16px;	
}
/*------------ end Badge Stylings -------------*/
/*----------- DEPRECATED START tab stylings ------------*/
.TMTabContainer{
	padding:10px 10px 0px 10px;
}
.TMTabRow{
	padding-left: 10px;
}
.TMHotTab{
    background-color: var(--papayawhip_25percent);
    color: black;
    display: table-cell;
    font-size: 12px;
    font-weight: bold;
	text-shadow: 1px 1px solid black;
    cursor: pointer;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-width: 1px 1px 0px 1px;
    border-style: solid;
    border-color: black;
    overflow: hidden;
    position: relative;
    z-index: 99;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: middle;
    box-sizing: border-box;
    padding: 0px 2px 0px 2px;
}
.TMHotTab a{
	text-decoration: none; /* this class remvoes the link underline and blue text from any hyper-links*/
	color: inherit;
}
.TMColdTab{
    background-color: maroon;
    color: white;
    display: table-cell;
    font-size: 12px;
    font-weight: bold;
    cursor: pointer;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-width: 1px 1px 0px 1px;
    border-style: solid;
    border-color: black;
    overflow: hidden;
    position: relative;
    z-index: 99;
    font-family: Arial, Helvetica, sans-serif;
    vertical-align: middle;
    box-sizing: border-box;
    padding: 0px 2px 0px 2px;
}
.TMColdTab a{
	text-decoration: none; /* this class remvoes the link underline and blue text from any hyper-links*/
	color: inherit;
	/*the following makes the a tag as wide and as tall as the container (better for clicking)*/
	display:inline-block;
	width: 100%;
	height: 100%;
	padding-top: 7px;
}
.TMHotUnderTab{
	background-color: var(--papayawhip_25percent);
	border-width: 1px 0px 1px 0px;
	border-style: solid;
	border-color: black;
	border-top-color: var(--papayawhip_25percent);
	display: table-cell;
	height: 7px;
	box-sizing: border-box;
}
.TMColdUnderTab{
	border-top-color: black;
	background-color: var(--papayawhip_25percent);
	border-width: 1px 0px 1px 0px;
	border-style: solid;
	border-color: black;
	display: table-cell;
	height: 7px;
	box-sizing: border-box;
}
.TMUnderTab_LEnd{
	border-top-color: black;
	background-color: var(--papayawhip_25percent);
	border-width: 1px 0px 1px 1px;
	border-style: solid;
	border-color: black;
	border-top-left-radius: 8px;
	display: table-cell;
	height: 7px;
	box-sizing: border-box;
    box-shadow: 0px -10px 30px 1px #80808069	
}
.TMUnderTab_REnd{
	border-top-color: black;
	background-color: var(--papayawhip_25percent);
	border-width: 1px 1px 1px 0px;
	border-style: solid;
	border-color: black;
	border-top-right-radius: 8px;
	display: table-cell;
	height: 7px;
	box-sizing: border-box;
    box-shadow: 0px -10px 30px 1px #80808069
}

/*----------- END tab stylings ------------*/

.OverDueIndicator{
    text-align: center;
    font-style: italic;
    color: silver;
    font-size: 11px;
    border-top: 1px solid silver;
}

.OnDemandInspType{
	font-size: 10px;
    font-weight: bold;
    border: 1px solid black;
    padding: 0px 3px 0px 3px;
    border-radius: 4px;
    background-color: white;
    box-shadow: 2px 2px 6px 0px grey;
	margin-left: 3px;
}
.ScheduleComments{
    margin: 3px 0px 3px 0px;
    border: 1px solid black;
    box-sizing: border-box;
    color: #000000;
    font-family: monospace;
    background: #ffefb3;
    border-radius: 4px;
    padding: 2px;
    box-shadow: 2px 2px 5px -2px black;
}
.ScheduleComments span{
	font-weight:bold;
	text-decoration:underline;
}
.HotDate {
	background-color: #CCFF66;
	border: 1px solid #006600;
	padding: 0px 1px 0px 1px;
	cursor: pointer;
}
/*-------- debug classes ------------*/
.TMDataGrid_DebugLog_Contents h1{
	font-size:18px;
}
.TMDataGrid_DebugLog_Contents h2{
	font-size:16px;
}
.TMDataGrid_DebugLog_Contents h3{
	font-size:14px;
}
.TMDataGrid_DebugLog_Contents div{
}
.TMDataGrid_DebugLog{
	height: 50%; 
	border: 1px solid black; 
	position: fixed; 
	bottom: 0px; 
	left: 0px; 
	width: 50%; 
	background: #ffffffeb; 
	z-index:10; 
	word-wrap: break-word;
}
.TMDataGrid_DebugLog_Shrunk{
	height: 34px; 
	border: 0px; 
	position: fixed; 
	bottom: 10px; 
	left: 0px; 
	width: 100px; 
	background: #ffffffeb; 
	z-index:10; 
	word-wrap: break-word;
}

.TMDataGrid_DebugLog_ControlBar{
	position: absolute;
	top: 0px;
	height: 40px;
	left: 0px;
	right: 15px;
}
.TMDataGrid_DebugLog .TMDataGrid_DebugLog_Contents{
	position: absolute;
	top: 40px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	overflow-y: scroll; 
	overflow-x: hidden;
	padding: 3px; 
}

.TMDataGrid_DebugLog_Shrunk .TMDataGrid_DebugLog_Contents{
	display: none;
}

/************Stylings for API Interface results messages ********/
.ExternalRMSResults_Wrapper_Inline, .ExternalRMSResults_Wrapper_Half{
	position: relative;
	width: 400px;
	/*background-color: var(--papayawhip_20percent);*/
	border: 1px solid silver;
    /*border-radius: 8px;*/
    overflow: hidden;	
	box-sizing:border-box;
	box-shadow: 0px 0px 8px gray;
	margin: 10px;
	
}

.ExternalRMSResults_Header{
	/*background-color: var(--papayawhip_25percent); */
    text-align: center;
    /* font-weight: bold; */
    font-style: italic;
    color: gray;
    font-size: 16px;
	border-bottom: 1px solid silver;
	margin-bottom: 5px;
}
.ExternalRMSResults_Body{
	overflow-y: auto;
    bottom: 0px;
    top: 15px;
    width: 100%;	
}
.ExternalRMSResults_Body div{
	margin-left: 0px;
}
/*** urgency levels ***/
.UrgLevel{
	border-radius: 6px;
    border-width: 3px;
    border-style: solid;
    width: 75px;
    height: 18px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
}
/*High occupant Save Stylings*/
.HiOccSave_WarnMsg{
	border-top:1px solid black; 
	border-bottom:1px solid black; 
	background:#FCF; 
	text-align:center; 
	color:#600; 
	font-size:18px; 
	margin-top:5px; 
	font-weight:bold;
}
.HiOccSave_OKMsg{
	border-top:1px solid black; 
	border-bottom:1px solid black; 
	background:#D7FFAE; 
	text-align:center; 
	color: #360; 
	font-size:18px; 
	margin-top:5px; 
	font-weight:bold; 
}
.HiOccSave_Wrapper #HighOccSave_Status{
	margin: 0px auto 5px auto; 
	overflow-y: scroll; 
	height:200px; 
	width:400px; 
	padding:3px; 
	border:1px solid #666;
}
.HiOccSave_Controls{
	text-align:center;
	margin-bottom:5px;
}
/* End High Occupant Save Stylings */

/*Styles for Drag Drop */

.draggableitem {
	display: flex;
	cursor: grab;
	margin-bottom: .5rem;
	user-select: none;
	border-width: 1px;
	border-color: #cbd5e0;
	background-color: #FFFFFF;
	width: 80vw; 
	padding: 5px;
	overflow: hidden;
	align-items: center;
}

.drag-placeholder {
	background-color: #edf2f7;
	border: 2px dashed #cbd5e0;
	margin-bottom: 1rem;
	width: 80vw; 
	padding: 10px;
}
.drag-flexlist {
	display: flex;
	background-color: #FAFAFA;
	justify-content: center;
	align-items: center;
}

/*End Styles for Drag Drop */

/*Styles for Accordian Panels */
.accordion {
	display: flex;
	background-color: #eee;
	color: #444;
	padding: 10px;
	width: 80vw;
	border: none;
	text-align: left;
	outline: none;
	font-size: 15px;
	transition: 0.4s;
	margin-left:auto;
	margin-right:auto;
	align-items: center;
}

.active, .accordion:hover {
	background-color: #ccc;
}

.accordion-panel {
	padding: 0 10px;
	background-color: white;
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}

.accordion-arrowcursor {
	cursor: default;
}

/*End Styles for Accordian Panels */

/*ONLY USED IN COMBINATION WITH EMAILS - IF NOT RELATED TO EMAILS, USE Pointer_Hand instead*/
.dosend {
	cursor: pointer;
}
/*ONLY USED IN COMBINATION WITH EMAILS*/
.dontsend {
	text-decoration: line-through;
	cursor: pointer;
	color: #999999;
}
/*BEGIN TOAST styles - messages that rise up fromt he bottom and then fade away ***/
.toast-container {
    position: fixed;
    bottom: 0px; /* Position it at the bottom */
    left: 50%;
    transform: translateX(-50%) translateY(100%); /* Slide it out of view initially */
    background-color: rgba(0, 0, 0, 0.8);
    color: white;
    padding: 10px;
    opacity: 0;
    visibility: hidden;
    transition: opacity 1.5s ease, transform 1.5s ease; /* Add transform to the transition for sliding effect */
    z-index: 9999;
}

.toast {
    font-size: 18px;
	font-family: arial;
}
/*END TOAST styles*/