html {
 margin: 0;
 padding: 0;
 background: url(/cms/gfx/top.png) repeat-x;
}

body {
 margin: 0;
 padding: 0;
 font-family: Arial, verdana, sans-serif;
 font-size: 12px;
}

h1 {
 margin: 0px 50px 0 0;
 height: 84px;
 width: 120px;
 float: left;
}

div#main {
 width: 420px;
 margin: 150px auto 0 auto;
 padding: 15px;
 border: 4px #D8D8D8 solid;
 background-color: #F5F5F5;
}

div#wrap-login {
 float: left;
 width: 250px;
}

.error {
 color: red;
}

p.submit {
 text-align: right;
 margin: 10px 0;
}

.clear {
 clear: left;
}

form {
 margin: 0;
 padding: 0;
}

input {
 font-size: 16px;
 padding: 2px;
 border: 1px #AAA solid;
}

.logo {
    top: 32px;
    position: relative;
    left: calc((100% - 720px)/2);
}

@media only screen and (max-width : 675px) {
    .logo{
        left:unset;
        width: 100%;
        height: auto;
        display:block;
    }

    div#main {
        width:100%;
        margin-top: 100px;
    }

    h1{
        float: unset;
    }

    div#wrap-login{
        width: unset;
        float: unset;
    }

    input {
        width:calc(100% - 40px);
        font-size: 25px;
    }

    form {
        margin-top:75px;
    }

    #submit{
        margin-top: 10px;
        width: calc(100% - 35px);
    }
}

@media only screen and (min-width : 1525px) {

}