/* ----- CSS Styles Common to PTO ----- */

* {
	-moz-box-sizing:border-box;
	box-sizing:border-box;
	filter:none !important;
	/*outline:green dotted 1px;*/
}

html {
	font-size:16px;
	-ms-overflow-style:scrollbar;
	-webkit-tap-highlight-color:transparent;
}

html, body {
	min-width:57rem; /* 912 px */
}

#page-container {
	background-color:#fff;
	min-height:100vh;
	display:flex;
	flex-direction:column;
}

#page-content {
	flex:1 0 auto;
	justify-content:space-between;
	padding:1rem;
}

footer {
	display:flex;
	justify-content:space-between;
	align-content:center;
	align-items:center;
}

footer div {
	display:flex;
	align-self:stretch;
	padding-top:0.3rem;
	padding-bottom:0.3rem;
}

footer div div {
	padding-left:0.5rem;
	padding-right:0.5rem;
}

.footer-div:hover {
	background-color:rgba(0, 0, 0, 0.1);
}

footer a {
	display:flex;
	flex-direction:row;
	align-items:center;
	align-content:center;
}

header {
	padding:0.5rem;
}

#page-header {
	background-color:rgba(0, 0, 0, 0.1);
	display:flex;
	justify-content:flex-start;
	align-items:center;
}

#navbar, #adminbar, #bottombar, #footNote, #previewbar, #auxbar {
	padding:0.125rem 0.875rem;
	min-height:2rem;
	max-width:100%;
	display:flex;
	align-items:center;
}

#navbar p, #adminbar form, #adminbar p, #bottombar p, #footNote p, #previewbar p, #auxbar p {
	/*line-height:30px;*/
	max-width:60rem; /* 960 px */
	width:60rem; /* 960 px */
	margin:0 auto;
	justify-content:flex-start;
}

#navbar p .text {
	color:#fff;
	mix-blend-mode:luminosity;
	filter:invert(100%) !important;
}

#footNote p {
	line-height:1rem;
}

#bottombar {
	height:2.5rem !important;
}

#content {
	min-height:400px;
	padding:0.8rem 0;
	max-width:60rem; /* 960 px */
	margin:0 auto;
	align-self:flex-start;
}

button, input, optgroup, select, textarea {
	font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", Arial, sans-serif;
}

[tabindex="-1"]:focus {
	outline:none !important;
}

body, p, li, a, input[type=text], input[type=password], input[type=email], input[type=submit], label, select, textarea {
	text-rendering:optimizeLegibility;
	hyphens:auto;
	-webkit-hyphens:auto;
	-moz-hyphens:auto;
	-ms-hyphens:auto;
}

.form-inline label {
	justify-content:flex-end;
}

button + button {
	margin-left:2rem;
}

.no-follow {
	margin-left:0 !important;
}

.small-left-margin {
	margin-left:0.5em;
}

tt, .tt, .sm-tt, .lg-tt, .tt-sm, .tt-lg {
	font:0.9rem Hack, Menlo, Consolas, Courier, monospace !important;
	text-rendering:optimizeSpeed;
}

.sm-tt, .tt-sm {
	font-size:0.75rem !important;
}

.lg-tt, .tt-lg {
	font-size:1.15rem !important;
}

p {
	margin-bottom:1em;
	margin-top:0;
}

h1 {
	font-size:150%;
	line-height:110%;
	margin:0 0 0.5rem 0;
	padding:0;
}

h2 {
	font-size:125%;
	margin:0 0 0.2rem 0;
	padding:0;
}

h3 {
	font-size:110%;
	margin:0;
	padding:0;
}

ul, ol {
	margin:0 0 0.4rem 0;
}

a.image, a.image:hover, a.image img {
	border:0;
	margin:inherit;
	padding:inherit;
	text-decoration:none;
	background-color:transparent;
}

/* Moved a.none to core_ui so it takes precedence over site.css */

a.normaltext {
	color:#222 !important;
}

a.white, a:hover.white, a:visited.white,
a.td_white, a:hover.td_white, a:visited.td_white {
	text-decoration:none;
	color:#fff;
	background-color:transparent;
	border:0;
	margin:0;
	padding:0;
}

