/* @import url(https://fonts.googleapis.com/css?family=UnifrakturMaguntia); */
@import url(https://fonts.googleapis.com/css?family=Convergence);
@import url(https://fonts.googleapis.com/css?family=EB+Garamond);

@font-face {
	font-family: 'UnifrakturCook';
	font-weight: normal;
	src: url('UnifrakturCook.ttf');
}

@font-face {
	font-family: 'UnifrakturCook-Light';
	src: url('UnifrakturCook-Light.ttf');
}

@font-face {
	font-family: 'UnifrakturMaguntia';
	src: url('UnifrakturMaguntia.ttf');
}

body {
	background-image: url("/static/Leitfaden/media/background.jpg");
	color: #332b1e;
	-webkit-font-feature-settings: "rlig";
	font-family: 'Convergence', sans-serif;
}

.seperator {
	margin: 1em auto 1em auto;
}

span.small {
	font-size: 80%;
	font-weight: normal;
}

span.smaller {
	font-size: 60%;
	font-weight: normal;
}

h2 strong {
	font-family: "EB Garamond", sans-serif;
	font-size: 80%;
	font-weight: bold;
}

strong {
	font-family: "EB Garamond", serif;
	font-size: 110%;
	font-weight: normal;
    letter-spacing: 0.15ex;
}

.text {
	font-family: 'UnifrakturMaguntia', cursive;
	text-align: justify;
	background-color: white;
	opacity: 0.75;
	padding: 5ex 7ex 4ex 7ex;
	border-radius: 3px;
	box-shadow: 5px 5px 15px #332b1e;
	font-size: 13pt;
}

h1, h2, h3, h4, h5, h6 {
	font-family: "UnifrakturMaguntia", cursive;
    font-feature-settings: "lnum", "cv04" 2, "cv20";
	text-align: center;
	font-weight: normal;
}

h1 {
	font-size: 127%;
	margin-bottom: 0.5ex;
	margin-top: 1ex;
}

h2 {
	font-size: 110%;
	margin-top: 2em;
}

h3 {
	font-size: 105%;
	margin-top: 2ex;
}

h4 {
	font-size: 103%;
	margin-top: 1ex;
	margin-bottom: 0.5ex;
}

.serif {
	font-family: "EB Garamond", serif;
	letter-spacing: 0.5ex;
	font-weight: 600;
	font-size: 145%;
}

.text .math {
	font-size: 80%;
	font-family: "EB Garamond", serif;
}

.text p {
	font-size: 11pt;
	line-height: 112%;
	text-indent: 4ex;
	margin-bottom: 0.19ex;
	opacity: 1;
}

.text p.first:first-letter {
	font-size: 2em;
}

.text p.continued {
	text-indent: 0px;
}

.text em {
	font-weight: normal;
	letter-spacing: 0.3ex;
	font-style: normal;
}

.text .footnoteRef:after {
	content: ")";
}

.text .footnotes p {
	text-indent: 0px;
	line-height: 80%;
}

.text sup, sub {
   vertical-align: baseline;
   position: relative;
   top: -0.4em;
}

.text sub { top: 0.4em; }

.text ol {
	line-height: 100%;
	font-size: 10px;
}

.text li {
	font-size: 10px;
	line-height: 100%;
}

.text li p {
	font-size: 10pt;
}

.text hr {
	margin: 2ex auto 1ex auto;
	width: 5em;
	background-color: black;
	height: 2px;
}

.text .footnotes hr {
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 0px;
	margin-right: none;
	width: 5em;
	background-color: black;
	height: 2px;
}

.text table thead tr th, table tfoot tr td {
	padding: 0px 10px 0px;
}

.text table tbody tr td {
	padding: 0px 10px;
}

.text table {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0.5ex;
}

/* Stylesheet für illustration-detail */
#card .caption p {
	text-align: justify;
	font-size: 12pt;
	line-height: 119%;
	font-weight: normal;
}

#card .caption-center p {
	text-align: center;
	font-size: 12pt;
	line-height: 119%;
	font-weight: normal;
}

.reveal-modal {
	font-family: "UnifrakturMaguntia", cursive;
	text-align: center;
	font-size: 13pt;
}

/*	Darstellung der Seite als Bilddatei mit
	darin enthaltenen Rahmen für Illustrationen
	und Bildunterschriften */
#page {
	opacity: 0.75;
	position: relative;
	display: inline-block;
	width: 594px;
	height: 844px;
}

#page img {
	box-shadow: 5px 5px 15px #332b1e;
	border-radius: 3px;
}

#page .illustration, #page .caption {
	border-style: solid;
	border-width: 2px;
	width: auto;
	height: auto;
	position: absolute;
	text-align: center;
	font-size: 150%;
	font-weight: normal;
}

#page .illustration-link, #page .caption-link {
	position: absolute;
}

#page .illustration-link:hover, #page .caption-link:hover {
	position: absolute;
	background-color: rgba(132,166,228,0.3);
	border: solid 2px rgba(132,166,228,0.7);
}

#page .illustration {
	background: rgba(0,255,0,0.3);
	border-color: green;
}

.illustration:hover {
	border: solid 1px green;
}

.illustration {
	border: solid 1px white;
}

#page .caption {
	background-color: rgba(0,0,255,0.3);
	border-color: blue;
}

#page_number {
	display: inline-block;
	width: 30ex;
	font-size: large;
}

/* Darstellung einer Karteikarte */
div#card {
	text-align: center;
	background-color: white;
	border: solid 5px #332b1e;
	padding: 20px;
	border-radius: 8px;
	box-shadow: 5px 5px 15px #332b1e;
	opacity: 0.75;
	width: 600px;
	margin-left: auto;
	margin-right: auto;
	font-family: "UnifrakturMaguntia", cursive;
}

#card h3 {
	font-family: "Convergence";
	text-shadow: #332b1e 0px 0px 1px;
}

#card table {
	font-family: "Convergence";
}

#card textarea {
	font-family: "Convergence";
	font-size: 90%;
	width: 100%;
}

#card p {
	text-align: justify;
	font-size: 13pt;
	line-height: 120%;
}

#card th {
	text-align: right;
	padding: 9px 10px;
	line-height: 18px;
}

#card th, #card td {
	vertical-align: top;
}

#card p strong {
	font-family: "EB Garamond", serif;
	font-weight: normal;
}

.center {
	text-align: center;
}


/* Regeln für eingeblendte Hinweise */
#message {
	display: none;
	position: fixed;
	font-family: "Convergence";
	top: 50px;
	left: 0px;
	right: 0px;
	margin: 0px;
	text-align: center;
}

#message p {
	border-style: solid;
	border-width: 2px;
	margin: 0px auto;
	padding: 1ex 2ex;
	border-radius: 5px;
	width: 40%;
}

.error {
	background-color: #fdd;
	color: #b00;
	border-color: #b00;
}

.success {
	background-color: #dfd;
	color: #0b0;
	border-color: #0b0;
}

.warning {
	background-color: #ddf;
	color: #00b;
	border-color: #00b;
}

.control {
	font-weight: bold;
}

.static p {
	font-size: 12pt;
}