/* Headerbild */
.puzzle_headerpic{
}

.puzzle_headerpic img{
    width:100%;
	background-size:cover;
}

#puzzle_headertabelle {
    display: grid;
    grid-template-rows: var(--bild-w);
    grid-template-columns: var(--bild-h)  1fr 1fr;
    gap: 0px;
}

/* Adminbox */
#admins{
	grid-row-start: 1;
	grid-column-start: 1;
	grid-row-end: 1;
	grid-column-end: 1;
	background-color: var(--colorbase29);
}
#infonews {
	grid-row-start: 1;
	grid-column-start: 2;
	grid-row-end: 1;
	grid-column-end: 2;
	background-color: var(--colorbase29);
}
#infoevents {
	grid-row-start: 1;
	grid-column-start: 3;
	grid-row-end: 1;
	grid-column-end: 3;
	background-color: var(--colorbase29);
}
#admins h1, #infonews h1, #infoevents h1 {
    font-size: var(--main-xxs);
    font-family: var(--maintitle-font);
    font-weight: 200;
    color: var(--colorbase2);
    text-shadow: var(--shadow1) var(--accent4);
    background: var(--accent3);
    margin: 0px;
    padding: 0px var(--space-m);
    border-left: var(--space-xs) solid var(--accent4);
    border-right: var(--space-xs) solid var(--accent4);
    text-transform: none;
    line-height: var(--main-s);
}

#admins .teambox, #infonews .textbox, #infoevents .textbox{
    margin: var(--space-m) var(--space-s);
    font-family: var(--maintext-font);
    text-align: left;
    height: var(--banner-h);
    overflow-x: hidden;
}

#admins .teambox .admin {
    width: 100%;
    position: relative;
    display: grid;
    grid-template-rows: var(--main-xs) auto;
    grid-template-columns: var(--main-xxxl) auto;
}

#admins .teambox img {
    margin: var(--space-xxs);
    margin-left: var(--space-xs);
    position: relative;
    padding: var(--space-xxs);
    border: var(--border1) var(--colorbase2);
    width: var(--main-m);
    height: var(--main-xl);
    grid-row-start: 1;
    grid-column-start: 1;
    grid-row-end: 3;
    grid-column-end: 2;
}

#admins .teambox .name {
    grid-row-start: 1;
    grid-column-start: 2;
    grid-row-end: 2;
    grid-column-end: 3;
    text-transform: uppercase;
    position: relative;
    top: 5%;
    padding: var(--space-xs);
    font-size: var(--text-m);
    font-family: var(--subtext-font);
}

#admins .teambox .name a{
    color: var(--accent3);
}

#admins .teambox .name a:hover{
    color: var(--accent1);
}

#admins .teambox .name i{
    display:none;
}

#admins .teambox .online {
    grid-row-start: 2;
    grid-column-start: 2;
    grid-row-end: 3;
    grid-column-end: 3;
    padding: 0px var(--space-xxs);
    color: var(--colorbase1);
    font-size: var(--text-m);
    font-family: var(--maintext-font);
    line-height: var(--space-xl);
}

.textbox z {
    text-transform: uppercase;
    font-family: var(--maintext-font);
    line-height: var(--space-bigger);
    color: var(--accent3);
}

.quote2 .datum, .titel2{
    background: var(--accent4);
    margin: var(--space-xxs) 2% var(--space-xxs) 1%;
    box-sizing: border-box;
    padding: var(--space-xxxs) var(--space-s);
    font-size: var(--text-l);
    font-weight: 400;
    color: var(--colorbase2);
    font-style: italic;
    letter-spacing: var(--space-xxxs);
    text-align: left;
    position: relative;
    border-left: var(--space-xs) solid var(--accent3);
    border-right: var(--space-xs) solid var(--accent3);
    z-index: 1;
}

.quote2 .datum::before, .quote2 .titel2::before{
    content: '';
    box-sizing: border-box;
    width: var(--space-s);
    height: 80%;
    background: var(--accent4);
    position: absolute;
    top: -4px;
    left: -14px;
}

/*
.quote2 .datum::after, .quote2 .titel2::after{
    content: '';
    box-sizing: border-box;
    width: var(--space-s);
    height: 80%;
    background: var(--accent4);
    position: absolute;
    top: 8px;
    left: 100.8%;
}

*/
.quote2 .datum2{
    position: relative;
    top: -8px;
    color: var(--colorbase2);
    margin-left: var(--space-l);
    padding: var(--space-xxs);
    background: var(--accent38);
    border: var(--border1) var(--accent4);
    width: 91%;
    text-align: center;
}

