/**
 * Stilmallar för formulär
 */

form, .form {
        width: 75%;
        margin: auto;
}

form.wide {
        width: 100%;
}

/* Se till att formulär i widgets inte blir orimligt smala  */
div.widget form {
        width: auto;
}

fieldset {
    background-color: #fd9;
    border: 1px solid #f90;
    border-top: 2px solid #900;
    margin-bottom: 1em;
    padding: 0.5em;
}

legend {
    font-weight: bold;
    color: #000;
}

div.formfield {
    margin-bottom: 0.5em;
}

/**
 * Gruppera formulärfält i en <div class="group"> ... </div>
 * för att få dem att visas på samma rad.
 */
div.group {
    float: left;
    width: 100%;
}

div.group div.formfield {
    float: left;
    margin-right: 2em;
}

label {
        display: block;
        font-size: 0.8em;
        clear: left;
}

label.checkBox {
        display: inline;
        font-size: 1em;
}

label.radio {
    display: inline;
}

dt label.radio {
    font-size: 1em;
}

div.radio_group div.formfield {
    float: left;
    margin-right: 1em;
}

textarea {
        /* IE verkar rendera textfält konstigt om man sätter bredden till 100%.
         * Jag är osäker på om det är IE eller övriga som gör rätt, men minskar iaf
         * bredden lite så att det ser ok ut.
         */
        width: 95%;
}

input[type=text],
input[type=password] {
        width: 95%;
}

input[type=text].wide,
input[type=password].wide {
    width: 20em;
}

input[type=text].narrow,
    width: 3em;
}

input[type=checkbox] {
    margin-right: 0.5em;
}

input[type=radio] {
    margin-left: 0.5em;
}

div.errorMessage {
        font-size: 80%;
        color: #f00;
        padding-bottom: 1em;
}

div.fieldWithErrors {
        border: 1px solid #f00;
}

fieldset ul {
    padding-left: 0;
    list-style: none;
}

fieldset ul.regular {
    list-style: disc;
    padding-left: 1em;
}

form#preferences {
    width: auto;
}


/* Ansökning till grupper på Bli spexare-sidan */
div.group-description {
    border-bottom: 1px solid #f90;
    margin: 0;
    padding: 1em;
}

div.group-description p {
    margin-bottom: 0;
}
