@font-face {
    font-family: Sigmar;
    src: url(res/Sigmar-Regular.ttf) format("truetype");
}
:root {
	--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";;
	--title-font: Sigmar;
	--hero_shade: #1F5983;
	--background: #FCFCFC;
	--footer_background: #e3e3e3;
	--text: #0D1017;
	--dull: #445479;
	--error: #D95757;
	--success: #DFFF80;
	--border: rgba(0, 0, 0, 0.3);
	--border_darker: rgba(0, 0, 0, 0.6);
	--accent: #DFFF80;
	--highlight: #DFFF8044;
}
/*@media(prefers-color-scheme: dark) {*/
	:root {
		--background: #0D1017;
		--footer_background: #1f2637;
		--text: #FCFCFC;
		--dull: #b0b0b0;
		--border: rgba(255, 255, 255, 0.3);
		--border_darker: rgba(255, 255, 255, 0.6);
		--highlight: #AAD94C44;
	}
/*}
*/

body {
	margin: 0;
	padding: 0;
	font-family: var(--font);
	height: 100vh;
	background: var(--background);
	color: var(--text);
}



.navBtn {
	position: fixed;
	top: 13px;
	right: 20px;
	height: 24px;
	width: 32px;
	cursor: pointer;
	display: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	z-index: 3;
}
.navBtn > span {
	width: 100%;
	height: 4px;
	position: absolute;
	left: 0;
	border-radius: 4px;
	background: var(--text);
	transition: opacity .3s, transform .3s;
}
.navBtn > span:nth-child(1) {top: 0;}
.navBtn > span:nth-child(2) {top: calc(50% - 2px);}
.navBtn > span:nth-child(3) {top: calc(100% - 4px);}
.navBtn.active > span:nth-child(1) {top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%) rotate(45deg);-moz-transform: translate(-50%,-50%) rotate(45deg);-ms-transform: translate(-50%,-50%) rotate(45deg);-o-transform: translate(-50%,-50%) rotate(45deg);transform: translate(-50%,-50%) rotate(45deg);}
.navBtn.active > span:nth-child(2) {opacity: 0;}
.navBtn.active > span:nth-child(3) {top: 50%;left: 50%;-webkit-transform: translate(-50%,-50%) rotate(-45deg);-moz-transform: translate(-50%,-50%) rotate(-45deg);-ms-transform: translate(-50%,-50%) rotate(-45deg);-o-transform: translate(-50%,-50%) rotate(-45deg);transform: translate(-50%,-50%) rotate(-45deg);}

.header {
	height: 50px;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	display: grid;
	align-items: center;
	grid: 1fr / auto 1fr;
	box-sizing: border-box;
	padding: 0 20px;
	pointer-events: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	z-index: 2;
}
.header_logo {
	-webkit-pointer-events: all;
	-moz-pointer-events: all;
	-ms-pointer-events: all;
	-o-pointer-events: all;
	pointer-events: all;
	font-size: 2em;
	font-size: bold;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.header_nav {
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
}
.header_nav > span {
	margin: 0 15px;
	box-sizing: border-box;
	position: relative;
	-webkit-pointer-events: all;
	-moz-pointer-events: all;
	-ms-pointer-events: all;
	-o-pointer-events: all;
	pointer-events: all;
}
.header_nav > span a {
	text-transform: uppercase;
	letter-spacing: 1px;
	color: inherit;
	text-decoration: none;
	display: block;
}
.about_paragraph a, .article a, .albumDescription a {
	position: relative;
	color: var(--accent);
	text-decoration: none;
	cursor: pointer;
}
.header_nav > span:before, .dash_page a:before, .about_paragraph a:before, .article a:before, .albumDescription a:before {
	content: "";
	position: absolute;
	height: 100%;
	width: 0;
	top: 0;
	left: 50%;
	border-bottom: 1px solid;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	transition: width .3s;
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
}
.header_nav > span:hover:before, .dash_page a:hover:before, .about_paragraph a:hover:before, .article a:hover:before, .albumDescription a:hover:before {
	width: 100%;
}


.hero {
	width: 100%;
	padding: 150px 20px;
	box-sizing: border-box;
	overflow: hidden;
	position: relative;
	display: grid;
	align-items: center;
	justify-content: center;
}
.heroImage {
	position: absolute;
	top:  0;
	left: 0;
	height: 100%;
	width: 100%;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	z-index: -1;
	pointer-events: none;
	opacity: 0;
	transition: opacity 3s;
}
.heroImage.top {
	opacity: 1;
}
.hero:after {
	content: "";
	position: absolute;
	top: 0;left: 0;right: 0;bottom: 0;
	z-index: -1;
}
.hero:after {
	background: var(--hero_shade);
	opacity: .5;
}
.hero h1 {
	font-size: 5em;
	color: white;
	font-weight: bold;
	font-family: var(--title-font);
	margin: 0;
	text-align: center;
}
#test {
    position: absolute;
    bottom: 0;
    height: 40%;
    left: 0;
    filter: drop-shadow(1px 1px 0px 4px red);
}

