/* VARIABLES */
:root {
	--background: #fff;
	--text: #000;
	--big: 2.618rem;
	--large: 1.618rem;
	--letter: 1rem;
	--line: 1.382rem;
	--lineheight: 1.382;
	--nothing: 0.146rem;
	--smaller: 0.847rem;
	--small: 0.618rem;
	--tiny: 0.382rem;
}



/* RESET */
* {
	border-radius: 0;
	border-width: 0;
	box-sizing: border-box;
	color: inherit;
	font-family: inherit;
	font-size: inherit;
	font-style: inherit;
	font-weight: inherit;
	line-height: inherit;
	margin: 0;
	padding: 0;
	text-align: inherit; 
}



/* TAGS */
a {
	text-decoration: none;
}
address {
	margin-bottom: var(--line);
}
blockquote p::after {
	content: "“";
}
blockquote p::before {
	content: "„";
}
body {
	background-color: var(--background);
	color: var(--text);
}
button { 
	background-color: transparent;
	border-color: transparent;
	cursor: pointer;
	padding: var(--tiny); 
}
caption {
	font-family: "jochen-sansserif", sans-serif;
	font-weight: bold;
	letter-spacing: var(--nothing);
	text-transform: uppercase;
}
code {
	font-family: monospace;
}
dl {
	margin-bottom: var(--line);
}
em, i {
	font-style: italic;
}
fieldset {
	margin-bottom: var(--line);
}
figcaption {
	font-size: var(--smaller);
	font-style: italic;
}
h1 {
	font-family: "jochen-sansserif", sans-serif;
	font-size: var(--letter);
	font-weight: bold;
	letter-spacing: var(--nothing);
	text-transform: uppercase;
}
h2 {
	font-family: "jochen-sansserif", sans-serif;
	font-size: var(--big);
	font-weight: normal;
	line-height: 1;
	margin-bottom: var(--line);
}
h3 {
	font-family: "jochen-sansserif", sans-serif;
	font-size: var(--large);
	font-weight: bold;
	line-height: 1;
	margin-bottom: var(--letter);
	margin-top: var(--big);
}
h4 {
	font-family: "jochen-sansserif", sans-serif;
	font-size: var(--letter);
	font-weight: bold;
	letter-spacing: var(--nothing);
	text-transform: uppercase;
}
header p {
	font-family: "jochen-sansserif", sans-serif;
	font-weight: bold;
	letter-spacing: var(--nothing);
	text-transform: uppercase;
}
html {
	background-color: var(--background);
	color: var(--text);
	font-family: "jochen-serif", serif;
	font-size: 1em;
	line-height: var(--lineheight);
}
img {
	display: block;
	height: auto;
	max-width: 100%;
}
input {
	background-color: var(--background);
	border: 1px solid var(--background);
	color: var(--text);
	line-height: var(--line);
	max-width: 100%;
	padding: var(--tiny);
	width: 100%;
}
input[type="reset"], 
input[type="submit"] {
	background-color: var(--text);
	border-color: var(--text);
	color: var(--background);
	cursor: pointer;
	padding: var(--tiny) var(--small); 
	width: auto;
}
label {
	display: block;
	font-size: var(--smaller);
	font-style: italic;
}
ol {
	counter-reset: ol;
	list-style-type: none;
	list-style-position: outside;
	margin-bottom: var(--line);
}
ol ol, ul ol {
	margin-bottom: 0;
}
ol li {
	counter-increment: ol;
	padding-left: var(--line);
	text-indent: calc(0px - var(--line));
}
ol li::before {
	content: counters(ol, ".") ".";
	display: block;
	float: left;
	width: var(--line);
} 
p {
	margin-bottom: var(--line);
}
pre {
	font-family: monospace;
	margin-bottom: var(--line);
}
small {
	font-size: var(--smaller);
}
strong, b {
	font-weight: bold;
}
sub {
	font-size: var(--small);
	line-height: 1;
	vertical-align: sub;
}
sup {
	font-size: var(--small);
	line-height: 1;
	vertical-align: super;
}
table {
	border-bottom: 1px solid var(--text);
	border-collapse: collapse;
	margin-bottom: var(--line);
	max-width: 100%;
	width: auto;
}
td {
	border-top: 1px solid var(--text);
	padding: var(--tiny) var(--small);
	vertical-align: top;
	width: auto;
}
td:first-child {
	padding-left: 0;
}
td:last-child {
	padding-right: 0;
}
textarea {
	background-color: var(--background);
	border: 1px solid var(--background);
	color: var(--text);
	line-height: var(--line);
	max-width: 100%;
	padding: var(--tiny);
	resize: vertical;
	width: 100%;
}
tfoot td, tfoot th {
	border-top-style: solid;
}
th {
	border-top: 1px solid var(--text);
	font-weight: bold;
	padding: var(--tiny) var(--small);
	vertical-align: top;
	width: auto;
}
th:first-child {
	padding-left: 0;
}
th:last-child {
	padding-right: 0;
}
thead td, thead th {
	border-bottom: 2px solid var(--text);
	font-weight: bold;
}
ul {
	list-style-type: none;
	list-style-position: outside;
	margin-bottom: var(--line);
}
ul ul, ol ul {
	margin-bottom: 0;
}
ul li {
	padding-left: var(--line);
	text-indent: calc(0px - var(--line)); 
}
ul li::before {
	content: "–";
	display: block;
	float: left;
	width: var(--line);
}



