div.container {
  max-width: 800px;
}

div#blog-title h1 a,
div#blog-title h1 a:hover,
h2.post-title a,
h2.post-title a:hover {
  text-decoration: none
}

div#about div.headshot {
  padding: 0 12px 0 0;
}

div#about a i {
  color: black;
}

div#about a:hover i {
  text-decoration: none;
}

div.post {
  margin-bottom: 60px;
}

div.post div.post-meta {
  color: #aaa;
  margin-bottom: 22px;
  font-size: 90%;
}

/* Helpful rules for web typography:
 *
 * http://practicaltypography.com/line-spacing.html
 *
 * */
div.post p {
  line-height: 135%;
  margin-bottom: 1em;
}

div.post blockquote p {
  margin-top: 0.5em;
  margin-bottom: 0.5em;
}

div.post div.post-content a {
  border-bottom: 1px solid rgba(69, 130, 236, 0.5);
}

div.post div.post-content a:hover,
div.post div.post-content a:focus {
  text-decoration: none;
  border-bottom: 1px solid rgba(88, 89, 183, 0.7);
}

div.post button.call-to-action span.twitter {
  color: rgb(69, 130, 236);
}

div.post button.call-to-action {
  margin-bottom: 24px;
}

div#about div.panel-footer {
  text-align: center;
}

div#about div.panel-footer i {
  padding: 0 1px;
}

/*
 * Category pages
 */

ul.category.posts {
  margin-bottom: 32px;
}

ul.category.posts li a.post-title {
  font-size: 140%;
}

ul.category.posts li span.post-meta {
  color: #aaa;
  font-size: 80%;
  margin-left: 6px;
}

/*
 * Talks page
 */

div.row.talk {
  margin-bottom: 16px;
}

div.row.talk span.meta {
  color: #aaa;
  font-size: 80%;
  margin-left: 2px;
}
/*
 * PAGE STYLING
 */

div#portrait {
  text-align: center;
}

@media print, screen and (max-width: 660px) {

  div#portrait img {
    max-width: 290px;
  }

  div.post button.call-to-action {
    font-size: 80%;
  }

}