
<!--
/** version 1.0 
*   Stand: 03.02.2021 Dr. Detlef Balters
*   det_basic.css
**/
-->

:root {
  --primary: #7fa8c4;
  --dark: #000;
  --light: #fff;
  --menueblue: #3f6884;
  --menue_hover: #5f88a4;
  --button: #ffffffaa;
  --anker: #00f;
  --anker_visited: #0000d0;
  --shadow: 0 1px 5px rgba(0, 0, 0, 0.8);
}



html {
	box-sizing: 			border-box;
	font-family:			Arial, Helvetica, sans-serif;
	color: 					var(--dark); 
    font-size:          	1em;
    font-weight:       		normal;
    background-color:		var(--light); 


}

body {
	padding:            	0px 0px 0px 0px; /* oben rechts unten links */
    margin:             	0px 0px 0px 0px; /* oben rechts unten links */
/*  font-family:        	Arial, Helvetica, sans-serif;
	color: 					#000000; 
    font-size:          	1em;
    font-weight:       		normal;
    background-color:		var(--light);  */
}
 
 
#seitenbereich {
  	text-align:				left;  /* Inhalt wieder links wegen alten IEs */
 	margin: 				0.0em auto;   /* Zentrierung mitte */
	padding:                0em 0em 0em 0em; /* oben rechts unten links */ 
  	max-width: 				80.0em; 
  	min-height: 			30.0em;
/*	box-shadow: 			0px 0px 10px 0px grey; */
	box-shadow: 			var(--shadow);
}

/* Footer */
footer {
	margin-top: 2rem;
	background: var(--menueblue);
	color: var(--light); 
	text-align: center;
	padding: 10px;
}

 
p {
 	padding:            	0em 0em 0em 1.0em;
    margin:             	0em 0em 0em 0em; 
}


h1 {
 	padding:                0.7em 0em 0.3em 0.8em; /* oben - rechts - unten - links */
	background-color:       inherit;
	font-family:            Verdana, Arial, Helvetica, sans-serif;
  	font-size:				1.3em;
  	font-weight:			bold;
 }
 
h2 {
 	padding:                0.7em 0em 0.3em 0.8em; /* oben rechts unten links */
	font-family:            Verdana, Arial, Helvetica, sans-serif;
  	font-size:				1.2em;
  	font-weight:			bold;
	color: var(--light);
 }
 
 
h3 {
 	padding:                0.7em 0em 0.3em 0.8em; /* oben rechts unten links */
	font-family:            Verdana, Arial, Helvetica, sans-serif;
  	font-size:				1.1em;
  	font-weight:			normal;
 }
		 

a {
 	padding:             	0px 0px 0px 0px; /* oben - rechts - unten - links */
    margin:              	0px 0px 0px 0px; /* oben - rechts - unten - links */
    color: 					var(--anker);
    background-color: 		inherit;
    text-decoration:		none;
 }
  
a:link 	{
	font-style:				normal; 
	text-decoration:		none;
}
 
a:visited 	{
	 color: 				var(--anker_visited); 
 }

 
input  {						/* Eingabefeld */
	color:                  var(--dark);
    background-color:       var(--light);
    font-family:            Arial, Helvetica, sans-serif;
    font-size:              0.9em;
    font-weight:            normal;
 }
 
 img {  
	max-width: 97%; 
	height: auto;
	margin:            		0em 0em 0em 1.0em;
}


/* Tabellen Grundkonfiguration*/

table{
		margin:             	0em 1.0em 0em 1.0em; /* oben - rechts - unten - links */
		padding:            	0em 0em 0em 0em;
		border: 				1px solid var(--menueblue);
		max-width: 97%;
}


table, th, td { 

  		border-collapse: 		collapse;
  		padding:				0.3em 0.5em; 
}
 
 
 th, caption, tfoot { 
  		background-color: 		var(--menueblue); 
  		color: 					#fff; 
  		border: 				1px solid var(--menueblue);
}
 

td {
		background-image: 		linear-gradient(#f9f9f9, #e3e3e3); 
 		border-left: 			1px solid var(--menueblue);
 		border-right: 			1px solid var(--menueblue);
}


caption {
  		font-size: 				1.5em;
  		border-radius: 			0.5em 0.5em 0 0;
  		padding: 				0.5em 0 0 0;
}

.warnung {
		color:                  #ff0000;
  		font-weight:			bold;	
}


.tab_button {
		color:                  #ffffff;
		font-size:              1.0em;
        background-color:       inherit;	
}


@media screen and (max-width: 65em) {
	
	
#seitenbereich {
 	margin: 				0.0em auto;   /* Zentrierung mitte */
	padding:                0em 0em 0em 0em; /* oben rechts unten links */ 
	box-shadow: 			0px 0px 0px 0px grey; 
}

 
body {

	color: 					#000000; 
	font-size:          	0.9em;
}
 
 input  {						/* Eingabefeld */
    font-size:              0.8em;
 }
 




img {  
  max-width: 92%;
	  height: auto;
	margin:            		0em 0em 0em 1.0em;


}

table {
	margin:             	0em 1.0em 0em 1.0em;
	padding:            	0em 0em 0em 0em;
	max-width: 94%;

}
/* Formate für Querformat */ 
@media screen and (orientation: landscape) and (max-width: 65em){ 

body {
}

}