body a.bttn.four, button.bttn.four {
    color: var(--brand-color);
}
body a.bttn.four:hover, 
body a.bttn.four:active, 
body a.bttn.four:focus, 
button.bttn.four:hover, 
button.bttn.four:focus, 
button.bttn.four:active {
    color: var(--lightest);
}

@media (min-width: 767px) and (max-width: 1000px) {
.site-header #site-logo {
  grid-column: 1/6;
  padding-left: 1em;
}
}
@media (max-width: 767px) {
    .site-header #site-logo img {
        max-width: 100%;
    }
      .site-header #site-logo {
        grid-column: 2/9;
    }
}