_banner.scss

.banner {
  background-color: $blue;
  color: #fff;
  background-position: right -100px;
  background-repeat: no-repeat;

  @include MQ(M) {
    background-image: url("../img/banner.jpg");
  }

  a {
    color: inherit;
  }

  & > div {
    @include outer-container;
    padding: $base-spacing;
  }

  h1,
  h2 {
    border-color: rgba(#fff, 0.2);
    margin-bottom: 0.2em;
  }

  input {
    color: $base-font-color;
  }

  .search-bar {
    margin-top: $small-spacing;
  }

  .breadcrumb {
    margin-bottom: $small-spacing;
    color: rgba(#fff, 0.9);

    li {
      display: inline-block;
      font-size: em(15);

      a {
        color: inherit;

        &:after {
          content: ' >';
          font-size: 0.7em;
          font-weight: bold;
          position: relative;
          top: -0.2em;
        }

        &:hover {
          color: #fff;
        }
      }
    }
  }

  .overview-list {
    li {
      background-color: rgba(#fff, 0.95);
      color: $blue;
      font-size: em(14);

      .number {
        background-color: $blue;
      }
    }
  }
}