body, input, select, textarea, b, strong {
  color: #000000;
}

pre {
  display: table;
  table-layout: fixed;
  width: 100%
}

#header .links a {
  /* Theoretically for IE 8 & 9 (more valid) */
  /* ...but not required as filter works too */
  /* should come BEFORE filter */
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";

  /* This works in IE 8 & 9 too */
  /* ... but also 5, 6, 7 */
  filter: alpha(opacity=65);

  /* Modern Browsers */
  opacity: 0.65;
}

#header .main ul li > a {
  color: #000000;
  /* Theoretically for IE 8 & 9 (more valid) */
  /* ...but not required as filter works too */
  /* should come BEFORE filter */
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=35)";

  /* This works in IE 8 & 9 too */
  /* ... but also 5, 6, 7 */
  filter: alpha(opacity=35);

  /* Modern Browsers */
  opacity: 0.35;
}

#header .main .search input {
  color: #000000;
}

#intro p,
#intro .icons a {
  /* Theoretically for IE 8 & 9 (more valid) */
  /* ...but not required as filter works too */
  /* should come BEFORE filter */
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";

  /* This works in IE 8 & 9 too */
  /* ... but also 5, 6, 7 */
  filter: alpha(opacity=60);

  /* Modern Browsers */
  opacity: 0.6;
}

#sidebar #recent-posts ul.posts time,
#sidebar #categories ul.posts li header,
#sidebar .blurb p {
  /* Theoretically for IE 8 & 9 (more valid) */
  /* ...but not required as filter works too */
  /* should come BEFORE filter */
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=65)";

  /* This works in IE 8 & 9 too */
  /* ... but also 5, 6, 7 */
  filter: alpha(opacity=65);

  /* Modern Browsers */
  opacity: 0.65;
}

article.post header .title p,
article.post header .meta p,
article.post header .meta span,
article.post footer .stats {
  /* Theoretically for IE 8 & 9 (more valid) */
  /* ...but not required as filter works too */
  /* should come BEFORE filter */
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";

  /* This works in IE 8 & 9 too */
  /* ... but also 5, 6, 7 */
  filter: alpha(opacity=70);

  /* Modern Browsers */
  opacity: 0.70;
}

article.post p,
article.post h2,
article.post h3,
article.post h4 {
  color: #000000;
  /* Theoretically for IE 8 & 9 (more valid) */
  /* ...but not required as filter works too */
  /* should come BEFORE filter */
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=87)";

  /* This works in IE 8 & 9 too */
  /* ... but also 5, 6, 7 */
  filter: alpha(opacity=87);

  /* Modern Browsers */
  opacity: 0.87;
}

#header h2 {
  font-size: inherit;
  height: inherit;
  line-height: inherit;
  padding: 0 0 0 1.5em;
  white-space: nowrap;
}

#header h2 a {
  font-size: 0.7em;
}

@media screen and (max-width: 736px) {
  #header h2 {
    padding: 0 0 0 1em;
  }
}

#intro .intro-circle {
  border-radius: 50%;
}

.post > header .title h1 {
  font-weight: 900;
  font-size: 1em;
}
@media screen and (max-width: 736px) {
  .post > header .title h1 {
    font-size: 1em;
  }
}

@media screen and (max-width: 480px) {
  .post > .image.featured {
    margin-top: 0;
  }
}

blockquote p {
  margin-bottom: 0;
}

.image.center-image {
  max-width: 50%;
}
.image.center-image img {
  width: 100%;
}
.image.center-image {
  display: block;
  margin: auto;
  clear: both;
}

.pagination .button {
  background: white;
}

/** Social Share Button CSS **/
#social-share {
  position: relative;
  top: -0.5em;
}

#social-share ul {
  margin: 0;
}

#social-share .icons li {
  padding: 0 !important;
  padding-bottom: 10px !important;
}

#social-share ul li p {
  display: none;
}

#social-share .share-btn {
  padding: 0.5em;
  width: 4em;
}

#social-share-nav .share-btn h3{
  color: #ffffff;
}

.share-btn {
  display: inline-block;
  color: #ffffff;
  border: none;
  border-radius: 4px;
  box-shadow: 0 2px 0 0 rgba(0,0,0,0.2);
  outline: none;
  text-align: center;
  text-decoration: none;
}

