:root {
	--bgColor: #102030;
	--rgbBgColor: 16,32,48;
	--topBarBgColor: #000;
	--textColor: #fff;
	--highlightColor: #f2da77;
	--linkColor: #6eb7ff;
	--linkColorHover: #2077f7;
  }

html {
	padding: 0;
	margin: 0;
	scroll-behavior: smooth;
}
body {
  background-color: var(--bgColor, #102030);
  color: var(--textColor, #fff);
  font-family: sans-serif;
  text-align: center;
  font-size: 2em;
}
h1 {
  margin-block-start: 0.5em;
  margin-block-end: 0.8em;
	color: var(--highlightColor);
}
h1 a, h1 a:hover {
	color: var(--highlightColor);
	text-shadow: 0px 0px 8px rgba(0,0,0,0.9);
}
.header-subline {
  position: relative;
  top: -57px;
  font-size: 0.6em;
	text-shadow: 0px 0px 7px rgba(0,0,0,0.99);
}
h2 {
  margin-block-start: 1em;
  margin-block-end: 1em;
	color: var(--highlightColor);
}
em {
	font-style: normal;
	color: var(--highlightColor);
}
button {
  border-radius: 1000px;
  padding: 0.2em 0.6em;
  color: var(--bgColor, #102030);
	/* background-color: var(--highlightColor); */
}
a {
  color: var(--linkColor, #6eb7ff);
  text-decoration: none;
}
a:hover {
	/* text-decoration: underline; */
	color: var(--linkColorHover, #2077f7)
}
.xactive {
  font-weight: bold;
}

#TopBar {
  /* padding: var(--abstand-links,20px); */
  /* display: none; */
  position: fixed;
  background-color: var(--topBarBgColor, #000);
	background-image: url("images/header_1280_flat.jpg");
	background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 800;
  width: 100%;
  height: 221px;
  top: 0;
  left: 0;
	overflow: hidden;
}
#navigation ul {
  list-style: none;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: nowrap;
  margin: 0;
  padding: 0;
  font-size: 0.8em;
}
#navigation li a {
  text-decoration: none;
}
#navigation .menu {
  padding: 10px 20px 14px 20px;
	background-color: rgba(var(--rgbBgColor), 0.5);
	text-shadow: 0px 0px 7px rgba(0,0,0,0.99);
  border-radius: 20px 20px 0 0; /* radius raus */
	margin: 0 1px; /* radius raus */
	box-shadow: 0px -4px 8px 2px rgba(0,0,0,0.75); /* radius raus */
}
#navigation .menu.active:hover {
	color: var(--linkColorHover);
}
#navigation .menu:hover {
  background-color: rgba(var(--rgbBgColor), 0.75);
  color: var(--linkColorHover);
  /* background-color: #fff2; */
}
#navigation .active {
  color: var(--textColor, #fff);
  background-color: var(--bgColor, #102030) !important ;
}

#Content {
  margin: 255px auto 0 auto;
  font-size: 0.8em;
	width: 98%;
}
img {
  width: 100%;
	border-radius: 30px; /* radius raus */
}
.maxwidthbox {
  max-width: 950px;
  padding: 40px 80px 40px 80px;
  margin: auto;
}
.maxwidthbox img {
	max-width: 750px;
}
.formbox {
  max-width: 950px;
  padding: 40px;
  margin: auto;
}
.formbox label {
	display: inline-block;
	/* width: 49%; */
	/* background-color: red; */
	/* white-space: nowrap; */
}
.formbox input[type="text"] {
	font-size: 1em;
	margin: auto;
	width: 98%;
	padding: 7px 10px;
}
.formbox textarea {
	font-size: 1em;
	font-family: inherit;
	margin: auto;
	width: 98%;
	height: 12lh;
	padding: 10px;
}
.quoteblock {
  color: var(--highlightColor);
  max-width: 950px;
  width: fit-content;
  margin: 10px auto;
}
.quoteblock-name {
  float: right;
  color: var(--highlightColor);
  font-size: 0.7em;
  font-style: italic;
  opacity: 0.7;
}

/* input[type=file]::file-selector-button {
  border: 2px solid #6c5ce7;
  padding: .2em .4em;
  border-radius: .2em;
  background-color: #a29bfe;
  transition: 1s;
	font-size: 2.3em;
	cursor: pointer;
}

input[type=file]::file-selector-button:hover {
  background-color: #81ecec;
  border: 2px solid #00cec9;
} */

.wegbox input[type="file"] {
  display: none;
}
.custom-file-upload {
  border: 1px solid #ccc;
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer;
}
#xfile-selected {
	background-color: #0f05;
	padding: 10px 20px;
}
input[type="submit"] {
  /* border: 1px solid #000; */
  display: inline-block;
  padding: 13px 20px;
  cursor: pointer;
  border-radius: 1000px;
	font-size: 1em;
	background-color: var(--highlightColor);
}
.smallSubButton {
	font-size: 0.8em;
	border-radius: 1000px;
	background-color: #fff2;
	color: #fffa;
	padding: 6px 30px;
	margin-bottom: 5px;
}

.fotobox {
  max-width: 950px;
  padding: 30px;
  margin: 30px auto;
  background-color: #0005;
	border-radius: 50px; /* radius raus */
}

.datumsZeile {
	position: relative;
	font-style: italic;
	font-size: 0.8em;
	top: 15px;
	color: #fff7;
}

.nameDesAutors {
	color: var(--highlightColor);
	font-style: italic;
	font-size: 0.8em;
	position: relative;
	top: 34px;
}

.prevnextpage {
  border: 1px solid var(--linkColor);
  display: inline-block;
  padding: 6px 12px;
  cursor: pointer;
}
.prevnextpage:hover {
	border: 1px solid var(--linkColorHover);
}

.postStatus {
	position: relative;
	/* background-color: pink; */
	top: 0px;
	right: 0px;
	width: 100%;
	text-align: right;
}