article.blog-post { margin-bottom: 1rem; padding: 1.5rem; border: 1px solid #8882; border-radius: 4px; background-color: #ffffff08; transition: background-color .1s; text-decoration: none; cursor: pointer; } .blog-post h2:hover, .blog-post p:hover { background: none; } .blog-title { margin: 0; } .blog-title a { display: inherit; text-wrap: nowrap; text-overflow: ellipsis; overflow: hidden; } .blog-meta { margin: 0; } .blog-author { margin: 0; font-size: .8em; } .blog-author img { width: 1.3em; height: 1.3em; display: inline-block; transform: translate(0, 4px); border-radius: 4px; } .blog-date { margin: 0; font-size: .8em; opacity: .75; } .blog-description { margin: .5em 0 0 0; display: -webkit-box; font-size: .8em; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } #load-more { margin: 0 auto; padding: .5em 2em; display: block; font-family: inherit; font-size: inherit; } @media screen and (max-width: 1500px) { #blog-sidebar { display: none; } }