Card by alexreyes091
#e8e8e8
1.card { 2 width: 254px; 3 height: 190px; 4 transform: rotate(90deg); 5 background: #00BCD4; 6 box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px; 7 transition-duration: 1.5s; 8 transition-property: width, height,transform; 9} 10 11.card:hover { 12 width: 190px; 13 height: 254px; 14 transform: rotate(0deg); 15 /* -ms-transform:rotate(90deg); 16 -webkit-transform:rotate(90deg); */ 17} 18 19.card__content { 20 padding: 1rem; 21 font-size: smaller; 22} 23 24.card__date { 25 color: white; 26 margin-bottom: .5rem; 27 font-weight: 700; 28} 29 30.card__info { 31 width: 100%; 32 height: 200px; 33 padding: .7rem; 34 font-size: smaller; 35 border-radius: 1rem; 36 text-align: center; 37 background-color: #fae4c3; 38 color: #fae4c3; 39 transition-duration: 1s; 40 transition-property: color; 41} 42 43.card__info:hover { 44 color: #212121; 45} 46 47
2.2K views
2.2K views
MIT License