<style type="text/css">

/* @font-face { */
/*     font-family: "BerkeleyMono"; */
/*     src: url('../fonts/BerkeleyMonoVariable-Regular.ttf') format('truetype'), */
/*          url('../fonts/BerkeleyMonoVariable-Regular.woff') format('woff'), */
/*          url('../fonts/BerkeleyMonoVariable-Regular.woff2') format('woff2'); */
/*     font-weight: normal;  */
/*     font-style: normal;  */
/* } */

@font-face {
    font-family: "BerkeleyMono";
    src: url('../fonts/BerkeleyMono-Regular.ttf') format('truetype'),
         url('../fonts/BerkeleyMono-Regular.woff') format('woff'),
         url('../fonts/BerkeleyMono-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "BerkeleyMono";
    src: url('../fonts/BerkeleyMono-Bold.ttf') format('truetype'),
         url('../fonts/BerkeleyMono-Bold.woff') format('woff'),
         url('../fonts/BerkeleyMono-Bold.woff2') format('woff2');
    font-weight: bold;
    font-style: normal;
}

body{
	  margin:0;
	  padding:0;
	  font-family: Georgia, Palatino, Times New Roman, serif;
	  line-height: 1.5em;
}

main {
	  padding-bottom: 10010px;
	  margin-bottom: -10000px;
	  float: left;
	  width: 100%;
	  background: #fffafa
}

#nav {
	  float: left;
	  width: 330px;
	  margin-left: -330px;
	  padding-bottom: 10010px;
	  margin-bottom: -10000px;
	  background: #eee;
}

#wrapper {
	  overflow: hidden;
}

#content {
	  margin-right: 330px; /* Same as 'nav' width */
}

.innertube{
	  margin: 15px; /* Padding for content */
	  margin-top: 0;
}

.image-container {
    display: flex;
    justify-content: center;
}

p {
    color: #555;
}

nav ul {
	  list-style-type: none;
	  margin: 0;
	  padding: 0;
}

nav ul a {
	  color: darkgreen;
	  text-decoration: none;
}

</style>
