:root {
  color-scheme: light dark;
}

@font-face {
  font-family: Rennie_Mackintosh_ITC;
  src: url(Rennie_Mackintosh_ITC_Bold.ttf);
  font-weight: bold;
  font-style: normal;
}

.Mackintosh {
  font-family: RennieMackintosh;
}

body {
  margin: auto;
  background-color: light-dark(#fef4d1,#7a7482);
  max-width: 800px;
}

#header {
  display: flex;
  justify-content: space-around;
  margin: 15px auto 15px auto;
}

#itp-title {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

#itp-title h1 {
  font-size: 24px;
  margin: 0;
}

#itp-title h2 {
  font-size: 19px;
  margin: 0;
}

#itp-logo {
  width: 128px;
  display: flex;
  flex-direction: column;
  font-family: Rennie_Mackintosh_ITC;
  font-weight: bold;
  font-size: 35px;
}

#itp-logo > div {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#itp-logo > .mackintosh-rose {
  filter: invert(88%) sepia(9%) saturate(5405%) hue-rotate(296deg) brightness(89%) contrast(91%);
}

#container h2 > a {
  text-decoration: none;
  text-color: initial;
  content: "";
  background-position: left center;
  background-image: url(../assets/bullet.png);
  background-repeat: no-repeat;
  padding: 0px 5px 1px 16px;
}

#container h2 > a:focus {
  outline: 0;
}

.sponsorship-row {
  display: flex;
}

.sponsorship-row > div {
  margin: 10px;
}

.mackintosh-rose {
  width: 128px;
}

.mackintosh-rose > img {
  width: 100px;
}

#sponsorship-gold > .mackintosh-rose {
  filter: invert(65%) sepia(86%) saturate(345%) hue-rotate(9deg) brightness(97%) contrast(90%);
}

#sponsorship-silver > .mackintosh-rose {
  filter: invert(90%) sepia(0%) saturate(756%) hue-rotate(134deg) brightness(86%) contrast(90%);
}

#sponsorship-bronze > .mackintosh-rose {
  filter: invert(85%) sepia(26%) saturate(5047%) hue-rotate(333deg) brightness(83%) contrast(92%);
}