/* Forenbit / Kategorien */

.index-forum {
	width: 100%;
  height: auto;
  background: var(--tbhintergrund);
  margin: auto;
  margin-bottom: 10px;
  box-sizing: border-box;
  display: flex;
	flex-wrap: nowrap;
  justify-content: space-between;
  align-items: center;
	color: var(--schriftfarbe1);
}



.index-forum .left {
  margin: 10px;
  padding-left: 20px;
  padding-right: 20px;
	flex: 0 0 60%;
}

.index-forum .title {
	text-transform: lowercase;
  font-weight: 800;
  font-size: 22px;
  font-family: var(--);
  letter-spacing: 1px;
  padding: 5px;  
}

.index-forum .title a {
	color: var(--schriftfarbe1) !important;
}

.index-forum .title a:hover {
	color: var(--tbbold) !important;
}

.index-forum .title::before {
background-color: var(--tbbold);
content: "";
display: inline-block;
position: relative;
height: 2px;
vertical-align: middle;
width: 20%;
margin-right: 10px;
}

.index-forum .title::after {
	content: ".";
	color: var(--tbbold);
}


.index-forum .left .description {
	font-size: 12px;
  text-align: justify;
  overflow: auto;
  width: auto;
  max-height: 60px;
  padding-right: 7px;
  margin-bottom: 15px;
	font-family: var(--);
}

.index-forum .left .threadzahl {
  text-transform: lowercase;
  font-size: 10px;
  letter-spacing: 1.5px;
	font-family: var(--);
	color: var(--tbbold);
}

.index-forum .middle {
height: 125px;
  flex: 0 0 10%;
  align-items: center;
  justify-content: center;
  display: flex;
}

.index-forum .right {
  align-items: center;
  justify-content: center;
	padding-right: 10px;
	flex: 0 0 30%;
}


.index-forum .right .daten {
  text-transform: lowercase;
  font-size: 12px;
  letter-spacing: 1.5px;
  padding-bottom: 5px;
	text-align: center;
	font-family: var(--);
}

.daten a:hover {
	color: var(--tbbold);
}

.daten a {
	color: var(--tbitalic);
}

.indexcat {
	text-transform: lowercase;
	font-size: 12px;
	padding-bottom: 15px;
	padding-left: 5px;
	margin-top: 10px;
}

/* Scrollbar */
 .index-forum .left .description::-webkit-scrollbar {
    width: 5px;
}

.index-forum .left .description::-webkit-scrollbar-track {
  background: var(--tbvordergrund);
}

.index-forum .left .description::-webkit-scrollbar-thumb {
  background: var(--tbbold);
}


/* Footer Tabelle */

.footer-tabelle {
	width: 100%;
	background: var(--tbhintergrund);
	color: var(--schriftfarbe1);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	height: auto;
	margin: auto;
	margin-bottom: 10px;
	margin-top: 30px;
	box-sizing: border-box;
	padding: 20px;
}

.footer-tabelle .title {
	font-family: var(--);
	text-transform: lowercase;
	letter-spacing: 1.5px;
	text-align: center;
	font-size: 15px;
	padding-bottom: 3px;
}

.footer-tabelle .title::before {
background-color: var(--tbbold);
content: "";
display: inline-block;
position: relative;
height: 2px;
vertical-align: middle;
width: 20%;
margin-right: 10px;
}

.footer-tabelle .title::after {
	content: ".";
	color: var(--tbbold);
}

.footer-tabelle .online {
	width: 33%;
	height: auto;
  font-size: 10px;
  letter-spacing: 1.5px;
  padding-bottom: 5px;
	text-align: center;
	margin-bottom: 40px;
	color: var(--schriftfarbe1);
}

.footer-tabelle .stats {
	width: 50%;	
	height: auto;
  font-size: 10px;
  letter-spacing: 1.5px;
  padding-bottom: 5px;
	margin-bottom: 40px;
	text-align: center;
	font-family: var(--);
}

