/* cmsms stylesheet: markui2 - grids modified: 09/07/21 16:34:17 */
/* ==== grids.css; Layout Grids and supporting classes. ==== */

/* ==== Grid cell size classes, push & pull for desktop devices ==== */
.grid > .row > .cell.size1, .gridTable > .row > .cell.size1 { width: 5%; }
.grid > .row > .cell.size2, .gridTable > .row > .cell.size2 { width: 10%; }
.grid > .row > .cell.size3, .gridTable > .row > .cell.size3 { width: 15%; }
.grid > .row > .cell.size4, .gridTable > .row > .cell.size4 { width: 20%; }
.grid > .row > .cell.size5, .gridTable > .row > .cell.size5 { width: 25%; }
.grid > .row > .cell.size6, .gridTable > .row > .cell.size6 { width: 30%; }
.grid > .row > .cell.size7, .gridTable > .row > .cell.size7 { width: 35%; }
.grid > .row > .cell.size8, .gridTable > .row > .cell.size8 { width: 40%; }
.grid > .row > .cell.size9, .gridTable > .row > .cell.size9 { width: 45%; }
.grid > .row > .cell.size10, .gridTable > .row > .cell.size10 { width: 50%; }
.grid > .row > .cell.size11, .gridTable > .row > .cell.size11 { width: 55%; }
.grid > .row > .cell.size12, .gridTable > .row > .cell.size12 { width: 60%; }
.grid > .row > .cell.size13, .gridTable > .row > .cell.size13 { width: 65%; }
.grid > .row > .cell.size14, .gridTable > .row > .cell.size14 { width: 70%; }
.grid > .row > .cell.size15, .gridTable > .row > .cell.size15 { width: 75%; }
.grid > .row > .cell.size16, .gridTable > .row > .cell.size16 { width: 80%; }
.grid > .row > .cell.size17, .gridTable > .row > .cell.size17 { width: 85%; }
.grid > .row > .cell.size18, .gridTable > .row > .cell.size18 { width: 90%; }
.grid > .row > .cell.size19, .gridTable > .row > .cell.size19 { width: 95%; }
.grid > .row > .cell.sizeWhole,
.gridTable > .row > .cell.sizeWhole { float: none !important; width: 100%; clear: both; }
/* Sized float cell push classes (.ltr and .rtl classes (text directional classes) from common.css) */
.ltr .grid > .row > .cell.push1, .ltr.grid > .row > .cell.push1 { left: 5%; }
.rtl .grid > .row > .cell.push1, .rtl.grid > .row > .cell.push1 { right: 5%; }
.ltr .grid > .row > .cell.push2, .ltr.grid > .row > .cell.push2 { left: 10%; }
.rtl .grid > .row > .cell.push2, .rtl.grid > .row > .cell.push2 { right: 10%; }
.ltr .grid > .row > .cell.push3, .ltr.grid > .row > .cell.push3 { left: 15%; }
.rtl .grid > .row > .cell.push3, .rtl.grid > .row > .cell.push3 { right: 15%; }
.ltr .grid > .row > .cell.push4, .ltr.grid > .row > .cell.push4 { left: 20%; }
.rtl .grid > .row > .cell.push4, .rtl.grid > .row > .cell.push4 { right: 20%; }
.ltr .grid > .row > .cell.push5, .ltr.grid > .row > .cell.push5 { left: 25%; }
.rtl .grid > .row > .cell.push5, .rtl.grid > .row > .cell.push5 { right: 25%; }
.ltr .grid > .row > .cell.push6, .ltr.grid > .row > .cell.push6 { left: 30%; }
.rtl .grid > .row > .cell.push6, .rtl.grid > .row > .cell.push6 { right: 30%; }
.ltr .grid > .row > .cell.push7, .ltr.grid > .row > .cell.push7 { left: 35%; }
.rtl .grid > .row > .cell.push7, .rtl.grid > .row > .cell.push7 { right: 35%; }
.ltr .grid > .row > .cell.push8, .ltr.grid > .row > .cell.push8 { left: 40%; }
.rtl .grid > .row > .cell.push8, .rtl.grid > .row > .cell.push8 { right: 40%; }
.ltr .grid > .row > .cell.push9, .ltr.grid > .row > .cell.push9 { left: 45%; }
.rtl .grid > .row > .cell.push9, .rtl.grid > .row > .cell.push9 { right: 45%; }
.ltr .grid > .row > .cell.push10, .ltr.grid > .row > .cell.push10 { left: 50%; }
.rtl .grid > .row > .cell.push10, .rtl.grid > .row > .cell.push10 { right: 50%; }
.ltr .grid > .row > .cell.push11, .ltr.grid > .row > .cell.push11 { left: 55%; }
.rtl .grid > .row > .cell.push11, .rtl.grid > .row > .cell.push11 { right: 55%; }
.ltr .grid > .row > .cell.push12, .ltr.grid > .row > .cell.push12 { left: 60%; }
.rtl .grid > .row > .cell.push12, .rtl.grid > .row > .cell.push12 { right: 60%; }
.ltr .grid > .row > .cell.push13, .ltr.grid > .row > .cell.push13 { left: 65%; }
.rtl .grid > .row > .cell.push13, .rtl.grid > .row > .cell.push13 { right: 65%; }
.ltr .grid > .row > .cell.push14, .ltr.grid > .row > .cell.push14 { left: 70%; }
.rtl .grid > .row > .cell.push14, .rtl.grid > .row > .cell.push14 { right: 70%; }
.ltr .grid > .row > .cell.push15, .ltr.grid > .row > .cell.push15 { left: 75%; }
.rtl .grid > .row > .cell.push15, .rtl.grid > .row > .cell.push15 { right: 75%; }
.ltr .grid > .row > .cell.push16, .ltr.grid > .row > .cell.push16 { left: 80%; }
.rtl .grid > .row > .cell.push16, .rtl.grid > .row > .cell.push16 { right: 80%; }
.ltr .grid > .row > .cell.push17, .ltr.grid > .row > .cell.push17 { left: 85%; }
.rtl .grid > .row > .cell.push17, .rtl.grid > .row > .cell.push17 { right: 85%; }
.ltr .grid > .row > .cell.push18, .ltr.grid > .row > .cell.push18 { left: 90%; }
.rtl .grid > .row > .cell.push18, .rtl.grid > .row > .cell.push18 { right: 90%; }
.ltr .grid > .row > .cell.push19, .ltr.grid > .row > .cell.push19 { left: 95%; }
.rtl .grid > .row > .cell.push19, .rtl.grid > .row > .cell.push19 { right: 95%; }
/* Sized float cell pull classes (.ltr and .rtl classes (text directional classes) from common.css) */
.ltr .grid > .row > .cell.pull1, .ltr.grid > .row > .cell.pull1 { right: 5%; }
.rtl .grid > .row > .cell.pull1, .rtl.grid > .row > .cell.pull1 { left: 5%; }
.ltr .grid > .row > .cell.pull2, .ltr.grid > .row > .cell.pull2 { right: 10%; }
.rtl .grid > .row > .cell.pull2, .rtl.grid > .row > .cell.pull2 { left: 10%; }
.ltr .grid > .row > .cell.pull3, .ltr.grid > .row > .cell.pull3 { right: 15%; }
.rtl .grid > .row > .cell.pull3, .rtl.grid > .row > .cell.pull3 { left: 15%; }
.ltr .grid > .row > .cell.pull4, .ltr.grid > .row > .cell.pull4 { right: 20%; }
.rtl .grid > .row > .cell.pull4, .rtl.grid > .row > .cell.pull4 { left: 20%; }
.ltr .grid > .row > .cell.pull5, .ltr.grid > .row > .cell.pull5 { right: 25%; }
.rtl .grid > .row > .cell.pull5, .rtl.grid > .row > .cell.pull5 { left: 25%; }
.ltr .grid > .row > .cell.pull6, .ltr.grid > .row > .cell.pull6 { right: 30%; }
.rtl .grid > .row > .cell.pull6, .rtl.grid > .row > .cell.pull6 { left: 30%; }
.ltr .grid > .row > .cell.pull7, .ltr.grid > .row > .cell.pull7 { right: 35%; }
.rtl .grid > .row > .cell.pull7, .rtl.grid > .row > .cell.pull7 { left: 35%; }
.ltr .grid > .row > .cell.pull8, .ltr.grid > .row > .cell.pull8 { right: 40%; }
.rtl .grid > .row > .cell.pull8, .rtl.grid > .row > .cell.pull8 { left: 40%; }
.ltr .grid > .row > .cell.pull9, .ltr.grid > .row > .cell.pull9 { right: 45%; }
.rtl .grid > .row > .cell.pull9, .rtl.grid > .row > .cell.pull9 { left: 45%; }
.ltr .grid > .row > .cell.pull10, .ltr.grid > .row > .cell.pull10 { right: 50%; }
.rtl .grid > .row > .cell.pull10, .rtl.grid > .row > .cell.pull10 { left: 50%; }
.ltr .grid > .row > .cell.pull11, .ltr.grid > .row > .cell.pull11 { right: 55%; }
.rtl .grid > .row > .cell.pull11, .rtl.grid > .row > .cell.pull11 { left: 55%; }
.ltr .grid > .row > .cell.pull12, .ltr.grid > .row > .cell.pull12 { right: 60%; }
.rtl .grid > .row > .cell.pull12, .rtl.grid > .row > .cell.pull12 { left: 60%; }
.ltr .grid > .row > .cell.pull13, .ltr.grid > .row > .cell.pull13 { right: 65%; }
.rtl .grid > .row > .cell.pull13, .rtl.grid > .row > .cell.pull13 { left: 65%; }
.ltr .grid > .row > .cell.pull14, .ltr.grid > .row > .cell.pull14 { right: 70%; }
.rtl .grid > .row > .cell.pull14, .rtl.grid > .row > .cell.pull14 { left: 70%; }
.ltr .grid > .row > .cell.pull15, .ltr.grid > .row > .cell.pull15 { right: 75%; }
.rtl .grid > .row > .cell.pull15, .rtl.grid > .row > .cell.pull15 { left: 75%; }
.ltr .grid > .row > .cell.pull16, .ltr.grid > .row > .cell.pull16 { right: 80%; }
.rtl .grid > .row > .cell.pull16, .rtl.grid > .row > .cell.pull16 { left: 80%; }
.ltr .grid > .row > .cell.pull17, .ltr.grid > .row > .cell.pull17 { right: 85%; }
.rtl .grid > .row > .cell.pull17, .rtl.grid > .row > .cell.pull17 { left: 85%; }
.ltr .grid > .row > .cell.pull18, .ltr.grid > .row > .cell.pull18 { right: 90%; }
.rtl .grid > .row > .cell.pull18, .rtl.grid > .row > .cell.pull18 { left: 90%; }
.ltr .grid > .row > .cell.pull19, .ltr.grid > .row > .cell.pull19 { right: 95%; }
.rtl .grid > .row > .cell.pull19, .rtl.grid > .row > .cell.pull19 { left: 95%; }

