.tabgrid{
		display:grid;
		grid-template-columns: 50% 50%;
}
aside .tabgrid{
		display:grid;
		grid-template-columns: 100%;
}
aside .tabgrid img{
	display:none;
}
body {
	display: grid;
	gap: 0.5em;
}
#borth body {
	background-color:palegreen;
	display: grid;
}
header
{
	text-align:center;	
}
nav {
	grid-row: 1 / 2;
	grid-column: 1 / -1;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 9998;
}
#borth header {
	grid-row: 1 / 2;
	grid-column: 1 / -1;
	position: -webkit-sticky;
	position: sticky;
	top: 0;
	z-index: 9999;
}
#borth nav {
	grid-row: 2 / 3;
	grid-column: 1 / -1;
	position: -webkit-sticky;
	position: sticky;
	top: 10em;
	z-index: 9999;
	margin:0;
}
/* =================================================
	Abschnitt für PORTRAIT BREITE --> 30em
	Handy PORTRAIT
================================================== */
/*@media (max-width: 30em)
{*/
	body
	{
		grid-template-rows: auto auto auto auto auto;
		grid-template-columns: 1fr;
	}
	header {
		grid-row: 2 / 3;
		grid-column: 1 / -1;
	}
	#borth header {
		grid-row: 1 / 2;
		grid-column: 1 / -1;
		padding: 0;
	}
	.headcolumn{
		display:grid;
		grid-template-rows: 1fr;
		grid-template-columns: 1fr 5fr 1fr;
	}
	#borth .headcolumn{
		margin: 0;		
	}
	.headcolumn img{
		grid-column: 1 / -1;
	}
	#borth .headcolumn img{
		/*display: none;*/
	}

	nav {
		display:grid;
		grid-row: 1 / 2;
		grid-column: 1 / -1;
	}
	#borth nav {
		grid-row: 2 / 3;
		grid-column: 1 / -1;
	}
	nav .tblmax{
		display:none;
	}
	nav .tblmin{
		display:block;
	}
	nav .tblmin {
		display: grid;
		grid-template-rows: 1fr;
		grid-template-columns: repeat(4, 1fr);
	}
	aside {
		grid-row: 4 / 5;
		grid-column: 1 / -1;
	}

	main {
		grid-row: 3 / 4;
		grid-column: 1 / -1;
	}
	footer {
		grid-row: 5 / 6;
		grid-column: 1 / -1;
	}
	main#mrw {
		/*grid-row: 4 / 5;*/
		grid-column: 1 / -1;
		background: transparent;
		border-color: ;
	}
	main#mrw .article1 {
		background: transparent;
		border-color: blue;
	}
	main#mrw .article2 {
		background: transparent;
		border-color: blue;
	}
	main#mrw .article3 {
		background: transparent;
		border-color: blue;
	}
	main#mrw .boxaside1 {
		background: transparent;
		border-color: blue;
	}
/*}*/
/* =================================================
   Styles footer
================================================== */
	footer{
	color: white;
	background: #a00000;
	width: 100%;
	overflow: hidden;
	}
	footer p{
	padding-left: 25px;
	color: #f1f0d1;
	}
	footer a{
	margin-left: 50px;
	color: #e7f3ef;
	text-decoration: none;
	}

/* =================================================
   Styles nav
================================================== */
nav li {
	display: inline-block;
	width: 75%;
	padding: 0.25em;
	text-decoration: none;
	font-weight: normal;
	border-bottom: 1px solid #78561d;
	border-radius:2em;
	background-color: #f0e68c; /* khaki */
	color: #600;
}
#borth nav li {
	border-radius:0em;
	height:auto;
}
nav li a {
	display: inline-block;
	/*padding: 0.1em 0;*/
	text-align: center;
	width: 100%;
}

nav ul{
	margin:0;
	padding:10px;
	padding-left:30px;
	//background-color: red;
}
header {
	background: #F1F3F4;
	border-color: #d5d5d5;
	display: grid;
	grid-template-columns: min-content 1fr;
}

nav {						/* Farben*/
	background: #fffbf0;
	border-color: #e7c157;
}

main {
	background: #ffede0;
	border-color: #df6c20;
}

