/*
 * CSS styles for prkr.me by Parker Malenke
 * Last updated 04.16.13
 * For license info, see www.prkr.me/license
 */
/*******************************************************************************
 TABLE OF CONTENTS
 ******************************************************************************/
/*
1. General info
2. Shared (across every page)
3. Specific pages
	a. index.html

*/
/*******************************************************************************
 $General
 ******************************************************************************/
/* COLORS */
/*******************************************************************************
 $Shared
 ******************************************************************************/
h1 {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 36px;
  color: #323232;
  margin: 0;
  padding: 0; }
  h1 a:link, h1 a:visited, h1 a:active, h1 a:hover {
    color: #323232;
    border-bottom: none;
    padding: 0;
    margin: 0;
    background: none; }
  @media (min-width: 500px) {
    h1 {
      font-size: 55px; } }

p {
  font-family: Georgia, serif;
  font-size: 15px;
  line-height: 1.4;
  word-wrap: break-word; }
  @media (min-width: 500px) {
    p {
      font-size: 16px;
      line-height: 1.5; } }

a:link, a:visited, a:active {
  color: #323232;
  text-decoration: none;
  border-bottom: 2px solid #323232; }

a:hover {
  border-bottom: none;
  border-radius: 2px;
  background-color: #323232;
  color: #d5d5d5;
  padding: 2px 4px;
  margin: -2px -4px; }

ul, ol {
  font-family: Georgia, serif;
  font-size: 15px;
  line-height: 1.4;
  word-wrap: break-word; }
  @media (min-width: 500px) {
    ul, ol {
      font-size: 16px;
      line-height: 1.5; } }

blockquote {
  margin-left: 2em;
  padding-left: 1em;
  border-left: 4px #323232 solid; }

.page-footer {
  background: #323232;
  color: #d5d5d5;
  text-align: center;
  font-family: Verdana, sans-serif;
  font-size: 11px;
  margin: 0;
  padding: 10px; }
  .page-footer a:link, .page-footer a:visited {
    color: #d5d5d5;
    text-decoration: underline; }
  .page-footer a:hover {
    text-decoration: none; }
  @media (min-height: 400px) and (min-width: 675px) {
    .page-footer {
      width: 650px;
      padding: 10px 0;
      margin: 0 auto 20px; } }

code {
  font-family: menlo, monaco, "lucida console", monospace, serif;
  font-size: 13px; }

.pagination a:link, .pagination a:visited, .pagination a:active {
  padding: 4px 8px;
  color: #d5d5d5;
  background: #323232;
  border: none; }
  .pagination a:link:hover, .pagination a:visited:hover, .pagination a:active:hover {
    margin: 0;
    color: #323232;
    background: #d5d5d5; }

.disabled-pagination {
  padding: 4px 8px;
  color: #d5d5d5; }

.pagination {
  display: table;
  margin: 0 auto 100px; }

.text-paginator {
  margin: 0 10px; }
  @media (min-width: 450px) {
    .text-paginator {
      margin: 0 50px; } }

/*******************************************************************************
 $Specific pages
 ******************************************************************************/
.page-title {
  text-align: left;
  margin: -5px 15px 0;
  font-size: 50px;
  line-height: 0.9;
  text-transform: uppercase; }
  @media (min-width: 350px) {
    .page-title {
      font-size: 60px; } }
  @media (min-width: 450px) {
    .page-title {
      font-size: 70px; } }
  @media (min-width: 690px) {
    .page-title {
      text-align: center;
      font-size: 70px; } }
  @media (min-width: 760px) {
    .page-title {
      text-align: center;
      font-size: 80px;
      margin: -7px 0 0 0; } }
  @media (min-width: 940px) {
    .page-title {
      text-align: center;
      font-size: 100px;
      margin: -8px 0 0 0; } }

header {
  background-image: url(/assets/img/bg-1_s.jpg);
  background-size: 100% auto;
  padding-bottom: 20px;
  margin-bottom: 20px; }
  @media (min-width: 800px) {
    header {
      background-image: url(/assets/img/bg-1_m.jpg); } }
  @media (min-width: 1280px) {
    header {
      background-image: url(/assets/img/bg-1.jpg); } }

nav {
  margin: 15px; }
  @media (min-width: 675px) {
    nav {
      width: 650px;
      margin: 20px auto 0; } }

.nav-ul {
  font-family: Helvetica, Arial, sans-serif;
  font-size: 14px;
  line-height: 1;
  list-style-type: none;
  padding: 0;
  margin: 0;
  overflow: hidden; }
  @media (min-width: 450px) {
    .nav-ul {
      font-size: 20px; } }
  .nav-ul li {
    float: left;
    padding: 4px 7px;
    margin-right: 10px;
    color: #d5d5d5;
    background: #323232; }
    @media (min-width: 400px) {
      .nav-ul li {
        padding: 5px 10px;
        margin-right: 15px; } }
    .nav-ul li:hover {
      background: #d5d5d5; }
      .nav-ul li:hover a {
        color: #323232; }
  .nav-ul a:link, .nav-ul a:visited, .nav-ul a:active {
    color: #d5d5d5;
    text-decoration: none;
    border: none;
    background: none; }
  .nav-ul a:hover {
    color: #323232; }

.home-html {
  background: url(/assets/img/bg-1_s.jpg) no-repeat center center fixed;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='path_relative_to_the_HTML_file', sizingMethod='scale')"; }
  @media (min-width: 800px) {
    .home-html {
      background: url(/assets/img/bg-1_m.jpg) no-repeat center center fixed;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='path_relative_to_the_HTML_file', sizingMethod='scale')"; } }
  @media (min-width: 1280px) {
    .home-html {
      background: url(/assets/img/bg-1.jpg) no-repeat center center fixed;
      -webkit-background-size: cover;
      -moz-background-size: cover;
      -o-background-size: cover;
      background-size: cover;
      -ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='path_relative_to_the_HTML_file', sizingMethod='scale')"; } }

.home-title {
  text-align: left;
  margin: -6px 15px 0;
  font-size: 50px;
  line-height: 0.9;
  text-transform: uppercase; }
  @media (min-width: 350px) {
    .home-title {
      font-size: 60px; } }
  @media (min-width: 450px) {
    .home-title {
      margin-left: 13%;
      font-size: 70px; } }
  @media (min-width: 690px) {
    .home-title {
      margin-left: 0;
      text-align: center;
      font-size: 70px; } }
  @media (min-width: 760px) {
    .home-title {
      text-align: center;
      font-size: 80px;
      margin: -7px 0 0 0; } }
  @media (min-width: 940px) {
    .home-title {
      text-align: center;
      font-size: 100px;
      margin: -8px 0 0 0; } }

.home-ul {
  padding: 0;
  margin: 100px 15px 0;
  line-height: 1.2;
  list-style-type: none; }
  @media (min-width: 450px) {
    .home-ul {
      position: fixed;
      left: 13%;
      bottom: 75px; } }
  @media (max-height: 400px) and (min-width: 450px) {
    .home-ul {
      position: static;
      margin: 100px 0 0 13%; } }
  .home-ul li {
    display: table;
    margin: 20px 0;
    background: #323232;
    padding: 3px 15px;
    color: #d5d5d5;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 40px; }
    @media (min-width: 600px) {
      .home-ul li {
        font-size: 70px; } }
    .home-ul li a:link, .home-ul li a:visited {
      color: #d5d5d5;
      text-decoration: none; }
  .home-ul .small {
    font-size: 14px;
    padding: 10px 15px; }
    @media (min-width: 470px) {
      .home-ul .small {
        font-size: 20px; } }
    .home-ul .small a:link, .home-ul .small a:visited {
      border-bottom: 2px solid #d5d5d5; }
    .home-ul .small a:hover {
      border-bottom: none; }

.home-footer {
  margin-top: 40px; }
  @media (min-height: 400px) and (min-width: 450px) {
    .home-footer {
      position: absolute;
      bottom: 0;
      width: 100%;
      padding: 10px 0;
      margin: 0 auto; } }

article {
  margin: 0 15px 100px; }
  @media (min-width: 675px) {
    article {
      width: 650px;
      margin: 0 auto 100px; } }
  article pre {
    background: #fdf6e3;
    padding: 10px;
    overflow-x: scroll;
    white-space: pre; }
  article [data-picture] {
    text-align: center; }
  article [data-picture].align-left {
    text-align: left; }
  article [data-picture].align-right {
    text-align: right; }
  article img {
    max-width: 100%;
    margin: 0.5em 0; }
    @media (min-height: 200px) {
      article img {
        max-height: 260px;
        width: auto; } }
    @media (min-height: 250px) {
      article img {
        max-height: 325px;
        width: auto; } }
    @media (min-height: 300px) {
      article img {
        max-height: 390px;
        width: auto; } }
    @media (min-height: 350px) {
      article img {
        max-height: 455px;
        width: auto; } }
    @media (min-height: 400px) {
      article img {
        max-height: 520px;
        width: auto; } }
    @media (min-height: 450px) {
      article img {
        max-height: 585px;
        width: auto; } }
    @media (min-height: 500px) {
      article img {
        max-height: 650px;
        width: auto; } }
    @media (min-height: 550px) {
      article img {
        max-height: 715px;
        width: auto; } }
    @media (min-height: 600px) {
      article img {
        max-height: 780px;
        width: auto; } }
    @media (min-height: 650px) {
      article img {
        max-height: 845px;
        width: auto; } }
    @media (min-height: 700px) {
      article img {
        max-height: 910px;
        width: auto; } }
    @media (min-height: 750px) {
      article img {
        max-height: 975px;
        width: auto; } }
    @media (min-height: 800px) {
      article img {
        max-height: 1040px;
        width: auto; } }
    @media (min-height: 850px) {
      article img {
        max-height: 1105px;
        width: auto; } }
    @media (min-height: 900px) {
      article img {
        max-height: 1170px;
        width: auto; } }
    @media (min-height: 950px) {
      article img {
        max-height: 1235px;
        width: auto; } }
    @media (min-height: 1000px) {
      article img {
        max-height: 1300px;
        width: auto; } }
    @media (min-height: 1050px) {
      article img {
        max-height: 1365px;
        width: auto; } }
    @media (min-height: 1100px) {
      article img {
        max-height: 1430px;
        width: auto; } }
    @media (min-height: 1150px) {
      article img {
        max-height: 1495px;
        width: auto; } }
    @media (min-height: 1200px) {
      article img {
        max-height: 1560px;
        width: auto; } }
    @media (min-height: 1250px) {
      article img {
        max-height: 1625px;
        width: auto; } }
    @media (min-height: 1300px) {
      article img {
        max-height: 1690px;
        width: auto; } }
    @media (min-height: 1350px) {
      article img {
        max-height: 1755px;
        width: auto; } }
    @media (min-height: 1400px) {
      article img {
        max-height: 1820px;
        width: auto; } }
    @media (min-height: 1450px) {
      article img {
        max-height: 1885px;
        width: auto; } }
    @media (min-height: 1500px) {
      article img {
        max-height: 1950px;
        width: auto; } }
    @media (min-height: 1550px) {
      article img {
        max-height: 2015px;
        width: auto; } }
    @media (min-height: 1600px) {
      article img {
        max-height: 2080px;
        width: auto; } }
  article footer {
    margin-top: 25px;
    overflow: hidden; }
    @media (min-width: 400px) {
      article footer {
        overflow: visible; } }
    article footer time, article footer a:link, article footer a:visited, article footer a:hover, article footer a:active {
      padding: 5px 10px;
      margin: 0 0 10px 0;
      border-radius: 0;
      border: none;
      background: #323232;
      float: left;
      clear: both;
      color: #d5d5d5;
      font-family: Helvetica, Arial, sans-serif;
      font-size: 15px;
      line-height: 1;
      text-decoration: none; }
      @media (min-width: 400px) {
        article footer time, article footer a:link, article footer a:visited, article footer a:hover, article footer a:active {
          margin: 0 15px 0 0;
          float: none;
          clear: none; } }
    article footer a:hover {
      background: #d5d5d5;
      color: #323232; }

.post-link:link, .post-link:visited, .post-link:active {
  border-bottom: 2px #323232 solid;
  -webkit-transition: padding-left ease 0.6s; }
  .post-link:link:hover, .post-link:visited:hover, .post-link:active:hover {
    border: none;
    border-radius: 0;
    padding: 4px 8px; }

.edit-form {
  display: none; }

.photo-article {
  width: 95%;
  margin: 0 auto 100px auto;
  background: #b5b5b5; }
  .photo-article h1 {
    margin: 0 2.5%; }
    @media (min-width: 675px) {
      .photo-article h1 {
        width: 650px;
        margin: 0 auto 0 auto;
        padding-top: 40px; } }
  @media (min-width: 675px) {
    .photo-article footer {
      width: 650px;
      margin: 10px auto 0; } }
  .photo-article [data-picture] {
    padding: 50px 0; }
    .photo-article [data-picture] img {
      margin: 0 auto;
      display: block; }
      @media (min-height: 200px) {
        .photo-article [data-picture] img {
          max-height: 190px;
          width: auto; } }
      @media (min-height: 250px) {
        .photo-article [data-picture] img {
          max-height: 240px;
          width: auto; } }
      @media (min-height: 300px) {
        .photo-article [data-picture] img {
          max-height: 290px;
          width: auto; } }
      @media (min-height: 350px) {
        .photo-article [data-picture] img {
          max-height: 340px;
          width: auto; } }
      @media (min-height: 400px) {
        .photo-article [data-picture] img {
          max-height: 390px;
          width: auto; } }
      @media (min-height: 450px) {
        .photo-article [data-picture] img {
          max-height: 440px;
          width: auto; } }
      @media (min-height: 500px) {
        .photo-article [data-picture] img {
          max-height: 490px;
          width: auto; } }
      @media (min-height: 550px) {
        .photo-article [data-picture] img {
          max-height: 540px;
          width: auto; } }
      @media (min-height: 600px) {
        .photo-article [data-picture] img {
          max-height: 550px;
          width: auto; } }
      @media (min-height: 650px) {
        .photo-article [data-picture] img {
          max-height: 600px;
          width: auto; } }
      @media (min-height: 700px) {
        .photo-article [data-picture] img {
          max-height: 650px;
          width: auto; } }
      @media (min-height: 750px) {
        .photo-article [data-picture] img {
          max-height: 700px;
          width: auto; } }
      @media (min-height: 800px) {
        .photo-article [data-picture] img {
          max-height: 750px;
          width: auto; } }
      @media (min-height: 850px) {
        .photo-article [data-picture] img {
          max-height: 800px;
          width: auto; } }
      @media (min-height: 900px) {
        .photo-article [data-picture] img {
          max-height: 850px;
          width: auto; } }
      @media (min-height: 950px) {
        .photo-article [data-picture] img {
          max-height: 900px;
          width: auto; } }
      @media (min-height: 1000px) {
        .photo-article [data-picture] img {
          max-height: 950px;
          width: auto; } }
      @media (min-height: 1050px) {
        .photo-article [data-picture] img {
          max-height: 1000px;
          width: auto; } }
      @media (min-height: 1100px) {
        .photo-article [data-picture] img {
          max-height: 1050px;
          width: auto; } }
      @media (min-height: 1150px) {
        .photo-article [data-picture] img {
          max-height: 1100px;
          width: auto; } }
      @media (min-height: 1200px) {
        .photo-article [data-picture] img {
          max-height: 1150px;
          width: auto; } }
      @media (min-height: 1250px) {
        .photo-article [data-picture] img {
          max-height: 1200px;
          width: auto; } }
      @media (min-height: 1300px) {
        .photo-article [data-picture] img {
          max-height: 1250px;
          width: auto; } }
      @media (min-height: 1350px) {
        .photo-article [data-picture] img {
          max-height: 1300px;
          width: auto; } }
      @media (min-height: 1400px) {
        .photo-article [data-picture] img {
          max-height: 1350px;
          width: auto; } }
      @media (min-height: 1450px) {
        .photo-article [data-picture] img {
          max-height: 1400px;
          width: auto; } }
      @media (min-height: 1500px) {
        .photo-article [data-picture] img {
          max-height: 1450px;
          width: auto; } }
      @media (min-height: 1550px) {
        .photo-article [data-picture] img {
          max-height: 1500px;
          width: auto; } }
      @media (min-height: 1600px) {
        .photo-article [data-picture] img {
          max-height: 1550px;
          width: auto; } }
      @media (min-width: 200px) {
        .photo-article [data-picture] img {
          max-width: 175px; } }
      @media (min-width: 250px) {
        .photo-article [data-picture] img {
          max-width: 225px; } }
      @media (min-width: 300px) {
        .photo-article [data-picture] img {
          max-width: 275px; } }
      @media (min-width: 350px) {
        .photo-article [data-picture] img {
          max-width: 325px; } }
      @media (min-width: 400px) {
        .photo-article [data-picture] img {
          max-width: 375px; } }
      @media (min-width: 450px) {
        .photo-article [data-picture] img {
          max-width: 425px; } }
      @media (min-width: 500px) {
        .photo-article [data-picture] img {
          max-width: 475px; } }
      @media (min-width: 550px) {
        .photo-article [data-picture] img {
          max-width: 525px; } }
      @media (min-width: 600px) {
        .photo-article [data-picture] img {
          max-width: 525px; } }
      @media (min-width: 650px) {
        .photo-article [data-picture] img {
          max-width: 575px; } }
      @media (min-width: 700px) {
        .photo-article [data-picture] img {
          max-width: 625px; } }
      @media (min-width: 750px) {
        .photo-article [data-picture] img {
          max-width: 675px; } }
      @media (min-width: 800px) {
        .photo-article [data-picture] img {
          max-width: 725px; } }
      @media (min-width: 850px) {
        .photo-article [data-picture] img {
          max-width: 775px; } }
      @media (min-width: 900px) {
        .photo-article [data-picture] img {
          max-width: 825px; } }
      @media (min-width: 950px) {
        .photo-article [data-picture] img {
          max-width: 875px; } }
      @media (min-width: 1000px) {
        .photo-article [data-picture] img {
          max-width: 925px; } }
      @media (min-width: 1050px) {
        .photo-article [data-picture] img {
          max-width: 975px; } }
      @media (min-width: 1100px) {
        .photo-article [data-picture] img {
          max-width: 1025px; } }
      @media (min-width: 1150px) {
        .photo-article [data-picture] img {
          max-width: 1075px; } }
      @media (min-width: 1200px) {
        .photo-article [data-picture] img {
          max-width: 1125px; } }
      @media (min-width: 1250px) {
        .photo-article [data-picture] img {
          max-width: 1175px; } }
      @media (min-width: 1300px) {
        .photo-article [data-picture] img {
          max-width: 1225px; } }
      @media (min-width: 1350px) {
        .photo-article [data-picture] img {
          max-width: 1275px; } }
      @media (min-width: 1400px) {
        .photo-article [data-picture] img {
          max-width: 1325px; } }
      @media (min-width: 1450px) {
        .photo-article [data-picture] img {
          max-width: 1375px; } }
      @media (min-width: 1500px) {
        .photo-article [data-picture] img {
          max-width: 1425px; } }
      @media (min-width: 1550px) {
        .photo-article [data-picture] img {
          max-width: 1475px; } }
      @media (min-width: 1600px) {
        .photo-article [data-picture] img {
          max-width: 1525px; } }
      @media (min-width: 1650px) {
        .photo-article [data-picture] img {
          max-width: 1575px; } }
      @media (min-width: 1700px) {
        .photo-article [data-picture] img {
          max-width: 1625px; } }
      @media (min-width: 1750px) {
        .photo-article [data-picture] img {
          max-width: 1675px; } }
      @media (min-width: 1800px) {
        .photo-article [data-picture] img {
          max-width: 1725px; } }
      @media (min-width: 1850px) {
        .photo-article [data-picture] img {
          max-width: 1775px; } }
      @media (min-width: 1900px) {
        .photo-article [data-picture] img {
          max-width: 1825px; } }
      @media (min-width: 1950px) {
        .photo-article [data-picture] img {
          max-width: 1875px; } }
      @media (min-width: 2000px) {
        .photo-article [data-picture] img {
          max-width: 1925px; } }
      @media (min-width: 2050px) {
        .photo-article [data-picture] img {
          max-width: 1975px; } }
      @media (min-width: 2100px) {
        .photo-article [data-picture] img {
          max-width: 2025px; } }
      @media (min-width: 2150px) {
        .photo-article [data-picture] img {
          max-width: 2075px; } }
      @media (min-width: 2200px) {
        .photo-article [data-picture] img {
          max-width: 2125px; } }
      @media (min-width: 2250px) {
        .photo-article [data-picture] img {
          max-width: 2175px; } }
      @media (min-width: 2300px) {
        .photo-article [data-picture] img {
          max-width: 2225px; } }
      @media (min-width: 2350px) {
        .photo-article [data-picture] img {
          max-width: 2275px; } }
      @media (min-width: 2400px) {
        .photo-article [data-picture] img {
          max-width: 2325px; } }
      @media (min-width: 2450px) {
        .photo-article [data-picture] img {
          max-width: 2375px; } }
      @media (min-width: 2500px) {
        .photo-article [data-picture] img {
          max-width: 2425px; } }
      @media (min-width: 2550px) {
        .photo-article [data-picture] img {
          max-width: 2475px; } }
      @media (min-width: 2600px) {
        .photo-article [data-picture] img {
          max-width: 2525px; } }

#words-archive {
  margin: 0 15px; }
  @media (min-width: 440px) {
    #words-archive {
      width: 440px;
      margin: 0 auto; } }
  @media (min-width: 660px) {
    #words-archive {
      width: 660px;
      margin: 0 auto; } }
  @media (min-width: 880px) {
    #words-archive {
      width: 880px;
      margin: 0 auto; } }
  #words-archive:after {
    content: "";
    display: table;
    clear: both; }
  #words-archive a {
    border-bottom: none;
    padding: 0;
    margin: 0;
    border-radius: 0;
    background: none; }
    #words-archive a:hover {
      color: #323232;
      border-bottom: 2px solid #323232; }

@media (min-width: 440px) {
  .words-year {
    width: 200px;
    float: left;
    margin-right: 20px; } }
@media (min-width: 440px) and (max-width: 659px) {
  .words-year:nth-child(4n+4) {
    clear: left; } }
@media (min-width: 660px) and (max-width: 879px) {
  .words-year:nth-child(5n+5) {
    clear: left; } }
@media (min-width: 880px) {
  .words-year:nth-child(6n+6) {
    clear: left; } }
.words-year h3 {
  margin: 20px 0 5px; }
.words-year ul {
  list-style-type: none;
  padding: 0;
  margin: 0; }
.words-year li {
  padding: 0 0 5px 0; }

#pictures-archive {
  clear: both;
  margin: 50px 15px; }
  @media (min-width: 440px) {
    #pictures-archive {
      width: 440px;
      margin: 50px auto; } }
  @media (min-width: 660px) {
    #pictures-archive {
      width: 660px;
      margin: 50px auto; } }
  @media (min-width: 880px) {
    #pictures-archive {
      width: 880px;
      margin: 50px auto; } }
  #pictures-archive img {
    height: 80px;
    margin: 0 10px 10px 0; }
    @media (min-width: 440px) {
      #pictures-archive img {
        height: 120px; } }
  #pictures-archive a {
    border-bottom: none;
    padding: 0;
    margin: 0;
    border-radius: 0;
    background: none; }

#about {
  margin: 0 15px 100px; }
  @media (min-width: 675px) {
    #about {
      width: 650px;
      margin: 0 auto 100px; } }
