diff --git a/src/Images/background.jpg b/src/Images/background.jpg
new file mode 100644
index 0000000..7658555
Binary files /dev/null and b/src/Images/background.jpg differ
diff --git a/src/Images/logoimg.jpg b/src/Images/logoimg.jpg
new file mode 100644
index 0000000..ef4439c
Binary files /dev/null and b/src/Images/logoimg.jpg differ
diff --git a/src/Images/postimg.jpg b/src/Images/postimg.jpg
new file mode 100644
index 0000000..f518409
Binary files /dev/null and b/src/Images/postimg.jpg differ
diff --git a/src/components/Login/index.jsx b/src/components/Login/index.jsx
index 14cdd33..1d2424c 100644
--- a/src/components/Login/index.jsx
+++ b/src/components/Login/index.jsx
@@ -2,7 +2,7 @@ import { useState } from "react";
 import useAuth from "../../hooks/useAuth";
 import axios from "axios";
 import { useLocation, useNavigate } from "react-router-dom";
-
+import backgroundImage from '../../Images/logoimg.jpg'
 const Signin = () => {
   const [data, setData] = useState({
     email: "",
@@ -47,11 +47,8 @@ const Signin = () => {
       <div className="flex justify-center h-screen">
         <div
           className="hidden bg-cover lg:block lg:w-2/3"
-          style={{
-            backgroundImage:
-              "url(https://images.unsplash.com/photo-1557992260-ec58e38d363c?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=774&q=80)",
-          }}
-        >
+          style={{ backgroundImage: `url('${backgroundImage}')` }}
+    >
           <div className="flex items-center h-full px-20 bg-gray-900 bg-opacity-40">
             <div>
               <h2 className="text-4xl font-bold text-white">TechTalk News</h2>
diff --git a/src/components/PostCard.jsx b/src/components/PostCard.jsx
index ea6a7bb..68c1d5c 100644
--- a/src/components/PostCard.jsx
+++ b/src/components/PostCard.jsx
@@ -2,6 +2,8 @@ import toast from "react-hot-toast";
 import { usePosts } from "../context/postContext";
 import { useNavigate } from "react-router-dom";
 import moment from "moment";
+import logoImg from "../Images/postimg.jpg"
+
 
 export function insertMedia(filePath) {
   var extension = filePath.split(".").pop().toLowerCase();
@@ -74,7 +76,7 @@ export function PostCard({ post }) {
         <div className="flex justify-between items-center py-4">
           <img
             className="w-12 rounded-full"
-            src="https://images.unsplash.com/photo-1585829365295-ab7cd400c167?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=870&q=80"
+            src={logoImg}
             alt="img Logo"
           />
           <div className="ml-3">
@@ -89,13 +91,13 @@ export function PostCard({ post }) {
         <div>
           {" "}
           <button
-            className="bg-gray-400   hover:bg-sky-400 text-sm px-2 py-1 rounded-sm"
+            className="bg-gray-300   hover:bg-sky-300 text-sm px-2 py-1 rounded-sm transition duration-500 hover:shadow-md hover:translate-y-4"
             onClick={() => navigate(`/posts/${post._id}`)}
           >
             Edit
           </button>{" "}
           <button
-            className="bg-gray-400  hover:bg-red-600 text-sm px-2 py-1 rounded-sm "
+            className="bg-gray-300  hover:bg-red-400 text-sm px-2 py-1 rounded-sm transition duration-500 hover:shadow-md hover:translate-y-4"
             onClick={() => handleDelete(post._id)}
           >
             Delete
diff --git a/src/components/PostCardUser.jsx b/src/components/PostCardUser.jsx
index f5fcc8c..b0f5b19 100644
--- a/src/components/PostCardUser.jsx
+++ b/src/components/PostCardUser.jsx
@@ -1,5 +1,7 @@
 import moment from "moment";
 import { insertMedia } from "./PostCard";
+import logoImg from "../Images/postimg.jpg"
+
 export function PostCardUser({ post }) {
   const normalDate = moment(post.createdAt).format("DD/MM/YYYY");
   return (
@@ -8,7 +10,7 @@ export function PostCardUser({ post }) {
         <div className="flex justify-between items-center py-4">
           <img
             className="w-12 rounded-full"
-            src="https://images.unsplash.com/photo-1585829365295-ab7cd400c167?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D&auto=format&fit=crop&w=870&q=80"
+            src={logoImg}
             alt="logo"
           />
           <div className="ml-3">
diff --git a/src/pages/PostForm.js b/src/pages/PostForm.js
index c1e9690..8ecf234 100644
--- a/src/pages/PostForm.js
+++ b/src/pages/PostForm.js
@@ -104,7 +104,7 @@ export function PostForm() {
             <input type="file" name="image" className="px-3 py-2 focus:outline-none rounded bg-gray-600 text-white w-full" onChange={(e)=> setFieldValue('image',e.target.files[0])}/>
             <button
               type="submit"
-              className="bg-indigo-600 hover:bg-indigo-500 px-4 py-2 rounded mt-2 text-white focus:outline-none disabled:bg-indigo-400"
+              className="bg-indigo-600 hover:bg-indigo-500 px-4 py-2 rounded mt-2 text-white focus:outline-none disabled:bg-indigo-400 animate-pulse"
               disable={isSubmitting}
             >
               {isSubmitting ?  <button