diff --git a/CSS/cal.css b/CSS/cal.css
new file mode 100644
index 0000000..79e91f8
--- /dev/null
+++ b/CSS/cal.css
@@ -0,0 +1,206 @@
+html { width:100%; height:100%; margin:0; padding:0; }
+
+body {
+    /* background-color: rgb(4, 4, 85); */
+    background-color: rgb(41, 42, 48);
+    width:100%; height:100%; margin:0; padding:0;
+}
+
+/* .dropdown a:hover { background-color: #ddd; } */
+
+.show { display: block; }
+
+.hide { display: none; }
+
+.loadingscreen {
+    height: 90vh;
+    background-color: bisque;
+    z-index: 100;
+}
+
+.navbar {
+    background-color: rgb(0, 0, 0);
+    /* height: 50px;
+    border-width: 1px;
+    border-style: double; */
+}
+
+.navbar .nav-item {
+    margin-right: 25px;
+    margin-left: 25px;
+}
+
+#right {
+    float: right;
+    margin-right: 50px;
+}
+
+.box {
+    font-size: 20px;
+    height: 40px;
+    width: auto;
+    margin-bottom: 15px;
+    padding: 3px;
+    border: 1px solid black;
+    clear: both;
+    align-content: center;
+    margin-right: 30px;
+    margin-left: 30px;
+}
+
+.statusdiv {
+    border-style: dashed;
+    border-color: rgb(247, 189, 0);
+    width: 140px;
+    height: 120px;
+    margin-top: 20px;
+    float: right;
+    margin-right: 50px;
+    text-align: center;
+}
+
+.saved {
+    background-color: rgb(11, 184, 11);
+}
+.saving {
+    background-color: orange;
+}
+.failed {
+    background-color: red;
+}
+
+
+.buttonsmainbar {
+    background-color: green;
+    width: 200px;
+    height: 60px;
+}
+
+.btnmain {
+    background-color: rgb(0, 0, 0);
+}
+
+.sidebar {
+    background-color: #42424b;
+    width: 11%;
+    position: fixed;
+    top: 75px;
+    bottom: 0;
+    display: flex;
+    flex-wrap: wrap;
+    border: 0px;
+    border-right: 2px;
+    border-color: black;
+    border-style: solid;
+}
+
+.wc {
+    align-content: center;
+    align-self: center;
+    color: white;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    letter-spacing: 1px;
+}
+
+.lg {
+    align-content: center;
+    align-self: center;
+    color: white;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    letter-spacing: 1px;
+}
+
+.form-select {
+    width: 200px;
+    background-color:rgb(187, 183, 183);
+    border-color: #000000;
+}
+
+
+/* BUTTONS */
+
+.jumpButton {
+    /* color: #ffffff; */
+    font-size: 15px;
+    border: 1px solid #000000;
+    width: 200px;
+    height: 40px;
+    cursor: pointer;
+    align-self: center;
+    background-color: rgb(2, 2, 192);
+}
+.jumpButton:hover {
+    color: #2d63c8;
+    /* background-color: #ffffff; */
+}
+
+.logoutbtn {
+    margin-top: 14px;
+    scale: 1.4;
+}
+
+.logoutbtn:hover {
+    cursor: pointer;
+    color: red;
+}
+
+#sevradio br {
+    margin-top: 10px;
+}
+
+.btnside {
+    color: #ffffff;
+    background-color: #42424b;
+    font-size: 19px;
+    /* border: 2px solid #000000; */
+    outline: none;
+    border: none;
+    width: 100%;
+    height: 50px;
+    cursor: pointer;
+}
+
+.btnside:hover {
+    color: #ffffff;
+    background-color: #377aea;
+}
+
+
+.helpbtn {
+    margin-top: 30px;
+    margin-bottom: 30px;
+    font-size: 20px;
+    align-self: right;
+    padding: 0px;
+    border-radius: 50%;
+    border-style: solid;
+}
+
+
+.calbtn {
+    width: 100px;
+    height: 70px;
+}
+
+.green {
+    background-color: rgb(6, 185, 6);
+}
+
+.red {
+    background-color: rgb(129, 129, 129);
+}
+
+.uploadLabel {
+    border: 1px solid #ccc;
+    display: inline-block;
+    padding: 7px 15px;
+    cursor: pointer;
+    border-radius: 5px;
+    background-color: rgb(13, 179, 179);
+    scale: 1.5;
+    margin-top: 50px;
+}
+
+.uploadButton {
+    display: none;
+}
\ No newline at end of file
diff --git a/CSS/calEvent.css b/CSS/calEvent.css
new file mode 100644
index 0000000..e45770c
--- /dev/null
+++ b/CSS/calEvent.css
@@ -0,0 +1,112 @@
+/* SUBMIT BUTTON START */
+.submitButton{
+    position: relative;
+    background-color: black;
+    border-radius: 4em;
+    font-size: 16px;
+    color: white;
+    padding: 0.8em 1.8em;
+    cursor:pointer;
+    user-select:none;
+    text-align: center;
+    text-decoration: none;
+    cursor: pointer;
+    transition-duration: 0.4s;
+    /* margin-left: 65px; */
+    margin-left: 30px;
+    margin-bottom: 40px;
+    -webkit-transition-duration: 0.4s; /* Safari */
+}
+
+.submitButton:hover {
+    transition-duration: 0.1s;
+    background-color: #3A3A3A;
+}
+
+.submitButton:after {
+    content: "";
+    display: block;
+    position: absolute;
+    border-radius: 4em;
+    left: 0;
+    top:0;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    transition: all 0.5s;
+    box-shadow: 0 0 10px 40px white;
+}
+
+.submitButton:active:after {
+    box-shadow: 0 0 0 0 white;
+    position: absolute;
+    border-radius: 4em;
+    left: 0;
+    top:0;
+    opacity: 1;
+    transition: 0s;
+}
+
+.submitButton:active {
+    top: 1px;
+}
+
+
+.btnActive {
+    color: #ffffff;
+    background-color: #ff1117;
+    font-size: 13px;
+    border: 1px solid #000000;
+    border-radius: 9px;
+    padding: 10px 40px;
+    letter-spacing: 1px;
+    cursor: pointer;
+    margin-left: 40px;
+}
+
+.btnCanceled {
+    color: #ffffff;
+    background-color: #7a7a7a;
+    font-size: 13px;
+    border: 1px solid #000000;
+    border-radius: 9px;
+    padding: 10px 40px;
+    letter-spacing: 1px;
+    cursor: pointer;
+    margin-left: 40px;
+}
+/* SUBMIT BUTTON END */
+
+
+.newEvtBtn {
+    margin-left: 40px;
+    color: #ffffff;
+    background-color: #0cdc01;
+    font-size: 16px;
+    border-radius: 4em;
+    padding: 0.8em 1.8em;
+    cursor: pointer
+}
+
+.newEvtBtn:hover {
+    color: #6e6e6e;
+    background-color: #14fe07;
+}
+
+body {
+    background-color: rgb(59, 58, 58);
+}
+
+.evtclass {
+    margin-bottom: 50px;
+    color: white;
+    line-height: 23px;
+}
+
+.evtclass a {
+    color: rgb(0, 250, 237);
+}
+
+.evtclass a:active {
+    color: rgb(255, 0, 255);
+}
diff --git a/CSS/dashboard.css b/CSS/dashboard.css
new file mode 100644
index 0000000..7f90e1a
--- /dev/null
+++ b/CSS/dashboard.css
@@ -0,0 +1,198 @@
+.jumpButton {
+    /* color: #ffffff; */
+    font-size: 15px;
+    border: 1px solid #000000;
+    width: 200px;
+    height: 40px;
+    cursor: pointer;
+    align-self: center;
+    background-color: rgb(2, 2, 192);
+}
+.jumpButton:hover {
+    color: #2d63c8;
+    /* background-color: #ffffff; */
+}
+
+.logoutbtn {
+    margin-top: 14px;
+    scale: 1.4;
+}
+
+.logoutbtn:hover {
+    cursor: pointer;
+    color: red;
+}
+
+#sevradio br {
+    margin-top: 10px;
+}
+
+.btnside {
+    color: #ffffff;
+    background-color: #42424b;
+    font-size: 19px;
+    /* border: 2px solid #000000; */
+    outline: none;
+    border: none;
+    width: 100%;
+    height: 50px;
+    cursor: pointer;
+}
+
+.btnside:hover {
+    color: #ffffff;
+    background-color: #377aea;
+}
+
+
+.helpbtn {
+    margin-top: 30px;
+    margin-bottom: 30px;
+    font-size: 20px;
+    align-self: right;
+    padding: 0px;
+    border-radius: 50%;
+    border-style: solid;
+}
+
+
+.calbtn {
+    width: 100px;
+    height: 70px;
+}
+
+.green {
+    background-color: rgb(6, 185, 6);
+}
+
+.red {
+    background-color: rgb(129, 129, 129);
+}
+
+
+
+html { width:100%; height:100%; margin:0; padding:0; }
+
+body {
+    /* background-color: rgb(4, 4, 85); */
+    background-color: rgb(41, 42, 48);
+    width:100%; height:100%; margin:0; padding:0;
+}
+
+/* .dropdown a:hover { background-color: #ddd; } */
+
+.show { display: block; }
+
+.hide { display: none; }
+
+.loadingscreen {
+    height: 90vh;
+    background-color: bisque;
+    z-index: 100;
+}
+
+.navbar {
+    background-color: rgb(0, 0, 0);
+    /* height: 50px;
+    border-width: 1px;
+    border-style: double; */
+}
+
+.navbar .nav-item {
+    margin-right: 25px;
+    margin-left: 25px;
+}
+
+#right {
+    float: right;
+    margin-right: 50px;
+}
+
+.box {
+    font-size: 20px;
+    height: 40px;
+    width: auto;
+    margin-bottom: 15px;
+    padding: 3px;
+    border: 1px solid black;
+    clear: both;
+    align-content: center;
+    margin-right: 30px;
+    margin-left: 30px;
+}
+
+.statusdiv {
+    border-style: dashed;
+    border-color: rgb(247, 189, 0);
+    width: 140px;
+    height: 120px;
+    margin-top: 20px;
+    float: right;
+    margin-right: 50px;
+    text-align: center;
+}
+
+.saved {
+    background-color: rgb(11, 184, 11);
+}
+.saving {
+    background-color: orange;
+}
+.failed {
+    background-color: red;
+}
+
+
+.buttonsmainbar {
+    background-color: green;
+    width: 200px;
+    height: 60px;
+}
+
+.btnmain {
+    background-color: rgb(0, 0, 0);
+}
+
+.sidebar {
+    background-color: #42424b;
+    width: 11%;
+    position: fixed;
+    top: 75px;
+    bottom: 0;
+    display: flex;
+    flex-wrap: wrap;
+    border: 0px;
+    border-right: 2px;
+    border-color: black;
+    border-style: solid;
+}
+
+.wc {
+    align-content: center;
+    align-self: center;
+    color: white;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    letter-spacing: 1px;
+}
+
+.lg {
+    align-content: center;
+    align-self: center;
+    color: white;
+    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+    letter-spacing: 1px;
+}
+
+.form-select {
+    width: 200px;
+    background-color:rgb(187, 183, 183);
+    border-color: #000000;
+}
+
+.ardpd {
+    color: inherit;
+    background-color: rgba(85, 83, 83, 0.2);
+}
+.ardpd:focus-visible {
+    color: white;
+}
\ No newline at end of file
diff --git a/CSS/index.css b/CSS/index.css
new file mode 100644
index 0000000..7e0161a
--- /dev/null
+++ b/CSS/index.css
@@ -0,0 +1,137 @@
+html { width:100%; height:100%; margin:0; padding:0; }
+
+body {
+    background-color: rgb(41, 42, 48);
+    /* background-color: rgb(1, 1, 59); */
+    width:100%; height:100%; margin:0; padding:0;
+}
+
+.loginbtn {
+    margin-top: 14px;
+    scale: 1.2;
+    border-radius: 10%;
+}
+.loginbtn:hover {
+    color: #377aea;
+}
+
+.tooltip {
+    position: relative;
+    display: inline-block;
+    cursor: default;
+}
+
+.tooltip .tooltiptext {
+    visibility: hidden;
+    padding: 0.25em 0.5em;
+    background-color: black;
+    color: #fff;
+    text-align: center;
+    border-radius: 0.25em;
+    white-space: nowrap;
+    
+    /* Position the tooltip */
+    position: absolute;
+    z-index: 1;
+    top: 100%;
+    left: 100%;
+    transition-property: visibility;
+    transition-delay: 0s;
+}
+
+.tooltip:hover .tooltiptext {
+    visibility: visible;
+    transition-delay: 0.3s;
+}
+
+nav {
+    background-color: rgb(0, 0, 0);
+    /* color: blue; */
+    /* text-align: center; */
+}
+
+.navbar .nav-item {
+    margin-right: 25px;
+    margin-left: 25px;
+}
+
+#right {
+    float: right;
+    margin-right: 50px;
+}
+
+.logoutbtn {
+    margin-top: 14px;
+    scale: 1.2;
+    border-radius: 10%;
+    /* float: right; */
+}
+
+.logoutbtn:hover {
+    cursor: pointer;
+    color: red;
+}
+
+.desctext {
+    /* float:left; */
+    color: white;
+    /* margin-left: 50px; */
+    margin-top: 20px;
+    background-color: rgb(1, 69, 196, 0.1);
+    padding: 20px;
+    border-radius: 10%;
+    width: auto;
+}
+
+/*************************
+    CAROUSEL
+*************************/
+
+.carousel .carousel-inner {
+    height: 550px;
+    margin-top: 20px;
+    margin-bottom: 100px;
+    background: #faf9f9;
+    border:1px solid rgb(94, 104, 104);
+    
+}
+
+.carousel-control.right,
+.carousel-control.left {
+    background-image: none;
+}
+
+.control-icon {
+    color: #393939;
+    text-shadow: none;
+}
+
+.carousel-inner {
+    position: relative;
+    height: 300px;
+}
+
+.carousel-img {
+    /* width: 200px;
+    height: 400px; */
+    background-size: cover;
+    position: relative;
+    /* top: 50px; */
+    transform: translateY(5%);
+}
+
+.cat-title {
+    text-shadow: none;
+}
+
+.item{
+    position: relative;
+}
+
+.navbar-fixed-top {
+    position: fixed;
+    right: 0;
+    left: 0;
+    z-index: 1030;
+    top: 0;
+}
\ No newline at end of file
diff --git a/CSS/premium.css b/CSS/premium.css
new file mode 100644
index 0000000..50e1cdf
--- /dev/null
+++ b/CSS/premium.css
@@ -0,0 +1,124 @@
+html { width:100%; height:100%; margin:0; padding:0; }
+
+body {
+    /* background-color: rgb(4, 4, 85); */
+    background-color: rgb(38, 39, 49);
+    width:100%; height:100%; margin:0; padding:0;
+    color: white;
+}
+.navbar .nav-item {
+    margin-right: 25px;
+    margin-left: 25px;
+}
+
+#right {
+    float: right;
+    margin-right: 50px;
+}
+
+#right {
+    float: right;
+    margin-right: 50px;
+}
+
+
+h1 {
+    /* color: rgb(0, 74, 235); */
+    /* outline-style: dotted; */
+    text-align: center;
+    margin-right: 1%;
+    margin-left: 1%;
+}
+
+h2 {
+    color: rgb(255, 255, 255);
+    text-align: center;
+}
+
+p {
+    color: white;
+    margin-left: 1%;
+}
+
+h3 {
+    margin-left: 1%;
+}
+
+.desctext {
+    color: white;
+    margin-top: 20px;
+    background-color: rgb(1, 69, 196, 0.1);
+    padding: 10px;
+    border-radius: 10%;
+    border-style: groove;
+    border-color: rgb(255, 255, 255, 0.6);
+    width: auto;
+}
+
+.navbar-fixed-top {
+    position: fixed;
+    right: 0;
+    left: 0;
+    z-index: 1030;
+    top: 0;
+}
+
+.picon {
+    border-radius: 50%;
+    background-color: rgba(255, 204, 51, 0.2);
+    box-shadow: 0 0 12px 7px rgba(252, 200, 28, 0.2);
+}
+
+
+/* Buttons */
+
+.logoutbtn {
+    margin-top: 14px;
+    scale: 1.2;
+    border-radius: 10%;
+}
+.logoutbtn:hover {
+    cursor: pointer;
+    color: red;
+}
+
+.loginbtn {
+    margin-top: 14px;
+    scale: 1.2;
+    border-radius: 10%;
+}
+.loginbtn:hover {
+    color: #377aea;
+}
+
+.fivedollarbtn {
+    color: #00f2f2;
+    font-size: 23px;
+    border: 1px solid #2fffe0;
+    border-radius: 10px;
+    padding: 10px 30px;
+    letter-spacing: 1px;
+    cursor: pointer
+}
+.fivedollarbtn:hover {
+    color: #000000;
+    background-color: #00f2f2;
+}
+
+.tendollarbtn {
+    color: #30f200;
+    font-size: 23px;
+    border: 1px solid #50f801;
+    border-radius: 10px;
+    padding: 10px 30px;
+    letter-spacing: 1px;
+    cursor: pointer
+}
+.tendollarbtn:hover {
+    color: #000000;
+    background-color: #30f200;
+}
+
+h1 {
+    font-family: 'Share Tech Mono', monospace;
+}
\ No newline at end of file
diff --git a/CSS/submitBtn.css b/CSS/submitBtn.css
new file mode 100644
index 0000000..d31e873
--- /dev/null
+++ b/CSS/submitBtn.css
@@ -0,0 +1,48 @@
+.submitButton{
+    position: relative;
+    background-color: black;
+    border-radius: 4em;
+    font-size: 16px;
+    color: white;
+    padding: 0.8em 1.8em;
+    cursor:pointer;
+    user-select:none;
+    text-align: center;
+    text-decoration: none;
+    cursor: pointer;
+    transition-duration: 0.4s;
+    -webkit-transition-duration: 0.4s; /* Safari */
+}
+
+.submitButton:hover {
+    transition-duration: 0.1s;
+    background-color: #3A3A3A;
+}
+
+.submitButton:after {
+    content: "";
+    display: block;
+    position: absolute;
+    border-radius: 4em;
+    left: 0;
+    top:0;
+    width: 100%;
+    height: 100%;
+    opacity: 0;
+    transition: all 0.5s;
+    box-shadow: 0 0 10px 40px white;
+}
+
+.submitButton:active:after {
+    box-shadow: 0 0 0 0 white;
+    position: absolute;
+    border-radius: 4em;
+    left: 0;
+    top:0;
+    opacity: 1;
+    transition: 0s;
+}
+
+.submitButton:active {
+    top: 1px;
+}
\ No newline at end of file
diff --git a/CSS/team.css b/CSS/team.css
new file mode 100644
index 0000000..b500b2f
--- /dev/null
+++ b/CSS/team.css
@@ -0,0 +1,139 @@
+body {
+    /* background-color: black; */
+    /* background-image: linear-gradient(140deg, #EADEDB 0%, #BC70A4 50%, #BFD641 75%); */
+    background-image: linear-gradient(140deg, #4a12e4 10%, #13206d 50%, #41d6d6 75%);
+    background-repeat:no-repeat;
+    background-size: 100vw 100vh;
+}
+
+.webBtn {
+    margin: 50px;
+    font-family:'Comic Sans MS';
+    font-size:20px;
+    line-height:20px;
+    color:#ffffff;
+    background-color:#4d4d4d;
+    padding:20px;
+    border-radius:10px;
+}
+
+.webBtn:hover {
+    color: #000000;
+    background-color: #9b9999;
+}
+
+.loginbtn {
+    margin-top: 14px;
+    scale: 1.2;
+    border-radius: 10%;
+}
+.loginbtn:hover {
+    color: #377aea;
+}
+
+.tooltip {
+    position: relative;
+    display: inline-block;
+    cursor: default;
+}
+
+.tooltip .tooltiptext {
+    visibility: hidden;
+    padding: 0.25em 0.5em;
+    background-color: black;
+    color: #fff;
+    text-align: center;
+    border-radius: 0.25em;
+    white-space: nowrap;
+    
+    /* Position the tooltip */
+    position: absolute;
+    z-index: 1;
+    top: 100%;
+    left: 100%;
+    transition-property: visibility;
+    transition-delay: 0s;
+}
+
+.tooltip:hover .tooltiptext {
+    visibility: visible;
+    transition-delay: 0.3s;
+}
+
+nav {
+    /* background-color: rgb(0, 0, 0); */
+    background: linear-gradient(0deg, #06075f00 10%, #13206d 50%, #41d6d6 95%);
+    /* color: blue; */
+    /* text-align: center; */
+}
+
+.navbar .nav-item {
+    margin-right: 25px;
+    margin-left: 25px;
+}
+
+#right {
+    float: right;
+    margin-right: 50px;
+}
+
+.logoutbtn {
+    margin-top: 14px;
+    scale: 1.2;
+    border-radius: 10%;
+    /* float: right; */
+}
+
+.logoutbtn:hover {
+    cursor: pointer;
+    color: red;
+}
+
+.headerText {
+    color: white;
+    font-family: 'Rajdhani', sans-serif;
+}
+
+h1 {
+    color: rgb(150, 148, 148);
+    -webkit-text-stroke-width: 0.3px;
+    -webkit-text-stroke-color: white;
+}
+
+/* h3 {
+    margin-right: 20%;
+    margin-left: 20%;
+    color: white;
+    text-align: center;
+    line-height: 40px;
+} */
+
+.abtme {
+    text-align: center;
+    background-color: rgba(0, 0, 0, 0.212);
+    margin-right: 20%;
+    margin-left: 20%;
+    margin-top: 20px;;
+    color: white;
+    text-align: center;
+    line-height: 40px;
+}
+
+.inpbox {
+    width: 250px;
+    height: 100px;
+    border-radius: 20px;
+    background-color: rgb(200, 200, 202);
+}
+
+.sbtn {
+    margin: 20px;
+    color: #ffffff;
+    background: linear-gradient(0deg, #5f060600 10%, #6d1335 50%, #d64141 95%);
+    background: linear-gradient(0deg, #d64141 10%, #6d1335 50%, #5f060600 95%);
+    font-size: 19px;
+    border: 1px solid #2d63c8;
+    border-radius: 30px;
+    padding: 15px 50px;
+    cursor: pointer;
+}
\ No newline at end of file
diff --git a/HTML/calEvent.html b/HTML/calEvent.html
index 3f45b1f..db6b825 100644
--- a/HTML/calEvent.html
+++ b/HTML/calEvent.html
@@ -5,123 +5,8 @@
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-    <style>
-        /* SUBMIT BUTTON START */
-        .submitButton{
-            position: relative;
-            background-color: black;
-            border-radius: 4em;
-            font-size: 16px;
-            color: white;
-            padding: 0.8em 1.8em;
-            cursor:pointer;
-            user-select:none;
-            text-align: center;
-            text-decoration: none;
-            cursor: pointer;
-            transition-duration: 0.4s;
-            /* margin-left: 65px; */
-            margin-left: 30px;
-            margin-bottom: 40px;
-            -webkit-transition-duration: 0.4s; /* Safari */
-        }
-
-        .submitButton:hover {
-            transition-duration: 0.1s;
-            background-color: #3A3A3A;
-        }
-
-        .submitButton:after {
-            content: "";
-            display: block;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            width: 100%;
-            height: 100%;
-            opacity: 0;
-            transition: all 0.5s;
-            box-shadow: 0 0 10px 40px white;
-        }
-
-        .submitButton:active:after {
-            box-shadow: 0 0 0 0 white;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            opacity: 1;
-            transition: 0s;
-        }
-
-        .submitButton:active {
-            top: 1px;
-        }
- 
-
-        .btnActive {
-			color: #ffffff;
-			background-color: #ff1117;
-			font-size: 13px;
-			border: 1px solid #000000;
-			border-radius: 9px;
-			padding: 10px 40px;
-			letter-spacing: 1px;
-			cursor: pointer;
-            margin-left: 40px;
-		}
-
-		.btnCanceled {
-			color: #ffffff;
-			background-color: #7a7a7a;
-			font-size: 13px;
-			border: 1px solid #000000;
-			border-radius: 9px;
-			padding: 10px 40px;
-			letter-spacing: 1px;
-			cursor: pointer;
-            margin-left: 40px;
-		}
-        /* SUBMIT BUTTON END */
-
-
-        .newEvtBtn {
-            margin-left: 40px;
-            color: #ffffff;
-			background-color: #0cdc01;
-            font-size: 16px;
-            border-radius: 4em;
-            padding: 0.8em 1.8em;
-			cursor: pointer
-        }
-
-        .newEvtBtn:hover {
-            color: #6e6e6e;
-			background-color: #14fe07;
-        }
-    </style>
-
-    <style>
-        body {
-            background-color: rgb(59, 58, 58);
-        }
-
-        .evtclass {
-            margin-bottom: 50px;
-            color: white;
-            line-height: 23px;
-        }
-        
-        .evtclass a {
-            color: rgb(0, 250, 237);
-        }
-
-        .evtclass a:active {
-            color: rgb(255, 0, 255);
-        }
-
-    </style>
+    <link rel="stylesheet" type="text/css" href="/CSS/calEvent.css">
+    <link rel="stylesheet" type="text/css" href="/CSS/submitBtn.css">
 
     <script>
         window.onbeforeunload = function(){
diff --git a/HTML/calendar.html b/HTML/calendar.html
index df44f90..91b3df0 100644
--- a/HTML/calendar.html
+++ b/HTML/calendar.html
@@ -19,273 +19,12 @@
         <link rel="preconnect" href="https://fonts.googleapis.com">
         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
         <link href="https://fonts.googleapis.com/css2?family=Cinzel&family=Rajdhani:wght@300&family=Rouge+Script&family=Share+Tech+Mono&display=swap" rel="stylesheet">
+
+        <link rel="stylesheet" type="text/css" href="/CSS/cal.css">
     </span>
 
     <title>Selmer Bot Web Dashboard</title>
 
-
-    <style>
-        html { width:100%; height:100%; margin:0; padding:0; }
-
-        body {
-            /* background-color: rgb(4, 4, 85); */
-            background-color: rgb(41, 42, 48);
-            width:100%; height:100%; margin:0; padding:0;
-        }
-
-        /* .dropdown a:hover { background-color: #ddd; } */
-
-        .show { display: block; }
-
-        .hide { display: none; }
-
-        .loadingscreen {
-            height: 90vh;
-            background-color: bisque;
-            z-index: 100;
-        }
-
-        .navbar {
-            background-color: rgb(0, 0, 0);
-            /* height: 50px;
-            border-width: 1px;
-            border-style: double; */
-        }
-
-        .navbar .nav-item {
-			margin-right: 25px;
-			margin-left: 25px;
-		}
-
-        #right {
-            float: right;
-            margin-right: 50px;
-        }
-
-        .box {
-            font-size: 20px;
-            height: 40px;
-            width: auto;
-            margin-bottom: 15px;
-            padding: 3px;
-            border: 1px solid black;
-            clear: both;
-            align-content: center;
-            margin-right: 30px;
-            margin-left: 30px;
-        }
-
-        .statusdiv {
-            border-style: dashed;
-            border-color: rgb(247, 189, 0);
-            width: 140px;
-            height: 120px;
-            margin-top: 20px;
-            float: right;
-            margin-right: 50px;
-            text-align: center;
-        }
-
-        .saved {
-            background-color: rgb(11, 184, 11);
-        }
-        .saving {
-            background-color: orange;
-        }
-        .failed {
-            background-color: red;
-        }
-
-
-        .buttonsmainbar {
-            background-color: green;
-            width: 200px;
-            height: 60px;
-        }
-
-        .btnmain {
-            background-color: rgb(0, 0, 0);
-        }
-
-        .sidebar {
-            background-color: #42424b;
-            width: 11%;
-            position: fixed;
-            top: 75px;
-            bottom: 0;
-            display: flex;
-            flex-wrap: wrap;
-            border: 0px;
-            border-right: 2px;
-            border-color: black;
-            border-style: solid;
-        }
-
-        .wc {
-            align-content: center;
-            align-self: center;
-            color: white;
-            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-            letter-spacing: 1px;
-        }
-
-        .lg {
-            align-content: center;
-            align-self: center;
-            color: white;
-            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-            letter-spacing: 1px;
-        }
-
-        .form-select {
-            width: 200px;
-            background-color:rgb(187, 183, 183);
-            border-color: #000000;
-        }
-
-    </style>
-
-<!-- Buttons -->
-    <style>
-        .jumpButton {
-			/* color: #ffffff; */
-			font-size: 15px;
-			border: 1px solid #000000;
-			width: 200px;
-            height: 40px;
-			cursor: pointer;
-            align-self: center;
-            background-color: rgb(2, 2, 192);
-		}
-		.jumpButton:hover {
-			color: #2d63c8;
-			/* background-color: #ffffff; */
-		}
-
-         /* SUBMIT BUTTON START */
-         .submitButton{
-            position: relative;
-            background-color: black;
-            border-radius: 4em;
-            font-size: 16px;
-            color: white;
-            padding: 0.8em 1.8em;
-            cursor:pointer;
-            user-select:none;
-            text-align: center;
-            text-decoration: none;
-            cursor: pointer;
-            transition-duration: 0.4s;
-            -webkit-transition-duration: 0.4s; /* Safari */
-        }
-
-        .submitButton:hover {
-            transition-duration: 0.1s;
-            background-color: #3A3A3A;
-        }
-
-        .submitButton:after {
-            content: "";
-            display: block;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            width: 100%;
-            height: 100%;
-            opacity: 0;
-            transition: all 0.5s;
-            box-shadow: 0 0 10px 40px white;
-        }
-
-        .submitButton:active:after {
-            box-shadow: 0 0 0 0 white;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            opacity: 1;
-            transition: 0s;
-        }
-
-        .submitButton:active {
-            top: 1px;
-        }
-        /* SUBMIT BUTTON END */
-
-        .logoutbtn {
-            margin-top: 14px;
-            scale: 1.4;
-        }
-
-        .logoutbtn:hover {
-            cursor: pointer;
-            color: red;
-        }
-
-        #sevradio br {
-            margin-top: 10px;
-        }
-
-        .btnside {
-            color: #ffffff;
-			background-color: #42424b;
-			font-size: 19px;
-			/* border: 2px solid #000000; */
-            outline: none;
-            border: none;
-			width: 100%;
-            height: 50px;
-			cursor: pointer;
-        }
-
-        .btnside:hover {
-            color: #ffffff;
-			background-color: #377aea;
-        }
-
-
-        .helpbtn {
-            margin-top: 30px;
-            margin-bottom: 30px;
-            font-size: 20px;
-            align-self: right;
-            padding: 0px;
-            border-radius: 50%;
-            border-style: solid;
-        }
-
-
-        .calbtn {
-            width: 100px;
-            height: 70px;
-        }
-
-        .green {
-            background-color: rgb(6, 185, 6);
-        }
-
-        .red {
-            background-color: rgb(129, 129, 129);
-        }
-
-        .uploadLabel {
-            border: 1px solid #ccc;
-            display: inline-block;
-            padding: 7px 15px;
-            cursor: pointer;
-            border-radius: 5px;
-            background-color: rgb(13, 179, 179);
-            scale: 1.5;
-            margin-top: 50px;
-        }
-
-        .uploadButton {
-            display: none;
-        }
-    </style>
-
-
     <!-- Calendar -->
     <script>
         async function openNewCalWindow(evjs, day) {
diff --git a/HTML/dashboard.html b/HTML/dashboard.html
index ce98215..334f773 100644
--- a/HTML/dashboard.html
+++ b/HTML/dashboard.html
@@ -18,262 +18,8 @@
     <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
     <link href="https://fonts.googleapis.com/css2?family=Cinzel&family=Rajdhani:wght@300&family=Share+Tech+Mono&display=swap" rel="stylesheet">
 
-
-
-    <style>
-        html { width:100%; height:100%; margin:0; padding:0; }
-
-        body {
-            /* background-color: rgb(4, 4, 85); */
-            background-color: rgb(41, 42, 48);
-            width:100%; height:100%; margin:0; padding:0;
-        }
-
-        /* .dropdown a:hover { background-color: #ddd; } */
-
-        .show { display: block; }
-
-        .hide { display: none; }
-
-        .loadingscreen {
-            height: 90vh;
-            background-color: bisque;
-            z-index: 100;
-        }
-
-        .navbar {
-            background-color: rgb(0, 0, 0);
-            /* height: 50px;
-            border-width: 1px;
-            border-style: double; */
-        }
-
-        .navbar .nav-item {
-			margin-right: 25px;
-			margin-left: 25px;
-		}
-
-        #right {
-            float: right;
-            margin-right: 50px;
-        }
-
-        .box {
-            font-size: 20px;
-            height: 40px;
-            width: auto;
-            margin-bottom: 15px;
-            padding: 3px;
-            border: 1px solid black;
-            clear: both;
-            align-content: center;
-            margin-right: 30px;
-            margin-left: 30px;
-        }
-
-        .statusdiv {
-            border-style: dashed;
-            border-color: rgb(247, 189, 0);
-            width: 140px;
-            height: 120px;
-            margin-top: 20px;
-            float: right;
-            margin-right: 50px;
-            text-align: center;
-        }
-
-        .saved {
-            background-color: rgb(11, 184, 11);
-        }
-        .saving {
-            background-color: orange;
-        }
-        .failed {
-            background-color: red;
-        }
-
-
-        .buttonsmainbar {
-            background-color: green;
-            width: 200px;
-            height: 60px;
-        }
-
-        .btnmain {
-            background-color: rgb(0, 0, 0);
-        }
-
-        .sidebar {
-            background-color: #42424b;
-            width: 11%;
-            position: fixed;
-            top: 75px;
-            bottom: 0;
-            display: flex;
-            flex-wrap: wrap;
-            border: 0px;
-            border-right: 2px;
-            border-color: black;
-            border-style: solid;
-        }
-
-        .wc {
-            align-content: center;
-            align-self: center;
-            color: white;
-            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-            letter-spacing: 1px;
-        }
-
-        .lg {
-            align-content: center;
-            align-self: center;
-            color: white;
-            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
-            letter-spacing: 1px;
-        }
-
-        .form-select {
-            width: 200px;
-            background-color:rgb(187, 183, 183);
-            border-color: #000000;
-        }
-
-        .ardpd {
-            color: inherit;
-            background-color: rgba(85, 83, 83, 0.2);
-        }
-        .ardpd:focus-visible {
-            color: white;
-        }
-
-    </style>
-
-<!-- Buttons -->
-    <style>
-        .jumpButton {
-			/* color: #ffffff; */
-			font-size: 15px;
-			border: 1px solid #000000;
-			width: 200px;
-            height: 40px;
-			cursor: pointer;
-            align-self: center;
-            background-color: rgb(2, 2, 192);
-		}
-		.jumpButton:hover {
-			color: #2d63c8;
-			/* background-color: #ffffff; */
-		}
-
-         /* SUBMIT BUTTON START */
-         .submitButton{
-            position: relative;
-            background-color: black;
-            border-radius: 4em;
-            font-size: 16px;
-            color: white;
-            padding: 0.8em 1.8em;
-            cursor:pointer;
-            user-select:none;
-            text-align: center;
-            text-decoration: none;
-            cursor: pointer;
-            transition-duration: 0.4s;
-            -webkit-transition-duration: 0.4s; /* Safari */
-        }
-
-        .submitButton:hover {
-            transition-duration: 0.1s;
-            background-color: #3A3A3A;
-        }
-
-        .submitButton:after {
-            content: "";
-            display: block;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            width: 100%;
-            height: 100%;
-            opacity: 0;
-            transition: all 0.5s;
-            box-shadow: 0 0 10px 40px white;
-        }
-
-        .submitButton:active:after {
-            box-shadow: 0 0 0 0 white;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            opacity: 1;
-            transition: 0s;
-        }
-
-        .submitButton:active {
-            top: 1px;
-        }
-        /* SUBMIT BUTTON END */
-
-        .logoutbtn {
-            margin-top: 14px;
-            scale: 1.4;
-        }
-
-        .logoutbtn:hover {
-            cursor: pointer;
-            color: red;
-        }
-
-        #sevradio br {
-            margin-top: 10px;
-        }
-
-        .btnside {
-            color: #ffffff;
-			background-color: #42424b;
-			font-size: 19px;
-			/* border: 2px solid #000000; */
-            outline: none;
-            border: none;
-			width: 100%;
-            height: 50px;
-			cursor: pointer;
-        }
-
-        .btnside:hover {
-            color: #ffffff;
-			background-color: #377aea;
-        }
-
-
-        .helpbtn {
-            margin-top: 30px;
-            margin-bottom: 30px;
-            font-size: 20px;
-            align-self: right;
-            padding: 0px;
-            border-radius: 50%;
-            border-style: solid;
-        }
-
-
-        .calbtn {
-            width: 100px;
-            height: 70px;
-        }
-
-        .green {
-            background-color: rgb(6, 185, 6);
-        }
-
-        .red {
-            background-color: rgb(129, 129, 129);
-        }
-
-    </style>
+    <link rel="stylesheet" type="text/css" href="/CSS/dashboard.css">
+    <link rel="stylesheet" type="text/css" href="/CSS/submitBtn.css">
 
 <!-- Calendar -->
     <script>
diff --git a/HTML/index.html b/HTML/index.html
index 1b4a7ac..1ce6b58 100644
--- a/HTML/index.html
+++ b/HTML/index.html
@@ -29,148 +29,10 @@
 
 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
 
+	<link rel="stylesheet" type="text/css" href="/CSS/index.css">
+
 	<!-- <script type="text/javascript" src="main.js"></script> -->
 
-	<style>
-		html { width:100%; height:100%; margin:0; padding:0; }
-
-		body {
-			background-color: rgb(41, 42, 48);
-			/* background-color: rgb(1, 1, 59); */
-			width:100%; height:100%; margin:0; padding:0;
-		}
-
-		.loginbtn {
-            margin-top: 14px;
-            scale: 1.2;
-			border-radius: 10%;
-		}
-		.loginbtn:hover {
-			color: #377aea;
-		}
-
-		.tooltip {
-			position: relative;
-			display: inline-block;
-			cursor: default;
-		}
-
-		.tooltip .tooltiptext {
-			visibility: hidden;
-			padding: 0.25em 0.5em;
-			background-color: black;
-			color: #fff;
-			text-align: center;
-			border-radius: 0.25em;
-			white-space: nowrap;
-			
-			/* Position the tooltip */
-			position: absolute;
-			z-index: 1;
-			top: 100%;
-			left: 100%;
-			transition-property: visibility;
-			transition-delay: 0s;
-		}
-
-		.tooltip:hover .tooltiptext {
-			visibility: visible;
-			transition-delay: 0.3s;
-		}
-
-		nav {
-			background-color: rgb(0, 0, 0);
-			/* color: blue; */
-			/* text-align: center; */
-		}
-
-		.navbar .nav-item {
-			margin-right: 25px;
-			margin-left: 25px;
-		}
-
-        #right {
-            float: right;
-            margin-right: 50px;
-        }
-
-		.logoutbtn {
-            margin-top: 14px;
-            scale: 1.2;
-			border-radius: 10%;
-			/* float: right; */
-        }
-
-        .logoutbtn:hover {
-            cursor: pointer;
-            color: red;
-        }
-
-		.desctext {
-			/* float:left; */
-			color: white;
-			/* margin-left: 50px; */
-			margin-top: 20px;
-			background-color: rgb(1, 69, 196, 0.1);
-			padding: 20px;
-			border-radius: 10%;
-			width: auto;
-		}
-
-		/*************************
-			CAROUSEL
-		*************************/
-
-		.carousel .carousel-inner {
-			height: 550px;
-			margin-top: 20px;
-			margin-bottom: 100px;
-			background: #faf9f9;
-			border:1px solid rgb(94, 104, 104);
-			
-		}
-
-		.carousel-control.right,
-		.carousel-control.left {
-			background-image: none;
-		}
-
-		.control-icon {
-			color: #393939;
-			text-shadow: none;
-		}
-
-		.carousel-inner {
-			position: relative;
-			height: 300px;
-		}
-
-		.carousel-img {
-			/* width: 200px;
-			height: 400px; */
-			background-size: cover;
-			position: relative;
-			/* top: 50px; */
-			transform: translateY(5%);
-		}
-
-		.cat-title {
-			text-shadow: none;
-		}
-
-		.item{
-			position: relative;
-		}
-
-		.navbar-fixed-top {
-			position: fixed;
-			right: 0;
-			left: 0;
-			z-index: 1030;
-			top: 0;
-		}
-	</style>
-
  	<!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> (no github icon so...) -->
 	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
 
