/* Quick Fix Classes
------------------------------------------------ */
.autoWidth { width: auto !important; }
.marginAll3 { margin:3px;}
.marginRightLeft2 { margin-right: 2px; margin-left: 2px;}
.marginRight5 { margin-right: 5px; }
.marginRight2 { margin-right: 2px; }
.marginRight0 { margin-right: 0px !important; }
.marginRight20 {margin-right:20px;}
.marginLeft0 { margin-left: 0px !important; }
.marginLeft3 { margin-left: 3px;}
.marginLeft5 { margin-left: 5px; }
.marginRight10 { margin-right: 10px; }
.marginRight12 { margin-right: 12px; } 
.marginLeft10 { margin-left: 10px; }
.marginTop16 { margin-top: 16px; }
.marginTop15 { margin-top:15px;}
.marginBottom15 { margin-bottom:15px;}
.marginTop9 { margin-top: 9px; }
.marginBottom9 { margin-bottom: 9px; }
.marginBottom10 {  margin-bottom: 10px !important; }
.paddingTop2 { padding-top: 2px; }
.paddingTop5 { padding-top: 5px; }
.paddingTop10 { padding-top: 10px; }
.paddingTop250 {padding-top: 250px; }
.paddingBottom10{padding-bottom: 10px;}
.paddingLeft0 { padding-left: 0px !important; }
.paddingLeft5 { padding-left: 5px; }
.paddingLeft10 { padding-left: 10px; }
.paddingLeft15 { padding-left: 15px; }
.paddingLeft16 { padding-left: 16px; }
.paddingLeft20 { padding-left: 20px !important; }
.paddingLeft70 { padding-left: 70px !important; }
.paddingLeft40 {padding-left: 40px; }
.paddingLeft16 { padding-left: 16px; }
.paddingRight16 { padding-left: 16px; }
.paddingRight10 { padding-right: 10px; }
.paddingRight5 { padding-right: 5px; }
.paddingRight0 { padding-right: 0px !important; }
.paddingRight2 { padding-right: 2px; }
.paddingRight140 {padding-right: 140px; }
.paddingRightLeft4 { padding-right: 4px; padding-left: 4px;}
.paddingAll15 {padding: 15px; }
.paddingAll10 {padding: 10px; }
.paddingBottom2 { padding-bottom: 2px; }
.overflowHidden{overflow:hidden;}
.width70{width:70%;}
.clearLeft { clear: left !important; }

/* Visibility
------------------------------------------------ */
.hidden { display: none; }
.invisible { visibility: hidden; }

/* Column and Form Layout
  a grid system, used to create columns for the laying out of content

  3 pieces to the grid system.
  1.  Grid type - default grids, 1, 2, 3 columns or a custom grid
  2.  Columns - if using a default grid will have a default widths, if using custom these widths need to be set using the width classes
  3.  UL form lists - form lists that are contained within the column div or can be used separately.  They contain Labels and Data/Form Inputs
      By default Labels have a default width.  Custom widths can be set here on the labels and divs or inputs using the width classes at the UL level.
*/


/* Part 1 and 2 Grid and Columns */

.column {
  float: left;
  padding: 13px 0px 5px 0px; /* Change to percentages for fluid layout */
}

.columnNoPadding {
  float: left;
  padding: 0px; /* Change to percentages for fluid layout */
}

/* standard 1 column */
.grid-1 div.column { width: 50%; }
.grid-1 { padding-left: 10px;}


/* standard 50/50 2 column layout  */
.grid-2 div.column { width: 50%; }
.grid-2 { padding-left: 10px;}

/* standard 30/30/30 3 column layout */
.grid-3 { padding-left: 10px;}
.grid-3 div.column { width: 31%; }

.grid-any{ padding-left: 25px;}


/* custom widths */
.img-fixtable { max-width: 100%; height: auto; }
.container {
  /* width: 100%; */
  padding-right: 15px;
  padding-left: 15px;
}
.width1440 {
  max-width: 1440px !important;
  margin: auto;
  padding-left: 16px;
  padding-right: 16px;
}
.column-width-100 { width: 100% !important; }
.column-width-99 { width: 99% !important; }
.column-width-95 { width: 95% !important; }
.column-width-90 { width: 90% !important; }
.column-width-85 { width: 85% !important; }
.column-width-75 { width: 75% !important; }
.column-width-70 { width: 70% !important; }
.column-width-67 { width: 67% !important; }
.column-width-60 { width: 60% !important; }
.column-width-55 { width: 54.9% !important; }
.column-width-50 { width: 49.9% !important; }
.column-width-45{ width: 44.9% !important;}
.column-width-43 { width: 43% !important;}
.column-width-40 { width: 40% !important; }
.column-width-34 { width: 34% !important; }
.column-width-32 { width: 32% !important; }
.column-width-31 { width: 31% !important; }
.column-width-30 { width: 30% !important; }
.column-width-29 { width: 29% !important; }
.column-width-28 { width: 28% !important; }
.column-width-25 { width: 25% !important; }
.column-width-24 { width: 24% !important; }
.column-width-23 { width: 23% !important; }
.column-width-20 { width: 20% !important; }
.column-width-15 { width: 15% !important; }
.column-width-13 { width: 13% !important; }
.column-width-11 { width: 11% !important; }
.column-width-10 { width: 10% !important; }
.column-width-8 { width: 8% !important; }
.column-width-5 { width: 5% !important; }
.column-width-3 { width: 3% !important; }


/* Form layout - this is used to layout the labels and data or form inputs within the column layout settings above
------------------------------------------------ */

