diff --git a/frontend/login.html b/frontend/login.html
index 5b1f2eb..34b8572 100644
--- a/frontend/login.html
+++ b/frontend/login.html
@@ -1,8 +1,8 @@
 
 
-
-
-    
     
-
+  
 
 
 
diff --git a/frontend/src/assets/main.css b/frontend/src/assets/main.css
index c2400cf..55e6d15 100644
--- a/frontend/src/assets/main.css
+++ b/frontend/src/assets/main.css
@@ -2,80 +2,3 @@ body {
    background-color: rgb(53, 25, 60);
    margin:0;
 }
-
-.logBoxCenterer {
-  position: absolute;
-  width: 100%;
-  height:  100%;
-  display: flex;
-  align-items: center;
-  justify-content: center; 
-  overflow: hidden;
-}
-
-.loginBox {
-  background-color: rgb(24,24,24);
-  position : absolute;
-  width: 400px;
-  display:flex;
-  justify-content: center;
-  padding: 40px;
-  border-radius: 20px;
-  box-shadow:0 5px 25px #000000;
-  
-}
-.form {
-  position:relative;
-  width:100%;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items:center;
-  gap: 15px;
-}
-
-
-.inputBox input {
-  width:100%;
-  background:rgb(255, 0 255);
-  border: none;
-  margin-right: 50px;
-  padding-left: 10px;
-  padding-top:10px;
-  padding-bottom:10px;
-  outline:none;
-  border-radius: 4px;
-  font-size:1.35em;
-}
-
-.inputBox p{
-  position:relative;
-  z-index: 100;
-  font-family:sans-serif ; 
-  color:rgb(239,60,168);
-  transition:0.5;
-
-}
-
-.register{
-  color:rgb(239,60,168);
-  width: 100%;
-  align-items:center;
-  display:flex;
-  justify-content: center;
-  cursor: pointer;
-}
-
-input[type = "submit"] {
-  background-color: rgb(239,60,168);
-  cursor: pointer;
-  padding:10px;
-  font-size:1.35em;
-}
-
-input[type = "submit"]:active{
-  opacity:0.8;
-
-}
-
-
diff --git a/frontend/src/assets/styleLogin.css b/frontend/src/assets/styleLogin.css
new file mode 100644
index 0000000..ea883d8
--- /dev/null
+++ b/frontend/src/assets/styleLogin.css
@@ -0,0 +1,77 @@
+
+.logBoxCenterer {
+  position: absolute;
+  width: 100%;
+  height:  100%;
+  display: flex;
+  align-items: center;
+  justify-content: center; 
+  overflow: hidden;
+}
+
+.loginBox {
+  background-color: rgb(24,24,24);
+  position : absolute;
+  width: 400px;
+  display:flex;
+  justify-content: center;
+  padding: 40px;
+  border-radius: 20px;
+  box-shadow:0 5px 25px #000000;
+  
+}
+.form {
+  position:relative;
+  width:100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items:center;
+  gap: 15px;
+}
+
+
+.inputBox input {
+  width:100%;
+  background:rgb(255, 0 255);
+  border: none;
+  margin-right: 50px;
+  padding-left: 10px;
+  padding-top:10px;
+  padding-bottom:10px;
+  outline:none;
+  border-radius: 4px;
+  font-size:1.35em;
+}
+
+.inputBox p{
+  position:relative;
+  z-index: 100;
+  font-family:sans-serif ; 
+  color:rgb(239,60,168);
+  transition:0.5;
+
+}
+
+.register{
+  color:rgb(239,60,168);
+  width: 100%;
+  align-items:center;
+  display:flex;
+  justify-content: center;
+  cursor: pointer;
+}
+
+input[type = "submit"] {
+  background-color: rgb(239,60,168);
+  cursor: pointer;
+  padding:10px;
+  font-size:1.35em;
+}
+
+input[type = "submit"]:active{
+  opacity:0.8;
+
+}
+
+
diff --git a/frontend/src/main.js b/frontend/src/main.js
index 977d357..cd29b9e 100644
--- a/frontend/src/main.js
+++ b/frontend/src/main.js
@@ -1,5 +1,5 @@
 import './assets/main.css'
-
+import './assets/styleLogin.css'
 import 'vue3-toastify/dist/index.css';
 
 import { createApp } from 'vue'