diff --git a/templates/_base.html b/templates/_base.html
index e11ed62..be036c5 100644
--- a/templates/_base.html
+++ b/templates/_base.html
@@ -12,6 +12,9 @@
           integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
 
     <link rel="stylesheet" href="{% static 'css/style.css' %}">
+    {% block style %}
+
+    {% endblock %}
 
     <title>{% block page_title %}{% endblock %}</title>
 </head>
diff --git a/templates/registration/login.html b/templates/registration/login.html
index 5076bcc..59337e1 100644
--- a/templates/registration/login.html
+++ b/templates/registration/login.html
@@ -1,16 +1,43 @@
 {% extends '_base.html' %}
 
+{% load static %}
+
 {% load crispy_forms_tags %}
 
 {% block page_title %}Login{% endblock %}
 
+{% block style %}
+    <link rel="stylesheet" href="{% static 'css/login.css' %}">
+{% endblock %}
+
 {% block content %}
-    <h1>Login</h1>
-    <form action="" method="post">
-        {% csrf_token %}
-        {{ form|crispy }}
-        <button type="submit" class="btn btn-success">Login</button>
-    </form>
-    <br>
-    <p><a href="{% url 'password_reset' %}">Forgot password?</a> | <a href="{% url 'signup' %}">Create an account?</a></p>
+    <div class="d-flex justify-content-center mt-5" dir="rtl">
+        <div class="col-xl-3 col-lg-4 col-md-5 col-sm-5 col-xs-6 bg-white m-3 m-sm-5 border rounded px-4 pt-4 pb-3 shadow">
+            <form method="post">
+                <h1 class="text-center">ورود</h1>
+                {% csrf_token %}
+                {{ form|crispy }}
+                {#                <div class="form-group">#}
+                {#                    <label for="emailAddress" class="m-2">ایمیل:</label>#}
+                {#                    <input type="email" class="form-control" id="emailAddress" placeholder="example@gmail.com">#}
+                {#                </div>#}
+                {#                <div class="form-group">#}
+                {#                    <label for="password" class="m-2">رمز عبور:</label>#}
+                {#                    <input type="password" class="form-control" id="password" placeholder="">#}
+                {#                </div>#}
+                <div class="d-flex justify-content-between align-items-center">
+                    <div class="mt-2">
+                        <a class="text-decoration-none" href="{% url 'password_reset' %}">فراموشی رمز عبور</a>
+                    </div>
+                </div>
+                <button type="submit" class="btn btn-success mt-3 w-100">ورود</button>
+                <div class="line-with-middle-sep">
+                  <span>
+                    یا
+                  </span>
+                </div>
+                <a href="{% url 'signup' %}" class="btn btn-primary mt-2 mb-3 w-100">ثبت نام</a>
+            </form>
+        </div>
+    </div>
 {% endblock %}
\ No newline at end of file