th a:visited, a.td_white, a:hover.td_white, a:visited.td_white {
	color:inherit;
}

/* Audit-bar is used for a small informational section to display activity or session audit fields */
.audit-bar {
	padding:0.3rem 0.25rem 0.3rem 0.5rem;
	background-color:#ebebeb;
	color:#595959;
	border-radius:0.4rem;
}

.copyblock {
	text-align:right;
	padding:0 0.75rem;
	font-size:90%;
	line-height:1.1rem !important;
	flex-wrap:wrap;
	flex-direction:column;
	justify-content:center;
}

table.mceLayout {
	margin-bottom:1ex !important;
}

table.mceLayout tr {
	height:auto;
}

a {
	cursor:pointer;
}

/* Compound fields for BS4 */
.left-field {
	border-top-right-radius:0;
	border-top-left-radius:0.2rem !important;
	border-bottom-right-radius:0;
	border-bottom-left-radius:0.2rem !important;
}

.right-field {
	border-top-left-radius:0;
	border-top-right-radius:0.2rem !important;
	border-bottom-left-radius:0;
	border-bottom-right-radius:0.2rem !important;
	border-left:none;
}

.input-group .middle-field {
	border-radius:0 !important;
}

.middle-field {
	border-top-right-radius:0;
	border-bottom-right-radius:0;
	border-top-left-radius:0;
	border-bottom-left-radius:0;
	border-left:none;
}

/* Setting buttons emulate radio groups to toggle settings */
.setting-container, .characteristic-container, .option-container, .setting-container-inline {
	padding:0.5rem 0 0.5rem 0;
	margin:0;
	min-height:3rem;
	width:99%;
}

.setting-container-inline {
	width:auto;
	min-height:1rem;
	display:inline-block;
}

.option-container {
	border-width:3px;
	border-style:solid;
	border-radius:0.4rem;
	background-color:transparent;
	text-align:left;
	padding:0.4rem;
	margin-bottom:1rem;
	page-break-inside:avoid;
	break-inside:avoid;
	-webkit-column-break-inside:avoid;
	-moz-column-break-inside:avoid;
}

.option-container-button {
	border:none !important;
	background-color:transparent !important;
	display:flex;
	align-items:center;
	justify-content:flex-start;
	align-content:flex-start;
	text-align:left;
	cursor:pointer !important;
	width:100%;
	padding:0 !important;
}

.setting-button, .characteristic-button, .inline-setting-button {
	width:100%;
	border-width:0.125rem;
	border-style:solid;
	border-radius:0.375rem;
	background-color:transparent;
	text-align:left;
	padding:0.3rem 0.5rem;
	cursor:pointer !important;
}

.inline-setting-button {
	border-width:0;
	width:auto;
}

.characteristic-button {
	border-width:1px;
}

.setting-set, .characteristic-set {
	border-color:#87c886;
}

.characteristic-set:hover {
	background-color:rgba(135, 200, 134, 0.425);
}

.setting-unset, .characteristic-unset {
	border-color:#ddd;
}

.characteristic-unset:hover {
	background-color:rgba(0, 0, 0, 0.05);
}

.setting-checkbox {
	width:1.5rem;
}

.setting-container p.setting-text {
	margin-left:2rem;
}

/* Supplemental form fields */
.form-label, .span-label {
	width:11rem;
	text-align:right !important;
	margin-right:0.5rem;
	hyphens:none;
	-moz-hyphens:none;
	-webkit-hyphens:none;
}

.span-label {
	display:inline-block;
	padding-top:0;
	vertical-align:baseline;
}

.label-offset {
	margin-left:11.5rem;
}

.label-offset-sm {
	margin-left:6rem;
}

/* "Inline" button style for inline buttons (no border, transparent BG, no hover font effect) */
.btn-inline {
	background-color:transparent;
}

.btn-inline:hover {
	color:inherit;
}

/* Based on CE Depot System hub.php selector-button */
.btn-unadorned, .btn-unadorned-inline {
	border:none;
	background-color:transparent;
	text-align:left;
	padding:0.5rem;
	margin:0;
	width:100%;
	cursor:pointer;
}

.btn-unadorned-inline {
	width:auto;
}

