/**
 * {@internal
 * BE WARNED: when editing this file.
 *
 * While Opera, Firefox and others will work just fine,
 * IE versions up to 7.x are unable to understand the
 * attribute selector and the ":hover" pseudo-class
 * on input-tags.
 *
 * To get around this incompatibility all input fields that
 * can be styled (input[type="button"], input[type="text"] aso.)
 * have been tagged out with an encapsulating span.roundbtn
 * and all others (input[type="checkbox"]) are not.
 * This is a nasty hack and needs to be done by hand each time
 * the code is edited - still it's necessary to get things
 * right with IE.
 *
 * To make IE understand the hover-effect that works like
 * a charm in Firefox and Opera, a pseudo-link element would
 * have been needed for every input tag, what would have been
 * even worse.
 * This has NOT been done due to obvious reasons. Instead
 * IE will just NOT be able to display this effect.
 * If you find any other work-around for this issue, be my guest.
 *
 * This all mounts up to the following conclusion:
 * Every time you edit the predefined styles, or forms,
 * you need to double check the resulting layout in Firefox
 * AND IE unless you decide to drop support for IE
 * until it fully complies with the CSS 2.1 standard
 * (I bet you won't want to do that) ;-)
 * }}
 */
 
/* following styles are to mark required information */
.additional
{
    border: 1px dashed #aaaaaa;
    background-color: #eeeeee;
    color: #808080;
}
.optional
{
    border: 1px solid #888;
    background: #e0e0e0;
    color: #555;
}
.mandatory
{
    border: 1px solid #a88;
    background: #e6d5d2;
    color: #333;
}
/* select boxes */
select, option
{
    background-color: #E3E9EF;
    color: #005080;
}
select:hover, select:hover option, option:hover
{
    background-color: #FFF8E0;
    color: #000000;
}
select
{
    background-image: url('input_text.gif');
    border: 1px solid #3C6Da5;
}
select:hover
{
    background-image: url('input_text_hover.gif');
}
/* border styling and color */
textarea, input[type="text"], span.roundbtn input[type="text"], input[type="password"], span.roundbtn input[type="password"], button[type="text"], span.roundbtn button[type="text"], button[type="password"], span.roundbtn button[type="password"], span.roundbtn input[type="file"], input[type="file"]
{
    border: 1px solid #3C6Da5;
    color: #005080;
}
select:hover, textarea:hover:hover, input[type="text"]:hover, input[type="password"]:hover, button[type="text"]:hover, button[type="password"]:hover, span.roundbtn input[type="file"]:hover, input[type="file"]:hover
{
    border-color: #CCBB33 ! important;
    color: #333333 ! important;
}
/* textarea styles */
textarea
{
    background-color: #E3E9EF;
    background-image: url("input_textarea.gif");
    line-height: 17px;
    font-size: 14px;
    font-family: 'Courier New', 'Courier', monospace;
}
textarea.invalid
{
    border-color: #FF6600;
    background-image: url("input_textarea_invalid.gif");
    color: #FF0000;
}
textarea.additional
{
    background-image: url("input_textarea_additional.gif");
    border-color: #aaaaaa;
}
textarea.optional
{
    background-image: url("input_textarea_optional.gif");
    border-color: #888888;
}
textarea.mandatory
{
    background-image: url("input_textarea_mandatory.gif");
    color: #555555;
    border-color: #a88;
}
textarea:hover
{
    background-image: url("input_textarea_hover.gif");
}
/* font size and margin */
select, button, input
{
    font-size: 13px;
    margin: 0px;
}
/* background styles */
input[type="text"], span.roundbtn input[type="text"], input[type="password"], span.roundbtn input[type="password"], button[type="text"], span.roundbtn button[type="text"], button[type="password"], span.roundbtn button[type="password"], span.roundbtn input[type="file"], input[type="file"]
{
    background-color: #E3E9EF;
    background-image: url("input_text.gif");
}
span.roundbtn input.invalid, input.invalid, span.roundbtn button.invalid, button.invalid
{
    border-color: #FF6600;
    background-image: url("input_text_invalid.gif");
    color: #a00000;
}
span.roundbtn input.additional, input.additional
{
    background-image: url("input_text_additional.gif");
    border-color: #aaaaaa;
}
span.roundbtn input.optional, input.optional
{
    background-image: url("input_text_optional.gif");
    border-color: #888888;
}
span.roundbtn input.mandatory, input.mandatory
{
    background-image: url("input_text_mandatory.gif");
    color: #555555;
    border-color: #a88;
}
/* hover effects */
span.roundbtn input[type="text"]:hover, input[type="text"]:hover, span.roundbtn input[type="password"]:hover, input[type="password"]:hover, span.roundbtn button[type="text"]:hover, button[type="text"]:hover, span.roundbtn button[type="password"]:hover, button[type="password"]:hover, span.roundbtn input[type="file"]:hover, input[type="file"]:hover
{
    background-color: #FEFFEB;
    background-image: url("input_text_hover.gif");
}
/* button styles */
span.roundbtn input, input[type="button"], input[type="submit"], input[type="reset"]
{
    background: #E3E9EF url("input_button.gif");
    border:     1px solid #3C6Da5;
}
span.roundbtn input:hover, input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover
{
    border-color: #CCBB33 ! important;
    color:        #333333 ! important;
    background:   #FEFFEB url("input_button_hover.gif");
}
/**
 * Yana Framework 3.0.2
 * Copyright © 2015  Thomas Meyer  http://www.yanaframework.net
 * Copyright Hinweise dürfen NICHT entfernen werden!
 * Copyright notices may NOT be removed!
 */