diff --git a/addOfficerForm.html b/addOfficerForm.html
new file mode 100644
index 0000000..ab03b42
--- /dev/null
+++ b/addOfficerForm.html
@@ -0,0 +1,98 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
+    <link rel="stylesheet" href="styleAnnouncementEvent.css">
+    <title>Add Events</title>
+</head>
+<body>
+    <h1>Add Officer</h1>
+    <h2>Please enter the required information here.</h2>
+    <div class = "title">
+        <p>Name</p>
+        <textarea class = "titleText"></textarea>
+    </div>
+    <div class = "main">
+        <p>Info</p>
+        <textarea class = "mainText"></textarea>
+    </div>
+    <div class = "picture">
+        <p>Profile Image</p>
+        <img src="User Icons\user-group-icon.png" alt="User Pfp" style="position:relative; left:12.5%; width:100px; height:100px;">
+        <button class = "changePicButton">Change Profile Picture</button>
+    </div>
+    <div class = "buttons">
+        <button class = "btn">Add</button>
+        <a href = "officers.html">
+            <button class = "btn">Cancel</button>
+        </a>
+    </div>
+</body>
+<style>
+    h1{
+        font-size: 45px;
+        font-family: Arial, Helvetica, sans-serif;
+        background-color: lightgray;
+        text-align: center;
+        padding: 20px;
+        border-style: solid;
+    }
+    h2{
+        position:relative;
+        text-align:center;
+    }
+    .title{
+        display:flex;
+        left:5%
+    }
+    .main{
+        display:flex;
+        margin-top:2rem;
+    }
+    p{
+        position:relative;
+        font-size:25px;
+        left:1%;
+    }
+    .titleText {
+        position:relative;
+        left:2%;
+        resize:none;
+        width:100rem;
+        height:4rem;
+        font-size:30px;
+    }
+    .mainText{
+        position:relative;
+        left:3.1%;
+        min-height:10rem;
+        width:100rem;
+    }
+    .picture{
+        display:flex;
+        margin-top:2rem;
+    }
+    .changePicButton{
+        position:relative;
+        left:32%;
+        height:3rem;
+        width:13rem;
+        margin-top:2rem;
+    }
+    .buttons{
+        position:relative;
+        margin-top:1rem;
+        left:36%;
+    }
+    .btn{
+        position:relative;
+        width:250px;
+        height:50px;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+        margin: 0.5rem;
+    }
+</style>
\ No newline at end of file
diff --git a/announcementAddForm.html b/announcementAddForm.html
new file mode 100644
index 0000000..2376054
--- /dev/null
+++ b/announcementAddForm.html
@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
+    <link rel="stylesheet" href="styleAnnouncementEvent.css">
+    <title>Add Announcement</title>
+</head>
+<body>
+    <h1>Add Announcement</h1>
+    <h2>Please enter the required information here.</h2>
+    <div class = "title">
+        <p>Title</p>
+        <textarea class = "titleText"></textarea>
+    </div>
+    <div class = "main">
+        <p>Main Text</p>
+        <textarea class = "mainText"></textarea>
+    </div>
+    <div class = "buttons">
+        <button class = "btn">Add</button>
+        <a href = "announcements.html">
+            <button class = "btn">Cancel</button>
+        </a>
+    </div>
+</body>
+<style>
+    h1{
+        font-size: 45px;
+        font-family: Arial, Helvetica, sans-serif;
+        background-color: lightgray;
+        text-align: center;
+        padding: 20px;
+        border-style: solid;
+    }
+    h2{
+        position:relative;
+        text-align:center;
+    }
+    .title{
+        display:flex;
+        left:5%
+    }
+    .main{
+        display:flex;
+        margin-top:2rem;
+    }
+    p{
+        position:relative;
+        font-size:25px;
+        left:1%;
+    }
+    .titleText {
+        position:relative;
+        left:2%;
+        resize:none;
+        width:100rem;
+        height:4rem;
+        font-size:30px;
+    }
+    .mainText{
+        position:relative;
+        left:2%;
+        min-height:10rem;
+        width:96.4rem;
+    }
+    .buttons{
+        position:relative;
+        margin-top:1rem;
+        left:36%;
+    }
+    .btn{
+        position:relative;
+        width:250px;
+        height:50px;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+        margin: 0.5rem;
+    }
+</style>
\ No newline at end of file
diff --git a/announcements.html b/announcements.html
index 6bb7eb7..1232967 100644
--- a/announcements.html
+++ b/announcements.html
@@ -4,14 +4,15 @@
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
-    <link rel="stylesheet" href="styleAnnouncementEvent.css">
     <title>Announcements Demo Page</title>
 </head>
 <body>
     <h1>Announcements</h1>
