Card by IWhat1
#e8e8e8
1.card-container { 2 width: 350px; 3 height: 440px; 4 background: transparent; 5 position: relative; 6} 7 8.container { 9 display: flex; 10 height: 100%; 11 width: 100%; 12 align-items: center; 13 justify-content: center; 14} 15 16.circle1 { 17 height: 80px; 18 width: 80px; 19 border-radius: 50%; 20 background-color: #2879f3; 21 position: absolute; 22 top: 0; 23 left: 0; 24} 25 26.circle2 { 27 height: 80px; 28 width: 80px; 29 border-radius: 50%; 30 background-color: #f37e10; 31 position: absolute; 32 right: 0; 33 bottom: 0; 34} 35 36.log-card { 37 font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; 38 position: absolute; 39 width: 300px; 40 border-radius: 8px; 41 display: flex; 42 flex-direction: column; 43 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); 44 backdrop-filter: blur(5px); 45 padding: 20px; 46} 47 48.heading { 49 font-size: 28px; 50 font-weight: 800; 51} 52 53.para { 54 font-size: 14px; 55 font-weight: 500; 56} 57 58.text { 59 margin-top: 15px; 60 margin-bottom: 0; 61 font-size: 14px; 62 font-weight: 600; 63 color: lightslategray; 64} 65 66.input-group { 67 margin-top: 10px; 68 margin-bottom: 4px; 69} 70 71.input { 72 box-sizing: border-box; 73 margin-bottom: 5px; 74 width: 100%; 75 border: none; 76 padding: 8px 16px; 77 background-color: transparent; 78 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4); 79 border-radius: 8px; 80 font-weight: 600; 81 color: #2879f3; 82} 83 84.input:hover { 85 color: #2879f3; 86 box-shadow: 0 2px 10px rgba(0, 0, 0, 0.4); 87} 88 89.password-group { 90 display: flex; 91 justify-content: space-between; 92 margin-top: 5px; 93} 94 95.checkbox-group { 96 color: black; 97 font-size: 14px; 98 font-weight: 500; 99} 100 101.forget-password { 102 font-size: 14px; 103 font-weight: 500; 104 color: #2879f3; 105 text-decoration: none; 106} 107 108.forget-password:hover { 109 text-decoration: underline; 110 color: #f37e10; 111} 112 113.btn { 114 margin-top: 20px; 115 margin-bottom: 10px; 116 padding: 8px 16px; 117 border: none; 118 background-color: #2879f3; 119 color: white; 120 font-size: 16px; 121 font-weight: 700; 122 border-radius: 8px; 123} 124 125.btn:hover { 126 background-color: #0653c7; 127} 128 129.no-account { 130 font-size: 16px; 131 font-weight: 400; 132} 133 134.link { 135 font-weight: 800; 136 color: #2879f3; 137} 138 139.link:hover { 140 color: #f37e10; 141 text-decoration: underline; 142}
1K views
1K views
MIT License