* { box-sizing: border-box; }

html, body { height: 100%; background: #bbb; }

body { padding: 0; margin: 0; font-family: roboto, sans-serif; }

h1, h2, h3, h4, h5 { font-family: "Courier New", Courier, monospace; margin: 0; }

h2 { color: #555; font-size: 20px; }

ul { padding-left: 0; }

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

nav { text-align: center; height: 32px; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; }

nav .links { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: space-around; -ms-flex-pack: distribute; justify-content: space-around; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; -webkit-align-items: start; -ms-flex-align: start; align-items: start; max-width: 100%; background-color: #555; height: 32px; }

nav .links a { height: 28px; line-height: 28px; border-radius: 0 0 8px 8px; -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; margin: 0 8px; background-color: #888; text-decoration: none; text-transform: uppercase; letter-spacing: 4px; font-family: "Courier New", Courier, monospace; font-weight: 900; }

nav .links a.current { background-color: #ddd; color: #222; }

.content-container { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: calc(100% - $navheight); }

.content-container .content { -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; max-width: 100%; background-color: #ddd; color: #222; padding: 20px; overflow-x: hidden; overflow-y: auto; }

.content-container .content section { margin-bottom: 64px; }

.content-container .content section.edu li, .content-container .content section.work li { margin: 16px 0; }

.content-container .content section.edu li .title, .content-container .content section.edu li .subtitle, .content-container .content section.edu li .position, .content-container .content section.edu li .timeline, .content-container .content section.work li .title, .content-container .content section.work li .subtitle, .content-container .content section.work li .position, .content-container .content section.work li .timeline { font-family: "Courier New", Courier, monospace; }

.content-container .content section.edu li .title, .content-container .content section.work li .title { font-size: 16px; font-weight: 600; }

.content-container .content section.edu li .subtitle, .content-container .content section.edu li .position, .content-container .content section.work li .subtitle, .content-container .content section.work li .position { font-style: italic; }

.content-container .content section.edu li .timeline, .content-container .content section.work li .timeline { font-style: italic; color: #555; }

.content-container .content section.edu p, .content-container .content section.work p { margin: 16px 0; }

.content-container .content img.thumb { max-width: 128px; }

.content-container .content img.circular { border-radius: 50%; }

.content-container .content img.rounded { border-radius: 8px; }

.content-container .content .main-links li { border: 2px solid #222; background-color: #bbb; margin: 16px 32px; padding: 4px; }

.content-container .content .flex-between { -webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; }

.content-container .content .flex, .content-container .content .flex-around, .content-container .content .flex-between { display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-align-items: center; -ms-flex-align: center; align-items: center; }

.content-container .content .flex *, .content-container .content .flex-around *, .content-container .content .flex-between * { -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; }

.content-container .content .flex .stretch, .content-container .content .flex-around .stretch, .content-container .content .flex-between .stretch { -webkit-flex: 1 1 auto; -ms-flex: 1 1 auto; flex: 1 1 auto; }

.content-container .content .padded { padding: 24px; }

.content-container .sidebar { display: none; width: 200px; padding: 16px; background-color: #ddd; }

.content-container .sidebar h2 { margin-top: 16px; }

.content-container .sidebar ul.posts li, .content-container .sidebar ul.links li { margin: 16px 0; }

section.post p.date { font-style: italic; }

section.post p img { width: 80%; margin: 32px 0 32px 10%; }

section.post ul { padding-left: 40px; }

section.post ul li { list-style-type: disc; }

@media only screen and (min-width: 768px) { nav .links { max-width: 800px; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } nav .links a { height: 24px; line-height: 24px; -webkit-flex: 0 1 auto; -ms-flex: 0 1 auto; flex: 0 1 auto; border-radius: 8px; padding: 0 64px; letter-spacing: 4px; } .content-container .content { max-width: 800px; } .content-container .content section .flex-between { -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; } .content-container .content img.thumb { max-width: 256px; margin: 0 32px; } }

@media only screen and (min-width: 1200px) { nav .links { max-width: 1200px; } .content-container .content { max-width: 1000px; } .content-container .sidebar { display: initial; width: 200px; } }

/*# sourceMappingURL=styles.css.map */