This post is saved as a draft.
#e8e8e8
1.card { 2 width: 245px; 3 height: 155px; 4 background: lightgrey; 5 position: relative; 6 border-radius: 15px; 7 overflow: hidden; 8} 9 10.foreground { 11 border-radius: 15px; 12 position: absolute; 13 width: 100%; 14 height: 100%; 15 background: rgba(255, 255, 255, 0.18); 16 box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); 17 backdrop-filter: blur(2.8px); 18 -webkit-backdrop-filter: blur(2.8px); 19 padding: 16px; 20 color: white; 21} 22 23.credit-card-header { 24 display: flex; 25 justify-content: space-between; 26} 27 28.credit-card-chip-container { 29 margin: 8px 0; 30 height: 40px; 31 width: 40px; 32} 33 34.chip { 35 width: 100%; 36 height: 100%; 37} 38 39.category, .bank { 40 font-size: smaller; 41} 42 43.info-container { 44 width: 100%; 45 display: flex; 46 flex-direction: column; 47 gap: 4px; 48} 49 50.names { 51 align-self: flex-end; 52 text-transform: uppercase; 53 font-size: smaller; 54} 55 56.serial { 57 align-self: flex-end; 58 letter-spacing: 2px; 59 font-size: 15px; 60 font-family: monospace; 61} 62 63.expire { 64 margin-left: 3px; 65 font-size: smaller; 66} 67
Variation of acard
Variation of acard