.card{position:relative;padding:.75rem;border-radius:.1875rem;transition:all .4s ease-in-out}.card .card-header{display:grid;grid-template-columns:1fr;grid-template-rows:1fr}.card .card-header .card-pic{grid-row:1;grid-column:1;align-self:center;display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;overflow:hidden}.card .card-header .card-pic img{display:block;min-width:100%}.card .card-header .card-action{grid-row:1;grid-column:1;min-height:100%;align-self:center;display:flex;flex-flow:column nowrap;justify-content:center;align-items:center;padding:1rem;opacity:0;transition:all .4s ease-in-out}.card .card-header .card-action .text{text-align:center}.card .card-header .category{display:flex;flex-flow:row wrap;justify-self:flex-start;align-items:center;width:100%;padding:.375rem}.card .card-header .category .ico{font-size:.875rem;margin-right:.25rem}.card .card-header .card-icon{display:flex;justify-content:center;align-items:center;flex-direction:column;padding:.1875rem}.card .card-header .card-icon:after{content:"";display:flex;width:1.25rem;justify-content:center;border-bottom-width:.0625rem;border-bottom-style:solid;margin-top:1rem}.card .card-header .card-icon .ico{display:inline-flex;justify-content:center;align-items:center;border-radius:.375rem;font-size:2.375rem}.card:hover .card-header .card-action{opacity:1}.card.card-spaced{padding:1.25rem}.card-ribbon{position:absolute;left:0;top:0;z-index:1;overflow:hidden;width:4.6875rem;height:4.6875rem;text-align:right}.card-ribbon span{position:absolute;top:1.1875rem;left:-1.3125rem;display:block;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);width:6.25rem}