/* LTR & RTL float cell push (.ltr and .rtl classes (text directional classes) from common.css) */
.ltr .grid > .row > .cell.push, .ltr.grid > .row > .cell.push { float: right !important; }
.rtl .grid > .row > .cell.push, .rtl.grid > .row > .cell.push { float: left !important; }

/* ==== Flex grid cell grow sizes (default basis 5% - hard-sized by max-width in 5% increments) ==== */
.gridFlex > .cell.size1 { flex-grow: 1; max-width: 5%; min-width: 5%; }
.gridFlex > .cell.size2 { flex-grow: 2; max-width: 10%; min-width: 10%; }
.gridFlex > .cell.size3 { flex-grow: 3; max-width: 15%; min-width: 15%; }
.gridFlex > .cell.size4 { flex-grow: 4; max-width: 20%; min-width: 20%; }
.gridFlex > .cell.size5 { flex-grow: 5; max-width: 25%; min-width: 25%; }
.gridFlex > .cell.size6 { flex-grow: 6; max-width: 30%; min-width: 30%; }
.gridFlex > .cell.size7 { flex-grow: 7; max-width: 35%; min-width: 35%; }
.gridFlex > .cell.size8 { flex-grow: 8; max-width: 40%; min-width: 40%; }
.gridFlex > .cell.size9 { flex-grow: 9; max-width: 45%; min-width: 45%; }
.gridFlex > .cell.size10 { flex-grow: 10; max-width: 50%; min-width: 50%; }
.gridFlex > .cell.size11 { flex-grow: 11; max-width: 55%; min-width: 55%; }
.gridFlex > .cell.size12 { flex-grow: 12; max-width: 60%; min-width: 60%; }
.gridFlex > .cell.size13 { flex-grow: 13; max-width: 65%; min-width: 65%; }
.gridFlex > .cell.size14 { flex-grow: 14; max-width: 70%; min-width: 70%; }
.gridFlex > .cell.size15 { flex-grow: 15; max-width: 75%; min-width: 75%; }
.gridFlex > .cell.size16 { flex-grow: 16; max-width: 80%; min-width: 80%; }
.gridFlex > .cell.size17 { flex-grow: 17; max-width: 85%; min-width: 85%; }
.gridFlex > .cell.size18 { flex-grow: 18; max-width: 90%; min-width: 90%; }
.gridFlex > .cell.size19 { flex-grow: 19; max-width: 95%; min-width: 95%; }
.gridFlex > .cell.sizeWhole { flex-grow: 0; flex-basis: 100% !important; }
/* With .autoBasis, just define widths - if column sizes don't equal 20, then cells are equally sized up to 20 */
.gridFlex.autoBasis > .cell.size1 { width: 5%; }
.gridFlex.autoBasis > .cell.size2 { width: 10%; }
.gridFlex.autoBasis > .cell.size3 { width: 15%; }
.gridFlex.autoBasis > .cell.size4 { width: 20%; }
.gridFlex.autoBasis > .cell.size5 { width: 25%; }
.gridFlex.autoBasis > .cell.size6 { width: 30%; }
.gridFlex.autoBasis > .cell.size7 { width: 35%; }
.gridFlex.autoBasis > .cell.size8 { width: 40%; }
.gridFlex.autoBasis > .cell.size9 { width: 45%; }
.gridFlex.autoBasis > .cell.size10 { width: 50%; }
.gridFlex.autoBasis > .cell.size11 { width: 55%; }
.gridFlex.autoBasis > .cell.size12 { width: 60%; }
.gridFlex.autoBasis > .cell.size13 { width: 65%; }
.gridFlex.autoBasis > .cell.size14 { width: 70%; }
.gridFlex.autoBasis > .cell.size15 { width: 75%; }
.gridFlex.autoBasis > .cell.size16 { width: 80%; }
.gridFlex.autoBasis > .cell.size17 { width: 85%; }
.gridFlex.autoBasis > .cell.size18 { width: 90%; }
.gridFlex.autoBasis > .cell.size19 { width: 95%; }
.gridFlex.autoBasis > .cell.sizeWhole { width: 100%; }

