html, body {margin: 0;padding: 0;border:none}
body {font-family: "Open Sans", sans-serif;background-color:white;text-align: center;font-size:100%;}
img {border: none;}

a, a:active, a:visited {color: inherit;}

.clear {clear: both;}

#head {
    height: 58px;
    background: #B3B998;
    border-bottom: 13px solid #174566;
}

#head h1 {
    position: absolute;
    top: 32px;
    left: 15px;
    color: #FFF;
    font-size: 15pt;
    float: left;
}

#head #support {
    float: right;
    margin: 40px 15px 0 0;
    text-decoration: none;
    font-size: 10pt;
}

#container {
    position:absolute;
    top:50%;left:0px;
    width:100%;
    transform:translate(0, -50%);
    text-align: center;
    border-top:1px solid #174566;
    border-bottom:1px solid #174566;
    background-color:#efefef;
}

#client-logo {
    padding-top:10px;
    padding-bottom:20px;
    text-align:center;
}

#login-container {
    padding: 20px;
    width:400px;
    margin:10px auto;
    border:1px solid white;
    background-color:white;
    box-shadow:0 0 10px 0 black;
}

#login-container #error {
    border: 1px solid #F00;
    background: #FFFFD5;
    margin: 10px auto;
    width: 350px;
    padding: 3px;
    font-size: 9pt;
}

#login-container h3 {
    text-align: left;
    font-weight:400;
    margin:0 0 5px 0;
    font-size: 1em;
}

input[type="text"], input[type="password"] {
    padding:5px;
    border:2px solid #dfdfdf;
    box-sizing:border-box;
    width:100%;
    font-size:1.1em;
    background-color:#efefef;
    margin-bottom:1.5em;
    font-weight:400;
}

input[type="text"]:focus, input[type="password"]:focus {
    background-color:white;
    border-color:white;
    box-shadow:0px 0px 4px 1px #174566;
}

input[type="submit"] {
    display:inline-block;
    border:1px solid black;
    padding: 4px 15px;
    color:white;
    
    background: #a5a5a5; /* Old browsers */
    /* IE9 SVG, needs conditional override of 'filter' to 'none' */
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E1YTVhNSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMxMzEzMTMiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, #a5a5a5 0%, #131313 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a5a5a5), color-stop(100%,#131313)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #a5a5a5 0%,#131313 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #a5a5a5 0%,#131313 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #a5a5a5 0%,#131313 100%); /* IE10+ */
    background: linear-gradient(to bottom, #a5a5a5 0%,#131313 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a5a5a5', endColorstr='#131313',GradientType=0 ); /* IE6-8 */
}
input[type="submit"]:hover, input[type="submit"]:focus {
    border-color:black;
    box-shadow:0 0 4px 1px #174566;
}