/* form input sizing */
.tiny { width: 30px !important; }
.xsmall{ width: 60px !important; }
.small { width: 100px !important; }
.medium { width: 155px !important; }
.large { width: 210px !important; }
.mediumLarge { width: 175px !important; }
.veryLarge { width: 310px !important; }
.xlarge { width: 350px !important; }
.xxlarge { width: 450px !important; }
.xxxlarge { width: 550px !important; }
.xxxxlarge { width: 750px !important; }
input.date::-ms-clear { display: none; }

input[type='text'],input[type='password'], select, input[type='textarea'], input[type='date'] {
  padding-left: 5px;
  font-size:  11.5px;
  font-family:  Arial, Helvetica, sans-serif;
  color: #363636;
  border: 1px solid #A8BCCC;
  -moz-box-sizing: border-box;
  background-color: #FFFFFF;
  border-radius: 2px 2px 2px 2px;
  box-shadow: 0 1px 3px #CCCCCC inset;
}
input[type='text']:focus,input[type='password']:focus, select:focus, input[type='textarea']:focus {
  border: 1px solid #6688A4;
}
/* IE hack to get a disabling coloring to work, checkboxes still need some help they don't reset to default when enabled */
input[disabled]{
  background: #F0F0F0;
}
input[type='checkbox'][disabled]{
	background: #FFF;
	background-color: #FFF;
}
input[type='file']{
  font-size:  11.5px;
  font-family:  Arial, Helvetica, sans-serif;
}
input[type='file']::-ms-browse{
  margin-left: 6px;
  border-radius: 2px;
 }
select{
	padding-left: 0px !important;
}

optgroup {
    margin-bottom: 10px;
}

select.collapsibleOptGroupSelect option.collapsibleOptGroup{
  font-weight: bold;
  background-image:url("../../../themes/default/images/details_minus_icon.png");
  background-repeat:no-repeat;
  background-position:5px center, 2px center;
  padding-bottom: 1px;
  padding-left: 20px;
  padding-top: 1px;
}

select.collapsibleOptGroupSelect option.collapsibleOptGroupOption{
  margin-left:20px;
}

input.medium { width: 155px !important; }
input.mediumLarge { width: 185px !important; }

label {
  float: left;
  line-height: 16px;
  padding-right: 6px;
  font-weight: bold;
}

label.labelReset, ul.formList li label.labelReset {
  float: none;
  line-height: 0px;
  padding-right: 0px;
  margin: 0px;
} 

label.labelNotBold {
  font-weight: normal;
}

/* form list - used by most forms and read only data on the site to layout the date in this form - label: data/form input */

ul.formList {
	list-style: none outside none;
	overflow: hidden;
	width: auto;
}

ul.formList li {
	float: left;
	clear: left;
	width: 100%;
	margin-bottom: 7px;
	line-height: 16px;
}

ul.formList li.indent { width: auto; }

ul.formList li label, ul.formList li span.fieldSetSpan {
	float: left;
	width: 135px;
	text-align: right;
	margin-right: 5px;
	line-height: 16px !important;
	font-weight: bold;
}
ul.formList li label.labelNotBold {
  font-weight: normal;
}

ul.formList li label.width-100{
	width: 100% !important;
	float: none;
}

ul.formList li label.NoMarginAndPadding {
	margin-right: 0px;
	padding-right: 0px;
}

ul.formList li span.width-45, ul.formList li span.width-30 , ul.formList li span.width-20, ul.formList li span.width-25,
ul.formList li fieldset.reportFilter legend, ul.formList fieldset.ie-support-ada li legend {
	margin-right: 5px;
	padding-right: 6px;
}

/* Adjacent sibling selector: This will align the label if it is precede by checkbox  */
ul.formList li input[type='checkbox'] + label, ul.formList li input[type='radio'] + label.noBold {
	text-align: left;
}
/* Need to include an adjacent sibling selector with "type='hidden'" because the Spring tag library inserts a hidden input along with checkbox */
ul.formList li input[type='checkbox'] + label.noBold, ul.formList li input[type='checkbox'] + input[type='hidden'] + label.noBold,
ul.formList li input[type='radio'] + label.noBold {
	font-weight: normal;
	width: auto !important;
}
ul.formList.textAlignLeft li input[type='radio'] + label {
	text-align: left;
}
ul.formList li input.noBold[type='radio'] + label, ul.formList li input[type='text'] + label.noBold {
	font-weight: normal;
	width: auto !important;
	margin-right: 0px;
	padding-right: 0px;
}

ul.formList li input,
ul.formList li select,
ul.formList li span,
ul.formList li a { float: left; }

ul.formList li span.noFloat { float: none; }

ul.formList li a { float: left; }

ul.formList li a.link_menu_link{
    color: #000;
}

/* special cases */
--------------------------------------------*/


ul.formList li input.labelCheckbox {
	float: none;
	height: 14px;
	margin: 0 5px 0 0;
	padding: 0;
	vertical-align: bottom;
}
ul.formList li.noGap { margin-bottom: 0px; }
ul.formList li.gap-3 { margin-bottom: 3px; }
ul.formList li.gap-5 { margin-bottom: 5px; }
ul.formList li.gap-7 { margin-bottom: 7px; }
ul.formList li.gap-10 { margin-bottom: 10px; }
ul.formList li.gap-15 { margin-bottom: 15px; }

/* list of checkboxes or a form list of items that don't have a label/field combo */
ul.spanList li span { padding-left: 10px; }
ul.spanList li span.subItem { padding-left: 38px; }

