/* cmsms stylesheet: 2026 SVG Social Media mit Containern modified: Samstag, 14. März 2026 17:13:37 */
/* Der neue Flex-Container */

.flex-container2 {
          display: flex;
          
          flex-wrap: wrap; /* Standardwert = nowrap */
          /* border: 2px dotted rgb(96 139 168); */
          border-radius: 20px;
          background-color: rgb(96 139 168 / 0.2);
          gap: 20px; /* Abstand zwischen den Items */
  
}

.flex-item {
          flex-basis: 45%;
          flex-grow: 1;
          flex-shrink: 1;
          border: 1px solid rgb(96 139 168);
          border-radius: 20px;
          padding-top: 20px;
          padding-bottom: 20px;
          padding-left: 25px;
          padding-right: 0px;
}
/* cmsms stylesheet: 2026 SVG Tabelle Normal modified: Freitag, 13. März 2026 10:34:04 */
.tabellenormal
{
          background:#f0f0f0;
          width: 100%;
          border="0";
          border-color:#f0f0f0;
}
.tabellenormal tr, .tabellenormal td, .tabellenormal th, .tabellenormal thead
{
          background:#f0f0f0;
          border="0";
          font-family: verdana,geneva;
}
.tabellenormal caption
{
          padding:4px 10px 4px 5px;
}
.tabellenormal tbody tr:nth-child(even) td, .tabellenormal tbody tr.even td
{
          background:#f0f0f0;
          border="0";
}
.tabellenormal tfoot
{
          font-style:italic;
          border="0";
}
/* cmsms stylesheet: 2026 SVG Tabelle Info rund Ecken modified: Samstag, 14. März 2026 15:16:42 */
.infoboard table {
	width:100%;
        border-radius: 16px;
}

.infoboard img {
        max-width: 95%;
        height: auto;
        /* Hier Änderungen zum zentrieren der Bilder*/        
        /*float: center;*/
        display: block;
        margin: auto;
        /*border: 8px double red;*/
        border-radius: 10px;
}
/* Hier der Test zum zentrieren der Bilder*/

.flex { 
    display: flex; 
    justify-content: center; 
    align-items: center;
    margin: auto;
}

.infoboard table, .infoboard td, .infoboard tr, .infoboard th {
	/*border:2px solid black;*/
	border-collapse: collapse;
	text-align: left;
        background-color: #e7e7e7;
        border-radius: 16px;
        
}

.infoboard td, .infoboard tr, .infoboard th {
	padding:1em;
}

.infoboard th {
	background:#eee;
	font-weight: bold;
}

/*               AB HIER FÜR KLEINERE MONITORE                  */

