/***** Navbar Styling *****/
nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 18vw;
  height: 100vh;
  background: #401F68; /* For browsers that do not support gradients */
  background: -webkit-linear-gradient(#401F68, #4E2A84); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(#401F68, #4E2A84); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(#401F68, #4E2A84); /* For Firefox 3.6 to 15 */
  background: linear-gradient(#401F68, #4E2A84); /* Standard syntax */
}

nav ul {
  list-style-type: none;
}

nav li {
  margin-left: 20px;
  margin-right: 10px;
}

nav a {
  display: none;
  text-align: left;
  text-decoration: none;
  font-size: 1em;
  padding: 0.75em 0;
}

nav a, nav i {
  color: white;
}

nav i {
  font-size: 2em;
}

nav .menuIcon, nav.show .closeMenuIcon {
  margin-left: 0;
}

nav .menuIcon a, nav.show .closeMenuIcon a {
  display: block;
  text-align: center;
}

nav.show ul.topMenu {
  height: 80vh;
  overflow-y: scroll;
}

nav.show a {
  display: block;
}

nav.show .menuIcon a {
  display: none;
}

nav.show {
  width: 50vw;
}

header {
  margin-left: 20vw;
}

main {
  margin-left: 20vw;
}

footer {
  margin-left: 20vw;
}