diff --git a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Authentication/LoginForm.razor b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Authentication/LoginForm.razor
index e13035e..f0f15d0 100644
--- a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Authentication/LoginForm.razor
+++ b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Authentication/LoginForm.razor
@@ -51,9 +51,9 @@
     
     @* Buttons *@
     <div class="flex flex-col gap-4">
-        <button type="submit" class="form-button">Sign in</button>
+        <button type="submit" class="form-button TransitionMe">Sign in</button>
         <p>Don't have an account with us?</p>
-        <a href="register" class="form-button">Register</a>
+        <a href="register" class="form-button TransitionMe">Register</a>
     </div>
 </EditForm>
 
diff --git a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Chat/ChatInput.razor b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Chat/ChatInput.razor
index 3120ace..d0a7dad 100644
--- a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Chat/ChatInput.razor
+++ b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/Chat/ChatInput.razor
@@ -3,11 +3,11 @@
         <div class="max-w-4xl flex items-start">
             <InputText
                 @bind-value="message"
-                id="Input.ChatMessage"
+                id="InputChatMessage"
                 type="text"
                 placeholder="Type your message..."
                 class="flex-1 p-2 border rounded-full focus:outline-none focus:border-purple-700"/>
-            <button type="submit" disabled="@(SubmitDisabled)" class="p-2 text-white bg-purple-600 rounded-full hover:bg-purple-700 transition ml-4">
+            <button type="submit" disabled="@(SubmitDisabled)" class="p-2 text-white bg-purple-600 rounded-full TransitionMe ml-4">
                 <svg class="w-6 h-6" fill="none" stroke="var(--mFg)" viewBox="0 0 24 24">
                     <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                           d="M12 19l9 2-9-18-9 18 9-2zm0 0v-8"/>
diff --git a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/HomeComponents/SignupCta.razor b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/HomeComponents/SignupCta.razor
index 952ff1c..2c8a842 100644
--- a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/HomeComponents/SignupCta.razor
+++ b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/Components/HomeComponents/SignupCta.razor
@@ -6,16 +6,16 @@
                 <circle cx="512" cy="512" r="512" fill="url(#759c1415-0410-454c-8f7c-9a820de03641)" fill-opacity="0.7" />
                 <defs>
                     <radialGradient id="759c1415-0410-454c-8f7c-9a820de03641">
-                        <stop stop-color="#7775D6" />
-                        <stop offset="1" stop-color="#E935C1" />
+                        <stop stop-color="var(--accent)" />
+                        <stop offset="1" stop-color="var(--accent)" />
                     </radialGradient>
                 </defs>
             </svg>
             <div class="mx-auto max-w-md text-center lg:py-20">
                 <h2 class="text-balance text-3xl font-semibold tracking-tight text-white sm:text-4xl">More time with the series you love.</h2>
-                <p class="mt-6 text-pretty text-lg/8 text-gray-300">Spreeview keeps you up-to-date on every new release, tailored to your preferences with intelligent recommendations based on what you review</p>
+                <p class="mt-6 text-pretty text-lg/8 text-white bg-gray">Spreeview keeps you up-to-date on every new release, tailored to your preferences with intelligent recommendations based on what you review</p>
                 <div class="mt-10 flex items-center justify-center gap-x-6">
-                    <a href="/register" class="rounded-md bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm hover:bg-gray-100 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-white">Get started</a>
+                    <a href="/register" class="rounded-md bg-white px-3.5 py-2.5 text-sm font-semibold text-gray-900 shadow-sm TransitionMe">Get started</a>
                 </div>
             </div>
 @*             <div class="relative mt-16 h-80 lg:mt-8">
diff --git a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/wwwroot/css/CustCss.css b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/wwwroot/css/CustCss.css
index 27c972a..ba114eb 100644
--- a/Spreeview/SpreeviewFrontend/SpreeviewFrontend/wwwroot/css/CustCss.css
+++ b/Spreeview/SpreeviewFrontend/SpreeviewFrontend/wwwroot/css/CustCss.css
@@ -66,10 +66,7 @@ img{
 [class*="text-purple"]{ color: var(--accent); }
 
 
-
-    [class*=bg-black] {
-        background-color: var(--mFg);
-    }
+[class*=bg-black] { background-color: var(--mFg); }
 [class*=bg-white] { background-color: var(--mBg); }
 
 [class*=text-white] { color: var(--mBg); }
@@ -107,15 +104,19 @@ button[class*=hover:bg-gray]:hover{
 /*form */
 [class*=form-button] { background-color:var(--accent); }
 
-/*TODO chat border*/
-[class*=focus:border-purple]:focus { border: var(--accent) dashed 10px 10px 10px !important; }
+/*chat border -- 'Input.ChatMessage' fullstop broke CSS selector */
+#InputChatMessage{ color:var(--accent); }
+#InputChatMessage:focus { border: var(--accent) solid 1px !important; }
 
 
 /*nav*/
-nav [class*=TransitionMe]{ color:var(--oBg); background-color:var(--accent); }
-    nav [class*=TransitionMe]:hover {
-        color: var(--oFg);
-        background-color: var(--container);
-        transition: color linear 1s;
-        transition: background-color linear 1s;
-    }
\ No newline at end of file
+* [class*=TransitionMe]{ color:var(--oBg); background-color:var(--accent); }
+* [class*=TransitionMe]:hover {
+    color: var(--oFg);
+    background-color: var(--container);
+    transition: color linear 1s;
+    transition: background-color linear 1s;
+}
+
+/*for bottom div*/
+*[class*=bg-gray] { background-color: var(--oFg); }
\ No newline at end of file