--- a
+++ b/templates/userlog.html
@@ -0,0 +1,91 @@
+<!DOCTYPE html>
+<html>
+<head>
+    <title>Intracranial Hemorrhage Detection - Login</title>
+    <style>
+        body {
+            font-family: Arial, sans-serif;
+            background-image: url("https://miro.medium.com/v2/resize:fit:1400/1*LZkjLWBOrXLCtQgOuS_LDw.jpeg"); /* Replace with the URL of your background image */
+            background-size: cover;
+            background-position: center;
+            background-repeat: no-repeat;
+        }
+        
+        h1 {
+            text-align: center;
+            margin-top: 100px;
+            color: #f90000;
+        }
+        
+        form {
+            width: 500px;
+            margin: 50px auto;
+            padding: 20px;
+            background-color: #fff;
+            border-radius: 10px;
+            box-shadow: 0px 0px 10px #ccc;
+        }
+        
+        label {
+            display: block;
+            font-size: 18px;
+            margin-top: 20px;
+            color: #666;
+        }
+        
+        input[type="text"], input[type="password"] {
+            width: 100%;
+            padding: 10px;
+            margin-top: 5px;
+            margin-bottom: 20px;
+            font-size: 16px;
+            border-radius: 5px;
+            border: 1px solid #ccc;
+            box-sizing: border-box;
+        }
+        
+        .btn {
+            display: inline-block;
+            padding: 10px 20px;
+            font-size: 16px;
+            font-weight: bold;
+            text-align: center;
+            text-decoration: none;
+            background-color: #666;
+            color: #fff;
+            border-radius: 5px;
+            transition: background-color 0.2s ease;
+        }
+        
+        .btn:hover {
+            background-color: #555;
+        }
+        
+        .medical-image {
+            display: block;
+            margin: 0 auto;
+            max-width: 100%;
+            height: auto;
+            border-radius: 10px;
+            box-shadow: 0px 0px 10px #ccc;
+            margin-top: 50px;
+            margin-bottom: 50px;
+        }
+    </style>
+</head>
+<body>
+    <h1>Intracranial Hemorrhage Detection</h1>
+    <form method="POST" action="{{url_for('image')}}">
+        <label for="name">Name:</label>
+        <input type="text" name="name" id="name" required>
+        <br><br>
+        <label for="password">Password:</label>
+        <input type="password" name="password" id="password" required>
+        <br><br>
+        <div class="checkbox mb-3">
+            <a class="btn btn-sm btn-secondary" href="{{ url_for('trick') }}">Login</a>
+         </div>
+    </form>
+    <img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTbnFVZssZDW2uXPg-1yf9QqVlWPPn5qog9kcZPwBPJNaWyO-x9z7tu40p6DKMOYjcFQyQ&usqp=CAU" class="medical-image"> <!-- Replace with the URL of your medical image -->
+</body>
+</html>