aside {
	background: #ebf5d7;
	border-color: #8db243;
}
body {
	margin: 0 auto;
	max-width: 60em;
	font-family: sans-serif;
}
.gridarticle{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 1fr;
	height:6em;
	margin-top: 0.5em 0;
	margin-right: 0;
	margin-bottom: 0.25em;
	margin-left: 0em;
}
.report
{
	margin:0.5em;
	padding:.25em;
	height:7em;
	border: 1px solid blue;
	border-radius: 2em;
	text-align:center;
	overflow: hidden;
	font-size: 0.8em;
	color: darkblue;
}
.bericht
{
	margin:0.25em;
	padding:0.5em;
	height:auto;
	border: 1px solid blue;
	border-radius: 0;
	text-align:left;
	overflow: hidden;
	font-size: 1em;
	color: darkblue;
}
.bericht-c
{
	margin:0.5em;
	padding:.25em;
	border: 1px solid blue;
	border-radius: 2em;
	text-align:center;
	overflow: hidden;
	font-size: 0.8em;
	color: darkblue;
}
button { 
  padding: 0 0 0 -0.25em; 
  border: 2px solid green;
  background: #5a9900 linear-gradient(#8db243, #5a9900); 
  border-radius: 5em; 
  /*box-shadow: 0 lpx 5px gray; */
  color: white;
  text-shadow: 0 -1px 1px #333;
  font-size: 1em; 
  //line-height: 1em;
}
.borthnav button { 
  padding: 0 0 0 -0.25em; 
  border: 0px solid darkblue;
  background: #5a9900 linear-gradient(#8db243, #5a9900); 
  border-radius: 0em; 
  /*box-shadow: 0 lpx 5px gray; */
  color: white;
  text-shadow: 0 -1px 1px #333;
  font-size: 1em; 
  //line-height: 1em;
}
.berichtlink button{ 
	display:inline-block;
	margin-top: -10em;
	padding: 0; 
	color: blue;
	border: 0;
	border-radius: 0; 
	/*background-color: transparent; */
	background: 0;
	text-shadow: none;
	text-decoration:underline;
	font-size: .75em; 
}
.tbltabelle{
	border: 1px solid blue;
	margin: 1% 0% 1% 0%;
	width: 100%;
	color:blue;
	text-align: center;
	font-size: 1.25em;
}
h2{
	margin:0;
	padding:0.25em 0;
}
h4{
	margin:0;
	padding:0.25em 0 0 0;
	font-weight:950;
}
h5{
	margin:0;
	padding:0.25em 0 0 0.25em;
	font-weight:950;
}
h6{
	margin:0;
	padding:0;
}
.box{
	border: 1px solid blue;
	border-radius: 2em;
	margin: 1em 0.25em;
} 
.box1, .boxaside1, .boxaside2, .boxaside3{
	border: 1px solid black;
	border-radius: 1em;
	margin: 1em 0.25em;

} 
.boxaside1, .colorbox1{
	background-color: #B0E0E6;	/* powderblue */
} 
.boxaside2, .colorbox2{
	background-color: #90EE90;	/* lightgreen */
} 
.boxaside3, .colorbox3{
	background-color: transparent;	/* lightgreen */
} 
.boxform1, .boxform2, .boxform3{
	display: block;
	color: black;
	font-size: 0.75em;
}
.boxform1{
	text-align: left;
}
.boxform2{
	text-align: right;
}
.boxform3{
	text-align: center;
}
.bkv1{
	background-color: #87CEEB; /*skyblue*/
	color: blue;	
}
.bkv2{
	background-color: #00BFFF; /*deepskyblue*/
	color: blue;
}
.bkvtitel{
	background-color: silver;
	color: blue;
	padding: 0.5em 0;
	margin: 0.5em 0;
}
/* Rahmen */
header,
main,
article,
section,
aside,
footer {
	border-radius: 1em;
	border: 1px solid;
	padding: 10px;
}
article {
	margin:1em;
}
nav{
	margin:0;
	border-radius: 1em;
	border: 1px solid;
	padding: 1px;	
}
/* Rahmen */
#borth nav,
#borth header,
#borth main,
#borth article,
#borth section,
#borth aside,
#borth footer {
	border-radius: 0;
	border: 1px solid;
	padding: 5px;
}
.article1, .article2, .article3, .article4
{
	margin: 1em;
}
.article2
{
	text-align: center;
}
.article3
{
	padding: 0em;
	text-align: center;
}
.article4
{
	background:red;
	margin-bottom: 0em;
	padding-top: 0em;
	text-align: center;
}
/* =================================================
   Tooltip
================================================== */
.inhalt{
	margin:0em;
	padding:0em;
}
.inhalt ul{
	border: 0px solid blue;
	padding:0;
}
.inhalt ul li{
	border: 0px solid red;
	padding:0 1em;
}
details {
	//grid-column: 1 / 3;
	//font-size: 0.75em;
	height: min-content;
	transition: all .5s;
	color: darkblue;
}

