/* @group Reset */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block;
}
blockquote, q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
td {
  vertical-align: top;
}
pre, code, kbd, samp {
  font-family: monospace, sans-serif;
}

/* @end Reset */

/* @group Global */

html {
  -webkit-text-size-adjust: 100%;
  border-top: 6px solid #7EAE01;
}
body {
  color: #ccc;
  background-color: #353535;
  background-image: url('data:image/png;base64,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');
  background-position: 0 0;
  background-repeat: repeat;
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
  font-size: 87.5%;
  font-size: 0.875rem;
  line-height: 1.4;
  padding: 0 1em;
  max-width: 45em;
  margin: 0 auto;
}
@media all and (min-width: 45em) {
  body {
    max-width: 110em;
  }
}
::-moz-selection {
  background: rgba(136, 187, 0, 0.15);
}
::selection {
  background:rgba(136, 187, 0, 0.15);
}
a {
  font-weight: bold;
  color: #0cf;
  text-decoration: none;
}
a:link {
  -webkit-tap-highlight-color: #16C;
}
a:visited {
  color: #0cf;
}
a:hover,
a:focus {
  color: #09C;
}
img, video, object, iframe {
  max-width: 100%;
}
strong, th {
  font-weight: bold;
}
b {
  font-weight: normal;
  color: #7EAE01;
}
p {
  margin: 1em 0;
}
audio {
  margin: 1em 0;
}
h1 {
  font-weight: normal;
  color: #fff;
}
h2, h3, h4, h5, h6 {
  font-weight: normal;
  color: #7EAE01;
}

/* @end Global */

/* @group typographic scale */

.double-great-primer {
  font-size: 31px; font-size: 1.9375rem;
  line-height: 1;
}
.double-pica {
  font-size: 24px; font-size: 1.5rem;
}
.double-small-pica {
  font-size: 19px; font-size: 1.1875rem;
}
.great-primer {
  font-size: 17px; font-size: 1.0625rem;
}
.augustin {
  font-size: 14px; font-size: 0.875rem;
}
.pica {
  font-size: 12px; font-size: 0.75rem;
}

/* @end typographic scale */

/* @group Classes */

/* @group button */

.button {
  display: inline-block;
  font-family: inherit;
  background-color: #f63;
  color: #fff;
  padding: 0.25em 1em;
  border-radius: 0.2em;
  border-bottom: 1px solid #c00;
  border-top: 1px solid #f96;
  border-left: none;
  border-right: none;
  cursor: pointer;
}
.button:hover,
.button:focus {
  color: #fff;
  background-color: #f74;
}
a.button:link,
a.button:visited {
  color: #fff;
  background-color: #f63;
}
a.button:active {
  color: #fff;
  background-color: #c30;
  border-top: 1px solid #c00;
  border-bottom: 1px solid #c00;

}

/* @end button */

/* @group toggle */

.toggle {
  display: inline-block;
  position: relative;
  line-height: 1.75;
}
.toggle input {
  position: absolute;
  z-index: 1;
  top: auto;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}
.toggle input + label {
  margin-left: 4.4em;
  cursor: pointer;
  font-weight: bold;
  color: #0cf;
}
.toggle input:focus + label,
.toggle input + label:hover {
  color: #09C;
}
.toggle input + label::before {
  content: '';
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  background-color: #999;
  display: inline-block;
  height: 1.25em;
  width: 1.25em;
  border-radius: 1.25em;
  padding: 0.2em 2em 0.2em 0.2em;
  transition: background-color 0.1s;
}
.toggle input:focus + label::before {
  box-shadow: 0 0 0.1em 0.1em #09c;
}
.toggle input + label::after {
  content: '';
  position: absolute;
  z-index: 3;
  top: 0.2em;
  left: 0.2em;
  height: 1.25em;
  width: 1.25em;
  background-color: #fff;
  border-radius: 1.25em;
  transition: transform 0.1s;
}
.toggle input:checked + label::before {
  background-color: #7EAE01;
}
.toggle input:checked + label::after {
  transform: translateX(1.8em);
}

/* @end toggle */

/* @group sparkline */

