/* COLORS */
/* UNIT */
/* MODULAR SCALE
http://modularscale.com/scale/?px1=17&px2=64&ra1=1.618&ra2=0
*/
/* FIXES */
.clearfix, footer .wrap, .writing .callout, .speaker .callout, #home .works, .group {
  zoom: 1; }
  .clearfix:after, footer .wrap:after, .writing .callout:after, .speaker .callout:after, #home .works:after, .group:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0; }

/* MIXINS */
@font-face {
  font-family: 'icomoon';
  src: url("/v7/fonts/icomoon.eot");
  src: url("/v7/fonts/icomoon.eot?#iefix") format("embedded-opentype"), url("/v7/fonts/icomoon.woff") format("woff");
  font-weight: normal;
  font-style: normal; }

* {
  margin: 0;
  padding: 0; }

html {
  background: #484d58; }

body {
  background: #dfe4ea url(/v7/i/bg-w.jpg) no-repeat 50% 0;
  font-family: 'chrono-web', 'Helvetica Neue', Arial, sans-serif;
  color: #383838;
  font-size: 17px;
  line-height: 28px;
  margin: 0; }

b, strong, h1, h2, h3, h4, h5, h6 {
  font-weight: 700; }

p, img {
  margin: 0 0 1em 0; }

i, em {
  /*font-family: 'ChronoRegIt';*/
  font-weight: 400;
  font-style: italic; }

a {
  color: #000; }

a img {
  border: none; }

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

h1 {
  font-weight: 900;
  font-style: normal;
  font-size: 3.763em;
  line-height: 1em;
  margin: 0;
  text-align: center;
  text-transform: uppercase; }

h1 a {
  text-decoration: none; }

h2, h3, h4, h5, h6 {
  font-size: 17px;
  line-height: 28px; }

h2 {
  font-size: 27.506px;
  letter-spacing: -.04em;
  line-height: 39px;
  font-weight: normal; }

h3 {
  font-size: 22px; }

h4 {
  font-size: 22px;
  font-weight: normal; }

h5 {
  text-transform: uppercase; }

h6 {
  font-weight: normal;
  text-transform: uppercase; }

header {
  border-top: 6px solid rgba(94, 95, 97, 0.05);
  text-align: center;
  padding-bottom: 101.659px; }
  header h1 {
    display: none; }
  header #about {
    display: none; }
  header ul {
    width: 80%;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0 10%;
    display: block;
    list-style: none;
    text-align: center; }
    header ul li {
      border-left: 1px solid rgba(94, 95, 97, 0.3);
      display: block;
      float: left;
      margin: 0;
      min-height: 50px;
      padding: 0;
      text-align: left;
      width: 20%; }
    header ul a, header ul em {
      color: rgba(56, 56, 56, 0.3);
      display: block;
      /* font-family:'ChronoRegBold';font-weight: normal; */
      font-size: 20px;
      font-weight: 700;
      line-height: 22px;
      padding: 20px 5px 20px 10px;
      text-decoration: none;
      text-transform: uppercase;
      -webkit-transition-property: all;
      -moz-transition-property: all;
      -o-transition-property: all;
      transition-property: all;
      -webkit-transition-duration: 0.2s;
      -moz-transition-duration: 0.2s;
      -o-transition-duration: 0.2s;
      transition-duration: 0.2s;
      -webkit-transition-timing-function: ease-in;
      -moz-transition-timing-function: ease-in;
      -o-transition-timing-function: ease-in;
      transition-timing-function: ease-in; }
      header ul a p, header ul em p {
        -webkit-transition-property: all;
        -moz-transition-property: all;
        -o-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.2s;
        -moz-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s;
        -webkit-transition-timing-function: ease-in;
        -moz-transition-timing-function: ease-in;
        -o-transition-timing-function: ease-in;
        transition-timing-function: ease-in; }
      header ul a:hover, header ul em:hover {
        color: #383838; }
        header ul a:hover p, header ul em:hover p {
          color: rgba(56, 56, 56, 0.6); }
    header ul #nav-logo {
      width: 25%; }
      header ul #nav-logo span {
        display: inline; }
    header ul #nav-journal {
      width: 20%; }
    header ul #nav-work {
      width: 20%; }
    header ul #nav-about {
      width: 17%; }
    header ul #nav-contact {
      width: 17%; }
    header ul p {
      color: rgba(56, 56, 56, 0.3);
      font-weight: normal;
      font-size: 10.507px;
      margin: 0;
      padding: 0;
      line-height: 1;
      text-transform: none; }
    header ul span {
      display: block; }

