a {
  color: $link_color;
  &:hover, &:focus {
    color: saturate(darken($link_color, 15), 20); }
  &:visited {
    color: darken(adjust_hue($link_color, 70), 10);
  }
}

$min-width: 320px;
$max-width: 1440px;
$default-border-radius: 4px;

.group { @include pie-clearfix; }
.core-layout { > div { @extend .inner-wrap; } }

body {
  > header, > nav, > footer {
    @extend .core-layout;
    min-width: $min-width;
  }
}


@mixin media-layout($page-pad, $sidebar-width, $sidebar-pad) {
  $side-nav: $sidebar-width - $page-pad - $sidebar-pad;

  .inner-wrap {
    padding: 0 $page-pad;
    position: relative;
    margin: 0 auto;
    max-width: $max-width;
    @extend .group;
  }

  body > nav + div {
    @extend .group;
    padding: 0;
    max-width: $max-width + $page-pad*2;
    margin: 0 auto;
    > div {
      @extend .group;
      margin-right: $sidebar-width;
    }
  }
  body > nav > div > div { width: $side-nav;
    .search { width: $side-nav - 70px; }
  }

  #articles {
    float: left;
    width: 100%;
    padding-top: 25px;
    padding-bottom: 25px;
    > * {
      padding-right: $page-pad;
      padding-left: $page-pad;
    }
    > article {
      margin-bottom: 1.5em;
      padding-bottom: 1.5em;
      padding-right: $page-pad;
      padding-left: $page-pad;
    }
    + aside {
      display: block;
      float: left;
      width: $sidebar-width - $sidebar-pad*2;
      margin: 0 -100% 0 0;
      padding: 0 $sidebar-pad $sidebar-pad;
    }
  }
}

@media only screen and (min-width: 320px) {
  @import "../media/480";
}

@media only screen and (min-width: 768px) {
  @include media-layout(15px, 240px, 15px);
  @import "../media/768";
}

@media only screen and (min-width: 992px) {
  @include media-layout(40px, 320px, 30px);
  @import "../media/992";
}


//*{
    //transition: width .5s;
    //-moz-transition: width .5s;
    //-webkit-transition: margin .5s;
//}