.footer-tabelle .quotes {
	width: 50%;
	height: auto;
  font-size: 10px;
  letter-spacing: 1.5px;
  padding-bottom: 5px;
	text-align: center;
	color: var(--schriftfarbe1);
}

.footer-tabelle .sisters {
	width: 60%;
	height: auto;
  font-size: 10px;
  letter-spacing: 1.5px;
  padding-bottom: 5px;
	text-align: center;
	color: var(--schriftfarbe1);
}

.footer-tabelle .theme select {
	border-color: #ccc;
}


/* Navigation */
.navi-wrapper {
  width: 100%;
	height: auto;
  display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	align-items: center;
 background-color: var(--tbhintergrund);
	padding: 10px 0px;
	position: fixed;
	z-index: 1;
	top: 0;	
}

.navi-wrapper .navi {
	flex: 0 0 80%;
	height: auto;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 30px;
}

.navi-wrapper .navi div {
	height: auto;
  font-family: var(--);
  text-transform: lowercase;
  letter-spacing: 1.5px;
  font-size: 12px;
  font-weight: bold;
  text-align: left;	
	  }

.navi-ava {
width: 80px;
  border: 3px double var(--tbbold);
  position: absolute;
  top: -1px;
  left: 7px;
  z-index: 10;
}

.navi-user {
	width: 100%;
  height: auto;
  display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 20px;
	margin-top: 30px;
	padding: 10px 0px;
}

.navi2 a {
	color: var(--schriftfarbe1);
}

.navi2 a:hover {
	color: var(--tbbold);
}

.navi-user .navi2 {
	 height: auto;
	color: var(--schriftfarbe1);
  font-family: var(--);
  text-transform: lowercase;
  letter-spacing: 1.5px;
  font-size: 12px;
  font-weight: bold;
  text-align: center;
	  }

/* Tabelle */

.header-tabelle {
width: 82%;
background: var(--tbhintergrund);
color: var(--schriftfarbe1);
display: flex;
justify-content: flex-start; /* wichtig! */
height: auto;
margin: 30px auto; /* sauber zentriert */
box-sizing: border-box;
padding: 20px;
}

.header-tabelle .title {
	font-family: var(--);
	text-transform: lowercase;
	letter-spacing: 1.5px;
	text-align: left;
	font-size: 15px;
	padding-bottom: 3px;
	font-weight: 800;
		color: var(--schriftfarbe1);
}

.header-tabelle .title::before {
background-color: var(--tbbold);
content: "";
display: inline-block;
position: relative;
height: 2px;
vertical-align: middle;
width: 20%;
margin-right: 10px;
}

.header-tabelle .title::after {
	content: ".";
	color: var(--tbbold);
}

.header-tabelle .tabelle {
	width: 50%;
	height: auto;
  font-size: 10px;
  letter-spacing: 1.5px;
  padding-bottom: 5px;
	text-align: left;
	margin-bottom: 40px;
	color: var(--schriftfarbe1);
}

/* Credits */

.credits-wrapper {
	width: 50%;
	background: var(--tbhintergrund);
	color: var(--schriftfarbe1);
	height: auto;
	margin: auto;
	padding-bottom: 30px;
	padding-top: 50px;
	margin-bottom: 10px;
	box-sizing: border-box;
}

.credits-wrapper .credits {
	 text-transform: lowercase;
  font-size: 10px;
  color: var(--schriftfarbe1);
  letter-spacing: 1.5px;
  padding-bottom: 7px;
	text-align: center;
	font-family: var(--);
}

.banner {
  display: block;
  margin: 0 auto;       /* zentriert auf Desktop */
  width: 100%;          /* responsive */
  max-width: 1259px;    /* begrenzt auf Originalgröße */
  height: auto;         /* hält Seitenverhältnis */
border: 0; 
}

@media (max-width: 768px) {
  .header-tabelle {
    width: 100%;
    padding: 15px;
  }
}