/* Basic */

* {
	margin: 0;
	padding: 0;
}
body {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 12px;
}
h1 {
	font-size: 24px;
}
h2 {
	font-size: 18px;
}
h3 {
	font-size: 14px;
}
p {
	line-height: 16px;
}
ul {
	line-height: 16px;
	margin-left: 24px;
}
.hidden {
	display: none !important;
}

/* Header */

header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 40px;
	line-height: 40px;
	overflow: hidden;
}
header .appname {
	position: absolute;
	top: 0;
	left: 20px;
	bottom: 0;
	line-height: 40px;
}
header .pagename {
	position: absolute;
	top: 0;
	left: 20px;
	bottom: 0;
	line-height: 40px;
}
header .appname + .pagename {
	left: 236px;
}
header .header-items {
	position: absolute;
	top: 0;
	right: 20px;
	bottom: 0;
	line-height: 40px;
}
header .header-item {
	display: inline;
}
header .header-item:not(:first-child):before {
	content: "\00A0\00A0\00B7\00A0\00A0";
}

/* Navigation */

nav {
	position: absolute;
	top: 40px;
	left: 0;
	bottom: 0;
	width: 220px;
	overflow: auto;
}
nav > ul {
	margin: 10px;
	list-style-type: none;
}
nav > ul > li {
	margin: 4px 0;
}

/* Content */

article {
	position: absolute;
	top: 40px;
	left: 0;
	right: 0;
	bottom: 0;
	overflow: auto;
}
nav + article {
	left: 220px;
}

/* Cards */

.card {
	display: block;
	margin: 16px;
	overflow: hidden;
}
.card .card-title {
	padding: 8px 16px;
}
.card .card-content {
	/* break margin collapse */
	overflow: auto;
	padding: 0 16px;
}
.card .card-content > h1,
.card .card-content > h2,
.card .card-content > h3,
.card .card-content > p,
.card .card-content > table,
.card .card-content > div.spacing,
.card .card-content > .cm-error-box,
.card .card-content > .cm-warning-box,
.card .card-content > .cm-success-box,
.card .card-content > .cm-note-box {
	margin: 16px 0;
}
.card .card-content hr {
	margin-left: -16px;
	margin-right: -16px;
}
.card .card-buttons {
	padding: 8px;
	text-align: center;
}

/* Notification Boxes */

.cm-error-box {
	border: solid 1px #c00;
	background: #fcc;
	padding: 12px;
	color: black;
}
.cm-warning-box {
	border: solid 1px #cc0;
	background: #ffc;
	padding: 12px;
	color: black;
}
.cm-success-box {
	border: solid 1px #0c0;
	background: #cfc;
	padding: 12px;
	color: black;
}
.cm-note-box {
	border: solid 1px #08c;
	background: #cef;
	padding: 12px;
	color: black;
}
.cm-error-box > h1, .cm-warning-box > h1, .cm-success-box > h1, .cm-note-box > h1,
.cm-error-box > h2, .cm-warning-box > h2, .cm-success-box > h2, .cm-note-box > h2,
.cm-error-box > h3, .cm-warning-box > h3, .cm-success-box > h3, .cm-note-box > h3 {
	margin-bottom: 12px;
}

/* Tables */

th, td {
	padding: 4px 1em 4px 4px;
	text-align: left;
}
.td-numeric {
	text-align: right;
}
.td-actions {
	width: 1px;
	white-space: nowrap;
	text-align: right;
}
.td-actions form {
	display: inline;
}

/* Forms */

.cm-form-table > tbody > tr > th {
	text-align: right;
}
.cm-form-table > tbody > tr > th.th-tall {
	vertical-align: top;
	padding-top: 6px;
}
.cm-form-table > tbody > tr > th > label {
	white-space: nowrap;
}
.cm-form-table > tbody > tr > td > h1 + p,
.cm-form-table > tbody > tr > td > h2 + p {
	margin-top: 4px;
}
.cm-form-table > tbody > tr > td > h3 + p,
.cm-form-table > tbody > tr > td > p + p {
	margin-top: 6px;
}
.cm-form-table > tbody > tr > td > p.cm-question-title {
	font-weight: bold;
}