.sparkline {
  display: inline-block;
  border-radius: 4px;
  border-top: 1px solid #000;
  border-left: 1px solid #000;
}
.sparked {
  display: inline-block;
  padding-right: 120px;
  position: relative;
}
.sparked .sparkline {
  position: absolute;
  right: 0;
  top: 0;
}

/* @end sparkline */


/* @group breadcrumbs */

.breadcrumbs {
  font-weight: bold;
  margin: 1em 0;
}
.breadcrumbs li {
  display: inline;
  background-image: url("../i/sprite.png");
  background-position: 100% 3px;
  background-repeat: no-repeat;
  padding-right: 13px;
  margin-right: 2px;
}
.breadcrumbs li:last-child {
  background-image: none;
}

/* @end breadcrumbs */

/* @group tags */

.tags {
  margin: 1em 0;
}
.tags ul {
  display: inline-block;
  margin-bottom: -0.5em;
}
.tags li {
  display: inline-block;
  margin-bottom: 0.5em;
}
.tags li a {
  text-transform: uppercase;
  display: block;
  background: #3f3f3f;
  padding: 0.3em 0.5em 0.2em;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -o-border-radius: 3px;
  border-radius: 3px;
}

/* @end tags */

/* @group social links */

.social li {
  list-style: none;
  margin-bottom: 0.4em;
}
.social li a {
  display: inline-block;
  padding-left: 22px;
  background-image: url("../i/sprite.png");
  background-position: 1px -98px;
  background-repeat: no-repeat;
}
.social .twitter a {
  background-position: 0 -45px;
}
.social .slides a {
  background-position: 0 -150px;
}
.social .transcript a {
  background-position: 0 -200px;
}
.social .huffduffer a {
  background-position: 1em -255px;
  padding-left: 4.4em;
}
.social .download a {
  background-position: 1em -298px;
  padding-left: 4.4em;
}

/* @end social links*/

/* @group tabs */

.tabs {
  background: #272727;
  background-color: rgba(0,0,0,0.25);
  list-style: none;
  width: 100%;
  overflow: hidden;
}
.tabs li {
  width: 50%;
  float: left;
}
.tabs li a {
  display: block;
  padding: 0.25em 1em;
}
.tabs .selected {
  background-color: #525252;
  color: #fff;
}
.covered {
  display: none;
}
@media all and (min-width: 45em) {
  .tabs {
    display: none;
  }
  .covered {
    display: block;
  }
}

/* @end tabs */

/* @group stamped list */

