body {
	background: #181545;
	margin: 0px;
}

@font-face {
	font-family: 'delagoth';
	src: url('delagoth_ascii_and_german.ttf') format('truetype');
	font-weight: 100;
	font-style: normal;
}

h1,h2,h3,h4,h5,h6, p,span { 
	font-family: "delagoth", fantasy, arial;
	font-weight: 100;
	color: #FFFFFF; 
}

a { 
	color: #871147;
    text-decoration-thickness: 4px;
}
a:hover:not(.imagelink) {
	background: #871147;
    color: #181545;
}
a.imagelink:hover > img {
	background: #871147;
}

hr { 
	border: 2px solid white;
	margin: 0;
    margin-bottom: 24px;
}

button {
	background: #871147;
	border: unset;
    font-family: delagoth;
	margin-bottom: 24px;
}
button:not([disabled]):hover {
    cursor: pointer;
	background: #FFFFFF;
}
button:not([disabled]):hover > * {
	color: #871147;
}

input {
	border: unset;
	margin-bottom: 24px;
	font-size: 1.5em;
    font-family: delagoth;
}

canvas { 
	background: #871147;
	margin-bottom: 24px;
	max-width: 100%;
}

[flex] { display: flex; }
[flex~="y-center"] { align-items: center; }
[flex~="x-center"] { justify-content: center; }

[tall] {
	height: 100vh;
}

[bg="magenta"] { background: #871147; }



[m~="t0"] { margin-top: 0px; }
[m~="b1"] { margin-bottom: 12px; }

[p~="x2"] { padding-left: 24px; padding-right: 24px; }