@charset "UTF-8";

/* JM */
/* MM allgemeiner Part */
body {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
}

hr {
	/*border-color: #EB891B;
	height: 10px;*/
	border: 10px #EB891B;
	color: aqua;
	background-color: red;
	
	
}
h1 {
	font-size: 25pt;
	margin-top: 5px;
	margin-bottom: 5px;
	
}

h2.jm {
	padding-left: 0px;  /* ursprünglich 5% */
	padding-right: 5%;
	margin-top: 5%;
	color: #3486b8; /* #7170FF; */
	font-weight: bold;
}

h2.jmRechts {
	margin-left: 10px;
	color: #3486b8; /* #7170FF; */
	font-weight: bold;
}
/* JM-Ende */


.titel {
	vertical-align: middle;
}
h1.titel {
	font-family: Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", "serif";
	font-size: 25pt;
}

h1, h2, h3, h4, p, td, ul, li, div {
	font-family: Helvetica, Arial, "Gill Sans", "Gill Sans MT", "Myriad Pro", "DejaVu Sans Condensed",  "sans-serif";
	/* height: auto;   /* hat nicht den gewünschten Effekt */
}

h3.rechts, p.rechts {
	margin-left: 10px;
}
/* MM Feb 25: in verwendung? */
.sidebar2Spa-content {
	background-color: #F6F6F6;
	padding: 10px;
  display: block; /* Standard, aber hier explizit angegeben */
  width: auto; /* Breite richtet sich nach dem Inhalt */
	
}
.shadow {
	box-shadow: 3px 4px 5px 1px #444;
}