/* inline action buttons */
td.action-buttons {
	height:100%;
	min-height:100%;
	padding:0 !important;
	vertical-align:top;
	border-left:1px solid rgba(0, 0, 0, 0.1);
	border-collapse:collapse;
}

.action-container {
	top:0;
	bottom:0;
	height:100%;
	display:flex;
	flex-flow:column nowrap;
	justify-content:space-around;
	align-items:stretch;
	align-content:stretch;
}

.action-container-across {
	flex-flow:row wrap;
}

.btn-action {
	margin:0 !important;
	background-color:transparent;
	flex:1 1 auto;
	font-size:85%;
	text-transform:uppercase;
	letter-spacing:0.025em; /* Butterick */
	border-left:1px solid rgba(0, 0, 0, 0.1);
	border-right:none;
	border-bottom:1px solid rgba(0, 0, 0, 0.1);
	border-top:none;
	min-height:2.5625rem;
}

.btn-action:hover {
	cursor:pointer;
	color:#fff;
	font-weight:bolder;
	background-color:rgba(0, 0, 0, 0.4);
}

.btn-action:disabled, .btn-action:disabled:hover {
	cursor:not-allowed !important;
	background-color:rgba(0, 0, 0, 0.1) !important;
	color:rgba(0, 0, 0, 0.3) !important;
}

/* draw_button_array() styles */
.button-array-container {
	display:flex;
	flex-flow:row wrap;
	align-items:stretch;
	justify-content:flex-start;
	width:100%;
	margin:auto;
	border:1px solid #ccc;
	border-left:none;
	border-bottom:none;
	box-shadow:0 0 0.375rem rgba(0, 0, 0, 0.06);
	list-style:none;
	padding:0;
}

.button-array-container:hover {
	box-shadow:0 0 0.375rem rgba(0, 0, 0, 0.2);
}

.button-array-break-2 {
	flex:1 1 50%;
}

.button-array-break-3 {
	flex:1 1 33.33%;
}

.button-array-break-4 {
	flex:1 1 25%;
}

.button-array-break-5 {
	flex:1 1 20%;
}

.button-array-break-6 {
	flex:1 1 16.66%;
}

.button-array-break-8 {
	flex:1 1 12.5%;
}

.button-array-break-10 {
	flex:1 1 10%;
}

.button-array-element {
	border:1px solid #ccc;
	border-top:none;
	border-right:none;
	display:flex;
	align-items:center;
	justify-content:center;
	hyphens:none;
	-ms-hyphens:none;
	-moz-hyphens:none;
	-webkit-hyphens:none;
}

.button-array-button:hover {
	background-color:#287abd;
	color:#fff;
}

.button-array-button {
	text-transform:uppercase;
	letter-spacing:0.025em; /* Butterick */
	font-size:90%;
	background-color:white;
	padding:0.75rem 1.5rem;
	border:none;
	cursor:pointer;
	width:100%;
	height:100%;
}

.button-array-button-no-padding {
	padding:0 !important;
}

.button-array-button-inactive, .button-array-button:disabled {
	color:#666;
	background-color:#eee;
}

.button-array-button:disabled {
	cursor:not-allowed !important;
	color:#dadada;
}

/* --- fa5note ---- */
.fa-note-icon {
	align-self:flex-start;
	text-align:center;
	min-width:5rem;
}

.fa-note-message {
	flex-grow:1;
	/*	display:inline-block;
		width:87%;*/
	/*margin-left:2rem!important;*/
	/*clear:both;*/
}

.fa-note-message p:last-child {
	margin-bottom:0 !important;
}

.fa5note-container {
	display:flex;
	flex-direction:row;
	flex-wrap:nowrap;
	justify-content:flex-start;
	border-radius:0.4rem;
	padding:0.5rem 0;
	margin:0 auto;
}

.fa5note-container-margins {
	margin:1rem auto 2rem auto;
}

.fa5note-container-shadow {
	box-shadow:0 0.2rem 0.75rem rgba(0, 0, 0, 0.25);
}

.fa5note-container-bg-alert {
	background-color:rgba(251, 165, 1, 0.1);
}

.fa5note-container-bg-error {
	background-color:rgba(255, 50, 12, 0.1);
}

