
/*--- Form ---------------------------------------------------- */
form.form{
    padding: 10px;
}

/*--- Box ---------------------------------------------------- */
.form_element_box{
   margin:    5px 0 5px 0;
   padding:   10px;
   border:    1px solid white;
}

/*--- Container State -------------------------------------------- */

.form_element_box_invalid{
    background: #FFF0F0;
    outline:     1px solid #EF5C04;
}

.form_element_box_active{
    background-color: #FFFBEF;    
    border:           1px solid #C5960C;
}

.form_element_box_hover{
    background-color: #D1DFEF;    
    border:           1px solid #A4B8EF;
}

.form_element_box_selected{
    background-color: #A4B8EF;    
    border:           1px solid #C5960C;
}

.form_element_box_container{

}

/*--- Element Size --------------------------------------------- */

.form_size_tiny{
    width: 12.5%;
}

.form_size_small{
    width: 25%;   
}

.form_size_medium{
    width: 50%;
}

.form_size_large{
    width: 75%;
}

.form_size_full{
    width: 100%;
}

.form_size_auto{
    width: auto;
}

/*--- Errors ---------------------------------------------------- */
.form_element_status{
    padding: 8px 0px;
}

.form_element_status_icon{
    vertical-align: middle;
}

/*--- Header ---------------------------------------------------- */
.form_section_header{
    padding:       20px;
    margin:        15px 0;
    border:        1px dotted #C0C0C0;
    background:    #EFEFEF;
}

    .form_section_header img{
        float: left;
        margin-right: 10px;
        vertical-align: middle;
    }

    .form_section_header h3{
        margin:    0;
        padding:   0;
        font-size: 18px;
        color:     #696969;
    }

    .form_section_header p{
        font-size: 14px;
        color: #A9A9A9;    
    }

/*--- General ---------------------------------------------------- */
.form_element_label{
   font-weight:  bold;
   font-size:    1.1em;
   color:        #222222; 
   margin:       0;
   padding:      0;
}

.form_element_label_top{
   display: block;
   padding: 3px 0;
}

.form_element_label_right{
   display:      inline;
   width:        auto;
   padding:      0 10px;
   vertical-align: middle;
   font-size:    1em;
}

.form_element_label_bottom{
   display: block;
   padding: 3px 0;
}

.form_element_label_left{
   float:        left;
   display:      block;
   width:        115px;
   padding:      0 10px;
   font-size:    1em;
}

.form_element_required_glyph{
    color: red;
}

.form_element_description{
    display:   block;
    padding:   5px 0;
    font-size: 0.9em;
    color:     #2F2F2F;
}

.form_element_example{    
    display:     block;
    padding:     5px 0px;
    font-size:   0.9em;
    color:       black;
}

.form_element_radio{
    vertical-align: middle;
}

.form_element_checkbox{
    vertical-align: middle;
    border: 0 !important;
    width: auto !important;
}

.form_upload_progressbar{
    position: relative;
    width:   100px;
    height:  14px;
    padding: 1px;
    border:  1px solid black;
    -moz-border-radius:    2px;
    -webkit-border-radius: 2px;        
    border-radius:         2px;
}

    .form_upload_progressbar_bar{
        width:      0%;
        height:     14px;
        background: #BECBDC;
    }

    .form_upload_progressbar_value{
        position:    absolute;
        top:         1px;
        left:        1px;
        right:       1px;
        bottom:      1px;
        text-align:  center;
        font-weight: bold;
        font-size:   9px;
        line-height: 14px;
    }