#archives #nav-journal a,
#journal #nav-journal a,
#home #nav-logo a,
#work #nav-work a,
#about #nav-about a,
#contact #nav-contact a {
  color: #484d58;
  border-top: 6px solid rgba(255, 255, 255, 0.35);
  padding-top: 14px; }
#archives #nav-journal p,
#journal #nav-journal p,
#home #nav-logo p,
#work #nav-work p,
#about #nav-about p,
#contact #nav-contact p {
  color: rgba(56, 56, 56, 0.6); }

#content {
  width: 81.655172414%;
  max-width: 888px;
  margin: 0 auto;
  background: #e4e8ed;
  background: rgba(255, 255, 255, 0.2) url(/v7/i/c-bg-b.png) repeat-x left bottom;
  border: 10.5px solid #f2f4f7;
  -moz-box-shadow: 0 0 15px rgba(72, 77, 88, 0.05);
  -webkit-box-shadow: 0 0 15px rgba(72, 77, 88, 0.05);
  box-shadow: 0 0 15px rgba(72, 77, 88, 0.05);
  padding: 0 0 60px;
  position: relative; }

#home .content article, #journal .content article, #archives .content article {
  border-bottom: 1px solid rgba(94, 95, 97, 0.3);
  padding-bottom: 24px; }

#about img {
  margin-bottom: 24px; }

#about aside, #contact aside {
  color: #5e5f61;
  float: right;
  font-size: 14px;
  margin: 0 0 24px 24px;
  width: 25%; }
  #about aside blockquote, #contact aside blockquote {
    /*font-family: 'ChronoRegIt';*/
    font-weight: 400;
    font-style: italic;
    margin: 0;
    padding: 0; }
    #about aside blockquote p, #contact aside blockquote p {
      margin: 0; }
    #about aside blockquote:before, #contact aside blockquote:before {
      content: ""; }

.topper {
  text-transform: uppercase;
  text-align: center;
  color: #484d58;
  margin: 48px 7.327586207%;
  border-bottom: 1px solid rgba(56, 56, 56, 0.3);
  padding: 0 0 12px; }

article, .works {
  margin: 0 7.327586207%; }

article {
  margin: 63px 7.327586207% 0;
  padding: 0 0 0 0; }
  article h1 {
    color: #484d58;
    margin-bottom: 27.506px; }
    article h1 p {
      display: inline;
      text-indent: 0; }
  article .date {
    margin: -12px 0 24px;
    text-align: center;
    text-indent: 0; }
  article blockquote {
    color: rgba(94, 95, 97, 0.6);
    /*font-family: 'ChronoRegIt';*/
    font-weight: 400;
    font-style: italic;
    margin: 1em 0;
    padding-left: 24px;
    position: relative; }
    article blockquote p:before {
      color: rgba(94, 95, 97, 0.2);
      content: "\201C";
      font-size: 1em; }
    article blockquote p:after {
      color: rgba(94, 95, 97, 0.2);
      content: "\201C";
      font-size: 1em;
      display: inline; }
  article p {
    margin-bottom: 0;
    text-indent: 36px; }
  article h1 + p, article h2 + p, article h3 + p, article h4 + p, article h5 + p, article blockquote p:first-child, article ul + p, article aside + p, article .btw {
    text-indent: 0; }
  article p + h2, article p + h3, article p + h4, article p + h5, article img.full, article pre, article ul, article p + p img, article .btw {
    margin-top: 1em; }
  article pre, article ul {
    margin-bottom: 1em; }
  article code {
    color: rgba(94, 95, 97, 0.65);
    word-break: break-word; }
  article .left {
    float: left;
    margin: 0 24px 24px 0; }
  article .right {
    float: right;
    margin: 0 0 24px 24px; }
  article .btw {
    font-style: italic; }

.photo, #home .content .photo, #journal .content .photo, #archives .content .photo {
  margin: 0;
  border: none;
  padding-bottom: 0; }
  .photo .inner, #home .content .photo .inner, #journal .content .photo .inner, #archives .content .photo .inner {
    border-bottom: 1px solid rgba(94, 95, 97, 0.3);
    margin: 0 7.327586207%;
    padding-bottom: 24px; }
    .photo .inner p:first-of-type, #home .content .photo .inner p:first-of-type, #journal .content .photo .inner p:first-of-type, #archives .content .photo .inner p:first-of-type {
      text-indent: 0; }

#journal .post article, #journal .post .photo .inner, #home .content .photo, #journal .content .photo {
  border-bottom: none; }

