@charset "UTF-8";
/**
 * eigene css
 * idee: content.css
 */

@media all
{

/* --- absatzausrichtung ------------------------------------------------------------------------ */

.mittig {
        text-align: center;
}        

.links {
        text-align: left;
}        

.rechts {
        text-align: right;
}        





/* https://media.kulturbanause.de/2012/06/responsive-tables-css-data.html */
* {
	box-sizing:border-box;
}

table {
	width:100%;
}

table, td, tr, th {
	border:2px solid black;
	border-collapse: collapse;
	text-align: left;
}

td, tr, th {
	padding:1em;
}

th {
	background:#eee;
	font-weight: bold;
}

@media screen and (max-width:700px) {
	
	table, tr, td {
		padding:0;
		border:1px solid black;
	}

	table {
		border:none;
	}

	thead {
		display:none;
	}

	tr {
		float: left;
		width: 100%;
		margin-bottom: 2em;
	}

	td {
		float: left;
		width: 100%;
		padding:1em;
	}

	td::before {
		content:attr(data-label);
		background: #eee;
		border-right:2px solid black;
		width: 30%;
		float:left;
		padding:1em 0.25em; /* 1. Wert für padding-top und padding-bottom, 2. Wert für padding-left und padding-right ~ https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Abstand/padding */
		font-weight: bold;
		margin:-1em 0.25em -1em -1em; /* -1em 1em -1em -1em; 1. Wert für margin-top, 2. Wert für margin-right, 3. Wert für margin-bottom, 4. Wert für margin-left ~ https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Abstand/margin */
	}
}

}