/** button style ******************************************************************************************************/

/*.small {*/
/*    padding: 4px;*/
/*}*/

p.new_line {
    position:      relative;
    margin-top:    5px;
    margin-bottom: 10px;
}

.field_label {
    position:      relative;
    font-size:     1em;
    margin-bottom: .5em;
    color:         #333;
}

.field_label small,
.fieldNewLine small {
    font-size: .8em;
    color:     #AAA;
}

.fieldNewLine {
    display:       block;
    margin-bottom: 5px;
}

.forCheckBox {
    margin-top: -1px;
}

.inputSpamField {
    display: none;
}

.requiredField {
    font-size:      0.8em;
    vertical-align: top;
    color:          #9F3636;
}

*:focus { outline: none; }

.inputField, .inputSelect, .textarea {
    -webkit-transition: all 0.2s ease-in-out;
    transition:         all 0.2s ease-in-out;
    -moz-box-sizing:    border-box;
    box-sizing:         border-box;
    color:              #333;
    background-color:   #FFF;
    border:             1px solid #CCC;
    font-family:        'Lato', sans-serif;
    font-size:          1em;
    padding:            12px;
    display:            block;
}

select.inputField[multiple="multiple"] {
    height: 300px;
}

select {
    background-image:    url("data:image/svg+xml;charset=utf-8,%3Csvg%20version%3D%221.1%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20xmlns%3Axlink%3D%22http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink%22%20x%3D%220px%22%20y%3D%220px%22%20fill%3D%22%23333%22%20%0A%09%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%22-261%20145.2%2024%2024%22%20style%3D%22enable-background%3Anew%20-261%20145.2%2024%2024%3B%22%20xml%3Aspace%3D%22preserve%22%3E%0A%3Cpath%20d%3D%22M-245.3%2C156.1l-3.6-6.5l-3.7%2C6.5%20M-252.7%2C159l3.7%2C6.5l3.6-6.5%22%2F%3E%0A%3C%2Fsvg%3E");
    background-repeat:   no-repeat;
    background-position: right center;
    -webkit-appearance:  none;
    -moz-appearance:     none;
    appearance:          none;
    padding-right:       25px;
    font-weight:         400;
}

.inputField:hover, .inputSelect:hover, .textarea:hover {
    background-color: #FCFCFC;
    border:           1px solid #BBB;
}

.inputField:focus, .inputSelect:focus, .textarea:focus {
    background-color: #FFF;
    border:           1px solid #666;
}

input.dateTimeField,
select.dateTimeField {
    background-color: rgba(0, 0, 0, .3);
    border:           1px solid rgba(0, 0, 0, .6);
    padding:          5px;
    width:            auto;
    height:           auto;
    color:            #FFF;
}

input.dateTimeField:hover,
select.dateTimeField:hover {
    background-color: rgba(0, 0, 0, .4);
    border:           1px solid rgba(0, 0, 0, .8);
}

optgroup {
    font-weight: normal;
    font-style:  normal;
    line-height: 2em;
    font-size:   1.2em;
    padding:     4px;
    color:       #EB690B;
}

optgroup option {
    color:          #333;
    font-size:      .8em;
    text-transform: capitalize;
    padding:        4px 0 4px 20px;
}

input[type=range] {
    -webkit-appearance: none;
    width:              auto;
}

input[type=range]:focus {
    outline: none;
}

input[type=range]::-webkit-slider-runnable-track {
    height:        6px;
    cursor:        pointer;
    box-shadow:    0 0 0 rgba(0, 0, 0, 0.5), 0 0 0 rgba(13, 13, 13, 0.5);
    background:    rgba(14, 15, 17, 0.4);
    border-radius: 0;
    border:        0 solid #010101;
}

input[type=range]::-webkit-slider-thumb {
    box-shadow:         1px 1px 1px rgba(0, 0, 0, 0.54), 0 0 1px rgba(13, 13, 13, 0.54);
    border:             2px solid rgba(0, 0, 0, 0.1);
    height:             21px;
    width:              21px;
    border-radius:      50px;
    background:         #FFFFFF;
    cursor:             pointer;
    -webkit-appearance: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: rgba(26, 27, 31, 0.4);
}

input[type=range]::-moz-range-track {
    height:        6px;
    cursor:        pointer;
    box-shadow:    0 0 0 rgba(0, 0, 0, 0.5), 0 0 0 rgba(13, 13, 13, 0.5);
    background:    rgba(14, 15, 17, 0.4);
    border-radius: 0;
    border:        0 solid #010101;
}

input[type=range]::-moz-range-thumb {
    box-shadow:    1px 1px 1px rgba(0, 0, 0, 0.54), 0 0 1px rgba(13, 13, 13, 0.54);
    border:        2px solid rgba(0, 0, 0, 0.1);
    height:        21px;
    width:         21px;
    border-radius: 50px;
    background:    #FFFFFF;
    cursor:        pointer;
}

input[type=range]::-ms-track {
    height:       6px;
    cursor:       pointer;
    background:   transparent;
    border-color: transparent;
    color:        transparent;
}