.section {
	width: 100%;
	padding: 50px 20px;
	box-sizing: border-box;
}
.section.centered {
	text-align: center;
}
.section h2 {
	font-weight: bold;
	font-size: 3em;
	padding: 0 20px;
	box-sizing: border-box;
	margin: 0 0 10px 0;
}
.section > p {
	width: 100%;
	max-width: 600px;
	text-align: center;
	padding: 5px 20px;
	box-sizing: border-box;
	display: inline-block;
}

#newsPreviewWrapper, #searchResults {
	width: 100%;
	padding: 20px 0;
	box-sizing: border-box;
	display: flex;
	flex-wrap:  wrap;
	justify-content: center;
	align-items: flex-start;
}
.newsPreview {
	width: 100%;
	max-width: 250px;
	position:  relative;
	display: inline-block;
	padding:  20px;
	margin:  20px;
	text-align: left;
	border:  1px solid var(--border);
	color:  inherit;
	text-decoration:  none;
	border-radius:  4px;
	overflow: hidden;
	word-break:break-word;
	cursor: pointer;
	transition: background .3s, border-color .3s, box-shadow .3s;
}
.newsPreview.large {
	max-width: 100%;
	margin:  20px;
	display: grid;
	grid: 1fr / 250px 1fr;
	grid-gap:  20px;
	background: var(--background) !important;
	border:  none;
	cursor: default;
}
.newsPreview img {
	width: 100%;
	border-radius: 4px;
}
.newsPreview:hover, .newsPreview:active {
	background:  var(--highlight);
	border-color: var(--border_darker);
}
.newsPreview:active {
	box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.1);
}
.newsPreview .newsHeader {
	margin: 0;
	font-size: 1.2em;
	font-weight: bold;
	transition: color .3s;
}
.newsHeader b {
	color:  var(--accent);
}
.newsPreview .newsDate {
	margin: 0;
	display: block;
	font-size: .75em;
	color: var(--dull);
	letter-spacing: 1px;
	text-transform: uppercase;
}
.newsPreview .newsContent {
	font-size:  .9em;
	margin:  5px 0 0 0;
}


.centerme {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.btn {
	padding: 15px 40px;
	margin: 10px;
	text-transform: uppercase;
	font-size: .9em;
	letter-spacing: 1px;
	color: inherit;
	text-decoration: none;
	box-sizing: border-box;
	border: 1px solid var(--border);
	border-radius: 4px;
	display: inline-block;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	cursor: pointer;
	transition: .3s background, .3s border-color, box-shadow .3s;
}
.btn.danger {
	color: var(--error);
}
.btn:hover, .btn:active {
	border-color: var(--border_darker);
	background: var(--highlight);
}
.btn:active {
	box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.1);
}
.btn.small {
	padding: 10px 20px;
	margin: 20px 0;
}

.emptyNews {
	min-height: 50vh;
}

#searchBar {
	max-width:  500px;
	display:  inline-block;
	background:  var(--footer_background);
	border-radius:  4px;
	border:  1px solid var(--border);
	padding:  12px;
	font-size:  1em;
}


.album {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}
.albumCoverWrapper {
	flex: 1;
	padding: 20px;
	box-sizing: border-box;
	max-width: 600px;
}
.albumCover {
	max-height: 100%;
	max-width: 100%;
	border-radius: 4px;
}
.albumInfo {
	flex: 1;
	max-width: 600px;
	padding: 20px;
	box-sizing: border-box;
}
.albumTitle {
	font-size: 2em;
	font-weight: bold;
	margin: 0 0 15px 0;
}
.albumDescription {
	margin: 10px 0;
}
.albumLinks {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: -20px;
    padding: 0 0 20px 0;
    flex-wrap: wrap;
}
.albumLinks > a {
    text-decoration: none;
    height: 48px;
    width: 48px;
    margin: 10px 20px;
    transition: transform .3s;
}
.albumLinks > a > svg, .albumLinks > a > img {
    height: 100%;
    width: 100%;
}
.albumLinks > a:hover, .albumLinks > a:active {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}


.songGrid {
	display: flex;
	align-items: flex-start;
	flex-wrap: wrap;
	padding: 50px 40px;
	grid-gap:  40px;
}
.songGrid > div {flex: 1;box-sizing:  border-box;position: relative}
.songGrid > div:first-child {
	min-width: 400px;
	border-radius:  4px;
	overflow: hidden;
	text-align:  center;
	padding:  40px;
}
.albumGrid {
	display: grid;
	grid:  1fr / 1fr 1fr;
	margin-top:  20px;
}
.albumGrid > div {
	text-align: center;
}
.albumGrid > div > div {
	display:  inline-block;
	text-align: left;
}
.albumGrid span {
	position: relative;
	padding: 10px;
	margin:  10px 0;
	font-size:  1.1em;
	display: inline-block;
	cursor: pointer;
	white-space: pre;
	text-overflow: ellipsis;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	transition:  color .5s;
}
.albumGrid span:before {
	content: "";
	height: calc(100% - 12px);
	width: 0;
	position: absolute;
	top: 0;
	left: 50%;
	border-bottom: 2px solid;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	transition: width .5s;
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
}
.albumGrid span.selected {
	color: var(--accent);
}
.albumGrid span.selected:before {
	width: calc(100% - 20px);
}
.albumGrid span:hover {
	color: var(--accent);
}