/* ==== Layout control classes (.ltr and .rtl classes (text directional classes) from common.css) ==== */
/* Float grid */
.grid {	/*white-space: nowrap;*/ }
.grid > .row { white-space-collapsing: discard; }
.grid > .row > .cell, .grid > .row > .lastCell {
	min-height: 1px;
	margin: 0;
	white-space: normal;
	white-space-collapsing: collapse;
}
.grid > .row > .lastCell {
	float: none !important;
	width: auto;
	overflow: hidden;
}

/* Table grid */
.gridTable {
	display: table;
	table-layout: fixed;
	border-collapse: collapse;
}
.gridTable > .row { display: table-row; }
.gridTable > .head { display: table-header-group; }
.gridTable > .foot { display: table-footer-group; }
.gridTable > .caption { display: table-caption; caption-side: top; font-weight: normal; }
.gridTable > .row > .cell {
	float: none !important;
	display: table-cell;
	/*vertical-align: top;*/
	/*word-wrap: break-word;*/ /* Disabled because IE doesn't get that text-overflow overrides this... */
}

/* Flex grid */
.gridFlex { display: flex; }
.gridFlex.row {	flex-direction: row; }
.gridFlex.reverseRow { flex-direction: row-reverse; }
.gridFlex.column { flex-direction: column; }
.gridFlex.reverseColumn { flex-direction: column-reverse; }
.gridFlex.noWrap { flex-wrap: nowrap; }
.gridFlex.wrap { flex-wrap: wrap; }
.gridFlex.justifyStart { justify-content: flex-start; }
.gridFlex.justifyEnd { justify-content: flex-end; }
.gridFlex.justifyCenter { justify-content: center; }
.gridFlex.justifyBetween { justify-content: space-between; }
.gridFlex.justifyAround { justify-content: space-around; }
.gridFlex.justifyEvenly { justify-content: space-evenly; }
.gridFlex.valignStart { align-items: flex-start; }
.gridFlex.valignEnd { align-items: flex-end; }
.gridFlex.valignCenter { align-items: center; }
.gridFlex.valignStretch { align-items: stretch; }
.gridFlex.valignBaseline { align-items: baseline; }
.gridFlex > .cell { margin-top: 0; flex-basis: 5%; /* IE11 fix */ flex-shrink: 0; }
.gridFlex > .cell.alignSelfAuto { align-self: auto; }
.gridFlex > .cell.alignSelfStart { align-self: flex-start; }
.gridFlex > .cell.alignSelfEnd { align-self: flex-end; }
.gridFlex > .cell.alignSelfCenter { align-self: center; }
.gridFlex > .cell.alignSelfBaseline { align-self: baseline; }
.gridFlex > .cell.alignSelfStretch { align-self: stretch; }
.gridFlex.autoBasis > .cell { flex-basis: auto !important; }
.gridFlex.evenSizedCells > .cell { flex-grow: 1 !important; }
.gridFlex.noWrap > .cell { flex-shrink: 1 !important; }

