diff --git a/Components/NavBar.js b/Components/NavBar.js
index 23ad2be..a841d38 100644
--- a/Components/NavBar.js
+++ b/Components/NavBar.js
@@ -1,11 +1,18 @@
 import React, { Component } from "react";
 import Styles from '../styles/navbar.module.css';
+import Cookies from 'js-cookie';
+// import { setInfo } from "../redux/actions/main"
+import { connect } from "react-redux";
+// import { makeStore } from "../redux/store";
+
+// const store = makeStore();
 
 class NavBar extends Component {
 	constructor(props) {
 		super(props);
         this.state = {
-            isOpen: false  // true
+            isOpen: false,
+            cookie: 'light'
         }
         this.isTouchDevice = false
         this.hoverSensor = React.createRef();
@@ -33,18 +40,11 @@
         } else {
             this.isTouchDevice = false
         }
+        this.setState({
+            cookie: Cookies.get('theme')
+        })
     }
 
- /*   onEnter() {
-        if ( !this.isTouchDevice ) {
-            return this.toggleVertical(this, true)
-        }
-    }
-
-    onLeave() {
-        return this.toggleVertical(this, false)
-    }
-*/
     onClick() {
         if ( this.isTouchDevice ) {
             return this.toggleVertical(this)
@@ -57,6 +57,20 @@
         }));
     }
 
+    updateCookie(that) {
+        // return () => {
+        //     if (that.props.theme == "light") {
+        //         that.props.setInfo('dark')
+        //     } else {
+        //         that.props.setInfo('light')
+        //     }
+        //     this.setState({
+        //         cookie: that.props.theme
+        //     })
+        //     // store.dispatch();
+        // }
+    }
+
 	render() {
 		return (
             <>
@@ -71,7 +85,11 @@
                         {/* <a href="https://clcks.dev"><img className={Styles.icon} src="/Icons/CL.svg"/></a> */}
                     </div>
                     <div className={Styles.group}>
-                        <a href="/#"><img alt="Theme" className={Styles.icon} src="/Icons/CMP.svg"/></a>
+                        <a onClick={this.updateCookie(this)}><img
+                            alt="Theme"
+                            className={Styles.icon}
+                            src={this.state.cookie + ".svg"}
+                        /></a>
                     </div>
                 </div>
             </>
@@ -79,4 +97,16 @@
 	}
 }
 
+
+// const mapStateToProps = state => {
+//     return { theme: state.main.theme }
+// }
+
+// const mapDispatchToProps = {
+//     setInfo
+// }
+
+// const nav = connect(mapStateToProps, mapDispatchToProps)(NavBar);
+// export default nav;
+
 export default NavBar;
\ No newline at end of file
diff --git a/Components/Paragraph.js b/Components/Paragraph.js
index 4348296..c332832 100644
--- a/Components/Paragraph.js
+++ b/Components/Paragraph.js
@@ -3,7 +3,9 @@
 class Paragraph extends Component {
     render () {
         return (
-            <p style={{width: "100%", textAlign: "left", paddingLeft: "15%", paddingRight: "15%", fontSize: "120%"}}>{this.props.children}</p>
+            <p style={{width: "100%", textAlign: "left", paddingLeft: "15%", paddingRight: "15%", fontSize: "120%", color: "var(--card-text-color)"}}>
+                {this.props.children}
+            </p>
         );
     }
 }
diff --git a/Components/SectionHeading.js b/Components/SectionHeading.js
index 3e417bf..ed77661 100644
--- a/Components/SectionHeading.js
+++ b/Components/SectionHeading.js
@@ -9,7 +9,7 @@
 
 	render() {
 		return (
-            <h1 className={Styles.title} id={this.props.id}>{this.props.title}</h1>
+            <h1 className={Styles.title} id={this.props.id}>{this.props.children}</h1>
         )
 	}
 }
diff --git a/Components/Subheading.js b/Components/Subheading.js
new file mode 100644
index 0000000..964f1dd
--- /dev/null
+++ b/Components/Subheading.js
@@ -0,0 +1,17 @@
+import { Component } from "react";
+import Styles from '../styles/subheading.module.css';
+
+class SubHeading extends Component {
+	constructor(props) {
+		super(props);
+	}
+
+
+	render() {
+		return (
+            <h2 className={Styles.title} id={this.props.id}>{this.props.children}</h2>
+        )
+	}
+}
+
+export default SubHeading;
\ No newline at end of file
diff --git a/Components/Timeline.js b/Components/Timeline.js
new file mode 100644
index 0000000..e69de29
--- /dev/null
+++ b/Components/Timeline.js