-    <button class="featureBtn">
-        <h2>Add</h2>
-    </button>
+    <a href = "announcementAddForm.html">
+        <button class="featureBtn">
+            <h2>Add</h2>
+        </button>
+    </a>
     <button class="featureBtn">
         <h2>Remove</h2>
     </button>
@@ -42,4 +43,54 @@ <h2>Announcement 6</h2>
         <h2>Welcome to Announcements :D</h2>
         <p>Choose an announcement on the left!</p>
     </section>
-</body>
\ No newline at end of file
+</body>
+<style>
+    body{
+    margin: 0;
+    }
+    .featureBtn{
+        background-color: white;
+        position:relative;
+        left:120px
+    }
+    .btn{
+        display:block;
+        width:700px;
+        height:100px;
+        margin:auto;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+    }
+    div{
+        position:relative;
+        left:120px;
+        top:30px;
+        overflow-y: auto;
+        height: 500px;
+        width: 725px;
+        border-color:black;
+        border-style:solid;
+        background-color: white;
+    }
+    h1{
+        font-size: 45px;
+        font-family: Arial, Helvetica, sans-serif;
+        background-color: lightgray;
+        text-align: center;
+        padding: 20px;
+        border-style: solid;
+    }
+    section{
+        position:absolute;
+        left:1000px;
+        top:190px;
+        height: 500px;
+        width: 725px;
+        border-color:black;
+        border-style:solid;
+        background-color: white;
+        padding:20px;
+    }
+
+</style>
\ No newline at end of file
diff --git a/eventAddForm.html b/eventAddForm.html
new file mode 100644
index 0000000..f320e11
--- /dev/null
+++ b/eventAddForm.html
@@ -0,0 +1,82 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
+    <link rel="stylesheet" href="styleAnnouncementEvent.css">
+    <title>Add Events</title>
+</head>
+<body>
+    <h1>Add Events</h1>
+    <h2>Please enter the required information here.</h2>
+    <div class = "title">
+        <p>Title</p>
+        <textarea class = "titleText"></textarea>
+    </div>
+    <div class = "main">
+        <p>Main Text</p>
+        <textarea class = "mainText"></textarea>
+    </div>
+    <div class = "buttons">
+        <button class = "btn">Add</button>
+        <a href = "events.html">
+            <button class = "btn">Cancel</button>
+        </a>
+    </div>
+</body>
+<style>
+    h1{
+        font-size: 45px;
+        font-family: Arial, Helvetica, sans-serif;
+        background-color: lightgray;
+        text-align: center;
+        padding: 20px;
+        border-style: solid;
+    }
+    h2{
+        position:relative;
+        text-align:center;
+    }
+    .title{
+        display:flex;
+        left:5%
+    }
+    .main{
+        display:flex;
+        margin-top:2rem;
+    }
+    p{
+        position:relative;
+        font-size:25px;
+        left:1%;
+    }
+    .titleText {
+        position:relative;
+        left:2%;
+        resize:none;
+        width:100rem;
+        height:4rem;
+        font-size:30px;
+    }
+    .mainText{
+        position:relative;
+        left:2%;
+        min-height:10rem;
+        width:96.4rem;
+    }
+    .buttons{
+        position:relative;
+        margin-top:1rem;
+        left:36%;
+    }
+    .btn{
+        position:relative;
+        width:250px;
+        height:50px;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+        margin: 0.5rem;
+    }
+</style>
\ No newline at end of file
diff --git a/events.html b/events.html
index 6bf7181..ae07ef4 100644
--- a/events.html
+++ b/events.html
@@ -9,9 +9,11 @@
 </head>
 <body>
     <h1>Events</h1>
