body	{
		font-family:Arial;
		font-size:16px;
		background:#ffffff;
		}
th		{
		background:#808080;
		border:1px solid #f0f0f0;
		color:#ffffff;
		text-align:left;
		}
datalist {font-size:17px;font-family:Arial;}
tr		{font-weight:normal;
		}
tr.trn	{
		background:#fcfcfc;
		color: #000;
		}
tr.trn:nth-child(even)
		{
		background:#f0f3ff;
		}
tr.trn:hover 
		{
		background: #e2e2e2;
		color: #ff0000;
		cursor:pointer;
		}
td.l	{
		font-family:Arial;
		font-size:16px;
		text-align:right;
		padding-right:15px;
		}
td.r	{
		font-family:Arial;
		font-size:16px;
		text-align:left;
		padding-left:5px;
		}
td	{
	font-family:Arial;
	font-size:16px;
	padding-left:5px;
	}
td.bc	
	{
	background:#f0f3ff;
	}

.sub1,
.sub2 {
  display: none;
	}
:checked ~ .sub1,
:checked ~ .sub2 {
  display: block;
  margin-left: 40px;
	}
input:required	{
			border-color: #88a;
			border-style:solid;
			border-width: 5px;
			}


div.header
	{
	background:#33cc00;
	width:100%;
	}
a {
	text-decoration: none;
	color:#000000;
	font-family:Arial;
	font-size:16px;
	}
a:hoverxxx	{color:red;
	font-weight:bold;
	}
a.hover1:hover	{color:red;
	font-weight:bold;
	}
input  {font-size:16px;}
label::after {
	content: "";
	display: block;
	}
input:read-only
		{ 
		background: #f2f2f2;
		}
textarea  {
		font-family:inherit;
		font-size:inherit;
		}
fieldset {
		border: none;
		}
div.seite	{
			}

div.links	{
			margin:10px;
			padding:10px;
			margin-top:15px;
			width:365px;
			height:330px;
			float:left;
			background:#f2f2f2;
			border:0px solid #000000;
			}
table.i {
		min-width: 800px;
		padding: 10px;
		border  : 1px solid gray;
		background:#f7f7f7;
		}
.button
{
text-align:center;
width:344px;
height:40px;
cursor:pointer;
background:#ffffff;
border: 1px solid #999;
box-shadow:3px 0px 7px 0px #cacaca;
}

@media only screen and (max-width: 1900px)
{
.projart
		{
		width:258px;
		padding:3px;
		color:white;
		text-align:center;
		margin-bottom:3px;
		}

	.tech	{
		width:258px;
		padding:3px;
		color:white;
		margin-top:3px;
		margin-bottom:5px;
		border-radius:5px;
		}

	.flex-container {
	  display: flex;
	  flex-wrap: wrap;
	  align-content: stretch;
	  background: #f1f1ef;
	}

	.flex-container > div {
	  background: #fbfdff;
	  min-width: 263px;
	  margin: 10px;
	  padding:10px;
	  box-shadow:3px 1px 10px 1px #a0a0a0;
	  border-radius:10px;
	}
}

@media only screen and (max-width: 800px)
{
.projart
		{
		width:298px;
		padding:3px;
		color:white;
		text-align:center;
		margin-bottom:3px;

}

.tech	{
		width:293px;
		padding:5px;
		color:white;
		margin-top:3px;
		margin-bottom:5px;
		border-radius:5px;
		}

	.flex-container {
	  display: flex;
	  flex-wrap: wrap;
	  align-content: stretch;
	  background: #f1f1ef;
	}

	.flex-container > div {
	  background: #fbfdff;
	  width: 305px;
	  margin: 10px;
	  padding:10px;
	  box-shadow:3px 1px 10px 1px #a0a0a0;
	  border-radius:10px;
	}
}

@media only screen and (max-width: 600px)
{
body	{
		font-family:Arial;
		font-size:16px;
		background:#000000;
		}
h3, h2		{		color:white;}

.projart
		{
		width:298px;
		padding:3px;
		color:white;
		text-align:center;
		margin-bottom:3px;

}

.tech	{
		width:293px;
		padding:5px;
		color:white;
		margin-top:3px;
		margin-bottom:5px;
		border-radius:5px;
		}

	.flex-container {
	  display: flex;
	  flex-wrap: wrap;
	  align-content: stretch;
	  background: #f1f1ef;
	}

	.flex-container > div {
	  background: #fbfdff;
	  width: 350px;
	  margin: 10px;
	  padding:10px;
	  box-shadow:3px 1px 10px 1px #a0a0a0;
	  border-radius:10px;
	}
.button
	{
	text-align:center;
	width:344px;
	height:50px;
	cursor:pointer;
	background:#ffffff;
	border: 1px solid #999;
	box-shadow:2px 0px 3px 0px #a0a0a0;
	}
}
@media print {
#element {
  display: none;
} 
}