Cacher is the code snippet organizer for pro developers

.container {
  max-width: 70em;
  margin-left: auto;
  margin-right: auto;
}
.container:after {
  content: " ";
  display: block;
  clear: both;
}

.primary {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}
@media (min-width: 32em) {
  .primary {
    width: 48.48485%;
    float: left;
    margin-right: 3.0303%;
  }
}
@media (min-width: 60em) {
  .primary {
    width: 65.30612%;
    float: left;
    margin-right: 2.04082%;
  }
}

.secondary {
  width: 100%;
  float: left;
  margin-left: 0;
  margin-right: 0;
}
@media (min-width: 32em) {
  .secondary {
    width: 48.48485%;
    float: right;
    margin-right: 0;
  }
}
@media (min-width: 60em) {
  .secondary {
    width: 32.65306%;
    float: right;
    margin-right: 0;
  }
}

// ----
// Sass (v3.4.7)
// Compass (v1.0.1)
// Breakpoint (v2.5.0)
// Susy (v2.1.3)
// ----

@import "breakpoint";
@import "susy";

$susy: (
  container: 70em,
  columns: 1,
  gutters: 1/16
);
$bp-medium: 32em;
$medium: (
  columns: 1 1
);
$bp-large: 60em;
$large: (
  columns: 2 1
);

.container {
  @include container;
}
.primary {
  @include span(1 at 1);
  @include susy-breakpoint($bp-medium, $medium) {
    @include span(1 at 1);
  }
  @include susy-breakpoint($bp-large, $large) {
    @include span(1 at 1);
  }
}
.secondary {
  @include span(1 at 1);
  @include susy-breakpoint($bp-medium, $medium) {
    @include span(1 at 2);
  }
  @include susy-breakpoint($bp-large, $large) {
    @include span(1 at 2);
  }
}