* { 
	margin: 0px; 
	padding: 0px; 
}

body {
	background: #f9f9f9;
	font-size: 17px;
	font-family: Arial, sans-serif;
	max-width: 100%;
}

p {
	text-align: justify;
	padding: 8px 40px;
	font-size: 17px;
	line-height: 150%;
}

p.edit {
	padding: 8px 80px;
	font-style: italic;
}

p.kleiner {
	font-size: 15px;
}

a, a.visited {
	outline: none;
	color: blue;
	text-decoration: none;
}

img {
	max-width: 100%;
}

.rahmen {
	width: 1500px; /*+100*/
	margin-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 20px;
	border-width: 3px;
	border-radius: 35px;
	border-style: solid; 
	border-color: #63adf8;
	background: #63adf8;
	box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.4); /*              2px 2px 15px #666, -2px 2px 15px #666, -2px -2px 15px #666, 2px -2px 15px #666; */
}

.header { /*********red
	position: relative;
	height: 300px; /*256*/
	padding-left: 10px;
}
/*****red
#kopf {
	z-index: 1;
	position: absolute;
	height: 290px;
	margin-top: 10px;
	background: #63adf8;
	border-top-left-radius: 30px;
	border-top-right-radius: 30px;
	text-align: center;
} 

#navi {
	z-index: 2;
	position: absolute;
	height: 40px;
	padding-left: 30px;
	margin-top: 282px;
	margin-left: auto;
	margin-right: auto;
} **/

#kontent {
	max-width: 1450px; /*+100*/
	background: #f9f9f9;
	padding: 15px 15px;
	border-bottom-left-radius: 30px;
	border-bottom-right-radius: 30px;
	border-color: #000;
	border-style: solid;
	border-width: 0px 1px 1px 1px; 
	margin-bottom: 5px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 0px;

}

#rahmenkontent {
	padding: 15px 15px;
}




#fuss {
	text-align: center;
	font-size: 15px;
	height: 30px;
	color: white;
	padding-left: 30px;
	padding-top: 10px;
	padding-right: 20px;
	
}

#copyright {
	float: left;
	padding-right: 20px;
}

#stand {
	float: left;
	border-right-style: dotted;
	padding-left: 20px;
	padding-right: 20px;
}

#kontakt, .ds, .ds a, #anfang, #anfang a {
	float: right;
	
	padding-left: 10px;
	padding-right: 10px;
	color: white;
	text-decoration: none;
	
	height: 30px;
}
/*
#kontakt a, .ds a {
	text-decoration: none;
	padding: 3px 10px;
	background: #f9f9f9;
	
}*/

#kontakt a:hover, .ds a:hover {
	color: black;
}



#anfang {
	float: right;
	padding-left: 20px;
	padding-right: 10px;
}


.navibutton {
	float: left;
	font-size: 20px;
	margin-right: 5px;
	padding: 7px 10px;
	background: linear-gradient(to bottom, rgba(170,170,170,0.8) 0%,rgba(109,109,109,0.8) 100%);
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
	border-color: #444;
	border-style: solid;
	border-width: 1px 1px 0px 1px;
	font-family: sans-serif;
	text-shadow:  1px  1px 1px black,
                  1px -1px 1px black,
                 -1px  1px 1px black,
                 -1px -1px 1px black;
}

.navibutton a {
	text-decoration: none;
	color: white;
}

.navibutton:hover {
	background: linear-gradient(to bottom, rgba(170,170,170,0.7) 0%,rgba(249,249,249,1) 90%);
}

#activ {
	background: linear-gradient(to bottom, rgba(249,249,249,0.7) 0%,rgba(249,249,249,1) 90%);
}

#activ a {
	color: #000;
	text-shadow: none;
}

