@font-face {
	font-family: Eczar;
	src: local("Eczar"), url("../font/eczar/Eczar-Bold.ttf");
	font-weight: bold;
}

@font-face {
	font-family: Eczar;
	src: local("Eczar"), url("../font/eczar/Eczar-ExtraBold.ttf");
	font-weight: bolder;
}

@font-face {
	font-family: Eczar;
	src: local("Eczar"), url("../font/eczar/Eczar-Medium.ttf");
	font-weight: medium;
}

@font-face {
	font-family: Eczar;
	src: local("Eczar"), url("../font/eczar/Eczar-SemiBold.ttf");
	font-weight: 600;
}

@font-face {
	font-family: Eczar;
	src: local("Eczar"), url("../font/eczar/Eczar-Regular.ttf");
}

@font-face {
	font-family: SpaceMono;
	src: local("SpaceMono"), url("../font/spacemono/SpaceMono-Bold.ttf");
	font-weight: bold;
}

@font-face {
	font-family: SpaceMono;
	src: local("SpaceMono"), url("../font/spacemono/SpaceMono-BoldItalic.ttf");
	font-weight: bold;
	font-style: italic;
}

@font-face {
	font-family: SpaceMono;
	src: local("SpaceMono"), url("../font/spacemono/SpaceMono-Italic.ttf");
	font-style: italic;
}

@font-face {
	font-family: SpaceMono;
	src: local("SpaceMono"), url("../font/spacemono/SpaceMono-Regular.ttf");
}

:root {
	font-size: 12pt;
	font-family: SpaceMono,monospace;
}

html {
	width: 100vw;
	height: 100dvh;
	background-color: #0a000a;
	color: #CCCCCC;
}

body {
	max-width: 450px;
	margin: 0 auto;
	padding: 1em 1em;
}

h1,h2,h3,h4,h5,h6 {
	font-family: Eczar, sans-serif;
}

h1 {
	font-size: 3.25em;
	font-weight: bolder;
}

div.header-wrapper {
	width: 100%;
	overflow-x: hidden;
}

.secondary {
	color: #4d4d4d;
}

h1.header>span.secondary {
	position: absolute;
}

h1.header {
	text-align: center;
	margin-bottom: 0;
}

p.brief {
	text-align: center;
	margin-top: 0;
	margin-bottom: 2em;
}

div.content-wrapper {
	margin-bottom: 1em;
}

div.photo-wrapper img {
	width: 100%;
}

p.secondary>a {
	color: #CCCCCC;
}

@media (max-width: 365px) {
	h1 {
		font-size: 2em;
	}
}
