section{
    padding:2rem;
    margin: 0 auto;
    max-width: 800px;
    /* max-
    width: 1200px; */
 }

 h2 {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 1em;
  }

  h3 {
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: 1em;
  }

  ul {
    padding-top: 10px;
    padding-inline-start: 24px;
  }

  ol {
    padding-top: 10px;
    padding-inline-start: 24px;
  }

  .posts-container .box-container .box .post-content::after {
    content: '';
  }

  p {
    text-align: justify;
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .hljs {
  /* background: #f7f7f7; */
  border-radius: 10px;
  box-shadow: 1px 1px 1px 1px #888;
}

#bild {
  width: 80%;
  border-radius: 20px;
  display: block;
margin: auto;
padding-top: 10px;
padding-bottom: 10px;

}

figcaption{
  text-align: center;
}

.posts-container .box-container .box .post-cat{
  margin-top: 2rem;
}

.authors .box-container .box p {
  color: var(--black);
}

.autorbild {
  border-radius: 50%;
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 250px;
  margin-top: 18px;
margin-bottom: 18px;
border: 3px solid;
border-color:var(--main-color);;

}

/* P5js 
html, body {
  margin: 0;
  padding: 0;
}*/
canvas {
  display: block;
  z-index: -3;
}

/* P5js */

.emailbild {
  height: 20px;
  vertical-align: middle;
}


#svg2 {animation: svg2 5s 7s linear forwards,fill 2s 5s forwards}
@keyframes fill {to {fill: hsl(0, 65%, 45%);}} 

.svg2 {animation: svg2 5s 7s linear forwards,fill 2s 5s forwards}
@keyframes fill {to {fill: hsl(0, 100%, 37%);}} 

@keyframes fillColor {
  0% { fill: none; }
  100% { fill: red; }
}