/* Form Elements */

input[type=text],
input[type=password],
input[type=email],
input[type=url] {
	padding: 3px;
	width: 200px;
}
input[type=date],
input[type=time] {
	padding: 1px;
	width: 120px;
	font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
}
input[type=datetime],
input[type=datetime-local] {
	padding: 1px;
	width: 180px;
	font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
}
input[type=number] {
	padding: 3px;
	width: 116px;
}
input[type=checkbox],
input[type=radio] {
	margin: 4px;
}
input[type=color] {
	padding: 1px 2px;
}
textarea {
	padding: 3px;
	width: 300px;
	height: 60px;
}
button,
a.button,
input[type=submit],
input[type=reset] {
	background: #eee;
	padding: 4px 8px;
	border: solid 1px #ccc;
	border-radius: 3px;
	margin-right: 4px;
	font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
	font-size: 11px;
	font-weight: normal;
	line-height: normal;
}
button:active,
a.button:active,
input[type=submit]:active,
input[type=reset]:active {
	background: #ccc;
	border: solid 1px #aaa;
}
a.button,
a.button:link,
a.button:focus,
a.button:hover,
a.button:active,
a.button:visited {
	display: inline-block;
	color: black;
	text-decoration: none;
	cursor: default;
}
.td-actions button:last-child,
.td-actions a.button:last-child,
.td-actions input[type=submit]:last-child,
.td-actions input[type=reset]:last-child {
	margin-right: 0;
}
label {
	-webkit-touch-callout: none;
	user-select: none;
}
select {
	background: #f8f8f8;
	padding: 4px 8px;
	border: solid 1px #ccc;
	border-radius: 3px;
	height: 24px;
	font-family: "Lucida Grande", Helvetica, Arial, sans-serif;
	font-size: 11px;
	line-height: 16px;
}

/* Form Validation */

.error {
	font-weight: bold;
	color: red;
}

/* List Pages */

.cm-search-box {
	display: block;
	margin: 0 0 16px 0;
	padding: 8px;
	overflow: hidden;
}
.cm-search-box .cm-search-input {
	float: left;
	white-space: nowrap;
}
.cm-search-box .cm-search-options {
	text-align: right;
	white-space: nowrap;
}
.cm-search-box .cm-search-input > *,
.cm-search-box .cm-search-options > * {
	margin: 0 3px;
}
.cm-search-box .cm-search-options button {
	font-weight: bold;
	font-size: 16px;
	line-height: 13px;
	padding: 3px 6px 5px 6px;
}
.cm-list-table {
	display: block;
	margin: 16px;
	overflow: auto;
}
.cm-list-table table {
	width: 100%;
}
.cm-list-table table th:first-child,
.cm-list-table table td:first-child {
	padding-left: 1em;
}
.cm-list-table table thead th {
	padding-top: 6px;
	padding-bottom: 6px;
	white-space: nowrap;
}
.cm-list-table table .th-sortable {
	-webkit-touch-callout: none;
	user-select: none;
	cursor: pointer;
}
.cm-list-table table .th-sortable:focus,
.cm-list-table table .th-sortable:hover {
	text-decoration: underline;
}
.cm-list-table table .th-sort-ascending:after {
	content: "\25B4";
}
.cm-list-table table .th-sort-ascending.th-sort-primary:after {
	content: "\25B2";
}
.cm-list-table table .th-sort-descending:after {
	content: "\25BE";
}
.cm-list-table table .th-sort-descending.th-sort-primary:after {
	content: "\25BC";
}
.cm-list-table table .th-sort-ascending:after,
.cm-list-table table .th-sort-descending:after {
	display: inline-block;
	font-family: "Apple Symbols", "Segoe UI Symbol", "Lucida Sans Unicode", serif;
	font-size: 14px;
	line-height: 1px;
	padding-left: 8px;
}
.cm-list-table table .activate-button,
.cm-list-table table .deactivate-button {
	width: 76px;
}
.cm-list-table-containing-cell {
	padding: 4px;
	max-width: 1px;
}
.cm-list-table-containing-cell .cm-list-table {
	margin: 0;
}
/* Flexbox makes the cm-search-box look much nicer,
   so let's use it if the browser supports it. */
