@import url('https://fonts.googleapis.com/css2?family=Badeen+Display&display=swap'); /*header text 1*/
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100..900;1,100..900&display=swap'); /*body text 1*/
@font-face {font-family: 'Horizon'; src: url('FONTS/horizon.otf') format('opentype');} /*header text 2.a*/
@font-face {font-family: 'Horizon Outline'; src: url('FONTS/horizon_outlined.otf') format('opentype');} /*header text 2.b*/
@font-face {font-family: 'Architype Vierkant'; src: url('FONTS/Architype Vierkant W00.ttf') format('truetype');} /*body text 2*/
@font-face {font-family: 'Imagica'; src: url('imagica_.ttf') format('truetype');} /*she's just here*/

h1, h2, h3, h4, h5, h6 {font-size: inherit;}
h1 {
  font-family: "Badeen Display", system-ui;
  font-weight: 400;
  font-style: normal;
}
h2 {
  font-family: "Horizon", sans-serif;
  font-style: normal;
}
h3 {
  font-family: "Horizon Outline", sans-serif;
  font-style: normal;
}
body {
  font-family: "Roboto", sans-serif;
  font-size: 1em;
  text-align: left;
  font-weight: 400;
  font-style: normal;
}
.pixel {
  font-family: "Architype Vierkant", sans-serif;
  font-size: 1em;
  text-align: left;
  font-weight: 400;
  font-style: normal;
}


.test {
  display: inline-block;
  animation: float1 11s infinite ease-in-out; /*REMOVE AFTER TESTING*/
  transform-origin: center center;
}



@keyframes float1 {
  0%   { transform: translateY(0%) rotate(0deg); }
  10%  { transform: translateY(-35%) rotate(0.3deg); }
  20%  { transform: translateY(-20%) rotate(-0.3deg); }
  30%  { transform: translateY(-40%) rotate(0.5deg); }
  40%  { transform: translateY(0%) rotate(-0.2deg); }
  55%  { transform: translateY(-35%) rotate(0.4deg); }
  70%  { transform: translateY(-20%) rotate(-0.4deg); }
  85%  { transform: translateY(-40%) rotate(0.2deg); }
  100% { transform: translateY(0%) rotate(0deg); }
}