.stamped {
  list-style: none;
  border-top: 1px solid #333;
}
.stamped a {
  color: #fff;
  background-color: #494949;
  border-bottom: 1px solid #333;
  display: block;
  font-weight: normal;
  padding: 0.5em 1em;
}
.stamped a[href] {
  background: -webkit-linear-gradient(#525252, #3e3e3e);
  background: -moz-linear-gradient(#525252, #3e3e3e);
  background: linear-gradient(#525252, #3e3e3e);
}
.stamped a[href]:hover,
.stamped a[href]:focus {
  background: #525252;
}
.stamped a b {
  font-size: 85%;
  display: inline-block;
  float: right;
  color: #7EAE01;
  border: 1px solid #999;
  border-radius: 50%;
  padding: 0.25em;
  margin-top: -0.3333em;
  min-width: 1.3333em;
  text-align: center;
}
@media screen and (min-width: 45em) {
  .stamped {
    border: none;
    float: left;
    margin-right: 3em;
  }
  .stamped a {
    display: inline-block;
    background: transparent;
    border: none;
    padding: 0.25em 0;
  }
  .stamped a[href] {
    color: #0cf;
    background: transparent;
  }
  .stamped a[href]:hover {
    background: transparent;
  color: #09C;
  }
  .stamped a b {
    float: none;
  }
}

/* @end stamped list */

/* @group session */

.session {
  background: #272727;
  background-color: rgba(0,0,0,0.25);
  border: 1px solid #494949;
  padding: 1em;
  margin: 0 -1em 1em;
  overflow: hidden;
}
.session .vcard small {
  display: block;
  margin-bottom: 1em;
}
@media screen and (min-width: 45em) {
  .session {
    margin: 0 0 1em;
  }
  .session .description {
    width: 66%;
    float: right;
  }
  .session .author {
    width: 30%;
    float: left;
  }
}

/* @group preview */

.preview .fn {
  color: #999;
  text-transform: uppercase;
}

@media screen and (min-width: 30em) and (max-width: 45em) {
  .preview .photo {
  	width: 66%;
  	float: left;
  }
  .preview .details,
  .preview .tags {
  	width: 30%;
  	float: right;
  }
}

/* @group featured */

.featured .preview {
  position: relative;
}
.featured .preview .photo {
  width: 100%;
  float: none;
}
.featured .preview .details {
  width: 100%;
  float: none;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 1em 0;
  min-height: 4em;
  background-color: rgba(0,0,0,0.6);
}
.featured .preview .details div {
  padding: 0 1em;
}

/* @end featured */

/* @end preview */

/* @end session */

/* @end Classes */

/* @group Structure */

.logo {
  margin: 1em 0;
}
.browse {
  margin: 0 -1em 1em;
}
.browse h2 {
  margin-left: 1rem;
}

/* @group footer */

.footer {
  clear: both;
  color: #666;
  background: #FFF;
  overflow: hidden;
  padding: 1em;
  margin: 4em -1em 0;
}
.footer strong {
  color: #7EAE01;
}
.footer .logo {
  float: right;
  width: 38%;
  max-width: 160px;
}
.footer small {
  color: #999;
  clear: both;
}

/* @end footer */

@media screen and (min-width: 45em) {
  [role="main"] {
    position: relative;
  }
  [role="main"] .subscribe {
    position: absolute;
    top: 0;
    right: 3px;
  }
  .header,
  .browse {
    overflow: hidden;
    clear: both;
  }
  .logo {
    float: left;
    margin-right: 3em;
  }
  .browse {
    margin: 0 0 1em;
  }
  .browse h2 {
    margin-left: 0;
  }
  .home .browse {
    overflow: hidden;
    width: auto;
    float: none;
  }
  .home #years {
    width: 10%;
    float: left;
  }
  .home #categories {
    width: 70%;
    float: right;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    -ms-column-count: 3;
    -o-column-count: 3;
    column-count: 3;
  }

/* @group sessions */

  .sessions {
    overflow: hidden;
    clear: both;
  }
  .sessions .preview {
    width: 32%;
    float: left;
  padding-left: 2%;
  }
  .sessions .preview:nth-child(3n+1) {
  padding-left: 0;
    clear: left;
  }
  .sessions .preview .session {
    min-height: 25em;
  }

/* @group featured */

  .featured .preview:first-child {
    font-size: 16px;
    font-size: 1rem;
    width: 50%;
    float: left;
  }
  .featured .preview:nth-child(n+2) {
    font-size: 13px;
    font-size: 0.8125rem;
    width: 23%;
    float: left;
    margin-left: 2%;
    margin-bottom: 2.75%;
  }
  .featured .preview:nth-child(n+4) {
    margin-bottom: 0;
  }
  .featured .preview:nth-child(3n),
  .featured .preview:nth-child(5n) {
    float: right;
  }
  .featured .preview .photo {
    float: left;
  }

/* @end featured */

/* @end sessions */

}

@media screen and (min-width: 45em) and (max-width: 60em) {
  .browse {
    overflow: hidden;
  }
  #years {
    width: 10%;
    float: left;
  }
  #categories {
    width: 75%;
    float: right;
    -webkit-column-count: 3;
    -moz-column-count: 3;
    -ms-column-count: 3;
    -o-column-count: 3;
    column-count: 3;
  }
}

@media screen and (min-width: 60em) {
  body {
    position: relative;
  }
  [role="main"] {
  	width: 77%;
  	float: right;
  }
  .browse {
    clear: none;
  	width: 23%;
  	float: left;
  }
  .blurb {
    position: absolute;
    top: 1.5em;
    right: 0.5em;
    width: 50%;
  }
}

/* @end Structure */