.songGrid > div:first-child:before, .songGrid > div:first-child:after {content:  "";position:  absolute;top:  0;left:  0;right:  0;bottom:  0;z-index:  -1;}
.songGrid > div:first-child:before {
	background-image:  url('res/stillAfloat.jpg');
	background-position:  center;
	background-size:  cover;
	background-repeat: no-repeat;
}
.songGrid > div:first-child:after {
	background:  var(--hero_shade);
	opacity: .8;
}
#songInfo {
	min-width: 500px;
}
#songTitle {
	font-size: 2em;
	font-weight: bold;
	margin-bottom: 20px;
}
.songTabs {
	border: 1px solid var(--border);
	border-radius:  4px 4px 0 0;
	display: grid;
	grid:  1fr / 1fr 1fr 1fr;
	overflow: hidden;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.songTabs > div {
	padding: 12px;
	box-sizing: border-box;
	text-align: center;
	text-transform: uppercase;
	font-size: .9em;
	border-left: 1px solid var(--border);
	letter-spacing:  1px;
	transition: color .5s, font-weight .3s;
	cursor: pointer;
}
.songTabs > div:first-child {
	border-left: none;
}
.songTabs > div.selected {
	color: var(--accent);
}
.songTabs > div:hover {
	font-weight: bold;
}
.songPages {
	border: 1px solid var(--border);
	border-top:  0;
	border-radius:  0 0 4px 4px;
	padding:  20px;
	box-sizing: border-box;
}
.songPages > div {
	display: none;
	white-space: pre-wrap;
}
.songPages > div.active {
	display: block;
}
.songPages > div a {
    color: var(--accent);
    text-decoration: none;
    position: relative;
}
.songPages > div a:before {
	content: "";
	position: absolute;
	height: 100%;
	width: 0;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	border-bottom: 1px solid;
	transition: width .3s;
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
}
.songPages > div a:hover:before {
    width: 100%;
}
.songPages > div b  {
	color: var(--accent);
}
.songPages > div p {
	margin:  10px 0;
}

.footer {
	width: 100%;
	padding: 20px;
	box-sizing: border-box;
	background: var(--footer_background);
}
.footer h2 {
	margin: 0 0 10px 0;
	font-size: 2em;
}
.footer p {
	font-size: .8em;
	margin: 5px 0;
	color: var(--dull);
}
.footer a {
	color: inherit;
	text-decoration: none;
	font-weight: bold;
	position: relative;
	transition: color .3s;
}
.footer a:before {
	content: "";
	position: absolute;
	height: 100%;
	width: 0;
	top: 0;
	left: 50%;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	border-bottom: 1px solid;
	transition: width .3s;
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
}
.footer a:hover {
	color: var(--text);
}
.footer a:hover:before {
	width: 100%;
}

.superCenter {
	min-height: 100%;
	width:  100%;
	padding: 40px;
	box-sizing: border-box;
	display:  flex;
	align-items: center;
	justify-content: center;
}
.atLeastAPage {
	min-height: 100%;
	width: 100%;
}
.articleTitle {
	font-size: 3em;
	margin: 50px 0 0 0;
	font-weight: bold;
}
.articleDate {
	font-size: .8em;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: var(--dull);
	margin: 0 0 50px 0;
}
.articleContents {
	width: 100%;
	box-sizing: border-box;
	padding: 20px;
}
.articleContents > div {
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.articleContents.hasMedia {
	display: grid;
	grid-gap: 40px;
	grid:  1fr / 1fr 1fr;
}
.articleContents.noMedia .articleMedia {
	display: none;
}
.articleMedia {
	display: flex;
	align-items: start;
	justify-content: center;
	flex-wrap: wrap;
	gap: 10px;
}
.articleMedia audio {
	width: 100%;
}
.articleMedia img, .articleMedia video {
    max-width: 100%;
	border-radius:  4px;
}
.article {
	width: 100%;
	max-width: 600px;
	display: inline-block;
}
.article p {
	text-align: left;
	white-space: pre-wrap;
}

@media all and (max-width: 1000px) {
	.articleMedia img, .articleMedia video {
		max-width: 100%;
	}
}
@media all and (max-width: 800px) {
	.hero h1 {
		font-size: 4em;
	}
	.albumCoverWrapper {
		flex-basis: 100%;
	}
	.newsPreview.large {
		margin: 20px 0;
	}
	.articleContents.hasMedia {
		grid: auto auto / 1fr;
	}
	.articleMedia {
	    grid-row: 2;
	}
	.articleMedia img, .articleMedia video {
		max-width: 100%;
	}
}
@media all and (max-width: 600px) {
	.header_nav {
		height: 100%;
		width: 100%;
		position: fixed;
		top: 10;
		left: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		transition: left .5s;
	}
	.header_nav:before {
		content: "";
		position: absolute;
		top: 0;left: 0;right: 0;bottom: 0;
		background: var(--hero_shade);
		opacity: .8;
		z-index: -1;
		-webkit-pointer-events: none;
		-moz-pointer-events: none;
		-ms-pointer-events: none;
		-o-pointer-events: none;
		pointer-events: none;
	}
	.header_nav > span {
		flex: 1;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 2em;
	}
	.header_nav > span a {
		padding: 10px 50px;
		transition: font-weight;
	}
	.header_nav > span a:hover {
		font-weight: 900;
	}
	.header_nav > span:before {display: none;}
	.navBtn.active + .header .header_nav {
		left: 0;
	}
	.navBtn {
		display: block;
	}
	.newsPreview.large {
		grid:  auto 1fr / 1fr;
	}
	.newsPreview.large > div:first-child {
		text-align:  center;
	}
	.songGrid > div {
		min-width: 100% !important;
	}
}
@media all and (max-width: 500px) {
	.hero h1 {
		font-size: 3em;
	}
	.section h2 {
		font-size: 2.5em;
	}
	.albumTitle {
		font-size: 1.5em;
	}
	.newsPreview > div {
		font-size: 1.1em;
	}
	.footer h2 {
		font-size: 1.5em;
	}
	.songGrid {
		padding:  50px 20px;
	}
	.albumGrid {
		grid:  1fr / 1fr;
	}
	.albumGrid > div > div {
		text-align: center;
	}
	.albumGrid span {
		margin: 0;
	}
}

/* LOGIN CSS */
.formWrapper {
	text-align: center;
}
.formWrapper h1 {
	font-size: 5em;
	margin: 0 0 20px 0;
}
.formWrapper > form {
	width: 100%;
	max-width: 550px;
	padding: 20px;
	margin-top: 7%;
	box-sizing: border-box;
	display: inline-block;
}
.inputWrap {
	width: 100%;
	position: relative;
	padding: 15px 0;
	text-align: left;
}
.inputWrap label {
	display: inline-block;
	color: var(--dull);
	font-size: .7em;
	text-transform: uppercase;
	letter-spacing: 1px;
}
.inputWrap input, .inputWrap textarea, .inputWrap select {
	width: 100%;
	background: transparent;
	font-family: inherit;
	font-size: 1em;
	padding: 10px;
	box-sizing: border-box;
	color: var(--text);
	border: none;
	border-bottom: 1px solid var(--border);
	display: block;
	resize: none;
	outline: none;
	transition: border-color .3s;
}
.inputWrap input:focus, .inputWrap textarea:focus, .inputWrap select:focus {
	border-color: var(--accent);
}
.errs > div {
	margin: 5px 0;
	font-size: .8em;
	display: block;
	color: var(--error);
}
.loader {
	height: 64px;
	width: 64px;
	position: fixed;
	top: calc(50% - 32px);
	left: calc(50% - 32px);
	box-sizing: border-box;
	border: 2px solid var(--border);
	border-top: 2px solid var(--accent);
	border-radius: 50%;
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
	animation: loader 1s linear infinite;
}
@-webkit-keyframes loader {to {-webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-ms-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(360deg);}}
@keyframes loader {to {-webkit-transform: rotate(360deg);-moz-transform: rotate(360deg);-ms-transform: rotate(360deg);-o-transform: rotate(360deg);transform: rotate(360deg);}}


/* ADMIN CSS */

.dashboard {
	height: 100%;
	width: 100%;
	display: grid;
	grid: 50px 1fr / 64px 1fr;
	grid-template-areas: "head head" ". ."
}
.dash_header {
	grid-area: head;
	padding: 0 20px;
	box-sizing: border-box;
	border-bottom: 1px solid var(--border);
	display: grid;
	align-items: center;
	grid: 1fr / auto 1fr;
}
.dash_header h1 {
	margin: 0;
	font-size: 2em;
}
.dash_nav {
	height: 100%;
	display: flex;
	align-items: center;
	flex-direction: row-reverse;
}
.dash_nav > svg {
	height: 32px;
	width: 32px;
	fill: var(--text);
	cursor: pointer;
	transition: transform .3s;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.dash_nav > svg:hover {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}
.dash_dropdown {
	width: calc(100% - 40px);
	max-width: 200px;
	position: fixed;
	top: 55px;
	right: 22px;
	border-radius: 4px;
	background: var(--footer_background);
	border: 1px solid var(--dull);
	box-sizing: border-box;
	opacity: 0;
	pointer-events: none;
	transition: opacity .3s;
	z-index: 2;
}
.dash_dropdown.visible {
	opacity: 1;
	-webkit-pointer-events: all;
	-moz-pointer-events: all;
	-ms-pointer-events: all;
	-o-pointer-events: all;
	pointer-events: all;
}
.dash_dropdown:before {
	content: "";
	position: absolute;
	right: 3px;
	top: -10px;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
	border-bottom: 9px solid var(--dull);
}
.dash_dropdown:after {
	content: "";
	position: absolute;
	right: 4px;
	top: -8px;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 8px solid var(--footer_background);
}
.dash_dropdown > span {
	width: 100%;
	display: block;
	padding: 12px;
	box-sizing: border-box;
	font-size: 1em;
	font-weight: bold;
}
.dash_dropdown > div {
	width: 100%;
	padding: 12px;
	box-sizing: border-box;
	font-size: .8em;
	text-transform: uppercase;
	letter-spacing: 1px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	transition: background .3s, box-shadow .3s;
}
.dash_dropdown > div:first-child {border-radius: 4px 4px 0 0;}
.dash_dropdown > div:last-child {border-radius: 0 0 4px 4px;}
.dash_dropdown > div:hover, .dash_dropdown > div:active {
	background: var(--highlight);
}
.dash_dropdown > div:active {
	box-shadow: inset 0 0 0 1000px rgba(0, 0, 0, 0.1);
}
.dash_dropdown > hr {
	height: 1px;
	width: 100%;
	margin: 0;
	border: none;
	background: var(--dull);
}
.dash_shade {
	height: 100%;
	width: 100%;
	position: fixed;
	top: 0;
	left: 0;
	display: none;
	z-index: 1;
}
.dash_dropdown.visible + .dash_shade {display: block}

.dash_sidebar {
	box-sizing: border-box;
	border-right: 1px solid var(--border);
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.dash_sidebar > div {
	height: 64px;
	width: 64px;
	box-sizing: border-box;
	display:  inline-block;
	padding: 15px;
	cursor: pointer;
}
.dash_sidebar > div svg {
	fill: var(--text);
	transition: transform .3s;
}
.dash_sidebar > div:hover svg {
	-webkit-transform: scale(1.1);
	-moz-transform: scale(1.1);
	-ms-transform: scale(1.1);
	-o-transform: scale(1.1);
	transform: scale(1.1);
}
.dash_content {
	box-sizing: border-box;
	position: relative;
}
.dash_page {
	height: 100%;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	box-sizing: border-box;
	padding: 40px;
	overflow-x: hidden;
	overflow-y: auto;
	opacity: 0;
	pointer-events: none;
	transition: opacity .5s;
}
.dash_page h2 {
	margin: 0 0 20px 0;
	font-size: 1.5em;
}
.dash_page.visible {
	opacity: 1;
	pointer-events: all;
}
.dash_page a {
	padding: 3px 0;
	color: var(--accent);
	position:  relative;
	text-decoration: none;
	font-size:  .8em;
	letter-spacing: 1px;
	text-transform:  uppercase;
}


.dull {
	display:  block;
	text-align: center;
	padding: 20px;
	box-sizing: border-box;
	text-transform: uppercase;
	font-size: .8em;
	color: var(--dull);
}
.hidden {
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
	opacity: 0;
	height: 0;
	width: 0;
	margin: 0;
	padding: 0;
}

.dash_news {
	padding:  20px 0;
}


.centered {
	text-align:  center;
}
.dash_page form {
	width: 100%;
	max-width: 500px;
	display:  inline-block;
}
.dash_page #newsPreviewWrapper {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.dash_page .newsPreview.selected {
	background: var(--footer_background);
}
.dash_page .newsPreview.selected > div {
	color:  var(--accent);
}
#delete_news_btn {display: none;}

#notifications {
	width: 90%;
	max-width: 250px;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 3;
	-webkit-user-select:  none;
	-moz-user-select:  none;
	-ms-user-select:  none;
	-o-user-select:  none;
	user-select:  none;
}
.notification {
	width: 100%;
	position: relative;
	padding: 10px 10px 10px 14px;
	margin: 15px 0;
	box-sizing: border-box;
	border-radius: 5px 0 0 5px;
	cursor: pointer;
	overflow: hidden;
	transition: margin-left .75s;
}
.notification:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	opacity: .95;
	background: var(--background);
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
	z-index: -1;
}
.notification:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	height: 100%;
	width: 100%;
	box-sizing: border-box;
	border-left: 4px solid var(--success);
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
	z-index: -1;
}
.notification.error:after {
	border-left-color: var(--error);
}
.notification h3 {
	margin: 0 0 3px 0;
	font-size: .9em;
	font-weight: bold;
}
.notification p {
	margin: 0;
	font-size: .8em;
}

