diff --git a/src/public/Config.ts b/src/public/Config.ts
index ad0838d..a80bf00 100644
--- a/src/public/Config.ts
+++ b/src/public/Config.ts
@@ -29,17 +29,17 @@ export const EVENTS: unknown[] = [];
 
 export const SOCIALS = [
     {
-        icon: "img/disc.svg",
+        icon: "/assets/img/disc.svg",
         url: "https://discord.gg/XxfjqZSjca",
         message: "Join our server",
     },
     {
-        icon: "img/fab.svg",
+        icon: "/assets/img/fab.svg",
         url: "https://www.facebook.com/ieeeucsd",
         message: "ieeeucsd",
     },
     {
-        icon: "img/inst.svg",
+        icon: "/assets/img/inst.svg",
         url: "https://www.instagram.com/ieee.ucsd",
         message: "@ieeeucsd",
     },
@@ -47,7 +47,7 @@ export const SOCIALS = [
 
 export const EMAIL = [
     {
-        icon: "img/email.svg",
+        icon: "/assets/img/email.svg",
         url: "mailto:ieee@eng.ucsd.edu",
         message: "ieee@eng.ucsd.edu",
     },
@@ -55,7 +55,7 @@ export const EMAIL = [
 
 export const EMAIL_WHITE = [
     {
-        icon: "img/email_white.svg",
+        icon: "/assets/img/email_white.svg",
         url: "mailto:ieee@eng.ucsd.edu",
         message: "ieee@eng.ucsd.edu",
     },
@@ -63,17 +63,17 @@ export const EMAIL_WHITE = [
 
 export const SOCIALS_WHITE = [
     {
-        icon: "img/disc_white.svg",
+        icon: "/assets/img/disc_white.svg",
         url: "https://discord.gg/XxfjqZSjca",
         message: "Join our server",
     },
     {
-        icon: "img/fab_white.svg",
+        icon: "/assets/img/fab_white.svg",
         url: "https://www.facebook.com/ieeeucsd",
         message: "ieeeucsd",
     },
     {
-        icon: "img/inst_white.svg",
+        icon: "/assets/img/inst_white.svg",
         url: "https://www.instagram.com/ieee.ucsd",
         message: "@ieeeucsd",
     },
@@ -83,157 +83,157 @@ export const OFFICERS = [
     {
         name: "Darin Tsui",
         position: "Chair",
-        photo: "img/officers/darin.jpg",
+        photo: "/assets/img/officers/darin.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Brigette Hacia",
         position: "Vice Chair Internal",
-        photo: "img/officers/brigette.jpg",
+        photo: "/assets/img/officers/brigette.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Tasnia Jamal",
         position: "Vice Chair Events",
-        photo: "img/officers/tasnia.jpg",
+        photo: "/assets/img/officers/tasnia.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Kevin Chang",
         position: "Vice Chair Projects",
-        photo: "img/officers/kevin.jpg",
+        photo: "/assets/img/officers/kevin.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Arjun Sampath",
         position: "Vice Chair Finance",
-        photo: "img/officers/arjun.jpg",
+        photo: "/assets/img/officers/arjun.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Niklas Chang",
         position: "Events Coordinator",
-        photo: "img/officers/niklas.jpg",
+        photo: "/assets/img/officers/niklas.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Tien Vu",
         position: "Vice Chair External",
-        photo: "img/officers/tien.jpg",
+        photo: "/assets/img/officers/tien.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Derek Nguyen",
         position: "Project Space Chair",
-        photo: "img/officers/derek.jpg",
+        photo: "/assets/img/officers/derek.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Rafaella Gomes",
         position: "Robocup Chair",
-        photo: "img/officers/rafaella.jpg",
+        photo: "/assets/img/officers/rafaella.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Yash Puneet",
         position: "Robocup Chair",
-        photo: "img/officers/yash.jpg",
+        photo: "/assets/img/officers/yash.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Matthew Mikhailov",
         position: "Supercomputing Chair",
-        photo: "img/officers/matthew.jpg",
+        photo: "/assets/img/officers/matthew.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Josh Lapidario",
         position: "Quarterly Projects Chair",
-        photo: "img/officers/josh.jpg",
+        photo: "/assets/img/officers/josh.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Sanh Nguyen",
         position: "Quarterly Projects Chair",
-        photo: "img/officers/sanh.jpg",
+        photo: "/assets/img/officers/sanh.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Vuong Bui",
         position: "Professional Chair",
-        photo: "img/officers/vuong.jpg",
+        photo: "/assets/img/officers/vuong.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Jason Liang",
         position: "Professional Chair",
-        photo: "img/officers/jason.jpg",
+        photo: "/assets/img/officers/jason.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Mohak Vaswani",
         position: "Technical Chair",
-        photo: "img/officers/mohak.jpg",
+        photo: "/assets/img/officers/mohak.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Yusuf Morsi",
         position: "Technical Chair",
-        photo: "img/officers/yusuf.jpg",
+        photo: "/assets/img/officers/yusuf.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Shaun Garcia",
         position: "Technical Chair",
-        photo: "img/officers/shaun.jpg",
+        photo: "/assets/img/officers/shaun.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Dennis Liang",
         position: "Outreach Chair",
-        photo: "img/officers/dennis.jpg",
+        photo: "/assets/img/officers/dennis.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Daniel Chen",
         position: "Outreach Chair",
-        photo: "img/officers/daniel.jpg",
+        photo: "/assets/img/officers/daniel.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Parisa Shahabi",
         position: "Social Chair",
-        photo: "img/officers/parisa.jpg",
+        photo: "/assets/img/officers/parisa.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Matthew Yik",
         position: "Social Chair",
-        photo: "img/officers/temp.png",
+        photo: "/assets/img/officers/temp.png",
         email: "email@ucsd.edu",
     },
     {
         name: "Jiliana Tiu",
         position: "Webmaster",
-        photo: "img/officers/jiliana.jpg",
+        photo: "/assets/img/officers/jiliana.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Raymond Wang",
         position: "Webmaster",
-        photo: "img/officers/raymond.jpg",
+        photo: "/assets/img/officers/raymond.jpg",
         email: "raymond@ucsd.edu",
     },
     {
         name: "Sankalp Kaushik",
         position: "PR Chair - Media",
-        photo: "img/officers/sankalp.jpg",
+        photo: "/assets/img/officers/sankalp.jpg",
         email: "email@ucsd.edu",
     },
     {
         name: "Stephanie Xu",
         position: "PR Chair - Graphics",
-        photo: "img/officers/stephanie.jpg",
+        photo: "/assets/img/officers/stephanie.jpg",
         email: "email@ucsd.edu",
     },
 ];
diff --git a/src/public/assets/css/styles.css b/src/public/assets/css/styles.css
index e9a0637..d9c4995 100644
--- a/src/public/assets/css/styles.css
+++ b/src/public/assets/css/styles.css
@@ -1,440 +1,443 @@
 /* Global CSS Properties */
 :root {
-	--main: #00629b;
-	--accent: #ffcd00;
-	--secondary: #ffffff;
-	--dark: #2a1a4e;
+    --main: #00629b;
+    --accent: #ffcd00;
+    --secondary: #ffffff;
+    --dark: #2a1a4e;
 }
 
 * {
-	scrollbar-width: auto;
-	scrollbar-color: var(--main) transparent;
+    scrollbar-width: auto;
+    scrollbar-color: var(--main) transparent;
 }
 
 *::-webkit-scrollbar {
-	width: 0.6em;
-	height: 0.6em;
+    width: 0.6em;
+    height: 0.6em;
 }
 
 *::-webkit-scrollbar-track {
-	background: var(--main);
+    background: var(--main);
 }
 
 *::-webkit-scrollbar-thumb {
-	background-color: var(--secondary);
+    background-color: var(--secondary);
 }
 
 html {
-	font-family: "Roboto", sans-serif;
-	font-weight: bold;
+    font-family: "Roboto", sans-serif;
+    font-weight: bold;
 }
 
 body {
-	margin: 0;
+    margin: 0;
 }
 
 a {
-	text-decoration: none;
-	color: var(--main);
+    text-decoration: none;
+    color: var(--main);
 }
 
 a:hover {
-	text-decoration: underline;
+    text-decoration: underline;
 }
 
 #root {
-	display: flex;
-	flex-direction: column;
+    display: flex;
+    flex-direction: column;
 }
 
 .topbar {
-	display: flex;
-	flex-direction: row;
-	justify-content: space-between;
-	color: var(--main);
-	background-color: var(--secondary);
-	padding: 0.5em;
-	align-items: center;
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    color: var(--main);
+    background-color: var(--secondary);
+    padding: 0.5em;
+    align-items: center;
 }
 
 .topbar.burger-bar {
-	flex-direction: column;
-	position: relative;
+    flex-direction: column;
+    position: relative;
 }
 
-.topbar.burger-bar>.img-cont {
-	align-self: flex-start;
-	display: flex;
-	justify-content: space-between;
-	width: 100%;
-	align-items: center;
+.topbar.burger-bar > .img-cont {
+    align-self: flex-start;
+    display: flex;
+    justify-content: space-between;
+    width: 100%;
+    align-items: center;
 }
 
 .img-cont img {
-	width: 22em;
+    width: 22em;
 }
 
 .burger {
-	font-size: 2.8em;
-	font-weight: normal;
-	user-select: none;
-	cursor: pointer;
-	margin-right: 0.3em;
+    font-size: 2.8em;
+    font-weight: normal;
+    user-select: none;
+    cursor: pointer;
+    margin-right: 0.3em;
 }
 
 .link-items.burger-time {
-	flex-direction: column;
-	position: absolute;
-	background-color: var(--secondary);
-	width: 10em;
-	box-shadow: rgba(0, 0, 0, 0.3) 4px 4px 3px 0px;
-	right: 0;
-	margin-top: 0.36em;
+    flex-direction: column;
+    position: absolute;
+    background-color: var(--secondary);
+    width: 10em;
+    box-shadow: rgba(0, 0, 0, 0.3) 4px 4px 3px 0px;
+    right: 0;
+    margin-top: 0.36em;
 }
 
-.link-items.burger-time>a {
-	margin: 0;
-	padding: 0.4em 0.75em;
+.link-items.burger-time > a {
+    margin: 0;
+    padding: 0.4em 0.75em;
 }
 
-.link-items.burger-time>a:hover {
-	background-color: rgba(0, 0, 0, 0.1);
+.link-items.burger-time > a:hover {
+    background-color: rgba(0, 0, 0, 0.1);
 }
 
 .navlink {
-	font-size: 1.1em;
-	margin: 0.75em;
+    font-size: 1.1em;
+    margin: 0.75em;
 }
 
 .splash {
-	background-color: var(--main);
-	background-blend-mode: overlay;
-	border-radius: 0 0 50% 50% / 4rem;
-	background-position: center;
-	height: 35em;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	flex-direction: column;
-	background-repeat: no-repeat;
-	background-size: cover;
+    background-color: var(--main);
+    background-blend-mode: overlay;
+    border-radius: 0 0 50% 50% / 4rem;
+    background-position: center;
+    height: 35em;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    background-repeat: no-repeat;
+    background-size: cover;
 }
 
 .call-to-action {
-	font-size: 3.2em;
-	width: 11em;
-	color: var(--secondary);
-	text-align: center;
-	font-family: "Montserrat";
+    font-size: 3.2em;
+    width: 11em;
+    color: var(--secondary);
+    text-align: center;
+    font-family: "Montserrat";
 }
 
 .splash-socials {
-	margin-top: 2em;
+    margin-top: 2em;
 }
 
-.splash-socials>a {
-	margin-left: 1.5em;
-	margin-right: 1.5em;
+.splash-socials > a {
+    margin-left: 1.5em;
+    margin-right: 1.5em;
 }
 
 .splash-socials img {
-	width: 4.7em;
+    width: 4.7em;
 }
 
 .default-section {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex-direction: column;
-	color: var(--main);
-	background-color: var(--secondary);
-	padding-top: 2em;
-	padding-bottom: 2em;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    color: var(--main);
+    background-color: var(--secondary);
+    padding-top: 2em;
+    padding-bottom: 2em;
 }
 
 .section-title {
-	font-size: 3em;
-	margin-top: 0.8em;
-	margin-bottom: 0.8em;
+    font-size: 3em;
+    margin-top: 0.8em;
+    margin-bottom: 0.8em;
 }
 
-.default-section>p,
-.project-space>p {
-	font-size: 1.8em;
-	width: 22em;
-	color: var(--dark);
-	text-align: center;
+.default-section > p,
+.project-space > p {
+    font-size: 1.8em;
+    width: 22em;
+    color: var(--dark);
+    text-align: center;
 }
 
-.project-space>p {
-	color: var(--secondary);
+.project-space > p {
+    color: var(--secondary);
 }
 
-.default-section>p:first-child {
-	margin-top: 0;
+.default-section > p:first-child {
+    margin-top: 0;
 }
 
 .project-space {
-	border-radius: 50% 50% 0 0 / 4rem;
-	background-color: var(--main);
-	background-blend-mode: overlay;
-	background-image: url("../img/backgrounds/ps.webp");
-	height: 40em;
-	display: flex;
-	justify-content: center;
-	align-items: center;
-	flex-direction: column;
-	background-repeat: no-repeat;
-	background-size: cover;
+    border-radius: 50% 50% 0 0 / 4rem;
+    background-color: var(--main);
+    background-blend-mode: overlay;
+    background-image: url("../img/backgrounds/ps.webp");
+    height: 40em;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-direction: column;
+    background-repeat: no-repeat;
+    background-size: cover;
 }
 
 .project-space a {
-	color: var(--accent);
+    color: var(--accent);
 }
 
 .ps-title {
-	font-size: 3em;
-	color: white;
-	margin-bottom: 1em;
+    font-size: 3em;
+    color: white;
+    margin-bottom: 1em;
 }
 
 .visit-us {
-	font-size: 2em;
-	margin-bottom: 2em;
+    font-size: 2em;
+    margin-bottom: 2em;
 }
 
 .ex-link {
-	color: var(--accent);
-	font-size: 2em;
-	margin-bottom: 2em;
+    color: var(--accent);
+    font-size: 2em;
+    margin-bottom: 2em;
 }
 
 .involved {
-	border-radius: 50% 50% 0 0 / 4rem;
-	transform: translateY(-4rem);
+    border-radius: 50% 50% 0 0 / 4rem;
+    transform: translateY(-4rem);
 }
 
 .cards {
-	display: flex;
-	justify-content: space-around;
-	flex-wrap: wrap;
+    display: flex;
+    justify-content: space-around;
+    flex-wrap: wrap;
 }
 
 .involve-card {
-	padding: 1.75em 2.5em;
-	border: var(--main) solid 0.37em;
-	border-radius: 1.5em;
-	color: var(--main);
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex-direction: column;
-	margin: 1em;
+    padding: 1.75em 2.5em;
+    border: var(--main) solid 0.37em;
+    border-radius: 1.5em;
+    color: var(--main);
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    margin: 1em;
 }
 
 .involve-title {
-	font-size: 3em;
-	color: var(--main);
-	margin-bottom: 0.5em;
+    font-size: 3em;
+    color: var(--main);
+    margin-bottom: 0.5em;
 }
 
-.involve-card>img {
-	width: 20em;
-	margin-bottom: 1em;
-	border-radius: 0.2em;
+.involve-card > img {
+    width: 20em;
+    margin-bottom: 1em;
+    border-radius: 0.2em;
 }
 
 .links {
-	font-size: 1.5em;
+    font-size: 1.5em;
 }
 
 .social-card {
-	display: flex;
-	align-items: center;
-	padding: 1em;
-	width: 25em;
+    display: flex;
+    align-items: center;
+    padding: 1em;
+    width: 25em;
 }
 
-.social-card>img {
-	width: 4.7em;
+.social-card > img {
+    width: 4.7em;
 }
 
 .social-message {
-	font-size: 2em;
-	padding: 0.5em;
+    font-size: 2em;
+    padding: 0.5em;
 }
 
 .join-scls,
 .footer-scls {
-	display: flex;
-	flex-direction: row;
-	max-width: 55em;
-	justify-content: space-around;
-	flex-wrap: wrap;
-	margin-left: 5em;
+    display: flex;
+    flex-direction: row;
+    max-width: 55em;
+    justify-content: space-around;
+    flex-wrap: wrap;
+    margin-left: 5em;
 }
 
 .carousel-item {
-	display: flex;
-	flex-direction: column;
-	align-items: center;
-	padding: 1.5em;
-	border: 0.35em solid var(--main);
-	border-radius: 1em;
-	margin: 1em;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    padding: 1.5em;
+    border: 0.35em solid var(--main);
+    border-radius: 1em;
+    margin: 1em;
 }
 
-.carousel-item>img {
-	width: 18.7em;
-	border-radius: 0.2em;
+.carousel-item > img {
+    width: 18.7em;
+    border-radius: 0.2em;
 }
 
 .carousel-name {
-	font-size: 2em;
-	padding-top: 0.25em;
+    font-size: 2em;
+    padding-top: 0.25em;
 }
 
 .carousel-pos {
-	font-style: italic;
-	font-weight: normal;
-	font-size: 1.25em;
+    font-style: italic;
+    font-weight: normal;
+    font-size: 1.25em;
 }
 
 .carousel-email {
-	margin-top: 0.5em;
+    margin-top: 0.5em;
 }
 
 .carousel-page {
-	display: flex;
-	flex-wrap: wrap;
-	justify-content: center;
+    display: flex;
+    flex-wrap: wrap;
+    justify-content: center;
 }
 
 .carousel {
-	display: flex;
-	align-items: center;
-	justify-content: center;
+    display: flex;
+    align-items: center;
+    justify-content: center;
 }
 
 .carousel-left {
-	margin-left: 2em;
-	transform: scaleX(-1);
+    margin-left: 2em;
+    transform: scaleX(-1);
 }
 
 .carousel-right,
 .carousel-left {
-	cursor: pointer;
-	width: 4em;
+    cursor: pointer;
+    width: 4em;
 }
 
 .carousel-right {
-	margin-right: 2em;
+    margin-right: 2em;
 }
 
 .contact {
-	border-radius: 0 0 50% 50% / 4rem;
-	transform: translateY(4rem);
+    border-radius: 0 0 50% 50% / 4rem;
+    transform: translateY(4rem);
 }
 
 .footer {
-	background-color: var(--main);
-	padding-top: 7em;
-	display: flex;
-	justify-content: space-between;
-	align-items: start;
-	padding-left: 2em;
-	padding-right: 2em;
+    background-color: var(--main);
+    padding-top: 7em;
+    display: flex;
+    justify-content: space-between;
+    align-items: start;
+    padding-left: 2em;
+    padding-right: 2em;
 }
 
 .footer a {
-	color: white;
+    color: white;
 }
 
 .footer-scls {
-	max-width: 30em;
-	font-size: 0.6em;
-	margin-bottom: 2em;
+    max-width: 30em;
+    font-size: 0.6em;
+    margin-bottom: 2em;
 }
 
 .footer-scls img {
-	width: 4.7em;
+    width: 4.7em;
 }
 
-.footer>img {
-	width: 30em;
+.footer > img {
+    width: 30em;
 }
 
 /* Responsive queries go here */
 @media screen and (max-width: 700px) {
-	html {
-		font-size: 0.85em;
-	}
+    html {
+        font-size: 0.85em;
+    }
 }
 
 @media screen and (max-width: 650px) {
-	html {
-		font-size: 0.8em;
-	}
+    html {
+        font-size: 0.8em;
+    }
 
-	.footer>img {
-		width: 15em;
-	}
+    .footer > img {
+        width: 15em;
+    }
 }
 
 @media screen and (max-width: 540px) {
-	html {
-		font-size: 0.6em;
-	}
+    html {
+        font-size: 0.6em;
+    }
 
-	.footer>img {
-		display: none;
-	}
+    .footer > img {
+        display: none;
+    }
 }
 
 @media screen and (max-width: 420px) {
-	html {
-		font-size: 0.5em;
-	}
+    html {
+        font-size: 0.5em;
+    }
 }
 
 @media screen and (max-width: 320px) {
-	html {
-		font-size: 0.45em;
-	}
+    html {
+        font-size: 0.45em;
+    }
 }
 
 #cal {
-	border: solid 1px #777;
-	width: 800px;
-	height: 600px;
+    border: solid 1px #777;
+    width: 800px;
+    height: 600px;
 }
 
 #calendar {
-	display: flex;
-	align-items: center;
-	justify-content: center;
-	flex-direction: column;
-	color: var(--main);
-	padding-top: 2em;
-	padding-bottom: 2em;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+    color: var(--main);
+    padding-top: 2em;
+    padding-bottom: 2em;
 }
 
 iframe {
-	width: 80vw;
-	height: 600px;
-	max-width: 1000px;
+    width: 80vw;
+    height: 600px;
+    max-width: 1000px;
 }
 
 .project-desc {
-	display: flex;
+    display: flex;
     justify-content: center;
-	column-gap: 10em;
+    column-gap: 10em;
     vertical-align: middle;
-	flex-wrap: wrap;
+    flex-wrap: wrap;
+    padding: 2em;
+    align-items: center;
 }
 
 .project-desc img {
-	width: 30em;
-    padding-top: 3em;
-    padding-bottom: 3em;
-}
\ No newline at end of file
+    border-radius: 0.2em;
+    width: 100%;
+    max-width: 600px;
+    max-height: 400px;
+}
diff --git a/src/public/committees.tsx b/src/public/committees.tsx
index 7f3f43c..69c841a 100644
--- a/src/public/committees.tsx
+++ b/src/public/committees.tsx
@@ -22,7 +22,7 @@ class Main extends React.Component {
                 <Splash
                     cta="The backbone of IEEE. Come help make a difference!"
                     delay={2000}
-                    backgrounds={["img/backgrounds/committee.webp"]}
+                    backgrounds={["/assets/img/backgrounds/committee.webp"]}
                 ></Splash>
                 <DefaultSection
                     title="Join us!"
@@ -34,27 +34,27 @@ class Main extends React.Component {
                     <div className="cards">
                         <InvolveBox
                             boxTitle=""
-                            image="img/committees/technical.webp"
+                            image="/assets/img/committees/technical.webp"
                             description="Technical Committee"
                         ></InvolveBox>
                         <InvolveBox
                             boxTitle=""
-                            image="img/committees/social.webp"
+                            image="/assets/img/committees/social.webp"
                             description="Social Committee"
                         ></InvolveBox>
                         <InvolveBox
                             boxTitle=""
-                            image="img/committees/professional.webp"
+                            image="/assets/img/committees/professional.webp"
                             description="Professional Committee"
                         ></InvolveBox>
                         <InvolveBox
                             boxTitle=""
-                            image="img/committees/pr.webp"
+                            image="/assets/img/committees/pr.webp"
                             description="PR Committee"
                         ></InvolveBox>
                         <InvolveBox
                             boxTitle=""
-                            image="img/committees/outreach.webp"
+                            image="/assets/img/committees/outreach.webp"
                             description="Outreach Committee"
                         ></InvolveBox>
                     </div>
diff --git a/src/public/components/Carousel.tsx b/src/public/components/Carousel.tsx
index 6bc67ea..5648432 100644
--- a/src/public/components/Carousel.tsx
+++ b/src/public/components/Carousel.tsx
@@ -43,7 +43,7 @@ export default class Carousel extends Component<CarouselProps, CarouselState> {
             <div className="carousel">
                 <img
                     className="carousel-left"
-                    src="img/arrow.svg"
+                    src="/assets/img/arrow.svg"
                     style={
                         this.state.page === 0 ? { visibility: "hidden" } : {}
                     }
@@ -60,7 +60,7 @@ export default class Carousel extends Component<CarouselProps, CarouselState> {
                 </div>
                 <img
                     className="carousel-right"
-                    src="img/arrow.svg"
+                    src="/assets/img/arrow.svg"
                     style={
                         this.state.page === arr.length - 1
                             ? { visibility: "hidden" }
diff --git a/src/public/components/Footer.tsx b/src/public/components/Footer.tsx
index 4c049c3..1048565 100644
--- a/src/public/components/Footer.tsx
+++ b/src/public/components/Footer.tsx
@@ -12,7 +12,7 @@ export default class Footer extends Component {
     public render() {
         return (
             <div className="footer">
-                <img src="img/logo_white.svg"></img>
+                <img src="/assets/img/logo_white.svg"></img>
                 <div className="footer-scls">
                     {[...EMAIL_WHITE, ...SOCIALS_WHITE].map((n) => (
                         <SocialCard
diff --git a/src/public/components/TopBar.tsx b/src/public/components/TopBar.tsx
index feb019c..7a3e81d 100644
--- a/src/public/components/TopBar.tsx
+++ b/src/public/components/TopBar.tsx
@@ -44,7 +44,7 @@ export default class TopBar extends React.Component<TopBarProps, TopBarState> {
             >
                 <div className="img-cont">
                     <a href="/">
-                        <img src="img/logo.svg"></img>
+                        <img src="/assets/img/logo.svg"></img>
                     </a>
                     <div
                         className="burger"
diff --git a/src/public/events.tsx b/src/public/events.tsx
index e0faa32..ccb2522 100644
--- a/src/public/events.tsx
+++ b/src/public/events.tsx
@@ -20,7 +20,7 @@ class Main extends React.Component {
                 <Splash
                     cta="Come out to our events!"
                     delay={2000}
-                    backgrounds={["img/backgrounds/fa21social.webp"]}
+                    backgrounds={["/assets/img/backgrounds/fa21social.webp"]}
                 ></Splash>
 
                 <DefaultSection title="Events">
diff --git a/src/public/index.tsx b/src/public/index.tsx
index 05ee1a5..121f053 100644
--- a/src/public/index.tsx
+++ b/src/public/index.tsx
@@ -22,7 +22,7 @@ class Main extends React.Component {
                 <Splash
                     cta="Join the 2nd largest IEEE student branch in the US!"
                     delay={2000}
-                    backgrounds={["img/backgrounds/fa21qp.webp"]}
+                    backgrounds={["/assets/img/backgrounds/fa21qp.webp"]}
                 ></Splash>
                 <div id="about-us">
                     <DefaultSection
@@ -61,17 +61,17 @@ class Main extends React.Component {
                     <div className="cards">
                         <InvolveBox
                             boxTitle="Events"
-                            image="img/backgrounds/fa21social.webp"
+                            image="/assets/img/backgrounds/fa21social.webp"
                             description="Meet fellow IEEE members!"
                         ></InvolveBox>
                         <InvolveBox
                             boxTitle="Projects"
-                            image="img/backgrounds/robofest.webp"
+                            image="/assets/img/backgrounds/robofest.webp"
                             description="Learn new skills!"
                         ></InvolveBox>
                         <InvolveBox
                             boxTitle="Committees"
-                            image="img/backgrounds/gbm.webp"
+                            image="/assets/img/backgrounds/gbm.webp"
                             description="Build our amazing community!"
                         ></InvolveBox>
                     </div>
diff --git a/src/public/projects.tsx b/src/public/projects.tsx
index 90bfc3f..6dcf2c6 100644
--- a/src/public/projects.tsx
+++ b/src/public/projects.tsx
@@ -21,7 +21,7 @@ class Main extends React.Component {
                 <Splash
                     cta="Gain hands-on experience to make your resume stand out! No experience required!"
                     delay={2000}
-                    backgrounds={["img/backgrounds/robocar.webp"]}
+                    backgrounds={["/assets/img/backgrounds/robocar.webp"]}
                 ></Splash>
 
 
@@ -33,7 +33,7 @@ class Main extends React.Component {
                         ]}
                     >
                     </DefaultSection>
-                    <img src="img/backgrounds/micromouse.webp"></img>
+                    <img src="/assets/img/backgrounds/micromouse.webp"></img>
                 </div>
 
                 <div className="project-desc">
@@ -44,7 +44,7 @@ class Main extends React.Component {
                         ]}
                     >
                     </DefaultSection>
-                    <img src="img/backgrounds/sp22qp.webp"></img>
+                    <img src="/assets/img/backgrounds/sp22qp.webp"></img>
                 </div>
 
                 <div id="contact-us">
diff --git a/src/util/index.ts b/src/util/index.ts
index cef6181..fdfc5c3 100644
--- a/src/util/index.ts
+++ b/src/util/index.ts
@@ -24,8 +24,8 @@ const WEBSITES = [
         sitename: "index",
         title: "IEEE at UCSD",
         description: "",
-        jsfile: "assets/js/index.js",
-        cssfile: "assets/css/styles.css",
+        jsfile: "/assets/js/index.js",
+        cssfile: "/assets/css/styles.css",
         themecolor: "",
         path: "/",
     },
@@ -33,24 +33,24 @@ const WEBSITES = [
         sitename: "events",
         title: "IEEE at UCSD",
         description: "",
-        jsfile: "assets/js/events.js",
-        cssfile: "assets/css/styles.css",
+        jsfile: "/assets/js/events.js",
+        cssfile: "/assets/css/styles.css",
         themecolor: "",
     },
     {
         sitename: "projects",
         title: "IEEE at UCSD",
         description: "",
-        jsfile: "assets/js/projects.js",
-        cssfile: "assets/css/styles.css",
+        jsfile: "/assets/js/projects.js",
+        cssfile: "/assets/css/styles.css",
         themecolor: "",
     },
     {
         sitename: "committees",
         title: "IEEE at UCSD",
         description: "",
-        jsfile: "assets/js/committees.js",
-        cssfile: "assets/css/styles.css",
+        jsfile: "/assets/js/committees.js",
+        cssfile: "/assets/css/styles.css",
         themecolor: "",
     },
 ] as Website[];
diff --git a/src/util/template.html b/src/util/template.html
index d3cd658..7c9d486 100644
--- a/src/util/template.html
+++ b/src/util/template.html
@@ -2,7 +2,7 @@
 <html lang="en">
 
 <head>
-	<link rel="stylesheet" type="text/css" href="assets/css/fonts.css" media="screen">
+	<link rel="stylesheet" type="text/css" href="/assets/css/fonts.css" media="screen">
 	<link rel="stylesheet" type="text/css" href="$CSSFILE" media="screen">
 	<link rel="icon" href="favicon.ico" type="image/x-icon">
 	<meta name="viewport" content="height=device-height, width=device-width, initial-scale=1">