/*
  CORE
*/

html {
  font-family: sans-serif;
  font-size: 14px;
  line-height: 1;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}
body, header, footer, main, section, div,
h1, h2, h3, h4, h5, h6, p, span, a,
blockquote, q, pre, code, ol, ul, li,
form, label, input, textarea, button,
table, tr, th, td, dl, dt, dd, hr {
  margin: 0;
  padding: 0;
  border: 0;
  font: inherit;
  font-size: 100%;
  line-height: inherit;
  vertical-align: baseline;
  background: transparent;
}
article, aside, details, figcaption, figure,
footer, header, main, menu, nav, section, summary {
  display: block;
}
ol, ul {
  list-style: none;
}
hr {
  border-bottom: 1px solid #000;
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: middle;
  border-style: none;
}
a, a:hover {
  color: #000;
  text-decoration: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
  content: '';
  content: none;
}
[type='color'],
[type='date'],
[type='datetime-local'],
[type='email'],
[type='month'],
[type='number'],
[type='password'],
[type='search'],
[type='tel'],
[type='text'],
[type='time'],
[type='url'],
[type='week'],
textarea {
  display: block;
  width: 100%;
  max-width: 100%;
  border: 1px solid #000;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
}
::-webkit-input-placeholder { color: #777; }
:-moz-placeholder { color: #777; }
::-moz-placeholder { color: #777; opacity: 1; }
:-ms-input-placeholder { color: #777; }
[type='reset'],
[type='submit'],
[type='button'],
button {
  border: 1px solid #000;
  border-radius: 0;
  -webkit-appearance: none;
  -moz-appearance: none;
  cursor: pointer;
}
:focus {
  outline: none;
}
table {
  width: 100%;
}
table, tr, th, td {
  border: 1px solid #000;
  border-collapse: collapse;
  border-spacing: 0;
}
.clearfix:before, .clearfix:after {
  content: '';
  display: table;
}
.clearfix:after {
  clear: both;
}
.is--hidden {
  display: none;
}

/*
  GRID
*/

.xs { max-width: 32em; } /* 512px */
.sm { max-width: 48em; } /* 768px */
.md { max-width: 64em; } /* 1024px */
.lg { max-width: 80em; } /* 1280px */
.xl { max-width: 96em; } /* 1536px */

.row {
  margin: 0 auto;
}
.row:before, .row:after {
  content: '';
  display: table;
}
.row:after {
  clear: both;
}
.row.has--gutters {
  margin-left: -0.5em;
  margin-right: -0.5em;
}
.row.has--gutters > .col {
  padding-left: 0.5em;
  padding-right: 0.5em;
}
.col {
  float: left;
}
.xs-0 { display: none; }
.xs-1, .xs-2, .xs-3, .xs-4, .xs-5, .xs-6,
.xs-7, .xs-8, .xs-9, .xs-10, .xs-11, .xs-12 {
  display: inline-block;
}
.xs-1  { width: 8.3333%; }
.xs-2  { width: 16.6667%; }
.xs-3  { width: 25%; }
.xs-4  { width: 33.3333%; }
.xs-5  { width: 41.6667%; }
.xs-6  { width: 50%; }
.xs-7  { width: 58.3333%; }
.xs-8  { width: 66.6667%; }
.xs-9  { width: 75%; }
.xs-10 { width: 83.3333%; }
.xs-11 { width: 91.6667%; }
.xs-12 { width: 100%; }

@media screen and (min-width: 512px) {
  .sm-0 {
    display: none;
  }
  .sm-1, .sm-2, .sm-3, .sm-4, .sm-5, .sm-6,
  .sm-7, .sm-8, .sm-9, .sm-10, .sm-11, .sm-12 {
    display: inline-block;
  }
  .sm-1  { width: 8.3333%; }
  .sm-2  { width: 16.6667%; }
  .sm-3  { width: 25%; }
  .sm-4  { width: 33.3333%; }
  .sm-5  { width: 41.6667%; }
  .sm-6  { width: 50%; }
  .sm-7  { width: 58.3333%; }
  .sm-8  { width: 66.6667%; }
  .sm-9  { width: 75%; }
  .sm-10 { width: 83.3333%; }
  .sm-11 { width: 91.6667%; }
  .sm-12 { width: 100%; }
}

@media screen and (min-width: 769px) {
  .md-0 {
    display: none;
  }
  .md-1, .md-2, .md-3, .md-4, .md-5, .md-6,
  .md-7, .md-8, .md-9, .md-10, .md-11, .md-12 {
    display: inline-block;
  }
  .md-1  { width: 8.3333%; }
  .md-2  { width: 16.6667%; }
  .md-3  { width: 25%; }
  .md-4  { width: 33.3333%; }
  .md-5  { width: 41.6667%; }
  .md-6  { width: 50%; }
  .md-7  { width: 58.3333%; }
  .md-8  { width: 66.6667%; }
  .md-9  { width: 75%; }
  .md-10 { width: 83.3333%; }
  .md-11 { width: 91.6667%; }
  .md-12 { width: 100%; }
}

@media screen and (min-width: 1024px) {
  .lg-0 {
    display: none;
  }
  .lg-1, .lg-2, .lg-3, .lg-4, .lg-5, .lg-6,
  .lg-7, .lg-8, .lg-9, .lg-10, .lg-11, .lg-12 {
    display: inline-block;
  }
  .lg-1  { width: 8.3333%; }
  .lg-2  { width: 16.6667%; }
  .lg-3  { width: 25%; }
  .lg-4  { width: 33.3333%; }
  .lg-5  { width: 41.6667%; }
  .lg-6  { width: 50%; }
  .lg-7  { width: 58.3333%; }
  .lg-8  { width: 66.6667%; }
  .lg-9  { width: 75%; }
  .lg-10 { width: 83.3333%; }
  .lg-11 { width: 91.6667%; }
  .lg-12 { width: 100%; }
}

@media screen and (min-width: 1280px) {
  .xl-0 {
    display: none;
  }
  .xl-1, .xl-2, .xl-3, .xl-4, .xl-5, .xl-6,
  .xl-7, .xl-8, .xl-9, .xl-10, .xl-11, .xl-12 {
    display: inline-block;
  }
  .xl-1  { width: 8.3333%; }
  .xl-2  { width: 16.6667%; }
  .xl-3  { width: 25%; }
  .xl-4  { width: 33.3333%; }
  .xl-5  { width: 41.6667%; }
  .xl-6  { width: 50%; }
  .xl-7  { width: 58.3333%; }
  .xl-8  { width: 66.6667%; }
  .xl-9  { width: 75%; }
  .xl-10 { width: 83.3333%; }
  .xl-11 { width: 91.6667%; }
  .xl-12 { width: 100%; }
}