#e8e8e8
1.card { 2 width: 200px; 3 height: 250px; 4 background: #07182E; 5 border-radius: 5px; 6 text-align: center; 7 color: #f0f0f0; 8 overflow: hidden; 9 font-family: inherit; 10 z-index: 1; 11} 12 13.img { 14 display: flex; 15 margin: 60px auto 10px auto; 16 width: 75px; 17 height: 75px; 18 border: 1px solid #f0f0f0; 19 border-radius: 50%; 20 font-size: 11px; 21 justify-content: center; 22 align-items: center; 23 transition: all 0.5s; 24 z-index: 99; 25 background-color: #152f50; 26} 27 28p { 29 opacity: 0; 30 transition: all 0.5s; 31} 32 33.heading { 34 padding: 10px; 35 font-weight: 500; 36 font-size: 18px; 37} 38 39svg { 40 padding: 0 5px; 41 cursor: pointer; 42} 43 44.card:hover .img { 45 transform: scale(1.1); 46 border: 1px solid #f0f0f0; 47} 48 49.card:hover h1, 50.card:hover p { 51 opacity: 1; 52}
4.3K views
4.3K views
Comments
MIT License