/**** Containers ****/


div.ghost-box { display: contents }


.flex-row {
	display: flex;
	flex-direction: row;
}/* .flex-row */


.flex-column {
	display: flex;
	flex-direction: column;
}/* .flex-column */


.row-container {
	display: flex;
	flex-direction: row;
	align-self: stretch;
}/* .row-container */


.span-all, .span-columns { grid-column: 1 / -1 }
.span-all, .span-rows { grid-row: 1 / -1 }


.row-spaced { row-gap: 2em }


.overlay-container {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	justify-content: normal;
}/* .overlay-container */


.overlay-container > * {
	grid-column: 1;
	grid-row: 1;
}/* .overlay-container > * */


/**** Spacing ****/


.indented { margin-left: 1em }

.with-headspace { margin-top: 1em }
.with-some-headspace {margin-top: 0.35em }
.with-lotsa-headspace {margin-top: 1.5em }

.with-legroom { margin-bottom: 1em }
.with-some-legroom {margin-bottom: 0.35em }
.with-lotsa-legroom {margin-bottom: 1.5em }


/**** Flex alignments ****/


.horizontally-aligned, .fully-aligned {
	display: flex;
	flex-direction: row;
	justify-content: center;
}/* .horizontally-aligned, .fully-aligned */


.horizontally-centered {
	display: flex;
	flex-direction: column;
	align-items: center;
}/* .horizontally-centered */


.vertically-aligned, .fully-aligned {
	display: flex;
	flex-direction: row;
	align-items: center;
}/* .vertically-centered, .fully-aligned */


.vertically-centered {
	display: flex;
	flex-direction: column;
	justify-content: center;
}/* .vertically-centered */


/**** Text alignments ****/


.right-aligned * { text-align: right }
.right-aligned-text { text-align: right !important }


/**** Table Alignments (justified) ****/


.vertically-center-justified {
	align-items: center;
}/* vertically-center-justified */


/********/


div.credit-centered { 
	display: grid;
	grid-template-columns: repeat(2, max-content);
	row-gap: 0.2em;
}/* div.credit-centered */

div.credit-centered label {
	text-align: right;
	margin-left: 0;
}/* div.credit-centered label */

div.credit-centered *:nth-child(::odd) { justify-self: flex-end }
div.credit-centered *:nth-child(::even) { justify-self: flex-start }


/********/


*.fully-centered, *.row-centered {
	display: inline-flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
}/* *.fully-centered, *.row-centered */


*.column-centered {
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}/* .column-centered */


*.self-centered {
	justify-self: center;
	align-self: center;
}/* self-centered */


*.page-centered {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}/* *.page-centered */


/********/


.left-aligned {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
}/* .left-aligned */


/** Flex Row **/


.right-justified {
	display: flex;
	flex-direction: row;
	justify-content: flex-end;
}/* .right-justified */


.horizontally-spaced-out {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}/* .horizontally-spaced-out */


/** Flex Column **/


.right-justified-column {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}/* right-justified-column */


.top-centered {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: center;
}/* .top-centered */


.top-left {
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
}/* .top-left */


.vertically-spaced-out {
	display: flex;
	flex-direction: column;
	justify-content: space-between
}/* .vertically-spaced-out */


.bottom-justified {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}/* .bottom-justified */


/**** Text Transformations ****/


*.uppercase { text-transform: uppercase }


/**** Line Breaks ****/


div.break, div.half-break {
	display: flex;
	grid-column: 1 / -1;
}/* div.break, div.half-break */


div.break		{ height: 1em }
div.half-break	{ height: 0.5em }


/**** Anchors ****/


*.link-row { display: contents }

*.link-row > *:not(:first-child) { padding-left: 0.5em }
*.link-row > *:not(:last-child) { padding-right: 0.5em }

*.link-row:hover { cursor: pointer }
*.link-row:hover > * { background-color: var(--highlight-color) }


/**** Button Panels ****/


div.button-panel {
	display: flex;
	flex-direction: row;
	column-gap: 0.25em;
	justify-content: flex-end;
}/* div.button-panel */


div.button-column {
	display: flex;
	flex-direction: column;
	justify-content: stretch;
	row-gap: 0.25em;
	padding: 0 2em 0 0;
	width: 100%;
	height: 100%;
}/* div.button-column */


div.scroll-panel { overflow: auto }


/********/


*.border-panel {
	border-left: solid 1px var(--border-color);
	margin-left: var(--double-margin);
	padding-left: var(--double-padding);
}/* *.border-panel */


/********/


*.form-panel input {
	height: var(--standard-height);
}/* *.form-panel input */


*.form-panel button {
	display: flex;
	height: var(--standard-height);
	align-items: center;
	justify-content: center;
}/* *.form-panel */


/**** Class Definitions ****/


.full-screen {
	position: absolute;
	left: 0;
	top: 0;
}/* full_size */