-    <button class="featureBtn">
-        <h2>Add</h2>
-    </button>
+    <a href = "eventAddForm.html">
+        <button class="featureBtn">
+            <h2>Add</h2>
+        </button>
+    </a>
     <button class="featureBtn">
         <h2>Remove</h2>
     </button>
@@ -40,6 +42,61 @@ <h2>Event 6</h2>
     </div>
     <section>
         <h2>Welcome to Events :D</h2>
+        <h3>When? : N/A</h3>
         <p>Choose an event on the left!</p>
     </section>
-</body>
\ No newline at end of file
+</body>
+<style>
+    body{
+    margin: 0;
+    }
+    .featureBtn{
+        background-color: white;
+        position:relative;
+        left:120px
+    }
+    .btn{
+        display:block;
+        width:700px;
+        height:100px;
+        margin:auto;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+    }
+    div{
+        position:relative;
+        left:120px;
+        top:30px;
+        overflow-y: auto;
+        height: 500px;
+        width: 725px;
+        border-color:black;
+        border-style:solid;
+        background-color: white;
+    }
+    h1{
+        font-size: 45px;
+        font-family: Arial, Helvetica, sans-serif;
+        background-color: lightgray;
+        text-align: center;
+        padding: 20px;
+        border-style: solid;
+    }
+    h3{
+        font-size:25px;
+        font-style:italic;
+    }
+    section{
+        position:absolute;
+        left:1000px;
+        top:190px;
+        height: 500px;
+        width: 725px;
+        border-color:black;
+        border-style:solid;
+        background-color: white;
+        padding:20px;
+    }
+
+</style>
\ No newline at end of file
diff --git a/index.html b/index.html
index 4e83eb9..0e60fe3 100644
--- a/index.html
+++ b/index.html
@@ -26,3 +26,26 @@ <h2>Events</h2>
     </a>
 </body>
 </html>
+<style>
+    body{
+    margin: 0;
+    }
+    h1{
+        font-size: 45px;
+        font-family: Arial, Helvetica, sans-serif;
+        background-color: lightgray;
+        text-align: center;
+        padding: 20px;
+        border-color:black;
+        border-style: solid;
+    }
+    .btn{
+        display:block;
+        width:400px;
+        height:200px;
+        margin:auto;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+    }
+</style>
\ No newline at end of file
diff --git a/officers.html b/officers.html
index 102fb37..c7e2030 100644
--- a/officers.html
+++ b/officers.html
@@ -10,9 +10,11 @@
 <body>
     <h1>Officers</h1>
     <div class = "feature">
-    <button class="featureBtn">
-        <h2>Add</h2>
-    </button>
+    <a href = "addOfficerForm.html">
+        <button class="featureBtn">
+            <h2>Add</h2>
+        </button>
+    </a>
     <button class="featureBtn">
         <h2>Remove</h2>
     </button>
@@ -76,4 +78,63 @@ <h3>Unknown Person</h3>
 
     <script src="script.js"></script>
 </body>
