/* Blog Single */

#blog-sidebar {
  width:25%;
}
#blog-content {
  width:75%;
}

#blog-hero {
  position: relative;
}
#blog-hero a {
  position: absolute;
  bottom: 1vw;
  right: 2vw;
  display: flex;
  align-items: center;
  text-decoration: none;
}
#blog-hero svg {
  margin-left:1vw;
}
#blog-hero img {
  height: auto;
}

#blog-sidebar #social .line:after {
  width:140%;
}

#blog-main h3 {
  font-size: 1.4vw;
  color: #212529;
  font-weight: 700;
  line-height: 1;
}

#blog-main h2 {
  font-size:1.4vw;
  color:var(--primary);
  margin:2rem 0 1rem;
}
#blog-main .wp-block-image {
  width:100%;
  height:auto;
}
#blog-main .wp-block-quote p {
  font-size:2.3vw;
  color:var(--primary);
  margin:4rem 0;
  text-align: center;
  font-weight:bold;
  line-height: 1;
}
#blog-main .wp-block-embed.is-type-video {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
  margin: 2rem 0;
}
#blog-main .wp-block-embed.is-type-video iframe, #blog-main .wp-block-embed__wrapper {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

#blog-footer .line:after {
  width:95%;
}
#blog-jump a {
  font-size: 0.8vw;
  width: fit-content;
  padding:0.5vw 1vw;
}

#commentform {
  display: flex;
  flex-wrap: wrap;
}
#commentform p {
  width: 50%;
  display: flex;
  flex-wrap: wrap;
}
#commentform p.comment-form-comment, #commentform #author, #commentform #email {
  width:100%;
}
#commentform #author, #commentform #email, #commentform textarea {
  border: none !important;
  background: transparent;
  outline: none !important;
  border-bottom: 1px solid var(--secondary) !important;
}
#commentform label, #commentform textarea {
  width:100%;
}
.comment-form-email {
  padding-left:20px;
}
#commentform textarea {
  height:100px;
  margin-bottom:25px;
}
#commentform .form-submit {
  margin-left:auto;
  justify-content: flex-end;
}

.commenter {
  color:#707070;
}
.commenter span {
  padding-right:1vw;
}
.comment {
  color:#4d4d4d;
  font-size:1.2vw;
}

@media (max-width:900px) {
  #blog-jump {
    margin:1rem 0 !important;
  }
  #blog-footer {
    width: 100%;
    padding-left: 0;
  }
  .comment {
    font-size: 3vw;
  }
}

@media (max-width:600px) {
  #blog-hero a {
    position: static;
    margin-top: 0.5rem;
    filter: brightness(0);
    justify-content: right;
    font-size: 3vw;
  }
  #blog-hero a svg {
    width:10vw;
  }
  #respond h3 {
    font-size: 6vw;
  }
}