diff --git a/.svelte-kit/generated/client-manifest.js b/.svelte-kit/generated/client-manifest.js
index 1ba1928c..f59ca229 100644
--- a/.svelte-kit/generated/client-manifest.js
+++ b/.svelte-kit/generated/client-manifest.js
@@ -1,32 +1,32 @@
 export { matchers } from './client-matchers.js';
 
 export const components = [
-	() => import("../../src/routes/__layout.svelte"),
-	() => import("../../src/routes/__error.svelte"),
-	() => import("../../src/routes/3MTOpeningCeremony.svelte"),
-	() => import("../../src/routes/archive/AlgebraClasses.svelte"),
-	() => import("../../src/routes/archive/join.svelte"),
-	() => import("../../src/routes/classes/index.svelte"),
-	() => import("../../src/routes/classes/instructors.svelte"),
-	() => import("../../src/routes/classes/tutoring.svelte"),
-	() => import("../../src/routes/competitions/index.svelte"),
-	() => import("../../src/routes/competitions/mmm-2024.svelte"),
-	() => import("../../src/routes/competitions/past/3mt-2022.svelte"),
-	() => import("../../src/routes/competitions/past/3mt-2023.svelte"),
-	() => import("../../src/routes/competitions/past/index.svelte"),
-	() => import("../../src/routes/competitions/past/mmt-2022.svelte"),
-	() => import("../../src/routes/competitions/past/mmt-2023/mmt-2023-CA.svelte"),
-	() => import("../../src/routes/competitions/past/mmt-2023/mmt-2023-WA.svelte"),
-	() => import("../../src/routes/competitions/past/mmt-2023/mmt-2023-online.svelte"),
-	() => import("../../src/routes/competitions/past/mmt-2023.svelte"),
-	() => import("../../src/routes/competitions/past/mmt-2024.svelte"),
-	() => import("../../src/routes/donate.svelte"),
-	() => import("../../src/routes/index.svelte"),
-	() => import("../../src/routes/join.svelte"),
-	() => import("../../src/routes/our-team.svelte"),
-	() => import("../../src/routes/past-tests.svelte"),
-	() => import("../../src/routes/redirect.svelte"),
-	() => import("../../src/routes/sponsors.svelte")
+	() => import("..\\..\\src\\routes\\__layout.svelte"),
+	() => import("..\\..\\src\\routes\\__error.svelte"),
+	() => import("..\\..\\src\\routes\\3MTOpeningCeremony.svelte"),
+	() => import("..\\..\\src\\routes\\archive\\AlgebraClasses.svelte"),
+	() => import("..\\..\\src\\routes\\archive\\join.svelte"),
+	() => import("..\\..\\src\\routes\\classes\\index.svelte"),
+	() => import("..\\..\\src\\routes\\classes\\instructors.svelte"),
+	() => import("..\\..\\src\\routes\\classes\\tutoring.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\index.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\mmm-2024.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\3mt-2022.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\3mt-2023.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\index.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\mmt-2022.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\mmt-2023\\mmt-2023-CA.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\mmt-2023\\mmt-2023-WA.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\mmt-2023\\mmt-2023-online.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\mmt-2023.svelte"),
+	() => import("..\\..\\src\\routes\\competitions\\past\\mmt-2024.svelte"),
+	() => import("..\\..\\src\\routes\\donate.svelte"),
+	() => import("..\\..\\src\\routes\\index.svelte"),
+	() => import("..\\..\\src\\routes\\join.svelte"),
+	() => import("..\\..\\src\\routes\\our-team.svelte"),
+	() => import("..\\..\\src\\routes\\past-tests.svelte"),
+	() => import("..\\..\\src\\routes\\redirect.svelte"),
+	() => import("..\\..\\src\\routes\\sponsors.svelte")
 ];
 
 export const dictionary = {
diff --git a/src/lib/components/CardPanelBox.svelte b/src/lib/components/CardPanelBox.svelte
index e3f0d670..dc33a2ad 100644
--- a/src/lib/components/CardPanelBox.svelte
+++ b/src/lib/components/CardPanelBox.svelte
@@ -5,10 +5,11 @@
     export let width;
     export let height;
     export let borderRadius="15px";
+    export let opacity;
 </script>
 
 <div style="position: relative;">
-    <PanelBox {width} {borderRadius} {height}>
+    <PanelBox {opacity} {width} {borderRadius} {height}>
         <!--<div class="icon top-left">
             <p><strong>{initials}</strong></p>
             <img src="/favicon.png" alt="logo" />
diff --git a/src/lib/components/Competition.svelte b/src/lib/components/Competition.svelte
index 084a9a79..78c24211 100644
--- a/src/lib/components/Competition.svelte
+++ b/src/lib/components/Competition.svelte
@@ -5,9 +5,10 @@
     export let imgSource;
     export let description;
     export let initials;
+    export let opacity;
 </script>
 
-<Card width="17em" height="23em" {imgSource} {initials}>
+<Card width="17em" height="23em" {imgSource} {initials} {opacity}>
     <a href="#{competition.toLowerCase()}">
         <div class="competition-img">
             <img alt={competition} src={imgSource} />
diff --git a/src/lib/components/InfoPerson.svelte b/src/lib/components/InfoPerson.svelte
index efed550f..cbaae74f 100644
--- a/src/lib/components/InfoPerson.svelte
+++ b/src/lib/components/InfoPerson.svelte
@@ -45,7 +45,7 @@
 
 <style>
     .person-img{
-        margin: 3px;
+        margin: 4px;
         max-height: 100%;
     }
     .person-pic {
diff --git a/src/lib/components/PanelBox.svelte b/src/lib/components/PanelBox.svelte
index 1cfb9a62..7755328f 100644
--- a/src/lib/components/PanelBox.svelte
+++ b/src/lib/components/PanelBox.svelte
@@ -7,9 +7,10 @@
   export let borderRadius = "5px";
   export let style = "";
   export let boxSizing = "border-box";
+  export let opacity = 0.8;
 </script>
 
-<div class="panel-box"  style="width: {width}; height: {height}; margin: {margin}; padding: {padding}; border-radius: {borderRadius}; box-sizing: {boxSizing}; {style}">
+<div class="panel-box"  style="opacity: {opacity}; width: {width}; height: {height}; margin: {margin}; padding: {padding}; border-radius: {borderRadius}; box-sizing: {boxSizing}; {style}">
   <slot />
 </div>
 
@@ -17,7 +18,6 @@
   .panel-box {
     background-color: #ffffff;
     box-shadow: 5px 10px 10px rgb(0, 0, 0, 0.1);
-    opacity: 0.8;
     transition: 0.5s;
   }
 
diff --git a/src/routes/classes/index.svelte b/src/routes/classes/index.svelte
index 8d0de552..f5dffab3 100644
--- a/src/routes/classes/index.svelte
+++ b/src/routes/classes/index.svelte
@@ -109,9 +109,10 @@
 
 <br><br>
 
+<div class="body">
 <Heading text="Summary" size={2.5} textColor="#1B9AAA" />
 <div style="margin-left: 10vw; margin-right: 10vw;">
-    <PanelBox>
+    <PanelBox style="opacity: 1">
         <p style="font-size: 1.5em; text-align: center;"><strong>Mustang Math classes</strong> bring together students from around the world with one thing in common: an outstanding passion for math. Our highly qualified instructors prepare students for competitions in a fun and engaging way. Beyond instruction, we want to build a <strong>community</strong> of students and teachers sharing their love of math.</p>
         <br />
         <p style="font-size: 1.5em; text-align: center;">These classes will be run year-round and will be split into 4 quarters: Algebra, Geometry, Problem Solving Mathematics, and Problem Solving/AMC Prep, each run for <strong>8 weeks</strong>. Instructive sessions will run for <strong>90 minutes</strong> every week over Zoom. Additionally, teachers will hold <strong>office hours</strong> each week, during which students can seek assistance with the content or ask any lingering questions. Each class will have <strong>10-15 students</strong> and, depending on the interest we receive, there may be multiple classes run for each level. The total cost for 8 classes will be <strong>$80</strong> with financial aid available. Alternatively, students who would like to attend all four terms of our classes can pay $250 for a total of 32 classes.</p>
@@ -123,10 +124,10 @@
 <Heading text="Topic-Based Courses" size={2.5} textColor="#1B9AAA" />
 <div class="competition-wrapper">
     <FlexBox align="start">
-        <Competition initials="A" imgSource="classes/fx.png" competition="Algebra" description="Invariably fun. Key topics include Polynomials, Sequences, and Inequalities." />
-        <Competition initials="G" imgSource="classes/compass.png" competition="Geometry" description="Just plane interesting. Key topics include Similar Triangles, Circles, and 3D Geometry" />
-        <Competition initials="C/NT" imgSource="classes/dice.png" competition="Discrete" description="You can always count on it. Key topics include Counting Techniques, Distinguishability, Probability, Primes, Bases, and Modular Arithmetic" />
-        <Competition initials="PS" imgSource="classes/numbers.png" competition="Problem Solving" description="Prime learning material. Key focus is on preparing students for the AMC Series and other contests that come in the Fall." />
+        <Competition opacity="1" initials="A" imgSource="classes/fx.png" competition="Algebra" description="Invariably fun. Key topics include Polynomials, Sequences, and Inequalities." />
+        <Competition opacity="1" initials="G" imgSource="classes/compass.png" competition="Geometry" description="Just plane interesting. Key topics include Similar Triangles, Circles, and 3D Geometry" />
+        <Competition opacity="1" initials="C/NT" imgSource="classes/dice.png" competition="Discrete" description="You can always count on it. Key topics include Counting Techniques, Distinguishability, Probability, Primes, Bases, and Modular Arithmetic" />
+        <Competition opacity="1" initials="PS" imgSource="classes/numbers.png" competition="Problem Solving" description="Prime learning material. Key focus is on preparing students for the AMC Series and other contests that come in the Fall." />
     </FlexBox>
 </div> <br />
 
@@ -134,8 +135,8 @@
 
 <Heading text="Class Details" size={2} textColor="#1B9AAA" />
 <div style="margin-left: 10vw; margin-right: 10vw;">
-    <PanelBox>
-        <p style="font-size: 1.5em; text-align: center;">Our class will be on Algebra and will start on the week of <strong>September 8th, 2024</strong> and run through the week of <strong>October 27th, 2024</strong>. There are currently 2 levels of classes planned: <strong>Beginner Algebra</strong> (AMC 8/10) and <strong>Intermediate Algebra</strong> (AMC 12/AIME). See below for the weekly schedule and breakdown of topics! If you're interested in participating in these classes, make sure to fill out the <a href="https://forms.gle/QntdTLexMYyftKJt8"><strong>registration form</strong></a>. If you are not contacted by us by 9/6, please email classes@mustangmath.com to check in.</p>
+    <PanelBox style="opacity: 1">
+        <p style="font-size: 1.5em; text-align: center;">Our class will be on Problem Solving and will start on the week of <strong>July 14th, 2024</strong> and run through <strong>August 9th, 2024</strong>. There are currently 2 levels of classes planned: <strong>Beginner Problem Solving</strong> and <strong>Intermediate Problem Solving</strong>. See below for the weekly schedule and breakdown of topics! If you're interested in participating in these classes, make sure to fill out the <a href="https://forms.gle/S9oyf34H8L7bJcus5"><strong>registration form</strong></a>.</p>
     </PanelBox>
 </div> <br />
 <br />
@@ -143,8 +144,9 @@
 
 <Heading text="Pricing" size={2} textColor="#1B9AAA" />
 <div style="margin-left: 10vw; margin-right: 10vw;">
-    <PanelBox>
-        <p style="font-size: 1.5em; text-align: center;">The total cost for the 8 sessions of Algebra will be <strong>$80</strong>.</p>
+    <PanelBox style="opacity: 1">
+        <p style="font-size: 1.5em; text-align: center;">The total cost for the 8 sessions of Problem Solving will be <strong>$80</strong>.</p>
+
         <p style="font-size: 1.5em; text-align: center;">We charge for our classes for a multitude of reasons. First, while we are a fully volunteer-run nonprofit organization, we need money to continue <strong>improving upon and providing better classes, competitions, events, and materials</strong>! All money earned from MM Classes will go back into these projects for you, the students. Second, we work very hard to provide high quality classes, and we want students to take them seriously - ascribing a price value to the class naturally leads to more <strong>committed students</strong>.</p>
         <p style="font-size: 1.5em; text-align: center;">If the cost of these classes poses a significant burden to you, please reach out to us! <strong>Financial aid is available upon request</strong>.</p>
     </PanelBox>
@@ -155,7 +157,7 @@
 <Heading text="Weekly Schedule" size={2} textColor="#1B9AAA" />
 <div class="schedule-wrapper">
     <FlexBox>
-        <PanelBox>
+        <PanelBox style="opacity: 1">
             <Table data={scheduleData} width="auto" headerColor="#1B9AAA" rowColors={["#A4D6AF", "#ADCDD6"]} cellPadding={5} cellPaddingRight={20}/>
             {#if windowWidth < 700}
                 <p>OH = Office Hours</p>
@@ -168,14 +170,19 @@
 <Heading text="Classes Schedule" size={2} textColor="#1B9AAA" />
 <div class="schedule-wrapper">
     <FlexBox>
-        <PanelBox>
+        <PanelBox style="opacity: 1">
             <Table data={topicsData} width="auto" headerColor="#1B9AAA" rowColors={["#A4D6AF", "#ADCDD6"]} cellPadding={5} cellPaddingRight={20}/>
         </PanelBox>
     </FlexBox>
 </div> <br />
 <br />
+</div>
 
 <style>
+    .body {
+        background-image: url("/backgrounds/Classes_Website_Design.png");
+        background-size: 100vw auto;
+    }
     strong {
         color: #1b9aaa;
     }
diff --git a/src/routes/classes/tutoring.svelte b/src/routes/classes/tutoring.svelte
index 9f93cbcb..b382d0cd 100644
--- a/src/routes/classes/tutoring.svelte
+++ b/src/routes/classes/tutoring.svelte
@@ -14,6 +14,8 @@
 
 <PageHeader title="Tutoring" description="Join Mustang Math's one-on-one tutoring!" button_url="https://forms.gle/D1ckzySxmH5L7v4X9" button_text="Tutoring Registration" id="registerTutoring"/>
 
+<div class="body">
+
 <br><br>
 
 <div style="margin-left: 10vw; margin-right: 10vw;">
@@ -35,4 +37,12 @@
         We look forward to meeting and working with you!</p>
     </PanelBox>
 </div> <br />
-<br />
\ No newline at end of file
+<br />
+</div>
+
+<style>
+    .body {
+        background-image: url("/backgrounds/TutoringBackground140.png");
+        background-size: 100vw auto;
+    }
+</style>
\ No newline at end of file
diff --git a/src/routes/donate.svelte b/src/routes/donate.svelte
index 376ee9a0..20fe2750 100644
--- a/src/routes/donate.svelte
+++ b/src/routes/donate.svelte
@@ -16,6 +16,7 @@
 <PageHeader title="Donate" description="Help improve our tournaments, classes, and more!" button_url="
 https://link.mustangmath.com/donate" button_text="Donate to Mustang Math!" button_id="donateMM"/>
 
+<div class = "body">
 
 <Section>
     <br /> <br />
@@ -45,4 +46,11 @@ https://link.mustangmath.com/donate" button_text="Donate to Mustang Math!" butto
     <br />
 </Section>
 
+</div>
 
+<style>
+    .body {
+        background-image: url("/backgrounds/Donate_BG.png");
+        background-size: 100vw auto;
+    }
+</style>
diff --git a/src/routes/past-tests.svelte b/src/routes/past-tests.svelte
index 1c40093d..171d54de 100644
--- a/src/routes/past-tests.svelte
+++ b/src/routes/past-tests.svelte
@@ -57,6 +57,7 @@
   button_id="trainingPortal"
 />
 
+<div class = "body">
 <section>
   <Heading text="Past Exams" size={2.5} textColor="#1B9AAA" />
   <DropdownArchive
@@ -275,8 +276,13 @@
     <DropdownArchive id="showDropdown" {year} tests={issues[year]} />
   {/each}
 </section>
+</div>
 
 <style>
+  .body {
+        background-image: url("/backgrounds/Past_Tests_BG.png");
+        background-size: 100vw auto;
+  }
   section {
     padding: 10px;
   }
diff --git a/static/backgrounds/BE_Website_Design.png b/static/backgrounds/BE_Website_Design.png
new file mode 100644
index 00000000..8eb966ad
Binary files /dev/null and b/static/backgrounds/BE_Website_Design.png differ
diff --git a/static/backgrounds/Classes_Website_Design.png b/static/backgrounds/Classes_Website_Design.png
new file mode 100644
index 00000000..fdbf2200
Binary files /dev/null and b/static/backgrounds/Classes_Website_Design.png differ
diff --git a/static/backgrounds/Donate_BG.png b/static/backgrounds/Donate_BG.png
new file mode 100644
index 00000000..98fd3c21
Binary files /dev/null and b/static/backgrounds/Donate_BG.png differ
diff --git a/static/backgrounds/Past_Tests_BG.png b/static/backgrounds/Past_Tests_BG.png
new file mode 100644
index 00000000..774af483
Binary files /dev/null and b/static/backgrounds/Past_Tests_BG.png differ
diff --git a/static/backgrounds/Problem_Writing_BG.png b/static/backgrounds/Problem_Writing_BG.png
new file mode 100644
index 00000000..a0f5f566
Binary files /dev/null and b/static/backgrounds/Problem_Writing_BG.png differ
diff --git a/static/backgrounds/Tournament_Development_BG.png b/static/backgrounds/Tournament_Development_BG.png
new file mode 100644
index 00000000..2a4fb2b4
Binary files /dev/null and b/static/backgrounds/Tournament_Development_BG.png differ
diff --git a/static/backgrounds/TutoringBackground140.png b/static/backgrounds/TutoringBackground140.png
new file mode 100644
index 00000000..22ea9bc2
Binary files /dev/null and b/static/backgrounds/TutoringBackground140.png differ
diff --git a/static/backgrounds/TutoringBackground240.png b/static/backgrounds/TutoringBackground240.png
new file mode 100644
index 00000000..2ffd2555
Binary files /dev/null and b/static/backgrounds/TutoringBackground240.png differ