.fa5note-container-bg-fyi {
	background-color:rgba(80, 182, 209, 0.1);
}

.fa5note-container-bg-info {
	background-color:rgba(52, 101, 222, 0.1);
}

.fa5note-container-bg-okay {
	background-color:rgba(49, 209, 82, 0.1);
}

.fa5note-container-border-alert {
	border:1px solid rgba(251, 165, 1, 0.2);
}

.fa5note-container-border-error {
	border:1px solid rgba(255, 50, 12, 0.15);
}

.fa5note-container-border-fyi {
	border:1px solid rgba(80, 182, 209, 0.2);
}

.fa5note-container-border-info {
	border:1px solid rgba(52, 101, 222, 0.2);
}

.fa5note-container-border-okay {
	border:1px solid rgba(49, 209, 82, 0.2);
}

.fa5note-badge {
	padding:0 1rem;
}

.fa5note-title {
	font-size:150%;
}

.fa5note-body {
	padding:0.5rem 0.5rem 0 0;
}

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

C O L O R S - We attempt to be WCAG AAA compliant whenever possible

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

.--color-green-fg, .success-green, .color-green {
	/*color:#1DC81B!important;*/
	color:#116510 !important;
}

.--color-green-bg {
	background-color:#116510 !important;
}

.success-green-bg, .color-green-bg, .color-bg-green {
	color:#fff !important;
	background-color:#116510 !important;
}

.--color-red-fg, .fail-red, .color-red {
	color:#b50000 !important;
}

.--color-red-bg {
	background-color:#b50000 !important;
}

.fail-red-bg, .color-red-bg, .color-bg-red {
	color:#fff !important;
	background-color:#b50000 !important;
}

.--color-orange-fg, .warning-orange, .color-orange {
	color:#fd850f !important;
}

.--color-orange-bg {
	background-color:#fd850f !important;
}

.warning-orange-bg, .color-orange-bg, .color-bg-orange {
	color:#fff !important;
	background-color:#fd850f !important;
}

.--color-yellow-fg, .unsure-yellow, .color-yellow {
	color:#f2c202 !important;
}

.--color-yellow-bg {
	background-color:#f2c202 !important;
}

.unsure-yellow-bg, .color-yellow-bg, .color-bg-yellow {
	color:#fff !important;
	background-color:#f2c202 !important;
}

.--color-blue-fg, .info-blue, .color-blue {
	color:#2356a9 !important;
}

.--color-blue-bg {
	background-color:#2356a9 !important;
}

.info-blue-bg, .color-blue-bg, .color-bg-blue {
	color:#fff !important;
	background-color:#2356a9 !important;
}

.--color-teal-fg, .fyi-teal, .color-teal {
	color:#1e5f71 !important;
}

.--color-teal-bg {
	background-color:#1e5f71 !important;
}

.fyi-teal-bg, .color-teal-bg, .color-bg-teal {
	color:#fff !important;
	background-color:#1e5f71 !important;
}

.--color-purple-fg, .color-purple {
	color:#78358d !important;
}

.--color-purple-bg {
	background-color:#78358d !important;
}

.info-purple-bg, .color-purple-bg, .color-bg-purple {
	color:#fff !important;
	background-color:#78358d !important;
}

.--color-pink-fg, .color-pink {
	color:#b3001e !important;
}

.--color-pink-bg, .color-pink-bg, .color-bg-pink {
	background-color:#ff6b84 !important;
}

.--color-white-fg, .default-white, .color-white {
	color:#fff !important;
}

.--color-white-bg, .default-white-bg, .color-white-bg, .color-bg-white {
	background-color:#fff !important;
}

.--color-grey-fg, .--color-gray-fg, .neutral-grey, .color-grey {
	color:#cdcdcd !important;
}

.--color-grey-bg, .--color-gray-bg, .neutral-grey-bg, .color-grey-bg, .color-bg-grey {
	background-color:#cdcdcd !important;
}

.--color-dark-grey-fg, .--color-dark-gray-fg {
	color:#595959 !important;
}

.--color-dark-grey-bg, .--color-dark-gray-bg {
	background-color:#595959 !important;
}

.--color-black-fg, .color-black {
	color:#000 !important;
}