.quote2 .text{
	width: 97%;
    text-align: left;
    margin-left: var(--space-m);
    margin-bottom: var(--space-m);
    font-size: var(--text-m);
    font-family: var(--subtext-font);
    line-height: var(--space-xxl);
}

.quote2 .text a{
	color: var(--accent1);
	text-decoration: underline;
}

.quote2 .text a:hover{
	color: var(--accent3);
}

.quote2 .link {
    float: left;
    position: relative;
    color: var(--colorbase2);
    margin-left: var(--space-xl);
    padding: var(--space-xxs);
    background: var(--accent4);
    border: var(--border1)  var(--accent3);
    width: 40%;
    text-align: center;
}

.quote2 .link a{
	color: var(--colorbase2);
}

.quote2 .link:hover{
	background: var(--colorbase2);
	color:var(--accent1) !important;
}

.quote2 .link a:hover{
	color: var(--accent1);
}

/* Overview*/
#forumbox {
	margin-bottom: var(--space-xs);
}

/* Accordion 2*/
#forumbox .accordion2 {
    width: 100%;
    border: 0px;
    border-radius: 0px;
    font-size: var(--main-xxs);
    font-family: var(--maintitle-font);
    font-weight: 200;
    color: var(--colorbase2);
    text-shadow: var(--shadow1) var(--accent4);
    background: var(--accent3);
    padding: 0px var(--space-m);
    border-left: var(--space-xs) solid var(--accent4);
    border-right: var(--space-xs) solid var(--accent4);
    text-transform: none;
    line-height: var(--main-s);
	margin-left: 0px;
    margin-bottom: var(--space-xs);
}

#forumbox .accordion2:hover{
	background: var(--colorbase2);
	color:var(--accent3);
    -webkit-transition:var(--fast);
    transition:var(--fast);
    -ms-transition:var(--fast);
    -o-transition:var(--fast);
    -moz-transition:var(--fast);
}

#forumbox .accordion2:after {
    float: right;
    margin-left: var(--space-s);
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f358";
    font-size: var(--text-l);
    color: var(--colorbase2);
	text-shadow: var(--shadow1) var(--accent4);
    text-shadow: none;
    margin-top: -35px;
}

#forumbox .active2:after{
  font-family: "Font Awesome 5 Pro";
  content: "\f35b";
  color:var(--accent4);
  margin-top:-30px;
}

#forumbox .panelle2{
  padding: 0px;
  background: var(--colorbase29);
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

#forumbox #overview{
    height: 200px;
    overflow: auto;
}

#overview .tcat{
}

#overview .tborder {
    background: var(--colorbase25);
    border: 0px;
    border-radius: 0px;
}

#overview table {
    width: 100%;
    margin: 0;
    padding: var(--space-xxs);
	border-radius: 0px;
}

#overview .tcat {
    border-radius: 0px;
    text-transform: none;
    font-family: var(--subtext-font);
    background: var(--accent4);
    margin: var(--space-xxs) 2% var(--space-xxs) 1%;
    box-sizing: border-box;
    padding: var(--space-xs) var(--space-m);
    font-size: var(--text-l);
    color: var(--colorbase2);
    letter-spacing: var(--space-xxxs);
    text-align: left;
    position: relative;
    border-left: var(--space-xs) solid var(--accent3);
    border-right: var(--space-xs) solid var(--accent3);
    z-index: 1;
    line-height: var(--space-bigger);
}

#overview .trow1 {
    border-right: var(--space-xxxs) ridge var(--color3);
    font-size: var(--text-m);
    font-family: var(--subtext-font);
    line-height: var(--space-xxl);
}

#overview .trow2 {
    border-right: var(--space-xxxs) ridge var(--color3);
    font-size: var(--text-m);
    font-family: var(--subtext-font);
    line-height: var(--space-xxl);
}

#overview .smalltext{
	padding: 0px var(--space-xxs);
}

#overview .trow1 a, #overview .trow2 a{
	color: var(--accent1);
	text-decoration:none;
}

#overview .trow1 a:hover, #overview .trow2 a:hover{
	color: var(--accent3);
	text-decoration:underline;
}