@charset "UTF-8";

/* SpryValidation - version 0.4 - Spry Pre-Release 1.6.1 
 Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. 

##########################################################################################################
##########################################################################################################
##########                   Allgemeine Formatierungen (früher example.css)                     ##########
##########################################################################################################
##########################################################################################################*/

#SpryContactForm
{

	color:#555;
	font-size:12px;
	line-height:18px;
}

#SpryContactForm a:link,#SpryContactForm a:visited,#SpryContactForm a:active
{
	color:#DB0019;
	font-size:12px;
	text-decoration:none;
}

#SpryContactForm a:hover,#SpryContactForm a:focus
{
	color:#DB0019;
	font-size:12px;
	text-decoration:underline;

}

#text
{
	color:#555;
	font-size:12px;
	line-height:18px;
}

#text a:link,#text a:visited,#text a:active
{
	color:#DB0019;
	font-size:12px;
	text-decoration:none;
}

#text a:hover,#text a:focus
{
	color:#DB0019;
	font-size:12px;
	text-decoration:underline;
}

span.contactFormSubmit input.resetbutton,span.contactFormSubmit input.submitbutton
{
	background:#E1DED4;
	border:1px solid #BFBFBF;
	color:#555;
	cursor:pointer;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	font-weight:700;
	padding:3px;
	text-transform:uppercase;
	width:125px;
}

span.contactFormSubmit input.submitbutton
{
	margin-left:20px;
}

#SpryContactForm ul
{
	list-style:none;
	margin:0;
	padding:0;
}

#SpryContactForm input[type="text"]
{
	border:1px solid #BFBFBF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#555;
	height:16px;
	vertical-align:middle;
	width:330px;
margin:2px 0;
padding-top:2px;
}

#SpryContactForm select
{
	border:1px solid #BFBFBF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#555;
	height:20px;
	vertical-align:middle;
	width:333px;
margin:2px 0;
	line-height:20px;
}

#SpryContactForm textarea
{
	border:1px solid #BFBFBF;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#555;
	height:150px;
	margin:5px 0;
	width:330px;
padding-top:2px;
}


#SpryContactForm ul li
{
	clear:both;
}

#SpryContactForm ul li.textarea
{
	height:160px;
}

#SpryContactForm label
{
	display:block;
	float:left;
	width:140px;
}

.validMsg,.novalidMsg
{
	display:none;
	height:16px;
	padding:0 3px;
	position:relative;
	top:2px;
	width:16px;
}

.validMsg
{
	display:none;
}

.radioValidState .validMsg,.checkboxValidState .validMsg,.textfieldValidState .validMsg,.textareaValidState .validMsg,.selectValidState .validMsg
{
	display:inline;
}

.checkboxMaxSelectionsState .novalidMsg,.checkboxMinSelectionsState .novalidMsg,.radioRequiredState .novalidMsg,.checkboxRequiredState .novalidMsg,.textfieldRequiredState .novalidMsg,.textareaRequiredState .novalidMsg,.textfieldInvalidFormatState .novalidMsg,.textfieldMinCharsState .novalidMsg,.textfieldMaxCharsState .novalidMsg,.textareaMinCharsState .novalidMsg,.textareaMaxCharsState .novalidMsg,.selectRequiredState .novalidMsg
{
	display:inline;
}

span.textareaRequiredMsg,span.textareaMinCharsMsg,span.textareaMaxCharsMsg
{
	left:131px;
	position:relative;
}

#Counterror_mess
{
	padding:0 5px;
}

#SpryContactForm ul li.grpradio
{
	height:auto;
}

#SpryContactForm ul ^li span span.grpradio
{
	display:block;
	float:left;
	height:25px;
	width:100px;
}

#SpryContactForm ul li.grpcheckbox
{
	height:auto;
}

#SpryContactForm ul li span span.grpcheckbox
{
	display:block;
	float:left;
	height:25px;
	width:200px;
}