.uploadArea {
	width: calc(100% - 20px) !important;
	margin: 20px 10px;
	padding: 30px 0;
	background: linear-gradient(90deg, var(--text) 50%, transparent 50%), linear-gradient(90deg, var(--text) 50%, transparent 50%), linear-gradient(0deg, var(--text) 50%, transparent 50%), linear-gradient(0deg, var(--text) 50%, transparent 50%);
	background-repeat: repeat-x, repeat-x, repeat-y, repeat-y;
	background-size: 16px 2px, 16px 2px, 2px 16px, 2px 16px;
	background-position: 0px 0px, 100% 100%, 0px 100%, 100% 0px;
	cursor: pointer;
	border-radius: 2px;
	text-align: center !important;
}
.uploadArea.dragover > svg {
	-webkit-animation: bounce 2s cubic-bezier(0.280, 0.840, 0.420, 1) infinite;
	-moz-animation: bounce 2s cubic-bezier(0.280, 0.840, 0.420, 1) infinite;
	-ms-animation: bounce 2s cubic-bezier(0.280, 0.840, 0.420, 1) infinite;
	-o-animation: bounce 2s cubic-bezier(0.280, 0.840, 0.420, 1) infinite;
	animation: bounce 2s cubic-bezier(0.280, 0.840, 0.420, 1) infinite;
}
.uploadArea.dragover {
	-webkit-animation: border_dance 4s linear infinite;
	-moz-animation: border_dance 4s linear infinite;
	-ms-animation: border_dance 4s linear infinite;
	-o-animation: border_dance 4s linear infinite;
	animation: border_dance 4s linear infinite;
}
.uploadArea svg {
	height: 64px;
	width: 64px;
	fill: var(--text);
	pointer-events: none;
}
.uploadArea div {
	color: var(--text);
	-webkit-pointer-events: none;
	-moz-pointer-events: none;
	-ms-pointer-events: none;
	-o-pointer-events: none;
	pointer-events: none;
}
.image_set {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
}
.image_set .img {
	height: 128px;
	width: 128px;
	position: relative;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border: 1px solid var(--dash_border);
	background-color: var(--dash_background);
	box-sizing: border-box;
	border-radius: 3px;
	margin: 20px;
	display: inline-block;
	cursor: move;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	border:  1px solid var(--border);
	user-select: none;
	transition: transform .3s;
}
.image_set .img.video {
	background-color: var(--background);
	background-size: 64px;
	background-image:  url('data:image/png;base64,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');
}
.image_set .img.audio {
	background-color: var(--background);
	background-size: 64px;
	background-image:  url('data:image/png;base64,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');
}
.image_set .img:hover > svg {
	display: block;
}
.image_set .img > svg {
	position: absolute;
	padding: 5px;
	box-sizing: border-box;
	top: -12px;
	right: -12px;
	height: 24px;
	width: 24px;
	fill: white;
	display: none;
	background: var(--error);
	border-radius: 50%;
	cursor: pointer;
}
.image_set .img.dragging > svg {
	opacity: 0 !important;
}
.image_set .img.dragging {
	position: fixed;
	z-index: 1;
}

