diff --git a/src/App.scss b/src/App.scss
index 0acee05..c0762ea 100644
--- a/src/App.scss
+++ b/src/App.scss
@@ -6,120 +6,137 @@ $purple200: #ce93d8;
 
 .App {
   text-align: center;
-}
-
-header {
-  background-color: $purple200;
-  display: flex;
-  align-items: center;
-  border-bottom: 1px solid black;
-  font-family: 'Open Sans', sans-serif;
-  a {
-    transition: color 150ms ease;
-    color: black;
-    font-weight: 900;
-    font-size: 2rem;
-    padding-left: 1rem;
-    border-right: 1px solid black;
-    padding-right: 1rem;
-    text-decoration: none;
-    &:visited {
-      color: inherit;
-    }
-    &:hover {
-      color: purple;
+  header {
+    background-color: $purple200;
+    display: flex;
+    align-items: center;
+    border-bottom: 1px solid black;
+    font-family: 'Open Sans', sans-serif;
+    a {
       transition: color 150ms ease;
+      color: black;
+      font-weight: 900;
+      font-size: 2rem;
+      padding-left: 1rem;
+      border-right: 1px solid black;
+      padding-right: 1rem;
+      text-decoration: none;
+      &:visited {
+        color: inherit;
+      }
+      &:hover {
+        color: purple;
+        transition: color 150ms ease;
+      }
+    }
+    h2 {
+      font-weight: 400;
+      position: relative;
+      padding-left: 1rem;
     }
   }
-  h2 {
-    font-weight: 400;
-    position: relative;
-    padding-left: 1rem;
-  }
 }
 
-.landing {
-  padding-top: 1.5rem;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  width: 75vw;
-  h3 {
-    position: relative;
-    top: 0.8rem;
-  }
-}
+// .landing {
+//   padding-top: 1.5rem;
+//   display: flex;
+//   flex-direction: column;
+//   align-items: center;
+//   width: 75vw;
+//   h3 {
+//     position: relative;
+//     top: 0.8rem;
+//   }
+// }
 
-.tech-scrollbar {
-  height: 5rem;
-  width: 60rem;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  position: relative;
-  left: 0;
-  overflow-x: hidden;
-  animation: 30s linear tech-scroll infinite;
-  .tech-bar-item {
+.technologies-page {
+  .tech-scrollbar {
+    height: 5rem;
+    width: 60rem;
     display: flex;
     align-items: center;
     justify-content: center;
     position: relative;
     left: 0;
-    font-size: 1.2rem;
-    font-weight: 700;
-    margin: 0.3rem;
-    padding: 1rem;
-    background-color: $purple200;
-    height: 5rem;
-    width: 20rem;
+    overflow-x: hidden;
+    animation: 30s linear tech-scroll infinite;
+    .tech-bar-item {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      position: relative;
+      left: 0;
+      font-size: 1.2rem;
+      font-weight: 700;
+      margin: 0.3rem;
+      padding: 1rem;
+      background-color: $purple200;
+      height: 5rem;
+      width: 20rem;
+    }
+
+    @keyframes hide-until-start {
+      from {
+        opacity: 0;
+      }
+      99% {
+        opacity: 0;
+      }
+      100% {
+        opacity: 1;
+      }
+    }
+    
+    @keyframes tech-scroll {
+      from {
+        left: -60rem;
+      }
+      100% {
+        left: 60rem;
+      }
+    }
+    
+    @keyframes from-right {
+      from {
+        left: 60rem;
+      }
+      100% {
+        left: -60rem;
+      }
+    }
+  }
+  
+  .backup-bar {
+    bottom: 5rem;
+    animation: 30s linear 15s tech-scroll infinite, 15s hide-until-start;
+  }
+  
+  .from-right {
+    animation: 30s linear from-right infinite;
+  }
+  .backup-from-right {
+    bottom: 5rem;
+    animation: 30s linear 15s from-right infinite, 15s hide-until-start;
+  }
+  
+  .variant-2 {
+    background-color: #62286d !important;
+    color: white !important;
   }
 }
 
-.backup-bar {
-  bottom: 5rem;
-  animation: 30s linear 15s tech-scroll infinite, 15s hide-until-start;
-}
-
-.from-right {
-  animation: 30s linear from-right infinite;
-}
-.backup-from-right {
-  bottom: 5rem;
-  animation: 30s linear 15s from-right infinite, 15s hide-until-start;
-}
-
-.variant-2 {
-  background-color: #62286d !important;
-  color: white !important;
-}
-
-@keyframes hide-until-start {
-  from {
-    opacity: 0;
+.about-me-page {
+  a {
+    color: white;
+    border-radius: 12px;
+    transition: color 0.3s linear;
+    text-decoration: none;
+    &:hover {
+      color: $purple200;
+      transition: color 0.3s linear;
+    }
   }
-  99% {
-    opacity: 0;
-  }
-  100% {
-    opacity: 1;
-  }
-}
-
-@keyframes tech-scroll {
-  from {
-    left: -60rem;
-  }
-  100% {
-    left: 60rem;
-  }
-}
-
-@keyframes from-right {
-  from {
-    left: 60rem;
-  }
-  100% {
-    left: -60rem;
+  .card-title {
+    text-transform: uppercase;
   }
 }
\ No newline at end of file
diff --git a/src/pages/AboutMe.js b/src/pages/AboutMe.js
index e8c1c47..2687430 100644
--- a/src/pages/AboutMe.js
+++ b/src/pages/AboutMe.js
@@ -1,37 +1,39 @@
 import '../App.scss';
-import { DocumentStyle, ProjectsPage } from '../styles/Style';
+import { DocumentStyle, AboutMePage } from '../styles/Style';
 
 import Card from '@mui/material/Card';
-import Grid from '@mui/material/Grid';
 
 const { htmlTheme } = DocumentStyle;
-const { headerCard, projectCards, cardDimensions } = ProjectsPage;
+const { headerCard, projectCards, cardDimensions, aboutGallery } = AboutMePage;
 
 export default function AboutMe() {
     return (
-        <div style={htmlTheme}>
-            <Card sx={[headerCard, cardDimensions]}>What I Do:</Card>
+        <div style={htmlTheme} className="about-me-page">
+            <Card sx={[headerCard, cardDimensions]} className="card-title">What I Do:</Card>
 
-            <Card sx={[projectCards, cardDimensions]}>
-                <h2>Create full stack web applications</h2>
-                <p>I have experience building web applications with and without back-end integrations.</p>
-                <p>I am comfortable conceptualizing and organizing complex structures, and as such, my projects tend to be natural in their structure and easy to maintain.</p>
-            </Card>
+            <div style={aboutGallery}>
+                <Card sx={[projectCards, cardDimensions]}>
+                    <h2 className="card-title">Create full stack web applications</h2>
+                    <p>I have experience building web applications with and without back-end integrations.</p>
+                    <p>I am comfortable conceptualizing and organizing complex structures, and as such, my projects tend to be 
+                        natural in their structure and easy to maintain.</p>
+                </Card>
 
-            <Card sx={[projectCards, cardDimensions]}>
-                <h2>Creative minded problem solver</h2>
-                <p>My rich creative background as a musician, composer, producer, and artistic collaborator provide me with a unique frame of reference for
-                    solving technical problems and adapting to dynamic environments.</p>
-                <a href="/">See some of my creative works for examples of my aptitudes, as well as some thoughts on how they apply to work as a developer!</a>
-            </Card>
+                <Card sx={[projectCards, cardDimensions]}>
+                    <h2 className="card-title">Creative minded problem solver</h2>
+                    <p>My <a href="/creative-projects">rich creative background as a musician, composer, producer,
+                        and artistic collaborator</a> provide me with a unique frame of reference for
+                        solving technical problems and adapting to dynamic environments.</p>
+                </Card>
 
-            <Card sx={[projectCards, cardDimensions]}>
-                <h2>Database Operations and Management</h2>
-                <p>My projects have featured both relational and non-relational databases, in particular PostgreSQL and MongoDB.</p>
-                <p>I also have experience with various technologies for connecting these to front-end applications, including Prisma and Supabase.</p>
-            </Card>
-        
-            <a href="/">Go home</a>
+                <Card sx={[projectCards, cardDimensions]}>
+                    <h2 className="card-title">Database Operations and Management</h2>
+                    <p>My projects have featured both relational and non-relational databases, in particular 
+                        PostgreSQL and MongoDB.</p>
+                    <p>I also have experience with various technologies for connecting these to front-end applications, 
+                        including Prisma and Supabase.</p>
+                </Card>
+            </div>
         </div>
     )
 }
\ No newline at end of file
diff --git a/src/pages/Technologies.js b/src/pages/Technologies.js
index e1d6847..04db620 100644
--- a/src/pages/Technologies.js
+++ b/src/pages/Technologies.js
@@ -11,7 +11,7 @@ const { htmlTheme } = DocumentStyle;
 
 export default function Technologies() {
     return (
-        <div style={htmlTheme}>
+        <div className="technologies-page" style={htmlTheme}>
             <Card sx={technologyCard}>
                 <h1>What technologies do I use?</h1>
             </Card>
diff --git a/src/styles/Style.js b/src/styles/Style.js
index 671f713..efbf729 100644
--- a/src/styles/Style.js
+++ b/src/styles/Style.js
@@ -98,17 +98,37 @@ export const WelcomePage = {
     }
 }
 
-export const ProjectsPage = {
+export const AboutMePage = {
     headerCard: {
-        backgroundColor: green['A700']
+        backgroundColor: purple[700],
+        color: indigo[50],
+        fontSize: '1.5rem',
+        alignItems: 'center',
+        justifyContent: 'center',
+        height: '12rem',
+        width: '12rem',
+        marginTop: '2rem',
+        marginBottom: '3rem',
     },
     projectCards: {
         backgroundColor: indigo[800],
-        color: indigo[100],
-    },
-    cardDimensions: {
+        color: indigo[50],
         width: '300px',
         height: '300px',
+        padding: '2rem',
+    },
+    cardDimensions: {
+        display: 'flex',
+        flexDirection: 'column',
+        borderRadius: '12px',
+        textAlign: 'center',
+    },
+    aboutGallery: {
+        display: 'flex',
+        height: '70vh',
+        width: '80vw',
+        justifyContent: 'space-around',
+        margin: '2rem',
     }
 }