/* Style sheet for the 'Falsche Fehler' website */

body {
	background-color: #397;
	color: #000;
	font-family: sans-serif;
	margin: 0em;
	padding: 0em;
}
main {
	margin-left: 1em;
	margin-right: 1em;
}
hr {
	border: 2px dashed #243;
}
header a, header a:link, header a:visited {
	color: white;
}
header a:active {
	color: #a00;
}
a, a:link {
	color: blue;
}
a:visited {
	color: purple;
}
a:active{
	color: red;
}
header {
	margin: 0em;
	width: 100%;
	background-color: #008;
	border-left: 0px;
	border-right: 0px;
	border-top: 0px;
	border-bottom: 3px;
	border-color: #888;
	border-style: solid;
}
#nav {
	position: fixed;
	bottom: 3.2em;
	left: 50%;
	transform: translateX(-50%);
}
.nav-static {
	align: center;
	display: flex;
	justify-content: center;
	margin-top: 2em;
	margin-bottom: 2em;
}
#errorID {
	position: fixed;
	bottom: 3.4em;
	right: 1em;
}
#errorID a, #errorID a:active, #errorID a:visited {
	color: black;
}
.navIcon {
	padding: 1em;
	text-align: center;
	cursor: pointer;
	border: 2px solid black;
	margin-left: 0.2em;
	background: white;
}
.navIcon:hover {
	background: #9ff;
}
.navIcon:active {
	color: #22f;
	background: #2dd;
}
.navIconText {
	text-decoration: underline;
}
h1 {
	font-size: 200%;
	font-weight: bold;
	margin-top: 0em;
	margin-left: 1em;
	padding-top: 0.5em;
}
h2 {
	font-size: 180%;
	margin-top: 0.5em;
}
h3 {
	font-size: 150%;
	margin-top: 0.5em;
	font-weight: normal;
}
h4 {
	font-size: 140%;
	margin-top: 0.25em;
	margin-bottom: 0.25em;
	font-weight: normal;
}

.text-content {
	background: white;
	padding-left: 1em;
	padding-right: 1em;
	padding-top: 0.3em;
	padding-bottom: 0.5em;
	margin-top: 1em;
	border: 2px solid black;
	margin-bottom: 4em;
}
footer {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #444;
	border-left: 0px;
	border-right: 0px;
	border-bottom: 0px;
	border-top: 3px;
	border-color: #888;
	border-style: solid;
}
footer p {
	margin: 0em;
	margin-left: 0.5em;
	line-height: 2.35em;
}
.taskbar-link {
	color: #000;
	background-color: #bbb;
	padding-left: 2em;
	padding-right: 2em;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	margin-left:0em;
	margin-right:0.5em;
	margin-top:0em;
	margin-bottom:0em;

	border-width: 3px;
	border-style: solid;
	border-right-color: #888;
	border-bottom-color: #888;
	border-left-color: #fff;
	border-top-color: #fff;
}
.taskbar-link:active{
	color: #000;
	border-width: 3px;
	border-style: solid;
	border-right-color: #fff;
	border-bottom-color: #fff;
	border-left-color: #888;
	border-top-color: #888;
}
.taskbar-link:link, .taskbar-link:hover, .taskbar-link:visited {
	color: #000;
}
#noScriptArea {
	margin-left: 1em;
	margin-right: 1em;
	margin-bottom: 4em;
	margin-top: 1em;
}
.F_Window_script, .F_Deleted {
	position: fixed;
	left: 50%;
	top: calc(50vh - 6em);
	transform: translate(-50%,-50%);
}
.F_Deleted {
	align: center;
	display: flex;
	justify-content: center;
	color: #000;
	background-color: #ddd;
	border: 2px solid #222;
	padding: 1em;
}
.F_Window, .F_Window_script {
	color: #000;
	background-color: #bbb;
	border-style:solid;
	border-width:2px;
	border-left-color: #fff;
	border-top-color: #fff;
	border-right-color: #444;
	border-bottom-color: #444;
	max-width:50em;
	margin-top:2em;
	margin-bottom:2em;
	margin-left:2em;
	margin-right:2em;
}
.F_Title {
	background-color:#38E;
	padding-top: 0.2em;
	padding-bottom: 0.2em;
	padding-right: 0.2em;
	padding-left: 0.2em;
	margin:0px;
	color:#FFF;
	font-weight:bold;
	text-align: center;
}
.F_Title_Text {
	margin-right: 0.1em;
	margin-left: 0.1em;
}
.F_Button {
	text-align:center;
}
.E_Button, .E_Title_Button {
	color: #000;
	background-color: #bbb;
	border-right-color: #888;
	border-bottom-color: #888;
	border-left-color: #fff;
	border-top-color: #fff;
}
.E_Button:active, .E_Title_Button:active {
	border-right-color: #fff;
	border-bottom-color: #fff;
	border-left-color: #888;
	border-top-color: #888;
}
.E_Button {
	padding-left: 2em;
	padding-right: 2em;
	padding-top: 0.3em;
	padding-bottom: 0.3em;
	margin-bottom: 0.6em;
	margin-left:1.2em;
	margin-right:1.2em;
	border-width:2px;
}
.E_Button:disabled, .E_Title_Button:disabled {
	color: #444;
	background-color: #888;
	border-right-color: #666;
	border-bottom-color: #666;
	border-left-color: #aaa;
	border-top-color: #aaa;
}
.E_Button:disabled:active, .E_Title_Button:disabled:active {
	border-right-color: #666;
	border-bottom-color: #666;
	border-left-color: #aaa;
	border-top-color: #aaa;
}