.narrowLabel { width: 135px !important; }

ul.formList li.editLink {
    width: 96%;
}


/* grid_960 styles */
/* grid_# : DEPRECATED - DO NOT USE */
/* grid-# : Use these */
.grid_6 ul.formList { width: 315px; }
.grid_6 ul.formList li label { width: 100px; }
.grid_6 ul.formList li.indent { padding-left: 100px; width: 210px; }
.grid_6 ul.formList li select { max-width: 185px; }

.grid_8 ul.formList {
    width: 440px;
}
.grid_8 ul.formList li.indent {padding-left: 147px; width: 305px;}

.grid_10 ul.formList { width: 440px; }
.grid_10 ul.formList li.indent { padding-left: 135px; width: 305px; }

/*  Part 3 of grid system - Main form list class used for the majority of the forms on the site  */
.grid-1 ul li label { width: 150px; }
.grid-1 ul li.indent { padding-left: 155px; }

.grid-2 ul.formList li label, .grid-2 ul.formList fieldset.ie-support-ada li legend { width: 150px; }
.grid-2 ul.formList li fieldset.ie-support-ada legend label { width: 150px !important; } 
.grid-2 ul.formList fieldset.ie-support-ada li legend.ie-support-ada-empty-format { width: auto; margin-right: 0px; padding-right: 0px; }
.grid-2 ul.formList li.indent { padding-left: 155px; width: 305px; }

.grid-3 ul.formList li.indent { padding-left: 140px; width: 303px; }

/* These are optionally set if the default label width is too short or not long enough, try and keep things proportional */

/* sets the width of the data label */
ul.label-width-1 li label { width: 1% !important; }
ul.label-width-2 li label { width: 2% !important; }
ul.label-width-8 li label { width: 8% !important; }
ul.label-width-10 li label { width: 10% !important; }
ul.label-width-15 li label { width: 15% !important; }
ul.label-width-15 li label { width: 15% !important; }
ul.label-width-18 li label { width: 18% !important; }
ul.label-width-18 li span.width-18 { width: 18% !important; }
ul.label-width-18 fieldset.ie-support-ada li legend, ul.label-width-18 fieldset.ie-support-ada-2 li legend { width: 18% !important; }
ul.label-width-20 li label { width: 20% !important; }
ul.label-width-20 li span.width-20 { width: 20% !important; }
ul.label-width-22 li label { width: 22% !important; }
ul.label-width-23 li label { width: 23% !important; }
ul.label-width-25 li label { width: 25% !important; }
ul.label-width-25 li span.width-25 { width: 25% !important; }
ul.label-width-25 li fieldset.reportFilter legend, ul.label-width-25 fieldset.ie-support-ada li legend { width: 25% !important; }
ul.label-width-28 li label { width: 28% !important; }
ul.label-width-30 li label { width: 30% !important; }
ul.label-width-30 li span.width-30 { width: 30% !important; }
ul.label-width-35 li label { width: 35% !important; }
ul.label-width-35 fieldset.ie-support-ada li legend { width: 35% !important; }
ul.label-width-37 li label { width: 37% !important; }
ul.label-width-38 li label { width: 38% !important; }
ul.label-width-39 li label { width: 39% !important; }
ul.label-width-40 li label { width: 40% !important; }
ul.label-width-44 li label { width: 44% !important; }
ul.label-width-43 li label { width: 43% !important; }
ul.label-width-45 li label:not(.corpAcctLabelPosition) { width: 45% !important; }
ul.label-width-45 li span.width-45 { width: 45% !important; }
ul.label-width-46 li label { width: 46% !important; }
ul.label-width-50 li label { width: 50% !important; }
ul.label-width-57 li label { width: 57% !important; }
ul.label-width-60 li label { width: 60% !important; }
ul.label-width-68 li label { width: 68% !important; }
ul.label-width-70 li label { width: 70% !important; }
ul.label-width-75 li label { width: 75% !important; }
ul.label-width-100 li label { width: 100% !important; }


/* sets the width of the data */
ul.div-width-10 li div { width: 10% !important; }
ul.div-width-15 li div { width: 15% !important; }
ul.div-width-20 li div { width: 20% !important; }
ul.div-width-30 li div { width: 30% !important; }
ul.div-width-40 li div { width: 40% !important; }
ul.div-width-45 li div { width: 45% !important; }
ul.div-width-50 li div { width: 50% !important; }
ul.div-width-60 li div { width: 60% !important; }
ul.div-width-70 li div { width: 70% !important; }


/* word wraps the labels and divs within a form list, you MUST set a width on the div or label to use this correctly (see widths above) */
ul.formList li div.wordwrap,
ul.formList li label.wordwrap {
	word-wrap: break-word;       /* IE 5.5+ */
	display: inline-block;
	zoom:1;                     /* ie 7 - turns hasLayout on for this element*/
	*display: inline;          /*  ie 7 */
	_height: 25;                /* ie 7 */
	white-space: normal !important;  /* ie 7 */

}

ul.formList li div.infoText
{
	word-wrap: break-word;       /* IE 5.5+ */
	zoom:1;                     /* ie 7 - turns hasLayout on for this element*/
	*display: inline;          /*  ie 7 */
	_height: 25;                /* ie 7 */
	white-space: normal !important;  /* ie 7 */

}

ul.formList li.checkbox label {
	width: auto;
	max-width: 90%;
	text-align: left;
	font-weight: normal;
}

ul.formList.indented li label {
	width: auto;
	font-weight: normal;
}
ul.formList li span.paddingRight{
	padding-right: 6px;
}