/* Grid clearfixes */
.grid:after,
.grid > .row:after,
.grid > .row > .cell:after,
.grid > .row > .lastCell:after,
.gridTable:after,
.gridFlex:after,
.gridFlex > .cell:after {
	content: "";
	display: table;
	clear: both;
}

/* Grid gutter classes */
.grid > .row > .cell.gutters,
.grid > .row > .lastCell.gutters,
.gridTable > .row > .cell.gutters,
.gridFlex > .cell.gutters { padding: .5em; }

.grid > .row > .cell.tGutter,
.grid > .row > .lastCell.tGutter,
.gridTable > .row > .cell.tGutter,
.gridFlex > .cell.tGutter { padding-top: .5em; }

.grid > .row > .cell.rGutter,
.grid > .row > .lastCell.rGutter,
.gridTable > .row > .cell.rGutter,
.gridFlex > .cell.rGutter { padding-right: .5em; }

.grid > .row > .cell.bGutter,
.grid > .row > .lastCell.bGutter,
.gridTable > .row > .cell.bGutter,
.gridFlex > .cell.bGutter { padding-bottom: .5em; }

.grid > .row > .cell.lGutter,
.grid > .row > .lastCell.lGutter,
.gridTable > .row > .cell.lGutter,
.gridFlex > .cell.lGutter { padding-left: .5em; }