h2 {
	font-size: 25px;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

h1 {
	font-size: 25px;
	font-color: black;
	text-align: center;
	padding-top: 10px;
	padding-bottom: 10px;
}

h3 {
	text-align: left;
	font-size: 19px;
	padding-top: 10px;
}

h4 {
	text-align: center;
	font-size: 18px;
}	

h5 {
	padding-bottom: 5px;	
}

hr {
	color: #63adf8;
	background: #63adf8;
	height: 2px;
}

ol {
	margin-left: 70px;
}

ul {
	margin-left: 80px;
	margin-right: 10px;
}

li {
	padding-bottom: 8px;
	text-align: justify;
	font-size: 17px;
}

th {
	font-size: 15px;
}

td {
	font-size: 13px;
	font-family: Arial;
	padding: 10px 3px 10px 3px;	
}

td.center {
	text-align: center;
}

img.vorschau {
	width: 90px;
}

img.bild-akku {
	width:150px;
}

img.big {
	max-height: 100vh;
	max-width: 1720px;
    overflow: auto;
	box-shadow:2px 2px 25px #666, -2px 2px 25px #666, -2px -2px 25px #666, 2px -2px 25px #666;
	border: 1px solid;
	border-radius: 15px;
}

img.big-tl {
	max-height: 100vh;
    overflow: auto;
	box-shadow:2px 2px 25px #666, -2px 2px 25px #666, -2px -2px 25px #666, 2px -2px 25px #666;
}	

img.big-ha {
	max-height: 100vh;
    overflow: auto;
	box-shadow:2px 2px 45px #666, -2px 2px 45px #666, -2px -2px 45px #666, 2px -2px 45px #666;
}	

img.haken {
	width:15px;
	height: 15px;
}

img.temps {
	width: 360px;
}




td.top {
	vertical-align: top;
}

td.justify {
	text-align: justify;
}

th {
	text-align: center;
	padding: 10px;
}

tr:nth-child(even) {background: #cfe9fe;}
tr:nth-child(odd) {background: #a2d6ff;} 

table {
	border: 0px;
	border-collapse: separate;
}

tr td:not(:first-child) {text-align: center;}
tr:first-child th:first-child {border-top-left-radius: 15px;}
tr:first-child th:last-child {border-top-right-radius: 15px;}
tr th {background-color: rgb(170, 170, 170);}


table.liion tr td:last-child {text-align: justify}







[popover] {
	background: none; /*#b0c6e1;*/
  /*border: 1px solid;
  border-radius: 15px;
  max-width: 1600px;
  /*box-shadow:2px 2px 5px #666, -2px 2px 5px #666, -2px -2px 5px #666, 2px -2px 5px #666;
  */padding: 55px; 
  margin: auto;
}

figure {
	border: none;
}

figcaption {
  text-align: center;
}


/********************************/



h4 {
	text-align: left;
	font-size: 19px;
	margin-top: 40px;
	margin-bottom: 10px;
}

span.nachdatum {
	margin-left: 190px;
}

span.datum {
	position: absolute;
}

span.techdaten {
	margin-left: 360px;
}

span.updatehome {
	background-color: #e84d0e;
	border-radius: 10px;
	color: white;
	padding: 1px 4px;
}

span.bildhinweis {
  display: block;
  font-size: 0.7em;
  color: #777;
  margin-top: 4px;
  margin-bottom: 20px;
}


span.kursiv {
	font-style: italic;
}


/*****************************************/


.container{
   display: flex ;
   flex-direction: row;
   justify-content: center;
   align-items: center;
}
 
.container-links{
   text-align: left;
   padding-left: 2px;
   display: flex;
   flex-direction: column;
   width: 60%;
 }
 
.container-rechts{
   text-align: right;
   padding-right: 2px;
   display: flex;
   flex-direction: column;
   width: 40%;
 }
 
 
 
 span.akkuformat {
	 font-size: 12px;
 }
 
 
 
 /********************************/

/*
.toggleBox1,
.toggleBox2 {
    position: relative;
    border: 2px solid #63adf8;
    border-radius: 15px;
    margin-bottom: 20px;
}
 
/* Ausblenden des input-Feldes */
.toggleBox1 input,
.toggleBox2 input {
    position: absolute;
    left: -99999px;
}
 
/* Gestaltung der labels
.toggleBox1 label,
.toggleBox2 label {
    display: block;
    background: #e6e8ea;
    border-radius: 14px;
    color: black;
    padding: .4em;
    text-align: left;
    cursor: pointer;
}
 
.toggleBox1 label:hover,
.toggleBox2 label:hover {
    background: #e6e8ea;
    color: #00E;
}
 
/* Der Aufklappmechanismus */
.toggleBox1 input:not(:checked) ~ #box1,
.toggleBox2 input:not(:checked) ~ #box2 {
    opacity: 0;
    height: 0;
}
 
.toggleBox1 input:checked ~ #box1,
.toggleBox2 input:checked ~ #box2 {
    opacity: 1;
    -webkit-transition: opacity 1s ease-in-out;
    -moz-transition: opacity 1s ease-in-out;
    -ms-transition: opacity 1s ease-in-out;
    -o-transition: opacity 1s ease-in-out;
    transition: opacity 1s ease-in-out;
}
 
/* Steuerung der Sichtbarkeit der labels */
.toggleBox1 input:not(:checked) ~ .close,
.toggleBox2 input:not(:checked) ~ .close,
.toggleBox1 input:checked ~ .open,
.toggleBox2 input:checked ~ .open {
    display: none;
}


 /********************************/
 

 .update{
   display: flex ;
   flex-direction: row;
   justify-content: center;
   /*align-items: center;*/
   width: 1200px;
   margin-bottom:30px;
   background: #efefef;
   transition: background-color 0.4s ease;
   border: 1px solid #ccc;
   padding: 7px;
   box-shadow: 2px 2px 6px #ddd;
}

.update:hover {
	background: #e7e7e7;
}
 
.update-bild{
   text-align: left;
   padding-left: 2px;
   display: flex;
   flex-direction: column;
   width: 15%;
 }
 
.update-text{
   text-align: left;
   padding-right: 2px;
   display: flex;
   flex-direction: column;
   width: 85%;
 }
 
 img.tn {
	 width: 150px;
	 height: 100px;
	 border-radius: 5px;
	 box-shadow:2px 2px 15px #ddd, -2px 2px 15px #ddd, -2px -2px 15px #ddd, 2px -2px 15px #ddd;
 }
 
 span.tag {
	 font-size: 12px;
	 font-weight: 800;
	 padding-bottom:8px;
 }
 
 .update-text > p {
	 padding: 0px;
	 font-size: 14px;
 }
 
 
 /**********************buttons************************************/
 
a.button {
       /* background-position: 0% 0%; */
        background-color: transparent;
        color: black !important;
        border-radius: 15px;
        border-color: #707070;
        border-width: 1px;
        border-style: solid;
        background-image: linear-gradient(180deg, #f2f2f2, #d2d2d2);
		font-size: 22px;
		padding: 20px;
		
    }
a.button:hover {
        background-image: linear-gradient(180deg, #e8f6fd, #63adf8);
    }
	
/**************************************************************/


table.sortable th:not(.sorttable_sorted):not(.sorttable_sorted_reverse):not(.sorttable_nosort):after { 
    content: " \25B4\25BE" 
}



@media screen and (max-width: 1500px) {
    body {
        transform: scale(0.8); /* Skaliert den gesamten Inhalt auf 80% */
        transform-origin: top left; /* Fixiert den Ursprung der Skalierung */
        width: 125%; /* Korrigiert die Skalierung, um Breite zu erhalten */
    }
	
	img.big {
		max-width: 90%;
	}
}


@media screen and (max-width: 1200px) {
    body {
        transform: scale(0.6); /* Skaliert den gesamten Inhalt auf 80% */
        transform-origin: top left; /* Fixiert den Ursprung der Skalierung */
        width: 125%; /* Korrigiert die Skalierung, um Breite zu erhalten */
    }
	
	img.big {
		max-width: 90%;
	}
}


@media screen and (max-width: 850px) {
    body {
        transform: scale(0.4); /* Skaliert den gesamten Inhalt auf 80% */
        transform-origin: top left; /* Fixiert den Ursprung der Skalierung */
        width: 125%; /* Korrigiert die Skalierung, um Breite zu erhalten */
    }
	
	img.big {
		max-width: 90%;
	}
}


/***********************Redisign***********/


body {
	background: #63adf8;
}

.rahmen {
	margin-bottom: 0px;
	margin-top: 0px;
	border-radius: 0px;
	border: 0px;
	background: #f9f9f9;
}

.header {
	padding: 0px;
}

#menu {
	height: 40px;
}

#kontent {
	margin: 0px;
	border: 0px;
	max-width: 100%;
}

#kopfbild {
	height: 150px;
}


