#hero-section {
  display: flex;
  flex-direction: column;
  min-height: 100vh; }

#hero-stamp h1 {
  font-family: "Raleway";
  font-size: 2.75em; }

#hero-stamp .subtitle {
  letter-spacing: 0.1em; }

h2, #hero-section p {
  font-family: "Montserrat"; }

#hero-nonsm {
  display: flex;
  flex-direction: column;
  justify-content: center;
  flex-grow: 1;
  padding-top: 15vh; }
  #hero-nonsm > div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; }

#hero-section > div {
  display: flex; }

#hero-buttons {
  margin-top: 4vh; }
  #hero-buttons .button {
    letter-spacing: 0.05em;
    font-size: 1.25em;
    padding: 0.8em;
    width: 13.5em;
    text-align: center; }
    #hero-buttons .button ~ .button {
      margin-top: 1.25em; }

section.section-normal {
  padding-top: 2em;
  padding-bottom: 2em; }
  section.section-normal h2 {
    text-align: center; }

#projects {
  text-align: center; }

#hero-socialmedia {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: var(--color-primary-light);
  padding-top: 1.5em;
  padding-bottom: 2.5em;
  align-self: end;
  width: 100%; }
  #hero-socialmedia h2 {
    font-weight: 500; }

#hero-socialmedia > #socialmedia-button-list {
  margin-top: 1.5em;
  list-style-type: none;
  display: inline-flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1em; }

.socialmedia-button > p {
  font-weight: 700; }

.socialmedia-button > a {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5em;
  border-radius: 0.3em;
  border: solid var(--color-grey-dark) 2px;
  padding: 0.5em;
  text-decoration: none;
  font-weight: 700; }
  .socialmedia-button > a i {
    font-size: 1.5em;
    line-height: 0.5em; }

#blog-posts {
  min-height: 100vh; }
  #blog-posts #blog-post-list {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-left: 2rem;
    padding-right: 2rem;
    margin-top: 1em; }
  #blog-posts li {
    display: flex;
    list-style-type: none; }
  #blog-posts .blog-post-card {
    display: flex;
    flex-grow: 1;
    border: 1px solid rgba(0, 0, 0, 0.25);
    border-radius: 0.5em;
    text-decoration: none;
    padding: 0.75em; }