weathermen/soundstorm

.header {
  display: grid;
  grid-template-columns: 1fr 3fr 2fr;
  background: black;
}

.header__logo {
  font-size: 1.1em;
  padding: 5px;

  a {
    text-decoration: none;
    font-family: $logo-font;
    letter-spacing: 0.098em;
    text-transform: uppercase;
    font-weight: bold;
    transition: color 1300ms ease-in-out;

    &:hover {
      color: yellow;
    }
  }
}

.header__search {
  input {
    width: 100%;
    background: #111;
    border: 0;
    color: #FFF;
    height: 100%;
    padding: 5px;
  }
}

.header__navigation {
  text-align: right;
}