/* Menüleiste */
.navbar, #fuss {
  background: linear-gradient(180deg, #7db0e3, #2c5b9c);
}

.menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
}

.menu-item {
  position: relative;
}

li.menu-item {
	padding-bottom: 0px;
	font-size: 20px;
	border-right: 1px solid #111;
}


.menu > .menu-item > a {
  display: block;
  padding: 14px 20px;
  color: white;
  text-decoration: none;
  background: linear-gradient(180deg, #7db0e3, #2c5b9c);
}

.menu li a:hover {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.3)), linear-gradient(180deg, #7db0e3, #2c5b9c);
}

.menu > .menu-item > a:hover {
  background-color: #555;
}

/* Submenü */
.submenu {
  list-style: none;
  position: absolute;
  top: 100%;
  left: 0;
  background-color: #2c5b9c; /*#a9cefc;*/
  display: none;
  min-width: 160px;
  z-index: 1000;
}

.submenu li a {
  display: block;
  padding: 7px 16px;
  color: white;
  text-decoration: none;
  white-space: nowrap;
}

.submenu li a:hover {
  background: linear-gradient(rgb(242, 242, 242), rgb(210, 210, 210));
  color: black;
}

/* Beim Hover anzeigen */
.menu-item:hover .submenu {
  display: block;
}

ul.submenu {
	margin-left: 0px;
}



/**********************Menü Ende*****************/


/***********************Bingo************/

table.bingo {
    border-collapse: collapse;
  }
  table.bingo td {
    border: 1px solid #666;
    padding: 10px;
    text-align: center;
    cursor: pointer;
    width: 150px;
    height: 50px;
    user-select: none;
  }
  table.bingo td.clicked {
    background-color: #9f9;
  }
  
  
table.font17 td, table.font17 th{
	font-size: 17px;
}

table.font15 td, table.font15 th{
	font-size: 15px;
}