/* .inline used when you need your labels to layout on the same line without columns  */
ul.formList.inline li {
	float: left;
	width: auto;
	clear: none;
	margin: 0 5px 5px 0;
	line-height: 16px !important;
}

ul.formList.inline li label {
	float: left;
	width: auto;
	margin-right: 5px;
	line-height: 16px !important;
}
ul.formList.inline li div {
    float: left;
    width: auto;
    margin-right: 5px;
    line-height: 16px !important;
}

/*  .labelOnTop used to create the layout which has the label on top of the form field  */
ul.labelOnTop li {
	float: left;
	width: auto;
	display: inline-block;
	clear: none;
	margin-right: 5px;
}

ul.labelOnTop li a {
	float: left;
	padding-top: 16px;
}

ul.labelOnTop li label {
	float: left;
	width: auto !important;
	text-align: left;
	font-weight: bold;
}

ul.labelOnTop li input,
ul.labelOnTop li select {
	float: left;
	clear: left;
}

ul.labelOnTop li textarea {
	float: left;
	clear: left;
}

ul.alternatingRows li:nth-child(odd){
  background: #F1F8FF;
}

ul.alternatingRows li:nth-child(even){
  background: #FFF;
}

ul.alternatingRows li{
        padding-top:5px; padding-left:5px; padding-bottom:5px;
   }

ul.alternatingRows li .firstLine{
       font-weight:bold;
       padding-bottom:5px;
  }
  
ul.alternatingRows li .firstLine.commentText{
       font-weight:normal !important;
       padding-bottom:5px;
}

.commentText{
	display:table-cell;
	white-space: normal;
	}

.commentBody{
  padding-top:10px;
  padding-bottom:10px;
}

.inlineAlert{
	vertical-align:top;
	padding-left:10px;
	padding-right:5px
}

.titledSection {
	width:100%;
	float:left
}

.titledSection h3 {
  background-color:#B9B9B9;
  line-height:24px;
  padding-left:10px;
  margin-bottom:0px
}

/* Update Passwd formatting */

.updatePassword input {
  width: 235px;
}

.updatePassword select {
  width: 245px;
}

.updatePassword input.submitButton {
  width: auto;
}

/* Form input formatting */

label.radio,
li.radio span label,
li.springRadio label {
	font-weight: normal !important;;
	width: auto !important;
}

.checkbox input,
.radio input,
.radio span input {
	float: left;
	/* display: block;
	width: auto !important;*/
	font-weight: normal;
	line-height: 16px;
}

.newAcctLabelPosition {
	padding-left: 174px;
	padding-right: 12px;
	text-align: left;
}

.corpAcctLabelPosition {
	text-align: left !important;
	width: 165px;
}

.hrTempLabelPosition {
	padding-left: 177px;
	padding-right: 12px;
	text-align: left;
}

.replaceCardLabelPosition {
	padding-left: 170px;
	padding-right: 12px;
	text-align: left;
}

.checkboxLabel {
    line-height: 22px;
    padding: 0 5px;
}

.error-input {
  clear: right !important;
  border: 1px solid #b72222 !important;
}

form input.hidden {
  display: none;
}

input.secret{
  background-color: transparent;
  border: medium none;
  box-shadow: none;
  font-size: 11px;
}

ul#searchby {
	margin: 10px;
}

ul#searchby li {
	display: inline;
	float: left;
	height: 1em;
	width: auto;
}

ul#searchby label {
	display: inline;
	position: relative;
	top: 2px;
	margin-right: 5px;
	margin-bottom: 0px
}

.radiobuttons input {
	float: left;
	min-width: 0;
}

.checkbox input { min-width: 0; }

textarea { resize: none;}

/*   form element separator lines, vertical and horizontal */
ul.formList li.horizontal-separator{
	width:100%;
	float:left;
	display: block;
	margin-bottom: 5px;

}
ul.formList li.horizontal-separator hr{
	background-color: #cfcfcf;
	color: #cfcfcf;
	margin: 5px auto 5px auto;
	width: 92%;
}

div.horizontal-radio-separator hr{
	background-color: #cfcfcf;
	color: #cfcfcf;
	margin: 8px 0 5px 2px;
    width: 82%
}
.horizontal-title-separator h2{
	margin-left: 20px;
	margin-bottom: 3px;
}
.horizontal-title-separator hr{
	margin: 0px 15px 5px 20px;
	background-color: #cfcfcf;
	width: 92%;
	display: block;
	float: left;
}

.bottom-horizontal-row-separator {
	border-bottom: 1px solid #ccc;
}

.top-horizontal-row-separator {
	border-top: 1px solid #ccc;
}

.vertical-column-separator{
  border-right: 1px solid #ccc;
}

.vertical-column-separator-left{
  border-left: 1px solid #ccc;
}
ul.vertical-column-separator-left{
  padding-left: 15px;
}
/* messageBox styles
------------------------------------------------ */
.messageBox,  .ui-dialog .ui-dialog-content .messageBox  {
  border: 1px solid #B9B9B9;
  border-radius: 8px;
  margin-bottom: 5px;
  overflow:hidden;
  padding:8px;
  background-position: 8px 8px !important;
  background-repeat: no-repeat !important;
  min-height: 30px;
}
.messageBox.smallBox {
	min-height: 0px;
	background-position: 8px 6px !important;
}
.messageBox.smallBox .content {
	margin-bottom: 0;
}
.infoBox {
  background-image:url("../../../themes/default/images/icons/info.png") !important;
}
.infoBox.smallBox {
	background-image:url("../../../themes/default/images/icons/info_icon_small.png") !important;
}
.successBox {
  background-image:url("../../../themes/default/images/icons/success.png") !important;
}