/* Language direction support (.ltr and .rtl classes (text directional classes) from common.css) */
/* LTR language layout support */
.ltr .grid > .row > .cell, .ltr.grid > .row > .cell { float: left; }
/* Text alignment of RTL cells beneath an LTR element */
.ltr .rtl .grid > .row > .cell,
.ltr .rtl.grid > .row > .cell,
.ltr .rtl .grid > .row > .cell *,
.ltr .rtl.grid > .row > .cell *,
.ltr .rtl .grid > .row > .lastCell,
.ltr .rtl.grid > .row > .lastCell,
.ltr .rtl .grid > .row > .lastCell *,
.ltr .rtl.grid > .row > .lastCell * { text-align: right; }
/* RTL language layout support */
.rtl .grid > .row > .cell, .rtl.grid > .row > .cell { float: right; }
/* Text alignment of LTR cells beneath an RTL element */
.rtl .ltr .grid > .row > .cell,
.rtl .ltr.grid > .row > .cell,
.rtl .ltr .grid > .row > .cell *,
.rtl .ltr.grid > .row > .cell *,
.rtl .ltr .grid > .row > .lastCell,
.rtl .ltr.grid > .row > .lastCell,
.rtl .ltr .grid > .row > .lastCell *,
.rtl .ltr.grid > .row > .lastCell * { text-align: left; }
/* Text alignment of RTL table grid cells beneath an LTR element */
.ltr .rtl .gridTable > .row > .cell,
.ltr .rtl.gridTable > .row > .cell,
.ltr .rtl .gridTable > .row > .cell *,
.ltr .rtl.gridTable > .row > .cell * { text-align: right !important; }
/* Text alignment of LTR table grid cells beneath an RTL element */
.rtl .ltr .gridTable > .row > .cell,
.rtl .ltr.gridTable > .row > .cell,
.rtl .ltr .gridTable > .row > .cell *,
.rtl .ltr.gridTable > .row > .cell * { text-align: left !important; }