.quote blockquote {
  font-size: 2em; }

#home .content article + .photo, #journal .content article + .photo {
  margin-top: 24px; }

#archives article ul {
  margin-bottom: 62.830px; }

.fluid-width-video-wrapper {
  margin: 1em 0; }

.prevnext {
  /*
  background: transparent url(/v7/i/g10.png) repeat-y 50% 0;
  */ }
  .prevnext:hover, .prevnext:focus {
    background-color: rgba(255, 255, 255, 0.2); }

.prevnext {
  border-top: 1px solid #282828;
  border-color: rgba(40, 40, 40, 0.1);
  position: absolute;
  bottom: 0px;
  left: 0;
  width: 100%; }

footer {
  background: #484d58;
  color: #d6d8da;
  color: rgba(255, 255, 255, 0.8);
  padding: 120px 0;
  margin-top: -78px; }
  footer .wrap {
    width: 80%;
    max-width: 798px;
    margin: 0 auto; }
  footer .bits {
    float: left;
    margin: 0 0 0 0;
    width: 69%; }
    footer .bits a {
      color: #fff; }
    footer .bits p {
      font-size: 17px; }
    footer .bits img {
      float: left;
      margin: 0 24px 24px 0; }
  footer .bobs {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    clear: both;
    padding: 12px 0 0 0;
    width: 100%; }
    footer .bobs p {
      font-size: 10.507px;
      text-align: center; }
    footer .bobs a {
      color: #fff; }
  footer .elsewhere {
    float: right;
    margin: 0 0 24px 0;
    width: 25%; }
    footer .elsewhere h1 {
      /*font-family:'ChronoRegBold';*/
      font-weight: 700;
      font-size: 20px;
      margin-bottom: 12px;
      text-align: left; }
    footer .elsewhere li {
      list-style: none;
      margin: 0 0 12px 0; }
    footer .elsewhere a {
      color: #fff;
      display: inline-block;
      line-height: 24px;
      text-decoration: none;
      padding-top: 3px; }
      footer .elsewhere a span {
        -webkit-transition-property: all;
        -moz-transition-property: all;
        -o-transition-property: all;
        transition-property: all;
        -webkit-transition-duration: 0.2s;
        -moz-transition-duration: 0.2s;
        -o-transition-duration: 0.2s;
        transition-duration: 0.2s;
        -webkit-transition-timing-function: ease-in;
        -moz-transition-timing-function: ease-in;
        -o-transition-timing-function: ease-in;
        transition-timing-function: ease-in;
        background-size: 24px 24px;
        display: block;
        float: left;
        height: 24px;
        margin: 0 6px 0 0;
        opacity: .5;
        width: 24px; }
      footer .elsewhere a:hover span {
        opacity: 1; }

.twitter a span {
  background: url(/v7/i/twitter.png) no-repeat 0 50%; }

.flickr a span {
  background: url(/v7/i/flickr.png) no-repeat 0 50%; }

.dribbble a span {
  background: url(/v7/i/dribbble.png) no-repeat 0 50%; }

.rdio a span {
  background: url(/v7/i/rdio.png) no-repeat 0 50%; }

.next, .prev, .archives-link {
  border: 1px solid #282828;
  border-color: rgba(40, 40, 40, 0.1);
  border-width: 0 1px 0 0;
  color: rgba(255, 255, 255, 0.75);
  color: rgba(0, 0, 0, 0.5);
  color: rgba(72, 77, 88, 0.5);
  display: block;
  float: left;
  font-family: 'chrono-web';
  font-size: 12px;
  line-height: 27.5px;
  padding: 2px 0 0 32px;
  position: relative;
  text-align: left;
  text-decoration: none;
  text-transform: uppercase;
  width: 35.5%;
  width: 39%; }
  .next:hover, .next:focus, .prev:hover, .prev:focus, .archives-link:hover, .archives-link:focus {
    color: #484d58; }

.archives-link {
  float: left;
  text-align: left;
  width: auto;
  padding-right: 12px; }

.next {
  border: none;
  float: right;
  text-align: right;
  padding: 2px 32px 0 0; }

.next span, .prev span {
  display: block;
  line-height: 14px;
  padding: 6px 0 8px; }

.icon-arrow-right, .icon-arrow-left, .icon-menu {
  color: rgba(72, 77, 88, 0.5);
  display: block;
  font-family: 'icomoon';
  font-size: 14px;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  margin: 0;
  opacity: .8;
  position: absolute;
  top: 7px;
  left: 9px;
  -webkit-font-smoothing: antialiased; }

.icon-arrow-right {
  left: auto;
  right: 9px; }

.icon-arrow-right:before {
  content: "\3e"; }

.icon-arrow-left:before {
  content: "\3c"; }

.icon-menu:before {
  content: "\ab"; }

/* Contact */
#contact #content article p {
  text-indent: 0; }

#wufoo-m7x3s5 {
  width: auto;
  margin: 48px 0 0 -6px; }

.fn, .org {
  /*font-family:'ChronoRegBold';*/
  font-weight: 400; }

/* Work */
.work-feature {
  background: rgba(255, 255, 255, 0.3);
  margin: 45px 7.327586207% 0;
  margin: 0;
  padding: 0 7.3275%; }

.writing, .speaker {
  color: #5e5f61;
  float: left;
  line-height: 20px;
  margin: 0 0 24px;
  padding: 45px 0 0 0; }
  .writing h1, .speaker h1 {
    font-size: 27.506px;
    margin-bottom: 24px;
    text-align: left; }
  .writing .photo-credit, .speaker .photo-credit {
    font-size: 12px;
    margin-bottom: 6px;
    text-align: right; }
  .writing h2, .writing h3, .speaker h2, .speaker h3 {
    font-size: 14px;
    line-height: 17px;
    font-weight: bold; }
    .writing h2 a, .writing h3 a, .speaker h2 a, .speaker h3 a {
      color: #5e5f61;
      text-decoration: none; }
      .writing h2 a:hover, .writing h3 a:hover, .speaker h2 a:hover, .speaker h3 a:hover {
        text-decoration: underline; }
    .writing h2 span, .writing h3 span, .speaker h2 span, .speaker h3 span {
      font-weight: normal; }
  .writing span, .speaker span {
    font-size: 14px;
    font-family: 'chrono-web';
    display: block; }
  .writing .callout, .speaker .callout {
    display: inline-block;
    margin: 0 6% 24px 0;
    vertical-align: top;
    width: 43%; }

.group-pics {
  margin: 24px 0; }
  .group-pics img {
    display: inline-block;
    margin: 0 0 0 24px;
    width: 30%; }
    .group-pics img:first-child {
      margin-left: 0; }

.speaker {
  width: 30%; }
  .speaker h1 {
    font-size: 27.506px;
    margin-bottom: 28px; }
  .speaker img {
    -moz-box-shadow: 0 0 5px rgba(94, 95, 97, 0.2);
    -webkit-box-shadow: 0 0 5px rgba(94, 95, 97, 0.2);
    box-shadow: 0 0 5px rgba(94, 95, 97, 0.2);
    margin: 0; }
  .speaker li {
    list-style: none;
    margin-bottom: 12px; }
    .speaker li p, .speaker li b {
      font-size: 14px;
      margin: 0; }
    .speaker li b {
      text-transform: uppercase;
      color: #383838; }
    .speaker li h2 span {
      display: inline; }
    .speaker li.split {
      border-top: 1px solid rgba(94, 95, 97, 0.3);
      padding-top: 12px; }

.writing {
  width: 66%;
  margin-right: 4%; }
  .writing img {
    -moz-box-shadow: 0 0 5px rgba(94, 95, 97, 0.2);
    -webkit-box-shadow: 0 0 5px rgba(94, 95, 97, 0.2);
    box-shadow: 0 0 5px rgba(94, 95, 97, 0.2);
    float: left;
    margin: 0 12px 12px 0;
    width: 30%; }

/*
.writing {
	width: 100%;
	.callout {
		width: 30%;
		margin-right: 5%;
		float: left;
		&:last-child { margin-right: 0; }
		img { width: 40%; }
	}
}

.speaker{
	width: 100%;
	.mp { float: left; width: 25%; margin: 0 $unit $unit 0; }
	ul { float: left; width: 70%; }
	li {
		float: left;
		width: 30%;
		margin: 0 $unit $unit 0;
		&:last-child { margin-right: 0; }
	}
}
*/
#work #content article {
  clear: both;
  border-bottom: 1px solid rgba(94, 95, 97, 0.3);
  padding-bottom: 24px; }

#home .works .featured {
  color: rgba(56, 56, 56, 0.3);
  display: block;
  /*font-family:'ChronoRegBold';
  	font-weight: normal;*/
  font-weight: 400;
  font-size: 20px;
  line-height: 22px;
  margin: 0;
  padding: 24px 0;
  text-align: center;
  text-decoration: none;
  text-transform: uppercase; }
