Guest User

Untitled

a guest
Jan 27th, 2021
312
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. body {
  2. }
  3.  
  4. .profileimage {
  5. max-width: 35px;
  6. max-height: 35px;
  7. }
  8.  
  9. td, th {
  10. text-align:center;
  11. }
  12.  
  13. img {
  14. -webkit-user-drag: none;
  15. -khtml-user-drag: none;
  16. -moz-user-drag: none;
  17. -o-user-drag: none;
  18. user-drag: none;
  19. }
  20.  
  21. .error-message {
  22. color:red;
  23. }
  24. *{
  25. padding: 0;
  26. margin: 0;
  27. box-sizing: border-box;
  28. }
  29.  
  30. body{
  31. font-family: 'Poppins', sans-serif;
  32. overflow: scroll;
  33. }
  34.  
  35. .wave{
  36. position: fixed;
  37. bottom: 0;
  38. left: 0;
  39. height: 100%;
  40. z-index: -1;
  41. }
  42.  
  43.  
  44. .container{
  45. width: 100vw;
  46. height: 100vh;
  47. display: grid;
  48. grid-template-columns: repeat(2, 1fr);
  49. grid-gap :7rem;
  50. padding: 0 2rem;
  51. }
  52. .container_main{
  53. width: 100vw;
  54. height: 100vh;
  55. display: grid;
  56. grid-template-columns: repeat(2, 1fr);
  57. grid-gap :7rem;
  58. padding: 0 2rem;
  59. }
  60.  
  61. .container-forgot{
  62. width: 100vw;
  63. display: grid;
  64. grid-template-columns: repeat(2, 1fr);
  65. grid-gap :7rem;
  66. padding: 0 2rem;
  67. }
  68. .img{
  69. display: flex;
  70. justify-content: flex-end;
  71. align-items: center;
  72. }
  73.  
  74. .login-content{
  75. display: flex;
  76. justify-content: flex-start;
  77. align-items: center;
  78. text-align: center;
  79. }
  80.  
  81. .img img{
  82. width: 500px;
  83. }
  84.  
  85. form{
  86. width: 360px;
  87. }
  88.  
  89. .login-content img{
  90. height: 100px;
  91. }
  92.  
  93. .login-content h2{
  94. margin: 15px 0;
  95. color: #333;
  96. text-transform: uppercase;
  97. font-size: 2.9rem;
  98. }
  99.  
  100. .login-content .input-div{
  101. position: relative;
  102. display: grid;
  103. grid-template-columns: 7% 93%;
  104. margin: 25px 0;
  105. padding: 5px 0;
  106. border-bottom: 2px solid #d9d9d9;
  107. }
  108.  
  109. .login-content .input-div.one{
  110. margin-top: 0;
  111. }
  112.  
  113. .i{
  114. color: #d9d9d9;
  115. display: flex;
  116. justify-content: center;
  117. align-items: center;
  118. }
  119.  
  120. .i i{
  121. transition: .3s;
  122. }
  123.  
  124. .input-div > div{
  125. position: relative;
  126. height: 45px;
  127. }
  128.  
  129. .input-div > div > h5{
  130. position: absolute;
  131. left: 10px;
  132. top: 50%;
  133. transform: translateY(-50%);
  134. color: #999;
  135. font-size: 18px;
  136. transition: .3s;
  137. }
  138.  
  139. .input-div:before, .input-div:after{
  140. content: '';
  141. position: absolute;
  142. bottom: -2px;
  143. width: 0%;
  144. height: 2px;
  145. background-color: #38d39f;
  146. transition: .4s;
  147. }
  148.  
  149. .input-div:before{
  150. right: 50%;
  151. }
  152.  
  153. .input-div:after{
  154. left: 50%;
  155. }
  156.  
  157. .input-div.focus:before, .input-div.focus:after{
  158. width: 50%;
  159. }
  160.  
  161. .input-div.focus > div > h5{
  162. top: -5px;
  163. font-size: 15px;
  164. }
  165.  
  166. .input-div.focus > .i > i{
  167. color: #38d39f;
  168. }
  169.  
  170. .input-div > div > input{
  171. position: absolute;
  172. left: 0;
  173. top: 0;
  174. width: 100%;
  175. height: 100%;
  176. border: none;
  177. outline: none;
  178. background: none;
  179. padding: 0.5rem 0.7rem;
  180. font-size: 1.2rem;
  181. color: #555;
  182. font-family: 'poppins', sans-serif;
  183. }
  184.  
  185. .input-div.pass{
  186. margin-bottom: 4px;
  187. }
  188.  
  189. a{
  190. display: block;
  191. text-align: right;
  192. text-decoration: none;
  193. color: #999;
  194. font-size: 0.9rem;
  195. transition: .3s;
  196. }
  197.  
  198. a:hover{
  199. color: #38d39f;
  200. }
  201.  
  202. .btn{
  203. display: block;
  204. width: 100%;
  205. height: 50px;
  206. border-radius: 25px;
  207. outline: none;
  208. border: none;
  209. background-image: linear-gradient(to right, #32be8f, #38d39f, #32be8f);
  210. background-size: 200%;
  211. font-size: 1.2rem;
  212. color: #fff;
  213. font-family: 'Poppins', sans-serif;
  214. text-transform: uppercase;
  215. margin: 1rem 0;
  216. cursor: pointer;
  217. transition: .5s;
  218. }
  219. .btn:hover{
  220. background-position: right;
  221. }
  222.  
  223.  
  224. @media screen and (max-width: 1050px){
  225. .container{
  226. grid-gap: 5rem;
  227. }
  228. }
  229.  
  230. @media screen and (max-width: 1000px){
  231. form{
  232. width: 290px;
  233. }
  234.  
  235. .login-content h2{
  236. font-size: 2.4rem;
  237. margin: 8px 0;
  238. }
  239.  
  240. .img img{
  241. width: 400px;
  242. }
  243. }
  244.  
  245. @media screen and (max-width: 900px){
  246. .container{
  247. grid-template-columns: 1fr;
  248. }
  249.  
  250. .img{
  251. display: none;
  252. }
  253.  
  254. .wave{
  255. display: none;
  256. }
  257.  
  258. .login-content{
  259. justify-content: center;
  260. }
  261. }
  262. .vertical-center {
  263. /*Used to align all the things to the center*/
  264. min-height: 100%;
  265. /* Fallback for browsers do NOT support vh unit */
  266. min-height: 100vh;
  267. /* These two lines are counted as one :-) */
  268. display: flex;
  269. align-items: center;
  270. }
  271.  
  272. .error-message {
  273. color: red;
  274. }
  275.  
  276. .container {
  277. max-width: 50%;
  278. }
  279.  
  280. .login-container form {
  281. padding: 10%;
  282. }
  283.  
  284. .login-form {
  285. padding: 5%;
  286.  
  287. box-shadow: 0 5px 8px 0 rgba(0, 0, 0, 0.2), 0 9px 26px 0 rgba(0, 0, 0, 0.19);
  288. }
  289.  
  290. .login-form h3 {
  291. text-align: center;
  292. color: #333;
  293. }
  294.  
  295. .login-form h6 {
  296. text-align: center;
  297. color: #333;
  298. }
  299.  
  300. .login-form .ForgetPwd {
  301. color: #0062cc;
  302. font-weight: 600;
  303. text-decoration: none;
  304. }
  305. .container_main{
  306. width: 100vw;
  307. height: 100vh;
  308. display: grid;
  309. grid-template-columns: repeat(2, 1fr);
  310. grid-gap :7rem;
  311. padding: 0 2rem;
  312. }
  313.  
  314. .container-forgot{
  315. width: 100vw;
  316. display: grid;
  317. grid-template-columns: repeat(2, 1fr);
  318. grid-gap :7rem;
  319. padding: 0 2rem;
  320. }
RAW Paste Data