.--color-black-bg {
	background-color:#000 !important;
}

.success-green-fade-bg {
	background-color:#fff !important;
	background-color:rgba(29, 200, 27, 0.2) !important;
	border:1px solid rgba(29, 200, 27, 0.05);
}

.fail-red-fade-bg {
	background-color:#fff !important;
	background-color:rgba(255, 46, 0, 0.1) !important;
	border:1px solid rgba(255, 46, 0, 0.05);
}

.warning-orange-fade-bg {
	background-color:#fd850f !important;
	background-color:rgba(253, 133, 15, 0.1) !important;
	border:1px solid rgba(253, 133, 15, 0.05);
}

.unsure-yellow-fade-bg {
	background-color:#f2c202 !important;
	background-color:rgba(230, 210, 22, 0.2) !important;
	border:1px solid rgba(230, 210, 22, 0.05);
}

.info-blue-fade-bg {
	background-color:#2356a9 !important;
	background-color:rgba(82, 134, 219, 0.2) !important;
	border:1px solid rgba(82, 134, 219, 0.05);
}

.fyi-teal-fade-bg {
	background-color:#fff !important;
	background-color:rgba(80, 182, 209, 0.2) !important;
	border:1px solid rgba(80, 182, 209, 0.05);
}

.bad-field {
	border-left:0.375rem solid #b50000;
	margin-left:-0.375rem;
	padding:0.3rem 0;
	background-color:#ffebe4 !important;
}

.good-field {
	border-left:0.375rem solid #116510;
	margin-left:-0.375rem;
	padding:0.3rem 0;
	background-color:rgba(49, 209, 82, 0.1) !important;
}

.btn-action-okay:not([disabled]), .btn-action-success:not([disabled]), .btn-action-green:not([disabled]) {
	color:#116510 !important; /* success-green */
}

.btn-action-okay:not([disabled]):hover, .btn-action-success:not([disabled]):hover, .btn-action-green:not([disabled]):hover {
	background-color:#116510 !important; /* success-green */
	color:#fff !important;
}

.btn-action-danger:not([disabled]), .btn-action-fail:not([disabled]), .btn-action-red:not([disabled]) {
	color:#b50000 !important; /* fail-red */
}

.btn-action-danger:not([disabled]):hover, .btn-action-fail:not([disabled]):hover, .btn-action-red:not([disabled]):hover {
	background-color:#b50000 !important; /* fail-red */
	color:#fff !important;
}

.btn-action-warning:not([disabled]), .btn-action-orange:not([disabled]) {
	color:#884503; /* warning-orange */
}

.btn-action-warning:not([disabled]):hover, .btn-action-orange:not([disabled]):hover {
	background-color:#fd850f !important; /* warning-orange */
	color:#000;
!important;
}

.btn-action-unsure:not([disabled]), .btn-action-yellow:not([disabled]) {
	color:#695402 !important; /* unsure-yellow */
}

.btn-action-unsure:not([disabled]):hover, .btn-action-yellow:not([disabled]):hover {
	background-color:#f2c202 !important; /* unsure-yellow */
	color:#000 !important;
}

.btn-action-info:not([disabled]) {
	color:#2356a9 !important; /* info-blue */
}

.btn-action-info:not([disabled]):hover {
	color:#fff !important;
	background-color:#2356a9 !important; /* info-blue */
}

.btn-action-fyi:not([disabled]) {
	background-color:#1e5f71 !important; /* fyi-teal */
}

.btn-action-fyi:not([disabled]):hover {
	color:#fff !important;
	background-color:#1e5f71 !important; /* fyi-teal */
}

.btn-action-grey:not([disabled]) {
	color:#cdcdcd !important; /* neutral-grey */
}

.btn-action-grey:not([disabled]):hover {
	color:#fff !important;
	background-color:#757575 !important; /* neutral-grey */
}

.btn-action-purple:not([disabled]) {
	color:#78358d !important; /* color-purple */
}

.btn-action-purple:not([disabled]):hover {
	color:#fff !important;
	background-color:#78358d !important; /* color-purple */
}

.btn-action-pink:not([disabled]) {
	color:#b3001e !important; /* color-pink */
}