.subheader {
	font-size: 8pt;
	font-weight: bold;
	font-style: italic;
}/* subheader */


.scroll-list {
	border: solid 1px black;
	border-radius: 0.1em;
}/* scroll-list */


.list-header {
	margin-bottom: 1em;
}/* list-title */


.list-header > div {
	font-weight: bold;
}/* .list-header > div */


/********/


.form-error {
	display: flex;
	justify-items: center;
	align-items: center;
	text-align: left;
	font-style: italic;
	margin-bottom: 2em;
}/* .form-error */


/**** Debugging ****/


.borderlined, .borderline, .borderline > *, .outlined, .outlined *, .outline * {
	border: solid 1px red;
}/* border styles */


div.outlined label, .outline { 
	border: solid 1px blue !important;
}/* div.outlined label */


.gray-outlined {
	border: none;
	row-gap: 0.25em;
}/* .gray-outlined */


.unsigned-signin {
	display: flex;
	flex-direction: column;
}/* unsigned-signin */


.banner-signin {
	display: flex;
	justify-content: space-between;
	margin-bottom: 1em;
	width: 100%;
}/* banner-signin */


/********/


.aside {

	font-style: italic;
	font-size: 9pt;
	font-weight: bold;

	display: flex;
	flex-direction: row;
	align-items: center;

	margin-right: 1em;

}/* aside */


.eyecandy-cell {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
}/* eyecandy-cell */


.eyecandy-cell > div { display: inline-block }

.eyecandy-cell > div:first-child { margin-right: 1em }


/**** Button Panels ****/


.button-bar {
    display: flex;
    flex-direction: row;
    align-self: flex-end;
    column-gap: 0.25em;
    margin-top: 1em;
}/* .button-bar */


/**** Frame Styles ****/


.shadow-box {
	display: inline-block;
	border: solid 1px black;
	box-shadow: 2px 2px 10px #333;
	padding: 2em;
	margin: 2em;
	align-self: "center";
}/* .shadow-box */


/********/


.double-column { grid-column: span 2 }


/**** Image Styles ****/


.progress-image { margin: 0 0.5em }


/**** Grid Styles ****/


div[class*="two-column-"]	{ grid-template-columns: repeat(2, min-content) }
div[class*="three-column-"]	{ grid-template-columns: repeat(3, min-content) }
div[class*="four-column-"]	{ grid-template-columns: repeat(4, min-content) }
div[class*="five-column-"]	{ grid-template-columns: repeat(5, min-content) }
div[class*="six-column-"]	{ grid-template-columns: repeat(6, min-content) }


div[class*="-column-grid"], div[class*="-column-table"] {
	display: grid;
	align-items: center;
	justify-content: center;
	row-gap: 0.2em;
}/* div[class*="-column-grid"], div[class*="-column-table"] */


div[class*="-column-grid"] label, div[class*="-column-table"] label {
	display: inline-flex;
	flex-direction: row;
	align-items: center;
	justify-content: flex-end;
}/* div[class*="-column-grid"] label, div[class*="-column-table"] */


div[class*="-column-table"] { column-gap: 1em }


/********/


div.two-column-newspaper {
	display: inline-grid;
	align-items: stretch;
	background-color: var(--border-color);
	column-gap: 1px;
}/* div.two-column-newspaper */


div.two-column-newspaper > div { background-color: white }
div.two-column-newspaper > div:not(:first-child) { padding-left: 1em }
div.two-column-newspaper > div:not(:last-child) { padding-right: 1em }


/**** Forms ****/


div[class*="-piece-form"], div[class*="-piece-grid"] {
	display: grid;
	align-items: center;
	justify-content: stretch;
	column-gap: 0.5em;
	row-gap: 0.2em;
}/* div[class*="-piece-form"] */


div[class*="one-piece-"]	{ grid-template-columns: min-content 1fr }
div[class*="two-piece-"]	{ grid-template-columns: repeat(4, min-content) }
div[class*="three-piece-"]	{ grid-template-columns: repeat(3, min-content 1fr) }

div[class*="one-piece-"] label:nth-child(odd) { text-align: right }

div.one-piece-grid { display: inline-grid }


div.form-table label {
	text-align: right;
	align-self: center;
}/* div.form-table */


/**** Proving Ground **** /


div.tree-style {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}/* div.tree-style * /


div.tree-branch {
	display: flex;
	flex-direction: column;
}/* div.tree-branch */

/*
div.tree-list > * { 
	display: flex;
	justify-content: flex-end;
	align-items: center;
}/* div.tree-list > * * /


div.tree-list div.tree-notes {
	justify-content: flex-start;
	white-space: break-spaces;
	padding-left: 1em;
}/* div.tree-list div.tree-notes */



div.tree-list div { border: solid 1px red }

div.tree-list div.item-cell { margin: 0 0.5em }


div.ttable { border: solid 1px blue }

div.llist {
	display: grid;
	grid-template-columns: repeat(3, min-content);
}