body {
  background-color: #212121;
  color: #c0c0c0;
  font-weight: lighter;
}

.off-canvas-menu {
  background-color: #0a4053;
}

main {
  background: #212121;
}

.overlay {
  background: rgba(0,0,0,0.8);
}

h2 {
  font-size: 2.5em;
  font-weight: normal;
  text-align: left;
  margin-bottom: 3em !important;
}

a {
  text-decoration: none;
  color:#817b62 !important;
}

a:hover {
  color:#00dcbf !important}

* {box-sizing: border-box;}


.result {
  grid-area: result;
  margin-bottom: 20px;
}
.tagdate {
  grid-area: tagdate;
  color: #103f54 !important;
}

.tag-list {
  display: grid;
  grid-column-gap: 20px;
  grid-template-areas: 
    "tagdate"
    "result";
}
@media (min-width: 500px) {
  .tag-list {
    grid-template-columns: 1fr 2fr;
    grid-template-areas: 
      "tagdate     result";
  }
  
}
@media (min-width: 700px) {
  .tag-list {
    grid-template-columns: 1fr 3fr;
    grid-template-areas: 
      "tagdate    result"
      "tagdate    result";
   }

   .tag-list {
    grid-gap: 50px;
   }
   
}