diff --git a/django_project/settings.py b/django_project/settings.py
index 85d47deb..39c27721 100644
--- a/django_project/settings.py
+++ b/django_project/settings.py
@@ -25,7 +25,8 @@
 # SECURITY WARNING: don't run with debug turned on in production!
 DEBUG = True
 
-ALLOWED_HOSTS = [".replit.dev", ".replit.app"]
+ALLOWED_HOSTS = [".replit.dev", ".replit.app",
+                 "127.0.0.1"]
 CSRF_TRUSTED_ORIGINS = ["https://*.replit.dev", "https://*.replit.app"]
 
 # Application definition
diff --git a/django_project/views.py b/django_project/views.py
index f9042b4c..ab63a7e3 100644
--- a/django_project/views.py
+++ b/django_project/views.py
@@ -1,17 +1,36 @@
 import requests
 from django.shortcuts import render
+from django.http import HttpResponse
 
-def home(request):
-  # USING APIS => Example 1
-  response = requests.get('https://api.github.com/events')
-  data = response.json()
-  result = data[0]["repo"]
+def home (request):
+    
+    response = requests.get('https://dog.ceo/api/breeds/image/random', timeout=5)
+    data = response.json()
+    random_dog_image = data['message']
 
-  # Example 2
-  reponse2 = requests.get('https://dog.ceo/api/breeds/image/random')
-  data2 = reponse2.json()
-  result2 = data2["message"]
+    feedback = None  # Initializing feedback variable
 
+    breed_name = request.GET.get('breed_name')
 
-  
-  return render(request, 'templates/index.html', {'result': result, 'result2': result2})
\ No newline at end of file
+    if breed_name:
+
+        url = f'https://api.thedogapi.com/v1/breeds/search?q={breed_name}'
+        breed_response = requests.get(url, timeout=5)
+        breed_data = breed_response.json()
+        breed_info = breed_data[0] if breed_data else None
+
+        if breed_info:
+            return render(request, 'templates/index.html', {'random_dog_image': random_dog_image, 'breed_info': breed_info})
+        else:
+            error_message = 'Breed information not found.'
+            return render(request, 'templates/index.html', {'random_dog_image': random_dog_image, 'error_message': error_message})
+
+    if request.method == 'POST':
+        user_guess = request.POST.get('user_guess').lower()
+        actual_breed = data['message'].split('/')[-2].replace('-', ' ')  
+        if user_guess == actual_breed.lower():
+            feedback = 'Correct guess!'
+        else:
+            feedback = f'Incorrect guess! The actual breed is {actual_breed}.'
+
+    return render(request, 'templates/index.html', {'random_dog_image': random_dog_image, 'feedback': feedback})
diff --git a/static/styles.css b/static/styles.css
index 530d510b..84428255 100644
--- a/static/styles.css
+++ b/static/styles.css
@@ -1,9 +1,13 @@
-body{
-  background: hotpink
+.container{
+  max-width: 700px;
+  margin: 0 auto;
+  padding: 20px;
+  background-color: burlywood;
+  border-radius: 5px;
 }
 
 img{
-  width: 100px;
-  height: 100px;
+  width: 130px;
+  height: 130px;
   border-radius: 9999;
-}
+}
\ No newline at end of file
diff --git a/templates/index.html b/templates/index.html
index b0f60817..5d6c3223 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,22 +1,42 @@
-{% load static%}
+{% load static %}  
 <!DOCTYPE html>
 <html lang="en">
 <head>
-  <meta charset="UTF-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <link rel="stylesheet" href="{% static 'styles.css' %}" />
-   <!-- <link rel="stylesheet" href="/static/styles.css" /> -->
-  <title>Document</title>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <link rel="stylesheet" href="{% static 'styles.css' %}" />
+    <title>Random Dog Image, Guess the Breed, and Breed Information</title>
 </head>
 <body>
-  <h1>Hello, My name is Evans </h1>
+    <div class="container">
+        <h1>Random Dog Image</h1>
+        <img src="{{ random_dog_image }}" alt="Random Dog">
 
-  {{result}}
+        <h2>Guess the Breed</h2>
+        <form method="post">
+            {% csrf_token %}
+            <label for="user_guess">Enter your guess:</label>
+            <input type="text" id="user_guess" name="user_guess">
+            <button type="submit">Submit</button>
+        </form>
 
-  <h1>Random Pet</h1>
-{{result2}}
-  <img src={{result2}} alt="random pet" />
-  
+        {% if feedback %}
+            <p>{{ feedback }}</p>
+        {% endif %}
+    </div>
+
+    {% if breed_info %}
+    <div class="breed-info-container">
+        <h2>{{ breed_info.name }}</h2>
+        <p><strong>Temperament:</strong> {{ breed_info.temperament }}</p>
+        <p><strong>Size:</strong> {{ breed_info.size }}</p>
+        <p><strong>Lifespan:</strong> {{ breed_info.life_span }}</p>
+
+    </div>
+    {% else %}
+    <div class="breed-info-container">
+        <p>{{ error_message }}</p>
+    </div>
+    {% endif %}
 </body>
-</html>
\ No newline at end of file
+</html>
