#variabelneu h1 {
 font-size: 1.5em;
 color: #736D6D; 
 font-weight: normal;
 text-align: left;
 margin: 0 0 10px 25px;
 padding: 5px;
 width: 100%;
}

#formularbereich {
 display:-webkit-flex;
 display: flex;
 -webkit-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-align-items: stretch;
 align-items: stretch;
 background: transparent;
 padding: 5px;
 margin: 5px 25px;
 min-width: 50em;
 max-width: 70em;
 text-align: left;
 line-height: 1.5;
}

#formularbereich p {
 width: 100%;
 padding: 0;
 margin-bottom: 10px;
 margin-top: 0;
}
#formularbereich p:first-of-type {
 margin-bottom: 0;
} 

#formularbereich form {
 -moz-box-shadow: 0 0 5px #ccc;
 -webkit-box-shadow: 0 0 5px #ccc;
 box-shadow: 0 0 5px #ccc;   
 margin: 20px 0 25px 0;
 padding: 20px;
 width: 95%;
} 

#form_zeile1, #form_zeile2, #form_zeile3, #form_zeile4 {
 display:-webkit-flex;
 display: flex;
 -webkit-flex-wrap: wrap;
 flex-wrap: wrap;
 -webkit-justify-content: flex-start;
 justify-content: flex-start;	
 width: 100%;
 background-color: #F2F2F2; 
 margin-top: 10px;
 padding: 0 10px;
} 

.textfelder1, .textfelder2, .cbfelder {margin: 20px 0;} 

#formularbereich input[type=text] {
 color: #686363; 
 font-size: 1em;
 margin: 0 10px;
}

table {margin-top: 15px;}

table td {padding-bottom: 20px;}

#formularbereich input[type=checkbox] {
 width: 20px;
 height: 20px;
 margin: 0 10px 0 0;
 accent-color: #6b7838;
}

#formularbereich input[type=text]:focus {
 background-color: #f6f6f6;
 outline: none;
 border: 2px solid #6b7838;
}

#formularbereich button {
 display: inline;
 color: #fff;
 background-color: #6b7838;
 font-size: 1.0em;
 padding: 10px;
 margin: 20px 15px 10px 0;
 min-width: 10em;
 cursor: pointer;
}  

#formularbereich button:hover {background-color: #000;}
	
.f_symbole {
 font-family: symbole;	
 font-size: 1.3em;
} 

.pflichtfeld_ok {background-color: #eff3e2;}

.pflichtfeld_fehler {background-color: #f9d9d9;}

#meldung {
 width: 100%;
 margin-bottom: 20px;
}

#fehler {
 font-weight: bold;	
 color: #ad0303;
} 

.rot {color: #ad0303;}

.gross {font-size: 1.3em;}

@media only screen and (max-width: 1200px) {
 /* Rand links verschwindet, alternativer Kopf */ 		

 #variabelneu h1 {
  padding: 5px;
  margin: 0 15px;
 }

 #formularbereich {
  margin: 10px 15px;
  min-width: 90%;
  max-width: 95%;
 }

}

@media only screen and (max-width: 1024px) {
	
 #variabelneu h1 {margin: 0 10px 5px 25px;}	
 
 #formularbereich {
  padding: 15px;
  min-width: 60%;
  max-width: 95%;
 }
 
 #formularbereich form {width: 100%;}
 
 #formularbereich input[type=text] {font-size: 1.1em;}

 .textfelder2, .cbfelder {width: 100%;}  

 .cbfelder {margin: 20px 0 10px 0;} 

 .textfelder2 {margin: 0 0 20px 25px;}

}

@media only screen and (max-width: 800px) {

 #variabelneu h1 {margin: 10px;}	

 #formularbereich {
  padding: 15px;
  min-width: 100%;
  max-width: 100%;
  width: 100%;
  margin: 0;
 }
 
 #formularbereich form {
  padding: 20px 0;
  margin: 20px 0;
  -moz-box-shadow: 0 0 0 #ccc;
  -webkit-box-shadow: 0 0 0 #ccc;
  box-shadow: 0 0 0 #ccc;     
  border-top: 1px solid #736D6D;
  border-bottom: 1px solid #736D6D;
 }

 #formularbereich input[type=checkbox] {
  width: 30px;
  height: 30px;
 }
 
 .textfelder2 {margin: 0 0 10px 0;}
 
 .textfelder2 input[type=text] {
  max-width: 3em;
  margin-left: 0 !important;
 }
 
 .textfelder1 input[type=text] {max-width: 5em;}

}