| | |
| | | .content{ |
| | | display: flex; |
| | | min-width: 1200px; |
| | | min-height: 600px; |
| | | min-height: 560px; |
| | | border-radius: 16px; |
| | | background: url("../assets/images/logbox.jpg") no-repeat center; |
| | | background-size: cover; |
| | | box-shadow: 0 10px 20px rgba(0,0,0,.1); |
| | | transform: translateY(-50px); |
| | | position: relative; |
| | | } |
| | | @keyframes float { |
| | | 100% { |
| | | transform: translateX(0); |
| | | opacity: 100%; |
| | | -webkit-opacity: 100% |
| | | } |
| | | } |
| | | .imgBox { |
| | | width: 50%; |
| | | min-height: 600px; |
| | | min-height: 560px; |
| | | opacity: 0; |
| | | -webkit-opacity: 0; |
| | | transform: translateX(50px); |
| | | display: flex; |
| | | justify-content: center; |
| | | align-items: center; |
| | | animation: float ease 0.6s 0.6s forwards; |
| | | } |
| | | .fromRow{ |
| | | width: 100%; |
| | |
| | | align-items: center; |
| | | background-repeat: no-repeat; |
| | | } |
| | | @keyframes showForm { |
| | | 100% { |
| | | transform: translateY(0); |
| | | opacity: 100%; |
| | | -webkit-opacity: 100% |
| | | } |
| | | } |
| | | .formBox{ |
| | | width: 50%; |
| | | height: 100%; |
| | | min-height: 600px; |
| | | border-radius: 0 16px 16px 0; |
| | | position: absolute; |
| | | right: 0; |
| | | top: -30px; |
| | | transform: translateY(30px); |
| | | opacity: 0; |
| | | -webkit-opacity: 0; |
| | | min-height: 620px; |
| | | border-radius: 16px; |
| | | background: #fff; |
| | | padding: 30px; |
| | | display: flex; |
| | | flex-direction: column; |
| | | justify-content: center; |
| | | z-index: 999; |
| | | animation: showForm ease-in-out 0.6s forwards; |
| | | } |
| | | .loginTitle{ |
| | | width: 100%; |