.cm-search-page {
	display: flex;
	flex-direction: column;
}
.cm-search-box {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	margin: 0;
}
.cm-search-box .cm-search-input {
	display: flex;
	align-items: center;
	flex: 1 1 0;
}
.cm-search-box .cm-search-input input {
	flex: 1 1 0;
}
.cm-search-box .cm-search-options {
	display: flex;
	align-items: center;
	flex: 0 0 0;
}

/* Special Columns */

.email-subbed {
	white-space: nowrap;
}
.email-subbed .subscribed {
	display: inline-block;
	width: 10px;
	text-align: center;
}
.email-subbed .subscribed.subscribed-true {
	color: green;
}
.email-subbed .subscribed.subscribed-false {
	color: red;
}
.cm-status-label.cm-status-incomplete,
.cm-status-label.cm-status-submitted {
	color: blue;
}
.cm-status-label.cm-status-cancelled {
	color: gray;
}
.cm-status-label.cm-status-rejected {
	color: red;
}
.cm-status-label.cm-status-completed,
.cm-status-label.cm-status-accepted {
	color: green;
}
.cm-status-label.cm-status-refunded,
.cm-status-label.cm-status-waitlisted {
	color: orange;
}

/* Form Editor Pages */

.cm-form-editor {
	display: block;
	margin: 16px;
	padding: 16px;
	overflow: auto;
}
.cm-form-editor table {
	width: 100%;
}
.cm-form-editor table th {
	width: 200px;
}
.cm-form-editor table th:last-child,
.cm-form-editor table td:last-child {
	padding-right: 4px;
}
.cm-form-editor table .cm-form-editor-custom-text-section .view-row {
	cursor: pointer;
}
.cm-form-editor table .cm-form-editor-custom-text-section .view-area:empty:after {
	content: "Click to add explanatory text.";
	color: blue;
	font-weight: bold;
	font-style: italic;
}
.cm-form-editor table .cm-form-editor-custom-text-section textarea {
	width: calc(100% - 8px);
}
.cm-form-editor table .cm-form-editor-dynamic-row,
.cm-form-editor table .cm-form-editor-dynamic-row * {
	cursor: pointer;
}
.cm-form-editor table .cm-form-editor-dynamic-row .cm-question-title:empty:after {
	content: "Untitled Title";
	color: gray;
	font-style: italic;
}
.cm-form-editor table .cm-form-editor-dynamic-row .cm-question-text:empty:after {
	content: "Untitled explanatory text.";
	color: gray;
	font-style: italic;
}
.cm-form-editor table .cm-form-editor-dynamic-row label:empty:after {
	content: "Untitled Question";
	color: gray;
	font-style: italic;
}
.cm-form-editor table .cm-form-editor-row-editor-row.ear-visible-advanced label,
.cm-form-editor table .cm-form-editor-row-editor-row.ear-required-advanced label {
	display: block;
	padding-left: 2em;
}
.cm-form-editor table .cm-form-editor-dynamic-section-actions tr {
	color: blue;
	font-weight: bold;
	font-style: italic;
	cursor: pointer;
}
.cm-form-editor table hr {
	margin: 12px -20px;
}

/* Mail Template Editor Pages */

.cm-mail-editor td input {
	width: 390px;
}
.cm-mail-editor td textarea {
	width: 392px;
	height: 160px;
}
.cm-mail-editor td iframe {
	border: solid 1px gray;
	width: 398px;
	height: 160px;
}

/* Dialogs */

