@font-face {
    font-family: sansforgetica;
    src: url('../fonts/SansForgetica-Regular.otf');
}
@font-face {
    font-family: roboto-regular;
    src: url('../fonts/roboto-regular.ttf');
}
@font-face {
    font-family: roboto-light;
    src: url('../fonts/roboto-light.ttf');
}
@font-face {
    font-family: MerryChristmasFlake;
    src: url('../fonts/MerryChristmasFlake.ttf');
}
html {
  font-family: roboto-regular;
}
.christmas {
  font-family: MerryChristmasFlake;
  font-weight: 100;
  font-size: 6rem;
  line-height: 1;
}
.robotoItalics {
  font-family: roboto-light;
  font-style: italic;
  font-size: 3.6rem;
}
.robotoReg {
  font-family: roboto-regular;
  font-style: italic;
  font-size: 3.6rem;
}
body {
  color: white;
}
h1 {
  font-size: 3rem;
  font-family: sansforgetica;
  font-weight: 900;
}
h2 {
  font-size: 2rem;
  font-family: roboto-regular;
  font-weight: 600;
}
.headerBox h1, .headerBox h2, .headerBox h3 {
  text-align: center;
  padding: 0 .5rem;
  border-top-right-radius: 1rem;
  border-bottom-right-radius: 1rem;
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}
.purpleText {
  color: rgba(30, 0, 60, 1);
}
.greenText {
  color: rgba(0, 30, 0, 1);
}
.yellowText {
  color: rgba(160, 100, 0, 1);
}
h3 {
  font-family: roboto-regular;
  font-size: 1.4rem;
  font-weight: 600;
  }
h4 {
  font-size: 1.4rem;
}
h5 {
  font-size: 1.2rem;
}
h6, li {
  font-size: 1rem;
}
p {
  font-size: 1rem;
}
li {
	margin: 0;
  padding: 0 1rem 0 2rem;
  list-style: none;
	background-image: url("../media/ImpossibleStarLogo.png");
  background-position-x: 0%;
  background-position-y: 2.5%;
	background-repeat: no-repeat;
	background-size: 1rem;
}

sup {
  font-size: .8rem;
  color: rgba(210,140,0,1);
}
sub {
  font-size: .8rem;
  color: rgba(200,0,0,1);
}
.villageSQ li {
	background-image: url("../media/V2icon.png");
  background-size: 2rem;
}

.accretion li {
	background-image: url("../media/icons/yingyanghome.png");
}

.convection li {
	background-image: url("../media/icons/yingyangmatrix.png");
}