﻿@import url(http://weloveiconfonts.com/api/?family=fontawesome);

[class*="fontawesome-"]:before {
    font-family: 'FontAwesome', sans-serif;
}

* {
    box-sizing: border-box;
}

    *:before, *:after {
        box-sizing: border-box;
    }

* {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

body {
    line-height: 1;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

    blockquote:before, blockquote:after,
    q:before, q:after {
        content: '';
        content: none;
    }

table {
    border-collapse: collapse;
    border-spacing: 0;
}

.JD-Bg-Img {
    width: 800px;
    height: 600px;
    position: absolute;
    left: -150px;
    top: -300px;
    transform: rotate(13deg);
    z-index: -1;
    opacity: 0.3;
}

body {
    background: #cecece;
    color: #606468;
    font: 87.5%/1.5em 'Open Sans', sans-serif;
    margin: 0;
}

input {
    border: none;
    font-family: 'Open Sans', Arial, sans-serif;
    font-size: 14px;
    line-height: 1.5em;
    padding: 0;
    -webkit-appearance: none;
}

p {
    line-height: 1.5em;
}

.container {
    left: 50%;
    position: fixed;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}


#login {
    width: 280px;
}

    #login form span {
        background-color: #317311;
        border-radius: 3px 0px 0px 3px;
        color: #ede3e3; /*lock color*/
        display: block;
        float: left;
        height: 50px;
        line-height: 50px;
        text-align: center;
        width: 50px;
    }

    #login form input {
        height: 50px;
    }

        #login form input[type="text"], input[type="password"] {
            background-color: #eaeaea;
            border-radius: 0px 3px 3px 0px;
            color: #606468;
            margin-bottom: 1em;
            padding: 0 16px;
            width: 230px;
            outline-color: #317311;
        }

        #login form input[type="submit"] {
            border-radius: 3px;
            -moz-border-radius: 3px;
            -webkit-border-radius: 3px;
            background-color: #317311;
            color: #eee;
            font-weight: bold;
            margin-bottom: 2em;
            text-transform: uppercase;
            width: 280px;
            outline-color: #317311;
        }


            #login form input[type="submit"]:hover {
                background-color: #094909
            }

    #login > p {
        text-align: center;
    }

        #login > p span {
            padding-left: 5px;
        }

    /*Validation*/
    #login form span.validation-box {
        position: absolute;
        background-color: transparent;
        color: red;
        display: block;
        height: 50px;
        line-height: 50px;
        width: 500px;
        left: 286px;
        text-align: left;
        font-weight: bold;
        font-style: italic;
        font-size: 13px;
    }