.dialog-cover {
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: rgba(0, 0, 0, 0.6);
}
.dialog {
	display: block;
	position: fixed;
	top: 25%;
	left: 50%;
	width: 512px;
	max-height: 50%;
	margin-left: -256px;
	overflow: auto;
}
.dialog.edit-dialog,
.dialog.shortcuts-dialog {
	top: 10%;
	max-height: 80%;
}
.dialog .dialog-title {
	padding: 8px 16px;
}
.dialog .dialog-content {
	/* break margin collapse */
	overflow: hidden;
}
.dialog .dialog-content > h1,
.dialog .dialog-content > h2,
.dialog .dialog-content > h3,
.dialog .dialog-content > p,
.dialog .dialog-content > table,
.dialog .dialog-content > div.spacing {
	margin: 16px;
}
.dialog .dialog-buttons {
	padding: 8px;
	text-align: right;
}
.dialog.shortcuts-dialog .kbd {
	display: inline-block;
	border: 3px outset #ccc;
	background: #eee;
	padding: 1px 4px;
	color: black;
	min-width: 10px;
	text-align: center;
	margin: -2px 0;
}
.dialog.shortcuts-dialog .kbdw {
	min-width: 32px;
}

/* Butterbar */

.butterbar {
	position: fixed;
	top: 0;
	left: 50%;
	width: 512px;
	height: 20px;
	line-height: 20px;
	margin-left: -256px;
	background: #ffc;
	border: #996;
	border-radius: 0 0 4px 4px;
	box-shadow: 0 2px 2px gray;
	text-align: center;
	color: black;
}

/* Admin Login Page */

.card.cm-login,
.card.cm-logout,
.card.cm-unauthorized {
	text-align: center;
}
.card.cm-login table {
	margin-left: auto;
	margin-right: auto;
}
.card.cm-login .cm-error-box {
	width: 300px;
	margin-left: auto;
	margin-right: auto;
}

/* Admin Home Page */

.card.cm-home .card-content > h3 {
	margin-bottom: 8px;
}
.card.cm-home .card-content > h3 + p {
	margin-top: 8px;
}
.card.cm-home .card-content > p.cm-unauthorized {
	text-align: center;
}

/* Admin Users Page */

.cm-form-table.cm-user-editor tbody td hr {
	margin: 2px 0;
}

/* Registration Page */

.cm-reg-edit .card-content {
	position: relative;
}
.cm-reg-edit .cm-reg-badge-types {
	position: absolute;
	top: 16px;
	left: 50%;
	right: 16px;
	bottom: 16px;
	overflow: auto;
	margin-left: 16px;
}
.cm-reg-edit .cm-reg-badge-types hr {
	margin: 0;
}
.cm-reg-edit .cm-reg-badge-types h1,
.cm-reg-edit .cm-reg-badge-types h2,
.cm-reg-edit .cm-reg-badge-types h3,
.cm-reg-edit .cm-reg-badge-types p,
.cm-reg-edit .cm-reg-badge-types ul {
	margin: 8px;
}
.cm-reg-edit .cm-reg-badge-types ul {
	margin-left: 32px;
}
.cm-reg-edit .cm-reg-badge-types label {
	display: inline-block;
	width: 120px;
}
.cm-reg-edit .cm-reg-badge-types .limited {
	font-weight: bold;
	color: red;
}
.cm-reg-edit .cm-reg-badge-type-unavailable,
.cm-reg-edit .cm-reg-badge-type-selected {
	padding-top: 1px;
	padding-bottom: 1px;
	margin-top: -1px;
	margin-bottom: -1px;
}
.cm-reg-edit table {
	width: 100%;
}
.cm-reg-edit-no-errors table {
	width: 50%;
}
.cm-reg-edit table th {
	width: 220px;
}
.cm-reg-edit table td.hr {
	padding: 0;
}
.cm-reg-edit table td.hr hr {
	margin: 16px -16px;
}
.cm-reg-edit table span.error {
	padding-left: 1em;
}
.cm-reg-edit table div.error {
	padding-top: 8px;
}
.cm-reg-edit .cm-reg-addon p,
.cm-reg-edit .cm-reg-upgrade p {
	margin: 8px 0;
}
.cm-reg-edit .cm-reg-addon label {
	font-weight: bold;
}
.cm-reg-edit .cm-reg-addon .cm-reg-addon-desc,
.cm-reg-edit .cm-reg-upgrade .cm-reg-upgrade-desc {
	margin: 8px 40px;
}
.cm-reg-edit .cm-reg-addon .disabled {
	opacity: 0.5;
}

