﻿body {
    /*background: #cccccc;*/
    /*color: #dddddd;*/
    font-family: 'Ubuntu Mono', sans-serif;
    text-transform: uppercase;
}

.box {
    width: 95%;
    max-width: 700px;
    height: auto;
    max-height: 300px;
    margin: 0 auto;
    margin-top: 100px;
    background: lightgray;
    border-radius: 2px;
    border: 1px solid rgba(0,0,0,.2);
    box-shadow: 1px 1px 1px 1px rgba(0, 0, 0, 0.2);
}

.content {
    width: 85%;
    height: auto;
    margin: 0 auto;
    padding: 30px 0px;
    text-align: center;
}

    .content h1 {
        font-size: 24px;
        font-weight: 400;
        color: black;
        letter-spacing: 0.125em;
        text-align: center;
    }

.content2 {
    width: 100%;
    height: auto;
    margin: 0 auto;
    text-align: center;
}

.field {
    width: 99%;
    margin: 0px 0px 0px 0px;
    padding: 10px 0px;
    background: #ffffff;
    /*border: 1px solid rgba(0,0,0,.2);*/
    /*box-shadow: 1px 1px 1px 1px;*/
    border-radius: 3px;
    outline: none;
    color: #ababab;
    font-weight: 700;
    letter-spacing: 0.125em;
    text-align: center;
    border-style: ridge;
    /*text-transform: uppercase;*/
}


.btn {
    width: 100%;
    padding: 10px 0px;
    background: #285f8f;
    border: none;
    /*box-shadow: 0px 1px 0px 0px #111;*/
    border-radius: 3px;
    outline: none;
    color: #fafafa;
    font-weight: 700;
    letter-spacing: 0.125em;
    text-align: center;
    text-transform: uppercase;
    height: 40px;
}

    .btn:hover {
        cursor:pointer;
        color: #fafafa;
    }

    .btn:active {
        color: #fafafa;
    }
         
::-webkit-input-placeholder { /* WebKit browsers */
    color: #ababab;
}

:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
    color: #ababab;
}

::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #ababab;
}

:-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #ababab;
}
