/********************** Grundlegende Einstellungen **********************  */
/* ### Eigenschaften diverser html tags #################################  */
img, td img { border: 0 none; }

table { text-align: left; }

table td { vertical-align: top; }

h4 { padding: 2px; margin: 4px; }

ul.menu {
 list-style: none outside;
 padding-left: 6px;
 margin: 3px;
}

label { font-weight: bold; }

iframe {
 overflow: auto;
 width: 100%;
 border: 0;
}

*html iframe { overflow: visible; }

.menu li {
 background: url(../images/list.png) no-repeat left;
 text-decoration: none;
 padding-left: 12px;
 margin: 4px;
}

.menu li:hover {
 background: url(../images/list_hover.png) no-repeat left;
 text-decoration: none;
 padding-left: 12px;
 margin: 4px;
}

/* ### Eigenschaft grüner Schrift #######################################  */
.green, a:link.green { color: #390; }

/* ### Eigenschaft roter Schrift ########################################  */
.red, a:link.red { color: #F00; }

/* ### Eigenschaften der Bilderbox (Homepage-Add/Edit) ###################  */
#picbox {
 border: 1px solid #000;
 text-align: left;
 height: 260px;
 overflow: auto;
 width: 75%;
}

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

#picbox ul li {
 padding: 4px;
 display: block;
 background: transparent;  
}

#picbox ul li:hover {
 padding: 4px;
 background: transparent; 
}

.picbox_preview {
 padding: 8px;
 height: 135px;
 vertical-align: top;
}

.picbox_preview img { border: 1px solid #000; }

/* ### Eigenschaften der Tooltips #######################################  */
.tool-tip {
 background: #FFC;
 border: 1px solid #D4D5AA;
 padding: 5px;
 max-width: 200px;
}

/* IE Fix for correct position */
*html .tool-tip { margin: 75px 0 0 330px; }

.tool-text{
 padding: 0;
 margin: 0;
 font-size: 70%;
 margin-top: -15px;
 padding-top: 15px;
 padding-bottom: 5px;
 background: url(../images/selector-arrow.png) no-repeat;
}

/* Developer Table */
table.userpage_developer {
 background: #C00;
 color: #FFF;
 border-bottom: 2px solid #600
}

table.userpage_developer h2 {
 padding: 0;
 margin: 0;
 text-align: center;
}

.errorbox {
 width: 70%;
 text-align: center;
}

.navigation {
 padding: 0; 
 margin: 0;
 width: 100%;
 border-collapse: collapse;
}

.buttons {
 text-align: center;
 margin: auto auto;
}

/******************* Extra ************************************************ */
/* SpryFormValidation.css - Revision: Spry Preview Release 1.4 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

.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 {
 display: block;
 background: #FFF9DE;
 border: 1px solid #F00;
 margin: 4px;
 padding: 6px;
 width: 350px;
 font-weight: bold;
}

/* 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: #B8F5B1;
 text-indent: 2px;
}

/* 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: #FF9F9F;
}

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

/********** Zusatz Darstellung der Homepage, (UserpageCodes) ***********/
a.userpage_link {
 background: url(../images/link_userpage.png) no-repeat left;
 padding-left: 18px;
 margin: 2px;
}

a.thread_link {
 background: url(../images/link_thread.png) no-repeat left;
 padding-left: 18px;
 margin: 8px;
}

a.wiki_link {
 background: url(../images/link_wikipedia.png) no-repeat left;
 padding-left: 16px;
 margin: 2px;
}