/* here , the source code is the same for all browsers */
html,body{box-sizing:border-box;margin: 0px;height:auto;min-height:100vh;width:100%;background-color:#a4a4a4;font-size:12px;font-family: Verdana, sans-serif;color:#000000;}

body a {padding:5px; }
body a:link,a:visited{font-size:14px;font-family: Verdana, sans-serif;color:#1d21ac;text-decoration:none;}
body a:hover{font-size:14px;font-family: Verdana, sans-serif;color:#ff0000;text-decoration:underline;}

.input-submit {box-sizing: border-box;border:0px;background: linear-gradient(to top, #343434, #6b6b6b);color:#b2b2b2;margin-bottom:7px;margin-top:7px;padding:7px;width:150px;font-size:14px;font-family: Verdana, sans-serif;}

.input-submit:focus {background: linear-gradient(to top, #343434, #8e0000)}
.input-submit:hover {background: linear-gradient(to top, #343434, #a7a7a7)}

.input-link {text-align:right;font-weight:bold;color:#2a4969;background-color:transparent;border:0px solid;margin:2px;margin-top:4px;padding:6px;padding-right:10px;width:100%;}
.input-link:hover {color:#ff0000;font-weight:bold;background-color:transparent;border:0px solid;margin:2px;margin-top:4px;padding:6px;padding-right:10px;width:100%;}

.input-select{box-sizing: border-box;border:0px;background-color:transparent;padding:5px;padding-top:6px;padding-bottom:7px;width:100%;font-size:14px;font-family: Verdana, sans-serif;}
.input-text{box-sizing: border-box;border:0px;background-color:transparent;padding:5px;padding-top:6px;padding-bottom:7px;width:100%;font-size:14px;font-family: Verdana, sans-serif;}
.input-text::placeholder {color: #aaaaaa;font-style: italic;}

.input-select:focus,.input-text:focus{border: none;outline: none;background-color:#ffdbdb;}

.itob,.itob:focus{border:2px solid;border-color:#dedede;}

.screen {box-sizing:border-box;border:1px solid;border-color:#c7c7c7;padding:5px;background-color:#ffffff;width:300px;position:absolute;bottom:20px;right: 20px;box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);}

.main-container{box-sizing:border-box;border:0px solid;border-color:#ff0000;width:100%;}
	
.mobile-container {
    box-sizing: border-box;
    border-bottom: 1px solid;
    border-color: #4b4b4b;
    background-color: #e7e7e7;
    width: 100%;
    height: 60px;
    box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
    display: none; /* Flexbox-Layout aktivieren */
}

.mobile-container-flex {
    box-sizing: border-box;
    border: 0px solid;
    border-color: #00ff00;
    height: 100%;
}.large {
    flex-grow: 1; /* Nimmt den verbleibenden Platz ein */
}

.small {
    width: 60px; /* Fixe Breite */
}
.desktop-container {box-sizing: border-box;height:100%;width: 100%;display: flex;}
.menue-desktop {box-sizing: border-box;border-right: 1px solid;border-color: #4b4b4b;background-color:#e7e7e7;height:auto;min-height:100vh;min-width:250px;width: 250px;box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);}
.menue-title a{box-sizing: border-box;border-bottom: 1px solid;border-color: #4b4b4b;font-family: Verdana, sans-serif;padding:8px;line-height: 26px;display:block;}
.menue-title a:link, .menue-title a:visited{font-size:23px;border-top: 1px solid #4b4b4b;border-bottom: 2px solid #a7a7a7;background: linear-gradient(to top, #343434, #6b6b6b);color:#b2b2b2;text-decoration:none;}
.menue-title a:hover{font-size:23px;background: linear-gradient(to top, #343434, #a7a7a7);color:#ffffff;text-decoration:none;}
.menue-sub a{box-sizing: border-box;border-bottom: 1px solid;border-color: #4b4b4b;font-family: Verdana, sans-serif;padding:2px;padding-top:3px;padding-left:19px;line-height: 25px;display:block;}
.menue-sub a:link, .menue-sub a:visited{font-size:14px;border-top: 1px solid #4b4b4b;border-bottom: 2px solid #a7a7a7;background: linear-gradient(to top, #afafaf, #8c8a8a);color:#3f3f3f;text-decoration:none;}
.menue-sub a:hover{font-size:14px;background: linear-gradient(to top, #afafaf, #d0d0d0);color:#6a6a6a;text-decoration:none;}
.menue-end {box-sizing: border-box;font-size:10px;color:#ffffff;border-bottom: 1px solid;border-color: #4b4b4b;font-family: Verdana, sans-serif;display:block;background: linear-gradient(to top, #343434, #6b6b6b);}

.menue-definition {box-sizing: border-box;height:100px;width:100%;padding:10px;background: linear-gradient(to top, #8d8d8d, #5e5e5e);}
.menue-subcategory-box{box-sizing: border-box;border:0px solid;}
.menue-subcategory-link {
  display: inline-block;
  box-sizing: border-box;
  border: 1px solid;
  border-color:#4b4b4b;
  background-color: #ffffff;
  margin: 5px; /* fügt einen kleinen Abstand zwischen den Boxen hinzu */
  padding: 10px; /* optional: entfernt Innenabstände */
  border-radius: 5px;
  box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.3);
  filter: grayscale(100%);
}
.menue-subcategory-link:hover{box-shadow: 0px 0px 8px rgba(255, 255, 255, 1);filter: grayscale(0%);}

.header-navi-box {box-sizing: border-box;font-size:16px;font-family: Verdana, sans-serif;color:#3b3b3b;display: flex; align-items: center; gap: 0px;}
.header-navi-box a:link, .header-navi-box a:visited{font-size:16px;padding:0px;color:#3b3b3b;}
.header-navi-box a:hover{font-size:16px;color:#00ff00;}

.title{box-sizing: border-box;
		padding:10px;
		position: relative;
            top: 50%;
            left: 50%;
			transform: translate(-50%, -50%);color:#ffffff;}


.mobile-menue-toggle {
			box-sizing: border-box;
			border: 1px solid;
			border-color: #4b4b4b;
            width: 35px;
            height: 35px;
			padding:5px;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            cursor: pointer;
			background: linear-gradient(to top, #afafaf, #8c8a8a);
			position: relative;
            top: 50%;
            left: 50%;
			
            transform: translate(-50%, -50%);
}

.mobile-menue-toggle div {
			box-sizing: border-box;
            width: 100%;
            height: 5px;
            background-color: black;
}
.mobile-menue {
			box-sizing: border-box;
			position: absolute;
			top:90px;

			left:0%;
			width:100%;
			padding-top:5px;
			border: 0px solid;
			border-color: #4b4b4b;
			background-color:#e7e7e7;
			box-shadow: 0px 5px 8px rgba(0, 0, 0, 0.3);
			display:none;
			z-index:999;
}

.content-desktop {box-sizing: border-box;border: 0px solid;border-color:#ff0000;padding:8px;flex-grow: 1;height:auto;min-height:100vh;word-break: break-word;overflow-wrap: break-word;}
.content-include {box-sizing: border-box;border: 0px solid;max-width:1200px;margin: 0 auto;justify-content: center;}

.content-box {box-sizing: border-box;border: 1px solid;border-color:#939393;border-radius: 3px;max-width:1200px;padding:5px;background-color:#ffffff;width:100%;font-size:12px;font-family: Verdana, sans-serif;margin: 0 auto;margin-top:50px;margin-bottom:20px;}
.box{box-sizing: border-box;border: 2px solid;border-color:#cccccc;border-radius: 3px;padding:50px;width:100%;}
.box-title{box-sizing: border-box;font-size:14px;font-family: Verdana, sans-serif;font-weight:bold;color:#4b4b4b;display:flex;justify-content: left;padding-top:10px;padding-bottom:15px;}
.box-text{box-sizing: border-box;font-size:12px;font-family: Verdana, sans-serif;color:#4b4b4b;padding-top:10px;padding-bottom:10px;}

.zebra-container {display: flex;gap: 0px;border:0px solid;padding-top:5px;padding-bottom:5px;}
.checkbox-box {border:0px solid;display: flex;justify-content: center;width:100%;}
.flex-grow-box {flex-grow: 1;padding-left:5px;display: grid;align-items: center;justify-content: left;}

.TB1ct { box-sizing: border-box;background-color: #dedede; display: none; }
.TB1table { box-sizing: border-box;display: block; border: 4px solid; border-color: #dedede;}
.TB1table:hover { box-sizing: border-box;border: 4px solid; border-color: #7dd971;}
.TB1row { box-sizing: border-box;display: block; border: 0px solid; background-color: #ffffff; margin: 0px; padding: 0px; }
.TB1cell { box-sizing: border-box;display: inline-block; width: 50%; padding: 10px; border: 1px solid #ccc; text-align: left; box-sizing: border-box; white-space: nowrap; text-overflow: ellipsis;line-height: 1.5em; }


.t { display:block; }
.table,.TB4table { display: flex; border:1px solid; border-color:#dedede; background-color:#ffffff; }
.table:hover,.TB4table:hover { border:1px solid; border-color:#a8ff9d; background-color:#7dd971; }

.cellA { display: block; text-decoration: none; color: inherit; }
.table .row:nth-child(1) { max-width: 60px; }
.table .row:nth-child(4) { min-width: 250px; }
.table .row:nth-child(5) { min-width: 350px; }
.table .row:nth-child(6) { min-width: 100px; }

.TB4table .row:nth-child(1) { max-width: 150px; }
.TB4table .row:nth-child(3) { max-width: 150px; }


.row { flex:5; border: 0px solid; }
.cell { padding: 4px; border: 1px solid #ccc; text-align: left; box-sizing: border-box; white-space: nowrap; font-size:11px; height:100%; align-items: center; display:flex; cursor: pointer; width:100%; gap: 10px;justify-content: left;}
.cell a:link, .cell a:hover { padding:0px; padding-top:4px; padding-bottom:4px; font-size:12px; color:#0000ff; text-decoration:none; }
.ct { background-color:#dedede; display:none; }
.ct a, .ct a:hover { color:#000000; text-decoration:none; }
.ctt { background-color:#dedede; padding: 7x; cursor: default;}
.cta { border:0px solid; flex:1; }

@media (max-width: 1200px) {
  .table,.TB4table { display: block; border:4px solid; border-color:#dedede; margin:0px; margin-top:10px; margin-bottom:10px; }
  .table:hover,.TB4table:hover { border:4px solid; border-color:#7dd971; margin:0px; margin-top:10px; margin-bottom:10px; }
  .row { display:flex; border:0px solid; background-color:#ffffff; margin:0px; padding:0px;align-items: stretch;}
  .table .row:nth-child(1) { max-width: 100%; }
  .cell { padding:8px;display: inline-block; width: 50%;white-space: normal;}
  .t, .ctt { display:none; }
  .TB4table .row:nth-child(1) { max-width: 100%; }
  .TB4table .row:nth-child(3) { min-width: 100%; }
  .ct{display: block;vertical-align: top;height: auto;}
}

@media (max-width: 600px) {
  .table,.TB4table { display: block; border:4px solid; border-color:#dedede; background-color:#ffffff; margin:0px; margin-top:10px; margin-bottom:10px; }
  .table:hover,.TB4table:hover { border:4px solid; border-color:#7dd971; background-color:#ffffff; margin:0px; margin-top:10px; margin-bottom:10px; }
  .row { display:block; margin:0px; }
  .cell { display: block; width: 100%;justify-content: right;}
  .t, .ctt { display:none;}
  .ct{color:#000000;}
  .table .row:nth-child(1) { max-width: 100%; }
  .TB4table .row:nth-child(3) { min-width: 100%; }
  .
}

.TB2cellA { display: block; text-decoration: none; color: inherit; }
.TB2cell { padding: 0px; border: 0px solid #ccc;box-sizing: border-box; white-space: nowrap; text-overflow: ellipsis; }
.TB2ct { background-color:#dedede;text-align: left;padding:10px;}
.TB2ctW { display:none;text-align: right;padding:10px;}
@media (min-width: 600px) {
  .TB2table { display: block; border:4px solid; border-color:#dedede; }
  .TB2row { display:block;border-top:1px solid;border-bottom:1px solid;border-color:#ccc;background-color:#ffffff; margin:0px; padding:0px; }
  .TB2cell { display: inline-block; width: 50%; }
  .checkbox-box {width:28px;}
}

@media (max-width: 600px) {
    .TB2table { display: block; border:4px solid; border-color:#dedede; background-color:#ffffff; }
    .TB2row { display:block; margin:0px; }
    .TB2cell { display: block; width: 100%; text-align: right;}
    .TB2ctt { display:none; }
    .TB2ct { background-color:#dedede;text-align: left;padding:10px;}
    .input-select,.input-text {text-align: right;}
    .cell {justify-content: right;white-space:normal; }
    .mobile-container{display:flex;}
	.menue-desktop {display:none;}
	.menue-definition{display:none;}
	.content-box{padding:5px;}
	.box{padding-left:10px;padding-right:10px;}
	select{width:100%;}
	.menue-subcategory-box{display: flex;justify-content: center;}
	.zebra-container {border:1px solid;border-color:#dedede;}
	.checkbox-box {width:100%;}
}



.no_slider {
	box-sizing: border-box;
	background-image: url("../image/no_slider.png");
	background-repeat:no-repeat;
	width: 40px;
    height: 22px;
}

hr {border:1px solid;margin-top:5px;border-color:#888888}

#space {color:#888888;margin-left:5px;margin-right:5px;}

.button-profil {
    background-image: url('../image/b_profil.png'); /* Pfad zu deinem Bild */
    background-size: cover; /* Bild anpassen */
    background-repeat: no-repeat; /* Bild nicht wiederholen */
    width: 22px; /* Breite des Buttons */
    height: 22px; /* Höhe des Buttons */
    border: none; /* Kein Rahmen */
    cursor: pointer; /* Mauszeiger ändern */
    color: transparent; /* Text unsichtbar machen */
}
.button-adress {
    background-image: url('../image/adressbook.png'); /* Pfad zu deinem Bild */
    background-size: cover; /* Bild anpassen */
    background-repeat: no-repeat; /* Bild nicht wiederholen */
    width: 22px; /* Breite des Buttons */
    height: 22px; /* Höhe des Buttons */
    border: none; /* Kein Rahmen */
    cursor: pointer; /* Mauszeiger ändern */
    color: transparent; /* Text unsichtbar machen */
}
.button-rechte {
    background-image: url('../image/security.png'); /* Pfad zu deinem Bild */
    background-size: cover; /* Bild anpassen */
    background-repeat: no-repeat; /* Bild nicht wiederholen */
    width: 22px; /* Breite des Buttons */
    height: 22px; /* Höhe des Buttons */
    border: none; /* Kein Rahmen */
    cursor: pointer; /* Mauszeiger ändern */
    color: transparent; /* Text unsichtbar machen */
}

.notice-box{background-color:#3366cc;border-color:#3366cc;border:1px solid;font-size:12.6px;color:#4676d7;min-height:50px;padding-left:60px;border-radius: 10px 0px 10px 0px;background-image: url('../image/info.png');background-repeat: no-repeat;margin-top:10px;margin-bottom:10px;}
.notice-text{background-color:#fff3be;border-radius: 0px 0px 10px 0px;padding:2px;padding-left:7px;padding-right:7px;font-size:12.6px;color:#4676d7;min-height:50px;height:100%;display: grid;place-items: center;}

#reloadTime {
    border: 0px solid;
    border-color: #ff0000;
    position: absolute; /* Ändert relative in absolute */
    right: 5px; /* Abstand vom rechten Rand des übergeordneten Divs */
    top: 5px; /* Vertikal zentrieren */
	font-weight:bold;
}

/* Standard-Checkbox ausblenden */
        input[type="checkbox"] {
            display: none;
        }

        /* Label-Styling für die Checkbox */
        label {
            cursor: pointer;
        }

        /* Bild für die nicht angekreuzte Checkbox */
        input[type="checkbox"] + label img {
			content: url('../image/slider_off.png');
            width: 26px;
			height: 15px;
			vertical-align: middle; /* oder: top / bottom / baseline / block */
        }

        /* Bild für die angekreuzte Checkbox */
        input[type="checkbox"]:checked + label img {
            content: url('../image/slider_on.png'); /* Bild für angekreuzte Checkbox */
			width: 26px;
			height: 15px;
			vertical-align: middle; /* oder: top / bottom / baseline / block */
        }