.btn-action-pink:not([disabled]):hover {
	color:#000 !important;
	background-color:#ff6b84 !important; /* color-pink */
}

/* button-array colors */
.button-array-button-warning {
	color:#884503;
}

.button-array-button-warning:hover {
	background-color:#fd850f;
	color:#000;
}

.button-array-button-danger {
	color:#b50000;
}

.button-array-button-danger:hover {
	background-color:#b50000;
	color:#fff;
}

.button-array-button-success {
	color:#116510;
}

.button-array-button-success:hover {
	background-color:#116510;
	color:#fff
}

.button-array-button-info {
	color:#2356a9;
}

.button-array-button-info:hover {
	background-color:#2356a9;
	color:#fff;
}

.button-array-button-fyi {
	color:#1e5f71;
}

.button-array-button-fyi:hover {
	background-color:#50b6d1;
	color:#000;
}

/* Common text and link scaling and color effects */
.u {
	text-decoration:underline;
}

.s {
	text-decoration:line-through;
}

.no-padding, .padding-none {
	padding:0 !important;
}

.smaller, .text-smaller, .text-sm, .text-75 {
	font-size:75%;
}

.text-50 {
	font-size:50%;
}

.text-60 {
	font-size:60%;
}

.text-70 {
	font-size:70%;
}

.text-75 {
	font-size:75%;
}

.text-80 {
	font-size:80%;
}

.text-90 {
	font-size:90%;
}

.text-110 {
	font-size:110%;
}

.larger, .text-larger, .text-lg, .text-large, .text-120 {
	font-size:120%;
}

.text-125 {
	font-size:125%;
}

.text-130 {
	font-size:130%;
}

.text-135 {
	font-size:135%;
}

.text-140 {
	font-size:140%;
}

.text-145 {
	font-size:145%;
}

.text-xlarge, .text-150 {
	font-size:150%;
}

.text-155 {
	font-size:155%;
}

.text-160 {
	font-size:160%;
}

.text-165 {
	font-size:165%;
}

.text-170 {
	font-size:170%;
}

.text-175 {
	font-size:175%;
}

.text-180 {
	font-size:180%;
}

.text-185 {
	font-size:185%;
}

.text-190 {
	font-size:190%;
}

.text-195 {
	font-size:195%;
}

.text-jumbo, .text-200 {
	font-size:200%;
}

.text-bold {
	font-weight:bold;
}

.allcaps, .all-caps {
	text-transform:uppercase;
	letter-spacing:0.025em; /* Butterick */
}

.smcaps, .sm-caps {
	font-variant:small-caps;
	letter-spacing:0.03em; /* After Butterick */
}

.dim {
	opacity:0.3;
}

/* Hyphenation control -- by default, turned on with "modern" layout */
.nohyphens, .no-hyphens {
	hyphens:none !important;
	-webkit-hyphens:none !important;
	-moz-hyphens:none !important;
	-ms-hyphens:none !important;
}

.hyphenate {
	hyphens:auto;
	-webkit-hyphens:auto;
	-moz-hyphens:auto;
	-ms-hyphens:auto;
}

.plaintext, .text-plain {
	font-weight:normal;
}

.normalsize, .text-normal {
	font-size:medium;
}

.nobr, .no-br {
	white-space:nowrap;
}

/* span, td, etc. text alignment */
.alignright, .align-right {
	text-align:right;
}

.aligncenter, .align-center {
	text-align:center;
}

.alignleft, .align-left {
	text-align:left;
}

.required {
	font-weight:bold;
	color:#e02900;
}

.required-text::before {
	content:"✻";
	color:#e02900;
	margin-right:0.2em;
}

.error-text::before {
	content:url(/assets/stop-sign.svg);
	display:inline-flex;
	width:1.3em;
	margin-right:-1.3em;
}

/* "info block" -- i-in-circle UNICODE text (ⓘ) in a nice blue. */
.iblock, .iblock_big, .iblock-big, .iblock-lg {
	color:blue;
}

.iblock:before, .iblock_big:before, .iblock-big:before, .iblock-lg:before {
	content:"\24d8"; /*ⓘ*/
	font-style:normal;
}

