diff --git a/css/form.css b/css/form.css index e04c162..9798188 100644 --- a/css/form.css +++ b/css/form.css @@ -1,51 +1,75 @@ body { - color: #222222; - background-color: white; - font-family: Helvetica, Arial, sans-serif; - font-size: 14px; - line-height: 19px; + color: #232527; + background-color: #2f343d; + font-family: 'Montserrat', sans-serif; } h1 { - font-size: 1.429em; + font-size: 32px; padding: 10px 15px 7px; border-bottom: 1px solid #e9e9e9; + display:none; } form { - padding: 20px; + padding: 30px 20px; margin: 0px auto; - width: 710px; - border: 1px solid #e9e9e9; - box-shadow: 0 3px 7px rgba(0, 0, 0, 0.8); + width: 330px; + border: 1px solid #fff; + background: #fff; + box-shadow: none; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%,-50%) +} + +form:before { + content: ''; + display: block; + height: 50px; + width: 170px; + background-image: url('https://d2b8lqy494c4mo.cloudfront.net/mss/images/miracle-logo-01.svg'); + margin: 0 auto; + margin-bottom: 30px; + background-repeat: no-repeat; + background-size: contain; } input { background-color: white; border: 1px solid #e9e9e9; border-radius: 3px; - box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.3); + box-shadow: none; display: inline-block; height: 18px; padding: 4px; - margin-bottom: 9px; + margin-bottom: 20px; font-size: 0.929em; line-height: 18px; + width: 230px; } #username { - margin-left: 27px + margin-left: 31px } button { border: none; + font-family: 'Montserrat' sans-serif; + color: #fff; + background: #2368a0; font-weight: normal; - color: white; - background: #0088cc; - padding: 9px 18px; - font-size: 1.143em; - line-height: 15px; + padding: 6px 18px; + font-size: 14px; + line-height: 16px; display: block; + margin-left: auto; + margin-right: 10px; +} + +label{ +display:inline-block; } label:before {