[role=button] {
	//background: var(--accent);
	//color: var(--background);
	//border-radius: 0;
	//border: thin solid var(--accent);
	//width: min-content;
	//padding: 0.5em;
	//font-size: 0.75em;
	//line-height: 100%;
	//font-weight: bold;
}

summary {
	font-size: 0.85em;
}
summary::marker {
	content:  " 🏓 "; /* Verwendung des "Pfeil"-Symbols anstelle des Dreiecks */	
	color: darkblue;
}

details[open] [role=button] {
	background: transparent);
	color: darkblue;
}

details p {
	/*position: relative;*/
	padding: 0.1em 0 0.5em 0.85em;
	margin-top: 0em;
	//border: thin solid var(--accent);
	border-radius: 0.75em;
	color: darkblue;
	font-size: 0.75em;
	padding: 0 0 0 3.25em;
}

.liste {
	color: darkblue;
	font-size: 0.75em;
	padding-left: 3.25em;
}


:root {
	--accent: #337599;
	--background: white;
	--dropdown-width: 160px;
}

/* =================================================
   Karteireiter
================================================== */
.reiter {
	-webkit-transition: 0.3s box-shadow ease;
	transition: 0.3s box-shadow ease;
	border-radius: 0em;
	max-width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	  flex-wrap: wrap;
	position: relative;
	list-style: none;
	border: 1px solid darkblue;
	background-color: transparent;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.reiter:hover {
	box-shadow: 0 12px 23px rgba(0, 0, 0, 0.23), 0 10px 10px rgba(0, 0, 0, 0.19);
}
.tab {
	display: none;
}
.tab:checked:nth-of-type(1) ~ .tabInhalt:nth-of-type(1) {
	opacity: 1;
	-webkit-transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease, 0.8s -webkit-transform ease;
	position: relative;
	top: 0;
	z-index: 100;
	-webkit-transform: translateY(0px);
		  transform: translateY(0px);
	text-shadow: 0 0 0;
}
.tab:checked:nth-of-type(2) ~ .tabInhalt:nth-of-type(2) {
	opacity: 1;
	-webkit-transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease, 0.8s -webkit-transform ease;
	position: relative;
	top: 0;
	z-index: 100;
	-webkit-transform: translateY(0px);
		  transform: translateY(0px);
	text-shadow: 0 0 0;
}
.tab:checked:nth-of-type(3) ~ .tabInhalt:nth-of-type(3) {
	opacity: 1;
	-webkit-transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease, 0.8s -webkit-transform ease;
	position: relative;
	top: 0;
	z-index: 100;
	-webkit-transform: translateY(0px);
		  transform: translateY(0px);
	text-shadow: 0 0 0;
}
.tab:checked:nth-of-type(4) ~ .tabInhalt:nth-of-type(4) {
	opacity: 1;
	-webkit-transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease, 0.8s -webkit-transform ease;
	position: relative;
	top: 0;
	z-index: 100;
	-webkit-transform: translateY(0px);
		  transform: translateY(0px);
	text-shadow: 0 0 0;
}
.tab:checked:nth-of-type(5) ~ .tabInhalt:nth-of-type(5) {
	opacity: 1;
	-webkit-transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s -webkit-transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease;
	transition: 0.5s opacity ease-in, 0.8s transform ease, 0.8s -webkit-transform ease;
	position: relative;
	top: 0;
	z-index: 100;
	-webkit-transform: translateY(0px);
		  transform: translateY(0px);
	text-shadow: 0 0 0;
}
.tab:first-of-type:not(:last-of-type) + label {
	padding: 0.25em 0;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-right: 1px solid darkblue;
	border-bottom: 1px solid darkblue;
}
.tab:not(:first-of-type):not(:last-of-type) + label {
	padding: 0.25em 0;
	border-radius: 0;
	border-right: 1px solid darkblue;
	/*border-left: 1px solid darkblue;*/
	border-bottom: 1px solid darkblue;
}
.tab:last-of-type:not(:first-of-type) + label {
	padding: 0.25em 0;
	border-top-left-radius: 0;
	border-bottom-right-radius: 0;
	border-bottom-left-radius: 0;
	border-bottom: 1px solid darkblue;
	/*border-left: 1px solid darkblue;*/
}
.tab:checked + label {
	background-color: #FFF5EE;			/* seashell */
	box-shadow: 0 0px 0 #fff inset;
	cursor: default;
}
.tab:checked + label:hover {
	box-shadow: 0 0px 0 #fff inset;
}
.tab + label {									/* nicht aktive TABs*/	
	box-shadow: 0 -1px 0 #eee inset;
	border-radius: 1em;
	cursor: pointer;
	display: block;
	text-decoration: none;
	color: darkblue; /*#333;*/
	-webkit-box-flex: 3;
	  -ms-flex-positive: 3;
		  flex-grow: 3;
	text-align: center;
	background-color: transparent; 				/*#f2f2f2;*/
	-webkit-user-select: none;
	 -moz-user-select: none;
	  -ms-user-select: none;
		  user-select: none;
	text-align: center;
	-webkit-transition: 0.3s background-color ease, 0.3s box-shadow ease;
	transition: 0.3s background-color ease, 0.3s box-shadow ease;
}
.tab + label:hover {
	box-shadow: 0 1px 0 #f4f4f4 inset;
}
.tabInhalt {
	padding: 10px 25px;
	background-color: #FFF5EE;			/* seashell */
	position: absolute;
	width: 100%;
	z-index: -1;
	opacity: 0;
	left: 0;
	-webkit-transform: translateY(-3px);
		  transform: translateY(-3px);
	border-radius: 0;
	border-bottom-right-radius: 1em;
	border-bottom-left-radius: 1em;
}

/* =================================================
	Abschnitt für PORTRAIT BREITE --> 30em
	Handy PORTRAIT
================================================== */

@media (min-width: 30em) {
	/*Breite beträgt mindestens 30em*/

	body
	{
		grid-template-rows: auto auto 1fr auto auto;
		grid-template-columns: 1fr 3fr;
	}
	#borth body
	{
		grid-template-rows: auto auto 1fr auto auto;
		grid-template-columns: 1fr;
	}
	header {
		grid-row: 2 / 3;
		grid-column: 1 / -1;
	}
	nav {
		grid-row: 1 / 2;
		grid-column: 1 / -1;
	}
	nav {
		display: grid;
	}
	nav .tblmin{
		display:none;
	}
	nav .tblmax{
		display:block;
	}
	nav .tblmax {
		display: grid;
		grid-template-rows: 1fr;
		grid-template-columns: repeat(4, 1fr);
	}
	#borth nav .tblmax{
		display: grid;
		grid-template-columns: repeat(4, 1fr);
	}
	aside {
		grid-row: 3 / 4;
		grid-column: 1 / 2;
	}
	#borth aside{
		display:none;
	}

	main {
		grid-row: 3 / 4;
		grid-column: 2 / -1;
	}
	main.borthmain
	{
		grid-row: 3 / 4;
		grid-column: 1 / -1;
	}
	footer {
		grid-row: 4 / 5;
		grid-column: 1 / -1;
	}
}
/* =================================================
	Abschnitt für PORTRAIT BREITE <-- 1000px
================================================== */
@media (orientation:portrait) and (max-width: 1000px)
{
	body
	{
		width:90%;
	}
}
/* =================================================
	Abschnitt für PORTRAIT BREITE <-- 30em
================================================== */
@media (orientation:landscape) and (min-width: 30em)
{
	body .borthbody
	{
		grid-template-rows: auto auto 1fr auto auto;
		grid-template-columns: 1fr;
	}
}
/* =================================================
	Abschnitt für PORTRAIT BREITE --> 30em
	Handy PORTRAIT
================================================== */
@media (orientation:portrait) and (max-width: 1200px)
{
	header
	{
		grid-row: 2 / 3;
		grid-column: 1 / -1;
		padding: 0px;
	}
	nav
	{
		grid-row: 1 / 2;
		grid-column: 1 / -1;
	}
	aside
	{
		grid-row: 4 / 5;
		grid-column: 1 / -1;
	}
	main
	{
		grid-row: 3 / 4;
		grid-column: 1 / -1;
	}
	footer
	{
		grid-row: 6 / 7;
		grid-column: 1 / -1;
	}
	nav .tblmax
	{
		display:none;
	}
	nav .tblmin
	{
		display:block;
	}
	nav .tblmin {
		display: grid;
		grid-template-rows: 1fr;
		grid-template-columns: repeat(4, 1fr);
	}
	.headcolumn{
		grid-template-columns: 1fr;
		padding: 0px;
	}
	.headcolumn img{
		display: none;
	}
}