.errorBox {
  background-image:url("../../../themes/default/images/icons/error.png") !important;
}
.warningBox {
	background-image:url("../../../themes/default/images/icons/warning.png") !important;
}
.warningBoxSmall {
  background-image:url("../../../themes/default/images/icons/small_alert_warning.png") !important;
  background-repeat: no-repeat  !important;
  padding-left: 20px  !important;
}
.messageBox .closeContent {
  float: right;
  display: inline;
}

.messageBox .content {
  margin-right: 26px;
  margin-left: 38px;
  font-weight: bold;
}

div.portlet-wrapper div.messageBox > div.content {
  box-shadow: 0px 0px 0px #000000;
  border-width: 0px;
}

.closeButton:hover {
  cursor: pointer;
}

/* Within a dialog, the dialog's border should be the messageBox's border. */
.ui-dialog .messageBox {
  border-radius: 0px;
  border-top: 0px;
  border-right: 0px;
  border-left: 0px;
  margin: 8px 8px 0;
}

.ui-dialog .messageBox .content {
  font-weight: bold;
}

/* Spring supplied info/error boxes
------------------------------------------------ */

.normal-text { font-weight: normal !important; }

.error-text {
  float: none;
  display: block;
  /*Need to add style from Validator.js*/

}
ul li label.error-text{
	width: 100% !important;

}
div.errorTextContainer {
	background: #FFFFFF url(../images/icons/error.png) no-repeat 10px 12px;
	min-height: 47px;
	margin: 8px 8px 8px 8px;
	padding: 0 5px 0 50px;
	border: 1px solid #B9B9B9;
	border-radius: 8px;
    -moz-border-radius: 8px;
}

ul.errorText, div.errorText {
	margin: 10px 0 10px 0;
	font-weight: bold;
	/* padding-left: 49px;
	color: #D4001A;
	font-weight: bold; */
}

div.errorText span { display: block; }

div.errorList {
  max-height: 280px !important;
  overflow: auto;
}

.messageField {
	background-color: #FAF6AF !important;
}

/* Buttons
------------------------------------------------ */

/* Used with startHidden="true" to hide a buttonList.
   Removed by Works.js.  Using .hidden would risk
   showing buttons hidden for other reasons. */
.buttonListStartHidden { display: none; }

ul.button {
	height: 22px;
	margin: 10px 0px 0 10px;
}

ul.button.bottomMargin { margin-bottom: 10px; }

li.indent ul.button,
ul.formList ul.button { margin: 0; }

ul.button li.button {
	float: left;
	display: inline;
	margin-right: 5px;
	border: 1px solid #898989;
	width: auto;
	clear: none;
	-webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}

.overrideButtonWidth{
	width: 59px !important;
}

ul.button li.button a {
	background: url(../images/button_bg.png) repeat-x scroll 0 0 transparent;
	display: inline;
	float: left;
	line-height: 20px;
	padding: 0 10px;
	margin: 1px;
	color: #FFF;
	text-decoration: none;
	-webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  border-radius: 2px;
}

ul.button li.link a{
  background: none;
  display: block;
  line-height: 16px;
  padding-top: 5px;
  padding-right: 0;
  padding-bottom: 0;
  padding-left: 0;
  margin: 1px;
  color: black;
  text-decoration: default;
  -webkit-border-radius: 0px;
  -moz-border-radius: 0px;
  border-radius: 2px;
}
ul.button li.link{
  clear: none;
  color: black;
  display: inline;
  float: left;
  width: auto;
}
ul.button li.link a.lastLink{
    margin-right: 10px;
}

ul.button li.button a:hover {
	background: url(../images/button_rollover_bg.png) repeat-x scroll 0 0 transparent;
	text-decoration: none;
}

ul.button li.button input, ul.button li.button a {
	background: url(../images/button_bg.png) repeat-x scroll 0 0 transparent;
	float: left;
	width: auto;
	font: 11px Arial, Helvetica, sans-serif; /* 16 x .70 = 11.2px */
    font-weight: bold;
    margin: 1px;
	color: #FFFFFF;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
	border: none;
	-webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
}

.ui-dialog-buttonset .ui-button {
	background: url(../images/button_bg.png) repeat-x scroll 0 0 transparent;
	padding: 2px 9px 1px 9px;
	border: black solid 1px;
	float: left;
	width: auto;
	font: 11px Arial, Helvetica, sans-serif; /* 16 x .70 = 11.2px */
    font-weight: bold;
    margin: 1px;
	color: #FFFFFF;
	cursor: pointer;
	text-decoration: none;
	text-align: center;
   
}

.ui-dialog-buttonset .ui-button .ui-state-hover .ui-icon,
.ui-dialog-buttonset .ui-button .ui-state-focus .ui-icon,
.ui-dialog-buttonset .ui-button .ui-button:hover .ui-icon,
.ui-dialog-buttonset .ui-button .ui-button:focus .ui-icon{
	background: url(../images/button_rollover_bg.png) repeat-x scroll 0 0 transparent;
}

ul.button li.button a {
	padding: 2px 9px;
}

ul.button li.button input{
	padding: 2px 9px 2px;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    /* webkit specific CSS */
    ul.button li.button { height:18px; }
    ul.button li.button a {
	padding: 2px 9px;
	}
}

