:root {
  --default-link-color: #2d7696;
  --default-link-hover-color: #f4b350;
  --default-link-focus-color: #57ccff;
  --default-low-contrast-color: #3d5961;
  --default-lower-contrast-color: #283134;
  --default-body-background-color: #05181f;
  --default-font-color: hsl(0, 0%, 80%);
  --default-font-size: 1.6vw;
  --menu-item-color: var(--default-link-color);
  --menu-item-hover-color: var(--default-link-hover-color);
  --menu-item-focus-color: var(--default-link-focus-color);
  --breadcrumbs-color: var(--menu-item-color);
  
  --default-width-unit: 0.149vw;
  
  --header-top-space: 3vw;
  --header-bottom-space: 0.7vw;
  --header-height: calc(var(--header-top-space) + var(--header-bottom-space) + var(--nav-height) / 2 + var(--logo-font-size) / 2);
  --header-font-family: "Roboto", sans-serif;
  
  --nav-height: var(--menu-item-font-size);
  --menu-item-font-size: 1.7vw;
  --menu-item-spacing: calc(1.8 * var(--menu-item-font-size));
  --last-menu-item-spacing: calc(var(--header-top-space) / 2 + var(--menu-item-spacing) / 2);
  --menu-font-family: var(--header-font-family);
  --menu-item-transition-duration: 0.15s;
  
  --logo-top-offset: calc(-1 * 1.5 * var(--menu-item-font-size) / 10 / 2);
  --logo-font-size: calc(var(--menu-item-font-size) * 2.2);
  --logo-spacing: calc(var(--header-top-space) / 2 + var(--menu-item-spacing) / 2);
  --logo-font-family: var(--header-font-family);
  
  --breadcrumbs-container-top-offset: 0vw;
  --breadcrumbs-font-size: calc(var(--menu-item-font-size) / 1.4);
  --breadcrumbs-font-family: var(--header-font-family);
  
  --card-scale-transition-time: 0.1s;
  --card-border-radius: 0.8vw;
}


/* TODO Style general text selections */
* {
  margin: 0vw;
  padding: 0vw;
  box-sizing: border-box;
}

html, body {
  width: 100vw;
  min-height: 100vh;
  color: var(--default-font-color);
  /* TODO Choose font */
  font-family: var(--header-font-family);
  font-size: var(--default-font-size);
}