diff --git a/HTML/newCalEvent.html b/HTML/newCalEvent.html
index 39d728c..6e9c108 100644
--- a/HTML/newCalEvent.html
+++ b/HTML/newCalEvent.html
@@ -18,84 +18,6 @@
     <link href="https://fonts.googleapis.com/css2?family=Cinzel&family=Rajdhani:wght@300&family=Share+Tech+Mono&display=swap" rel="stylesheet">
 
     <style>
-        /* SUBMIT BUTTON START */
-        .submitButton{
-            position: relative;
-            background-color: black;
-            border-radius: 4em;
-            font-size: 16px;
-            color: white;
-            padding: 0.8em 1.8em;
-            cursor:pointer;
-            user-select:none;
-            text-align: center;
-            text-decoration: none;
-            cursor: pointer;
-            transition-duration: 0.4s;
-            /* margin-left: 65px; */
-            margin-left: 30px;
-            -webkit-transition-duration: 0.4s; /* Safari */
-        }
-
-        .submitButton:hover {
-            transition-duration: 0.1s;
-            background-color: #3A3A3A;
-        }
-
-        .submitButton:after {
-            content: "";
-            display: block;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            width: 100%;
-            height: 100%;
-            opacity: 0;
-            transition: all 0.5s;
-            box-shadow: 0 0 10px 40px white;
-        }
-
-        .submitButton:active:after {
-            box-shadow: 0 0 0 0 white;
-            position: absolute;
-            border-radius: 4em;
-            left: 0;
-            top:0;
-            opacity: 1;
-            transition: 0s;
-        }
-
-        .submitButton:active {
-            top: 1px;
-        }
- 
-
-        .btnActive {
-			color: #ffffff;
-			background-color: #ff1117;
-			font-size: 13px;
-			border: 1px solid #000000;
-			border-radius: 9px;
-			padding: 10px 40px;
-			letter-spacing: 1px;
-			cursor: pointer;
-            margin-left: 40px;
-		}
-
-		.btnCanceled {
-			color: #ffffff;
-			background-color: #7a7a7a;
-			font-size: 13px;
-			border: 1px solid #000000;
-			border-radius: 9px;
-			padding: 10px 40px;
-			letter-spacing: 1px;
-			cursor: pointer;
-            margin-left: 40px;
-		}
-        /* SUBMIT BUTTON END */
-        
         .time input {
             width: 30px;
             text-align: center;
diff --git a/HTML/premium.html b/HTML/premium.html
index 4b40b06..38c6755 100644
--- a/HTML/premium.html
+++ b/HTML/premium.html
@@ -22,133 +22,7 @@
         <link href="https://fonts.googleapis.com/css2?family=Cinzel&family=Rajdhani:wght@300&family=Rouge+Script&family=Share+Tech+Mono&display=swap" rel="stylesheet">
     </span>
 
-    <style>
-        html { width:100%; height:100%; margin:0; padding:0; }
-
-        body {
-            /* background-color: rgb(4, 4, 85); */
-            background-color: rgb(38, 39, 49);
-            width:100%; height:100%; margin:0; padding:0;
-            color: white;
-        }
-		.navbar .nav-item {
-			margin-right: 25px;
-			margin-left: 25px;
-		}
-
-        #right {
-            float: right;
-            margin-right: 50px;
-        }
-
-        #right {
-            float: right;
-            margin-right: 50px;
-        }
-
-
-        h1 {
-            /* color: rgb(0, 74, 235); */
-            /* outline-style: dotted; */
-            text-align: center;
-            margin-right: 1%;
-            margin-left: 1%;
-        }
-
-        h2 {
-            color: rgb(255, 255, 255);
-            text-align: center;
-        }
-
-        p {
-            color: white;
-            margin-left: 1%;
-        }
-
-        h3 {
-            margin-left: 1%;
-        }
-
-		.desctext {
-			color: white;
-			margin-top: 20px;
-			background-color: rgb(1, 69, 196, 0.1);
-			padding: 10px;
-			border-radius: 10%;
-            border-style: groove;
-            border-color: rgb(255, 255, 255, 0.6);
-			width: auto;
-		}
-
-        .navbar-fixed-top {
-			position: fixed;
-			right: 0;
-			left: 0;
-			z-index: 1030;
-			top: 0;
-		}
-
-        .picon {
-            border-radius: 50%;
-            background-color: rgba(255, 204, 51, 0.2);
-            box-shadow: 0 0 12px 7px rgba(252, 200, 28, 0.2);
-        }
-    </style>
-
-<!-- BUTTONS HERE -->
-    <style>
-        .logoutbtn {
-            margin-top: 14px;
-            scale: 1.2;
-			border-radius: 10%;
-        }
-        .logoutbtn:hover {
-            cursor: pointer;
-            color: red;
-        }
-
-        .loginbtn {
-            margin-top: 14px;
-            scale: 1.2;
-			border-radius: 10%;
-		}
-		.loginbtn:hover {
-			color: #377aea;
-		}
-
-		.fivedollarbtn {
-			color: #00f2f2;
-			font-size: 23px;
-			border: 1px solid #2fffe0;
-			border-radius: 10px;
-			padding: 10px 30px;
-			letter-spacing: 1px;
-			cursor: pointer
-		}
-		.fivedollarbtn:hover {
-			color: #000000;
-			background-color: #00f2f2;
-		}
-
-        .tendollarbtn {
-			color: #30f200;
-			font-size: 23px;
-			border: 1px solid #50f801;
-			border-radius: 10px;
-			padding: 10px 30px;
-			letter-spacing: 1px;
-			cursor: pointer
-		}
-		.tendollarbtn:hover {
-			color: #000000;
-			background-color: #30f200;
-		}
-
-        h1 {
-            font-family: 'Share Tech Mono', monospace;
-        }
-    </style>
-
+    <link rel="stylesheet" type="text/css" href="/CSS/premium.css">
 
     <script>
         window.onload = () => {
diff --git a/HTML/team.html b/HTML/team.html
index 5a2f2b1..f07d1c0 100644
--- a/HTML/team.html
+++ b/HTML/team.html
@@ -19,150 +19,10 @@
 
 	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
 
+    <link rel="stylesheet" type="text/css" href="/CSS/team.css">
+
     <title>Selmer Bot Directory</title>
 
-    <style>
-        body {
-            /* background-color: black; */
-            /* background-image: linear-gradient(140deg, #EADEDB 0%, #BC70A4 50%, #BFD641 75%); */
-            background-image: linear-gradient(140deg, #4a12e4 10%, #13206d 50%, #41d6d6 75%);
-            background-repeat:no-repeat;
-            background-size: 100vw 100vh;
-        }
-
-        .webBtn {
-            margin: 50px;
-            font-family:'Comic Sans MS';
-            font-size:20px;
-            line-height:20px;
-            color:#ffffff;
-            background-color:#4d4d4d;
-            padding:20px;
-            border-radius:10px;
-        }
-
-        .webBtn:hover {
-            color: #000000;
-            background-color: #9b9999;
-        }
-
-        .loginbtn {
-            margin-top: 14px;
-            scale: 1.2;
-			border-radius: 10%;
-		}
-		.loginbtn:hover {
-			color: #377aea;
-		}
-
-		.tooltip {
-			position: relative;
-			display: inline-block;
-			cursor: default;
-		}
-
-		.tooltip .tooltiptext {
-			visibility: hidden;
-			padding: 0.25em 0.5em;
-			background-color: black;
-			color: #fff;
-			text-align: center;
-			border-radius: 0.25em;
-			white-space: nowrap;
-			
-			/* Position the tooltip */
-			position: absolute;
-			z-index: 1;
-			top: 100%;
-			left: 100%;
-			transition-property: visibility;
-			transition-delay: 0s;
-		}
-
-		.tooltip:hover .tooltiptext {
-			visibility: visible;
-			transition-delay: 0.3s;
-		}
-
-		nav {
-			/* background-color: rgb(0, 0, 0); */
-            background: linear-gradient(0deg, #06075f00 10%, #13206d 50%, #41d6d6 95%);
-			/* color: blue; */
-			/* text-align: center; */
-		}
-
-		.navbar .nav-item {
-			margin-right: 25px;
-			margin-left: 25px;
-		}
-
-        #right {
-            float: right;
-            margin-right: 50px;
-        }
-
-		.logoutbtn {
-            margin-top: 14px;
-            scale: 1.2;
-			border-radius: 10%;
-			/* float: right; */
-        }
-
-        .logoutbtn:hover {
-            cursor: pointer;
-            color: red;
-        }
-
-        .headerText {
-            color: white;
-            font-family: 'Rajdhani', sans-serif;
-        }
-
-        h1 {
-            color: rgb(150, 148, 148);
-            -webkit-text-stroke-width: 0.3px;
-            -webkit-text-stroke-color: white;
-        }
-
-        /* h3 {
-            margin-right: 20%;
-            margin-left: 20%;
-            color: white;
-            text-align: center;
-            line-height: 40px;
-        } */
-
-        .abtme {
-            text-align: center;
-            background-color: rgba(0, 0, 0, 0.212);
-            margin-right: 20%;
-            margin-left: 20%;
-            margin-top: 20px;;
-            color: white;
-            text-align: center;
-            line-height: 40px;
-        }
-
-        .inpbox {
-            width: 250px;
-            height: 100px;
-            border-radius: 20px;
-            background-color: rgb(200, 200, 202);
-        }
-
-        .sbtn {
-            margin: 20px;
-            color: #ffffff;
-			background: linear-gradient(0deg, #5f060600 10%, #6d1335 50%, #d64141 95%);
-			background: linear-gradient(0deg, #d64141 10%, #6d1335 50%, #5f060600 95%);
-			font-size: 19px;
-			border: 1px solid #2d63c8;
-			border-radius: 30px;
-			padding: 15px 50px;
-			cursor: pointer;
-        }
-    </style>
-
     <script>
         /*
             Get the sessionId and the suggestion, send it to the back end where you can get the userId and attach it to the suggestion,
diff --git a/main.js b/main.js
index 38b05aa..d938c2e 100644
--- a/main.js
+++ b/main.js
@@ -55,6 +55,7 @@ async function getJSONResponse(body) {
 const app = express();
 // app.use(express.json());
 app.use(express.static('/assets'));
+app.use('/CSS', express.static('./CSS'));
 app.use(bodyParser.urlencoded({ extended: true }));
 
 
@@ -296,6 +297,15 @@ app.get('/team', async (req, res) => {
 
 //#endregion
 
+
+//#region INCLUDES
+
+app.get('/cal.css', async (req, res) => {
+	return res.sendFile('cal.css', { root: 'CSS' });
+})
+
+//#endregion
+
 app.post("/suggestion", async (req, res)=> {
 	if (req.headers.sessionid == 'null') {
 		return res.sendStatus(401);
diff --git a/scripts/scripts.js b/scripts/scripts.js
new file mode 100644
index 0000000..e69de29