diff --git a/.gitignore b/.gitignore
index be43d50..5d8796a 100644
--- a/.gitignore
+++ b/.gitignore
@@ -2,3 +2,4 @@
 **/__pycache__/
 venv
 !.gitignore
+**/*.env
diff --git a/.gitmodules b/.gitmodules
index 7a92f59..a8cfad5 100644
--- a/.gitmodules
+++ b/.gitmodules
@@ -1,3 +1,4 @@
 [submodule "annbot"]
-	path = annbot
-	url = git@github.com:makeopensource/annbot.git
+    path = annbot
+    url = git@github.com:makeopensource/annbot.git
+    branch = main
diff --git a/Makefile b/Makefile
new file mode 100644
index 0000000..5ddba73
--- /dev/null
+++ b/Makefile
@@ -0,0 +1,33 @@
+
+# builds the pre-requisite materials needed for running
+# the application
+build: web annbot
+
+# Start the server
+up: build
+	docker compose up -d --build
+
+# Shut the server down
+down:
+	docker compose down
+
+# Restart the server
+restart: all
+	docker compose restart
+
+web: web/Dockerfile
+
+annbot: annbot/Dockerfile annbot/.env
+
+annbot/.env: config.py
+	python3 config.py
+
+annbot/Dockerfile: annbot/
+	git submodule init annbot
+	git submodule update --recursive
+
+clean:
+	git submodule deinit --all -f
+
+.PHONY:
+	build up down restart web annbot clean
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..d5f2a0f
--- /dev/null
+++ b/README.md
@@ -0,0 +1,26 @@
+# makeopensource.org
+
+This repo contains all content and programs for makeopensource.org. 
+
+Web content is stored in `web/data` and `web/templates`. The announcement
+bot is in `annbot/`.
+
+## Prerequisites
+
+* Git
+* Docker/Docker-Compose
+
+## Setup/Configuration
+
+1. To begin, run `$ make` to configure the submodules.
+
+2. Open `annbot/.env`, and enter a discord bot token, and the id of the 
+announcements channel in their respective places (in between the quotes).
+
+3. Open `docker-compose.yml` to configure both the host and port for the
+   applications.
+
+## Run
+
+Run `$ make up` to build the docker container and run it. See `Makefile` for
+additional commands for controlling the composed container set.
diff --git a/annbot b/annbot
index a99831c..e769c91 160000
--- a/annbot
+++ b/annbot
@@ -1 +1 @@
-Subproject commit a99831cd9da2c502384da0438d8d8f4b7e1b3c8e
+Subproject commit e769c917091ac3310731138479560c0b43c5a3a2
diff --git a/config.py b/config.py
new file mode 100644
index 0000000..5978362
--- /dev/null
+++ b/config.py
@@ -0,0 +1,13 @@
+if __name__ == "__main__":
+    print("-"*20)
+
+    token = input("please enter your Discord API Token\nToken: ")
+
+    print("-"*20)
+
+    channel_id = input("please enter the Channel ID of the Discord Channel you want to read\nChannel ID: ")
+
+    with open("annbot/.env", "w") as file:
+        file.write(f"TOKEN=\"{token}\"\nCHANNEL_ID=\"{channel_id}\"\n")
+
+    print("\ndone!")
diff --git a/docker-compose.yml b/docker-compose.yml
index 1bf9b89..2f4331c 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -1,12 +1,27 @@
-version: '3.3'
+version: '3.9'
 services:
   mongo:
     image: mongo:4.2.5
+    deploy:
+      restart_policy:
+        condition: any
   web:
     build: web
     environment:
       WAIT_HOSTS: mongo:27017
     ports:
       - '8080:8000'
+    deploy:
+      restart_policy:
+        condition: any
   annbot:
     build: annbot
+    environment:
+      - HOST=web
+      - PORT=8000
+    env_file:
+      - annbot/.env
+    deploy:
+      restart_policy:
+        condition: any
+
diff --git a/web/data/about.yml b/web/data/about.yml
index 994f9d6..9783ee7 100644
--- a/web/data/about.yml
+++ b/web/data/about.yml
@@ -24,3 +24,11 @@ admins:
 - name:     Nick Brown
   position: Vice President
   image:    assets/nick-brown.jpeg
+
+- name:     Dylan Zinsley
+  position: Event Coordinator
+  image:    assets/icon-rounded-80px.png
+
+- name:     Muhammad Niaz
+  position: Treasurer
+  image:    assets/icon-rounded-80px.png
diff --git a/web/static/css/web.css b/web/static/css/web.css
index 891f10d..e8c421d 100644
--- a/web/static/css/web.css
+++ b/web/static/css/web.css
@@ -20,29 +20,61 @@ b {
     font-weight: 500;
 }
 
-.program-list {
+.hero {
+    font-size: 30px;
+    line-height: 3rem;
+    padding: 20px 40px;
+    background-color: orange;
+    font-family: "fira mono";
 }
 
-.program-link {
+.program-list {
     display: flex;
+    flex-wrap: wrap;
+}
+
+.program {
     align-items: center;
-    text-decoration: none;
+}
+
+.program-link {
     color: none;
 }
 
 .program-link img {
-    height: 20px;
-    margin-right: 10px;
+    height: 30px;
+    margin-right: 20px;
+}
+
+.program-link p {
+    margin-right: 20px;
+}
+
+.admin-list {
 }
 
 .admin {
     display: flex;
     align-items: center;
+    margin-bottom: 20px;
 }
 
 .admin img {
-    height: 50px;
+    height: 80px;
     margin-right: 10px;
+    border-radius: 100px;
+}
+
+.admin p {
+    margin-block-end: 0;
+}
+
+.admin-name {
+    font-weight: var(--xheavy);
+}
+
+.admin-position {
+    color: var(--blue);
 }
 
 .discord-announcement {
@@ -64,6 +96,10 @@ b {
     margin: 0 10px 10px 0;
 }
 
+.emoji {
+    width: 25px;
+}
+
 .channel {
     font-weight: var(--heavy);
     color: var(--blue);
diff --git a/web/templates/_nav.html b/web/templates/_nav.html
index 3382bd7..5899f4c 100644
--- a/web/templates/_nav.html
+++ b/web/templates/_nav.html
@@ -4,7 +4,8 @@
 	{% block title %}<title>MakeOpenSource</title>{% endblock %}
     
 	<link rel="icon" type="image" href=""/>
-    <link rel="stylesheet" type="text/css" href="static/css/makeopensource-style-guide.css" />
+    <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/makeopensource/WebStyles/dist/css/webstyles.css" />
+    <!-- <link rel="stylesheet" type="text/css" href="static/css/makeopensource-style-guide.css" /> -->
     <link rel="stylesheet" type="text/css" href="static/css/web.css" />
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
@@ -20,12 +21,12 @@
         <a href="/announcements" class="navlink">Announcements</a>
         <a href="/about" class="navlink">About</a>
         <a href="/github" class="navlink">GitHub</a>
-        <a href="/matrix" class="navlink">Matrix</a>
         <a href="/calendar" class="navlink">Calendar</a>
 	</div>
     <div class="page">
 	    <div>{% block content %}{% endblock %}</div>
     </div>
+    <script src="https://cdn.jsdelivr.net/gh/makeopensource/WebStyles/dist/js/webstyles.js"></script>
 
   </body>
 </html>
diff --git a/web/templates/about.html b/web/templates/about.html
index 2bad5b2..2620153 100644
--- a/web/templates/about.html
+++ b/web/templates/about.html
@@ -7,23 +7,27 @@ <h1>About</h1>
     <h2>Software</h2>
     <div class="program-list">
     {% for program in software %}
-        <a class="program-link" href="{{ program.url }}">
-            <img src="{{ program.icon }}">
-            <p>{{ program.name }}</p>
-        </a> 
+        <div class="program">
+            <a class="program-link" href="{{ program.url }}">
+                <!-- <img src="{{ program.icon }}">-->
+                <p>{{ program.name }}</p>
+            </a> 
+        </div>
     {% endfor %}
     </div>
 
     <h2>Our Team</h2>
 
+    <div class="admin-list">
     {% for admin in admins %}
         <div class="admin">
             <img src="{{ admin.image }}">
-            <p>
-                <b>{{ admin.position }}</b><br>
-                {{ admin.name }}
-            </p>
+            <div>
+                <p class="admin-name">{{ admin.name }}</p>
+                <p class="admin-position">{{ admin.position }}</p> 
+            </div>
         </div>
     {% endfor %}
+    </div>
 </div>
 {% endblock %} 
diff --git a/web/templates/announcements.html b/web/templates/announcements.html
index f07dd4d..6e4bc17 100644
--- a/web/templates/announcements.html
+++ b/web/templates/announcements.html
@@ -2,7 +2,13 @@
 
 {% block content %}
 <h1>Announcements</h1>
-{% for ann in announcements %}
+
+<p>
+    A list of all announcements made in our course. Follow our <a href="/about">social media</a>
+    to keep up to date!
+</p>
+
+{% for ann in announcements %} 
     <div class="discord-announcement">
         {{ ann['createdAt']}}<br>
         <b>{{ ann['author'] }}</b><br><br>
diff --git a/web/templates/index.html b/web/templates/index.html
index c65865d..797847b 100644
--- a/web/templates/index.html
+++ b/web/templates/index.html
@@ -1,15 +1,30 @@
 {% extends "_nav.html" %}
 
 {% block content %}
-<div >
-    <h1>Welcome to MakeOpenSource, 
-        University at Buffalo's dedicated 
-        Open Source club 😄</h1>
+<div class="hero">
+    Welcome to <b>MakeOpenSource</b>, 
+    University at Buffalo's dedicated 
+    Open Source club!
 </div>
 
 <div>
 
 	<div>
+        <h2>Our Mission</h2>
+        <p>
+            MakeOpenSource's goal is to create a community of programmers 
+            and developers (of any skill level!) who can collaborate and 
+            contribute to one another's projects.
+        </p>
+
+        <h2>Open Source for All</h2>
+        <p>
+            Just as you don't have to be a computer scientist to have an 
+            interest in programming, you don't have to be a computer science 
+            major to be a part of MakeOpenSource. If you want to strengthen 
+            your programming knowledge, MakeOpenSource's events are a great 
+            opportunity to do so.
+        </p>
 		<h2>Learn More</h2>
 		<p>
         To learn more, visit the <a href="/about/">About</a> page or