@media screen and (max-width:700px) {
	
	.infoboard table, .infoboard tr, .infoboard td {
		padding:0;
		border:1px solid black;
	}

	.infoboard table {
		border:none;
	}

	.infoboard thead {
		display:none;
	}

	.infoboard tr {
		float: right;
                width: 100%;
		margin-bottom: 2em;
	}

	.infoboard td {
		float: right;
		width: 93,5%;
		padding:1em;
	}

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

/* Hier der Test für die runden Ecken */

.infoboard {
  border-collapse: separate; /* Wichtig! */
  border-spacing: 0;
  border: 1px solid #ccc;
  border-radius: 20px; /* Tabelle allgemein */
  overflow: hidden; /* Schneidet Inhalte an den Ecken ab */
}

/* Obere linke Ecke */
.infoboard tr:first-child th:first-child {
  border-top-left-radius: 20px;
}
/* Obere rechte Ecke */
.infoboard tr:first-child th:last-child {
  border-top-right-radius: 20px;
}
/* Untere linke Ecke */
.infoboard tr:last-child td:first-child {
  border-bottom-left-radius: 20px;
}
/* Untere rechte Ecke */
.infoboard tr:last-child td:last-child {
  border-bottom-right-radius: 20px;
}
/* cmsms stylesheet: 2026 SVG Tabelle Responsive Vorstand modified: Freitag, 13. März 2026 10:50:40 */
/* Hier erst mal die Standartformatierung ohne die Überschrift */
.vorstand {
	border-collapse: collapse;
}
.vorstand td, .vorstand th {
	padding: 1em;
}
.vorstand th:first-child {
	padding-left: .5em;
}
.vorstand th:last-child, .vorstand td:last-child {
	padding-right: .5em;
}
.vorstand thead th {
	border-bottom: 2px solid lightblue;
}
.vorstand tbody th {
	font-weight: normal;
	text-align: left;
}
.vorstand th a {
	background: url(pdf.png) no-repeat left center;
	padding: 15px 5px 15px 40px;
}
.vorstand td {
	 text-align: center;
}
.vorstand td:nth-child(3) {
	text-align: right;
}
.vorstand td:nth-child(4) {
	color: red;
	font-weight: bold;
}
.vorstand td.paid {
	color: green;
	font-weight: normal;
}
/* Hier Ende der Standartformatierung */

/* schmale und sehr schmale Viewports */
@media screen and (max-width: 42em) {
        .vorstand, .vorstand tbody, .vorstand tr {
		display: block;
        }
	.vorstand thead {
		display: none;
	}
	.vorstand tr:first-child {
		border-top: 2px solid lightblue;
	}
	.vorstand tr {
		border-bottom: 2px solid lightblue;
		padding: .5em 2em 1em;
	}
	.vorstand th::before {
		content: "Funktion: ";
	}
	.vorstand td:nth-child(2)::before {
		content: "Name: ";
	}
	.vorstand td:nth-child(3)::before {
		content: "Vorname: ";
	}
	.vorstand td:nth-child(4)::before {
		content: "Telefon: ";
	}
	.vorstand td:nth-child(5)::before {
		 content: "E-Mail: ";
	}
	.vorstand td.paid + td::before {
		content: "";
	}
	.vorstand tbody th {
		display: block;
		font-weight: bold;
	}
	.vorstand th a {
		font-weight: normal;
	}
	.vorstand td {
		display: inline-block;
		min-width: 30%;
		padding: .2em 2em;
		text-align: left;
	}
	.vorstand td:nth-child(3) {
		text-align: left;
	}
}
@media screen and (max-width: 33em) {
	.vorstand td {
		display: block;
	}
        .vorstand tr {
                padding: .5em .5em 1em;
        }
}
/* Ende schmale und sehr schmale Viewports */
/* cmsms stylesheet: 2026 SVG Tabelle Responsiv Ansprechpartner modified: Freitag, 13. März 2026 10:34:51 */
/* Hier erst mal die Standartformatierung ohne die Überschrift */
.ansprechpartner {
	border-collapse: collapse;
}
.ansprechpartner td, .ansprechpartner th {
	padding: 1em;
}
.ansprechpartner th:first-child {
	padding-left: .5em;
}
.ansprechpartner th:last-child, .ansprechpartner td:last-child {
	padding-right: .5em;
}
.ansprechpartner thead th {
	border-bottom: 2px solid lightblue;
}
.ansprechpartner tbody th {
	font-weight: normal;
	text-align: left;
}
.ansprechpartner th a {
	background: url(pdf.png) no-repeat left center;
	padding: 15px 5px 15px 40px;
}
.ansprechpartner td {
	 text-align: center;
}
.ansprechpartner td:nth-child(3) {
	text-align: right;
}
.ansprechpartner td:nth-child(4) {
	color: red;
	font-weight: bold;
}
.ansprechpartner td.paid {
	color: green;
	font-weight: normal;
}
/* Hier Ende der Standartformatierung */

/* schmale und sehr schmale Viewports */
@media screen and (max-width: 42em) {
        .ansprechpartner, .ansprechpartner tbody, .ansprechpartner tr {
		display: block;
        }
	.ansprechpartner thead {
		display: none;
	}
	.ansprechpartner tr:first-child {
		border-top: 2px solid lightblue;
	}
	.ansprechpartner tr {
		border-bottom: 2px solid lightblue;
		padding: .5em 2em 1em;
	}
	.ansprechpartner th::before {
		content: "Funktion: ";
	}
	.ansprechpartner td:nth-child(2)::before {
		content: "Name: ";
	}
	.ansprechpartner td:nth-child(3)::before {
		content: "Telefon: ";
	}
	.ansprechpartner td:nth-child(4)::before {
		content: "E-Mail: ";
	}
	.ansprechpartner td:nth-child(5)::before {
		 content: " ";
	}
	.ansprechpartner td.paid + td::before {
		content: " ";
	}
	.ansprechpartner tbody th {
		display: block;
		font-weight: bold;
	}
	.ansprechpartner th a {
		font-weight: normal;
	}
	.ansprechpartner td {
		display: inline-block;
		min-width: 30%;
		padding: .2em 2em;
		text-align: left;
	}
	.ansprechpartner td:nth-child(3) {
		text-align: left;
	}
}
@media screen and (max-width: 33em) {
	.ansprechpartner td {
		display: block;
	}
        .ansprechpartner tr {
                padding: .5em .5em 1em;
        }
}
/* Ende schmale und sehr schmale Viewports */
