/**
 * @package DSL.de
 * @lastmodified $Id$
 *
 * @tableofcontents
 *
 * 1. Input Felder
 * 2. Buttons
 * 3. Formular im Teaser
 */

/* @section 1. Input Felder */

.fieldFull {
    padding: 0.75em 3%;
    width: 100%
}

/* @section 2. Buttons */

.buttonDefault, .buttonDefaultForward {
    background: url('../img/button_gradient.png') center #fcae18;
    background: -webkit-linear-gradient(top left, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.2) 40%, rgba(255, 255, 255, 0.3) 70%, rgba(255, 255, 255, 0) 90%), -webkit-linear-gradient(top, #fcbc40, #fcbc40 50%, #fcae18 50%, #fc7d02);
    background: linear-gradient(top left, rgba(255, 255, 255, 0) 10%, rgba(255, 255, 255, 0.2) 40%, rgba(255, 255, 255, 0.3) 70%, rgba(255, 255, 255, 0) 90%), linear-gradient(top, #fcbc40, #fcbc40 50%, #fcae18 50%, #fc7d02);
    border-radius: 0.25em;
    box-shadow: inset 0 1px #f8d547, inset 0 -1px #ffa90f, 0 2px 2px rgba(0, 0, 0, 0.2);
    border: 1px solid #ffa509;
    border-bottom-color: #a2501f;
    cursor: pointer;
    font: 700 1.675em oswald, arial;
    color: #f1f1f1;
    text-decoration: none;
    text-shadow: 0 1px #a76200, 0 0 1px #a76200;
    padding: 0.125em 0.5em;
    position: relative;
    overflow: visible;
    transition: box-shadow 0.2s ease;
    -webkit-transition: box-shadow 0.2s ease;
}

.buttonDefault:hover, .buttonDefaultForward:hover {
    color: #fff;
    box-shadow: inset 0 1px #f8d547, inset 0 -1px #ffa90f, 0 2px 3px rgba(0, 0, 0, 0.3), inset 0 -4px 8px rgba(252, 222, 78, 0.9)
}

.buttonDefaultForward:after {
    content: '›';
    font: 400 1.5em oswald, arial;
    margin-left: 0.375em
}

/* @section 3. Formular im Teaser */

.formDefault input, .formDefault select {
    border-radius: 0.25em;
    box-shadow: inset 2px 2px 6px rgba(0, 0, 0, 0.4);
    padding: 0.325em;
    color: #666;
    border: 0;
    font-size: 1.25em;
    -webkit-transition: box-shadow 0.4s ease;
    transition: box-shadow 0.4s ease;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.formDefault input:focus {
    box-shadow: inset 2px 2px 6px rgba(0, 0, 0, 0.2);
    color: #444
}

.narrowscreen .formDefault input[type='text'], .narrowscreen .formDefault select {
    width: 100%
}

.formDefault label {
    display: inline-block;
    margin: 0.5em 0 0.25em;
    padding: 0.5em 0 0;
    font-size: 1.25em
}

.narrowscreen .formDefault label {
    display: block;
    background: rgba(0, 0, 0, 0.1)
}