/* CLASSES */
.comment, .comment-respond {
	border-top: 1px solid var(--text);
	padding-top: var(--line);
}
.gallery {
	display: flex;
	flex-wrap: wrap;
	gap: var(--line);
	margin-bottom: var(--line);
}
.meta {
	font-size: var(--smaller);
	font-style: italic;
}
.meta li {
	display: inline;
	margin-right: var(--line);
	padding-left: 0;
}
.meta li::before {
	display: inline;
	float: none;
	font-family: "jochen-icons";
	font-style: normal;
	margin-right: var(--tiny);
	vertical-align: bottom;
}
.meta li.author::before {
	content: "\f110";
}
.meta li.date::before {
	content: "\f145";
}
.meta li.modified::before {
	content: "\f464";
}
.meta li.tags::before {
	content: "\f323";
}



/* FONTS */
@font-face {
	font-display: swap;
	font-family: "jochen-serif";
	font-style: normal;
	font-weight: normal;
	src: url("/wp-content/themes/jochen/fonts/alegreya-regular-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/alegreya-regular-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/alegreya-regular-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/alegreya-regular-webfont.ttf") format("truetype");
}
@font-face {
	font-display: swap;
	font-family: "jochen-serif";
	font-style: normal;
	font-weight: bold;
	src: url("/wp-content/themes/jochen/fonts/alegreya-bold-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/alegreya-bold-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/alegreya-bold-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/alegreya-bold-webfont.ttf") format("truetype");
}
@font-face {
	font-display: swap;
	font-family: "jochen-serif";
	font-style: italic;
	font-weight: normal;
	src: url("/wp-content/themes/jochen/fonts/alegreya-italic-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/alegreya-italic-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/alegreya-italic-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/alegreya-italic-webfont.ttf") format("truetype");
}
@font-face {
	font-display: swap;
	font-family: "jochen-serif";
	font-style: italic;
	font-weight: bold;
	src: url("/wp-content/themes/jochen/fonts/alegreya-bolditalic-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/alegreya-bolditalic-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/alegreya-bolditalic-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/alegreya-bolditalic-webfont.ttf") format("truetype");
}

@font-face {
	font-display: swap;
	font-family: "jochen-sansserif";
	font-style: normal;
	font-weight: normal;
	src: url("/wp-content/themes/jochen/fonts/oswald-light-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/oswald-light-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/oswald-light-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/oswald-light-webfont.ttf") format("truetype");
}
@font-face {
	font-display: swap;
	font-family: "jochen-sansserif";
	font-style: normal;
	font-weight: bold;
	src: url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.ttf") format("truetype");
}
@font-face {
	font-display: swap;
	font-family: "jochen-sansserif";
	font-style: italic;
	font-weight: normal;
	src: url("/wp-content/themes/jochen/fonts/oswald-light-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/oswald-light-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/oswald-light-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/oswald-light-webfont.ttf") format("truetype");
}
@font-face {
	font-display: swap;font-family: "jochen-sansserif";
	font-style: italic;
	font-weight: bold;
	src: url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.eot");
	src: url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.eot?#iefix") format("embedded-opentype"),
		 url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.woff") format("woff"),
		 url("/wp-content/themes/jochen/fonts/oswald-regular-webfont.ttf") format("truetype");
}

@font-face {
	font-display: swap;
	font-family: "jochen-icons";
	font-style: normal;
	font-weight: normal;
	src: url("/wp-includes/fonts/dashicons.eot");
	src: url("/wp-includes/fonts/dashicons.eot?#iefix") format("embedded-opentype"),
		 url("/wp-includes/fonts/dashicons.woff") format("woff"),
		 url("/wp-includes/fonts/dashicons.ttf") format("truetype");
}
