diff --git a/public/cc-logo.png b/public/cc-logo.png
deleted file mode 100644
index b89822c..0000000
Binary files a/public/cc-logo.png and /dev/null differ
diff --git a/public/dot-logo.svg b/public/dot-logo.svg
new file mode 100644
index 0000000..77c4893
--- /dev/null
+++ b/public/dot-logo.svg
@@ -0,0 +1,12 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg viewBox="5 5 100 100" width="100" height="100" xmlns="http://www.w3.org/2000/svg">
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="20" cy="55" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="55" cy="55" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="90" cy="55" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="20" cy="90" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="55" cy="90" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="90" cy="90" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="20" cy="20" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="55" cy="20" rx="15" ry="15"/>
+  <ellipse style="stroke: rgba(0, 0, 0, 0); fill: rgb(255, 255, 255);" cx="90" cy="20" rx="15" ry="15"/>
+</svg>
\ No newline at end of file
diff --git a/public/iiitv-logo.svg b/public/iiitv-logo.svg
new file mode 100644
index 0000000..bae354e
--- /dev/null
+++ b/public/iiitv-logo.svg
@@ -0,0 +1,12 @@
+<svg width="847" height="868" viewBox="0 0 847 868" fill="none" xmlns="http://www.w3.org/2000/svg">
+<ellipse cx="421.719" cy="433.445" rx="383.381" ry="394.041" fill="white"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M421.719 0C502.511 0 577.996 23.3505 642.135 63.8434L601.648 130.786C549.259 97.8145 487.648 78.8088 421.717 78.8088C231.155 78.8088 76.6744 237.585 76.6744 433.446C76.6744 532.244 115.982 621.605 179.4 685.912L122.597 738.987C46.8227 660.625 0 552.655 0 433.445C0 194.06 188.81 0 421.719 0Z" fill="#F48076"/>
+<path fill-rule="evenodd" clip-rule="evenodd" d="M424.304 867.946C343.513 867.946 268.028 844.596 203.888 804.103L244.376 737.16C296.765 770.132 358.376 789.137 424.306 789.137C614.868 789.137 769.349 630.361 769.349 434.5C769.349 335.703 730.042 246.341 666.623 182.035L723.427 128.959C799.201 207.321 846.024 315.291 846.024 434.501C846.024 673.886 657.214 867.946 424.304 867.946Z" fill="#89D5E9"/>
+<rect x="212.601" y="357.324" width="60.9925" height="237.32" fill="#163762"/>
+<rect x="304.09" y="357.324" width="60.9925" height="237.32" fill="#163762"/>
+<rect x="304.09" y="263.292" width="60.9925" height="58.2106" fill="#163762"/>
+<rect x="395.579" y="263.292" width="60.9925" height="58.2106" fill="#163762"/>
+<rect x="487.067" y="263.292" width="60.9925" height="58.2106" fill="#163762"/>
+<path d="M487.067 594.644V357.324H624.3L487.067 594.644Z" fill="#163762"/>
+<rect x="395.579" y="357.324" width="60.9925" height="237.32" fill="#163762"/>
+</svg>
diff --git a/src/app/blogs/components/blogCard.jsx b/src/app/blogs/components/blogCard.jsx
index 936fcc4..ee81bb0 100644
--- a/src/app/blogs/components/blogCard.jsx
+++ b/src/app/blogs/components/blogCard.jsx
@@ -44,7 +44,7 @@ export default function BlogCard(props) {
                     </Link>
                     <div className={`blogs-data ${montserratFont.className}`}>
                         <hr />
-                        <div className="flex items-center justify-between mt-2">
+                        <div className="flex items-center justify-between gap-2 mt-2">
                             <div className="flex items-center gap-2 ml-4">
                                 <Avatar className="h-8 w-8">
                                     <AvatarImage src="/placeholder-user.jpg" />
diff --git a/src/app/blogs/components/blogCoverPoster.jsx b/src/app/blogs/components/blogCoverPoster.jsx
index 1cf9ff8..67c9bb3 100644
--- a/src/app/blogs/components/blogCoverPoster.jsx
+++ b/src/app/blogs/components/blogCoverPoster.jsx
@@ -3,8 +3,12 @@ import Image from 'next/image';
 export default function Blogs() {
     const blogCoverImage = "/blog_cover_poster.png";
     return(
-        <div className='lg:100vh w-full'>
-            <img src={blogCoverImage} className='lg:100vh w-full' alt="Blog cover poster" />
+        <div className='w-full'>
+            <img src={blogCoverImage} 
+            style={
+                {animation: "pulse-poster 0.5s  cubic-bezier(0.4, 0, 0.6, 1) 1"}
+            }
+            className='w-full' alt="Blog cover poster" />
         </div>
     )
 }
\ No newline at end of file
diff --git a/src/app/blogs/components/comment.jsx b/src/app/blogs/components/comment.jsx
deleted file mode 100644
index 4c7cf94..0000000
--- a/src/app/blogs/components/comment.jsx
+++ /dev/null
@@ -1,11 +0,0 @@
-const LikeIcon = () => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    width="24"
-    height="24"
-    version="1"
-    id="heart"
-  >
-    <path d="M2.2 9.4c0 1.3.2 3.3 2 5.1 1.6 1.6 6.9 5.2 7.1 5.4.2.1.4.2.6.2s.4-.1.6-.2c.2-.2 5.5-3.7 7.1-5.4 1.8-1.8 2-3.8 2-5.1 0-3-2.4-5.4-5.4-5.4-1.6 0-3.2.9-4.2 2.3C11 4.9 9.4 4 7.6 4 4.7 4 2.2 6.4 2.2 9.4z"></path>
-  </svg>
-);
diff --git a/src/app/blogs/page.jsx b/src/app/blogs/page.jsx
index 86b3906..38419df 100644
--- a/src/app/blogs/page.jsx
+++ b/src/app/blogs/page.jsx
@@ -82,8 +82,8 @@ export default function Blogs() {
 
     return (
         <>
-        <div className='flex flex-col items-center'>
-            <BlogPosterCover />      
+        <div className='flex flex-col items-center '>
+            <BlogPosterCover/>      
             <div className="blogs-search-div">
                 <input type="text" value={searchInputValue} className={`${montserratFont.className} blogs-search-input`}
                 placeholder='Search...'
diff --git a/src/components/footer.jsx b/src/components/footer.jsx
index c7e7360..c62bc1b 100644
--- a/src/components/footer.jsx
+++ b/src/components/footer.jsx
@@ -25,7 +25,7 @@ function Footer() {
                 <hr className="col-span-1 lg:col-span-12 footer-divider-1"/>
                 <div className="col-span-1 lg:col-span-4">
                     <div className="footer-cc-logo">
-                        <Image className="footer-cc-logo-img " src="/cc-logo.png" width={512} height={512} alt="IIITV Logo"/>
+                        <Image className="footer-cc-logo-img " src="/iiitv-logo.svg" width={512} height={512} alt="IIITV Logo"/>
                         <div>
                             <p className="footer-cc-logo-title">Coding Club</p> 
                             <p className="footer-cc-logo-subtitle">Community</p>
@@ -80,16 +80,18 @@ function Footer() {
             <div className={`${montserratFont.className} footer-container-2`}>
                 <div className="footer-dot-container">
                     <p>Designed by DOT</p>
-                    <div className="dot-icon">
-                        <div /><div /><div /><div /><div /><div /><div /><div /><div />
-                    </div>
+                    <Image
+                        className="dot-logo"
+                        src="/dot-logo.svg"
+                        alt="IIITV Logo" width={512} height={512}
+                    />
                 </div>
                 <hr className="footer-container-2-divider"></hr>
                 <div className="footer-cc-container">
                     <p>Developed by Coding Club</p>
                     <Image
                         className="footer-cc-logo-img-2"
-                        src="/cc-logo.png"
+                        src="/iiitv-logo.svg"
                         alt="IIITV Logo" width={512} height={512}
                     />
                 </div>
diff --git a/src/components/navbar.jsx b/src/components/navbar.jsx
index 3e4ce0d..4d682bb 100644
--- a/src/components/navbar.jsx
+++ b/src/components/navbar.jsx
@@ -3,6 +3,9 @@ import React, { use, useState } from "react";
 import "@/styles/navbar.css";   
 import Link from "next/link";
 import Image from "next/image";
+import { Noto_Sans } from "next/font/google";
+
+const notoSansFont = Noto_Sans({ weight: ["300","400"], subsets: ["latin"] });
 
 function Navbar() {
     const [hiddenMenu,setHiddenMenu] = useState(true);
@@ -11,7 +14,7 @@ function Navbar() {
     }
 
     const eventsLink = "/events";
-    const projectsLink = "/projects";
+    const blogsLink = "/blogs";
     const membersLink = "/members";
     const contactUsLink = "/contact_us";
     
@@ -19,20 +22,20 @@ function Navbar() {
         <>
             <div id="pseudo"></div>
             <div className="navbar">
-                <Link href="/" className="logo-container" prefetch={false}>
-                    <Image className="logo-img"  src="/cc-logo.png" alt="IIITV Logo" height={512} width={512}/>
+                <Link href="/" className={`logo-container ${notoSansFont.className}`} prefetch={false}>
+                    <Image className="logo-img"  src="/iiitv-logo.svg" alt="IIITV Logo" height={512} width={512}/>
                     <div className="logo-title-container">
                         <p className="logo-title">Coding Club</p>
                         <p className="logo-subtitle">Community</p>
                     </div>
                 </Link>
-                <div className="menu-container">
+                <div className={`menu-container ${notoSansFont.className}`}>
                     <Link href={eventsLink} className="text-primary" prefetch={false}>Events</Link>
-                    <Link href={projectsLink} className="text-primary" prefetch={false} >Projects</Link>
+                    <Link href={blogsLink} className="text-primary" prefetch={false} >Blogs</Link>
                     <Link href={membersLink} className="text-primary" prefetch={false}>Members</Link>
                     <Link href={contactUsLink} className="text-primary" prefetch={false}>Contact Us</Link>
                 </div>
-                <div className="mobile-menu">
+                <div className={`mobile-menu ${notoSansFont.className}`}>
                     <div className="menu-icon">
                         <input type="checkbox" id="hi"  hidden onChange={MenuToggle} value={!hiddenMenu} />
                         <label className="menu" htmlFor="hi">
@@ -46,7 +49,7 @@ function Navbar() {
                     <div className="mobile-menu-container" style={{display : (hiddenMenu ? "none" : "") }}>
                         <div className="mobile-menu-container2">
                             <p><Link href={eventsLink} className="text-primary" prefetch={false}>Events </Link></p>
-                            <p><Link href={projectsLink} className="text-primary" prefetch={false}>Projects </Link></p>
+                            <p><Link href={blogsLink} className="text-primary" prefetch={false}>Blogs </Link></p>
                             <p><Link href={membersLink} className="text-primary" prefetch={false}>Members </Link></p>
                             <p><Link href={contactUsLink} className="text-primary" prefetch={false}>Contact Us </Link></p>
                         </div>
diff --git a/src/styles/blogs.css b/src/styles/blogs.css
index 7a560be..3d421f7 100644
--- a/src/styles/blogs.css
+++ b/src/styles/blogs.css
@@ -1,4 +1,11 @@
-
+@keyframes pulse-poster{
+    0% {
+        filter: saturate(0%) brightness(0%);
+    }
+    100%{
+         filter: saturate(100%) brightness(100%);
+    }
+}
 .blogs-div{
     width: 100%;
     display: flex;
@@ -8,7 +15,6 @@
 .blogs-container{
     width: 95%;
 }
-
 .blogs-search-div{
     position: relative;
     width: max-content;
@@ -119,11 +125,12 @@
 .show-more-button{
 
     box-sizing: border-box;
-    width: 400px;
-    height: 60px;
+    width: 300px;
+    height: 45px;
     
-    background-color : color-mix(in srgb, var(--primary) 10%, transparent);
-    box-shadow: #291f24 1px 1px 15px;
+    background-color : color-mix(in srgb, var(--primary) 5%, transparent);
+    box-shadow:  color-mix(in srgb, #fff 5%, transparent) 1px 1px 15px;
+    border: solid color-mix(in srgb, var(--primary) 20%, transparent) 1px;
     border-radius: 43px;
     
     transition: 0.5s;
@@ -147,6 +154,5 @@
 
         box-sizing: border-box;
         width: 200px;
-        height: 50px;
     }
 }
\ No newline at end of file
diff --git a/src/styles/footer.css b/src/styles/footer.css
index b4d66eb..218e66c 100644
--- a/src/styles/footer.css
+++ b/src/styles/footer.css
@@ -3,9 +3,9 @@
 }
 .footer-divider-1{  
     width: 90%;
-    height: 2.5px;
+    height: 1px;
     border: none;
-    background-color:  #A49D9D;
+    background-color:  var(--muted-foreground);
     justify-self: center;
     box-shadow: 0px 3.34204px 3.34204px rgba(0, 0, 0, 0.25);
     margin: 25px 0;
@@ -39,7 +39,6 @@
     align-self: flex-end;
     font-weight: 100;
     font-size: 16px;
-    color: #E9E9E9;
     margin: 0 3px;
 }
 
@@ -108,7 +107,8 @@
     font-weight: 300;
     justify-content: center;
     align-items: center;
-    background: linear-gradient(90deg, #201F31 27.6%, #282739 50.91%, #201F31 72.19%);
+    background-color: var(--background);
+    background: linear-gradient(90deg, var(--background) 27.6%, color-mix(in srgb, var(--muted-foreground) 10%, transparent) 50.91%, var(--background) 72.19%);
 
     margin-top: 50px;
 }
@@ -129,15 +129,9 @@
     gap: 5px;
 }
 
-.dot-icon{
-    display: grid;
-    grid-template-columns: repeat(3,6px);
-    grid-template-rows: repeat(3,6px);
-    gap: 2.5px;
-}
-.dot-icon>*{
-    background-color: #E9E9E9;
-    border-radius: 100%;
+.dot-logo{
+    height: 25px;
+    width: 25px;
 }
 .footer-cc-logo-img-2{
     height: 35px;
@@ -231,11 +225,17 @@
         transition: 0.5s ease;
         transform: scale(1.0);
     }
-    
+    .footer-container-2>*{
+        font-size: 16px;
+    }
 }
 
 /* Footer Container 2 Divider Responsiveness */
-@media screen and (max-width : 580px){
+@media screen and (max-width : 478px){
+    .footer-container-2{
+        flex-direction: column;
+        padding-top: 5px;
+    }
     .footer-container-2-divider{
         width: 60%;
         height: 2px;
@@ -247,5 +247,15 @@
     .footer-container-2>div>p{
         text-align: center;
     }
+    .footer-container-2>div{
+        margin: 0;
+        padding: 0;
+    }
+    .footer-cc-logo-img-2{
+        height: 25px;
+    }
+    .dot-logo{
+        height: 20px;
+    }
     
 }
\ No newline at end of file
diff --git a/src/styles/navbar.css b/src/styles/navbar.css
index b91a94b..5389cb0 100644
--- a/src/styles/navbar.css
+++ b/src/styles/navbar.css
@@ -1,5 +1,3 @@
-@import url('https://fonts.googleapis.com/css2?family=Noto+Sans:ital@0;1&display=swap');
-
 #pseudo{
 	width: 100%;
 	height: 65px;
@@ -49,7 +47,6 @@
 	gap: 0px;
 }
 .logo-title{
-	font-family: "Noto Sans", sans-serif;
 	font-size: 30px;
 	letter-spacing: -0.05em;
 	line-height: 0.9;
@@ -65,7 +62,6 @@
 	display: flex;
 	justify-content: space-evenly;
 	gap: 50px;
-	font-family: "Noto Sans", sans-serif;
 	font-size: 18px;
 }
 
@@ -78,7 +74,8 @@
 	right: 10px;
 	width: 200px;
 	height: 250px;
-	background: var(--secondary);
+	background-color : color-mix(in srgb, var(--background)80%, transparent);
+	backdrop-filter: blur(10px);
 	box-shadow: 5px 5px 4.5px rgba(0, 0, 0, 0.25);
 	border: #ffbade solid 1px;
 	border-radius: 10px;