ul.button li.button a.inactive,
ul.button li.button a.inactive:hover,
ul.button li.button input.inactive,
ul.button li.button input.inactive:hover { background: url(../images/3rdparty/jqueryui_images/ui-bg_diagonals-medium_0_aaaaaa_40x40.png) repeat-x scroll 0 0 transparent; }

ul.button li.button input[disabled][type='button'],
ul.button li.button input[disabled][type='submit'],
ul.button li.button input[disabled][type='button']:hover,
ul.button li.button a[disabled],
ul.button li.button a[disabled]:hover {
	background:url("../images/3rdparty/jqueryui_images/ui-bg_diagonals-medium_0_aaaaaa_40x40.png") fixed;
	cursor:default;
}

button[disabled] > span.ui-button-text {
	background: url("../images/3rdparty/jqueryui_images/ui-bg_diagonals-medium_0_aaaaaa_40x40.png") fixed;
}

.ui-dialog-buttonset .ui-button[disabled]{
	background: url("../images/3rdparty/jqueryui_images/ui-bg_diagonals-medium_0_aaaaaa_40x40.png") fixed;
	cursor: default;
}

ul.button li.button input:hover { background: url(../images/button_rollover_bg.png) repeat-x scroll 0 0 transparent; }

button.ui-button:hover { background: url(../images/button_rollover_bg.png) repeat-x scroll 0 0 transparent; }

/*  Work in Progress to create CSS only button - see http://css-tricks.com/examples/ButtonMaker/ */
input.cssButton { border: none; }

