a		{
	font-family: "Marcellus", "Courier", serif;	
	font-size: 120%;
    text-align: left;
}
article	{	
	font-family: "Marcellus", "Courier", serif;	
	font-size: 120%;
	color: beige;
}
audio	{
	float:right;
	width: 365px;
}

body	{
	background-image: url("hintergrund.jpg");
    background-repeat: no-repeat;
    background-position: center top;
	background-image: linear-gradient(300deg, rgb(145, 248, 240), rgb(196, 245, 21));
    text-align: left;
}

h1	{
	font-family: "Marcellus", "Courier", serif;	
	font-size: 240%;
	color:#22F;
	font-weight: normal;
	text-align:left;
}
h2	{
	font-family: "Marcellus", "Courier", serif;	
	background-color:rgba(240, 248, 255, 0.199);
	font-size: 18pt;
    text-align: left;
	height: 1.4em;
	color: rgb(87, 182, 182);
	width: 365px;
}
header	{
	font-family: "Marcellus", "Courier", serif;	
	font-size: 140%;
	color: rgb(94, 105, 84);
	background-image: linear-gradient(60deg, rgba(66, 147, 223, 0.123), rgba(5, 82, 248, 0.8));
	text-align: left;
    padding-left: 1%;
}
hr{
	height: 40px;
	background-color: beige;
}
html	{
	height: 100%
}
img{
	float:left;
	width: 365px;
	margin-top: 3em;
	opacity: 1;	
}
input	{
	border: white;
	background-color: white;
	text-align: center;
	text-transform: uppercase;
	height: 30pt;
	width: 30pt;
}
input.farbe {
    background-color: #9f9f;
}
p	{
	font-family: "Marcellus", "Courier", serif;	
	font-size: 100%;
	font-weight: normal;
}
table	{
    border-style: none;
	float: center;
}
td{
    border-style: none;
	width: 25%;
}
.k	{
	border-left: 3px solid red;
	border-top: 3px solid red;
}
.l	{
	border-left: 3px solid red;
}
.o {
	border-top: 3px solid red;
}

@media only screen and (min-width: 768px)	{
audio	{
		margin-left: 60%;
		width: 40%;
}
h2	{
		margin-left: 1%;
		text-align: left;
}
header	{
	position: relative;
	margin: auto;
	width: 653pt;
}
p 	{
	width: 653pt;
	position:relative;
	margin: auto;
}
table	{
	position: relative;
	margin: auto;
	width: 653pt;
}

}