html, body {
  height: 100%;
  margin: 0;
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial;
  background:#f7f7f7;
}

h1,h2{margin:0 0 12px}
h3,h4{margin:0 0 9px}

img {
  display: block;
  margin: 0 auto;
}

.header {
  width: 100%;
  margin-bottom: 20px;
}

.title {
  display: flex;
  align-items: center;        /* vertikal zentriert */
  justify-content: space-between; /* Text links, Logo rechts */
  font-size: 28px;
  font-weight: 700;
}



.title img {
  max-width: 80px;   /* oder 10%, wenn gewünscht */
  height: auto;
}

.logo {
  max-width: 80px;
  height: auto; /* Höhe nach Bedarf anpassen */
}


@media print {
  .no-print {
    display: none;
  }
}

.container{max-width:900px;margin:0 auto;background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,.06)}
    
label{display:block;margin:10px 0 4px;font-weight:600}
 input[type="text"], input[type="email"], input[type="date"], input[type="tel"], select, textarea{
      width:100%;padding:8px;border:1px solid #ccc;border-radius:4px;box-sizing:border-box
    }
.row{display:flex;gap:16px;flex-wrap:wrap}
.col{flex:1;min-width:200px}
.checkboxes label{display:inline-block;margin-right:12px;font-weight:400}
.small{font-size:0.9em;color:#555}
.actions{margin-top:16px}

button{padding:10px 16px;border:0;background:#0073e6;color:#fff;border-radius:6px;cursor:pointer}
fieldset{margin-top:12px;padding:12px;border-radius:6px;border:1px solid #e6e6e6}

.festgeklebt {
    background-color: hsla(80, 61%, 50%, 0.6);
    text-align: center;
    font-size: 2em;
    line-height: 3em;
}

.g2g-respo-table {display: block;}

.g2g-respo-table * {
box-sizing:border-box;
}
.g2g-respo-table table {
width:100%;
}

.g2g-respo-table table,
.g2g-respo-table td,
.g2g-respo-table tr,
.g2g-respo-table th {
border:2px solid black;
border-collapse: collapse;
text-align: center;
}

.g2g-respo-table td,
.g2g-respo-table tr,
.g2g-respo-table th {
padding:1em;
}

.g2g-respo-table th {
background:#eee;
font-weight: bold;
}

@media screen and (max-width:700px) {

.g2g-respo-table tr {
border-bottom: none;
}

.g2g-respo-table td {
padding:0;
border:1px solid black;
}

.g2g-respo-table table {
border:none;
}

.g2g-respo-table thead {
display:none;
}

.g2g-respo-table tr {
float: left;
width: 100%;
margin-bottom: 2em;
}

.g2g-respo-table td {
float: left;
width: 100%;
padding:1em !important;
border-left: 1px;
border-right: 1px;
}

.g2g-respo-table td::before {
content:attr(data-label);
word-wrap: break-word;
background: #eee;
border-right: 1px solid black;
width: 20%;
float:left;
padding:1em;
font-weight: bold;
margin:-1em 1em -1em -1em;
}
}

table { /* Styling der Tabelle */ }

.table-scrollable {
  width: 100%;
  overflow-y: auto;
  margin: 0 0 1em;
}

.table-scrollable::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 14px;
  height: 14px;
}

.table-scrollable::-webkit-scrollbar-thumb {
  border-radius: 8px;
  border: 3px solid #fff;
  background-color: rgba(0, 0, 0, .3);
}


div.seite {
  display: table;
  width: 100%;
  height: 100%;
}

div.seite > div {
  display: table-row;
}

div.kopf {
  display: table-cell;
  height: 100px;
}

div.inhalt {
  display: table-cell;
}

div.fuss {
  display: table-cell;
  height: 50px;
}

ul {
  display: table;
  width: 500px;
}

li {
  display: table-cell;
  table-layout: fixed;
  border-spacing: 5px;
}

.tel {
  color: black;
  padding: 1px 1px;
  border-radius:50%;
  font-size: 10px;
  cursor: pointer;
}
.barcode {
  color: black;
  padding: 10px 10px;
  border-radius:10%;
  font-size: 10px;
  cursor: pointer;
}
.web {
  color: black;
  padding: 10px 10px;
  border-radius:10%;
  font-size: 10px;
  cursor: pointer;
}
.pdf {
  color: black;
  padding: 10px 10px;
  border-radius:10%;
  font-size: 10px;
  cursor: pointer;
}


.btn {
  border: 5px solid black;
  border-radius: 15px;
  background-color: darkgrey;
  color: black;
  padding: 14px 28px;
  font-size: 16px;
  cursor: pointer;
}

/* Green */
.success {
  border-color: hsla(80, 61%, 50%, 0.6);
  color: black;
}

.success:hover {
  background-color: hsla(80, 61%, 50%, 0.6);
  color: white;
}

/* Blue */
.info {
  border-color: #2196F3;
  color: dodgerblue
}

.info:hover {
  background: #2196F3;
  color: white;
}

/* Yellow */
.highlight {
  border-color: #FFFF00;
  color: yellow;
}

.highlight:hover {
  background: #FFFF00;
  color: white;
}


/* Orange */
.warning {
  border-color: #FF9800;
  color: orange;
}

.warning:hover {
  background: #FF9800;
  color: white;
}

/* Red */
.danger {
  border-color: #F44336;
  color: red
}

.danger:hover {
  background: #F44336;
  color: white;
}

/* Gray */
.default {
  border-color: #E7E7E7;
  color: black;
}

.default:hover {
  background: #E7E7E7;
}

/* --- Kopfbereich für Impressum (angepasst auf h2) --- */
.page-header {
  display: flex;
  align-items: center;
  gap: 1.2rem;
  background: #f8f8f8;
  border-bottom: 2px solid #003366;
  padding: 1rem 1.2rem;
  border-radius: 6px;
  margin-bottom: 1.5rem;
}


.page-header .logo {
  max-width: 90px;
  height: auto;
}

.page-header .header-text h2 {
  margin: 0;
  font-size: 1.5rem;
  color: #003366;
}

.page-header .vereinstitel {
  font-weight: 600;
  color: #222;
  margin: 0.2rem 0;
}

.page-header .untertitel {
  color: #555;
  font-size: 0.9rem;
  margin: 0;
}

.intro {
  background: #ffffff;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 1rem 1.2rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  margin-bottom: 1.5rem;
}

.intro p {
  margin: 0.3rem 0;
}