.cssButton {
  border: 1px solid #898989;
  border-top: 1px solid #898989;
  background: #304e8b;
  background: -webkit-gradient(linear, left top, left bottom, from(#7899ce), to(#304e8b));
  background: -moz-linear-gradient(top, #7899ce, #304e8b);
  padding: 0px 10px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
  -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
  box-shadow: rgba(0,0,0,1) 0 1px 0;
  text-shadow: rgba(0,0,0,.4) 0 1px 0;
  color: white;
  font-size: 14px;
  font-family: Helvetica, Arial, Sans-Serif;
  text-decoration: none;
  vertical-align: middle;
}
.cssButton:hover {
  border-top-color: #d40019;
  background: #d40019;
  color: #ffffff;
}
.cssButton:active {
  border-top-color: #d40019;
  background: #d40019;
}

/* dialog button*/
.leftButton{
  margin-right: 4px !important;
}

.dialogLink{
	float: left;
    margin: 1em 0.8em 0.5em 0;
	}


.button_separator_bar {
  margin-top: 5px;
  border-bottom: 1px solid #CFCFCF;
  clear: both;
}

/* Text styles
------------------------------------------------ */
.alert, .negativeAmount, input.negativeAmount {
  color: #E31932 !important;
}

fieldset {
  border: 1px solid #234778;
  margin-top: 4px;
  padding: 8px;
}

fieldset.FloatLeft {
  float: left;
  width: 83%;
  border: 3px solid #CFCFCF;
  margin-left: 1%;
}

fieldset.FloatRight {
  float: right;
  width: 83%;
  border: 3px solid #CFCFCF;
  margin-left: 1%;
}

fieldset.reportFilter legend {
  float: left;
}

fieldset.reportFilter legend span {
  width: 100% !important;
  text-align: right;
  line-height: 16px !important;
  font-weight: bold;
}

fieldset.noCSS {
  border: none;
  margin-top: auto;
  padding: inherit
}

fieldset.ie-support-ada, fieldset.ie-support-ada-2 {
  width: 100%;
}
fieldset.ie-support-ada legend {
  float: left;
}
fieldset.ie-support-ada-2 legend {
  float: left;
  padding-left: 10px;
  padding-right: 6px;
}
fieldset.ie-support-ada legend span, fieldset.ie-support-ada legend label {
  width: 100% !important;
  text-align: right
}
fieldset.ie-support-ada-2 legend label {
  width: 100% !important;
}

legend.FloatLeft {
  float: left;
}

.requiredAsterisk{
  color:red;
  float:none !important;
  margin-right: 2px;
}

.buttonConfirmDialog{
  padding-left: 10px;
}

.placeholder{
  color: #999 !important;
}

/* Subportlet table
------------------------------------------------ */

.subportletTable td {
  border-width: 1px;
  border-style: solid;
  border-color: white;
  font-weight: bold;

  vertical-align: middle;
}
.subportletTable td {
  padding: 5px 5px 2px;
}
.subportletTable tr.headerRow td {
  padding: 4px 10px;
}
.subportletTableEdit td{
  padding: 2px 2px;
}
table.subportletTable {
  width: 100%;
}
.subportletTable thead, .subportletTable .headerRow {
  background-color: #A8BCCC;
}

.subportletTable tr.striped {
  background-color: #DDDDDD;
}

.subportletTable thead td {
  text-align: center;
}

.subportletTable td input[type='text'], .subportletTable td select {
  width: 98%;
  padding-left: 3px \0/;
  padding-right: 3px \0/;
  *padding-left: 3px !important;
  *padding-right: 3px !important;
  box-sizing: border-box;
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
/* webkit specific CSS */
  .subportletTable td input[type='text'], .subportletTable td select {
    width: 95%;
  }
}

.subportletTable tr.headerRow td {
  text-align: center;
}

.subportletTable td.valignTop {
  vertical-align: top;
}
/* Dialog
------------------------------------------------ */

.dialogContent {
  margin-top: 8px;
  margin-right: 8px;
  margin-left: 8px;
}
.dialogRightHeader {
	position:absolute;
	right:.3em;
	margin:0 25px 0 0;
	padding:1px;
	height:18px;
}
a.dialogHeaderLink {
	color:#ffffff;
}

/* Pin Tab
------------------------------------------------ */

.pinTabSetEnabled .tabLink .thumbtack {
  background-color: transparent;
  background-image: url("../../../themes/default/images/icons/icon_unpin_tab.png");
  background-repeat: no-repeat;
  border: medium none;
  cursor: default;
  display: block;
  float: left;
  height: 14px;
  margin-top: 7px;
  margin-bottom: 0px;
  margin-left: 3px;
  margin-right: 0px;
  padding: 0;
  width: 0px;
}

.thumbtack {
  background-position: left bottom;
  width: 0;
}

.pinTabSetEnabled .pinnedTab .thumbtack {
  width: 9px;
  cursor: default;
  background-image: url("../../../themes/default/images/icons/icon_pin_tab.png") !important;
}

.pinTabSetEnabled .selected .thumbtack {
  width: 9px;
}

.expandedrow.pinTabSetEnabled .thumbtack {
  margin-top: 4px !important;
}

/* Advanced Filter
------------------------------------------------ */
span.moveButton{
	display:block;
	padding-bottom:11px
}

div.collapsibleCheckboxContainer{
	width:76.5% !important;
	border:solid 1px #CFCFCF;
	float:left;
}

div.hiddenCollapsibleCheckbox{
    border:solid 1px #FFFFFF !important;
}

div.collapsibleCheckboxHeader{
	width:100%;
	background-color:#CFCFCF;
	overflow: hidden;
	border-bottom:solid 1px #CFCFCF
}

div.hiddenCollapsibleCheckbox div.collapsibleCheckboxHeader{
	border-bottom:solid 1px #FFFFFF !important;
	background-color:#FFFFFF;
}

div.collapsibleCheckboxBody{
    width:100%;
    overflow:hidden;
    padding:10px 0px 5px 0px;
}

div.hiddenCollapsibleCheckbox div.collapsibleCheckboxBody{
    border:solid 1px #FFFFFF !important;
}

div.collapsibleCheckboxHeader span.checkboxAreaTitle{
	padding-top: 2px;
}

select.multiSelectWithHeaderFooter, ul.columnListWithHeaderFooter {
  border-radius: 0px 0px 0px 0px;
  border-top: 0 none;
  border-bottom: 0 none;
  width: 260px;
  height: 250px;
}

ul.columnListWithHeaderFooter {
  overflow-y: scroll;
}

select.multiSelectWithHeader {
  border-radius: 0px 0px 2px 2px;
  border-top: 0 none;
  height: 283px;
  width: 260px;
}

.multiSelectHeader {
  background-color: #CFCFCF;
  padding: 5px 0px 5px 9px;
  text-align: left;
  width: 249px;
  font-weight: bold;
}
.multiSelectSecondaryHeader {
  background-color: white;
  padding: 5px 0px 5px 9px;
  text-align: left;
  width: 249px;
  font-weight: bold;
}


.multiSelectHeaderBorder {
    border: 1px solid #A8BCCC;
}
.multiSelectSecondaryHeaderBorder {
  border-bottom: 1px solid #A8BCCC;
  border-left: 1px solid #A8BCCC;
  border-right: 1px solid #A8BCCC;
}

.multiSelectFooter {
  background-color: #CFCFCF;
  padding: 5px;
  text-align: left;
  width: 248px;
  overflow: hidden;
}

.multiSelectFooterBorder {
  border: 1px solid #A8BCCC;
}

.ie7MultiSelectFooterBorder {
  border: 1px solid gray;
}

.multiSelectHeaderFocusBorder {
  border: 1px solid #6688A4;
}

.multiSelectFooterFocusBorder {
  border: 1px solid #6688A4;
}

.multiSelectDivContents {
  background-color: white;
  padding: 5px 0px 5px 9px;
  text-align: left;
  width: 249px;
  border-right: 1px solid #A8BCCC;
  border-left: 1px solid #A8BCCC;
  border-bottom: 1px solid #A8BCCC;
  margin-bottom: 10px;
}
.multiSelectDivContentItem {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.multiSelectSmallWidth{
  width: 160px;
  max-height: 300px;
  overflow-y: auto;
}

.singleColumnTableWidth{
  width: auto;
  max-height: 300px;
  overflow-y: auto;
  min-width: 288px;
}

.partialStringDisplay {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width:100px;
}

.partialLabelDisplay {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  width:150px;
}

div.actinfoDisplay{
  width: 230px;
  max-width: 100%;
  text-align: left;
  font-weight: normal;
  font-size:x-small;
  height: 30px;
  padding: 0px 0px 0px 10px;
}

table.display.noSelectionTable tbody td {
  padding-bottom: 7px;
}

table.display.noColumnFilterTable thead th {
  padding-top: 35px; /* mimics the buffer added to the columns with no filters in a table with column filters*/
}

a.floatNone {
  float:none !important;
}

/* Allocation / General Ledger table cell layout, need to keep these in here instead of allocation.css since the IE css needs to override some of these */

table.editAllocationTable tbody td input, table.editAllocationTable tbody td select {
  width: 98%;
  box-sizing: border-box;
}
@media screen and (-webkit-min-device-pixel-ratio:0) {
  table.editAllocationTable tbody td input, table.editAllocationTable tbody td select {
    width: 93%;
  }
  table.editAllocationTable tbody td input.textright{
    width: 88%;
  }
}
table.editAllocationTable tbody td{
  padding: 2px 2px 2px 2px;
  vertical-align: bottom;
}

table.editAllocationTable tbody td img.pickerImage {
  padding-left: 3px;
}

/* Pickers
------------------------------------------------ */

div.pickerBox .pickerAdvancedSearch {
  margin: 12px 9px;
}

div.pickerBox .pickerAdvancedSearch label {
  float: none;
  font-weight: normal;
  vertical-align: bottom;
}

div.pickerBox .pickerAdvancedSearch label.title {
  float: none;
  font-weight: bold;
}

div.pickerBox .pickerAdvancedSearch input {
  margin-top: 0px;
  margin-bottom: 0px;
  vertical-align: text-top;
}

/*Dropdown styling*/
.linkmenu_dropdown {
  max-height: 100px;
  max-width: 75px;
  overflow-y: scroll;
}

.linkmenu_dropdown li {
  font-size: 11px;
  padding-left: 4px;
  padding-bottom: 1px;
  padding-top: 2px;
  cursor: pointer;
}

.linkmenu_dropdown li:hover {
  background-color: #D4E2EB;
}

.datetime {
  white-space: nowrap;
}

.floatNone{
  float:none !important;
}

.normalFontWeight{
  font-weight:normal !important;
}

.linkbar {
  background-color: #F0F0F0;
  height: 32px;
}

.linkbarBgd {
  background-color: #F0F0F0;
}

.linkbarLink {
  color: #000 !important;
  font-size: 14px;
  top: 8px;
  position: relative;
  text-decoration: none !important;
}

.linkbarWorks {
  color: #000 !important;
  font-size: 14px;
  margin-left: 16px;
  margin-right: 16px;
  top: 8px;
  border-bottom: 2px solid;
  position: relative;
  height: 24px;
  display: inline-block;
}

.goToBofa {
  float: right;
  text-decoration: none !important;
}

.bofaLogo {
  width: 300px;
}

.brandingStripe {
  background-image:url('../images/bofa_pattern4_rgb_blue_extreme_Digital.png') !important;
  background-repeat: repeat-x;
  height: 40px;
  top: 0px;
  flex: 0 0 auto; /* This is needed for the Prepaid header, even though it does not affect the Works header */
}

.brandingStripeWorks {
  color: #FFF;
  top: 10px;
  position: relative;
  font: 20px connections;
}

.loginInfoFlex {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 70px;
}

.endProxy {
  color: #FFF;
  background-color: #C41230;
  padding: 4px;
  text-decoration: none !important;
}

.loginbarRow {
  flex-basis: 25px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.fileViewDialog {
  padding: 10px 10px 0px;
}

#reqAsterisk {
  display:none;
  color:red;
}

.recurrencePaddingLeft {
  padding-left: 80px !important;
}

.previewPlaceholder {
  margin: 100px 0 0 90px;
  text-align: center;
  font-weight: bold;
}

.receiptCanvasImg {
  display: none;
  max-width: 100%;
  max-height: 100%;
}

.receiptCanvasDiv {
  text-align: center;
  display: none;
  width: 100%;
  height: 30px;
  margin: 6px 6px 0 0;
}

#previewImageFileNameLabel {
  float: none !important;
}

div[id*='errorTextContainer'] {
  display: none;
}

#mergeUserLinkUp {
  display: inline;
}

.multiViewHeightBox {
  min-height: 100px !important;
}

.border0px {
  border: 0px;
}

.whspNormal {
  white-space: normal;
}

#combinationSearch {
  width: 100%;
}

#combinationSearchLabel {
  text-overflow: ellipsis;
}

