.card-story-wrapper{display:grid;gap:10px;width:100%;max-height:200px;grid-template-columns:repeat(6, 150px);}
.card-story:hover{background:#ccc;border:1px solid #ccc;}
.card-story:hover > .card-img img{transform:scale(1.1);}
.card-story{width:100%;height:100%;position:relative;border-radius:10px;box-shadow:3px 3px 3px #ccc;border:1px solid #ddd;background-color:#fff;display:flex;flex-direction:column;justify-content:space-between;text-align:center;transition:.2s all;cursor:pointer;}
.card-story .card-img{border-top-left-radius:10px;border-top-right-radius:10px;overflow:hidden;height:70%;width:100%;}
.card-story .card-img img{width:100%;height:100%;object-fit:cover;transition:.2s all;}
.card-story .card-plus-button{width:40px;height:40px;background:#fff;position:absolute;bottom:30%;display:flex;justify-content:center;align-content:center;align-items:center;border-radius:50%;transform:translate(50px,20px);}
.card-story .card-plus-button span{font-size:2.4rem;color:#2a6ed4;}
.card-story .card-text{padding:10px;font-weight:900;}
.card-story .card-story-avatar{z-index:3;width:40px;height:40px;border-radius:50%;overflow:hidden;position:absolute;top:10px;left:10px;border:5px solid #2a6ed4;}
.card-story .card-story-image::after{content:' ';position:absolute;inset:0;width:100%;height:100%;background:rgba(0,0,0,.3);z-index:2;border-radius:10px;}
.card-story .card-story-avatar img{object-fit:cover;width:100%;height:100%;}
.card-story .card-story-image{position:absolute;inset:0;width:100%;height:100%;border-radius:10px;z-index:1;display:flex;justify-content:center;align-content:center;align-items:center;}
.card-story .card-story-image img{object-fit:cover;width:100%;height:100%;transition:all .2s;border-radius:10px;}
.card-story .card-story-info{position:absolute;bottom:10px;left:10px;z-index:3;color:#fff;}
.card-story{
    z-index:1;
}