@charset "utf-8";
html, body {
  margin:0;
  padding:0;
  border:0;
  background:transparent;
}
html {
  display:flex;
  background-color:#dddddd;
}
body {
  color:#000000;
  max-width:940px;
  margin:0 auto;
  background-color:#ffffff;
  padding-bottom:100px;
}
img, picture, video, canvas, svg {
  display:block; max-width:100%;
}
img {
  border:0;
  -ms-interpolation-mode:bicubic;
  vertical-align:middle;
}
ul {
  padding-left:15px;
}
a {
  text-decoration:none;
}
a:visited {
  color:#828282;
}
.bar {
  height:20px;
  color:white;
  background-color:#222222;
  font-size:x-small;
  display: flex;
  align-items:center;
  justify-content:right;
  padding-right:3px;
}
li {
  padding-bottom:10px;
}
main {
  padding:0 5px;
  display:flex;
  flex-direction:row;
}
nav {
  font-family:monospace,monospace;
  font-size:smaller;
  flex-grow: 0;
  flex-shrink: 0;
  flex-basis: 165px;
  padding:0 25px 0 15px;
}
nav ul {
  list-style-type:none;
  margin:0;
  padding:0;
}
article {
  padding:0 5px;
}
@media (max-width:600px) {
  main {
    display:flex;
    flex-direction:column;
  }
  nav {
    padding:0;
    margin:auto;
    width:100%;
    text-align:center;
  }
  nav ul {
    padding-top:5px;
  }
  .menu {
    display:none;
  }
}