#home .works article {
  border: none;
  float: left;
  margin: 0 3.25% 0 0;
  padding: 0;
  width: 31%; }
  #home .works article:last-child {
    margin-right: 0; }
  #home .works article h1 {
    font-family: 'chrono-web';
    font-size: 17px;
    text-align: left;
    text-transform: none; }
  #home .works article img {
    opacity: .85;
    -webkit-transition-property: all;
    -moz-transition-property: all;
    -o-transition-property: all;
    transition-property: all;
    -webkit-transition-duration: 0.2s;
    -moz-transition-duration: 0.2s;
    -o-transition-duration: 0.2s;
    transition-duration: 0.2s;
    -webkit-transition-timing-function: ease-in;
    -moz-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in; }
  #home .works article a:hover img {
    opacity: 1; }

@media screen and (max-width: 768px) {
  #content {
    padding: 0 2.5% 60px;
    width: 87%; }

  header {
    padding-bottom: 24px; }

  header ul {
    position: relative;
    padding: 0;
    width: 100%; }
    header ul #nav-logo span {
      display: block; }
    header ul li {
      display: inline-block;
      float: none;
      vertical-align: top; }
      header ul li p {
        display: none; }
      header ul li a {
        display: block;
        padding-left: 15px;
        padding-right: 15px;
        text-align: center; }
    header ul #nav-logo {
      width: auto;
      border: none; }
      header ul #nav-logo a {
        padding-top: 14px; }

  #archives #nav-journal a, #journal #nav-journal a, #work #nav-work a, #about #nav-about a, #contact #nav-contact a {
    padding-top: 20px;
    border: none; }

  #home #nav-logo a {
    border-top: none; }

  .work-feature {
    margin: 0 -3%;
    padding-bottom: 45px; } }