/* "alert block" -- !-in-triangle UNICODE text (⚠) in an appropriate orangey-red */
.ablock, .ablock_big, .ablock-big, .ablock-lg {
	color:#fc2e07;
}

.ablock:before, .ablock_big:before, .ablock-big:before, .ablock-lg:before {
	content:"\26a0"; /*⚠*/
	font-style:normal;
}

/* Multiline versions—float to left, apply larger font size, add right margin */
.iblock_big, .ablock_big, .iblock-big, .iblock-lg, ablock-big, .ablock-lg {
	float:left;
	font-size:180%;
	margin-right:0.3em;
}

/* EXPERIMENTAL -- Force WebKit browsers to display vertical scroll bar in scrolling table divs */
/* By default, Apple hides scrollbars in Mac OS X applications, which can cause confusion when the
	pseudo-table scrolling div is used. Styling the scrollbar forces it to be shown and these rules
   attempt to recreate the default system scrollbar for that instance. */
div ::-webkit-scrollbar {
	width:1em; /* for vertical scrollbars */
	height:1em; /* for horizontal scrollbars */
}

div ::-webkit-scrollbar-track:vertical {
	border-top:0;
	border-bottom:0;
	border-left:1px solid #e5e5e5;
	border-right:1px solid #f0f0f0;
}

div ::-webkit-scrollbar-track {
	background-color:rgba(252, 252, 252, 0.5);
	/*box-shadow:inset 0 0 3px rgba(229, 229, 229, 0.7);*/
	background:-webkit-linear-gradient(left, rgba(229, 229, 229, 0.5), rgba(252, 252, 252, 0.3), rgba(252, 252, 252, 0.3), rgba(229, 229, 229, 0.3));
}

div ::-webkit-scrollbar-thumb {
	background-color:rgb(194, 194, 194);
	border-radius:7px;
	border-left:4px solid rgba(252, 252, 252, 0.95);
	border-right:3px solid rgba(252, 252, 252, 0.95);
	border-top:2px solid rgba(252, 252, 252, 0.95);
	border-bottom:2px solid rgba(252, 252, 252, 0.95);
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
	color:rgba(0, 0, 0, 0.25) !important;
	text-transform:none !important;
	font-weight:normal !important;
}

input::-moz-placeholder, textarea::-moz-placeholder {
	color:rgba(0, 0, 0, 0.25) !important;
	text-transform:none !important;
	font-weight:normal !important;
}

input:-moz-placeholder, textarea:-moz-placeholder { /* Older versions of Firefox */
	color:rgba(0, 0, 0, 0.25) !important;
	text-transform:none !important;
	font-weight:normal !important;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
	color:rgba(0, 0, 0, 0.25) !important;
	text-transform:none !important;
	font-weight:normal !important;
}

/*

	TAFEL styles: div-based "table" with scrollable body

	2018-08-08 DBO
	There are an awful lot of styles here, just to replicate the scrollable table, but it should be worth it.

 */

.tafel {
	/* MT on purpose */
	display:table;
}

.tafel-width-50, .tafel-width-half {
	width:50%;
}

.tafel-width-55 {
	width:55%;
}

.tafel-width-60, .tafel-width-medium {
	width:60%;
}

.tafel-width-65 {
	width:65%;
}

.tafel-width-70 {
	width:70%;
}

.tafel-width-75, .tafel-width-3q {
	width:75%;
}

.tafel-width-80, .tafel-width-wide {
	width:80%;
}

.tafel-width-85 {
	width:85%;
}

.tafel-width-90, .tafel-width-xwide {
	width:90%;
}

.tafel-width-95 {
	width:95%;
}

.tafel-width-100, .tafel-width-full {
	width:100%;
}

.tafel-height-9 {
	max-height:9rem;
}

.tafel-height-12 {
	max-height:12rem;
}

.tafel-height-18 {
	max-height:18rem;
}

.tafel-height-24 {
	max-height:24rem;
}

.tafel-height-30 {
	max-height:30rem;
}

.tafel-height-36 {
	max-height:36rem;
}

.tafel-height-42 {
	max-height:42rem;
}

.tafel-height-48 {
	max-height:48rem;
}

.tafel-outer-border-4 {
	border-width:0.25rem;
	border-radius:0.25rem;
}

