diff --git a/ImageBoardServerApp/ImageBoardServerApp.csproj b/ImageBoardServerApp/ImageBoardServerApp.csproj
index 5db28fa..5b8d985 100644
--- a/ImageBoardServerApp/ImageBoardServerApp.csproj
+++ b/ImageBoardServerApp/ImageBoardServerApp.csproj
@@ -15,17 +15,14 @@
         <IncludeAssets>runtime; build; native; contentfiles; analyzers; buildtransitive</IncludeAssets>
       </PackageReference>
       <PackageReference Include="Microsoft.EntityFrameworkCore.Sqlite" Version="6.0.13" />
-      <PackageReference Include="Radzen.Blazor" Version="4.4.0" />
+      <PackageReference Include="Radzen.Blazor" Version="4.10.4" />
       <PackageReference Include="Swashbuckle.AspNetCore" Version="6.4.0" />
     </ItemGroup>
 
     <ItemGroup>
       <Folder Include="Data\Migrations" />
-      <Folder Include="wwwroot\img\dynamic\comment\art" />
       <Folder Include="wwwroot\img\dynamic\comment\au" />
-      <Folder Include="wwwroot\img\dynamic\comment\e" />
       <Folder Include="wwwroot\img\dynamic\comment\tec" />
-      <Folder Include="wwwroot\img\dynamic\comment\vg" />
       <Folder Include="wwwroot\img\dynamic\op\art" />
       <Folder Include="wwwroot\img\dynamic\op\au" />
       <Folder Include="wwwroot\img\dynamic\op\e" />
diff --git a/ImageBoardServerApp/Pages/Accounts/Login.razor b/ImageBoardServerApp/Pages/Accounts/Login.razor
index 534c231..4f960a8 100644
--- a/ImageBoardServerApp/Pages/Accounts/Login.razor
+++ b/ImageBoardServerApp/Pages/Accounts/Login.razor
@@ -5,39 +5,58 @@
 @inject AuthenticationStateProvider authStateProvider
 @inject NavigationManager navManager
 
-<h3>Login to bulletbroards</h3>
-<div>
+
+<h3 class="headLogin">Login to bulletbroards</h3>
+<div class="login">
     <form>
-        <div>
-            <label for="email">Email:</label>
-            <input type="email" id="email" @bind="Email" />
-        </div>
-        <div>
-            <label for="password">Password:</label>
-            <input type="password" id="password" @bind="Password" />
-        </div>
-        <a @onclick="login" href="javascript:void(0)">[Login]</a>
+        <RadzenTemplateForm TItem="Model" Data="model" Submit=@login>
+                <RadzenStack Gap="1rem" Class="gapeing">
+                    <RadzenFormField Text="Email" Variant="@vari">
+                        <ChildContent>
+                            <RadzenTextBox Name="Email" @bind-Value=@model.Email />
+                        </ChildContent>
+                        <Helper>
+                            <RadzenRequiredValidator Component="Email" Text="First name is required." />
+                        </Helper>
+                    </RadzenFormField>
+                    <RadzenFormField Text="Password" Variant="@vari">
+                        <ChildContent>
+                            <RadzenTextBox Name="Password" @bind-Value=@model.Password />
+                        </ChildContent>
+                        <Helper>
+                            <RadzenRequiredValidator Component="Password" Text="Your Password" />
+                        </Helper>
+                    </RadzenFormField>
+                    <RadzenButton ButtonType="ButtonType.Submit" Text="Login" ></RadzenButton>
+                </RadzenStack>
+            </RadzenTemplateForm>
     </form>
 </div>
 
-<Register></Register>
 @code {
-    private string Email { get; set; }
-    private string Password { get; set; }
+    private Variant vari = Variant.Outlined;
 
     private bool verified;
+    
+    class Model
+    {
+        public string Email { get; set; }
+        public string Password { get; set; }
+    }
+
+    Model model = new Model();
 
     private async Task login()
     {
         Console.WriteLine("loggin you in...");
-        var user = await UsersRepository.getUserByEmailRawAsync(Email);
+        var user = await UsersRepository.getUserByEmailRawAsync(model.Email);
         if (user == null)
         {
             await js.InvokeVoidAsync("alert", "User does not exist");
             verified = false;
             return;
         }
-        verified = BCrypt.Net.BCrypt.Verify(Password, user.Password);
+        verified = BCrypt.Net.BCrypt.Verify(model.Password, user.Password);
         if (verified)
         {
             verified = true;
diff --git a/ImageBoardServerApp/Pages/Accounts/Login.razor.css b/ImageBoardServerApp/Pages/Accounts/Login.razor.css
new file mode 100644
index 0000000..1b050a0
--- /dev/null
+++ b/ImageBoardServerApp/Pages/Accounts/Login.razor.css
@@ -0,0 +1,11 @@
+.headLogin{
+    text-align: center;
+    -webkit-text-size-adjust: auto;
+}
+.login{
+    text-align: center;
+    align-items:center;
+    font-style: unset;}
+.gaping{
+    alignment: left;
+}
\ No newline at end of file
diff --git a/ImageBoardServerApp/Pages/Accounts/Register.razor b/ImageBoardServerApp/Pages/Accounts/Register.razor
index a6868ef..6ee203a 100644
--- a/ImageBoardServerApp/Pages/Accounts/Register.razor
+++ b/ImageBoardServerApp/Pages/Accounts/Register.razor
@@ -20,6 +20,10 @@
     </form>
 </div>
 <span>By registering you confirm that you are atleast 18 years of age.</span>
+
+
+
+
 @code {
     private string Email { get; set; }
     private string Password { get; set; }
diff --git a/ImageBoardServerApp/Pages/Accounts/Register.razor.css b/ImageBoardServerApp/Pages/Accounts/Register.razor.css
new file mode 100644
index 0000000..e69de29
diff --git a/ImageBoardServerApp/Pages/_Host.cshtml b/ImageBoardServerApp/Pages/_Host.cshtml
index 4b19541..8811430 100644
--- a/ImageBoardServerApp/Pages/_Host.cshtml
+++ b/ImageBoardServerApp/Pages/_Host.cshtml
@@ -15,7 +15,8 @@
     <link href="css/site.css" rel="stylesheet"/>
     <link href="ImageBoardServerApp.styles.css" rel="stylesheet"/>
     <link rel="icon" type="image/png" href="/img/static/logo.png"/>
-    <!--<link rel="stylesheet" href="_content/Radzen.Blazor/css/material-dark.css"> -->
+    <link rel="stylesheet" href="_content/Radzen.Blazor/css/material-base.css">
+    <script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>
     <component type="typeof(HeadOutlet)" render-mode="ServerPrerendered"/>
 </head>
 <body>