:root {
  font-family:
    system-ui,
    Avenir,
    Helvetica,
    Arial,
    sans-serif;
  line-height: 1.5;
  font-weight: 400;
  color-scheme: light dark;
  color: #ffffffde;
  background-color: #242424;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 100%;
}
a {
  font-weight: 500;
  color: #646cff;
  text-decoration: inherit;
}
a:hover {
  color: #535bf2;
}
body {
  display: flex;
  place-items: center;
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  font-family:
    -apple-system,
    BlinkMacSystemFont,
    Segoe UI,
    Roboto,
    Oxygen,
    Ubuntu,
    Cantarell,
    Fira Sans,
    Droid Sans,
    Helvetica Neue,
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#root {
  width: 100%;
}
code {
  font-family:
    source-code-pro,
    Menlo,
    Monaco,
    Consolas,
    Courier New,
    monospace;
}
.bioImage {
  -webkit-mask-image:
    linear-gradient(
      to right,
      black 90%,
      transparent 100%),
    linear-gradient(
      to bottom,
      black 90%,
      transparent 100%);
  mask-image:
    linear-gradient(
      to right,
      black 50%,
      transparent 100%),
    linear-gradient(
      to bottom,
      black 90%,
      transparent 100%);
  -webkit-mask-composite: destination-in;
  mask-composite: intersect;
}
.bioText p {
  font-size: 20px;
  margin: 7px 0;
  line-height: 22px;
}
#HeaderBg svg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
#bellCurve {
  width: 100%;
  min-height: 505px;
  animation: waveMorph 3s infinite;
}
@keyframes waveMorph {
  0%, to {
    d: path("M 0,150 Q 100,150 200,50 T 400,150 T 600,150 T 800,150");
  }
  33% {
    d: path("M 0,150 Q 100,150 200,150 T 400,50 T 600,150 T 800,150");
  }
  66% {
    d: path("M 0,150 Q 100,150 200,150 T 400,150 T 600,50 T 800,150");
  }
}