/* Shopping Cart Page */

table.cm-cart th,
table.cm-cart td {
	white-space: nowrap;
}
table.cm-cart td:not(.td-actions) {
	padding-top: 8px;
	padding-bottom: 8px;
}
.cm-cart-addon-name {
	padding-left: 16px;
}
.cm-cart-addon-name:before {
	content: '+';
	display: inline-block;
	width: 24px;
}
.cm-cart-addon-error {
	padding-left: 40px;
}

/* Entity Edit Page */

.cm-add-to-blacklist {
	font-weight: bold;
	color: red;
}
.cm-mail-alias-admonishment {
	display: block;
	padding-top: 4px;
}

/* Statistics Page */

.cm-statistics .cm-stat-corner,
.cm-statistics .cm-stat-row {
	width: 200px;
	cursor: pointer;
}
.cm-statistics .cm-stat-col,
.cm-statistics .cm-stat {
	width: 80px;
	cursor: pointer;
}

/* Org Chart Page */

.cm-list-table table tr.cm-orgchart-staff-level-0 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-0 td:first-child {
	padding-left: 1em;
}
.cm-list-table table tr.cm-orgchart-staff-level-1 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-1 td:first-child {
	padding-left: 2em;
}
.cm-list-table table tr.cm-orgchart-staff-level-2 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-2 td:first-child {
	padding-left: 3em;
}
.cm-list-table table tr.cm-orgchart-staff-level-3 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-3 td:first-child {
	padding-left: 4em;
}
.cm-list-table table tr.cm-orgchart-staff-level-4 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-4 td:first-child {
	padding-left: 5em;
}
.cm-list-table table tr.cm-orgchart-staff-level-5 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-5 td:first-child {
	padding-left: 6em;
}
.cm-list-table table tr.cm-orgchart-staff-level-6 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-6 td:first-child {
	padding-left: 7em;
}
.cm-list-table table tr.cm-orgchart-staff-level-7 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-7 td:first-child {
	padding-left: 8em;
}
.cm-list-table table tr.cm-orgchart-staff-level-8 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-8 td:first-child {
	padding-left: 9em;
}
.cm-list-table table tr.cm-orgchart-staff-level-9 td:first-child,
.cm-list-table table tr.cm-orgchart-dept-level-9 td:first-child {
	padding-left: 10em;
}
.cm-list-table table tr.cm-orgchart-staff-level-10 td:first-child {
	padding-left: 11em;
}

/* Badge Artwork */

.cm-badge-artwork {
	display: inline-block;
	width: 100px;
	height: 120px;
	margin: 4px;
	padding: 4px;
	background: rgba(0, 0, 0, 0.1);
	-webkit-touch-callout: none;
	user-select: none;
	cursor: pointer;
}
.cm-badge-artwork.active {
	background: rgba(51, 123, 255, 0.5);
}
.cm-badge-artwork .cm-badge-artwork-image {
	display: block;
	width: 100px;
	height: 100px;
}
.cm-badge-artwork .cm-badge-artwork-name {
	display: block;
	width: 100px;
	height: 20px;
	line-height: 20px;
	font-size: 10px;
	text-align: center;
	white-space: nowrap;
	overflow: hidden;
}

/* Reindex Pages */

.progress-track {
	display: inline-block;
	position: relative;
	width: 200px;
	height: 12px;
	background: #ccf;
	border: solid 1px black;
	margin: -3px 2em -3px 2em;
}
.progress-bar {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 0;
	bottom: 0;
	background: #444;
}

/* Printable */

@media print {
	header, nav {
		display: none !important;
	}
	article {
		display: block !important;
		position: static !important;
	}
}