|
|
- body {
- font-family: 'Montserrat', sans-serif;
- text-rendering : optimizeLegibility;
- -webkit-font-smoothing : antialiased;
- }
-
- #login-bg.container-fluid {
- padding: 0;
- height: 100%;
- position: absolute;
- }
-
- /* Background image an color divs*/
-
- .bg-img , .bg-color {
- min-width: 50%;
- vertical-align: top;
- padding: 0;
- margin-left: 0;
- height: 100%;
- background-color: #CAF0D3;
- display: inline-block;
- overflow: hidden;
- }
-
- .bg-color {
- margin-left: -5px;
- }
-
- .bg-img {
- background-image: url(/static/bg-image.jpeg);
- background-size: cover;
- }
-
- #login{
- padding-top: 10%;
- text-align: center;
- text-transform: uppercase;
- }
-
-
- .login {
- width: 100%;
- height: 500px;
- background-color: #fff;
- padding: 15px;
- padding-top: 30px;
- }
-
- .login h1 {
- margin-top: 30px;
- font-weight: bold;
- font-size: 60px;
- letter-spacing: 3px;
- }
-
- .login form {
- max-width: 420px;
- margin: 30px auto;
- }
-
- .login .btn {
- border-radius: 50px;
- text-transform: uppercase;
- font-weight: bold;
- letter-spacing: 2px;
- font-size: 20px;
- padding: 14px;
- background-color: #00B72E;
- }
-
- .form-group input {
- font-size: 20px;
- font-weight: lighter;
- border: none;
- background-color: #F0F0F0;
- color: #465347!important;
- padding: 26px 30px;
- border-radius: 50px;
- transition : 0.2s;
- }
-
-
-
-
- /* Form check styles*/
-
- .form-check {
- padding: 0;
- text-align: left;
- }
-
- .form-check label {
- vertical-align: top;
- padding-top: 5px;
- padding-left: 5px;
- font-size: 15px;
- color: #606060;
- font-size: 14px;
- }
-
- .forgot-password {
- text-align: right;
- float: right;
- font-weight: bold;
- }
-
- .forgot-password a {
- color: #00B72E;
- opacity: 0.6;
- }
-
- .forgot-password a:hover {
- opacity: 1;
- }
-
-
- /* Switch styles */
-
- .switch {
- position: relative;
- display: inline-block;
- width: 60px;
- height: 30px;
- }
-
- /* Hide default HTML checkbox */
- .switch input {display:none;}
-
- /* The slider */
- .slider {
- position: absolute;
- cursor: pointer;
- top: 0;
- left: 0;
- right: 0;
- bottom: 0;
- background-color: #F0F0F0;
- -webkit-transition: .4s;
- transition: .4s;
- border-radius: 30px;
- }
-
- .slider:before {
- position: absolute;
- content: "";
- height: 22px;
- width: 22px;
- left: 4px;
- bottom: 4px;
- background-color: white;
- -webkit-transition: .4s;
- transition: .4s;
- border-radius: 50%;
- }
-
- input:checked + .slider {
- background-color: #00B72E;
- }
-
- input:focus + .slider {
- box-shadow: 0 0 1px #00B72E;
- }
-
- input:checked + .slider:before {
- -webkit-transform: translateX(30px);
- -ms-transform: translateX(30px);
- transform: translateX(30px);
- }
-
-
-
- /* Media queries */
-
- @media(max-width: 500px) {
- .bg-img , .bg-color {
- min-width: 100%;
- height: 50%;
- margin: 0;
- }
-
- .forgot-password {
- text-align: right;
- float: left;
- padding: 20px 0;
- }
-
-
- #login {
- padding-top: 50px;
- }
-
- }
|