body { margin:0px; background: #fbfbfb; font-family: 'Open Sans', sans-serif; } #title { padding:10px; color: #fbfbfb; background: #ff7153 url("../images/background_title_login.png") right no-repeat; font-size:1.5em; /*text-shadow: 1px 1px 0px rgba(0, 0, 0, 1);*/ } .form { margin:10px 15px 10px 10px; position:relative; } input[type="text"], input[type="password"] { width:100%; border: solid #bcbcbc 1px; font-size:2em; border-radius:5px; padding:2px; } input:focus { border-color: #FF7052; outline:1px; } .submit { width:250px; display: block; margin: 0 auto 18px auto; background: #fff; border-radius: 10px; border: 1px solid #FF7052; color: #FF7052; font-size: 24px; cursor: pointer; box-shadow: 0px 0px 0px 7px #fff; transition: 0.2s ease-out; position:relative; } .submit:hover, .submit:focus { background: #FF7052; color: #fff; outline: 0; } .error { font-weight:bold; color: #ff0000; } #submit_block { position:relative; } #loading { top:10px; right:40px; position:absolute; display:block; width:16px; height:16px; border: solid #000 0px; background: url('../images/ajax-loader.gif') center no-repeat; display:none; } /* Phones */ @media (max-width: 767px) { #login { width:100%; border: solid #cbcbcb; border-width:0px 0px 1px 0px; margin-top:5px; margin:0px; overflow:hidden; background: #eaeaea; } } /* Tablets */ @media (min-width: 780px) and (max-width: 979px) { #login { position:relative; width:400px; border: solid #cbcbcb 1px; margin-top:5px; margin-left:auto; margin-right:auto; overflow:hidden; background: #eaeaea; } } /* Desktops */ @media (min-width: 980px) { #login { position:relative; width:400px; border: solid #cbcbcb 1px; margin-top:5px; margin-left:auto; margin-right:auto; overflow:hidden; background: #eaeaea; } }