<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">
.blog {}

.blog .posts-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;}

  .blog .post-preview {
    flex: 0 0 33.333%;
    padding: 0 14px;}

  .blog .post-preview:first-child {
    padding-left: 0;}

  .blog .post-preview:nth-child(3n+3) {
    padding-right: 0;}
  
    .blog .post-preview-wrapper {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      justify-content: space-between;
      margin: 16px 0;}

      .blog .post-preview-wrapper &gt; .preview-image {
        width: 100%;
        max-height: 215px;
        overflow: hidden;
        margin-bottom: 10px;}

        .blog .post-preview-wrapper &gt; .preview-image img {
            width: 100%;}

        .blog .post-preview-wrapper &gt; .preview-image &gt; .image {
          flex-grow: 1;
          background-size: contain;
          background-repeat: no-repeat;}

          @media screen and (max-width: 900px) {
            .blog .post-preview-wrapper &gt; .preview-image &gt; .image {}          

            .blog .post-preview-wrapper &gt; .preview-meta {
              flex: 0 20%;
              display: flex;
              flex-direction: column;
              justify-content: space-between;}

              @media screen and (max-width: 900px) {
                .blog .post-preview-wrapper &gt; .preview-meta {
                  display: none;}}
          </pre></body></html>