/*MM Feb 25: 25.02.25 */
.IMGshadow100 {
	box-shadow: 3px 4px 5px 1px #444;

}
@media (max-width: 768px) {
	.IMGshadow100 {
		width: 100%; /* Verringert die Bildgröße auf 80% des Containers bei kleinen Bildschirmen */
		height: auto;
		max-width: 100%;
	}
	img.noshadow{
		width: 100%; /* Verringert die Bildgröße auf 80% des Containers bei kleinen Bildschirmen */
		height: auto;
		max-width: 100%;
	}
}
img[src="images/skala.jpg"] {
	max-width: 272px;
}
textarea {
	width: 100%;
}
input:focus {
	outline: none;
	border: 1px solid #ccc;
}
/*MM März 25 */
p.fuss {
	color: #C3C3C3;
	font-size: 0.8em;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.footer {
	background-color: #717070;
}
.copyright {
	text-align: center;
	background-color: #717070;
	color: #FFFFFF;
	/* text-transform: uppercase; */
	font-weight: lighter;
	letter-spacing: 2px;
	border-top-width: 2px;
	/* font-family: "Source Sans Pro"; */
}
a.copyright:link {
	color: #DDDDDD;
}
a.copyright:hover {
	color: cyan;
}
a.copyright:visited {
	color: #DDDDDD;

}

/*MM Feb 25: container inkl. responsive Anfang */
.container {
	background-color: #FFFFFF;
	width: 90%;
	margin-left: auto;
	margin-right: auto;
	border-bottom-width: 0px;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
/*MM 27.02: container responsive Media Queries für responsive Darstellung*/
@media (max-width: 1200px) {
    .container {
        width: 95%;
		padding: 15px; /* Weniger Innenabstand auf kleineren Bildschirmen */
    }
}

@media (max-width: 768px) {
    .container {
        width: 95%;
		padding: 10px; /* Noch weniger Innenabstand auf mobilen Geräten */
    }
}

@media (max-width: 480px) {
    .container {
        width: 97%;
		padding: 5px; /* Sehr wenig Innenabstand für sehr kleine Bildschirme */
    }
}
/*MM 27.02: Container responsive Ende */
/* MM 25.02.25: Bereich für Umfrage */
 .containerUmfrage {
    width: 100%;  
	max-width: 1200px;
	  text-align: left;
      margin: 0 auto;
     /* padding: 20px; MM 02.03: raus */
	box-sizing: border-box;	
	/* background: #FBF8D8;	*/
    }

/*Media Queries für responsive Darstellung*/
@media (max-width: 1200px) {
    .containerUmfrage {
        padding: 15px; /* Weniger Innenabstand auf kleineren Bildschirmen */
    }
}

@media (max-width: 768px) {
    .containerUmfrage {
        padding: 10px; /* Noch weniger Innenabstand auf mobilen Geräten */
    }
}

@media (max-width: 480px) {
    .containerUmfrage {
        padding: 5px; /* Sehr wenig Innenabstand für sehr kleine Bildschirme */
    }
}
/* MM spezifische Anpassungen  */
/* MM 20.02.25: styled-table  */
.styled-table {
	table-layout: auto;
    width: auto;
	max-width: 100%;
	border-collapse: collapse;
    /* margin: 25px 0; */
    font-size: 1em;
    font-family: Helvetica, Arial,sans-serif;
   /*  min-width: 400px; */
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);

}
.styled-table thead tr {
    background-color: #f9f9f9;
	 color: #ffffff;
    text-align: left;
}


.styled-table th,
.styled-table td {
    padding: 12px 15px;
}

.styled-table tbody tr {
    border-bottom: 1px solid #dddddd;
}

.styled-table tbody tr:nth-of-type(even) {
    background-color: #f3f3f3;
}

.styled-table tbody tr:last-of-type {
    border-bottom: 2px solid #3486b8;
}

.styled-table tbody tr.active-row {
    font-weight: bold;
    color: #3486b8;
}
hr.poweredby {
	color: #FFD890;
	border: 1;
}
p.poweredby {
	color: #C3C3C3;
	font-size: 0.8em;
}
/* Bereich für Umfrage Ende */

/* MM Feb 25 Akzeptanz-Baromether
.party-item  {
        background-color: #f0f0f0;
        padding: 10px;
        border-radius: 5px;
        width: calc(45% - 10px) !important;
} */
.legend-akzeptanz {
margin-top: 0;
	border-top: #C3C3C3;
	border: 1;
}
/* MM Feb 25 Akzeptanz-Baromether Ende */
/*MM 25.02 LoginTable */
.loginTable
{
  width: 90%;
  max-width: 400px; /* Maximale Breite des Formulars */
  background-color: white;
  padding: 20px;
  border-radius: 8px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}
/* Medienabfragen für kleinere Bildschirme */
@media (max-width: 768px) {
  .loginTable {
    width: 95%; /* Formular auf mobilen Geräten etwas breiter */
    padding: 15px;
	}
  }
/*MM 25.02 LoginTable Ende */	

/*MM Feb 25: TestTestklasse */
	.TestTest{
		text-align: center;
	color: #01B2D1;	
	}
/*MM Feb 25: TestTestklasse Ende */
.row {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	display: inline-block;
}
.row.blockDisplay {
	display: block;
}
.column_half {
	width: 50%;
	float: left;
	margin-top: 0px;
}

.column_third {
	/*width: 33.33%; MM: 24.02.25 ursprünglich 33.33%*/
	float: left;
	margin-top: 0px;
}

.columns {
	width: 25%;
	float: left;
	/*font-family: "Source Sans Pro"; */
	color: #A5A5A5;
	line-height: 24px;
	padding-top: 10px;
	padding-bottom: 10px;
	text-align: justify;
	margin-top: 15px;
	margin-bottom: 15px;
	padding-left: 0px;
	padding-right: 0px;
	margin-left: 0px;
	margin-right: 0px;
}
.row .columns p {
	padding-left: 10%;
	padding-right: 10%;
}
/*MM 06.03.2025 Section gesamter Bildschirm (akzeptanz) */
.section100Akzept {
	width: 100vw; /* 100% der Bildschirmbreite */
	position: relative; /* Erforderlich, um die Position zu steuern */
	left: 0;
	right: 0;
	margin-left: 0vw;  /*Dadurch wird die Section über die Ränder des Containers hinaus dehnen */
	margin-right: 0vw;
}
/*MM 25.02.25 Eine Spalte */
.section1Spalte {
  display: grid;
  grid-template-columns: 100%; /* left_article und right_article nebeneinander */
  gap: 20px;
	padding-top: 30px;
}
/*MM Feb 25: 24.02.25: zwei Spalten Ansicht */

/* Layout für größere Bildschirme */
.section2Spalten {
  display: grid;
  grid-template-columns: 60% 40%; /* left_article und right_article nebeneinander */
	padding-top: 30px;
 /* gap: 20px; */
}

.main-content { /*MM 02.25: linker_articele in main-content2Spa umbenannt*/
  grid-column: 1; /* Diese Spalte geht in die erste (60%-)Spalte */
	width: 100%; /* sorgt dafür, dass left_article die gesamte Breite im Grid ausnutzt -> später wieder zu left und right umbenennen*/
}

.sidebar2Spa { /*MM 02.25: rechter_articele in sidbar2Spa umbenannt*/
  /* grid-column: 2; /* Diese Spalte geht in die zweite (40%-)Spalte */ 
	width: 100%; /* sorgt dafür, dass right_article die gesamte Breite im Grid ausnutzt */
	background-color: #F6F6F6;
	
}

/*Row als Grid: MM Feb 25*/
.rowGrid {
	display: grid;
	grid-template-columns: repeat(3, 1fr); /* Drei gleichmäßige Spalten */
	gap: 20px;
}
.rowGrid2 {
	display: grid;
	grid-template-columns: repeat(2, 1fr); /* Zwei gleichmäßige Spalten */
	gap: 20px;
}

/* Layout für kleinere Bildschirme: Bei kleinen Bildschirmen: Eine Spalte pro Reihe */
/*MM 2025-03-25 fb-politik */
@media (max-width: 1749px) {
	.section2Spalten#rowGrid3 {
		grid-template-columns: 1fr; /* Eine Spalte bei kleinen Bildschirmen */
		gap: 0px;
	}
	.sidebar2Spa {
		padding-bottom: 15px;
	}
}
/*MM 2025-03-25 alle anderen */
@media (max-width: 1270px) {
	.section2Spalten {
		grid-template-columns: 1fr; /* Eine Spalte bei kleinen Bildschirmen */
		gap: 0px;
	}
}

	.rowGrid {
    grid-template-columns: repeat(3, 1fr); /* Die drei Spalten im left_article werden untereinander angeordnet */
  }
	
	@media (max-width: 1050px) {
		.rowGrid {
    grid-template-columns: repeat(2, 1fr); /* Die drei Spalten im left_article werden untereinander angeordnet */
	}
}
	@media (max-width: 700px) {
		.rowGrid, .rowGrid2 {
    grid-template-columns: 1fr; /* Die drei Spalten im left_article werden untereinander angeordnet */
	}
}

