---
---

@import 'toolkit/grid_layout';

#page-container {
  @extend %site-width-container;
}

.navigation {
  margin-bottom: 20px;
}

.section {
  margin-bottom: 20px;
}

h1 {
  padding: 20px 0;
}

h2 {
  margin-bottom: 10px;
}

.entry {
  margin-bottom: 10px;

  small {
    display: block;
    line-height: 1.3em;
  }
}

.grid-row {
  @extend %grid-row;

  .column-third {
    @include grid-column( 1/3 );
  }
}

.navigation {
  padding: 0;
  margin: 0 0 20px 0;

  li {
    list-style: none;
    padding: 0;
    display: inline-block;
    margin-right: 20px;
  }

  a.active {
    color: #333;
  }
}

---
---

@import 'toolkit/grid_layout';
@import 'toolkit/colours/palette';

#page-container {
  @extend %site-width-container;
}

.navigation {
  margin-bottom: 20px;
}

.section {
  margin-bottom: 20px;
}

h1 {
  padding: 20px 0;
}

h2 {
  margin-bottom: 10px;
}

.entry {
  margin-bottom: 10px;

  small {
    display: block;
    line-height: 1.3em;
  }
}

.grid-row {
  @extend %grid-row;

  .column-third {
    @include grid-column( 1/3 );
  }
}

.navigation {
  padding: 0;
  margin: 0 0 20px 0;

  li {
    list-style: none;
    padding: 0;
    display: inline-block;
    margin-right: 20px;
  }

  a.active {
    color: $text-colour;
  }
}

Use colour palette for colours
Use colour palette for colours

This keeps the pages a little more in line with the toolkit styles.
