.clear {
	clear: both;
}

.corners {
	border-radius: 2.5px;
}

.extra {
	color: var(--gr-ntr);
	font-size: 0.7em;
}

.hide {
	visibility: hidden;
}

.message {
	background-color: var(--st);
	border-radius: 2.5px;
	color: var(--wh);
	display: block;
	margin: 2em auto;
	padding: 0.25em 0.5em;
	text-transform: uppercase;
	width: fit-content;
}

.mono-space {
	font-family: "Open Sans";
	font-variant-numeric: tabular-nums;
}

.pill{
	background-color: var(--gr-lgh);
	border-radius: 50px;
	color: var(--st);
}

.quote {
	font-style: italic;
}

.quote:before, .quote:after {
	content: '"';
}

.scroll {
	overflow-y: scroll;
}

.small {
	border: none;
	display: inline;
	font-size: 0.6em;
	margin: 0!important;
	padding: 0 0.75em 0 0.25em!important;
	position: relative;
	top: 1px;
}

/* Notices */

.notice {
	color: var(--gr-ntr);
	font-size: 0.8em;
	font-style: italic;
}

.info::before {
	content: "\f05a";
	font-family: FontAwesome, "Font Awesome 5 Free", "Font Awesome 5 Brands";
	font-style: normal;
	margin-right: 0.5em;
}

.info {
	border-radius: 2.5px;
}

.warning::before {
	content: "\f06a";
	font-family: FontAwesome, "Font Awesome 5 Free", "Font Awesome 5 Brands";
	margin-right: 0.5em;
}

.warning {
	color: var(--ng);
	font-size: 0.8em;
	font-weight: 800;
	margin: 0.5em 0;
}

/* Links */

.active {
	color: var(--st);
}

.n-a {
	cursor: not-allowed;
	opacity: 0.25;
}

/* Buttons */

.default-cursor {
	cursor: default;
}

.fake, .fake:hover {
	background-color: var(--gr-ntr);
	cursor: not-allowed;
}

/* Forms */

.asterisk {
	color: var(--st);
	font-size: 0.7em;
	margin-left: 5px;
	margin-right: 10px;
}

.error {
	border-radius: 2.5px;
	color: var(--ng);
	font-size: 0.8em;
	font-weight: 800;
	margin-top: 1em;
	position: relative;
}

.input {
	border: 1px solid var(--gr-ntr);
	min-width: 240px;
	text-align: center;
	width: 100%;
}

.input:read-only {
	background-color: var(--gr-lgh);
	border: 1px solid var(--gr-lgh);
	color: var(--gr-drk);
}

.no-margin, .no-margin td, .no-margin th {margin: 0!important;}
.no-padding, .no-padding td, .no-padding th {padding: 0!important;}

.no-select {
	user-select: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
}

.pattern tr:nth-child(2n+0) {
	background-color: var(--gr-lgh);
}

.succes {
	border-radius: 2.5px;
	display: inline-block;
	line-height: 2;
	padding: 0.5em;
}

/* Filters */

.filter-container {
	background-color: var(--rd);
	display: inline-block;
	margin-bottom: 1em;
}

.filter-icon {
	display: inline-block;
}

.filter-icon:after {
	color: var(--wh);
	content: "\f150";
	font-family: FontAwesome, "Font Awesome 5 Free", "Font Awesome 5 Brands";
	margin-right: 0.5em;
}

.filter-input, .filter-input::placeholder {
	background-color: var(--rd);
	border: none;
	color: var(--wh);
	cursor:  pointer;
	font-weight: 800;
	padding-bottom: 8px;
	padding-left: 0.5em;
	padding-top: 8px;
	width: auto;
}

.filter-button {
	border: 1px solid var(--bl);
	box-shadow: none;
	margin: 0;
}

.filter-button:hover {
	background-color: var(--bl);
}

/* Tables */

.empty-row {
	padding-top: 2em;
}

.total-row {
	background-color: var(--rd)!important;
	color: var(--wh);
	font-style: normal;
	font-weight: 800;
}

/* Tabs */

.tab, .tab a, .tab a:hover {
	color: var(--wh);
}

.tab {
	background-color: var(--st);
	border-radius: 2.5px;
	display: inline-block;
	font-weight: 500;
	line-height: 1;
	padding: 0.5em 1em;
	text-transform: uppercase;
	white-space: nowrap;
}

a:hover .tab {
	background-color: var(--bl);
	transition: 0.75s;
}

a .tab {
	color: var(--wh);
}

.tab-l {margin: 0 0.5em 0.5em 0;}
.tab-r {margin: 0 0 0.5em 0.5em;}

/* Thumbnails */

.thumbnail-sm {
	height: auto;
	max-width: 256px;
	width: auto;
}

.thumbnail-md {
	height: auto;
	max-width: 512px;
	width: auto;
}

.thumbnail-lg {
	height: auto;
	max-width: 1024px;
	width: auto;
}

/* Shadows */