.share-btn:hover {
  color: #ffffff !important;
}

.share-btn:active {
  position: relative;
  top: 2px;
  box-shadow: none;
  color: #e2e2e2;
  outline: none;
}

.share-btn.twitter     { background: #55acee; }
.share-btn.google-plus { background: #dd4b39; }
.share-btn.facebook    { background: #3B5998; }
.share-btn.linkedin    { background: #4875B4; }
.share-btn.stumbleupon { background: #EB4823; }
.share-btn.reddit      { background: #ff5700; }
.share-btn.email       { background: #444444; }

.share-btn.twitter:hover     { background: #4c9ad6 }
.share-btn.google-plus:hover { background: #c64333; }
.share-btn.facebook:hover    { background: #2f4779; }
.share-btn.linkedin:hover    { background: #4069a2; }
.share-btn.stumbleupon:hover { background: #d3401f; }
.share-btn.reddit:hover      { background: #e54e00; }
.share-btn.email:hover       { background: #363636; }

/* Share Menu */
body.is-share-visible #wrapper {
  opacity: 0.15;
}

#share-menu {
  -moz-transform: translateX(25em);
  -webkit-transform: translateX(25em);
  -ms-transform: translateX(25em);
  transform: translateX(25em);
  -moz-transition: -moz-transform 0.5s ease, visibility 0.5s;
  -webkit-transition: -webkit-transform 0.5s ease, visibility 0.5s;
  -ms-transition: -ms-transform 0.5s ease, visibility 0.5s;
  transition: transform 0.5s ease, visibility 0.5s;
  -webkit-overflow-scrolling: touch;
  background: #ffffff;
  border-left: solid 1px rgba(160, 160, 160, 0.3);
  box-shadow: none;
  height: 100%;
  max-width: 80%;
  overflow-y: auto;
  position: fixed;
  right: 0;
  top: 0;
  visibility: hidden;
  width: 25em;
  z-index: 10002;
}

#share-menu > * {
  border-top: solid 1px rgba(160, 160, 160, 0.3);
  padding: 3em;
}

#share-menu > * > :last-child {
  margin-bottom: 0;
}

#share-menu > :first-child {
  border-top: 0;
}

#share-menu .links {
  list-style: none;
  padding: 0;
}

#share-menu .links > li {
  border: 0;
  border-top: dotted 1px rgba(160, 160, 160, 0.3);
  margin: 0.7em 0 0 0;
  padding: 1em 0 0 0;
}

#share-menu .links > li a {
  display: block;
  border-bottom: 0;
}

#share-menu .links > li a h3 {
  -moz-transition: color 0.2s ease;
  -webkit-transition: color 0.2s ease;
  -ms-transition: color 0.2s ease;
  transition: color 0.2s ease;
  font-size: 0.7em;
}

#share-menu .links > li a p {
  font-family: "Raleway", Helvetica, sans-serif;
  font-size: 0.6em;
  font-weight: 400;
  letter-spacing: 0.25em;
  margin-bottom: 0;
  text-decoration: none;
  text-transform: uppercase;
}

#share-menu .links > li a:hover h3 {
  color: #ffffff;
}

#share-menu .links > li:first-child {
  border-top: 0;
  margin-top: 0;
  padding-top: 0;
}

body.is-share-visible #share-menu {
  -moz-transform: translateX(0);
  -webkit-transform: translateX(0);
  -ms-transform: translateX(0);
  transform: translateX(0);
  visibility: visible;
}

@media screen and (max-width: 736px) {

  #share-menu > * {
    padding: 1.5em;
  }

}

.post {
  margin: 0 0 2em 0;
}

#content img {
  max-width: 100%;
}

#content p a, #content ul li a {
  border-bottom: dotted 2px rgba(160,160,160,.65);
}

#content p a:hover {
  border-bottom-color: transparent;
}

#content blockquote, #content p, #content ul{
  margin: 0 0 1em;
}

ul.pagination li {
  padding-top: 1em;
}

ul.pagination .button {
  line-height: 2.5em;
  height: auto;
  white-space: normal;
  padding-top: 1em;
  padding-bottom: 1em;
}

#back-to-top {
  background-color: white;
  bottom: 5px;
  color: #aaaaaa;
  display: none;
  position: fixed;
  right: 5px;
}

#back-to-top.btt-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
  opacity: .5;
}
