/**
 * KCStar Project Base CSS file
 * created 2016-06-13
 */

@font-face {
  font-family: "Lyon";
  src: url(./fonts/LyonTextWeb-Regular.woff) format('woff');
}

@font-face {
  font-family: "Lyon";
  font-weight: bold;
  src: url(./fonts/McClatchySerif-Demi.woff) format('woff');
}

@font-face {
  font-family: "McClatchy Sans";
  src: url(./fonts/McClatchySans-Regular.woff) format('woff');
}

@font-face {
  font-family: "McClatchy Sans";
  font-weight: bold;
  src: url(./fonts/McClatchySans-Semibold.woff) format('woff');
}

@font-face {
  font-family: "McClatchy Sans Cond";
  src: url(./fonts/McClatchySansCond-Semibold.woff) format('woff');
}

@font-face {
  font-family: "McClatchy Slab";
  src: url(./fonts/McClatchySlab-Regular.woff) format('woff');
}

@font-face {
  font-family: "McClatchy Slab";
  font-weight: bold;
  src: url(./fonts/McClatchySlab-Semibold.woff) format('woff');
}

html, body {
  margin: 0;
  padding: 0;
  color: #212121;
  font-family: "Lyon", serif;
}

/**
 * Typography
 */

a {
  text-decoration: none;
  color: #0093d0;
}

.slab {
  font-family: "McClatchy Slab", Georgia, serif;
}

.sans {
  font-family: "McClatchy Sans", Helvetica, sans-serif;
}

.sans-cond {
  font-family: "McClatchy Sans Cond", "Helvetica Condensed", Helvetica, sans-serif;
}

.mono {
  font-family: monospace;
}

.uppercase {
  text-transform: uppercase;
}

.center-text {
  text-align: center;
}

.light {
  font-weight: 200;
}

.gray {
  color: #999;
}

.underline {
  border-bottom: 1px solid #999;
}

.uppercase {
  text-transform: uppercase;
}

.headline {
  font-size: 45px;
}

.headline a {
  color: inherit;
}

.kicker {
  display: block;
  margin: 0.25em 0;
  font-size: .8em;
  color: #999;
}

.summary {
  color: #999;
  font-size: 1.1em;
  line-height: 1.4em;
  font-family: "McClatchy Sans", Helvetica, sans-serif;
}

.action-link {
  display: block;
  margin: 1em 0;
  color: #0093d0;
  font-family: "McClatchy Sans Cond", "Helvetica Condensed", Helvetica, sans-serif;
  font-size: 1.5em;
  text-transform: uppercase;
}

.bio {
  font-size: .9em;
  font-style: italic;
}

/**
 * Layout
 */

section, article {
  position: relative;
  max-width: 100%;
  box-sizing: border-box;
  margin: 20px auto;
}

section {
  width: 900px;
}

article {
  width: 720px;
}

.cover {
  display: block;
  width: 1600px;
  max-width: 100%;
  margin: 0 auto;
}

.tight > *, .card > * {
  margin-top: 5px;
  margin-bottom: 5px;
}

.pad {
  box-sizing: border-box;
  padding: 10px;
}

.flush {
  margin-left: -10px;
  margin-right: -10px;
}

.max {
  display: block;
  max-width: 100%;
}

.card {
  display: block;
  color: inherit;
}

.card img {
  display: block;
  max-width: 100%;
  margin-bottom: 0.5em;
}

/**
 * Partials
 */

.toolbar {
  position: relative;
  background-color: #004B76;
  min-height: 64px;
  box-sizing: border-box;
  font-size: 28px;
  font-weight: normal;
  font-family: "McClatchySansCond", sans-serif;
}

.toolbar a {
  color: #212121;
}

.toolbar a[title] {
  color: white;
  margin-left: 5px;
}

social-media {
  display: block;
  margin: 1em 0;
}

social-media > * {
  display: block;
  padding-right: 8px;
}

/**
 * Mobile stuff
 */

@media (max-width: 600px) {
  .sm-block {
    display: block !important;
  }
}
