a.toplink {
	color: #FFFFFF;
	text-decoration: none;
	font-size: 70%;
	font-weight: bold;
	margin-right: 15px;
}

/* mouse over link */
a.toplink:hover {
	text-decoration: none;
	color: #FFE090
}

a.bottomlink {
	color: #FFFFFF;
	text-decoration: none;
	font-size: 80%;
	font-weight: bold;
	margin-right: 12px;
}

/* mouse over link */
a.bottomlink:hover {
	text-decoration: none;
	color: #FFE090
}

.bottomMenu {
	color: #A6D7F8;
	font-weight: bold;
	font-size: 90%;
}

/* tags <a> placed under a tag that has the class "bottomMenu" */
.bottomMenu a {
	color: #A6D7F8;
	font-weight: bold;
	/*font-size: 90%; doing this makes it look like 90% of the previous 90%! */
	text-decoration: none;
}

/* mouse over link */
.bottomMenu a:hover {
	text-decoration: underline;
}

.actionColumnIconDelete {
	background-image: url("../imgs/delete_icon.png");
	height: 15px !important;
	width: 15px !important;
	margin: 0px !important;
	padding: 0px !important;
}

.actionColumnIconEdit {
	background-image: url("../imgs/edit.gif");
	background-size: 16px 16px;
	background-position: 0px 0px;
	background-repeat: no-repeat;
	height: 16px !important;
	width: 16px !important;
	margin: 0px 4px 0px 0px !important;
	padding: 0px !important;
}

.verticallyCenterContents {
	/*
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	*/
	display: table-cell;
	vertical-align: middle;
}

.msd_subtitle {
	color: #092964;
	font-size: 100%;
	font-weight: bold;
	margin-bottom: 10px;
}

.msd_subtitle_highlight {
	color: #092964;
	font-size: 100%;
	font-weight: bold;
	background-color: #99BCE8;
}

/* add a limit line between the cells of ExtJS grids */
.cellBorder .x-grid-cell:not(.leftSubCol) {
	border: 1px solid #BFBFBF;
}

.leftSubCol {
	border: 1px solid #BFBFBF;
	border-left: 1px dashed black;
}

.waveHeader {
	border-left: 1px dashed black;
}

.clickMe {
	cursor: pointer;
}

/* to turn the text of an ExtJS button bold with CSS */
.boldButton .x-btn-inner {
	font-weight: bold;
}

/* keep cells that contain a tick mark as vertically short as regular text cells */
.thinRows .x-grid-cell-inner {
	padding-top: 2px;
	padding-bottom: 3px;
}

/*
 * Styles that I used to add red stars next to mandatory fields
 *

.requiredFieldLabel label {
   background-image: url(../imgs/red_star.png);
   background-position: 0px 0px;
   background-repeat: no-repeat;
   background-size: 6px 6px;
   padding-left: 10px;
}

.optionalFieldLabel label {
   padding-left: 10px;
}
*/

/* center fields */
.centerField .x-form-item-body {
	text-align: center;
}

/* removes the top borders of a grid if it has the class "noGridTopBorders" */
.noGridTopBorders .x-grid-body, .noGridTopBorders .x-grid-header-ct {
	border-top-width: 0px !important;
}

.boldGreen {
	font-weight: bold;
	color: green;
}

.nodeWithoutIcon {
	display: none;
}

/* to turn a grid's checkboxmodel's checkboxes into radios */
.check2radio .x-grid-row-checker {
	background-image: url(../imgs/radio.gif);
}

/* to hide a grid's checkboxmodel's checkboxes/radios */
.readOnly .x-grid-row-checker {
	background-image: none !important;
}

/* to turn a grid's checkboxmodel's checkboxes into radios
 * (for non-selectable records)
 */
.check2radio .nonSelectable .x-grid-row-checker {
	background-image: url(../imgs/radio.gif);
	background-position: 13px 0px;
}
.nonSelectable {
	color: #CCCCCC;
}

/* to turn a checkcolumn's checkboxes into radios */
.check2radio .x-grid-checkcolumn {
	background-image: url(../imgs/radio.gif);
}

/* style for the VAP grid's rows */
.vapRows {
	height: 24px;
}

/* style for the "Select All"/"Deselect All" button of the VAP grid's RowEditor */
.x-row-editor-tsa-button {
	margin-right: 4px;
}

/* add class "spaceAfter" to a grid's row to add a bottom margin to it */
.spaceAfterRow .x-grid-cell-inner {
	margin-bottom: 20px;
}

.noPadding .x-grid-cell-inner {
	padding: 0px;
}

TR.lastSection > TD {
	border-bottom: 1px solid black;
}

TR.grayed TD:not(.titleColGray), TD.grayed {
	background-color: lightgray !important;
}

.titleColGray {
	background-color: #EEEEEE !important;
	border-color: #D0D0D0;
}

.titleColGray .x-grid-cell-inner {
	background-color: transparent;
}

/**
 * For testing purposes: border the column headers that have custom IDs
 * .x-column-header[id^="vd."] {
 * 	border: 3px solid green;
 * }
 */