/* These widths override the FSA Standard page width because the full page maps need it.
/* ************************************************************************************* */
.bodyContainer {
	width: 800px;
}

.logoheader {
	width: 800px;
	margin-bottom: -2px;
}

.leftNavColumn {
	width: 163px;
	margin-right:0;
}

.content {
	width: 604px;
}

#usdalogo {
	margin-left: 1px;
}

#topNavBar {
	margin-top: 5px;
}

.logoright {
	background-color: #93bdcc;
}

/* Override FSA_standards.css left navigation colors to provide contrast required for Section 508 */

div.leftNavRow {
	color: #1c2a43; /* S508 update */
}

div.leftNavRow a {
	color: #1c2a43; /* S508 update */
}

div.leftNavRow a:focus {
	color: #1c2a43; /* S508 update */
	font-weight:bold;
}

.leftNavHeader {
	border-bottom: 0.1em solid #000000;
}

/* Override eGove_Blue because it is trying to make yellow links */
p:hover a
{
	color: #000099;
}
p a:hover 
{  color: #ff0000;
}

/* Override FSA Standard to not underline links in menu */
div.leftNavSubTitle a {
	text-decoration: none;
}

div.leftNavRow a {
	text-decoration: none;
}

/* Override FSA_standards.css to allow the page to be shorter */
div.centerContent { 
	min-height: 15em; 
}

/* Pull error message block back to left edge to leave room for icons */
#errorMsgBlock {
	margin-left: 0;
	margin-bottom: 1em;
	min-height: 1em;
}

/* Fix so there is padding between error icon and text */
#errorMsgBlock div {
	padding-left: 2em;
}

/* Correcting an error in FSA_Standards.css */
#warnMsgBlock {
	margin-left: 0;
	margin-bottom: 1em;
	min-height: 1em;
}

/* Correcting an error in FSA_Standards.css */
#warnMsgBlock div {
	color: black;
	padding-left: 2em;
}

.errorText {
	color:	#e00000;
}

/* Override FSA_Standards to balance right margin with left margin */
.backToTop {
	width: 11%;
}

/* Allows alignment of text with the radio button */
.radioButtonText {
	vertical-align: 15%;
}

/* Allows alignment of text with the checkbox */
.checkboxText {
	vertical-align: 15%;
}

div.footertext {
	margin-top: 9px;
	padding-left: 0px;
	padding-bottom: 3px;
}

div.footercorner {
	float: left;
	border-top: 0px solid #93bdcc;
	border-right: 20px solid transparent;
	border-bottom: 21px solid #93bdcc;
	border-left: 0px solid transparent; 
}

/* ************************************************ */
/* Styles that are used in the new table-less pages */
/* ************************************************ */
div.leftNavSubRow a {
	padding: 0.25em 0.25em 0.25em 1.5em;
	font-weight: bold;
	color: #1c2a43; /* S508 update */
	font-size: 0.97em;
	vertical-align:middle;
	text-decoration: none;
}

div.leftNavSubRow a:focus {
	font-weight: bold;
}

/* Position the max/min container toggle - applies to all divs */
div .containerToggle {
	color: white; 
	font-weight: bold; 
	position: absolute; 
	top:-11px;
	right:5px; 
	background-color: transparent;
	text-decoration:none;
}


div.inputContainer {
	background-color: #e5e5e5;
	border: 1px solid #000000;
	padding: 0.65em 1px 0.65em 0;
	position: relative;
}

div.inputContainer .containerTitle {
	position: absolute;
	top:-0.7em;
	left: 0.4em;
	padding: 2px 5px 3px 5px;
	background-color: #006699;
	color: white;
	font-weight: bold;
}

div.inputContainer p {
	clear: both;
	padding: 0.25em 0 0.25em 0;
}

div.inputContainer p:after {
	content: "";
	display: block;
	clear: both;
}

div.inputContainer label {
	width: 14em;
	float: left;
	text-align: right;
	margin: 0.2em 4px 0 0;
}