/*Ende MM zwei Spalten*/
/*MM 2025-03-27 Kontakt3.0; D0058 */
.contact3 {
	/*background-color: #f2f2f2;*/
	top: 8px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
}
#contactTable {
	border-collapse: unset;
	box-shadow: none;
	max-width: 100%;

}
.styled-table#contactTable {
	width: 100%;
}
.styled-table#contactTable td {
	padding: 5px 0px;
	font-size: 14px;
}
.styled-table#contactTable td input:not([type="checkbox"]), textarea {
	width: 100%;
	box-sizing: border-box;
	border-width: 1px;
	padding: 5px;
	border-style: solid;

}
.styled-table#contactTable tbody tr:nth-of-type(2n) {
	background-color: #fff;
}
.styled-table#contactTable label {
	width: 100%;
	box-sizing: border-box;
	border-width: 1px;
	padding: 5px;
	border-style: solid;
	display: block;
	border-color: #f2f2f2;

}


.jm_button {
	padding: 5px;
	font-size: 16px;
	cursor: pointer;

}
.jm_button:hover {
	color: #717070;
}

/* Ende: MM 2025-03-27 Kontakt3.0 */
/*Login-Maske/Tabelle D0059 */
#loginTable {
	max-width: 700px;
	border-collapse: unset;
	/*box-shadow: none;*/
}
.styled-table#loginTable {
	width: 100%;


}
.styled-table#loginTable td input:not([type="checkbox"]):not([type="submit"]), textarea {
	width: 100%;
	box-sizing: border-box;
	border-width: 1px;
	padding: 5px;
	border-style: solid;


/*Ende Login-Maske/Tabelle*/
.columns h4 {
	text-align: center;
	color: #01B2D1;
}