.shadow {box-shadow: 0px 6px 20px rgba(0,0,0,.25);}
.no-shadow {box-shadow: none;}

/* Branding */

	/* Color */

	.bl {color: var(--bl);}
	.wh {color: var(--wh);}
	.ps {color: var(--ps);}
	.ng {color: var(--ng);}
	.st {color: var(--st);}
	.nd {color: var(--nd);}
	.rd {color: var(--rd);}
	.th {color: var(--th);}

	.gr-lgh {color: var(--gr-lgh);}
	.gr-ntr {color: var(--gr-ntr);}
	.gr-drk {color: var(--gr-drk);}

	/* Background Color */

	.bl-bg {background-color: var(--bl)!important;}
	.bl-bg, .bl-bg a, .bl-bg a:hover .bl-bg::placeholder {color: var(--wh)!important;}

	.wh-bg {background-color: var(--wh)!important;}
	.wh-bg, .wh-bg a, .wh-bg a:hover .wh-bg::placeholder {color: var(--bl)!important;}

	.ps-bg {background-color: var(--ps)!important;}
	.ps-bg, .ps-bg a, .ps-bg a:hover .ps-bg::placeholder {color: var(--wh)!important;}

	.ng-bg {background-color: var(--ng)!important;}
	.ng-bg, .ng-bg a, .ng-bg a:hover .ng-bg::placeholder {color: var(--wh)!important;}

	.st-bg {background-color: var(--st)!important;}
	.st-bg, .st-bg a, .st-bg a:hover .st-bg::placeholder {color: var(--wh)!important;}

	.nd-bg {background-color: var(--nd)!important;}
	.nd-bg, .nd-bg a, .nd-bg a:hover .nd-bg::placeholder {color: var(--bl)!important;}

	.rd-bg {background-color: var(--rd)!important;}
	.rd-bg, .rd-bg a, .rd-bg a:hover .rd-bg::placeholder {color: var(--bl)!important;}

	.th-bg {background-color: var(--th)!important;}
	.th-bg, .th-bg a, .th-bg a:hover .th-bg::placeholder {color: var(--bl)!important;}

	.gr-regular-bg {background: var(--gr-regular)!important;}
	.gr-regular-bg, .gr-regular-bg a, .gr-regular-bg a:hover .gr-regular-bg::placeholder {color: var(--wh)!important;}

	.gr-stretch-bg {background: var(--gr-stretch)!important;}
	.gr-stretch-bg, .gr-stretch-bg a, .gr-stretch-bg a:hover .gr-stretch-bg::placeholder {color: var(--wh)!important;}

	.gr-lgh-bg {background-color: var(--gr-lgh)!important;}
	.gr-lgh-bg, .gr-lgh-bg a, .gr-lgh-bg a:hover .gr-lgh-bg::placeholder {color: var(--bl)!important;}

	.gr-ntr-bg {background-color: var(--gr-ntr)!important;}
	.gr-ntr-bg, .gr-ntr-bg a, .gr-ntr-bg a:hover .gr-ntr-bg::placeholder {color: var(--wh)!important;}

	.gr-drk-bg {background-color: var(--gr-drk)!important;}
	.gr-drk-bg, .gr-drk-bg a, .gr-drk-bg a:hover .gr-drk-bg::placeholder {color: var(--wh)!important;}

	.bl-bg a, .wh-bg a, .ps-bg a, .ng-bg a, .st-bg a, .nd-bg a, .rd-bg a, .th-bg a, .gr-regular-bg a, .gr-stretch-bg a, .gr-lgh-bg a, .gr-ntr-bg a, .gr-drk-bg a {
		font-weight: 500;
		text-decoration: underline;
	}

	/* Box Color */

	.bl-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--bl)!important;
		color: var(--bl);
		font-weight: 800;
	}

	.wh-bx {
		background-color: var(--bl)!important;
		outline: 2px solid var(--wh)!important;
		color: var(--wh);
		font-weight: 800;
	}

	.ps-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--ps)!important;
		color: var(--ps);
		font-weight: 800;
	}

	.ng-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--ng)!important;
		color: var(--ng);
		font-weight: 800;
	}

	.st-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--st)!important;
		color: var(--st);
		font-weight: 800;
	}

	.nd-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--nd)!important;
		color: var(--nd);
		font-weight: 800;
	}

	.rd-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--rd)!important;
		color: var(--rd);
		font-weight: 800;
	}

	.th-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--th)!important;
		color: var(--th);
		font-weight: 800;
	}

	.gr-lgh-bx {
		background-color: var(--bl)!important;
		outline: 2px solid var(--gr-lgh)!important;
		color: var(--gr-lgh);
		font-weight: 800;
	}

	.gr-ntr-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--gr-ntr)!important;
		color: var(--gr-ntr);
		font-weight: 800;
	}

	.gr-drk-bx {
		background-color: var(--wh)!important;
		outline: 2px solid var(--gr-drk)!important;
		color: var(--gr-drk);
		font-weight: 800;
	}