-</html>
\ No newline at end of file
+</html>
+<style>
+    body{
+    margin: 0;
+    }
+    .feature{
+        display:block;
+        width: 400px;
+        position:relative;
+    }
+    .featureBtn{
+        background-color: white;
+        position:relative;
+        left:5px;
+    }
+    h1{
+        font-size: 45px;
+        font-family: Arial, Helvetica, sans-serif;
+        background-color: lightgray;
+        text-align: center;
+        padding: 20px;
+        border-color:black;
+        border-style: solid;
+    }
+    h2{
+        font-size: 20px;
+        font-family: Arial, Helvetica, sans-serif;
+        padding: 20px;
+    }
+    .btn{
+        position: relative;
+        left:120px;
+        width:400px;
+        height:200px;
+        margin:auto;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+    }
+
+    div{
+        width:900px;
+        height:450;
+        margin:auto;
+        border-color:black;
+        border-style: solid;
+        background-color: white;
+        padding:20px;
+    }
+    h3{
+        display:inline-block;
+        right:120px;
+    }
+    p{
+        white-space: pre;
+    }
+    img {
+        float:left;
+    }
+</style>
\ No newline at end of file
diff --git a/styleAnnouncementEvent.css b/styleAnnouncementEvent.css
deleted file mode 100644
index 71602f3..0000000
--- a/styleAnnouncementEvent.css
+++ /dev/null
@@ -1,47 +0,0 @@
-body{
-    margin: 0;
-}
-.featureBtn{
-    background-color: white;
-    position:relative;
-    left:120px
-}
-.btn{
-    display:block;
-    width:700px;
-    height:100px;
-    margin:auto;
-    border-color:black;
-    border-style: solid;
-    background-color: white;
-}
-div{
-    position:relative;
-    left:120px;
-    top:30px;
-    overflow-y: auto;
-    height: 500px;
-    width: 725px;
-    border-color:black;
-    border-style:solid;
-    background-color: white;
-}
-h1{
-    font-size: 45px;
-    font-family: Arial, Helvetica, sans-serif;
-    background-color: lightgray;
-    text-align: center;
-    padding: 20px;
-    border-style: solid;
-}
-section{
-    position:absolute;
-    left:1000px;
-    top:190px;
-    height: 500px;
-    width: 725px;
-    border-color:black;
-    border-style:solid;
-    background-color: white;
-    padding:20px;
-}
diff --git a/styleIndex.css b/styleIndex.css
deleted file mode 100644
index 0dc0c77..0000000
--- a/styleIndex.css
+++ /dev/null
@@ -1,21 +0,0 @@
-body{
-    margin: 0;
-}
-h1{
-    font-size: 45px;
-    font-family: Arial, Helvetica, sans-serif;
-    background-color: lightgray;
-    text-align: center;
-    padding: 20px;
-    border-color:black;
-    border-style: solid;
-}
-.btn{
-    display:block;
-    width:400px;
-    height:200px;
-    margin:auto;
-    border-color:black;
-    border-style: solid;
-    background-color: white;
-}
\ No newline at end of file
diff --git a/styleOfficer.css b/styleOfficer.css
deleted file mode 100644
index 8162861..0000000
--- a/styleOfficer.css
+++ /dev/null
@@ -1,57 +0,0 @@
-body{
-    margin: 0;
-}
-.feature{
-    display:block;
-    width: 400px;
-    position:relative;
-}
-.featureBtn{
-    background-color: white;
-    position:relative;
-    left:5px;
-}
-h1{
-    font-size: 45px;
-    font-family: Arial, Helvetica, sans-serif;
-    background-color: lightgray;
-    text-align: center;
-    padding: 20px;
-    border-color:black;
-    border-style: solid;
-}
-h2{
-    font-size: 20px;
-    font-family: Arial, Helvetica, sans-serif;
-    padding: 20px;
-}
-.btn{
-    position: relative;
-    left:120px;
-    width:400px;
-    height:200px;
-    margin:auto;
-    border-color:black;
-    border-style: solid;
-    background-color: white;
-}
-
-div{
-    width:900px;
-    height:450;
-    margin:auto;
-    border-color:black;
-    border-style: solid;
-    background-color: white;
-    padding:20px;
-}
-h3{
-    display:inline-block;
-    right:120px;
-}
-p{
-    white-space: pre;
-}
-img {
-    float:left;
-}
\ No newline at end of file
