.login-page {
.card-login { border-radius: $border-radius-lg; padding-bottom: $padding-base-horizontal; .card-header { padding: 0 0 100px; overflow: hidden; img{ position: absolute; } .card-title{ position: relative; font-size: 5em; font-weight: 900; color: $black; text-transform: lowercase; margin-left: -5px; z-index: 1; &.pro{ text-transform: capitalize; } } .card-title-span{ position: relative; display: flex; justify-content: flex-end; width: 60%; align-items: flex-start; } } .btn-wd{ min-width: 180px; } .logo-container{ width: 65px; margin: 0 auto; margin-bottom: 55px; img{ width: 100%; } } .input-group:last-child{ margin-bottom: 40px; } &.card-plain{ @include input-coloured-bg($opacity-5, $white, $white, $transparent-bg, $opacity-1, $opacity-2); .input-group-addon, .form-group.no-border .input-group-addon, .input-group.no-border .input-group-addon{ color: $opacity-8; } } &.card-white{ background: $white; .card-header{ .card-title{ color: $white; } } @include form-control-placeholder(rgba($black,0.4), 1); .has-danger{ .form-control, .input-group-prepend .input-group-text{ border-color: $danger-states; } } .input-group-prepend .input-group-text{ border-color: rgba($black-states,0.2); color: $black-states; } .form-control{ color: $black; border-color: rgba($black-states,0.2); &:focus{ border-color: $primary; } } .form-group.no-border, .input-group.no-border{ .form-control, .form-control + .input-group-prepend .input-group-text, .form-control + .input-group-append .input-group-text, .input-group-prepend .input-group-text, .input-group-append .input-group-text{ background-color: $opacity-gray-3; &:focus, &:active, &:active{ background-color: $opacity-gray-5; } } .form-control{ &:focus{ & + .input-group-prepend .input-group-text, & + .input-group-append .input-group-text{ background-color: $transparent-bg; } } } } .input-group[disabled]{ .input-group-prepend .input-group-text, .input-group-append .input-group-text{ background-color: $black; } } .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control{ background: $light-gray; border-color: rgba($black-states,0.3); } .input-group-focus{ .input-group-prepend .input-group-text, .input-group-append .input-group-text, .form-control{ background-color: $white; border-color: $primary; } &.no-border{ .input-group-prepend .input-group-text, .input-group-append .input-group-text{ background-color: $opacity-gray-5; } } } .input-group-prepend .input-group-text { border-right: none; } .input-group-append .input-group-text { border-left: none; } .has-danger .form-control:focus, .has-success.input-group-focus .input-group-append .input-group-text, .has-success.input-group-focus .input-group-prepend .input-group-text { border-color: $danger-states; } .has-success .form-control:focus, .has-success.input-group-focus .input-group-append .input-group-text, .has-success.input-group-focus .input-group-prepend .input-group-text { border-color: darken($success, 10%); } } } .link{ font-size: 10px; text-decoration: none; } .card-black{ .link{ color: $white; } }
}
.full-page{
& > .content, & > .footer{ position: relative; z-index: 4; } & > .content{ padding-bottom: 150px; padding-top: 150px; @include media-breakpoint-down(xs){ &.signup-pro-fullpage{ padding-top: 0px; padding-bottom: 0px; } } } .footer{ position: absolute; width: 100%; bottom: 0; padding-left: 48px; padding-right: 48px; @include media-breakpoint-down(xs){ &.signup-pro-footer{ position: inherit; } &.signup-part-footer{ position: inherit; padding-top: 0px; } } .container{ color: $white; } } .full-page-background{ position: absolute; z-index: 1; height: 100%; width: 100%; display: block; top: 0; left: 0; background-size: cover; background-position: center center; } &.pricing-page{ .description{ margin-bottom: 65px; color: rgba($white,0.7); } } &.register-page{ .info-horizontal{ padding: 0px 0px 20px; } .info-horizontal{ text-align: left !important; .icon{ margin-top: 0; >i{ font-size: 2em; } &.icon-circle{ width: 65px; height: 65px; max-width: 65px; margin-top: 8px; i{ display: table; margin: 0 auto; line-height: 3.5; font-size: 1.9em; } } } .description{ overflow: hidden; .info-title{ margin-bottom: 20px; } } } } &.pricing-page, &.login-page, &.lock-page, &.register-page { min-height: 100vh; background: radial-gradient($background-black, $background-states-black); }
}
@include media-breakpoint-down(sm){
.landing-page .section-story-overview .image-container:nth-child(2) { margin-left: 0; margin-bottom: 30px; } .login-page .card-login .card-header img { width: 70%; position: absolute !important; margin-left: -33px !important; margin-top: -212px !important; border-radius: 20% !important; width: 350px !important; } .page-header{ flex-direction: column; }
}
@include media-breakpoint-down(xs){
.register-page .full-page >.content { padding-top: 50px; } .page-header{ .container h6.category-absolute{ width: 90%; } }
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
.pricing-page, .register-page, .login-page, .lock-page { .navbar .navbar-toggle .navbar-toggler{ display: none; } }
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) {
.register-page .full-page .content { .card-register { margin-top: 3rem!important; } }
}
@include media-breakpoint-down(md){
.lock-page, .login-page, .pricing-page, .register-page { .navbar { .navbar-wrapper .navbar-toggle { display: none !important; } } }
}