diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..a29e85a
Binary files /dev/null and b/.DS_Store differ
diff --git a/.vscode/launch.json b/.vscode/launch.json
new file mode 100644
index 0000000..7df3e4f
--- /dev/null
+++ b/.vscode/launch.json
@@ -0,0 +1,27 @@
+{
+  // Use IntelliSense to learn about possible attributes.
+  // Hover to view descriptions of existing attributes.
+  // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+  "version": "0.2.0",
+  "configurations": [
+    {
+      "name": "Python: Current File",
+      "type": "python",
+      "request": "launch",
+      "program": "${file}",
+      "console": "integratedTerminal"
+    },
+    {
+      "name": "Python: Flask",
+      "type": "python",
+      "request": "launch",
+      "module": "flask",
+      "env": {
+        "FLASK_APP": "app.py",
+        "FLASK_ENV": "development"
+      },
+      "args": ["run", "--no-debugger"],
+      "jinja": true
+    }
+  ]
+}
diff --git a/README.md b/README.md
index 647f4b3..ed0cef3 100644
--- a/README.md
+++ b/README.md
@@ -1,2 +1,6 @@
-# Flask-Blog-Tutorial
-A blog application in python using Flask.
+# Guill Localhost
+
+A varity of things that go into this website...
+
+1. A reordering system for cpap supplies.
+2. A menu planning app (recipes, nutrition and planning)
diff --git a/__pycache__/app.cpython-38.pyc b/__pycache__/app.cpython-38.pyc
new file mode 100644
index 0000000..4cc569a
Binary files /dev/null and b/__pycache__/app.cpython-38.pyc differ
diff --git a/tutorial1/app.py b/app.py
similarity index 100%
rename from tutorial1/app.py
rename to app.py
diff --git a/life.md b/life.md
new file mode 100644
index 0000000..aad0e0b
--- /dev/null
+++ b/life.md
@@ -0,0 +1,58 @@
+# Life Program
+
+## Migration
+### Installation
+
+`pip install Flask-Migrate`
+
+### Instantiation
+Inside the __init__.py file insert the following command after both the app and db have been initalized.
+
+`Migrate(app, db)`
+
+### Usage
+### Initial
+
+`flask db init`
+
+This will come up with a message saying you need to configure a file.  Unless there is a specific reason to do so, simply skip that suggestion.
+### Every time you change model.py
+use the following commands in order in the terminal:
+
+`flask db migrate`
+
+`flask db upgrade`
+
+
+## Sections
+---
+### Health
+#### *Facilities*
+#### *Doctors*
+#### *Medications*
+#### *Medication List*
+#### *Hospitalizations*
+#### *Allergies*
+#### *Surgeries*
+#### *A1C*
+#### *C-PAP*
+----
+### Productivity
+#### *Tasks*
+#### *Goals*
+#### *Projects*
+----
+### Menu Planner
+#### *Planner*
+#### *Reciepts*
+#### *Shopping List*
+<br><br><br>
+
+# THINGS TO DO
+<ul><li>[ ] Make a page that has archive plan information.  a place you can look back at different weeks and see what you had</li>
+<li>[ ] Code Snippits</li>
+<li>[ ] Text the person when the medication is due to be refilled.</li>
+<li>[ ] Create a wallet size report in pdf that can be printed out</li>
+<li>[ ] Place the keys in the database</li>
+<li>[ ] Make each menu item selectable according to user (menu on for me off for shawn for example)</li>
+<li>[X] Grave markers</li>
\ No newline at end of file
diff --git a/migrations/README b/migrations/README
new file mode 100644
index 0000000..0e04844
--- /dev/null
+++ b/migrations/README
@@ -0,0 +1 @@
+Single-database configuration for Flask.
diff --git a/migrations/__pycache__/env.cpython-38.pyc b/migrations/__pycache__/env.cpython-38.pyc
new file mode 100644
index 0000000..677194f
Binary files /dev/null and b/migrations/__pycache__/env.cpython-38.pyc differ
diff --git a/migrations/alembic.ini b/migrations/alembic.ini
new file mode 100644
index 0000000..ec9d45c
--- /dev/null
+++ b/migrations/alembic.ini
@@ -0,0 +1,50 @@
+# A generic, single database configuration.
+
+[alembic]
+# template used to generate migration files
+# file_template = %%(rev)s_%%(slug)s
+
+# set to 'true' to run the environment during
+# the 'revision' command, regardless of autogenerate
+# revision_environment = false
+
+
+# Logging configuration
+[loggers]
+keys = root,sqlalchemy,alembic,flask_migrate
+
+[handlers]
+keys = console
+
+[formatters]
+keys = generic
+
+[logger_root]
+level = WARN
+handlers = console
+qualname =
+
+[logger_sqlalchemy]
+level = WARN
+handlers =
+qualname = sqlalchemy.engine
+
+[logger_alembic]
+level = INFO
+handlers =
+qualname = alembic
+
+[logger_flask_migrate]
+level = INFO
+handlers =
+qualname = flask_migrate
+
+[handler_console]
+class = StreamHandler
+args = (sys.stderr,)
+level = NOTSET
+formatter = generic
+
+[formatter_generic]
+format = %(levelname)-5.5s [%(name)s] %(message)s
+datefmt = %H:%M:%S
diff --git a/migrations/env.py b/migrations/env.py
new file mode 100644
index 0000000..68feded
--- /dev/null
+++ b/migrations/env.py
@@ -0,0 +1,91 @@
+from __future__ import with_statement
+
+import logging
+from logging.config import fileConfig
+
+from flask import current_app
+
+from alembic import context
+
+# this is the Alembic Config object, which provides
+# access to the values within the .ini file in use.
+config = context.config
+
+# Interpret the config file for Python logging.
+# This line sets up loggers basically.
+fileConfig(config.config_file_name)
+logger = logging.getLogger('alembic.env')
+
+# add your model's MetaData object here
+# for 'autogenerate' support
+# from myapp import mymodel
+# target_metadata = mymodel.Base.metadata
+config.set_main_option(
+    'sqlalchemy.url',
+    str(current_app.extensions['migrate'].db.get_engine().url).replace(
+        '%', '%%'))
+target_metadata = current_app.extensions['migrate'].db.metadata
+
+# other values from the config, defined by the needs of env.py,
+# can be acquired:
+# my_important_option = config.get_main_option("my_important_option")
+# ... etc.
+
+
+def run_migrations_offline():
+    """Run migrations in 'offline' mode.
+
+    This configures the context with just a URL
+    and not an Engine, though an Engine is acceptable
+    here as well.  By skipping the Engine creation
+    we don't even need a DBAPI to be available.
+
+    Calls to context.execute() here emit the given string to the
+    script output.
+
+    """
+    url = config.get_main_option("sqlalchemy.url")
+    context.configure(
+        url=url, target_metadata=target_metadata, literal_binds=True
+    )
+
+    with context.begin_transaction():
+        context.run_migrations()
+
+
+def run_migrations_online():
+    """Run migrations in 'online' mode.
+
+    In this scenario we need to create an Engine
+    and associate a connection with the context.
+
+    """
+
+    # this callback is used to prevent an auto-migration from being generated
+    # when there are no changes to the schema
+    # reference: http://alembic.zzzcomputing.com/en/latest/cookbook.html
+    def process_revision_directives(context, revision, directives):
+        if getattr(config.cmd_opts, 'autogenerate', False):
+            script = directives[0]
+            if script.upgrade_ops.is_empty():
+                directives[:] = []
+                logger.info('No changes in schema detected.')
+
+    connectable = current_app.extensions['migrate'].db.get_engine()
+
+    with connectable.connect() as connection:
+        context.configure(
+            connection=connection,
+            target_metadata=target_metadata,
+            process_revision_directives=process_revision_directives,
+            **current_app.extensions['migrate'].configure_args
+        )
+
+        with context.begin_transaction():
+            context.run_migrations()
+
+
+if context.is_offline_mode():
+    run_migrations_offline()
+else:
+    run_migrations_online()
diff --git a/migrations/script.py.mako b/migrations/script.py.mako
new file mode 100644
index 0000000..2c01563
--- /dev/null
+++ b/migrations/script.py.mako
@@ -0,0 +1,24 @@
+"""${message}
+
+Revision ID: ${up_revision}
+Revises: ${down_revision | comma,n}
+Create Date: ${create_date}
+
+"""
+from alembic import op
+import sqlalchemy as sa
+${imports if imports else ""}
+
+# revision identifiers, used by Alembic.
+revision = ${repr(up_revision)}
+down_revision = ${repr(down_revision)}
+branch_labels = ${repr(branch_labels)}
+depends_on = ${repr(depends_on)}
+
+
+def upgrade():
+    ${upgrades if upgrades else "pass"}
+
+
+def downgrade():
+    ${downgrades if downgrades else "pass"}
diff --git a/migrations/versions/05b53be3df1a_.py b/migrations/versions/05b53be3df1a_.py
new file mode 100644
index 0000000..e7bf3f8
--- /dev/null
+++ b/migrations/versions/05b53be3df1a_.py
@@ -0,0 +1,34 @@
+"""empty message
+
+Revision ID: 05b53be3df1a
+Revises: e3e2601b7244
+Create Date: 2021-10-22 22:57:31.507543
+
+"""
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = '05b53be3df1a'
+down_revision = 'e3e2601b7244'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    with op.batch_alter_table('graves', schema=None) as batch_op:
+        batch_op.add_column(sa.Column('cemeteriesfk', sa.Integer(), nullable=False))
+        batch_op.create_foreign_key(None, 'cemeteries', ['cemeteriesfk'], ['id'], ondelete='CASCADE')
+
+    # ### end Alembic commands ###
+
+
+def downgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    with op.batch_alter_table('graves', schema=None) as batch_op:
+        batch_op.drop_constraint(None, type_='foreignkey')
+        batch_op.drop_column('cemeteriesfk')
+
+    # ### end Alembic commands ###
diff --git a/migrations/versions/91a98db2aa76_.py b/migrations/versions/91a98db2aa76_.py
new file mode 100644
index 0000000..998685c
--- /dev/null
+++ b/migrations/versions/91a98db2aa76_.py
@@ -0,0 +1,37 @@
+"""empty message
+
+Revision ID: 91a98db2aa76
+Revises: 05b53be3df1a
+Create Date: 2021-10-26 00:16:55.334374
+
+"""
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = '91a98db2aa76'
+down_revision = '05b53be3df1a'
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    op.create_table('insinfo',
+    sa.Column('id', sa.Integer(), nullable=False),
+    sa.Column('name', sa.Text(), nullable=True),
+    sa.Column('phone', sa.Text(), nullable=True),
+    sa.Column('policynum', sa.Text(), nullable=True),
+    sa.Column('userid', sa.Integer(), nullable=True),
+    sa.Column('update_time', sa.DateTime(), nullable=True),
+    sa.Column('date_created', sa.DateTime(timezone=True), nullable=True),
+    sa.PrimaryKeyConstraint('id')
+    )
+    # ### end Alembic commands ###
+
+
+def downgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    op.drop_table('insinfo')
+    # ### end Alembic commands ###
diff --git a/migrations/versions/__pycache__/05b53be3df1a_.cpython-38.pyc b/migrations/versions/__pycache__/05b53be3df1a_.cpython-38.pyc
new file mode 100644
index 0000000..bc434a0
Binary files /dev/null and b/migrations/versions/__pycache__/05b53be3df1a_.cpython-38.pyc differ
diff --git a/migrations/versions/__pycache__/91a98db2aa76_.cpython-38.pyc b/migrations/versions/__pycache__/91a98db2aa76_.cpython-38.pyc
new file mode 100644
index 0000000..38f2e5b
Binary files /dev/null and b/migrations/versions/__pycache__/91a98db2aa76_.cpython-38.pyc differ
diff --git a/migrations/versions/__pycache__/e3e2601b7244_.cpython-38.pyc b/migrations/versions/__pycache__/e3e2601b7244_.cpython-38.pyc
new file mode 100644
index 0000000..f32351e
Binary files /dev/null and b/migrations/versions/__pycache__/e3e2601b7244_.cpython-38.pyc differ
diff --git a/migrations/versions/e3e2601b7244_.py b/migrations/versions/e3e2601b7244_.py
new file mode 100644
index 0000000..b7860f6
--- /dev/null
+++ b/migrations/versions/e3e2601b7244_.py
@@ -0,0 +1,67 @@
+"""empty message
+
+Revision ID: e3e2601b7244
+Revises: 
+Create Date: 2021-10-22 22:30:32.459745
+
+"""
+from alembic import op
+import sqlalchemy as sa
+
+
+# revision identifiers, used by Alembic.
+revision = 'e3e2601b7244'
+down_revision = None
+branch_labels = None
+depends_on = None
+
+
+def upgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    op.create_table('cemeteries',
+    sa.Column('id', sa.Integer(), nullable=False),
+    sa.Column('name', sa.Text(), nullable=True),
+    sa.Column('address', sa.Text(), nullable=True),
+    sa.Column('city', sa.Text(), nullable=True),
+    sa.Column('state', sa.Text(), nullable=True),
+    sa.Column('zip', sa.Text(), nullable=True),
+    sa.Column('phone', sa.Text(), nullable=True),
+    sa.Column('url', sa.Text(), nullable=True),
+    sa.Column('userid', sa.Integer(), nullable=True),
+    sa.Column('update_time', sa.DateTime(), nullable=True),
+    sa.Column('date_created', sa.DateTime(timezone=True), nullable=True),
+    sa.PrimaryKeyConstraint('id')
+    )
+    op.create_table('graves',
+    sa.Column('id', sa.Integer(), nullable=False),
+    sa.Column('name', sa.Text(), nullable=True),
+    sa.Column('relationship', sa.Text(), nullable=True),
+    sa.Column('birthdate', sa.Text(), nullable=True),
+    sa.Column('birthplace', sa.Text(), nullable=True),
+    sa.Column('deathdate', sa.Text(), nullable=True),
+    sa.Column('deathplace', sa.Text(), nullable=True),
+    sa.Column('plot', sa.Text(), nullable=True),
+    sa.Column('fag_id', sa.Text(), nullable=True),
+    sa.Column('fag_url', sa.Text(), nullable=True),
+    sa.Column('notes', sa.Text(), nullable=True),
+    sa.Column('obituary', sa.Text(), nullable=True),
+    sa.Column('pictureURL', sa.Text(), nullable=True),
+    sa.Column('userid', sa.Integer(), nullable=True),
+    sa.Column('update_time', sa.DateTime(), nullable=True),
+    sa.Column('date_created', sa.DateTime(timezone=True), nullable=True),
+    sa.PrimaryKeyConstraint('id')
+    )
+    with op.batch_alter_table('user', schema=None) as batch_op:
+        batch_op.create_unique_constraint(None, ['avatar'])
+
+    # ### end Alembic commands ###
+
+
+def downgrade():
+    # ### commands auto generated by Alembic - please adjust! ###
+    with op.batch_alter_table('user', schema=None) as batch_op:
+        batch_op.drop_constraint(None, type_='unique')
+
+    op.drop_table('graves')
+    op.drop_table('cemeteries')
+    # ### end Alembic commands ###
diff --git a/requirements.txt b/requirements.txt
index 38300a1..35268bd 100644
--- a/requirements.txt
+++ b/requirements.txt
@@ -1,3 +1,13 @@
-flask
+css_inline
+Flask
+Flask-Login
 Flask-SQLAlchemy
-flask-login
+Flask-Migrate
+Flask-Mail
+html2text
+ics
+lxml
+pdfkit
+recipe_scrapers
+requests
+wifi-qrcode-generator
\ No newline at end of file
diff --git a/tutorial1/website/__init__.py b/tutorial1/website/__init__.py
deleted file mode 100644
index b881c4f..0000000
--- a/tutorial1/website/__init__.py
+++ /dev/null
@@ -1,17 +0,0 @@
-from flask import Flask
-from flask_sqlalchemy import SQLAlchemy
-from os import path
-from flask_login import LoginManager
-
-
-def create_app():
-    app = Flask(__name__)
-    app.config['SECRET_KEY'] = "helloworld"
-
-    from .views import views
-    from .auth import auth
-
-    app.register_blueprint(views, url_prefix="/")
-    app.register_blueprint(auth, url_prefix="/")
-
-    return app
diff --git a/tutorial1/website/__pycache__/__init__.cpython-38.pyc b/tutorial1/website/__pycache__/__init__.cpython-38.pyc
deleted file mode 100644
index 5f5e272..0000000
Binary files a/tutorial1/website/__pycache__/__init__.cpython-38.pyc and /dev/null differ
diff --git a/tutorial1/website/__pycache__/auth.cpython-38.pyc b/tutorial1/website/__pycache__/auth.cpython-38.pyc
deleted file mode 100644
index ab66ba7..0000000
Binary files a/tutorial1/website/__pycache__/auth.cpython-38.pyc and /dev/null differ
diff --git a/tutorial1/website/__pycache__/models.cpython-38.pyc b/tutorial1/website/__pycache__/models.cpython-38.pyc
deleted file mode 100644
index f79a900..0000000
Binary files a/tutorial1/website/__pycache__/models.cpython-38.pyc and /dev/null differ
diff --git a/tutorial1/website/__pycache__/views.cpython-38.pyc b/tutorial1/website/__pycache__/views.cpython-38.pyc
deleted file mode 100644
index b3de214..0000000
Binary files a/tutorial1/website/__pycache__/views.cpython-38.pyc and /dev/null differ
diff --git a/tutorial1/website/auth.py b/tutorial1/website/auth.py
deleted file mode 100644
index d96a352..0000000
--- a/tutorial1/website/auth.py
+++ /dev/null
@@ -1,19 +0,0 @@
-from flask import Blueprint, render_template, redirect, url_for
-
-
-auth = Blueprint("auth", __name__)
-
-
-@auth.route("/login")
-def login():
-    return render_template("login.html")
-
-
-@auth.route("/sign-up")
-def sign_up():
-    return render_template("signup.html")
-
-
-@auth.route("/logout")
-def logout():
-    return redirect(url_for("views.home"))
diff --git a/tutorial1/website/templates/base.html b/tutorial1/website/templates/base.html
deleted file mode 100644
index e6681da..0000000
--- a/tutorial1/website/templates/base.html
+++ /dev/null
@@ -1,42 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link
-      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
-      rel="stylesheet"
-      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
-      crossorigin="anonymous"
-    />
-    <title>{% block title %}{% endblock %}</title>
-  </head>
-  <body>
-    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
-      <div class="container-fluid">
-        <button
-          class="navbar-toggler"
-          type="button"
-          data-bs-toggle="collapse"
-          data-bs-target="#navbar"
-        >
-          <span class="navbar-toggler-icon"></span>
-        </button>
-        <div class="collapse navbar-collapse" id="navbar">
-          <div class="navbar-nav">
-            <a class="nav-item nav-link" href="/home">Home</a>
-            <a class="nav-item nav-link" href="/login">Login</a>
-            <a class="nav-item nav-link" href="/sign-up">Sign Up</a>
-          </div>
-        </div>
-      </div>
-    </nav>
-    <div class="container">{% block content %}{% endblock %}</div>
-    <script
-      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
-      integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
-      crossorigin="anonymous"
-    ></script>
-  </body>
-</html>
diff --git a/tutorial1/website/templates/create_post.html b/tutorial1/website/templates/create_post.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial1/website/templates/create_post.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial1/website/templates/home.html b/tutorial1/website/templates/home.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial1/website/templates/home.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial1/website/templates/login.html b/tutorial1/website/templates/login.html
deleted file mode 100644
index b88a498..0000000
--- a/tutorial1/website/templates/login.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% extends "base.html" %} {% block title %}Login{% endblock %} {% block content
-%}
-<form method="POST">
-  <h3 align="center">Login</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="password">Password</label>
-    <input
-      type="password"
-      id="password"
-      name="password"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Login</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial1/website/templates/posts.html b/tutorial1/website/templates/posts.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial1/website/templates/posts.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial1/website/templates/posts_div.html b/tutorial1/website/templates/posts_div.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial1/website/templates/posts_div.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial1/website/templates/signup.html b/tutorial1/website/templates/signup.html
deleted file mode 100644
index 3405d30..0000000
--- a/tutorial1/website/templates/signup.html
+++ /dev/null
@@ -1,44 +0,0 @@
-{% extends "base.html" %} {% block title %}Sign Up{% endblock %} {% block
-content %}
-<form method="POST">
-  <h3 align="center">Sign Up</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="username">Username</label>
-    <input
-      type="text"
-      id="username"
-      name="username"
-      class="form-control"
-      placeholder="Enter Username"
-    />
-    <label for="password1">Password</label>
-    <input
-      type="password"
-      id="password1"
-      name="password1"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <label for="password2">Password Again</label>
-    <input
-      type="password"
-      id="password2"
-      name="password2"
-      class="form-control"
-      placeholder="Enter Password Again"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Sign Up</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial1/website/views.py b/tutorial1/website/views.py
deleted file mode 100644
index 8630c8c..0000000
--- a/tutorial1/website/views.py
+++ /dev/null
@@ -1,9 +0,0 @@
-from flask import Blueprint, render_template
-
-views = Blueprint("views", __name__)
-
-
-@views.route("/")
-@views.route("/home")
-def home():
-    return render_template("home.html")
diff --git a/tutorial2/app.py b/tutorial2/app.py
deleted file mode 100644
index 81aa060..0000000
--- a/tutorial2/app.py
+++ /dev/null
@@ -1,5 +0,0 @@
-from website import create_app
-
-if __name__ == "__main__":
-    app = create_app()
-    app.run(debug=True)
diff --git a/tutorial2/website/__init__.py b/tutorial2/website/__init__.py
deleted file mode 100644
index fc4e8be..0000000
--- a/tutorial2/website/__init__.py
+++ /dev/null
@@ -1,39 +0,0 @@
-from flask import Flask
-from flask_sqlalchemy import SQLAlchemy
-from os import path
-from flask_login import LoginManager
-
-db = SQLAlchemy()
-DB_NAME = "database.db"
-
-
-def create_app():
-    app = Flask(__name__)
-    app.config['SECRET_KEY'] = "helloworld"
-    app.config['SQL_ALCHEMY_DATABASE_URI'] = f'sqlite:///{DB_NAME}'
-    db.init_app(app)
-
-    from .views import views
-    from .auth import auth
-
-    app.register_blueprint(views, url_prefix="/")
-    app.register_blueprint(auth, url_prefix="/")
-
-    from .models import User
-
-    create_database(app)
-
-    login_manager = LoginManager()
-    login_manager.login_view = "auth.login"
-    login_manager.init_app(app)
-
-    @login_manager.user_loader
-    def load_user(id):
-        return User.query.get(int(id))
-
-    return app
-
-def create_database(app):
-    if not path.exists("website/" + DB_NAME):
-        db.create_all(app=app)
-        print("Created database!")
diff --git a/tutorial2/website/__pycache__/auth.cpython-38.pyc b/tutorial2/website/__pycache__/auth.cpython-38.pyc
deleted file mode 100644
index ab66ba7..0000000
Binary files a/tutorial2/website/__pycache__/auth.cpython-38.pyc and /dev/null differ
diff --git a/tutorial2/website/__pycache__/models.cpython-38.pyc b/tutorial2/website/__pycache__/models.cpython-38.pyc
deleted file mode 100644
index f79a900..0000000
Binary files a/tutorial2/website/__pycache__/models.cpython-38.pyc and /dev/null differ
diff --git a/tutorial2/website/__pycache__/views.cpython-38.pyc b/tutorial2/website/__pycache__/views.cpython-38.pyc
deleted file mode 100644
index b3de214..0000000
Binary files a/tutorial2/website/__pycache__/views.cpython-38.pyc and /dev/null differ
diff --git a/tutorial2/website/auth.py b/tutorial2/website/auth.py
deleted file mode 100644
index 086f8b8..0000000
--- a/tutorial2/website/auth.py
+++ /dev/null
@@ -1,69 +0,0 @@
-from flask import Blueprint, render_template, redirect, url_for, request, flash
-from . import db
-from .models import User
-from flask_login import login_user, logout_user, login_required, current_user
-from werkzeug.security import generate_password_hash, check_password_hash
-
-auth = Blueprint("auth", __name__)
-
-
-@auth.route("/login", methods=['GET', 'POST'])
-def login():
-    if request.method == 'POST':
-        email = request.form.get("email")
-        password = request.form.get("password")
-
-        user = User.query.filter_by(email=email).first()
-        if user:
-            if check_password_hash(user.password, password):
-                flash("Logged in!", category='success')
-                login_user(user, remember=True)
-                return redirect(url_for('views.home'))
-            else:
-                flash('Password is incorrect.', category='error')
-        else:
-            flash('Email does not exist.', category='error')
-
-    return render_template("login.html")
-
-
-@auth.route("/sign-up", methods=['GET', 'POST'])
-def sign_up():
-    if request.method == 'POST':
-        email = request.form.get("email")
-        username = request.form.get("username")
-        password1 = request.form.get("password1")
-        password2 = request.form.get("password2")
-
-        email_exists = User.query.filter_by(email=email).first()
-        username_exists = User.query.filter_by(username=username).first()
-
-        if email_exists:
-            flash('Email is already in use.', category='error')
-        elif username_exists:
-            flash('Username is already in use.', category='error')
-        elif password1 != password2:
-            flash('Password don\'t match!', category='error')
-        elif len(username) < 2:
-            flash('Username is too short.', category='error')
-        elif len(password1) < 6:
-            flash('Password is too short.', category='error')
-        elif len(email) < 4:
-            flash("Email is invalid.", category='error')
-        else:
-            new_user = User(email=email, username=username, password=generate_password_hash(
-                password1, method='sha256'))
-            db.session.add(new_user)
-            db.session.commit()
-            login_user(new_user, remember=True)
-            flash('User created!')
-            return redirect(url_for('views.home'))
-
-    return render_template("signup.html")
-
-
-@auth.route("/logout")
-@login_required
-def logout():
-    logout_user()
-    return redirect(url_for("views.home"))
diff --git a/tutorial2/website/models.py b/tutorial2/website/models.py
deleted file mode 100644
index dd512bf..0000000
--- a/tutorial2/website/models.py
+++ /dev/null
@@ -1,11 +0,0 @@
-from . import db
-from flask_login import UserMixin
-from sqlalchemy.sql import func
-
-
-class User(db.Model, UserMixin):
-    id = db.Column(db.Integer, primary_key=True)
-    email = db.Column(db.String(150), unique=True)
-    username = db.Column(db.String(150), unique=True)
-    password = db.Column(db.String(150))
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
diff --git a/tutorial2/website/templates/base.html b/tutorial2/website/templates/base.html
deleted file mode 100644
index 4264db2..0000000
--- a/tutorial2/website/templates/base.html
+++ /dev/null
@@ -1,60 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link
-      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
-      rel="stylesheet"
-      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
-      crossorigin="anonymous"
-    />
-    <title>{% block title %}{% endblock %}</title>
-  </head>
-  <body>
-    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
-      <div class="container-fluid">
-        <button
-          class="navbar-toggler"
-          type="button"
-          data-bs-toggle="collapse"
-          data-bs-target="#navbar"
-        >
-          <span class="navbar-toggler-icon"></span>
-        </button>
-        <div class="collapse navbar-collapse" id="navbar">
-          <div class="navbar-nav">
-            <a class="nav-item nav-link" href="/home">Home</a>
-            <a class="nav-item nav-link" href="/login">Login</a>
-            <a class="nav-item nav-link" href="/sign-up">Sign Up</a>
-          </div>
-        </div>
-      </div>
-    </nav>
-    {% with messages = get_flashed_messages(with_categories=True) %}
-      {% if messages %}
-        {% for category, message in messages %}
-        {% if category == "error" %}
-        <div class="alert alert-danger alter-dismissible fade show" role="alert">
-          {{ message }}
-          <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-        </div>
-        {% else %}
-        <div class="alert alert-success alter-dismissible fade show" role="alert">
-          {{ message }}
-          <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-        </div>
-        {% endif %}
-
-        {% endfor %}
-      {% endif %}
-    {% endwith %}
-    <div class="container">{% block content %}{% endblock %}</div>
-    <script
-      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
-      integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
-      crossorigin="anonymous"
-    ></script>
-  </body>
-</html>
diff --git a/tutorial2/website/templates/create_post.html b/tutorial2/website/templates/create_post.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial2/website/templates/create_post.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial2/website/templates/home.html b/tutorial2/website/templates/home.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial2/website/templates/home.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial2/website/templates/login.html b/tutorial2/website/templates/login.html
deleted file mode 100644
index b88a498..0000000
--- a/tutorial2/website/templates/login.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% extends "base.html" %} {% block title %}Login{% endblock %} {% block content
-%}
-<form method="POST">
-  <h3 align="center">Login</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="password">Password</label>
-    <input
-      type="password"
-      id="password"
-      name="password"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Login</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial2/website/templates/posts.html b/tutorial2/website/templates/posts.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial2/website/templates/posts.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial2/website/templates/posts_div.html b/tutorial2/website/templates/posts_div.html
deleted file mode 100644
index 6c48ac2..0000000
--- a/tutorial2/website/templates/posts_div.html
+++ /dev/null
@@ -1,2 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%} {% endblock %}
diff --git a/tutorial2/website/templates/signup.html b/tutorial2/website/templates/signup.html
deleted file mode 100644
index 3405d30..0000000
--- a/tutorial2/website/templates/signup.html
+++ /dev/null
@@ -1,44 +0,0 @@
-{% extends "base.html" %} {% block title %}Sign Up{% endblock %} {% block
-content %}
-<form method="POST">
-  <h3 align="center">Sign Up</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="username">Username</label>
-    <input
-      type="text"
-      id="username"
-      name="username"
-      class="form-control"
-      placeholder="Enter Username"
-    />
-    <label for="password1">Password</label>
-    <input
-      type="password"
-      id="password1"
-      name="password1"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <label for="password2">Password Again</label>
-    <input
-      type="password"
-      id="password2"
-      name="password2"
-      class="form-control"
-      placeholder="Enter Password Again"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Sign Up</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial2/website/views.py b/tutorial2/website/views.py
deleted file mode 100644
index de51bf1..0000000
--- a/tutorial2/website/views.py
+++ /dev/null
@@ -1,11 +0,0 @@
-from flask import Blueprint, render_template
-from flask_login import login_required, current_user
-
-views = Blueprint("views", __name__)
-
-
-@views.route("/")
-@views.route("/home")
-@login_required
-def home():
-    return render_template("home.html", name=current_user.username)
diff --git a/tutorial3/app.py b/tutorial3/app.py
deleted file mode 100644
index 81aa060..0000000
--- a/tutorial3/app.py
+++ /dev/null
@@ -1,5 +0,0 @@
-from website import create_app
-
-if __name__ == "__main__":
-    app = create_app()
-    app.run(debug=True)
diff --git a/tutorial3/website/__init__.py b/tutorial3/website/__init__.py
deleted file mode 100644
index 78286a4..0000000
--- a/tutorial3/website/__init__.py
+++ /dev/null
@@ -1,40 +0,0 @@
-from flask import Flask
-from flask_sqlalchemy import SQLAlchemy
-from os import path
-from flask_login import LoginManager
-
-db = SQLAlchemy()
-DB_NAME = "database.db"
-
-
-def create_app():
-    app = Flask(__name__)
-    app.config['SECRET_KEY'] = "helloworld"
-    app.config['SQLALCHEMY_DATABASE_URI'] = f'sqlite:///{DB_NAME}'
-    db.init_app(app)
-
-    from .views import views
-    from .auth import auth
-
-    app.register_blueprint(views, url_prefix="/")
-    app.register_blueprint(auth, url_prefix="/")
-
-    from .models import User, Post
-
-    create_database(app)
-
-    login_manager = LoginManager()
-    login_manager.login_view = "auth.login"
-    login_manager.init_app(app)
-
-    @login_manager.user_loader
-    def load_user(id):
-        return User.query.get(int(id))
-
-    return app
-
-
-def create_database(app):
-    if not path.exists("website/" + DB_NAME):
-        db.create_all(app=app)
-        print("Created database!")
diff --git a/tutorial3/website/__pycache__/__init__.cpython-38.pyc b/tutorial3/website/__pycache__/__init__.cpython-38.pyc
deleted file mode 100644
index 3ba97b1..0000000
Binary files a/tutorial3/website/__pycache__/__init__.cpython-38.pyc and /dev/null differ
diff --git a/tutorial3/website/__pycache__/auth.cpython-38.pyc b/tutorial3/website/__pycache__/auth.cpython-38.pyc
deleted file mode 100644
index 655dff6..0000000
Binary files a/tutorial3/website/__pycache__/auth.cpython-38.pyc and /dev/null differ
diff --git a/tutorial3/website/__pycache__/models.cpython-38.pyc b/tutorial3/website/__pycache__/models.cpython-38.pyc
deleted file mode 100644
index f624643..0000000
Binary files a/tutorial3/website/__pycache__/models.cpython-38.pyc and /dev/null differ
diff --git a/tutorial3/website/__pycache__/views.cpython-38.pyc b/tutorial3/website/__pycache__/views.cpython-38.pyc
deleted file mode 100644
index c710edb..0000000
Binary files a/tutorial3/website/__pycache__/views.cpython-38.pyc and /dev/null differ
diff --git a/tutorial3/website/auth.py b/tutorial3/website/auth.py
deleted file mode 100644
index bd6a1fa..0000000
--- a/tutorial3/website/auth.py
+++ /dev/null
@@ -1,69 +0,0 @@
-from flask import Blueprint, render_template, redirect, url_for, request, flash
-from . import db
-from .models import User
-from flask_login import login_user, logout_user, login_required, current_user
-from werkzeug.security import generate_password_hash, check_password_hash
-
-auth = Blueprint("auth", __name__)
-
-
-@auth.route("/login", methods=['GET', 'POST'])
-def login():
-    if request.method == 'POST':
-        email = request.form.get("email")
-        password = request.form.get("password")
-
-        user = User.query.filter_by(email=email).first()
-        if user:
-            if check_password_hash(user.password, password):
-                flash("Logged in!", category='success')
-                login_user(user, remember=True)
-                return redirect(url_for('views.home'))
-            else:
-                flash('Password is incorrect.', category='error')
-        else:
-            flash('Email does not exist.', category='error')
-
-    return render_template("login.html", user=current_user)
-
-
-@auth.route("/sign-up", methods=['GET', 'POST'])
-def sign_up():
-    if request.method == 'POST':
-        email = request.form.get("email")
-        username = request.form.get("username")
-        password1 = request.form.get("password1")
-        password2 = request.form.get("password2")
-
-        email_exists = User.query.filter_by(email=email).first()
-        username_exists = User.query.filter_by(username=username).first()
-
-        if email_exists:
-            flash('Email is already in use.', category='error')
-        elif username_exists:
-            flash('Username is already in use.', category='error')
-        elif password1 != password2:
-            flash('Password don\'t match!', category='error')
-        elif len(username) < 2:
-            flash('Username is too short.', category='error')
-        elif len(password1) < 6:
-            flash('Password is too short.', category='error')
-        elif len(email) < 4:
-            flash("Email is invalid.", category='error')
-        else:
-            new_user = User(email=email, username=username, password=generate_password_hash(
-                password1, method='sha256'))
-            db.session.add(new_user)
-            db.session.commit()
-            login_user(new_user, remember=True)
-            flash('User created!')
-            return redirect(url_for('views.home'))
-
-    return render_template("signup.html", user=current_user)
-
-
-@auth.route("/logout")
-@login_required
-def logout():
-    logout_user()
-    return redirect(url_for("views.home"))
diff --git a/tutorial3/website/models.py b/tutorial3/website/models.py
deleted file mode 100644
index 6360fec..0000000
--- a/tutorial3/website/models.py
+++ /dev/null
@@ -1,20 +0,0 @@
-from . import db
-from flask_login import UserMixin
-from sqlalchemy.sql import func
-
-
-class User(db.Model, UserMixin):
-    id = db.Column(db.Integer, primary_key=True)
-    email = db.Column(db.String(150), unique=True)
-    username = db.Column(db.String(150), unique=True)
-    password = db.Column(db.String(150))
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    posts = db.relationship('Post', backref='user', passive_deletes=True)
-
-
-class Post(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    text = db.Column(db.Text, nullable=False)
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    author = db.Column(db.Integer, db.ForeignKey(
-        'user.id', ondelete="CASCADE"), nullable=False)
diff --git a/tutorial3/website/templates/base.html b/tutorial3/website/templates/base.html
deleted file mode 100644
index 0559ea0..0000000
--- a/tutorial3/website/templates/base.html
+++ /dev/null
@@ -1,59 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link
-      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
-      rel="stylesheet"
-      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
-      crossorigin="anonymous"
-    />
-    <title>{% block title %}{% endblock %}</title>
-  </head>
-  <body>
-    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
-      <div class="container-fluid">
-        <button
-          class="navbar-toggler"
-          type="button"
-          data-bs-toggle="collapse"
-          data-bs-target="#navbar"
-        >
-          <span class="navbar-toggler-icon"></span>
-        </button>
-        <div class="collapse navbar-collapse" id="navbar">
-          <div class="navbar-nav">
-            <a class="nav-item nav-link" href="/home">Home</a>
-            {% if user.is_authenticated %}
-            <a class="nav-item nav-link" href="/logout">Logout</a>
-            {% else %}
-            <a class="nav-item nav-link" href="/login">Login</a>
-            <a class="nav-item nav-link" href="/sign-up">Sign Up</a>
-            {% endif %}
-          </div>
-        </div>
-      </div>
-    </nav>
-    {% with messages = get_flashed_messages(with_categories=true) %} {% if
-    messages %} {% for category, message in messages %} {% if category ==
-    'error' %}
-    <div class="alert alert-danger alter-dismissible fade show" role="alert">
-      {{ message }}
-      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-    </div>
-    {% else %}
-    <div class="alert alert-success alter-dismissible fade show" role="alert">
-      {{ message }}
-      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-    </div>
-    {% endif %} {% endfor %} {% endif %} {% endwith %}
-    <div class="container">{% block content %}{% endblock %}</div>
-    <script
-      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
-      integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
-      crossorigin="anonymous"
-    ></script>
-  </body>
-</html>
diff --git a/tutorial3/website/templates/create_post.html b/tutorial3/website/templates/create_post.html
deleted file mode 100644
index 881c195..0000000
--- a/tutorial3/website/templates/create_post.html
+++ /dev/null
@@ -1,18 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%}
-<h1 align="center">Make a Post</h1>
-
-<form method="POST">
-  <textarea name="text" id="text" class="form-control"></textarea>
-  <br />
-  <div align="center">
-    <button type="submit" class="btn btn-lg btn-primary">Post</button>
-  </div>
-</form>
-<br />
-<div align="center">
-  <a href="/home"
-    ><button type="button" class="btn btn-lg btn-secondary">Back</button></a
-  >
-</div>
-{% endblock %}
diff --git a/tutorial3/website/templates/home.html b/tutorial3/website/templates/home.html
deleted file mode 100644
index 0fa1b37..0000000
--- a/tutorial3/website/templates/home.html
+++ /dev/null
@@ -1 +0,0 @@
-{% extends "posts_div.html" %} {% block title %}Home{% endblock %}
diff --git a/tutorial3/website/templates/login.html b/tutorial3/website/templates/login.html
deleted file mode 100644
index b88a498..0000000
--- a/tutorial3/website/templates/login.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% extends "base.html" %} {% block title %}Login{% endblock %} {% block content
-%}
-<form method="POST">
-  <h3 align="center">Login</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="password">Password</label>
-    <input
-      type="password"
-      id="password"
-      name="password"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Login</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial3/website/templates/posts.html b/tutorial3/website/templates/posts.html
deleted file mode 100644
index 5f224a7..0000000
--- a/tutorial3/website/templates/posts.html
+++ /dev/null
@@ -1,8 +0,0 @@
-{% extends "posts_div.html" %} {% block title %}{{username}}'s Posts{% endblock
-%} {% block header %} {{username}}'s posts {% endblock %} {% block footer %}
-<div align="center">
-  <a href="/home"
-    ><button type="button" class="btn btn-primary btn-lg">Back</button></a
-  >
-</div>
-{% endblock %}
diff --git a/tutorial3/website/templates/posts_div.html b/tutorial3/website/templates/posts_div.html
deleted file mode 100644
index e1185b8..0000000
--- a/tutorial3/website/templates/posts_div.html
+++ /dev/null
@@ -1,39 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%}
-<h1 align="center">{% block header %}Posts{% endblock %}</h1>
-<div id="posts">
-  {% for post in posts %}
-  <div class="card border-dark">
-    <div class="card-header d-flex justify-content-between align-items-center">
-      <a href="/posts/{{post.user.username}}">{{post.user.username}}</a>
-      {% if user.id == post.author %}
-      <div class="btn-group">
-        <button
-          type="button"
-          class="btn btn-sm btn-primary dropdown-toggle"
-          data-bs-toggle="dropdown"
-        ></button>
-        <ul class="dropdown-menu">
-          <li>
-            <a href="/delete-post/{{post.id}}" class="dropdown-item">Delete</a>
-          </li>
-        </ul>
-      </div>
-      {% endif %}
-    </div>
-    <div class="card-body">
-      <div class="card-text">{{post.text}}</div>
-    </div>
-    <div class="card-footer text-muted">{{post.date_created}}</div>
-  </div>
-  <br/ > {% endfor %}
-</div>
-{% block footer %}
-<div align="center">
-  <a href="/create-post"
-    ><button type="button" class="btn btn-primary btn-lg">
-      Create a Post
-    </button></a
-  >
-</div>
-{% endblock %} {% endblock %}
diff --git a/tutorial3/website/templates/signup.html b/tutorial3/website/templates/signup.html
deleted file mode 100644
index 3405d30..0000000
--- a/tutorial3/website/templates/signup.html
+++ /dev/null
@@ -1,44 +0,0 @@
-{% extends "base.html" %} {% block title %}Sign Up{% endblock %} {% block
-content %}
-<form method="POST">
-  <h3 align="center">Sign Up</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="username">Username</label>
-    <input
-      type="text"
-      id="username"
-      name="username"
-      class="form-control"
-      placeholder="Enter Username"
-    />
-    <label for="password1">Password</label>
-    <input
-      type="password"
-      id="password1"
-      name="password1"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <label for="password2">Password Again</label>
-    <input
-      type="password"
-      id="password2"
-      name="password2"
-      class="form-control"
-      placeholder="Enter Password Again"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Sign Up</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial3/website/views.py b/tutorial3/website/views.py
deleted file mode 100644
index 7e5afc0..0000000
--- a/tutorial3/website/views.py
+++ /dev/null
@@ -1,62 +0,0 @@
-from flask import Blueprint, render_template, request, flash, redirect, url_for
-from flask_login import login_required, current_user
-from .models import Post, User
-from . import db
-
-views = Blueprint("views", __name__)
-
-
-@views.route("/")
-@views.route("/home")
-@login_required
-def home():
-    posts = Post.query.all()
-    return render_template("home.html", user=current_user, posts=posts)
-
-
-@views.route("/create-post", methods=['GET', 'POST'])
-@login_required
-def create_post():
-    if request.method == "POST":
-        text = request.form.get('text')
-
-        if not text:
-            flash('Post cannot be empty', category='error')
-        else:
-            post = Post(text=text, author=current_user.id)
-            db.session.add(post)
-            db.session.commit()
-            flash('Post created!', category='success')
-            return redirect(url_for('views.home'))
-
-    return render_template('create_post.html', user=current_user)
-
-
-@views.route("/delete-post/<id>")
-@login_required
-def delete_post(id):
-    post = Post.query.filter_by(id=id).first()
-
-    if not post:
-        flash("Post does not exist.", category='error')
-    elif current_user.id != post.id:
-        flash('You do not have permission to delete this post.', category='error')
-    else:
-        db.session.delete(post)
-        db.session.commit()
-        flash('Post deleted.', category='success')
-
-    return redirect(url_for('views.home'))
-
-
-@views.route("/posts/<username>")
-@login_required
-def posts(username):
-    user = User.query.filter_by(username=username).first()
-
-    if not user:
-        flash('No user with that username exists.', category='error')
-        return redirect(url_for('views.home'))
-
-    posts = Post.query.filter_by(author=user.id).all()
-    return render_template("posts.html", user=current_user, posts=posts, username=username)
diff --git a/tutorial4/app.py b/tutorial4/app.py
deleted file mode 100644
index 81aa060..0000000
--- a/tutorial4/app.py
+++ /dev/null
@@ -1,5 +0,0 @@
-from website import create_app
-
-if __name__ == "__main__":
-    app = create_app()
-    app.run(debug=True)
diff --git a/tutorial4/website/__init__.py b/tutorial4/website/__init__.py
deleted file mode 100644
index 078e079..0000000
--- a/tutorial4/website/__init__.py
+++ /dev/null
@@ -1,40 +0,0 @@
-from flask import Flask
-from flask_sqlalchemy import SQLAlchemy
-from os import path
-from flask_login import LoginManager
-
-db = SQLAlchemy()
-DB_NAME = "database.db"
-
-
-def create_app():
-    app = Flask(__name__)
-    app.config['SECRET_KEY'] = "helloworld"
-    app.config['SQLALCHEMY_DATABASE_URI'] = f'sqlite:///{DB_NAME}'
-    db.init_app(app)
-
-    from .views import views
-    from .auth import auth
-
-    app.register_blueprint(views, url_prefix="/")
-    app.register_blueprint(auth, url_prefix="/")
-
-    from .models import User, Post, Comment
-
-    create_database(app)
-
-    login_manager = LoginManager()
-    login_manager.login_view = "auth.login"
-    login_manager.init_app(app)
-
-    @login_manager.user_loader
-    def load_user(id):
-        return User.query.get(int(id))
-
-    return app
-
-
-def create_database(app):
-    if not path.exists("website/" + DB_NAME):
-        db.create_all(app=app)
-        print("Created database!")
diff --git a/tutorial4/website/__pycache__/__init__.cpython-38.pyc b/tutorial4/website/__pycache__/__init__.cpython-38.pyc
deleted file mode 100644
index f42f59b..0000000
Binary files a/tutorial4/website/__pycache__/__init__.cpython-38.pyc and /dev/null differ
diff --git a/tutorial4/website/__pycache__/auth.cpython-38.pyc b/tutorial4/website/__pycache__/auth.cpython-38.pyc
deleted file mode 100644
index 655dff6..0000000
Binary files a/tutorial4/website/__pycache__/auth.cpython-38.pyc and /dev/null differ
diff --git a/tutorial4/website/__pycache__/models.cpython-38.pyc b/tutorial4/website/__pycache__/models.cpython-38.pyc
deleted file mode 100644
index 608894f..0000000
Binary files a/tutorial4/website/__pycache__/models.cpython-38.pyc and /dev/null differ
diff --git a/tutorial4/website/__pycache__/views.cpython-38.pyc b/tutorial4/website/__pycache__/views.cpython-38.pyc
deleted file mode 100644
index 6671921..0000000
Binary files a/tutorial4/website/__pycache__/views.cpython-38.pyc and /dev/null differ
diff --git a/tutorial4/website/models.py b/tutorial4/website/models.py
deleted file mode 100644
index 15d31d1..0000000
--- a/tutorial4/website/models.py
+++ /dev/null
@@ -1,32 +0,0 @@
-from . import db
-from flask_login import UserMixin
-from sqlalchemy.sql import func
-
-
-class User(db.Model, UserMixin):
-    id = db.Column(db.Integer, primary_key=True)
-    email = db.Column(db.String(150), unique=True)
-    username = db.Column(db.String(150), unique=True)
-    password = db.Column(db.String(150))
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    posts = db.relationship('Post', backref='user', passive_deletes=True)
-    comments = db.relationship('Comment', backref='user', passive_deletes=True)
-
-
-class Post(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    text = db.Column(db.Text, nullable=False)
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    author = db.Column(db.Integer, db.ForeignKey(
-        'user.id', ondelete="CASCADE"), nullable=False)
-    comments = db.relationship('Comment', backref='post', passive_deletes=True)
-
-
-class Comment(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    text = db.Column(db.String(200), nullable=False)
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    author = db.Column(db.Integer, db.ForeignKey(
-        'user.id', ondelete="CASCADE"), nullable=False)
-    post_id = db.Column(db.Integer, db.ForeignKey(
-        'post.id', ondelete="CASCADE"), nullable=False)
diff --git a/tutorial4/website/templates/base.html b/tutorial4/website/templates/base.html
deleted file mode 100644
index 0559ea0..0000000
--- a/tutorial4/website/templates/base.html
+++ /dev/null
@@ -1,59 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link
-      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
-      rel="stylesheet"
-      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
-      crossorigin="anonymous"
-    />
-    <title>{% block title %}{% endblock %}</title>
-  </head>
-  <body>
-    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
-      <div class="container-fluid">
-        <button
-          class="navbar-toggler"
-          type="button"
-          data-bs-toggle="collapse"
-          data-bs-target="#navbar"
-        >
-          <span class="navbar-toggler-icon"></span>
-        </button>
-        <div class="collapse navbar-collapse" id="navbar">
-          <div class="navbar-nav">
-            <a class="nav-item nav-link" href="/home">Home</a>
-            {% if user.is_authenticated %}
-            <a class="nav-item nav-link" href="/logout">Logout</a>
-            {% else %}
-            <a class="nav-item nav-link" href="/login">Login</a>
-            <a class="nav-item nav-link" href="/sign-up">Sign Up</a>
-            {% endif %}
-          </div>
-        </div>
-      </div>
-    </nav>
-    {% with messages = get_flashed_messages(with_categories=true) %} {% if
-    messages %} {% for category, message in messages %} {% if category ==
-    'error' %}
-    <div class="alert alert-danger alter-dismissible fade show" role="alert">
-      {{ message }}
-      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-    </div>
-    {% else %}
-    <div class="alert alert-success alter-dismissible fade show" role="alert">
-      {{ message }}
-      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-    </div>
-    {% endif %} {% endfor %} {% endif %} {% endwith %}
-    <div class="container">{% block content %}{% endblock %}</div>
-    <script
-      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
-      integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
-      crossorigin="anonymous"
-    ></script>
-  </body>
-</html>
diff --git a/tutorial4/website/templates/create_post.html b/tutorial4/website/templates/create_post.html
deleted file mode 100644
index 881c195..0000000
--- a/tutorial4/website/templates/create_post.html
+++ /dev/null
@@ -1,18 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%}
-<h1 align="center">Make a Post</h1>
-
-<form method="POST">
-  <textarea name="text" id="text" class="form-control"></textarea>
-  <br />
-  <div align="center">
-    <button type="submit" class="btn btn-lg btn-primary">Post</button>
-  </div>
-</form>
-<br />
-<div align="center">
-  <a href="/home"
-    ><button type="button" class="btn btn-lg btn-secondary">Back</button></a
-  >
-</div>
-{% endblock %}
diff --git a/tutorial4/website/templates/home.html b/tutorial4/website/templates/home.html
deleted file mode 100644
index 0fa1b37..0000000
--- a/tutorial4/website/templates/home.html
+++ /dev/null
@@ -1 +0,0 @@
-{% extends "posts_div.html" %} {% block title %}Home{% endblock %}
diff --git a/tutorial4/website/templates/login.html b/tutorial4/website/templates/login.html
deleted file mode 100644
index b88a498..0000000
--- a/tutorial4/website/templates/login.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% extends "base.html" %} {% block title %}Login{% endblock %} {% block content
-%}
-<form method="POST">
-  <h3 align="center">Login</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="password">Password</label>
-    <input
-      type="password"
-      id="password"
-      name="password"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Login</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial4/website/templates/posts.html b/tutorial4/website/templates/posts.html
deleted file mode 100644
index 5f224a7..0000000
--- a/tutorial4/website/templates/posts.html
+++ /dev/null
@@ -1,8 +0,0 @@
-{% extends "posts_div.html" %} {% block title %}{{username}}'s Posts{% endblock
-%} {% block header %} {{username}}'s posts {% endblock %} {% block footer %}
-<div align="center">
-  <a href="/home"
-    ><button type="button" class="btn btn-primary btn-lg">Back</button></a
-  >
-</div>
-{% endblock %}
diff --git a/tutorial4/website/templates/posts_div.html b/tutorial4/website/templates/posts_div.html
deleted file mode 100644
index d76f56b..0000000
--- a/tutorial4/website/templates/posts_div.html
+++ /dev/null
@@ -1,99 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%}
-<h1 align="center">{% block header %}Posts{% endblock %}</h1>
-<div id="posts">
-  {% for post in posts %}
-  <div class="card border-dark">
-    <div class="card-header d-flex justify-content-between align-items-center">
-      <a href="/posts/{{post.user.username}}">{{post.user.username}}</a>
-      {% if user.id == post.author %}
-      <div class="btn-group">
-        <button
-          type="button"
-          class="btn btn-sm btn-primary dropdown-toggle"
-          data-bs-toggle="dropdown"
-        ></button>
-        <ul class="dropdown-menu">
-          <li>
-            <a href="/delete-post/{{post.id}}" class="dropdown-item">Delete</a>
-          </li>
-        </ul>
-      </div>
-      {% endif %}
-    </div>
-    <div class="card-body">
-      <div class="card-text">{{post.text}}</div>
-      <br />
-      <div class="collapse" id="comments-{{post.id}}">
-        <div class="card">
-          <div class="card-body" id="comments-expanded-{{post.id}}">
-            {% for comment in post.comments %}
-            <div class="d-flex justify-content-between align-items-center">
-              <div>
-                <a href="/posts/{{comment.user.username}}"
-                  >{{comment.user.username}}</a
-                >: {{comment.text}}
-              </div>
-              <div>
-                <small class="text-muted"> {{comment.date_created}}</small>
-                {% if user.id == comment.author or user.id == post.author %}
-                <div class="btn-group">
-                  <button
-                    type="button"
-                    class="btn btn-sm btn-primary dropdown-toggle"
-                    data-bs-toggle="dropdown"
-                  ></button>
-                  <ul class="dropdown-menu">
-                    <li>
-                      <a
-                        href="/delete-comment/{{comment.id}}"
-                        class="dropdown-item"
-                        >Delete</a
-                      >
-                    </li>
-                  </ul>
-                </div>
-                {% endif %}
-              </div>
-            </div>
-            {% endfor %}
-          </div>
-        </div>
-      </div>
-      <p class="card-text">
-        {% if post.comments|length > 0 %}
-        <a data-bs-toggle="collapse" href="#comments-{{post.id}}" role="button">
-          <small>View {{post.comments|length}} Comments</small>
-        </a>
-        {% else %}
-        <small class="text-muted">No Comments</small>
-        {% endif %}
-      </p>
-      <form
-        class="input-group mb-3"
-        method="POST"
-        action="/create-comment/{{post.id}}"
-      >
-        <input
-          type="text"
-          id="text"
-          name="text"
-          class="form-control"
-          placeholder="Comment something!"
-        />
-        <button type="submit" class="btn btn-primary">Comment</button>
-      </form>
-    </div>
-    <div class="card-footer text-muted">{{post.date_created}}</div>
-  </div>
-  <br/ > {% endfor %}
-</div>
-{% block footer %}
-<div align="center">
-  <a href="/create-post"
-    ><button type="button" class="btn btn-primary btn-lg">
-      Create a Post
-    </button></a
-  >
-</div>
-{% endblock %} {% endblock %}
diff --git a/tutorial4/website/templates/signup.html b/tutorial4/website/templates/signup.html
deleted file mode 100644
index 3405d30..0000000
--- a/tutorial4/website/templates/signup.html
+++ /dev/null
@@ -1,44 +0,0 @@
-{% extends "base.html" %} {% block title %}Sign Up{% endblock %} {% block
-content %}
-<form method="POST">
-  <h3 align="center">Sign Up</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="username">Username</label>
-    <input
-      type="text"
-      id="username"
-      name="username"
-      class="form-control"
-      placeholder="Enter Username"
-    />
-    <label for="password1">Password</label>
-    <input
-      type="password"
-      id="password1"
-      name="password1"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <label for="password2">Password Again</label>
-    <input
-      type="password"
-      id="password2"
-      name="password2"
-      class="form-control"
-      placeholder="Enter Password Again"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Sign Up</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial4/website/views.py b/tutorial4/website/views.py
deleted file mode 100644
index ba8185b..0000000
--- a/tutorial4/website/views.py
+++ /dev/null
@@ -1,98 +0,0 @@
-from flask import Blueprint, render_template, request, flash, redirect, url_for
-from flask_login import login_required, current_user
-from .models import Post, User, Comment
-from . import db
-
-views = Blueprint("views", __name__)
-
-
-@views.route("/")
-@views.route("/home")
-@login_required
-def home():
-    posts = Post.query.all()
-    return render_template("home.html", user=current_user, posts=posts)
-
-
-@views.route("/create-post", methods=['GET', 'POST'])
-@login_required
-def create_post():
-    if request.method == "POST":
-        text = request.form.get('text')
-
-        if not text:
-            flash('Post cannot be empty', category='error')
-        else:
-            post = Post(text=text, author=current_user.id)
-            db.session.add(post)
-            db.session.commit()
-            flash('Post created!', category='success')
-            return redirect(url_for('views.home'))
-
-    return render_template('create_post.html', user=current_user)
-
-
-@views.route("/delete-post/<id>")
-@login_required
-def delete_post(id):
-    post = Post.query.filter_by(id=id).first()
-
-    if not post:
-        flash("Post does not exist.", category='error')
-    elif current_user.id != post.id:
-        flash('You do not have permission to delete this post.', category='error')
-    else:
-        db.session.delete(post)
-        db.session.commit()
-        flash('Post deleted.', category='success')
-
-    return redirect(url_for('views.home'))
-
-
-@views.route("/posts/<username>")
-@login_required
-def posts(username):
-    user = User.query.filter_by(username=username).first()
-
-    if not user:
-        flash('No user with that username exists.', category='error')
-        return redirect(url_for('views.home'))
-
-    posts = user.posts
-    return render_template("posts.html", user=current_user, posts=posts, username=username)
-
-
-@views.route("/create-comment/<post_id>", methods=['POST'])
-@login_required
-def create_comment(post_id):
-    text = request.form.get('text')
-
-    if not text:
-        flash('Comment cannot be empty.', category='error')
-    else:
-        post = Post.query.filter_by(id=post_id)
-        if post:
-            comment = Comment(
-                text=text, author=current_user.id, post_id=post_id)
-            db.session.add(comment)
-            db.session.commit()
-        else:
-            flash('Post does not exist.', category='error')
-
-    return redirect(url_for('views.home'))
-
-
-@views.route("/delete-comment/<comment_id>")
-@login_required
-def delete_comment(comment_id):
-    comment = Comment.query.filter_by(id=comment_id).first()
-
-    if not comment:
-        flash('Comment does not exist.', category='error')
-    elif current_user.id != comment.author and current_user.id != comment.post.author:
-        flash('You do not have permission to delete this comment.', category='error')
-    else:
-        db.session.delete(comment)
-        db.session.commit()
-
-    return redirect(url_for('views.home'))
diff --git a/tutorial5/app.py b/tutorial5/app.py
deleted file mode 100644
index 81aa060..0000000
--- a/tutorial5/app.py
+++ /dev/null
@@ -1,5 +0,0 @@
-from website import create_app
-
-if __name__ == "__main__":
-    app = create_app()
-    app.run(debug=True)
diff --git a/tutorial5/website/__init__.py b/tutorial5/website/__init__.py
deleted file mode 100644
index 89f1aaa..0000000
--- a/tutorial5/website/__init__.py
+++ /dev/null
@@ -1,40 +0,0 @@
-from flask import Flask
-from flask_sqlalchemy import SQLAlchemy
-from os import path
-from flask_login import LoginManager
-
-db = SQLAlchemy()
-DB_NAME = "database.db"
-
-
-def create_app():
-    app = Flask(__name__)
-    app.config['SECRET_KEY'] = "helloworld"
-    app.config['SQLALCHEMY_DATABASE_URI'] = f'sqlite:///{DB_NAME}'
-    db.init_app(app)
-
-    from .views import views
-    from .auth import auth
-
-    app.register_blueprint(views, url_prefix="/")
-    app.register_blueprint(auth, url_prefix="/")
-
-    from .models import User, Post, Comment, Like
-
-    create_database(app)
-
-    login_manager = LoginManager()
-    login_manager.login_view = "auth.login"
-    login_manager.init_app(app)
-
-    @login_manager.user_loader
-    def load_user(id):
-        return User.query.get(int(id))
-
-    return app
-
-
-def create_database(app):
-    if not path.exists("website/" + DB_NAME):
-        db.create_all(app=app)
-        print("Created database!")
diff --git a/tutorial5/website/__pycache__/__init__.cpython-38.pyc b/tutorial5/website/__pycache__/__init__.cpython-38.pyc
deleted file mode 100644
index 6e35d04..0000000
Binary files a/tutorial5/website/__pycache__/__init__.cpython-38.pyc and /dev/null differ
diff --git a/tutorial5/website/__pycache__/models.cpython-38.pyc b/tutorial5/website/__pycache__/models.cpython-38.pyc
deleted file mode 100644
index 481a6ab..0000000
Binary files a/tutorial5/website/__pycache__/models.cpython-38.pyc and /dev/null differ
diff --git a/tutorial5/website/__pycache__/views.cpython-38.pyc b/tutorial5/website/__pycache__/views.cpython-38.pyc
deleted file mode 100644
index b0a8714..0000000
Binary files a/tutorial5/website/__pycache__/views.cpython-38.pyc and /dev/null differ
diff --git a/tutorial5/website/auth.py b/tutorial5/website/auth.py
deleted file mode 100644
index bd6a1fa..0000000
--- a/tutorial5/website/auth.py
+++ /dev/null
@@ -1,69 +0,0 @@
-from flask import Blueprint, render_template, redirect, url_for, request, flash
-from . import db
-from .models import User
-from flask_login import login_user, logout_user, login_required, current_user
-from werkzeug.security import generate_password_hash, check_password_hash
-
-auth = Blueprint("auth", __name__)
-
-
-@auth.route("/login", methods=['GET', 'POST'])
-def login():
-    if request.method == 'POST':
-        email = request.form.get("email")
-        password = request.form.get("password")
-
-        user = User.query.filter_by(email=email).first()
-        if user:
-            if check_password_hash(user.password, password):
-                flash("Logged in!", category='success')
-                login_user(user, remember=True)
-                return redirect(url_for('views.home'))
-            else:
-                flash('Password is incorrect.', category='error')
-        else:
-            flash('Email does not exist.', category='error')
-
-    return render_template("login.html", user=current_user)
-
-
-@auth.route("/sign-up", methods=['GET', 'POST'])
-def sign_up():
-    if request.method == 'POST':
-        email = request.form.get("email")
-        username = request.form.get("username")
-        password1 = request.form.get("password1")
-        password2 = request.form.get("password2")
-
-        email_exists = User.query.filter_by(email=email).first()
-        username_exists = User.query.filter_by(username=username).first()
-
-        if email_exists:
-            flash('Email is already in use.', category='error')
-        elif username_exists:
-            flash('Username is already in use.', category='error')
-        elif password1 != password2:
-            flash('Password don\'t match!', category='error')
-        elif len(username) < 2:
-            flash('Username is too short.', category='error')
-        elif len(password1) < 6:
-            flash('Password is too short.', category='error')
-        elif len(email) < 4:
-            flash("Email is invalid.", category='error')
-        else:
-            new_user = User(email=email, username=username, password=generate_password_hash(
-                password1, method='sha256'))
-            db.session.add(new_user)
-            db.session.commit()
-            login_user(new_user, remember=True)
-            flash('User created!')
-            return redirect(url_for('views.home'))
-
-    return render_template("signup.html", user=current_user)
-
-
-@auth.route("/logout")
-@login_required
-def logout():
-    logout_user()
-    return redirect(url_for("views.home"))
diff --git a/tutorial5/website/database.db b/tutorial5/website/database.db
deleted file mode 100644
index 6715a0e..0000000
Binary files a/tutorial5/website/database.db and /dev/null differ
diff --git a/tutorial5/website/models.py b/tutorial5/website/models.py
deleted file mode 100644
index 5417f76..0000000
--- a/tutorial5/website/models.py
+++ /dev/null
@@ -1,43 +0,0 @@
-from . import db
-from flask_login import UserMixin
-from sqlalchemy.sql import func
-
-
-class User(db.Model, UserMixin):
-    id = db.Column(db.Integer, primary_key=True)
-    email = db.Column(db.String(150), unique=True)
-    username = db.Column(db.String(150), unique=True)
-    password = db.Column(db.String(150))
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    posts = db.relationship('Post', backref='user', passive_deletes=True)
-    comments = db.relationship('Comment', backref='user', passive_deletes=True)
-    likes = db.relationship('Like', backref='user', passive_deletes=True)
-
-
-class Post(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    text = db.Column(db.Text, nullable=False)
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    author = db.Column(db.Integer, db.ForeignKey(
-        'user.id', ondelete="CASCADE"), nullable=False)
-    comments = db.relationship('Comment', backref='post', passive_deletes=True)
-    likes = db.relationship('Like', backref='post', passive_deletes=True)
-
-
-class Comment(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    text = db.Column(db.String(200), nullable=False)
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    author = db.Column(db.Integer, db.ForeignKey(
-        'user.id', ondelete="CASCADE"), nullable=False)
-    post_id = db.Column(db.Integer, db.ForeignKey(
-        'post.id', ondelete="CASCADE"), nullable=False)
-
-
-class Like(db.Model):
-    id = db.Column(db.Integer, primary_key=True)
-    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
-    author = db.Column(db.Integer, db.ForeignKey(
-        'user.id', ondelete="CASCADE"), nullable=False)
-    post_id = db.Column(db.Integer, db.ForeignKey(
-        'post.id', ondelete="CASCADE"), nullable=False)
diff --git a/tutorial5/website/static/index.js b/tutorial5/website/static/index.js
deleted file mode 100644
index 84c6738..0000000
--- a/tutorial5/website/static/index.js
+++ /dev/null
@@ -1,16 +0,0 @@
-function like(postId) {
-  const likeCount = document.getElementById(`likes-count-${postId}`);
-  const likeButton = document.getElementById(`like-button-${postId}`);
-
-  fetch(`/like-post/${postId}`, { method: "POST" })
-    .then((res) => res.json())
-    .then((data) => {
-      likeCount.innerHTML = data["likes"];
-      if (data["liked"] === true) {
-        likeButton.className = "fas fa-thumbs-up";
-      } else {
-        likeButton.className = "far fa-thumbs-up";
-      }
-    })
-    .catch((e) => alert("Could not like post."));
-}
diff --git a/tutorial5/website/templates/base.html b/tutorial5/website/templates/base.html
deleted file mode 100644
index c99eedb..0000000
--- a/tutorial5/website/templates/base.html
+++ /dev/null
@@ -1,67 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <link
-      href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css"
-      rel="stylesheet"
-      integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC"
-      crossorigin="anonymous"
-    />
-    <script
-      src="https://kit.fontawesome.com/999ca2bb93.js"
-      crossorigin="anonymous"
-    ></script>
-    <title>{% block title %}{% endblock %}</title>
-  </head>
-  <body>
-    <nav class="navbar navbar-expand-lg navbar-dark bg-dark">
-      <div class="container-fluid">
-        <button
-          class="navbar-toggler"
-          type="button"
-          data-bs-toggle="collapse"
-          data-bs-target="#navbar"
-        >
-          <span class="navbar-toggler-icon"></span>
-        </button>
-        <div class="collapse navbar-collapse" id="navbar">
-          <div class="navbar-nav">
-            <a class="nav-item nav-link" href="/home">Home</a>
-            {% if user.is_authenticated %}
-            <a class="nav-item nav-link" href="/logout">Logout</a>
-            {% else %}
-            <a class="nav-item nav-link" href="/login">Login</a>
-            <a class="nav-item nav-link" href="/sign-up">Sign Up</a>
-            {% endif %}
-          </div>
-        </div>
-      </div>
-    </nav>
-    {% with messages = get_flashed_messages(with_categories=true) %} {% if
-    messages %} {% for category, message in messages %} {% if category ==
-    'error' %}
-    <div class="alert alert-danger alter-dismissible fade show" role="alert">
-      {{ message }}
-      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-    </div>
-    {% else %}
-    <div class="alert alert-success alter-dismissible fade show" role="alert">
-      {{ message }}
-      <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
-    </div>
-    {% endif %} {% endfor %} {% endif %} {% endwith %}
-    <div class="container">{% block content %}{% endblock %}</div>
-    <script
-      src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
-      integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM"
-      crossorigin="anonymous"
-    ></script>
-    <script
-      type="text/javascript"
-      src="{{ url_for('static', filename='index.js')}}"
-    ></script>
-  </body>
-</html>
diff --git a/tutorial5/website/templates/create_post.html b/tutorial5/website/templates/create_post.html
deleted file mode 100644
index 881c195..0000000
--- a/tutorial5/website/templates/create_post.html
+++ /dev/null
@@ -1,18 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%}
-<h1 align="center">Make a Post</h1>
-
-<form method="POST">
-  <textarea name="text" id="text" class="form-control"></textarea>
-  <br />
-  <div align="center">
-    <button type="submit" class="btn btn-lg btn-primary">Post</button>
-  </div>
-</form>
-<br />
-<div align="center">
-  <a href="/home"
-    ><button type="button" class="btn btn-lg btn-secondary">Back</button></a
-  >
-</div>
-{% endblock %}
diff --git a/tutorial5/website/templates/home.html b/tutorial5/website/templates/home.html
deleted file mode 100644
index 0fa1b37..0000000
--- a/tutorial5/website/templates/home.html
+++ /dev/null
@@ -1 +0,0 @@
-{% extends "posts_div.html" %} {% block title %}Home{% endblock %}
diff --git a/tutorial5/website/templates/login.html b/tutorial5/website/templates/login.html
deleted file mode 100644
index b88a498..0000000
--- a/tutorial5/website/templates/login.html
+++ /dev/null
@@ -1,28 +0,0 @@
-{% extends "base.html" %} {% block title %}Login{% endblock %} {% block content
-%}
-<form method="POST">
-  <h3 align="center">Login</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="password">Password</label>
-    <input
-      type="password"
-      id="password"
-      name="password"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Login</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial5/website/templates/posts.html b/tutorial5/website/templates/posts.html
deleted file mode 100644
index 5f224a7..0000000
--- a/tutorial5/website/templates/posts.html
+++ /dev/null
@@ -1,8 +0,0 @@
-{% extends "posts_div.html" %} {% block title %}{{username}}'s Posts{% endblock
-%} {% block header %} {{username}}'s posts {% endblock %} {% block footer %}
-<div align="center">
-  <a href="/home"
-    ><button type="button" class="btn btn-primary btn-lg">Back</button></a
-  >
-</div>
-{% endblock %}
diff --git a/tutorial5/website/templates/posts_div.html b/tutorial5/website/templates/posts_div.html
deleted file mode 100644
index 4415bf6..0000000
--- a/tutorial5/website/templates/posts_div.html
+++ /dev/null
@@ -1,117 +0,0 @@
-{% extends "base.html" %} {% block title %}Home{% endblock %} {% block content
-%}
-<h1 align="center">{% block header %}Posts{% endblock %}</h1>
-<div id="posts">
-  {% for post in posts %}
-  <div class="card border-dark">
-    <div class="card-header d-flex justify-content-between align-items-center">
-      <a href="/posts/{{post.user.username}}">{{post.user.username}}</a>
-      <div>
-        <span id="likes-count-{{post.id}}">
-        {{ post.likes|length }}</span> 
-        {% if user.id in post.likes|map(attribute="author")|list %}
-        <i
-          class="fas fa-thumbs-up"
-          id="like-button-{{post.id}}"
-          onclick="like({{post.id}})"
-        ></i>
-        {% else %}
-        <i
-          class="far fa-thumbs-up"
-          id="like-button-{{post.id}}"
-          onclick="like({{post.id}})"
-        ></i>
-        {% endif %} {% if user.id == post.author %}
-        <div class="btn-group">
-          <button
-            type="button"
-            class="btn btn-sm btn-primary dropdown-toggle"
-            data-bs-toggle="dropdown"
-          ></button>
-          <ul class="dropdown-menu">
-            <li>
-              <a href="/delete-post/{{post.id}}" class="dropdown-item"
-                >Delete</a
-              >
-            </li>
-          </ul>
-        </div>
-        {% endif %}
-      </div>
-    </div>
-    <div class="card-body">
-      <div class="card-text">{{post.text}}</div>
-      <br />
-      <div class="collapse" id="comments-{{post.id}}">
-        <div class="card">
-          <div class="card-body" id="comments-expanded-{{post.id}}">
-            {% for comment in post.comments %}
-            <div class="d-flex justify-content-between align-items-center">
-              <div>
-                <a href="/posts/{{comment.user.username}}"
-                  >{{comment.user.username}}</a
-                >: {{comment.text}}
-              </div>
-              <div>
-                <small class="text-muted"> {{comment.date_created}}</small>
-                {% if user.id == comment.author or user.id == post.author %}
-                <div class="btn-group">
-                  <button
-                    type="button"
-                    class="btn btn-sm btn-primary dropdown-toggle"
-                    data-bs-toggle="dropdown"
-                  ></button>
-                  <ul class="dropdown-menu">
-                    <li>
-                      <a
-                        href="/delete-comment/{{comment.id}}"
-                        class="dropdown-item"
-                        >Delete</a
-                      >
-                    </li>
-                  </ul>
-                </div>
-                {% endif %}
-              </div>
-            </div>
-            {% endfor %}
-          </div>
-        </div>
-      </div>
-      <p class="card-text">
-        {% if post.comments|length > 0 %}
-        <a data-bs-toggle="collapse" href="#comments-{{post.id}}" role="button">
-          <small>View {{post.comments|length}} Comments</small>
-        </a>
-        {% else %}
-        <small class="text-muted">No Comments</small>
-        {% endif %}
-      </p>
-      <form
-        class="input-group mb-3"
-        method="POST"
-        action="/create-comment/{{post.id}}"
-      >
-        <input
-          type="text"
-          id="text"
-          name="text"
-          class="form-control"
-          placeholder="Comment something!"
-        />
-        <button type="submit" class="btn btn-primary">Comment</button>
-      </form>
-    </div>
-    <div class="card-footer text-muted">{{post.date_created}}</div>
-  </div>
-  <br/ > {% endfor %}
-</div>
-{% block footer %}
-<div align="center">
-  <a href="/create-post"
-    ><button type="button" class="btn btn-primary btn-lg">
-      Create a Post
-    </button></a
-  >
-</div>
-{% endblock %} {% endblock %}
diff --git a/tutorial5/website/templates/signup.html b/tutorial5/website/templates/signup.html
deleted file mode 100644
index 3405d30..0000000
--- a/tutorial5/website/templates/signup.html
+++ /dev/null
@@ -1,44 +0,0 @@
-{% extends "base.html" %} {% block title %}Sign Up{% endblock %} {% block
-content %}
-<form method="POST">
-  <h3 align="center">Sign Up</h3>
-  <div class="form-group">
-    <label for="email">Email Address</label>
-    <input
-      type="text"
-      id="email"
-      name="email"
-      class="form-control"
-      placeholder="Enter Email"
-    />
-    <label for="username">Username</label>
-    <input
-      type="text"
-      id="username"
-      name="username"
-      class="form-control"
-      placeholder="Enter Username"
-    />
-    <label for="password1">Password</label>
-    <input
-      type="password"
-      id="password1"
-      name="password1"
-      class="form-control"
-      placeholder="Enter Password"
-    />
-    <label for="password2">Password Again</label>
-    <input
-      type="password"
-      id="password2"
-      name="password2"
-      class="form-control"
-      placeholder="Enter Password Again"
-    />
-    <br />
-    <div align="center">
-      <button class="btn btn-primary" type="submit">Sign Up</button>
-    </div>
-  </div>
-</form>
-{% endblock %}
diff --git a/tutorial5/website/views.py b/tutorial5/website/views.py
deleted file mode 100644
index 511f7cc..0000000
--- a/tutorial5/website/views.py
+++ /dev/null
@@ -1,118 +0,0 @@
-from flask import Blueprint, render_template, request, flash, redirect, url_for, jsonify
-from flask_login import login_required, current_user
-from .models import Post, User, Comment, Like
-from . import db
-
-views = Blueprint("views", __name__)
-
-
-@views.route("/")
-@views.route("/home")
-@login_required
-def home():
-    posts = Post.query.all()
-    return render_template("home.html", user=current_user, posts=posts)
-
-
-@views.route("/create-post", methods=['GET', 'POST'])
-@login_required
-def create_post():
-    if request.method == "POST":
-        text = request.form.get('text')
-
-        if not text:
-            flash('Post cannot be empty', category='error')
-        else:
-            post = Post(text=text, author=current_user.id)
-            db.session.add(post)
-            db.session.commit()
-            flash('Post created!', category='success')
-            return redirect(url_for('views.home'))
-
-    return render_template('create_post.html', user=current_user)
-
-
-@views.route("/delete-post/<id>")
-@login_required
-def delete_post(id):
-    post = Post.query.filter_by(id=id).first()
-
-    if not post:
-        flash("Post does not exist.", category='error')
-    elif current_user.id != post.id:
-        flash('You do not have permission to delete this post.', category='error')
-    else:
-        db.session.delete(post)
-        db.session.commit()
-        flash('Post deleted.', category='success')
-
-    return redirect(url_for('views.home'))
-
-
-@views.route("/posts/<username>")
-@login_required
-def posts(username):
-    user = User.query.filter_by(username=username).first()
-
-    if not user:
-        flash('No user with that username exists.', category='error')
-        return redirect(url_for('views.home'))
-
-    posts = user.posts
-    return render_template("posts.html", user=current_user, posts=posts, username=username)
-
-
-@views.route("/create-comment/<post_id>", methods=['POST'])
-@login_required
-def create_comment(post_id):
-    text = request.form.get('text')
-
-    if not text:
-        flash('Comment cannot be empty.', category='error')
-    else:
-        post = Post.query.filter_by(id=post_id)
-        if post:
-            comment = Comment(
-                text=text, author=current_user.id, post_id=post_id)
-            db.session.add(comment)
-            db.session.commit()
-        else:
-            flash('Post does not exist.', category='error')
-
-    return redirect(url_for('views.home'))
-
-
-@views.route("/delete-comment/<comment_id>")
-@login_required
-def delete_comment(comment_id):
-    comment = Comment.query.filter_by(id=comment_id).first()
-
-    if not comment:
-        flash('Comment does not exist.', category='error')
-    elif current_user.id != comment.author and current_user.id != comment.post.author:
-        flash('You do not have permission to delete this comment.', category='error')
-    else:
-        db.session.delete(comment)
-        db.session.commit()
-
-    return redirect(url_for('views.home'))
-
-
-@views.route("/like-post/<post_id>", methods=['POST'])
-@login_required
-def like(post_id):
-    post = Post.query.filter_by(id=post_id).first()
-    like = Like.query.filter_by(
-        author=current_user.id, post_id=post_id).first()
-
-    if not post:
-        return jsonify({'error': 'Post does not exist.'}, 400)
-    elif like:
-        db.session.delete(like)
-        db.session.commit()
-    else:
-        like = Like(author=current_user.id, post_id=post_id)
-        db.session.add(like)
-        db.session.commit()
-
-    return jsonify({"likes": len(post.likes), "liked": current_user.id in map(lambda x: x.author, post.likes)})
diff --git a/website/.DS_Store b/website/.DS_Store
new file mode 100644
index 0000000..092b084
Binary files /dev/null and b/website/.DS_Store differ
diff --git a/website/__init__.py b/website/__init__.py
new file mode 100644
index 0000000..f032f5b
--- /dev/null
+++ b/website/__init__.py
@@ -0,0 +1,77 @@
+from flask import Flask
+from flask_sqlalchemy import SQLAlchemy
+from os import path
+from flask_login import LoginManager
+from flask_migrate import Migrate
+from flask_mail import Mail
+
+db = SQLAlchemy()
+DB_NAME = "database.db"
+mail = Mail()
+
+
+
+def create_app():
+    mail = Mail()
+    app = Flask(__name__)
+    
+    UPLOAD_FOLDER = 'website/static/images'
+    ALLOWED_EXTENSIONS = {'txt', 'pdf', 'png', 'jpg', 'jpeg', 'gif'}
+
+    app._static_folder = 'static'   
+    app.config['SECRET_KEY'] = "helloworld"
+    app.config['SQLALCHEMY_DATABASE_URI'] = f'sqlite:///{DB_NAME}'
+    app.config['UPLOAD_FOLDER'] = UPLOAD_FOLDER
+    app.config['ALLOWED_EXTENSIONS'] = ALLOWED_EXTENSIONS
+    
+    app.config['MAIL_SERVER']='smtp.mailtrap.io'
+    app.config['MAIL_PORT'] = 2525
+    app.config['MAIL_USERNAME'] = '2bd40272ef58f7'
+    app.config['MAIL_PASSWORD'] = '39d7d1dc080abe'
+    app.config['MAIL_USE_TLS'] = True
+    app.config['MAIL_USE_SSL'] = False
+    
+    db.init_app(app)
+    mail.init_app(app)
+    
+    Migrate(app,db, render_as_batch=True)
+
+    from website.templates.views.views import views
+    from website.auth import auth
+    from website.templates.menu.menu import menu
+    from website.templates.vehicles.vehicle import vehicle
+    from website.templates.health.health import health
+    from website.templates.productivity.productivity import prod
+    from website.templates.personal.personal import personal
+    from website.templates.settings.settings import settings
+
+    app.register_blueprint(views, url_prefix="/")
+    app.register_blueprint(auth, url_prefix="/")
+    app.register_blueprint(menu, url_prefix="/menu")
+    app.register_blueprint(vehicle, url_prefix="/vehicle")
+    app.register_blueprint(health, url_prefix="/health")
+    app.register_blueprint(prod, url_prefix="/productivity")
+    app.register_blueprint(personal, url_prefix="/personal")    
+    app.register_blueprint(settings, url_prefix="/settings")
+
+
+
+    from website.models import User
+
+    create_database(app)
+
+    login_manager = LoginManager()
+    login_manager.login_view = "auth.login"
+    login_manager.init_app(app)
+
+    @login_manager.user_loader
+    def load_user(id):
+        return User.query.get(int(id))
+    return app
+
+
+def create_database(app):
+    if not path.exists("website/" + DB_NAME):
+        db.create_all(app=app)
+        print("Created database!")
+
diff --git a/website/__pycache__/__init__.cpython-38.pyc b/website/__pycache__/__init__.cpython-38.pyc
new file mode 100644
index 0000000..5fe5e2c
Binary files /dev/null and b/website/__pycache__/__init__.cpython-38.pyc differ
diff --git a/tutorial2/website/__pycache__/__init__.cpython-38.pyc b/website/__pycache__/__init__.cpython-39.pyc
similarity index 65%
rename from tutorial2/website/__pycache__/__init__.cpython-38.pyc
rename to website/__pycache__/__init__.cpython-39.pyc
index 5f5e272..f4d2179 100644
Binary files a/tutorial2/website/__pycache__/__init__.cpython-38.pyc and b/website/__pycache__/__init__.cpython-39.pyc differ
diff --git a/website/__pycache__/auth.cpython-38.pyc b/website/__pycache__/auth.cpython-38.pyc
new file mode 100644
index 0000000..b126683
Binary files /dev/null and b/website/__pycache__/auth.cpython-38.pyc differ
diff --git a/tutorial5/website/__pycache__/auth.cpython-38.pyc b/website/__pycache__/auth.cpython-39.pyc
similarity index 90%
rename from tutorial5/website/__pycache__/auth.cpython-38.pyc
rename to website/__pycache__/auth.cpython-39.pyc
index 655dff6..4ffdefc 100644
Binary files a/tutorial5/website/__pycache__/auth.cpython-38.pyc and b/website/__pycache__/auth.cpython-39.pyc differ
diff --git a/website/__pycache__/health.cpython-38.pyc b/website/__pycache__/health.cpython-38.pyc
new file mode 100644
index 0000000..1bd3dbb
Binary files /dev/null and b/website/__pycache__/health.cpython-38.pyc differ
diff --git a/website/__pycache__/makedates.cpython-38.pyc b/website/__pycache__/makedates.cpython-38.pyc
new file mode 100644
index 0000000..54cdcc3
Binary files /dev/null and b/website/__pycache__/makedates.cpython-38.pyc differ
diff --git a/website/__pycache__/menu.cpython-38.pyc b/website/__pycache__/menu.cpython-38.pyc
new file mode 100644
index 0000000..f921239
Binary files /dev/null and b/website/__pycache__/menu.cpython-38.pyc differ
diff --git a/website/__pycache__/models.cpython-38.pyc b/website/__pycache__/models.cpython-38.pyc
new file mode 100644
index 0000000..f12654e
Binary files /dev/null and b/website/__pycache__/models.cpython-38.pyc differ
diff --git a/website/__pycache__/models.cpython-39.pyc b/website/__pycache__/models.cpython-39.pyc
new file mode 100644
index 0000000..324bdc0
Binary files /dev/null and b/website/__pycache__/models.cpython-39.pyc differ
diff --git a/website/__pycache__/notion.cpython-38.pyc b/website/__pycache__/notion.cpython-38.pyc
new file mode 100644
index 0000000..61f7d08
Binary files /dev/null and b/website/__pycache__/notion.cpython-38.pyc differ
diff --git a/website/__pycache__/notion.cpython-39.pyc b/website/__pycache__/notion.cpython-39.pyc
new file mode 100644
index 0000000..fc6376c
Binary files /dev/null and b/website/__pycache__/notion.cpython-39.pyc differ
diff --git a/website/__pycache__/nutrition.cpython-38.pyc b/website/__pycache__/nutrition.cpython-38.pyc
new file mode 100644
index 0000000..85dae97
Binary files /dev/null and b/website/__pycache__/nutrition.cpython-38.pyc differ
diff --git a/website/__pycache__/personal.cpython-38.pyc b/website/__pycache__/personal.cpython-38.pyc
new file mode 100644
index 0000000..a9b5f7b
Binary files /dev/null and b/website/__pycache__/personal.cpython-38.pyc differ
diff --git a/website/__pycache__/process_medications.cpython-38.pyc b/website/__pycache__/process_medications.cpython-38.pyc
new file mode 100644
index 0000000..fd645f0
Binary files /dev/null and b/website/__pycache__/process_medications.cpython-38.pyc differ
diff --git a/website/__pycache__/productivity.cpython-38.pyc b/website/__pycache__/productivity.cpython-38.pyc
new file mode 100644
index 0000000..b76a3b9
Binary files /dev/null and b/website/__pycache__/productivity.cpython-38.pyc differ
diff --git a/website/__pycache__/routing.cpython-38.pyc b/website/__pycache__/routing.cpython-38.pyc
new file mode 100644
index 0000000..3f57ccd
Binary files /dev/null and b/website/__pycache__/routing.cpython-38.pyc differ
diff --git a/website/__pycache__/scrape_recipe.cpython-38.pyc b/website/__pycache__/scrape_recipe.cpython-38.pyc
new file mode 100644
index 0000000..abea3c0
Binary files /dev/null and b/website/__pycache__/scrape_recipe.cpython-38.pyc differ
diff --git a/website/__pycache__/taskinport.cpython-38.pyc b/website/__pycache__/taskinport.cpython-38.pyc
new file mode 100644
index 0000000..dba1f4f
Binary files /dev/null and b/website/__pycache__/taskinport.cpython-38.pyc differ
diff --git a/website/__pycache__/vehicle.cpython-38.pyc b/website/__pycache__/vehicle.cpython-38.pyc
new file mode 100644
index 0000000..48bb27a
Binary files /dev/null and b/website/__pycache__/vehicle.cpython-38.pyc differ
diff --git a/website/__pycache__/vfc_maker.cpython-38.pyc b/website/__pycache__/vfc_maker.cpython-38.pyc
new file mode 100644
index 0000000..82e3749
Binary files /dev/null and b/website/__pycache__/vfc_maker.cpython-38.pyc differ
diff --git a/website/__pycache__/views.cpython-38.pyc b/website/__pycache__/views.cpython-38.pyc
new file mode 100644
index 0000000..cb0cf38
Binary files /dev/null and b/website/__pycache__/views.cpython-38.pyc differ
diff --git a/website/__pycache__/views.cpython-39.pyc b/website/__pycache__/views.cpython-39.pyc
new file mode 100644
index 0000000..c9b3a37
Binary files /dev/null and b/website/__pycache__/views.cpython-39.pyc differ
diff --git a/website/__pycache__/wifiqrcode.cpython-38.pyc b/website/__pycache__/wifiqrcode.cpython-38.pyc
new file mode 100644
index 0000000..d25d60d
Binary files /dev/null and b/website/__pycache__/wifiqrcode.cpython-38.pyc differ
diff --git a/tutorial4/website/auth.py b/website/auth.py
similarity index 55%
rename from tutorial4/website/auth.py
rename to website/auth.py
index bd6a1fa..f073841 100644
--- a/tutorial4/website/auth.py
+++ b/website/auth.py
@@ -1,8 +1,12 @@
 from flask import Blueprint, render_template, redirect, url_for, request, flash
-from . import db
-from .models import User
-from flask_login import login_user, logout_user, login_required, current_user
+import flask_login
+from werkzeug.datastructures import ContentSecurityPolicy
+from website import db
+from website.models import *
+from flask_login import login_user, logout_user, login_required
 from werkzeug.security import generate_password_hash, check_password_hash
+from werkzeug.utils import secure_filename
+import os
 
 auth = Blueprint("auth", __name__)
 
@@ -24,17 +28,21 @@ def login():
         else:
             flash('Email does not exist.', category='error')
 
-    return render_template("login.html", user=current_user)
+    return render_template("login.html", user=User)
 
 
 @auth.route("/sign-up", methods=['GET', 'POST'])
 def sign_up():
     if request.method == 'POST':
+        pic = request.files['avatar']
+        mime = pic.mimetype
+        filename = secure_filename(pic.filename)
+        
         email = request.form.get("email")
         username = request.form.get("username")
         password1 = request.form.get("password1")
         password2 = request.form.get("password2")
-
+        
         email_exists = User.query.filter_by(email=email).first()
         username_exists = User.query.filter_by(username=username).first()
 
@@ -51,15 +59,41 @@ def sign_up():
         elif len(email) < 4:
             flash("Email is invalid.", category='error')
         else:
-            new_user = User(email=email, username=username, password=generate_password_hash(
-                password1, method='sha256'))
+            new_user = User(
+                email=email, 
+                username=username, 
+                password=generate_password_hash(password1, method='sha256'),
+                avatar = pic.read(),
+                avatar_filename = filename,
+                avatar_mimetype = mime,
+                firstname = request.form.get('firstname'),
+                lastname = request.form.get('lastname'),
+                address = request.form.get('address'),
+                city = request.form.get('city'),
+                state = request.form.get('state'),
+                zip = request.form.get('zip'),
+                phone = request.form.get('phone'),
+                dob = datetime.datetime.strptime(request.form.get('dob'),"%Y-%m-%d"),
+            )
             db.session.add(new_user)
             db.session.commit()
+            
             login_user(new_user, remember=True)
             flash('User created!')
+            
+            profile = db.session.query(User).filter_by(username=username).first()
+            filename = str(profile.id)+"."+mime[-3:]
+            profile.avatar_filename = filename
+            db.session.commit()
+
+            pic.seek(0)
+            pic.save(os.path.join('website','static','images', filename))
+        
+            
             return redirect(url_for('views.home'))
 
-    return render_template("signup.html", user=current_user)
+    states = States.query.all()
+    return render_template("signup.html", user=User, states=states)
 
 
 @auth.route("/logout")
diff --git a/website/database.db b/website/database.db
new file mode 100644
index 0000000..69165ad
Binary files /dev/null and b/website/database.db differ
diff --git a/website/database.old.db b/website/database.old.db
new file mode 100644
index 0000000..a80c4ea
Binary files /dev/null and b/website/database.old.db differ
diff --git a/website/key.txt b/website/key.txt
new file mode 100644
index 0000000..6acb555
--- /dev/null
+++ b/website/key.txt
@@ -0,0 +1,4 @@
+{"notion":"secret_E56vtGLhJHUK1o7WerXlnUaZHcbHnnlyFiMuPPwU1bz",
+"nutritionix":"12ea571cf69f50e50d0b62fefb77acbe\\",
+"testing":"secret_mxlJcyDwWeiaEVa1XUV6VVeAK7t3Vr9C9ao4m2k46kx"
+}
\ No newline at end of file
diff --git a/website/makedates.py b/website/makedates.py
new file mode 100644
index 0000000..38ae871
--- /dev/null
+++ b/website/makedates.py
@@ -0,0 +1,19 @@
+from website import db
+from website.models import Planner
+from datetime import datetime, timedelta
+
+def makedates(
+    startdate=datetime.strftime(datetime.today(), "%Y-%m-%d"), 
+    howmany=60):
+    """ Use this to create more dates in the Planner table.  When the table has less than a count of 60. This program will run adding more dates to the table.
+
+    Args:
+        howmany (int): [how many new dates do you want added.  Default is 60 days]
+        startdate ([type]): [the day you want the sustem to add going forward.]
+    """    
+    date = datetime.strptime(startdate, "%Y-%m-%d")
+    for _ in range(howmany):
+        plan = Planner(date = date)
+        db.session.add(plan)
+        db.session.commit()
+        date = date + timedelta(days=1)
\ No newline at end of file
diff --git a/website/models.py b/website/models.py
new file mode 100644
index 0000000..414b7ef
--- /dev/null
+++ b/website/models.py
@@ -0,0 +1,467 @@
+from enum import unique
+
+from sqlalchemy.orm import relation, relationship
+from website import db
+
+from flask_login import UserMixin
+from sqlalchemy.sql import func
+import datetime
+
+#Users
+class User(db.Model, UserMixin):
+    id = db.Column(db.Integer, primary_key=True)
+    firstname = db.Column(db.String(150))
+    lastname = db.Column(db.String(150))
+    email = db.Column(db.String(150), unique=True)
+    dob = db.Column(db.DateTime)
+    address=db.Column(db.String(100))
+    city=db.Column(db.String(50))
+    state=db.Column(db.String(2))
+    zip=db.Column(db.String(10))
+    phone=db.Column(db.String(20))
+    avatar = db.Column(db.Text)
+    avatar_filename = db.Column(db.Text)
+    avatar_mimetype = db.Column(db.Text)
+    username = db.Column(db.String(150), unique=True)
+    password = db.Column(db.String(150))
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+
+#Guill Menu
+class Dish(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name = db.Column(db.String(150), unique=True)
+    pictureURL = db.Column(db.String(1000))
+    numServings = db.Column(db.Integer)
+    servingSize = db.Column(db.String(150))
+    cookTime = db.Column(db.String(10))
+    prepTime = db.Column(db.String(10))
+    cookTemp = db.Column(db.String(5))
+    notionID = db.Column(db.String(50), unique=True)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    recipe = db.relationship('Recipe', backref='dish', passive_deletes=True)
+    steps = db.relationship('Steps', backref='dish', passive_deletes=True)
+    plan = db.relationship('Planner', backref='dish', passive_deletes=True)
+
+class Recipe(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    qty = db.Column(db.String(10))
+    measurement = db.Column(db.String(50))
+    ing = db.Column(db.String(150))
+    catagory = db.Column(db.String(50))
+    notes = db.Column(db.String(250), nullable=True)
+    fat_total = db.Column(db.Integer, nullable=True)
+    weight = db.Column(db.Integer, nullable=True)
+    fat_sat = db.Column(db.Integer, nullable=True)
+    fat_trans = db.Column(db.Integer, nullable=True)
+    cholesterol = db.Column(db.Integer, nullable=True)
+    sodium = db.Column(db.Integer, nullable=True)
+    potassium = db.Column(db.Integer, nullable=True)
+    carb_total = db.Column(db.Integer, nullable=True)
+    carb_fiber = db.Column(db.Integer, nullable=True)
+    carb_sugar = db.Column(db.Integer, nullable=True)
+    protein = db.Column(db.Integer, nullable=True)
+    servsize = db.Column(db.String(100), nullable=True)
+    calories = db.Column(db.Integer, nullable=True)
+    calories_fat = db.Column(db.Integer, nullable=True)
+    pictureURL = db.Column(db.String(500), nullable=True)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    dishfk = db.Column(db.Integer, db.ForeignKey(
+        'dish.id', ondelete="CASCADE"), nullable=False)
+
+class Steps(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    step_num = db.Column(db.Integer)
+    step_text = db.Column(db.Text)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())    
+    dishfk = db.Column(db.Integer, db.ForeignKey(
+        'dish.id', ondelete="CASCADE"), nullable=False)
+
+class Planner(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    date = db.Column(db.DateTime(timezone=True))
+    item = db.Column(db.String(200))
+    dishfk = db.Column(db.Integer, db.ForeignKey(
+        'dish.id', ondelete="CASCADE"), nullable=True)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now()) 
+  
+#Medical
+class Facility(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name=db.Column(db.String(100))
+    address=db.Column(db.String(100))
+    city=db.Column(db.String(50))
+    state=db.Column(db.String(2))
+    zip=db.Column(db.String(10))
+    phone=db.Column(db.String(20))
+    type = db.Column(db.String(50))
+    userid = db.Column(db.Integer, nullable=False)
+    #relationship
+    doctor = db.relationship('Doctor', backref='facility', passive_deletes=True)
+    hosptial = db.relationship('Hosptial', backref='facility', passive_deletes=True)
+    surgeries = db.relationship('Surgeries', backref='facility', passive_deletes=True)
+    
+class Doctor(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name=db.Column(db.String(100))
+    address=db.Column(db.String(100))
+    city=db.Column(db.String(50))
+    state=db.Column(db.String(2))
+    zip=db.Column(db.String(10))
+    phone=db.Column(db.String(15))
+    email=db.Column(db.String(100))
+    asst=db.Column(db.String(100))
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    #relationships
+    hosptial = db.relationship('Hosptial', backref='doctor', passive_deletes=True)
+    surgeries = db.relationship('Surgeries', backref='doctor', passive_deletes=True)
+    medication = db.relationship('Medications', backref='doctor', passive_deletes=True)
+    a1c = db.relationship('A1C', backref='doctor', passive_deletes=True)
+    #forignkeys
+    facilityfk=db.Column(db.Integer, db.ForeignKey(
+        'facility.id', ondelete="CASCADE"), nullable=False)
+
+class Hosptial(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    datestart=db.Column(db.Date, nullable=False)
+    dateend=db.Column(db.Date, nullable=False)
+    reason=db.Column(db.String(100))
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now()) 
+    #forign keys
+    doctorfk=db.Column(db.Integer, db.ForeignKey('doctor.id', ondelete="CASCADE"), nullable=False)
+    facilityfk=db.Column(db.Integer, db.ForeignKey('facility.id', ondelete="CASCADE"), nullable=False)
+    
+class Surgeries(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name=db.Column(db.String(100), nullable=False)
+    startdate=db.Column(db.Date, nullable=False)
+    description=db.Column(db.String(500))
+    body_part=db.Column(db.String(50))
+    age=db.Column(db.Integer)
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now()) 
+    #forign keys
+    doctorfk = db.Column(db.Integer, db.ForeignKey('doctor.id', ondelete="CASCADE"), nullable=False)
+    facilityfk=db.Column(db.Integer, db.ForeignKey('facility.id', ondelete="CASCADE"), nullable=False)
+
+class Medications(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name=db.Column(db.String(100))
+    dose=db.Column(db.String(50))
+    how_often=db.Column(db.String(100))
+    num_filled_days=db.Column(db.Integer)
+    reason_for_taking=db.Column(db.String(100))
+    pharmacy = db.Column(db.String(100))
+    last_refilled = db.Column(db.DateTime)
+    next_refill = db.Column(db.DateTime)
+    process = db.Column(db.Boolean, default=False)
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now()) 
+    #forign keys
+    doctorfk = db.Column(db.Integer, db.ForeignKey('doctor.id', ondelete="CASCADE"), nullable=False)
+
+class Allergies(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name=db.Column(db.String(100))
+    reaction=db.Column(db.String(50))
+    dateadded=db.Column(db.Date, nullable=False)
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now()) 
+
+class A1C(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    date = db.Column(db.DateTime)
+    testresult = db.Column(db.Float)
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now()) 
+    #forign keys
+    doctorfk = db.Column(db.Integer, db.ForeignKey('doctor.id', ondelete="CASCADE"), nullable=False)
+ 
+#Goals  
+class Goals(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name=db.Column(db.String(100))
+    pictureurl=db.Column(db.String(500))
+    status=db.Column(db.String(50))
+    measurement=db.Column(db.String(500))
+    datestart = db. Column (db. DateTime)
+    dateend = db. Column (db. DateTime)
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    #relationships
+    tasks = db.relationship('Tasks', backref='goals', passive_deletes=True)
+    
+#Tasks
+class Tasks(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    item = db.Column(db.String(500))
+    checked = db.Column(db.BOOLEAN)
+    userid = db.Column(db.Integer, nullable=False)
+    duedate = db.Column(db.DateTime)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now()) 
+    #forign keys
+    goalfk = db.Column(db.Integer, db.ForeignKey('goals.id', ondelete="CASCADE"), nullable=True)
+    project = db.Column(db.Integer, db.ForeignKey('projects.id', ondelete="CASCADE"), nullable=True)
+
+class Projects(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name=db.Column(db.String(100))
+    pictureurl=db.Column(db.String(500))
+    status=db.Column(db.String(50))
+    last_reviewed=db.Column(db.DateTime)
+    when_review=db.Column(db.Integer)
+    notionid = db.Column(db.String(50))
+    next_review = db.Column(db.DateTime)
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    #relationships
+    tasks = db.relationship('Tasks', backref='projects', passive_deletes=True)
+    
+class Wifi(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    SSID = db.Column(db.String(100))
+    password = db.Column(db.String(100))
+    path = db.Column(db.String(1000))
+    userid = db.Column(db.Integer, nullable=False)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    
+class Vehicles(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name = db.Column(db.String(75), unique=True)
+    year = db.Column(db.Integer)
+    make = db.Column(db.String(75))
+    model = db.Column(db.String(75))
+    trim = db.Column(db.String(20))
+    color = db.Column(db.String(25))
+    purchase_date = db.Column(db.DateTime)
+    sell_date = db.Column(db.DateTime)
+    reasonforsale = db.Column(db.String(75))
+    saleamount = db.Column(db.Float)
+    purchaseprice = db.Column(db.Float)
+    purchasefrom = db.Column(db.String(75))
+    tagsexpire = db.Column(db.DateTime)
+    pictureURL = db.Column(db.String(500))
+    vinnumber = db.Column(db.String(25))
+    licenseplate = db.Column(db.String(20))
+    curown = db.Column(db.Boolean)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    #Relationships
+    service = db.relationship('Service', backref='vehicles', lazy="dynamic", passive_deletes=True)
+
+class States(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    state = db.Column(db.String(50))
+    abr = db.Column(db.String(2))
+    
+class Settings(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    userid = db.Column(db.Integer, nullable=False)
+    #MENU
+    menu_planner = db.Column(db.Boolean)
+    menu_rec = db.Column(db.Boolean)
+    menu_shopping = db.Column(db.Boolean)
+    menu_extra1 = db.Column(db.Boolean)
+    menu_extra2 = db.Column(db.Boolean)
+    menu_extra3 = db.Column(db.Boolean)
+    menu_extra4 = db.Column(db.Boolean)
+    menu_extra5 = db.Column(db.Boolean)
+    menu_extra1_label = db.Column(db.String(30))
+    menu_extra1_url  = db.Column(db.String(200))
+    menu_extra2_label = db.Column(db.String(30))
+    menu_extra2_url  = db.Column(db.String(200))
+    menu_extra3_label = db.Column(db.String(30))
+    menu_extra3_url  = db.Column(db.String(200))
+    menu_extra4_label = db.Column(db.String(30))
+    menu_extra4_url  = db.Column(db.String(200))
+    menu_extra5_label = db.Column(db.String(30))
+    menu_extra5_url  = db.Column(db.String(200))
+    #HEALTH
+    health_facilities = db.Column(db.Boolean)
+    health_doctors = db.Column(db.Boolean)
+    health_meds = db.Column(db.Boolean)
+    health_medlist = db.Column(db.Boolean)
+    health_hospt = db.Column(db.Boolean)
+    health_surg = db.Column(db.Boolean)
+    health_allergies = db.Column(db.Boolean)
+    health_a1c = db.Column(db.Boolean)
+    health_cpap = db.Column(db.Boolean)
+    health_extra1 = db.Column(db.Boolean)
+    health_extra2 = db.Column(db.Boolean)
+    health_extra3 = db.Column(db.Boolean)
+    health_extra4 = db.Column(db.Boolean)
+    health_extra5 = db.Column(db.Boolean)
+    health_extra1_label = db.Column(db.String(30))
+    health_extra1_url  = db.Column(db.String(200))
+    health_extra2_label = db.Column(db.String(30))
+    health_extra2_url  = db.Column(db.String(200))
+    health_extra3_label = db.Column(db.String(30))
+    health_extra3_url  = db.Column(db.String(200))
+    health_extra4_label = db.Column(db.String(30))
+    health_extra4_url  = db.Column(db.String(200))
+    health_extra5_label = db.Column(db.String(30))
+    health_extra5_url  = db.Column(db.String(200))
+    #PRODUCTIVITY
+    prod_goals = db.Column(db.Boolean)
+    prod_projects = db.Column(db.Boolean)
+    prod_tasks = db.Column(db.Boolean)
+    prod_extra1 = db.Column(db.Boolean)
+    prod_extra2 = db.Column(db.Boolean)
+    prod_extra3 = db.Column(db.Boolean)
+    prod_extra4 = db.Column(db.Boolean)
+    prod_extra5 = db.Column(db.Boolean)
+    prod_extra1_label = db.Column(db.String(30))
+    prod_extra1_url  = db.Column(db.String(200))
+    prod_extra2_label = db.Column(db.String(30))
+    prod_extra2_url  = db.Column(db.String(200))
+    prod_extra3_label = db.Column(db.String(30))
+    prod_extra3_url  = db.Column(db.String(200))
+    prod_extra4_label = db.Column(db.String(30))
+    prod_extra4_url  = db.Column(db.String(200))
+    prod_extra5_label = db.Column(db.String(30))
+    prod_extra5_url  = db.Column(db.String(200))
+    #PERSONAL
+    personal_cars = db.Column(db.Boolean)
+    personal_wifi = db.Column(db.Boolean)
+    personal_extra1 = db.Column(db.Boolean)
+    personal_extra2 = db.Column(db.Boolean)
+    personal_extra3 = db.Column(db.Boolean)
+    personal_extra4 = db.Column(db.Boolean)
+    personal_extra5 = db.Column(db.Boolean)
+    personal_extra1_label = db.Column(db.String(30))
+    personal_extra1_url  = db.Column(db.String(200))
+    personal_extra2_label = db.Column(db.String(30))
+    personal_extra2_url  = db.Column(db.String(200))
+    personal_extra3_label = db.Column(db.String(30))
+    personal_extra3_url  = db.Column(db.String(200))
+    personal_extra4_label = db.Column(db.String(30))
+    personal_extra4_url  = db.Column(db.String(200))
+    personal_extra5_label = db.Column(db.String(30))
+    personal_extra5_url  = db.Column(db.String(200))
+    #OTHER
+    other_extra1 = db.Column(db.Boolean)
+    other_extra2 = db.Column(db.Boolean)
+    other_extra3 = db.Column(db.Boolean)
+    other_extra4 = db.Column(db.Boolean)
+    other_extra5 = db.Column(db.Boolean)
+    other_extra1_label = db.Column(db.String(30))
+    other_extra1_url  = db.Column(db.String(200))
+    other_extra2_label = db.Column(db.String(30))
+    other_extra2_url  = db.Column(db.String(200))
+    other_extra3_label = db.Column(db.String(30))
+    other_extra3_url  = db.Column(db.String(200))
+    other_extra4_label = db.Column(db.String(30))
+    other_extra4_url  = db.Column(db.String(200))
+    other_extra5_label = db.Column(db.String(30))
+    other_extra5_url  = db.Column(db.String(200))
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    
+class Service(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    service = db.Column(db.String(75))
+    place = db.Column(db.String(75))
+    cost = db.Column(db.Float)
+    mileage = db.Column(db.Integer)
+    date = db.Column(db.Date)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    # forign keys
+    vehiclefk = db.Column(db.Integer, db.ForeignKey('vehicles.id', ondelete="CASCADE"), nullable=True)
+    
+class CodeSnips(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    catagory = db.Column(db.Text)
+    subcatagory = db.Column(db.Text)
+    name = db.Column(db.Text)
+    description = db.Column(db.Text)
+    notes = db.Column(db.Text)
+    code = db.Column(db.Text)
+    link1 = db.Column(db.Text)
+    link2 = db.Column(db.Text)
+    link3 = db.Column(db.Text)
+    link4 = db.Column(db.Text)
+    link5 = db.Column(db.Text)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    
+class HousingHistory(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    movein = db.Column(db.Date)
+    moveout = db.Column(db.Date)
+    address = db.Column(db.Text)
+    city = db.Column(db.Text)
+    state = db.Column(db.Text)
+    zip = db.Column(db.Text)
+    userid = db.Column(db.Integer)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    
+class Cpap(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name = db.Column(db.Text)
+    lastordered = db.Column(db.Date)
+    nextorderdate = db.Column(db.Date)
+    howoften = db.Column(db.Integer)
+    imageURL = db.Column(db.Text)
+    itemnum = db.Column(db.Text)
+    userid = db.Column(db.Integer)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    
+class Graves(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name = db.Column(db.Text)
+    relationship = db.Column(db.Text)
+    birthdate = db.Column(db.Text)
+    birthplace = db.Column(db.Text)
+    deathdate = db.Column(db.Text)
+    deathplace = db.Column(db.Text)
+    plot = db.Column(db.Text)
+    fag_id = db.Column(db.Text)
+    fag_url = db.Column(db.Text)
+    notes = db.Column(db.Text)
+    obituary = db.Column(db.Text)
+    pictureURL = db.Column(db.Text)
+    userid = db.Column(db.Integer)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    #Forign Key
+    cemeteriesfk = db.Column(db.Integer, db.ForeignKey('cemeteries.id', ondelete="CASCADE"), nullable=False)
+
+class Cemeteries(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name = db.Column(db.Text)
+    address = db.Column(db.Text)
+    city = db.Column(db.Text)
+    state = db.Column(db.Text)
+    zip = db.Column(db.Text)
+    phone = db.Column(db.Text)
+    url = db.Column(db.Text)
+    userid = db.Column(db.Integer)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
+    #relationships
+    graves = db.relationship('Graves', backref='cemeteries', passive_deletes=True)
+
+class Insinfo(db.Model):
+    id = db.Column(db.Integer, primary_key=True)
+    name = db.Column(db.Text)
+    phone = db.Column(db.Text)
+    policynum = db.Column(db.Text)
+    userid = db.Column(db.Integer)
+    update_time = db. Column (db. DateTime, default=datetime.datetime.now,onupdate=datetime.datetime.now)
+    date_created = db.Column(db.DateTime(timezone=True), default=func.now())
diff --git a/website/notion.py b/website/notion.py
new file mode 100644
index 0000000..e38477f
--- /dev/null
+++ b/website/notion.py
@@ -0,0 +1,65 @@
+import requests, json
+from website import db
+
+from website.models import Dish
+
+
+def auth(auth_name):
+    with open("website/key.txt") as file:
+        data = file.read()
+        keys = json.loads(data)
+    key = keys[auth_name]
+    return key
+    
+    
+def get_supplies():
+    url = "https://api.notion.com/v1/databases/ac64bba17a8e4a3aa696543024c86206/query"
+    
+    payload = ""
+    headers = {
+    'Content-Type': 'application/json',
+    'Notion-Version': '2021-05-13',
+    'Authorization': 'Bearer ' + auth('notion')
+    }
+
+    response = requests.request("POST", url, headers=headers, data=payload)
+    jsonResponse = json.loads(response.text)
+    
+    return jsonResponse
+
+def get_menu():
+    url = "https://api.notion.com/v1/databases/79e5cfd9b9654ca492ed8290557c37da/query"
+    
+    payload = ""
+    headers = {
+    'Content-Type': 'application/json',
+    'Notion-Version': '2021-05-13',
+    'Authorization': 'Bearer ' + auth('notion')
+    }
+
+    response = requests.request("POST", url, headers=headers, data=payload)
+    jsonResponse = json.loads(response.text)
+
+    with open("menu.json",'w') as file:
+        file.write(json.dumps(jsonResponse))
+    
+    # menu = []
+    for i in range(len(jsonResponse['results'])):
+        id = jsonResponse['results'][i]['id']
+        name = jsonResponse['results'][i]['properties']['Name']['title'][0]['text']['content']
+        # littlemenu = {}
+        # littlemenu['id'] = id
+        # littlemenu['name'] = name
+        # menu.append(littlemenu)
+        
+        if Dish.query.filter_by(notionID=id).first():
+            pass
+        else:
+            item = Dish(notionID=id, name=name)
+            db.session.add(item)
+            db.session.commit()
+    
+    # return menu
+
+def get_meals():
+    pass
\ No newline at end of file
diff --git a/website/nutrition.py b/website/nutrition.py
new file mode 100644
index 0000000..cf21423
--- /dev/null
+++ b/website/nutrition.py
@@ -0,0 +1,155 @@
+import requests
+import json
+
+def get_food_item(item):
+    url = "https://trackapi.nutritionix.com/v2/natural/nutrients"    
+
+    payload='query='+item
+    headers = {
+    'x-app-id': '9b92ba02',
+    'x-app-key': 'a8e4036769b4268c11f0fb1a50e7ec3c',
+    'Content-Type': 'application/x-www-form-urlencoded'
+    }
+
+    response = requests.request("POST", url, headers=headers, data=payload)
+    fulljson = json.loads(response.text)
+    if 'message' in fulljson:
+        if fulljson['message'] == "We couldn't match any of your foods":
+            return 0
+    
+    # return json.dumps(fulljson)
+    with open('fulljson.json','w') as jsonfull:
+        jsonfull.write(json.dumps(fulljson))
+    
+    nutrition = parse_results(fulljson)
+    
+    with open('nutrition.json','w') as jsonfile:
+        jsonfile.write(json.dumps(nutrition))
+    return nutrition
+
+def parse_results(fulljson):
+    full_nutrition = {}
+        
+    full_nutrition['foodname'] = fulljson['foods'][0]['food_name']
+    full_nutrition['servingqty'] = fulljson['foods'][0]['serving_qty']
+    full_nutrition['servingunit'] = fulljson['foods'][0]['serving_unit']
+    #weight
+    if 'serving_weight_grams' not in fulljson['foods'][0]: full_nutrition['weight'] = 0
+    elif fulljson['foods'][0]['serving_weight_grams'] is None: full_nutrition['weight'] = 0
+    else: full_nutrition['weight'] = round(fulljson['foods'][0]['serving_weight_grams'],1)
+    
+    #calories
+    if 'nf_calories' not in fulljson['foods'][0]: full_nutrition['calories'] = 0
+    elif fulljson['foods'][0]['nf_calories'] is None: full_nutrition['calories'] = 0
+    else: full_nutrition['calories'] = round(fulljson['foods'][0]['nf_calories'],1)
+    
+    #calories from fat
+    if 'nf_total_fat' not in fulljson['foods'][0]: full_nutrition['calFat'] = 0
+    elif fulljson['foods'][0]['nf_total_fat'] is None: full_nutrition['calFat'] = 0
+    else: full_nutrition['calFat'] = round((fulljson['foods'][0]['nf_total_fat'])*9,1)
+    
+    #total fat
+    if 'nf_total_fat' not in fulljson['foods'][0]: full_nutrition['totalFat'] = 0
+    elif fulljson['foods'][0]['nf_total_fat'] is None: full_nutrition['totalFat'] = 0
+    else: full_nutrition['totalFat'] = round(fulljson['foods'][0]['nf_total_fat'],1)
+    
+    #Saturated fat
+    if 'nf_saturated_fat' not in fulljson['foods'][0]: full_nutrition['satFat'] = 0
+    elif fulljson['foods'][0]['nf_saturated_fat'] is None: full_nutrition['satFat'] = 0
+    else: full_nutrition['satFat'] = round(fulljson['foods'][0]['nf_saturated_fat'],1)
+    
+    #trans fat
+    if 'nf_trans_fatty_acid' not in fulljson['foods'][0]: full_nutrition['transFat'] = 0
+    elif fulljson['foods'][0]['nf_trans_fatty_acid'] is None: full_nutrition['cholesterol'] = 0
+    else: full_nutrition['transFat'] = round(fulljson['foods'][0]['nf_trans_fatty_acid'],1)
+    
+    #cholesterol
+    if 'nf_cholesterol' not in fulljson['foods'][0]: full_nutrition['cholesterol'] = 0
+    elif fulljson['foods'][0]['nf_cholesterol'] is None: full_nutrition['cholesterol'] = 0
+    else: full_nutrition['cholesterol'] = round(fulljson['foods'][0]['nf_cholesterol'],1)
+    
+    #sodium
+    if 'nf_sodium' not in fulljson['foods'][0]: full_nutrition['sodium'] = 0
+    elif fulljson['foods'][0]['nf_sodium'] is None: full_nutrition['sodium'] = 0
+    else: full_nutrition['sodium'] = round(fulljson['foods'][0]['nf_sodium'],1)
+    
+    #Total Carbs
+    if 'nf_total_carbohydrate' not in fulljson['foods'][0]: full_nutrition['totalCarb'] = 0
+    elif fulljson['foods'][0]['nf_total_carbohydrate'] is None: full_nutrition['totalCarb'] = 0
+    else: full_nutrition['totalCarb'] = round(fulljson['foods'][0]['nf_total_carbohydrate'],1)
+    
+    #Fiber
+    if 'nf_dietary_fiber' not in fulljson['foods'][0]: full_nutrition['fiber'] = 0
+    elif fulljson['foods'][0]['nf_dietary_fiber'] is None: full_nutrition['fiber'] = 0
+    else: full_nutrition['fiber'] = round(fulljson['foods'][0]['nf_dietary_fiber'],1)
+    
+    #sugar
+    if 'nf_sugars' not in fulljson['foods'][0]: full_nutrition['sugar'] = 0
+    elif fulljson['foods'][0]['nf_sugars'] is None: full_nutrition['sugar'] = 0
+    else: full_nutrition['sugar'] = round(fulljson['foods'][0]['nf_sugars'],1)
+    
+    #protein
+    if 'nf_protein' not in fulljson['foods'][0]: full_nutrition['protein'] = 0
+    elif fulljson['foods'][0]['nf_protein'] is None: full_nutrition['protein'] = 0
+    else: full_nutrition['protein'] = round(fulljson['foods'][0]['nf_protein'],1)
+    
+    #potassium
+    if 'nf_potassium' not in fulljson['foods'][0]: full_nutrition['potassium'] = 0
+    elif fulljson['foods'][0]['nf_potassium'] is None: full_nutrition['potassium'] = 0
+    else: full_nutrition['potassium'] = round(fulljson['foods'][0]['nf_potassium'],1)
+    
+    full_nutrition['picURL'] = fulljson['foods'][0]['photo']['thumb']
+    
+    return full_nutrition
+
+def nutrition_single(ings):
+    allnutrition = {}
+    weight = 0
+    fat_total = 0
+    fat_sat = 0
+    fat_trans = 0
+    cholesterol = 0
+    sodium = 0
+    potassium = 0
+    carb_total = 0
+    carb_fiber = 0
+    carb_sugar = 0
+    protein = 0
+    calories = 0
+    calories_fat = 0
+    
+    for ing in ings:
+        weight = weight + round(ing.weight)
+        fat_total = fat_total + round(ing.fat_total)
+        fat_sat = fat_sat + round(ing.fat_sat)
+        fat_trans = fat_trans + round(ing.fat_trans)
+        cholesterol = cholesterol + round(ing.cholesterol)
+        sodium = sodium + round(ing.sodium)
+        potassium = potassium + round(ing.potassium)
+        carb_total = carb_total + round(ing.carb_total)
+        carb_fiber = carb_fiber + round(ing.carb_fiber)
+        carb_sugar = carb_sugar + round(ing.carb_sugar)
+        protein = protein + round(ing.protein)
+        calories = calories + round(ing.calories)
+        calories_fat= round(fat_total*9)
+    
+    allnutrition['fat_total'] = fat_total
+    allnutrition['weight'] = weight
+    allnutrition['fat_sat'] = fat_sat
+    allnutrition['fat_trans'] = fat_trans
+    allnutrition['cholesterol'] = cholesterol
+    allnutrition['sodium'] = sodium
+    allnutrition['potassium'] = potassium
+    allnutrition['carb_total'] = carb_total
+    allnutrition['carb_fiber'] = carb_fiber
+    allnutrition['carb_sugar'] = carb_sugar
+    allnutrition['protein'] = protein
+    allnutrition['calories'] = calories
+    allnutrition['calories_fat'] = calories_fat
+    
+    return allnutrition
+
+if __name__ == '__main__':
+    eat = get_food_item("30 oz van camps pork and beans")
+    with open('fulljson.json','w') as jsonfull:
+        jsonfull.write(eat)
\ No newline at end of file
diff --git a/website/process_medications.py b/website/process_medications.py
new file mode 100644
index 0000000..6db5e34
--- /dev/null
+++ b/website/process_medications.py
@@ -0,0 +1,75 @@
+from website import db
+
+from flask import redirect, url_for, send_file, send_from_directory
+from website.models import Facility, Medications
+import datetime
+from datetime import timedelta
+from website.models import Projects, Tasks
+from flask_login import current_user
+
+def make_ics(fullname, cal):
+    with open(fullname, 'w') as my_file:
+        my_file.write('BEGIN:VCALENDAR\nVERSION:2.0\n')
+        my_file.write('X-WR-CALNAME:'+ cal + "\n")
+    
+def details_ics(med, fullname):
+    with open (fullname, 'a') as my_file:
+        startdate = datetime.datetime.strftime(med.next_refill,"%Y%m%d")
+        enddate = datetime.datetime.strftime(med.next_refill + timedelta(days=1),"%Y%m%d")
+        MedName = med.name
+        TaskName = "Call to Order " + MedName
+        PickupDate = datetime.datetime.strftime(med.next_refill,"%m-%d-%Y")
+        Pharmacy = db.session.query(Facility).filter(Facility.id  == med.pharmacy).first().name
+        
+        my_file.write('BEGIN:VEVENT\n')
+        my_file.write('SUMMARY:' + TaskName +"\n")
+        my_file.write('LOCATION:' + Pharmacy +"\n")
+        my_file.write('DESCRIPTION:' + "Call " + Pharmacy + " to request a refill of " + MedName + " to be picked up on " + PickupDate + "\n")
+        my_file.write('DTSTART;VALUE=DATE:'+ str(startdate) +"\n")
+        my_file.write('DTEND;VALUE=DATE:'+ str(enddate) +"\n")
+        my_file.write('END:VEVENT\n')
+
+def close_ics(path,filename,fullname):
+    with open (fullname, 'a') as my_file:
+        my_file.write('END:VCALENDAR')
+
+        
+        
+def make_tasks(med):
+    Pharmacy = db.session.query(Facility).filter(Facility.id  == med.pharmacy).first().name
+    MedName = med.name
+    PickupDate = med.next_refill
+    Project = db.session.query(Projects).filter(Projects.name == "Medical").first().id
+    
+    newtask = Tasks(
+        item = "Call " + Pharmacy + " to request a refill of " + MedName + " to be picked up on " + PickupDate.strftime('%m-%d-%Y'),
+        userid = current_user.id,
+        project = Project,
+        duedate = PickupDate
+    )
+    db.session.add(newtask)
+    db.session.commit()
+
+
+def set_process_to_no(med):
+    medication = db.session.query(Medications).filter(Medications.id == med.id).first()
+    medication.process = False
+    db.session.commit()
+
+# TODO: Finish this process with the process.txt file
+
+# results = db.session.query(Medications).filter(Medications.process == True).filter(Medications.userid == current_user.id).all()
+
+# if len(results) == 0:
+#     message = "No medications found to process.  Please check the process field and re-run this program"
+#     print(message)
+#     redirect(url_for ('views.medications_reorder'), message=message)
+# else:
+#     make_ics()
+#     for result in results:
+#         details_ics(result)
+#     close_ics()
+    
+#     for result in results:
+#         make_tasks(result)
+#         set_process_to_no(result)
\ No newline at end of file
diff --git a/website/scrape_recipe.py b/website/scrape_recipe.py
new file mode 100644
index 0000000..fb7ec9f
--- /dev/null
+++ b/website/scrape_recipe.py
@@ -0,0 +1,82 @@
+from recipe_scrapers import scrape_me
+from website.models import *
+from website.nutrition import *
+
+def scrape_recipe(website):
+    scraper = scrape_me(website,wild_mode=True)
+
+    title = scraper.title()
+    
+    try:
+        if scraper.cook_time() == 0 or scraper.cook_time() == None:
+            cooktime = 0
+        else:
+            cooktime = scraper.cook_time()
+    except: cooktime = 0
+        
+    try:
+        if scraper.prep_time() == 0 or scraper.prep_time() == None:
+            preptime = 0
+        else: 
+            preptime = scraper.prep_time()
+    except: preptime = 0
+    
+    try:
+        yeild = int(''.join(i for i in scraper.yields() if i.isdigit()))
+        if yeild == 0 or yeild == None:
+            yeild = 1
+    except: yeild = 1
+    
+    ings = scraper.ingredients()
+    inst=scraper.instructions().split('\n')
+    img = scraper.image()
+    
+        
+    return [[title, img, yeild, cooktime, preptime], [ings], [inst]]
+
+
+def make_dish(title, img, yeild):
+    newdish = Dish(
+        name = title,
+        pictureURL = img,
+        numServings = yeild,
+    )
+    db.session.add(newdish)
+    db.session.commit()
+    
+    newid = db.session.query(Dish).filter(Dish.name == title).first().id
+    
+    return newid
+
+
+def make_recipe(nutrition, dishid):
+    newrec = Recipe(
+        dishfk = dishid,
+        qty = nutrition['servingqty'],
+        measurement = nutrition['servingunit'],
+        ing = nutrition['foodname'],
+        fat_total = nutrition['totalFat'],
+        weight = nutrition['weight'],
+        fat_sat = nutrition['satFat'],
+        fat_trans = nutrition['transFat'],
+        cholesterol = nutrition['cholesterol'],
+        sodium = nutrition['sodium'],
+        potassium = nutrition['potassium'],
+        carb_total = nutrition['totalCarb'],
+        carb_fiber = nutrition['fiber'],
+        carb_sugar = nutrition['sugar'],
+        protein = nutrition['protein'],
+        calories = nutrition['calories'],
+        pictureURL = nutrition['picURL'],
+    )
+    db.session.add(newrec)
+    db.session.commit()
+
+def make_steps(step, dishid, i):
+    newstep = Steps(
+        dishfk=dishid,
+        step_num = i,
+        step_text = step
+    )
+    db.session.add(newstep)
+    db.session.commit()
\ No newline at end of file
diff --git a/website/static/.DS_Store b/website/static/.DS_Store
new file mode 100644
index 0000000..cae529b
Binary files /dev/null and b/website/static/.DS_Store differ
diff --git a/website/static/call_for_medication.ics b/website/static/call_for_medication.ics
new file mode 100644
index 0000000..6fc2d8c
--- /dev/null
+++ b/website/static/call_for_medication.ics
@@ -0,0 +1,73 @@
+BEGIN:VCALENDAR
+VERSION:2.0
+BEGIN:VEVENT
+SUMMARY:Call to Order Trulicity
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Trulicity to be picked up on 11-05-2021
+DTSTART;VALUE=DATE:20211105
+DTEND;VALUE=DATE:20211106
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Amlodipine
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Amlodipine to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Losartan
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Losartan to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Humulin R - U500
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Humulin R - U500 to be picked up on 11-05-2021
+DTSTART;VALUE=DATE:20211105
+DTEND;VALUE=DATE:20211106
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Zetia
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Zetia to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Omeprazole
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Omeprazole to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Hydrochlorothiazide
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Hydrochlorothiazide to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Sertraline
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Sertraline to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Levothyroxine
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Levothyroxine to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+BEGIN:VEVENT
+SUMMARY:Call to Order Gabapentin
+LOCATION:Dallas Pill Box
+DESCRIPTION:Call Dallas Pill Box to request a refill of Gabapentin to be picked up on 10-28-2021
+DTSTART;VALUE=DATE:20211028
+DTEND;VALUE=DATE:20211029
+END:VEVENT
+END:VCALENDAR
\ No newline at end of file
diff --git a/website/static/css/bootstrap.css b/website/static/css/bootstrap.css
new file mode 100644
index 0000000..f16c5be
--- /dev/null
+++ b/website/static/css/bootstrap.css
@@ -0,0 +1,11266 @@
+@charset "UTF-8";
+/*!
+ * Bootstrap v5.1.3 (https://getbootstrap.com/)
+ * Copyright 2011-2021 The Bootstrap Authors
+ * Copyright 2011-2021 Twitter, Inc.
+ * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
+ */
+:root {
+  --bs-blue: #0d6efd;
+  --bs-indigo: #6610f2;
+  --bs-purple: #6f42c1;
+  --bs-pink: #d63384;
+  --bs-red: #dc3545;
+  --bs-orange: #fd7e14;
+  --bs-yellow: #ffc107;
+  --bs-green: #198754;
+  --bs-teal: #20c997;
+  --bs-cyan: #0dcaf0;
+  --bs-white: #fff;
+  --bs-gray: #6c757d;
+  --bs-gray-dark: #343a40;
+  --bs-gray-100: #f8f9fa;
+  --bs-gray-200: #e9ecef;
+  --bs-gray-300: #dee2e6;
+  --bs-gray-400: #ced4da;
+  --bs-gray-500: #adb5bd;
+  --bs-gray-600: #6c757d;
+  --bs-gray-700: #495057;
+  --bs-gray-800: #343a40;
+  --bs-gray-900: #212529;
+  --bs-primary: #0d6efd;
+  --bs-secondary: #6c757d;
+  --bs-success: #198754;
+  --bs-info: #0dcaf0;
+  --bs-warning: #ffc107;
+  --bs-danger: #dc3545;
+  --bs-light: #f8f9fa;
+  --bs-dark: #212529;
+  --bs-primary-rgb: 13, 110, 253;
+  --bs-secondary-rgb: 108, 117, 125;
+  --bs-success-rgb: 25, 135, 84;
+  --bs-info-rgb: 13, 202, 240;
+  --bs-warning-rgb: 255, 193, 7;
+  --bs-danger-rgb: 220, 53, 69;
+  --bs-light-rgb: 248, 249, 250;
+  --bs-dark-rgb: 33, 37, 41;
+  --bs-white-rgb: 255, 255, 255;
+  --bs-black-rgb: 0, 0, 0;
+  --bs-body-color-rgb: 33, 37, 41;
+  --bs-body-bg-rgb: 255, 255, 255;
+  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
+  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
+  --bs-body-font-family: var(--bs-font-sans-serif);
+  --bs-body-font-size: 1rem;
+  --bs-body-font-weight: 400;
+  --bs-body-line-height: 1.5;
+  --bs-body-color: #212529;
+  --bs-body-bg: #fff;
+}
+
+*,
+*::before,
+*::after {
+  box-sizing: border-box;
+}
+
+@media (prefers-reduced-motion: no-preference) {
+  :root {
+    scroll-behavior: smooth;
+  }
+}
+
+body {
+  margin: 0;
+  font-family: var(--bs-body-font-family);
+  font-size: var(--bs-body-font-size);
+  font-weight: var(--bs-body-font-weight);
+  line-height: var(--bs-body-line-height);
+  color: var(--bs-body-color);
+  text-align: var(--bs-body-text-align);
+  background-color: var(--bs-body-bg);
+  -webkit-text-size-adjust: 100%;
+  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+hr {
+  margin: 1rem 0;
+  color: inherit;
+  background-color: currentColor;
+  border: 0;
+  opacity: 0.25;
+}
+
+hr:not([size]) {
+  height: 1px;
+}
+
+h6, .h6, h5, .h5, h4, .h4, h3, .h3, h2, .h2, h1, .h1 {
+  margin-top: 0;
+  margin-bottom: 0.5rem;
+  font-weight: 500;
+  line-height: 1.2;
+}
+
+h1, .h1 {
+  font-size: calc(1.375rem + 1.5vw);
+}
+@media (min-width: 1200px) {
+  h1, .h1 {
+    font-size: 2.5rem;
+  }
+}
+
+h2, .h2 {
+  font-size: calc(1.325rem + 0.9vw);
+}
+@media (min-width: 1200px) {
+  h2, .h2 {
+    font-size: 2rem;
+  }
+}
+
+h3, .h3 {
+  font-size: calc(1.3rem + 0.6vw);
+}
+@media (min-width: 1200px) {
+  h3, .h3 {
+    font-size: 1.75rem;
+  }
+}
+
+h4, .h4 {
+  font-size: calc(1.275rem + 0.3vw);
+}
+@media (min-width: 1200px) {
+  h4, .h4 {
+    font-size: 1.5rem;
+  }
+}
+
+h5, .h5 {
+  font-size: 1.25rem;
+}
+
+h6, .h6 {
+  font-size: 1rem;
+}
+
+p {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+abbr[title],
+abbr[data-bs-original-title] {
+  -webkit-text-decoration: underline dotted;
+  text-decoration: underline dotted;
+  cursor: help;
+  -webkit-text-decoration-skip-ink: none;
+  text-decoration-skip-ink: none;
+}
+
+address {
+  margin-bottom: 1rem;
+  font-style: normal;
+  line-height: inherit;
+}
+
+ol,
+ul {
+  padding-left: 2rem;
+}
+
+ol,
+ul,
+dl {
+  margin-top: 0;
+  margin-bottom: 1rem;
+}
+
+ol ol,
+ul ul,
+ol ul,
+ul ol {
+  margin-bottom: 0;
+}
+
+dt {
+  font-weight: 700;
+}
+
+dd {
+  margin-bottom: 0.5rem;
+  margin-left: 0;
+}
+
+blockquote {
+  margin: 0 0 1rem;
+}
+
+b,
+strong {
+  font-weight: bolder;
+}
+
+small, .small {
+  font-size: 0.875em;
+}
+
+mark, .mark {
+  padding: 0.2em;
+  background-color: #fcf8e3;
+}
+
+sub,
+sup {
+  position: relative;
+  font-size: 0.75em;
+  line-height: 0;
+  vertical-align: baseline;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+sup {
+  top: -0.5em;
+}
+
+a {
+  color: #0d6efd;
+  text-decoration: underline;
+}
+a:hover {
+  color: #0a58ca;
+}
+
+a:not([href]):not([class]), a:not([href]):not([class]):hover {
+  color: inherit;
+  text-decoration: none;
+}
+
+pre,
+code,
+kbd,
+samp {
+  font-family: var(--bs-font-monospace);
+  font-size: 1em;
+  direction: ltr /* rtl:ignore */;
+  unicode-bidi: bidi-override;
+}
+
+pre {
+  display: block;
+  margin-top: 0;
+  margin-bottom: 1rem;
+  overflow: auto;
+  font-size: 0.875em;
+}
+pre code {
+  font-size: inherit;
+  color: inherit;
+  word-break: normal;
+}
+
+code {
+  font-size: 0.875em;
+  color: #d63384;
+  word-wrap: break-word;
+}
+a > code {
+  color: inherit;
+}
+
+kbd {
+  padding: 0.2rem 0.4rem;
+  font-size: 0.875em;
+  color: #fff;
+  background-color: #212529;
+  border-radius: 0.2rem;
+}
+kbd kbd {
+  padding: 0;
+  font-size: 1em;
+  font-weight: 700;
+}
+
+figure {
+  margin: 0 0 1rem;
+}
+
+img,
+svg {
+  vertical-align: middle;
+}
+
+table {
+  caption-side: bottom;
+  border-collapse: collapse;
+}
+
+caption {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  color: #6c757d;
+  text-align: left;
+}
+
+th {
+  text-align: inherit;
+  text-align: -webkit-match-parent;
+}
+
+thead,
+tbody,
+tfoot,
+tr,
+td,
+th {
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+}
+
+label {
+  display: inline-block;
+}
+
+button {
+  border-radius: 0;
+}
+
+button:focus:not(:focus-visible) {
+  outline: 0;
+}
+
+input,
+button,
+select,
+optgroup,
+textarea {
+  margin: 0;
+  font-family: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+button,
+select {
+  text-transform: none;
+}
+
+[role=button] {
+  cursor: pointer;
+}
+
+select {
+  word-wrap: normal;
+}
+select:disabled {
+  opacity: 1;
+}
+
+[list]::-webkit-calendar-picker-indicator {
+  display: none;
+}
+
+button,
+[type=button],
+[type=reset],
+[type=submit] {
+  -webkit-appearance: button;
+}
+button:not(:disabled),
+[type=button]:not(:disabled),
+[type=reset]:not(:disabled),
+[type=submit]:not(:disabled) {
+  cursor: pointer;
+}
+
+::-moz-focus-inner {
+  padding: 0;
+  border-style: none;
+}
+
+textarea {
+  resize: vertical;
+}
+
+fieldset {
+  min-width: 0;
+  padding: 0;
+  margin: 0;
+  border: 0;
+}
+
+legend {
+  float: left;
+  width: 100%;
+  padding: 0;
+  margin-bottom: 0.5rem;
+  font-size: calc(1.275rem + 0.3vw);
+  line-height: inherit;
+}
+@media (min-width: 1200px) {
+  legend {
+    font-size: 1.5rem;
+  }
+}
+legend + * {
+  clear: left;
+}
+
+::-webkit-datetime-edit-fields-wrapper,
+::-webkit-datetime-edit-text,
+::-webkit-datetime-edit-minute,
+::-webkit-datetime-edit-hour-field,
+::-webkit-datetime-edit-day-field,
+::-webkit-datetime-edit-month-field,
+::-webkit-datetime-edit-year-field {
+  padding: 0;
+}
+
+::-webkit-inner-spin-button {
+  height: auto;
+}
+
+[type=search] {
+  outline-offset: -2px;
+  -webkit-appearance: textfield;
+}
+
+/* rtl:raw:
+[type="tel"],
+[type="url"],
+[type="email"],
+[type="number"] {
+  direction: ltr;
+}
+*/
+::-webkit-search-decoration {
+  -webkit-appearance: none;
+}
+
+::-webkit-color-swatch-wrapper {
+  padding: 0;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+}
+
+::file-selector-button {
+  font: inherit;
+}
+
+::-webkit-file-upload-button {
+  font: inherit;
+  -webkit-appearance: button;
+}
+
+output {
+  display: inline-block;
+}
+
+iframe {
+  border: 0;
+}
+
+summary {
+  display: list-item;
+  cursor: pointer;
+}
+
+progress {
+  vertical-align: baseline;
+}
+
+[hidden] {
+  display: none !important;
+}
+
+.lead {
+  font-size: 1.25rem;
+  font-weight: 300;
+}
+
+.display-1 {
+  font-size: calc(1.625rem + 4.5vw);
+  font-weight: 300;
+  line-height: 1.2;
+}
+@media (min-width: 1200px) {
+  .display-1 {
+    font-size: 5rem;
+  }
+}
+
+.display-2 {
+  font-size: calc(1.575rem + 3.9vw);
+  font-weight: 300;
+  line-height: 1.2;
+}
+@media (min-width: 1200px) {
+  .display-2 {
+    font-size: 4.5rem;
+  }
+}
+
+.display-3 {
+  font-size: calc(1.525rem + 3.3vw);
+  font-weight: 300;
+  line-height: 1.2;
+}
+@media (min-width: 1200px) {
+  .display-3 {
+    font-size: 4rem;
+  }
+}
+
+.display-4 {
+  font-size: calc(1.475rem + 2.7vw);
+  font-weight: 300;
+  line-height: 1.2;
+}
+@media (min-width: 1200px) {
+  .display-4 {
+    font-size: 3.5rem;
+  }
+}
+
+.display-5 {
+  font-size: calc(1.425rem + 2.1vw);
+  font-weight: 300;
+  line-height: 1.2;
+}
+@media (min-width: 1200px) {
+  .display-5 {
+    font-size: 3rem;
+  }
+}
+
+.display-6 {
+  font-size: calc(1.375rem + 1.5vw);
+  font-weight: 300;
+  line-height: 1.2;
+}
+@media (min-width: 1200px) {
+  .display-6 {
+    font-size: 2.5rem;
+  }
+}
+
+.list-unstyled {
+  padding-left: 0;
+  list-style: none;
+}
+
+.list-inline {
+  padding-left: 0;
+  list-style: none;
+}
+
+.list-inline-item {
+  display: inline-block;
+}
+.list-inline-item:not(:last-child) {
+  margin-right: 0.5rem;
+}
+
+.initialism {
+  font-size: 0.875em;
+  text-transform: uppercase;
+}
+
+.blockquote {
+  margin-bottom: 1rem;
+  font-size: 1.25rem;
+}
+.blockquote > :last-child {
+  margin-bottom: 0;
+}
+
+.blockquote-footer {
+  margin-top: -1rem;
+  margin-bottom: 1rem;
+  font-size: 0.875em;
+  color: #6c757d;
+}
+.blockquote-footer::before {
+  content: "— ";
+}
+
+.img-fluid {
+  max-width: 100%;
+  height: auto;
+}
+
+.img-thumbnail {
+  padding: 0.25rem;
+  background-color: #fff;
+  border: 1px solid #dee2e6;
+  border-radius: 0.25rem;
+  max-width: 100%;
+  height: auto;
+}
+
+.figure {
+  display: inline-block;
+}
+
+.figure-img {
+  margin-bottom: 0.5rem;
+  line-height: 1;
+}
+
+.figure-caption {
+  font-size: 0.875em;
+  color: #6c757d;
+}
+
+.container,
+.container-fluid,
+.container-xxl,
+.container-xl,
+.container-lg,
+.container-md,
+.container-sm {
+  width: 100%;
+  padding-right: var(--bs-gutter-x, 0.75rem);
+  padding-left: var(--bs-gutter-x, 0.75rem);
+  margin-right: auto;
+  margin-left: auto;
+}
+
+@media (min-width: 576px) {
+  .container-sm, .container {
+    max-width: 540px;
+  }
+}
+@media (min-width: 768px) {
+  .container-md, .container-sm, .container {
+    max-width: 720px;
+  }
+}
+@media (min-width: 992px) {
+  .container-lg, .container-md, .container-sm, .container {
+    max-width: 960px;
+  }
+}
+@media (min-width: 1200px) {
+  .container-xl, .container-lg, .container-md, .container-sm, .container {
+    max-width: 1140px;
+  }
+}
+@media (min-width: 1400px) {
+  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
+    max-width: 1320px;
+  }
+}
+.row {
+  --bs-gutter-x: 1.5rem;
+  --bs-gutter-y: 0;
+  display: flex;
+  flex-wrap: wrap;
+  margin-top: calc(-1 * var(--bs-gutter-y));
+  margin-right: calc(-0.5 * var(--bs-gutter-x));
+  margin-left: calc(-0.5 * var(--bs-gutter-x));
+}
+.row > * {
+  flex-shrink: 0;
+  width: 100%;
+  max-width: 100%;
+  padding-right: calc(var(--bs-gutter-x) * 0.5);
+  padding-left: calc(var(--bs-gutter-x) * 0.5);
+  margin-top: var(--bs-gutter-y);
+}
+
+.col {
+  flex: 1 0 0%;
+}
+
+.row-cols-auto > * {
+  flex: 0 0 auto;
+  width: auto;
+}
+
+.row-cols-1 > * {
+  flex: 0 0 auto;
+  width: 100%;
+}
+
+.row-cols-2 > * {
+  flex: 0 0 auto;
+  width: 50%;
+}
+
+.row-cols-3 > * {
+  flex: 0 0 auto;
+  width: 33.3333333333%;
+}
+
+.row-cols-4 > * {
+  flex: 0 0 auto;
+  width: 25%;
+}
+
+.row-cols-5 > * {
+  flex: 0 0 auto;
+  width: 20%;
+}
+
+.row-cols-6 > * {
+  flex: 0 0 auto;
+  width: 16.6666666667%;
+}
+
+.col-auto {
+  flex: 0 0 auto;
+  width: auto;
+}
+
+.col-1 {
+  flex: 0 0 auto;
+  width: 8.33333333%;
+}
+
+.col-2 {
+  flex: 0 0 auto;
+  width: 16.66666667%;
+}
+
+.col-3 {
+  flex: 0 0 auto;
+  width: 25%;
+}
+
+.col-4 {
+  flex: 0 0 auto;
+  width: 33.33333333%;
+}
+
+.col-5 {
+  flex: 0 0 auto;
+  width: 41.66666667%;
+}
+
+.col-6 {
+  flex: 0 0 auto;
+  width: 50%;
+}
+
+.col-7 {
+  flex: 0 0 auto;
+  width: 58.33333333%;
+}
+
+.col-8 {
+  flex: 0 0 auto;
+  width: 66.66666667%;
+}
+
+.col-9 {
+  flex: 0 0 auto;
+  width: 75%;
+}
+
+.col-10 {
+  flex: 0 0 auto;
+  width: 83.33333333%;
+}
+
+.col-11 {
+  flex: 0 0 auto;
+  width: 91.66666667%;
+}
+
+.col-12 {
+  flex: 0 0 auto;
+  width: 100%;
+}
+
+.offset-1 {
+  margin-left: 8.33333333%;
+}
+
+.offset-2 {
+  margin-left: 16.66666667%;
+}
+
+.offset-3 {
+  margin-left: 25%;
+}
+
+.offset-4 {
+  margin-left: 33.33333333%;
+}
+
+.offset-5 {
+  margin-left: 41.66666667%;
+}
+
+.offset-6 {
+  margin-left: 50%;
+}
+
+.offset-7 {
+  margin-left: 58.33333333%;
+}
+
+.offset-8 {
+  margin-left: 66.66666667%;
+}
+
+.offset-9 {
+  margin-left: 75%;
+}
+
+.offset-10 {
+  margin-left: 83.33333333%;
+}
+
+.offset-11 {
+  margin-left: 91.66666667%;
+}
+
+.g-0,
+.gx-0 {
+  --bs-gutter-x: 0;
+}
+
+.g-0,
+.gy-0 {
+  --bs-gutter-y: 0;
+}
+
+.g-1,
+.gx-1 {
+  --bs-gutter-x: 0.25rem;
+}
+
+.g-1,
+.gy-1 {
+  --bs-gutter-y: 0.25rem;
+}
+
+.g-2,
+.gx-2 {
+  --bs-gutter-x: 0.5rem;
+}
+
+.g-2,
+.gy-2 {
+  --bs-gutter-y: 0.5rem;
+}
+
+.g-3,
+.gx-3 {
+  --bs-gutter-x: 1rem;
+}
+
+.g-3,
+.gy-3 {
+  --bs-gutter-y: 1rem;
+}
+
+.g-4,
+.gx-4 {
+  --bs-gutter-x: 1.5rem;
+}
+
+.g-4,
+.gy-4 {
+  --bs-gutter-y: 1.5rem;
+}
+
+.g-5,
+.gx-5 {
+  --bs-gutter-x: 3rem;
+}
+
+.g-5,
+.gy-5 {
+  --bs-gutter-y: 3rem;
+}
+
+@media (min-width: 576px) {
+  .col-sm {
+    flex: 1 0 0%;
+  }
+
+  .row-cols-sm-auto > * {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .row-cols-sm-1 > * {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .row-cols-sm-2 > * {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .row-cols-sm-3 > * {
+    flex: 0 0 auto;
+    width: 33.3333333333%;
+  }
+
+  .row-cols-sm-4 > * {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .row-cols-sm-5 > * {
+    flex: 0 0 auto;
+    width: 20%;
+  }
+
+  .row-cols-sm-6 > * {
+    flex: 0 0 auto;
+    width: 16.6666666667%;
+  }
+
+  .col-sm-auto {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .col-sm-1 {
+    flex: 0 0 auto;
+    width: 8.33333333%;
+  }
+
+  .col-sm-2 {
+    flex: 0 0 auto;
+    width: 16.66666667%;
+  }
+
+  .col-sm-3 {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .col-sm-4 {
+    flex: 0 0 auto;
+    width: 33.33333333%;
+  }
+
+  .col-sm-5 {
+    flex: 0 0 auto;
+    width: 41.66666667%;
+  }
+
+  .col-sm-6 {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .col-sm-7 {
+    flex: 0 0 auto;
+    width: 58.33333333%;
+  }
+
+  .col-sm-8 {
+    flex: 0 0 auto;
+    width: 66.66666667%;
+  }
+
+  .col-sm-9 {
+    flex: 0 0 auto;
+    width: 75%;
+  }
+
+  .col-sm-10 {
+    flex: 0 0 auto;
+    width: 83.33333333%;
+  }
+
+  .col-sm-11 {
+    flex: 0 0 auto;
+    width: 91.66666667%;
+  }
+
+  .col-sm-12 {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .offset-sm-0 {
+    margin-left: 0;
+  }
+
+  .offset-sm-1 {
+    margin-left: 8.33333333%;
+  }
+
+  .offset-sm-2 {
+    margin-left: 16.66666667%;
+  }
+
+  .offset-sm-3 {
+    margin-left: 25%;
+  }
+
+  .offset-sm-4 {
+    margin-left: 33.33333333%;
+  }
+
+  .offset-sm-5 {
+    margin-left: 41.66666667%;
+  }
+
+  .offset-sm-6 {
+    margin-left: 50%;
+  }
+
+  .offset-sm-7 {
+    margin-left: 58.33333333%;
+  }
+
+  .offset-sm-8 {
+    margin-left: 66.66666667%;
+  }
+
+  .offset-sm-9 {
+    margin-left: 75%;
+  }
+
+  .offset-sm-10 {
+    margin-left: 83.33333333%;
+  }
+
+  .offset-sm-11 {
+    margin-left: 91.66666667%;
+  }
+
+  .g-sm-0,
+.gx-sm-0 {
+    --bs-gutter-x: 0;
+  }
+
+  .g-sm-0,
+.gy-sm-0 {
+    --bs-gutter-y: 0;
+  }
+
+  .g-sm-1,
+.gx-sm-1 {
+    --bs-gutter-x: 0.25rem;
+  }
+
+  .g-sm-1,
+.gy-sm-1 {
+    --bs-gutter-y: 0.25rem;
+  }
+
+  .g-sm-2,
+.gx-sm-2 {
+    --bs-gutter-x: 0.5rem;
+  }
+
+  .g-sm-2,
+.gy-sm-2 {
+    --bs-gutter-y: 0.5rem;
+  }
+
+  .g-sm-3,
+.gx-sm-3 {
+    --bs-gutter-x: 1rem;
+  }
+
+  .g-sm-3,
+.gy-sm-3 {
+    --bs-gutter-y: 1rem;
+  }
+
+  .g-sm-4,
+.gx-sm-4 {
+    --bs-gutter-x: 1.5rem;
+  }
+
+  .g-sm-4,
+.gy-sm-4 {
+    --bs-gutter-y: 1.5rem;
+  }
+
+  .g-sm-5,
+.gx-sm-5 {
+    --bs-gutter-x: 3rem;
+  }
+
+  .g-sm-5,
+.gy-sm-5 {
+    --bs-gutter-y: 3rem;
+  }
+}
+@media (min-width: 768px) {
+  .col-md {
+    flex: 1 0 0%;
+  }
+
+  .row-cols-md-auto > * {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .row-cols-md-1 > * {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .row-cols-md-2 > * {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .row-cols-md-3 > * {
+    flex: 0 0 auto;
+    width: 33.3333333333%;
+  }
+
+  .row-cols-md-4 > * {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .row-cols-md-5 > * {
+    flex: 0 0 auto;
+    width: 20%;
+  }
+
+  .row-cols-md-6 > * {
+    flex: 0 0 auto;
+    width: 16.6666666667%;
+  }
+
+  .col-md-auto {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .col-md-1 {
+    flex: 0 0 auto;
+    width: 8.33333333%;
+  }
+
+  .col-md-2 {
+    flex: 0 0 auto;
+    width: 16.66666667%;
+  }
+
+  .col-md-3 {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .col-md-4 {
+    flex: 0 0 auto;
+    width: 33.33333333%;
+  }
+
+  .col-md-5 {
+    flex: 0 0 auto;
+    width: 41.66666667%;
+  }
+
+  .col-md-6 {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .col-md-7 {
+    flex: 0 0 auto;
+    width: 58.33333333%;
+  }
+
+  .col-md-8 {
+    flex: 0 0 auto;
+    width: 66.66666667%;
+  }
+
+  .col-md-9 {
+    flex: 0 0 auto;
+    width: 75%;
+  }
+
+  .col-md-10 {
+    flex: 0 0 auto;
+    width: 83.33333333%;
+  }
+
+  .col-md-11 {
+    flex: 0 0 auto;
+    width: 91.66666667%;
+  }
+
+  .col-md-12 {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .offset-md-0 {
+    margin-left: 0;
+  }
+
+  .offset-md-1 {
+    margin-left: 8.33333333%;
+  }
+
+  .offset-md-2 {
+    margin-left: 16.66666667%;
+  }
+
+  .offset-md-3 {
+    margin-left: 25%;
+  }
+
+  .offset-md-4 {
+    margin-left: 33.33333333%;
+  }
+
+  .offset-md-5 {
+    margin-left: 41.66666667%;
+  }
+
+  .offset-md-6 {
+    margin-left: 50%;
+  }
+
+  .offset-md-7 {
+    margin-left: 58.33333333%;
+  }
+
+  .offset-md-8 {
+    margin-left: 66.66666667%;
+  }
+
+  .offset-md-9 {
+    margin-left: 75%;
+  }
+
+  .offset-md-10 {
+    margin-left: 83.33333333%;
+  }
+
+  .offset-md-11 {
+    margin-left: 91.66666667%;
+  }
+
+  .g-md-0,
+.gx-md-0 {
+    --bs-gutter-x: 0;
+  }
+
+  .g-md-0,
+.gy-md-0 {
+    --bs-gutter-y: 0;
+  }
+
+  .g-md-1,
+.gx-md-1 {
+    --bs-gutter-x: 0.25rem;
+  }
+
+  .g-md-1,
+.gy-md-1 {
+    --bs-gutter-y: 0.25rem;
+  }
+
+  .g-md-2,
+.gx-md-2 {
+    --bs-gutter-x: 0.5rem;
+  }
+
+  .g-md-2,
+.gy-md-2 {
+    --bs-gutter-y: 0.5rem;
+  }
+
+  .g-md-3,
+.gx-md-3 {
+    --bs-gutter-x: 1rem;
+  }
+
+  .g-md-3,
+.gy-md-3 {
+    --bs-gutter-y: 1rem;
+  }
+
+  .g-md-4,
+.gx-md-4 {
+    --bs-gutter-x: 1.5rem;
+  }
+
+  .g-md-4,
+.gy-md-4 {
+    --bs-gutter-y: 1.5rem;
+  }
+
+  .g-md-5,
+.gx-md-5 {
+    --bs-gutter-x: 3rem;
+  }
+
+  .g-md-5,
+.gy-md-5 {
+    --bs-gutter-y: 3rem;
+  }
+}
+@media (min-width: 992px) {
+  .col-lg {
+    flex: 1 0 0%;
+  }
+
+  .row-cols-lg-auto > * {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .row-cols-lg-1 > * {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .row-cols-lg-2 > * {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .row-cols-lg-3 > * {
+    flex: 0 0 auto;
+    width: 33.3333333333%;
+  }
+
+  .row-cols-lg-4 > * {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .row-cols-lg-5 > * {
+    flex: 0 0 auto;
+    width: 20%;
+  }
+
+  .row-cols-lg-6 > * {
+    flex: 0 0 auto;
+    width: 16.6666666667%;
+  }
+
+  .col-lg-auto {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .col-lg-1 {
+    flex: 0 0 auto;
+    width: 8.33333333%;
+  }
+
+  .col-lg-2 {
+    flex: 0 0 auto;
+    width: 16.66666667%;
+  }
+
+  .col-lg-3 {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .col-lg-4 {
+    flex: 0 0 auto;
+    width: 33.33333333%;
+  }
+
+  .col-lg-5 {
+    flex: 0 0 auto;
+    width: 41.66666667%;
+  }
+
+  .col-lg-6 {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .col-lg-7 {
+    flex: 0 0 auto;
+    width: 58.33333333%;
+  }
+
+  .col-lg-8 {
+    flex: 0 0 auto;
+    width: 66.66666667%;
+  }
+
+  .col-lg-9 {
+    flex: 0 0 auto;
+    width: 75%;
+  }
+
+  .col-lg-10 {
+    flex: 0 0 auto;
+    width: 83.33333333%;
+  }
+
+  .col-lg-11 {
+    flex: 0 0 auto;
+    width: 91.66666667%;
+  }
+
+  .col-lg-12 {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .offset-lg-0 {
+    margin-left: 0;
+  }
+
+  .offset-lg-1 {
+    margin-left: 8.33333333%;
+  }
+
+  .offset-lg-2 {
+    margin-left: 16.66666667%;
+  }
+
+  .offset-lg-3 {
+    margin-left: 25%;
+  }
+
+  .offset-lg-4 {
+    margin-left: 33.33333333%;
+  }
+
+  .offset-lg-5 {
+    margin-left: 41.66666667%;
+  }
+
+  .offset-lg-6 {
+    margin-left: 50%;
+  }
+
+  .offset-lg-7 {
+    margin-left: 58.33333333%;
+  }
+
+  .offset-lg-8 {
+    margin-left: 66.66666667%;
+  }
+
+  .offset-lg-9 {
+    margin-left: 75%;
+  }
+
+  .offset-lg-10 {
+    margin-left: 83.33333333%;
+  }
+
+  .offset-lg-11 {
+    margin-left: 91.66666667%;
+  }
+
+  .g-lg-0,
+.gx-lg-0 {
+    --bs-gutter-x: 0;
+  }
+
+  .g-lg-0,
+.gy-lg-0 {
+    --bs-gutter-y: 0;
+  }
+
+  .g-lg-1,
+.gx-lg-1 {
+    --bs-gutter-x: 0.25rem;
+  }
+
+  .g-lg-1,
+.gy-lg-1 {
+    --bs-gutter-y: 0.25rem;
+  }
+
+  .g-lg-2,
+.gx-lg-2 {
+    --bs-gutter-x: 0.5rem;
+  }
+
+  .g-lg-2,
+.gy-lg-2 {
+    --bs-gutter-y: 0.5rem;
+  }
+
+  .g-lg-3,
+.gx-lg-3 {
+    --bs-gutter-x: 1rem;
+  }
+
+  .g-lg-3,
+.gy-lg-3 {
+    --bs-gutter-y: 1rem;
+  }
+
+  .g-lg-4,
+.gx-lg-4 {
+    --bs-gutter-x: 1.5rem;
+  }
+
+  .g-lg-4,
+.gy-lg-4 {
+    --bs-gutter-y: 1.5rem;
+  }
+
+  .g-lg-5,
+.gx-lg-5 {
+    --bs-gutter-x: 3rem;
+  }
+
+  .g-lg-5,
+.gy-lg-5 {
+    --bs-gutter-y: 3rem;
+  }
+}
+@media (min-width: 1200px) {
+  .col-xl {
+    flex: 1 0 0%;
+  }
+
+  .row-cols-xl-auto > * {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .row-cols-xl-1 > * {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .row-cols-xl-2 > * {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .row-cols-xl-3 > * {
+    flex: 0 0 auto;
+    width: 33.3333333333%;
+  }
+
+  .row-cols-xl-4 > * {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .row-cols-xl-5 > * {
+    flex: 0 0 auto;
+    width: 20%;
+  }
+
+  .row-cols-xl-6 > * {
+    flex: 0 0 auto;
+    width: 16.6666666667%;
+  }
+
+  .col-xl-auto {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .col-xl-1 {
+    flex: 0 0 auto;
+    width: 8.33333333%;
+  }
+
+  .col-xl-2 {
+    flex: 0 0 auto;
+    width: 16.66666667%;
+  }
+
+  .col-xl-3 {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .col-xl-4 {
+    flex: 0 0 auto;
+    width: 33.33333333%;
+  }
+
+  .col-xl-5 {
+    flex: 0 0 auto;
+    width: 41.66666667%;
+  }
+
+  .col-xl-6 {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .col-xl-7 {
+    flex: 0 0 auto;
+    width: 58.33333333%;
+  }
+
+  .col-xl-8 {
+    flex: 0 0 auto;
+    width: 66.66666667%;
+  }
+
+  .col-xl-9 {
+    flex: 0 0 auto;
+    width: 75%;
+  }
+
+  .col-xl-10 {
+    flex: 0 0 auto;
+    width: 83.33333333%;
+  }
+
+  .col-xl-11 {
+    flex: 0 0 auto;
+    width: 91.66666667%;
+  }
+
+  .col-xl-12 {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .offset-xl-0 {
+    margin-left: 0;
+  }
+
+  .offset-xl-1 {
+    margin-left: 8.33333333%;
+  }
+
+  .offset-xl-2 {
+    margin-left: 16.66666667%;
+  }
+
+  .offset-xl-3 {
+    margin-left: 25%;
+  }
+
+  .offset-xl-4 {
+    margin-left: 33.33333333%;
+  }
+
+  .offset-xl-5 {
+    margin-left: 41.66666667%;
+  }
+
+  .offset-xl-6 {
+    margin-left: 50%;
+  }
+
+  .offset-xl-7 {
+    margin-left: 58.33333333%;
+  }
+
+  .offset-xl-8 {
+    margin-left: 66.66666667%;
+  }
+
+  .offset-xl-9 {
+    margin-left: 75%;
+  }
+
+  .offset-xl-10 {
+    margin-left: 83.33333333%;
+  }
+
+  .offset-xl-11 {
+    margin-left: 91.66666667%;
+  }
+
+  .g-xl-0,
+.gx-xl-0 {
+    --bs-gutter-x: 0;
+  }
+
+  .g-xl-0,
+.gy-xl-0 {
+    --bs-gutter-y: 0;
+  }
+
+  .g-xl-1,
+.gx-xl-1 {
+    --bs-gutter-x: 0.25rem;
+  }
+
+  .g-xl-1,
+.gy-xl-1 {
+    --bs-gutter-y: 0.25rem;
+  }
+
+  .g-xl-2,
+.gx-xl-2 {
+    --bs-gutter-x: 0.5rem;
+  }
+
+  .g-xl-2,
+.gy-xl-2 {
+    --bs-gutter-y: 0.5rem;
+  }
+
+  .g-xl-3,
+.gx-xl-3 {
+    --bs-gutter-x: 1rem;
+  }
+
+  .g-xl-3,
+.gy-xl-3 {
+    --bs-gutter-y: 1rem;
+  }
+
+  .g-xl-4,
+.gx-xl-4 {
+    --bs-gutter-x: 1.5rem;
+  }
+
+  .g-xl-4,
+.gy-xl-4 {
+    --bs-gutter-y: 1.5rem;
+  }
+
+  .g-xl-5,
+.gx-xl-5 {
+    --bs-gutter-x: 3rem;
+  }
+
+  .g-xl-5,
+.gy-xl-5 {
+    --bs-gutter-y: 3rem;
+  }
+}
+@media (min-width: 1400px) {
+  .col-xxl {
+    flex: 1 0 0%;
+  }
+
+  .row-cols-xxl-auto > * {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .row-cols-xxl-1 > * {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .row-cols-xxl-2 > * {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .row-cols-xxl-3 > * {
+    flex: 0 0 auto;
+    width: 33.3333333333%;
+  }
+
+  .row-cols-xxl-4 > * {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .row-cols-xxl-5 > * {
+    flex: 0 0 auto;
+    width: 20%;
+  }
+
+  .row-cols-xxl-6 > * {
+    flex: 0 0 auto;
+    width: 16.6666666667%;
+  }
+
+  .col-xxl-auto {
+    flex: 0 0 auto;
+    width: auto;
+  }
+
+  .col-xxl-1 {
+    flex: 0 0 auto;
+    width: 8.33333333%;
+  }
+
+  .col-xxl-2 {
+    flex: 0 0 auto;
+    width: 16.66666667%;
+  }
+
+  .col-xxl-3 {
+    flex: 0 0 auto;
+    width: 25%;
+  }
+
+  .col-xxl-4 {
+    flex: 0 0 auto;
+    width: 33.33333333%;
+  }
+
+  .col-xxl-5 {
+    flex: 0 0 auto;
+    width: 41.66666667%;
+  }
+
+  .col-xxl-6 {
+    flex: 0 0 auto;
+    width: 50%;
+  }
+
+  .col-xxl-7 {
+    flex: 0 0 auto;
+    width: 58.33333333%;
+  }
+
+  .col-xxl-8 {
+    flex: 0 0 auto;
+    width: 66.66666667%;
+  }
+
+  .col-xxl-9 {
+    flex: 0 0 auto;
+    width: 75%;
+  }
+
+  .col-xxl-10 {
+    flex: 0 0 auto;
+    width: 83.33333333%;
+  }
+
+  .col-xxl-11 {
+    flex: 0 0 auto;
+    width: 91.66666667%;
+  }
+
+  .col-xxl-12 {
+    flex: 0 0 auto;
+    width: 100%;
+  }
+
+  .offset-xxl-0 {
+    margin-left: 0;
+  }
+
+  .offset-xxl-1 {
+    margin-left: 8.33333333%;
+  }
+
+  .offset-xxl-2 {
+    margin-left: 16.66666667%;
+  }
+
+  .offset-xxl-3 {
+    margin-left: 25%;
+  }
+
+  .offset-xxl-4 {
+    margin-left: 33.33333333%;
+  }
+
+  .offset-xxl-5 {
+    margin-left: 41.66666667%;
+  }
+
+  .offset-xxl-6 {
+    margin-left: 50%;
+  }
+
+  .offset-xxl-7 {
+    margin-left: 58.33333333%;
+  }
+
+  .offset-xxl-8 {
+    margin-left: 66.66666667%;
+  }
+
+  .offset-xxl-9 {
+    margin-left: 75%;
+  }
+
+  .offset-xxl-10 {
+    margin-left: 83.33333333%;
+  }
+
+  .offset-xxl-11 {
+    margin-left: 91.66666667%;
+  }
+
+  .g-xxl-0,
+.gx-xxl-0 {
+    --bs-gutter-x: 0;
+  }
+
+  .g-xxl-0,
+.gy-xxl-0 {
+    --bs-gutter-y: 0;
+  }
+
+  .g-xxl-1,
+.gx-xxl-1 {
+    --bs-gutter-x: 0.25rem;
+  }
+
+  .g-xxl-1,
+.gy-xxl-1 {
+    --bs-gutter-y: 0.25rem;
+  }
+
+  .g-xxl-2,
+.gx-xxl-2 {
+    --bs-gutter-x: 0.5rem;
+  }
+
+  .g-xxl-2,
+.gy-xxl-2 {
+    --bs-gutter-y: 0.5rem;
+  }
+
+  .g-xxl-3,
+.gx-xxl-3 {
+    --bs-gutter-x: 1rem;
+  }
+
+  .g-xxl-3,
+.gy-xxl-3 {
+    --bs-gutter-y: 1rem;
+  }
+
+  .g-xxl-4,
+.gx-xxl-4 {
+    --bs-gutter-x: 1.5rem;
+  }
+
+  .g-xxl-4,
+.gy-xxl-4 {
+    --bs-gutter-y: 1.5rem;
+  }
+
+  .g-xxl-5,
+.gx-xxl-5 {
+    --bs-gutter-x: 3rem;
+  }
+
+  .g-xxl-5,
+.gy-xxl-5 {
+    --bs-gutter-y: 3rem;
+  }
+}
+.table {
+  --bs-table-bg: transparent;
+  --bs-table-accent-bg: transparent;
+  --bs-table-striped-color: #212529;
+  --bs-table-striped-bg: rgba(0, 0, 0, 0.05);
+  --bs-table-active-color: #212529;
+  --bs-table-active-bg: rgba(0, 0, 0, 0.1);
+  --bs-table-hover-color: #212529;
+  --bs-table-hover-bg: rgba(0, 0, 0, 0.075);
+  width: 100%;
+  margin-bottom: 1rem;
+  color: #212529;
+  vertical-align: top;
+  border-color: #dee2e6;
+}
+.table > :not(caption) > * > * {
+  padding: 0.5rem 0.5rem;
+  background-color: var(--bs-table-bg);
+  border-bottom-width: 1px;
+  box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
+}
+.table > tbody {
+  vertical-align: inherit;
+}
+.table > thead {
+  vertical-align: bottom;
+}
+.table > :not(:first-child) {
+  border-top: 2px solid currentColor;
+}
+
+.caption-top {
+  caption-side: top;
+}
+
+.table-sm > :not(caption) > * > * {
+  padding: 0.25rem 0.25rem;
+}
+
+.table-bordered > :not(caption) > * {
+  border-width: 1px 0;
+}
+.table-bordered > :not(caption) > * > * {
+  border-width: 0 1px;
+}
+
+.table-borderless > :not(caption) > * > * {
+  border-bottom-width: 0;
+}
+.table-borderless > :not(:first-child) {
+  border-top-width: 0;
+}
+
+.table-striped > tbody > tr:nth-of-type(odd) > * {
+  --bs-table-accent-bg: var(--bs-table-striped-bg);
+  color: var(--bs-table-striped-color);
+}
+
+.table-active {
+  --bs-table-accent-bg: var(--bs-table-active-bg);
+  color: var(--bs-table-active-color);
+}
+
+.table-hover > tbody > tr:hover > * {
+  --bs-table-accent-bg: var(--bs-table-hover-bg);
+  color: var(--bs-table-hover-color);
+}
+
+.table-primary {
+  --bs-table-bg: #cfe2ff;
+  --bs-table-striped-bg: #c5d7f2;
+  --bs-table-striped-color: #000;
+  --bs-table-active-bg: #bacbe6;
+  --bs-table-active-color: #000;
+  --bs-table-hover-bg: #bfd1ec;
+  --bs-table-hover-color: #000;
+  color: #000;
+  border-color: #bacbe6;
+}
+
+.table-secondary {
+  --bs-table-bg: #e2e3e5;
+  --bs-table-striped-bg: #d7d8da;
+  --bs-table-striped-color: #000;
+  --bs-table-active-bg: #cbccce;
+  --bs-table-active-color: #000;
+  --bs-table-hover-bg: #d1d2d4;
+  --bs-table-hover-color: #000;
+  color: #000;
+  border-color: #cbccce;
+}
+
+.table-success {
+  --bs-table-bg: #d1e7dd;
+  --bs-table-striped-bg: #c7dbd2;
+  --bs-table-striped-color: #000;
+  --bs-table-active-bg: #bcd0c7;
+  --bs-table-active-color: #000;
+  --bs-table-hover-bg: #c1d6cc;
+  --bs-table-hover-color: #000;
+  color: #000;
+  border-color: #bcd0c7;
+}
+
+.table-info {
+  --bs-table-bg: #cff4fc;
+  --bs-table-striped-bg: #c5e8ef;
+  --bs-table-striped-color: #000;
+  --bs-table-active-bg: #badce3;
+  --bs-table-active-color: #000;
+  --bs-table-hover-bg: #bfe2e9;
+  --bs-table-hover-color: #000;
+  color: #000;
+  border-color: #badce3;
+}
+
+.table-warning {
+  --bs-table-bg: #fff3cd;
+  --bs-table-striped-bg: #f2e7c3;
+  --bs-table-striped-color: #000;
+  --bs-table-active-bg: #e6dbb9;
+  --bs-table-active-color: #000;
+  --bs-table-hover-bg: #ece1be;
+  --bs-table-hover-color: #000;
+  color: #000;
+  border-color: #e6dbb9;
+}
+
+.table-danger {
+  --bs-table-bg: #f8d7da;
+  --bs-table-striped-bg: #eccccf;
+  --bs-table-striped-color: #000;
+  --bs-table-active-bg: #dfc2c4;
+  --bs-table-active-color: #000;
+  --bs-table-hover-bg: #e5c7ca;
+  --bs-table-hover-color: #000;
+  color: #000;
+  border-color: #dfc2c4;
+}
+
+.table-light {
+  --bs-table-bg: #f8f9fa;
+  --bs-table-striped-bg: #ecedee;
+  --bs-table-striped-color: #000;
+  --bs-table-active-bg: #dfe0e1;
+  --bs-table-active-color: #000;
+  --bs-table-hover-bg: #e5e6e7;
+  --bs-table-hover-color: #000;
+  color: #000;
+  border-color: #dfe0e1;
+}
+
+.table-dark {
+  --bs-table-bg: #212529;
+  --bs-table-striped-bg: #2c3034;
+  --bs-table-striped-color: #fff;
+  --bs-table-active-bg: #373b3e;
+  --bs-table-active-color: #fff;
+  --bs-table-hover-bg: #323539;
+  --bs-table-hover-color: #fff;
+  color: #fff;
+  border-color: #373b3e;
+}
+
+.table-responsive {
+  overflow-x: auto;
+  -webkit-overflow-scrolling: touch;
+}
+
+@media (max-width: 575.98px) {
+  .table-responsive-sm {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+}
+@media (max-width: 767.98px) {
+  .table-responsive-md {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+}
+@media (max-width: 991.98px) {
+  .table-responsive-lg {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+}
+@media (max-width: 1199.98px) {
+  .table-responsive-xl {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+}
+@media (max-width: 1399.98px) {
+  .table-responsive-xxl {
+    overflow-x: auto;
+    -webkit-overflow-scrolling: touch;
+  }
+}
+.form-label {
+  margin-bottom: 0.5rem;
+}
+
+.col-form-label {
+  padding-top: calc(0.375rem + 1px);
+  padding-bottom: calc(0.375rem + 1px);
+  margin-bottom: 0;
+  font-size: inherit;
+  line-height: 1.5;
+}
+
+.col-form-label-lg {
+  padding-top: calc(0.5rem + 1px);
+  padding-bottom: calc(0.5rem + 1px);
+  font-size: 1.25rem;
+}
+
+.col-form-label-sm {
+  padding-top: calc(0.25rem + 1px);
+  padding-bottom: calc(0.25rem + 1px);
+  font-size: 0.875rem;
+}
+
+.form-text {
+  margin-top: 0.25rem;
+  font-size: 0.875em;
+  color: #6c757d;
+}
+
+.form-control {
+  display: block;
+  width: 100%;
+  padding: 0.375rem 0.75rem;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #212529;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid #ced4da;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  border-radius: 0.25rem;
+  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-control {
+    transition: none;
+  }
+}
+.form-control[type=file] {
+  overflow: hidden;
+}
+.form-control[type=file]:not(:disabled):not([readonly]) {
+  cursor: pointer;
+}
+.form-control:focus {
+  color: #212529;
+  background-color: #fff;
+  border-color: #86b7fe;
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+.form-control::-webkit-date-and-time-value {
+  height: 1.5em;
+}
+.form-control::-moz-placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+.form-control::placeholder {
+  color: #6c757d;
+  opacity: 1;
+}
+.form-control:disabled, .form-control[readonly] {
+  background-color: #e9ecef;
+  opacity: 1;
+}
+.form-control::-webkit-file-upload-button {
+  padding: 0.375rem 0.75rem;
+  margin: -0.375rem -0.75rem;
+  -webkit-margin-end: 0.75rem;
+  margin-inline-end: 0.75rem;
+  color: #212529;
+  background-color: #e9ecef;
+  pointer-events: none;
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+  border-inline-end-width: 1px;
+  border-radius: 0;
+  -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+.form-control::file-selector-button {
+  padding: 0.375rem 0.75rem;
+  margin: -0.375rem -0.75rem;
+  -webkit-margin-end: 0.75rem;
+  margin-inline-end: 0.75rem;
+  color: #212529;
+  background-color: #e9ecef;
+  pointer-events: none;
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+  border-inline-end-width: 1px;
+  border-radius: 0;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-control::-webkit-file-upload-button {
+    -webkit-transition: none;
+    transition: none;
+  }
+  .form-control::file-selector-button {
+    transition: none;
+  }
+}
+.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {
+  background-color: #dde0e3;
+}
+.form-control:hover:not(:disabled):not([readonly])::file-selector-button {
+  background-color: #dde0e3;
+}
+.form-control::-webkit-file-upload-button {
+  padding: 0.375rem 0.75rem;
+  margin: -0.375rem -0.75rem;
+  -webkit-margin-end: 0.75rem;
+  margin-inline-end: 0.75rem;
+  color: #212529;
+  background-color: #e9ecef;
+  pointer-events: none;
+  border-color: inherit;
+  border-style: solid;
+  border-width: 0;
+  border-inline-end-width: 1px;
+  border-radius: 0;
+  -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-control::-webkit-file-upload-button {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.form-control:hover:not(:disabled):not([readonly])::-webkit-file-upload-button {
+  background-color: #dde0e3;
+}
+
+.form-control-plaintext {
+  display: block;
+  width: 100%;
+  padding: 0.375rem 0;
+  margin-bottom: 0;
+  line-height: 1.5;
+  color: #212529;
+  background-color: transparent;
+  border: solid transparent;
+  border-width: 1px 0;
+}
+.form-control-plaintext.form-control-sm, .form-control-plaintext.form-control-lg {
+  padding-right: 0;
+  padding-left: 0;
+}
+
+.form-control-sm {
+  min-height: calc(1.5em + 0.5rem + 2px);
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  border-radius: 0.2rem;
+}
+.form-control-sm::-webkit-file-upload-button {
+  padding: 0.25rem 0.5rem;
+  margin: -0.25rem -0.5rem;
+  -webkit-margin-end: 0.5rem;
+  margin-inline-end: 0.5rem;
+}
+.form-control-sm::file-selector-button {
+  padding: 0.25rem 0.5rem;
+  margin: -0.25rem -0.5rem;
+  -webkit-margin-end: 0.5rem;
+  margin-inline-end: 0.5rem;
+}
+.form-control-sm::-webkit-file-upload-button {
+  padding: 0.25rem 0.5rem;
+  margin: -0.25rem -0.5rem;
+  -webkit-margin-end: 0.5rem;
+  margin-inline-end: 0.5rem;
+}
+
+.form-control-lg {
+  min-height: calc(1.5em + 1rem + 2px);
+  padding: 0.5rem 1rem;
+  font-size: 1.25rem;
+  border-radius: 0.3rem;
+}
+.form-control-lg::-webkit-file-upload-button {
+  padding: 0.5rem 1rem;
+  margin: -0.5rem -1rem;
+  -webkit-margin-end: 1rem;
+  margin-inline-end: 1rem;
+}
+.form-control-lg::file-selector-button {
+  padding: 0.5rem 1rem;
+  margin: -0.5rem -1rem;
+  -webkit-margin-end: 1rem;
+  margin-inline-end: 1rem;
+}
+.form-control-lg::-webkit-file-upload-button {
+  padding: 0.5rem 1rem;
+  margin: -0.5rem -1rem;
+  -webkit-margin-end: 1rem;
+  margin-inline-end: 1rem;
+}
+
+textarea.form-control {
+  min-height: calc(1.5em + 0.75rem + 2px);
+}
+textarea.form-control-sm {
+  min-height: calc(1.5em + 0.5rem + 2px);
+}
+textarea.form-control-lg {
+  min-height: calc(1.5em + 1rem + 2px);
+}
+
+.form-control-color {
+  width: 3rem;
+  height: auto;
+  padding: 0.375rem;
+}
+.form-control-color:not(:disabled):not([readonly]) {
+  cursor: pointer;
+}
+.form-control-color::-moz-color-swatch {
+  height: 1.5em;
+  border-radius: 0.25rem;
+}
+.form-control-color::-webkit-color-swatch {
+  height: 1.5em;
+  border-radius: 0.25rem;
+}
+
+.form-select {
+  display: block;
+  width: 100%;
+  padding: 0.375rem 2.25rem 0.375rem 0.75rem;
+  -moz-padding-start: calc(0.75rem - 3px);
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #212529;
+  background-color: #fff;
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right 0.75rem center;
+  background-size: 16px 12px;
+  border: 1px solid #ced4da;
+  border-radius: 0.25rem;
+  transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-select {
+    transition: none;
+  }
+}
+.form-select:focus {
+  border-color: #86b7fe;
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+.form-select[multiple], .form-select[size]:not([size="1"]) {
+  padding-right: 0.75rem;
+  background-image: none;
+}
+.form-select:disabled {
+  background-color: #e9ecef;
+}
+.form-select:-moz-focusring {
+  color: transparent;
+  text-shadow: 0 0 0 #212529;
+}
+
+.form-select-sm {
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
+  padding-left: 0.5rem;
+  font-size: 0.875rem;
+  border-radius: 0.2rem;
+}
+
+.form-select-lg {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  padding-left: 1rem;
+  font-size: 1.25rem;
+  border-radius: 0.3rem;
+}
+
+.form-check {
+  display: block;
+  min-height: 1.5rem;
+  padding-left: 1.5em;
+  margin-bottom: 0.125rem;
+}
+.form-check .form-check-input {
+  float: left;
+  margin-left: -1.5em;
+}
+
+.form-check-input {
+  width: 1em;
+  height: 1em;
+  margin-top: 0.25em;
+  vertical-align: top;
+  background-color: #fff;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: contain;
+  border: 1px solid rgba(0, 0, 0, 0.25);
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+  -webkit-print-color-adjust: exact;
+  color-adjust: exact;
+}
+.form-check-input[type=checkbox] {
+  border-radius: 0.25em;
+}
+.form-check-input[type=radio] {
+  border-radius: 50%;
+}
+.form-check-input:active {
+  filter: brightness(90%);
+}
+.form-check-input:focus {
+  border-color: #86b7fe;
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+.form-check-input:checked {
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+}
+.form-check-input:checked[type=checkbox] {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3l6-6'/%3e%3c/svg%3e");
+}
+.form-check-input:checked[type=radio] {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
+}
+.form-check-input[type=checkbox]:indeterminate {
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
+}
+.form-check-input:disabled {
+  pointer-events: none;
+  filter: none;
+  opacity: 0.5;
+}
+.form-check-input[disabled] ~ .form-check-label, .form-check-input:disabled ~ .form-check-label {
+  opacity: 0.5;
+}
+
+.form-switch {
+  padding-left: 2.5em;
+}
+.form-switch .form-check-input {
+  width: 2em;
+  margin-left: -2.5em;
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
+  background-position: left center;
+  border-radius: 2em;
+  transition: background-position 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-switch .form-check-input {
+    transition: none;
+  }
+}
+.form-switch .form-check-input:focus {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%2386b7fe'/%3e%3c/svg%3e");
+}
+.form-switch .form-check-input:checked {
+  background-position: right center;
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
+}
+
+.form-check-inline {
+  display: inline-block;
+  margin-right: 1rem;
+}
+
+.btn-check {
+  position: absolute;
+  clip: rect(0, 0, 0, 0);
+  pointer-events: none;
+}
+.btn-check[disabled] + .btn, .btn-check:disabled + .btn {
+  pointer-events: none;
+  filter: none;
+  opacity: 0.65;
+}
+
+.form-range {
+  width: 100%;
+  height: 1.5rem;
+  padding: 0;
+  background-color: transparent;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  appearance: none;
+}
+.form-range:focus {
+  outline: 0;
+}
+.form-range:focus::-webkit-slider-thumb {
+  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+.form-range:focus::-moz-range-thumb {
+  box-shadow: 0 0 0 1px #fff, 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+.form-range::-moz-focus-outer {
+  border: 0;
+}
+.form-range::-webkit-slider-thumb {
+  width: 1rem;
+  height: 1rem;
+  margin-top: -0.25rem;
+  background-color: #0d6efd;
+  border: 0;
+  border-radius: 1rem;
+  -webkit-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  -webkit-appearance: none;
+  appearance: none;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-range::-webkit-slider-thumb {
+    -webkit-transition: none;
+    transition: none;
+  }
+}
+.form-range::-webkit-slider-thumb:active {
+  background-color: #b6d4fe;
+}
+.form-range::-webkit-slider-runnable-track {
+  width: 100%;
+  height: 0.5rem;
+  color: transparent;
+  cursor: pointer;
+  background-color: #dee2e6;
+  border-color: transparent;
+  border-radius: 1rem;
+}
+.form-range::-moz-range-thumb {
+  width: 1rem;
+  height: 1rem;
+  background-color: #0d6efd;
+  border: 0;
+  border-radius: 1rem;
+  -moz-transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+  -moz-appearance: none;
+  appearance: none;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-range::-moz-range-thumb {
+    -moz-transition: none;
+    transition: none;
+  }
+}
+.form-range::-moz-range-thumb:active {
+  background-color: #b6d4fe;
+}
+.form-range::-moz-range-track {
+  width: 100%;
+  height: 0.5rem;
+  color: transparent;
+  cursor: pointer;
+  background-color: #dee2e6;
+  border-color: transparent;
+  border-radius: 1rem;
+}
+.form-range:disabled {
+  pointer-events: none;
+}
+.form-range:disabled::-webkit-slider-thumb {
+  background-color: #adb5bd;
+}
+.form-range:disabled::-moz-range-thumb {
+  background-color: #adb5bd;
+}
+
+.form-floating {
+  position: relative;
+}
+.form-floating > .form-control,
+.form-floating > .form-select {
+  height: calc(3.5rem + 2px);
+  line-height: 1.25;
+}
+.form-floating > label {
+  position: absolute;
+  top: 0;
+  left: 0;
+  height: 100%;
+  padding: 1rem 0.75rem;
+  pointer-events: none;
+  border: 1px solid transparent;
+  transform-origin: 0 0;
+  transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .form-floating > label {
+    transition: none;
+  }
+}
+.form-floating > .form-control {
+  padding: 1rem 0.75rem;
+}
+.form-floating > .form-control::-moz-placeholder {
+  color: transparent;
+}
+.form-floating > .form-control::placeholder {
+  color: transparent;
+}
+.form-floating > .form-control:not(:-moz-placeholder-shown) {
+  padding-top: 1.625rem;
+  padding-bottom: 0.625rem;
+}
+.form-floating > .form-control:focus, .form-floating > .form-control:not(:placeholder-shown) {
+  padding-top: 1.625rem;
+  padding-bottom: 0.625rem;
+}
+.form-floating > .form-control:-webkit-autofill {
+  padding-top: 1.625rem;
+  padding-bottom: 0.625rem;
+}
+.form-floating > .form-select {
+  padding-top: 1.625rem;
+  padding-bottom: 0.625rem;
+}
+.form-floating > .form-control:not(:-moz-placeholder-shown) ~ label {
+  opacity: 0.65;
+  transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
+}
+.form-floating > .form-control:focus ~ label,
+.form-floating > .form-control:not(:placeholder-shown) ~ label,
+.form-floating > .form-select ~ label {
+  opacity: 0.65;
+  transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
+}
+.form-floating > .form-control:-webkit-autofill ~ label {
+  opacity: 0.65;
+  transform: scale(0.85) translateY(-0.5rem) translateX(0.15rem);
+}
+
+.input-group {
+  position: relative;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: stretch;
+  width: 100%;
+}
+.input-group > .form-control,
+.input-group > .form-select {
+  position: relative;
+  flex: 1 1 auto;
+  width: 1%;
+  min-width: 0;
+}
+.input-group > .form-control:focus,
+.input-group > .form-select:focus {
+  z-index: 3;
+}
+.input-group .btn {
+  position: relative;
+  z-index: 2;
+}
+.input-group .btn:focus {
+  z-index: 3;
+}
+
+.input-group-text {
+  display: flex;
+  align-items: center;
+  padding: 0.375rem 0.75rem;
+  font-size: 1rem;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #212529;
+  text-align: center;
+  white-space: nowrap;
+  background-color: #e9ecef;
+  border: 1px solid #ced4da;
+  border-radius: 0.25rem;
+}
+
+.input-group-lg > .form-control,
+.input-group-lg > .form-select,
+.input-group-lg > .input-group-text,
+.input-group-lg > .btn {
+  padding: 0.5rem 1rem;
+  font-size: 1.25rem;
+  border-radius: 0.3rem;
+}
+
+.input-group-sm > .form-control,
+.input-group-sm > .form-select,
+.input-group-sm > .input-group-text,
+.input-group-sm > .btn {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  border-radius: 0.2rem;
+}
+
+.input-group-lg > .form-select,
+.input-group-sm > .form-select {
+  padding-right: 3rem;
+}
+
+.input-group:not(.has-validation) > :not(:last-child):not(.dropdown-toggle):not(.dropdown-menu),
+.input-group:not(.has-validation) > .dropdown-toggle:nth-last-child(n+3) {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.input-group.has-validation > :nth-last-child(n+3):not(.dropdown-toggle):not(.dropdown-menu),
+.input-group.has-validation > .dropdown-toggle:nth-last-child(n+4) {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
+  margin-left: -1px;
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.valid-feedback {
+  display: none;
+  width: 100%;
+  margin-top: 0.25rem;
+  font-size: 0.875em;
+  color: #198754;
+}
+
+.valid-tooltip {
+  position: absolute;
+  top: 100%;
+  z-index: 5;
+  display: none;
+  max-width: 100%;
+  padding: 0.25rem 0.5rem;
+  margin-top: 0.1rem;
+  font-size: 0.875rem;
+  color: #fff;
+  background-color: rgba(25, 135, 84, 0.9);
+  border-radius: 0.25rem;
+}
+
+.was-validated :valid ~ .valid-feedback,
+.was-validated :valid ~ .valid-tooltip,
+.is-valid ~ .valid-feedback,
+.is-valid ~ .valid-tooltip {
+  display: block;
+}
+
+.was-validated .form-control:valid, .form-control.is-valid {
+  border-color: #198754;
+  padding-right: calc(1.5em + 0.75rem);
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right calc(0.375em + 0.1875rem) center;
+  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .form-control:valid:focus, .form-control.is-valid:focus {
+  border-color: #198754;
+  box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.25);
+}
+
+.was-validated textarea.form-control:valid, textarea.form-control.is-valid {
+  padding-right: calc(1.5em + 0.75rem);
+  background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
+}
+
+.was-validated .form-select:valid, .form-select.is-valid {
+  border-color: #198754;
+}
+.was-validated .form-select:valid:not([multiple]):not([size]), .was-validated .form-select:valid:not([multiple])[size="1"], .form-select.is-valid:not([multiple]):not([size]), .form-select.is-valid:not([multiple])[size="1"] {
+  padding-right: 4.125rem;
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
+  background-position: right 0.75rem center, center right 2.25rem;
+  background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .form-select:valid:focus, .form-select.is-valid:focus {
+  border-color: #198754;
+  box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.25);
+}
+
+.was-validated .form-check-input:valid, .form-check-input.is-valid {
+  border-color: #198754;
+}
+.was-validated .form-check-input:valid:checked, .form-check-input.is-valid:checked {
+  background-color: #198754;
+}
+.was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus {
+  box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.25);
+}
+.was-validated .form-check-input:valid ~ .form-check-label, .form-check-input.is-valid ~ .form-check-label {
+  color: #198754;
+}
+
+.form-check-inline .form-check-input ~ .valid-feedback {
+  margin-left: 0.5em;
+}
+
+.was-validated .input-group .form-control:valid, .input-group .form-control.is-valid,
+.was-validated .input-group .form-select:valid,
+.input-group .form-select.is-valid {
+  z-index: 1;
+}
+.was-validated .input-group .form-control:valid:focus, .input-group .form-control.is-valid:focus,
+.was-validated .input-group .form-select:valid:focus,
+.input-group .form-select.is-valid:focus {
+  z-index: 3;
+}
+
+.invalid-feedback {
+  display: none;
+  width: 100%;
+  margin-top: 0.25rem;
+  font-size: 0.875em;
+  color: #dc3545;
+}
+
+.invalid-tooltip {
+  position: absolute;
+  top: 100%;
+  z-index: 5;
+  display: none;
+  max-width: 100%;
+  padding: 0.25rem 0.5rem;
+  margin-top: 0.1rem;
+  font-size: 0.875rem;
+  color: #fff;
+  background-color: rgba(220, 53, 69, 0.9);
+  border-radius: 0.25rem;
+}
+
+.was-validated :invalid ~ .invalid-feedback,
+.was-validated :invalid ~ .invalid-tooltip,
+.is-invalid ~ .invalid-feedback,
+.is-invalid ~ .invalid-tooltip {
+  display: block;
+}
+
+.was-validated .form-control:invalid, .form-control.is-invalid {
+  border-color: #dc3545;
+  padding-right: calc(1.5em + 0.75rem);
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-position: right calc(0.375em + 0.1875rem) center;
+  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .form-control:invalid:focus, .form-control.is-invalid:focus {
+  border-color: #dc3545;
+  box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.was-validated textarea.form-control:invalid, textarea.form-control.is-invalid {
+  padding-right: calc(1.5em + 0.75rem);
+  background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
+}
+
+.was-validated .form-select:invalid, .form-select.is-invalid {
+  border-color: #dc3545;
+}
+.was-validated .form-select:invalid:not([multiple]):not([size]), .was-validated .form-select:invalid:not([multiple])[size="1"], .form-select.is-invalid:not([multiple]):not([size]), .form-select.is-invalid:not([multiple])[size="1"] {
+  padding-right: 4.125rem;
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e"), url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
+  background-position: right 0.75rem center, center right 2.25rem;
+  background-size: 16px 12px, calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
+}
+.was-validated .form-select:invalid:focus, .form-select.is-invalid:focus {
+  border-color: #dc3545;
+  box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+
+.was-validated .form-check-input:invalid, .form-check-input.is-invalid {
+  border-color: #dc3545;
+}
+.was-validated .form-check-input:invalid:checked, .form-check-input.is-invalid:checked {
+  background-color: #dc3545;
+}
+.was-validated .form-check-input:invalid:focus, .form-check-input.is-invalid:focus {
+  box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
+}
+.was-validated .form-check-input:invalid ~ .form-check-label, .form-check-input.is-invalid ~ .form-check-label {
+  color: #dc3545;
+}
+
+.form-check-inline .form-check-input ~ .invalid-feedback {
+  margin-left: 0.5em;
+}
+
+.was-validated .input-group .form-control:invalid, .input-group .form-control.is-invalid,
+.was-validated .input-group .form-select:invalid,
+.input-group .form-select.is-invalid {
+  z-index: 2;
+}
+.was-validated .input-group .form-control:invalid:focus, .input-group .form-control.is-invalid:focus,
+.was-validated .input-group .form-select:invalid:focus,
+.input-group .form-select.is-invalid:focus {
+  z-index: 3;
+}
+
+.btn {
+  display: inline-block;
+  font-weight: 400;
+  line-height: 1.5;
+  color: #212529;
+  text-align: center;
+  text-decoration: none;
+  vertical-align: middle;
+  cursor: pointer;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+  background-color: transparent;
+  border: 1px solid transparent;
+  padding: 0.375rem 0.75rem;
+  font-size: 1rem;
+  border-radius: 0.25rem;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .btn {
+    transition: none;
+  }
+}
+.btn:hover {
+  color: #212529;
+}
+.btn-check:focus + .btn, .btn:focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+.btn:disabled, .btn.disabled, fieldset:disabled .btn {
+  pointer-events: none;
+  opacity: 0.65;
+}
+
+.btn-primary {
+  color: #fff;
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+}
+.btn-primary:hover {
+  color: #fff;
+  background-color: #0b5ed7;
+  border-color: #0a58ca;
+}
+.btn-check:focus + .btn-primary, .btn-primary:focus {
+  color: #fff;
+  background-color: #0b5ed7;
+  border-color: #0a58ca;
+  box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
+}
+.btn-check:checked + .btn-primary, .btn-check:active + .btn-primary, .btn-primary:active, .btn-primary.active, .show > .btn-primary.dropdown-toggle {
+  color: #fff;
+  background-color: #0a58ca;
+  border-color: #0a53be;
+}
+.btn-check:checked + .btn-primary:focus, .btn-check:active + .btn-primary:focus, .btn-primary:active:focus, .btn-primary.active:focus, .show > .btn-primary.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(49, 132, 253, 0.5);
+}
+.btn-primary:disabled, .btn-primary.disabled {
+  color: #fff;
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+}
+
+.btn-secondary {
+  color: #fff;
+  background-color: #6c757d;
+  border-color: #6c757d;
+}
+.btn-secondary:hover {
+  color: #fff;
+  background-color: #5c636a;
+  border-color: #565e64;
+}
+.btn-check:focus + .btn-secondary, .btn-secondary:focus {
+  color: #fff;
+  background-color: #5c636a;
+  border-color: #565e64;
+  box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
+}
+.btn-check:checked + .btn-secondary, .btn-check:active + .btn-secondary, .btn-secondary:active, .btn-secondary.active, .show > .btn-secondary.dropdown-toggle {
+  color: #fff;
+  background-color: #565e64;
+  border-color: #51585e;
+}
+.btn-check:checked + .btn-secondary:focus, .btn-check:active + .btn-secondary:focus, .btn-secondary:active:focus, .btn-secondary.active:focus, .show > .btn-secondary.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(130, 138, 145, 0.5);
+}
+.btn-secondary:disabled, .btn-secondary.disabled {
+  color: #fff;
+  background-color: #6c757d;
+  border-color: #6c757d;
+}
+
+.btn-success {
+  color: #fff;
+  background-color: #198754;
+  border-color: #198754;
+}
+.btn-success:hover {
+  color: #fff;
+  background-color: #157347;
+  border-color: #146c43;
+}
+.btn-check:focus + .btn-success, .btn-success:focus {
+  color: #fff;
+  background-color: #157347;
+  border-color: #146c43;
+  box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
+}
+.btn-check:checked + .btn-success, .btn-check:active + .btn-success, .btn-success:active, .btn-success.active, .show > .btn-success.dropdown-toggle {
+  color: #fff;
+  background-color: #146c43;
+  border-color: #13653f;
+}
+.btn-check:checked + .btn-success:focus, .btn-check:active + .btn-success:focus, .btn-success:active:focus, .btn-success.active:focus, .show > .btn-success.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(60, 153, 110, 0.5);
+}
+.btn-success:disabled, .btn-success.disabled {
+  color: #fff;
+  background-color: #198754;
+  border-color: #198754;
+}
+
+.btn-info {
+  color: #000;
+  background-color: #0dcaf0;
+  border-color: #0dcaf0;
+}
+.btn-info:hover {
+  color: #000;
+  background-color: #31d2f2;
+  border-color: #25cff2;
+}
+.btn-check:focus + .btn-info, .btn-info:focus {
+  color: #000;
+  background-color: #31d2f2;
+  border-color: #25cff2;
+  box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
+}
+.btn-check:checked + .btn-info, .btn-check:active + .btn-info, .btn-info:active, .btn-info.active, .show > .btn-info.dropdown-toggle {
+  color: #000;
+  background-color: #3dd5f3;
+  border-color: #25cff2;
+}
+.btn-check:checked + .btn-info:focus, .btn-check:active + .btn-info:focus, .btn-info:active:focus, .btn-info.active:focus, .show > .btn-info.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(11, 172, 204, 0.5);
+}
+.btn-info:disabled, .btn-info.disabled {
+  color: #000;
+  background-color: #0dcaf0;
+  border-color: #0dcaf0;
+}
+
+.btn-warning {
+  color: #000;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-warning:hover {
+  color: #000;
+  background-color: #ffca2c;
+  border-color: #ffc720;
+}
+.btn-check:focus + .btn-warning, .btn-warning:focus {
+  color: #000;
+  background-color: #ffca2c;
+  border-color: #ffc720;
+  box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
+}
+.btn-check:checked + .btn-warning, .btn-check:active + .btn-warning, .btn-warning:active, .btn-warning.active, .show > .btn-warning.dropdown-toggle {
+  color: #000;
+  background-color: #ffcd39;
+  border-color: #ffc720;
+}
+.btn-check:checked + .btn-warning:focus, .btn-check:active + .btn-warning:focus, .btn-warning:active:focus, .btn-warning.active:focus, .show > .btn-warning.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(217, 164, 6, 0.5);
+}
+.btn-warning:disabled, .btn-warning.disabled {
+  color: #000;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+
+.btn-danger {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-danger:hover {
+  color: #fff;
+  background-color: #bb2d3b;
+  border-color: #b02a37;
+}
+.btn-check:focus + .btn-danger, .btn-danger:focus {
+  color: #fff;
+  background-color: #bb2d3b;
+  border-color: #b02a37;
+  box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
+}
+.btn-check:checked + .btn-danger, .btn-check:active + .btn-danger, .btn-danger:active, .btn-danger.active, .show > .btn-danger.dropdown-toggle {
+  color: #fff;
+  background-color: #b02a37;
+  border-color: #a52834;
+}
+.btn-check:checked + .btn-danger:focus, .btn-check:active + .btn-danger:focus, .btn-danger:active:focus, .btn-danger.active:focus, .show > .btn-danger.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(225, 83, 97, 0.5);
+}
+.btn-danger:disabled, .btn-danger.disabled {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+
+.btn-light {
+  color: #000;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-light:hover {
+  color: #000;
+  background-color: #f9fafb;
+  border-color: #f9fafb;
+}
+.btn-check:focus + .btn-light, .btn-light:focus {
+  color: #000;
+  background-color: #f9fafb;
+  border-color: #f9fafb;
+  box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
+}
+.btn-check:checked + .btn-light, .btn-check:active + .btn-light, .btn-light:active, .btn-light.active, .show > .btn-light.dropdown-toggle {
+  color: #000;
+  background-color: #f9fafb;
+  border-color: #f9fafb;
+}
+.btn-check:checked + .btn-light:focus, .btn-check:active + .btn-light:focus, .btn-light:active:focus, .btn-light.active:focus, .show > .btn-light.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(211, 212, 213, 0.5);
+}
+.btn-light:disabled, .btn-light.disabled {
+  color: #000;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+
+.btn-dark {
+  color: #fff;
+  background-color: #212529;
+  border-color: #212529;
+}
+.btn-dark:hover {
+  color: #fff;
+  background-color: #1c1f23;
+  border-color: #1a1e21;
+}
+.btn-check:focus + .btn-dark, .btn-dark:focus {
+  color: #fff;
+  background-color: #1c1f23;
+  border-color: #1a1e21;
+  box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5);
+}
+.btn-check:checked + .btn-dark, .btn-check:active + .btn-dark, .btn-dark:active, .btn-dark.active, .show > .btn-dark.dropdown-toggle {
+  color: #fff;
+  background-color: #1a1e21;
+  border-color: #191c1f;
+}
+.btn-check:checked + .btn-dark:focus, .btn-check:active + .btn-dark:focus, .btn-dark:active:focus, .btn-dark.active:focus, .show > .btn-dark.dropdown-toggle:focus {
+  box-shadow: 0 0 0 0.25rem rgba(66, 70, 73, 0.5);
+}
+.btn-dark:disabled, .btn-dark.disabled {
+  color: #fff;
+  background-color: #212529;
+  border-color: #212529;
+}
+
+.btn-outline-primary {
+  color: #0d6efd;
+  border-color: #0d6efd;
+}
+.btn-outline-primary:hover {
+  color: #fff;
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+}
+.btn-check:focus + .btn-outline-primary, .btn-outline-primary:focus {
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.5);
+}
+.btn-check:checked + .btn-outline-primary, .btn-check:active + .btn-outline-primary, .btn-outline-primary:active, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show {
+  color: #fff;
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+}
+.btn-check:checked + .btn-outline-primary:focus, .btn-check:active + .btn-outline-primary:focus, .btn-outline-primary:active:focus, .btn-outline-primary.active:focus, .btn-outline-primary.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.5);
+}
+.btn-outline-primary:disabled, .btn-outline-primary.disabled {
+  color: #0d6efd;
+  background-color: transparent;
+}
+
+.btn-outline-secondary {
+  color: #6c757d;
+  border-color: #6c757d;
+}
+.btn-outline-secondary:hover {
+  color: #fff;
+  background-color: #6c757d;
+  border-color: #6c757d;
+}
+.btn-check:focus + .btn-outline-secondary, .btn-outline-secondary:focus {
+  box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
+}
+.btn-check:checked + .btn-outline-secondary, .btn-check:active + .btn-outline-secondary, .btn-outline-secondary:active, .btn-outline-secondary.active, .btn-outline-secondary.dropdown-toggle.show {
+  color: #fff;
+  background-color: #6c757d;
+  border-color: #6c757d;
+}
+.btn-check:checked + .btn-outline-secondary:focus, .btn-check:active + .btn-outline-secondary:focus, .btn-outline-secondary:active:focus, .btn-outline-secondary.active:focus, .btn-outline-secondary.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(108, 117, 125, 0.5);
+}
+.btn-outline-secondary:disabled, .btn-outline-secondary.disabled {
+  color: #6c757d;
+  background-color: transparent;
+}
+
+.btn-outline-success {
+  color: #198754;
+  border-color: #198754;
+}
+.btn-outline-success:hover {
+  color: #fff;
+  background-color: #198754;
+  border-color: #198754;
+}
+.btn-check:focus + .btn-outline-success, .btn-outline-success:focus {
+  box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
+}
+.btn-check:checked + .btn-outline-success, .btn-check:active + .btn-outline-success, .btn-outline-success:active, .btn-outline-success.active, .btn-outline-success.dropdown-toggle.show {
+  color: #fff;
+  background-color: #198754;
+  border-color: #198754;
+}
+.btn-check:checked + .btn-outline-success:focus, .btn-check:active + .btn-outline-success:focus, .btn-outline-success:active:focus, .btn-outline-success.active:focus, .btn-outline-success.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(25, 135, 84, 0.5);
+}
+.btn-outline-success:disabled, .btn-outline-success.disabled {
+  color: #198754;
+  background-color: transparent;
+}
+
+.btn-outline-info {
+  color: #0dcaf0;
+  border-color: #0dcaf0;
+}
+.btn-outline-info:hover {
+  color: #000;
+  background-color: #0dcaf0;
+  border-color: #0dcaf0;
+}
+.btn-check:focus + .btn-outline-info, .btn-outline-info:focus {
+  box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
+}
+.btn-check:checked + .btn-outline-info, .btn-check:active + .btn-outline-info, .btn-outline-info:active, .btn-outline-info.active, .btn-outline-info.dropdown-toggle.show {
+  color: #000;
+  background-color: #0dcaf0;
+  border-color: #0dcaf0;
+}
+.btn-check:checked + .btn-outline-info:focus, .btn-check:active + .btn-outline-info:focus, .btn-outline-info:active:focus, .btn-outline-info.active:focus, .btn-outline-info.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(13, 202, 240, 0.5);
+}
+.btn-outline-info:disabled, .btn-outline-info.disabled {
+  color: #0dcaf0;
+  background-color: transparent;
+}
+
+.btn-outline-warning {
+  color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-outline-warning:hover {
+  color: #000;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-check:focus + .btn-outline-warning, .btn-outline-warning:focus {
+  box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
+}
+.btn-check:checked + .btn-outline-warning, .btn-check:active + .btn-outline-warning, .btn-outline-warning:active, .btn-outline-warning.active, .btn-outline-warning.dropdown-toggle.show {
+  color: #000;
+  background-color: #ffc107;
+  border-color: #ffc107;
+}
+.btn-check:checked + .btn-outline-warning:focus, .btn-check:active + .btn-outline-warning:focus, .btn-outline-warning:active:focus, .btn-outline-warning.active:focus, .btn-outline-warning.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(255, 193, 7, 0.5);
+}
+.btn-outline-warning:disabled, .btn-outline-warning.disabled {
+  color: #ffc107;
+  background-color: transparent;
+}
+
+.btn-outline-danger {
+  color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-outline-danger:hover {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-check:focus + .btn-outline-danger, .btn-outline-danger:focus {
+  box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
+}
+.btn-check:checked + .btn-outline-danger, .btn-check:active + .btn-outline-danger, .btn-outline-danger:active, .btn-outline-danger.active, .btn-outline-danger.dropdown-toggle.show {
+  color: #fff;
+  background-color: #dc3545;
+  border-color: #dc3545;
+}
+.btn-check:checked + .btn-outline-danger:focus, .btn-check:active + .btn-outline-danger:focus, .btn-outline-danger:active:focus, .btn-outline-danger.active:focus, .btn-outline-danger.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.5);
+}
+.btn-outline-danger:disabled, .btn-outline-danger.disabled {
+  color: #dc3545;
+  background-color: transparent;
+}
+
+.btn-outline-light {
+  color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-outline-light:hover {
+  color: #000;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-check:focus + .btn-outline-light, .btn-outline-light:focus {
+  box-shadow: 0 0 0 0.25rem rgba(248, 249, 250, 0.5);
+}
+.btn-check:checked + .btn-outline-light, .btn-check:active + .btn-outline-light, .btn-outline-light:active, .btn-outline-light.active, .btn-outline-light.dropdown-toggle.show {
+  color: #000;
+  background-color: #f8f9fa;
+  border-color: #f8f9fa;
+}
+.btn-check:checked + .btn-outline-light:focus, .btn-check:active + .btn-outline-light:focus, .btn-outline-light:active:focus, .btn-outline-light.active:focus, .btn-outline-light.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(248, 249, 250, 0.5);
+}
+.btn-outline-light:disabled, .btn-outline-light.disabled {
+  color: #f8f9fa;
+  background-color: transparent;
+}
+
+.btn-outline-dark {
+  color: #212529;
+  border-color: #212529;
+}
+.btn-outline-dark:hover {
+  color: #fff;
+  background-color: #212529;
+  border-color: #212529;
+}
+.btn-check:focus + .btn-outline-dark, .btn-outline-dark:focus {
+  box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
+}
+.btn-check:checked + .btn-outline-dark, .btn-check:active + .btn-outline-dark, .btn-outline-dark:active, .btn-outline-dark.active, .btn-outline-dark.dropdown-toggle.show {
+  color: #fff;
+  background-color: #212529;
+  border-color: #212529;
+}
+.btn-check:checked + .btn-outline-dark:focus, .btn-check:active + .btn-outline-dark:focus, .btn-outline-dark:active:focus, .btn-outline-dark.active:focus, .btn-outline-dark.dropdown-toggle.show:focus {
+  box-shadow: 0 0 0 0.25rem rgba(33, 37, 41, 0.5);
+}
+.btn-outline-dark:disabled, .btn-outline-dark.disabled {
+  color: #212529;
+  background-color: transparent;
+}
+
+.btn-link {
+  font-weight: 400;
+  color: #0d6efd;
+  text-decoration: underline;
+}
+.btn-link:hover {
+  color: #0a58ca;
+}
+.btn-link:disabled, .btn-link.disabled {
+  color: #6c757d;
+}
+
+.btn-lg, .btn-group-lg > .btn {
+  padding: 0.5rem 1rem;
+  font-size: 1.25rem;
+  border-radius: 0.3rem;
+}
+
+.btn-sm, .btn-group-sm > .btn {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+  border-radius: 0.2rem;
+}
+
+.fade {
+  transition: opacity 0.15s linear;
+}
+@media (prefers-reduced-motion: reduce) {
+  .fade {
+    transition: none;
+  }
+}
+.fade:not(.show) {
+  opacity: 0;
+}
+
+.collapse:not(.show) {
+  display: none;
+}
+
+.collapsing {
+  height: 0;
+  overflow: hidden;
+  transition: height 0.35s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .collapsing {
+    transition: none;
+  }
+}
+.collapsing.collapse-horizontal {
+  width: 0;
+  height: auto;
+  transition: width 0.35s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .collapsing.collapse-horizontal {
+    transition: none;
+  }
+}
+
+.dropup,
+.dropend,
+.dropdown,
+.dropstart {
+  position: relative;
+}
+
+.dropdown-toggle {
+  white-space: nowrap;
+}
+.dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0.3em solid;
+  border-right: 0.3em solid transparent;
+  border-bottom: 0;
+  border-left: 0.3em solid transparent;
+}
+.dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+
+.dropdown-menu {
+  position: absolute;
+  z-index: 1000;
+  display: none;
+  min-width: 10rem;
+  padding: 0.5rem 0;
+  margin: 0;
+  font-size: 1rem;
+  color: #212529;
+  text-align: left;
+  list-style: none;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.15);
+  border-radius: 0.25rem;
+}
+.dropdown-menu[data-bs-popper] {
+  top: 100%;
+  left: 0;
+  margin-top: 0.125rem;
+}
+
+.dropdown-menu-start {
+  --bs-position: start;
+}
+.dropdown-menu-start[data-bs-popper] {
+  right: auto;
+  left: 0;
+}
+
+.dropdown-menu-end {
+  --bs-position: end;
+}
+.dropdown-menu-end[data-bs-popper] {
+  right: 0;
+  left: auto;
+}
+
+@media (min-width: 576px) {
+  .dropdown-menu-sm-start {
+    --bs-position: start;
+  }
+  .dropdown-menu-sm-start[data-bs-popper] {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-sm-end {
+    --bs-position: end;
+  }
+  .dropdown-menu-sm-end[data-bs-popper] {
+    right: 0;
+    left: auto;
+  }
+}
+@media (min-width: 768px) {
+  .dropdown-menu-md-start {
+    --bs-position: start;
+  }
+  .dropdown-menu-md-start[data-bs-popper] {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-md-end {
+    --bs-position: end;
+  }
+  .dropdown-menu-md-end[data-bs-popper] {
+    right: 0;
+    left: auto;
+  }
+}
+@media (min-width: 992px) {
+  .dropdown-menu-lg-start {
+    --bs-position: start;
+  }
+  .dropdown-menu-lg-start[data-bs-popper] {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-lg-end {
+    --bs-position: end;
+  }
+  .dropdown-menu-lg-end[data-bs-popper] {
+    right: 0;
+    left: auto;
+  }
+}
+@media (min-width: 1200px) {
+  .dropdown-menu-xl-start {
+    --bs-position: start;
+  }
+  .dropdown-menu-xl-start[data-bs-popper] {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-xl-end {
+    --bs-position: end;
+  }
+  .dropdown-menu-xl-end[data-bs-popper] {
+    right: 0;
+    left: auto;
+  }
+}
+@media (min-width: 1400px) {
+  .dropdown-menu-xxl-start {
+    --bs-position: start;
+  }
+  .dropdown-menu-xxl-start[data-bs-popper] {
+    right: auto;
+    left: 0;
+  }
+
+  .dropdown-menu-xxl-end {
+    --bs-position: end;
+  }
+  .dropdown-menu-xxl-end[data-bs-popper] {
+    right: 0;
+    left: auto;
+  }
+}
+.dropup .dropdown-menu[data-bs-popper] {
+  top: auto;
+  bottom: 100%;
+  margin-top: 0;
+  margin-bottom: 0.125rem;
+}
+.dropup .dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0;
+  border-right: 0.3em solid transparent;
+  border-bottom: 0.3em solid;
+  border-left: 0.3em solid transparent;
+}
+.dropup .dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+
+.dropend .dropdown-menu[data-bs-popper] {
+  top: 0;
+  right: auto;
+  left: 100%;
+  margin-top: 0;
+  margin-left: 0.125rem;
+}
+.dropend .dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0.3em solid transparent;
+  border-right: 0;
+  border-bottom: 0.3em solid transparent;
+  border-left: 0.3em solid;
+}
+.dropend .dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+.dropend .dropdown-toggle::after {
+  vertical-align: 0;
+}
+
+.dropstart .dropdown-menu[data-bs-popper] {
+  top: 0;
+  right: 100%;
+  left: auto;
+  margin-top: 0;
+  margin-right: 0.125rem;
+}
+.dropstart .dropdown-toggle::after {
+  display: inline-block;
+  margin-left: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+}
+.dropstart .dropdown-toggle::after {
+  display: none;
+}
+.dropstart .dropdown-toggle::before {
+  display: inline-block;
+  margin-right: 0.255em;
+  vertical-align: 0.255em;
+  content: "";
+  border-top: 0.3em solid transparent;
+  border-right: 0.3em solid;
+  border-bottom: 0.3em solid transparent;
+}
+.dropstart .dropdown-toggle:empty::after {
+  margin-left: 0;
+}
+.dropstart .dropdown-toggle::before {
+  vertical-align: 0;
+}
+
+.dropdown-divider {
+  height: 0;
+  margin: 0.5rem 0;
+  overflow: hidden;
+  border-top: 1px solid rgba(0, 0, 0, 0.15);
+}
+
+.dropdown-item {
+  display: block;
+  width: 100%;
+  padding: 0.25rem 1rem;
+  clear: both;
+  font-weight: 400;
+  color: #212529;
+  text-align: inherit;
+  text-decoration: none;
+  white-space: nowrap;
+  background-color: transparent;
+  border: 0;
+}
+.dropdown-item:hover, .dropdown-item:focus {
+  color: #1e2125;
+  background-color: #e9ecef;
+}
+.dropdown-item.active, .dropdown-item:active {
+  color: #fff;
+  text-decoration: none;
+  background-color: #0d6efd;
+}
+.dropdown-item.disabled, .dropdown-item:disabled {
+  color: #adb5bd;
+  pointer-events: none;
+  background-color: transparent;
+}
+
+.dropdown-menu.show {
+  display: block;
+}
+
+.dropdown-header {
+  display: block;
+  padding: 0.5rem 1rem;
+  margin-bottom: 0;
+  font-size: 0.875rem;
+  color: #6c757d;
+  white-space: nowrap;
+}
+
+.dropdown-item-text {
+  display: block;
+  padding: 0.25rem 1rem;
+  color: #212529;
+}
+
+.dropdown-menu-dark {
+  color: #dee2e6;
+  background-color: #343a40;
+  border-color: rgba(0, 0, 0, 0.15);
+}
+.dropdown-menu-dark .dropdown-item {
+  color: #dee2e6;
+}
+.dropdown-menu-dark .dropdown-item:hover, .dropdown-menu-dark .dropdown-item:focus {
+  color: #fff;
+  background-color: rgba(255, 255, 255, 0.15);
+}
+.dropdown-menu-dark .dropdown-item.active, .dropdown-menu-dark .dropdown-item:active {
+  color: #fff;
+  background-color: #0d6efd;
+}
+.dropdown-menu-dark .dropdown-item.disabled, .dropdown-menu-dark .dropdown-item:disabled {
+  color: #adb5bd;
+}
+.dropdown-menu-dark .dropdown-divider {
+  border-color: rgba(0, 0, 0, 0.15);
+}
+.dropdown-menu-dark .dropdown-item-text {
+  color: #dee2e6;
+}
+.dropdown-menu-dark .dropdown-header {
+  color: #adb5bd;
+}
+
+.btn-group,
+.btn-group-vertical {
+  position: relative;
+  display: inline-flex;
+  vertical-align: middle;
+}
+.btn-group > .btn,
+.btn-group-vertical > .btn {
+  position: relative;
+  flex: 1 1 auto;
+}
+.btn-group > .btn-check:checked + .btn,
+.btn-group > .btn-check:focus + .btn,
+.btn-group > .btn:hover,
+.btn-group > .btn:focus,
+.btn-group > .btn:active,
+.btn-group > .btn.active,
+.btn-group-vertical > .btn-check:checked + .btn,
+.btn-group-vertical > .btn-check:focus + .btn,
+.btn-group-vertical > .btn:hover,
+.btn-group-vertical > .btn:focus,
+.btn-group-vertical > .btn:active,
+.btn-group-vertical > .btn.active {
+  z-index: 1;
+}
+
+.btn-toolbar {
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: flex-start;
+}
+.btn-toolbar .input-group {
+  width: auto;
+}
+
+.btn-group > .btn:not(:first-child),
+.btn-group > .btn-group:not(:first-child) {
+  margin-left: -1px;
+}
+.btn-group > .btn:not(:last-child):not(.dropdown-toggle),
+.btn-group > .btn-group:not(:last-child) > .btn {
+  border-top-right-radius: 0;
+  border-bottom-right-radius: 0;
+}
+.btn-group > .btn:nth-child(n+3),
+.btn-group > :not(.btn-check) + .btn,
+.btn-group > .btn-group:not(:first-child) > .btn {
+  border-top-left-radius: 0;
+  border-bottom-left-radius: 0;
+}
+
+.dropdown-toggle-split {
+  padding-right: 0.5625rem;
+  padding-left: 0.5625rem;
+}
+.dropdown-toggle-split::after, .dropup .dropdown-toggle-split::after, .dropend .dropdown-toggle-split::after {
+  margin-left: 0;
+}
+.dropstart .dropdown-toggle-split::before {
+  margin-right: 0;
+}
+
+.btn-sm + .dropdown-toggle-split, .btn-group-sm > .btn + .dropdown-toggle-split {
+  padding-right: 0.375rem;
+  padding-left: 0.375rem;
+}
+
+.btn-lg + .dropdown-toggle-split, .btn-group-lg > .btn + .dropdown-toggle-split {
+  padding-right: 0.75rem;
+  padding-left: 0.75rem;
+}
+
+.btn-group-vertical {
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+}
+.btn-group-vertical > .btn,
+.btn-group-vertical > .btn-group {
+  width: 100%;
+}
+.btn-group-vertical > .btn:not(:first-child),
+.btn-group-vertical > .btn-group:not(:first-child) {
+  margin-top: -1px;
+}
+.btn-group-vertical > .btn:not(:last-child):not(.dropdown-toggle),
+.btn-group-vertical > .btn-group:not(:last-child) > .btn {
+  border-bottom-right-radius: 0;
+  border-bottom-left-radius: 0;
+}
+.btn-group-vertical > .btn ~ .btn,
+.btn-group-vertical > .btn-group:not(:first-child) > .btn {
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.nav {
+  display: flex;
+  flex-wrap: wrap;
+  padding-left: 0;
+  margin-bottom: 0;
+  list-style: none;
+}
+
+.nav-link {
+  display: block;
+  padding: 0.5rem 1rem;
+  color: #0d6efd;
+  text-decoration: none;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .nav-link {
+    transition: none;
+  }
+}
+.nav-link:hover, .nav-link:focus {
+  color: #0a58ca;
+}
+.nav-link.disabled {
+  color: #6c757d;
+  pointer-events: none;
+  cursor: default;
+}
+
+.nav-tabs {
+  border-bottom: 1px solid #dee2e6;
+}
+.nav-tabs .nav-link {
+  margin-bottom: -1px;
+  background: none;
+  border: 1px solid transparent;
+  border-top-left-radius: 0.25rem;
+  border-top-right-radius: 0.25rem;
+}
+.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus {
+  border-color: #e9ecef #e9ecef #dee2e6;
+  isolation: isolate;
+}
+.nav-tabs .nav-link.disabled {
+  color: #6c757d;
+  background-color: transparent;
+  border-color: transparent;
+}
+.nav-tabs .nav-link.active,
+.nav-tabs .nav-item.show .nav-link {
+  color: #495057;
+  background-color: #fff;
+  border-color: #dee2e6 #dee2e6 #fff;
+}
+.nav-tabs .dropdown-menu {
+  margin-top: -1px;
+  border-top-left-radius: 0;
+  border-top-right-radius: 0;
+}
+
+.nav-pills .nav-link {
+  background: none;
+  border: 0;
+  border-radius: 0.25rem;
+}
+.nav-pills .nav-link.active,
+.nav-pills .show > .nav-link {
+  color: #fff;
+  background-color: #0d6efd;
+}
+
+.nav-fill > .nav-link,
+.nav-fill .nav-item {
+  flex: 1 1 auto;
+  text-align: center;
+}
+
+.nav-justified > .nav-link,
+.nav-justified .nav-item {
+  flex-basis: 0;
+  flex-grow: 1;
+  text-align: center;
+}
+
+.nav-fill .nav-item .nav-link,
+.nav-justified .nav-item .nav-link {
+  width: 100%;
+}
+
+.tab-content > .tab-pane {
+  display: none;
+}
+.tab-content > .active {
+  display: block;
+}
+
+.navbar {
+  position: relative;
+  display: flex;
+  flex-wrap: wrap;
+  align-items: center;
+  justify-content: space-between;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+.navbar > .container,
+.navbar > .container-fluid,
+.navbar > .container-sm,
+.navbar > .container-md,
+.navbar > .container-lg,
+.navbar > .container-xl,
+.navbar > .container-xxl {
+  display: flex;
+  flex-wrap: inherit;
+  align-items: center;
+  justify-content: space-between;
+}
+.navbar-brand {
+  padding-top: 0.3125rem;
+  padding-bottom: 0.3125rem;
+  margin-right: 1rem;
+  font-size: 1.25rem;
+  text-decoration: none;
+  white-space: nowrap;
+}
+.navbar-nav {
+  display: flex;
+  flex-direction: column;
+  padding-left: 0;
+  margin-bottom: 0;
+  list-style: none;
+}
+.navbar-nav .nav-link {
+  padding-right: 0;
+  padding-left: 0;
+}
+.navbar-nav .dropdown-menu {
+  position: static;
+}
+
+.navbar-text {
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.navbar-collapse {
+  flex-basis: 100%;
+  flex-grow: 1;
+  align-items: center;
+}
+
+.navbar-toggler {
+  padding: 0.25rem 0.75rem;
+  font-size: 1.25rem;
+  line-height: 1;
+  background-color: transparent;
+  border: 1px solid transparent;
+  border-radius: 0.25rem;
+  transition: box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .navbar-toggler {
+    transition: none;
+  }
+}
+.navbar-toggler:hover {
+  text-decoration: none;
+}
+.navbar-toggler:focus {
+  text-decoration: none;
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem;
+}
+
+.navbar-toggler-icon {
+  display: inline-block;
+  width: 1.5em;
+  height: 1.5em;
+  vertical-align: middle;
+  background-repeat: no-repeat;
+  background-position: center;
+  background-size: 100%;
+}
+
+.navbar-nav-scroll {
+  max-height: var(--bs-scroll-height, 75vh);
+  overflow-y: auto;
+}
+
+@media (min-width: 576px) {
+  .navbar-expand-sm {
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+  }
+  .navbar-expand-sm .navbar-nav {
+    flex-direction: row;
+  }
+  .navbar-expand-sm .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-sm .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-sm .navbar-nav-scroll {
+    overflow: visible;
+  }
+  .navbar-expand-sm .navbar-collapse {
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-sm .navbar-toggler {
+    display: none;
+  }
+  .navbar-expand-sm .offcanvas-header {
+    display: none;
+  }
+  .navbar-expand-sm .offcanvas {
+    position: inherit;
+    bottom: 0;
+    z-index: 1000;
+    flex-grow: 1;
+    visibility: visible !important;
+    background-color: transparent;
+    border-right: 0;
+    border-left: 0;
+    transition: none;
+    transform: none;
+  }
+  .navbar-expand-sm .offcanvas-top,
+.navbar-expand-sm .offcanvas-bottom {
+    height: auto;
+    border-top: 0;
+    border-bottom: 0;
+  }
+  .navbar-expand-sm .offcanvas-body {
+    display: flex;
+    flex-grow: 0;
+    padding: 0;
+    overflow-y: visible;
+  }
+}
+@media (min-width: 768px) {
+  .navbar-expand-md {
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+  }
+  .navbar-expand-md .navbar-nav {
+    flex-direction: row;
+  }
+  .navbar-expand-md .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-md .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-md .navbar-nav-scroll {
+    overflow: visible;
+  }
+  .navbar-expand-md .navbar-collapse {
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-md .navbar-toggler {
+    display: none;
+  }
+  .navbar-expand-md .offcanvas-header {
+    display: none;
+  }
+  .navbar-expand-md .offcanvas {
+    position: inherit;
+    bottom: 0;
+    z-index: 1000;
+    flex-grow: 1;
+    visibility: visible !important;
+    background-color: transparent;
+    border-right: 0;
+    border-left: 0;
+    transition: none;
+    transform: none;
+  }
+  .navbar-expand-md .offcanvas-top,
+.navbar-expand-md .offcanvas-bottom {
+    height: auto;
+    border-top: 0;
+    border-bottom: 0;
+  }
+  .navbar-expand-md .offcanvas-body {
+    display: flex;
+    flex-grow: 0;
+    padding: 0;
+    overflow-y: visible;
+  }
+}
+@media (min-width: 992px) {
+  .navbar-expand-lg {
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+  }
+  .navbar-expand-lg .navbar-nav {
+    flex-direction: row;
+  }
+  .navbar-expand-lg .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-lg .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-lg .navbar-nav-scroll {
+    overflow: visible;
+  }
+  .navbar-expand-lg .navbar-collapse {
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-lg .navbar-toggler {
+    display: none;
+  }
+  .navbar-expand-lg .offcanvas-header {
+    display: none;
+  }
+  .navbar-expand-lg .offcanvas {
+    position: inherit;
+    bottom: 0;
+    z-index: 1000;
+    flex-grow: 1;
+    visibility: visible !important;
+    background-color: transparent;
+    border-right: 0;
+    border-left: 0;
+    transition: none;
+    transform: none;
+  }
+  .navbar-expand-lg .offcanvas-top,
+.navbar-expand-lg .offcanvas-bottom {
+    height: auto;
+    border-top: 0;
+    border-bottom: 0;
+  }
+  .navbar-expand-lg .offcanvas-body {
+    display: flex;
+    flex-grow: 0;
+    padding: 0;
+    overflow-y: visible;
+  }
+}
+@media (min-width: 1200px) {
+  .navbar-expand-xl {
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+  }
+  .navbar-expand-xl .navbar-nav {
+    flex-direction: row;
+  }
+  .navbar-expand-xl .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-xl .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-xl .navbar-nav-scroll {
+    overflow: visible;
+  }
+  .navbar-expand-xl .navbar-collapse {
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-xl .navbar-toggler {
+    display: none;
+  }
+  .navbar-expand-xl .offcanvas-header {
+    display: none;
+  }
+  .navbar-expand-xl .offcanvas {
+    position: inherit;
+    bottom: 0;
+    z-index: 1000;
+    flex-grow: 1;
+    visibility: visible !important;
+    background-color: transparent;
+    border-right: 0;
+    border-left: 0;
+    transition: none;
+    transform: none;
+  }
+  .navbar-expand-xl .offcanvas-top,
+.navbar-expand-xl .offcanvas-bottom {
+    height: auto;
+    border-top: 0;
+    border-bottom: 0;
+  }
+  .navbar-expand-xl .offcanvas-body {
+    display: flex;
+    flex-grow: 0;
+    padding: 0;
+    overflow-y: visible;
+  }
+}
+@media (min-width: 1400px) {
+  .navbar-expand-xxl {
+    flex-wrap: nowrap;
+    justify-content: flex-start;
+  }
+  .navbar-expand-xxl .navbar-nav {
+    flex-direction: row;
+  }
+  .navbar-expand-xxl .navbar-nav .dropdown-menu {
+    position: absolute;
+  }
+  .navbar-expand-xxl .navbar-nav .nav-link {
+    padding-right: 0.5rem;
+    padding-left: 0.5rem;
+  }
+  .navbar-expand-xxl .navbar-nav-scroll {
+    overflow: visible;
+  }
+  .navbar-expand-xxl .navbar-collapse {
+    display: flex !important;
+    flex-basis: auto;
+  }
+  .navbar-expand-xxl .navbar-toggler {
+    display: none;
+  }
+  .navbar-expand-xxl .offcanvas-header {
+    display: none;
+  }
+  .navbar-expand-xxl .offcanvas {
+    position: inherit;
+    bottom: 0;
+    z-index: 1000;
+    flex-grow: 1;
+    visibility: visible !important;
+    background-color: transparent;
+    border-right: 0;
+    border-left: 0;
+    transition: none;
+    transform: none;
+  }
+  .navbar-expand-xxl .offcanvas-top,
+.navbar-expand-xxl .offcanvas-bottom {
+    height: auto;
+    border-top: 0;
+    border-bottom: 0;
+  }
+  .navbar-expand-xxl .offcanvas-body {
+    display: flex;
+    flex-grow: 0;
+    padding: 0;
+    overflow-y: visible;
+  }
+}
+.navbar-expand {
+  flex-wrap: nowrap;
+  justify-content: flex-start;
+}
+.navbar-expand .navbar-nav {
+  flex-direction: row;
+}
+.navbar-expand .navbar-nav .dropdown-menu {
+  position: absolute;
+}
+.navbar-expand .navbar-nav .nav-link {
+  padding-right: 0.5rem;
+  padding-left: 0.5rem;
+}
+.navbar-expand .navbar-nav-scroll {
+  overflow: visible;
+}
+.navbar-expand .navbar-collapse {
+  display: flex !important;
+  flex-basis: auto;
+}
+.navbar-expand .navbar-toggler {
+  display: none;
+}
+.navbar-expand .offcanvas-header {
+  display: none;
+}
+.navbar-expand .offcanvas {
+  position: inherit;
+  bottom: 0;
+  z-index: 1000;
+  flex-grow: 1;
+  visibility: visible !important;
+  background-color: transparent;
+  border-right: 0;
+  border-left: 0;
+  transition: none;
+  transform: none;
+}
+.navbar-expand .offcanvas-top,
+.navbar-expand .offcanvas-bottom {
+  height: auto;
+  border-top: 0;
+  border-bottom: 0;
+}
+.navbar-expand .offcanvas-body {
+  display: flex;
+  flex-grow: 0;
+  padding: 0;
+  overflow-y: visible;
+}
+
+.navbar-light .navbar-brand {
+  color: rgba(0, 0, 0, 0.9);
+}
+.navbar-light .navbar-brand:hover, .navbar-light .navbar-brand:focus {
+  color: rgba(0, 0, 0, 0.9);
+}
+.navbar-light .navbar-nav .nav-link {
+  color: rgba(0, 0, 0, 0.55);
+}
+.navbar-light .navbar-nav .nav-link:hover, .navbar-light .navbar-nav .nav-link:focus {
+  color: rgba(0, 0, 0, 0.7);
+}
+.navbar-light .navbar-nav .nav-link.disabled {
+  color: rgba(0, 0, 0, 0.3);
+}
+.navbar-light .navbar-nav .show > .nav-link,
+.navbar-light .navbar-nav .nav-link.active {
+  color: rgba(0, 0, 0, 0.9);
+}
+.navbar-light .navbar-toggler {
+  color: rgba(0, 0, 0, 0.55);
+  border-color: rgba(0, 0, 0, 0.1);
+}
+.navbar-light .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280, 0, 0, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
+}
+.navbar-light .navbar-text {
+  color: rgba(0, 0, 0, 0.55);
+}
+.navbar-light .navbar-text a,
+.navbar-light .navbar-text a:hover,
+.navbar-light .navbar-text a:focus {
+  color: rgba(0, 0, 0, 0.9);
+}
+
+.navbar-dark .navbar-brand {
+  color: #fff;
+}
+.navbar-dark .navbar-brand:hover, .navbar-dark .navbar-brand:focus {
+  color: #fff;
+}
+.navbar-dark .navbar-nav .nav-link {
+  color: rgba(255, 255, 255, 0.55);
+}
+.navbar-dark .navbar-nav .nav-link:hover, .navbar-dark .navbar-nav .nav-link:focus {
+  color: rgba(255, 255, 255, 0.75);
+}
+.navbar-dark .navbar-nav .nav-link.disabled {
+  color: rgba(255, 255, 255, 0.25);
+}
+.navbar-dark .navbar-nav .show > .nav-link,
+.navbar-dark .navbar-nav .nav-link.active {
+  color: #fff;
+}
+.navbar-dark .navbar-toggler {
+  color: rgba(255, 255, 255, 0.55);
+  border-color: rgba(255, 255, 255, 0.1);
+}
+.navbar-dark .navbar-toggler-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 0.55%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
+}
+.navbar-dark .navbar-text {
+  color: rgba(255, 255, 255, 0.55);
+}
+.navbar-dark .navbar-text a,
+.navbar-dark .navbar-text a:hover,
+.navbar-dark .navbar-text a:focus {
+  color: #fff;
+}
+
+.card {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  word-wrap: break-word;
+  background-color: #fff;
+  background-clip: border-box;
+  border: 1px solid rgba(0, 0, 0, 0.125);
+  border-radius: 0.25rem;
+}
+.card > hr {
+  margin-right: 0;
+  margin-left: 0;
+}
+.card > .list-group {
+  border-top: inherit;
+  border-bottom: inherit;
+}
+.card > .list-group:first-child {
+  border-top-width: 0;
+  border-top-left-radius: calc(0.25rem - 1px);
+  border-top-right-radius: calc(0.25rem - 1px);
+}
+.card > .list-group:last-child {
+  border-bottom-width: 0;
+  border-bottom-right-radius: calc(0.25rem - 1px);
+  border-bottom-left-radius: calc(0.25rem - 1px);
+}
+.card > .card-header + .list-group,
+.card > .list-group + .card-footer {
+  border-top: 0;
+}
+
+.card-body {
+  flex: 1 1 auto;
+  padding: 1rem 1rem;
+}
+
+.card-title {
+  margin-bottom: 0.5rem;
+}
+
+.card-subtitle {
+  margin-top: -0.25rem;
+  margin-bottom: 0;
+}
+
+.card-text:last-child {
+  margin-bottom: 0;
+}
+
+.card-link + .card-link {
+  margin-left: 1rem;
+}
+
+.card-header {
+  padding: 0.5rem 1rem;
+  margin-bottom: 0;
+  background-color: rgba(0, 0, 0, 0.03);
+  border-bottom: 1px solid rgba(0, 0, 0, 0.125);
+}
+.card-header:first-child {
+  border-radius: calc(0.25rem - 1px) calc(0.25rem - 1px) 0 0;
+}
+
+.card-footer {
+  padding: 0.5rem 1rem;
+  background-color: rgba(0, 0, 0, 0.03);
+  border-top: 1px solid rgba(0, 0, 0, 0.125);
+}
+.card-footer:last-child {
+  border-radius: 0 0 calc(0.25rem - 1px) calc(0.25rem - 1px);
+}
+
+.card-header-tabs {
+  margin-right: -0.5rem;
+  margin-bottom: -0.5rem;
+  margin-left: -0.5rem;
+  border-bottom: 0;
+}
+
+.card-header-pills {
+  margin-right: -0.5rem;
+  margin-left: -0.5rem;
+}
+
+.card-img-overlay {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  padding: 1rem;
+  border-radius: calc(0.25rem - 1px);
+}
+
+.card-img,
+.card-img-top,
+.card-img-bottom {
+  width: 100%;
+}
+
+.card-img,
+.card-img-top {
+  border-top-left-radius: calc(0.25rem - 1px);
+  border-top-right-radius: calc(0.25rem - 1px);
+}
+
+.card-img,
+.card-img-bottom {
+  border-bottom-right-radius: calc(0.25rem - 1px);
+  border-bottom-left-radius: calc(0.25rem - 1px);
+}
+
+.card-group > .card {
+  margin-bottom: 0.75rem;
+}
+@media (min-width: 576px) {
+  .card-group {
+    display: flex;
+    flex-flow: row wrap;
+  }
+  .card-group > .card {
+    flex: 1 0 0%;
+    margin-bottom: 0;
+  }
+  .card-group > .card + .card {
+    margin-left: 0;
+    border-left: 0;
+  }
+  .card-group > .card:not(:last-child) {
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+  }
+  .card-group > .card:not(:last-child) .card-img-top,
+.card-group > .card:not(:last-child) .card-header {
+    border-top-right-radius: 0;
+  }
+  .card-group > .card:not(:last-child) .card-img-bottom,
+.card-group > .card:not(:last-child) .card-footer {
+    border-bottom-right-radius: 0;
+  }
+  .card-group > .card:not(:first-child) {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+  }
+  .card-group > .card:not(:first-child) .card-img-top,
+.card-group > .card:not(:first-child) .card-header {
+    border-top-left-radius: 0;
+  }
+  .card-group > .card:not(:first-child) .card-img-bottom,
+.card-group > .card:not(:first-child) .card-footer {
+    border-bottom-left-radius: 0;
+  }
+}
+
+.accordion-button {
+  position: relative;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  padding: 1rem 1.25rem;
+  font-size: 1rem;
+  color: #212529;
+  text-align: left;
+  background-color: #fff;
+  border: 0;
+  border-radius: 0;
+  overflow-anchor: none;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .accordion-button {
+    transition: none;
+  }
+}
+.accordion-button:not(.collapsed) {
+  color: #0c63e4;
+  background-color: #e7f1ff;
+  box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.125);
+}
+.accordion-button:not(.collapsed)::after {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+  transform: rotate(-180deg);
+}
+.accordion-button::after {
+  flex-shrink: 0;
+  width: 1.25rem;
+  height: 1.25rem;
+  margin-left: auto;
+  content: "";
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+  background-repeat: no-repeat;
+  background-size: 1.25rem;
+  transition: transform 0.2s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .accordion-button::after {
+    transition: none;
+  }
+}
+.accordion-button:hover {
+  z-index: 2;
+}
+.accordion-button:focus {
+  z-index: 3;
+  border-color: #86b7fe;
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+
+.accordion-header {
+  margin-bottom: 0;
+}
+
+.accordion-item {
+  background-color: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.125);
+}
+.accordion-item:first-of-type {
+  border-top-left-radius: 0.25rem;
+  border-top-right-radius: 0.25rem;
+}
+.accordion-item:first-of-type .accordion-button {
+  border-top-left-radius: calc(0.25rem - 1px);
+  border-top-right-radius: calc(0.25rem - 1px);
+}
+.accordion-item:not(:first-of-type) {
+  border-top: 0;
+}
+.accordion-item:last-of-type {
+  border-bottom-right-radius: 0.25rem;
+  border-bottom-left-radius: 0.25rem;
+}
+.accordion-item:last-of-type .accordion-button.collapsed {
+  border-bottom-right-radius: calc(0.25rem - 1px);
+  border-bottom-left-radius: calc(0.25rem - 1px);
+}
+.accordion-item:last-of-type .accordion-collapse {
+  border-bottom-right-radius: 0.25rem;
+  border-bottom-left-radius: 0.25rem;
+}
+
+.accordion-body {
+  padding: 1rem 1.25rem;
+}
+
+.accordion-flush .accordion-collapse {
+  border-width: 0;
+}
+.accordion-flush .accordion-item {
+  border-right: 0;
+  border-left: 0;
+  border-radius: 0;
+}
+.accordion-flush .accordion-item:first-child {
+  border-top: 0;
+}
+.accordion-flush .accordion-item:last-child {
+  border-bottom: 0;
+}
+.accordion-flush .accordion-item .accordion-button {
+  border-radius: 0;
+}
+
+.breadcrumb {
+  display: flex;
+  flex-wrap: wrap;
+  padding: 0 0;
+  margin-bottom: 1rem;
+  list-style: none;
+}
+
+.breadcrumb-item + .breadcrumb-item {
+  padding-left: 0.5rem;
+}
+.breadcrumb-item + .breadcrumb-item::before {
+  float: left;
+  padding-right: 0.5rem;
+  color: #6c757d;
+  content: var(--bs-breadcrumb-divider, "/") /* rtl: var(--bs-breadcrumb-divider, "/") */;
+}
+.breadcrumb-item.active {
+  color: #6c757d;
+}
+
+.pagination {
+  display: flex;
+  padding-left: 0;
+  list-style: none;
+}
+
+.page-link {
+  position: relative;
+  display: block;
+  color: #0d6efd;
+  text-decoration: none;
+  background-color: #fff;
+  border: 1px solid #dee2e6;
+  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .page-link {
+    transition: none;
+  }
+}
+.page-link:hover {
+  z-index: 2;
+  color: #0a58ca;
+  background-color: #e9ecef;
+  border-color: #dee2e6;
+}
+.page-link:focus {
+  z-index: 3;
+  color: #0a58ca;
+  background-color: #e9ecef;
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+}
+
+.page-item:not(:first-child) .page-link {
+  margin-left: -1px;
+}
+.page-item.active .page-link {
+  z-index: 3;
+  color: #fff;
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+}
+.page-item.disabled .page-link {
+  color: #6c757d;
+  pointer-events: none;
+  background-color: #fff;
+  border-color: #dee2e6;
+}
+
+.page-link {
+  padding: 0.375rem 0.75rem;
+}
+
+.page-item:first-child .page-link {
+  border-top-left-radius: 0.25rem;
+  border-bottom-left-radius: 0.25rem;
+}
+.page-item:last-child .page-link {
+  border-top-right-radius: 0.25rem;
+  border-bottom-right-radius: 0.25rem;
+}
+
+.pagination-lg .page-link {
+  padding: 0.75rem 1.5rem;
+  font-size: 1.25rem;
+}
+.pagination-lg .page-item:first-child .page-link {
+  border-top-left-radius: 0.3rem;
+  border-bottom-left-radius: 0.3rem;
+}
+.pagination-lg .page-item:last-child .page-link {
+  border-top-right-radius: 0.3rem;
+  border-bottom-right-radius: 0.3rem;
+}
+
+.pagination-sm .page-link {
+  padding: 0.25rem 0.5rem;
+  font-size: 0.875rem;
+}
+.pagination-sm .page-item:first-child .page-link {
+  border-top-left-radius: 0.2rem;
+  border-bottom-left-radius: 0.2rem;
+}
+.pagination-sm .page-item:last-child .page-link {
+  border-top-right-radius: 0.2rem;
+  border-bottom-right-radius: 0.2rem;
+}
+
+.badge {
+  display: inline-block;
+  padding: 0.35em 0.65em;
+  font-size: 0.75em;
+  font-weight: 700;
+  line-height: 1;
+  color: #fff;
+  text-align: center;
+  white-space: nowrap;
+  vertical-align: baseline;
+  border-radius: 0.25rem;
+}
+.badge:empty {
+  display: none;
+}
+
+.btn .badge {
+  position: relative;
+  top: -1px;
+}
+
+.alert {
+  position: relative;
+  padding: 1rem 1rem;
+  margin-bottom: 1rem;
+  border: 1px solid transparent;
+  border-radius: 0.25rem;
+}
+
+.alert-heading {
+  color: inherit;
+}
+
+.alert-link {
+  font-weight: 700;
+}
+
+.alert-dismissible {
+  padding-right: 3rem;
+}
+.alert-dismissible .btn-close {
+  position: absolute;
+  top: 0;
+  right: 0;
+  z-index: 2;
+  padding: 1.25rem 1rem;
+}
+
+.alert-primary {
+  color: #084298;
+  background-color: #cfe2ff;
+  border-color: #b6d4fe;
+}
+.alert-primary .alert-link {
+  color: #06357a;
+}
+
+.alert-secondary {
+  color: #41464b;
+  background-color: #e2e3e5;
+  border-color: #d3d6d8;
+}
+.alert-secondary .alert-link {
+  color: #34383c;
+}
+
+.alert-success {
+  color: #0f5132;
+  background-color: #d1e7dd;
+  border-color: #badbcc;
+}
+.alert-success .alert-link {
+  color: #0c4128;
+}
+
+.alert-info {
+  color: #055160;
+  background-color: #cff4fc;
+  border-color: #b6effb;
+}
+.alert-info .alert-link {
+  color: #04414d;
+}
+
+.alert-warning {
+  color: #664d03;
+  background-color: #fff3cd;
+  border-color: #ffecb5;
+}
+.alert-warning .alert-link {
+  color: #523e02;
+}
+
+.alert-danger {
+  color: #842029;
+  background-color: #f8d7da;
+  border-color: #f5c2c7;
+}
+.alert-danger .alert-link {
+  color: #6a1a21;
+}
+
+.alert-light {
+  color: #636464;
+  background-color: #fefefe;
+  border-color: #fdfdfe;
+}
+.alert-light .alert-link {
+  color: #4f5050;
+}
+
+.alert-dark {
+  color: #141619;
+  background-color: #d3d3d4;
+  border-color: #bcbebf;
+}
+.alert-dark .alert-link {
+  color: #101214;
+}
+
+@-webkit-keyframes progress-bar-stripes {
+  0% {
+    background-position-x: 1rem;
+  }
+}
+
+@keyframes progress-bar-stripes {
+  0% {
+    background-position-x: 1rem;
+  }
+}
+.progress {
+  display: flex;
+  height: 1rem;
+  overflow: hidden;
+  font-size: 0.75rem;
+  background-color: #e9ecef;
+  border-radius: 0.25rem;
+}
+
+.progress-bar {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  overflow: hidden;
+  color: #fff;
+  text-align: center;
+  white-space: nowrap;
+  background-color: #0d6efd;
+  transition: width 0.6s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .progress-bar {
+    transition: none;
+  }
+}
+
+.progress-bar-striped {
+  background-image: linear-gradient(45deg, rgba(255, 255, 255, 0.15) 25%, transparent 25%, transparent 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, transparent 75%, transparent);
+  background-size: 1rem 1rem;
+}
+
+.progress-bar-animated {
+  -webkit-animation: 1s linear infinite progress-bar-stripes;
+  animation: 1s linear infinite progress-bar-stripes;
+}
+@media (prefers-reduced-motion: reduce) {
+  .progress-bar-animated {
+    -webkit-animation: none;
+    animation: none;
+  }
+}
+
+.list-group {
+  display: flex;
+  flex-direction: column;
+  padding-left: 0;
+  margin-bottom: 0;
+  border-radius: 0.25rem;
+}
+
+.list-group-numbered {
+  list-style-type: none;
+  counter-reset: section;
+}
+.list-group-numbered > li::before {
+  content: counters(section, ".") ". ";
+  counter-increment: section;
+}
+
+.list-group-item-action {
+  width: 100%;
+  color: #495057;
+  text-align: inherit;
+}
+.list-group-item-action:hover, .list-group-item-action:focus {
+  z-index: 1;
+  color: #495057;
+  text-decoration: none;
+  background-color: #f8f9fa;
+}
+.list-group-item-action:active {
+  color: #212529;
+  background-color: #e9ecef;
+}
+
+.list-group-item {
+  position: relative;
+  display: block;
+  padding: 0.5rem 1rem;
+  color: #212529;
+  text-decoration: none;
+  background-color: #fff;
+  border: 1px solid rgba(0, 0, 0, 0.125);
+}
+.list-group-item:first-child {
+  border-top-left-radius: inherit;
+  border-top-right-radius: inherit;
+}
+.list-group-item:last-child {
+  border-bottom-right-radius: inherit;
+  border-bottom-left-radius: inherit;
+}
+.list-group-item.disabled, .list-group-item:disabled {
+  color: #6c757d;
+  pointer-events: none;
+  background-color: #fff;
+}
+.list-group-item.active {
+  z-index: 2;
+  color: #fff;
+  background-color: #0d6efd;
+  border-color: #0d6efd;
+}
+.list-group-item + .list-group-item {
+  border-top-width: 0;
+}
+.list-group-item + .list-group-item.active {
+  margin-top: -1px;
+  border-top-width: 1px;
+}
+
+.list-group-horizontal {
+  flex-direction: row;
+}
+.list-group-horizontal > .list-group-item:first-child {
+  border-bottom-left-radius: 0.25rem;
+  border-top-right-radius: 0;
+}
+.list-group-horizontal > .list-group-item:last-child {
+  border-top-right-radius: 0.25rem;
+  border-bottom-left-radius: 0;
+}
+.list-group-horizontal > .list-group-item.active {
+  margin-top: 0;
+}
+.list-group-horizontal > .list-group-item + .list-group-item {
+  border-top-width: 1px;
+  border-left-width: 0;
+}
+.list-group-horizontal > .list-group-item + .list-group-item.active {
+  margin-left: -1px;
+  border-left-width: 1px;
+}
+
+@media (min-width: 576px) {
+  .list-group-horizontal-sm {
+    flex-direction: row;
+  }
+  .list-group-horizontal-sm > .list-group-item:first-child {
+    border-bottom-left-radius: 0.25rem;
+    border-top-right-radius: 0;
+  }
+  .list-group-horizontal-sm > .list-group-item:last-child {
+    border-top-right-radius: 0.25rem;
+    border-bottom-left-radius: 0;
+  }
+  .list-group-horizontal-sm > .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-sm > .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-sm > .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+@media (min-width: 768px) {
+  .list-group-horizontal-md {
+    flex-direction: row;
+  }
+  .list-group-horizontal-md > .list-group-item:first-child {
+    border-bottom-left-radius: 0.25rem;
+    border-top-right-radius: 0;
+  }
+  .list-group-horizontal-md > .list-group-item:last-child {
+    border-top-right-radius: 0.25rem;
+    border-bottom-left-radius: 0;
+  }
+  .list-group-horizontal-md > .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-md > .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-md > .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+@media (min-width: 992px) {
+  .list-group-horizontal-lg {
+    flex-direction: row;
+  }
+  .list-group-horizontal-lg > .list-group-item:first-child {
+    border-bottom-left-radius: 0.25rem;
+    border-top-right-radius: 0;
+  }
+  .list-group-horizontal-lg > .list-group-item:last-child {
+    border-top-right-radius: 0.25rem;
+    border-bottom-left-radius: 0;
+  }
+  .list-group-horizontal-lg > .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-lg > .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-lg > .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+@media (min-width: 1200px) {
+  .list-group-horizontal-xl {
+    flex-direction: row;
+  }
+  .list-group-horizontal-xl > .list-group-item:first-child {
+    border-bottom-left-radius: 0.25rem;
+    border-top-right-radius: 0;
+  }
+  .list-group-horizontal-xl > .list-group-item:last-child {
+    border-top-right-radius: 0.25rem;
+    border-bottom-left-radius: 0;
+  }
+  .list-group-horizontal-xl > .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-xl > .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-xl > .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+@media (min-width: 1400px) {
+  .list-group-horizontal-xxl {
+    flex-direction: row;
+  }
+  .list-group-horizontal-xxl > .list-group-item:first-child {
+    border-bottom-left-radius: 0.25rem;
+    border-top-right-radius: 0;
+  }
+  .list-group-horizontal-xxl > .list-group-item:last-child {
+    border-top-right-radius: 0.25rem;
+    border-bottom-left-radius: 0;
+  }
+  .list-group-horizontal-xxl > .list-group-item.active {
+    margin-top: 0;
+  }
+  .list-group-horizontal-xxl > .list-group-item + .list-group-item {
+    border-top-width: 1px;
+    border-left-width: 0;
+  }
+  .list-group-horizontal-xxl > .list-group-item + .list-group-item.active {
+    margin-left: -1px;
+    border-left-width: 1px;
+  }
+}
+.list-group-flush {
+  border-radius: 0;
+}
+.list-group-flush > .list-group-item {
+  border-width: 0 0 1px;
+}
+.list-group-flush > .list-group-item:last-child {
+  border-bottom-width: 0;
+}
+
+.list-group-item-primary {
+  color: #084298;
+  background-color: #cfe2ff;
+}
+.list-group-item-primary.list-group-item-action:hover, .list-group-item-primary.list-group-item-action:focus {
+  color: #084298;
+  background-color: #bacbe6;
+}
+.list-group-item-primary.list-group-item-action.active {
+  color: #fff;
+  background-color: #084298;
+  border-color: #084298;
+}
+
+.list-group-item-secondary {
+  color: #41464b;
+  background-color: #e2e3e5;
+}
+.list-group-item-secondary.list-group-item-action:hover, .list-group-item-secondary.list-group-item-action:focus {
+  color: #41464b;
+  background-color: #cbccce;
+}
+.list-group-item-secondary.list-group-item-action.active {
+  color: #fff;
+  background-color: #41464b;
+  border-color: #41464b;
+}
+
+.list-group-item-success {
+  color: #0f5132;
+  background-color: #d1e7dd;
+}
+.list-group-item-success.list-group-item-action:hover, .list-group-item-success.list-group-item-action:focus {
+  color: #0f5132;
+  background-color: #bcd0c7;
+}
+.list-group-item-success.list-group-item-action.active {
+  color: #fff;
+  background-color: #0f5132;
+  border-color: #0f5132;
+}
+
+.list-group-item-info {
+  color: #055160;
+  background-color: #cff4fc;
+}
+.list-group-item-info.list-group-item-action:hover, .list-group-item-info.list-group-item-action:focus {
+  color: #055160;
+  background-color: #badce3;
+}
+.list-group-item-info.list-group-item-action.active {
+  color: #fff;
+  background-color: #055160;
+  border-color: #055160;
+}
+
+.list-group-item-warning {
+  color: #664d03;
+  background-color: #fff3cd;
+}
+.list-group-item-warning.list-group-item-action:hover, .list-group-item-warning.list-group-item-action:focus {
+  color: #664d03;
+  background-color: #e6dbb9;
+}
+.list-group-item-warning.list-group-item-action.active {
+  color: #fff;
+  background-color: #664d03;
+  border-color: #664d03;
+}
+
+.list-group-item-danger {
+  color: #842029;
+  background-color: #f8d7da;
+}
+.list-group-item-danger.list-group-item-action:hover, .list-group-item-danger.list-group-item-action:focus {
+  color: #842029;
+  background-color: #dfc2c4;
+}
+.list-group-item-danger.list-group-item-action.active {
+  color: #fff;
+  background-color: #842029;
+  border-color: #842029;
+}
+
+.list-group-item-light {
+  color: #636464;
+  background-color: #fefefe;
+}
+.list-group-item-light.list-group-item-action:hover, .list-group-item-light.list-group-item-action:focus {
+  color: #636464;
+  background-color: #e5e5e5;
+}
+.list-group-item-light.list-group-item-action.active {
+  color: #fff;
+  background-color: #636464;
+  border-color: #636464;
+}
+
+.list-group-item-dark {
+  color: #141619;
+  background-color: #d3d3d4;
+}
+.list-group-item-dark.list-group-item-action:hover, .list-group-item-dark.list-group-item-action:focus {
+  color: #141619;
+  background-color: #bebebf;
+}
+.list-group-item-dark.list-group-item-action.active {
+  color: #fff;
+  background-color: #141619;
+  border-color: #141619;
+}
+
+.btn-close {
+  box-sizing: content-box;
+  width: 1em;
+  height: 1em;
+  padding: 0.25em 0.25em;
+  color: #000;
+  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
+  border: 0;
+  border-radius: 0.25rem;
+  opacity: 0.5;
+}
+.btn-close:hover {
+  color: #000;
+  text-decoration: none;
+  opacity: 0.75;
+}
+.btn-close:focus {
+  outline: 0;
+  box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
+  opacity: 1;
+}
+.btn-close:disabled, .btn-close.disabled {
+  pointer-events: none;
+  -webkit-user-select: none;
+  -moz-user-select: none;
+  user-select: none;
+  opacity: 0.25;
+}
+
+.btn-close-white {
+  filter: invert(1) grayscale(100%) brightness(200%);
+}
+
+.toast {
+  width: 350px;
+  max-width: 100%;
+  font-size: 0.875rem;
+  pointer-events: auto;
+  background-color: rgba(255, 255, 255, 0.85);
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.1);
+  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
+  border-radius: 0.25rem;
+}
+.toast.showing {
+  opacity: 0;
+}
+.toast:not(.show) {
+  display: none;
+}
+
+.toast-container {
+  width: -webkit-max-content;
+  width: -moz-max-content;
+  width: max-content;
+  max-width: 100%;
+  pointer-events: none;
+}
+.toast-container > :not(:last-child) {
+  margin-bottom: 0.75rem;
+}
+
+.toast-header {
+  display: flex;
+  align-items: center;
+  padding: 0.5rem 0.75rem;
+  color: #6c757d;
+  background-color: rgba(255, 255, 255, 0.85);
+  background-clip: padding-box;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
+  border-top-left-radius: calc(0.25rem - 1px);
+  border-top-right-radius: calc(0.25rem - 1px);
+}
+.toast-header .btn-close {
+  margin-right: -0.375rem;
+  margin-left: 0.75rem;
+}
+
+.toast-body {
+  padding: 0.75rem;
+  word-wrap: break-word;
+}
+
+.modal {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1055;
+  display: none;
+  width: 100%;
+  height: 100%;
+  overflow-x: hidden;
+  overflow-y: auto;
+  outline: 0;
+}
+
+.modal-dialog {
+  position: relative;
+  width: auto;
+  margin: 0.5rem;
+  pointer-events: none;
+}
+.modal.fade .modal-dialog {
+  transition: transform 0.3s ease-out;
+  transform: translate(0, -50px);
+}
+@media (prefers-reduced-motion: reduce) {
+  .modal.fade .modal-dialog {
+    transition: none;
+  }
+}
+.modal.show .modal-dialog {
+  transform: none;
+}
+.modal.modal-static .modal-dialog {
+  transform: scale(1.02);
+}
+
+.modal-dialog-scrollable {
+  height: calc(100% - 1rem);
+}
+.modal-dialog-scrollable .modal-content {
+  max-height: 100%;
+  overflow: hidden;
+}
+.modal-dialog-scrollable .modal-body {
+  overflow-y: auto;
+}
+
+.modal-dialog-centered {
+  display: flex;
+  align-items: center;
+  min-height: calc(100% - 1rem);
+}
+
+.modal-content {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+  pointer-events: auto;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  border-radius: 0.3rem;
+  outline: 0;
+}
+
+.modal-backdrop {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1050;
+  width: 100vw;
+  height: 100vh;
+  background-color: #000;
+}
+.modal-backdrop.fade {
+  opacity: 0;
+}
+.modal-backdrop.show {
+  opacity: 0.5;
+}
+
+.modal-header {
+  display: flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: space-between;
+  padding: 1rem 1rem;
+  border-bottom: 1px solid #dee2e6;
+  border-top-left-radius: calc(0.3rem - 1px);
+  border-top-right-radius: calc(0.3rem - 1px);
+}
+.modal-header .btn-close {
+  padding: 0.5rem 0.5rem;
+  margin: -0.5rem -0.5rem -0.5rem auto;
+}
+
+.modal-title {
+  margin-bottom: 0;
+  line-height: 1.5;
+}
+
+.modal-body {
+  position: relative;
+  flex: 1 1 auto;
+  padding: 1rem;
+}
+
+.modal-footer {
+  display: flex;
+  flex-wrap: wrap;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: flex-end;
+  padding: 0.75rem;
+  border-top: 1px solid #dee2e6;
+  border-bottom-right-radius: calc(0.3rem - 1px);
+  border-bottom-left-radius: calc(0.3rem - 1px);
+}
+.modal-footer > * {
+  margin: 0.25rem;
+}
+
+@media (min-width: 576px) {
+  .modal-dialog {
+    max-width: 500px;
+    margin: 1.75rem auto;
+  }
+
+  .modal-dialog-scrollable {
+    height: calc(100% - 3.5rem);
+  }
+
+  .modal-dialog-centered {
+    min-height: calc(100% - 3.5rem);
+  }
+
+  .modal-sm {
+    max-width: 300px;
+  }
+}
+@media (min-width: 992px) {
+  .modal-lg,
+.modal-xl {
+    max-width: 800px;
+  }
+}
+@media (min-width: 1200px) {
+  .modal-xl {
+    max-width: 1140px;
+  }
+}
+.modal-fullscreen {
+  width: 100vw;
+  max-width: none;
+  height: 100%;
+  margin: 0;
+}
+.modal-fullscreen .modal-content {
+  height: 100%;
+  border: 0;
+  border-radius: 0;
+}
+.modal-fullscreen .modal-header {
+  border-radius: 0;
+}
+.modal-fullscreen .modal-body {
+  overflow-y: auto;
+}
+.modal-fullscreen .modal-footer {
+  border-radius: 0;
+}
+
+@media (max-width: 575.98px) {
+  .modal-fullscreen-sm-down {
+    width: 100vw;
+    max-width: none;
+    height: 100%;
+    margin: 0;
+  }
+  .modal-fullscreen-sm-down .modal-content {
+    height: 100%;
+    border: 0;
+    border-radius: 0;
+  }
+  .modal-fullscreen-sm-down .modal-header {
+    border-radius: 0;
+  }
+  .modal-fullscreen-sm-down .modal-body {
+    overflow-y: auto;
+  }
+  .modal-fullscreen-sm-down .modal-footer {
+    border-radius: 0;
+  }
+}
+@media (max-width: 767.98px) {
+  .modal-fullscreen-md-down {
+    width: 100vw;
+    max-width: none;
+    height: 100%;
+    margin: 0;
+  }
+  .modal-fullscreen-md-down .modal-content {
+    height: 100%;
+    border: 0;
+    border-radius: 0;
+  }
+  .modal-fullscreen-md-down .modal-header {
+    border-radius: 0;
+  }
+  .modal-fullscreen-md-down .modal-body {
+    overflow-y: auto;
+  }
+  .modal-fullscreen-md-down .modal-footer {
+    border-radius: 0;
+  }
+}
+@media (max-width: 991.98px) {
+  .modal-fullscreen-lg-down {
+    width: 100vw;
+    max-width: none;
+    height: 100%;
+    margin: 0;
+  }
+  .modal-fullscreen-lg-down .modal-content {
+    height: 100%;
+    border: 0;
+    border-radius: 0;
+  }
+  .modal-fullscreen-lg-down .modal-header {
+    border-radius: 0;
+  }
+  .modal-fullscreen-lg-down .modal-body {
+    overflow-y: auto;
+  }
+  .modal-fullscreen-lg-down .modal-footer {
+    border-radius: 0;
+  }
+}
+@media (max-width: 1199.98px) {
+  .modal-fullscreen-xl-down {
+    width: 100vw;
+    max-width: none;
+    height: 100%;
+    margin: 0;
+  }
+  .modal-fullscreen-xl-down .modal-content {
+    height: 100%;
+    border: 0;
+    border-radius: 0;
+  }
+  .modal-fullscreen-xl-down .modal-header {
+    border-radius: 0;
+  }
+  .modal-fullscreen-xl-down .modal-body {
+    overflow-y: auto;
+  }
+  .modal-fullscreen-xl-down .modal-footer {
+    border-radius: 0;
+  }
+}
+@media (max-width: 1399.98px) {
+  .modal-fullscreen-xxl-down {
+    width: 100vw;
+    max-width: none;
+    height: 100%;
+    margin: 0;
+  }
+  .modal-fullscreen-xxl-down .modal-content {
+    height: 100%;
+    border: 0;
+    border-radius: 0;
+  }
+  .modal-fullscreen-xxl-down .modal-header {
+    border-radius: 0;
+  }
+  .modal-fullscreen-xxl-down .modal-body {
+    overflow-y: auto;
+  }
+  .modal-fullscreen-xxl-down .modal-footer {
+    border-radius: 0;
+  }
+}
+.tooltip {
+  position: absolute;
+  z-index: 1080;
+  display: block;
+  margin: 0;
+  font-family: var(--bs-font-sans-serif);
+  font-style: normal;
+  font-weight: 400;
+  line-height: 1.5;
+  text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  letter-spacing: normal;
+  word-break: normal;
+  word-spacing: normal;
+  white-space: normal;
+  line-break: auto;
+  font-size: 0.875rem;
+  word-wrap: break-word;
+  opacity: 0;
+}
+.tooltip.show {
+  opacity: 0.9;
+}
+.tooltip .tooltip-arrow {
+  position: absolute;
+  display: block;
+  width: 0.8rem;
+  height: 0.4rem;
+}
+.tooltip .tooltip-arrow::before {
+  position: absolute;
+  content: "";
+  border-color: transparent;
+  border-style: solid;
+}
+
+.bs-tooltip-top, .bs-tooltip-auto[data-popper-placement^=top] {
+  padding: 0.4rem 0;
+}
+.bs-tooltip-top .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow {
+  bottom: 0;
+}
+.bs-tooltip-top .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=top] .tooltip-arrow::before {
+  top: -1px;
+  border-width: 0.4rem 0.4rem 0;
+  border-top-color: #000;
+}
+
+.bs-tooltip-end, .bs-tooltip-auto[data-popper-placement^=right] {
+  padding: 0 0.4rem;
+}
+.bs-tooltip-end .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow {
+  left: 0;
+  width: 0.4rem;
+  height: 0.8rem;
+}
+.bs-tooltip-end .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=right] .tooltip-arrow::before {
+  right: -1px;
+  border-width: 0.4rem 0.4rem 0.4rem 0;
+  border-right-color: #000;
+}
+
+.bs-tooltip-bottom, .bs-tooltip-auto[data-popper-placement^=bottom] {
+  padding: 0.4rem 0;
+}
+.bs-tooltip-bottom .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow {
+  top: 0;
+}
+.bs-tooltip-bottom .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=bottom] .tooltip-arrow::before {
+  bottom: -1px;
+  border-width: 0 0.4rem 0.4rem;
+  border-bottom-color: #000;
+}
+
+.bs-tooltip-start, .bs-tooltip-auto[data-popper-placement^=left] {
+  padding: 0 0.4rem;
+}
+.bs-tooltip-start .tooltip-arrow, .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow {
+  right: 0;
+  width: 0.4rem;
+  height: 0.8rem;
+}
+.bs-tooltip-start .tooltip-arrow::before, .bs-tooltip-auto[data-popper-placement^=left] .tooltip-arrow::before {
+  left: -1px;
+  border-width: 0.4rem 0 0.4rem 0.4rem;
+  border-left-color: #000;
+}
+
+.tooltip-inner {
+  max-width: 200px;
+  padding: 0.25rem 0.5rem;
+  color: #fff;
+  text-align: center;
+  background-color: #000;
+  border-radius: 0.25rem;
+}
+
+.popover {
+  position: absolute;
+  top: 0;
+  left: 0 /* rtl:ignore */;
+  z-index: 1070;
+  display: block;
+  max-width: 276px;
+  font-family: var(--bs-font-sans-serif);
+  font-style: normal;
+  font-weight: 400;
+  line-height: 1.5;
+  text-align: left;
+  text-align: start;
+  text-decoration: none;
+  text-shadow: none;
+  text-transform: none;
+  letter-spacing: normal;
+  word-break: normal;
+  word-spacing: normal;
+  white-space: normal;
+  line-break: auto;
+  font-size: 0.875rem;
+  word-wrap: break-word;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 1px solid rgba(0, 0, 0, 0.2);
+  border-radius: 0.3rem;
+}
+.popover .popover-arrow {
+  position: absolute;
+  display: block;
+  width: 1rem;
+  height: 0.5rem;
+}
+.popover .popover-arrow::before, .popover .popover-arrow::after {
+  position: absolute;
+  display: block;
+  content: "";
+  border-color: transparent;
+  border-style: solid;
+}
+
+.bs-popover-top > .popover-arrow, .bs-popover-auto[data-popper-placement^=top] > .popover-arrow {
+  bottom: calc(-0.5rem - 1px);
+}
+.bs-popover-top > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=top] > .popover-arrow::before {
+  bottom: 0;
+  border-width: 0.5rem 0.5rem 0;
+  border-top-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-top > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=top] > .popover-arrow::after {
+  bottom: 1px;
+  border-width: 0.5rem 0.5rem 0;
+  border-top-color: #fff;
+}
+
+.bs-popover-end > .popover-arrow, .bs-popover-auto[data-popper-placement^=right] > .popover-arrow {
+  left: calc(-0.5rem - 1px);
+  width: 0.5rem;
+  height: 1rem;
+}
+.bs-popover-end > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=right] > .popover-arrow::before {
+  left: 0;
+  border-width: 0.5rem 0.5rem 0.5rem 0;
+  border-right-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-end > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=right] > .popover-arrow::after {
+  left: 1px;
+  border-width: 0.5rem 0.5rem 0.5rem 0;
+  border-right-color: #fff;
+}
+
+.bs-popover-bottom > .popover-arrow, .bs-popover-auto[data-popper-placement^=bottom] > .popover-arrow {
+  top: calc(-0.5rem - 1px);
+}
+.bs-popover-bottom > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=bottom] > .popover-arrow::before {
+  top: 0;
+  border-width: 0 0.5rem 0.5rem 0.5rem;
+  border-bottom-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-bottom > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=bottom] > .popover-arrow::after {
+  top: 1px;
+  border-width: 0 0.5rem 0.5rem 0.5rem;
+  border-bottom-color: #fff;
+}
+.bs-popover-bottom .popover-header::before, .bs-popover-auto[data-popper-placement^=bottom] .popover-header::before {
+  position: absolute;
+  top: 0;
+  left: 50%;
+  display: block;
+  width: 1rem;
+  margin-left: -0.5rem;
+  content: "";
+  border-bottom: 1px solid #f0f0f0;
+}
+
+.bs-popover-start > .popover-arrow, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow {
+  right: calc(-0.5rem - 1px);
+  width: 0.5rem;
+  height: 1rem;
+}
+.bs-popover-start > .popover-arrow::before, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow::before {
+  right: 0;
+  border-width: 0.5rem 0 0.5rem 0.5rem;
+  border-left-color: rgba(0, 0, 0, 0.25);
+}
+.bs-popover-start > .popover-arrow::after, .bs-popover-auto[data-popper-placement^=left] > .popover-arrow::after {
+  right: 1px;
+  border-width: 0.5rem 0 0.5rem 0.5rem;
+  border-left-color: #fff;
+}
+
+.popover-header {
+  padding: 0.5rem 1rem;
+  margin-bottom: 0;
+  font-size: 1rem;
+  background-color: #f0f0f0;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+  border-top-left-radius: calc(0.3rem - 1px);
+  border-top-right-radius: calc(0.3rem - 1px);
+}
+.popover-header:empty {
+  display: none;
+}
+
+.popover-body {
+  padding: 1rem 1rem;
+  color: #212529;
+}
+
+.carousel {
+  position: relative;
+}
+
+.carousel.pointer-event {
+  touch-action: pan-y;
+}
+
+.carousel-inner {
+  position: relative;
+  width: 100%;
+  overflow: hidden;
+}
+.carousel-inner::after {
+  display: block;
+  clear: both;
+  content: "";
+}
+
+.carousel-item {
+  position: relative;
+  display: none;
+  float: left;
+  width: 100%;
+  margin-right: -100%;
+  -webkit-backface-visibility: hidden;
+  backface-visibility: hidden;
+  transition: transform 0.6s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-item {
+    transition: none;
+  }
+}
+
+.carousel-item.active,
+.carousel-item-next,
+.carousel-item-prev {
+  display: block;
+}
+
+/* rtl:begin:ignore */
+.carousel-item-next:not(.carousel-item-start),
+.active.carousel-item-end {
+  transform: translateX(100%);
+}
+
+.carousel-item-prev:not(.carousel-item-end),
+.active.carousel-item-start {
+  transform: translateX(-100%);
+}
+
+/* rtl:end:ignore */
+.carousel-fade .carousel-item {
+  opacity: 0;
+  transition-property: opacity;
+  transform: none;
+}
+.carousel-fade .carousel-item.active,
+.carousel-fade .carousel-item-next.carousel-item-start,
+.carousel-fade .carousel-item-prev.carousel-item-end {
+  z-index: 1;
+  opacity: 1;
+}
+.carousel-fade .active.carousel-item-start,
+.carousel-fade .active.carousel-item-end {
+  z-index: 0;
+  opacity: 0;
+  transition: opacity 0s 0.6s;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-fade .active.carousel-item-start,
+.carousel-fade .active.carousel-item-end {
+    transition: none;
+  }
+}
+
+.carousel-control-prev,
+.carousel-control-next {
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  z-index: 1;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 15%;
+  padding: 0;
+  color: #fff;
+  text-align: center;
+  background: none;
+  border: 0;
+  opacity: 0.5;
+  transition: opacity 0.15s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-control-prev,
+.carousel-control-next {
+    transition: none;
+  }
+}
+.carousel-control-prev:hover, .carousel-control-prev:focus,
+.carousel-control-next:hover,
+.carousel-control-next:focus {
+  color: #fff;
+  text-decoration: none;
+  outline: 0;
+  opacity: 0.9;
+}
+
+.carousel-control-prev {
+  left: 0;
+}
+
+.carousel-control-next {
+  right: 0;
+}
+
+.carousel-control-prev-icon,
+.carousel-control-next-icon {
+  display: inline-block;
+  width: 2rem;
+  height: 2rem;
+  background-repeat: no-repeat;
+  background-position: 50%;
+  background-size: 100% 100%;
+}
+
+/* rtl:options: {
+  "autoRename": true,
+  "stringMap":[ {
+    "name"    : "prev-next",
+    "search"  : "prev",
+    "replace" : "next"
+  } ]
+} */
+.carousel-control-prev-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z'/%3e%3c/svg%3e");
+}
+
+.carousel-control-next-icon {
+  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
+}
+
+.carousel-indicators {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 2;
+  display: flex;
+  justify-content: center;
+  padding: 0;
+  margin-right: 15%;
+  margin-bottom: 1rem;
+  margin-left: 15%;
+  list-style: none;
+}
+.carousel-indicators [data-bs-target] {
+  box-sizing: content-box;
+  flex: 0 1 auto;
+  width: 30px;
+  height: 3px;
+  padding: 0;
+  margin-right: 3px;
+  margin-left: 3px;
+  text-indent: -999px;
+  cursor: pointer;
+  background-color: #fff;
+  background-clip: padding-box;
+  border: 0;
+  border-top: 10px solid transparent;
+  border-bottom: 10px solid transparent;
+  opacity: 0.5;
+  transition: opacity 0.6s ease;
+}
+@media (prefers-reduced-motion: reduce) {
+  .carousel-indicators [data-bs-target] {
+    transition: none;
+  }
+}
+.carousel-indicators .active {
+  opacity: 1;
+}
+
+.carousel-caption {
+  position: absolute;
+  right: 15%;
+  bottom: 1.25rem;
+  left: 15%;
+  padding-top: 1.25rem;
+  padding-bottom: 1.25rem;
+  color: #fff;
+  text-align: center;
+}
+
+.carousel-dark .carousel-control-prev-icon,
+.carousel-dark .carousel-control-next-icon {
+  filter: invert(1) grayscale(100);
+}
+.carousel-dark .carousel-indicators [data-bs-target] {
+  background-color: #000;
+}
+.carousel-dark .carousel-caption {
+  color: #000;
+}
+
+@-webkit-keyframes spinner-border {
+  to {
+    transform: rotate(360deg) /* rtl:ignore */;
+  }
+}
+
+@keyframes spinner-border {
+  to {
+    transform: rotate(360deg) /* rtl:ignore */;
+  }
+}
+.spinner-border {
+  display: inline-block;
+  width: 2rem;
+  height: 2rem;
+  vertical-align: -0.125em;
+  border: 0.25em solid currentColor;
+  border-right-color: transparent;
+  border-radius: 50%;
+  -webkit-animation: 0.75s linear infinite spinner-border;
+  animation: 0.75s linear infinite spinner-border;
+}
+
+.spinner-border-sm {
+  width: 1rem;
+  height: 1rem;
+  border-width: 0.2em;
+}
+
+@-webkit-keyframes spinner-grow {
+  0% {
+    transform: scale(0);
+  }
+  50% {
+    opacity: 1;
+    transform: none;
+  }
+}
+
+@keyframes spinner-grow {
+  0% {
+    transform: scale(0);
+  }
+  50% {
+    opacity: 1;
+    transform: none;
+  }
+}
+.spinner-grow {
+  display: inline-block;
+  width: 2rem;
+  height: 2rem;
+  vertical-align: -0.125em;
+  background-color: currentColor;
+  border-radius: 50%;
+  opacity: 0;
+  -webkit-animation: 0.75s linear infinite spinner-grow;
+  animation: 0.75s linear infinite spinner-grow;
+}
+
+.spinner-grow-sm {
+  width: 1rem;
+  height: 1rem;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .spinner-border,
+.spinner-grow {
+    -webkit-animation-duration: 1.5s;
+    animation-duration: 1.5s;
+  }
+}
+.offcanvas {
+  position: fixed;
+  bottom: 0;
+  z-index: 1045;
+  display: flex;
+  flex-direction: column;
+  max-width: 100%;
+  visibility: hidden;
+  background-color: #fff;
+  background-clip: padding-box;
+  outline: 0;
+  transition: transform 0.3s ease-in-out;
+}
+@media (prefers-reduced-motion: reduce) {
+  .offcanvas {
+    transition: none;
+  }
+}
+
+.offcanvas-backdrop {
+  position: fixed;
+  top: 0;
+  left: 0;
+  z-index: 1040;
+  width: 100vw;
+  height: 100vh;
+  background-color: #000;
+}
+.offcanvas-backdrop.fade {
+  opacity: 0;
+}
+.offcanvas-backdrop.show {
+  opacity: 0.5;
+}
+
+.offcanvas-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 1rem 1rem;
+}
+.offcanvas-header .btn-close {
+  padding: 0.5rem 0.5rem;
+  margin-top: -0.5rem;
+  margin-right: -0.5rem;
+  margin-bottom: -0.5rem;
+}
+
+.offcanvas-title {
+  margin-bottom: 0;
+  line-height: 1.5;
+}
+
+.offcanvas-body {
+  flex-grow: 1;
+  padding: 1rem 1rem;
+  overflow-y: auto;
+}
+
+.offcanvas-start {
+  top: 0;
+  left: 0;
+  width: 400px;
+  border-right: 1px solid rgba(0, 0, 0, 0.2);
+  transform: translateX(-100%);
+}
+
+.offcanvas-end {
+  top: 0;
+  right: 0;
+  width: 400px;
+  border-left: 1px solid rgba(0, 0, 0, 0.2);
+  transform: translateX(100%);
+}
+
+.offcanvas-top {
+  top: 0;
+  right: 0;
+  left: 0;
+  height: 30vh;
+  max-height: 100%;
+  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
+  transform: translateY(-100%);
+}
+
+.offcanvas-bottom {
+  right: 0;
+  left: 0;
+  height: 30vh;
+  max-height: 100%;
+  border-top: 1px solid rgba(0, 0, 0, 0.2);
+  transform: translateY(100%);
+}
+
+.offcanvas.show {
+  transform: none;
+}
+
+.placeholder {
+  display: inline-block;
+  min-height: 1em;
+  vertical-align: middle;
+  cursor: wait;
+  background-color: currentColor;
+  opacity: 0.5;
+}
+.placeholder.btn::before {
+  display: inline-block;
+  content: "";
+}
+
+.placeholder-xs {
+  min-height: 0.6em;
+}
+
+.placeholder-sm {
+  min-height: 0.8em;
+}
+
+.placeholder-lg {
+  min-height: 1.2em;
+}
+
+.placeholder-glow .placeholder {
+  -webkit-animation: placeholder-glow 2s ease-in-out infinite;
+  animation: placeholder-glow 2s ease-in-out infinite;
+}
+
+@-webkit-keyframes placeholder-glow {
+  50% {
+    opacity: 0.2;
+  }
+}
+
+@keyframes placeholder-glow {
+  50% {
+    opacity: 0.2;
+  }
+}
+.placeholder-wave {
+  -webkit-mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
+  mask-image: linear-gradient(130deg, #000 55%, rgba(0, 0, 0, 0.8) 75%, #000 95%);
+  -webkit-mask-size: 200% 100%;
+  mask-size: 200% 100%;
+  -webkit-animation: placeholder-wave 2s linear infinite;
+  animation: placeholder-wave 2s linear infinite;
+}
+
+@-webkit-keyframes placeholder-wave {
+  100% {
+    -webkit-mask-position: -200% 0%;
+    mask-position: -200% 0%;
+  }
+}
+
+@keyframes placeholder-wave {
+  100% {
+    -webkit-mask-position: -200% 0%;
+    mask-position: -200% 0%;
+  }
+}
+.clearfix::after {
+  display: block;
+  clear: both;
+  content: "";
+}
+
+.link-primary {
+  color: #0d6efd;
+}
+.link-primary:hover, .link-primary:focus {
+  color: #0a58ca;
+}
+
+.link-secondary {
+  color: #6c757d;
+}
+.link-secondary:hover, .link-secondary:focus {
+  color: #565e64;
+}
+
+.link-success {
+  color: #198754;
+}
+.link-success:hover, .link-success:focus {
+  color: #146c43;
+}
+
+.link-info {
+  color: #0dcaf0;
+}
+.link-info:hover, .link-info:focus {
+  color: #3dd5f3;
+}
+
+.link-warning {
+  color: #ffc107;
+}
+.link-warning:hover, .link-warning:focus {
+  color: #ffcd39;
+}
+
+.link-danger {
+  color: #dc3545;
+}
+.link-danger:hover, .link-danger:focus {
+  color: #b02a37;
+}
+
+.link-light {
+  color: #f8f9fa;
+}
+.link-light:hover, .link-light:focus {
+  color: #f9fafb;
+}
+
+.link-dark {
+  color: #212529;
+}
+.link-dark:hover, .link-dark:focus {
+  color: #1a1e21;
+}
+
+.ratio {
+  position: relative;
+  width: 100%;
+}
+.ratio::before {
+  display: block;
+  padding-top: var(--bs-aspect-ratio);
+  content: "";
+}
+.ratio > * {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.ratio-1x1 {
+  --bs-aspect-ratio: 100%;
+}
+
+.ratio-4x3 {
+  --bs-aspect-ratio: 75%;
+}
+
+.ratio-16x9 {
+  --bs-aspect-ratio: 56.25%;
+}
+
+.ratio-21x9 {
+  --bs-aspect-ratio: 42.8571428571%;
+}
+
+.fixed-top {
+  position: fixed;
+  top: 0;
+  right: 0;
+  left: 0;
+  z-index: 1030;
+}
+
+.fixed-bottom {
+  position: fixed;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1030;
+}
+
+.sticky-top {
+  position: -webkit-sticky;
+  position: sticky;
+  top: 0;
+  z-index: 1020;
+}
+
+@media (min-width: 576px) {
+  .sticky-sm-top {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 768px) {
+  .sticky-md-top {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 992px) {
+  .sticky-lg-top {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 1200px) {
+  .sticky-xl-top {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+}
+@media (min-width: 1400px) {
+  .sticky-xxl-top {
+    position: -webkit-sticky;
+    position: sticky;
+    top: 0;
+    z-index: 1020;
+  }
+}
+.hstack {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  align-self: stretch;
+}
+
+.vstack {
+  display: flex;
+  flex: 1 1 auto;
+  flex-direction: column;
+  align-self: stretch;
+}
+
+.visually-hidden,
+.visually-hidden-focusable:not(:focus):not(:focus-within) {
+  position: absolute !important;
+  width: 1px !important;
+  height: 1px !important;
+  padding: 0 !important;
+  margin: -1px !important;
+  overflow: hidden !important;
+  clip: rect(0, 0, 0, 0) !important;
+  white-space: nowrap !important;
+  border: 0 !important;
+}
+
+.stretched-link::after {
+  position: absolute;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1;
+  content: "";
+}
+
+.text-truncate {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.vr {
+  display: inline-block;
+  align-self: stretch;
+  width: 1px;
+  min-height: 1em;
+  background-color: currentColor;
+  opacity: 0.25;
+}
+
+.align-baseline {
+  vertical-align: baseline !important;
+}
+
+.align-top {
+  vertical-align: top !important;
+}
+
+.align-middle {
+  vertical-align: middle !important;
+}
+
+.align-bottom {
+  vertical-align: bottom !important;
+}
+
+.align-text-bottom {
+  vertical-align: text-bottom !important;
+}
+
+.align-text-top {
+  vertical-align: text-top !important;
+}
+
+.float-start {
+  float: left !important;
+}
+
+.float-end {
+  float: right !important;
+}
+
+.float-none {
+  float: none !important;
+}
+
+.opacity-0 {
+  opacity: 0 !important;
+}
+
+.opacity-25 {
+  opacity: 0.25 !important;
+}
+
+.opacity-50 {
+  opacity: 0.5 !important;
+}
+
+.opacity-75 {
+  opacity: 0.75 !important;
+}
+
+.opacity-100 {
+  opacity: 1 !important;
+}
+
+.overflow-auto {
+  overflow: auto !important;
+}
+
+.overflow-hidden {
+  overflow: hidden !important;
+}
+
+.overflow-visible {
+  overflow: visible !important;
+}
+
+.overflow-scroll {
+  overflow: scroll !important;
+}
+
+.d-inline {
+  display: inline !important;
+}
+
+.d-inline-block {
+  display: inline-block !important;
+}
+
+.d-block {
+  display: block !important;
+}
+
+.d-grid {
+  display: grid !important;
+}
+
+.d-table {
+  display: table !important;
+}
+
+.d-table-row {
+  display: table-row !important;
+}
+
+.d-table-cell {
+  display: table-cell !important;
+}
+
+.d-flex {
+  display: flex !important;
+}
+
+.d-inline-flex {
+  display: inline-flex !important;
+}
+
+.d-none {
+  display: none !important;
+}
+
+.shadow {
+  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
+}
+
+.shadow-sm {
+  box-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.075) !important;
+}
+
+.shadow-lg {
+  box-shadow: 0 1rem 3rem rgba(0, 0, 0, 0.175) !important;
+}
+
+.shadow-none {
+  box-shadow: none !important;
+}
+
+.position-static {
+  position: static !important;
+}
+
+.position-relative {
+  position: relative !important;
+}
+
+.position-absolute {
+  position: absolute !important;
+}
+
+.position-fixed {
+  position: fixed !important;
+}
+
+.position-sticky {
+  position: -webkit-sticky !important;
+  position: sticky !important;
+}
+
+.top-0 {
+  top: 0 !important;
+}
+
+.top-50 {
+  top: 50% !important;
+}
+
+.top-100 {
+  top: 100% !important;
+}
+
+.bottom-0 {
+  bottom: 0 !important;
+}
+
+.bottom-50 {
+  bottom: 50% !important;
+}
+
+.bottom-100 {
+  bottom: 100% !important;
+}
+
+.start-0 {
+  left: 0 !important;
+}
+
+.start-50 {
+  left: 50% !important;
+}
+
+.start-100 {
+  left: 100% !important;
+}
+
+.end-0 {
+  right: 0 !important;
+}
+
+.end-50 {
+  right: 50% !important;
+}
+
+.end-100 {
+  right: 100% !important;
+}
+
+.translate-middle {
+  transform: translate(-50%, -50%) !important;
+}
+
+.translate-middle-x {
+  transform: translateX(-50%) !important;
+}
+
+.translate-middle-y {
+  transform: translateY(-50%) !important;
+}
+
+.border {
+  border: 1px solid #dee2e6 !important;
+}
+
+.border-0 {
+  border: 0 !important;
+}
+
+.border-top {
+  border-top: 1px solid #dee2e6 !important;
+}
+
+.border-top-0 {
+  border-top: 0 !important;
+}
+
+.border-end {
+  border-right: 1px solid #dee2e6 !important;
+}
+
+.border-end-0 {
+  border-right: 0 !important;
+}
+
+.border-bottom {
+  border-bottom: 1px solid #dee2e6 !important;
+}
+
+.border-bottom-0 {
+  border-bottom: 0 !important;
+}
+
+.border-start {
+  border-left: 1px solid #dee2e6 !important;
+}
+
+.border-start-0 {
+  border-left: 0 !important;
+}
+
+.border-primary {
+  border-color: #0d6efd !important;
+}
+
+.border-secondary {
+  border-color: #6c757d !important;
+}
+
+.border-success {
+  border-color: #198754 !important;
+}
+
+.border-info {
+  border-color: #0dcaf0 !important;
+}
+
+.border-warning {
+  border-color: #ffc107 !important;
+}
+
+.border-danger {
+  border-color: #dc3545 !important;
+}
+
+.border-light {
+  border-color: #f8f9fa !important;
+}
+
+.border-dark {
+  border-color: #212529 !important;
+}
+
+.border-white {
+  border-color: #fff !important;
+}
+
+.border-1 {
+  border-width: 1px !important;
+}
+
+.border-2 {
+  border-width: 2px !important;
+}
+
+.border-3 {
+  border-width: 3px !important;
+}
+
+.border-4 {
+  border-width: 4px !important;
+}
+
+.border-5 {
+  border-width: 5px !important;
+}
+
+.w-25 {
+  width: 25% !important;
+}
+
+.w-50 {
+  width: 50% !important;
+}
+
+.w-75 {
+  width: 75% !important;
+}
+
+.w-100 {
+  width: 100% !important;
+}
+
+.w-auto {
+  width: auto !important;
+}
+
+.mw-100 {
+  max-width: 100% !important;
+}
+
+.vw-100 {
+  width: 100vw !important;
+}
+
+.min-vw-100 {
+  min-width: 100vw !important;
+}
+
+.h-25 {
+  height: 25% !important;
+}
+
+.h-50 {
+  height: 50% !important;
+}
+
+.h-75 {
+  height: 75% !important;
+}
+
+.h-100 {
+  height: 100% !important;
+}
+
+.h-auto {
+  height: auto !important;
+}
+
+.mh-100 {
+  max-height: 100% !important;
+}
+
+.vh-100 {
+  height: 100vh !important;
+}
+
+.min-vh-100 {
+  min-height: 100vh !important;
+}
+
+.flex-fill {
+  flex: 1 1 auto !important;
+}
+
+.flex-row {
+  flex-direction: row !important;
+}
+
+.flex-column {
+  flex-direction: column !important;
+}
+
+.flex-row-reverse {
+  flex-direction: row-reverse !important;
+}
+
+.flex-column-reverse {
+  flex-direction: column-reverse !important;
+}
+
+.flex-grow-0 {
+  flex-grow: 0 !important;
+}
+
+.flex-grow-1 {
+  flex-grow: 1 !important;
+}
+
+.flex-shrink-0 {
+  flex-shrink: 0 !important;
+}
+
+.flex-shrink-1 {
+  flex-shrink: 1 !important;
+}
+
+.flex-wrap {
+  flex-wrap: wrap !important;
+}
+
+.flex-nowrap {
+  flex-wrap: nowrap !important;
+}
+
+.flex-wrap-reverse {
+  flex-wrap: wrap-reverse !important;
+}
+
+.gap-0 {
+  gap: 0 !important;
+}
+
+.gap-1 {
+  gap: 0.25rem !important;
+}
+
+.gap-2 {
+  gap: 0.5rem !important;
+}
+
+.gap-3 {
+  gap: 1rem !important;
+}
+
+.gap-4 {
+  gap: 1.5rem !important;
+}
+
+.gap-5 {
+  gap: 3rem !important;
+}
+
+.justify-content-start {
+  justify-content: flex-start !important;
+}
+
+.justify-content-end {
+  justify-content: flex-end !important;
+}
+
+.justify-content-center {
+  justify-content: center !important;
+}
+
+.justify-content-between {
+  justify-content: space-between !important;
+}
+
+.justify-content-around {
+  justify-content: space-around !important;
+}
+
+.justify-content-evenly {
+  justify-content: space-evenly !important;
+}
+
+.align-items-start {
+  align-items: flex-start !important;
+}
+
+.align-items-end {
+  align-items: flex-end !important;
+}
+
+.align-items-center {
+  align-items: center !important;
+}
+
+.align-items-baseline {
+  align-items: baseline !important;
+}
+
+.align-items-stretch {
+  align-items: stretch !important;
+}
+
+.align-content-start {
+  align-content: flex-start !important;
+}
+
+.align-content-end {
+  align-content: flex-end !important;
+}
+
+.align-content-center {
+  align-content: center !important;
+}
+
+.align-content-between {
+  align-content: space-between !important;
+}
+
+.align-content-around {
+  align-content: space-around !important;
+}
+
+.align-content-stretch {
+  align-content: stretch !important;
+}
+
+.align-self-auto {
+  align-self: auto !important;
+}
+
+.align-self-start {
+  align-self: flex-start !important;
+}
+
+.align-self-end {
+  align-self: flex-end !important;
+}
+
+.align-self-center {
+  align-self: center !important;
+}
+
+.align-self-baseline {
+  align-self: baseline !important;
+}
+
+.align-self-stretch {
+  align-self: stretch !important;
+}
+
+.order-first {
+  order: -1 !important;
+}
+
+.order-0 {
+  order: 0 !important;
+}
+
+.order-1 {
+  order: 1 !important;
+}
+
+.order-2 {
+  order: 2 !important;
+}
+
+.order-3 {
+  order: 3 !important;
+}
+
+.order-4 {
+  order: 4 !important;
+}
+
+.order-5 {
+  order: 5 !important;
+}
+
+.order-last {
+  order: 6 !important;
+}
+
+.m-0 {
+  margin: 0 !important;
+}
+
+.m-1 {
+  margin: 0.25rem !important;
+}
+
+.m-2 {
+  margin: 0.5rem !important;
+}
+
+.m-3 {
+  margin: 1rem !important;
+}
+
+.m-4 {
+  margin: 1.5rem !important;
+}
+
+.m-5 {
+  margin: 3rem !important;
+}
+
+.m-auto {
+  margin: auto !important;
+}
+
+.mx-0 {
+  margin-right: 0 !important;
+  margin-left: 0 !important;
+}
+
+.mx-1 {
+  margin-right: 0.25rem !important;
+  margin-left: 0.25rem !important;
+}
+
+.mx-2 {
+  margin-right: 0.5rem !important;
+  margin-left: 0.5rem !important;
+}
+
+.mx-3 {
+  margin-right: 1rem !important;
+  margin-left: 1rem !important;
+}
+
+.mx-4 {
+  margin-right: 1.5rem !important;
+  margin-left: 1.5rem !important;
+}
+
+.mx-5 {
+  margin-right: 3rem !important;
+  margin-left: 3rem !important;
+}
+
+.mx-auto {
+  margin-right: auto !important;
+  margin-left: auto !important;
+}
+
+.my-0 {
+  margin-top: 0 !important;
+  margin-bottom: 0 !important;
+}
+
+.my-1 {
+  margin-top: 0.25rem !important;
+  margin-bottom: 0.25rem !important;
+}
+
+.my-2 {
+  margin-top: 0.5rem !important;
+  margin-bottom: 0.5rem !important;
+}
+
+.my-3 {
+  margin-top: 1rem !important;
+  margin-bottom: 1rem !important;
+}
+
+.my-4 {
+  margin-top: 1.5rem !important;
+  margin-bottom: 1.5rem !important;
+}
+
+.my-5 {
+  margin-top: 3rem !important;
+  margin-bottom: 3rem !important;
+}
+
+.my-auto {
+  margin-top: auto !important;
+  margin-bottom: auto !important;
+}
+
+.mt-0 {
+  margin-top: 0 !important;
+}
+
+.mt-1 {
+  margin-top: 0.25rem !important;
+}
+
+.mt-2 {
+  margin-top: 0.5rem !important;
+}
+
+.mt-3 {
+  margin-top: 1rem !important;
+}
+
+.mt-4 {
+  margin-top: 1.5rem !important;
+}
+
+.mt-5 {
+  margin-top: 3rem !important;
+}
+
+.mt-auto {
+  margin-top: auto !important;
+}
+
+.me-0 {
+  margin-right: 0 !important;
+}
+
+.me-1 {
+  margin-right: 0.25rem !important;
+}
+
+.me-2 {
+  margin-right: 0.5rem !important;
+}
+
+.me-3 {
+  margin-right: 1rem !important;
+}
+
+.me-4 {
+  margin-right: 1.5rem !important;
+}
+
+.me-5 {
+  margin-right: 3rem !important;
+}
+
+.me-auto {
+  margin-right: auto !important;
+}
+
+.mb-0 {
+  margin-bottom: 0 !important;
+}
+
+.mb-1 {
+  margin-bottom: 0.25rem !important;
+}
+
+.mb-2 {
+  margin-bottom: 0.5rem !important;
+}
+
+.mb-3 {
+  margin-bottom: 1rem !important;
+}
+
+.mb-4 {
+  margin-bottom: 1.5rem !important;
+}
+
+.mb-5 {
+  margin-bottom: 3rem !important;
+}
+
+.mb-auto {
+  margin-bottom: auto !important;
+}
+
+.ms-0 {
+  margin-left: 0 !important;
+}
+
+.ms-1 {
+  margin-left: 0.25rem !important;
+}
+
+.ms-2 {
+  margin-left: 0.5rem !important;
+}
+
+.ms-3 {
+  margin-left: 1rem !important;
+}
+
+.ms-4 {
+  margin-left: 1.5rem !important;
+}
+
+.ms-5 {
+  margin-left: 3rem !important;
+}
+
+.ms-auto {
+  margin-left: auto !important;
+}
+
+.p-0 {
+  padding: 0 !important;
+}
+
+.p-1 {
+  padding: 0.25rem !important;
+}
+
+.p-2 {
+  padding: 0.5rem !important;
+}
+
+.p-3 {
+  padding: 1rem !important;
+}
+
+.p-4 {
+  padding: 1.5rem !important;
+}
+
+.p-5 {
+  padding: 3rem !important;
+}
+
+.px-0 {
+  padding-right: 0 !important;
+  padding-left: 0 !important;
+}
+
+.px-1 {
+  padding-right: 0.25rem !important;
+  padding-left: 0.25rem !important;
+}
+
+.px-2 {
+  padding-right: 0.5rem !important;
+  padding-left: 0.5rem !important;
+}
+
+.px-3 {
+  padding-right: 1rem !important;
+  padding-left: 1rem !important;
+}
+
+.px-4 {
+  padding-right: 1.5rem !important;
+  padding-left: 1.5rem !important;
+}
+
+.px-5 {
+  padding-right: 3rem !important;
+  padding-left: 3rem !important;
+}
+
+.py-0 {
+  padding-top: 0 !important;
+  padding-bottom: 0 !important;
+}
+
+.py-1 {
+  padding-top: 0.25rem !important;
+  padding-bottom: 0.25rem !important;
+}
+
+.py-2 {
+  padding-top: 0.5rem !important;
+  padding-bottom: 0.5rem !important;
+}
+
+.py-3 {
+  padding-top: 1rem !important;
+  padding-bottom: 1rem !important;
+}
+
+.py-4 {
+  padding-top: 1.5rem !important;
+  padding-bottom: 1.5rem !important;
+}
+
+.py-5 {
+  padding-top: 3rem !important;
+  padding-bottom: 3rem !important;
+}
+
+.pt-0 {
+  padding-top: 0 !important;
+}
+
+.pt-1 {
+  padding-top: 0.25rem !important;
+}
+
+.pt-2 {
+  padding-top: 0.5rem !important;
+}
+
+.pt-3 {
+  padding-top: 1rem !important;
+}
+
+.pt-4 {
+  padding-top: 1.5rem !important;
+}
+
+.pt-5 {
+  padding-top: 3rem !important;
+}
+
+.pe-0 {
+  padding-right: 0 !important;
+}
+
+.pe-1 {
+  padding-right: 0.25rem !important;
+}
+
+.pe-2 {
+  padding-right: 0.5rem !important;
+}
+
+.pe-3 {
+  padding-right: 1rem !important;
+}
+
+.pe-4 {
+  padding-right: 1.5rem !important;
+}
+
+.pe-5 {
+  padding-right: 3rem !important;
+}
+
+.pb-0 {
+  padding-bottom: 0 !important;
+}
+
+.pb-1 {
+  padding-bottom: 0.25rem !important;
+}
+
+.pb-2 {
+  padding-bottom: 0.5rem !important;
+}
+
+.pb-3 {
+  padding-bottom: 1rem !important;
+}
+
+.pb-4 {
+  padding-bottom: 1.5rem !important;
+}
+
+.pb-5 {
+  padding-bottom: 3rem !important;
+}
+
+.ps-0 {
+  padding-left: 0 !important;
+}
+
+.ps-1 {
+  padding-left: 0.25rem !important;
+}
+
+.ps-2 {
+  padding-left: 0.5rem !important;
+}
+
+.ps-3 {
+  padding-left: 1rem !important;
+}
+
+.ps-4 {
+  padding-left: 1.5rem !important;
+}
+
+.ps-5 {
+  padding-left: 3rem !important;
+}
+
+.font-monospace {
+  font-family: var(--bs-font-monospace) !important;
+}
+
+.fs-1 {
+  font-size: calc(1.375rem + 1.5vw) !important;
+}
+
+.fs-2 {
+  font-size: calc(1.325rem + 0.9vw) !important;
+}
+
+.fs-3 {
+  font-size: calc(1.3rem + 0.6vw) !important;
+}
+
+.fs-4 {
+  font-size: calc(1.275rem + 0.3vw) !important;
+}
+
+.fs-5 {
+  font-size: 1.25rem !important;
+}
+
+.fs-6 {
+  font-size: 1rem !important;
+}
+
+.fst-italic {
+  font-style: italic !important;
+}
+
+.fst-normal {
+  font-style: normal !important;
+}
+
+.fw-light {
+  font-weight: 300 !important;
+}
+
+.fw-lighter {
+  font-weight: lighter !important;
+}
+
+.fw-normal {
+  font-weight: 400 !important;
+}
+
+.fw-bold {
+  font-weight: 700 !important;
+}
+
+.fw-bolder {
+  font-weight: bolder !important;
+}
+
+.lh-1 {
+  line-height: 1 !important;
+}
+
+.lh-sm {
+  line-height: 1.25 !important;
+}
+
+.lh-base {
+  line-height: 1.5 !important;
+}
+
+.lh-lg {
+  line-height: 2 !important;
+}
+
+.text-start {
+  text-align: left !important;
+}
+
+.text-end {
+  text-align: right !important;
+}
+
+.text-center {
+  text-align: center !important;
+}
+
+.text-decoration-none {
+  text-decoration: none !important;
+}
+
+.text-decoration-underline {
+  text-decoration: underline !important;
+}
+
+.text-decoration-line-through {
+  text-decoration: line-through !important;
+}
+
+.text-lowercase {
+  text-transform: lowercase !important;
+}
+
+.text-uppercase {
+  text-transform: uppercase !important;
+}
+
+.text-capitalize {
+  text-transform: capitalize !important;
+}
+
+.text-wrap {
+  white-space: normal !important;
+}
+
+.text-nowrap {
+  white-space: nowrap !important;
+}
+
+/* rtl:begin:remove */
+.text-break {
+  word-wrap: break-word !important;
+  word-break: break-word !important;
+}
+
+/* rtl:end:remove */
+.text-primary {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-primary-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-secondary {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-secondary-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-success {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-success-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-info {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-info-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-warning {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-warning-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-danger {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-danger-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-light {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-light-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-dark {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-dark-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-black {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-black-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-white {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-white-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-body {
+  --bs-text-opacity: 1;
+  color: rgba(var(--bs-body-color-rgb), var(--bs-text-opacity)) !important;
+}
+
+.text-muted {
+  --bs-text-opacity: 1;
+  color: #6c757d !important;
+}
+
+.text-black-50 {
+  --bs-text-opacity: 1;
+  color: rgba(0, 0, 0, 0.5) !important;
+}
+
+.text-white-50 {
+  --bs-text-opacity: 1;
+  color: rgba(255, 255, 255, 0.5) !important;
+}
+
+.text-reset {
+  --bs-text-opacity: 1;
+  color: inherit !important;
+}
+
+.text-opacity-25 {
+  --bs-text-opacity: 0.25;
+}
+
+.text-opacity-50 {
+  --bs-text-opacity: 0.5;
+}
+
+.text-opacity-75 {
+  --bs-text-opacity: 0.75;
+}
+
+.text-opacity-100 {
+  --bs-text-opacity: 1;
+}
+
+.bg-primary {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-primary-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-secondary {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-secondary-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-success {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-success-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-info {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-info-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-warning {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-warning-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-danger {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-danger-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-light {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-light-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-dark {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-dark-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-black {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-black-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-white {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-white-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-body {
+  --bs-bg-opacity: 1;
+  background-color: rgba(var(--bs-body-bg-rgb), var(--bs-bg-opacity)) !important;
+}
+
+.bg-transparent {
+  --bs-bg-opacity: 1;
+  background-color: transparent !important;
+}
+
+.bg-opacity-10 {
+  --bs-bg-opacity: 0.1;
+}
+
+.bg-opacity-25 {
+  --bs-bg-opacity: 0.25;
+}
+
+.bg-opacity-50 {
+  --bs-bg-opacity: 0.5;
+}
+
+.bg-opacity-75 {
+  --bs-bg-opacity: 0.75;
+}
+
+.bg-opacity-100 {
+  --bs-bg-opacity: 1;
+}
+
+.bg-gradient {
+  background-image: var(--bs-gradient) !important;
+}
+
+.user-select-all {
+  -webkit-user-select: all !important;
+  -moz-user-select: all !important;
+  user-select: all !important;
+}
+
+.user-select-auto {
+  -webkit-user-select: auto !important;
+  -moz-user-select: auto !important;
+  user-select: auto !important;
+}
+
+.user-select-none {
+  -webkit-user-select: none !important;
+  -moz-user-select: none !important;
+  user-select: none !important;
+}
+
+.pe-none {
+  pointer-events: none !important;
+}
+
+.pe-auto {
+  pointer-events: auto !important;
+}
+
+.rounded {
+  border-radius: 0.25rem !important;
+}
+
+.rounded-0 {
+  border-radius: 0 !important;
+}
+
+.rounded-1 {
+  border-radius: 0.2rem !important;
+}
+
+.rounded-2 {
+  border-radius: 0.25rem !important;
+}
+
+.rounded-3 {
+  border-radius: 0.3rem !important;
+}
+
+.rounded-circle {
+  border-radius: 50% !important;
+}
+
+.rounded-pill {
+  border-radius: 50rem !important;
+}
+
+.rounded-top {
+  border-top-left-radius: 0.25rem !important;
+  border-top-right-radius: 0.25rem !important;
+}
+
+.rounded-end {
+  border-top-right-radius: 0.25rem !important;
+  border-bottom-right-radius: 0.25rem !important;
+}
+
+.rounded-bottom {
+  border-bottom-right-radius: 0.25rem !important;
+  border-bottom-left-radius: 0.25rem !important;
+}
+
+.rounded-start {
+  border-bottom-left-radius: 0.25rem !important;
+  border-top-left-radius: 0.25rem !important;
+}
+
+.visible {
+  visibility: visible !important;
+}
+
+.invisible {
+  visibility: hidden !important;
+}
+
+@media (min-width: 576px) {
+  .float-sm-start {
+    float: left !important;
+  }
+
+  .float-sm-end {
+    float: right !important;
+  }
+
+  .float-sm-none {
+    float: none !important;
+  }
+
+  .d-sm-inline {
+    display: inline !important;
+  }
+
+  .d-sm-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-sm-block {
+    display: block !important;
+  }
+
+  .d-sm-grid {
+    display: grid !important;
+  }
+
+  .d-sm-table {
+    display: table !important;
+  }
+
+  .d-sm-table-row {
+    display: table-row !important;
+  }
+
+  .d-sm-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-sm-flex {
+    display: flex !important;
+  }
+
+  .d-sm-inline-flex {
+    display: inline-flex !important;
+  }
+
+  .d-sm-none {
+    display: none !important;
+  }
+
+  .flex-sm-fill {
+    flex: 1 1 auto !important;
+  }
+
+  .flex-sm-row {
+    flex-direction: row !important;
+  }
+
+  .flex-sm-column {
+    flex-direction: column !important;
+  }
+
+  .flex-sm-row-reverse {
+    flex-direction: row-reverse !important;
+  }
+
+  .flex-sm-column-reverse {
+    flex-direction: column-reverse !important;
+  }
+
+  .flex-sm-grow-0 {
+    flex-grow: 0 !important;
+  }
+
+  .flex-sm-grow-1 {
+    flex-grow: 1 !important;
+  }
+
+  .flex-sm-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-sm-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .flex-sm-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-sm-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-sm-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .gap-sm-0 {
+    gap: 0 !important;
+  }
+
+  .gap-sm-1 {
+    gap: 0.25rem !important;
+  }
+
+  .gap-sm-2 {
+    gap: 0.5rem !important;
+  }
+
+  .gap-sm-3 {
+    gap: 1rem !important;
+  }
+
+  .gap-sm-4 {
+    gap: 1.5rem !important;
+  }
+
+  .gap-sm-5 {
+    gap: 3rem !important;
+  }
+
+  .justify-content-sm-start {
+    justify-content: flex-start !important;
+  }
+
+  .justify-content-sm-end {
+    justify-content: flex-end !important;
+  }
+
+  .justify-content-sm-center {
+    justify-content: center !important;
+  }
+
+  .justify-content-sm-between {
+    justify-content: space-between !important;
+  }
+
+  .justify-content-sm-around {
+    justify-content: space-around !important;
+  }
+
+  .justify-content-sm-evenly {
+    justify-content: space-evenly !important;
+  }
+
+  .align-items-sm-start {
+    align-items: flex-start !important;
+  }
+
+  .align-items-sm-end {
+    align-items: flex-end !important;
+  }
+
+  .align-items-sm-center {
+    align-items: center !important;
+  }
+
+  .align-items-sm-baseline {
+    align-items: baseline !important;
+  }
+
+  .align-items-sm-stretch {
+    align-items: stretch !important;
+  }
+
+  .align-content-sm-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-sm-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-sm-center {
+    align-content: center !important;
+  }
+
+  .align-content-sm-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-sm-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-sm-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-sm-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-sm-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-sm-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-sm-center {
+    align-self: center !important;
+  }
+
+  .align-self-sm-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-sm-stretch {
+    align-self: stretch !important;
+  }
+
+  .order-sm-first {
+    order: -1 !important;
+  }
+
+  .order-sm-0 {
+    order: 0 !important;
+  }
+
+  .order-sm-1 {
+    order: 1 !important;
+  }
+
+  .order-sm-2 {
+    order: 2 !important;
+  }
+
+  .order-sm-3 {
+    order: 3 !important;
+  }
+
+  .order-sm-4 {
+    order: 4 !important;
+  }
+
+  .order-sm-5 {
+    order: 5 !important;
+  }
+
+  .order-sm-last {
+    order: 6 !important;
+  }
+
+  .m-sm-0 {
+    margin: 0 !important;
+  }
+
+  .m-sm-1 {
+    margin: 0.25rem !important;
+  }
+
+  .m-sm-2 {
+    margin: 0.5rem !important;
+  }
+
+  .m-sm-3 {
+    margin: 1rem !important;
+  }
+
+  .m-sm-4 {
+    margin: 1.5rem !important;
+  }
+
+  .m-sm-5 {
+    margin: 3rem !important;
+  }
+
+  .m-sm-auto {
+    margin: auto !important;
+  }
+
+  .mx-sm-0 {
+    margin-right: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  .mx-sm-1 {
+    margin-right: 0.25rem !important;
+    margin-left: 0.25rem !important;
+  }
+
+  .mx-sm-2 {
+    margin-right: 0.5rem !important;
+    margin-left: 0.5rem !important;
+  }
+
+  .mx-sm-3 {
+    margin-right: 1rem !important;
+    margin-left: 1rem !important;
+  }
+
+  .mx-sm-4 {
+    margin-right: 1.5rem !important;
+    margin-left: 1.5rem !important;
+  }
+
+  .mx-sm-5 {
+    margin-right: 3rem !important;
+    margin-left: 3rem !important;
+  }
+
+  .mx-sm-auto {
+    margin-right: auto !important;
+    margin-left: auto !important;
+  }
+
+  .my-sm-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+  }
+
+  .my-sm-1 {
+    margin-top: 0.25rem !important;
+    margin-bottom: 0.25rem !important;
+  }
+
+  .my-sm-2 {
+    margin-top: 0.5rem !important;
+    margin-bottom: 0.5rem !important;
+  }
+
+  .my-sm-3 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important;
+  }
+
+  .my-sm-4 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important;
+  }
+
+  .my-sm-5 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important;
+  }
+
+  .my-sm-auto {
+    margin-top: auto !important;
+    margin-bottom: auto !important;
+  }
+
+  .mt-sm-0 {
+    margin-top: 0 !important;
+  }
+
+  .mt-sm-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mt-sm-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mt-sm-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mt-sm-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mt-sm-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mt-sm-auto {
+    margin-top: auto !important;
+  }
+
+  .me-sm-0 {
+    margin-right: 0 !important;
+  }
+
+  .me-sm-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .me-sm-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .me-sm-3 {
+    margin-right: 1rem !important;
+  }
+
+  .me-sm-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .me-sm-5 {
+    margin-right: 3rem !important;
+  }
+
+  .me-sm-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-sm-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .mb-sm-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .mb-sm-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .mb-sm-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .mb-sm-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .mb-sm-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .mb-sm-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ms-sm-0 {
+    margin-left: 0 !important;
+  }
+
+  .ms-sm-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .ms-sm-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .ms-sm-3 {
+    margin-left: 1rem !important;
+  }
+
+  .ms-sm-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .ms-sm-5 {
+    margin-left: 3rem !important;
+  }
+
+  .ms-sm-auto {
+    margin-left: auto !important;
+  }
+
+  .p-sm-0 {
+    padding: 0 !important;
+  }
+
+  .p-sm-1 {
+    padding: 0.25rem !important;
+  }
+
+  .p-sm-2 {
+    padding: 0.5rem !important;
+  }
+
+  .p-sm-3 {
+    padding: 1rem !important;
+  }
+
+  .p-sm-4 {
+    padding: 1.5rem !important;
+  }
+
+  .p-sm-5 {
+    padding: 3rem !important;
+  }
+
+  .px-sm-0 {
+    padding-right: 0 !important;
+    padding-left: 0 !important;
+  }
+
+  .px-sm-1 {
+    padding-right: 0.25rem !important;
+    padding-left: 0.25rem !important;
+  }
+
+  .px-sm-2 {
+    padding-right: 0.5rem !important;
+    padding-left: 0.5rem !important;
+  }
+
+  .px-sm-3 {
+    padding-right: 1rem !important;
+    padding-left: 1rem !important;
+  }
+
+  .px-sm-4 {
+    padding-right: 1.5rem !important;
+    padding-left: 1.5rem !important;
+  }
+
+  .px-sm-5 {
+    padding-right: 3rem !important;
+    padding-left: 3rem !important;
+  }
+
+  .py-sm-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+  }
+
+  .py-sm-1 {
+    padding-top: 0.25rem !important;
+    padding-bottom: 0.25rem !important;
+  }
+
+  .py-sm-2 {
+    padding-top: 0.5rem !important;
+    padding-bottom: 0.5rem !important;
+  }
+
+  .py-sm-3 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important;
+  }
+
+  .py-sm-4 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important;
+  }
+
+  .py-sm-5 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important;
+  }
+
+  .pt-sm-0 {
+    padding-top: 0 !important;
+  }
+
+  .pt-sm-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pt-sm-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pt-sm-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pt-sm-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pt-sm-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pe-sm-0 {
+    padding-right: 0 !important;
+  }
+
+  .pe-sm-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pe-sm-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pe-sm-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pe-sm-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pe-sm-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-sm-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pb-sm-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pb-sm-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pb-sm-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pb-sm-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pb-sm-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .ps-sm-0 {
+    padding-left: 0 !important;
+  }
+
+  .ps-sm-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .ps-sm-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .ps-sm-3 {
+    padding-left: 1rem !important;
+  }
+
+  .ps-sm-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .ps-sm-5 {
+    padding-left: 3rem !important;
+  }
+
+  .text-sm-start {
+    text-align: left !important;
+  }
+
+  .text-sm-end {
+    text-align: right !important;
+  }
+
+  .text-sm-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 768px) {
+  .float-md-start {
+    float: left !important;
+  }
+
+  .float-md-end {
+    float: right !important;
+  }
+
+  .float-md-none {
+    float: none !important;
+  }
+
+  .d-md-inline {
+    display: inline !important;
+  }
+
+  .d-md-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-md-block {
+    display: block !important;
+  }
+
+  .d-md-grid {
+    display: grid !important;
+  }
+
+  .d-md-table {
+    display: table !important;
+  }
+
+  .d-md-table-row {
+    display: table-row !important;
+  }
+
+  .d-md-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-md-flex {
+    display: flex !important;
+  }
+
+  .d-md-inline-flex {
+    display: inline-flex !important;
+  }
+
+  .d-md-none {
+    display: none !important;
+  }
+
+  .flex-md-fill {
+    flex: 1 1 auto !important;
+  }
+
+  .flex-md-row {
+    flex-direction: row !important;
+  }
+
+  .flex-md-column {
+    flex-direction: column !important;
+  }
+
+  .flex-md-row-reverse {
+    flex-direction: row-reverse !important;
+  }
+
+  .flex-md-column-reverse {
+    flex-direction: column-reverse !important;
+  }
+
+  .flex-md-grow-0 {
+    flex-grow: 0 !important;
+  }
+
+  .flex-md-grow-1 {
+    flex-grow: 1 !important;
+  }
+
+  .flex-md-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-md-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .flex-md-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-md-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-md-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .gap-md-0 {
+    gap: 0 !important;
+  }
+
+  .gap-md-1 {
+    gap: 0.25rem !important;
+  }
+
+  .gap-md-2 {
+    gap: 0.5rem !important;
+  }
+
+  .gap-md-3 {
+    gap: 1rem !important;
+  }
+
+  .gap-md-4 {
+    gap: 1.5rem !important;
+  }
+
+  .gap-md-5 {
+    gap: 3rem !important;
+  }
+
+  .justify-content-md-start {
+    justify-content: flex-start !important;
+  }
+
+  .justify-content-md-end {
+    justify-content: flex-end !important;
+  }
+
+  .justify-content-md-center {
+    justify-content: center !important;
+  }
+
+  .justify-content-md-between {
+    justify-content: space-between !important;
+  }
+
+  .justify-content-md-around {
+    justify-content: space-around !important;
+  }
+
+  .justify-content-md-evenly {
+    justify-content: space-evenly !important;
+  }
+
+  .align-items-md-start {
+    align-items: flex-start !important;
+  }
+
+  .align-items-md-end {
+    align-items: flex-end !important;
+  }
+
+  .align-items-md-center {
+    align-items: center !important;
+  }
+
+  .align-items-md-baseline {
+    align-items: baseline !important;
+  }
+
+  .align-items-md-stretch {
+    align-items: stretch !important;
+  }
+
+  .align-content-md-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-md-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-md-center {
+    align-content: center !important;
+  }
+
+  .align-content-md-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-md-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-md-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-md-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-md-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-md-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-md-center {
+    align-self: center !important;
+  }
+
+  .align-self-md-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-md-stretch {
+    align-self: stretch !important;
+  }
+
+  .order-md-first {
+    order: -1 !important;
+  }
+
+  .order-md-0 {
+    order: 0 !important;
+  }
+
+  .order-md-1 {
+    order: 1 !important;
+  }
+
+  .order-md-2 {
+    order: 2 !important;
+  }
+
+  .order-md-3 {
+    order: 3 !important;
+  }
+
+  .order-md-4 {
+    order: 4 !important;
+  }
+
+  .order-md-5 {
+    order: 5 !important;
+  }
+
+  .order-md-last {
+    order: 6 !important;
+  }
+
+  .m-md-0 {
+    margin: 0 !important;
+  }
+
+  .m-md-1 {
+    margin: 0.25rem !important;
+  }
+
+  .m-md-2 {
+    margin: 0.5rem !important;
+  }
+
+  .m-md-3 {
+    margin: 1rem !important;
+  }
+
+  .m-md-4 {
+    margin: 1.5rem !important;
+  }
+
+  .m-md-5 {
+    margin: 3rem !important;
+  }
+
+  .m-md-auto {
+    margin: auto !important;
+  }
+
+  .mx-md-0 {
+    margin-right: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  .mx-md-1 {
+    margin-right: 0.25rem !important;
+    margin-left: 0.25rem !important;
+  }
+
+  .mx-md-2 {
+    margin-right: 0.5rem !important;
+    margin-left: 0.5rem !important;
+  }
+
+  .mx-md-3 {
+    margin-right: 1rem !important;
+    margin-left: 1rem !important;
+  }
+
+  .mx-md-4 {
+    margin-right: 1.5rem !important;
+    margin-left: 1.5rem !important;
+  }
+
+  .mx-md-5 {
+    margin-right: 3rem !important;
+    margin-left: 3rem !important;
+  }
+
+  .mx-md-auto {
+    margin-right: auto !important;
+    margin-left: auto !important;
+  }
+
+  .my-md-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+  }
+
+  .my-md-1 {
+    margin-top: 0.25rem !important;
+    margin-bottom: 0.25rem !important;
+  }
+
+  .my-md-2 {
+    margin-top: 0.5rem !important;
+    margin-bottom: 0.5rem !important;
+  }
+
+  .my-md-3 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important;
+  }
+
+  .my-md-4 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important;
+  }
+
+  .my-md-5 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important;
+  }
+
+  .my-md-auto {
+    margin-top: auto !important;
+    margin-bottom: auto !important;
+  }
+
+  .mt-md-0 {
+    margin-top: 0 !important;
+  }
+
+  .mt-md-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mt-md-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mt-md-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mt-md-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mt-md-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mt-md-auto {
+    margin-top: auto !important;
+  }
+
+  .me-md-0 {
+    margin-right: 0 !important;
+  }
+
+  .me-md-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .me-md-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .me-md-3 {
+    margin-right: 1rem !important;
+  }
+
+  .me-md-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .me-md-5 {
+    margin-right: 3rem !important;
+  }
+
+  .me-md-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-md-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .mb-md-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .mb-md-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .mb-md-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .mb-md-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .mb-md-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .mb-md-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ms-md-0 {
+    margin-left: 0 !important;
+  }
+
+  .ms-md-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .ms-md-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .ms-md-3 {
+    margin-left: 1rem !important;
+  }
+
+  .ms-md-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .ms-md-5 {
+    margin-left: 3rem !important;
+  }
+
+  .ms-md-auto {
+    margin-left: auto !important;
+  }
+
+  .p-md-0 {
+    padding: 0 !important;
+  }
+
+  .p-md-1 {
+    padding: 0.25rem !important;
+  }
+
+  .p-md-2 {
+    padding: 0.5rem !important;
+  }
+
+  .p-md-3 {
+    padding: 1rem !important;
+  }
+
+  .p-md-4 {
+    padding: 1.5rem !important;
+  }
+
+  .p-md-5 {
+    padding: 3rem !important;
+  }
+
+  .px-md-0 {
+    padding-right: 0 !important;
+    padding-left: 0 !important;
+  }
+
+  .px-md-1 {
+    padding-right: 0.25rem !important;
+    padding-left: 0.25rem !important;
+  }
+
+  .px-md-2 {
+    padding-right: 0.5rem !important;
+    padding-left: 0.5rem !important;
+  }
+
+  .px-md-3 {
+    padding-right: 1rem !important;
+    padding-left: 1rem !important;
+  }
+
+  .px-md-4 {
+    padding-right: 1.5rem !important;
+    padding-left: 1.5rem !important;
+  }
+
+  .px-md-5 {
+    padding-right: 3rem !important;
+    padding-left: 3rem !important;
+  }
+
+  .py-md-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+  }
+
+  .py-md-1 {
+    padding-top: 0.25rem !important;
+    padding-bottom: 0.25rem !important;
+  }
+
+  .py-md-2 {
+    padding-top: 0.5rem !important;
+    padding-bottom: 0.5rem !important;
+  }
+
+  .py-md-3 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important;
+  }
+
+  .py-md-4 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important;
+  }
+
+  .py-md-5 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important;
+  }
+
+  .pt-md-0 {
+    padding-top: 0 !important;
+  }
+
+  .pt-md-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pt-md-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pt-md-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pt-md-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pt-md-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pe-md-0 {
+    padding-right: 0 !important;
+  }
+
+  .pe-md-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pe-md-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pe-md-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pe-md-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pe-md-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-md-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pb-md-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pb-md-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pb-md-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pb-md-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pb-md-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .ps-md-0 {
+    padding-left: 0 !important;
+  }
+
+  .ps-md-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .ps-md-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .ps-md-3 {
+    padding-left: 1rem !important;
+  }
+
+  .ps-md-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .ps-md-5 {
+    padding-left: 3rem !important;
+  }
+
+  .text-md-start {
+    text-align: left !important;
+  }
+
+  .text-md-end {
+    text-align: right !important;
+  }
+
+  .text-md-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 992px) {
+  .float-lg-start {
+    float: left !important;
+  }
+
+  .float-lg-end {
+    float: right !important;
+  }
+
+  .float-lg-none {
+    float: none !important;
+  }
+
+  .d-lg-inline {
+    display: inline !important;
+  }
+
+  .d-lg-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-lg-block {
+    display: block !important;
+  }
+
+  .d-lg-grid {
+    display: grid !important;
+  }
+
+  .d-lg-table {
+    display: table !important;
+  }
+
+  .d-lg-table-row {
+    display: table-row !important;
+  }
+
+  .d-lg-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-lg-flex {
+    display: flex !important;
+  }
+
+  .d-lg-inline-flex {
+    display: inline-flex !important;
+  }
+
+  .d-lg-none {
+    display: none !important;
+  }
+
+  .flex-lg-fill {
+    flex: 1 1 auto !important;
+  }
+
+  .flex-lg-row {
+    flex-direction: row !important;
+  }
+
+  .flex-lg-column {
+    flex-direction: column !important;
+  }
+
+  .flex-lg-row-reverse {
+    flex-direction: row-reverse !important;
+  }
+
+  .flex-lg-column-reverse {
+    flex-direction: column-reverse !important;
+  }
+
+  .flex-lg-grow-0 {
+    flex-grow: 0 !important;
+  }
+
+  .flex-lg-grow-1 {
+    flex-grow: 1 !important;
+  }
+
+  .flex-lg-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-lg-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .flex-lg-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-lg-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-lg-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .gap-lg-0 {
+    gap: 0 !important;
+  }
+
+  .gap-lg-1 {
+    gap: 0.25rem !important;
+  }
+
+  .gap-lg-2 {
+    gap: 0.5rem !important;
+  }
+
+  .gap-lg-3 {
+    gap: 1rem !important;
+  }
+
+  .gap-lg-4 {
+    gap: 1.5rem !important;
+  }
+
+  .gap-lg-5 {
+    gap: 3rem !important;
+  }
+
+  .justify-content-lg-start {
+    justify-content: flex-start !important;
+  }
+
+  .justify-content-lg-end {
+    justify-content: flex-end !important;
+  }
+
+  .justify-content-lg-center {
+    justify-content: center !important;
+  }
+
+  .justify-content-lg-between {
+    justify-content: space-between !important;
+  }
+
+  .justify-content-lg-around {
+    justify-content: space-around !important;
+  }
+
+  .justify-content-lg-evenly {
+    justify-content: space-evenly !important;
+  }
+
+  .align-items-lg-start {
+    align-items: flex-start !important;
+  }
+
+  .align-items-lg-end {
+    align-items: flex-end !important;
+  }
+
+  .align-items-lg-center {
+    align-items: center !important;
+  }
+
+  .align-items-lg-baseline {
+    align-items: baseline !important;
+  }
+
+  .align-items-lg-stretch {
+    align-items: stretch !important;
+  }
+
+  .align-content-lg-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-lg-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-lg-center {
+    align-content: center !important;
+  }
+
+  .align-content-lg-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-lg-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-lg-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-lg-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-lg-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-lg-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-lg-center {
+    align-self: center !important;
+  }
+
+  .align-self-lg-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-lg-stretch {
+    align-self: stretch !important;
+  }
+
+  .order-lg-first {
+    order: -1 !important;
+  }
+
+  .order-lg-0 {
+    order: 0 !important;
+  }
+
+  .order-lg-1 {
+    order: 1 !important;
+  }
+
+  .order-lg-2 {
+    order: 2 !important;
+  }
+
+  .order-lg-3 {
+    order: 3 !important;
+  }
+
+  .order-lg-4 {
+    order: 4 !important;
+  }
+
+  .order-lg-5 {
+    order: 5 !important;
+  }
+
+  .order-lg-last {
+    order: 6 !important;
+  }
+
+  .m-lg-0 {
+    margin: 0 !important;
+  }
+
+  .m-lg-1 {
+    margin: 0.25rem !important;
+  }
+
+  .m-lg-2 {
+    margin: 0.5rem !important;
+  }
+
+  .m-lg-3 {
+    margin: 1rem !important;
+  }
+
+  .m-lg-4 {
+    margin: 1.5rem !important;
+  }
+
+  .m-lg-5 {
+    margin: 3rem !important;
+  }
+
+  .m-lg-auto {
+    margin: auto !important;
+  }
+
+  .mx-lg-0 {
+    margin-right: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  .mx-lg-1 {
+    margin-right: 0.25rem !important;
+    margin-left: 0.25rem !important;
+  }
+
+  .mx-lg-2 {
+    margin-right: 0.5rem !important;
+    margin-left: 0.5rem !important;
+  }
+
+  .mx-lg-3 {
+    margin-right: 1rem !important;
+    margin-left: 1rem !important;
+  }
+
+  .mx-lg-4 {
+    margin-right: 1.5rem !important;
+    margin-left: 1.5rem !important;
+  }
+
+  .mx-lg-5 {
+    margin-right: 3rem !important;
+    margin-left: 3rem !important;
+  }
+
+  .mx-lg-auto {
+    margin-right: auto !important;
+    margin-left: auto !important;
+  }
+
+  .my-lg-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+  }
+
+  .my-lg-1 {
+    margin-top: 0.25rem !important;
+    margin-bottom: 0.25rem !important;
+  }
+
+  .my-lg-2 {
+    margin-top: 0.5rem !important;
+    margin-bottom: 0.5rem !important;
+  }
+
+  .my-lg-3 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important;
+  }
+
+  .my-lg-4 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important;
+  }
+
+  .my-lg-5 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important;
+  }
+
+  .my-lg-auto {
+    margin-top: auto !important;
+    margin-bottom: auto !important;
+  }
+
+  .mt-lg-0 {
+    margin-top: 0 !important;
+  }
+
+  .mt-lg-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mt-lg-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mt-lg-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mt-lg-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mt-lg-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mt-lg-auto {
+    margin-top: auto !important;
+  }
+
+  .me-lg-0 {
+    margin-right: 0 !important;
+  }
+
+  .me-lg-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .me-lg-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .me-lg-3 {
+    margin-right: 1rem !important;
+  }
+
+  .me-lg-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .me-lg-5 {
+    margin-right: 3rem !important;
+  }
+
+  .me-lg-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-lg-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .mb-lg-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .mb-lg-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .mb-lg-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .mb-lg-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .mb-lg-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .mb-lg-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ms-lg-0 {
+    margin-left: 0 !important;
+  }
+
+  .ms-lg-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .ms-lg-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .ms-lg-3 {
+    margin-left: 1rem !important;
+  }
+
+  .ms-lg-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .ms-lg-5 {
+    margin-left: 3rem !important;
+  }
+
+  .ms-lg-auto {
+    margin-left: auto !important;
+  }
+
+  .p-lg-0 {
+    padding: 0 !important;
+  }
+
+  .p-lg-1 {
+    padding: 0.25rem !important;
+  }
+
+  .p-lg-2 {
+    padding: 0.5rem !important;
+  }
+
+  .p-lg-3 {
+    padding: 1rem !important;
+  }
+
+  .p-lg-4 {
+    padding: 1.5rem !important;
+  }
+
+  .p-lg-5 {
+    padding: 3rem !important;
+  }
+
+  .px-lg-0 {
+    padding-right: 0 !important;
+    padding-left: 0 !important;
+  }
+
+  .px-lg-1 {
+    padding-right: 0.25rem !important;
+    padding-left: 0.25rem !important;
+  }
+
+  .px-lg-2 {
+    padding-right: 0.5rem !important;
+    padding-left: 0.5rem !important;
+  }
+
+  .px-lg-3 {
+    padding-right: 1rem !important;
+    padding-left: 1rem !important;
+  }
+
+  .px-lg-4 {
+    padding-right: 1.5rem !important;
+    padding-left: 1.5rem !important;
+  }
+
+  .px-lg-5 {
+    padding-right: 3rem !important;
+    padding-left: 3rem !important;
+  }
+
+  .py-lg-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+  }
+
+  .py-lg-1 {
+    padding-top: 0.25rem !important;
+    padding-bottom: 0.25rem !important;
+  }
+
+  .py-lg-2 {
+    padding-top: 0.5rem !important;
+    padding-bottom: 0.5rem !important;
+  }
+
+  .py-lg-3 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important;
+  }
+
+  .py-lg-4 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important;
+  }
+
+  .py-lg-5 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important;
+  }
+
+  .pt-lg-0 {
+    padding-top: 0 !important;
+  }
+
+  .pt-lg-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pt-lg-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pt-lg-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pt-lg-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pt-lg-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pe-lg-0 {
+    padding-right: 0 !important;
+  }
+
+  .pe-lg-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pe-lg-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pe-lg-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pe-lg-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pe-lg-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-lg-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pb-lg-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pb-lg-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pb-lg-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pb-lg-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pb-lg-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .ps-lg-0 {
+    padding-left: 0 !important;
+  }
+
+  .ps-lg-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .ps-lg-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .ps-lg-3 {
+    padding-left: 1rem !important;
+  }
+
+  .ps-lg-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .ps-lg-5 {
+    padding-left: 3rem !important;
+  }
+
+  .text-lg-start {
+    text-align: left !important;
+  }
+
+  .text-lg-end {
+    text-align: right !important;
+  }
+
+  .text-lg-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 1200px) {
+  .float-xl-start {
+    float: left !important;
+  }
+
+  .float-xl-end {
+    float: right !important;
+  }
+
+  .float-xl-none {
+    float: none !important;
+  }
+
+  .d-xl-inline {
+    display: inline !important;
+  }
+
+  .d-xl-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-xl-block {
+    display: block !important;
+  }
+
+  .d-xl-grid {
+    display: grid !important;
+  }
+
+  .d-xl-table {
+    display: table !important;
+  }
+
+  .d-xl-table-row {
+    display: table-row !important;
+  }
+
+  .d-xl-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-xl-flex {
+    display: flex !important;
+  }
+
+  .d-xl-inline-flex {
+    display: inline-flex !important;
+  }
+
+  .d-xl-none {
+    display: none !important;
+  }
+
+  .flex-xl-fill {
+    flex: 1 1 auto !important;
+  }
+
+  .flex-xl-row {
+    flex-direction: row !important;
+  }
+
+  .flex-xl-column {
+    flex-direction: column !important;
+  }
+
+  .flex-xl-row-reverse {
+    flex-direction: row-reverse !important;
+  }
+
+  .flex-xl-column-reverse {
+    flex-direction: column-reverse !important;
+  }
+
+  .flex-xl-grow-0 {
+    flex-grow: 0 !important;
+  }
+
+  .flex-xl-grow-1 {
+    flex-grow: 1 !important;
+  }
+
+  .flex-xl-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-xl-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .flex-xl-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-xl-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-xl-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .gap-xl-0 {
+    gap: 0 !important;
+  }
+
+  .gap-xl-1 {
+    gap: 0.25rem !important;
+  }
+
+  .gap-xl-2 {
+    gap: 0.5rem !important;
+  }
+
+  .gap-xl-3 {
+    gap: 1rem !important;
+  }
+
+  .gap-xl-4 {
+    gap: 1.5rem !important;
+  }
+
+  .gap-xl-5 {
+    gap: 3rem !important;
+  }
+
+  .justify-content-xl-start {
+    justify-content: flex-start !important;
+  }
+
+  .justify-content-xl-end {
+    justify-content: flex-end !important;
+  }
+
+  .justify-content-xl-center {
+    justify-content: center !important;
+  }
+
+  .justify-content-xl-between {
+    justify-content: space-between !important;
+  }
+
+  .justify-content-xl-around {
+    justify-content: space-around !important;
+  }
+
+  .justify-content-xl-evenly {
+    justify-content: space-evenly !important;
+  }
+
+  .align-items-xl-start {
+    align-items: flex-start !important;
+  }
+
+  .align-items-xl-end {
+    align-items: flex-end !important;
+  }
+
+  .align-items-xl-center {
+    align-items: center !important;
+  }
+
+  .align-items-xl-baseline {
+    align-items: baseline !important;
+  }
+
+  .align-items-xl-stretch {
+    align-items: stretch !important;
+  }
+
+  .align-content-xl-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-xl-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-xl-center {
+    align-content: center !important;
+  }
+
+  .align-content-xl-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-xl-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-xl-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-xl-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-xl-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-xl-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-xl-center {
+    align-self: center !important;
+  }
+
+  .align-self-xl-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-xl-stretch {
+    align-self: stretch !important;
+  }
+
+  .order-xl-first {
+    order: -1 !important;
+  }
+
+  .order-xl-0 {
+    order: 0 !important;
+  }
+
+  .order-xl-1 {
+    order: 1 !important;
+  }
+
+  .order-xl-2 {
+    order: 2 !important;
+  }
+
+  .order-xl-3 {
+    order: 3 !important;
+  }
+
+  .order-xl-4 {
+    order: 4 !important;
+  }
+
+  .order-xl-5 {
+    order: 5 !important;
+  }
+
+  .order-xl-last {
+    order: 6 !important;
+  }
+
+  .m-xl-0 {
+    margin: 0 !important;
+  }
+
+  .m-xl-1 {
+    margin: 0.25rem !important;
+  }
+
+  .m-xl-2 {
+    margin: 0.5rem !important;
+  }
+
+  .m-xl-3 {
+    margin: 1rem !important;
+  }
+
+  .m-xl-4 {
+    margin: 1.5rem !important;
+  }
+
+  .m-xl-5 {
+    margin: 3rem !important;
+  }
+
+  .m-xl-auto {
+    margin: auto !important;
+  }
+
+  .mx-xl-0 {
+    margin-right: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  .mx-xl-1 {
+    margin-right: 0.25rem !important;
+    margin-left: 0.25rem !important;
+  }
+
+  .mx-xl-2 {
+    margin-right: 0.5rem !important;
+    margin-left: 0.5rem !important;
+  }
+
+  .mx-xl-3 {
+    margin-right: 1rem !important;
+    margin-left: 1rem !important;
+  }
+
+  .mx-xl-4 {
+    margin-right: 1.5rem !important;
+    margin-left: 1.5rem !important;
+  }
+
+  .mx-xl-5 {
+    margin-right: 3rem !important;
+    margin-left: 3rem !important;
+  }
+
+  .mx-xl-auto {
+    margin-right: auto !important;
+    margin-left: auto !important;
+  }
+
+  .my-xl-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+  }
+
+  .my-xl-1 {
+    margin-top: 0.25rem !important;
+    margin-bottom: 0.25rem !important;
+  }
+
+  .my-xl-2 {
+    margin-top: 0.5rem !important;
+    margin-bottom: 0.5rem !important;
+  }
+
+  .my-xl-3 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important;
+  }
+
+  .my-xl-4 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important;
+  }
+
+  .my-xl-5 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important;
+  }
+
+  .my-xl-auto {
+    margin-top: auto !important;
+    margin-bottom: auto !important;
+  }
+
+  .mt-xl-0 {
+    margin-top: 0 !important;
+  }
+
+  .mt-xl-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mt-xl-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mt-xl-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mt-xl-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mt-xl-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mt-xl-auto {
+    margin-top: auto !important;
+  }
+
+  .me-xl-0 {
+    margin-right: 0 !important;
+  }
+
+  .me-xl-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .me-xl-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .me-xl-3 {
+    margin-right: 1rem !important;
+  }
+
+  .me-xl-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .me-xl-5 {
+    margin-right: 3rem !important;
+  }
+
+  .me-xl-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-xl-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .mb-xl-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .mb-xl-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .mb-xl-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .mb-xl-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .mb-xl-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .mb-xl-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ms-xl-0 {
+    margin-left: 0 !important;
+  }
+
+  .ms-xl-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .ms-xl-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .ms-xl-3 {
+    margin-left: 1rem !important;
+  }
+
+  .ms-xl-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .ms-xl-5 {
+    margin-left: 3rem !important;
+  }
+
+  .ms-xl-auto {
+    margin-left: auto !important;
+  }
+
+  .p-xl-0 {
+    padding: 0 !important;
+  }
+
+  .p-xl-1 {
+    padding: 0.25rem !important;
+  }
+
+  .p-xl-2 {
+    padding: 0.5rem !important;
+  }
+
+  .p-xl-3 {
+    padding: 1rem !important;
+  }
+
+  .p-xl-4 {
+    padding: 1.5rem !important;
+  }
+
+  .p-xl-5 {
+    padding: 3rem !important;
+  }
+
+  .px-xl-0 {
+    padding-right: 0 !important;
+    padding-left: 0 !important;
+  }
+
+  .px-xl-1 {
+    padding-right: 0.25rem !important;
+    padding-left: 0.25rem !important;
+  }
+
+  .px-xl-2 {
+    padding-right: 0.5rem !important;
+    padding-left: 0.5rem !important;
+  }
+
+  .px-xl-3 {
+    padding-right: 1rem !important;
+    padding-left: 1rem !important;
+  }
+
+  .px-xl-4 {
+    padding-right: 1.5rem !important;
+    padding-left: 1.5rem !important;
+  }
+
+  .px-xl-5 {
+    padding-right: 3rem !important;
+    padding-left: 3rem !important;
+  }
+
+  .py-xl-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+  }
+
+  .py-xl-1 {
+    padding-top: 0.25rem !important;
+    padding-bottom: 0.25rem !important;
+  }
+
+  .py-xl-2 {
+    padding-top: 0.5rem !important;
+    padding-bottom: 0.5rem !important;
+  }
+
+  .py-xl-3 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important;
+  }
+
+  .py-xl-4 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important;
+  }
+
+  .py-xl-5 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important;
+  }
+
+  .pt-xl-0 {
+    padding-top: 0 !important;
+  }
+
+  .pt-xl-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pt-xl-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pt-xl-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pt-xl-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pt-xl-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pe-xl-0 {
+    padding-right: 0 !important;
+  }
+
+  .pe-xl-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pe-xl-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pe-xl-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pe-xl-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pe-xl-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-xl-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pb-xl-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pb-xl-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pb-xl-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pb-xl-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pb-xl-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .ps-xl-0 {
+    padding-left: 0 !important;
+  }
+
+  .ps-xl-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .ps-xl-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .ps-xl-3 {
+    padding-left: 1rem !important;
+  }
+
+  .ps-xl-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .ps-xl-5 {
+    padding-left: 3rem !important;
+  }
+
+  .text-xl-start {
+    text-align: left !important;
+  }
+
+  .text-xl-end {
+    text-align: right !important;
+  }
+
+  .text-xl-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 1400px) {
+  .float-xxl-start {
+    float: left !important;
+  }
+
+  .float-xxl-end {
+    float: right !important;
+  }
+
+  .float-xxl-none {
+    float: none !important;
+  }
+
+  .d-xxl-inline {
+    display: inline !important;
+  }
+
+  .d-xxl-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-xxl-block {
+    display: block !important;
+  }
+
+  .d-xxl-grid {
+    display: grid !important;
+  }
+
+  .d-xxl-table {
+    display: table !important;
+  }
+
+  .d-xxl-table-row {
+    display: table-row !important;
+  }
+
+  .d-xxl-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-xxl-flex {
+    display: flex !important;
+  }
+
+  .d-xxl-inline-flex {
+    display: inline-flex !important;
+  }
+
+  .d-xxl-none {
+    display: none !important;
+  }
+
+  .flex-xxl-fill {
+    flex: 1 1 auto !important;
+  }
+
+  .flex-xxl-row {
+    flex-direction: row !important;
+  }
+
+  .flex-xxl-column {
+    flex-direction: column !important;
+  }
+
+  .flex-xxl-row-reverse {
+    flex-direction: row-reverse !important;
+  }
+
+  .flex-xxl-column-reverse {
+    flex-direction: column-reverse !important;
+  }
+
+  .flex-xxl-grow-0 {
+    flex-grow: 0 !important;
+  }
+
+  .flex-xxl-grow-1 {
+    flex-grow: 1 !important;
+  }
+
+  .flex-xxl-shrink-0 {
+    flex-shrink: 0 !important;
+  }
+
+  .flex-xxl-shrink-1 {
+    flex-shrink: 1 !important;
+  }
+
+  .flex-xxl-wrap {
+    flex-wrap: wrap !important;
+  }
+
+  .flex-xxl-nowrap {
+    flex-wrap: nowrap !important;
+  }
+
+  .flex-xxl-wrap-reverse {
+    flex-wrap: wrap-reverse !important;
+  }
+
+  .gap-xxl-0 {
+    gap: 0 !important;
+  }
+
+  .gap-xxl-1 {
+    gap: 0.25rem !important;
+  }
+
+  .gap-xxl-2 {
+    gap: 0.5rem !important;
+  }
+
+  .gap-xxl-3 {
+    gap: 1rem !important;
+  }
+
+  .gap-xxl-4 {
+    gap: 1.5rem !important;
+  }
+
+  .gap-xxl-5 {
+    gap: 3rem !important;
+  }
+
+  .justify-content-xxl-start {
+    justify-content: flex-start !important;
+  }
+
+  .justify-content-xxl-end {
+    justify-content: flex-end !important;
+  }
+
+  .justify-content-xxl-center {
+    justify-content: center !important;
+  }
+
+  .justify-content-xxl-between {
+    justify-content: space-between !important;
+  }
+
+  .justify-content-xxl-around {
+    justify-content: space-around !important;
+  }
+
+  .justify-content-xxl-evenly {
+    justify-content: space-evenly !important;
+  }
+
+  .align-items-xxl-start {
+    align-items: flex-start !important;
+  }
+
+  .align-items-xxl-end {
+    align-items: flex-end !important;
+  }
+
+  .align-items-xxl-center {
+    align-items: center !important;
+  }
+
+  .align-items-xxl-baseline {
+    align-items: baseline !important;
+  }
+
+  .align-items-xxl-stretch {
+    align-items: stretch !important;
+  }
+
+  .align-content-xxl-start {
+    align-content: flex-start !important;
+  }
+
+  .align-content-xxl-end {
+    align-content: flex-end !important;
+  }
+
+  .align-content-xxl-center {
+    align-content: center !important;
+  }
+
+  .align-content-xxl-between {
+    align-content: space-between !important;
+  }
+
+  .align-content-xxl-around {
+    align-content: space-around !important;
+  }
+
+  .align-content-xxl-stretch {
+    align-content: stretch !important;
+  }
+
+  .align-self-xxl-auto {
+    align-self: auto !important;
+  }
+
+  .align-self-xxl-start {
+    align-self: flex-start !important;
+  }
+
+  .align-self-xxl-end {
+    align-self: flex-end !important;
+  }
+
+  .align-self-xxl-center {
+    align-self: center !important;
+  }
+
+  .align-self-xxl-baseline {
+    align-self: baseline !important;
+  }
+
+  .align-self-xxl-stretch {
+    align-self: stretch !important;
+  }
+
+  .order-xxl-first {
+    order: -1 !important;
+  }
+
+  .order-xxl-0 {
+    order: 0 !important;
+  }
+
+  .order-xxl-1 {
+    order: 1 !important;
+  }
+
+  .order-xxl-2 {
+    order: 2 !important;
+  }
+
+  .order-xxl-3 {
+    order: 3 !important;
+  }
+
+  .order-xxl-4 {
+    order: 4 !important;
+  }
+
+  .order-xxl-5 {
+    order: 5 !important;
+  }
+
+  .order-xxl-last {
+    order: 6 !important;
+  }
+
+  .m-xxl-0 {
+    margin: 0 !important;
+  }
+
+  .m-xxl-1 {
+    margin: 0.25rem !important;
+  }
+
+  .m-xxl-2 {
+    margin: 0.5rem !important;
+  }
+
+  .m-xxl-3 {
+    margin: 1rem !important;
+  }
+
+  .m-xxl-4 {
+    margin: 1.5rem !important;
+  }
+
+  .m-xxl-5 {
+    margin: 3rem !important;
+  }
+
+  .m-xxl-auto {
+    margin: auto !important;
+  }
+
+  .mx-xxl-0 {
+    margin-right: 0 !important;
+    margin-left: 0 !important;
+  }
+
+  .mx-xxl-1 {
+    margin-right: 0.25rem !important;
+    margin-left: 0.25rem !important;
+  }
+
+  .mx-xxl-2 {
+    margin-right: 0.5rem !important;
+    margin-left: 0.5rem !important;
+  }
+
+  .mx-xxl-3 {
+    margin-right: 1rem !important;
+    margin-left: 1rem !important;
+  }
+
+  .mx-xxl-4 {
+    margin-right: 1.5rem !important;
+    margin-left: 1.5rem !important;
+  }
+
+  .mx-xxl-5 {
+    margin-right: 3rem !important;
+    margin-left: 3rem !important;
+  }
+
+  .mx-xxl-auto {
+    margin-right: auto !important;
+    margin-left: auto !important;
+  }
+
+  .my-xxl-0 {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+  }
+
+  .my-xxl-1 {
+    margin-top: 0.25rem !important;
+    margin-bottom: 0.25rem !important;
+  }
+
+  .my-xxl-2 {
+    margin-top: 0.5rem !important;
+    margin-bottom: 0.5rem !important;
+  }
+
+  .my-xxl-3 {
+    margin-top: 1rem !important;
+    margin-bottom: 1rem !important;
+  }
+
+  .my-xxl-4 {
+    margin-top: 1.5rem !important;
+    margin-bottom: 1.5rem !important;
+  }
+
+  .my-xxl-5 {
+    margin-top: 3rem !important;
+    margin-bottom: 3rem !important;
+  }
+
+  .my-xxl-auto {
+    margin-top: auto !important;
+    margin-bottom: auto !important;
+  }
+
+  .mt-xxl-0 {
+    margin-top: 0 !important;
+  }
+
+  .mt-xxl-1 {
+    margin-top: 0.25rem !important;
+  }
+
+  .mt-xxl-2 {
+    margin-top: 0.5rem !important;
+  }
+
+  .mt-xxl-3 {
+    margin-top: 1rem !important;
+  }
+
+  .mt-xxl-4 {
+    margin-top: 1.5rem !important;
+  }
+
+  .mt-xxl-5 {
+    margin-top: 3rem !important;
+  }
+
+  .mt-xxl-auto {
+    margin-top: auto !important;
+  }
+
+  .me-xxl-0 {
+    margin-right: 0 !important;
+  }
+
+  .me-xxl-1 {
+    margin-right: 0.25rem !important;
+  }
+
+  .me-xxl-2 {
+    margin-right: 0.5rem !important;
+  }
+
+  .me-xxl-3 {
+    margin-right: 1rem !important;
+  }
+
+  .me-xxl-4 {
+    margin-right: 1.5rem !important;
+  }
+
+  .me-xxl-5 {
+    margin-right: 3rem !important;
+  }
+
+  .me-xxl-auto {
+    margin-right: auto !important;
+  }
+
+  .mb-xxl-0 {
+    margin-bottom: 0 !important;
+  }
+
+  .mb-xxl-1 {
+    margin-bottom: 0.25rem !important;
+  }
+
+  .mb-xxl-2 {
+    margin-bottom: 0.5rem !important;
+  }
+
+  .mb-xxl-3 {
+    margin-bottom: 1rem !important;
+  }
+
+  .mb-xxl-4 {
+    margin-bottom: 1.5rem !important;
+  }
+
+  .mb-xxl-5 {
+    margin-bottom: 3rem !important;
+  }
+
+  .mb-xxl-auto {
+    margin-bottom: auto !important;
+  }
+
+  .ms-xxl-0 {
+    margin-left: 0 !important;
+  }
+
+  .ms-xxl-1 {
+    margin-left: 0.25rem !important;
+  }
+
+  .ms-xxl-2 {
+    margin-left: 0.5rem !important;
+  }
+
+  .ms-xxl-3 {
+    margin-left: 1rem !important;
+  }
+
+  .ms-xxl-4 {
+    margin-left: 1.5rem !important;
+  }
+
+  .ms-xxl-5 {
+    margin-left: 3rem !important;
+  }
+
+  .ms-xxl-auto {
+    margin-left: auto !important;
+  }
+
+  .p-xxl-0 {
+    padding: 0 !important;
+  }
+
+  .p-xxl-1 {
+    padding: 0.25rem !important;
+  }
+
+  .p-xxl-2 {
+    padding: 0.5rem !important;
+  }
+
+  .p-xxl-3 {
+    padding: 1rem !important;
+  }
+
+  .p-xxl-4 {
+    padding: 1.5rem !important;
+  }
+
+  .p-xxl-5 {
+    padding: 3rem !important;
+  }
+
+  .px-xxl-0 {
+    padding-right: 0 !important;
+    padding-left: 0 !important;
+  }
+
+  .px-xxl-1 {
+    padding-right: 0.25rem !important;
+    padding-left: 0.25rem !important;
+  }
+
+  .px-xxl-2 {
+    padding-right: 0.5rem !important;
+    padding-left: 0.5rem !important;
+  }
+
+  .px-xxl-3 {
+    padding-right: 1rem !important;
+    padding-left: 1rem !important;
+  }
+
+  .px-xxl-4 {
+    padding-right: 1.5rem !important;
+    padding-left: 1.5rem !important;
+  }
+
+  .px-xxl-5 {
+    padding-right: 3rem !important;
+    padding-left: 3rem !important;
+  }
+
+  .py-xxl-0 {
+    padding-top: 0 !important;
+    padding-bottom: 0 !important;
+  }
+
+  .py-xxl-1 {
+    padding-top: 0.25rem !important;
+    padding-bottom: 0.25rem !important;
+  }
+
+  .py-xxl-2 {
+    padding-top: 0.5rem !important;
+    padding-bottom: 0.5rem !important;
+  }
+
+  .py-xxl-3 {
+    padding-top: 1rem !important;
+    padding-bottom: 1rem !important;
+  }
+
+  .py-xxl-4 {
+    padding-top: 1.5rem !important;
+    padding-bottom: 1.5rem !important;
+  }
+
+  .py-xxl-5 {
+    padding-top: 3rem !important;
+    padding-bottom: 3rem !important;
+  }
+
+  .pt-xxl-0 {
+    padding-top: 0 !important;
+  }
+
+  .pt-xxl-1 {
+    padding-top: 0.25rem !important;
+  }
+
+  .pt-xxl-2 {
+    padding-top: 0.5rem !important;
+  }
+
+  .pt-xxl-3 {
+    padding-top: 1rem !important;
+  }
+
+  .pt-xxl-4 {
+    padding-top: 1.5rem !important;
+  }
+
+  .pt-xxl-5 {
+    padding-top: 3rem !important;
+  }
+
+  .pe-xxl-0 {
+    padding-right: 0 !important;
+  }
+
+  .pe-xxl-1 {
+    padding-right: 0.25rem !important;
+  }
+
+  .pe-xxl-2 {
+    padding-right: 0.5rem !important;
+  }
+
+  .pe-xxl-3 {
+    padding-right: 1rem !important;
+  }
+
+  .pe-xxl-4 {
+    padding-right: 1.5rem !important;
+  }
+
+  .pe-xxl-5 {
+    padding-right: 3rem !important;
+  }
+
+  .pb-xxl-0 {
+    padding-bottom: 0 !important;
+  }
+
+  .pb-xxl-1 {
+    padding-bottom: 0.25rem !important;
+  }
+
+  .pb-xxl-2 {
+    padding-bottom: 0.5rem !important;
+  }
+
+  .pb-xxl-3 {
+    padding-bottom: 1rem !important;
+  }
+
+  .pb-xxl-4 {
+    padding-bottom: 1.5rem !important;
+  }
+
+  .pb-xxl-5 {
+    padding-bottom: 3rem !important;
+  }
+
+  .ps-xxl-0 {
+    padding-left: 0 !important;
+  }
+
+  .ps-xxl-1 {
+    padding-left: 0.25rem !important;
+  }
+
+  .ps-xxl-2 {
+    padding-left: 0.5rem !important;
+  }
+
+  .ps-xxl-3 {
+    padding-left: 1rem !important;
+  }
+
+  .ps-xxl-4 {
+    padding-left: 1.5rem !important;
+  }
+
+  .ps-xxl-5 {
+    padding-left: 3rem !important;
+  }
+
+  .text-xxl-start {
+    text-align: left !important;
+  }
+
+  .text-xxl-end {
+    text-align: right !important;
+  }
+
+  .text-xxl-center {
+    text-align: center !important;
+  }
+}
+@media (min-width: 1200px) {
+  .fs-1 {
+    font-size: 2.5rem !important;
+  }
+
+  .fs-2 {
+    font-size: 2rem !important;
+  }
+
+  .fs-3 {
+    font-size: 1.75rem !important;
+  }
+
+  .fs-4 {
+    font-size: 1.5rem !important;
+  }
+}
+@media print {
+  .d-print-inline {
+    display: inline !important;
+  }
+
+  .d-print-inline-block {
+    display: inline-block !important;
+  }
+
+  .d-print-block {
+    display: block !important;
+  }
+
+  .d-print-grid {
+    display: grid !important;
+  }
+
+  .d-print-table {
+    display: table !important;
+  }
+
+  .d-print-table-row {
+    display: table-row !important;
+  }
+
+  .d-print-table-cell {
+    display: table-cell !important;
+  }
+
+  .d-print-flex {
+    display: flex !important;
+  }
+
+  .d-print-inline-flex {
+    display: inline-flex !important;
+  }
+
+  .d-print-none {
+    display: none !important;
+  }
+}
+
+/*# sourceMappingURL=bootstrap.css.map */
\ No newline at end of file
diff --git a/website/static/css/main.css b/website/static/css/main.css
new file mode 100644
index 0000000..bb644b6
--- /dev/null
+++ b/website/static/css/main.css
@@ -0,0 +1,501 @@
+@-webkit-keyframes swing {
+  0%, 30%, 50%, 70%, 100% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg); }
+  10% {
+    -webkit-transform: rotate(10deg);
+    transform: rotate(10deg); }
+  40% {
+    -webkit-transform: rotate(-10deg);
+    transform: rotate(-10deg); }
+  60% {
+    -webkit-transform: rotate(5deg);
+    transform: rotate(5deg); }
+  80% {
+    -webkit-transform: rotate(-5deg);
+    transform: rotate(-5deg); } }
+
+@keyframes swing {
+  0%, 30%, 50%, 70%, 100% {
+    -webkit-transform: rotate(0deg);
+    transform: rotate(0deg); }
+  10% {
+    -webkit-transform: rotate(10deg);
+    transform: rotate(10deg); }
+  40% {
+    -webkit-transform: rotate(-10deg);
+    transform: rotate(-10deg); }
+  60% {
+    -webkit-transform: rotate(5deg);
+    transform: rotate(5deg); }
+  80% {
+    -webkit-transform: rotate(-5deg);
+    transform: rotate(-5deg); } }
+
+@-webkit-keyframes sonar {
+  0% {
+    -webkit-transform: scale(0.9);
+    transform: scale(0.9);
+    opacity: 1; }
+  100% {
+    -webkit-transform: scale(2);
+    transform: scale(2);
+    opacity: 0; } }
+
+@keyframes sonar {
+  0% {
+    -webkit-transform: scale(0.9);
+    transform: scale(0.9);
+    opacity: 1; }
+  100% {
+    -webkit-transform: scale(2);
+    transform: scale(2);
+    opacity: 0; } }
+
+.sidebar-wrapper {
+  width: 280px;
+  height: 100%;
+  max-height: 100%;
+  position: fixed;
+  top: 0;
+  left: -280px;
+  z-index: 999;
+  -webkit-transition: left .3s ease, width .3s ease;
+  transition: left .3s ease, width .3s ease; }
+  .sidebar-wrapper ul {
+    list-style-type: none;
+    padding: 0;
+    margin: 0; }
+  .sidebar-wrapper a {
+    text-decoration: none;
+    -webkit-transition: color .3s ease;
+    transition: color .3s ease; }
+  .sidebar-wrapper .sidebar-item {
+    -webkit-transition: all .3s linear;
+    transition: all .3s linear; }
+  .sidebar-wrapper .sidebar-content {
+    max-height: calc(100% -35px);
+    height: calc(100% - 35px);
+    overflow-y: scroll;
+    position: relative; }
+    .sidebar-wrapper .sidebar-content.desktop {
+      overflow-y: hidden; }
+  .sidebar-wrapper .badge {
+    border-radius: 0; }
+
+.sidebar-bg .sidebar-wrapper {
+  background-size: cover;
+  background-position: center;
+  background-repeat: no-repeat; }
+  .sidebar-bg .sidebar-wrapper:before {
+    content: '';
+    position: absolute;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0; }
+
+.sidebar-wrapper .sidebar-brand {
+  padding: 1rem 1.2rem;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+  -ms-flex-align: center;
+  align-items: center;
+  height: 55px; }
+  .sidebar-wrapper .sidebar-brand > a {
+    text-transform: uppercase;
+    font-weight: bold;
+    -webkit-box-flex: 1;
+    -ms-flex-positive: 1;
+    flex-grow: 1;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis; }
+
+.sidebar-wrapper .sidebar-header {
+  padding: 20px;
+  overflow: hidden; }
+  .sidebar-wrapper .sidebar-header .user-pic {
+    width: 60px;
+    padding: 2px;
+    margin-right: 15px;
+    overflow: hidden; }
+    .sidebar-wrapper .sidebar-header .user-pic img {
+      -o-object-fit: cover;
+      object-fit: cover;
+      height: 100%;
+      width: 100%; }
+  .sidebar-wrapper .sidebar-header .user-info {
+    overflow: hidden; }
+    .sidebar-wrapper .sidebar-header .user-info > span {
+      display: block;
+      white-space: nowrap;
+      text-overflow: ellipsis; }
+    .sidebar-wrapper .sidebar-header .user-info .user-role {
+      font-size: 12px; }
+    .sidebar-wrapper .sidebar-header .user-info .user-status {
+      font-size: 11px;
+      margin-top: 4px; }
+      .sidebar-wrapper .sidebar-header .user-info .user-status i {
+        font-size: 8px;
+        margin-right: 4px;
+        color: #5cb85c; }
+
+.sidebar-wrapper .sidebar-search > div {
+  padding: 1rem 1.2rem; }
+
+.sidebar-wrapper .sidebar-search input {
+  border-radius: 0; }
+
+.sidebar-wrapper .sidebar-search .input-group {
+  -ms-flex-wrap: nowrap;
+  flex-wrap: nowrap; }
+
+.sidebar-wrapper .sidebar-search .input-group-append .input-group-text {
+  border-radius: 0;
+  border-left: 0; }
+
+.sidebar-wrapper .sidebar-menu {
+  padding-bottom: 10px; }
+  .sidebar-wrapper .sidebar-menu .header-menu span {
+    font-weight: bold;
+    font-size: 14px;
+    padding: 15px 20px 5px 20px;
+    display: inline-block; }
+  .sidebar-wrapper .sidebar-menu ul li a {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex;
+    -ms-flex-wrap: nowrap;
+    flex-wrap: nowrap;
+    -webkit-box-align: center;
+    -ms-flex-align: center;
+    align-items: center;
+    text-decoration: none;
+    position: relative;
+    padding: 8px 30px 8px 20px;
+    width: 100%; }
+    .sidebar-wrapper .sidebar-menu ul li a:hover > i::before {
+      display: inline-block;
+      -webkit-animation: swing ease-in-out .5s 1 alternate;
+      animation: swing ease-in-out .5s 1 alternate; }
+    .sidebar-wrapper .sidebar-menu ul li a i {
+      margin-right: 10px;
+      font-size: 12px;
+      width: 35px;
+      height: 35px;
+      line-height: 35px;
+      text-align: center;
+      -ms-flex-negative: 0;
+      flex-shrink: 0; }
+    .sidebar-wrapper .sidebar-menu ul li a .menu-text {
+      -webkit-box-flex: 1;
+      -ms-flex-positive: 1;
+      flex-grow: 1;
+      white-space: nowrap;
+      text-overflow: ellipsis;
+      -ms-flex-negative: 1;
+      flex-shrink: 1;
+      overflow: hidden; }
+  .sidebar-wrapper .sidebar-menu .sidebar-dropdown > a:after {
+    font-family: "Font Awesome 5 Free";
+    font-weight: 900;
+    content: "\f105";
+    display: inline-block;
+    font-style: normal;
+    font-variant: normal;
+    text-rendering: auto;
+    -webkit-font-smoothing: antialiased;
+    -moz-osx-font-smoothing: grayscale;
+    text-align: center;
+    background: 0 0;
+    position: absolute;
+    right: 15px;
+    top: 14px;
+    -webkit-transition: -webkit-transform .3s ease;
+    transition: -webkit-transform .3s ease;
+    transition: transform .3s ease;
+    transition: transform .3s ease, -webkit-transform .3s ease; }
+  .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu {
+    display: none; }
+    .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu ul {
+      padding: 5px 0; }
+    .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li {
+      padding-left: 25px;
+      font-size: 13px; }
+      .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a {
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis; }
+        .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a:before {
+          content: "\f111";
+          font-family: "Font Awesome 5 Free";
+          font-weight: 400;
+          font-style: normal;
+          display: inline-block;
+          text-align: center;
+          text-decoration: none;
+          -webkit-font-smoothing: antialiased;
+          -moz-osx-font-smoothing: grayscale;
+          margin-right: 10px;
+          font-size: 8px; }
+        .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .badge,
+        .sidebar-wrapper .sidebar-menu .sidebar-dropdown .sidebar-submenu li a .label {
+          margin-left: auto; }
+  .sidebar-wrapper .sidebar-menu .sidebar-dropdown.active > a:after {
+    -webkit-transform: rotate(90deg);
+    transform: rotate(90deg);
+    right: 15px; }
+
+.sidebar-wrapper .sidebar-footer {
+  position: absolute;
+  width: 100%;
+  bottom: 0;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex; }
+  .sidebar-wrapper .sidebar-footer > div {
+    -webkit-box-flex: 1;
+    -ms-flex-positive: 1;
+    flex-grow: 1;
+    text-align: center;
+    height: 35px;
+    line-height: 35px;
+    position: static;
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex; }
+    .sidebar-wrapper .sidebar-footer > div > a {
+      -webkit-box-flex: 1;
+      -ms-flex-positive: 1;
+      flex-grow: 1; }
+    .sidebar-wrapper .sidebar-footer > div a .notification {
+      position: absolute;
+      top: 0; }
+    .sidebar-wrapper .sidebar-footer > div.pinned-footer {
+      display: none; }
+  .sidebar-wrapper .sidebar-footer .dropdown-menu {
+    bottom: 36px;
+    left: 0 !important;
+    top: initial !important;
+    right: 0;
+    -webkit-transform: none !important;
+    transform: none !important;
+    border-radius: 0;
+    font-size: .9rem; }
+  .sidebar-wrapper .sidebar-footer .messages .dropdown-item {
+    padding: .25rem 1rem; }
+  .sidebar-wrapper .sidebar-footer .messages .messages-header {
+    padding: 0 1rem; }
+  .sidebar-wrapper .sidebar-footer .messages .message-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex; }
+    .sidebar-wrapper .sidebar-footer .messages .message-content .pic {
+      width: 40px;
+      height: 40px;
+      overflow: hidden; }
+      .sidebar-wrapper .sidebar-footer .messages .message-content .pic img {
+        -o-object-fit: cover;
+        object-fit: cover;
+        height: 100%; }
+    .sidebar-wrapper .sidebar-footer .messages .message-content .content {
+      line-height: 1.6;
+      padding-left: 5px;
+      width: calc(100% - 40px); }
+      .sidebar-wrapper .sidebar-footer .messages .message-content .content .message-title {
+        font-size: 13px; }
+      .sidebar-wrapper .sidebar-footer .messages .message-content .content .message-detail {
+        font-size: 12px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis; }
+  .sidebar-wrapper .sidebar-footer .notifications .dropdown-item {
+    padding: .25rem 1rem; }
+  .sidebar-wrapper .sidebar-footer .notifications .notifications-header {
+    padding: 0 1rem; }
+  .sidebar-wrapper .sidebar-footer .notifications .notification-content {
+    display: -webkit-box;
+    display: -ms-flexbox;
+    display: flex; }
+    .sidebar-wrapper .sidebar-footer .notifications .notification-content .icon {
+      width: 40px;
+      height: 40px; }
+      .sidebar-wrapper .sidebar-footer .notifications .notification-content .icon i {
+        width: 35px;
+        height: 35px;
+        text-align: center;
+        line-height: 35px; }
+    .sidebar-wrapper .sidebar-footer .notifications .notification-content .content {
+      line-height: 1.6;
+      padding-left: 5px;
+      width: calc(100% - 40px); }
+      .sidebar-wrapper .sidebar-footer .notifications .notification-content .content .notification-time {
+        font-size: .7rem;
+        color: #828282; }
+      .sidebar-wrapper .sidebar-footer .notifications .notification-content .content .notification-detail {
+        font-size: 12px;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis; }
+  .sidebar-wrapper .sidebar-footer .badge-sonar {
+    display: inline-block;
+    background: #d86703;
+    border-radius: 50%;
+    height: 8px;
+    width: 8px;
+    position: absolute;
+    top: 0; }
+    .sidebar-wrapper .sidebar-footer .badge-sonar:after {
+      content: '';
+      position: absolute;
+      top: 0;
+      left: 0;
+      border: 2px solid #d86703;
+      opacity: 0;
+      border-radius: 50%;
+      width: 100%;
+      height: 100%;
+      -webkit-animation: sonar 1.5s infinite;
+      animation: sonar 1.5s infinite; }
+
+body {
+  font-size: .9rem; }
+
+/*----------------page-wrapper----------------*/
+.page-wrapper {
+  height: 100vh; }
+  .page-wrapper .theme {
+    width: 40px;
+    height: 40px;
+    display: inline-block;
+    margin: 2px;
+    background-size: cover; }
+  .page-wrapper .theme.selected {
+    border: 2px solid #00c7ff; }
+  .page-wrapper .theme.default-theme {
+    background: #1d1d1d; }
+  .page-wrapper .theme.chiller-theme {
+    background: #374140; }
+  .page-wrapper .theme.legacy-theme {
+    background: #2e333c; }
+  .page-wrapper .theme.ice-theme {
+    background: #3a4d56; }
+  .page-wrapper .theme.cool-theme {
+    background: #46454c; }
+  .page-wrapper .theme.light-theme {
+    background: #ececec; }
+  .page-wrapper .page-content {
+    display: inline-block;
+    width: 100%;
+    -webkit-transition: padding-left .3s ease;
+    transition: padding-left .3s ease;
+    overflow-x: hidden; }
+    .page-wrapper .page-content .overlay {
+      position: fixed;
+      top: 0;
+      right: 0;
+      bottom: 0;
+      left: 0;
+      z-index: 998;
+      background: #000;
+      opacity: .5;
+      display: none; }
+  .page-wrapper.toggled .sidebar-wrapper {
+    left: 0px; }
+  @media screen and (min-width: 768px) {
+    .page-wrapper.toggled .page-content {
+      padding-left: 280px; } }
+  @media screen and (max-width: 768px) {
+    .page-wrapper.toggled .page-content .overlay {
+      display: block; } }
+  @media screen and (min-width: 768px) {
+    .page-wrapper.toggled.pinned .page-content {
+      padding-left: 80px; } }
+  .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper {
+    width: 80px; }
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header {
+      padding: 10px; }
+      .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header .user-pic {
+        margin: 0 auto;
+        width: 50px;
+        float: none; }
+        .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header .user-pic img {
+          margin: auto; }
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-search input,
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-header .user-info,
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-menu .header-menu,
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-menu .sidebar-submenu,
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-menu ul > li > a > span,
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-menu ul > li > a::after,
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-footer > div:not(.pinned-footer) {
+      display: none !important; }
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-search .input-group-text {
+      height: 35px; }
+    .page-wrapper.pinned:not(.sidebar-hovered) .sidebar-wrapper .sidebar-footer > div.pinned-footer {
+      display: block; }
+  .page-wrapper .mCSB_scrollTools {
+    width: 6px; }
+  .page-wrapper .mCSB_inside > .mCSB_container {
+    margin-right: 0px; }
+
+/*----------sidebar background images --------------*/
+.sidebar-bg.bg1 .sidebar-wrapper {
+  background-image: url(../images/bg1.jpg); }
+
+.sidebar-bg.bg2 .sidebar-wrapper {
+  background-image: url(../images/bg2.jpg); }
+images
+.sidebar-bg.bg3 .sidebar-wrapper {
+  background-image: url(../images/bg3.jpg); }
+
+.sidebar-bg.bg4 .sidebar-wrapper {
+  background-image: url(../images/bg4.jpg); }
+
+[data-bg="bg1"] {
+  background-image: url(../images/bg1.jpg); }
+
+[data-bg="bg2"] {
+  background-image: url(../images/bg2.jpg); }
+
+[data-bg="bg3"] {
+  background-image: url(../images/bg3.jpg); }
+
+[data-bg="bg4"] {
+  background-image: url(../images/bg4.jpg); }
+
+/*---- border-radius ------*/
+.border-radius-on .sidebar-header .user-pic {
+  border-radius: 12px; }
+
+.border-radius-on .badge {
+  border-radius: 8px; }
+
+.border-radius-on .sidebar-menu ul li i {
+  border-radius: 4px; }
+
+.border-radius-on .sidebar-footer .dropdown-menu {
+  border-top-left-radius: 4px;
+  border-top-right-radius: 4px; }
+  .border-radius-on .sidebar-footer .dropdown-menu .notification-content i,
+  .border-radius-on .sidebar-footer .dropdown-menu .message-content .pic {
+    border-radius: 4px; }
+
+.border-radius-on .sidebar-search input {
+  border-top-left-radius: 4px;
+  border-bottom-left-radius: 4px; }
+
+.border-radius-on .sidebar-search .input-group-append .input-group-text {
+  border-top-right-radius: 4px;
+  border-bottom-right-radius: 4px; }
+
+  .clockdate {
+  color: #c7c7c7; 
+  font-size: 14px;
+  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
+  font-weight: 400;
+  font-style: normal;
+  text-align: center;
+  }
\ No newline at end of file
diff --git a/website/static/css/sidebar-themes.css b/website/static/css/sidebar-themes.css
new file mode 100644
index 0000000..1cc4aa1
--- /dev/null
+++ b/website/static/css/sidebar-themes.css
@@ -0,0 +1,527 @@
+.default-theme .sidebar-wrapper {
+  background-color: #1d1d1d; }
+  .default-theme .sidebar-wrapper .sidebar-item {
+    border-top: 1px solid #2b2b2b; }
+    .default-theme .sidebar-wrapper .sidebar-item:first-child {
+      border-top: none; }
+  .default-theme .sidebar-wrapper a:not(.dropdown-item),
+  .default-theme .sidebar-wrapper .sidebar-header,
+  .default-theme .sidebar-wrapper .sidebar-search input,
+  .default-theme .sidebar-wrapper .sidebar-search i {
+    color: #adadad; }
+  .default-theme .sidebar-wrapper a:not(.dropdown-item):hover,
+  .default-theme .sidebar-wrapper .sidebar-menu li.active > a {
+    color: #d8d8d8; }
+  .default-theme .sidebar-wrapper .sidebar-search input.search-menu,
+  .default-theme .sidebar-wrapper .sidebar-search .input-group-text {
+    background-color: #2b2b2b;
+    border: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    margin-left: 1px; }
+  .default-theme .sidebar-wrapper .sidebar-menu a:hover i,
+  .default-theme .sidebar-wrapper .sidebar-menu a:hover:before,
+  .default-theme .sidebar-wrapper .sidebar-menu li.active a i {
+    color: #22ff16; }
+  .default-theme .sidebar-wrapper .sidebar-menu ul li a i {
+    background-color: #2b2b2b; }
+  .default-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+    background-color: #2b2b2b; }
+  .default-theme .sidebar-wrapper .sidebar-menu .header-menu span {
+    color: #868686; }
+  .default-theme .sidebar-wrapper .sidebar-footer {
+    background-color: #2b2b2b;
+    -webkit-box-shadow: 0px -1px 5px #1d1d1d;
+    box-shadow: 0px -1px 5px #1d1d1d;
+    border-top: 1px solid #2b2b2b; }
+  .default-theme .sidebar-wrapper .sidebar-footer > div:first-child {
+    border-left: none; }
+  .default-theme .sidebar-wrapper .sidebar-footer > div:last-child {
+    border-right: none; }
+
+.default-theme.toggled #close-sidebar {
+  color: #adadad; }
+
+.default-theme.toggled #close-sidebar:hover {
+  color: #d8d8d8; }
+
+.default-theme .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
+.default-theme .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
+.default-theme .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
+  background-color: #525965;
+  border-radius: 0; }
+
+.default-theme .mCSB_scrollTools .mCSB_draggerRail {
+  background-color: transparent; }
+
+.default-theme.sidebar-bg .sidebar-wrapper:before {
+  background-color: rgba(42, 42, 42, 0.9); }
+
+.default-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item),
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-header,
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-search input,
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-search i {
+  color: #c7c7c7; }
+
+.default-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item):hover,
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-menu li.active > a {
+  color: #f2f2f2; }
+
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-item {
+  border-color: #454545; }
+
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-search input.search-menu,
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-search .input-group-text {
+  background-color: rgba(81, 81, 81, 0.5); }
+
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+  background-color: rgba(81, 81, 81, 0.5); }
+
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-menu ul li a i {
+  background-color: rgba(81, 81, 81, 0.5); }
+
+.default-theme.sidebar-bg .sidebar-wrapper .sidebar-footer {
+  background-color: rgba(56, 56, 56, 0.5);
+  -webkit-box-shadow: 0px -1px 5px rgba(29, 29, 29, 0.8);
+  box-shadow: 0px -1px 5px rgba(29, 29, 29, 0.8);
+  border-top: 1px solid #383838; }
+
+.chiller-theme .sidebar-wrapper {
+  background-color: #2A2C2B; }
+  .chiller-theme .sidebar-wrapper .sidebar-item {
+    border-top: 1px solid #374140; }
+    .chiller-theme .sidebar-wrapper .sidebar-item:first-child {
+      border-top: none; }
+  .chiller-theme .sidebar-wrapper a:not(.dropdown-item),
+  .chiller-theme .sidebar-wrapper .sidebar-header,
+  .chiller-theme .sidebar-wrapper .sidebar-search input,
+  .chiller-theme .sidebar-wrapper .sidebar-search i {
+    color: #D9CB9E; }
+  .chiller-theme .sidebar-wrapper a:not(.dropdown-item):hover,
+  .chiller-theme .sidebar-wrapper .sidebar-menu li.active > a {
+    color: #ffe79a; }
+  .chiller-theme .sidebar-wrapper .sidebar-search input.search-menu,
+  .chiller-theme .sidebar-wrapper .sidebar-search .input-group-text {
+    background-color: #374140;
+    border: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    margin-left: 1px; }
+  .chiller-theme .sidebar-wrapper .sidebar-menu a:hover i,
+  .chiller-theme .sidebar-wrapper .sidebar-menu a:hover:before,
+  .chiller-theme .sidebar-wrapper .sidebar-menu li.active a i {
+    color: #ffbe00; }
+  .chiller-theme .sidebar-wrapper .sidebar-menu ul li a i {
+    background-color: #374140; }
+  .chiller-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+    background-color: #374140; }
+  .chiller-theme .sidebar-wrapper .sidebar-menu .header-menu span {
+    color: #a29464; }
+  .chiller-theme .sidebar-wrapper .sidebar-footer {
+    background-color: #374140;
+    -webkit-box-shadow: 0px -1px 5px #2A2C2B;
+    box-shadow: 0px -1px 5px #2A2C2B;
+    border-top: 1px solid #374140; }
+  .chiller-theme .sidebar-wrapper .sidebar-footer > div:first-child {
+    border-left: none; }
+  .chiller-theme .sidebar-wrapper .sidebar-footer > div:last-child {
+    border-right: none; }
+
+.chiller-theme.toggled #close-sidebar {
+  color: #D9CB9E; }
+
+.chiller-theme.toggled #close-sidebar:hover {
+  color: #ffe79a; }
+
+.chiller-theme .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
+.chiller-theme .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
+.chiller-theme .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
+  background-color: #525965;
+  border-radius: 0; }
+
+.chiller-theme .mCSB_scrollTools .mCSB_draggerRail {
+  background-color: transparent; }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper:before {
+  background-color: rgba(54, 57, 56, 0.9); }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item),
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-header,
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-search input,
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-search i {
+  color: #e7dfc3; }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item):hover,
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-menu li.active > a {
+  color: #fff3cd; }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-item {
+  border-color: #4e5d5b; }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-search input.search-menu,
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-search .input-group-text {
+  background-color: rgba(90, 106, 105, 0.5); }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+  background-color: rgba(90, 106, 105, 0.5); }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-menu ul li a i {
+  background-color: rgba(90, 106, 105, 0.5); }
+
+.chiller-theme.sidebar-bg .sidebar-wrapper .sidebar-footer {
+  background-color: rgba(67, 79, 78, 0.5);
+  -webkit-box-shadow: 0px -1px 5px rgba(42, 44, 43, 0.8);
+  box-shadow: 0px -1px 5px rgba(42, 44, 43, 0.8);
+  border-top: 1px solid #434f4e; }
+
+.legacy-theme .sidebar-wrapper {
+  background-color: #1e2229; }
+  .legacy-theme .sidebar-wrapper .sidebar-item {
+    border-top: 1px solid #2e333c; }
+    .legacy-theme .sidebar-wrapper .sidebar-item:first-child {
+      border-top: none; }
+  .legacy-theme .sidebar-wrapper a:not(.dropdown-item),
+  .legacy-theme .sidebar-wrapper .sidebar-header,
+  .legacy-theme .sidebar-wrapper .sidebar-search input,
+  .legacy-theme .sidebar-wrapper .sidebar-search i {
+    color: #818896; }
+  .legacy-theme .sidebar-wrapper a:not(.dropdown-item):hover,
+  .legacy-theme .sidebar-wrapper .sidebar-menu li.active > a {
+    color: #b8bfce; }
+  .legacy-theme .sidebar-wrapper .sidebar-search input.search-menu,
+  .legacy-theme .sidebar-wrapper .sidebar-search .input-group-text {
+    background-color: #2e333c;
+    border: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    margin-left: 1px; }
+  .legacy-theme .sidebar-wrapper .sidebar-menu a:hover i,
+  .legacy-theme .sidebar-wrapper .sidebar-menu a:hover:before,
+  .legacy-theme .sidebar-wrapper .sidebar-menu li.active a i {
+    color: #16c7ff; }
+  .legacy-theme .sidebar-wrapper .sidebar-menu ul li a i {
+    background-color: #2e333c; }
+  .legacy-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+    background-color: #2e333c; }
+  .legacy-theme .sidebar-wrapper .sidebar-menu .header-menu span {
+    color: #646e80; }
+  .legacy-theme .sidebar-wrapper .sidebar-footer {
+    background-color: #22262d;
+    -webkit-box-shadow: 0px -1px 5px #16191f;
+    box-shadow: 0px -1px 5px #16191f;
+    border-top: 1px solid #2e333c; }
+  .legacy-theme .sidebar-wrapper .sidebar-footer > div:first-child {
+    border-left: none; }
+  .legacy-theme .sidebar-wrapper .sidebar-footer > div:last-child {
+    border-right: none; }
+
+.legacy-theme.toggled #close-sidebar {
+  color: #818896; }
+
+.legacy-theme.toggled #close-sidebar:hover {
+  color: #b8bfce; }
+
+.legacy-theme .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
+.legacy-theme .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
+.legacy-theme .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
+  background-color: #525965;
+  border-radius: 0; }
+
+.legacy-theme .mCSB_scrollTools .mCSB_draggerRail {
+  background-color: transparent; }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper:before {
+  background-color: rgba(41, 46, 56, 0.9); }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item),
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-header,
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-search input,
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-search i {
+  color: #9da2ad; }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item):hover,
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-menu li.active > a {
+  color: #d6dae3; }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-item {
+  border-color: #444c59; }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-search input.search-menu,
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-search .input-group-text {
+  background-color: rgba(79, 88, 103, 0.5); }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+  background-color: rgba(79, 88, 103, 0.5); }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-menu ul li a i {
+  background-color: rgba(79, 88, 103, 0.5); }
+
+.legacy-theme.sidebar-bg .sidebar-wrapper .sidebar-footer {
+  background-color: rgba(45, 50, 60, 0.5);
+  -webkit-box-shadow: 0px -1px 5px rgba(22, 25, 31, 0.8);
+  box-shadow: 0px -1px 5px rgba(22, 25, 31, 0.8);
+  border-top: 1px solid #393f4a; }
+
+.cool-theme .sidebar-wrapper {
+  background-color: #38373D; }
+  .cool-theme .sidebar-wrapper .sidebar-item {
+    border-top: 1px solid #46454c; }
+    .cool-theme .sidebar-wrapper .sidebar-item:first-child {
+      border-top: none; }
+  .cool-theme .sidebar-wrapper a:not(.dropdown-item),
+  .cool-theme .sidebar-wrapper .sidebar-header,
+  .cool-theme .sidebar-wrapper .sidebar-search input,
+  .cool-theme .sidebar-wrapper .sidebar-search i {
+    color: #918F9E; }
+  .cool-theme .sidebar-wrapper a:not(.dropdown-item):hover,
+  .cool-theme .sidebar-wrapper .sidebar-menu li.active > a {
+    color: #b3b8c1; }
+  .cool-theme .sidebar-wrapper .sidebar-search input.search-menu,
+  .cool-theme .sidebar-wrapper .sidebar-search .input-group-text {
+    background-color: #46454c;
+    border: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    margin-left: 1px; }
+  .cool-theme .sidebar-wrapper .sidebar-menu a:hover i,
+  .cool-theme .sidebar-wrapper .sidebar-menu a:hover:before,
+  .cool-theme .sidebar-wrapper .sidebar-menu li.active a i {
+    color: #fe6fff; }
+  .cool-theme .sidebar-wrapper .sidebar-menu ul li a i {
+    background-color: #46454c; }
+  .cool-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+    background-color: #46454c; }
+  .cool-theme .sidebar-wrapper .sidebar-menu .header-menu span {
+    color: #747479; }
+  .cool-theme .sidebar-wrapper .sidebar-footer {
+    background-color: #414046;
+    -webkit-box-shadow: 0px -1px 5px #2a292d;
+    box-shadow: 0px -1px 5px #2a292d;
+    border-top: 1px solid #46454c; }
+  .cool-theme .sidebar-wrapper .sidebar-footer > div:first-child {
+    border-left: none; }
+  .cool-theme .sidebar-wrapper .sidebar-footer > div:last-child {
+    border-right: none; }
+
+.cool-theme.toggled #close-sidebar {
+  color: #918F9E; }
+
+.cool-theme.toggled #close-sidebar:hover {
+  color: #b3b8c1; }
+
+.cool-theme .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
+.cool-theme .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
+.cool-theme .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
+  background-color: #918F9E;
+  border-radius: 0; }
+
+.cool-theme .mCSB_scrollTools .mCSB_draggerRail {
+  background-color: transparent; }
+
+.cool-theme.sidebar-bg .sidebar-wrapper:before {
+  background-color: rgba(68, 67, 74, 0.9); }
+
+.cool-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item),
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-header,
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-search input,
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-search i {
+  color: #acaab6; }
+
+.cool-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item):hover,
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-menu li.active > a {
+  color: #cfd2d8; }
+
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-item {
+  border-color: #5f5d67; }
+
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-search input.search-menu,
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-search .input-group-text {
+  background-color: rgba(107, 105, 116, 0.5); }
+
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+  background-color: rgba(107, 105, 116, 0.5); }
+
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-menu ul li a i {
+  background-color: rgba(107, 105, 116, 0.5); }
+
+.cool-theme.sidebar-bg .sidebar-wrapper .sidebar-footer {
+  background-color: rgba(77, 76, 83, 0.5);
+  -webkit-box-shadow: 0px -1px 5px rgba(42, 41, 45, 0.8);
+  box-shadow: 0px -1px 5px rgba(42, 41, 45, 0.8);
+  border-top: 1px solid #525159; }
+
+.ice-theme .sidebar-wrapper {
+  background-color: #2B3A42; }
+  .ice-theme .sidebar-wrapper .sidebar-item {
+    border-top: 1px solid #3a4d56; }
+    .ice-theme .sidebar-wrapper .sidebar-item:first-child {
+      border-top: none; }
+  .ice-theme .sidebar-wrapper a:not(.dropdown-item),
+  .ice-theme .sidebar-wrapper .sidebar-header,
+  .ice-theme .sidebar-wrapper .sidebar-search input,
+  .ice-theme .sidebar-wrapper .sidebar-search i {
+    color: #9eb7c3; }
+  .ice-theme .sidebar-wrapper a:not(.dropdown-item):hover,
+  .ice-theme .sidebar-wrapper .sidebar-menu li.active > a {
+    color: #EFEFEF; }
+  .ice-theme .sidebar-wrapper .sidebar-search input.search-menu,
+  .ice-theme .sidebar-wrapper .sidebar-search .input-group-text {
+    background-color: #3a4d56;
+    border: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    margin-left: 1px; }
+  .ice-theme .sidebar-wrapper .sidebar-menu a:hover i,
+  .ice-theme .sidebar-wrapper .sidebar-menu a:hover:before,
+  .ice-theme .sidebar-wrapper .sidebar-menu li.active a i {
+    color: #38fbc7; }
+  .ice-theme .sidebar-wrapper .sidebar-menu ul li a i {
+    background-color: #3a4d56; }
+  .ice-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+    background-color: #3a4d56; }
+  .ice-theme .sidebar-wrapper .sidebar-menu .header-menu span {
+    color: #6c7b88; }
+  .ice-theme .sidebar-wrapper .sidebar-footer {
+    background-color: #2f3f48;
+    -webkit-box-shadow: 0px -1px 5px #2b3a42;
+    box-shadow: 0px -1px 5px #2b3a42;
+    border-top: 1px solid #3a4d56; }
+  .ice-theme .sidebar-wrapper .sidebar-footer > div:first-child {
+    border-left: none; }
+  .ice-theme .sidebar-wrapper .sidebar-footer > div:last-child {
+    border-right: none; }
+
+.ice-theme.toggled #close-sidebar {
+  color: #9eb7c3; }
+
+.ice-theme.toggled #close-sidebar:hover {
+  color: #EFEFEF; }
+
+.ice-theme .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
+.ice-theme .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
+.ice-theme .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
+  background-color: #8998a5;
+  border-radius: 0; }
+
+.ice-theme .mCSB_scrollTools .mCSB_draggerRail {
+  background-color: transparent; }
+
+.ice-theme.sidebar-bg .sidebar-wrapper:before {
+  background-color: rgba(53, 72, 81, 0.9); }
+
+.ice-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item),
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-header,
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-search input,
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-search i {
+  color: #beced6; }
+
+.ice-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item):hover,
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-menu li.active > a {
+  color: white; }
+
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-item {
+  border-color: #4f6874; }
+
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-search input.search-menu,
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-search .input-group-text {
+  background-color: rgba(89, 118, 132, 0.5); }
+
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+  background-color: rgba(89, 118, 132, 0.5); }
+
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-menu ul li a i {
+  background-color: rgba(89, 118, 132, 0.5); }
+
+.ice-theme.sidebar-bg .sidebar-wrapper .sidebar-footer {
+  background-color: rgba(57, 77, 87, 0.5);
+  -webkit-box-shadow: 0px -1px 5px rgba(43, 58, 66, 0.8);
+  box-shadow: 0px -1px 5px rgba(43, 58, 66, 0.8);
+  border-top: 1px solid #445b65; }
+
+.light-theme .sidebar-wrapper {
+  background-color: #ececec; }
+  .light-theme .sidebar-wrapper .sidebar-item {
+    border-top: 1px solid #f9f9f9; }
+    .light-theme .sidebar-wrapper .sidebar-item:first-child {
+      border-top: none; }
+  .light-theme .sidebar-wrapper a:not(.dropdown-item),
+  .light-theme .sidebar-wrapper .sidebar-header,
+  .light-theme .sidebar-wrapper .sidebar-search input,
+  .light-theme .sidebar-wrapper .sidebar-search i {
+    color: #74726E; }
+  .light-theme .sidebar-wrapper a:not(.dropdown-item):hover,
+  .light-theme .sidebar-wrapper .sidebar-menu li.active > a {
+    color: #424242; }
+  .light-theme .sidebar-wrapper .sidebar-search input.search-menu,
+  .light-theme .sidebar-wrapper .sidebar-search .input-group-text {
+    background-color: #f9f9f9;
+    border: none;
+    -webkit-box-shadow: none;
+    box-shadow: none;
+    margin-left: 1px; }
+  .light-theme .sidebar-wrapper .sidebar-menu a:hover i,
+  .light-theme .sidebar-wrapper .sidebar-menu a:hover:before,
+  .light-theme .sidebar-wrapper .sidebar-menu li.active a i {
+    color: #00a9fd; }
+  .light-theme .sidebar-wrapper .sidebar-menu ul li a i {
+    background-color: #f9f9f9; }
+  .light-theme .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+    background-color: #f9f9f9; }
+  .light-theme .sidebar-wrapper .sidebar-menu .header-menu span {
+    color: #6c7b88; }
+  .light-theme .sidebar-wrapper .sidebar-footer {
+    background-color: #f9f9f9;
+    -webkit-box-shadow: 0px -1px 5px #ececec;
+    box-shadow: 0px -1px 5px #ececec;
+    border-top: 1px solid #f9f9f9; }
+  .light-theme .sidebar-wrapper .sidebar-footer > div:first-child {
+    border-left: none; }
+  .light-theme .sidebar-wrapper .sidebar-footer > div:last-child {
+    border-right: none; }
+
+.light-theme.toggled #close-sidebar {
+  color: #74726E; }
+
+.light-theme.toggled #close-sidebar:hover {
+  color: #424242; }
+
+.light-theme .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar,
+.light-theme .mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar,
+.light-theme .mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar {
+  background-color: #A4A29E;
+  border-radius: 0; }
+
+.light-theme .mCSB_scrollTools .mCSB_draggerRail {
+  background-color: transparent; }
+
+.light-theme.sidebar-bg .sidebar-wrapper:before {
+  background-color: rgba(249, 249, 249, 0.9); }
+
+.light-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item),
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-header,
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-search input,
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-search i {
+  color: #8e8c87; }
+
+.light-theme.sidebar-bg .sidebar-wrapper a:not(.dropdown-item):hover,
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-menu li.active > a {
+  color: #5c5c5c; }
+
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-item {
+  border-color: white; }
+
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-search input.search-menu,
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-search .input-group-text {
+  background-color: rgba(255, 255, 255, 0.5); }
+
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-menu .sidebar-dropdown div {
+  background-color: rgba(255, 255, 255, 0.5); }
+
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-menu ul li a i {
+  background-color: rgba(255, 255, 255, 0.5); }
+
+.light-theme.sidebar-bg .sidebar-wrapper .sidebar-footer {
+  background-color: rgba(255, 255, 255, 0.5);
+  -webkit-box-shadow: 0px -1px 5px rgba(236, 236, 236, 0.8);
+  box-shadow: 0px -1px 5px rgba(236, 236, 236, 0.8);
+  border-top: 1px solid white; }
diff --git a/website/static/css/sidebars.css b/website/static/css/sidebars.css
new file mode 100644
index 0000000..e254601
--- /dev/null
+++ b/website/static/css/sidebars.css
@@ -0,0 +1,125 @@
+body {
+  min-height: 100vh;
+  min-height: -webkit-fill-available;
+}
+
+html {
+  height: -webkit-fill-available;
+}
+
+.sidebar {
+  height: calc(100vh - 100px);
+  width: 280px;
+  z-index: 1;
+  overflow-x: hidden;
+  padding-top: 20px;
+  height: 100vh;
+  background-color: rgb(33, 37, 41);
+  position: fixed;
+  top: 0;
+  left: 0;  
+  width: 280px;
+}
+
+.sidebar_content {
+  position: fixed;
+  height: calc(100vh - 100px);
+  width: 280px;
+  z-index: -1;
+  overflow-x: hidden;
+  padding-top: 20px;
+  background-color: rgb(33, 37, 41);
+  top: 0;
+  left: 0;  
+}
+
+.footer {
+  position: fixed;
+  width: 280px;
+  height: auto;
+  background-color: rgb(33, 37, 41);
+  bottom: 30px;
+  left: 0;
+}
+
+
+.main {
+  margin-left: 280px;
+  padding: 0px 10px;
+}
+
+.b-example-divider {
+  flex-shrink: 0;
+  width: 1.5rem;
+  height: 100vh;
+  background-color: rgba(0, 0, 0, .1);
+  border: solid rgba(0, 0, 0, .15);
+  border-width: 1px 0;
+  box-shadow: inset 0 .5em 1.5em rgba(0, 0, 0, .1), inset 0 .125em .5em rgba(0, 0, 0, .15);
+}
+
+.bi {
+  vertical-align: -.125em;
+  pointer-events: none;
+  fill: currentColor;
+}
+
+.dropdown-toggle {
+  outline: 0;
+}
+
+.nav-flush .nav-link {
+  border-radius: 0;
+}
+
+.btn-toggle {
+  display: inline-flex;
+  align-items: center;
+  padding: .25rem .5rem;
+  font-weight: 600;
+  color: rgba(0, 0, 0, .65);
+  background-color: transparent;
+  border: 0;
+}
+
+.btn-toggle:hover,
+.btn-toggle:focus {
+  color: rgba(0, 0, 0, .85);
+  background-color: #4012e6;
+}
+
+.btn-toggle::before {
+  width: 1.25em;
+  line-height: 0;
+  content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
+  transition: transform .35s ease;
+  transform-origin: .5em 50%;
+}
+
+.btn-toggle[aria-expanded="true"] {
+  color: rgba(0, 0, 0, .85);
+}
+
+.btn-toggle[aria-expanded="true"]::before {
+  transform: rotate(90deg);
+}
+
+.btn-toggle-nav a {
+  display: inline-flex;
+  padding: .1875rem .5rem;
+  margin-top: .125rem;
+  margin-left: 1.25rem;
+  text-decoration: none;
+}
+
+.scrollarea {
+  overflow-y: auto;
+}
+
+.fw-semibold {
+  font-weight: 600;
+}
+
+.lh-tight {
+  line-height: 1.25;
+}
\ No newline at end of file
diff --git a/website/static/images/.DS_Store b/website/static/images/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/website/static/images/.DS_Store differ
diff --git a/website/static/images/1.png b/website/static/images/1.png
new file mode 100644
index 0000000..c0c3169
Binary files /dev/null and b/website/static/images/1.png differ
diff --git a/website/static/images/2.png b/website/static/images/2.png
new file mode 100644
index 0000000..a7862e0
Binary files /dev/null and b/website/static/images/2.png differ
diff --git a/website/static/images/3.peg b/website/static/images/3.peg
new file mode 100644
index 0000000..29fd393
Binary files /dev/null and b/website/static/images/3.peg differ
diff --git a/website/static/images/3.png b/website/static/images/3.png
new file mode 100644
index 0000000..a7862e0
Binary files /dev/null and b/website/static/images/3.png differ
diff --git a/website/static/images/bg1.jpg b/website/static/images/bg1.jpg
new file mode 100644
index 0000000..c323caf
Binary files /dev/null and b/website/static/images/bg1.jpg differ
diff --git a/website/static/images/bg2.jpg b/website/static/images/bg2.jpg
new file mode 100644
index 0000000..2dd1c1f
Binary files /dev/null and b/website/static/images/bg2.jpg differ
diff --git a/website/static/images/bg3.jpg b/website/static/images/bg3.jpg
new file mode 100644
index 0000000..5c7d522
Binary files /dev/null and b/website/static/images/bg3.jpg differ
diff --git a/website/static/images/bg4.jpg b/website/static/images/bg4.jpg
new file mode 100644
index 0000000..582daa3
Binary files /dev/null and b/website/static/images/bg4.jpg differ
diff --git a/website/static/images/favicon.png b/website/static/images/favicon.png
new file mode 100644
index 0000000..c9b4166
Binary files /dev/null and b/website/static/images/favicon.png differ
diff --git a/website/static/images/user.jpg b/website/static/images/user.jpg
new file mode 100644
index 0000000..979f806
Binary files /dev/null and b/website/static/images/user.jpg differ
diff --git a/website/static/js/main.js b/website/static/js/main.js
new file mode 100644
index 0000000..a7ea16f
--- /dev/null
+++ b/website/static/js/main.js
@@ -0,0 +1,104 @@
+jQuery(function ($) {
+  // Dropdown menu
+  $('.sidebar-dropdown > a').click(function () {
+    $('.sidebar-submenu').slideUp(200);
+    if ($(this).parent().hasClass('active')) {
+      $('.sidebar-dropdown').removeClass('active');
+      $(this).parent().removeClass('active');
+    } else {
+      $('.sidebar-dropdown').removeClass('active');
+      $(this).next('.sidebar-submenu').slideDown(200);
+      $(this).parent().addClass('active');
+    }
+  });
+
+  //toggle sidebar
+  $('#toggle-sidebar').click(function () {
+    $('.page-wrapper').toggleClass('toggled');
+  });
+
+  // bind hover if pinned is initially enabled
+  if ($('.page-wrapper').hasClass('pinned')) {
+    $('#sidebar').hover(
+      function () {
+        console.log('mouseenter');
+        $('.page-wrapper').addClass('sidebar-hovered');
+      },
+      function () {
+        console.log('mouseout');
+        $('.page-wrapper').removeClass('sidebar-hovered');
+      }
+    );
+  }
+
+  //Pin sidebar
+  $('#pin-sidebar').click(function () {
+    if ($('.page-wrapper').hasClass('pinned')) {
+      // unpin sidebar when hovered
+      $('.page-wrapper').removeClass('pinned');
+      $('#sidebar').unbind('hover');
+    } else {
+      $('.page-wrapper').addClass('pinned');
+      $('#sidebar').hover(
+        function () {
+          console.log('mouseenter');
+          $('.page-wrapper').addClass('sidebar-hovered');
+        },
+        function () {
+          console.log('mouseout');
+          $('.page-wrapper').removeClass('sidebar-hovered');
+        }
+      );
+    }
+  });
+
+  //toggle sidebar overlay
+  $('#overlay').click(function () {
+    $('.page-wrapper').toggleClass('toggled');
+  });
+
+  //switch between themes
+  var themes =
+    'default-theme legacy-theme chiller-theme ice-theme cool-theme light-theme';
+  $('[data-theme]').click(function () {
+    $('[data-theme]').removeClass('selected');
+    $(this).addClass('selected');
+    $('.page-wrapper').removeClass(themes);
+    $('.page-wrapper').addClass($(this).attr('data-theme'));
+  });
+
+  // switch between background images
+  var bgs = 'bg1 bg2 bg3 bg4';
+  $('[data-bg]').click(function () {
+    $('[data-bg]').removeClass('selected');
+    $(this).addClass('selected');
+    $('.page-wrapper').removeClass(bgs);
+    $('.page-wrapper').addClass($(this).attr('data-bg'));
+  });
+
+  // toggle background image
+  $('#toggle-bg').change(function (e) {
+    e.preventDefault();
+    $('.page-wrapper').toggleClass('sidebar-bg');
+  });
+
+  // toggle border radius
+  $('#toggle-border-radius').change(function (e) {
+    e.preventDefault();
+    $('.page-wrapper').toggleClass('boder-radius-on');
+  });
+
+  //custom scroll bar is only used on desktop
+  if (
+    !/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(
+      navigator.userAgent
+    )
+  ) {
+    $('.sidebar-content').mCustomScrollbar({
+      axis: 'y',
+      autoHideScrollbar: true,
+      scrollInertia: 300,
+    });
+    $('.sidebar-content').addClass('desktop');
+  }
+});
diff --git a/website/static/qrcode/.DS_Store b/website/static/qrcode/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/website/static/qrcode/.DS_Store differ
diff --git a/website/static/qrcode/belkinc.png b/website/static/qrcode/belkinc.png
new file mode 100644
index 0000000..58faa6c
Binary files /dev/null and b/website/static/qrcode/belkinc.png differ
diff --git a/website/static/qrcode/gdiggity.png b/website/static/qrcode/gdiggity.png
new file mode 100644
index 0000000..b0f14cd
Binary files /dev/null and b/website/static/qrcode/gdiggity.png differ
diff --git a/website/taskinport.py b/website/taskinport.py
new file mode 100644
index 0000000..91038d7
--- /dev/null
+++ b/website/taskinport.py
@@ -0,0 +1,119 @@
+import requests
+from website.models import Tasks, Projects
+from website import db
+
+from json import loads, dumps
+import random
+
+def getNextTasks(nextcursor):
+    url = "https://api.notion.com/v1/databases/a692f980e9d4444481a12f8f75c2243e/query"
+
+    payload = dumps({
+    "start_cursor": nextcursor
+    })
+    headers = {
+    'Authorization': 'Bearer secret_E56vtGLhJHUK1o7WerXlnUaZHcbHnnlyFiMuPPwU1bz',
+    'Content-Type': 'application/json',
+    'Notion-Version': '2021-08-16'
+    }
+
+    response = requests.request("POST", url, headers=headers, data=payload)
+    jsonResponse = loads(response.text)
+    
+    with open('fulljson'+str(random.randrange(20, 50, 3))+'.json', 'w') as file:
+        file.write(dumps(jsonResponse))
+    
+    return jsonResponse
+
+def parsejsonMakeTask(json):    
+    import datetime
+    for i in range(len(json['results'])):
+        projectid = getdbid(json['results'][i]['properties']['Project']['relation'][0]['id'])
+        
+        try:
+            start = json['results'][i]['properties']["Due Date"]['date']['start']
+            if "T" in start:
+                data = start[0:start.find('T')]
+                duedate = datetime.datetime.strptime(data,"%Y-%m-%d")
+            else:
+                duedate = datetime.datetime.strptime(start,"%Y-%m-%d")
+        except Exception:
+            duedate = datetime.datetime.strptime('2021-12-31',"%Y-%m-%d")
+        
+        newtask = Tasks(
+            item = json['results'][i]['properties']["Task Name"]['title'][0]['text']['content'],
+            checked = json['results'][i]['properties']['Done']['checkbox'],
+            userid = 1,
+            duedate = duedate,
+            project = projectid
+        )
+        db.session.add(newtask)
+        db.session.commit()
+
+def get_tasks():
+    url = "https://api.notion.com/v1/databases/a692f980e9d4444481a12f8f75c2243e/query"
+
+    payload = ""
+    headers = {
+    'Content-Type': 'application/json',
+    'Notion-Version': '2021-05-13',
+    'Authorization': 'Bearer secret_E56vtGLhJHUK1o7WerXlnUaZHcbHnnlyFiMuPPwU1bz'
+    }
+
+    response = requests.request("POST", url, headers=headers, data=payload)
+    jsonResponse = loads(response.text)
+    
+    with open('fulljson.json', 'w') as file:
+        file.write(dumps(jsonResponse))
+    
+    return jsonResponse
+
+def projectname(id):
+
+    url = "https://api.notion.com/v1/pages/" + id
+
+    payload={}
+    headers = {
+    'Notion-Version': '2021-05-13',
+    'Authorization': 'Bearer secret_E56vtGLhJHUK1o7WerXlnUaZHcbHnnlyFiMuPPwU1bz'
+    }
+
+    response = requests.request("GET", url, headers=headers, data=payload)
+    data = loads(response.text)
+    
+    name = data['properties']["Project Name"]['title'][0]['text']['content']
+  
+    return name
+
+def getdbid(notion):
+    
+    count = db.session.query(Projects.id, Projects.notionid).filter(Projects.notionid == notion).count()
+    
+    if count > 0:
+        projectid = db.session.query(Projects.id, Projects.notionid).filter(Projects.notionid == notion).first()
+        return projectid[0]
+
+def notionidupdate():
+    url = "https://api.notion.com/v1/databases/eff25566ca524f7faa287b79e5175186/query"
+
+    payload = ""
+    headers = {
+    'Authorization': 'Bearer secret_E56vtGLhJHUK1o7WerXlnUaZHcbHnnlyFiMuPPwU1bz',
+    'Content-Type': 'application/json',
+    'Notion-Version': '2021-08-16'
+    }
+
+    response = requests.request("POST", url, headers=headers, data=payload)
+    jsonResponse = loads(response.text)
+    
+    for i in range(len(jsonResponse['results'])):
+        id = jsonResponse['results'][i]['id']
+        name = jsonResponse['results'][i]['properties']["Project Name"]['title'][0]['text']['content']
+
+        count = db.session.query(Projects).filter(Projects.name == name).count()
+        if count > 0:
+            record = db.session.query(Projects).filter(Projects.name == name).first()
+            record.notionid = id
+            db.session.commit()
+
+        
\ No newline at end of file
diff --git a/website/templates/.DS_Store b/website/templates/.DS_Store
new file mode 100644
index 0000000..3e9ca5c
Binary files /dev/null and b/website/templates/.DS_Store differ
diff --git a/website/templates/auth.html b/website/templates/auth.html
new file mode 100644
index 0000000..a9c114f
--- /dev/null
+++ b/website/templates/auth.html
@@ -0,0 +1,125 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+  <!-- <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/bootstrap.css')}}"> -->
+  <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/sidebars.css')}}">
+  <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/sidebar-themes.css')}}">
+  <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/main.css')}}">
+  <link rel="shortcut icon" type="image/png" href="images/favicon.png" />
+
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css"
+    integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
+    integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
+  <link rel="stylesheet" href="//malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.min.css">
+
+  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
+    integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous">
+  </script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"
+    integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous">
+  </script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"
+    integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous">
+  </script>
+  <script src="https://kit.fontawesome.com/999ca2bb93.js" crossorigin="anonymous"></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+
+  <title>{% block title %}{% endblock %}</title>
+
+  {% block style %}{% endblock %}
+</head>
+
+<body>
+  <div class="page-wrapper ice-theme sidebar-bg bg4 toggled">
+    <nav id="sidebar" class="sidebar-wrapper">
+      <div class="sidebar-content">
+        <!-- sidebar-brand  -->
+        <div class="sidebar-item sidebar-brand">
+          <a href="#">pro sidebar</a>
+        </div>
+        <!-- sidebar-header  -->
+        <div class="sidebar-item sidebar-menu">
+          <ul>
+            <li class="header-menu">
+              <a href="/login"><span>Login</span></a>
+            </li>
+            <li class="header-menu">
+              <a href="/sign-up"><span>SignUp</span></a>
+            </li>
+          </ul>
+        </div>
+      </div>
+    </nav>
+    <main class="page-content pt-2">
+      <div id="overlay" class="overlay"></div>
+      <div class="container-fluid p-5">
+        <div class="row">
+          <div class="form-group col-md">
+            {% block login %}
+            {% endblock %}
+          </div>
+        </div>
+      </div>
+    </main>
+  </div>
+
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"
+    integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous">
+  </script>
+  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"
+    integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous">
+  </script>
+  <script src="//malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+  <script src="{{url_for('static', filename = 'js/main.js')}}"></script>
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous">
+  </script>
+  <script>
+    function startTime() {
+      var today = new Date();
+      var hr = today.getHours();
+      var min = today.getMinutes();
+      var sec = today.getSeconds();
+      ap = (hr < 12) ? "<span>AM</span>" : "<span>PM</span>";
+      hr = (hr == 0) ? 12 : hr;
+      hr = (hr > 12) ? hr - 12 : hr;
+      //Add a zero in front of numbers<10
+      hr = checkTime(hr);
+      min = checkTime(min);
+      sec = checkTime(sec);
+
+      var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec'];
+      var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+      var curWeekDay = days[today.getDay()];
+      var curDay = today.getDate();
+      var curMonth = months[today.getMonth()];
+      var curYear = today.getFullYear();
+      date = curWeekDay + ", " + curMonth + " " + curDay + " " + curYear + " - " + hr + ":" + min + " " + ap
+      document.getElementById("date").innerHTML = date;
+
+      time = hr + ":" + min + ":" + sec + " " + ap
+      document.getElementById("clock").innerHTML = time;
+
+      var time = setTimeout(function () {
+        startTime()
+      }, 500);
+    }
+
+    function checkTime(i) {
+      if (i < 10) {
+        i = "0" + i;
+      }
+      return i;
+    }
+  </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/website/templates/base.html b/website/templates/base.html
new file mode 100644
index 0000000..acb0f38
--- /dev/null
+++ b/website/templates/base.html
@@ -0,0 +1,329 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+  <meta charset="UTF-8" />
+  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+
+  <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/bootstrap.css')}}">
+  <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/sidebars.css')}}">
+  <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/sidebar-themes.css')}}">
+  <link rel="stylesheet" type="text/css" href="{{url_for('static', filename = 'css/main.css')}}">
+  <link rel="shortcut icon" type="image/png" href="images/favicon.png" />
+
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+  <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css"
+    integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous">
+  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.8.2/css/all.css"
+    integrity="sha384-oS3vJWv+0UjzBfQzYUhtDYW+Pj2yciDJxpsK1OYPAYjqT085Qq/1cq5FLXAZQ7Ay" crossorigin="anonymous">
+  <link rel="stylesheet" href="//malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.min.css">
+
+  <script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
+    integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous">
+  </script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.3/umd/popper.min.js"
+    integrity="sha384-vFJXuSJphROIrBnz7yo7oB41mKfc8JzQZiCq4NCceLEaO4IHwicKwpJf9c9IpFgh" crossorigin="anonymous">
+  </script>
+  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta.2/js/bootstrap.min.js"
+    integrity="sha384-alpBpkh1PFOepccYVYDB4do5UnbKysX5WZXm3XxPqe5iKTfUKjNkCk9SaVuEZflJ" crossorigin="anonymous">
+  </script>
+  <script src="https://kit.fontawesome.com/999ca2bb93.js" crossorigin="anonymous"></script>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+
+  <title>{% block title %}{% endblock %}</title>
+
+  {% block style %}{% endblock %}
+</head>
+
+<body onload="startTime()">
+  <div class="page-wrapper default-theme sidebar-bg bg1 toggled">
+    <nav id="sidebar" class="sidebar-wrapper">
+      <div class="sidebar-content">
+        <!-- sidebar-brand  -->
+        <div class="sidebar-item sidebar-brand">
+          <a href="#">{% block proheader %}pro sidebar{% endblock %}</a>
+        </div>
+        <!-- sidebar-header  -->
+        <div class="sidebar-item sidebar-header d-flex flex-nowrap">
+          <div class="user-pic">
+            {% set fn = 'images/'+current_user.avatar_filename %}
+            <img class="img-responsive img-rounded" src="{{url_for('static', filename=fn)}}" alt="User picture">
+          </div>
+          <div class="user-info">
+            <span class="user-name">{{current_user.firstname}}
+              <strong>{{current_user.lastname}}</strong>
+            </span>
+            <span class="user-role">Administrator</span>
+            <span class="user-status">
+              <i class="fa fa-circle"></i>
+              <span>Online</span>
+            </span>
+          </div>
+        </div>
+        <!-- sidebar-clock  -->
+        <div class="clockdate sidebar-item sidebar-search">
+          <div class="clockdate-wrapper d-inline-flex">
+            <div id="date"></div>
+          </div>
+        </div>
+        <!-- sidebar-menu  -->
+        <div class=" sidebar-item sidebar-menu">
+          <ul>
+            <li class="header-menu">
+              <span>General</span>
+            </li>
+            <li class="sidebar-dropdown">
+              <a href="/home">
+                <i class="fa fa-tachometer-alt"></i>
+                <span class="menu-text">Dashboard</span>
+                <!-- <span class="badge badge-pill badge-warning">New</span> -->
+              </a>
+              <div class="sidebar-submenu">
+                <ul>
+                  <li>
+                    <a href="/home">Home
+                      <!-- <span class="badge badge-pill badge-success">Pro</span> -->
+                    </a>
+                  </li>
+                </ul>
+              </div>
+            </li>
+            <li class="sidebar-dropdown">
+              <a href="#">
+                <i class="fas fa-utensils"></i>
+                <span class="menu-text">Menu</span>
+                <!-- <span class="badge badge-pill badge-danger">3</span> -->
+              </a>
+              <div class="sidebar-submenu">
+                <ul>
+                  <li>
+                    <a href="/menu">Menu</a>
+                  </li>
+                  <li>
+                    <a href="/menu/recipe">Recipe</a>
+                  </li>
+                  <li>
+                    <a href="/menu/shopping">Shopping List</a>
+                  </li>
+                </ul>
+              </div>
+            </li>
+            <li class="sidebar-dropdown">
+              <a href="#">
+                <i class="fas fa-heartbeat"></i>
+                <span class="menu-text">Health</span>
+              </a>
+              <div class="sidebar-submenu">
+                <ul>
+                  <li>
+                    <a href="/health/facilities">Facilities</a>
+                  </li>
+                  <li>
+                    <a href="/health/doctors">Doctors</a>
+                  </li>
+                  <li>
+                    <a href="/health/medications">Medications</a>
+                  </li>
+                  <li>
+                    <a href="/health//medlist">Medication List</a>
+                  </li>
+                  <li>
+                    <a href="/health/hospital">Hospitalizations</a>
+                  </li>
+                  <li>
+                    <a href="/health/allergies">Allergies</a>
+                  </li>
+                  <li>
+                    <a href="/health/surgeries">Surgeries</a>
+                  </li>
+                  <li>
+                    <a href="/health/a1c">A1C</a>
+                  </li>
+                  <li>
+                    <a href="/health/cpap">CPAP Supplies</a>
+                  </li>
+                </ul>
+              </div>
+            </li>
+            <li class="sidebar-dropdown">
+              <a href="#">
+                <i class="fas fa-tasks"></i>
+                <span class="menu-text">Productivity</span>
+              </a>
+              <div class="sidebar-submenu">
+                <ul>
+                  <li>
+                    <a href="/productivity/goals">Goals</a>
+                  </li>
+                  <li>
+                    <a href="/productivity/projects">Projects</a>
+                  </li>
+                  <li>
+                    <a href="/productivity/tasks">Tasks</a>
+                  </li>
+                </ul>
+              </div>
+            </li>
+            <li class="sidebar-dropdown">
+              <a href="#">
+                <i class="fas fa-grin-alt"></i>
+                <span class="menu-text">Personal</span>
+              </a>
+              <div class="sidebar-submenu">
+                <ul>
+                  <li>
+                    <a href="/vehicle/vehicle">Vehicles</a>
+                  </li>
+                  <li>
+                    <a href="/personal/wifi">Wifi</a>
+                  </li>
+                  <li>
+                    <a href="/personal/housinghistory">Housing History</a>
+                  </li>
+                  <li>
+                    <a href="/personal/grave">Grave Markers</a>
+                  </li>
+                </ul>
+              </div>
+            </li>
+            <li class="sidebar-dropdown">
+              <a href="#">
+                <i class="fa fa-cog"></i>
+                <span class="menu-text">Settings</span>
+              </a>
+              <div class="sidebar-submenu">
+                <ul>
+                  <li>
+                    <a href="{{url_for('views.profile')}}">Profile</a>
+                  </li>
+                  <li>
+                    <a href="{{url_for('settings.settingsHome')}}">Settings</a>
+                  </li>
+                </ul>
+              </div>
+            </li>
+          </ul>
+        </div>
+        <!-- sidebar-menu  -->
+      </div>
+      <div class="sidebar-footer">
+        <div class="dropdown">
+          <a id="pin-sidebar" class="btn" href="#"><i class="fas fa-thumbtack"></i></a>
+        </div>
+        <div>
+          <a href="/logout">
+            <i class="fa fa-power-off"></i>
+          </a>
+        </div>
+        <div class="pinned-footer">
+          <a href="#">
+            <i class="fas fa-ellipsis-h"></i>
+          </a>
+        </div>
+      </div>
+    </nav>
+
+
+    {% with messages = get_flashed_messages(with_categories=true) %}
+    {% if messages %}
+    {% for category, message in messages %}
+    {% if category == 'error' %}
+    <div class="alert alert-danger alter-dismissable fade show main" role="alert">
+      {{ message }}
+      <button type="button" class="close" data-dismiss="alert">
+        <span aria-hidden="true">&times;</span>
+      </button>
+    </div>
+    {% else %}
+    <div class="alert alert-success alter-dismissable fade show main" role="alert">
+      {{ message }}
+      <button type="button" class="btn btn-outline-dark" data-dismiss="alert">
+        <span aria-hidden="false"><i class="fas fa-window-close"></i></span>
+      </button>
+    </div>
+    {% endif %}
+    {% endfor %}
+    {% endif %}
+    {% endwith %}
+
+    <!-- page-content  -->
+    <main class="page-content pt-2">
+      <div id="overlay" class="overlay"></div>
+      <div class="container-fluid p-5">
+        <div class="row">
+          <div class="form-group col-md-12">
+            <div id="submenu">
+              {% block submenu %}{% endblock %}
+            </div>
+          </div>
+          <div class="row">
+            <div class="form-group col-md-12">
+              {% block content %}
+              {% endblock %}
+            </div>
+          </div>
+        </div>
+      </div>
+    </main>
+    <!-- page-content -->
+  </div>
+  <!-- page-wrapper -->
+
+
+
+
+
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"
+    integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous">
+  </script>
+  <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"
+    integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous">
+  </script>
+  <script src="//malihu.github.io/custom-scrollbar/jquery.mCustomScrollbar.concat.min.js"></script>
+  <script src="{{url_for('static', filename = 'js/main.js')}}"></script>
+  <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js"
+    integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous">
+  </script>
+  <script>
+    function startTime() {
+      var today = new Date();
+      var hr = today.getHours();
+      var min = today.getMinutes();
+      var sec = today.getSeconds();
+      ap = (hr < 12) ? "<span>AM</span>" : "<span>PM</span>";
+      hr = (hr == 0) ? 12 : hr;
+      hr = (hr > 12) ? hr - 12 : hr;
+      //Add a zero in front of numbers<10
+      hr = checkTime(hr);
+      min = checkTime(min);
+      sec = checkTime(sec);
+
+      var months = ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec'];
+      var days = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
+      var curWeekDay = days[today.getDay()];
+      var curDay = today.getDate();
+      var curMonth = months[today.getMonth()];
+      var curYear = today.getFullYear();
+      date = curWeekDay + ", " + curMonth + " " + curDay + " " + curYear + " - " + hr + ":" + min + " " + ap
+      document.getElementById("date").innerHTML = date;
+
+      time = hr + ":" + min + ":" + sec + " " + ap
+      document.getElementById("clock").innerHTML = time;
+
+      var time = setTimeout(function () {
+        startTime()
+      }, 500);
+    }
+
+    function checkTime(i) {
+      if (i < 10) {
+        i = "0" + i;
+      }
+      return i;
+    }
+  </script>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/website/templates/emails/reorder_cpap.html b/website/templates/emails/reorder_cpap.html
new file mode 100644
index 0000000..7086b4e
--- /dev/null
+++ b/website/templates/emails/reorder_cpap.html
@@ -0,0 +1,193 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <style>
+        @import url('https://fonts.googleapis.com/css2?family=Baloo+Chettan+2:wght@400;500;800&family=Nunito:wght@400;900&family=Poppins:ital,wght@0,400;1,700&family=Staatliches&display=swap');
+    </style>
+    <title>CPAP Supply Request </title>
+    <style>
+        .indexloop {
+            text-align: left;
+            vertical-align: top;
+        }
+
+        .container {
+            font-family: Verdana, Geneva, Tahoma, sans-serif;
+            display: grid;
+            grid-template-columns: 100%;
+            grid-template-rows: auto auto auto auto;
+            gap: 0px 0px;
+            grid-auto-flow: row;
+            grid-template-areas:
+                "header"
+                "subheader"
+                "shipping";
+            border-left: 2px solid #000000;
+            border-right: 2px solid #000000;
+            border-top: 2px solid #000000;
+            border-bottom: 2px solid #000000;
+        }
+
+        
+        .shipping {
+            background-color: #eeeeee;
+            display:grid;
+            grid-template-columns: 60% 5% 35%;
+            grid-template-rows: auto auto;
+            gap: 0px 0px;
+            grid-template-areas:
+            "order . customer"
+            "order . ship";
+            grid-area: shipping;
+            color: black;
+            padding-top: 20px;
+            padding-bottom: 20px;
+            padding-left: 20px;
+            padding-right: 20px;
+            
+        }
+
+        .small{
+            font-size: 12px;
+        }
+        
+        .order {
+            grid-area: order;
+            font-size: 14px;
+            text-align: left;
+            list-style: decimal;
+        }
+
+        .customer {
+            grid-area: customer;
+            font-size: 14px;
+            text-align: center;
+        }
+
+        .ship {
+            grid-area: ship;
+            font-size: 14px;
+            text-align: center;
+        }
+
+        .subheader {
+            grid-area: subheader;
+            background-color: #FFFFFF;
+            color: #242424;
+            font-size: 14px;
+            text-align: left;
+            padding-left: 20px;
+        }
+
+        .header {
+            grid-area: header;
+            background-color: #ffcc99;
+            color: #242424;
+            font-size: 30px;
+            text-align: center;
+            padding-top: 20px;
+            padding-bottom: 20px;
+        }
+
+        .tableinfo {
+            background-color: #FFFFFF;
+            color: #242424;
+            font-size: 14px;
+        }
+
+        .tableinfo_title {
+            padding: 5px;
+            background-color: #99CCFF;
+            color: black;
+            font-size: 150%;
+            text-align: center;
+            font-family: 'Baloo Chettan 2', cursive;
+        }
+
+        .tablestyle {
+            background-color: #eeeeee;
+            border: 2px solid black;
+            font-family: 'Baloo Chettan 2', cursive;
+        }
+    </style>
+</head>
+
+<body>
+    <div class="container">
+        <div class="shipping">
+            <div class="order">
+                <table width="100%" border="0" align="left" cellpadding="5" cellspacing="0" class="tablestyle">
+                    <tbody>
+                        <tr>
+                            <td colspan="1" class="tableinfo_title">
+                                Order
+                            </td>
+                        </tr>
+                        <tr>
+                            <td class="tableinfo">
+                                <table>
+                                    {% for cpap in cpaps %}
+                                    <tr>
+                                        <td class="indexloop">{{loop.index}}</td>
+                                        <td>
+                                            <strong>{{cpap.name}}</strong> - ({{cpap.itemnum}})<br>
+                                            Last Ordered: {{cpap.lastordered.strftime("%A %B %d, %Y")}}
+                                        </td>
+                                    </tr>
+                                    {% endfor %}
+                                </table>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+            <div class="customer">
+                <table width="100%" border="0" align="right" cellpadding="5" cellspacing="0" class="tablestyle">
+                    <tbody>
+                        <tr>
+                            <td colspan="1" class="tableinfo_title"">
+                                Customer
+                            </td>
+                        </tr>
+                        <tr>
+                            <td class=" tableinfo">
+                                {{current_user.firstname}} {{current_user.lastname}}<br>
+                                dob: {{current_user.dob.strftime("%m/%d/%Y")}}<br>
+                                {{current_user.email}}
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+            <div class="ship">
+                <table width="100%" border="0" align="right" cellpadding="5" cellspacing="0" class="tablestyle">
+                    <tbody>
+                        <tr>
+                            <td colspan="1" class="tableinfo_title">
+                                Shipping
+                            </td>
+                        </tr>
+                        <tr>
+                            <td class="tableinfo">
+                                {{current_user.firstname}} {{current_user.lastname}}<br>
+                                {{current_user.address}}<br>
+                                {{current_user.city}}, {{current_user.state}} {{current_user.zip}}
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+        <div class="header">
+            CPAP Supply Request
+        </div>
+        <div class="subheader">
+            Please fulfill the following request for CPAP supplies.
+        </div>
+    </div>
+</body>
+
+</html>
\ No newline at end of file
diff --git a/website/templates/health/.DS_Store b/website/templates/health/.DS_Store
new file mode 100644
index 0000000..5008ddf
Binary files /dev/null and b/website/templates/health/.DS_Store differ
diff --git a/website/templates/health/__pycache__/health.cpython-38.pyc b/website/templates/health/__pycache__/health.cpython-38.pyc
new file mode 100644
index 0000000..54e9ec1
Binary files /dev/null and b/website/templates/health/__pycache__/health.cpython-38.pyc differ
diff --git a/website/templates/health/a1c.html b/website/templates/health/a1c.html
new file mode 100644
index 0000000..534ee24
--- /dev/null
+++ b/website/templates/health/a1c.html
@@ -0,0 +1,114 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+A1C for {{current_user.firstname}} {{current_user.lastname}}
+{% endblock %}
+
+{% block proheader %}
+Current A1C: {{currentvalue.testresult}}% EAG: {{eag}}
+{% endblock %}
+
+{% block content %}
+<div class="form-floating">
+    <form action="/health/a1c" , method="POST">
+        <label for="name">Date of test</label>
+        <input type="date" class="form-control" id="testdate" name="testdate">
+        <label for="reaction">Test Result (0.0)</label>
+        <input type="float" class="form-control" name="testresult" id="testresult">
+        <select name="doctor" id="doctor" class='form-select'>
+            {% for doctor in doctors %}
+            <option value="{{doctor.id}}">{{doctor.name}}</option>
+            {% endfor %}
+        </select>
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+        <input type="submit" name='a1cSubmit' value="Add A1C">
+    </form>
+</div>
+<div class="container">
+    <div class="row">
+        <div class="col">
+            <div id="table">
+                <table class="table table-responsive table-striped">
+                    <thead>
+                        <tr>
+                            <th>Date</th>
+                            <th>Result</th>
+                            <th>Avg Gluclose</th>
+                            <th>Doctor</th>
+                            <th><i class='fas fa-trash'></i></th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        {% for result in results %}
+                        <tr>
+                            <td>{{result.date.strftime("%B %d, %Y")}}</td>
+                            <td>{{result.testresult}}</td>
+                            <td>{{(28.7 * result.testresult - 46.7) | round | int }}</td>
+                            {% for doctor in doctors %}
+                            {% if doctor.id == result.doctorfk %}
+                            <td>{{doctor.name}}</td>
+                            <td><a href="/health/a1c/delete/{{result.id}}"><button class="btn btn-danger"><i
+                                            class="fas fa-trash"></i></button></a></td>
+                            {% endif %}
+                            {% endfor %}
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+        </div>
+        <div class="col">
+            <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/3.0.2/chart.min.js"></script>
+            <canvas id="myChart" width="200" height="200"></canvas>
+            <script>
+                var label = JSON.parse('{{labels | tojson | safe}}');
+                var dataset = JSON.parse('{{dataset | tojson | safe}}');
+
+                    var ctx = document.getElementById('myChart').getContext('2d');
+                var myChart = new Chart(ctx, {
+                    type: 'line',
+                    data: {
+                        labels: label,
+                        datasets: [{
+                            label: 'A1C',
+                            data: dataset,
+                            borderColor: "#3e95cd",
+                        }]
+                    },
+                    options: {
+                        responsive: true,
+                        interaction: {
+                            mode: 'index',
+                            intersect: false,
+                        },
+                        stacked: false,
+                        plugins: {
+                            title: {
+                                display: true,
+                                text: 'A1C History for {{current_user.firstname}} {{current_user.lastname}}'
+                            }
+                        },
+                        scales: {
+                            y: {
+                                type: 'linear',
+                                display: true,
+                                position: 'left',
+                            },
+                            y1: {
+                                type: 'linear',
+                                display: true,
+                                position: 'right',
+
+                                // grid line settings
+                                grid: {
+                                    drawOnChartArea: false, // only want the grid lines for one axis to show up
+                                },
+                            },
+                        }
+                    }
+                });
+            </script>
+        </div>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/allergies.html b/website/templates/health/allergies.html
new file mode 100644
index 0000000..b864f41
--- /dev/null
+++ b/website/templates/health/allergies.html
@@ -0,0 +1,51 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Allergic Medications
+{% endblock %}
+
+{% block proheader %}
+Allergy List for {{current_user.firstname}}
+{% endblock %}
+
+{% block content %}
+<form action="/health/allergies" , method="POST" class="row g-3">
+    <div class="col-3">
+        <label for="name">Name of Allergy</label>
+        <input type="text" class="form-control" id="name" name="name">
+    </div>
+    <div class="col-3">
+        <label for="reaction">Reaction</label>
+        <input type="text" class="form-control" name="reaction" id="reaction">
+    </div>
+    <div class="col-3">
+        <label for="dateadded">Date Added as Allergy</label>
+        <input type="date" class="form-control" id="dateadded" name="dateadded">
+    </div>
+    <div class="col-3">
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+        <input type="submit" class="btn btn-primary" name='allergySubmit' value="Add Allergy">
+    </div>
+</form>
+<table class="table table-responsive table-hover">
+    <thead>
+        <th>Name of Medication</th>
+        <th>Reaction</th>
+        <th>Date Discovered</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for allergy in allergies %}
+        <tr>
+            <td><a href="/health/allergy/{{allergy.id}}" class="btn text-danger">{{allergy.name}}</a></td>
+            <td>{{allergy.reaction}}</td>
+            <td>{{allergy.dateadded.strftime("%m-%d-%Y")}}</td>
+            <td></td>
+            <td><a href="/health/deletingAllergy/{{allergy.id}}" class="btn btn-danger" role="button"><i
+                        class="fas fa-trash-alt"></i></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/allergies_edit.html b/website/templates/health/allergies_edit.html
new file mode 100644
index 0000000..79afcb2
--- /dev/null
+++ b/website/templates/health/allergies_edit.html
@@ -0,0 +1,31 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+Edit Allergy
+{% endblock %}
+
+{% block proheader %}
+Edit {{allergy.name}}
+{% endblock %}
+
+{% block content %}
+<form action="/health/allergy/{{allergy.id}}" , method="POST" class="row g-3">
+    <div class="col-3">
+        <label for="name">Name of Allergy</label>
+        <input type="text" class="form-control" id="name" name="name" value="{{allergy.name}}">
+    </div>
+    <div class="col-3">
+        <label for="reaction">Reaction</label>
+        <input type="text" class="form-control" name="reaction" id="reaction" value="{{allergy.reaction}}">
+    </div>
+    <div class="col-3">
+        <label for="dateadded">Date Added as Allergy</label>
+        <input type="date" class="form-control" id="dateadded" name="dateadded"
+            value="{{allergy.dateadded.strftime('%Y-%d-%m')}}">
+    </div>
+    <div class="col-3">
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+        <input type="submit" class="btn btn-primary" name='allergySubmit' value="Edit Allergy">
+    </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/cpap.html b/website/templates/health/cpap.html
new file mode 100644
index 0000000..4403207
--- /dev/null
+++ b/website/templates/health/cpap.html
@@ -0,0 +1,98 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+CPAP Supplies
+{% endblock %}
+
+{% block proheader %}
+CPAP Supplies for {{current_user.firstname}}
+{% endblock %}
+
+{% block content %}
+<!-- Button trigger modal -->
+<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
+    Add New CPAP Supply
+</button>
+{% if cntCpap != 0 %}
+<a href="/health/cpap/reorder" class="btn btn-primary">Re-Order Supplies</a>
+{% endif %}
+
+
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
+    aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">Add New CPAP Supply</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <form action="/health/cpap" method="post" class="row g-2">
+                    <div class="col-8">
+                        <label class="form-label" for="name">Name of CPAP Supply</label>
+                        <input class="form-control" type="text" name="name" id="name">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="itemnum">Item Number</label>
+                        <input class="form-control" type="text" name="itemnum" id="itemnum">
+                    </div>
+                    <div class="col-6">
+                        <label class="form-label" for="lastordered">Last Ordered</label>
+                        <input class="form-control" type="date" name="lastordered" id="lastordered">
+                    </div>
+                    <div class="col-6">
+                        <label class="form-label" for="howoften">How Many days to reorder</label>
+                        <input class="form-control" type="number" name="howoften" id="howoften">
+                    </div>
+                    <div class="col-12">
+                        <label class="form-label" for="imageURL">URL for Image</label>
+                        <input class="form-control" type="url" name="imageURL" id="imageURL">
+                    </div>
+                    
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+                <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                <button type="submit" class="btn btn-primary">Save changes</button>
+            </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+<table class="table table-bordered table-hover">
+    <thead>
+        <th></th>
+        <th>Name <br>
+            Last Ordered <br>
+            Next Order <br>
+            Item Number
+        </th>
+    </thead>
+    <tbody>
+        {% for cpap in cpaps %}
+        <tr>
+            <td width="135px"><a href="/health/cpap/{{cpap.id}}"><img src="{{cpap.imageURL}}" class="btn" width="125px"
+                        height="125px"></a>
+            </td>
+            <td>
+                <strong>{{cpap.name}}</strong> <br>
+                <p class="small">({{cpap.itemnum}})</p>
+                Last Ordered: {{cpap.lastordered.strftime("%A %B %d, %Y")}} <br>
+                Next Order Date: {{cpap.nextorderdate.strftime("%A %B %d, %Y")}} <br>
+            </td>
+            <td width="5%">
+                <a href="/health/cpap/{{cpap.id}}" class="btn btn-primary" role="button"><i class="fas fa-edit"></i></a>
+            </td>
+            <td width="5%">
+                <a href="/health/cpap/delete/{{cpap.id}}"><button class="btn btn-danger"><i
+                            class="fas fa-trash-alt"></i></button></a>
+            </td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/cpap_single.html b/website/templates/health/cpap_single.html
new file mode 100644
index 0000000..d3c145b
--- /dev/null
+++ b/website/templates/health/cpap_single.html
@@ -0,0 +1,38 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+CPAP Supplies
+{% endblock %}
+
+{% block proheader %}
+Edit {{cpap.name}}
+{% endblock %}
+
+{% block content %}
+<form action="/health/cpap/{{cpap.id}}" method="post" class="row g-2">
+    <div class="col-8">
+        <label class="form-label" for="name">Name of CPAP Supply</label>
+        <input class="form-control" type="text" name="name" id="name" value="{{cpap.name}}">
+    </div>
+    <div class="col-4">
+        <label class="form-label" for="itemnum">Item Number</label>
+        <input class="form-control" type="text" name="itemnum" id="itemnum" value="{{cpap.itemnum}}">
+    </div>
+    <div class="col-6">
+        <label class="form-label" for="lastordered">Last Ordered</label>
+        <input class="form-control" type="date" name="lastordered" id="lastordered" value="{{cpap.lastordered.strftime('%Y-%m-%d')}}">
+    </div>
+    <div class="col-6">
+        <label class="form-label" for="howoften">How Many days to reorder</label>
+        <input class="form-control" type="number" name="howoften" id="howoften" value="{{cpap.howoften}}">
+    </div>
+    <div class="col-12">
+        <label class="form-label" for="imageURL">URL for Image</label>
+        <input class="form-control" type="url" name="imageURL" id="imageURL" value="{{cpap.imageURL}}">
+    </div>
+    <div class="col-4">
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+        <button type="submit" class="btn btn-primary">Save changes</button>
+    </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/doctors.html b/website/templates/health/doctors.html
new file mode 100644
index 0000000..b0327f3
--- /dev/null
+++ b/website/templates/health/doctors.html
@@ -0,0 +1,112 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Doctors
+{% endblock %}
+
+{% block proheader %}
+Doctors for {{current_user.firstname}}
+{% endblock %}
+
+{% block content %}
+<!-- Button trigger modal -->
+<button type="button" class="btn btn-primary col-4" data-bs-toggle="modal" data-bs-target="#exampleModal">
+    Add A Doctor
+</button>
+<table class="table table-hover table-striped">
+    <thead>
+        <th>Dr Name</th>
+        <th>Facility</th>
+        <th>Address</th>
+        <th>Phone</th>
+        <th>Card</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for doctor in doctors %}
+        <tr>
+            <td><a href="/health/doctors/edit/{{doctor.id}}" class="btn">{{doctor.name}}</a></td>
+            <td>{% for facility in facilities %}{% if facility.id == doctor.facilityfk %}{{facility.name}}{% endif %}{% endfor %}
+            </td>
+            <td>{{doctor.address}}<br>{{doctor.city}}, {{doctor.state}} {{doctor.zip}}</td>
+            <td><a href="tel:+1{{doctor.phone}}" class="btn text-decoration-none">{{doctor.phone}}</a></td>
+            <td><a href="/health/doctor/card/{{doctor.id}}" class="btn btn-info"><i class="fa fa-address-card"></i></a>
+            </td>
+            <td><a href="/health/doctors/edit/{{doctor.id}}" class="btn btn-primary" role="button"><i
+                        class="fas fa-edit"></i></a></td>
+            <td><a href="/deletingDoctors/{{doctor.id}}" class="btn btn-danger" role="button"><i
+                        class="fas fa-trash-alt"></i></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">Add A Doctor</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <form action="/health/doctors" , method="POST" class="row g-2">
+                    <div class="col-6">
+                        <label for="drname">Doctor's Name</label>
+                        <input type="text" class="form-control" id="drname" name="drname">
+                    </div>
+                    <div class="col-6">
+                        <label for="facility">Facility</label>
+                        <select class="form-select" type="text" name="facility" id="facility" list="facility">
+                            {% for facility in facilities %}
+                            {% if facility.userid == current_user.id %}
+                            {% if facility.type != 'Pharmacy' %}
+                            <option value="{{facility.id}}">{{facility.name}}</option>
+                            {% endif %}
+                            {% endif %}
+                            {% endfor %}
+                        </select>
+                    </div>
+                    <div class="col-5">
+                    <label for="address">Address</label>
+                    <input type="text" class="form-control" id="address" name="address">
+                </div>
+                <div class="col-3">
+                    <label for="city">City</label>
+                    <input type="text" class="form-control" id="city" name="city">
+                </div>
+                <div class="col-2">
+                    <label for="state">State</label>
+                    <input type="text" class="form-control" id="state" name="state">
+                </div>
+                <div class="col-2">
+                    <label for="zip">Zip Code</label>
+                    <input type="text" class="form-control" id="zip" name="zip">
+                </div>
+                <div class="col-4">
+                    <label for="phone">Phone Number</label>
+                    <input type="text" class="form-control" id="phone" name="phone">
+                </div>
+                <div class="col-4">
+                    <label for="email">E-mail Address</label>
+                    <input type="text" class="form-control" id="email" name="email">
+                </div>
+                <div class="col-4">
+                    <label for="asst">Assistants Name</label>
+                    <input type="text" class="form-control" id="asst" name="asst">
+                    <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                    </div>
+                </div>
+                <div>
+                    <button type="button" class="btn btn-secondary col-4" data-bs-dismiss="modal">Close</button>
+                    <button type="submit" class="btn btn-primary col-4">Save changes</button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/doctorsEdit.html b/website/templates/health/doctorsEdit.html
new file mode 100644
index 0000000..2a98679
--- /dev/null
+++ b/website/templates/health/doctorsEdit.html
@@ -0,0 +1,59 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Doctors
+{% endblock %}
+
+{% block proheader %}
+Edit {{doctors.name}}
+{% endblock %}
+
+{% block content %}
+<form action="/health/doctors/edit/{{doctors.id}}" method="POST" class="row g-3">
+    <div class="col-6">
+        <label for="drname">Doctor's Name</label>
+        <input type="text" class="form-control" id="drname" name="drname" value="{{doctors.name}}">
+    </div>
+    <div class="col-6">
+        <label for="facility">Facility's Name</label>
+        <select class="form-select" name="facility" id="facility">
+            {% for fac in facilities %}
+            <option value="{{fac.id}}" {{ 'selected' if fac.id == doctors.facilityfk|int }}>{{fac.name}}</option>
+            {% endfor %}
+        </select>
+    </div>
+    <div class="col-5">
+        <label for="address">Address</label>
+        <input type="text" class="form-control" id="address" name="address" value="{{doctors.address}}">
+    </div>
+    <div class="col-3">
+        <label for="city">City</label>
+        <input type="text" class="form-control" id="city" name="city" value="{{doctors.city}}">
+    </div>
+    <div class="col-2">
+        <label for="state">State</label>
+        <input type="text" class="form-control" id="state" name="state" value="{{doctors.state}}">
+    </div>
+    <div class="col-2">
+        <label for="zip">Zip Code</label>
+        <input type="text" class="form-control" id="zip" name="zip" value="{{doctors.zip}}">
+    </div>
+    <div class="col-4">
+        <label for="phone">Phone Number</label>
+        <input type="text" class="form-control" id="phone" name="phone" value="{{doctors.phone}}">
+    </div>
+    <div class="col-4">
+        <label for="email">E-mail Address</label>
+        <input type="text" class="form-control" id="email" name="email" value="{{doctors.email}}">
+    </div>
+    <div class="col-4">
+        <label for="asst">Assistants Name</label>
+        <input type="text" class="form-control" id="asst" name="asst" value="{{doctors.asst}}">
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+        <input type="hidden" name='facility' value="{{doctors.facilityfk}}">
+    </div>
+    <div class="col-4">
+        <input type="submit" name='docSubmit' value="Edit Doctor">
+    </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/editfacilities.html b/website/templates/health/editfacilities.html
new file mode 100644
index 0000000..814e447
--- /dev/null
+++ b/website/templates/health/editfacilities.html
@@ -0,0 +1,50 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Facilities
+{% endblock %}
+
+{% block proheader %}
+Edit {{facility.name}}
+{% endblock %}
+
+{% block content %}
+<form action="/health/edit_facilities/{{facility.id}}" , method="POST" class="row g-2">
+    <div class="col-12">
+        <label for="drname">Facility Name</label>
+        <input type="text" class="form-control" id="name" name="name" value="{{facility.name}}">
+    </div>
+    <div class="col-6">
+        <label for="addy">Address</label>
+        <input type="text" class="form-control" name="addy" id="addy" value="{{facility.address}}">
+    </div>
+    <div class="col-2">
+        <label for="city">City</label>
+        <input type="text" class="form-control" id="city" name="city" value="{{facility.city}}">
+    </div>
+    <div class="col-2">
+        <label for="state">State</label>
+        <input type="text" class="form-control" name="state" id="state" maxlength="2" value="{{facility.state}}">
+    </div>
+    <div class="col-2">
+        <label for="zip">Zip Code</label>
+        <input type="text" class="form-control" name="zip" id="zip" value="{{facility.zip}}">
+    </div>
+    <div class="col-6">
+        <label for="type">Type of Facility</label> <br>
+        <select name="type" id="type" class="form-select">
+            {% if facility.type == "Hosptial" %}<option selected value="Hosptial">Hosptial</option>{% else %}<option value="Hosptial">Hosptial</option>{% endif %}
+            {% if facility.type == "Clinic" %}<option selected value="Clinic">Clinic</option>{% else %}<option value="Clinic">Clinic</option>{% endif %}
+            {% if facility.type == "Pharmacy" %}<option selected value="Pharmacy">Pharmacy</option>{% else %}<option value="Pharmacy">Pharmacy</option>{% endif %}
+            {% if facility.type == "DME" %}<option selected value="DME">DME</option>{% else %}<option value="DME">DME</option>{% endif %}
+        </select>
+    </div>
+    <div class="col-6">
+        <label for="phone">Phone Number</label>
+        <input type="text" class="form-control" name="phone" id="phone" value="{{facility.phone}}">
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+    </div>
+        <button type="button" class="btn btn-secondary col-4" data-bs-dismiss="modal">Close</button>
+        <button type="submit" class="btn btn-primary col-4">Save changes</button>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/facilities.html b/website/templates/health/facilities.html
new file mode 100644
index 0000000..440aafb
--- /dev/null
+++ b/website/templates/health/facilities.html
@@ -0,0 +1,95 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Facilities
+{% endblock %}
+
+{% block proheader %}
+Facility List for {{current_user.firstname}}
+{% endblock %}
+
+{% block content %}
+<!-- Button trigger modal -->
+<button type="button" class="btn btn-primary col-3" data-bs-toggle="modal" data-bs-target="#exampleModal">
+    Add New Facility
+</button>
+
+<table class="table table-hover table-striped">
+    <thead>
+        <th>Facility Name</th>
+        <th>Doctors</th>
+        <th>Address</th>
+        <th>Phone</th>
+        <th>Type</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for facility in facilities %}
+        <tr>
+            <td><a href="/health/edit_facilities/{{facility.id}}" class="btn">{{facility.name}}</a></td>
+            <td>{% if facility.type == "Clinic" %}{% for doctor in doctors %}{% if facility.id == doctor.facilityfk %}{{doctor.name}}<br>{% endif %}{% endfor %}{% endif %}</td>
+            <td>{{facility.address}}<br>{{facility.city}}, {{facility.state}} {{facility.zip}}</td>
+            <td>{{facility.phone}}</td>
+            <td>{{facility.type}}</td>
+            <td><a href="/health/edit_facilities/{{facility.id}}" class="btn btn-primary" role="button"><i class="fas fa-edit"></i></a></td>
+            <td><a href="/deletingFacility/{{facility.id}}" class="btn btn-danger" role="button"><i class="fas fa-trash-alt"></i></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">Add a New Facility</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <form action="/health/facilities" , method="POST" class="row g-2">
+                    <div class="col-12">
+                        <label for="drname">Facility Name</label>
+                        <input type="text" class="form-control" id="name" name="name">
+                    </div>
+                    <div class="col-6">
+                        <label for="addy">Address</label>
+                        <input type="text" class="form-control" name="addy" id="addy">
+                    </div>
+                    <div class="col-2">
+                        <label for="city">City</label>
+                        <input type="text" class="form-control" id="city" name="city">
+                    </div>
+                    <div class="col-2">
+                        <label for="state">State</label>
+                        <input type="text" class="form-control" name="state" id="state" maxlength="2">
+                    </div>
+                    <div class="col-2">
+                        <label for="zip">Zip Code</label>
+                        <input type="text" class="form-control" name="zip" id="zip">
+                    </div>
+                    <div class="col-6">
+                        <label for="type">Type of Facility</label> <br>
+                        <select name="type" id="type" class="form-select">
+                            <option value="Hosptial">Hosptial</option>
+                            <option value="Clinic">Clinic</option>
+                            <option value="Pharmacy">Pharmacy</option>
+                            <option value="DME">DME</option>
+                        </select>
+                    </div>
+                    <div class="col-6">
+                        <label for="phone">Phone Number</label>
+                        <input type="text" class="form-control" name="phone" id="phone">
+                        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                    </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                <button type="submit" class="btn btn-primary">Save changes</button>
+            </div>
+            </form>
+        </div>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/health-div.html b/website/templates/health/health-div.html
new file mode 100644
index 0000000..d5393c8
--- /dev/null
+++ b/website/templates/health/health-div.html
@@ -0,0 +1,22 @@
+{% extends "base.html" %}
+
+{% block submenu %}
+<div class="btn-group" role="group" aria-label="Button group with nested dropdown">
+    <a href="/health/facilities"><button type="button" class="btn">Facilities</button></a>
+    <a href="/health/doctors"><button type="button" class="btn">Doctors</button></a>
+    <a href="/health/surgeries"><button type="button" class="btn">Surgeries</button></a>
+    <a href="/health/hospital"><button type="button" class="btn">Hospitalizations</button></a>
+    <a href="/health/allergies"><button type="button" class="btn">Allergies</button></a>
+    <a href="/health/medications"><button type="button" class="btn">Medications</button></a>
+    <a href="/health/medlist"><button type="button" class="btn">Medication List</button></a>
+    <a href="/health/cpap"><button type="button" class="btn">CPAP Supplies</button></a>
+</div>
+{% endblock %}
+
+{% block title %}
+{{current_user.username}} Health Information
+{% endblock %}
+
+{% block content %}
+{% endblock %}
+
diff --git a/website/templates/health/health.html b/website/templates/health/health.html
new file mode 100644
index 0000000..b780f2c
--- /dev/null
+++ b/website/templates/health/health.html
@@ -0,0 +1,13 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Health
+{% endblock %}
+
+{% block proheader %}
+{{current_user.firstname}}'s Health</h1>
+{% endblock %}
+
+{% block content %}
+{% endblock %}
+
diff --git a/website/templates/health/health.py b/website/templates/health/health.py
new file mode 100644
index 0000000..ce8730a
--- /dev/null
+++ b/website/templates/health/health.py
@@ -0,0 +1,531 @@
+from operator import or_
+from flask import Blueprint, render_template, request, flash, redirect, url_for, send_file, after_this_request
+from flask.templating import render_template_string
+from flask_login import login_required
+
+from website.models import *
+from flask_mail import Message
+from datetime import datetime, timedelta
+from dateutil import relativedelta
+from website import db, mail
+import css_inline, html2text
+
+
+from subprocess import run, PIPE
+from sqlalchemy.sql import func, desc, or_
+from website.vfc_maker import make_vfc
+import datetime, sys, flask_login, os
+from math import ceil
+from website.process_medications import *
+
+health = Blueprint("health", __name__)
+
+#Health
+@health.route("/health", methods=['GET'])
+# @login_required
+def healthHome():
+    return render_template("health/health.html", user=User)
+
+@health.route("/doctors", methods=['GET', 'POST'])
+@login_required
+def doctors():
+    if request.method == 'POST':
+        newdr = Doctor(
+            name=request.form.get('drname').title(), 
+            facilityfk=request.form.get('facility'), 
+            userid=request.form.get('thisuserid'),
+            address=request.form.get('address'),
+            city=request.form.get('city'),
+            state=request.form.get('state'),
+            zip=request.form.get('zip'),
+            phone=request.form.get('phone'),
+            email=request.form.get('email'),
+            asst=request.form.get('asst')
+            )
+        db.session.add(newdr)
+        db.session.commit() 
+    
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).order_by(Doctor.facilityfk, Doctor.name).all()
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).all()
+    return render_template("health/doctors.html", user=User, doctors=doctors, facilities=facilities)
+
+@health.route("/facilities", methods=['GET', 'POST'])
+@login_required
+def facilities():
+    if request.method == 'POST':
+        newfac = Facility(
+            name=request.form.get('name'),
+            address=request.form.get('addy'),
+            city=request.form.get('city'),
+            state=request.form.get('state'),
+            zip=request.form.get('zip'),
+            phone=request.form.get('phone'),
+            type = request.form.get('type'),
+            userid = request.form.get('thisuserid')
+            )
+        
+        db.session.add(newfac)
+        db.session.commit()
+        
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).order_by(Facility.type, Facility.name).all()
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).all()
+    return render_template("health/facilities.html", user=User, facilities=facilities, doctors=doctors)
+
+@health.route("/edit_facilities/<id>", methods=['GET', 'POST'])
+@login_required
+def editfacilities(id):
+    facility = db.session.query(Facility).filter(Facility.id == id).first()
+    if request.method == 'POST':
+        facility.name = request.form.get('name')
+        facility.address=request.form.get('addy')
+        facility.city=request.form.get('city')
+        facility.state=request.form.get('state')
+        facility.zip=request.form.get('zip')
+        facility.phone=request.form.get('phone')
+        facility.type = request.form.get('type')
+        facility.userid = request.form.get('thisuserid')
+        db.session.commit()
+        return redirect(url_for('health.facilities'))
+        
+    return render_template("health/editfacilities.html", user=User, facility=facility)
+
+
+@health.route("/surgeries", methods=['GET', 'POST'])
+@login_required
+def surgeries():
+    if request.method == 'POST':
+        
+        def calculateAge(startdate):
+            bday = flask_login.current_user.dob
+            age = startdate.year - bday.year
+            return age
+     
+        newsurg = Surgeries(
+            name = request.form.get('name'),
+            startdate= datetime.datetime.strptime(request.form.get('sdate'),"%Y-%m-%d"),
+            description= request.form.get('desc'),
+            body_part= request.form.get('bodypart'),
+            age = calculateAge(datetime.datetime.strptime(request.form.get('sdate'),"%Y-%m-%d")),
+            doctorfk= request.form.get('doctor'),
+            facilityfk= request.form.get('facility'),
+            userid= request.form.get('thisuserid')
+        )
+        db.session.add(newsurg)
+        db.session.commit()
+    
+    surgeries = db.session.query(Surgeries).filter(Surgeries.userid == flask_login.current_user.id).order_by(desc(Surgeries.startdate)).all()
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).order_by(Doctor.name).all()
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).filter(Facility.type != "Pharmacy").order_by(Facility.name).all()
+    return render_template("health/surgeries.html", user=User, facilities=facilities, doctors=doctors, surgeries=surgeries)
+
+@health.route("/hospital", methods=['GET', 'POST'])
+@login_required
+def hospital():
+    if request.method == 'POST':
+        newhosp = Hosptial(
+            datestart = datetime.datetime.strptime(request.form.get('sdate'),("%Y-%m-%d")),
+            dateend = datetime.datetime.strptime(request.form.get('edate'),("%Y-%m-%d")),
+            reason = request.form.get('reason'),
+            doctorfk = request.form.get('doctor'),
+            facilityfk = request.form.get('facility'),
+            userid = flask_login.current_user.id
+        )
+        db.session.add(newhosp)
+        db.session.commit()
+    
+    stays = db.session.query(Hosptial).filter(Hosptial.userid == flask_login.current_user.id).order_by(desc(Hosptial.datestart)).all()
+    LOS = []
+    for stay in stays:
+        delta = relativedelta.relativedelta(stay.dateend, stay.datestart)
+        if delta.months >= 1:
+            length = f'{delta.months} months, \n{delta.weeks} weeks, \n{delta.days-(delta.weeks*7)} days'
+        elif delta.months == 0 and delta.weeks >= 1:
+            length = f'{delta.weeks} weeks, {delta.days-(delta.weeks*7)} days'
+        elif delta.months == 0 and delta.weeks == 0:
+            length = f'{delta.days} days'
+        else: length = 'error'
+        little = {}
+        little['id'] = stay.id
+        little['stay'] = length
+        LOS.append(little)
+        
+        
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).order_by(Doctor.facilityfk).all()
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).filter(Facility.type == "Hosptial").order_by(Facility.type, Facility.name).all()
+    return render_template("health/hospital.html", user=User, stays=stays, doctors=doctors, facilities=facilities, los=LOS)
+
+@health.route("/hospital/delete/<id>", methods=['GET', 'POST'])
+@login_required
+def hospital_delete(id):
+    db.session.query(Hosptial).filter(Hosptial.id == id).delete()
+    db.session.commit()
+    return redirect(url_for('health.hospital'))
+
+@health.route("/hospital/<id>", methods=['GET', 'POST'])
+@login_required
+def hospital_update(id):
+    if request.method == 'POST':
+       udstay = db.session.query(Hosptial).filter(Hosptial.id == id).first()
+       udstay.datestart = datetime.datetime.strptime(request.form.get('sdate'),"%m/%d/%Y")
+       udstay.dateend = datetime.datetime.strptime(request.form.get('edate'),"%m/%d/%Y")
+       udstay.reason = request.form.get('reason')
+       udstay.doctorfk = request.form.get('doctor')
+       udstay.facilityfk = request.form.get('facility')
+       udstay.userid = flask_login.current_user.id
+       db.session.commit()
+       return redirect(url_for('health.hospital'))
+                       
+    stay = db.session.query(Hosptial).filter(Hosptial.id == id).first()
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).order_by(Doctor.facilityfk).all()
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).filter(Facility.type == "Hosptial").order_by(Facility.type, Facility.name).all()
+    return render_template('health/hospital_update.html', user=User, stay=stay, doctors=doctors, facilities=facilities)
+
+@health.route("/medications", methods=['GET', 'POST'])
+@login_required
+# TODO: Make it so the user can know when the medication is due to be refilled.
+# FIXME: Create a 8.5 x 11 report in pdf to print out. (made report medlist.html.  Need to get it to print with pdfkit)
+def medications():
+    if request.method == 'POST':
+        # if request.form['exportPDF'] == 'exportPDF':
+        #     pdfkit.from_url("http://127.0.0.1:5000"+url_for('health.medlistPrint'), 'medlist-'+flask_login.current_user.firstname+' '+flask_login.current_user.lastname+'.pdf')
+        #     render_template(url_for('health.medications'))
+        
+        lastrefill = datetime.datetime.strptime(request.form.get('lastordered'),"%Y-%m-%d")
+        numfilleddays=request.form.get('num_filled_days')
+
+        newmed = Medications(
+            name=request.form.get('name').title(),
+            dose=request.form.get('dose'),
+            how_often=request.form.get('howoften'),
+            num_filled_days=request.form.get('num_filled_days'),
+            reason_for_taking=request.form.get('reason_for_taking'),
+            pharmacy=request.form.get('pharm'),
+            last_refilled = lastrefill,
+            next_refill = lastrefill + datetime.timedelta(days=int(numfilleddays)),
+            userid=request.form.get('thisuserid'),
+            doctorfk=request.form.get('doctor')
+            )
+        db.session.add(newmed)
+        db.session.commit()
+    
+    pharmacy = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).filter(Facility.type == "Pharmacy").all()
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).all()
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).all()
+    medications = db.session.query(Medications).filter(Medications.userid == flask_login.current_user.id).order_by(Medications.next_refill, Medications.name).all()
+    return render_template("health/medications.html", user=User, facilities=facilities, doctors=doctors, pharmacy=pharmacy, medications=medications)
+
+@health.route('/medupdate/<id>', methods=['GET', 'POST'])
+@login_required
+def medupdate(id):
+    if request.method == 'POST':
+        print(request.form.get('howoften'))
+        lastrefill = datetime.datetime.strptime(request.form.get('lastordered'),"%Y-%m-%d")
+        med = db.session.query(Medications).filter(Medications.id == id).first()
+        med.name = request.form.get('name')
+        med.dose = request.form.get('dose')
+        med.how_often = request.form.get('howoften')
+        med.reason_for_taking = request.form.get('reason_for_taking')
+        med.last_refilled = lastrefill
+        med.next_refill = lastrefill + datetime.timedelta(days=int(request.form.get('num_filled_days')))
+        med.num_filled_days = request.form.get('num_filled_days')
+        med.doctorfk = request.form.get('doctor')
+        med.pharmacy = request.form.get('rx')
+        db.session.commit()
+        return redirect(url_for('health.medications'))
+    meds = db.session.query(Medications).filter(Medications.id == id).first()
+    pharm = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).filter(Facility.type == "Pharmacy").all()
+    doctors = db.session.query(Doctor).filter(Doctor.userid ==flask_login.current_user.id).order_by(Doctor.name).all()
+    return render_template("health/medupdate.html", user=User, meds=meds, pharms=pharm, doctors=doctors)
+
+@health.route("/medications/reorder", methods=['GET', 'POST'])
+@login_required
+def medications_reorder():
+    referrer = request.referrer
+    def reorder_meds(id, med, dose, howoften, days, reason, pharm, doctor, lastrefill):
+        meds = db.session.query(Medications).filter(Medications.id == id).first()
+        meds.name = med
+        meds.dose = dose
+        meds.how_often = howoften
+        meds.num_filled_days = days
+        meds.reason_for_taking = reason
+        meds.pharmacy = pharm
+        meds.doctorfk = doctor
+        meds.last_refilled = lastrefill
+        meds.next_refill = lastrefill + timedelta(days=int(days))
+        meds.process = True
+        db.session.commit()
+        
+
+    if request.method == 'POST':
+        if request.form.get('process') == 'PROCESS MEDICATIONS':
+            path = os.path.dirname(os.path.abspath(__file__))
+            filename = "ics.ics"
+            fullname = os.path.join(path,filename)
+            results = db.session.query(Medications).filter(Medications.process == True).filter(Medications.userid == flask_login.current_user.id).all()
+            cal = request.form.get('calendar')
+            if len(results) == 0:
+                message = "No medications found to process.  Please check the process field and re-run this program"
+                print(message)
+                redirect(url_for ('health.medications_reorder'), message=message)
+            else:
+                make_ics(fullname, cal)
+                for result in results:
+                    details_ics(result,fullname)
+                close_ics(path,filename,fullname)
+                
+                for result in results:
+                    make_tasks(result)
+                    set_process_to_no(result)
+                print('Done!')
+            @after_this_request
+            def filedelete(response):
+                if os.path.exists(fullname):
+                    os.remove(fullname)
+                return response
+        
+        else:
+            reorder = request.form.getlist('reorder')
+            id = request.form.getlist('id')
+            med = request.form.getlist('med')
+            dose = request.form.getlist('dose')
+            howoften = request.form.getlist('how_often')
+            days = request.form.getlist('num_filled_days')
+            reason = request.form.getlist('reason_for_taking')
+            pharm = request.form.getlist('pharmacy')
+            doctor = request.form.getlist('doctorfk')
+            lastrefill = request.form.get('reorder_date')
+            
+            for i in range(len(id)):
+                if reorder[i] == "Yes":
+                    reorder_meds(
+                        id[i], 
+                        med[i], 
+                        dose[i], 
+                        howoften[i],
+                        days[i], 
+                        reason[i], 
+                        pharm[i], 
+                        doctor[i], 
+                        datetime.datetime.strptime(lastrefill,"%Y-%m-%d")
+                        )
+            return redirect(referrer)
+        return send_file(fullname, as_attachment=True)
+    pharmacy = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).filter(Facility.type == "Pharmacy").all()
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).all()
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).all()
+    medications = db.session.query(Medications).filter(Medications.userid == flask_login.current_user.id).order_by(Medications.next_refill, Medications.name).all()
+    return render_template("health/medications_reorder.html", user=User, facilities=facilities, doctors=doctors, pharmacy=pharmacy, medications=medications, ref=referrer)
+
+@health.route("/cpap", methods=['GET','POST'])
+@login_required
+def cpap():
+    if request.method == "POST":
+        lastordered = datetime.datetime.strptime(request.form.get('lastordered'),"%Y-%m-%d")
+        nextorder = lastordered + timedelta(days = int(request.form.get('howoften')))
+        newsupply = Cpap(
+            name = request.form.get('name'),
+            itemnum = request.form.get('itemnum'),
+            howoften = request.form.get('howoften'),
+            lastordered = lastordered,
+            nextorderdate = nextorder,
+            imageURL = request.form.get('imageURL'),
+            userid = request.form.get('thisuserid')
+        ) 
+        db.session.add(newsupply)
+        db.session.commit()
+        return redirect(url_for('health.cpap'))
+    
+    cntCpap = db.session.query(Cpap).filter(Cpap.nextorderdate <= datetime.datetime.now()+timedelta(days=5)).filter(Cpap.userid == flask_login.current_user.id).count()
+    cpaps = db.session.query(Cpap).filter(Cpap.userid == flask_login.current_user.id).order_by(Cpap.nextorderdate).all()
+    return render_template("health/cpap.html", user=User, cpaps=cpaps, cntCpap=cntCpap)
+
+@health.route("/cpap/reorder", methods=['GET'])
+@login_required
+def cpap_reorder():
+    cntCpap = db.session.query(Cpap).filter(Cpap.nextorderdate <= datetime.datetime.now()+timedelta(days=5)).filter(Cpap.userid == flask_login.current_user.id).count()
+    if cntCpap != 0:
+        cpaps = db.session.query(Cpap).filter(Cpap.nextorderdate <= datetime.datetime.now()+timedelta(days=5)).filter(Cpap.userid == flask_login.current_user.id).all()
+        template = render_template('/emails/reorder_cpap.html', user=User, cpaps=cpaps)
+        inlined = css_inline.inline(template)
+        msg = Message()
+        msg.subject = 'CPAP order for ' + flask_login.current_user.firstname + " " + flask_login.current_user.lastname
+        msg.sender = flask_login.current_user.email
+        msg.recipients = ['paul@mailtrap.io', 'rbtm2006@me.com']
+        msg.html = inlined
+        msg.body = html2text.html2text(inlined)
+        mail.send(msg)
+        flash('Email Sent Sucessfully', category='success')
+    return redirect(url_for('health.cpap'))
+
+@health.route("/cpap/delete/<id>", methods=['GET'])
+@login_required
+def deletecpap(id):
+    Cpap.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('health.cpap'))
+
+@health.route("/cpap/<id>", methods=['GET', 'POST'])
+@login_required
+def updatecpap(id):
+    if request.method == "POST":
+        lastordered = datetime.datetime.strptime(request.form.get('lastordered'),"%Y-%m-%d")
+        nextorder = lastordered + timedelta(days = int(request.form.get('howoften')))
+        
+        updatecpap = db.session.query(Cpap).filter_by(id=id).first()
+        updatecpap.name = request.form.get('name')
+        updatecpap.lastordered = lastordered
+        updatecpap.nextorderdate = nextorder
+        updatecpap.howoften = request.form.get('howoften')
+        updatecpap.imageURL = request.form.get('imageURL')
+        updatecpap.itemnum = request.form.get('itemnum')
+        db.session.commit()
+        
+        return redirect(url_for('health.cpap'))
+    
+    cpap = Cpap.query.filter_by(id=id).first()
+    return render_template('health/cpap_single.html', user=User, cpap=cpap)
+
+@health.route("/deletingMed/<id>")
+@login_required
+def deleteMed(id):
+    Medications.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('health.medications'))
+
+@health.route("/deletingFacility/<id>")
+@login_required
+def deleteFacility(id):
+    Facility.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('health.facilities'))
+
+@health.route("/deletingDoctors/<id>")
+@login_required
+def deleteDoctors(id):
+    Doctor.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('health.doctors'))
+
+@health.route("/allergies", methods=['GET', 'POST'])
+@login_required
+def allergies():
+    if request.method == 'POST':
+        allergic = Allergies(
+            name=request.form.get('name').title(),
+            reaction = request.form.get('reaction'),
+            dateadded = datetime.datetime.strptime(request.form.get('dateadded'),"%Y-%m-%d"),
+            userid=request.form.get('thisuserid')
+            )
+        db.session.add(allergic)
+        db.session.commit()
+    
+    allergies = db.session.query(Allergies).filter(Allergies.userid ==flask_login.current_user.id).order_by(desc(Allergies.dateadded), Allergies.name).all()
+    return render_template("health/allergies.html", user=User, allergies=allergies)
+
+@health.route("/deletingAllergy/<id>")
+@login_required
+def deletingAllergy(id):
+    Allergies.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('health.allergies'))
+
+@health.route("/a1c", methods=['GET', 'POST'])
+@login_required
+def a1c():
+    if request.method == "POST":
+        newresult = A1C(
+            date = datetime.datetime.strptime(request.form.get('testdate'), "%Y-%m-%d"),
+            testresult = request.form.get('testresult'),
+            userid = request.form.get('thisuserid'),
+            doctorfk = request.form.get('doctor')
+        )
+        db.session.add(newresult)
+        db.session.commit()
+        
+    results = db.session.query(A1C).filter(A1C.userid == flask_login.current_user.id).order_by(desc(A1C.date)).all()
+    
+    labels = []
+    dataset = []
+    for result in results:
+        label = result.date.strftime("%m/%y")
+        data = result.testresult
+        labels.append(label)
+        dataset.append(data)
+
+    
+    currentvalue = db.session.query(func.max(A1C.date).label('ld'), A1C.testresult, A1C.userid).filter(A1C.userid == flask_login.current_user.id).order_by(A1C.date).first()
+    if currentvalue.testresult is None:
+        eag=0
+    else:
+        eag = ceil(28.7 * currentvalue.testresult - 46.7)
+    
+    doctors = db.session.query(Doctor).filter(Doctor.userid ==flask_login.current_user.id).order_by(Doctor.name).all()
+    return render_template("/health/a1c.html", user=User, results=results, currentvalue=currentvalue, doctors=doctors, eag=eag, labels=labels, dataset=dataset)
+
+@health.route("/doctor/card/<id>", methods=['GET'])
+def makeCard(id): 
+    doctorinfo = db.session.query(Doctor.name, Doctor.address, Doctor.city, Doctor.state, Doctor.zip, Doctor.phone, Doctor.email, Facility.name.label('company')).filter(Doctor.id == id).join(Facility,Facility.id == Doctor.facilityfk).first()
+    filename = make_vfc(doctorinfo)
+    
+    @after_this_request
+    def deletefile(response):
+        if os.path.exists("website/"+filename):
+            os.remove("website/"+filename)
+        return response
+    return send_file(filename, attachment_filename=filename)
+    
+@health.route("/doctors/edit/<id>", methods=['GET', 'POST'])
+@login_required
+def doctorsEdit(id):
+    if request.method == 'POST':
+        editDr = db.session.query(Doctor).filter(Doctor.id == id).first()
+        editDr.name=request.form.get('drname').title()
+        editDr.facilityfk=request.form.get('facility')
+        editDr.userid=request.form.get('thisuserid')
+        editDr.address=request.form.get('address')
+        editDr.city=request.form.get('city')
+        editDr.state=request.form.get('state')
+        editDr.zip=request.form.get('zip')
+        editDr.phone=request.form.get('phone')
+        editDr.email=request.form.get('email')
+        editDr.asst=request.form.get('asst')
+        db.session.commit()
+        return redirect(url_for('health.doctors'))
+        
+    doctors = db.session.query(Doctor).filter(Doctor.id == id).first()
+    facilities = db.session.query(Facility).filter(Facility.userid == flask_login.current_user.id).filter(or_(Facility.type == 'Clinic', Facility.type == 'Hosptial')).all()
+    return render_template("health/doctorsEdit.html", user=User, doctors=doctors, facilities=facilities)
+
+@health.route("/medlist", methods=['GET'])
+def medlistPrint():
+    medications = db.session.query(Medications).filter(Medications.userid == flask_login.current_user.id).order_by(Medications.reason_for_taking,Medications.name).all()
+    doctors = db.session.query(Doctor).filter(Doctor.userid == flask_login.current_user.id).order_by(Doctor.name).all()
+    return render_template("health/medicationlist.html", user=User, medications=medications, doctors=doctors)
+
+@health.route("/a1c/delete/<id>")
+@login_required
+def deleteA1C(id):
+    A1C.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('health.a1c'))
+
+@health.route("/surgery/delete/<id>")
+@login_required
+def deleteSurg(id):
+    Surgeries.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('health.surgeries'))
+
+@health.route("/allergy/<id>", methods=["GET","POST"])
+@login_required
+def allergy_edit(id):
+    if request.method == 'POST':
+        item = db.session.query(Allergies).filter_by(id=id).first()
+        item.name = request.form.get('name')
+        item.reaction = request.form.get('reaction')
+        item.dateadded = datetime.datetime.strptime(request.form.get('dateadded'),"%Y-%m-%d")
+        db.session.commit()
+        return redirect(url_for('health.allergies'))
+    
+    allergy = db.session.query(Allergies).filter_by(id=id).first()
+    return render_template('health/allergies_edit.html', user=User, allergy=allergy )
diff --git a/website/templates/health/hospital.html b/website/templates/health/hospital.html
new file mode 100644
index 0000000..2949dbc
--- /dev/null
+++ b/website/templates/health/hospital.html
@@ -0,0 +1,109 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Hospitalizations
+{% endblock %}
+
+{% block proheader %}
+Hospitalizations for {{current_user.firstname}}
+{% endblock %}
+
+{% block content %}
+
+<table class="table table-bordered">
+    <thead>
+        <th>Dates</th>
+        <th>Length</th>
+        <th>Reason</th>
+        <th>Doctor</th>
+        <th>Facility</th>
+        <th></th>
+    </thead>
+    <tbody>
+        
+        {% for stay in stays %}
+        <tr>
+            <td><a href="{{ url_for('health.hospital_update', id=stay.id) }}" class="btn">{{stay.datestart.strftime("%m/%d/%y")}} -
+                    {{stay.dateend.strftime("%m/%d/%y")}}</a></td>
+            <td>
+                {% for lgh in los %}
+                {% if lgh['id'] == stay.id %}
+                {{lgh['stay']}}
+                {% endif %}
+                {% endfor %}
+            </td>
+            <td>{{stay.reason}}</td>
+            <td>
+                {% for doctor in doctors  %}
+                {% if stay.doctorfk == doctor.id %}
+                {{doctor.name}}
+                {% endif %}
+                {% endfor %}
+            </td>
+            <td>
+                {% for facility in facilities  %}
+                {% if stay.facilityfk == facility.id %}
+                {{facility.name}}
+                {% endif %}
+                {% endfor %}
+            </td>
+            <td><a href="/health/hospital/delete/{{stay.id}}"><button class="btn btn-danger"><i
+                            class="fas fa-trash-alt"></i></button></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+
+<!-- Button trigger modal -->
+<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
+    Add New Hospitalization
+</button>
+
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
+    <div class="modal-dialog">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">Add Hospitalization</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <form action="/health/hospital" method="POST" class="row g-3">
+                    <div class="col-6">
+                        <label for="sdate" class="form-label">Start Date</label>
+                        <input type="date" class="form-control" name="sdate" id="sdate">
+                    </div>
+                    <div class="col-6">
+                        <label for="edate" class="form-label">End Date</label>
+                        <input type="date" class="form-control" name="edate" id="edate">
+                    </div>
+                    <div class="col-md-12">
+                        <label for="reason" class="form-label">Reason</label>
+                        <input type="text" class="form-control" id="reason" name="reason">
+                    </div>
+                    <div class="col-md-6">
+                        <label for="doctor" class="form-label">Doctor</label>
+                        <select name="doctor" id="doctor" class="form-select">
+                            {% for doctor in doctors %}
+                            <option value="{{doctor.id}}">{{doctor.name}}</option>
+                            {% endfor %}
+                        </select>
+                    </div>
+                    <div class="col-md-6">
+                        <label for="facility" class="form-label">Facility</label>
+                        <select name="facility" id="facility" class="form-select">
+                            {% for facility in facilities %}
+                            <option value="{{facility.id}}">{{facility.name}}</option>
+                            {% endfor %}
+                        </select>
+                    </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                <button type="submit" class="btn btn-primary">Add Hospitalization</button>
+            </div>
+            </form>
+        </div>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/hospital_update.html b/website/templates/health/hospital_update.html
new file mode 100644
index 0000000..d0ea03d
--- /dev/null
+++ b/website/templates/health/hospital_update.html
@@ -0,0 +1,53 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+Update
+{% endblock %}
+
+{% block proheader %}
+Update Hospitalization
+{% endblock %}
+
+{% block content %}
+<form action="{{ url_for('health.hospital_update', id=stay.id) }}" method="POST" class="row g-3">
+    <div class="col-6">
+        <label for="sdate" class="form-label">Start Date</label>
+        <input type="text" class="form-control" name="sdate" id="sdate" value="{{stay.datestart.strftime('%m/%d/%Y')}}">
+    </div>
+    <div class="col-6">
+        <label for="edate" class="form-label">End Date</label>
+        <input type="text" class="form-control" name="edate" id="edate" value="{{stay.dateend.strftime('%m/%d/%Y')}}">
+    </div>
+    <div class="col-md-12">
+        <label for="reason" class="form-label">Reason</label>
+        <input type="text" class="form-control" id="reason" name="reason" value="{{stay.reason}}">
+    </div>
+    <div class="col-md-6">
+        <label for="doctor" class="form-label">Doctor</label>
+        <select name="doctor" id="doctor" class="form-select">
+            {% for doctor in doctors %}
+            {% if stay.doctorfk == doctor.id %}
+            <option selected value="{{doctor.id}}">{{doctor.name}}</option>
+            {% else %}
+            <option value="{{doctor.id}}">{{doctor.name}}</option>
+            {% endif %}
+            {% endfor %}
+        </select>
+    </div>
+    <div class="col-md-6">
+        <label for="facility" class="form-label">Facility</label>
+        <select name="facility" id="facility" class="form-select">
+            {% for facility in facilities %}
+            {% if stay.facilityfk == facility.id %}
+            <option selected value="{{facility.id}}">{{facility.name}}</option>
+            {% else %}
+            <option value="{{facility.id}}">{{facility.name}}</option>
+            {% endif %}
+            {% endfor %}
+        </select>
+    </div>
+    <div class="col-md-12">
+        <button type="submit" class="btn btn-primary">Update Hospitalization</button>
+    </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/medicationlist.html b/website/templates/health/medicationlist.html
new file mode 100644
index 0000000..22286f3
--- /dev/null
+++ b/website/templates/health/medicationlist.html
@@ -0,0 +1,62 @@
+{% extends 'health/health-div.html' %}
+
+{% block style %}
+<style>
+    .header {
+        position: fixed;
+        top: 0;
+    }
+
+    .footer {
+        position: fixed;
+        bottom: 0;
+    }
+</style>
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block proheader %}
+{{current_user.firstname}} Medication List
+{% endblock %}
+
+{% block content %}
+<div class="header">
+    <H4>{{current_user.firstname}} {{current_user.lastname}} Medications</H4>
+    <h6>DOB: {{current_user.dob.strftime("%m/%d/%y") }}</h6>
+</div>
+<br> <br> <br>
+<div class="content">
+    <table class="table table-striped table-sm">
+        <thead>
+            <th>Medication</th>
+            <th>Doctor</th>
+            <th>Dose</th>
+            <th>When</th>
+            <th>Reason</th>
+            <th>Last Refilled</th>
+        </thead>
+        <tbody>
+            {% for medication in medications %}
+            <tr>
+                <td>{{medication.name}}</td>
+                <td>{% for doctor in doctors %}{% if doctor.id == medication.doctorfk %}{{doctor.name}}{% endif %}{% endfor %}
+                </td>
+                <td>{{medication.dose}}</td>
+                <td>{{medication.how_often}}</td>
+                <td>{{medication.reason_for_taking}}</td>
+                <td>{{medication.last_refilled.strftime("%m-%d-%Y")}}</td>
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+</div>
+<div class="footer">
+    <h6>As of <script>
+            document.write(new Date().toLocaleDateString());
+        </script>
+    </h6>
+
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/medications.html b/website/templates/health/medications.html
new file mode 100644
index 0000000..5b2cb09
--- /dev/null
+++ b/website/templates/health/medications.html
@@ -0,0 +1,116 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Medications
+{% endblock %}
+
+{% block proheader %}
+Medications for {{current_user.firstname}}
+{% endblock %}
+
+{% block content %}
+
+<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
+    Add New Medication
+</button>
+<a href="/health/medications"><button name="exportPDF" class='btn btn-warning' value="exportPDF">Export PDF</button></a>
+
+<table class="table table-striped table-hover">
+    <thead>
+        <th>Medication</th>
+        <th># of Days</th>
+        <th>Refill</th>
+    </thead>
+    <tbody>
+        {% for medication in medications %}
+        <tr>
+            <td>
+                {{medication.name}} ({{medication.dose}}) <br>
+                {% for doctor in doctors %}
+                {% if doctor.id == medication.doctorfk %}
+                {{doctor.name}}
+                {% endif %}
+                {% endfor %}
+            </td>
+            <td>{{medication.num_filled_days}} day supply</td>
+            <td>
+                Last Refill: {{ medication.last_refilled.strftime("%m-%d-%Y") }} <br>
+                Next Refill: {{ medication.next_refill.strftime("%m-%d-%Y") }}
+            </td>
+            <td>
+                <a href="/health/medupdate/{{medication.id}}" class="btn btn-primary" role="button"><i
+                        class="fas fa-calendar-plus"></i></a>
+                <a href="/deletingMed/{{medication.id}}" class="btn btn-danger" role="button"><i
+                        class="fas fa-trash-alt"></i></a>
+            </td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
+    aria-hidden="true">
+    <div class="modal-dialog modal-lg" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">Add New Medication</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <form action="/health/medications" class="row g-3 form-floating" , method="POST">
+                    <div class="col-6">
+                        <label for="name">Medication Name</label>
+                        <input type="text" class="form-control" id="name" name="name">
+                    </div>
+                    <div class="col-2">
+                        <label for="dose">Dose</label>
+                        <input type="text" class="form-control" name="dose" id="dose">
+                    </div>
+                    <div class="col-4">
+                        <label for="howoften">How Often</label>
+                        <input type="text" class="form-control" id="howoften" name="howoften">
+                    </div>
+                    <div class="col-4">
+                        <label for="num_filled_days">How many days was this filled</label>
+                        <input type="text" class="form-control" id="num_filled_days" name="num_filled_days">
+                    </div>
+                    <div class="col-4">
+                        <label for="reason_for_taking">Reason for taking</label>
+                        <input type="text" class="form-control" id="reason_for_taking" name="reason_for_taking">
+                    </div>
+                    <div class="col-4">
+                        <label for="lastordered">Last Ordered</label>
+                        <input type="date" class="form-control" id="lastordered" name="lastordered">
+                    </div>
+                    <div class="col-6">
+                        <label for="pharm">Pharmacy</label>
+                        <select name="pharm" id="pharm" class="form-select">
+                            {% for pharm in pharmacy %}
+                            <option value="{{pharm.id}}">{{pharm.name}}</option>
+                            {% endfor %}
+                        </select>
+                    </div>
+                    <div class="col-6">
+                        <label for="doctor">Prescribing Doctor</label>
+                        <select name="doctor" id="doctor" class="form-select">
+                            {% for doctor in doctors %}
+                            {% if doctor.userid == current_user.id %}
+                            <option value="{{doctor.id}}">{{doctor.name}}</option>
+                            {% endif %}
+                            {% endfor %}
+                        </select>
+                        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                    </div>
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+                    <button type="submit" class="btn btn-primary">Add Medication</button>
+                </div>
+            </form>
+        </div>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/medications_reorder.html b/website/templates/health/medications_reorder.html
new file mode 100644
index 0000000..712d852
--- /dev/null
+++ b/website/templates/health/medications_reorder.html
@@ -0,0 +1,95 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Medications
+{% endblock %}
+
+{% block proheader %}
+Refill Prescriptions for {{current_user.firstname}} 
+{% endblock %}
+
+{% block content %}
+<form action="/health/medications/reorder" , method="POST">
+    <input type="date" name="reorder_date" id="reorder_date"><button type="submit" name="process" value="ReOrder">ReOrder</button>
+    <div>
+        <select name="calendar" id="calendar">
+            <option value="Jeremy - Medical">Jeremy - Medical</option>
+            <option value="Sandy Medical">Sandy Medical</option>
+            <option value="Family">Family</option>
+            <option value="Shawn-Personal">Shawn-Personal</option>
+        </select>
+        <button type="submit" name="process" id="process" value="PROCESS MEDICATIONS" class="btn btn-primary">PROCESS MEDICATIONS</button>
+    </div>
+    <table class="table table-bordered table-hover">
+        <thead>
+            <tr>
+                <th>Reorder</th>
+                <th>Medication</th>
+                <th>Dose</th>
+                <th>How Often</th>
+                <th>Days Filled</th>
+            </tr>
+            <tr>
+                <th>Process?</th>
+                <th></th>
+                <th>Reason</th>
+                <th>Pharmacy</th>
+                <th>Doctor</th>
+        </thead>
+        <tbody>
+            {% for med in medications %}
+            <tr>
+                <input type="hidden" name="id" value="{{med.id}}">
+                <td><select class="form-select" type="text" list="yesno" name="reorder" id="reorder">
+                        <datalist id="yesno">
+                            <option selected value="No">Do Not Reorder</option>
+                            <option value="Yes">Reorder</option>
+                        </datalist></td>
+                <td><input readonly class="form-control" type="text" name="med" id="med" value="{{med.name}}"></td>
+                <td><input class="form-control" type="text" name="dose" id="dose" value="{{med.dose}}"></td>
+                <td><input class="form-control" type="text" name="how_often" id="how_often" value="{{med.how_often}}">
+                </td>
+                <td><input class="form-control" type="number" name="num_filled_days" id="num_filled_days"
+                        value="{{med.num_filled_days}}"></td>
+            </tr>
+            <tr>
+                <td>
+                    <div class="form-check form-switch">
+                        {% if med.process == True %}<input class="form-check-input" type="checkbox" id="process" name="process" checked>
+                        {% else %}<input class="form-check-input" type="checkbox" id="process" name="process">
+                        {% endif %}
+                        <label class="form-check-label" for="process">Process this medication</label>
+                    </div>
+                </td>
+                <td> <input type="text" name="lastrefill" id="lastrefill" value="{{med.last_refilled}}" disabled class="text-muted">
+                </td>
+                <td><input class="form-control" type="text" name="reason_for_taking" id="reason_for_taking"
+                        value="{{med.reason_for_taking}}"></td>
+                <td>
+                    <select class="form-select" name="pharmacy" id="pharmacy">
+                        {% for pharm in pharmacy %}
+                        {% if pharm.id == med.pharmacy %}
+                        <option selected value="{{pharm.id}}">{{pharm.name}}</option>
+                        {% else %}
+                        <option value="{{pharm.id}}">{{pharm.name}}</option>
+                        {% endif %}
+                        {% endfor %}
+                    </select>
+                </td>
+                <td>
+                    <select class="form-select" name="doctorfk" id="doctorfk">
+                        {% for doctor in doctors %}
+                        {% if doctor.id == med.doctorfk %}
+                        <option selected value="{{doctor.id}}">{{doctor.name}}</option>
+                        {% else %}
+                        <option value="{{doctor.id}}">{{doctor.name}}</option>
+                        {% endif %}
+                        {% endfor %}
+                    </select>
+                </td>
+            </tr>
+            {% endfor %}
+        </tbody>
+    </table>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/medupdate.html b/website/templates/health/medupdate.html
new file mode 100644
index 0000000..b098ecd
--- /dev/null
+++ b/website/templates/health/medupdate.html
@@ -0,0 +1,45 @@
+    {% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Medications
+{% endblock %}
+
+{% block proheader %}
+Edit {{meds.name}}
+{% endblock %}
+
+{% block content %}
+<form action="/health/medications" method='POST'>
+    <input type="submit" name="exportPDF" class='btn btn-warning' value="exportPDF">
+</form>
+<div class="form-floating">
+    <form action="/health/medupdate/{{meds.id}}" , method="POST">
+        <label for="name">Medication Name</label>
+        <input type="text" class="form-control" id="name" name="name" value="{{meds.name}}">
+        <label for="dose">Dose</label>
+        <input type="text" class="form-control" name="dose" id="dose" value="{{meds.dose}}">
+        <label for="howoften">How Often</label>
+        <input type="text" class="form-control" id="howoften" name="howoften" value="{{meds.how_often}}">
+        <label for="num_filled_days">How many days was this filled</label>
+        <input type="text" class="form-control" id="num_filled_days" name="num_filled_days" value="{{meds.num_filled_days}}">
+        <label for="reason_for_taking">Reason for taking</label>
+        <input type="text" class="form-control" id="reason_for_taking" name="reason_for_taking" value="{{meds.reason_for_taking}}">
+        <label for="doctor">Doctor</label>
+        <select class="form-select" name="doctor" id="doctor">
+            {% for doctor in doctors %}
+            <option value="{{doctor.id}}" {{'selected' if doctor.id==meds.doctorfk}} >{{doctor.name}}</option>
+            {% endfor %}
+        </select>
+        <label for="rx">Pharmacy</label>
+        <select class="form-select" name="rx" id="rx">
+            {% for pharm in pharms %}
+            <option value="{{pharm.id}}" {{'selected' if pharm.id==meds.pharmacy|int}} >{{pharm.name}}</option>
+            {% endfor %}
+        </select>
+        <label for="lastordered">Last Ordered</label>
+        <input type="date" class="form-control-lg" id="lastordered" name="lastordered" value="{{meds.last_refilled.strftime('%Y-%m-%d')}}">
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+        <input class="btn btn-success btn-lg" type="submit" name='facSubmit' value="Edit Medication"> <br> <br>
+    </form>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/health/surgeries.html b/website/templates/health/surgeries.html
new file mode 100644
index 0000000..b632774
--- /dev/null
+++ b/website/templates/health/surgeries.html
@@ -0,0 +1,95 @@
+{% extends "health/health-div.html" %}
+
+{% block title %}
+{{current_user.username}} Surgeries
+{% endblock %}
+
+{% block proheader %}
+Surgeries for {{current_user.firstname}}
+{% endblock %}
+
+{% block content %}
+<table class="table table-info">
+    <thead>
+        <th>Name</th>
+        <th>Start Date</th>
+        <th>Description</th>
+        <th>Body Part</th>
+        <th>Doctor</th>
+        <th>Facility</th>
+        <th> </th>
+    </thead>
+    <tbody>
+        <form action="/health/surgeries" method="post">
+            <tr>
+                <td>
+                    <input type="text" class="form-control" name="name" id="name">
+                </td>
+                <td>
+                    <input type="date" class="form-control" name="sdate" id="sdate">
+                </td>
+                <td>
+                    <input type="text" class="form-control" name="desc" id="desc">
+                </td>
+                <td>
+                    <input type="text" class="form-control" name="bodypart" id="bodypart">
+                </td>
+                <td>
+                    <select name="doctor" id="doctor" class="form-select" >
+                        {% for doctor in doctors %}
+                        <option value="{{doctor.id}}">{{doctor.name}}</option>
+                        {% endfor %}
+                    </select>
+                </td>
+                <td>
+                    <select name="facility" id="facility" class="form-select">
+                        {% for facility in facilities %}
+                        <option value="{{facility.id}}">{{facility.name}}</option>
+                        {% endfor %}
+                    </select>
+                </td>
+                <td>
+                    <input type="hidden" name="thisuserid" value="{{current_user.id}}">
+                    <input type="submit" class = "btn btn-secondary" value="Add New Surgery">
+                </td>
+            </tr>
+        </form>
+    </tbody>
+</table>
+
+
+<!-- EXISTING DATA IN DB -->
+<table class="table table-bordered">
+    <thead>
+        <th>Start Date</th>
+        <th>Age</th>
+        <th>Description</th>
+        <th>Body Part</th>
+        <th>Doctor</th>
+        <th>Facility</th>
+        <th> </th>
+    </thead>
+    <tbody>
+        {% for surg in surgeries %}
+        <tr>
+            <td>{{surg.startdate.strftime("%m/%d/%Y")}}</td>
+            <td>{{surg.age}}</td>
+            <td>{{surg.description}}</td>
+            <td>{{surg.body_part}}</td>
+            {% for doctor in doctors %}
+            {% if surg.doctorfk == doctor.id %}
+            <td>{{doctor.name}}</td>
+            {% endif %}
+            {% endfor %}
+            {% for facility in facilities %}
+            {% if surg.facilityfk == facility.id %}
+            <td>{{facility.name}}</td>
+            {% endif %}
+            {% endfor %}
+            <td><a href="/health/surgery/delete/{{surg.id}}"><button class="btn btn-outline-danger btn-sm"><i
+                class="fas fa-trash"></i></button></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/login.html b/website/templates/login.html
new file mode 100644
index 0000000..267ddcd
--- /dev/null
+++ b/website/templates/login.html
@@ -0,0 +1,17 @@
+{% extends "auth.html" %}
+
+{% block login %}
+<form method="POST">
+  <h3 align="center">Login</h3>
+  <div class="form-group">
+    <label for="email">Email Address</label>
+    <input type="text" id="email" name="email" class="form-control" placeholder="Enter Email" />
+    <label for="password">Password</label>
+    <input type="password" id="password" name="password" class="form-control" placeholder="Enter Password" />
+    <br />
+    <div align="center">
+      <button class="btn btn-primary" type="submit">Login</button>
+    </div>
+  </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/__pycache__/menu.cpython-38.pyc b/website/templates/menu/__pycache__/menu.cpython-38.pyc
new file mode 100644
index 0000000..4fd618c
Binary files /dev/null and b/website/templates/menu/__pycache__/menu.cpython-38.pyc differ
diff --git a/website/templates/menu/menu-div.html b/website/templates/menu/menu-div.html
new file mode 100644
index 0000000..00aadb8
--- /dev/null
+++ b/website/templates/menu/menu-div.html
@@ -0,0 +1,25 @@
+{% extends "base.html" %}
+
+{% block submenu %}
+<div class="btn-group" role="group" aria-label="Button group with nested dropdown">
+    <a href="/menu"><button type="button" class="btn">Planner</button></a>
+    <a href="/menu/recipe"><button type="button" class="btn">Recipe</button></a>
+    <a href="/menu/shopping"><button type="button" class="btn">Shopping List</button></a>
+    <a href="/menu/recipe/new"><button type="button" class="btn">Add a Recipe</button></a>
+    <a href="/menu/scrape"><button type="button" class="btn">Scrape a Recipe</button></a>
+
+</div>
+{% endblock %}
+
+{% block title %}
+Guill Menu
+{% endblock %}
+
+{% block header %}
+{% endblock %}
+
+{% block menu %}
+{% endblock %}
+
+{% block content %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/menu.html b/website/templates/menu/menu.html
new file mode 100644
index 0000000..29fe509
--- /dev/null
+++ b/website/templates/menu/menu.html
@@ -0,0 +1,43 @@
+{% extends "menu/menu-div.html" %}
+
+{% block title %}
+Guill Menu
+{% endblock %}
+
+{% block proheader %}
+Guill Menu Planner
+{% endblock %}
+
+{% block content %}
+    {% for date, plan in plans | groupby('date') %}
+    <!-- List of All Dates and Dishes -->
+    <div class="input-group mb-3">
+        <h4>{{ date.strftime('%A, %B %d, %Y') }}</h4>
+        <form action="/menu/{{date.strftime('%Y-%m-%d')}}" , method="POST">
+            <button type="submit" class="btn btn-outline-primary" name="dateselector" id="dateselector" value="{{date.strftime('%Y-%m-%d')}}">Go</button>
+        </form>
+    </div>
+    <form action="/menu/" method='POST'>
+        <div class="input-group mb-3">
+            <input type="hidden" name="datefield" class="form-control form-control-color" value="{{ date }}">
+            <select class="form-control" id="dishid" name='dishid' placeholder="Type to search...">
+                {% for dish in dishes %}
+                <option value="{{dish.id}}">{{dish.name}}</option>
+                {% endfor %}
+                <input type="submit" class="btn btn-outline-primary">
+        </div>
+    </form>
+    {% for plan in plans %}
+    {% if plan.date == date %}
+    <div class="lead d-flex justify-content-between">
+        {{ plan.item }}
+        <span title="{{plan.item}}"><a href="{{url_for('menu.deletePlan', id=plan.id)}}" class="btn btn-outline-danger btn-sm" tabindex="-1"
+                role="button">X</a></span>
+    </div>
+    {% endif %}
+    {% endfor %}
+    <br>
+    <hr>
+    <br>
+    {% endfor %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/menu.py b/website/templates/menu/menu.py
new file mode 100644
index 0000000..145e3b2
--- /dev/null
+++ b/website/templates/menu/menu.py
@@ -0,0 +1,261 @@
+from flask import Blueprint, render_template, request, redirect, url_for
+from flask.helpers import flash
+from flask_login import login_required
+from website.models import *
+from datetime import datetime, timedelta
+from website import db
+from website.makedates import makedates
+from website.nutrition import get_food_item, nutrition_single
+from sqlalchemy.sql import func
+import datetime, pdfkit
+from website.scrape_recipe import *
+
+
+menu = Blueprint("menu", __name__)
+
+
+@menu.route("/", methods=['GET', 'POST'])
+@login_required
+def menuHome():
+    records = db.session.query(func.count(Planner.id).label('totalcount')).filter(Planner.date >= datetime.datetime.today()).all()
+    maxdate = db.session.query(func.max(Planner.date).label('max_date')).first()
+    if records[0][0] <= 60:
+        makedates(datetime.datetime.strftime(maxdate.max_date,"%Y-%m-%d"))
+    if request.method == 'POST':
+        plan = Planner(
+            date = datetime.datetime.strptime(request.form.get('datefield'),"%Y-%m-%d %H:%M:%S"),
+            # date = request.form.get('datefield'),
+            item = Dish.query.filter_by(id=request.form.get('dishid')).first().name,
+            dishfk = request.form.get('dishid')
+        )
+        db.session.add(plan)
+        db.session.commit()
+        
+    dishlist = Dish.query.order_by(Dish.name).all()
+    plans = Planner.query.filter(Planner.date >= (datetime.datetime.today()- timedelta(days=2))).order_by(Planner.date).limit(60)
+    items = Recipe.query.order_by(Recipe.dishfk).all()
+    ref = db.session.query(Planner.id, Planner.date).group_by(Planner.date).order_by(Planner.date)
+    
+    return render_template("menu/menu.html", user=User, dishes=dishlist, plans=plans, items=items, ref=ref)
+
+
+@menu.route("/<date>", methods=['GET', 'POST'])
+@login_required
+def menu_single(date):
+    # FIXME: why it does not return when saving
+    if request.method == 'POST':
+        if request.form.get('AddDishToPlanner') == "AddDishToPlanner":
+            ref = request.referrer
+            plan = Planner(
+                date = datetime.datetime.strptime(request.form.get('datefield'),"%Y-%m-%d %H:%M:%S"),
+                # date = request.form.get('datefield'),
+                item = Dish.query.filter_by(id=request.form.get('dishid')).first().name,
+                dishfk = request.form.get('dishid')
+            )
+            db.session.add(plan)
+            db.session.commit() 
+            ## FIXME: when entering a date manually, it does not return anything
+            return redirect(url_for('menu.plan_single',date=ref[-10:]))
+                
+        recipes = db.session.query(\
+            Recipe.carb_fiber, Recipe.carb_total, Recipe.catagory, Recipe.dishfk, Recipe.ing, Recipe.qty, Recipe.measurement, Recipe.notes)\
+                .join(Dish, Dish.id == Recipe.dishfk)\
+                    .join(Planner, Planner.dishfk == Recipe.dishfk)\
+                        .filter(func.date(Planner.date) == func.date(date))\
+                            .order_by(Recipe.date_created)\
+                                .all()
+        
+                         
+        steps = db.session.query(\
+            Steps.step_num, Steps.step_text, Steps.dishfk)\
+                .join(Dish, Dish.id == Steps.dishfk)\
+                    .join(Planner, Planner.dishfk == Steps.dishfk)\
+                        .filter(func.date(Planner.date) == func.date(date))\
+                            .all()
+                                
+        items = db.session.query(\
+            Planner.date, Planner.dishfk, Planner.id, Planner.dishfk, Planner.item, Dish.pictureURL)\
+                .join(Dish, Dish.id == Planner.dishfk)\
+                    .filter(func.date(Planner.date) == func.date(date))\
+                        .all()
+                        
+        dishes = db.session.query(\
+            Dish.id, Dish.cookTemp, Dish.cookTime, Dish.numServings, Dish.prepTime, Dish.servingSize)\
+                .join(Planner, Planner.dishfk == Dish.id)\
+                    .filter(func.date(Planner.date) == func.date(date))\
+                            .all()
+    #TODO: figure out why when you add an existing receipe to a plan, the page returns blank                  
+        dishesForList = db.session.query(Dish).all()
+        return render_template("menu/plan_single.html", user=User, recipes=recipes, dishs=dishes, steps=steps, items=items, dishlist=dishesForList)
+
+# Recipe Functions
+@menu.route("/recipe", methods=['GET', 'POST'])
+@login_required
+def recipe():
+    dishes = Dish.query.order_by(Dish.name).all()
+    recipes = Recipe.query.all()
+    steps = Steps.query.all()
+    return render_template("menu/recipe.html", user=User, dishes=dishes, recipes=recipes, steps=steps)
+
+
+@menu.route("/recipe/<id>", methods=['GET', 'POST'])
+@login_required
+def recipe_single(id):
+    if request.method == "POST":
+        if request.form.get('submit_button') == 'Steps':
+            num = Steps.query.filter_by(dishfk=id).all()
+            
+            step = Steps(
+                step_text = request.form.get('stepdesc'),
+                step_num = len(num)+1,
+                dishfk = id
+            )
+            db.session.add(step)
+            db.session.commit()
+        else:
+           
+            #info for nutrition
+            if request.form.get("notes") == None:
+                fullitem = request.form.get("qty")+" "+request.form.get("measurement").title()+" "+request.form.get("ing").title()
+            else:
+                fullitem = request.form.get("qty")+" "+request.form.get("measurement").title()+" "+request.form.get("ing").title()+", "+request.form.get("notes")
+            
+            #get nutrition informtion  
+            nutrition = get_food_item(fullitem)
+            
+            #build insert commnd to place data into database
+            item = Recipe(
+                qty=request.form.get("qty"), 
+                measurement= request.form.get("measurement").title(), 
+                ing= request.form.get("ing").title(),
+                notes=request.form.get("notes"), 
+                dishfk=request.form.get("dishid"),
+                catagory = request.form.get('catagory'),
+                weight = nutrition['weight'],
+                fat_total = nutrition['totalFat'],
+                fat_sat = nutrition['satFat'],
+                fat_trans = nutrition['transFat'],
+                cholesterol = nutrition['cholesterol'],
+                sodium = nutrition['sodium'],
+                potassium = nutrition['potassium'],
+                carb_total = nutrition['totalCarb'],
+                carb_fiber = nutrition['fiber'],
+                carb_sugar = nutrition['sugar'],
+                protein = nutrition['protein'],
+                servsize = nutrition['weight'],
+                calories = nutrition['calories'],
+                calories_fat = nutrition['totalFat']*9,
+                pictureURL = nutrition['picURL'])
+            #add and commit the record to the database
+            db.session.add(item)
+            db.session.commit()
+    
+    dish = Dish.query.filter_by(id=id).first()
+    ings = Recipe.query.filter_by(dishfk=id).all()
+    steps = Steps.query.filter_by(dishfk=id).all()
+    allnutrition = nutrition_single(ings)
+    
+    list_of_catagories = ['Beverages', 'Bread/Bakery', 'Canned/Jarred Goods', 'Dairy', 'Dry/Baking Goods', 'Frozen Foods', 'Meat', 'Produce', 'Cleaners', 'Paper Goods', 'Personal Care', 'Other']
+    
+    return render_template("menu/recipe-single.html", user=User, dish=dish, recipes=ings, nutrition=allnutrition, steps=steps, catagories=list_of_catagories)
+
+@menu.route("/deletingIng/<recID>/<dishID>")
+@login_required
+def deleteIng(recID,dishID):
+    Recipe.query.filter_by(id=recID).delete()
+    db.session.commit()
+    return redirect(url_for('menu.recipe_single', id=dishID))
+
+@menu.route("/deletingStep/<stepID>/<dishID>")
+@login_required
+def deleteStep(stepID,dishID):
+    Steps.query.filter_by(id=stepID).delete()
+    db.session.commit()
+    return redirect(url_for('menu.recipe_single', id=dishID))
+
+@menu.route("/deletingPlan/<id>")
+@login_required
+def deletePlan(id):
+    Planner.query.filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('menu.menuHome'))
+
+
+@menu.route("/recipe/delete/<id>", methods=['GET','POST'])
+@login_required
+def recipe_delete(id):
+    db.session.query(Dish).filter(Dish.id == id).delete()
+    db.session.commit()
+    return redirect(url_for('menu.recipe'))
+
+@menu.route("/recipe/<id>/update", methods=['POST'])
+@login_required
+def recipe_update(id):
+    if request.method == 'POST':
+        update = Dish.query.filter_by(id=id).first()
+        update.pictureURL = request.form.get("picurl")
+        update.numServings = request.form.get("servings")
+        update.servingSize = request.form.get("servingSize")
+        update.prepTime = request.form.get("prepTime")
+        update.cookTime = request.form.get("cooktime")
+        update.cookTemp = request.form.get("cookTemp")  
+        db.session.commit()
+    return redirect(url_for('menu.recipe_single', id=id))
+
+
+@menu.route("/recipe/new", methods=['GET', 'POST'])
+@login_required
+def recipe_new():
+    if request.method == 'POST':
+        newdish = Dish(
+            name = request.form.get('dishName'),
+            pictureURL = request.form.get('picURL'),
+            numServings = request.form.get('servings'),
+            servingSize = request.form.get('servingSize'),
+            cookTime = request.form.get('cooktime'),
+            prepTime = request.form.get('prepTime'),
+            cookTemp = request.form.get('cookTemp')
+        )
+        db.session.add(newdish)
+        db.session.commit()
+        
+        id = Dish.query.filter_by(name=request.form.get('dishName')).first()
+        return redirect(url_for('menu.recipe_single', id=id))
+    
+    return render_template("menu/new.html", user=User)
+
+
+@menu.route("/shopping", methods=['GET', 'POST'])
+# @login_required
+def shopping():
+    if request.method == 'POST':
+        if request.form['exportPDF'] == 'exportPDF':
+            pdfkit.from_url("http://127.0.0.1:5000"+url_for('views.shopping'), 'shopping.pdf')
+    items = db.session.query(Recipe.ing, Recipe.catagory, Recipe.dishfk, func.count(Recipe.ing).label('IngCount')).filter(Recipe.dishfk == Planner.dishfk).group_by(Recipe.ing).order_by(Recipe.ing).all()
+    counts = db.session.query(Recipe.catagory, func.count(Recipe.catagory)).filter(Recipe.dishfk == Planner.dishfk).group_by(Recipe.catagory).all()
+    return render_template("menu/shopping.html", user=User, items=items, counts=counts)#, dishes=dishlist, plans=plans)
+
+@menu.route("/scrape", methods=['GET','POST'])
+@login_required
+def scrape():
+    if request.method == "POST":
+        webstite = request.form.get('website')
+        scraper = scrape_recipe(webstite)
+        dishid = make_dish(scraper[0][0],scraper[0][1],scraper[0][2])
+
+        for ing in scraper[1][0]:
+            nuts = get_food_item(ing)
+            if nuts == 0:
+                db.session.query(Dish).filter(Dish.id == dishid).delete()
+                db.session.commit()
+                flash("Problem importing.  Try again",category='error')
+                return redirect(url_for('menu.menuHome'))
+            make_recipe(nuts,dishid)
+
+        i=1
+        for step in scraper[2][0]:
+            make_steps(step, dishid, i) 
+            i += 1
+        return redirect(url_for('menu.menuHome'))
+    
+    return render_template('menu/scrape.html', user=User)
\ No newline at end of file
diff --git a/website/templates/menu/new.html b/website/templates/menu/new.html
new file mode 100644
index 0000000..6056e27
--- /dev/null
+++ b/website/templates/menu/new.html
@@ -0,0 +1,426 @@
+{% extends "menu/menu-div.html" %}
+
+{% block style %}
+<style>
+  @charset "UTF-8";
+
+  .image {
+    width: 250px;
+    float: left;
+    margin: 20px;
+  }
+
+  body {
+    font-size: small;
+    line-height: 1.2;
+  }
+
+  p {
+    margin: 0;
+  }
+
+  .performance-facts {
+    border: 1px solid black;
+    margin: 20px;
+    float: left;
+    width: auto;
+    padding: 0.5rem;
+  }
+
+  .performance-facts table {
+    border-collapse: collapse;
+  }
+
+  .performance-facts__title {
+    font-weight: bold;
+    font-size: 2rem;
+    margin: 0 0 0.25rem 0;
+  }
+
+  .performance-facts__header {
+    border-bottom: 10px solid black;
+    padding: 0 0 0.25rem 0;
+    margin: 0 0 0.5rem 0;
+  }
+
+  .performance-facts__header p {
+    margin: 0;
+  }
+
+  .performance-facts__table,
+  .performance-facts__table--grid,
+  .performance-facts__table--small {
+    width: 100%;
+  }
+
+  .performance-facts__table thead tr th,
+  .performance-facts__table--grid thead tr th,
+  .performance-facts__table--small thead tr th,
+  .performance-facts__table thead tr td,
+  .performance-facts__table--grid thead tr td,
+  .performance-facts__table--small thead tr td {
+    border: 0;
+  }
+
+  .performance-facts__table th,
+  .performance-facts__table--grid th,
+  .performance-facts__table--small th,
+  .performance-facts__table td,
+  .performance-facts__table--grid td,
+  .performance-facts__table--small td {
+    font-weight: normal;
+    text-align: left;
+    padding: 0.25rem 0;
+    border-top: 1px solid black;
+    white-space: nowrap;
+  }
+
+  .performance-facts__table td:last-child,
+  .performance-facts__table--grid td:last-child,
+  .performance-facts__table--small td:last-child {
+    text-align: right;
+  }
+
+  .performance-facts__table .blank-cell,
+  .performance-facts__table--grid .blank-cell,
+  .performance-facts__table--small .blank-cell {
+    width: 1rem;
+    border-top: 0;
+  }
+
+  .performance-facts__table .thick-row th,
+  .performance-facts__table--grid .thick-row th,
+  .performance-facts__table--small .thick-row th,
+  .performance-facts__table .thick-row td,
+  .performance-facts__table--grid .thick-row td,
+  .performance-facts__table--small .thick-row td {
+    border-top-width: 5px;
+  }
+
+  .small-info {
+    font-size: 0.7rem;
+  }
+
+  .performance-facts__table--small {
+    border-bottom: 1px solid #999;
+    margin: 0 0 0.5rem 0;
+  }
+
+  .performance-facts__table--small thead tr {
+    border-bottom: 1px solid black;
+  }
+
+  .performance-facts__table--small td:last-child {
+    text-align: left;
+  }
+
+  .performance-facts__table--small th,
+  .performance-facts__table--small td {
+    border: 0;
+    padding: 0;
+  }
+
+  .performance-facts__table--grid {
+    margin: 0 0 0.5rem 0;
+  }
+
+  .performance-facts__table--grid td:last-child {
+    text-align: left;
+  }
+
+  .performance-facts__table--grid td:last-child::before {
+    content: "•";
+    font-weight: bold;
+    margin: 0 0.25rem 0 0;
+  }
+
+  .text-center {
+    text-align: center;
+  }
+
+  .thick-end {
+    border-bottom: 10px solid black;
+  }
+
+  .thin-end {
+    border-bottom: 1px solid black;
+  }
+</style>
+{% endblock %}
+
+
+{% block title %}
+Guill Menu - Add Recipe
+{% endblock %}
+
+{% block proheader %}
+Add New Recipe
+{% endblock %}
+
+{% block menu %}
+<form action="/menu/recipe/new" method="POST">
+  <div style="margin: auto">
+    <label for="dishName" style="width: 500px;">Dish Name</label>
+    <input type="text" style="width: 500px;" name="dishName" class="form-control" required>
+  </div>
+  <div class="container">
+  <div class="row">
+    <div class="col-3" id="Picture and Information">
+      
+        <img src="https://image.shutterstock.com/image-vector/ui-image-placeholder-wireframes-apps-260nw-1037719204.jpg"
+        class='img-fluid rounded-start' alt="Picture Of Dish" width='400'>
+        <label for="picurl">Picture URL</label>
+        <input type="text" name="picurl" class="form-control" required>
+        <br>
+        <label for="servings">Servings</label>
+        <input type="text" name="servings" class="form-control" value=1>
+        <label for="servingSize">Serving Size</label>
+        <input type="text" name="servingSize" class="form-control" value="1">
+        <br>
+        <label for="prepTime">Prep Time</label>
+        <input type="text" name="prepTime" class="form-control">
+        <label for="cooktime">Cook Time</label>
+        <input type="text" name="cooktime" class="form-control">
+        <label for="cookTemp">Cook Time</label>
+        <input type="text" name="cookTemp" class="form-control">
+
+        <button class="btn btn-primary" type="submit">Save</button>
+      </form>
+    </div>
+    <div class="col-5" id="Recipe and Steps">
+      <div style="float: left">
+        <h6 class="display-6 text-left text-muted">Recipe</h6>
+      </div>
+      <table class="table">
+        <thead>
+          <tr>
+            <td></td>
+            <td class="text-muted">Qty</td>
+            <td class="text-muted">Measurement</td>
+            <td class="text-muted">Ing</td>
+            <td class="text-muted">Notes</td>
+            <td class="text-muted">Delete</td>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <td></td>
+            <td></td>
+            <td></td>
+            <td></td>
+          </tr>
+        </tbody>
+      </table>
+      <br>
+      <!-- Steps Header and Button -->
+      <div style="float: left">
+        <h6 class="display-6 text-left text-muted"">Steps</h6>
+      </div>
+      
+      <table class="table">
+        <thead>
+          <tr>
+            <td class="text-muted" style="width: 10%">Number</td>
+            <td class="text-muted" style="max-width: 10%">Step</td>
+            <td class="text-muted" style="width: 10%">Delete</td>
+          </tr>
+        </thead>
+        <tbody>
+          <tr>
+            <th scope="row"></td>
+            <td></td>
+          </tr>
+        </tbody>
+      </table>
+    </div>
+    <div class="col-3" id="Nutrition Information">
+      <!-- <img src="https://s.cdpn.io/3/NutritionFacts.gif" class="image"> -->
+      <section class="performance-facts">
+        <header class="performance-facts__header">
+          <h1 class="performance-facts__title">Nutrition Facts</h1>
+          <p>Serving Size: 
+          <p>Servings: </p>
+        </header>
+        <table class="performance-facts__table">
+          <thead>
+            <tr>
+              <th colspan="3" class="small-info">
+                Amount Per Serving
+              </th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <th colspan="2">
+                <b>Calories</b>
+              </th>
+              <td>
+                Calories from Fat
+              </td>
+            </tr>
+            <tr class="thick-row">
+              <td colspan="3" class="small-info">
+                <b>% Daily Value*</b>
+              </td>
+            </tr>
+            <tr>
+              <th colspan="2">
+                <b>Total Fat</b>
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <td class="blank-cell">
+              </td>
+              <th>
+                Saturated Fat
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <td class="blank-cell">
+              </td>
+              <th>
+                Trans Fat
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <th colspan="2">
+                <b>Cholesterol</b>
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <th colspan="2">
+                <b>Sodium</b>
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <th colspan="2">
+                <b>Potassium</b>
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <th colspan="2">
+                <b>Total Carbohydrate</b>
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <th colspan="2">
+                <b>Net Carbs</b>
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <td class="blank-cell">
+              </td>
+              <th>
+                Dietary Fiber
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr>
+              <td class="blank-cell">
+              </td>
+              <th>
+                Sugars
+              </th>
+              <td>
+              </td>
+            </tr>
+            <tr class="thick-end">
+              <th colspan="2">
+                <b>Protein</b>
+              </th>
+              <td>
+              </td>
+            </tr>
+          </tbody>
+        </table>
+              
+        <p class="small-info">* Percent Daily Values are based on a 2,000 calorie diet. Your daily values may be higher or lower depending on your calorie needs:</p>
+      
+        <table class="performance-facts__table--small small-info">
+          <thead>
+            <tr>
+              <td colspan="2"></td>
+              <th>Calories:</th>
+              <th>2,000</th>
+              <th>2,500</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr>
+              <th colspan="2">Total Fat</th>
+              <td>Less than</td>
+              <td>65g</td>
+              <td>80g</td>
+            </tr>
+            <tr>
+              <td class="blank-cell"></td>
+              <th>Saturated Fat</th>
+              <td>Less than</td>
+              <td>20g</td>
+              <td>25g</td>
+            </tr>
+            <tr>
+              <th colspan="2">Cholesterol</th>
+              <td>Less than</td>
+              <td>300mg</td>
+              <td>300 mg</td>
+            </tr>
+            <tr>
+              <th colspan="2">Sodium</th>
+              <td>Less than</td>
+              <td>2,400mg</td>
+              <td>2,400mg</td>
+            </tr>
+            <tr>
+              <th colspan="2">Potassium</th>
+              <td>Less than</td>
+              <td>4,700mg</td>
+              <td>5,800mg</td>
+            </tr>
+            <tr>
+              <th colspan="3">Total Carbohydrate</th>
+              <td>300g</td>
+              <td>375g</td>
+            </tr>
+            <tr>
+              <td class="blank-cell"></td>
+              <th colspan="2">Dietary Fiber</th>
+              <td>25g</td>
+              <td>30g</td>
+            </tr>
+          </tbody>
+        </table>
+      
+        <p class="small-info">
+          Calories per gram:
+        </p>
+        <p class="small-info text-center">
+          Fat 9
+          &bull;
+          Carbohydrate 4
+          &bull;
+          Protein 4
+        </p>
+
+      </section>
+    </div>
+  </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/plan_single.html b/website/templates/menu/plan_single.html
new file mode 100644
index 0000000..a792254
--- /dev/null
+++ b/website/templates/menu/plan_single.html
@@ -0,0 +1,116 @@
+{% extends "menu/menu-div.html" %}
+
+{% block title %}
+{% for date, item in items | groupby('date') %}
+Dinner for {{date.strftime('%A, %B %d, %Y')}}
+{% endfor %}
+{% endblock %}
+
+{% block proheader %}
+{% for date, item in items | groupby('date') %}
+{{date.strftime('%a %m/%d/%y')}} Meal Plan
+{% endfor %}
+{% endblock %}
+
+{% block content %}
+{% for date, item in items | groupby('date') %}
+<form action="/plan/single/{{date.strftime('%Y-%m-%d')}}" method='POST'>
+    <div class="input-group mb-3">
+        <input type="hidden" name="datefield" class="form-control form-control-color" value="{{ date }}">
+        <select class="form-control" id="dishid" name='dishid' placeholder="Type to search...">
+            {% for dish in dishlist %}
+            <option value="{{dish.id}}">{{dish.name}}</option>
+            {% endfor %}
+            <input type="submit" name='AddDishToPlanner' class="btn btn-outline-sucess" value="AddDishToPlanner">
+    </div>
+</form>
+{% endfor %}
+
+{% for item in items %}
+<div class="card border-dark mb-3" style="max-width: 1900px;">
+    <div class="row g-0">
+        <div class="col-md-4 border-dark">
+            <a href="/menu/recipe/{{item.dishfk}}"><img src="{{item.pictureURL}}" class="img-fluid rounded-start"
+                    alt="{{item.item}}"></a>
+        </div>
+        <div class="col-md-8">
+            <div class="container-fluid justify-content-between">
+                <div class="card-body">
+                    <p class="card-title display-4">
+                        <bold>{{item.item}}</bold>
+                    </p>
+                    <div class="row g-0">
+                        <div class="col card-text">
+                            <table>
+                                {% for recipe in recipes %}
+                                {% if recipe.dishfk == item.dishfk %}
+                                <tr>
+                                    <td>
+                                        {{recipe.qty}} {{recipe.measurement}} {{recipe.ing}}
+                                    </td>
+                                </tr>
+                                {% endif %}
+                                {% endfor %}
+                            </table>
+                        </div>
+                        <div class="col card-text">
+                            <table>
+                                {% for step in steps %}
+                                {% if step.dishfk == item.dishfk %}
+                                <tr>
+                                    <td>
+                                        {{step.step_num}}. {{step.step_text}}
+                                    </td>
+                                </tr>
+                                {% endif %}
+                                {% endfor %}
+                            </table>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="card-footer col">
+                {% for dish in dishs %}
+                {% if dish.id == item.dishfk %}
+                Number of Servings: {{dish.numServings}} <br>
+                Serving Size: {{dish.servingSize}}
+                <div class="small">
+                    {% set carb = {'total_amount': 0} %}
+                    {% for rec in recipes %}
+                    {% if dish.id == rec.dishfk %}
+                    {% if carb.update({'total_amount': carb.total_amount + rec.carb_total }) %}{% endif %}
+                    {% set fiber = rec.carb_fiber %}
+                    {% endif %}
+                    {% endfor %}
+                    Total Carbs: {{ "%.2f"|format(carb.total_amount / dish.numServings) }} per serving
+                </div>
+                {% endif %}
+                {% endfor %}
+            </div>
+        </div>
+    </div>
+</div>
+{% endfor %}
+
+<!-- {% for date, plan in plans | groupby('date') %}
+<h4>{{ date.strftime('%A, %B %d, %Y') }}<br></h4>
+<form action="/menu" method='POST'>
+    <div class="input-group mb-3">
+        <input type="hidden" name="datefield" class="form-control form-control-color" value="{{ date }}">
+        <select class="form-control" id="dishid" name='dishid' placeholder="Type to search...">
+            {% for dish in dishes %}
+            <option value="{{dish.id}}">{{dish.name}}</option>
+            {% endfor %}
+            <input type="submit" class="btn btn-outline-primary">
+    </div>
+</form>
+{% for plan in plans %}
+{% if plan.date == date %}
+<div class="lead d-flex justify-content-between">
+    {{ plan.item }}
+    <span title="{{plan.item}}"><a href="/deletingPlan/{{plan.id}}" class="btn btn-outline-danger btn-sm" tabindex="-1" role="button">X</a></span>
+</div>
+{% endif %}
+{% endfor %} <br><br>
+{% endfor %} -->
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/recipe copy.html b/website/templates/menu/recipe copy.html
new file mode 100644
index 0000000..1ab8091
--- /dev/null
+++ b/website/templates/menu/recipe copy.html	
@@ -0,0 +1,94 @@
+{% extends "menu/menu-div.html" %}
+
+{% block style %}
+{% endblock %}
+
+
+{% block title %}
+Guill Menu
+{% endblock %}
+
+{% block proheader %}
+Guill Menu Recipes
+{% endblock %}
+
+{% block content %}
+
+{% for dish in dishes %}
+<div class="card border-dark" style="width: 80rem;">
+  <div class="row">
+    <div class="col-4">
+      {% if dish.pictureURL %}
+      <img src="{{dish.pictureURL}}" class='img-fluid rounded-start' alt="Picture Of Dish" width='400'>
+      {% else %}
+      <img src="https://image.shutterstock.com/image-vector/ui-image-placeholder-wireframes-apps-260nw-1037719204.jpg"
+        class='img-fluid rounded-start' alt="Picture Of Dish" width='400'>
+      {% endif %}
+      <h5 class="display-5 text-capitalize text-center">{{dish.name}}</h5>
+      <div class='text-center'>
+        <a href="/menu/recipe/{{dish.id}}"><button class="btn btn-lg btn-success">Edit</button></a>
+      </div>
+
+    </div>
+    <div class="col-md-8">
+      <div class="card-body">
+        <div class="card-text">
+          <div class="container">
+            <div class="row">
+              <div class="col" id="Ing">
+                <h6 class="display-6 text-left"">Ingredients</h6>
+                <table class=" table table-hover">
+                  <thead>
+                    <td>Qty</td>
+                    <td>Measurement</td>
+                    <td>Ing</td>
+                    <td>Notes</td>
+                  </thead>
+                  <tbody>
+                    {% for recipe in recipes %}
+                    {% if recipe.dishfk == dish.id %}
+                    <tr>
+                      <td>{{recipe.qty}}</td>
+                      <td>{{recipe.measurement}}</td>
+                      <td>{{recipe.ing}}</td>
+                      <td>{{recipe.notes}}</td>
+                    </tr>
+                    {% endif %}
+                    {% endfor %}
+                  </tbody>
+                  </table>
+              </div>
+              <div class="col" id="Steps">
+                <h6 class="display-6 text-left">Steps</h6>
+                <table class="table table-hover">
+                  <thead>
+                    <tr>
+                      <td>Step</td>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {% for step in steps %}
+                    {% if dish.id == step.dishfk %}
+                    <tr>
+                      <td><b>{{step.step_num}}. </b>{{step.step_text}}</td>
+                    </tr>
+                    {% endif %}
+                    {% endfor %}
+                  </tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+          <div>
+            <p class="card-text"><small class="text-muted">Last updated: {{dish.update_time}}</small></p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<br>
+{% endfor %}
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/recipe-single.html b/website/templates/menu/recipe-single.html
new file mode 100644
index 0000000..6d76e63
--- /dev/null
+++ b/website/templates/menu/recipe-single.html
@@ -0,0 +1,572 @@
+{% extends "menu/menu-div.html" %}
+
+{% block style %}
+<style>
+  @charset "UTF-8";
+
+  .image {
+    width: 250px;
+    float: left;
+    margin: 20px;
+  }
+
+  body {
+    font-size: small;
+    line-height: 1.2;
+  }
+
+  p {
+    margin: 0;
+  }
+
+  .performance-facts {
+    border: 1px solid black;
+    margin: 20px;
+    float: left;
+    width: auto;
+    padding: 0.5rem;
+  }
+
+  .performance-facts table {
+    border-collapse: collapse;
+  }
+
+  .performance-facts__title {
+    font-weight: bold;
+    font-size: 2rem;
+    margin: 0 0 0.25rem 0;
+  }
+
+  .performance-facts__header {
+    border-bottom: 10px solid black;
+    padding: 0 0 0.25rem 0;
+    margin: 0 0 0.5rem 0;
+  }
+
+  .performance-facts__header p {
+    margin: 0;
+  }
+
+  .performance-facts__table,
+  .performance-facts__table--grid,
+  .performance-facts__table--small {
+    width: 100%;
+  }
+
+  .performance-facts__table thead tr th,
+  .performance-facts__table--grid thead tr th,
+  .performance-facts__table--small thead tr th,
+  .performance-facts__table thead tr td,
+  .performance-facts__table--grid thead tr td,
+  .performance-facts__table--small thead tr td {
+    border: 0;
+  }
+
+  .performance-facts__table th,
+  .performance-facts__table--grid th,
+  .performance-facts__table--small th,
+  .performance-facts__table td,
+  .performance-facts__table--grid td,
+  .performance-facts__table--small td {
+    font-weight: normal;
+    text-align: left;
+    padding: 0.25rem 0;
+    border-top: 1px solid black;
+    white-space: nowrap;
+  }
+
+  .performance-facts__table td:last-child,
+  .performance-facts__table--grid td:last-child,
+  .performance-facts__table--small td:last-child {
+    text-align: right;
+  }
+
+  .performance-facts__table .blank-cell,
+  .performance-facts__table--grid .blank-cell,
+  .performance-facts__table--small .blank-cell {
+    width: 1rem;
+    border-top: 0;
+  }
+
+  .performance-facts__table .thick-row th,
+  .performance-facts__table--grid .thick-row th,
+  .performance-facts__table--small .thick-row th,
+  .performance-facts__table .thick-row td,
+  .performance-facts__table--grid .thick-row td,
+  .performance-facts__table--small .thick-row td {
+    border-top-width: 5px;
+  }
+
+  .small-info {
+    font-size: 0.7rem;
+  }
+
+  .performance-facts__table--small {
+    border-bottom: 1px solid #999;
+    margin: 0 0 0.5rem 0;
+  }
+
+  .performance-facts__table--small thead tr {
+    border-bottom: 1px solid black;
+  }
+
+  .performance-facts__table--small td:last-child {
+    text-align: left;
+  }
+
+  .performance-facts__table--small th,
+  .performance-facts__table--small td {
+    border: 0;
+    padding: 0;
+  }
+
+  .performance-facts__table--grid {
+    margin: 0 0 0.5rem 0;
+  }
+
+  .performance-facts__table--grid td:last-child {
+    text-align: left;
+  }
+
+  .performance-facts__table--grid td:last-child::before {
+    content: "•";
+    font-weight: bold;
+    margin: 0 0.25rem 0 0;
+  }
+
+  .text-center {
+    text-align: center;
+  }
+
+  .thick-end {
+    border-bottom: 10px solid black;
+  }
+
+  .thin-end {
+    border-bottom: 1px solid black;
+  }
+</style>
+{% endblock %}
+
+{% block title %}
+Guill Menu - Recipe for {{dish.name}}
+{% endblock %}
+
+{% block proheader %}
+{{dish.name}}
+{% endblock %}
+
+{% block submenu %}
+{{ super() }}
+<button type="button" class="btn" data-toggle="modal" data-target="#Nutrition">Nutrition
+  Information</button>
+{% endblock %}
+
+{% block content %}
+<div class="container">
+  <div class="row">
+    <div class="col-12 text-center" id="Picture and Information">
+      {% if dish.pictureURL %}
+      <picture><img src="{{dish.pictureURL}}" class='img-thumbnail' alt="Picture Of Dish" width="300px"></picture>
+      {% else %}
+      <img src="https://image.shutterstock.com/image-vector/ui-image-placeholder-wireframes-apps-260nw-1037719204.jpg"
+        class='img-thumbnail' alt="Picture Of Dish">
+      {% endif %}
+      <form action="/menu/recipe/{{dish.id}}/update" method="POST" class="row g-1">
+        <div class="col-3">
+          <label class="form-label" for="picurl">Picture URL</label>
+          <input class="form-control" type="text" name="picurl" class="form-control" value="{{dish.pictureURL}}">
+        </div>
+        <div class="col-1">
+          <label class="form-label" for="servings">Servings</label>
+          <input class="form-control" type="text" name="servings" class="form-control" value="{{dish.numServings}}">
+        </div>
+        <div class="col">
+          <label class="form-label" for="servingSize">Serving Size</label>
+          <input class="form-control" type="text" name="servingSize" class="form-control" value="{{dish.servingSize}}">
+        </div>
+        <div class="col">
+          <label class="form-label" for="prepTime">Prep Time</label>
+          <input class="form-control" type="text" name="prepTime" class="form-control" value="{{dish.prepTime}}">
+        </div>
+        <div class="col">
+          <label class="form-label" for="cooktime">Cook Time</label>
+          <input class="form-control" type="text" name="cooktime" class="form-control" value="{{dish.cookTime}}">
+        </div>
+        <div class="col">
+          <label class="form-label" for="cookTemp">Cook Temp</label>
+          <input class="form-control" type="text" name="cookTemp" class="form-control" value="{{dish.cookTemp}}">
+        </div>
+        <div class="col">
+          <label class="form-label" for="sub"> </label>
+          <button class="btn btn-primary" type="submit" name="sub">Save</button>
+      </form>
+    </div>
+  </div>
+  <div class="row">
+    <br>
+    <div class="col-6" id="Recipe">
+      <div class="col-6 float-start">
+        <h6 class="display-6"><strong>Recipe</strong></h6>
+      </div>
+      <div class="col-6 float-end">
+        <button type="button" class="btn btn-primary align-bottom" data-toggle="modal" data-target="#Ing"><i
+            class="fas fa-plus-square"></i> Add Item</button>
+      </div>
+
+      <table class="table table-sm table-responsive">
+        <thead>
+          <tr>
+            <td>Ingredient</td>
+            <td></td>
+          </tr>
+        </thead>
+        <tbody>
+          {% for recipe in recipes %}
+          <tr>
+            <td><img class="img-thumbnail" src="{{recipe.pictureURL}}" width="60"></td>
+            <td class="lead text-start text-body">{{recipe.qty}} {{recipe.measurement}} {{recipe.ing}}</td>
+            <td><a href="{{url_for('menu.deleteIng',recID=recipe.id, dishID=dish.id)}}" class="btn btn-danger btn-sm"
+                tabindex="-1" role="button"><i class="fas fa-trash-alt"></i></a></td>
+          </tr>
+          {% endfor %}
+        </tbody>
+      </table>
+    </div>
+    <div class="col-6" id="Steps">
+      <div class="col-6 float-start">
+        <h6 class="display-6 text-left"><b>Steps</b></h6>
+      </div>
+      <div class="col-6 float-end align-bottom">
+        <button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal"><i
+            class="fas fa-shoe-prints"></i> Add Step</button>
+      </div>
+      <br>
+      <table class="table table-sm table-responsive">
+        <thead>
+          <tr>
+            <td>Number</td>
+            <td>Step</td>
+            <td>Delete</td>
+          </tr>
+        </thead>
+        <tbody>
+          {% for step in steps %}
+          <tr>
+            <th scope="row" class="lead">{{step.step_num}}</th>
+            <td class="lead">{{step.step_text}}</td>
+            <td><a href="{{url_for('menu.deleteStep',stepID=step.id, dishID=dish.id)}}" class="btn btn-danger"
+                tabindex="-1" role="button"><i class="fas fa-trash-alt"></i></a></td>
+          </tr>
+          {% endfor %}
+        </tbody>
+      </table>
+    </div>
+  </div>
+
+
+  <!-- Nutrition Modal -->
+  <div class="modal fade" id="Nutrition" tabindex="-1" role="dialog" aria-labelledby="NutritionLabel"
+    aria-hidden="true">
+    <div class="modal-dialog" role="document">
+      <div class="modal-content">
+        <div class="modal-header">
+          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+            <span aria-hidden="true">&times;</span>
+          </button>
+        </div>
+        <div class="modal-body">
+          <div class="col-3" id="Nutrition Information">
+            <!-- <img src="https://s.cdpn.io/3/NutritionFacts.gif" class="image"> -->
+            <section class="performance-facts">
+              <header class="performance-facts__header">
+                <h1 class="performance-facts__title">Nutrition Facts</h1>
+                <p>Serving Size: {{ dish.servingSize}}
+                  <p>Servings: {{dish.numServings}}</p>
+              </header>
+              <table class="performance-facts__table">
+                <thead>
+                  <tr>
+                    <th colspan="3" class="small-info">
+                      Amount Per Serving
+                    </th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <th colspan="2">
+                      <b>Calories</b>
+                      {{ (nutrition.calories/dish.numServings) | round(1) }}
+                    </th>
+                    <td>
+                      Calories from Fat
+                      {{ ((nutrition.fat_total/dish.numServings)*9) | round(1) }}
+                    </td>
+                  </tr>
+                  <tr class="thick-row">
+                    <td colspan="3" class="small-info">
+                      <b>% Daily Value*</b>
+                    </td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">
+                      <b>Total Fat</b>
+                      {{ (nutrition.fat_total/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      <b>{{ (((nutrition.fat_total/dish.numServings)/65)*100) | round(1) }}%</b>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td class="blank-cell">
+                    </td>
+                    <th>
+                      Saturated Fat
+                      {{ (nutrition.fat_sat/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      {{ (((nutrition.fat_sat/dish.numServings)/20)*100) | round(1) }}%
+                    </td>
+                  </tr>
+                  <tr>
+                    <td class="blank-cell">
+                    </td>
+                    <th>
+                      Trans Fat
+                      {{ (nutrition.fat_trans/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      {{ (((nutrition.fat_trans/dish.numServings)/2)*100) | round(1) }}%
+                    </td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">
+                      <b>Cholesterol</b>
+                      {{ (nutrition.cholesterol/dish.numServings) | round(1) }}mg
+                    </th>
+                    <td>
+                      <b>{{ (((nutrition.cholesterol/dish.numServings)/300)*100) | round(1) }}%</b>
+                    </td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">
+                      <b>Sodium</b>
+                      {{ (nutrition.sodium/dish.numServings) | round(1) }}mg
+                    </th>
+                    <td>
+                      <b>{{ (((nutrition.sodium/dish.numServings)/2400)*100) | round(1) }}%</b>
+                    </td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">
+                      <b>Potassium</b>
+                      {{ (nutrition.potassium/dish.numServings) | round(1) }}mg
+                    </th>
+                    <td>
+                      <b> {{ (((nutrition.potassium/dish.numServings)/4700)*100) | round(1) }}%</b>
+                    </td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">
+                      <b>Total Carbohydrate</b>
+                      {{ (nutrition.carb_total/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      <b>{{ (((nutrition.carb_total/dish.numServings)/300)*100) | round(1) }}%</b>
+                    </td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">
+                      <b>Net Carbs</b>
+                      {{ ((nutrition.carb_total-nutrition.carb_fiber)/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      <b>{{ ((((nutrition.carb_total-nutrition.carb_fiber)/dish.numServings)/225)*100) | round(1) }}%</b>
+                    </td>
+                  </tr>
+                  <tr>
+                    <td class="blank-cell">
+                    </td>
+                    <th>
+                      Dietary Fiber
+                      {{ (nutrition.carb_fiber/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      {{ (((nutrition.carb_fiber/dish.numServings)/25)*100) | round(1) }}%
+                    </td>
+                  </tr>
+                  <tr>
+                    <td class="blank-cell">
+                    </td>
+                    <th>
+                      Sugars
+                      {{ (nutrition.carb_sugar/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      {{ (((nutrition.carb_sugar/dish.numServings)/50)*100) | round(1) }}%
+                    </td>
+                  </tr>
+                  <tr class="thick-end">
+                    <th colspan="2">
+                      <b>Protein</b>
+                      {{ (nutrition.protein/dish.numServings) | round(1) }}g
+                    </th>
+                    <td>
+                      <b>{{ (((nutrition.protein/dish.numServings)/46)*100) | round(1) }}%</b>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
+
+              <p class="small-info">* Percent Daily Values are based on a 2,000 calorie diet. Your daily values may be
+                higher
+                or
+                lower depending on your calorie needs:</p>
+
+              <table class="performance-facts__table--small small-info">
+                <thead>
+                  <tr>
+                    <td colspan="2"></td>
+                    <th>Calories:</th>
+                    <th>2,000</th>
+                    <th>2,500</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <th colspan="2">Total Fat</th>
+                    <td>Less than</td>
+                    <td>65g</td>
+                    <td>80g</td>
+                  </tr>
+                  <tr>
+                    <td class="blank-cell"></td>
+                    <th>Saturated Fat</th>
+                    <td>Less than</td>
+                    <td>20g</td>
+                    <td>25g</td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">Cholesterol</th>
+                    <td>Less than</td>
+                    <td>300mg</td>
+                    <td>300 mg</td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">Sodium</th>
+                    <td>Less than</td>
+                    <td>2,400mg</td>
+                    <td>2,400mg</td>
+                  </tr>
+                  <tr>
+                    <th colspan="2">Potassium</th>
+                    <td>Less than</td>
+                    <td>4,700mg</td>
+                    <td>5,800mg</td>
+                  </tr>
+                  <tr>
+                    <th colspan="3">Total Carbohydrate</th>
+                    <td>300g</td>
+                    <td>375g</td>
+                  </tr>
+                  <tr>
+                    <td class="blank-cell"></td>
+                    <th colspan="2">Dietary Fiber</th>
+                    <td>25g</td>
+                    <td>30g</td>
+                  </tr>
+                </tbody>
+              </table>
+
+              <p class="small-info">
+                Calories per gram:
+              </p>
+              <p class="small-info text-center">
+                Fat 9
+                &bull;
+                Carbohydrate 4
+                &bull;
+                Protein 4
+              </p>
+            </section>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+<!-- Ingredient Modal -->
+<div class="modal fade" id="Ing" tabindex="-1" role="dialog" aria-labelledby="IngLabel" aria-hidden="true">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title" id="IngLabel">Add Ingredient</h5>
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
+      <div class="modal-body">
+        <form action="/menu/recipe/{{dish.id}}" method="POST">
+          <div class="row g-3">
+            <div class="col-4">
+              <input type="text" id="qty" name="qty" class="form-control" placeholder="Qty" />
+            </div>
+            <div class="col-4">
+              <input type="text" id="measurement" name="measurement" class="form-control" placeholder="Measurement" />
+            </div>
+            <div class="col-4">
+              <input type="text" id="ing" name="ing" class="form-control" placeholder="Ingredience" />
+            </div>
+            <div class="col-12">
+              <select class="form-control" id="catagory" name='catagory'>
+                <option value="DidNotSelect">Choose a catagory...</option>
+                {% for item in catagories %}
+                <option value="{{item}}">{{item}}</option>
+                {% endfor %}
+            </div>
+            <div class="col-12">
+              <textarea id="notes" name="notes" class="form-control" row="2"></textarea>
+              <input type="hidden" id="dishid" name="dishid" class="form-control" value="{{dish.id}}" />
+            </div>
+          </div>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+        <button type="submit" class="btn btn-primary">Save changes</button>
+      </div>
+      </form>
+    </div>
+  </div>
+</div>
+
+<!-- Step Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
+  aria-hidden="true">
+  <div class="modal-dialog" role="document">
+    <div class="modal-content">
+      <div class="modal-header">
+        <h5 class="modal-title" id="exampleModalLabel">Add Step</h5>
+        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+          <span aria-hidden="true">&times;</span>
+        </button>
+      </div>
+      <div class="modal-body">
+        <form action="/menu/recipe/{{dish.id}}" method="POST">
+          <div class="form-group row g-1">
+            <div class="col-lg-10">
+              <input type="text" id="stepdesc" name="stepdesc" class="form-control"
+                placeholder="Enter Step Description"></input>
+              <input type="hidden" id="dishid" name="dishid" calss="form-control" value="{{dish.id}}" />
+            </div>
+          </div>
+        </form>
+      </div>
+      <div class="modal-footer">
+        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+        <button type="button" class="btn btn-primary">Save changes</button>
+      </div>
+    </div>
+  </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/recipe.html b/website/templates/menu/recipe.html
new file mode 100644
index 0000000..4e5b351
--- /dev/null
+++ b/website/templates/menu/recipe.html
@@ -0,0 +1,95 @@
+{% extends "menu/menu-div.html" %}
+
+{% block style %}
+{% endblock %}
+
+
+{% block title %}
+Guill Menu
+{% endblock %}
+
+{% block proheader %}
+Guill Menu Recipes
+{% endblock %}
+
+{% block content %}
+
+{% for dish in dishes %}
+<div class="card border-dark" style="width: 80rem;">
+  <div class="row">
+    <div class="col-4">
+      {% if dish.pictureURL %}
+      <img src="{{dish.pictureURL}}" class='img-fluid rounded-start' alt="Picture Of Dish" width='400'>
+      {% else %}
+      <img src="https://image.shutterstock.com/image-vector/ui-image-placeholder-wireframes-apps-260nw-1037719204.jpg"
+        class='img-fluid rounded-start' alt="Picture Of Dish" width='400'>
+      {% endif %}
+      <h5 class="display-5 text-capitalize text-center">{{dish.name}}</h5>
+      <div class='text-center'>
+        <a href="/menu/recipe/{{dish.id}}"><button class="btn btn-lg btn-success"><i class="fas fa-edit"></i> Edit</button></a>
+        <a href="{{url_for('menu.recipe_delete', id=dish.id)}}"><button class="btn btn-lg btn-danger"><i class="fas fa-trash-alt"></i> Delete</button></a>
+      </div>
+
+    </div>
+    <div class="col-md-8">
+      <div class="card-body">
+        <div class="card-text">
+          <div class="container">
+            <div class="row">
+              <div class="col" id="Ing">
+                <h6 class="display-6 text-left"">Ingredients</h6>
+                <table class=" table table-hover">
+                  <thead>
+                    <td>Qty</td>
+                    <td>Measurement</td>
+                    <td>Ing</td>
+                    <td>Notes</td>
+                  </thead>
+                  <tbody>
+                    {% for recipe in recipes %}
+                    {% if recipe.dishfk == dish.id %}
+                    <tr>
+                      <td>{{recipe.qty}}</td>
+                      <td>{{recipe.measurement}}</td>
+                      <td>{{recipe.ing}}</td>
+                      <td>{{recipe.notes}}</td>
+                    </tr>
+                    {% endif %}
+                    {% endfor %}
+                  </tbody>
+                  </table>
+              </div>
+              <div class="col" id="Steps">
+                <h6 class="display-6 text-left">Steps</h6>
+                <table class="table table-hover">
+                  <thead>
+                    <tr>
+                      <td>Step</td>
+                    </tr>
+                  </thead>
+                  <tbody>
+                    {% for step in steps %}
+                    {% if dish.id == step.dishfk %}
+                    <tr>
+                      <td><b>{{step.step_num}}. </b>{{step.step_text}}</td>
+                    </tr>
+                    {% endif %}
+                    {% endfor %}
+                  </tbody>
+                </table>
+              </div>
+            </div>
+          </div>
+          <div>
+            <p class="card-text"><small class="text-muted">Last updated: {{dish.update_time}}</small></p>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<br>
+{% endfor %}
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/scrape.html b/website/templates/menu/scrape.html
new file mode 100644
index 0000000..4f6a891
--- /dev/null
+++ b/website/templates/menu/scrape.html
@@ -0,0 +1,17 @@
+{% extends "menu/menu-div.html" %}
+
+{% block title %}
+Scrape a Recipe
+{% endblock %}
+
+{% block proheader %}
+Scrape a Recipe
+{% endblock %}
+
+{% block content %}
+<form action="{{url_for('menu.scrape')}}", method="POST">
+    <label class="form-label" for="website">Website</label>
+    <input class="form-control" type="url" name="website" id="website">
+    <button type="submit" class="btn btn-primary">Scrape Recipe</button>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/menu/shopping.html b/website/templates/menu/shopping.html
new file mode 100644
index 0000000..b27af33
--- /dev/null
+++ b/website/templates/menu/shopping.html
@@ -0,0 +1,41 @@
+{% extends "menu/menu-div.html" %}
+
+{% block title %}
+Guill Menu
+{% endblock %}
+
+{% block proheader %}
+Guill Menu Shopping List
+{% endblock %}
+
+{% block content %}
+<form action="/menu/shopping" method='POST'>
+<input type="submit" name="exportPDF" class='btn btn-warning' value="exportPDF" >
+</form>
+<!-- FIXME: Fix The Pdf To Make It A Single Page Width And Format It Within A Single Page Width (Perhaps Make A New Page, Then Call The Pdf To Make) -->
+{% for catagory, item in items | groupby('catagory') %}
+<div style="max-width: 7in;">
+<ul class="list-group">
+    <li class="list-group-item d-flex justify-content-between align-items-center">
+        <h6 class="display-6 text-uppercase">{{catagory}}</h6><br>
+        {% for count in counts %}
+        {% if count[0] == catagory %}
+        <span class="badge bg-primary ">{{count[1]}}</span>
+        {% endif %}
+{% endfor %}
+    </li>
+</ul>
+{% for item in items %}
+{% if item.catagory == catagory %}
+<div class="list-group">
+    {% if item.IngCount <= 1 %}
+    <div class="list-group-item list-group-item-action">{{item.ing}}</div>
+    {% else %}
+    <div class="list-group-item list-group-item-action">{{item.ing}} x {{item.IngCount}}</div>
+    {% endif %}
+</div>
+{% endif %}
+{% endfor %}
+{% endfor %}
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/personal/__pycache__/personal.cpython-38.pyc b/website/templates/personal/__pycache__/personal.cpython-38.pyc
new file mode 100644
index 0000000..4dfad73
Binary files /dev/null and b/website/templates/personal/__pycache__/personal.cpython-38.pyc differ
diff --git a/website/templates/personal/codesnip.html b/website/templates/personal/codesnip.html
new file mode 100644
index 0000000..5ce6ecb
--- /dev/null
+++ b/website/templates/personal/codesnip.html
@@ -0,0 +1,36 @@
+{% extends "base.html" %}
+
+{% block title %}
+Code Snipits
+{% endblock %}
+
+{% block style %}
+<style>
+    pre{
+        background-color: black;
+        font-family: monospace, monospace;
+        color: aliceblue;
+        border: 1px solid #999;
+        display: block;
+        word-wrap: normal;
+        padding-right: 20px;
+    }
+</style>
+{% endblock %}
+
+{% block proheader %}
+Code Snips for {{current_user.firstname}}
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block content %}
+<pre>
+    <code>
+        the cow goes moo
+        the cow goes moo
+        then the farmer comes up and wacks it on the head and thats how we get <strong>hamburger</strong>
+    </code>
+</pre>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/personal/graves.html b/website/templates/personal/graves.html
new file mode 100644
index 0000000..bc25353
--- /dev/null
+++ b/website/templates/personal/graves.html
@@ -0,0 +1,211 @@
+{% extends "base.html" %}
+
+{% block title %}
+Grave Sites
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block proheader %}
+Grave Sites for {{current_user.firstname}}
+{% endblock %}
+
+{% block submenu %}
+<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#burialadd">Add A New Burial
+    Location</button>
+<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#graveadd">Add New Grave</button>
+
+{% endblock %}
+
+{% block content %}
+<!-- Modal for Adding a new Grave Marker -->
+<div class="modal fade" id="graveadd" tabindex="-1" role="dialog" aria-labelledby="graveaddTitle" aria-hidden="true">
+    <div class="modal-dialog modal-xl modal-dialog-centered" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="graveaddTitle">Add A New Grave Marker</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <form action="/personal/grave" method="post" class="row g-2">
+                    <div class="col-6">
+                        <label class="form-label" for="name">Name</label>
+                        <input class="form-control" type="text" name="name" id="name">
+                    </div>
+                    <div class="col-6">
+                        <label class="form-label" for="relationship">Relationship to deceased</label>
+                        <input class="form-control" type="text" name="relationship" id="relationship">
+                    </div>
+                    <div class="col-4">
+                        <h6 style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 24px;"><strong>Birth
+                                Info</strong></h6>
+                        <div class="col-12">
+                            <label class="form-label" for="birthd">Birth Date</label>
+                            <input class="form-control" type="date" name="birthd" id="birthd">
+                        </div>
+                        <div class="col-12">
+                            <label class="form-label" for="birthp">Birth Place</label>
+                            <input class="form-control" type="text" name="birthp" id="birthp">
+                        </div>
+                    </div>
+                    <div class="col-4">
+                        <h6 style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 24px;"><strong>Death
+                                Info</strong></h6>
+                        <div class="col-12">
+                            <label class="form-label" for="deathd">Date of Death</label>
+                            <input class="form-control" type="date" name="deathd" id="deathd">
+                        </div>
+                        <div class="col-12">
+                            <label class="form-label" for="deathp">Place of Passing</label>
+                            <input class="form-control" type="text" name="deathp" id="deathp">
+                        </div>
+                    </div>
+                    <div class="col-4">
+                        <h6 style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 24px;"><strong>Obituary</strong></h6>
+                        <div class="col-12">
+                            <label class="form-label" for="obituary">Obituary</label>
+                            <textarea class="form-control" name="obituary" id="obituary" rows="4"></textarea>
+                        </div>
+                    </div>
+                    <div class="col-4">
+                        <h6 style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 24px;"><strong>Final
+                                Resting Place</strong></h6>
+                        <div class="col-12">
+                            <label class="form-label" for="cemetery">Cemetery</label>
+                            <select name="cemetery" id="cemetery" class="form-select">
+                                {% for loc in cemeteries %}
+                                <option value="{{loc.id}}">{{loc.name}} - {{loc.city}}, {{loc.state}}</option>
+                                {% endfor %}
+                            </select>
+                        </div>
+                        <div class="col-12">
+                            <label class="form-label" for="plot">Plot Info</label>
+                            <input class="form-control" type="text" name="plot" id="plot">
+                        </div>
+                        <div class="col-12">
+                            <label class="form-label" for="pictureURL">Placemarker Picture URL</label>
+                            <input class="form-control" type="text" name="pictureURL" id="pictureURL">
+                        </div>
+                    </div>
+                    <div class="col-4">
+                        <h6 style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 24px;"><strong>Find A
+                                Grave Info</strong></h6>
+                        <div class="col-12">
+                            <label class="form-label" for="fagid">Find A Grave ID</label>
+                            <input class="form-control" type="text" name="fagid" id="fagid">
+                        </div>
+                        <div class="col-12">
+                            <label class="form-label" for="fagurl">Find A Grave Website</label>
+                            <input class="form-control" type="text" name="fagurl" id="fagurl">
+                        </div>
+                    </div>
+                    <div class="col-4">
+                        <h6 style="font-family: Verdana, Geneva, Tahoma, sans-serif; font-size: 24px;">
+                            <strong>Other</strong></h6>
+                        <div class="col-12">
+                            <label class="form-label" for="notes">Notes</label>
+                            <textarea class="form-control"  name="notes" id="notes" rows="4"></textarea>
+                        </div>
+                    </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+                <button type="submit" class="btn btn-primary" name="graveadd" value="graveadd">Add New
+                    Grave Marker</button>
+            </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+
+<!-- Modal for adding a new burial location -->
+<div class="modal fade" id="burialadd" tabindex="-1" role="dialog" aria-labelledby="burialaddTitle" aria-hidden="true">
+    <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="burialaddTitle">Add A New Burial Location</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <form action="/personal/grave" method="post" class="row g-2">
+                    <div class="col-12">
+                        <label class="form-label" for="name">Name of Burial Location</label>
+                        <input class="form-control" type="text" name="name" id="name">
+                    </div>
+                    <div class="col-12">
+                        <label class="form-label" for="address">Address</label>
+                        <input class="form-control" type="text" name="address" id="address">
+                    </div>
+                    <div class="col-5">
+                        <label class="form-label" for="city">City</label>
+                        <input class="form-control" type="text" name="city" id="city">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="state">State</label>
+                        <select class="form-select" name="state" id="state">
+                            {% for state in states %}
+                            <option value="{{state.abr}}">{{state.abr}} - {{state.state}}</option>
+                            {% endfor %}
+                        </select>
+                    </div>
+                    <div class="col-3">
+                        <label class="form-label" for="zip">Zip</label>
+                        <input class="form-control" type="text" name="zip" id="zip">
+                    </div>
+                    <div class="col-6">
+                        <label class="form-label" for="phone">Phone Number</label>
+                        <input class="form-control" type="text" name="phone" id="phone">
+                    </div>
+                    <div class="col-6">
+                        <label class="form-label" for="url">Website</label>
+                        <input class="form-control" type="url" name="url" id="url">
+                    </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+                <button type="submit" class="btn btn-primary" name="burialadd" value="burialadd">Add New
+                    Location</button>
+            </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+<!-- Table of grave markers in the db -->
+<table class="table table-hover table table-responsive">
+    <thead>
+        <th></th>
+        <th>Name</th>
+        <th>DOB</th>
+        <th>DOD</th>
+        <th>Location</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for grave in graves %}
+            <td><picture><img src="{{grave.pictureURL}}" alt="" width="100" height="80"></picture></td>
+            <td>{{grave.name}} <br> <p class="small text-muted">{{grave.relationship}}</p></td>
+            <td>{{grave.birthdate}}<br> <p class="small text-muted">{{grave.birthplace}}</p></td>
+            <td>{{grave.deathdate}}<br> <p class="small text-muted">{{grave.deathplace}}</p></td>
+            <td>
+                {% for loc in cemeteries %}
+                {% if loc.id == grave.cemeteriesfk %}
+                {{loc.name}}<br> <p class="small text-muted">{{loc.city}}, {{loc.state}}</p>
+                {% endif %}
+                {% endfor %}
+                <p class="small text-muted">{{grave.plot}}</p>
+            </td>
+            <td><a href="{{url_for('personal.graves_single', id=grave.id)}}"><button class="btn btn-primary"><i class="fas fa-edit"></i></button></a></td>
+            <td><a href="{{url_for('personal.graves_delete', id=grave.id)}}"><button class="btn btn-danger"><i class="fas fa-trash-alt"></i></button></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/personal/graves_single.html b/website/templates/personal/graves_single.html
new file mode 100644
index 0000000..0743b6a
--- /dev/null
+++ b/website/templates/personal/graves_single.html
@@ -0,0 +1,61 @@
+{% extends "base.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block proheader %}
+Edit {{grave.name}} Info
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block content %}
+<form action="/personal/grave/{{grave.id}}" method="post" class="form-group">
+    <div class="row g-3">
+        <div class="col-4">
+            <picture><img src="{{grave.pictureURL}}" alt="Gravesite for {{grave.name}}" width="100%"></picture>
+            <textarea name="obituary" id="obituary" class="form-control" rows="2">{{grave.obituary}}</textarea>
+        </div>
+        <div class="col-4">
+            <label class="form-label" for="name">Name</label>
+            <input class="form-control" type="text" name="name" id="name" value="{{grave.name}}">
+            <label class="form-label" for="relationship">Relationship</label>
+            <input class="form-control" type="text" name="relationship" id="relationship" value="{{grave.relationship}}">
+            <label class="form-label" for="birthd">Date of Birth</label>
+            <input class="form-control" type="text" name="birthd" id="birthd" value="{{grave.birthdate}}">
+            <label class="form-label" for="birthp">Place of Birth</label>
+            <input class="form-control" type="text" name="birthp" id="birthp" value="{{grave.birthplace}}">
+            <label class="form-label" for="deathd">Date of Death</label>
+            <input class="form-control" type="text" name="deathd" id="deathd" value="{{grave.deathdate}}">
+            <label class="form-label" for="deathp">Place of Death</label>
+            <input class="form-control" type="text" name="deathp" id="deathp" value="{{grave.deathplace}}">
+            
+        </div>
+        <div class="col-4">
+            <label class="form-label" for="cemeteriesfk">Cemetery</label>
+            <select name="cemeteriesfk" id="cemeteriesfk" class="form-select">
+                {% for loc in cemeteries %}
+                {% if loc.id == grave.cemeteriesfk %}
+                <option selected value="{{loc.id}}">{{loc.name}} - {{loc.city}}, {{loc.state}}</option>
+                {% else %}
+                <option value="{{loc.id}}">{{loc.name}} - {{loc.city}}, {{loc.state}}</option>
+                {% endif %}
+                {% endfor %}
+            </select>
+            <label class="form-label" for="plot">Plot</label>
+            <input class="form-control" type="text" name="plot" id="plot" value="{{grave.plot}}">
+            <label class="form-label" for="pictureURL">Plot Picture</label>
+            <input class="form-control" type="text" name="pictureURL" id="pictureURL" value="{{grave.pictureURL}}">
+            <label class="form-label" for="notes">Notes</label>
+            <textarea class="form-control"name="notes" id="notes" rows="3">{{grave.notes}}</textarea>
+        </div>
+        <div class="col-3">
+            <button type="submit">Edit Infromation</button>
+        </div>
+    </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/personal/house_single.html b/website/templates/personal/house_single.html
new file mode 100644
index 0000000..5e969d6
--- /dev/null
+++ b/website/templates/personal/house_single.html
@@ -0,0 +1,56 @@
+{% extends "base.html" %}
+
+{% block title %}
+Housing History
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block proheader %}
+Edit Housing
+{% endblock %}
+
+{% block content %}
+<form action="{{url_for('personal.edithousing', id=house.id)}}" , method="POST" class="row g-2">
+    <div class="col-6">
+        <label for="start" class="form-label">Move In Month/Year</label>
+        <input type="month" class="form-control" name="start" id="start" value="{{house.movein.strftime('%Y-%m')}}">
+    </div>
+    <div class="col-6">
+        <label for="end" class="form-label">Move Out Month/Year</label>
+        <input type="month" class="form-control" name="end" id="end" value="{{house.moveout.strftime('%Y-%m')}}">
+    </div>
+    <div class="col-6">
+        <label for="address" class="form-label">Address</label>
+        <input type="text" class="form-control" name="address" id="address" value="{{house.address}}">
+    </div>
+    <div class="col-2">
+        <label for="city" class="form-label">City</label>
+        <input type="text" class="form-control" name="city" id="city" value="{{house.city}}">
+    </div>
+    <div class="col-2">
+        <label for="state" class="form-label">State</label>
+        <select type="text" name="state" id="state" class="form-select">
+            {% for state in states %}
+            {% if state.abr == house.state %}
+            <option selected value="{{state.abr}}">{{state.abr}} - {{state.state}}</option>
+            {% else %}
+            <option value="{{state.abr}}">{{state.state}}</option>
+            {% endif %}
+            {% endfor %}
+        </select>
+    </div>
+    <div class="col-2">
+        <label for="zip" class="form-label">Zip</label>
+        <input type="text" class="form-control" name="zip" id="zip" value="{{house.zip}}">
+    </div>
+    <div class="col-3">
+        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+        <input type="submit" class="btn btn-primary" name="submit" id="submit" value="Edit Housing History">
+    </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/personal/housinghistory.html b/website/templates/personal/housinghistory.html
new file mode 100644
index 0000000..98f5888
--- /dev/null
+++ b/website/templates/personal/housinghistory.html
@@ -0,0 +1,105 @@
+{% extends "base.html" %}
+
+{% block title %}
+Housing History
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block proheader %}
+{{current_user.firstname}}'s Housing History
+{% endblock %}
+
+{% block content %}
+<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModal">
+    Add New Housing History
+</button>
+<a href="/personal/exportcsv" class="btn btn-info">Export CSV</a>
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
+    aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">New Housing History</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <form action="/personal/housinghistory" , method="POST" class="row g-2">
+                    <div class="col-6">
+                        <label for="start" class="form-label">Move In Month/Year</label>
+                        <input type="month" class="form-control" name="start" id="start">
+                    </div>
+                    <div class="col-6">
+                        <label for="end" class="form-label">Move Out Month/Year</label>
+                        <input type="month" class="form-control" name="end" id="end">
+                    </div>
+                    <div class="col-6">
+                        <label for="address" class="form-label">Address</label>
+                        <input type="text" class="form-control" name="address" id="address">
+                    </div>
+                    <div class="col-3">
+                        <label for="city" class="form-label">City</label>
+                        <input type="text" class="form-control" name="city" id="city">
+                    </div>
+                    <div class="col-1">
+                        <label for="state" class="form-label">State</label>
+                        <select class="form-select" name="state" id="state">
+                            {% for state in states %}
+                            <option value="{{state.abr}}">{{state.abr}} - {{state.state}}</option>
+                            {% endfor %}
+                        </select>
+                    </div>
+                    <div class="col-2">
+                        <label for="zip" class="form-label">Zip</label>
+                        <input type="text" class="form-control" name="zip" id="zip">
+                    </div>
+                    <div class="col-3">
+                        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                        <input type="submit" class="btn btn-primary" name="submit" id="submit" value="Add Housing History">
+                    </div>
+                </form>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
+                <button type="button" class="btn btn-primary">Save changes</button>
+            </div>
+        </div>
+    </div>
+</div>
+
+<table class="table table-responsive table-hover table-bordered">
+    <thead>
+        <th>Move In</th>
+        <th>Move Out</th>
+        <th>Address</th>
+        <th>How Long</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for house in housing %}
+        <tr>
+            <td>{{house.movein.strftime("%m/%Y")}}</td>
+            <td>{{house.moveout.strftime("%m/%Y")}}</td>
+            <td>{{house.address}} {{house.city}}, {{house.state}}  {{house.zip}}</td>
+            <td>
+                {% for lgh in los %}
+                {% if lgh['id'] == house.id %}
+                {{lgh['stay']}}
+                {% endif %}
+                {% endfor %}
+            </td>
+            <td><a href="{{url_for('personal.housing_edit', id=house.id)}}"><button class="btn btn-primary"><i class="fas fa-edit"></i></button></a></td>
+            <td><a href="{{url_for('personal.housing_delete', id=house.id)}}"><button class="btn btn-danger"><i class="fas fa-trash-alt"></i></button></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/personal/personal.py b/website/templates/personal/personal.py
new file mode 100644
index 0000000..367927c
--- /dev/null
+++ b/website/templates/personal/personal.py
@@ -0,0 +1,221 @@
+from flask import Blueprint, render_template, request, redirect, url_for, send_file, after_this_request
+from flask_login import login_required
+from website.models import *
+from website import db
+from sqlalchemy.sql import desc
+from dateutil import relativedelta
+
+
+
+import flask_login, os
+from website.wifiqrcode import generate_code
+
+personal = Blueprint("personal", __name__)
+
+
+@personal.route("/wifidelete/<id>")
+@login_required
+def wifidelete(id):
+    file = db.session.query(Wifi).filter_by(id=id).first()
+    if os.path.exists('website/static/'+file.path):
+        os.remove('website/static/'+file.path)
+        Wifi.query.filter_by(id=id).delete()
+        db.session.commit()
+    else:
+        print("The file does not exist")
+
+    return redirect(url_for('personal.wifi'))
+
+@personal.route("/wifi", methods=['GET','POST'])
+@login_required
+def wifi():
+    if request.method == 'POST':
+        path = generate_code(request.form.get('ssid'), request.form.get('password'))
+        newwifi = Wifi(
+            SSID = request.form.get('ssid'),
+            password = request.form.get('password'),
+            path = path,
+            userid = request.form.get('thisuserid')
+        )
+        db.session.add(newwifi)
+        db.session.commit()
+    # TODO: Figure out why this does not work on the website version of the program
+    wifi = db.session.query(Wifi).filter(Wifi.userid == flask_login.current_user.id).order_by(Wifi.update_time).all()
+    return render_template('/personal/wifi.html', user=User, wifi=wifi)
+
+@personal.route("/code", methods=['GET','POST'])
+@login_required
+def code():
+    return render_template("personal/codesnip.html", user=User)
+
+@personal.route("/housinghistory", methods=['GET','POST'])
+@login_required
+def housinghistory():
+    if request.method == "POST":
+        newhh = HousingHistory(
+            address = request.form.get('address'),
+            city = request.form.get('city'),
+            state = request.form.get('state'),
+            zip = request.form.get('zip'),
+            movein = datetime.datetime.strptime(request.form.get('start'),"%Y-%m"),
+            moveout = datetime.datetime.strptime(request.form.get('end'),"%Y-%m"),
+            userid = request.form.get('thisuserid')
+        )
+        db.session.add(newhh)
+        db.session.commit()
+    
+    lived = db.session.query(HousingHistory).filter(HousingHistory.userid == flask_login.current_user.id).order_by(desc(HousingHistory.movein)).all()
+    LOS = []
+    for stay in lived:
+        delta = relativedelta.relativedelta(stay.moveout, stay.movein)
+        if delta.years >= 1:
+            length = f'{delta.years} years, {delta.months} months'
+        elif delta.years == 0 and delta.months == 1:
+            length = f'{delta.months} month'
+        elif delta.years == 0 and delta.months > 1:
+            length = f'{delta.months} months'
+        else: length = 'error'
+        little = {}
+        little['id'] = stay.id
+        little['stay'] = length
+        LOS.append(little)    
+    
+    states = db.session.query(States).all()
+    housing = db.session.query(HousingHistory).filter(HousingHistory.userid == flask_login.current_user.id).order_by(desc(HousingHistory.movein)).all()
+    return render_template("personal/housinghistory.html", user=User, housing=housing, states=states, los=LOS)
+
+@personal.route("/housinghistory/<id>", methods=['GET','POST'])
+@login_required
+def housing_edit(id):
+    if request.method == "POST":
+        house = db.session.query(HousingHistory).filter_by(id=id).first()
+        house.movein = datetime.datetime.strptime(request.form.get('start'),"%Y-%m")
+        house.moveout = datetime.datetime.strptime(request.form.get('end'),"%Y-%m")
+        house.address = request.form.get('address')
+        house.city = request.form.get('city')
+        house.state = request.form.get('state')
+        house.zip = request.form.get('zip')
+        db.session.commit()
+        return redirect(url_for('personal.housinghistory'))
+    
+    states = db.session.query(States).all()
+    house = db.session.query(HousingHistory).filter_by(id=id).first()
+    return render_template('personal/house_single.html', user=User, house=house, states=states)
+
+@personal.route("/housinghistory/delete/<id>", methods=['GET'])
+@login_required
+def housing_delete(id):
+    db.session.query(HousingHistory).filter_by(id=id).delete()
+    db.session.commit()
+    return redirect(url_for('personal.housinghistory'))
+
+@personal.route("/exportcsv", methods=['GET'])
+@login_required
+def exportcsv():
+    import csv
+    houses = db.session.query(HousingHistory).filter(HousingHistory.userid == flask_login.current_user.id).order_by(desc(HousingHistory.movein)).all()
+    headings = []
+    data = []
+    
+    headings = list(HousingHistory.__table__.columns.keys())
+    headings.remove('id')
+    headings.remove('update_time')
+    headings.remove('date_created')
+    headings.remove('userid')
+    headings.insert(6,'length_of_stay')
+    
+    for house in houses:
+        delta = relativedelta.relativedelta(house.moveout, house.movein)
+        if delta.years >= 1:
+            length = f'{delta.years} years, {delta.months} months'
+        elif delta.years == 0 and delta.months == 1:
+            length = f'{delta.months} month'
+        elif delta.years == 0 and delta.months > 1:
+            length = f'{delta.months} months'
+        else: length = 'error'
+        little = [house.movein.strftime("%m/%Y"), house.moveout.strftime("%m/%Y"), house.address, house.city, house.state, house.zip, length]
+        data.append(little)
+    filename = str(flask_login.current_user.firstname).lower() +'_housinghistory.csv'
+    with open('website/static/'+filename, 'w') as f:
+        writer = csv.writer(f)
+        writer.writerow(headings)
+        writer.writerows(data)
+        f.close()
+    
+    full = f"static/{filename}"
+    @after_this_request
+    def filedelete(response):
+        if os.path.exists('website/static/'+filename):
+            os.remove('website/static/'+filename)
+        return response
+    return send_file(full, as_attachment=True)
+
+@personal.route('/grave', methods=['GET','POST'])
+@login_required
+def graves():
+    if request.method == "POST":
+        if request.form.get('burialadd'):
+            newcem = Cemeteries(
+                name = request.form.get('name'),
+                address = request.form.get('address'),
+                city = request.form.get('city'),
+                state = request.form.get('state'),
+                zip = request.form.get('zip'),
+                phone = request.form.get('phone'),
+                url = request.form.get('url'),
+                userid = flask_login.current_user.id
+            )
+            db.session.add(newcem)
+        elif request.form.get('graveadd'):
+            newgrave = Graves(
+                name = request.form.get('name'),
+                relationship = request.form.get('relationship'),
+                birthdate = request.form.get('birthd'),
+                birthplace = request.form.get('birthp'),
+                deathdate = request.form.get('deathd'),
+                deathplace = request.form.get('deathp'),
+                plot = request.form.get('plot'),
+                fag_id = request.form.get('fagid'),
+                fag_url = request.form.get('fagurl'),
+                notes = request.form.get('notes'),
+                obituary = request.form.get('obituary'),
+                pictureURL = request.form.get('pictureURL'),
+                cemeteriesfk = request.form.get('cemetery'),
+                userid = flask_login.current_user.id
+            )
+            db.session.add(newgrave)
+        db.session.commit()
+            
+    states = db.session.query(States).all()
+    graves = db.session.query(Graves).filter(Graves.userid == flask_login.current_user.id).order_by(desc(Graves.deathdate)).all()
+    cemeteries = db.session.query(Cemeteries).filter(Cemeteries.userid == flask_login.current_user.id).all()
+    return render_template('/personal/graves.html', user=User, graves=graves, states=states, cemeteries=cemeteries)
+
+@personal.route('/grave/<id>', methods=['GET','POST'])
+@login_required
+def graves_single(id):
+    if request.method == "POST":
+        info = db.session.query(Graves).filter(Graves.id == id).first()
+        info.name = request.form.get('name')
+        info.relationship = request.form.get('relationship')
+        info.birthdate = request.form.get('birthd')
+        info.birthplace = request.form.get('birthp')
+        info.deathdate = request.form.get('deathd')
+        info.deathplace = request.form.get('deathp')
+        info.plot = request.form.get('plot')
+        info.notes = request.form.get('notes')
+        info.obituary = request.form.get('obituary')
+        info.pictureURL = request.form.get('pictureURL')
+        info.userid = flask_login.current_user.id
+        db.session.commit()
+        return redirect(url_for('personal.graves'))
+    cemeteries = db.session.query(Cemeteries).filter(Cemeteries.userid == flask_login.current_user.id).all()
+    grave = db.session.query(Graves).filter(Graves.id == id).first()
+    return render_template('/personal/graves_single.html', user=User, grave=grave, cemeteries=cemeteries)
+
+@personal.route('/grave/delete/<id>', methods=['GET'])
+@login_required
+def graves_delete(id):
+    db.session.query(Graves).filter(Graves.id == id).delete()
+    db.session.commit()
+    return redirect(url_for('personal.graves'))
diff --git a/website/templates/personal/wifi.html b/website/templates/personal/wifi.html
new file mode 100644
index 0000000..5d2a4e2
--- /dev/null
+++ b/website/templates/personal/wifi.html
@@ -0,0 +1,63 @@
+{% extends "base.html" %}
+
+{% block title %}
+Wifi Home Connections
+{% endblock %}
+
+{% block proheader %}
+Wifi
+{% endblock %}
+
+{% block content %}
+<table class="table table-responsive-lg">
+    <thead>
+        <th>SSID</th>
+        <th>Password</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        <tr>
+            <form action="{{url_for('personal.wifi')}}" method="POST" autocomplete="off">
+                <td>
+                    <input type="text" autocomplete="nope" class="form-control" name="ssid" id="ssid">
+                </td>
+                <td>
+                    <input type="password" autocomplete="new-password" class="form-control" name="password"
+                        id="password">
+                    <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                </td>
+                <td>
+                    <input type="submit" value="Add Wifi">
+                </td>
+        </tr>
+        </form>
+    </tbody>
+</table>
+
+<table class="table table-responsive-xxl">
+    <thead>
+        <th>SSID</th>
+        <th>Password</th>
+        <th>QR Code</th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for wf in wifi %}
+        <tr>
+            <td>{{wf.SSID}}</td>
+            <td>{{wf.password}}</td>
+            <td>
+                <a href="{{url_for('static', filename=wf.path)}}" target="_blank"><img
+                        src="{{url_for('static', filename=wf.path)}}" width="100" height="100"
+                        class="rounded float-left"></a>
+            </td>
+            <td>
+                <a href="{{ url_for('personal.wifidelete', id=wf.id) }}"><button class="btn btn-danger"><i
+                            class="fas fa-trash-alt"></i></button></a>
+            </td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/__pycache__/productivity.cpython-38.pyc b/website/templates/productivity/__pycache__/productivity.cpython-38.pyc
new file mode 100644
index 0000000..0aa2b49
Binary files /dev/null and b/website/templates/productivity/__pycache__/productivity.cpython-38.pyc differ
diff --git a/website/templates/productivity/goals.html b/website/templates/productivity/goals.html
new file mode 100644
index 0000000..cab90d8
--- /dev/null
+++ b/website/templates/productivity/goals.html
@@ -0,0 +1,183 @@
+{% extends "productivity/prod-div.html" %}
+
+{% block title %}
+{{current_user.firstname}}'s Goals
+{% endblock %}
+
+{% block proheader %}
+Goals for {{current_user.firstname}}
+{% endblock %}
+
+{% block menu %}
+<div id="form">
+    <!-- Button trigger modal -->
+    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
+        Add New Goal
+    </button>
+
+    <!-- Modal -->
+    <div class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
+        aria-labelledby="staticBackdropLabel" aria-hidden="true">
+        <div class="modal-dialog modal-lg">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h5 class="modal-title" id="staticBackdropLabel">Add Goal</h5>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+                    <form action="/productivity/goals" method="POST">
+                        <label for="name" class="form-label">Name of Goal</label>
+                        <input type="text" name="name" id="name" class="form-control">
+                        <label for="pictureurl" class="form-label">URL of Picture</label>
+                        <input type="text" name="pictureurl" id="pictureurl" class="form-control">
+                        <label for="status" class="form-label">Status</label>
+                        <select name="status" id="status" class="form-select">
+                            <option value="Active">Active</option>
+                            <option value="Complete">Complete</option>
+                            <option value="On Hold">On Hold</option>
+                        </select>
+                        <label for="measurement" class="form-label">How to know when you finish your goal</label>
+                        <input type="text" name="measurement" id="measurement" class="form-control">
+                        <label for="datestart" class="form-label">Start Date</label>
+                        <input type="date" name="datestart" id="datestart" class="form-control">
+                        <label for="dateend" class="form-label">End Date</label>
+                        <input type="date" name="dateend" id="dateend" class="form-control">
+                        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                    <button type="submit" class="btn btn-primary">Add</button>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+<div id="tabsheets">
+    <nav>
+        <div class="nav nav-tabs" id="nav-tab" role="tablist">
+            <button class="nav-link active" id="nav-active-tab" data-bs-toggle="tab" data-bs-target="#nav-active"
+                type="button" role="tab" aria-controls="nav-active" aria-selected="true">Active</button>
+            <button class="nav-link" id="nav-complete-tab" data-bs-toggle="tab" data-bs-target="#nav-complete"
+                type="button" role="tab" aria-controls="nav-complete" aria-selected="false">Complete</button>
+            <button class="nav-link" id="nav-onhold-tab" data-bs-toggle="tab" data-bs-target="#nav-onhold" type="button"
+                role="tab" aria-controls="nav-onhold" aria-selected="false">On Hold</button>
+        </div>
+    </nav>
+    <div class="tab-content" id="nav-tabContent">
+        <div class="tab-pane fade show active" id="nav-active" role="tabpanel" aria-labelledby="nav-active-tab">
+            <div id="active">
+                <h1 class="display-1 g4">Active Goals</h1>
+                <div class="row justify-content-between">
+                    {% for goal in goals %}
+                    {% if goal.status == "Active" %}
+                    <div class="col-4 mb-4">
+                        <div class="card border-dark" style="width: 26rem;">
+                            <a href="/productivity/goals/{{goal.id}}"><img src="{{goal.pictureurl}}"
+                                    width="100%" height="275px" class="card-img-top" alt="{{goal.name}}"></a>
+                            <div class="card-body">
+                                <div class="card-header">
+                                    <h5 class="card-title">
+                                        <h2>{{goal.name}}</h2>
+                                    </h5>
+                                    <h6 class="card-subtitle mb-2 text-muted">
+                                        {{goal.status}}
+                                    </h6>
+                                </div>
+                                <div class="card-text">
+                                    {{goal.measurement}}
+                                    <div class="progress" style="height:30px">
+                                        <div id='progressBar{{goal.id}}'
+                                            class="progress-bar"
+                                            role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
+                                            style="width: 0%;height: 30px;">
+                                            {% for percent in percentcomplete %}
+                                            {% if goal.id == percent[0] %}
+                                            {{percent[1]}}%
+                                            <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
+                                            <script>
+                                                $("#progressBar{{goal.id}}").css("width", "{{percent[1]}}%");
+                                            </script>
+                                            {% endif %}
+                                            {% endfor %}
+                                        </div>
+                                    </div>
+                                    Start Date: {{goal.datestart.strftime("%A, %B %d, %Y")}}<br>
+                                    End Date: {{goal.dateend.strftime("%A, %B %d, %Y")}}<br>
+                                    </div>
+                            </div>
+                        </div>
+                    </div>
+                    {% endif %}
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+        <div class="tab-pane fade" id="nav-complete" role="tabpanel" aria-labelledby="nav-complete-tab">
+            <div id="completed">
+                <h1 class="display-1 g4">Completed Goals</h1>
+                <div class="row justify-content-between">
+                    {% for goal in goals %}
+                    {% if goal.status == "Complete" %}
+                    <div class="col-4 mb-4">
+                        <div class="card border-success" style="width: 26rem;">
+                            <a href="/productivity/goals/{{goal.id}}"><img src="{{goal.pictureurl}}"
+                                    width="100%" height="275px" class="card-img-top" alt="{{goal.name}}"></a>
+                            <div class="card-body">
+                                <div class="card-header">
+                                    <h5 class="card-title">
+                                        <h2>{{goal.name}}</h2>
+                                    </h5>
+                                    <h6 class="card-subtitle mb-2 text-muted">
+                                        {{goal.status}}
+                                    </h6>
+                                </div>
+                                {{goal.measurement}}
+                                <div class="card-text">
+                                    Start Date: {{goal.datestart.strftime("%A, %B %d, %Y")}}<br>
+                                    End Date: {{goal.dateend.strftime("%A, %B %d, %Y")}}<br>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    {% endif %}
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+        <div class="tab-pane fade" id="nav-onhold" role="tabpanel" aria-labelledby="nav-onhold-tab">
+            <div id="On-Hold">
+                <h1 class="display-1 g4">On-Hold Goals</h1>
+                <div class="row justify-content-between">
+                    {% for goal in goals %}
+                    {% if goal.status == "On Hold" %}
+                    <div class="col-4 mb-4">
+                        <div class="card border-warning" style="width: 26rem;">
+                            <a href="/productivity/goals/{{goal.id}}"><img src="{{goal.pictureurl}}"
+                                    width="100%" height="275px" class="card-img-top" alt="{{goal.name}}"></a>
+                            <div class="card-body">
+                                <div class="card-header">
+                                    <h5 class="card-title">
+                                        <h2>{{goal.name}}</h2>
+                                    </h5>
+                                    <h6 class="card-subtitle mb-2 text-muted">
+                                        {{goal.status}}
+                                    </h6>
+                                </div>
+                                {{goal.measurement}}
+                                <div class="card-text">
+                                    Start Date: {{goal.datestart.strftime("%A, %B %d, %Y")}}<br>
+                                    End Date: {{goal.dateend.strftime("%A, %B %d, %Y")}}<br>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    {% endif %}
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/goals_single.html b/website/templates/productivity/goals_single.html
new file mode 100644
index 0000000..f682386
--- /dev/null
+++ b/website/templates/productivity/goals_single.html
@@ -0,0 +1,73 @@
+{% extends "productivity/prod-div.html" %}
+
+{% block title %}
+{{current_user.username}} Goal
+{% endblock %}
+
+{% block proheader %}
+{% for goal in goals %}
+{{goal.name}}
+{% endfor %}
+{% endblock %}
+
+{% block menu %}
+<!-- goals -->
+{% for goal in goals %}
+<picture><img src="{{goal.pictureurl}}" width="100%" height="275px" class="card-img-top" alt="{{goal.name}}"></picture>
+{% endfor %}
+
+Percent Complete
+<div class="progress" style="height:40px">
+    <div id = 'progressBar' class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;height: 40px;">
+        {{percentcomplete}}%
+        <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
+        <script> $("#progressBar").css("width","{{percentcomplete}}%"); </script>
+    </div>
+  </div>
+
+<!-- Tasks -->
+{% for goal in goals %}
+<table class="table table-hover">
+    <thead>
+        <tr>
+            <th>Complete</th>
+            <th>Task</th>
+            <th>Goal</th>
+            <th>Due Date</th>
+        </tr>
+        <tr>
+            <form action="/productivity/goals/{{goal.id}}" class="table-dark" method="POST">
+                <td><input type="checkbox" name="complete" id="complete" class="form-check-input"></td>
+                <td><input type="text" name="task" id="task" class="form-control"></td>
+                <td><select name="goalfk" id="goalfk" class="form-select">
+                        {% for goal in goals %}
+                        <option value="{{goal.id}}">{{goal.name}}</option>
+                        {% endfor %}
+                    </select>
+                </td>
+                <td><input type="date" name="dueDate" id="dueDate" class="form-control"></td>
+                <td><input type="hidden" name='thisuserid' value="{{current_user.id}}"></td>
+                <td><input type="submit" value="submit"></td>
+            </form>
+        </tr>
+    </thead>
+    <tbody>
+        {% for task in tasks %}
+        <tr>
+            <td>
+                {% if task.checked %}
+                <a href="{{ url_for('prod.goalyesTOno', taskid=task.id, goalid=goal.id) }}"><button name="markdone" class="btn btn-warning">Undone</button></a>
+                {% else %}
+                <a href="{{ url_for('prod.goalnoTOyes', taskid=task.id, goalid=goal.id) }}"><button name="markdone" class="btn btn-success">Complete</button></a>
+                {% endif %}
+            </td>
+            <td>{{task.item}}</td>
+            <td>{{task.goalname}}</td>
+            <td>{{task.duedate.strftime("%m/%d/%y")}}</td>
+            <td><a href="{{ url_for('prod.deletegoal', taskid=task.id, goalid=goal.id) }}"><button class="btn btn-outline-danger">x</button></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endfor %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/prod-div.html b/website/templates/productivity/prod-div.html
new file mode 100644
index 0000000..4cd6adb
--- /dev/null
+++ b/website/templates/productivity/prod-div.html
@@ -0,0 +1,26 @@
+{% extends "base.html" %}
+
+{% block submenu %}
+<div class="btn-group" role="group" aria-label="Button group with nested dropdown">
+    <a href="/productivity/tasks/1"><button type="button" class="btn btn-outline-primary">Tasks</button></a>
+    <a href="/productivity/goals"><button type="button" class="btn btn-outline-primary">Goals</button></a>
+    <a href="/productivity/projects"><button type="button" class="btn btn-outline-primary">Projects</button></a>
+</div>
+{% endblock %}
+
+{% block title %}
+{{User.username}} Health Information
+{% endblock %}
+
+{% block content %}
+{% block header %}
+
+{% endblock %}
+
+{% block menu %}
+{% endblock%}
+
+
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/productivity.html b/website/templates/productivity/productivity.html
new file mode 100644
index 0000000..b38192b
--- /dev/null
+++ b/website/templates/productivity/productivity.html
@@ -0,0 +1,13 @@
+{% extends "productivity/prod-div.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block content %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/productivity.py b/website/templates/productivity/productivity.py
new file mode 100644
index 0000000..fddb802
--- /dev/null
+++ b/website/templates/productivity/productivity.py
@@ -0,0 +1,312 @@
+from flask import Blueprint, render_template, request, flash, redirect, url_for, send_file, after_this_request
+from flask_login import login_required, current_user
+from sqlalchemy.orm import session
+from website.models import *
+from datetime import datetime, timedelta
+from website import db
+
+from website.makedates import makedates
+from website.nutrition import get_food_item, nutrition_single
+from sqlalchemy.sql import func
+import datetime, sys, pdfkit, flask_login, os
+from math import ceil
+from website.wifiqrcode import generate_code
+
+prod = Blueprint("prod", __name__)
+
+# Productivity
+@prod.route("/", methods=['GET', 'POST'])
+@login_required
+def productivity():
+    return render_template("productivity/productivity.html", user=User)
+
+@prod.route("/goals", methods=['GET', 'POST'])
+@login_required
+def goals():
+    if request.method == 'POST':
+        newGoal = Goals(
+            name = request.form.get('name'),
+            pictureurl = request.form.get('pictureurl'),
+            status = request.form.get('status'),
+            measurement = request.form.get('measurement'),
+            datestart = datetime.datetime.strptime(request.form.get('datestart'), "%Y-%m-%d"),
+            dateend = datetime.datetime.strptime(request.form.get('dateend'), "%Y-%m-%d"),
+            userid = request.form.get('thisuserid'),
+        )
+        db.session.add(newGoal)
+        db.session.commit()
+    
+    completedTasks = db.session.query(Tasks.goalfk,func.count(Tasks.id).label('count')).filter(Tasks.checked == True).group_by(Tasks.goalfk).all()
+    allTasks = db.session.query(Tasks.goalfk,func.count(Tasks.id).label('count')).group_by(Tasks.goalfk).all()
+    
+    percentcomplete=[]
+    projects = []
+    for completed in completedTasks:
+        projects.append(completed[0])
+        
+    for i in range(len(allTasks)):
+        allvalue=allTasks[i][0]
+        if allvalue in projects:
+            for a in range(len(allTasks)):
+                if allTasks[i][0] == completedTasks[a][0]:
+                    perc = round(completedTasks[a][1]/allTasks[i][1]*100,2)
+                    percentcomplete.append(tuple((allTasks[i][0],perc)))
+                    break
+                else:
+                    next
+    
+    goals = db.session.query(Goals).order_by(Goals.name).all()
+    return render_template("productivity/goals.html", user=User, goals=goals, percentcomplete=percentcomplete)
+
+@prod.route("/goals/<id>", methods=['GET', 'POST'])
+@login_required
+def goal_single(id):
+    if request.method == 'POST':
+        if request.form.get('complete') == 'on': complete = True 
+        else: complete = False
+        newtask = Tasks(
+            project = None,
+            item = request.form.get('task').title(),
+            checked = complete,
+            userid = request.form.get('thisuserid'),
+            duedate = datetime.datetime.strptime(request.form.get('dueDate'),"%Y-%m-%d"),
+            goalfk = request.form.get('goalfk')
+        )
+        db.session.add(newtask)
+        db.session.commit()
+        return redirect(url_for('prod.goal_single', id=id))
+    
+    completedTasks = db.session.query(Tasks.item).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.goalfk == id).filter(Tasks.checked == True).count()
+    allTasks = db.session.query(Tasks.item).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.goalfk == id).count()
+    
+    if allTasks == 0:
+        percentcomplete = 0
+    else:
+        percentcomplete = round((completedTasks/allTasks)*100,2)
+
+    goals = db.session.query(Goals).filter(Goals.userid == flask_login.current_user.id).filter(Goals.id == id).all()
+    tasks = db.session.query(Tasks).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.goalfk == id).order_by(Tasks.checked, Tasks.duedate, Tasks.item).all()
+    return render_template("productivity/goals_single.html", user=User, goals=goals, tasks=tasks, percentcomplete=percentcomplete)
+
+@prod.route("/noTOyes/<taskid>/<goalid>")
+@login_required
+def goalnoTOyes(taskid, goalid):
+    
+    task = Tasks.query.filter_by(id=taskid).first()
+    task.checked = True
+    db.session.commit()
+    return redirect(url_for('prod.goal_single', id=goalid))
+
+@prod.route("/yesTOno/<taskid>/<goalid>")
+@login_required
+def goalyesTOno(taskid, goalid):
+    
+    task = Tasks.query.filter_by(id=taskid).first()
+    task.checked = False
+    db.session.commit()
+    return redirect(url_for('prod.goal_single', id=goalid))
+
+@prod.route("/deletetask/<taskid>/<goalid>")
+@login_required
+def deletegoal(taskid, goalid):
+    
+    Tasks.query.filter_by(id=taskid).delete()
+    db.session.commit()
+    return redirect(url_for('prod.goal_single', id=goalid))
+
+
+@prod.route("/projects", methods=['GET', 'POST'])
+@login_required
+def projects():
+    if request.method == 'POST':
+        when = int(request.form.get('when_review'))
+        nextrev = datetime.datetime.strptime(request.form.get('last_reviewed'),"%Y-%m-%d") + timedelta(days=when)
+        newProj = Projects(
+            name = request.form.get('name'),
+            pictureurl = request.form.get('pictureurl'),
+            status = request.form.get('status'),
+            last_reviewed = datetime.datetime.strptime(request.form.get('last_reviewed'),"%Y-%m-%d"),
+            when_review = request.form.get('when_review'),
+            next_review = nextrev,
+            userid = request.form.get('thisuserid')
+        )
+        db.session.add(newProj)
+        db.session.commit()
+    
+    pros = db.session.query(Projects).all()
+    for pro in pros:
+        pro.next_review = pro.last_reviewed + timedelta(days=pro.when_review)
+        db.session.commit()
+    
+    completedTasks = db.session.query(Tasks.project,func.count(Tasks.id).label('count')).filter(Tasks.checked == True).group_by(Tasks.project).all()
+    allTasks = db.session.query(Tasks.project,func.count(Tasks.id).label('count')).group_by(Tasks.project).all()
+    
+    percentcomplete=[]
+    projects = []
+    for completed in completedTasks:
+        projects.append(completed[0])
+        
+    for i in range(len(allTasks)):
+        allvalue=allTasks[i][0]
+        if allvalue in projects:
+            for a in range(len(allTasks)):
+                if allTasks[i][0] == completedTasks[a][0]:
+                    perc = round(completedTasks[a][1]/allTasks[i][1]*100,2)
+                    percentcomplete.append(tuple((allTasks[i][0],perc)))
+                    break
+                else:
+                    next
+    #TODO: make a way for user to update the reviewed date so it can re-calculate the next review date
+    projects = db.session.query(Projects).order_by(Projects.name).all()
+    return render_template("productivity/projects.html", user=User, projects=projects, percentcomplete=percentcomplete)
+
+@prod.route("/tasks/<int:page_num>", methods=['GET', 'POST'])
+@login_required
+def tasks(page_num):
+    if request.method == 'POST':
+        if request.form.get('complete') == 'on': complete = True 
+        else: complete = False
+        
+        if request.form.get('project')[0] == "P":
+            project = request.form.get('project')[1:]
+            goalfk = None
+        else:
+            project = None
+            goalfk = request.form.get('project')[1:]
+        
+        newtask = Tasks(
+            project = project,
+            item = request.form.get('task').title(),
+            checked = complete,
+            userid = request.form.get('thisuserid'),
+            duedate = datetime.datetime.strptime(request.form.get('dueDate'),"%Y-%m-%d"),
+            goalfk = goalfk
+        )
+        db.session.add(newtask)
+        db.session.commit()
+        
+    projects = db.session.query(Projects).filter(Projects.userid == flask_login.current_user.id).order_by(Projects.name).all()
+    goals = db.session.query(Goals).filter(Goals.userid == flask_login.current_user.id).order_by(Goals.name).all()
+    incomplete = db.session.query(Projects.name.label('projectname'), Projects.status.label('projectstatus'), Tasks.checked, Tasks.duedate, Tasks.goalfk, Tasks.id, Tasks.item).join(Projects, Projects.id == Tasks.project).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.checked == 0).order_by(Tasks.duedate, Tasks.project, Tasks.item).paginate(per_page=5, page=page_num, error_out=True)
+    complete = db.session.query(Projects.name.label('projectname'), Projects.status.label('projectstatus'), Tasks.checked, Tasks.duedate, Tasks.goalfk, Tasks.id, Tasks.item).join(Projects, Projects.id == Tasks.project).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.checked == 1).order_by(Tasks.project, Tasks.duedate, Tasks.item).paginate(per_page=10, page=page_num, error_out=True)
+    return render_template("/productivity/tasks.html", user=User, projects=projects, complete=complete, incomplete=incomplete, goals=goals)
+
+@prod.route("/projects/<id>", methods=['GET', 'POST'])
+@login_required
+def project_single(id):
+    if request.method == 'POST':
+        if request.form['reviewupdate'] == 'Review Complete':
+            udproject = db.session.query(Projects).filter(Projects.id == id).first()
+            udproject.next_review = datetime.datetime.strptime(request.form.get('date_update'),"%Y-%m-%d") + timedelta(days=int(udproject.when_review))
+            udproject.last_reviewed = datetime.datetime.strptime(request.form.get('date_update'),"%Y-%m-%d")
+            db.session.commit()
+            return redirect(url_for('views.home'))
+        else:
+            if request.form.get('complete') == 'on': complete = True 
+            else: complete = False
+            newtask = Tasks(
+                project = request.form.get('project'),
+                item = request.form.get('task').title(),
+                checked = complete,
+                userid = request.form.get('thisuserid'),
+                duedate = datetime.datetime.strptime(request.form.get('dueDate'),"%Y-%m-%d"),
+                goalfk = None
+            )
+            db.session.add(newtask)
+            db.session.commit()
+        return redirect(url_for('prod.project_single', id=id))
+    
+    completedTasks = db.session.query(Tasks.item).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.project == id).filter(Tasks.checked == True).count()
+    allTasks = db.session.query(Tasks.item).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.project == id).count()
+    
+    if allTasks == 0:
+        percentcomplete = 0
+    else:
+        percentcomplete = round((completedTasks/allTasks)*100,2)
+
+    projects = db.session.query(Projects.id, Projects.name, Projects.status, Projects.last_reviewed, Projects.when_review, Projects.pictureurl, Projects.userid).filter(Projects.userid == flask_login.current_user.id).filter(Projects.id == id).all()
+    tasks = db.session.query(Tasks).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.project == id).order_by(Tasks.checked, Tasks.duedate, Tasks.item).all()
+    return render_template("productivity/projects_single.html", user=User, projects=projects, tasks=tasks, percentcomplete=percentcomplete, today=datetime.datetime.today())
+
+@prod.route("/noTOyes/<taskid>/<projectid>")
+@login_required
+def noTOyes(taskid, projectid):
+    
+    task = Tasks.query.filter_by(id=taskid).first()
+    task.checked = True
+    db.session.commit()
+    return redirect(url_for('prod.project_single', id=projectid))
+
+@prod.route("/yesTOno/<taskid>/<projectid>")
+@login_required
+def yesTOno(taskid, projectid):
+    
+    task = Tasks.query.filter_by(id=taskid).first()
+    task.checked = False
+    db.session.commit()
+    return redirect(url_for('prod.project_single', id=projectid))
+
+@prod.route("/deletetask/<taskid>/<projectid>")
+@login_required
+def deletetask(taskid, projectid):
+    refeerer = request.referrer
+    db.session.query(Tasks).filter(Tasks.id == taskid).delete()
+    db.session.commit()
+    return redirect(refeerer)
+
+@prod.route("/importNotion")
+@login_required
+def importNotion():
+    from website.taskinport import get_tasks, getNextTasks, parsejsonMakeTask, notionidupdate
+    
+    notionidupdate()
+    
+    json = get_tasks()
+    parsejsonMakeTask(json)
+    
+    while json['next_cursor'] != None:
+        nextcursor = json['next_cursor']
+        json = getNextTasks(nextcursor)
+        parsejsonMakeTask(json)
+    
+    return redirect(url_for('prod.tasks'))
+
+@prod.route("/taskdelete/<taskid>")
+@login_required
+def taskdelete(taskid):
+    refeerer = request.referrer
+    db.session.query(Tasks).filter(Tasks.id == taskid).delete()
+    db.session.commit()
+    return redirect(refeerer)
+
+@prod.route("/task_noTOyes/<taskid>")
+@login_required
+def task_noTOyes(taskid):
+    
+    task = Tasks.query.filter_by(id=taskid).first()
+    task.checked = True
+    db.session.commit()
+    return redirect(url_for('prod.tasks'))
+
+@prod.route("/task_yesTOno/<taskid>")
+@login_required
+def task_yesTOno(taskid):
+    
+    task = Tasks.query.filter_by(id=taskid).first()
+    task.checked = False
+    db.session.commit()
+    return redirect(url_for('prod.tasks'))
+
+@prod.route("/taskupdate/<taskid>", methods=['GET','POST'])
+@login_required
+def taskupdate(taskid):
+    if request.method == 'POST':
+        updatetask = Tasks.query.filter(Tasks.id == taskid).first()
+        updatetask.item = request.form.get('name').title()
+        updatetask.duedate = datetime.datetime.strptime(request.form.get('duedate'),"%Y-%m-%d")
+        updatetask.userid = request.form.get('thisuserid')
+        db.session.commit()
+        return redirect(url_for('prod.tasks'))
+
+    task = db.session.query(Projects.name.label('projectname'), Projects.status.label('projectstatus'), Tasks.checked, Tasks.duedate, Tasks.goalfk, Tasks.id, Tasks.item).join(Projects, Projects.id == Tasks.project).filter(Tasks.id == taskid).all()
+    return render_template("productivity/taskupdate.html", user=User, task=task)
\ No newline at end of file
diff --git a/website/templates/productivity/projects.html b/website/templates/productivity/projects.html
new file mode 100644
index 0000000..0b59a6f
--- /dev/null
+++ b/website/templates/productivity/projects.html
@@ -0,0 +1,178 @@
+{% extends "productivity/prod-div.html" %}
+
+{% block title %}
+{{current_user.username}} Project
+{% endblock %}
+
+{% block proheader %}
+Projects for {{current_user.firstname}}
+{% endblock %}
+
+{% block menu %}
+<div id="form">
+    <!-- Button trigger modal -->
+    <button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#staticBackdrop">
+        Add New Project
+    </button>
+
+    <!-- Modal -->
+    <div class="modal fade" id="staticBackdrop" data-bs-backdrop="static" data-bs-keyboard="false" tabindex="-1"
+        aria-labelledby="staticBackdropLabel" aria-hidden="true">
+        <div class="modal-dialog modal-lg">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <h5 class="modal-title" id="staticBackdropLabel">Add Project</h5>
+                    <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+                </div>
+                <div class="modal-body">
+                    <form action="/productivity/projects" method="POST">
+                        <label for="name" class="form-label">Name of Project</label>
+                        <input type="text" name="name" id="name" class="form-control">
+                        <label for="pictureurl" class="form-label">URL of Picture</label>
+                        <input type="text" name="pictureurl" id="pictureurl" class="form-control">
+                        <label for="status" class="form-label">Status</label>
+                        <select name="status" id="status" class="form-control">
+                            <option value="Active">Active</option>
+                            <option value="Complete">Complete</option>
+                            <option value="On Hold">On Hold</option>
+                        </select>
+                        <label for="last_reviewed" class="form-label">Last Reviewed</label>
+                        <input type="date" name="last_reviewed" id="last_reviewed" class="form-control">
+                        <label for="when_review" class="form-label">When to review (in days)</label>
+                        <input type="number" name="when_review" id="when_review" class="form-control">
+                        <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+                </div>
+                <div class="modal-footer">
+                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                    <button type="submit" class="btn btn-primary">Add</button>
+                    </form>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+<div id="tabsheets">
+    <nav>
+        <div class="nav nav-tabs" id="nav-tab" role="tablist">
+            <button class="nav-link active" id="nav-active-tab" data-bs-toggle="tab" data-bs-target="#nav-active"
+                type="button" role="tab" aria-controls="nav-active" aria-selected="true">Active</button>
+            <button class="nav-link" id="nav-complete-tab" data-bs-toggle="tab" data-bs-target="#nav-complete"
+                type="button" role="tab" aria-controls="nav-complete" aria-selected="false">Complete</button>
+            <button class="nav-link" id="nav-onhold-tab" data-bs-toggle="tab" data-bs-target="#nav-onhold" type="button"
+                role="tab" aria-controls="nav-onhold" aria-selected="false">On Hold</button>
+        </div>
+    </nav>
+    <div class="tab-content" id="nav-tabContent">
+        <div class="tab-pane fade show active" id="nav-active" role="tabpanel" aria-labelledby="nav-active-tab">
+            <div id="active">
+                <h1 class="display-1 g4">Active Projects</h1>
+                <div class="row justify-content-between">
+                    {% for project in projects %}
+                    {% if project.status == "Active" %}
+                    <div class="col-4 mb-4">
+                        <div class="card border-dark" style="width: 26rem;">
+                            <a href="/productivity/projects/{{project.id}}"><img src="{{project.pictureurl}}"
+                                    width="100%" height="275px" class="card-img-top" alt="{{project.name}}"></a>
+                            <div class="card-body">
+                                <div class="card-header">
+                                    <h5 class="card-title">
+                                        <h2>{{project.name}}</h2>
+                                    </h5>
+                                    <h6 class="card-subtitle mb-2 text-muted">
+                                        {{project.status}}
+                                    </h6>
+                                </div>
+                                <div class="card-text">
+                                    <div class="progress" style="height:30px">
+                                        <div id='progressBar{{project.id}}'
+                                            class="progress-bar"
+                                            role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"
+                                            style="width: 0%;height: 30px;">
+                                            {% for percent in percentcomplete %}
+                                            {% if project.id == percent[0] %}
+                                            {{percent[1]}}%
+                                            <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
+                                            <script>
+                                                $("#progressBar{{project.id}}").css("width", "{{percent[1]}}%");
+                                            </script>
+                                            {% endif %}
+                                            {% endfor %}
+                                        </div>
+                                    </div>
+                                    Last Reviewed: {{project.last_reviewed.strftime("%A, %B %d, %Y")}}<br>
+                                    Review every {{project.when_review}} days <br>
+                                    </div>
+                            </div>
+                        </div>
+                    </div>
+                    {% endif %}
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+        <div class="tab-pane fade" id="nav-complete" role="tabpanel" aria-labelledby="nav-complete-tab">
+            <div id="completed">
+                <h1 class="display-1 g4">Completed Projects</h1>
+                <div class="row justify-content-between">
+                    {% for project in projects %}
+                    {% if project.status == "Complete" %}
+                    <div class="col-4 mb-4">
+                        <div class="card border-success" style="width: 26rem;">
+                            <a href="/productivity/projects/{{project.id}}"><img src="{{project.pictureurl}}"
+                                    width="100%" height="275px" class="card-img-top" alt="{{project.name}}"></a>
+                            <div class="card-body">
+                                <div class="card-header">
+                                    <h5 class="card-title">
+                                        <h2>{{project.name}}</h2>
+                                    </h5>
+                                    <h6 class="card-subtitle mb-2 text-muted">
+                                        {{project.status}}
+                                    </h6>
+                                </div>
+                                <div class="card-text">
+                                    Last Time Reviewed: {{project.last_reviewed.strftime("%A, %B %d, %Y")}}<br>
+                                    Reviewed every {{project.when_review}} days
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    {% endif %}
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+        <div class="tab-pane fade" id="nav-onhold" role="tabpanel" aria-labelledby="nav-onhold-tab">
+            <div id="On-Hold">
+                <h1 class="display-1 g4">On-Hold Projects</h1>
+                <div class="row justify-content-between">
+                    {% for project in projects %}
+                    {% if project.status == "On Hold" %}
+                    <div class="col-4 mb-4">
+                        <div class="card border-warning" style="width: 26rem;">
+                            <a href="/productivity/projects/{{project.id}}"><img src="{{project.pictureurl}}"
+                                    width="100%" height="275px" class="card-img-top" alt="{{project.name}}"></a>
+                            <div class="card-body">
+                                <div class="card-header">
+                                    <h5 class="card-title">
+                                        <h2>{{project.name}}</h2>
+                                    </h5>
+                                    <h6 class="card-subtitle mb-2 text-muted">
+                                        {{project.status}}
+                                    </h6>
+                                </div>
+                                <div class="card-text">
+                                    Last Time Reviewed: {{project.last_reviewed.strftime("%A, %B %d, %Y")}}<br>
+                                    Reviewed every {{project.when_review}} days
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                    {% endif %}
+                    {% endfor %}
+                </div>
+            </div>
+        </div>
+    </div>
+</div>
+
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/projects_single.html b/website/templates/productivity/projects_single.html
new file mode 100644
index 0000000..1ed071d
--- /dev/null
+++ b/website/templates/productivity/projects_single.html
@@ -0,0 +1,94 @@
+{% extends "productivity/prod-div.html" %}
+
+{% block title %}
+{{current_user.username}} Project
+{% endblock %}
+
+{% block proheader %}
+{% for project in projects %}
+{{project.name}}
+{% endfor %}
+{% endblock %}
+
+{% block menu %}
+<!-- Projects -->
+{% for project in projects %}
+<img src="{{project.pictureurl}}" width="100%" height="275px" class="card-img-top" alt="{{project.name}}">
+{% endfor %}
+
+<!-- progress bar -->
+Percent Complete
+<div class="row">
+    <div class="progress col-md-8" style="height:40px">
+        <div id='progressBar' class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar"
+            aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 75%;height: 40px;">
+            {{percentcomplete}}%
+            <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
+            <script>
+                $("#progressBar").css("width", "{{percentcomplete}}%");
+            </script>
+        </div>
+    </div>
+    {% for project in projects %}
+    <div id="update" class="col-md-4 form-inline">
+        <div class="row">
+            <form action="/productivity/projects/{{ project.id }}" method="POST">
+                <label class="form-label" for="date_update"></label>
+                <input class="form-control" type="date" name="date_update" id="date_update" value="{{today}}">
+                <input class="btn btn-secondary" name="reviewupdate" id="reviewupdate" type="submit" value="Review Complete">
+            </form>
+        </div>
+    </div>
+    {% endfor %}
+</div>
+
+<!-- Tasks -->
+{% for project in projects %}
+<table class="table table-hover">
+    <thead>
+        <tr>
+            <th>Complete</th>
+            <th>Task</th>
+            <th>Project</th>
+            <th>Due Date</th>
+        </tr>
+        <tr>
+            <form action="{{url_for('prod.projects', id=project.id)}}" class="table-dark" method="POST">
+                <td><input type="checkbox" name="complete" id="complete" class="form-check-input"></td>
+                <td><input type="text" name="task" id="task" class="form-control"></td>
+                <td><select name="project" id="project" class="form-select">
+                        {% for project in projects %}
+                        <option value="{{project.id}}">{{project.name}}</option>
+                        {% endfor %}
+                    </select>
+                </td>
+                <td><input type="date" name="dueDate" id="dueDate" class="form-control"></td>
+                <td><input type="hidden" name='thisuserid' value="{{current_user.id}}"></td>
+                <td><input type="submit" value="submit"></td>
+            </form>
+        </tr>
+    </thead>
+    <tbody>
+        {% for task in tasks %}
+        <tr>
+            <td>
+                {% if task.checked %}
+                <a href="{{ url_for('prod.yesTOno', taskid=task.id, projectid=project.id) }}"><button name="markdone"
+                        class="btn btn-warning">Undone</button></a>
+                {% else %}
+                <a href="{{ url_for('prod.noTOyes', taskid=task.id, projectid=project.id) }}"><button name="markdone"
+                        class="btn btn-success">Complete</button></a>
+                {% endif %}
+            </td>
+            <td>{{task.item}}</td>
+            <td>{{task.projectname}}</td>
+            <td>{{task.duedate.strftime("%m/%d/%y")}}</td>
+            <td>
+                <a href="{{ url_for('prod.taskdelete', taskid=task.id) }}">
+                <button class="btn btn-danger"><i class="fas fa-trash-alt"></i></button></a></td>
+        </tr>
+        {% endfor %}
+    </tbody>
+</table>
+{% endfor %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/tasks.html b/website/templates/productivity/tasks.html
new file mode 100644
index 0000000..c368931
--- /dev/null
+++ b/website/templates/productivity/tasks.html
@@ -0,0 +1,138 @@
+{% extends "productivity/prod-div.html" %}
+
+{% block title %}
+{{current_user.username}} Tasks
+{% endblock %}
+
+{% block proheader %}
+Tasks for {{current_user.firstname}}
+{% endblock %}
+
+{% block menu %}
+<a href="{{url_for('prod.importNotion')}}"><button class="btn btn-primary">Import</button></a>
+
+<nav>
+    <div class="nav nav-tabs" id="nav-tab" role="tablist">
+        <button class="nav-link active" id="nav-notcomplete-tab" data-bs-toggle="tab" data-bs-target="#nav-notcomplete"
+            type="button" role="tab" aria-controls="nav-notcomplete" aria-selected="true">Not Complete</button>
+        <button class="nav-link" id="nav-complete-tab" data-bs-toggle="tab" data-bs-target="#nav-complete" type="button"
+            role="tab" aria-controls="nav-complete" aria-selected="false">Complete</button>
+    </div>
+</nav>
+<div class="tab-content" id="nav-tabContent">
+    <div class="tab-pane fade" id="nav-complete" role="tabpanel" aria-labelledby="nav-complete-tab">
+        <table class="table table-hover">
+            <thead>
+                <tr>
+                    <th>Complete</th>
+                    <th>Task</th>
+                    <th>Project</th>
+                    <th>Due Date</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for task in complete.items %}
+                <tr>
+                    <td><a href="{{ url_for('prod.task_yesTOno', taskid=task.id) }}"><button name="markdone"
+                                class="btn btn-warning">Undone</button></a></td>
+                    <td>{{task.item}}</td>
+                    <td>{{task.projectname}}</td>
+                    <td>{{task.duedate.strftime("%m/%d/%y")}}</td>
+                    <td><a href="#"><button class="btn btn-outline-primary"><i class="far fa-edit"></i></button></a>
+                    </td>
+                    <td><a href="{{ url_for('prod.taskdelete', taskid=task.id) }}"><button
+                                class="btn btn-outline-danger">X</button></a></td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+        <nav aria-label="Task InComplete Pageinate">
+            <ul class="pagination justify-content-start">
+                {% for page in complete.iter_pages(left_edge=3, right_edge=3, left_current=3, right_current=3) %}
+                <li class="page-item">
+                    {% if page %}
+                    <a class="page-link" href="{{ url_for('prod.tasks', page_num=page) }}">{{ page }}</a>
+                    {% else %}
+                    <p class="page-link">...</p>
+                    {% endif %}
+                </li>
+                {% endfor %}
+            </ul>
+        </nav>
+
+    </div>
+    <div class="tab-pane fade show active" id="nav-notcomplete" role="tabpanel" aria-labelledby="nav-notcomplete-tab">
+        <table class="table table-hover">
+            <thead>
+                <tr>
+                    <th>Complete</th>
+                    <th>Task</th>
+                    <th>Project</th>
+                    <th>Due Date</th>
+                </tr>
+            </thead>
+            <tbody>
+                <tr>
+                    <form action="{{url_for('prod.tasks', page_num=1)}}" class="table-dark" method="POST">
+                        <td><input type="checkbox" class="form-check-input"></td>
+                        <td><input type="text" name="task" id="task" class="form-control"></td>
+                        <td><select name="project" id="project" class="form-select">
+                                <option disabled>Projects</option>
+                                {% for project in projects %}
+                                <option value="P{{project.id}}">{{project.name}}</option>
+                                {% endfor %}
+                                <option disabled>Goals</option>
+                                {% for goal in goals %}
+                                <option value="G{{goal.id}}">{{goal.name}}</option>
+                                {% endfor %}
+                            </select>
+                        </td>
+                        <td><input type="date" name="dueDate" id="dueDate" class="form-control"></td>
+                        <td><input type="hidden" name='thisuserid' value="{{current_user.id}}"></td>
+                        <td><input type="submit" value="submit"></td>
+                    </form>
+                </tr>
+            </tbody>
+        </table>
+        <table class="table table-hover">
+            <tbody>
+                {% for task in incomplete.items %}
+                {% if task.duedate.strftime("%m/%d/%Y") < task.duedate.now().strftime("%m/%d/%Y") %}
+                <tr class="text-danger">
+                    {% elif task.duedate.strftime("%m/%d/%y") == task.duedate.now().strftime("%m/%d/%y") %}
+                <tr class="text-success">
+                    {% else %}
+                <tr>
+                    {% endif %}
+                    <td><a href="{{ url_for('prod.task_noTOyes', taskid=task.id) }}"><button name="markdone"
+                                class="btn btn-success">Complete</button></a></td>
+                    <td>{{task.item}}</td>
+                    <td>{{task.projectname}}</td>
+                    <td>{{task.duedate.strftime("%m/%d/%y")}}</td>
+                    <td><a href="{{ url_for('prod.taskupdate', taskid=task.id) }}"><button type="button"
+                                class="btn btn-primary"><i class="far fa-edit"></i></button></a></td>
+                    <td><a href="{{ url_for('prod.taskdelete', taskid=task.id) }}"><button class="btn btn-danger"><i
+                                    class="fas fa-trash-alt"></i></button></a></td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+        <nav aria-label="Task Complete Pageinate">
+            <ul class="pagination justify-content-start">
+                {% for page in incomplete.iter_pages(left_edge=3, right_edge=3, left_current=3, right_current=3) %}
+                <li class="page-item">
+                    {% if page %}
+                    <a class="page-link" href="{{ url_for('prod.tasks', page_num=page) }}">{{ page }}</a>
+                    {% else %}
+                    <p class="page-link">...</p>
+                    {% endif %}
+                </li>
+                {% endfor %}
+
+            </ul>
+        </nav>
+    </div>
+</div>
+
+
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/productivity/taskupdate.html b/website/templates/productivity/taskupdate.html
new file mode 100644
index 0000000..f9199ab
--- /dev/null
+++ b/website/templates/productivity/taskupdate.html
@@ -0,0 +1,25 @@
+{% extends "productivity/prod-div.html" %}
+
+{% block title %}
+Edit Task
+{% endblock %}
+
+{% block proheader %}
+Edit Task
+{% endblock %}
+
+{% block menu %}
+{% for task in task %}
+<form action="/productivity/taskupdate/{{task.id}}" method="POST">
+    <a href="{{ url_for('prod.task_noTOyes', taskid=task.id) }}"><button name="markdone"
+            class="btn btn-success">Complete</button></a>
+    <label for="item">Name of Task</label>
+    <input type="text" name="name" id="name" value="{{task.item}}">
+    <label for="duedate">Due Date</label>
+    <input type="text" name="duedate" id="duedate" value='{{task.duedate.strftime("%Y-%m-%d")}}'>
+    <input type="hidden" name='thisuserid' value="{{current_user.id}}">
+
+    <input type="submit" value="Update">
+</form>
+{% endfor %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/settings/__pycache__/settings.cpython-38.pyc b/website/templates/settings/__pycache__/settings.cpython-38.pyc
new file mode 100644
index 0000000..95ad956
Binary files /dev/null and b/website/templates/settings/__pycache__/settings.cpython-38.pyc differ
diff --git a/website/templates/settings/settings.html b/website/templates/settings/settings.html
new file mode 100644
index 0000000..d71c802
--- /dev/null
+++ b/website/templates/settings/settings.html
@@ -0,0 +1,105 @@
+{% extends "base.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block content %}
+<div class="row g2">
+    <div class="col-3">
+        <p class="display-6 text-primary text-decoration-underline text-center">Menu</p>
+        <form action="{{url_for('settings.settingsHome')}}" method="post">
+            {% for value in values %}
+            {% if "menu" in value[1] %}
+            <div class="form-check">
+                <label class="form-check-label" for="{{value[1]}}">{{value[1]}}</label>
+                {% if value[0] == True %}
+                <input class="form-check-input" type="checkbox" name="{{value[1]}}" id="{{value[1]}}" checked>
+                {% else %}
+                <input class="form-check-input" type="checkbox" name="{{value[1]}}"  id="{{value[1]}}">
+                {% endif %}
+            </div>
+            {% endif %}
+            {% endfor %}
+            <input type="submit" class="btn btn-primary" value="Submit Settings">
+        </form>
+    </div>
+    <div class="col-3">
+        <p class="display-6 text-info text-decoration-underline text-center">Health</p>
+        <form action="/settings/" method="post">
+            {% for value in values %}
+            {% if "health" in value[1] %}
+            <div class="form-check">
+                <label class="form-check-label" for="{{value[1]}}">{{value[1]}}</label>
+                {% if value[0] == True %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}" checked>
+                {% else %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}">
+                {% endif %}
+            </div>
+            {% endif %}
+            {% endfor %}
+            <input type="submit" class="btn btn-primary" value="Submit Settings">
+        </form>
+    </div>
+    <div class="col-3">
+        <p class="display-6 text-warning text-decoration-underline text-center">Productivity</p>
+        <form action="/settings/" method="post">
+            {% for value in values %}
+            {% if "prod" in value[1] %}
+            <div class="form-check">
+                <label class="form-check-label" for="{{value[1]}}">{{value[1]}}</label>
+                {% if value[0] == True %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}" checked>
+                {% else %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}">
+                {% endif %}
+            </div>
+            {% endif %}
+            {% endfor %}
+            <input type="submit" class="btn btn-primary" value="Submit Settings">
+        </form>
+    </div>
+    <div class="col-3">
+        <p class="display-6 text-danger text-decoration-underline text-center">Personal</p>
+        <form action="/settings/" method="post">
+            {% for value in values %}
+            {% if "personal" in value[1] %}
+            <div class="form-check">
+                <label class="form-check-label" for="{{value[1]}}">{{value[1]}}</label>
+                {% if value[0] == True %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}" checked>
+                {% else %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}">
+                {% endif %}
+            </div>
+            {% endif %}
+            {% endfor %}
+            <input type="submit" class="btn btn-primary" value="Submit Settings">
+        </form>
+    </div>
+    <div class="col-3">
+        <p class="display-6 text-secondary text-decoration-underline text-center">Other</p>
+        <form action="/settings/" method="post">
+            {% for value in values %}
+            {% if "other" in value[1] %}
+            <div class="form-check">
+                <label class="form-check-label" for="{{value[1]}}">{{value[1]}}</label>
+                {% if value[0] == True %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}" checked>
+                {% else %}
+                <input class="form-check-input" type="checkbox" id="{{value[1]}}">
+                {% endif %}
+            </div>
+            {% endif %}
+            {% endfor %}
+            <input type="submit" class="btn btn-primary" value="Submit Settings">
+        </form>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/settings/settings.py b/website/templates/settings/settings.py
new file mode 100644
index 0000000..bb25c27
--- /dev/null
+++ b/website/templates/settings/settings.py
@@ -0,0 +1,37 @@
+from flask import Blueprint, render_template, request, redirect, url_for
+from flask_login import login_required
+import flask_login
+from sqlalchemy.sql import desc
+from website.models import *
+from website import db
+import datetime, json
+
+settings = Blueprint("settings", __name__)
+
+@settings.route("/", methods=['GET','POST'])
+@login_required
+def settingsHome():
+    # FIXME:figure out how to dynamically get info from form and save to db
+    if request.method == 'POST':
+        # cols = Settings.__table__.columns.keys()
+        # us = db.session.query(Settings).filter(Settings.userid == flask_login.current_user.id).first()
+        # for col in cols[2:-2]:
+        #     us.getattr(Settings, col) = request.form.get(col)
+        pass
+        return redirect(url_for('settings.settingsHome'))
+    
+    cols = Settings.__table__.columns.keys()
+    
+    dic_cols = []
+    for col_name in cols[2:-2]:
+        key = col_name
+        label = key
+        dbvalue = db.session.query(getattr(Settings, key)).filter(Settings.userid == flask_login.current_user.id).first()
+        if dbvalue[0] == None: value=False
+        elif dbvalue[0] == True: value=True
+        elif dbvalue[0] == False: value=False
+        else: value = False
+        dic_cols.append([value,label])
+    
+    us = db.session.query(Settings).filter(Settings.userid == flask_login.current_user.id).first()
+    return render_template('settings/settings.html', user=User, us=us, values=dic_cols)
\ No newline at end of file
diff --git a/website/templates/signup.html b/website/templates/signup.html
new file mode 100644
index 0000000..e27f5ab
--- /dev/null
+++ b/website/templates/signup.html
@@ -0,0 +1,69 @@
+{% extends "auth.html" %}
+
+{% block login %}
+<form method="POST" enctype=multipart/form-data class="row g-2">
+  <h3 align="center">Sign Up</h3>
+  <div class="col-6">
+    <label for="email">Email Address</label>
+    <input type="text" id="email" name="email" class="form-control" placeholder="Enter Email" />
+  </div>
+  <div class="col-6">
+    <label for="username">Username</label>
+    <input type="text" id="username" name="username" class="form-control" placeholder="Enter Username" />
+  </div>
+  <div class="col-6">
+    <label for="password1">Password</label>
+    <input type="password" id="password1" name="password1" class="form-control" placeholder="Enter Password" />
+  </div>
+  <div class="col-6">
+    <label for="password2">Password Again</label>
+    <input type="password" id="password2" name="password2" class="form-control" placeholder="Enter Password Again" />
+  </div>
+  <div class="col-12">
+    <label for="avatar">Avatar Image Upload</label>
+    <input type="file" name="avatar" id="avatar" class="form-control">
+  </div>
+  <div class="dropdown-divider">
+  </div>
+  <div class="col-6">
+    <label for="firstname" class="form-label">First Name</label>
+    <input type="text" class="form-control" name="firstname" id="firstname">
+  </div>
+  <div class="col-6">
+    <label for="lastname" class="form-label">Last Name</label>
+    <input type="text" class="form-control" name="lastname" id="lastname">
+  </div>
+  <div class="col-4">
+    <label for="address" class="form-label">Address</label>
+    <input type="text" class="form-control" name="address" id="address">
+  </div>
+  <div class="col-md-3">
+    <label for="city" class="form-label">City</label>
+    <input type="text" class="form-control" id="city" name="city">
+  </div>
+  <div class="col-md-2">
+    <label for="state" class="form-label">State</label>
+    <select type="text" name="state" id="state" class="form-select">
+      {% for state in states %}
+      <option value="{{state.abr}}">{{state.state}}</option>
+      {% endfor %}
+    </select>
+  </div>
+  <div class="col-md-3">
+    <label for="zip" class="form-label">Zip</label>
+    <input type="text" class="form-control" id="zip" name="zip">
+  </div>
+  <div class="col-4">
+    <label for="phone" class="form-label">Phone</label>
+    <input type="tel" class="form-control" id="phone" name="phone">
+  </div>
+  <div class="col-4">
+    <label class="form-label" for="dob">Birthdate</label>
+    <input type="date" name="dob" id="dob" class="form-control">
+  </div>
+  <br />
+  <div align="center">
+    <button class="btn btn-primary" type="submit">Sign Up</button>
+  </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/template.html b/website/templates/template.html
new file mode 100644
index 0000000..851d7cc
--- /dev/null
+++ b/website/templates/template.html
@@ -0,0 +1,16 @@
+{% extends "base.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block proheader %}
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block content %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/vehicles/__pycache__/vehicle.cpython-38.pyc b/website/templates/vehicles/__pycache__/vehicle.cpython-38.pyc
new file mode 100644
index 0000000..778c165
Binary files /dev/null and b/website/templates/vehicles/__pycache__/vehicle.cpython-38.pyc differ
diff --git a/website/templates/vehicles/accidentform.html b/website/templates/vehicles/accidentform.html
new file mode 100644
index 0000000..fb51312
--- /dev/null
+++ b/website/templates/vehicles/accidentform.html
@@ -0,0 +1,300 @@
+<html>
+
+<head>
+    <style>
+        /* Font Definitions */
+        @font-face {
+            font-family: "Cambria Math";
+            panose-1: 2 4 5 3 5 4 6 3 2 4;
+            mso-font-charset: 0;
+            mso-generic-font-family: roman;
+            mso-font-pitch: variable;
+            mso-font-signature: 3 0 0 0 1 0;
+        }
+
+        @font-face {
+            font-family: Calibri;
+            panose-1: 2 15 5 2 2 2 4 3 2 4;
+            mso-font-charset: 0;
+            mso-generic-font-family: swiss;
+            mso-font-pitch: variable;
+            mso-font-signature: -536859905 -1073732485 9 0 511 0;
+        }
+
+        @font-face {
+            font-family: Verdana;
+            panose-1: 2 11 6 4 3 5 4 4 2 4;
+            mso-font-charset: 0;
+            mso-generic-font-family: swiss;
+            mso-font-pitch: variable;
+            mso-font-signature: -1593833729 1073750107 16 0 415 0;
+        }
+
+        /* Style Definitions */
+        p.MsoNormal,
+        li.MsoNormal,
+        div.MsoNormal {
+            mso-style-unhide: no;
+            mso-style-qformat: yes;
+            mso-style-parent: "";
+            margin: 0in;
+            mso-pagination: widow-orphan;
+            font-size: 11.0pt;
+            font-family: "Calibri", sans-serif;
+            mso-fareast-font-family: Calibri;
+            mso-bidi-font-family: "Times New Roman";
+        }
+
+        p.MsoHeader,
+        li.MsoHeader,
+        div.MsoHeader {
+            mso-style-noshow: yes;
+            mso-style-priority: 99;
+            mso-style-link: "Header Char";
+            margin: 0in;
+            mso-pagination: widow-orphan;
+            tab-stops: center 3.25in right 6.5in;
+            font-size: 11.0pt;
+            font-family: "Calibri", sans-serif;
+            mso-fareast-font-family: Calibri;
+            mso-bidi-font-family: "Times New Roman";
+        }
+
+        p.MsoFooter,
+        li.MsoFooter,
+        div.MsoFooter {
+            mso-style-noshow: yes;
+            mso-style-priority: 99;
+            mso-style-link: "Footer Char";
+            margin: 0in;
+            mso-pagination: widow-orphan;
+            tab-stops: center 3.25in right 6.5in;
+            font-size: 11.0pt;
+            font-family: "Calibri", sans-serif;
+            mso-fareast-font-family: Calibri;
+            mso-bidi-font-family: "Times New Roman";
+        }
+
+        span.HeaderChar {
+            mso-style-name: "Header Char";
+            mso-style-noshow: yes;
+            mso-style-priority: 99;
+            mso-style-unhide: no;
+            mso-style-locked: yes;
+            mso-style-parent: "";
+            mso-style-link: Header;
+            mso-ansi-font-size: 11.0pt;
+            mso-bidi-font-size: 11.0pt;
+        }
+
+        span.FooterChar {
+            mso-style-name: "Footer Char";
+            mso-style-noshow: yes;
+            mso-style-priority: 99;
+            mso-style-unhide: no;
+            mso-style-locked: yes;
+            mso-style-parent: "";
+            mso-style-link: Footer;
+            mso-ansi-font-size: 11.0pt;
+            mso-bidi-font-size: 11.0pt;
+        }
+
+        .MsoChpDefault {
+            mso-style-type: export-only;
+            mso-default-props: yes;
+            font-size: 10.0pt;
+            mso-ansi-font-size: 10.0pt;
+            mso-bidi-font-size: 10.0pt;
+            font-family: "Calibri", sans-serif;
+            mso-ascii-font-family: Calibri;
+            mso-fareast-font-family: Calibri;
+            mso-hansi-font-family: Calibri;
+        }
+
+        /* Page Definitions */
+        @page {
+            mso-footnote-separator: url("My%20Info%20to%20give%20to%20them.fld/header.html") fs;
+            mso-footnote-continuation-separator: url("My%20Info%20to%20give%20to%20them.fld/header.html") fcs;
+            mso-endnote-separator: url("My%20Info%20to%20give%20to%20them.fld/header.html") es;
+            mso-endnote-continuation-separator: url("My%20Info%20to%20give%20to%20them.fld/header.html") ecs;
+        }
+
+        @page WordSection1 {
+            size: 8.5in 11.0in;
+            margin: .5in .5in .25in .5in;
+            mso-header-margin: .5in;
+            mso-footer-margin: .5in;
+            mso-paper-source: 0;
+        }
+
+        div.WordSection1 {
+            page: WordSection1;
+        }
+
+        -->
+    </style>
+</head>
+
+<body lang=EN-US style='tab-interval:.5in;word-wrap:break-word'>
+
+    <div class=WordSection1>
+
+        <p class=MsoNormal style='tab-stops:right lined 3.0in left blank 3.5in right lined 7.0in'><span style='font-family:"Verdana",sans-serif'><o:p>&nbsp;</o:p></span></p>
+
+        <p class=MsoNormal style='tab-stops:right lined 3.25in left blank 3.75in right lined 7.5in'>
+            Date and Time of Accident:<span style='mso-tab-count:1 lined'>_______________________  </span>
+            Accident Location:<span style='mso-tab-count:1 lined'>_______________________</span></p>
+
+        <p class=MsoNormal><span style='font-size:5.0pt'><o:p>&nbsp;</o:p></span></p>
+
+        <p class=MsoNormal><b>Owner Information:</b></p>
+        
+        <!-- Owner Information -->
+        <table class=MsoNormalTable border=1 cellspacing=0 cellpadding=0 style='margin-left:18.9pt;border-collapse:collapse;border:none;mso-border-alt: solid black .5pt;mso-yfti-tbllook:1184;mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-border-insideh:.5pt solid black;mso-border-insidev:.5pt solid black'>
+            <tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;mso-border-alt: solid black .5pt;padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Owner Name:</span></p>
+                </td>
+                <td width=600 valign=top style='width:6.25in;border:solid black 1.0pt; border-left:none;mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{owner.firstname}} {{owner.lastname}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:1'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none; mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Owner Address:</span></p>
+                </td>
+                <td width=600 valign=top style='width:6.25in;border-top:none;border-left: none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt; mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt; mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{owner.address}} {{owner.city}}, {{owner.state}}  {{owner.zip}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:2;mso-yfti-lastrow:yes'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none; mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Owner Phone:</span></p>
+                </td>
+                <td width=600 valign=top style='width:6.25in;border-top:none;border-left: none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt; mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt; mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{owner.phone}}</span></p>
+                </td>
+            </tr>
+        </table>
+
+        <p class=MsoNormal><span style='font-size:9.0pt;mso-bidi-font-size:11.0pt'><o:p>&nbsp;</o:p></span></p>
+
+        <p class=MsoNormal><b style='mso-bidi-font-weight:normal'>Insurance Information</b></p>
+
+        <!-- Insurance Information -->
+        <table class=MsoNormalTable border=1 cellspacing=0 cellpadding=0 style='margin-left:18.9pt;border-collapse:collapse;border:none;mso-border-alt: solid black .5pt;mso-yfti-tbllook:1184;mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-border-insideh:.5pt solid black;mso-border-insidev:.5pt solid black'>
+            <tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;mso-border-alt: solid black .5pt;padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Ins. Company:</span></p>
+                </td>
+                <td width=600 valign=top style='width:6.25in;border:solid black 1.0pt; border-left:none;mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{ins.name}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:1'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none; mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Ins. Phone:</span></p>
+                </td>
+                <td width=600 valign=top style='width:6.25in;border-top:none;border-left: none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt; mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt; mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{ins.phone}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:2;mso-yfti-lastrow:yes'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none; mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Ins. Policy #:</span></p>
+                </td>
+                <td width=600 valign=top style='width:6.25in;border-top:none;border-left: none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt; mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt; mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{ins.policynum}}</span></p>
+                </td>
+            </tr>
+        </table>
+
+        <p class=MsoNormal><span style='font-size:9.0pt;mso-bidi-font-size:11.0pt'><o:p>&nbsp;</o:p></span></p>
+
+        <p class=MsoNormal><b style='mso-bidi-font-weight:normal'>Vehicle Information</b></p>
+
+        <!-- Vehicle Information -->
+        <table class=MsoNormalTable border=1 cellspacing=0 cellpadding=0 style='margin-left:18.9pt;border-collapse:collapse;border:none;mso-border-alt: solid black .5pt;mso-yfti-tbllook:1184;mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-border-insideh:.5pt solid black;mso-border-insidev:.5pt solid black'>
+            <tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes;height:18.2pt'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;mso-border-alt: solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Vehicle:</span></p>
+                </td>
+                <td width=600 style='width:6.25in;border:solid black 1.0pt;border-left:none; mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{veh.year}} {{veh.make}} {{veh.model}} {{veh.trim}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:3;height:18.2pt'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none;mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>License Plate:</span></p>
+                </td>
+                <td width=600 style='width:6.25in;border-top:none;border-left:none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt;mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{veh.licenseplate}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:4;mso-yfti-lastrow:yes;height:18.2pt'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none;mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>VIN:</span></p>
+                </td>
+                <td width=600 style='width:6.25in;border-top:none;border-left:none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt;mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{veh.vinnumber}}</span></p>
+                </td>
+            </tr>
+        </table>
+
+        <p class=MsoNormal><span style='font-size:9.0pt;mso-bidi-font-size:11.0pt'><o:p>&nbsp;</o:p></span></p>
+
+        <p class=MsoNormal><b style='mso-bidi-font-weight:normal'>Driver Information</b></p>
+
+        <!-- Driver Info -->
+        <table class=MsoNormalTable border=1 cellspacing=0 cellpadding=0 style='margin-left:18.9pt;border-collapse:collapse;border:none;mso-border-alt: solid black .5pt;mso-yfti-tbllook:1184;mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-border-insideh:.5pt solid black;mso-border-insidev:.5pt solid black'>
+            <tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes;height:17.2pt'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;mso-border-alt: solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:17.2pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Drivers Name:</span></p>
+                </td>
+                <td width=600 style='width:6.25in;border:solid black 1.0pt;border-left:none; mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{driver.firstname}} {{driver.lastname}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:1;height:17.2pt'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none; mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt;height:17.2pt'>
+                    <p class=MsoNormal><span style='font-size:9.5pt'>Drivers Address:</span></p>
+                </td>
+                <td width=600 style='width:6.25in;border-top:none;border-left:none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt;mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{driver.address}} {{driver.city}}, {{driver.state}}  {{driver.zip}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:2;height:17.2pt'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none; mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt;height:17.2pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Drivers DOB:</span></p>
+                </td>
+                <td width=600 style='width:6.25in;border-top:none;border-left:none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt;mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{driver.dob.strftime("%m/%d/%Y")}}</span></p>
+                </td>
+            </tr>
+            <tr style='mso-yfti-irow:3;mso-yfti-lastrow:yes;height:17.2pt'>
+                <td width=102 style='width:76.5pt;border:solid black 1.0pt;border-top:none; mso-border-top-alt:solid black .5pt;mso-border-alt:solid black .5pt; padding:0in 5.4pt 0in 5.4pt;height:17.2pt'>
+                    <p class=MsoNormal><span style='font-size:10.0pt'>Drivers License:</span></p>
+                </td>
+                <td width=600 style='width:6.25in;border-top:none;border-left:none;border-bottom:solid black 1.0pt;border-right:solid black 1.0pt;mso-border-top-alt:solid black .5pt;mso-border-left-alt:solid black .5pt;mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:18.2pt'>
+                    <p class=MsoNormal><span style='font-size:12.0pt;font-family:"Verdana",sans-serif'>{{driverlic}}</span></p>
+                </td>
+            </tr>
+        </table>
+
+        <p class=MsoNormal><span style='font-size:9.0pt;mso-bidi-font-size:11.0pt'>
+                <o:p>&nbsp;</o:p>
+            </span></p>
+
+        <p class=MsoNormal><b style='mso-bidi-font-weight:normal'>Notes:</b></p>
+
+        <!-- Notes -->
+        <table class=MsoNormalTable border=1 cellspacing=0 cellpadding=0 style='margin-left:18.9pt;border-collapse:collapse;border:none;mso-border-alt: solid black .5pt;mso-yfti-tbllook:1184;mso-padding-alt:0in 5.4pt 0in 5.4pt; mso-border-insideh:.5pt solid black;mso-border-insidev:.5pt solid black'>
+            <tr style='mso-yfti-irow:0;mso-yfti-firstrow:yes;mso-yfti-lastrow:yes; height:250pt'>
+                <td width=702 valign=top style='width:526.5pt;border:solid black 1.0pt; mso-border-alt:solid black .5pt;padding:0in 5.4pt 0in 5.4pt;height:250pt'>
+                    <p class=MsoNormal><o:p>&nbsp;</o:p></p>
+                </td>
+            </tr>
+        </table>
+    </div>
+</body>
+</html>
\ No newline at end of file
diff --git a/website/templates/vehicles/preform.html b/website/templates/vehicles/preform.html
new file mode 100644
index 0000000..94e4e13
--- /dev/null
+++ b/website/templates/vehicles/preform.html
@@ -0,0 +1,79 @@
+{% extends "/vehicles/veh_div.html" %}
+
+{% block title %}
+Pre Form Fillout
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block proheader %}
+Form Fill Out
+{% endblock %}
+
+{% block submenu %}
+{{ super() }}
+{% endblock %}
+
+{% block content %}
+<form action="/vehicle/form" method="post">
+    <table>
+        <!-- Owner -->
+        <tr>
+            <td>
+                <label class="form-label" for="owner">Select Vehicle Owner</label>
+                <select class="form-select" name="owner" id="owner">
+                    {% for owner in owners %}
+                    <option value="{{owner.id}}">{{owner.firstname}} {{owner.lastname}}</option>
+                    {% endfor %}
+                </select>
+            </td>
+        </tr>
+        <!-- Insurance -->
+        <tr>
+            <td>
+                <label class="form-label" for="insurance">Select Insurance Policy</label>
+                <select class="form-select" name="insurance" id="insurance">
+                    {% for ins in insurances %}
+                    <option value="{{ins.id}}">{{ins.name}} - {{ins.policynum}}</option>
+                    {% endfor %}
+                </select>
+            </td>
+        </tr>
+        <!-- Vehicle -->
+        <tr>
+            <td>
+                <label class="form-label" for="vehicle">Select Vehicle</label>
+                <select class="form-select" name="vehicle" id="vehicle">
+                    {% for veh in vehicles %}
+                    <option value="{{veh.id}}">{{veh.year}} {{veh.make}} {{veh.model}} {{veh.trim}}</option>
+                    {% endfor %}
+                </select>
+            </td>
+        </tr>
+        <!-- Driver -->
+        <tr>
+            <td>
+                <label class="form-label" for="driver">Select Driver</label>
+                <select class="form-select" name="driver" id="driver">
+                    {% for driver in drivers %}
+                    <option value="{{driver.id}}">{{driver.firstname}} {{driver.lastname}}</option>
+                    {% endfor %}
+                </select>
+                <label class="form-label" for="driverlic">Enter Drivers License</label>
+                <select class="form-select" name="state" id="state">
+                    {% for state in states %}
+                    <option value="{{state.abr}}">{{state.abr}} - {{state.state}}</option>
+                    {% endfor %}
+                </select>
+                <input class="form-control" type="text" name="driverslic" id="driverslic">
+            </td>
+        </tr>
+        <tr>
+            <td>
+                <button type="submit">Go To Form</button>
+            </td>
+        </tr>
+    </table>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/vehicles/veh_div.html b/website/templates/vehicles/veh_div.html
new file mode 100644
index 0000000..90ff38a
--- /dev/null
+++ b/website/templates/vehicles/veh_div.html
@@ -0,0 +1,17 @@
+{% extends "base.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block proheader %}
+{% endblock %}
+
+{% block submenu %}
+<a href="/vehicle/form" class="btn btn-info">Accident Forms</a>
+{% endblock %}
+
+{% block content %}
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/vehicles/vehicle.py b/website/templates/vehicles/vehicle.py
new file mode 100644
index 0000000..122b273
--- /dev/null
+++ b/website/templates/vehicles/vehicle.py
@@ -0,0 +1,147 @@
+from flask import Blueprint, render_template, request, redirect, url_for
+from flask_login import login_required
+from website.models import *
+import datetime
+from website import db
+from sqlalchemy.sql import desc
+
+vehicle = Blueprint("vehicle", __name__)
+
+@vehicle.route("/vehicle", methods=['GET','POST'])
+@login_required
+def vehHome():
+    if request.method == 'POST':
+        if request.form.get('pdate') == '':
+            pdate = datetime.datetime.now()
+        else:
+            pdate = datetime.datetime.strptime(request.form.get('pdate'), "%Y-%m-%d")
+        
+        if request.form.get('sdate') == '':
+            sdate = datetime.datetime.now()
+        else:
+            sdate = datetime.datetime.strptime(request.form.get('sdate'), "%Y-%m-%d")
+            
+        if request.form.get('tagsexp') == '':
+            tagsexp = datetime.datetime(3000, 1, 1)
+        else:
+            tagsexp = datetime.datetime.strptime(request.form.get('tagsexp'), "%Y-%m")
+        
+        newveh = Vehicles(
+            name = request.form.get('name'),
+            year = request.form.get('year'),
+            make = request.form.get('make'),
+            model = request.form.get('model'),
+            trim = request.form.get('trim'),
+            color = request.form.get('color'),
+            purchase_date = pdate,
+            sell_date = sdate,
+            reasonforsale = request.form.get('reason'),
+            saleamount = request.form.get('saleamt'),
+            licenseplate = request.form.get('licplate'),
+            purchaseprice = request.form.get('puramt'),
+            purchasefrom = request.form.get('purplace'),
+            vinnumber = request.form.get('vin'),
+            tagsexpire = tagsexp,
+            pictureURL = request.form.get('picurl'),
+            curown = int(request.form.get('curown')),
+        )
+        db.session.add(newveh)
+        db.session.commit()
+    # TODO: LEFT OFF - figuring why getting error % unexpected
+    from dateutil import relativedelta
+    currvehs = db.session.query(Vehicles).filter(Vehicles.curown == True).all()
+    ownedList = {}
+    for currveh in currvehs:
+        diff = relativedelta.relativedelta(currveh.sell_date, currveh.purchase_date)
+        owned = f'{diff.years} years {diff.months} months {diff.days} days'
+        ownedList[currveh.id] = owned
+    
+    vehs = db.session.query(Vehicles).order_by(desc(Vehicles.purchase_date)).all()
+    return render_template('vehicles/vehicles.html', user=User, vehs=vehs, owned=ownedList)
+
+@vehicle.route("/<id>", methods=['GET','POST'])
+@login_required
+def vehsingle(id):
+    if request.method =="POST":
+        if request.form.get('submit') == 'Add Service':
+            newserv = Service(
+                service = request.form.get('service'),
+                place = request.form.get('place'),
+                cost = request.form.get('cost'),
+                mileage = request.form.get('mileage'),
+                date = datetime.datetime.strptime(request.form.get('date'),"%Y-%m-%d"),
+                vehiclefk = request.form.get('vehid')
+            )
+            db.session.add(newserv)
+            db.session.commit()
+            return redirect(url_for('vehicle.vehsingle', id=id))
+        else:
+            if request.form.get('pdate') == '':
+                pdate = datetime.datetime.now()
+            else:
+                pdate = datetime.datetime.strptime(request.form.get('pdate'), "%Y-%m-%d")
+            
+            if request.form.get('sdate') == '':
+                sdate = datetime.datetime.now()
+            else:
+                sdate = datetime.datetime.strptime(request.form.get('sdate'), "%Y-%m-%d")
+                
+            if request.form.get('tagsexp') == '':
+                tagsexp = datetime.datetime(3000, 1, 1)
+            else:
+                tagsexp = datetime.datetime.strptime(request.form.get('tagsexp'), "%Y-%m")
+                
+            ud = db.session.query(Vehicles).filter(Vehicles.id == id).first()
+            ud.name = request.form.get('name')
+            ud.year = request.form.get('year')
+            ud.make = request.form.get('make')
+            ud.model = request.form.get('model')
+            ud.trim = request.form.get('trim')
+            ud.color = request.form.get('color')
+            ud.purchase_date = pdate
+            ud.sell_date = sdate
+            ud.reasonforsale = request.form.get('reason')
+            ud.saleamount = request.form.get('saleamt')
+            ud.licenseplate = request.form.get('licplate')
+            ud.purchaseprice = request.form.get('puramt')
+            ud.purchasefrom = request.form.get('purplace')
+            ud.vinnumber = request.form.get('vin')
+            ud.tagsexpire = tagsexp
+            ud.pictureURL = request.form.get('picurl')
+            ud.curown = int(request.form.get('curown'))
+            db.session.commit()
+            return redirect(url_for('vehicle.vehHome'))
+    
+    from dateutil import relativedelta
+    veh = db.session.query(Vehicles).filter(Vehicles.id == id).first()
+    
+    diff = relativedelta.relativedelta(veh.sell_date, veh.purchase_date)
+
+    owned = f'{diff.years} years {diff.months} months {diff.days} days'
+    services = db.session.query(Service).filter(Service.vehiclefk == id).order_by(desc(Service.date),Service.cost).all()
+    return render_template('vehicles/vehicle_single.html', user=User, veh=veh, owned=owned, services=services)
+
+@vehicle.route("/delete/<id>", methods=['GET','POST'])
+@login_required
+def vehdelete(id):
+    db.session.query(Vehicles).filter(Vehicles.id == id).delete()
+    db.session.commit()
+    return redirect(url_for('vehicle.vehHome'))
+
+@vehicle.route("/form", methods=['GET','POST'])
+@login_required
+def accidentform():
+    if request.method == 'POST':
+        driverlic = request.form.get('state') + " " + request.form.get('driverslic')
+        driver = db.session.query(User).filter(User.id == request.form.get('driver')).first()
+        veh = db.session.query(Vehicles).filter(Vehicles.id == request.form.get('vehicle')).first()
+        ins = db.session.query(Insinfo).filter(Insinfo.id == request.form.get('insurance')).first()
+        owner = db.session.query(User).filter(User.id == request.form.get('owner')).first()
+        return render_template("/vehicles/accidentform.html", owner=owner, ins=ins, veh=veh, driver=driver, driverlic=driverlic)
+    
+    drivers = db.session.query(User).all()
+    vehicles = db.session.query(Vehicles).filter(Vehicles.curown == True).all()
+    insurances = db.session.query(Insinfo).all()
+    owners = db.session.query(User).all()
+    states = db.session.query(States).all()
+    return render_template('/vehicles/preform.html', user=User, drivers=drivers, vehicles=vehicles, insurances=insurances, owners=owners, states=states)
\ No newline at end of file
diff --git a/website/templates/vehicles/vehicle_single.html b/website/templates/vehicles/vehicle_single.html
new file mode 100644
index 0000000..b1dd32d
--- /dev/null
+++ b/website/templates/vehicles/vehicle_single.html
@@ -0,0 +1,174 @@
+{% extends "/vehicles/veh_div.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block submenu %}
+{{ super() }}
+<!-- Button trigger modal -->
+<button type="button" class="btn" data-toggle="modal" data-target="#exampleModal">
+    Add Service for this vehicle
+</button>
+{% endblock %}
+
+{% block proheader %}
+{{veh.year}} {{veh.make}} {{veh.model}} {{veh.trim}}
+{% endblock %}
+
+{% block content %}
+<div class="text-center">
+    <h4 class="display-4">{{veh.year}} {{veh.make}} {{veh.model}} {{veh.trim}}</h4>
+    Purchased: {{veh.purchase_date.strftime("%B %d, %Y")}} <br>
+    Owned for: {{owned}}
+</div>
+<div class="text-center">
+    <img src="{{veh.pictureURL}}" alt="Picture of Vehicle" width="30%" height="15%"
+        class="rounded img-fluid border-dark">
+</div>
+<div class="row">
+    <div class="col-6">
+        <form action='{{url_for("vehicle.vehsingle", id=veh.id)}}' method="POST" class="row g-0">
+            <div class="col-6">
+                <label class="form-label" for="name">Currently Owned?</label>
+                <select class="form-select" name="curown" id="curown" value="{{veh.curown}}">
+                    <option {% if veh.curown == 1 %}selected{% endif %} value=1>Yes</option>
+                    <option {% if veh.curown == 0 %}selected{% endif %} value=0>No</option>
+                </select>
+            </div>
+            <div class="col-6">
+                <label class="form-label" for="picurl">Picture URL</label>
+                <input class="form-control" type="text" name="picurl" id="picurl" value="{{veh.pictureURL}}">
+            </div>
+            <div class="col-2">
+                <label class="form-label" for="year">Year</label>
+                <input class="form-control" type="number" name="year" id="year" value="{{veh.year}}">
+            </div>
+            <div class="col-3">
+                <label class="form-label" for="make">Make</label>
+                <input class="form-control" type="text" name="make" id="make" value="{{veh.make}}">
+            </div>
+            <div class="col-3">
+                <label class="form-label" for="model">Model</label>
+                <input class="form-control" type="text" name="model" id="model" value="{{veh.model}}">
+            </div>
+            <div class="col-2">
+                <label class="form-label" for="trim">Trim</label>
+                <input class="form-control" type="text" name="trim" id="trim" value="{{veh.trim}}">
+            </div>
+            <div class="col-2">
+                <label class="form-label" for="color">Color</label>
+                <input class="form-control" type="text" name="color" id="color" value="{{veh.color}}">
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="licplate">License Plate</label>
+                <input class="form-control" type="text" name="licplate" id="licplate" value="{{veh.licenseplate}}">
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="tagsexp">Tags Expire</label>
+                <input class="form-control" type="month" name="tagsexp" id="tagsexp"
+                    value='{{veh.tagsexpire.strftime("%Y-%m")}}'>
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="vin">VIN Number</label>
+                <input class="form-control" type="text" name="vin" id="vin" value="{{veh.vinnumber}}">
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="pdate">Purchase Date</label>
+                <input class="form-control" type="date" name="pdate" id="pdate"
+                    value='{{veh.purchase_date.strftime("%Y-%m-%d")}}'>
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="purplace">Place of Purchase</label>
+                <input class="form-control" type="text" name="purplace" id="purplace" value="{{veh.purchasefrom}}">
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="puramt">Purchase Amount</label>
+                <input class="form-control" type="number" name="puramt" id="puramt" value="{{veh.purchaseprice}}">
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="sdate">Sale Date</label>
+                <input class="form-control" type="date" name="sdate" id="sdate"
+                    value='{{veh.sell_date.strftime("%Y-%m-%d")}}'>
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="reason">Sale Reason</label>
+                <input class="form-control" type="text" name="reason" id="reason" value="{{veh.reasonforsale}}">
+            </div>
+            <div class="col-4">
+                <label class="form-label" for="saleamt">Sale Amount</label>
+                <input class="form-control" type="number" name="saleamt" id="saleamt" value="{{veh.saleamount}}">
+            </div>
+            <button type="submit" class="btn btn-primary">Edit Vehicle</button>
+        </form>
+    </div>
+
+    <div class="col-6">
+        <table class="table table-hover table-bordered">
+            <thead>
+                <th>Service <br>Facility</th>
+                <th>Date</th>
+                <th>Cost</th>
+                <th>Mileage</th>
+            </thead>
+            <tbody>
+                {% for service in services %}
+                <tr>
+                    <td>{{service.service}} <br> <span class="text text-muted small">{{service.place}}</span></td>
+                    <td>{{service.date.strftime("%m/%d/%y")}}</td>
+                    <td>{{"${:,.2f}".format(service.cost)}}</td>
+                    <td>{{"{:,.0f}".format(service.mileage|float)}}</td>
+                </tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </div>
+</div>
+
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
+    aria-hidden="true">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">Add A Service</h5>
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+            </div>
+            <div class="modal-body">
+                <form action="/vehicle/{{veh.id}}" method="post" class="row g-3">
+                    <div class="col-12">
+                        <label class="form-label" for="service">Service</label>
+                        <input class="form-control" type="text" name="service" id="service">
+                    </div>
+                    <div class="col-12">
+                        <label class="form-label" for="place">Facility</label>
+                        <input class="form-control" type="text" name="place" id="place">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="cost">Cost</label>
+                        <input class="form-control" type="number" name="cost" id="cost" step="0.01">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="mileage">Mileage</label>
+                        <input class="form-control" type="number" name="mileage" id="mileage">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="date">Date of Service</label>
+                        <input class="form-control" type="date" name="date" id="date">
+                    </div>
+                    </table>
+            </div>
+            <div class="modal-footer">
+                <input type="hidden" name="vehid" value="{{veh.id}}">
+                <button class="btn btn-primary" type="submit" name="submit" id="submit" value="Add Service">Add
+                    Service</button>
+            </div>
+            </form>
+        </div>
+    </div>
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/vehicles/vehicles.html b/website/templates/vehicles/vehicles.html
new file mode 100644
index 0000000..720bf10
--- /dev/null
+++ b/website/templates/vehicles/vehicles.html
@@ -0,0 +1,186 @@
+{% extends "/vehicles/veh_div.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block submenu %}
+{{ super() }}
+<!-- Button trigger modal -->
+<button type="button" class="btn btn-primary" data-bs-toggle="modal" data-bs-target="#exampleModal">
+    Add New Vehicle
+</button>
+{% endblock %}
+
+{% block proheader %}
+Vehicles
+{% endblock %}
+
+
+{% block content %}
+<!-- Modal -->
+<div class="modal fade" id="exampleModal" tabindex="-1" aria-labelledby="exampleModalLabel" aria-hidden="true">
+    <div class="modal-dialog modal-lg">
+        <div class="modal-content">
+            <div class="modal-header">
+                <h5 class="modal-title" id="exampleModalLabel">Add New Vehicle</h5>
+                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+            </div>
+            <div class="modal-body">
+                <form action="{{url_for('vehicle.vehHome')}}" method="POST" class="row g-3">
+                    <div class="col-4">
+                        <label class="form-label" for="name">Name</label>
+                        <input class="form-control" type="text" name="name" id="name">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="picurl">Picture URL</label>
+                        <input class="form-control" type="text" name="picurl" id="picurl">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="name">Currently Owned?</label>
+                        <select class="form-select" name="curown" id="curown"">
+                            <option selected value=1>Yes</option>
+                            <option value=0>No</option>
+                        </select>
+                    </div>
+                    <div class="col-2">
+                        <label class="form-label" for="year">Year</label>
+                        <input class="form-control" type="number" name="year" id="year">
+                    </div>
+                    <div class="col-3">
+                        <label class="form-label" for="make">Make</label>
+                        <input class="form-control" type="text" name="make" id="make">
+                    </div>
+                    <div class="col-3">
+                        <label class="form-label" for="model">Model</label>
+                        <input class="form-control" type="text" name="model" id="model">
+                    </div>
+                    <div class="col-2">
+                        <label class="form-label" for="trim">Trim</label>
+                        <input class="form-control" type="text" name="trim" id="trim">
+                    </div>
+                    <div class="col-2">
+                        <label class="form-label" for="color">Color</label>
+                        <input class="form-control" type="text" name="color" id="color">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="licplate">License Plate</label>
+                        <input class="form-control" type="text" name="licplate" id="licplate">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="tagsexp">Tags Expire</label>
+                        <input class="form-control" type="month" name="tagsexp" id="tagsexp">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="vin">VIN Number</label>
+                        <input class="form-control" type="text" name="vin" id="vin">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="pdate">Purchase Date</label>
+                        <input class="form-control" type="date" name="pdate" id="pdate">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="purplace">Place of Purchase</label>
+                        <input class="form-control" type="text" name="purplace" id="purplace">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="puramt">Purchase Amount</label>
+                        <input class="form-control" type="number" name="puramt" id="puramt" default=0>
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="sdate">Sale Date</label>
+                        <input class="form-control" type="date" name="sdate" id="sdate">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="reason">Sale Reason</label>
+                        <input class="form-control" type="text" name="reason" id="reason">
+                    </div>
+                    <div class="col-4">
+                        <label class="form-label" for="saleamt">Sale Amount</label>
+                        <input class="form-control" type="number" name="saleamt" id="saleamt" default=0>
+                    </div>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
+                <button type="submit" class="btn btn-primary">Add Vehicle</button>
+            </div>
+            </form>
+        </div>
+    </div>
+</div>
+
+<!-- table of Currently Owned cars -->
+<h6 class="display-6">Currently Owned Vehicles</h6>
+<table class="table table-hover table-striped">
+    <thead>
+        <th>Pic</th>
+        <th>Vehicle</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for veh in vehs %}
+        {% if veh.curown == True %}
+        <tr>
+            <td style="width: 220px;"><a href="/vehicle/{{veh.id}}">
+                    <picture><img src="{{veh.pictureURL}}" alt="Picture of Vehicle" width="210px" height="140px">
+                    </picture>
+                </a></td>
+            <td>
+                {{veh.color}}
+                {{veh.year}}
+                {{veh.make}}
+                {{veh.model}}
+                {{veh.trim}} <br>
+                Owned for {% if veh.id in owned %}{{owned[veh.id]}}{% endif %} <br>
+                Vin: {{veh.vinnumber}} <br>
+                License Plate: {{veh.licenseplate}} <br>
+                Tags Expire: {{veh.tagsexpire.strftime('%B %Y')}}
+
+            </td>
+            <td><a href="{{url_for('vehicle.vehsingle', id=veh.id)}}"><button class="btn btn-lg btn-primary"><i
+                            class="fas fa-edit"></i></button></a></td>
+            <td><a href="{{url_for('vehicle.vehdelete', id=veh.id)}}"><button class="btn btn-lg btn-danger"><i
+                            class="fas fa-trash-alt"></i></button></a></td>
+        </tr>
+        {% endif %}
+        {% endfor %}
+    </tbody>
+</table>
+
+<!-- table of PREVIOUSLY Owned cars -->
+<h6 class="display-6">Previously Owned Vehicles</h6>
+<table class="table table-hover table-striped">
+    <thead>
+        <th>Pic</th>
+        <th>Vehicle</th>
+        <th></th>
+        <th></th>
+    </thead>
+    <tbody>
+        {% for veh in vehs %}
+        {% if veh.curown == False %}
+        <tr>
+            <td style="width: 220px;"><a href="/vehicle/{{veh.id}}">
+                    <picture><img src="{{veh.pictureURL}}" alt="Picture of Vehicle" width="210px" height="140px">
+                    </picture>
+                </a></td>
+            <td>
+                {{veh.color}}
+                {{veh.year}}
+                {{veh.make}}
+                {{veh.model}}
+                {{veh.trim}}
+            </td>
+            <td><a href="{{url_for('vehicle.vehsingle', id=veh.id)}}"><button class="btn btn-lg btn-primary"><i
+                            class="fas fa-edit"></i></button></a></td>
+            <td><a href="{{url_for('vehicle.vehdelete', id=veh.id)}}"><button class="btn btn-lg btn-danger"><i
+                            class="fas fa-trash-alt"></i></button></a></td>
+        </tr>
+        {% endif %}
+        {% endfor %}
+    </tbody>
+</table>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/views/__pycache__/views.cpython-38.pyc b/website/templates/views/__pycache__/views.cpython-38.pyc
new file mode 100644
index 0000000..773d504
Binary files /dev/null and b/website/templates/views/__pycache__/views.cpython-38.pyc differ
diff --git a/website/templates/views/home.html b/website/templates/views/home.html
new file mode 100644
index 0000000..753fad6
--- /dev/null
+++ b/website/templates/views/home.html
@@ -0,0 +1,245 @@
+{% extends "base.html" %}
+
+{% block title %}
+Home
+{% endblock %}
+
+{% block proheader %}
+{{current_user.firstname}}'s Dashboard
+{% endblock %}
+
+{% block content %}
+<div id="accordion">
+    {% if cntTasks != 0  %}
+    <div class="card">
+        <div class="card-header" id="tasksHeading">
+            <h5 class="mb-0">
+                <button class="btn" data-toggle="collapse" data-target="#tasks" aria-expanded="true"
+                    aria-controls="tasks"><h4>
+                    Tasks <span class="badge rounded-pill alert-primary">{{cntTasks}}</span>
+                </h4></button>
+            </h5>
+        </div>
+
+        <div id="tasks" class="collapse collapsed" aria-labelledby="tasksHeading" data-parent="#accordion">
+            <div class="card-body">
+                <table class="table table-striped">
+                    <caption>Only listed are tasks with dates today or prior</caption>
+                    <thead>
+                        <th>Task</th>
+                        <th>Due</th>
+                        <th>Project</th>
+                    </thead>
+                    <tbody>
+                        {% for task in tasks %}
+                        {% if task.duedate.strftime('%Y-%m-%d') == task.duedate.now().strftime('%Y-%m-%d') %}<tr
+                            class="text-primary">
+                            {% else %}
+                        <tr class="text-danger">{% endif %}
+                            <td>{{task.item}}</td>
+                            <td>{{task.duedate.strftime("%m/%d/%y")}}</td>
+                            <td>{{task.nameOfProject}}</td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+
+    {% if cntProjects != 0 %}
+    <div class="card">
+        <div class="card-header" id="projectsHeading">
+            <h5 class="mb-0">
+                <button class="btn collapsed" data-toggle="collapse" data-target="#projects" aria-expanded="false"
+                    aria-controls="projects"><h4>
+                    Projects <span class="badge rounded-pill alert-primary">{{cntProjects}}</span>
+                </h4></button>
+            </h5>
+        </div>
+        <div id="projects" class="collapse" aria-labelledby="projectsHeading" data-parent="#accordion">
+            <div class="card-body">
+                <table class="table table-striped">
+                    <thead>
+                        <th>Project</th>
+                        <th>Review Date</th>
+                    </thead>
+                    <tbody>
+                        {% for project in projects %}
+                        {% if project.next_review >= project.next_review.now() %}<tr class="text-primary">
+                            {% elif project.next_review < project.next_review.now() %}
+                        <tr class="text-danger">{% else %}
+                        <tr>{% endif %}
+                            <td><a class="text-decoration-none text-body"
+                                    href="productivity/projects/{{project.id}}">{{project.name}}</a></td>
+                            <td>{{project.next_review.strftime("%m/%d/%y")}}</td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+
+    {% if cntMeds != 0 %}
+    <div class="card" class="main">
+        <div class="card-header" id="medsHeader">
+            <h5 class="mb-0">
+                <button class="btn collapsed" data-toggle="collapse" data-target="#meds" aria-expanded="false"
+                    aria-controls="meds"><h4>
+                    Medications <span class="badge rounded-pill alert-primary">{{cntMeds}}</span>
+                </h4></button>
+            </h5>
+        </div>
+        <div id="meds" class="collapse" aria-labelledby="medsHeader" data-parent="#accordion">
+            <div class="card-body">
+                <a href="{{ url_for('health.medications_reorder') }}"><button
+                        class="btn btn-success">Reorder</button></a>
+                <table class="table table-striped">
+                    <caption class="table-caption">* Due within the next 5 days</caption>
+                    <thead>
+                        <th>Medication</th>
+                        <th>Dose</th>
+                        <th>Reason</th>
+                        <th>Date</th>
+                        <th> </th>
+                    </thead>
+                    <tbody>
+                        {% for med in meds %}
+                        {% if med.next_refill.strftime("%m/%d/%Y") >= med.next_refill.now().strftime("%m/%d/%Y") %}
+                        <tr class="text-success">
+                            <td><a class="text-success" href="/health/medupdate/{{med.id}}">{% else %}
+                        <tr class="text-danger">
+                            <td><a class="text-danger" href="/health/medupdate/{{med.id}}">{% endif %}
+                                    {{med.name}}</a></td>
+                            <td>{{med.dose}}</td>
+                            <td>{{med.reason_for_taking}}</td>
+                            <td>{{med.next_refill.strftime("%m/%d/%Y")}}</td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+
+    {% if cntMenu != 0 %}
+    <div class="card" class="main">
+        <div class="card-header" id="menuHeader">
+            <h5 class="mb-0">
+                <button class="btn collapsed" data-toggle="collapse" data-target="#menu" aria-expanded="false"
+                    aria-controls="menu"><h4>
+                    Menu <span class="badge rounded-pill alert-primary">{{cntMenu}}</span>
+                </h4></button>
+            </h5>
+        </div>
+        <div id="menu" class="collapse" aria-labelledby="menuHeader" data-parent="#accordion">
+            <div class="card-body">
+                <table class="table table-sm table-hover">
+                    <thead>
+                        <th>Date</th>
+                        <th>Item</th>
+                    </thead>
+                    <tbody>
+                        {% for date, plan in plans | groupby('date') %}
+                        <tr>
+                            <form action="/plan/single/{{date.strftime('%Y-%m-%d')}}" , method="POST">
+                                <td><button type="submit" class="btn" name="dateselector" id="dateselector"
+                                        value="{{date.strftime('%Y-%m-%d')}}">{{ date.strftime('%A %b %d, %Y') }}</button>
+                                </td>
+                            </form>
+                            <td>
+                                <ul class="list-group">
+                                    {% for plan in plans %}
+                                    {% if plan.date == date %}
+                                    <li class="list-group-item">{{ plan.item }}</li>
+                                    {% endif %}
+                                    {% endfor %}
+                                </ul>
+                            </td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+
+    {% if cntA1C != 0 %}
+    <div class="card">
+        <div class="card-header" id="a1cHeader">
+            <h5 class="mb-0">
+                <button class="btn collapsed" data-toggle="collapse" data-target="#a1c" aria-expanded="false"
+                    aria-controls="a1c"><h4>
+                    Latest A1C: <span class="badge rounded-pill alert-primary">{{cntA1C}}</span>
+                </h4></button>
+            </h5>
+        </div>
+        <div id="a1c" class="collapse" aria-labelledby="a1cHeader" data-parent="#accordion">
+            <div class="card-body">
+                <table class="table table-striped">
+                    <thead>
+                        <th>Date</th>
+                        <th>A1C</th>
+                        <th>E.A.G</th>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            <td>{{currentvalue.ld.strftime("%m/%d/%Y")}}</td>
+                            <td>{{currentvalue.testresult}}</td>
+                            <td>{{eag}}</td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+
+    {% if cntCpap != 0 %}
+    <div class="card">
+        <div class="card-header" id="cpapHeader">
+            <h5 class="mb-0">
+                <button class="btn collapsed" data-toggle="collapse" data-target="#cpap" aria-expanded="false"
+                    aria-controls="cpap"><h4>
+                    CPAP Supplies <span class="badge rounded-pill alert-primary">{{cntCpap}}</span>
+                </h4></button>
+            </h5>
+        </div>
+        <div id="cpap" class="collapse" aria-labelledby="cpapHeader" data-parent="#accordion">
+            <div class="card-body">
+                <table class="table table-sm table-hover">
+                    <thead>
+                        <th></th>
+                        <th>Name <br>
+                            Last Ordered <br>
+                            Next Order <br>
+                            Item Number
+                        </th>
+                    </thead>
+                    <tbody>
+                        {% for cpap in cpaps %}
+                        <tr>
+                            <td width="100px"><a href="/health/cpap/{{cpap.id}}"><img src="{{cpap.imageURL}}"
+                                        class="btn" width="90" height="90px"></a>
+                            </td>
+                            <td>
+                                <strong>{{cpap.name}}</strong> <br>
+                                <p class="small">({{cpap.itemnum}})</p>
+                                Last Ordered: {{cpap.lastordered.strftime("%A %B %d, %Y")}} <br>
+                                Next Order Date: {{cpap.nextorderdate.strftime("%A %B %d, %Y")}} <br>
+                            </td>
+                        </tr>
+                        {% endfor %}
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    {% endif %}
+</div>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/views/profile.html b/website/templates/views/profile.html
new file mode 100644
index 0000000..c59dd00
--- /dev/null
+++ b/website/templates/views/profile.html
@@ -0,0 +1,81 @@
+{% extends "base.html" %}
+
+{% block title %}
+{% endblock %}
+
+{% block style %}
+{% endblock %}
+
+{% block submenu %}
+{% endblock %}
+
+{% block proheader %}
+Profile for {{current_user.username}}
+{% endblock %}
+
+{% block content %}
+
+<form action="/profile" enctype=multipart/form-data method="POST" class="row g-3">
+    <div class="col-6">
+        <label for="firstname" class="form-label">First Name</label>
+        <input type="text" class="form-control" name="firstname" id="firstname" value="{{profile.firstname}}">
+    </div>
+    <div class="col-6">
+        <label for="lastname" class="form-label">Last Name</label>
+        <input type="text" class="form-control" name="lastname" id="lastname" value="{{profile.lastname}}">
+    </div>
+    <div class="col-4">
+        <label for="address" class="form-label">Address</label>
+        <input type="text" class="form-control" name="address" id="address" value="{{profile.address}}">
+    </div>
+    <div class="col-md-3">
+        <label for="city" class="form-label">City</label>
+        <input type="text" class="form-control" id="city" name="city" value="{{profile.city}}">
+    </div>
+    <div class="col-md-2">
+        <label for="state" class="form-label">State</label>
+        <select type="text" name="state" id="state" class="form-select">
+            {% for state in states %}
+            {% if state.abr == profile.state %}
+            <option selected value="{{state.abr}}">{{state.state}}</option>
+            {% else %}
+            <option value="{{state.abr}}">{{state.state}}</option>
+            {% endif %}
+            {% endfor %}
+        </select>
+    </div>
+    <div class="col-md-3">
+        <label for="zip" class="form-label">Zip</label>
+        <input type="text" class="form-control" id="zip" name="zip" value="{{profile.zip}}">
+    </div>
+    <div class="col-4">
+        <label for="phone" class="form-label">Phone</label>
+        <input type="tel" class="form-control" id="phone" name="phone" value="{{profile.phone}}">
+    </div>
+    <div class="col-4">
+        <label for="email" class="form-label">Email</label>
+        <input type="text" class="form-control" id="email" name="email" value="{{profile.email}}">
+    </div>
+    <div class="col-4">
+        <label class="form-label" for="dob">Birthdate</label>
+        <input type="date" name="dob" id="dob" class="form-control" value="{{profile.dob.strftime('%Y-%m-%d')}}">
+    </div>
+    <div class="col-4">
+        <label class="form-label" for="un">Username</label>
+        <input type="text" name="un" id="un" class="form-control" value="{{profile.username}}">
+    </div>
+    <div class="col-4">
+        <label class="form-label" for="pw">Password</label>
+        <input type="password" name="pw" id="pw" class="form-control" value="{{profile.password}}">
+    </div>
+    <div class="col-4">
+        <label class="form-label" for="avatar">Avatar</label>
+        <input type="file" name="avatar" id="avatar" class="form-control">
+        {% set fn = 'images/'+current_user.avatar_filename %}
+          <img src="{{url_for('static', filename=fn)}}" alt="pic" width="64" height="64" class="rounded-circle me-2">
+    </div>
+    <div class="col-12">
+        <button type="submit" class="btn btn-primary">Save Information</button>
+    </div>
+</form>
+{% endblock %}
\ No newline at end of file
diff --git a/website/templates/views/views.py b/website/templates/views/views.py
new file mode 100644
index 0000000..7e75fa8
--- /dev/null
+++ b/website/templates/views/views.py
@@ -0,0 +1,70 @@
+from flask import Blueprint, render_template, request, redirect, url_for
+from flask_login import login_required
+from werkzeug.utils import secure_filename
+from website.models import *
+from datetime import datetime, timedelta
+from website import db
+from sqlalchemy.sql import func
+import datetime, flask_login
+from math import ceil
+import os
+
+views = Blueprint("views", __name__)
+
+@views.route("/")
+@views.route("/home")
+@login_required
+def home():
+    currentvalue = db.session.query(func.max(A1C.date).label('ld'), A1C.testresult, A1C.userid).filter(A1C.userid == flask_login.current_user.id).order_by(A1C.date).first()
+    if currentvalue.testresult is None:
+        eag=0
+    else:
+        eag = ceil(28.7 * currentvalue.testresult - 46.7)
+    cntProjects = db.session.query(Projects).filter(Projects.userid == flask_login.current_user.id).filter(Projects.next_review <= datetime.datetime.now()).filter(Projects.status != "Complete").count()
+    cntMeds = db.session.query(Medications).filter(Medications.next_refill <= datetime.datetime.now()+timedelta(days=5)).filter(Medications.userid == flask_login.current_user.id).count()
+    cntTasks = db.session.query(Tasks.id, Tasks.duedate, Tasks.checked, Tasks.item, Tasks.project, Tasks.userid, Projects.name.label('nameOfProject')).join(Projects, Projects.id == Tasks.project).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.duedate <= (datetime.datetime.today()+timedelta(days=2))).filter(Tasks.checked==False).order_by(Tasks.duedate.desc(), Tasks.project).count()
+    cntA1C = db.session.query(A1C).filter(A1C.userid == flask_login.current_user.id).limit(1).count()
+    cntCpap = db.session.query(Cpap).filter(Cpap.nextorderdate <= datetime.datetime.now()+timedelta(days=5)).filter(Cpap.userid == flask_login.current_user.id).count()
+    cntMenu = db.session.query(Planner).filter(Planner.date >= (datetime.datetime.today()- timedelta(days=1))).order_by(Planner.date).limit(10).count()
+    projects = db.session.query(Projects).filter(Projects.userid == flask_login.current_user.id).filter(Projects.next_review <= datetime.datetime.now()).filter(Projects.status != "Complete").all()
+    tasks = db.session.query(Tasks.id, Tasks.duedate, Tasks.checked, Tasks.item, Tasks.project, Tasks.userid, Projects.name.label('nameOfProject')).join(Projects, Projects.id == Tasks.project).filter(Tasks.userid == flask_login.current_user.id).filter(Tasks.duedate <= (datetime.datetime.today()+timedelta(days=2))).filter(Tasks.checked==False).order_by(Tasks.duedate.desc(), Tasks.project).all()
+    plans = db.session.query(Planner).filter(Planner.date >= (datetime.datetime.today()- timedelta(days=1))).order_by(Planner.date).limit(10)
+    meds = db.session.query(Medications).filter(Medications.next_refill <= (datetime.datetime.today()+timedelta(days=5))).filter(Medications.userid == flask_login.current_user.id).order_by(Medications.next_refill).all()
+    cpaps = db.session.query(Cpap).filter(Cpap.nextorderdate <= datetime.datetime.now()+timedelta(days=5)).filter(Cpap.userid == flask_login.current_user.id).all()
+    return render_template("views/home.html", user=User, meds=meds, currentvalue=currentvalue, eag=eag, plans=plans, tasks=tasks, projects=projects, cntTasks=cntTasks, cntMeds=cntMeds, cntProjects=cntProjects, cntA1C=cntA1C, cntCpap=cntCpap, cpaps=cpaps, cntMenu=cntMenu)
+
+
+@views.route("/profile", methods=['GET','POST'])
+@login_required
+def profile():
+    if request.method == 'POST':
+        pic = request.files['avatar']
+        mime = pic.mimetype
+        filename = secure_filename(pic.filename)
+        profile = db.session.query(User).filter(User.id == flask_login.current_user.id).first()
+        profile.firstname = request.form.get('firstname')
+        profile.lastname = request.form.get('lastname')
+        profile.address = request.form.get('address')
+        profile.city = request.form.get('city')
+        profile.state = request.form.get('state')
+        profile.zip = request.form.get('zip')
+        profile.phone = request.form.get('phone')
+        profile.email = request.form.get('email')
+        profile.username = request.form.get('un')
+        profile.password = request.form.get('pw')
+        profile.avatar = pic.read()
+        profile.avatar_filename = filename
+        profile.avatar_mimetype = mime
+        db.session.commit()
+        
+        filename = str(flask_login.current_user.id)+"."+mime[-3:]
+        profile.avatar_filename = filename
+        db.session.commit()
+        
+        pic.seek(0) 
+        pic.save(os.path.join(url_for('static', filename='images/'+filename)))
+        return redirect(url_for("views.profile"))
+        
+    states = db.session.query(States).all()
+    profile = db.session.query(User).filter(User.id == flask_login.current_user.id).first()
+    return render_template('views/profile.html', user=User, profile=profile, states=states)
\ No newline at end of file
diff --git a/website/vfc_maker.py b/website/vfc_maker.py
new file mode 100644
index 0000000..6088093
--- /dev/null
+++ b/website/vfc_maker.py
@@ -0,0 +1,22 @@
+
+from os import replace
+
+
+def make_vfc(info):
+    nameforfn = info.name.replace(" ", "").replace(".","").lower()
+    splitname = info.name.split()
+    last_name = splitname[-1]
+    first_name = splitname[int(len(splitname) / 2)]
+    title = splitname[0]
+    filename = nameforfn + ".vcf"
+    with open ("website/"+filename, 'w') as file:
+        file.write("BEGIN:VCARD\nVERSION:3.0\nPRODID:-//Apple Inc.//macOS 12.0//EN\n")
+        file.write("N:" + last_name + ";" + first_name + ";;" + title + ";\n")
+        file.write("FN:" + info.name + "\n")
+        file.write("item1.EMAIL;type=INTERNET;type=pref:" + info.email + "\n")
+        file.write("ORG:"+info.company+"\n")
+        file.write("TEL;type=WORK;type=VOICE;type=pref:" + info.phone + "\n")
+        file.write("ADR;type=WORK;type=pref:;;" + info.address + ";" + info.city + ";" + info.state + ";" + info.zip + ";United States\n")
+        file.write("END:VCARD")
+    return filename
+
diff --git a/website/wifiqrcode.py b/website/wifiqrcode.py
new file mode 100644
index 0000000..70d49b9
--- /dev/null
+++ b/website/wifiqrcode.py
@@ -0,0 +1,21 @@
+import wifi_qrcode_generator
+import re, os
+from flask import url_for
+
+def generate_code(SSID, Password):
+    qrco = wifi_qrcode_generator.wifi_qrcode(
+    SSID, False, 'WPA', Password
+    )
+    file = re.sub(r"[^A-Za-z]+", '', SSID) + ".png"
+    fullfile = os.path.join('website', 'static', 'qrcode',file).lower()
+    full = os.path.join('qrcode',file).lower()
+
+    print(fullfile)
+
+    qrco.save(fullfile, format='PNG')
+    return full
+
+def renameSSID(SSID):
+    file = re.sub(r"[^A-Za-z]+", '', SSID) + ".png"
+    path = url_for('static', filename = '/qrcode/'+file)
+    return path