diff --git a/src/components/About.js b/src/components/About.js
index 9c2c3b4..7ba1d6a 100644
--- a/src/components/About.js
+++ b/src/components/About.js
@@ -1,24 +1,36 @@
 import React from 'react';
-import { connect } from 'react-redux';
-import './css/Github.css';
-import {getRepos} from '../actions';
+import { Link } from 'react-router-dom';
+import './css/About.css';
+import ReactImage from '../img/react.webp';
+import ProfilePic from '../img/profile.webp';
 import Theater from './Theater';
-import space from '../img/space.webp';
+import Card from './Card';
 
-class Github extends React.Component {
+
+class About extends React.Component {
+  componentDidMount () {
+    document.title = "About";
+  }
 
   render() {
     return (
       <div className="About">
-        <h1>About</h1>
-        <p>Hello World</p>
+        <Theater title="About" description="This page has information about me and about this site." extraClasses="h-50v" />
+        <Card title="Build with React" image={ReactImage}>
+          This website is created with <a href="https://reactjs.org/">React</a>, a javascript library for creating user interfaces and webapps.
+          React uses a component based design to help developers create easily re-usable code, and to help streamline the development process.
+          JSX is a part of react which makes it easy to design websites directly in javascript code.
+        </Card>
+
+        <Card title="Camerin Figueroa" image={ProfilePic}>
+          I am a computer science student at Marist College in Poughkeepsie, NY. I'm closing in on my Bachelors Degree in Computer Science.
+          I went to Orange County Community College for my Associates Degree in Computer Science. You can find a few of my projects on my
+          <a href="https://github.com/RaspberryProgramming" target="_blank" rel="noreferrer"> github</a> or look through a list in the
+          <Link to="/github"> Github Page</Link>
+        </Card>
       </div>
     );
   }
 }
 
-const mapStateToProps = (state) => {
-  return { repos: state.github.repos};
-}
-
-export default connect(mapStateToProps, { getRepos })(Github);
\ No newline at end of file
+export default About;
\ No newline at end of file
diff --git a/src/components/css/About.css b/src/components/css/About.css
new file mode 100644
index 0000000..00d3e3f
--- /dev/null
+++ b/src/components/css/About.css
@@ -0,0 +1,8 @@
+.About {
+    background-color: #3F3F4A;
+    color: #AA9AA0
+}
+
+.About .title {
+    color: #BF8D8C !important;
+}
\ No newline at end of file
diff --git a/src/components/css/Home.css b/src/components/css/Home.css
index 8974919..d1ba0ef 100644
--- a/src/components/css/Home.css
+++ b/src/components/css/Home.css
@@ -1,18 +1,17 @@
 a:link {
-    color:black;
+    color: #FFFFFF;
     text-decoration: none;
     cursor: pointer;
 }
 
 a:visited {
-    color:black;
+    color: #FFF0F0;
     text-decoration: none;
     cursor: pointer;
 }
 
 body {
-    font-family: Arial, Helvetica, sans-serif;
-    margin:0;
+    font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;    margin:0;
     width: 100vw;
     overflow-x: hidden;
 
diff --git a/src/components/css/Theater.css b/src/components/css/Theater.css
index b26e67c..1fb8603 100644
--- a/src/components/css/Theater.css
+++ b/src/components/css/Theater.css
@@ -8,6 +8,10 @@
     height:100%;
 }
 
+.theater.h-50v {
+    height:50vw;
+}
+
 .theater-bg {
     
     height: 100%;
diff --git a/src/img/profile.webp b/src/img/profile.webp
new file mode 100644
index 0000000..cc58ee7
Binary files /dev/null and b/src/img/profile.webp differ
diff --git a/src/img/react.webp b/src/img/react.webp
new file mode 100644
index 0000000..c6fca56
Binary files /dev/null and b/src/img/react.webp differ