.half-half {
    width: 100%;
    padding: 0 2.5%;
    box-sizing: border-box;
    display: flex;
    flex-wrap: wrap;
    grid-gap: 20px;
    margin: 50px 0;
}
.half-half.right {
    flex-direction: row-reverse;
}
.half-half > img {
    width: 100%;
    max-width: 400px;
    align-self: center;
    justify-self: center;
}
.half-half > div {
    flex: 1;
}
.half-half h3 {
    font-size: 2em;
    font-weight: bold;
    margin: 0 0 15px 0;
}
.musicfiles > a {
    padding: 10px;
    margin: 5px 0;
    display: grid;
    align-items: center;
    grid-template-columns: 1fr auto;
    border-radius: 5px;
    text-decoration: none;
    color: var(--text);
    stroke: var(--dull);
    cursor: pointer;
    grid-gap: 5px;
    position: relative;
    transition: background .3s, color .3s, stroke .3s;
}
.musicfiles > a:hover {
    background: rgba(255, 255, 255, .1);
    color: var(--accent);
    stroke: var(--accent);
}
.musicfiles > a svg {
    height: 24px;
    width: 24px;
    stroke: inherit;
}


@media all and (max-width: 700px) {
	.dashboard {
		grid:  50px 64px 1fr / 1fr;
		grid-template-areas: "head" "." ".";
	}
	.dash_sidebar {
		border-right:  none;
		border-bottom:  1px solid var(--border);
	}
}
@media all and (max-width: 600px) {
	.half-half {
	    flex-direction: column;
	}
}
@media all and (max-width: 400px) {
	.dash_page {
		padding:  20px;
	}
}

