html {
  scroll-behavior: smooth; }

body {
  color: #3b3b3b;
  font-family: 'Fira Sans', sans-serif; }

.header {
  background-image: url("header.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center center; }

.header > div {
  background-color: rgba(var(--bs-light-rgb), 0.666) !important;
  margin: 6rem auto; }

@media only screen and (min-width: 992px) {
  .header > div {
    border-radius: 4px; } }
main {
  padding-top: 5rem; }

main h1 {
  padding-top: 5rem;
  margin-bottom: .66rem; }

nav {
  background-color: #639a00;
  font-weight: 600; }

table {
  margin: auto; }

td {
  padding: .25rem 1rem;
  min-width: 200px; }

.btn-outline-secondary {
  font-weight: 600; }

.btn-outline-secondary .download-icon {
  display: inline-block;
  height: 42px;
  width: 23px;
  margin: 0ex 1ex;
  background-image: url("download.png");
  transition: filter 0.15s; }

.btn-outline-secondary .upload-icon {
  display: inline-block;
  height: 42px;
  width: 27px;
  margin: 0ex 1ex;
  background-image: url("upload.png");
  transition: filter 0.15s; }

.btn-outline-secondary .download-text {
  display: inline-block;
  margin-right: 1ex;
  transform: translateY(-50%); }

.btn-outline-secondary:hover {
  color: #fff;
  background-color: #639a00;
  border-color: #639a00; }

.btn-outline-secondary:hover .download-icon {
  filter: invert(100%) saturate(0%) brightness(1000%) contrast(100%); }

.btn-outline-secondary:hover .upload-icon {
  filter: invert(100%) saturate(0%) brightness(1000%) contrast(100%); }

.keynote {
  padding: 0px; }

.keynote a {
  display: block;
  cursor: pointer;
  background-color: #e2e8d4;
  color: #3b3b3b;
  text-decoration: inherit;
  transition: transform 0.15s, max-width 0.15s;
  margin: 2em 0px; }

.keynote a:hover {
  transform: translateX(16px); }

.keynote .col-3 div {
  max-width: 160px;
  margin: auto 0 auto auto; }

.keynote img {
  width: 100%;
  margin: auto;
  border-radius: 100%;
  padding: 10px 0px 10px 10px; }

.keynote .col-9 {
  margin: auto; }

.profile {
  margin: 1.2rem 0px; }

.profile a {
  display: block;
  cursor: pointer;
  height: 64px;
  border-radius: 32px;
  background-color: #f8f9fa;
  color: #3b3b3b;
  text-decoration: inherit;
  max-width: 68ex;
  margin: auto;
  transition: transform 0.15s, max-width 0.15s; }

.profile a:hover {
  transform: translateX(16px);
  max-width: calc(68ex - 16px); }

.profile img {
  position: absolute;
  margin: 6px;
  height: 52px;
  width: 52px;
  border-radius: 100%;
  transition: margin-top 0.15s, margin-left 0.15s, height 0.15s, width 0.15s;
  object-fit: cover; }

.profile a:hover img {
  margin-top: -10px;
  margin-left: -26px;
  height: 84px;
  width: 84px; }

.profile div {
  position: relative;
  top: 32px;
  transform: translateY(-50%);
  padding: 0px 6px 0px 70px; }

.profile h5 {
  margin-bottom: 0rem; }

.profile p {
  font-size: small; }