@import 'https://fonts.googleapis.com/css?family=Lato:400,700'; 
div.main-body {
  display: grid;
  grid-template-columns: minmax(200px, auto) 1fr;
  grid-template-areas: "navbar mainContent";
  grid-gap: 20px;
}

nav#navbar {
  grid-area: navbar;
  position: fixed;
}

nav#navbar a {
  display: block;
  border: 1px solid black;
  padding: 5px;
  margin: 10px 0;
  text-decoration: none;
  color: black;
}

main#main-doc {
  grid-area: mainContent;
}

header{
  font-size: 1.5em;
  font-weight: bold;
}

code {
  background-color: #CCC;
  display: block;
  padding: 20px;
}

@media screen and (max-width: 750px){
  div.main-body  {
    grid-template-columns: 1fr;
    grid-template-areas: "navbar" "mainContent";
  }
  nav#navbar {
    position: inherit;
  }
  
}