/*  haengt die Labels rechtsbuendig an 
    einer imaginaeren Mittelachse 5em 
    von links auf und kontrolliert den 
    Abstand zu den Kontrollelementen: */

label.left
{
    float         : left;
    text-align    : right;
/*  die naechsten zwei sind beliebig anpassbar,
    um in das jeweilige Gestaltungsraster (Sie 
    verwenden doch ein Gestaltungsraster, oder?) 
    zu passen. Bei Aenderungen aber nicht 
    vergessen, die margins bei input.right 
    entsprechend anzupassen: */
    width         : 49px;
    margin-right  : 1em;
    display       : inline;
}

label.leftfehler
{
	float: left;
    text-align    : left;
	/*  die naechsten zwei sind beliebig anpassbar,
    um in das jeweilige Gestaltungsraster (Sie 
    verwenden doch ein Gestaltungsraster, oder?) 
    zu passen. Bei Aenderungen aber nicht 
    vergessen, die margins bei input.right 
    entsprechend anzupassen: */
	width		  : 88px;
    margin-right  : 0em;
	display		  : inline;
	color		  : #660000;
}

label.reihe
{
	float         : left;
	margin        : 0 0.5em 1em 0;
    display       : inline;
}

/*  positioniert die Text- und 
    Auswahlboxen rechts daneben: */

input
{
    float         : left;
	margin-right  : 1em;
    display       : inline;
}

input.none { float: none; }

select
{
    float         : left;
	margin-right  : 1em;
    display       : inline;
}

/*  dann werden alle checkboxen und radiobuttons,
    die mit der Klasse "right" versehen wurden,
    um den errechneten linken Abstand der input
    und select-Elemente (s.o.) nach rechts
    verschoben: */

input.right
{
    float         : left;
    width         : auto;
    clear         : both;
    margin-left   : 5.3em;
    margin-right  : .3em;
    display       : inline;
}

/*  Extrawurst fuer Mozilla, keine Ahnung, 
    warum das so ist. Feedback und 
    Loesungsvorschlaege willkommen */

input[type=checkbox].right,
input[type=radio].right,
input[type=submit].right
{
    margin-left   : 6.3em;
}

/*  Nicht vergessen, die floats wieder aufzuheben,
    sonst floatet es munter weiter */

form br
{
    clear         : both;
}

/*  fuer grafische UAs und DAUs der Hinweis, dass
    die Label anklickbar sind. Weil's so schoen ist, 
    die Kontrollelemente gleich mit. Mit einer Ausnahme: 
    fuer Textfelder macht der Pointer natuerlich keinen 
    Sinn, dort sollte nach wie vor die Text-Einfuegemarke 
    als Cursor erscheinen. Daher hier die Einschraenkung 
    auf die input-Elemente des Typs checkbox, radiobutton, 
    button und submit: */

label,
select,
input[type=checkbox],
input[type=radio],
input[type=button],
input[type=submit]
input[type=reset]
{
    cursor         : pointer;
}

/*  legt den vertikalen Abstand der 
    einzelnen Elemente zueinander fest */

form
{
	line-height: 140%;
	background-color: inherit;
	color: #4c4c4c;
	width: 449px;
	margin: 0px;
	padding: 0px;
}

form p
{
    line-height: 120%;
}

form fieldset
{
	clear: both;
	border-color: #4c4c4c;
	border-width: 1px;
	border-style: solid;
	font-size: 0.9em;
	padding: 10px;
}

form fieldset p
{
	margin: 1em 0 1em 7em;
}

form div fieldset
{
	clear: both;
	border-color: #4c4c4c;
	border-width: 1px 0 1px 0;
	border-style: solid;
	padding: 10px;
}

form legend
{
	background-color: #4c4c4c;
	font-weight: bold;
	padding: 0 5px 0 5px;
	color: #CCC;
}



/* Formularfelder Breiten*/

input.feld1, input.feld1fehler, input.feld2, input.feld3, input.feld4
{
	background-color: #FFFFFF;
	margin: 0 0 1em 0;
}

input.feld1 { width: 355px; }
input.feld1fehler { width: 325px; }
input.feld2 { width: 70px; }
input.feld3 { width: 280px; }

input.feld4
{
	background-color: #FFFFFF;
	margin: 0 0.5em 0 0;
	width: 3em;
}

textarea.feld
{
	background-color: #FFFFFF;
	margin: 0;
	width: 423px;
	height: 200px;
}
