@import url("https://fonts.cdnfonts.com/css/nottke");
@import url("https://fonts.cdnfonts.com/css/all-rights-reserved");
@import url("https://fonts.cdnfonts.com/css/quickstrike");
/*  Font Types
font-family: 'QuickStrike', sans-serif;
font-family: 'QuickStrike 3D', sans-serif;
font-family: 'QuickStrike 3D Italic', sans-serif;
font-family: 'QuickStrike Bold', sans-serif;
font-family: 'QuickStrike Bold Italic', sans-serif;
font-family: 'QuickStrike Condensed', sans-serif;
font-family: 'QuickStrike Condensed Italic', sans-serif;
font-family: 'QuickStrike Expanded', sans-serif;
font-family: 'QuickStrike Expanded Italic', sans-serif;
font-family: 'QuickStrike Italic', sans-serif;
font-family: 'QuickStrike Leftalic', sans-serif;
font-family: 'QuickStrike Semi-Italic', sans-serif;
font-family: 'QuickStrike Super-Italic', sans-serif; 
*/

* {
  padding: 0;
  margin: 0;
}
:root {
  --primary: #141414;
  --secondary: #c8e7ff;
  --tertiary: #123e00;
  --quaternary: #c1292e;
  --backing: #273a59;
  --backingMain: #3c2350;
  --radius: 14px;

  --primaryFilter: brightness(0) saturate(100%) invert(7%) sepia(33%)
    saturate(516%) hue-rotate(175deg) brightness(95%) contrast(97%);
  --secondaryFilter: brightness(0) saturate(100%) invert(73%) sepia(52%)
    saturate(673%) hue-rotate(185deg) brightness(112%) contrast(106%);
  --backingFilter: brightness(0) saturate(100%) invert(23%) sepia(31%)
    saturate(804%) hue-rotate(212deg) brightness(95%) contrast(94%);

  --mainFont: "Nottke", sans-serif;
  --headingFont: "QuickStrike", sans-serif;
  --headingFont2: "All rights reserved", sans-serif;
  --headingFontSize1: 80px;
  --HeadingFontSize2: 30px;

  --mobileSizeh1: 60px;
  --mobileSizeh2: 40px;
  --mobileSizeh3: 20px;
  --mobileSizeP: 15px;

  --logo: url(/assets/images/webp/logo.webp);
  /* Nav Vars */
  --navWidthD: 200px;
  --navWidthT: 150px;
  --navWidthM: 100px;

  /* Assets */
  --awsBack: url(/assets/images/webp/awsBack.webp);
  --otherBack: url(/assets/images/webp/otherBack.webp);
  /* Testing */
  --test1: red;
  --test2: green;
  --test3: blue;

  /* Projects */
  --satMain: url(/assets/images/webp/item-calc-main.webp);
  --satCalc: url(/assets/images/webp/satisfactory.webp);
}

body {
  background-color: var(--primary);
  font-family: var(--mainFont);
  color: var(--secondary);
  box-sizing: border-box;
}
h1,
h2,
h3,
h4,
h5,
h6,
p {
  text-align: center;
}
@media only screen and (max-width: 63.9375rem) {
  h1 {
    font-size: var(--mobileSizeh1);
  }
  h2 {
    font-size: var(--mobileSizeh2);
  }
  h3 {
    font-size: var(--mobileSizeh3);
  }
  p {
    font-size: var(--mobileSizeP);
  }
}