br.clear
{
	clear:both;
}

/*
##########################################################################################################
##########################################################################################################
##########                            Textfeld (früher Textarea.css)                            ##########
##########################################################################################################
##########################################################################################################

 These are the classes applied on the error messages
 * which prevent them from being displayed by default.
 */
.textareaRequiredMsg,.textareaMinCharsMsg,.textareaMaxCharsMsg,.textareaValidMsg
{
	display:none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and color for the error text.
 * The state class (e.g. .textareaRequiredState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.textareaRequiredState .textareaRequiredMsg,.textareaMinCharsState .textareaMinCharsMsg,.textareaMaxCharsState .textareaMaxCharsMsg
{
	color:#555;
	display:inline;
}

/* The next three group selectors control the way the core element (TEXTAREA) looks like when the widget is in one of the states: * focus, required / minChars / maxChars , valid 
 * There are two selectors for each state, to cover the two main usecases for the widget:
 * - the widget id is placed on the top level container for the TEXTAREA
 * - the widget id is placed on the TEXTAREA element itself (there are no error messages)
 
 When the widget is in the valid state the TEXTAREA has a green background applied on it. */
.textareaValidState textarea,textarea.textareaValidState
{
	background-color:#transparent;
	
}

/* When the widget is in an invalid state the TEXTAREA has a red background applied on it. */
textarea.textareaRequiredState,.textareaRequiredState textarea,textarea.textareaMinCharsState,.textareaMinCharsState textarea,textarea.textareaMaxCharsState,.textareaMaxCharsState textarea
{
	background-color:#E1DED4;
}

/* When the widget has received focus, the TEXTAREA has a yellow background applied on it. */
.textareaFocusState textarea,textarea.textareaFocusState
{
	background-color:#fff;
}

/* This class applies only for a short period of time and changes the way the text in the textarea looks like.
 * It applies only when the widget has enforce max chars enabled and the user tries to type some more.
 */
.textareaFlashState textarea,textarea.textareaFlashState
{
	color:red !important;
}

/* When the widget has the hint message on, the hint text can be styled differently than the user typed text. 

##########################################################################################################
##########################################################################################################
##########                         Eingabefelder (früher TextField.css)                         ##########
##########################################################################################################
##########################################################################################################

 These are the classes applied on the error messages
 * which prevent them from being displayed by default.
 */
.textfieldRequiredMsg,.textfieldInvalidFormatMsg,.textfieldMinValueMsg,.textfieldMaxValueMsg,.textfieldMinCharsMsg,.textfieldMaxCharsMsg,.textfieldValidMsg
{
	display:none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and color for the error text.
 * The state class (e.g. .textfieldRequiredState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.textfieldRequiredState .textfieldRequiredMsg,.textfieldInvalidFormatState .textfieldInvalidFormatMsg,.textfieldMinValueState .textfieldMinValueMsg,.textfieldMaxValueState .textfieldMaxValueMsg,.textfieldMinCharsState .textfieldMinCharsMsg,.textfieldMaxCharsState .textfieldMaxCharsMsg
{
	color:#DB0019;
	display:inline;
	margin-left:5px;
}

/* The next three group selectors control the way the core element (INPUT) looks like when the widget is in one of the states: * focus, required / invalid / minValue / maxValue / minChars / maxChars , valid 
 * There are two selectors for each state, to cover the two main usecases for the widget:
 * - the widget id is placed on the top level container for the INPUT
 * - the widget id is placed on the INPUT element itself (there are no error messages)
 
 When the widget is in the valid state the INPUT has a green background applied on it. */
.textfieldValidState input,input.textfieldValidState
{
	background-color:transparent;
}

/* When the widget is in an invalid state the INPUT has a red background applied on it. */
input.textfieldRequiredState,.textfieldRequiredState input,input.textfieldInvalidFormatState,.textfieldInvalidFormatState input,input.textfieldMinValueState,.textfieldMinValueState input,input.textfieldMaxValueState,.textfieldMaxValueState input,input.textfieldMinCharsState,.textfieldMinCharsState input,input.textfieldMaxCharsState,.textfieldMaxCharsState input
{
	background-color:#E1DED4;
}

/* When the widget has received focus, the INPUT has a yellow background applied on it. */
.textfieldFocusState input,input.textfieldFocusState
{
	background-color:#fff;
}

/* This class applies only for a short period of time and changes the way the text in the textbox looks like.
 * It applies only when the widget has character masking enabled and the user tries to type in an invalid character.
 */
.textfieldFlashText input,input.textfieldFlashText
{
	color:red !important;
}

/* When the widget has the hint message on, the hint text can be styled differently than the user typed text. 

##########################################################################################################
##########################################################################################################
##########                                (früher Select.css)                                   ##########
##########################################################################################################
##########################################################################################################

 These are the classes applied on the messages
 * (required message and invalid state message)
 * which prevent them from being displayed by default.
 */
.selectRequiredMsg,.selectInvalidMsg
{
	display:none;
}

/* These selectors change the way messages look when the widget is in one of the error states (required, invalid).
 * These classes set a default red border and color for the error text.
 * The state class (.selectRequiredState or .selectInvalidState) is applied on the top-level container for the widget,
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.selectRequiredState .selectRequiredMsg,.selectInvalidState .selectInvalidMsg
{
	color:#555;
	display:inline;
}

/* The next three group selectors control the way the core element (SELECT) looks like when the widget is in one of the states: 
 * focus, required / invalid, valid 
 * There are two selectors for each state, to cover the two main usecases for the widget:
 * - the widget id is placed on the top level container for the SELECT
 * - the widget id is placed on the SELECT element itself (there are no error messages)
 
 When the widget is in the valid state the SELECT has a green background applied on it. */
.selectValidState select,select.selectValidState
{
	background-color:#FFF;
	border:1px solid #FF9900;
}

/* When the widget is in an invalid state the SELECT has a red background applied on it. */
select.selectRequiredState,.selectRequiredState select,select.selectInvalidState,.selectInvalidState select
{
	background-color:#E1DED4;
}

/* When the widget has received focus, the SELECT has a yellow background applied on it. */
.selectFocusState select,select.selectFocusState
{
	background-color:#D9D9D9;
}

/*
##########################################################################################################
##########################################################################################################
##########                          Radiobuttons (früher Radio.css)                             ##########
##########################################################################################################
##########################################################################################################

 These are the classes applied on the messages
 * (required message and invalid value message )
 * which prevent them from being displayed by default.
 */
.radioRequiredMsg,.radioInvalidMsg
{
	display:none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and font color for the error text.
 * The state class (e.g. .radioRequiredState) is applied on the top-level container for the widget, 
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.radioRequiredState .radioRequiredMsg,.radioInvalidState .radioInvalidMsg
{
	color:#555;
	display:inline;
}

/*
##########################################################################################################
##########################################################################################################
##########                            Checkboxes (früher Checkbox.css)                          ##########
##########################################################################################################
##########################################################################################################

 These are the classes applied on the messages
 * (required message, minSelections message and maxSelections message)
 * which prevent them from being displayed by default.
 */
.checkboxRequiredMsg,.checkboxMinSelectionsMsg,.checkboxMaxSelectionsMsg
{
	display:none;
}

/* These selectors change the way messages look when the widget is in one of the error states.
 * These classes set a default red border and font color for the error text.
 * The state class (e.g. .checkboxRequiredState) is applied on the top-level container for the widget, 
 * and this way only the specific error message can be shown by setting the display property to "inline".
 */
.checkboxRequiredState .checkboxRequiredMsg,.checkboxMinSelectionsState .checkboxMinSelectionsMsg,.checkboxMaxSelectionsState .checkboxMaxSelectionsMsg
{
	color:#555;
	display:inline;
}