.E_Title_Button {
	padding: 0.0em;
	width:1.5em;
	height:1.5em;
	text-align: center;
	align: right;
	float: right;
	margin-top:0.1em;
	margin-right:0em;
	margin-left:0.5em;
	border-width:1px;
}
.F_Icon {
	width: 64px;
}
.E_Icon {
	margin-left:1em;
	margin-right:0.1em;
	margin-top:0.5em;
}
.F_Progress {
	text-align:center;
	color:#FF0000;
}
.E_Progress {
	margin-top:1em;
	width:90%;
	height:1.5em;
	background-color:#DDD;
	border-width: 1px;
	border-style: solid;
	border-right-color: #fff;
	border-bottom-color: #fff;
	border-left-color: #888;
	border-top-color: #888;
}
.F_Textinput {
	text-align:center;
	padding-bottom:1em;
}
.E_Textinput {
	width:80%;
	border: 1px solid black;
	background-color: white;
	height:1.75em;
}

.F_Message {
	color: #000;
	text-align: left;
	padding: 1em;
}
.D_TOP {
	align: center;
	display: flex;
	justify-content: center;
}
/* Highlight message box if reached by a "#" link
(shouldbe used on static pages only */
.D_TOP_anchor {
	border: 1px solid transparent;
}
.D_TOP_anchor:target {
	background-color: #ffffff44;
	border: 1px dashed #000000;
}
.D_ID, #errorID {
	margin-top: 2em;
	padding: 0.2em;
	padding-left: 0.4em;
	padding-right: 0.4em;
	background-color: #ccc;
	border: 1px solid black;
}
.D_ID {
	display: inline;
	float: right;
	align: right;
	color: black;
}
.D_ID a {
	color: black;
}

table.infotable, table.infotable td {
	border-style: solid;
	border-width: 1px;
	background-color: #eee;
}
table.infotable {
	border-color: #000;
	margin-top: 1.5em;
	margin-bottom: 0.5em;
}
table.infotable td {
	border-color: #000;
}
table.infotable caption {
	background-color: #ddd;
	font-weight: normal;
	border: 1px solid black;
	padding: 0.2em;
}
table.infotable th {
	background-color: #ddd;
	text-align: center;
	font-weight: bold;
}
table.infotable td, table.infotable th {
	padding: 0.4em;
}

/* Shrink buttons and icons on small windows */
@media only screen and ((max-width: 600px) or (max-height: 800px)) {
	.navIconText {
		display: none;
	}
	.navIcon {
		padding: 0.5em;
	}
	.F_Window_script, .F_Deleted {
		top: calc(50vh - 3em);
	}
	.E_Icon {
		margin-right:0em;
		width: 32px;
		height: 32px;
	}
	.F_Icon {
		width: 48px;
	}
	.taskbar-link {
		padding-left:0.3em;
		padding-right:0.3em;
		margin-right:0.1em;
	}
}