.tafel-outer-border-5 {
	border-width:0.3125rem;
	border-radius:0.3125rem;
}

.tafel-outer-border-6, .tafel-border-medium {
	border-width:0.375rem;
	border-radius:0.375rem;
}

.tafel-outer-border-8, .tafel-border-wide {
	border-width:0.5rem;
	border-radius:0.5rem;
}

.head-padding-4 .tafel-cell, .content-padding-4 .tafel-cell {
	padding:0.4rem;
}

.head-padding-5 .tafel-cell, .content-padding-5 .tafel-cell {
	padding:0.5rem;
}

.head-padding-6 .tafel-cell, .content-padding-6 .tafel-cell {
	padding:0.6rem;
}

.head-padding-8 .tafel-cell, .content-padding-8 .tafel-cell {
	padding:0.8rem;
}

.head-padding-1 .tafel-cell, .content-padding-1 .tafel-cell {
	padding:1.0rem;
}

.tafel-head-container, .tafel-content-area, .tafel-foot-container {
	border-style:solid;
}

.tafel-content-container {
	overflow-y:scroll;
	border-radius:0 !important;
	border-style:hidden;
	width:100%;
}

.tafel-head-container {
	border-bottom-left-radius:0;
	border-bottom-right-radius:0;
	border-bottom-style:hidden;
	width:calc(100% - 1em);
}

.tafel-content-area {
	border-top-style:hidden;
	border-bottom-style:hidden;
	border-left-style:solid;
	border-right-style:solid;
	border-radius:0;
	width:100%;
}

.tafel-foot-container {
	border-top-left-radius:0;
	border-top-right-radius:0;
	border-top-style:hidden;
	width:calc(100% - 1em);
}

.tafel-head-content {
	display:flex;
	justify-content:space-between;
}

.head-border-right .tafel-cell:last-of-type, .content-border-right .tafel-cell:last-of-type {
	border-right:none;
}

.tafel-row {
	display:flex;
	justify-content:space-between;
}

.tafel-head-content .tafel-cell, .tafel-row .tafel-cell {
	flex:1 1 auto;
}

.fixed-cell {
	flex:0 1 auto !important;
}

.tafel-border-color {
	border-color:#bfd4e2;
}

.tafel-head-color {
	background-color:#4d789d;
	color:#fff;
}

.head-border-right .tafel-cell, .content-border-right .tafel-cell {
	border-right:0.0625rem solid #bfd4e2;
}

.tafel-content-area .tafel-row:nth-of-type(even) {
	background-color:#e2eaf4;
}

.tafel-row:hover {
	background-color:#fff0f3 !important;
	box-shadow:inset 0 0 0.4rem rgba(83, 117, 156, 0.6) !important;
}

/* Multicolumn layout setup */
.columns-2, .columns-3, .columns-4, .columns-5, .columns-6 {
	-webkit-column-count:2;
	-moz-column-count:2;
	column-count:2;
	column-fill:balance;
	padding:4px;
}

.columns-2 p, .columns-3 p, .columns-4 p, .columns-5 p, .columns-6 p {
	break-inside:avoid-column;
	break-after:avoid-column;
}

.columns-3 {
	-webkit-column-count:3;
	-moz-column-count:3;
	column-count:3;
}

.columns-4 {
	-webkit-column-count:4;
	-moz-column-count:4;
	column-count:4;
}

.columns-5 {
	-webkit-column-count:5;
	-moz-column-count:5;
	column-count:5;
}

.columns-6 {
	-webkit-column-count:6;
	-moz-column-count:6;
	column-count:6;
}

.columns-2, .columns-3, .columns-4, .columns-5, .columns-6 {
	padding:0;
}

.columns-2 > .show-hover:hover, .columns-3 > .show-hover:hover, .columns-4 > .show-hover:hover, .columns-5 > .show-hover:hover, .columns-6 > .show-hover:hover {
	border:1px solid #ced9e0;
	padding:0.25rem;
	background-color:#e1eef7;
	border-radius:0.25rem;
	background-clip:padding-box;
	margin:-0.25rem;
}

.all_cols {
	-webkit-column-span:all;
	column-span:all;
}