diff --git a/app/__pycache__/routes.cpython-311.pyc b/app/__pycache__/routes.cpython-311.pyc
index 6d68df8..c110b0b 100644
Binary files a/app/__pycache__/routes.cpython-311.pyc and b/app/__pycache__/routes.cpython-311.pyc differ
diff --git a/app/routes.py b/app/routes.py
index 9b05885..4b230cf 100644
--- a/app/routes.py
+++ b/app/routes.py
@@ -49,7 +49,7 @@ def get_courses():
 
             for course in dt:
                 df = df.append(course["attributes"], ignore_index=True)
-                df = df.drop("list_image_url", axis=1)
+            # df = df.drop("list_image_url", axis=1)
 
             if "next" not in next:
                 break
@@ -107,9 +107,41 @@ def get_people():
         return "what what"
 
 
-@app.route("/add_options")
+@app.route("/add_options", methods=["POST"])
 def add_options():
-    return render_template("bulk_add.html", title="Bulk Add Learners")
+    array = []
+    df = pd.DataFrame()
+    x = 0
+    if request.method == "POST":
+        while True:
+            x += 1
+            url = f"https://api.northpass.com/v2/groups?page={x}"
+            headers = {"accept": "application/json", "X-Api-Key": session["key"]}
+            response = requests.get(url, headers=headers)
+            data = response.text
+            df = pd.json_normalize(data)
+            print(df)
+
+            # print(type(response))
+            # print(response)
+            # jsonresponse = response.json()
+            # dt = jsonresponse["data"]
+            # next = jsonresponse["links"]
+
+            for group in dt:
+                df = df.from_dict(group["attributes"], orient="index")
+                # df = df.append(group["id"], ignore_index=True)
+                # df = df.append(group["attributes"], ignore_index=True)
+
+            if "next" not in next:
+                break
+
+        print(df)
+        session["dfcsv"] = df.to_csv()
+        dfgroups = df.to_html(col_space=5)
+        return render_template(
+            "bulk_add.html", tables=dfgroups, titles="Bulk Add Learners"
+        )
 
 
 @app.route("/bulk_add", methods=["GET", "POST"])
diff --git a/app/static/css/styles.css b/app/static/css/styles.css
index e06c155..c104ab7 100644
--- a/app/static/css/styles.css
+++ b/app/static/css/styles.css
@@ -51,14 +51,14 @@ html {
 
 input,
 select {
-    width: 200px;
-    height: 25px;
-    margin: 2px;
-    --moz-box-sizing: border-box;
-    --webkit-box-sizing: border-box;
-    box-sizing: border-box;
+  width: 200px;
+  height: 25px;
+  margin: 2px;
+  --moz-box-sizing: border-box;
+  --webkit-box-sizing: border-box;
+  box-sizing: border-box;
 }
-
+/*
 .dataframe {
   font-size: 11pt;
   border-collapse: collapse;
@@ -78,7 +78,7 @@ select {
 .dataframe tr:hover {
   background: #096F8E;
   cursor: pointer;
-}
+}*/
 
 h1 {
   font-size: 4rem;
diff --git a/app/templates/bulk_add.html b/app/templates/bulk_add.html
index 7500594..c411780 100644
--- a/app/templates/bulk_add.html
+++ b/app/templates/bulk_add.html
@@ -3,22 +3,27 @@
 {% block content %}
 	<h4>Hello! Please enter the emails below.</h4>
 	{% if error %}
-	<p class=error><strong> </strong>{{ error }}
+	<p class=error><strong> </strong>{{ error }}</p>
 	{% endif %}
 
 	<p><label for="Bulk Add"> Please select the appropriate options below.</label></p>
 	  <form action="{{ url_for("bulk_add")}}" method="post">
 	    <p>Please Copy and Paste Emails of learners you'd like to add</p>
 	    <textarea id="emails" name="emails" rows="4" cols="50"></textarea>
-	    <p>Please select which Groups these learners should be added to. </p>
-	    <select name="groups" id="groups" multiple>
+	    <p>Please paste in the Group UUIDs which these learners should be added to.</p>
+	    <textarea id="groups" name="groups" rows="4" cols="50"></textarea>
 	      <option></option>
 	      <input type="submit" value="Submit"></select>
-	 </form>
-
+	   </form>
+	<h4>Here is a list of your client's Groups.</h4>
+	<a id="download" href="/downloadcsv">Click here to download as CSV.</a>
     </div>
+	  <div class="panda-table">
+	    <!-- Display Converted Table -->
+	    <h2> {{ titles }} </h2>
+	    {{ table }}
+      </div>
   </div>
-  </body>
-  <script src="{{ url_for('static', filename='getallgroups.js')}}"></script>
+</body>
   {% endblock %}
 
diff --git a/app/templates/head.html b/app/templates/head.html
index 5d6c11b..7e1fe2b 100644
--- a/app/templates/head.html
+++ b/app/templates/head.html
@@ -15,7 +15,7 @@
     <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap"
 	rel="stylesheet">
     <link rel="stylesheet" href="{{ url_for('static', filename="css/styles.css") }}" />
-    <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
+  <script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>
     <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
   </head>
 <body>
diff --git a/app/templates/options.html b/app/templates/options.html
index 53f711a..ed084f3 100644
--- a/app/templates/options.html
+++ b/app/templates/options.html
@@ -27,14 +27,17 @@
 		    </a>
 		    </form>
 
-      <div class="card" >
-		    <a class="a-card" href="{{ url_for('add_options')}}"
-		      style="cursor:pointer; color: inherit; text-decoration: none">
-		    <i class="ri-building-line card__icon"></i>
-		    <p class="card__name">Bulk Add</p>
+      <form class="card"
+		    id="add_options"
+		    action="{{ url_for('add_options')}}"
+		    method="post">
+		    <a class="a-card"
+		      onclick="document.forms['add_options'].submit()"
+		      style="cursor:pointer;">
+		    <i class="ri-send-plane-line card__icon"></i>
+		    <p class="card__name">Bulk Add People</p>
 		    </a>
 
-
     </div>
   </body>
   {% endblock %}
diff --git a/app/templates/table.html b/app/templates/table.html
index 63384dc..c4b148e 100644
--- a/app/templates/table.html
+++ b/app/templates/table.html
@@ -14,4 +14,4 @@
       </div>
     </div>
   </body>
-  {% endblock %}
+{% endblock %}