| /* |
| * Copyright 2015 Open Networking Laboratory |
| * |
| * Licensed under the Apache License, Version 2.0 (the "License"); |
| * you may not use this file except in compliance with the License. |
| * You may obtain a copy of the License at |
| * |
| * http://www.apache.org/licenses/LICENSE-2.0 |
| * |
| * Unless required by applicable law or agreed to in writing, software |
| * distributed under the License is distributed on an "AS IS" BASIS, |
| * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| * See the License for the specific language governing permissions and |
| * limitations under the License. |
| */ |
| |
| div#login { |
| background: url("/imgs/login.jpg") no-repeat center; |
| background-size: contain; |
| position: absolute; |
| top: 3%; |
| left: 5%; |
| } |
| |
| div#login-wrapper { |
| text-align: center; |
| } |
| |
| #login h2 { |
| margin: 1%; |
| color: rgb(115, 115, 115); |
| font-size: xx-large; |
| font-weight: lighter; |
| text-align: left; |
| position: absolute; |
| top: -140px; |
| } |
| |
| div#login-form { |
| display: inline-block; |
| } |
| |
| #login div.outline { |
| position: absolute; |
| border: 1px solid rgba(115, 115, 115, 0.7); |
| background-color: white; |
| opacity: .6; |
| top: -160px; |
| left: -25px; |
| width: 300px; |
| height: 245px; |
| border-radius: 1px; |
| } |
| |
| div#login-form { |
| margin-left: 2.5%; |
| position: relative; |
| width: 255px; |
| margin-top: 33.5%; |
| } |
| |
| #login-form form { |
| line-height: 250%; |
| } |
| |
| #login-form input { |
| display: block; |
| height: 40px; |
| width: 230px; |
| font-size: 19px; |
| padding: 0 5px; |
| margin-bottom: 3.5%; |
| border-radius: 1px; |
| position: absolute; |
| } |
| #login-form input[type="text"] { |
| top: -90px; |
| } |
| #login-form input[type="password"] { |
| top: -35px; |
| } |
| |
| #login-form input[type="text"], |
| #login-form input[type="password"] { |
| border: 2px solid rgba(115, 115, 115, 0.7); |
| transition: border 0.1s; |
| } |
| #login-form input[type="text"]:focus, |
| #login-form input[type="password"]:focus, |
| #login-form input[type="button"]:focus { |
| outline: none; |
| border: solid 2px rgba(122, 188, 229, 0.5); |
| } |
| |
| #login-form a { |
| text-decoration: none; |
| } |
| |
| #login-form input[type="button"] { |
| top: 25px; |
| width: 245px; |
| height: 30px; |
| cursor: pointer; |
| letter-spacing: 0.02em; |
| font-size: 100%; |
| color: #3C3C3C; |
| background-color: lightgray; |
| transition: background-color 0.4s; |
| } |
| |
| #login-form input[type="button"]:hover { |
| color: white; |
| background-color: rgb(122, 188, 229); |
| } |
| |
| #login-form input.ng-invalid.ng-touched { |
| background-color: #CE5650; |
| color: white; |
| } |