@charset "UTF-8";
/*Erst normale Parameter für die Tabelle*/	
 table {
	 
	font-size: 1.05em;
	line-height: 1.3em;
	border-collapse: collapse;
	max-width: 920px;
	border: none;
	 with: 100%;
 }
.hell {
    background-color: #dcd4a7;
}
 td {
	padding: 6px;
	align: left;
	valign: top;
	border: thin solid #7b3104;
 }
th:first-child {
	padding-left: .1em;
}
th:last-child td:last-child {
	padding-right: .1em;	
}
thead th {
	border-bottom: 2px solid #e3d8a6;
	align: left;
	valign: top;
	padding-left: 6px;
	padding-right: 6px;
	}
.hell td strong {
}

/*Nun folgen die Parameter für mobile Devices*/

@media screen and (min-device-width: 770px) and (max-width: 769px) {
table {
	margin-top: 8;
	margin-right: 10px;
	margin-left: 0px;
	margin-bottom: 8;
	}
	

/*Die Tabelle wird in ein Blockelement umgewandelt*/
table, thead, tbody, th, td, tr {
	display: block;
	font-size: 1.05em;
	line-height: 1.3em;
}
/*Die Header werden versteckt*/
thead {
 	display: none;
}
/*Die gelbe Trennlinie zwischen den Blöcken*/
tr { 
	border: 1px solid #ddd; 
	border-bottom: 6px solid #e3d8a6;	
}


/*Hier wird der Rahmen definiert*/
td { 
	border-collapse: collapse;
	border: 1px solid #7b3104;
	position: relative;
	padding-left: 3%;
}
/*Für die schmale Darstellung werden hier nun Header links angezeigt*/
td:before {  
	position: absolute;  
	top: 10px;
	left: 3px;
	width: 2%;
	padding-right: 12px;
	white-space: nowrap;     
} 
/*hier werden die Labels für die responsive Darstellung angeführt*/

	td:nth-of-type(1):before { content: ""; }
	td:nth-of-type(2):before { content: ""; }
}

/*Formatierung der mobilen Darstellung für die Monate*/
.hell td strong {
	background-color: #dcd4a7;
	border: none; 
	border-bottom: none;
}
.hell td:nth-of-type(1):before { content: inherit; }


/*Für Smartphones*/
@media screen and (min-device-width: 0px) and (max-width: 769px) {

	table, thead, tbody, th, td, tr {
	display: block;
	font-size: 1.05em;
	line-height: 1.3em;
}

/*Die Header werden versteckt*/
thead {
 	display: none;
}
/*Die hellblaue Trennlinie zwischen den Blöcken*/
tr { 
	border: 1px solid #ddd; 
	border-bottom: 6px solid #e3d8a6;	
}
/*Hier wird der Rahmen definiert*/
td { 
	border-collapse: collapse;
	border: 1px solid #7b3104;
	position: relative;
	padding-left: 3%;
}
/*Für die schmale Darstellung werden hier nun Header links angezeigt*/
td:before {  
	position: absolute;  
	top: 10px;
	left: 3px;
	width: 2%;
	padding-right: 12px;
	white-space: nowrap;     
} 
/*hier werden die Labels für die responsive Darstellung angeführt*/
	td:nth-of-type(1):before { content: ""; }
	td:nth-of-type(2):before { content: ""; }
}

@media screen and (min-device-width: 0px) and (max-width: 769px) {

td { 
	border-collapse: collapse;
	border: 1px solid #7b3104;
	position: relative;
	padding-left: 3%;
}

}