@CHARSET "UTF-8";

body,html {
    height: 100%;
    min-height: 100%;
}
body {
    text-align: center;
    padding-top: 2rem;
    background: linear-gradient(-45deg, rgba(0, 0, 70, 0.08) , rgba(1, 87, 155, 0.18)),#fff; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
body:after{
    position: fixed;
    content:'';
    left: -20px;
    top:0;
    right:-20px;
    height:20rem;
    background:#fff;
    /*background: linear-gradient(-45deg, rgba(0, 0, 70, 0.08) , rgba(1, 87, 155, 0.18)),#fff; /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */*/
    opacity: 1;
    z-index: -1;
    /*border-bottom:1px solid rgba(0,34,102,.2);*/
    box-shadow: inset 0 -10px 30px -10px rgba(0,34,102,.2);
    border-bottom: 1px solid rgba(0,34,102,.2);
}
#login {
    margin:0 auto 0 auto;
    width:40rem;
    text-align: left;
    /*background:rgba(255,255,255,.2);*/
    border-radius:5px;
    /*box-shadow: 0 -2px 2px rgba(100,100,100,.2);*/
    position: relative;
    overflow: hidden;
    z-index: 1;
}
.loginLogo {
    display: block;
    margin:0 auto 0 auto;
    width: 200px;
}
.loginLogo img {
    max-width: 100%;
    /*filter: grayscale(1);*/
    /*opacity: .5*/
}
h4 {
    height: 60px;
    text-transform: uppercase;
    font-weight: 200;
}
h4 span {
    display: block;
    margin-top:.5rem;
    font-size: 50%;
    color: #aaa;
}

div.renderWithName div.left { width: 150px;}
div.renderWithName div.right { margin-left: 160px;margin-right: 100px }

p.copy {
    text-transform: uppercase;
    font-size: .7rem;
}
p.copy small {
    display: block;
    font-size: .5rem;
    color:#999;
}