2K views
1.card { 2 display: flex; 3 flex-direction: column; 4 align-items: center; 5 justify-content: space-around; 6 width: 260px; 7 padding: 20px 1px; 8 margin: 10px 0; 9 text-align: center; 10 position: relative; 11 cursor: pointer; 12 box-shadow: 0 10px 15px -3px rgba(33,150,243,.4),0 4px 6px -4px rgba(33,150,243,.4); 13 border-radius: 10px; 14 background-color: #6B6ECC; 15 background: linear-gradient(45deg, #04051dea 0%, #2b566e 100%); 16} 17 18.content { 19 padding: 20px; 20} 21 22.content .price { 23 color: white; 24 font-weight: 800; 25 font-size: 50px; 26 text-shadow: 0px 0px 10px rgba(0, 0, 0, 0.42); 27} 28 29.content .description { 30 color: rgba(255, 255, 255, 0.6); 31 margin-top: 10px; 32 font-size: 14px; 33} 34 35.content .title { 36 font-weight: 800; 37 text-transform: uppercase; 38 color: rgba(255, 255, 255, 0.64); 39 margin-top: 10px; 40 font-size: 25px; 41 letter-spacing: 1px; 42} 43 44button { 45 -webkit-user-select: none; 46 -moz-user-select: none; 47 user-select: none; 48 border: none; 49 outline: none; 50 color: rgb(255 255 255); 51 text-transform: uppercase; 52 font-weight: 700; 53 font-size: .75rem; 54 padding: 0.75rem 1.5rem; 55 background-color: rgb(33 150 243); 56 border-radius: 0.5rem; 57 width: 90%; 58 text-shadow: 0px 4px 18px #2c3442; 59} 60 61
MIT License