.clubflex {display:flex; 
    flex-wrap:wrap; 
    gap:10px!important; 
    justify-content:space-evenly;}

.club {
    width:225px !important;
    border: 3px solid var(--mittelbraun);
    padding:0px 5px!important;
    background: #fff;
color: var(--lightfont);
	--accent1: #fbc483;
--lightfont: #CFCECC;
	--darkbg:#0b1b27;
}

.club img {
display: block;
margin: auto;}

.club h3 {
    font-weight: 500;
	font-size:11px;
    text-transform: uppercase;
	color: var(--accent1);
    line-height: 1;
    padding: 10px 0px;
    border-bottom:1px solid var(--accent1);
	font-weight:bold;
	margin-left:-10px;
	margin:auto auto;
}

.club h3 a:hover {
color: white;
transition:2s;
text-decoration:none;}

.club h4, h4 a {
    font-weight: 300;
	font-family: 'Georgia';
	font-size:11px;
	width:215px!important; 
    text-transform: uppercase;
	color: var(--fontnormal);
    padding: 10px 5px;
border-bottom:1px solid var(--h2font);
	font-weight:bold;
	background: var(--darkbg);
	text-align:center;
}

.club h2, h2 a {
  font-family: 'Georgia';
  font-size: 13px;
	width:215px; 
	margin:auto;
	letter-spacing:1px !important;
  color: var(--mittelbraun);
	line-height: 100%;
padding:5px;
border-bottom:1px solid var(--accent1);}

.club img {
    width:225px;
    height:200px;}

.clubdesc {
    padding:10px;
    line-height:1.2;
    text-align:justify;
}

.clubgesuche {
padding: 0px 10px 10px 10px;}

.clubminiinfo {width:25%; max-height:300px; overflow:auto;}

.clubmember {
    margin-top:10px;
    border-top:1px solid var(--accent1);
    padding:5px;}

.clubbutton {
    letter-spacing: 5px; 
    text-transform: uppercase; 
    color: var(--accent1); 
    font-size:10px; 
    background:none; 
    border:none; 
    font-weight:bold;}

.infopop {
    position: fixed; 
    top: 0; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    background: hsla(0, 0%, 0%, 0.8); 
    z-index: 1; 
    opacity: 0; 
    pointer-events: none; /* Verhindert Interaktionen, wenn das Popup nicht sichtbar ist */
    visibility: hidden; /* Popup ist unsichtbar, wenn nicht aktiv */
    transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
}

.infopop:target {
    opacity: 1;
    pointer-events: auto; /* Ermöglicht Interaktionen, wenn das Popup sichtbar ist */
    visibility: visible; /* Popup wird sichtbar, wenn es aktiviert ist */
}

.infopop > .pop {
    background: var(--hgnormal);
    border: solid 1px var(--fontkal);
    width: 1023px;
    position: relative;
    margin: 320px auto 0px auto;
    padding: 25px;
    z-index: 3;
    margin-top: 10%;
}

.closepop {
    position: absolute; /* Positioniere den Schließen-Link oben rechts im Popup */
    top: 10px;
    right: 10px;
    text-decoration: none;
    color: var(--mittelbraun);
}