.primary_header {
	width: 100%;
	background-color: #ffffff;
	padding-top: 10px;
	padding-bottom: 10px;
	clear: left;
	border-bottom: 2px solid #ffffff;
}
.secondary_header {
	width: 100%;
	padding-top: 10px;
	padding-bottom: 10px;
	/*background-color:#eeeeee ;     #CDF1FF; */
	clear: left;
}
.container .secondary_header ul {
	margin-top: 0%;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 15px;
	padding-left: 0px;
	width: 100%;
}
.secondary_header ul li {
	list-style: none;
	float: left;
	margin-right: auto;
	margin-top: 0px;
	/* font-family: "Source Sans Pro"; */
	font-weight: normal;
	color: #FFFFFF;
	letter-spacing: 1px;
	margin-left: auto;
	text-align: center;
	width: 16%;
	transition: all 0.3s linear;
}
.secondary_header ul li:hover {
	color: #717070;
	cursor: pointer;
}
.left_article {
	background-color: #FFFFFF;
	width: 60%;
	float: left;
	/* font-family: "Source Sans Pro"; */
	color: #343434;
	padding-bottom: 15px;
	/*min-width: 570px;  MM 20.02.25 am 24.02 rausgenommen, jetzt ist die Ansicht am Handy gut*/
}
.noDisplay {
	display: none;
}
/*MM 27.02.25 container. left_articel durch main-content ersetzt*/

.main-content {
	background-color: #FFFFFF;
	float: left;
	/* font-family: "Source Sans Pro"; */
	color: #343434;
}
.container .main-content h3 {
	padding-left: 0px;  /* ursprünglich 5% */
	padding-right: 5%;
	margin-top: 5%;
	color: #717070;
	font-weight: bold;
	text-transform: uppercase;
}

/*MM 27.02 p p in main-content - p Grau kann dann gelöscht werden */
.container .main-content p{
	padding-left: 0px;  /* ursprünglich 5% */
	padding-right: 5%;
	text-align: left;
	line-height: 24px;
	/* margin-top: 30px;  */
	margin-bottom: 15px;
	color: #606060;
}
/* Bei Bildschirmgrößen kleiner als 700px */
@media (max-width: 700px) {
  .container .main-content p {
    padding-right: 0%; /* wenn der Bildschirm kleiner als 700px, setze padding-right auf 0% */
  }
}
/*main-content Ende */
.right_article {
	/*  width: 40%; MM:26.02 entfernt
	float: left; */
	background-color: #F6F6F6;
}
.container .right_article ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 3px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.right_article ul li {
	/* font-family: "Source Sans Pro"; */
	list-style: none;
	text-align: center;
	background-color: #B3B3B3;
	width: 90%;
	margin-left: 3px;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-top: 15px;
	padding-bottom: 15px;
	color: #FFFFFF;
	font-weight: bold;
	border-radius: 0px;
	transition: all 0.3s linear;
	border-left: 5px solid #717070;
}
.right_article ul li:hover {
	background-color: #717070;
	cursor: pointer;
}

.title {
	font-weight: bold;
	font-style: normal;
	/*font-family: "Source Sans Pro"; */
	text-align: center;
	color: #FFFFFF;
	letter-spacing: 2px;
}
.placeholder {
	/* [disabled]max-width: 400px;
*/
	/* [disabled]max-height: 200px;
*/
	width: 100%;
	padding-top: 30px;
	/* [disabled]padding-left: 19px;
*/
	padding-bottom: 30px;
	height: 100%;
}
.left_half {
	background-color: #52BAD5;
}
.container .column_half.left_half h2 {
	color: #FFFFFF;
	/* font-family: "Source Sans Pro"; */
	text-align: center;
}
.right_half {
	background-color: #01B2D1;
	color: #FFFFFF;
	/* font-family: "Source Sans Pro"; */
	text-align: center;
	font-weight: bold;
}
.column_title {
	padding-top: 25px;
	padding-bottom: 25px;
}

/* /JM */