div.inputContainer label.label8 {
	width: 7.6%;
	float: left;
	text-align: right;
	margin: 0.2em 4px 0 0;
}

div.inputContainer label.label16 {
	width: 15.9%;
	float: left;
	text-align: right;
	margin: 0.2em 4px 0 0;
}

div.inputContainer label.label25 {
	width: 24.2%;
	float: left;
	text-align: right;
	margin: 0.2em 4px 0 0;
}

div.inputContainer label.label33 {
	width: 32.6%;
	float: left;
	text-align: right;
	margin: 0.2em 4px 0 0;
}

div.inputContainer label.label50 {
	width: 49.2%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.inputContainer label.label58 {
	width: 57%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.inputContainer label.noLabel {
	display: none;
}

div.inputContainer label.checkboxlabel {
	width: auto;
}

div.inputContainer span.label {
	width: 14em;
	float: left;
	text-align: right;
	margin: 0.2em 4px 0 0;
}

div.inputContainer span.value {
	width: auto;
	max-width: 28em;
	float: left;
	text-align: left;
	margin-top: 0.2em;
}

div.inputContainer span.label16 {
	width: 15.9%;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.inputContainer span.value25 {
	width: 24.2%;
	float: left;
	text-align: left;
	margin-right: 0.8%;
}

div.inputContainer label.immediate {
	width: auto;
	float: left;
	text-align: right;
	margin: 0.2em 4px 0 1em;
}

div.inputContainer span.immediateSmall {
	width: auto;
	position: absolute;
	font-size: 0.8em;
	margin-left: 0.5em;
}

div.inputContainer label.phone {
	width: auto;
	float: left;
	text-align: left;
	margin: 0.2em 4px 0 1em;
}

div.inputContainer input,div.inputContainer select, div.inputContainer textarea {
	float: left;
	max-width: 28em;
}

div.inputContainer td input,div.inputContainer td select, div.inputContainer td textarea {
	float: none; /* Reset float if we are in a table cell */
}

div.inputContainer select {
	padding: 1px 0px 1px 0px;
}

div.inputContainer input.input25,div.inputContainer select.input25, div.inputContainer textarea.input25 {
	width: 24.2%;
	float: left;
	max-width: 28em;
}

div.inputContainer hr {
	margin-top:0.5em;
	margin-bottom:0.5em;
}

div.inputContainer .phoneLabel {
	width:auto;
	float: left;
	text-align: left;
	margin-top: .2em;
	margin-bottom: .4em;
	display: none;
}

div.inputContainer .radioLabel {
	width:auto;
	float: left;
	text-align: left;
	margin-top: .2em;
	margin-bottom: .4em;
}

div.inputContainer .subtitle {
	font-style: normal;
	font-weight: bold;
}

div.inputContainer input.noFloatButton {
	float: none;
	margin-left: 10px;
	position: relative;
	top: -2px;
}

/* The displayContainer div is used to display label/value pairs in a container on the page. */

div.displayContainer {
	background-color: #e5e5e5;
	border: 1px solid #000000;
	padding: 0.65em 2px 0.65em 2px;
	position: relative;
}

div.displayContainer .containerTitle {
	position: absolute;
	top:-0.7em;
	left: 0.4em;
	padding: 2px 5px 3px 5px;
	background-color: #006699;
	color: white;
	font-weight: bold;
}

div.displayContainer .subtitle {
	font-style: normal;
	font-weight: bold;
	text-decoration: underline
}

div.displayContainer p {
	clear: both;
	padding: 0.1em 0 0.1em 0;
}

div.displayContainer p::after {
	content: "";
	display: block;
	clear: both;
}

div.displayContainer span.label {
	width: 14em;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.displayContainer span.value {
	width: auto;
	float: left;
	text-align: left;
	margin-right: 4px;	
	max-width: 28em;
}

div.displayContainer span.label8 {
	width: 7.6%;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.displayContainer span.value8 {
	width: 7.6%;
	float: left;
	text-align: left;
	margin-right: 0.8%;
}

div.displayContainer span.value8r {
	width: 7.6%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.label16 {
	width: 15.9%;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.displayContainer span.value16 {
	width: 15.9%;
	float: left;
	text-align: left;
	margin-right: 0.8%;
}

div.displayContainer span.value16r {
	width: 15.9%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.label25 {
	width: 24.2%;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.displayContainer span.value25 {
	width: 24.2%;
	float: left;
	text-align: left;
	margin-right: 0.8%;
}

div.displayContainer span.value25r {
	width: 24.2%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.label33 {
	width: 32.6%;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.displayContainer span.value33 {
	width: 32.6%;
	float: left;
	text-align: left;
	margin-right: 0.8%;
}

div.displayContainer span.value33r {
	width: 32.6%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.label50 {
	width: 49.2%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.label58 {
	width: 57%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.label66 {
	width: 65%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.value66 {
	width: 65%;
	float: left;
	text-align: left;
	margin-right: 0.8%;
}

div.displayContainer span.label75 {
	width: 74%;
	float: left;
	text-align: right;
	margin-right: 0.8%;
}

div.displayContainer span.value75 {
	width: 74%;
	float: left;
	text-align: left;
	margin-right: 0.8%;
}

div.buttonRow {
	margin-top: 1em;
	margin-left: 14em;
}

div.buttonRow25 {
	margin-top: 1em; 
	margin-left: 25.4%;
}

div.buttonRow33 {
	margin-top: 1em;
	margin-left: 33.4%;
}

div.buttonRowLeft {
	margin-top: 1em;
}

div.displayContainer ul {
	margin-bottom:0;
}

/* The displayContainerNoBorder div is used to display label/value pairs in a container on the page. This div has no
   borders and occupies the full page width */

div.displayContainerNoBorder {
	background-color: white;
	width: 100%;
	border: none;
	padding: 0.65em 0 0.65em 0;
}

div.displayContainerNoBorder p {
	clear: both;
	padding: 0.1em 0 0.1em 0;
}

div.displayContainerNoBorder p::after {
	content: "";
	display: block;
	clear: both;
}

div.displayContainerNoBorder span.containerTitle {
	font-weight: bold;
}

div.displayContainerNoBorder span.label {
	width: 14em;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.displayContainerNoBorder span.value {
	width: auto;
	float: left;
	text-align: left;
	margin-right: 4px;	
}

/* The displayContainerNoBorder50 div is used to display label/value pairs in a container on the page. This div has no
   borders, and occupies only half the page width, so you can float two of them side by side. */

div.displayContainerNoBorder50 {
	background-color: white;
	width: 50%;
	border: none;
	padding: 0.65em 0 0.65em 0;
	float: left;
}

div.displayContainerNoBorder50 p {
	clear: both;
	padding: 0.1em 0 0.1em 0;
}

div.displayContainerNoBorder50 p::after {
	content: "";
	display: block;
	clear: both;
}
div.displayContainerNoBorder50 span.containerTitle {
	font-weight: bold;
}

div.displayContainerNoBorder50 span.label {
	width: 12em;
	float: left;
	text-align: right;
	margin-right: 4px;	
}

div.displayContainerNoBorder50 span.value {
	width: auto;
	float: left;
	text-align: left;
	margin-right: 4px;	
}

.center {
	text-align: center;
}

.bold {
	font-weight:bold;
}

/* This is for a multi-line text box where you want to preserve the spacing */
.multilineText {
	word-break: break-word;
	word-wrap: break-word; /* here for IE */
	white-space: pre-wrap;
}

/* This is for a single line of text where the user may have entered a very long string that needs to wrap */
.wrappedText  {
	word-break: break-word;
	word-wrap: break-word; /* here for IE */
}

#requiredFields {
	font-size: 85%;
	margin-bottom: 1.5em;
	color: #e00000;
}

#requiredFields:before {
	content: "* Indicates a Required Field";
}

.requiredFormFieldIndicator {
	color: #d00000;
}

.requiredFormFieldIndicatorInTable {
	color: #ffd0d0;
}

.redText {
	color: #e00000;
}

.readonly {
	font-weight: bold;
}

.clear {
	clear: both;
}

div.instructions {
	margin-bottom: 1.5em;
	font-style: italic;
	font-size: 85%;
}

.attention {
	color: #e00000;
	border: 1px solid #e00000;
	margin: 1em 0em 1em 0em; 
	padding: 4px;
}

button.imageButton {
	border:none;
	background:transparent;
}

div.paging {
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	text-align: right;
	font-size: 85%;
}

/* Used to put an indicator after a field that has invalid content (used by cops:errorFlag custom tag) */
.errorFlag {
	float: left;
	color: #d00000;
	margin: 0.2em 0 0 4px;
}

/* Used to put an indicator after a field that has invalid content in a table cell(used by cops:errorFlag custom tag) */
.errorFlagRight {
	float: none;
	color: #d00000;
	margin: 0 4px 0 0;
}

/* Used to put a red border around an input box that has invalid content */
.errorTextBox {
    border: 1px solid #e00000;
}

#infoMsgBlock {
	border: 0.125em solid #0000ff;
	background-color: #dfefff;
	margin-bottom: 1em;
	margin-left: 0;
	padding: 0.375em;
	width: 80%;
}

#infoMsgBlock div {
	background-image: url(../images/info.png);
	background-repeat: no-repeat;
	background-position: left center;
	padding-top: 0.313em;
	margin-bottom: 0.188em;
	font-weight: bold;
	font-size: 0.8em;
	color: black;
	vertical-align: bottom;
	padding-left: 2em;
}

.successMsg {
    float: left;
    color: black;
    vertical-align: top;
    width: 98%;
    border-style: solid;
    border-color:  #3CB371;
    padding:  4px;	
}

.successMsg::before {
    content: "\2714";
    float: left;
    color: #3CB371;
    font-size: 150%;
    vertical-align: top;
    width: 5%;
}

table.bale_info {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}

table.bale_info th {
	border: 1px solid gray;
	font-weight: normal;
	padding: 2px 2px 2px 2px; 
}

table.bale_info tr {
	background-color: white;
}

table.bale_info td {
	border: 1px solid gray;
	padding: 2px 2px 2px 2px;
	text-align: center;
}

table.bale_info caption {
	font-size: 125%;
	text-align: left;
	margin-bottom: 0.3em;
}

table.bale_info td.right {
	text-align:right;	
}

table.cops_standard_fixed {
	width: 100%;
	table-layout: fixed;
	border-collapse: collapse;
}

table.cops_standard_fixed th {
	border: 1px solid gray;
	text-align: center;
	background-color: #006699;
	color: white;
	font-weight: bold;
}

table.cops_standard_fixed tr {
	background-color: white;
}

table.cops_standard_fixed td {
	border: 1px solid gray;
	padding: 2px 2px 2px 2px; 
}

table.cops_standard_fixed caption {
	font-size: 125%;
	text-align: left;
	margin-bottom: 0.3em;
}

table.cops_standard_fixed input.checkboxClass {
	vertical-align: middle;
}

table.cops_standard {
	border-collapse: collapse;
}

table.cops_standard th {
	border: 1px solid gray;
	text-align: center;
	background-color: #006699;
	color: white;
	font-weight: bold;
}

table.cops_standard th.tableTotals {
	text-align: right;
	font-weight: bold;
	color: black;
	background-color: white;
}

table.cops_standard tr {
	background-color: white;
}

table.cops_standard td {
	border: 1px solid gray;
	padding: 2px 2px 2px 2px; 
}

table.cops_standard caption {
	font-size: 125%;
	text-align: left;
	margin-bottom: 0.3em;
}

table.cops_standard input.checkboxClass {
	vertical-align: middle;
}

table.cops_standard#alternateBackgroundColor {
	background-color: #e5e5e5;
}

/* Use cops_standard when possible.  cops_large is for tables that need just a little extra help fitting within the screen real estate using a slightly diminished font-size.
   Make every effort to reduce the number of table columns before using this style. */
table.cops_large {
	font-size: 0.9em;
	border-collapse: collapse;
}

table.cops_large th {
	border: 1px solid gray;
	text-align: center;
	background-color: #006699;
	color: white;
	font-weight: bold;
}

table.cops_large td {
	border: 1px solid gray;
}

table.cops_large caption {
	font-size: 120%;
	text-align: left;
	margin-bottom: 0.3em;
}

table.cops_large input.checkboxClass {
	vertical-align: middle;
}

div.menuItem {
	margin-bottom: 0.5em;
	margin-left: 2em;
}

/* Used by the PageTemplate for a border on full screen width pages */
div.mainContentFullscreen {
	margin: 0.625em;
}

/* Used by the PageTemplate to display the current time */

span.currentTime {
	float: right;
	font-size: 0.8em;
	margin-top: 0.1em;
}

textarea {
   font-size: inherit;
   font-family: Arial, Tahoma, sans-serif;
   font-weight: inherit;
}


/* ************************************************************************************* */
/* other styles that need to be reviewed */
/* ************************************************************************************* */

#header {	border-style: solid;
			border-width: 0.1px;
			width: 100%; }

#header h1 {font-family: sans-serif;
			font-size: 200%;
			padding-left: 1ex; }

#nav ul {	font-family: sans-serif;
			font-size: x-small;
			list-style: none outside; }

table.standard th,
table.standard td {
			text-align: left;
			vertical-align: top; }

table.standard caption,
div.standard span.caption {
			font-weight: bold;
			text-align: left;
			text-decoration: underline; }

div.nfcColumn {
			float: left;
			margin-left: 0.4em;
			margin-bottom: 1em; }

	        
div.column {
			float: left;
/*			margin-left: 1em;   */
/*			margin-bottom: 1em; */
}

h2.pageTitle {
			font-family: sans-serif;
			font-size: small;
			padding-left: 1em;
			margin-bottom: 10px;
			border-style: solid;
			border-width: thin;
			width: 100%; }

h2.requestTitle {
			font-family: sans-serif;
			font-size: small;
			padding-left: 1em;
			margin-bottom: 0px;
			border-style: solid;
			border-width: thin;
			width: 100%; }

h3.subtitle {
			font-family: sans-serif;
			font-size: small;
			padding-left: 1em;
			border-style: solid;
			border-width: thin;
			width: 100%; }

a.skip {	display: none; }

.messageBlockContainer {
    height: 25px;
    padding-top: 10px;
}

.validationError {
    color: #d00000;
    font-size: 13px;
    /*background:url('../../images/error.png') no-repeat top left;*/
    /*height: 15px;*/
}

.wheel {
    position: relative;
    color: #006699;
	width: 50px;
	height: 50px;
	margin: 0 250px;
	float: left;
	border-radius: 10px;
}

SPAN.textbox {
    background-color: #FFF;
    color: #444;
    line-height:20px;
    height:20px;
    padding:3px;
    border:1px #444 solid;
    font-size:10pt;
}

SPAN.textbox INPUT {
    border: 0px;
    background-color: #FFF;
}

.hovertext {
	position: relative;
    text-decoration: underline;
}

.hovertext:before {
  content: attr(data-hover);
  visibility: hidden;
  opacity: 0;
  width: max-content;
  background-color: #fff;
  color: #000;
  text-align: center;
  border-radius: 10px;
  padding: 5px 5px;
  border:2px solid #ccc;

  position: absolute;
  z-index: 1;
  left: 0;
  top: 110%;
}

.hovertext:hover:before {
  opacity: 1;
  visibility: visible;
}