.advMaxFilter{
  padding-left: 3px;
}

#recurrenceDialogLabel {
  padding-left: 80px;
}

.textLeft {
  text-align: left;
}

.textRight {
  text-align: right;
}

.segmentValue {
  width: 100px;
}

.segmentInput {
  text-overflow: ellipsis;
}

.editKeyName {
  margin-left: -2px;
}

#commentGrid {
  padding-left: unset;
}

#commentColumn {
  padding-top: unset;
}

#detailCenter {
  text-align: center;
}

#gpOLRLabel {
  white-space: nowrap;
  text-align: left;
  margin-left: 3px;
}

.gpOSBLabel {
  text-align: left !important;
  margin-left: 18px;
}

.gpMarginLeft {
  margin-left: 3px;
}

.prDialogPadding {
  padding-left: 15px;
}

.userLabelFloat {
  float: none !important;
}

#filterOption {
  padding-left: 11px;
}

#chsWarn {
  padding-left:20px;
  padding-right:5px;
}

.errorExpiryDate {
  color: red;
  padding-bottom: 5px;
}

.glAssistantPicker {
  width: 98% !important;
}

.portlet-content-holder {
  margin-top: 30px;
}
.ui-footerblock-left {
  margin-left: 10px;
}
.portlet-content-body {
  text-align: left;
}
.portlet_container_16 {
  margin-left: auto;
  margin-right: auto;
  width: 400px;
}

thead td{
  background-color: #CFCFCF;
  font-weight: 600;
  font-size: 11px;
  padding: 10px 5px 29px 5px;
  color: #363636;
  text-align:center;
  overflow: hidden;
  vertical-align:bottom;
  cursor: default;
  border: 1px solid white;
}

.docSetLegend{
	width: 25%;
	padding-right: 6px;
	margin-right: 5px;
}

.legendHeader{
	margin-left: 20px;
	margin-bottom: 3px;
	font-weight: bold;
}