/**********************************************************************
* CSS for formatting of the UI
**********************************************************************/
header{
	display: flex;
	flex-direction:row;
	background-color:rgb(128, 128, 128);
}
body {
	display: flex;
	justify-content: center;
	background-color:#020451;
	background-image: url(../Resources/Program/VerlaufSenkrecht.jpg); 
	background-repeat:repeat-x;
	background-attachment: fixed;
	padding: 0;
	margin: 0;  
}
main{
	width:960px;
}
#Content{
	max-width: 960px; 
	margin-left: auto;
	margin-right: auto;
}
.programTitle{
	font-weight: bold;
	text-shadow: 0.25em 0.2em 0.3em rgb(0, 0, 0);
	color: white;
	text-align:center; 
	font-size: 2em;
	margin-left: auto;
	margin-right: auto;
	margin-top:0.2em;
}
.programSubtitle{
	text-shadow: 0.25em 0.2em 0.3em #000000;
	color: white;
}
h1,h2 {  
	color: #3333FF; 
}
th{
	text-align: left;
}
.tableLine{
	background-color:#03cafc;
	border-bottom: 0.1em solid black;
}
.tableLine:nth-child(even){
	background-color:#018cfe;
	color:#ffffff;
}
.button{
	min-width:10em;
	font-size:1em;
	padding:0.3em;
	background-color: #c0c0c0;
	border: 0.1em solid black;
	border-radius:0.5em;
	margin-top: 0.5em;
	margin-right: 1em;
}
.button2{
	font-size:1em;
	background-color: #c0c0c0;
	border: 0.1em solid black;
	border-radius:0.5em;
	}
.button:hover,
.button2:hover{
	background-color: red;
	color:white;
	cursor:pointer;
}
select, 
input, 
textarea{
	font-size: 1em;
	border: 0.1em solid black;
	border-radius: 0.3em;
	background-color: white;
}

/* ----------------------------------------------------------------
for smartphones different formatting is applied 
 smartphones send a smaller pixel number than physically available
 normally a third. I.e.: 1200px send 400  
 -----------------------------------------------------------------*/
@media only screen and (max-width: 480px) {
	body {
		width: 100%;
		display: flex;
		justify-content: center;
		background-image: none;
		background-color:rgb(255, 255, 255);
		padding: 0;
		margin: 0;  
	}
	main{
		width:100%;
	}
	.programTitle{
		font-size: 1.5em;
	}
	.programSubtitle{
		font-size: 1.1em;
	}
	p{
		font-size: 1em;
	}
	.comment, 
	.tableInput,
	.columnInput{
		width: 95%;
	}
	
}

/*-end of file------------------------------------------------------------*/