/* CSS Variables defined in ./global.css */
body {
  --header-background: #eee;
}
body.dark {
  --header-background: #292929;
}
body.dark .apiLabel{
  color: black;
}
.doc-link:hover{
  color:blue;
}

#rnLogo{
  width:15%;
}
header.landing{
  width: 100%;
  height: 90vh;
  padding: 20vh 300px;
  background-color: var(--header-background);
  overflow-y: hidden;
  position: relative;
  text-align: center;
}

header.landing h1{
  margin: 10px 0px;
  font-size: 50pt;
}

h2 {
  font-size: 26pt;
}

h3 {
  font-size: 20pt;
  margin: 40px 0px 10px 0px !important;
}
.header-bio {
  font-size: 18pt;
  position: relative;
  z-index: 1;
}

main {
  padding: 100px 200px;
}


nav.side-nav {
  display: none;
}
.contributor {
  padding: 10px;
  display: inline-block;
}
@media (max-width: 768px) {
  header.landing {
    height: 80vh;
    padding: 150px 20px 100px 20px;
  }
  header.landing .header-bio {
    font-size: 14pt;
  }
  header.landing .header-abell-logo {
    opacity: .1;
  }
  #rnLogo{
    width:35%;
  }
  h2{
    font-size: 1.5rem;
  }
  main {
    padding: 100px 30px;
  }

  /* Overrride nav styles for index */
  nav.side-nav {
    display: inline-block;
    padding-top: 30px !important;
  }
  nav.side-nav br:not(:first-child), nav.side-nav hr {
    display: none;
  }
}