/*

  Header

============================================================================= */

#header {
  padding-top: 1rem;
  margin: 0 0 2rem;
}

/*

  Content

============================================================================= */

/*  Section: blog posts index
------------------------------------- */

.content section.posts {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

@media (max-width: 35.999rem) {
   .content section.posts {
      padding-top: 1rem;
    }
}

.content section.posts .col-1 {
  width: 1.5rem;
}

.content section.posts article.post {
  min-height: 95% !important;
  margin-top: 2rem;
  margin-bottom: 2rem;
  box-shadow: 1rem 1rem 1.5rem rgba(var(--color-shadow-rgba), 0.4);
}

.content section.posts article.post figure {
  position: relative;
  width: 100%;
  height: 12rem;
  overflow: hidden;
}

.content section.posts article.post figure img {
  position: absolute;
  margin: auto;
  width: 140%;
  min-height: 140%;
  min-width: 100%;
  top: -10%;
  left: -10%;
}

.content section.posts article.post .subtitle {
  color: var(--color-secondary);
  font-size: 0.8rem;
  line-height: 0.9rem;
  margin-top: 2rem;
}

.content section.posts article.post .title {
  color: var(--color-primary);
  font-size: 1.4rem;
  font-weight: 700;
  font-style: italic;
  margin-bottom: 2rem;
  line-height: 1.4rem;
}

.content section.posts article.post p {
  font-size: 0.8rem;
  font-weight: 500;
  line-height: 1rem;
  word-break: break-word;
}

.content section.posts article.post button {
  padding-top: 0.2rem;
  padding-bottom: 0.2rem;
}

.content section.posts article.post a.btn-1 {
  display: inline-block;
  margin-top: 1rem;
}