.stories{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5em;margin-bottom:.9rem}.stories *{box-sizing:border-box}.story{position:relative;border-radius:.25em;overflow:hidden}.stories a:hover{color:#fff}.stories a:visited{color:#fff}.stories a:link{color:#fff}.stories a:active{color:#fff}.story:hover img{transform:scale(1.05)}.story:hover .storyName{transform:translate(0,0)}.story:hover .storyName .read{transform:translate(0,0)}.storyName{transform:translate(0,0)}.thumbimage img{width:100%;height:100%;object-fit:cover;transition:.2s ease;margin:0!important}.storyName{font-size:.9em;font-weight:700;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(to bottom,transparent 0,#000000a3 90%);color:#fff;position:absolute;padding:5em .75em .75em;width:100%;bottom:0;left:0;transition:.2s ease;transform:translate(0,2.3em);border-width:0}.storyName .read{margin-top:.25em;font-size:.85em;background:#000;color:#fff;padding:.5em 1.25em;height:2.25em;border-radius:.25em;width:100%;text-align:center;transition:.2s ease;transform:translate(0,1em)}.storyName .read:before{content:"Read"}.storyName .read.soon{opacity:.5;pointer-events:none}.storyName .read.soon::before{content:"Soon!"}.storyName .read:not(.soon):hover{color:#31c790}@media only screen and (max-width:600px){.stories{grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}}.storybox{height:20rem;overflow:auto;margin-bottom:.9rem;box-sizing:border-box;border:1px solid rgba(90,193,137,.5);padding:.6rem;border-radius:5px}.storytext{text-align:center;font-weight:700;font-style:italic}.storybox .stories{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));margin-bottom:0}.storybox .storyName{font-size:.8em}.storybox .storyheader{margin:.3rem 0;padding:0}