/*MM Feb 25: JM Anpassungen an diverse Bildschirmgrößen */
/* Bildschirme max 320 */
@media (max-width: 320px) {
.secondary_header ul li {
	float: none;
	margin-top: 28px;
	margin-left: 0px;
	width: 100%;
}

.container .secondary_header ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	height: auto;
	width: 100%;
	text-align: center;
}
.secondary_header {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 1px;
	/*padding-bottom: 40px; */
}
.left_article {
	width: 100%;
	height: auto;
}
.right_article {
	width: 100%;
	height: auto;
}
.placeholder {
	width: 100%;
	margin-top: 22PX;
	margin-right: 0px;
	margin-bottom: 22PX;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	max-width: 400px;
	max-height: 200px;
	height: auto;
}
.columns {
	width: 100%;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0PX;
	padding-right: 0PX;
	padding-bottom: 0PX;
	padding-left: 0PX;
}
.columns p {
	padding-left: 10px;
	padding-right: 10px;
}
.column_half.left_half {
	width: 100%;
}
.column_half.right_half {
	width: 100%;
}

/* JM Einschub wg. 3 Spalten */
.column_third.left_third {
	width: 100%;
}
.column_third.middle_third {
	width: 100%;
}
.column_third.right_third {
	width: 100%;
}

	
	
.copyright {
	padding-top: 25px;
	padding-bottom: 0px;
	margin-bottom: 0px;
}
.container .left_article h3 {
	margin-top: 30px;
}
.social .social_icon img {
	width: 80%;
}
.container .secondary_header {
}
}
/* Bildschirme zwischen 320 und 768px */
@media (min-width: 321px) and (max-width: 768px) {
.secondary_header ul li {
	float: none;
	margin-top: 28px;
	margin-left: 0px;
	width: 100%;
}
.container .secondary_header ul {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	height: auto;
	width: 100%;
	text-align: center;
}
.secondary_header {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	/* padding-top: 1px;
	 padding-bottom: 40px; */
}
.left_article {
	width: 100%;
	height: auto;
}
.right_article {
	width: 100%;
	height: auto;
	padding-bottom: 5px;
}
.placeholder {
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	width: 100%;
	max-width: 100%;
	height: auto;
	max-height: 100%;
}
.columns {
	width: 100%;
	margin-top: 6px;
	margin-right: 0px;
	margin-bottom: 6px;
	margin-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}
.columns p {
	padding-left: 14px;
	padding-right: 14px;
}
.column_half.left_half {
	width: 100%;
}
.column_half.right_half {
	width: 100%;
}
	

/* JM Einschub wg. 3 Spalten */
.column_third.left_third {
	width: 100%;
}
.column_third.middle_third {
	width: 100%;
}
.column_third.right_third {
	width: 100%;
}
}
/* Bildschirme zwischen 769 und 1000px */
@media (min-width: 769px) and (max-width: 1000px) {
.secondary_header {
	overflow: auto;
	padding-top: 30px;
	padding-bottom: 30px;
}
.secondary_header ul li {
	margin-top: 10px;
	margin-right: 7%;
	margin-bottom: 10px;
	margin-left: 7%;
}
.left_article {
	height: auto;
}
.right_article {
	height: auto;
	padding-bottom: 27px;
}
.placeholder {
	width: 100%;
	margin-left: 0px;
	margin-right: 0px;
	padding-left: 0px;
	padding-right: 0px;
}
.columns {
	width: 50%;
	float: left;
	padding-left: 0px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
}
.container .columns p {
	padding-left: 25px;
	padding-right: 25px;
}
}
/* Bildschirme über 1001px */
@media (min-width: 1001px) {
}
/*MM Feb 25: JM Anpassungen an diverse Bildschirmgrößen Ende */
.thumbnail {
	width: 100px;
	border-radius: 200px;
	height: 100px;
	margin-left: auto;
}
.thumbnail_align {
	text-align: center;
}
.social {
	text-align: center;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	width: 100%;
	background-color: #414141;
	clear: both;
	overflow: auto;
}
.social_icon {
	width: 25%;
	text-align: center;
	float: left;
	transition: all 0.3s linear;
	line-height: 0px;
	padding-top: 7px;
}
.container .social .social_icon:hover {
	cursor: pointer;
	opacity: 0.5;
}
#menu {
}
