body {
  font-family: "Montserrat";
  min-height: 100vh;
  background-color: white;
  background-image: url("/bg.svg");
  background-attachment: fixed;
  background-size: cover;

  display: flex;
  flex-direction: column;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: underline;
  color: black;
}

a:hover {
  text-decoration: none;
}

.container {
  width: 100%;
  max-width: 96rem;
  margin-inline: auto;
}

nav.navigation {
  font-size: 1.25rem;
  background-image: url("/nav-mid.svg");
  background-size: cover;
  border-style: none none solid none;
  border-width: 1px;
  border-radius: 0 0 .375rem .375rem;

  display: flex;
  align-items: center;
  flex-direction: row;
  flex-wrap: wrap;
}

nav.navigation > a.name {
  font-weight: bold;
  color: black;
  text-decoration: none;
  flex-grow: 1;
}

nav.navigation > a.name > span {
  background-color: white;
}

nav.navigation > span.links {
  display: flex;
  flex-flow: row;
  flex-wrap: wrap;
  justify-self: end;
}

nav.navigation > span.links > a {
  font-weight: bold;
  background-color: white;
  margin: .5rem;
}

div.float-img {
  display: block;
  float: right;
  max-width: 350px;

  border-style: solid;
  border-width: 1px;
  margin: .5em;
}

@media (max-width: 550px) {
  div.float-img {
    float: unset;
    margin-left: auto;
    margin-right: auto;
  }
}

div.float-img > img {
  object-fit: scale-down;
  width: 100%;
}

main > section {
  margin-top: 1.5em;
}

main > section > h1 {
  font-weight: bold;
  font-size: 1.25rem;
}

dl.projects > dt {
  font-weight: 500;
} 

div.contacts {
  display: grid;
  grid-template-columns: repeat(3, min-content) auto;
  gap: .5em;
}

img.icon {
  display: inline-block;
  height: 1.3em;
  margin-left: auto;
  margin-right: auto;
  vertical-align: middle;
}

ul.education {
  list-style: none;
  display: grid;
  grid-template-columns: min-content auto;
  gap: .5em;
  padding: 0;
}

ul.awards {
  list-style: none;
  display: grid;
  grid-template-columns: min-content auto;
  gap: .5em;
  padding: 0;
}

div.talk {
  margin-bottom: .75em;
}

div.talk > div.title > .name {
  font-weight: bold;
}

div.talk > div.authors {
  margin-left: 2em;
  margin-top: .2em;
}

div.invited-talks {
  margin-bottom: .5em;
}

div.invited-talks > ul {
  list-style: none;
  margin-left: 2em;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
  padding: 0;
}

div.publication {
  margin-bottom: .75em;
}

div.publication > div.title > .name {
  font-weight: bold;
}

div.publication > div.authors {
  margin-left: 2em;
  margin-top: .2em;
}

.footer-padding {
  flex-grow: 1;
}

footer {
  text-align: center;
  padding: .75rem;
  margin-left: auto;
  margin-right: auto;
}

@font-face {
  font-family: "Bangers";
  src: url(/fonts/Bangers-Regular.ttf) format("truetype");
}

@font-face {
  font-family: "Montserrat";
  src: url(/fonts/Montserrat-VariableFont_wght.ttf) format("truetype");
}

@font-face {
  font-family: "FiraSans";
  src: url(/fonts/FiraSans-Regular.ttf) format("truetype");
}

@font-face {
  font-family: "Source Code Pro";
  src: url(/fonts/SourceCodePro-VariableFont_wght.ttf) format("truetype");
}