@-webkit-keyframes bounce {
	0%   { transform: scale(1,1)      translateY(0); 			}
	10%  { transform: scale(1.1,.9)   translateY(0); 			}
	30%  { transform: scale(.9,1.1)   translateY(-25%); 		}
	50%  { transform: scale(1.05,.95) translateY(0); 			}
	57%  { transform: scale(1,1)      translateY(-5%); 			}
	64%  { transform: scale(1,1)      translateY(0); 			}
	100% { transform: scale(1,1)      translateY(0); 			}
}
@keyframes bounce {
	0%   { transform: scale(1,1)      translateY(0); 			}
	10%  { transform: scale(1.1,.9)   translateY(0); 			}
	30%  { transform: scale(.9,1.1)   translateY(-25%); 		}
	50%  { transform: scale(1.05,.95) translateY(0); 			}
	57%  { transform: scale(1,1)      translateY(-5%); 			}
	64%  { transform: scale(1,1)      translateY(0); 			}
	100% { transform: scale(1,1)      translateY(0); 			}
}
@-webkit-keyframes border_dance {
	0% 		{background-position: 0px 0px, 300px 100%, 0px 150px, 100% 0px;	}
	100% 	{background-position: 300px 0px, 0px 100%, 0px 0px, 100% 150px;	}
}
@keyframes border_dance {
	0% 		{background-position: 0px 0px, 300px 100%, 0px 150px, 100% 0px;	}
	100% 	{background-position: 300px 0px, 0px 100%, 0px 0px, 100% 150px;	}
}

