Login-Form-Clean.css 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143
  1. .login-clean {
  2. background: transparent;
  3. padding: 80px 0;
  4. width: 500px;
  5. }
  6. .login-clean form {
  7. max-width: 360px;
  8. width: 90%;
  9. margin: 0 auto;
  10. margin-top: 30px;
  11. padding: 50px;
  12. border-radius: 20px;
  13. color: black;
  14. background-color: white;
  15. }
  16. .login-clean form .form-group .btn
  17. .p-0{
  18. padding : 0 !important;
  19. }
  20. .login-clean .illustration {
  21. text-align: center;
  22. padding: 0 0 20px;
  23. font-size: 60px;
  24. color: white;
  25. }
  26. .login-clean form .form-control {
  27. box-shadow: none;
  28. outline: none;
  29. /* color: black; */
  30. /* text-indent: 8px;
  31. height: 42px; */
  32. background-color: #F2F2F2;
  33. border-radius: 8px;
  34. font-size: 0.8rem;
  35. padding: 10px;
  36. border: none;
  37. }
  38. .login-clean form .form-control:focus {
  39. background-color: #F2F2F2;
  40. padding: 10px;
  41. }
  42. /*
  43. .login-clean form .btn-primary {
  44. background: #f4476b;
  45. border: none;
  46. border-radius: 4px;
  47. padding: 11px;
  48. box-shadow: none;
  49. margin-top: 26px;
  50. text-shadow: none;
  51. outline: none !important;
  52. }
  53. .login-clean form .btn-primary:hover, .login-clean form .btn-primary:active {
  54. background: #eb3b60;
  55. }
  56. .login-clean form .btn-primary:active {
  57. transform: translateY(1px);
  58. } */
  59. .login-clean form .forgot {
  60. display: block;
  61. text-align: right;
  62. font-size: 12px;
  63. color: white !important;
  64. opacity: 0.9;
  65. }
  66. .login-clean form .forgot:hover, .login-clean form .forgot:active {
  67. opacity: 1;
  68. text-decoration: none;
  69. }
  70. .login-clean form .form-group .btn{
  71. border-radius: 8px;
  72. background-color: #0A6E0A;
  73. border-color: #0A6E0A;
  74. }
  75. .login-clean form .form-group .btn:hover{
  76. background-color: #0A6E0A;
  77. border-color: #0A6E0A;
  78. }
  79. .bg-login-left{
  80. background-image: url(../img/login.png);
  81. background-position: left;
  82. background-repeat: no-repeat;
  83. background-size: contain;
  84. }
  85. .bg-login{
  86. background-image: url(../img/background.png);
  87. background-position: right;
  88. background-repeat: no-repeat;
  89. background-size: contain;
  90. }
  91. input.form-transparent {
  92. background: transparent;
  93. border-bottom: 1px solid gray;
  94. padding-left: 0;
  95. }
  96. input.form-transparent:focus {
  97. background: transparent;
  98. border-bottom: 1px solid white;
  99. padding-left: 0;
  100. }
  101. .ts-label{
  102. font-size: 14px;
  103. }
  104. .button-login {
  105. background-color: #ffff;
  106. }
  107. .reveal-password{
  108. position: absolute;
  109. top: 0;
  110. right: 0;
  111. transform: translate(50%,50%);
  112. margin-right: 15px;
  113. }
  114. .login-footer{
  115. position: absolute;
  116. bottom: 0;
  117. text-align: center;
  118. width: 100%;
  119. color: white;
  120. padding: 20px 0;
  121. }
  122. .remember-me{
  123. font-weight: 400;
  124. text-decoration: underline;
  125. }