input.sidebar-checkbox {
  position: fixed;
}

.sidebar {
  width: 17rem;
}

.sidebar-toggle {
  left: 2rem;
  position: fixed;
}

.sidebar a {
  text-decoration: none;
  outline: none;
}

.sidebar-nav ul {
    padding-left: 25px;
}

nav.sidebar-nav a.current-page {
  color: black;
  background-color: white;
}

nav.sidebar-nav h1 {
  color: white;
}

nav.sidebar-nav h2, nav.sidebar-nav h3 {
  color: white;
}

.collapsible {
    list-style-type: none;
}

.collapsible {
    list-style-type: none;
    margin-left: -15px;
}

li.collapsible > :first-child::before {
    content: "▾";
    margin-right: 10px;
    font-style: normal;
    color: lightgray;
    font-size: unset;
}

li.collapsible.collapsed > :first-child::before {
    content: "▸";
    margin-right: 10px;
    font-style: normal;
    color: lightgray;
    font-size: unset;
}

html {
  line-height: 1.5em !important;
  font-size: 16px !important;
}

pre {
  overflow-x: auto;
  white-space: pre !important;
}

code {
  font-size: 1em !important;
  word-wrap: break-word;
}

.masthead{
  margin-bottom:0 !important;
}

#sidebar-checkbox:checked ~ .sidebar-toggle {
  left: 4em;
}

.footer {
  margin-top : 3rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  border-top: 1px solid #eee;
  text-align: center;
}

div.wrap h2{
  font-size: 1.75rem;
  margin-top: 1.75rem;
  margin-bottom: 1.5rem;
}

div.wrap h3{
  font-size: 1.5rem;
  margin-top: 1.5rem;
  margin-bottom: 1.25rem;
}

div.wrap h4{
  font-size: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1rem;
}

@media (min-width: 30em) {
  .sidebar {
    font-size: 1rem;
  }
}

@media (min-width: 48em){
  .sidebar-item {
    padding: 1rem !important;
  }
  .sidebar {
    width: 20rem;
  }
  #sidebar-checkbox:checked ~ .sidebar-toggle {
    left: 8em;
  }
}

@media (min-width: 70em){
  .container {
    max-width: 48rem;
  }
}

@media (min-width: 100em){
  .container {
    max-width: 60rem;
  }
}

/*--------------Adds anchor to headers for deep link-------------------------*/
/*
 * This code is courtesy Ben Balter, modified by Parker Moore for jekyllrb.com
 * http://ben.balter.com/2014/03/13/pages-anchor-links/
 */
.header-link {
  position: relative;
  left: 0.5em;
  opacity: 0;
  font-size: 0.8em;
  color: grey;

  -webkit-transition: opacity 0.2s ease-in-out 0.1s;
  -moz-transition: opacity 0.2s ease-in-out 0.1s;
  -ms-transition: opacity 0.2s ease-in-out 0.1s;
}
h2:hover .header-link,
h3:hover .header-link,
h4:hover .header-link,
h5:hover .header-link,
h6:hover .header-link {
  opacity: 1;
}