.errorHead {
	font-size: 10em;
	margin: 0;
	position: relative;
}
.errorSub {
	color: var(--dull);
	font-size:  .8em;
	text-transform: uppercase;
	letter-spacing: 1px;
	font-weight: normal;
	margin: 0;
}
.glitch:before,.glitch:after {
	content: attr(data-text);
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	color: transparent;
	text-shadow: 2px 0 rgba(255, 0, 0, .7);
	-webkit-animation: glitch 1s .4s linear infinite;
	-moz-animation: glitch 1s .4s linear infinite;
	-ms-animation: glitch 1s .4s linear infinite;
	-o-animation: glitch 1s .4s linear infinite;
	animation: glitch 1s .4s linear infinite;
	z-index: -1;
}
.glitch:after {
	text-shadow: -2px 0 rgba(0, 255, 255, .7);
	-webkit-animation: glitch 1s linear infinite;
	-moz-animation: glitch 1s linear infinite;
	-ms-animation: glitch 1s linear infinite;
	-o-animation: glitch 1s linear infinite;
	animation: glitch 1s linear infinite;
}
@keyframes glitch {
	0% {
		-webkit-transform: translate(3px,-4px);
		-moz-transform: translate(3px,-4px);
		-ms-transform: translate(3px,-4px);
		-o-transform: translate(3px,-4px);
		transform: translate(3px,-4px);
	}
	5% {
		-webkit-transform: translate(1px,1px);
		-moz-transform: translate(1px,1px);
		-ms-transform: translate(1px,1px);
		-o-transform: translate(1px,1px);
		transform: translate(1px,1px);
	}
	10% {
		-webkit-transform: translate(1px,3px);
		-moz-transform: translate(1px,3px);
		-ms-transform: translate(1px,3px);
		-o-transform: translate(1px,3px);
		transform: translate(1px,3px);
	}
	15% {
		-webkit-transform: translate(-4px,-4px);
		-moz-transform: translate(-4px,-4px);
		-ms-transform: translate(-4px,-4px);
		-o-transform: translate(-4px,-4px);
		transform: translate(-4px,-4px);
	}
	20% {
		-webkit-transform: translate(-4px,3px);
		-moz-transform: translate(-4px,3px);
		-ms-transform: translate(-4px,3px);
		-o-transform: translate(-4px,3px);
		transform: translate(-4px,3px);
	}
	25% {
		-webkit-transform: translate(-4px,-3px);
		-moz-transform: translate(-4px,-3px);
		-ms-transform: translate(-4px,-3px);
		-o-transform: translate(-4px,-3px);
		transform: translate(-4px,-3px);
	}
	30% {
		-webkit-transform: translate(2px,1px);
		-moz-transform: translate(2px,1px);
		-ms-transform: translate(2px,1px);
		-o-transform: translate(2px,1px);
		transform: translate(2px,1px);
	}
	35% {
		-webkit-transform: translate(-1px,5px);
		-moz-transform: translate(-1px,5px);
		-ms-transform: translate(-1px,5px);
		-o-transform: translate(-1px,5px);
		transform: translate(-1px,5px);
	}
	40% {
		-webkit-transform: translate(-1px,1px);
		-moz-transform: translate(-1px,1px);
		-ms-transform: translate(-1px,1px);
		-o-transform: translate(-1px,1px);
		transform: translate(-1px,1px);
	}
	45% {
		-webkit-transform: translate(-3px,5px);
		-moz-transform: translate(-3px,5px);
		-ms-transform: translate(-3px,5px);
		-o-transform: translate(-3px,5px);
		transform: translate(-3px,5px);
	}
	50% {
		-webkit-transform: translate(-1px,5px);
		-moz-transform: translate(-1px,5px);
		-ms-transform: translate(-1px,5px);
		-o-transform: translate(-1px,5px);
		transform: translate(-1px,5px);
	}
	55% {
		-webkit-transform: translate(-2px,1px);
		-moz-transform: translate(-2px,1px);
		-ms-transform: translate(-2px,1px);
		-o-transform: translate(-2px,1px);
		transform: translate(-2px,1px);
	}
	60% {
		-webkit-transform: translate(-3px,4px);
		-moz-transform: translate(-3px,4px);
		-ms-transform: translate(-3px,4px);
		-o-transform: translate(-3px,4px);
		transform: translate(-3px,4px);
	}
	65% {
		-webkit-transform: translate(3px,-3px);
		-moz-transform: translate(3px,-3px);
		-ms-transform: translate(3px,-3px);
		-o-transform: translate(3px,-3px);
		transform: translate(3px,-3px);
	}
	70% {
		-webkit-transform: translate(-4px,4px);
		-moz-transform: translate(-4px,4px);
		-ms-transform: translate(-4px,4px);
		-o-transform: translate(-4px,4px);
		transform: translate(-4px,4px);
	}
	75% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		text-shadow: 0;
	}
}
@keyframes glitch2 {
	0% {
		-webkit-transform: translate(1px,-2px);
		-moz-transform: translate(1px,-2px);
		-ms-transform: translate(1px,-2px);
		-o-transform: translate(1px,-2px);
		transform: translate(1px,-2px);
	}
	5% {
		-webkit-transform: translate(5px,-2px);
		-moz-transform: translate(5px,-2px);
		-ms-transform: translate(5px,-2px);
		-o-transform: translate(5px,-2px);
		transform: translate(5px,-2px);
	}
	10% {
		-webkit-transform: translate(2px,0px);
		-moz-transform: translate(2px,0px);
		-ms-transform: translate(2px,0px);
		-o-transform: translate(2px,0px);
		transform: translate(2px,0px);
	}
	15% {
		-webkit-transform: translate(-2px,0px);
		-moz-transform: translate(-2px,0px);
		-ms-transform: translate(-2px,0px);
		-o-transform: translate(-2px,0px);
		transform: translate(-2px,0px);
	}
	20% {
		-webkit-transform: translate(5px,0px);
		-moz-transform: translate(5px,0px);
		-ms-transform: translate(5px,0px);
		-o-transform: translate(5px,0px);
		transform: translate(5px,0px);
	}
	25% {
		-webkit-transform: translate(0px,-1px);
		-moz-transform: translate(0px,-1px);
		-ms-transform: translate(0px,-1px);
		-o-transform: translate(0px,-1px);
		transform: translate(0px,-1px);
	}
	30% {
		-webkit-transform: translate(-3px,2px);
		-moz-transform: translate(-3px,2px);
		-ms-transform: translate(-3px,2px);
		-o-transform: translate(-3px,2px);
		transform: translate(-3px,2px);
	}
	35% {
		-webkit-transform: translate(3px,3px);
		-moz-transform: translate(3px,3px);
		-ms-transform: translate(3px,3px);
		-o-transform: translate(3px,3px);
		transform: translate(3px,3px);
	}
	40% {
		-webkit-transform: translate(3px,-1px);
		-moz-transform: translate(3px,-1px);
		-ms-transform: translate(3px,-1px);
		-o-transform: translate(3px,-1px);
		transform: translate(3px,-1px);
	}
	45% {
		-webkit-transform: translate(4px,1px);
		-moz-transform: translate(4px,1px);
		-ms-transform: translate(4px,1px);
		-o-transform: translate(4px,1px);
		transform: translate(4px,1px);
	}
	50% {
		-webkit-transform: translate(2px,4px);
		-moz-transform: translate(2px,4px);
		-ms-transform: translate(2px,4px);
		-o-transform: translate(2px,4px);
		transform: translate(2px,4px);
	}
	55% {
		-webkit-transform: translate(1px,2px);
		-moz-transform: translate(1px,2px);
		-ms-transform: translate(1px,2px);
		-o-transform: translate(1px,2px);
		transform: translate(1px,2px);
	}
	60% {
		-webkit-transform: translate(3px,3px);
		-moz-transform: translate(3px,3px);
		-ms-transform: translate(3px,3px);
		-o-transform: translate(3px,3px);
		transform: translate(3px,3px);
	}
	65% {
		-webkit-transform: translate(-2px,-4px);
		-moz-transform: translate(-2px,-4px);
		-ms-transform: translate(-2px,-4px);
		-o-transform: translate(-2px,-4px);
		transform: translate(-2px,-4px);
	}
	70% {
		-webkit-transform: translate(0px,2px);
		-moz-transform: translate(0px,2px);
		-ms-transform: translate(0px,2px);
		-o-transform: translate(0px,2px);
		transform: translate(0px,2px);
	}
	75% {
		-webkit-transform: translate(0,0);
		-moz-transform: translate(0,0);
		-ms-transform: translate(0,0);
		-o-transform: translate(0,0);
		transform: translate(0,0);
		text-shadow: 0;
	}
}
@media all and (max-width: 450px) {
	.errorHead {
		font-size:  8em;
	}
}
@media all and (max-width: 300px) {
	.errorHead {
		font-size:  6em;
	}
}