input[type=range]::-ms-fill-lower {
    background:    rgba(2, 3, 3, 0.4);
    border:        0 solid #010101;
    border-radius: 0;
    box-shadow:    0 0 0 rgba(0, 0, 0, 0.5), 0 0 0 rgba(13, 13, 13, 0.5);
}

input[type=range]::-ms-fill-upper {
    background:    rgba(14, 15, 17, 0.4);
    border:        0 solid #010101;
    border-radius: 0;
    box-shadow:    0 0 0 rgba(0, 0, 0, 0.5), 0 0 0 rgba(13, 13, 13, 0.5);
}

input[type=range]::-ms-thumb {
    box-shadow:    1px 1px 1px rgba(0, 0, 0, 0.54), 0 0 1px rgba(13, 13, 13, 0.54);
    border:        2px solid rgba(0, 0, 0, 0.1);
    height:        21px;
    width:         21px;
    border-radius: 50px;
    background:    #FFFFFF;
    cursor:        pointer;
}

input[type=range]:focus::-ms-fill-lower {
    background: rgba(14, 15, 17, 0.4);
}

input[type=range]:focus::-ms-fill-upper {
    background: rgba(26, 27, 31, 0.4);
}

.rangeOutput {
    margin-top: -8px;
    text-align: right;
}

.fieldError,
select.dateTimeField.fieldError {
    border: 1px solid #9F3636;
}

.inputSelect {
    padding: 7px;
}

input.inputField[readonly="readonly"] {
    color:      #FFF;
    background: rgba(0, 0, 0, .3);
    border:     1px solid rgba(0, 0, 0, .6);
}

.inputSelect option {
    text-shadow: none;
    padding:     0;
    margin:      5px 0 5px 0;
}

.textarea {
    height:      150px;
    font-size:   1em;
    font-family: 'Lato', sans-serif;
    line-height: 1.4em;
}

input[type="checkbox"].chkBox,
input[type="radio"] {
    border:   0;
    clip:     rect(0 0 0 0);
    height:   1px;
    margin:   -1px;
    overflow: hidden;
    padding:  0;
    position: absolute;
    width:    1px;
}

input[type="checkbox"].chkBox + label,
input[type="radio"] + label {
    position:            relative;
    padding:             0 10px 0 1.5em;
    vertical-align:      middle;
    -webkit-user-select: none;
    -moz-user-select:    none;
    -ms-user-select:     none;
    user-select:         none;
    cursor:              pointer;
    display:             inline-block;
    text-align:          left;
}

input[type="radio"] + label {
    padding:      15px 10px 0 2.5em;
    margin-right: 30px;
}

input[type="checkbox"].chkBox + label:before,
input[type="radio"] + label:before {
    content:    '';
    position:   absolute;
    top:        4px;
    left:       0;
    width:      18px;
    height:     18px;
    background: transparent;
    font-size:  18px;
    text-align: center;
    border:     1px solid #AAA;
}

input[type="radio"] + label:before {
    top: 13px;
}

input[type="checkbox"].chkBox + label:after,
input[type="radio"] + label:after {
    content:            '';
    background-color:   #666;
    box-shadow:         inset 0 0 8px #000;
    position:           absolute;
    top:                6px;
    left:               2px;
    width:              8px;
    height:             8px;
    -webkit-transform:  scale(0);
    -ms-transform:      scale(0);
    transform:          scale(0);
    -webkit-transition: -webkit-transform 150ms ease-out;
    transition:         transform 150ms ease-out;
}

input[type="radio"] + label:after {
    top: 19px;
}

input[type="checkbox"].chkBox + label:after {
    background-color:     transparent;
    top:                  10px;
    left:                 4px;
    width:                10px;
    height:               5px;
    border-style:         solid;
    border-color:         #555;
    border-width:         0 0 2px 2px;
    box-shadow:           none;
    -webkit-border-image: none;
    -o-border-image:      none;
    border-image:         none;
    -webkit-transform:    rotate(-50deg) scale(0);
    -ms-transform:        rotate(-50deg) scale(0);
    transform:            rotate(-50deg) scale(0);
}

input[type="radio"]:checked + label:after {
    -webkit-transform: scale(1);
    -ms-transform:     scale(1);
    transform:         scale(1);
}

input[type="radio"] + label:before,
input[type="radio"] + label:after {
    border-radius: 50%;
}

input[type="checkbox"]:checked + label:after {
    -webkit-transform: rotate(-50deg) scale(1.3);
    -ms-transform:     rotate(-50deg) scale(1.3);
    transform:         rotate(-50deg) scale(1.3);
}

.lt-ie9 input[type="checkbox"].chkBox {
    border:     1px solid #FFF;
    background: #FFF;
    clip:       auto;
    height:     auto;
    margin:     10px 0 0 10px;
    overflow:   auto;
    padding:    0;
    position:   relative;
    width:      auto;
    float:      left;
}

.lt-ie9 input[type="checkbox"].chkBox + label:before,
.lt-ie9 input[type="checkbox"].chkBox + label:after {
    display: none;
}