body {
  margin: 0;
  background: #EEEEEE; }
  body a {
    color: #C51162;
    text-decoration: none; }
    body a:hover, body a:focus {
      text-decoration: underline; }

* {
  font-size: 16px;
  line-height: 1.5em;
  font-family: 'roboto', sans-serif;
  font-weight: 300; }

#container {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start; }
  #container h1 {
    font-size: 2em; }
  #container h2 {
    font-size: 1.5em; }
  #container p {
    font-size: 1em; }

#container > * {
  width: 45em;
  margin: 1em; }

@media all and (max-width: 45em) {
  #container > * {
    width: 100%; } }
#header {
  box-shadow: 0 10px 5px -10px;
  background: #2196F3;
  padding: 1em; }
  #header h1 {
    font-size: 4em;
    color: white; }

#topbox {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  flex-direction: row;
  justify-content: space-around;
  align-items: flex-start;
  background: white; }

#topbar > * {
  max-width: 100%; }
  #topbar > * h1 h2 {
    color: #2196F3; }

#bio-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
  order: 2; }

@media all and (max-width: 45em) {
  #topbox {
    flex-direction: column;
    align-items: stretch; }

  #bio-bar {
    flex-direction: row;
    order: 1; } }
#picture {
  padding: 1em; }

#contact {
  padding: 1em; }
  #contact h2 {
    color: #2196F3; }

#about {
  padding: 0.5em; }

@media all and (max-width: 45em) {
  .about {
    order: 2; } }
.mini-header {
  background: #2196F3;
  color: white;
  font-size: 3em;
  padding: 0.5em; }

.mini-header-alt {
  background: #C51162;
  color: white;
  font-size: 3em;
  padding: 0.5em; }

.card {
  padding: 1em;
  box-shadow: 0 11px 5px -10px;
  background: white; }
  .card h1 {
    background: #2196F3;
    color: white; }
  .card h2 {
    background: white;
    color: #2196F3; }
  .card b, .card strong {
    font-family: 'Roboto', sans-serif;
    font-weight: 500; }
  .card em {
    font-family: 'Roboto', sans-serif;
    font-weight: 300;
    font-style: italic; }
  .card code {
    font-family: 'Inconsolata', monospace;
    font-weight: 500; }

#drafts, #thesis, #pubs, #invite {
  padding: 0.5em; }

.bibtable {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0 0.5em; }

.bibcell {
  vertical-align: top;
  padding: 0.5em; }

.titlecell, .titlecell *, .yearcell {
  font-family: 'Roboto', sans-serif;
  font-weight: 500; }

.linkscell {
  float: right; }

footer * {
  text-align: center;
  background: #2196F3;
  margin: 0; }
  footer * a {
    color: inherit;
    text-decoration: none; }
    footer * a:hover, footer * a:focus {
      text-decoration: underline; }