/*  Joni Korpi
    jonikorpi.com
    ---------------------   */
/*  

    Landscape Layout
    cols    1       2       3       4       5
    px      144     312     480     648     816

*/
@media screen and (min-width: 58.5em) {
  body {
    font-size: 1em;
  }
  .wrapper, #content header {
    width: 51em;
    max-width: none;
  }
  #logo {
    top: 3em;
  }
  nav ul {
    height: 7.5em;
    margin-right: 2.25em;
  }
  nav a {
    padding-top: 3em;
    padding-bottom: 1.5em;
  }
  #content header h1 {
    font-size: 4.25em;
    line-height: 1.0588235294117647em;
    padding: 0.6176470588235294em 0 0.08823529411764706em;
  }
  #content header p {
    font-size: 2.5em;
    line-height: 1.2em;
    margin: 0 0 0.575em;
    border-bottom: 0.025em solid #7f7d74;
    padding-bottom: 0.575em;
  }
  #content .full {
    min-height: 30em;
  }
  figcaption {
    position: absolute;
    right: -12.923076923076923em;
    top: 0;
    width: 11.076923076923077em;
    text-align: left;
    padding: 0;
  }
  .full figcaption {
    right: 0;
    top: 38.76923076923077em;
  }
  #content footer {
    padding: 0;
  }
  .byline div {
    position: absolute;
    left: 0;
    bottom: 0.0625em;
    padding: 0;
  }
  #published, #readingTime {
    display: block;
    bottom: auto;
    top: 0;
  }
  #published, #nextPost {
    left: auto;
    right: 0;
  }
  #articles a {
    float: left;
    width: 100%;
    padding: 1.125em 0;
    position: relative;
    -webkit-transform-origin: 1.125em center;
    -moz-transform-origin: 1.125em center;
    -ms-transform-origin: 1.125em center;
    transform-origin: 1.125em center;
  }
  #articles h1, #articles p {
    float: left;
  }
  #articles h1 {
    font-size: 1.625em;
    line-height: 1.3846153846153846em;
    padding-left: 6.461538461538462em;
    width: 12em;
  }
  #articles p {
    width: 19.5em;
    margin: 0 0 0 1.5em;
  }
  #articles time, .readingTime {
    right: auto;
    left: 0;
    top: 1.125em;
  }
  .readingTime {
    top: 3.230769230769231em;
  }
  #colophon, #projects .full {
    padding-top: 0.5em;
  }
  #copyright {
    padding-bottom: 3.75em;
  }
}
/*  

    1392 px or 1224x1008 px, and above
    Scaled to 17 px

*/
@media screen and (min-width: 87em), 
    screen and (min-height: 63em) and (min-width: 76.5em) {
  body {
    font-size: 1.0625em;
  }
}
/*  

    1696 px or 1224x1224 px, and above
    Scaled to 18 px

*/
@media screen and (min-width: 106em), 
    screen and (min-height: 76.5em) and (min-width: 76.5em) {
  body {
    font-size: 1.125em;
  }
}
