/*
 * --------------------------  Sidebar -----------------------
 */

 .sidebar {
  text-align: center;
  padding: 2rem 1rem;
  color: rgba(255,255,255,.5);
  background-color: #202020;
}
@media (min-width: 48em) {
  .sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: 18rem;
    text-align: left;
  }
  .sidebar-sticky {
    position: absolute;
    left:   1rem;
    right:  1rem;
    bottom: 2rem;
  }
}

/* -------------------------- Sidebar links ----------------------- */
.sidebar a {
  color: #fff;
}


/* -------------------------- About section ----------------------- */
.sidebar-about-title {
  color: #fff;
  margin-top: 0;
  font-family: "Abril Fatface", serif;
  font-size: 2.25rem;
}

/* -------------------------- Sidebar nav ----------------------- */
.sidebar-nav {
  padding-left: 0;
  list-style: none;
}
.sidebar-nav-item {
  display: block;
}
a.sidebar-nav-item:hover,
a.sidebar-nav-item:focus {
  text-decoration: underline;
}
.sidebar-nav-item.active {
  font-weight: bold;
}

/* -------------------------- Sidebar copyright ----------------------- */
.sidebar-copyright {
  font-size: 0.8rem;
}

/* Container
 *
 * Align the contents of the site above the proper threshold with some margin-fu
 * with a 25%-wide `.sidebar`.
 */

 .content {
  padding-top:    2rem;
  padding-bottom: 2rem;
}

@media (min-width: 48em) {
  .content {
    /* max-width: 64rem; */
    margin-left: 20rem;
    margin-right: 2rem;
  }
}