#blog-hello {
   position: relative;
   background: var(--tan);
}

#blog-tag-list {
   position: relative;
}

@media(min-width:46em) {
   .blog-tag-cloud {
      position: relative;
      margin: 0;
      max-width: 100%;
   }

   .blog-tags {
      margin-left: 3em;
      display: block;
      top: -1.5em;
      position: relative;
   }
}

#blog-search-link {
   position: absolute;
   bottom: -1em;
   right: 0;
   border-radius: 50%;
   padding: 1rem;
   background: var(--link);
   color: var(--yang) !important;
}

#blog-search-glass {
   transform: rotate(-45deg);
   position: absolute;
   left: .438em;
   top: 0;
   font-weight: 600;
   font-size: 1.25rem;
}

#blogsearch-controls {
   padding: 0 0 1.5em;
   background: var(--yin-yang-1);
}

/* blog-list! */

#blog-list-section {
   padding: 1.5em 0 3em;
}

#tag-current {
   margin: 0 0 1.5rem;
}

#blog-list {
   display: grid;
   gap: 1.5em;
   list-style-type: none;
}

.blog-list-title {
   margin-top: -2.188rem;
}

.blog-list-title span {
   display: inline;
   box-decoration-break: clone;
   -webkit-box-decoration-break: clone;
   background: var(--yin);
   color: var(--yang);
   padding: .25rem .5rem;
}

.blog-list-a {
   color: var(--text);
}

.blog-list-date {
   margin-top: 1.25rem;
   font-size: .875rem;
   color: var(--yin-yang-7);

}

@media(min-width:64em) {

   #blog-list {
      grid-template-columns: 1fr 1fr;
   }
}