@import 'vendor/casper';
@import 'casper_override';
@import 'syntax';
@import 'icons';
@import 'merriweather';
@import 'open_sans';

.home-button {
  @extend .menu-button;
  float: left;
  transition: none;
}

/* When the navigation is closed */
.nav-opened .home-button {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.6);
  background: transparent;
}
/* When the navigation is closed and there is no cover image */
.nav-opened .no-cover .home-button {
  color: #9EABB3;
  border-color: #BFC8CD;
  background: transparent;
}

.byline {
  font-size: 1.8rem;
  line-height: 1;
  color: rgba(255, 255, 255, 0.8);

  a {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
  }

  > span {
    display: block;
    margin: 2em 0 1rem 0;
  }
}

.profile-links a {
  margin: 1rem .8rem 1.6rem .8rem;
  text-decoration: none;
}

.profile-links-verbose a {
  margin: 0 .5em;
}

p, .profile-links-verbose {
  a[class^="icon-"]:before, a[class*=" icon-"]:before {
    margin-right: .25em;
  }
}

.author-meta span.hidden {
  display: none;
}

.archive-template .author-profile .author-bio {
  display: none;
}

.left {
  float: left;
  margin: 0 1rem .75rem 0;
}
.right {
  float: right;
  padding: 0 0 .75rem 1rem;
}

.post-content figure {
  p {
    margin: 0;
  }

  img {
    padding: .4em 0;
  }
}

figcaption {
  display: block;

  font-style: normal;
  text-align: center;

  font-size: 1.4rem;
  line-height: 1.75em;
}

.license {
  display: block;
  width: 45%;
  float: right;
  text-align: right;
}

// From https://www.ostraining.com/blog/coding/responsive-videos/
.video-responsive {
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.video-responsive iframe {
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}