xxxxxxxxxx1
<!-- ######################################################################################################################### -->2
<!-- CONTENT LOGIN BLOCK -->3
<!-- ######################################################################################################################### -->4
<div class="zabackgroundDeco" id="zabackgroundDeco"></div>5
<div style="min-height: 20vh"></div>6
<div class="container my-5 py-5 z-depth-1 login_form">7
<div class="catextnet_logo"><img src="/img/v2/CatExt.net_White.png" width="125"></div>8
<!-- Rotating card -->9
<div class="card-wrapper">10
<div id="card-1" class="card card-rotating text-center z-depth-0">11
<!-- Front Side -->12
<div class="face front">13
<!-- Content -->14
<div class="card-body">15
<!--Section: Content-->16
<section class="px-md-5 mx-md-5 text-center text-lg-left dark-grey-text">17
<!--Grid row-->18
<div class="row d-flex justify-content-center">19
<!--Grid column-->20
<div class="col-md-9">21
<!-- Default form login -->22
<form name="sign_in" id="sign_in" data-rest='auth' class="needs-validation text-center" novalidate action="#!">23
<p class="h4 mb-4 text-white">Sign in</p>24
<!-- Email -->25
<div class='form-row' id='email-row'>26
<input type="email" id="email" class="form-control " placeholder="E-mail" required>27
<div class="invalid-feedback">Please provide a email</div>28
<div class='pb-2'> </div>29
</div>30
<!-- Password -->31
<div class='form-row' id='password-row'>32
<input type="password" id="password" class="form-control" placeholder="Password" required>33
<div class="invalid-feedback">Please provide a password</div>34
<div class='pb-2'> </div>35
</div>36
<div class='form-row'>37
<div class="d-flex justify-content-around">38
<div>39
<!-- Remember me -->40
<div class="custom-control custom-checkbox">41
<input type="checkbox" class="form-check-input" id="defaultLoginFormRemember" formnovalidate>42
<label class="form-check-label grey-text no_need_validation" for="defaultLoginFormRemember">Remember me</label>43
</div>44
</div>45
<div>46
<!-- Forgot password -->47
<a href="###" class="rotate-btn text-white-50 ml-5" data-card="card-1">Forgot password?</a>48
</div>49
</div>50
</div>51
52
<!-- Sign in button -->53
<button class="btn btn-info btn-block my-4" id="btn_signin" type="submit" disabled>Sign in</button>54
<!-- Register -->55
<p class="text-white-50">Not a member?56
<a href="#collapseSignUp" data-toggle="collapse" href="#collapseSignUp" class="collapsed" aria-expanded="false" aria-controls="collapseSignUp">Register</a>57
</p>58
<!-- Default form login -->59
</form>60
<!--Grid column-->61
</div>62
<!--Grid row-->63
</div>64
</section>65
<!--Section: Content-->66
</div>67
</div>68
<!-- Front Side -->69
<!-- Back Side -->70
<div class="face back">71
<div class="card-body">72
<!-- Content -->73
<!--Section: Content-->74
<section class="px-md-5 mx-md-5 text-center text-lg-left dark-grey-text">75
<!--Grid row-->76
<div class="row d-flex justify-content-center">77
<!--Grid column-->78
<div class="col-md-9">79
<!-- Default form login -->80
<form name="resetpwd" id="resetpwd" class="text-center" action="#!">81
<p class="h4 mb-4 text-white-50">Forgot your password</p>82
<!-- Email -->83
<div class="md-form">84
<label for="resetEmail">To recover your password, provide your email</label>85
<input type="email" id="resetEmail" class="form-control mb-4" placeholder="E-mail">86
<!-- button -->87
<button class="btn btn-info btn-block" type="submit">Recover</button>88
</div>89
<div class="d-flex left">90
<div>91
<a href="###" class="rotate-btn" data-card="card-1"><i class="fas fa-undo-alt text-white-50"></i> Back</a>92
</div>93
</div>94
</form>95
<!-- Default form login -->96
</div>97
<!--Grid column-->98
</div>99
<!--Grid row-->100
</section>101
<!--Section: Content-->102
</div>103
</div>104
<!-- Back Side -->105
</div>106
</div>107
<!-- Rotating card -->108
<div class="collapse-content">109
<div class="collapse" id="collapseSignUp">110
<!--Section: Content-->111
<section class="px-md-5 mx-md-5 text-center text-lg-left dark-grey-text">112
<!--Grid row-->113
<div class="row d-flex justify-content-center">114
<!--Grid column-->115
<div class="col-md-9">116
<!-- Default form register -->117
<form class="text-center" action="#!">118
<p class="h4 mb-4 mt-4 text-white">Sign up</p>119
<div class="form-row mb-4">120
<div class="col">121
<!-- First name -->122
<input type="text" id="defaultRegisterFormFirstName" class="form-control" placeholder="First name">123
</div>124
<div class="col">125
<!-- Last name -->126
<input type="text" id="defaultRegisterFormLastName" class="form-control" placeholder="Last name">127
</div>128
</div>129
<!-- E-mail -->130
<input type="email" id="defaultRegisterFormEmail" class="form-control mb-4" placeholder="E-mail">131
<!-- Password -->132
<input type="password" id="defaultRegisterFormPassword" class="form-control" placeholder="Password"133
aria-describedby="defaultRegisterFormPasswordHelpBlock">134
<small id="defaultRegisterFormPasswordHelpBlock" class="form-text text-muted mb-4">135
At least 8 characters and 1 digit136
</small>137
<!-- Phone number -->138
<input type="number" id="defaultRegisterPhonePassword" class="form-control" placeholder="Phone number"139
aria-describedby="defaultRegisterFormPhoneHelpBlock">140
<small id="defaultRegisterFormPhoneHelpBlock" class="form-text text-muted mb-4">141
Optional - for two step authentication142
</small>143
<!-- Sign up button -->144
<button class="btn btn-info my-4 btn-block" type="submit">Sign up</button>145
<!-- Terms of service -->146
<p>By clicking147
<em>Sign up</em> you agree to our148
<a href="" target="_blank">terms of service</a>149
</form>150
<!-- Default form register -->151
</div>152
<!--Grid column-->153
</div>154
<!--Grid row-->155
</section>156
<!--Section: Content-->157
</div>158
</div>159
</div>xxxxxxxxxx1
header {2
position: fixed;3
top: 0;4
left: 0;5
#background: #760606;6
background: #ffffff;7
width: 100%;8
z-index: 5;9
}10
.dashIco{11
padding-left: 15px;12
padding-top: 2px;13
}14
body{15
}16
17
/* this Base adjust18
##################################################@19
*/20
header .container-fluid{21
padding: 0;22
}23
input{24
font-family: Roboto, sans-serif;25
font-size: 14px !important;26
}27
.secondary-color{28
background-color: #760606 !important;29
}30
.zabackgroundDeco{31
height: 100vh;32
width: 100%;33
background: url("../img/v2/default_background.png");34
background-size: initial; /* <------ contain cover*/35
background-position:center,bottom;36
background-repeat: repeat;37
position: absolute;38
bottom: 0px;39
z-index: 0;40
opacity: 0.36;41
}42
/* webkit extra margin fix*/43
@media screen and (-webkit-min-device-pixel-ratio:0) {44
button {margin: 0px}45
}46
47
/* this for USER INFOS48
##################################################@49
*/50
.user_box .user_info{51
text-align: center;52
}53
.user_box .user_info p{54
text-align: center;55
margin-bottom: 5px;56
}57
.user_box .card-body{58
padding: 5px;59
}60
/* user box */61
.user_box {float:right;background:#fff;border:1px solid #dcdcdc;line-height:1.2;font-size:11px;min-width: 250px}62
.user_box .user_avatar {float:left;padding:6px 0 4px 6px}63
.user_box .user_info {padding:4px 0 4px 10px;float:left}64
.user_box .user_info p {font-size:11px}65
.user_box a {font-size:10px}66
.user_box a.sep {border-right:1px solid #e8e8e8;margin-right:3px;padding-right:6px}67
.user_box .user_sep {border-left:1px dashed #dcdcdc;margin-left:14px}68
69
html, body {}70
*, *::after, *::before {71
box-sizing: border-box;72
}73
html{74
height: 100vh;font-family:'Kabel', sans-serif;75
}76
body {77
height: 100%;78
width: 100%;79
-webkit-font-smoothing: antialiased;80
-moz-osx-font-smoothing: grayscale;81
font:100 13px/1.4 "Kabel", sans-serif;82
color:#222;83
}84
.login_form {85
max-width: 720px !important;86
min-height: 480px;87
z-index: 10;88
position: relative;89
background: linear-gradient(45deg, #071421, #0e2337, #133250, #1E4C79, #20578d);90
background-size: 250% 250%;91
}92
.pinaas{93
height: 100vh;94
}95
96
@-webkit-keyframes gradient {97
0%{background-position:0% 50%}98
50%{background-position:100% 50%}99
100%{background-position:0% 50%}100
}101
@-moz-keyframes gradient {102
0%{background-position:0% 50%}103
50%{background-position:100% 50%}104
100%{background-position:0% 50%}105
}106
@keyframes gradient {107
0%{background-position:0% 50%}108
50%{background-position:100% 50%}109
100%{background-position:0% 50%}110
}111
.catextnet_logo{112
position: absolute;113
top:25px;114
left: 25px;115
}116
@media (max-width: 767px){117
.catextnet_logo{118
top:-105px;119
left: calc(50% - 62px);120
}121
}122
.login_form .face, .login_form .card{123
background: transparent !important;124
border: none;125
}126
1
1
Console errors: 0