html {
  overflow-x: hidden;
  /* TODO Credit background author */
  /* TODO Automatically generate data URI from image */
  background: url("assets/pictures/tim-marshall-T-AOFf2B8Zw-unsplash-edited-50p-70q.jpg"),
    url("assets/pictures/tim-marshall-T-AOFf2B8Zw-unsplash-edited-15p-70q.jpg"),
    url("data:image/jpeg;base64,/9j/4QDiRXhpZgAASUkqAAgAAAAHABIBAwABAAAAAQAAABoBBQABAAAAYgAAABsBBQABAAAAagAAACgBAwABAAAAAgAAADEBAgAdAAAAcgAAADIBAgAaAAAAkAAAAGmHBAABAAAAqgAAAAAAAACA/AoAECcAAID8CgAQJwAAQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKQAAMjAyMC0wMi0xOFQwMjo1OTo0NCswMjowMAADAACQBwAEAAAAMDIyMAKgBAABAAAAnAAAAAOgBAABAAAAaAAAAAAAAABoAAAAAAD/7AARRHVja3kAAQAEAAAARgAA/+EILmh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8APD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxNDIgNzkuMTYwOTI0LCAyMDE3LzA3LzEzLTAxOjA2OjM5ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOkYzNkJBOTZBNTFFOTExRUFCNjhCRDMxQTAzREY2Qzk1IiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOkYzNkJBOTY5NTFFOTExRUFCNjhCRDMxQTAzREY2Qzk1IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9IjY2OTE1MUZENkNDNTQ2MjkyNjg3MjVFN0ZGRjM0QjVBIiBkYzpmb3JtYXQ9ImltYWdlL2pwZWciIHhtcDpDcmVhdGVEYXRlPSIyMDIwLTAyLTE2VDAyOjE2OjIyKzAyOjAwIiB4bXA6TW9kaWZ5RGF0ZT0iMjAyMC0wMi0xOFQwMjo1OTo0NCswMjowMCIgeG1wOk1ldGFkYXRhRGF0ZT0iMjAyMC0wMi0xOFQwMjo1OTo0NCswMjowMCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0ic2F2ZWQiIHN0RXZ0Omluc3RhbmNlSUQ9InhtcC5paWQ6OGE1YmZlNDUtZDAxOC1hMzQ1LWI0OTktNGE3OTlhZTUxM2I2IiBzdEV2dDp3aGVuPSIyMDIwLTAyLTE2VDAyOjU1OjI1KzAyOjAwIiBzdEV2dDpzb2Z0d2FyZUFnZW50PSJBZG9iZSBQaG90b3Nob3AgQ0MgKFdpbmRvd3MpIiBzdEV2dDpjaGFuZ2VkPSIvIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJjb252ZXJ0ZWQiIHN0RXZ0OnBhcmFtZXRlcnM9ImZyb20gaW1hZ2UvanBlZyB0byBhcHBsaWNhdGlvbi92bmQuYWRvYmUucGhvdG9zaG9wIi8+IDxyZGY6bGkgc3RFdnQ6YWN0aW9uPSJkZXJpdmVkIiBzdEV2dDpwYXJhbWV0ZXJzPSJjb252ZXJ0ZWQgZnJvbSBpbWFnZS9qcGVnIHRvIGFwcGxpY2F0aW9uL3ZuZC5hZG9iZS5waG90b3Nob3AiLz4gPHJkZjpsaSBzdEV2dDphY3Rpb249InNhdmVkIiBzdEV2dDppbnN0YW5jZUlEPSJ4bXAuaWlkOjBiZTc1MjZlLThhZWEtZjI0YS1hNmUxLTk2ZjI3OGQ0OGUyNyIgc3RFdnQ6d2hlbj0iMjAyMC0wMi0xNlQwMjo1NToyNSswMjowMCIgc3RFdnQ6c29mdHdhcmVBZ2VudD0iQWRvYmUgUGhvdG9zaG9wIENDIChX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");
  background-attachment: fixed;
  background-color: var(--default-body-background-color);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 50% 0%;
}

a {
  text-decoration: none;
  outline: none;
  color: var(--default-link-color);
}

a:focus {
  text-decoration: none;
  outline: none;
  color: var(--default-link-focus-color);
}

a:hover {
  text-decoration: none;
  outline: none;
  color: var(--default-link-hover-color);
}

/* TODO Update styling for font, colors, border, behaviour, etc. */
input {
  outline: none;
  padding: 1vw;
  font-size: var(--default-font-size);
  background-color: var(--default-font-color);
  border: 0.12vw inset var(--default-link-color);
}

input:focus {
  outline: none;
}

input:hover {
  outline: none;
}

/* TODO Add background to header to make the menu contrast more */
header {
  position: fixed;
  z-index: 1;
  width: 100vw;
  height: var(--header-height);
  /* TODO Find a workaround for the header background in firefox */
  backdrop-filter: contrast(70%) brightness(35%) blur(0.2vw);
  -webkit-mask-image: linear-gradient(to bottom, black 0vw, black calc(var(--header-top-space) + var(--nav-height) / 2 + var(--logo-font-size) / 2), transparent var(--header-height));
  mask-image: linear-gradient(to bottom, black 0vw, black calc(var(--header-top-space) + var(--nav-height) / 2 + var(--logo-font-size) / 2), transparent var(--header-height));
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

/* TODO Style menu text selections */
nav {
  position: absolute;
  right: 0vw;
  top: var(--header-top-space);
  /* TODO Change vertical alignment of text to be at the middle of the nav */
  height: var(--nav-height);
  display: flex;
  font-family: var(--menu-font-family);
}

nav a {
  position: relative;
  margin-right: calc(var(--menu-item-spacing) / 2);
  margin-left: calc(var(--menu-item-spacing) / 2);
  font-size: var(--menu-item-font-size);
  z-index: 1;
  color: var(--menu-item-color);
  transition: color var(--menu-item-transition-duration), text-shadow var(--menu-item-transition-duration);
}

nav a:first-of-type {
  margin-left: var(--menu-item-spacing);
}

nav a:last-of-type {
  margin-right: var(--last-menu-item-spacing);
}

nav a:focus {
  color: var(--menu-item-focus-color);
  outline: 0vw;
}

nav a:hover {
  color: var(--menu-item-hover-color);
  text-shadow: 0vw 0vw calc(var(--menu-item-font-size) / 2) black;
}

nav a::before {
  position: absolute;
  top: calc(-1 * var(--menu-item-spacing) / 4);
  left: calc(-1 * var(--menu-item-spacing) / 4);
  right: calc(-1 * var(--menu-item-spacing) / 4);
  bottom: calc(-1 * var(--menu-item-spacing) / 4);
  z-index: -1;
  content: "";
}

#breadcrumbs {
  position: absolute;
  left: 0vw;
  top: calc(var(--header-top-space) + var(--nav-height) / 2 - var(--logo-font-size) / 2 + var(--breadcrumbs-container-top-offset));
  /* TODO Change vertical alignment of text to be at the middle of the nav */
  display: flex;
  align-items: center;
}

