/*! -- silverstripe-styles-0.1.less */
/*! --------------------------------------------------- */

/* Silverstripe styles - SS generates it's own classes around form elements and those produced in the WYSIWYG editor.
 * here we can define more specific styling of these elements & classes to create better sites. */

form {
    margin: 0;
}

/* Fieldsets */

form fieldset {
    border: none;
    margin: 0;
    padding: 0;
    background: transparent;
}

form label {
    line-height: 2em;
}

form input + label {
    display: inline;
    float: none;
}

form select {
    height: 2em !important;
}

form input[type=text],
form input[type=password] {
    height: 2em !important;
}

#Security input[type=text],
#Security input[type=password] {
    width: 100%;
}

form input.holder-required,
form input.holder-required,
form textarea.holder-required {
    border-color: #C00 !important;
}

form .holder-required {
    position: relative;
}

form p.controls {
    margin-bottom: 1em;
}

form .Actions {
    margin-bottom: 1em;
}

form .Actions  button,
form .Actions .button,
form .Actions input[type=button],
form .Actions input[type=submit],
form .Actions input[type=reset] {
    display: inline-block;
    *display: inline;
    vertical-align: middle;
    height: 2.5em !important;
    line-height: 1.5em !important;
    padding-top: .5em !important;
    padding-bottom: .5em !important;
}

form .Actions #ForgotPassword {
    height: 2.5em !important;
    line-height: 2.5em !important;
    display: inline-block;
    *display: inline;
    margin: 0;
    vertical-align: middle;
}

form .Actions #ForgotPassword:before {
    content: " or ";
    margin-left: .5em;
}

span.req {
    color: #C00;
}

form .field {
    width: 100% !important;
    position: relative;
    *zoom: 1;
}

form .field:after {
    content: ".";
    display: block;
    font-size: 0;
    height: 0 !important;
    clear: both;
    visibility: hidden;
    line-height: 0;
}

form .field.UploadifyField {
    margin-bottom: 1.5em;
}

form p.error,
form ul.errors {
    margin-left: -1.5em;
    margin-right: -1.5em;

    color: #C00;
    border-color: #C00;
}

form ul.errors {
    list-style-position: inside;
    padding-left: 1.5em !important;
    padding-right: 0 !important;
}

form ul.errors li {
    font-size: .8em;
    line-height: 1.5em;
    margin: 0;
}

form .field.textarea textarea {
    overflow: hidden;
}

form .field.text,
form .field.email,
form .field.password,
form .field.textarea,
form .field.dropdown {
    margin-bottom: .5em;
}

form .field.text label.left,
form .field.email label.left,
form .field.password label.left,
form .field.textarea label.left,
form .field.dropdown label.left {
    position: relative;
    left: 0;
    min-width: 10em;
    line-height: 2em !important;
    float: left;
    display: inline;
    padding: 0;
    margin-bottom: 0 !important;
}

form .field.text .middleColumn,
form .field.email .middleColumn,
form .field.password .middleColumn,
form .field.textarea .middleColumn,
form .field.dropdown .middleColumn {
    position: relative;
    left: 0;
    display: table-cell;
    *display: block;
    *zoom: 1;
    float: none;
    _position: relative;
    _left: -3px;
    _margin-right: -3px;
    width: auto;
}

form .field.text .middleColumn:after,
form .field.email .middleColumn:after,
form .field.password .middleColumn:after,
form .field.textarea .middleColumn:after,
form .field.dropdown .middleColumn:after {
    display: block;
    height: 0 !important;
    clear: both;
    visibility: hidden;
    line-height: 0;

    /**
     * Generated content is required here long enough to fill any remaining
     * space that might be left unfilled from the floated columns!
     */
    content: " . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . " !important;
}

/* Opera... */
@media all and (-webkit-min-device-pixel-ratio:10000), not all and (-webkit-min-device-pixel-ratio:0) {
    form .field.text .middleColumn,
    form .field.email .middleColumn,
    form .field.textarea .middleColumn,
    form .field.dropdown .middleColumn {
        display: block;
    }
}

@media screen and (-webkit-min-device-pixel-ratio:0) {
    form .field.text .middleColumn,
    form .field.email .middleColumn,
    form .field.textarea .middleColumn,
    form .field.dropdown .middleColumn {
        width: auto !important;
    }
}

form .field.text input,
form .field.email input,
form .field.password input,
form .field.dropdown select,
form .field.textarea textarea {
    margin: 0 !important;
}

.typography table {
    border-collapse: separate;
    border-spacing: 0;
}

.typography p.text-left { text-align: left; }
.typography p.text-rite { text-align: left; }
.typography p.text-center { text-align: left; }
.typography p.text-full { text-align: left; }
.typography p.bold { font-weight: 700; }

/*
.typography .left {
    float: left;
    padding: 0.5em 1em 1em 0;
}
*/

.typography img.left {
    padding: 0;
    margin: .05em 1em 1em 0;
}

/*
.typography .right {
    float: right;
    padding: 0.5em 0 1em 1em;
}
*/

.typography img.right {
    padding: 0;
    margin: .05em 0 1em 1em;
}

.typography .center {
    display: inline-block;
    *display: inline;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
}

.typography img.center {
    margin-bottom: 1em;
}

.typography .leftAlone {
    float: left;
    margin-right: 100%;
}

.typography img.leftAlone {
    margin-bottom: 1em;
}

.typography .rightAlone {
    float: right;
    margin-left: 100%;
}

.typography img.rightAlone {
    margin-bottom: 1em;
}

.typography .clearBoth {
    clear: both;
}