@media screen and (max-width: 695px) {
  header ul #nav-journal, header ul #nav-work, header ul #nav-about, header ul #nav-contact {
    width: auto; }
    header ul #nav-journal a, header ul #nav-work a, header ul #nav-about a, header ul #nav-contact a {
      background-position: 50% 50%;
      background-repeat: no-repeat;
      background-size: 30px 30px;
      height: 30px;
      padding: 15px;
      text-indent: 0;
      width: 30px;
      font-size: 10px;
      height: 0px;
      padding: 45px 10px 15px;
      text-align: center;
      width: 50px; }
  header ul #nav-journal a {
    background-image: url(/v7/i/journal.png); }
  header ul #nav-work a {
    background-image: url(/v7/i/work.png); }
  header ul #nav-about a {
    background-image: url(/v7/i/about.png); }
  header ul #nav-contact a {
    background-image: url(/v7/i/contact.png); }

  #archives #nav-journal a, #journal #nav-journal a, #work #nav-work a, #about #nav-about a, #contact #nav-contact a {
    padding-top: 45px;
    border: none; }

  #home #nav-logo a {
    border-top: none;
    padding-left: 5px;
    padding-right: 10px; }

  article h1 {
    font-size: 44.505px; }

  footer .elsewhere a span {
    display: none; }

  .work-feature .writing {
    width: 60%;
    margin-right: 0; }
  .work-feature .speaker {
    width: 40%; }
  .work-feature .callout {
    width: 90%;
    margin-right: 0; } }
@media screen and (max-width: 540px) {
  body {
    font-size: 14.833px;
    line-height: 22px; }

  #content {
    width: 90%;
    padding: 0 0 60px; }

  footer .wrap {
    width: 90%; }

  footer .bits img {
    display: block;
    float: none; }

  footer .elsewhere h1 {
    display: none; }
  footer .elsewhere a {
    text-indent: -9999em; }
  footer .elsewhere a span {
    display: block; }

  article {
    margin-top: 48px; }
    article h1 {
      font-size: 38.832px; }
    article .date {
      margin-bottom: 12px; } }
@media screen and (max-width: 400px) {
  header ul li {
    border: none; }

  header ul li a {
    padding: 45px 10px 15px; }

  header ul #nav-logo {
    display: block !important;
    min-height: 1em; }
    header ul #nav-logo a {
      padding: 14px 0 0 0; }
    header ul #nav-logo span {
      display: inline; }

  #nav-journal {
    border-left: none; }

  #about aside, #contact aside {
    float: none;
    width: 95%;
    margin: 0 auto 24px; }

  #about article {
    margin-top: 0; }

  #content {
    width: auto; }

  article {
    margin-left: 5%;
    margin-right: 5%; }

  .work-feature .speaker, .work-feature .writing {
    width: 100%;
    float: none; } }