/* TODO Properly set margins around logo */
#breadcrumbs #logo {
  position: relative;
  top: var(--logo-top-offset);
  margin-left: var(--logo-spacing);
  font-size: var(--logo-font-size);
  font-family: var(--logo-font-family);
  color: var(--menu-item-color);
  transition: color var(--menu-item-transition-duration), text-shadow var(--menu-item-transition-duration);
}

/* TODO Properly space breadcrumbs and their before > */
/* TODO Properly format breadcrumbs */
#breadcrumbs a:not(#logo) {
  position: relative;
  margin-left: calc(var(--menu-item-spacing) / 4);
  font-size: var(--breadcrumbs-font-size);
  font-style: italic;
  font-family: var(--menu-font-family);
  color: var(--breadcrumbs-color);
  z-index: 1;
  transition: color var(--menu-item-transition-duration), text-shadow var(--menu-item-transition-duration);
  filter: grayscale(100%);
}

/* TODO Properly format hover and focus for breadcrumbs */
#breadcrumbs a:not(#logo):hover {
  filter: grayscale(0%);
  text-shadow: 0vw 0vw calc(var(--menu-item-font-size) / 2) var(--menu-item-hover-color);
}

#breadcrumbs a:not(#logo):focus {
  outline: 0vw;
  color: var(--menu-item-focus-color);
  filter: grayscale(0%);
}

#breadcrumbs a:nth-of-type(n+2):not(:last-of-type)::after {
  content: ">";
  margin-left: calc(var(--menu-item-spacing) / 4);
  color: var(--breadcrumbs-color);
  filter: grayscale(100%);
}

#breadcrumbs #logo:focus {
  color: var(--menu-item-focus-color);
  outline: 0vw;
}

#breadcrumbs #logo:hover {
  color: var(--menu-item-hover-color);
  text-shadow: 0vw 0vw calc(var(--menu-item-font-size) / 2) black;
}

#bodyContainer {
  height: calc(100vh);
  padding-top: calc(1.3 * var(--header-height));
  padding-bottom: 0vw;
  display: flex;
}

#body {
  margin: auto;
  text-align: center;
}

.card {
  padding: 2vw;
  border-radius: var(--card-border-radius);
  border: var(--default-width-unit) solid var(--default-link-color);
  cursor: pointer;
  display: inline-block;
  background-color: rgba(5, 30, 37, 0.8);
  animation: fadein 0.7s;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transition: transform var(--card-scale-transition-time);
}

.card:focus, .card:focus-within {
  border: 0.12vw solid var(--default-link-focus-color);
  box-shadow: 0vw 0vw 1vw 0vw black;
  transform: scale(1.02, 1.02);
  outline: none;
}

.card:hover {
  border: 0vw solid var(--default-link-hover-color);
  box-shadow: 0vw 0vw 0.8vw 0vw var(--default-link-color);
  background-color: rgba(5, 30, 37, 0.9);
  transform: scale(1.02, 1.02);
}

.card:focus:hover, .card:focus-within:hover {
  border: 0.12vw solid var(--default-link-focus-color);
}

.card, .card:hover, .card:focus {
  color: var(--default-font-color);
}

.card .cardLink {
  color: var(--default-link-color);
}

.card:focus .cardLink {
  color: var(--default-link-focus-color);
}

.card:hover .cardLink {
  color: var(--default-link-hover-color);
}

.simpleText {
  text-shadow: 0vw 0vw 0.6vw black, 0vw 0vw 1vw black;
}

@keyframes fadein {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}