/* Allow a cell to take the width of its contents (float grid) */
.grid > .row > .cell.shrinkWrap {
	width: auto !important;
	display: inline-block !important;
	*display: inline !important; /* For IE7 */
  *zoom: 1; /* For IE7 */
}

/* ==== Overrides for low resolution/mobile devices ==== */
@media handheld, print, screen and (max-width: 800px) {
	/* Grid cell size classes for low resolution/mobile devices */
	.grid > .row > .cell.size1, .gridTable > .row > .cell.size1,
	.grid > .row > .cell.size2, .gridTable > .row > .cell.size2,
	.grid > .row > .cell.size3, .gridTable > .row > .cell.size3,
	.grid > .row > .cell.size4, .gridTable > .row > .cell.size4,
	.grid > .row > .cell.size5, .gridTable > .row > .cell.size5,
	.grid > .row > .cell.size6, .gridTable > .row > .cell.size6,
	.grid > .row > .cell.size7, .gridTable > .row > .cell.size7,
	.grid > .row > .cell.size8, .gridTable > .row > .cell.size8,
	.grid > .row > .cell.size9, .gridTable > .row > .cell.size9,
	.grid > .row > .cell.size10, .gridTable > .row > .cell.size10,
	.grid > .row > .cell.size11, .gridTable > .row > .cell.size11,
	.grid > .row > .cell.size12, .gridTable > .row > .cell.size12,
	.grid > .row > .cell.size13, .gridTable > .row > .cell.size13,
	.grid > .row > .cell.size14, .gridTable > .row > .cell.size14,
	.grid > .row > .cell.size15, .gridTable > .row > .cell.size15,
	.grid > .row > .cell.size16, .gridTable > .row > .cell.size16,
	.grid > .row > .cell.size17, .gridTable > .row > .cell.size17,
	.grid > .row > .cell.size18, .gridTable > .row > .cell.size18,
	.grid > .row > .cell.size19, .gridTable > .row > .cell.size19,
	.grid > .row > .cell.push {
		float: none;
		width: auto;
		min-height: initial;
		max-width: initial;
	}

	/* Remove positioning for sized push & pull */
	.grid > .row > .cell.push1,
	.grid > .row > .cell.push2,
	.grid > .row > .cell.push3,
	.grid > .row > .cell.push4,
	.grid > .row > .cell.push5,
	.grid > .row > .cell.push6,
	.grid > .row > .cell.push7,
	.grid > .row > .cell.push8,
	.grid > .row > .cell.push9,
	.grid > .row > .cell.push10,
	.grid > .row > .cell.push11,
	.grid > .row > .cell.push12,
	.grid > .row > .cell.push13,
	.grid > .row > .cell.push14,
	.grid > .row > .cell.push15,
	.grid > .row > .cell.push16,
	.grid > .row > .cell.push17,
	.grid > .row > .cell.push18,
	.grid > .row > .cell.push19,
	.grid > .row > .cell.pull1,
	.grid > .row > .cell.pull2,
	.grid > .row > .cell.pull3,
	.grid > .row > .cell.pull4,
	.grid > .row > .cell.pull5,
	.grid > .row > .cell.pull6,
	.grid > .row > .cell.pull7,
	.grid > .row > .cell.pull8,
	.grid > .row > .cell.pull9,
	.grid > .row > .cell.pull10,
	.grid > .row > .cell.pull11,
	.grid > .row > .cell.pull12,
	.grid > .row > .cell.pull13,
	.grid > .row > .cell.pull14,
	.grid > .row > .cell.pull15,
	.grid > .row > .cell.pull16,
	.grid > .row > .cell.pull17,
	.grid > .row > .cell.pull18,
	.grid > .row > .cell.pull19 { left: auto !important; right: auto !important; }
}