diff --git a/home-style.css b/home-style.css
new file mode 100644
index 00000000..e8a5e0c3
--- /dev/null
+++ b/home-style.css
@@ -0,0 +1,474 @@
+* {
+  margin: 0;
+}
+body {
+  background-color: #000000;
+}
+main {
+  margin: auto;
+  box-sizing: border-box;
+  max-width: 1500px;
+  width: 100%;
+  background-color: #000000;
+}
+.container {
+  display: grid;
+  height: 100vh;
+  grid-template-rows: 60px 1fr ;
+  grid-template-columns:1fr minmax(0,1fr) minmax(2fr,5fr) minmax(0,2.5fr) 1fr;
+  grid-template-areas: 
+    '. logo header searchHeader .'
+    '. left-side-menu main-content right-side-bar .'
+  ;
+}
+
+.logo {
+  grid-area: logo;
+  background-color: #000000;
+
+  svg {
+    padding: 10px;
+    height: 40px;
+    width: 40px;
+    fill: white;
+  }
+
+}
+
+.header {
+  grid-area: header;
+  width: 697;
+  height: 60px;
+  border-left: 1px solid gray;
+    border-right: 1px solid gray;
+    border-bottom: 1px solid gray;
+  .header-containe {
+    
+    background-color: black;
+    display: grid;
+    grid-template-columns: 5fr 5fr 1fr;
+    p {
+      color: white;
+      text-align: center;
+      padding: 20px 0px 10px 0px;
+    }
+    svg {
+      fill: white;
+      height: 30px;
+      width: 30px;
+      padding: 15px;
+    }
+  }
+  
+}
+
+.searchHeader {
+  grid-area: searchHeader;
+  display: grid;
+  grid-template-columns: 50px .8fr;
+  background-color: #202327;
+  border-radius: 30px;
+  margin: 5px 5px 5px 20px;
+  svg {
+    fill: gray;
+    height: 30px;
+    width: 30px;
+    padding: 10px;
+  }
+  textarea {
+    background-color: #202327;
+    resize: none;
+    border: 0px;
+    margin: 13px;
+    height: 20px;
+  }
+
+  
+}
+.left-side-menu {
+  grid-area: left-side-menu;
+  display: grid;
+  grid-template-rows: 500px 50px 1fr 50px;
+  grid-template-areas: 
+  'menu-list'
+  'creat-post-button'
+  '.'
+  'my-status'
+  ;
+  gap: 20px;
+  background-color: #000000;
+  
+  .menu-list {
+    grid-area: menu-list;
+    font-family: sans-serif;
+    display: grid;
+    grid-template-rows: repeat(auto-fill,50px);
+    padding-left: 10px;
+    gap: 15px;
+    .list {
+      display: grid;
+      grid-template-columns: 50px 1fr;
+      svg {
+        align-items: stretch;
+        height: 40px;
+        width: 40px;
+        fill: white;
+      }
+      p {
+        align-items: stretch;
+        font-size: 20px;
+        color: white;
+        padding-left: 10px;
+      }
+    }
+  }
+  
+  .creat-post-button {
+    grid-area: creat-post-button;
+    margin: 5px 20px 5px 20px;
+    height: 55px;
+    width: 240px;
+    background-color: rgb(0, 174, 255);
+    border-radius: 25px;
+    font-size: 20px;
+    color: white;
+  }
+  
+  .my-status {
+    grid-area: my-status;
+    display: grid;
+    grid-template-columns: 50px 1fr 50px;
+    width: 100%;
+    
+    .status-names {
+      display :inline-block;
+      color: white;
+      margin-left: 20px;
+      padding: 5px 10px 20px 5px;
+      span {
+        color: gray;
+      }
+    }
+    p {
+      color: white;
+      size: 20px;
+      text-align: center;
+      padding-top: 10px;
+    }
+  }
+}
+
+.main-content {
+  grid-area: main-content;
+  display: grid;
+  grid-template-rows: 230px repeat(auto-fill , minmax(200px,700px)) ;
+}
+.new-post {
+  display: grid;
+  padding-top: 15px;
+  border: 1px solid gray;
+  
+  .describe-feed {
+    display: grid;
+    grid-template-columns: 80px 1fr ;
+    grid-template-rows: 60px 25px 60px 50px;
+    grid-template-areas: 
+    'logo textarea'
+    'logo privacyDescribe'
+    'logo toolsbarNewPost'
+    'show-more-feed show-more-feed';
+    .newTextField {
+      textarea {
+        grid-area: textarea;
+        resize: none;
+        border: 0px;
+        margin-top: 2px;
+        height: 40px;
+        width: 490px;
+        font-size: 25px;
+        color: rgb(73, 72, 72);
+        background-color: black;
+      }
+    }
+  }
+  .privacyDescribe {
+    grid-area: privacyDescribe;
+    display: grid;
+    grid-template-columns: 30px 200px;
+    color: #1D9BF0;
+    fill: #1D9BF0;
+    svg {
+      height: 20px;
+      width: 20px;
+    }
+    p {
+      padding: 2px;
+      font-size: 14px;
+    }
+  }
+
+  .toolsbarNewPost {
+    border-top: 1px solid gray;
+    margin: 0px 10px 10px 0px;
+    
+    grid-area: toolsbarNewPost;
+    display: grid;
+    grid-template-columns: 1fr 80px ;
+    fill: #1D9BF0;
+    .toolsbarList {
+      grid-template-columns: repeat(auto-fill,30px);
+      padding-top: 20px;
+      svg {
+        height: 25px;
+        width: 25px;
+        padding-right: 10px;
+      }
+    }
+  }
+  .creat-post-button {
+    margin-top: 10px;
+    height: 45px;
+    width: 80px;
+    background-color: rgb(0, 174, 255);
+    border-radius: 25px;
+    font-size: 18px;
+    font-weight: bold;
+    color: white;
+  }
+  
+  .show-more-feed {
+    grid-area: show-more-feed;
+    height: 50px;
+    width: 1fr;
+    border-bottom: 1px solid gray;
+    border-top: 1px solid gray;
+    margin: top ;
+    text-align: center;
+    color: #1D9BF0;
+    font-size: 28px;
+    padding-top: 18px;
+  }
+}
+
+.feed {
+  border: .1px solid gray;
+  display: grid;
+  padding: 10px ;
+  grid-template-columns: 50px 1fr;
+  .feed-profile-image {
+    height: 40px;
+    width: 40px;
+    border-radius: 40px;
+    padding: 5px;
+  }
+  .feed-content {
+    display: grid;
+    grid-template-rows: 33px minmax(0px,50px) minmax(0px,560px) 30px ;
+    
+    .feed-title {
+      font-size: 18px;
+      margin-top: 10px;
+      color: white;
+      span {
+        color: gray;
+      }
+    }
+
+    .feed-description {
+      color: white;
+      font-size: 15px;
+    }
+
+    .feed-new-image {
+      height: 550px;
+      width: 600px;
+    }
+    .feed-tools {
+      fill: gray;
+      display: grid;
+      grid-template-columns: 520px 80px ;
+      .part-1 {
+        display: grid;
+        grid-template-columns: repeat(4,120px);
+        svg {
+          height: 25px;
+          width: 25px;
+        }
+      }
+      .part-2 {
+        display: grid;
+        grid-template-columns: 40px 40px;
+        svg {
+          height: 25px;
+          width: 25px;
+        }
+      }
+      
+    }
+  }
+}
+
+
+.right-side-bar {
+  grid-area: right-side-bar;
+  margin-left: 20px;
+  display: grid;
+  grid-template-rows: minmax(200px,300px) 800px;
+  color: white;
+  gap: 20px;
+  
+  .notification {
+    border-radius: 15px;
+    background-color: #16181C;
+    display: grid;
+    grid-template-rows: 50px repeat(3,45px) 50px;
+    padding: 10px 0px 0px 10px;
+    gap: 10px;
+    .you-might-know {
+      display: grid;
+      grid-template-columns: 50px 1fr 90px;
+      
+      .notification-profile-image {
+        img {
+          height: 40px;
+          width: 40px;
+          border-radius: 40px;
+        }
+      }
+
+      .notification-profile-name {
+        p {
+          font-size: 13px;
+          color: gray;
+          padding-top: 3px;
+        }
+      }
+      .follow-buttom {
+        margin-right:10px ;
+        height: 33px;
+        width: 80px;
+        border-radius: 16.5px;
+      }
+    }
+
+    .show-more-text {
+      margin-top: 20px;
+      color:#1D9BF0 ;
+    }
+  }
+
+  .trneds {
+    background-color: #16181C;
+    border-radius: 15px;
+    display: grid;
+    grid-template-rows: 50px repeat(auto-fill,75px) 50px;
+    padding: 15px 15px 0 15px;
+    gap: 20px;
+    h2 {
+      font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
+    }
+    .trends-profiles {
+      display: grid;
+      grid-template-columns: 100px 1fr 20px;
+      grid-template-rows: 25px;
+      grid-template-areas:
+      'trends-number . trends-more-option' 
+      'trends-name . .'
+      'trends-posts-number . .'
+      ;
+    }
+    .trends-number {
+      grid-area: trends-number;
+      color: gray;
+    }
+    .trends-name {
+      grid-area: trends-name;
+    }
+    .trends-posts-number {
+      grid-area: trends-posts-number;
+      color: gray;
+    }
+
+    .trends-more-option {
+      grid-area: trends-more-option;
+    }
+    .show-more-text {
+      margin-top: 20px;
+      color:#1D9BF0 ;
+    }
+  }
+}
+.myProfileImage {
+  height: 40px;
+  width: 40px;
+  border-radius: 40px;
+  padding: 5px;
+  margin-left: 20px;
+}
+.left-side-menu2{
+  padding-top: 20px;
+  grid-area: left-side-menu;
+  display: grid;
+  grid-template-rows: 550px 1fr 60px;
+  grid-template-areas: 
+  'menu-list2'
+  '.'
+  'my-status'
+  ;
+  .menu-list2 {
+    display: grid;
+    grid-template-rows: repeat(auto-fill,50px);
+    width: 1fr;
+    padding-left: 15px;
+    gap: 20px;
+    .list2{
+      svg{
+        height: 30px;
+        width: 30px;
+        fill: white;
+      }
+    }
+  }
+  .creat-post-button2 {
+   background-color: rgb(0, 174, 255);
+   color: white;
+   height: 50px;
+   width: 50px;
+   border-radius: 30px;
+   margin-left: 05px;
+   margin-top: 20px;
+  }
+
+  .my-status2{
+    
+    grid-area: my-status;
+  .status-names2 {
+
+  }
+  .myProfileImage2 {
+    height: 50px;
+    width: 50px;
+    border-radius: 25px;
+    margin-left: 5px;
+    margin-bottom: 10px;
+  }
+  }
+}
+
+@media screen and (max-width: 1000px) {
+ .left-side-menu,.right-side-bar , .searchHeader {
+    display: none;
+  }
+}
+
+@media screen and (min-width: 1000px) and (max-width: 1350px) {
+  .left-side-menu {
+    display: none;
+  }
+}
+
+@media screen and (min-width: 1350px) {
+  .left-side-menu2 {
+    display: none;
+  }
+}
diff --git a/home.html b/home.html
new file mode 100644
index 00000000..c9dad679
--- /dev/null
+++ b/home.html
@@ -0,0 +1,267 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <link rel="stylesheet" href="./home-style.css">
+  <title>Document</title>
+</head>
+<body>
+  <main>
+  <div class="container">
+    <div class="logo">
+      <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-lrsllp r-1nao33i r-16y2uox r-8kz0gk">
+        <g><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path>
+        </g>
+      </svg>
+    </div>
+    <div class="header">
+      <div class="header-containe">
+      <p>For you</p>
+      <p>Following</p>
+      <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-z80fyv r-19wmn03" style="color: rgb(239, 243, 244);"><g><path d="M10.54 1.75h2.92l1.57 2.36c.11.17.32.25.53.21l2.53-.59 2.17 2.17-.58 2.54c-.05.2.04.41.21.53l2.36 1.57v2.92l-2.36 1.57c-.17.12-.26.33-.21.53l.58 2.54-2.17 2.17-2.53-.59c-.21-.04-.42.04-.53.21l-1.57 2.36h-2.92l-1.58-2.36c-.11-.17-.32-.25-.52-.21l-2.54.59-2.17-2.17.58-2.54c.05-.2-.03-.41-.21-.53l-2.35-1.57v-2.92L4.1 8.97c.18-.12.26-.33.21-.53L3.73 5.9 5.9 3.73l2.54.59c.2.04.41-.04.52-.21l1.58-2.36zm1.07 2l-.98 1.47C10.05 6.08 9 6.5 7.99 6.27l-1.46-.34-.6.6.33 1.46c.24 1.01-.18 2.07-1.05 2.64l-1.46.98v.78l1.46.98c.87.57 1.29 1.63 1.05 2.64l-.33 1.46.6.6 1.46-.34c1.01-.23 2.06.19 2.64 1.05l.98 1.47h.78l.97-1.47c.58-.86 1.63-1.28 2.65-1.05l1.45.34.61-.6-.34-1.46c-.23-1.01.18-2.07 1.05-2.64l1.47-.98v-.78l-1.47-.98c-.87-.57-1.28-1.63-1.05-2.64l.34-1.46-.61-.6-1.45.34c-1.02.23-2.07-.19-2.65-1.05l-.97-1.47h-.78zM12 10.5c-.83 0-1.5.67-1.5 1.5s.67 1.5 1.5 1.5c.82 0 1.5-.67 1.5-1.5s-.68-1.5-1.5-1.5zM8.5 12c0-1.93 1.56-3.5 3.5-3.5 1.93 0 3.5 1.57 3.5 3.5s-1.57 3.5-3.5 3.5c-1.94 0-3.5-1.57-3.5-3.5z"></path></g></svg>
+    </div>
+  </div>
+    <div class="searchHeader">
+      <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-1xvli5t r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1bwzh9t r-4wgw6l r-f727ji"><g><path d="M10.25 3.75c-3.59 0-6.5 2.91-6.5 6.5s2.91 6.5 6.5 6.5c1.795 0 3.419-.726 4.596-1.904 1.178-1.177 1.904-2.801 1.904-4.596 0-3.59-2.91-6.5-6.5-6.5zm-8.5 6.5c0-4.694 3.806-8.5 8.5-8.5s8.5 3.806 8.5 8.5c0 1.986-.682 3.815-1.824 5.262l4.781 4.781-1.414 1.414-4.781-4.781c-1.447 1.142-3.276 1.824-5.262 1.824-4.694 0-8.5-3.806-8.5-8.5z"></path></g></svg>
+      
+      <textarea placeholder="Search"></textarea>
+    </div>
+    <section class="left-side-menu">
+      <div class="menu-list">
+        <div class="list">
+            <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e">
+              <g>
+                <path d="M21.591 7.146L12.52 1.157c-.316-.21-.724-.21-1.04 0l-9.071 5.99c-.26.173-.409.456-.409.757v13.183c0 .502.418.913.929.913H9.14c.51 0 .929-.41.929-.913v-7.075h3.909v7.075c0 .502.417.913.928.913h6.165c.511 0 .929-.41.929-.913V7.904c0-.301-.158-.584-.408-.758z"></path>
+              </g>
+            </svg>
+            <p>Home</p>
+        </div>
+        <div class="list">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M10.25 3.75c-3.59 0-6.5 2.91-6.5 6.5s2.91 6.5 6.5 6.5c1.795 0 3.419-.726 4.596-1.904 1.178-1.177 1.904-2.801 1.904-4.596 0-3.59-2.91-6.5-6.5-6.5zm-8.5 6.5c0-4.694 3.806-8.5 8.5-8.5s8.5 3.806 8.5 8.5c0 1.986-.682 3.815-1.824 5.262l4.781 4.781-1.414 1.414-4.781-4.781c-1.447 1.142-3.276 1.824-5.262 1.824-4.694 0-8.5-3.806-8.5-8.5z"></path></g></svg>
+          <p>Explore</p>
+        </div>
+        <div class="list">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M19.993 9.042C19.48 5.017 16.054 2 11.996 2s-7.49 3.021-7.999 7.051L2.866 18H7.1c.463 2.282 2.481 4 4.9 4s4.437-1.718 4.9-4h4.236l-1.143-8.958zM12 20c-1.306 0-2.417-.835-2.829-2h5.658c-.412 1.165-1.523 2-2.829 2zm-6.866-4l.847-6.698C6.364 6.272 8.941 4 11.996 4s5.627 2.268 6.013 5.295L18.864 16H5.134z"></path></g></svg>
+          <p>Notifications</p>
+        </div>
+        <div class="list">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M1.998 5.5c0-1.381 1.119-2.5 2.5-2.5h15c1.381 0 2.5 1.119 2.5 2.5v13c0 1.381-1.119 2.5-2.5 2.5h-15c-1.381 0-2.5-1.119-2.5-2.5v-13zm2.5-.5c-.276 0-.5.224-.5.5v2.764l8 3.638 8-3.636V5.5c0-.276-.224-.5-.5-.5h-15zm15.5 5.463l-8 3.636-8-3.638V18.5c0 .276.224.5.5.5h15c.276 0 .5-.224.5-.5v-8.037z"></path></g></svg>
+          <p>Messages</p>
+        </div>
+        <div class="list">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M3 4.5C3 3.12 4.12 2 5.5 2h13C19.88 2 21 3.12 21 4.5v15c0 1.38-1.12 2.5-2.5 2.5h-13C4.12 22 3 20.88 3 19.5v-15zM5.5 4c-.28 0-.5.22-.5.5v15c0 .28.22.5.5.5h13c.28 0 .5-.22.5-.5v-15c0-.28-.22-.5-.5-.5h-13zM16 10H8V8h8v2zm-8 2h8v2H8v-2z"></path></g></svg>
+          <p>Lists</p>
+        </div>
+        <div class="list"> 
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path></g></svg>
+          <p>Premium</p>
+        </div>
+        <div class="list"> 
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M5.651 19h12.698c-.337-1.8-1.023-3.21-1.945-4.19C15.318 13.65 13.838 13 12 13s-3.317.65-4.404 1.81c-.922.98-1.608 2.39-1.945 4.19zm.486-5.56C7.627 11.85 9.648 11 12 11s4.373.85 5.863 2.44c1.477 1.58 2.366 3.8 2.632 6.46l.11 1.1H3.395l.11-1.1c.266-2.66 1.155-4.88 2.632-6.46zM12 4c-1.105 0-2 .9-2 2s.895 2 2 2 2-.9 2-2-.895-2-2-2zM8 6c0-2.21 1.791-4 4-4s4 1.79 4 4-1.791 4-4 4-4-1.79-4-4z"></path></g></svg>
+          <p>Profile</p>
+        </div>
+        <div class="list"> 
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M3.75 12c0-4.56 3.69-8.25 8.25-8.25s8.25 3.69 8.25 8.25-3.69 8.25-8.25 8.25S3.75 16.56 3.75 12zM12 1.75C6.34 1.75 1.75 6.34 1.75 12S6.34 22.25 12 22.25 22.25 17.66 22.25 12 17.66 1.75 12 1.75zm-4.75 11.5c.69 0 1.25-.56 1.25-1.25s-.56-1.25-1.25-1.25S6 11.31 6 12s.56 1.25 1.25 1.25zm9.5 0c.69 0 1.25-.56 1.25-1.25s-.56-1.25-1.25-1.25-1.25.56-1.25 1.25.56 1.25 1.25 1.25zM13.25 12c0 .69-.56 1.25-1.25 1.25s-1.25-.56-1.25-1.25.56-1.25 1.25-1.25 1.25.56 1.25 1.25z"></path></g></svg>
+          <p>More</p>
+        </div>
+      </div>
+      <div>
+        <button class="creat-post-button">Post</button>
+      </div>
+      <div class="my-status">
+        <img class="myProfileImage" src="./images/farshad.png">
+        <div class="status-names">
+          <h4>farshad bagdeli</h4>
+          <span>@FBagdeli13</span>
+        </div>
+        <p>...</p>
+      </div>
+    </section>
+    <section class="left-side-menu2">
+      <div class="menu-list2">
+        <div class="list2">
+            <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e">
+              <g>
+                <path d="M21.591 7.146L12.52 1.157c-.316-.21-.724-.21-1.04 0l-9.071 5.99c-.26.173-.409.456-.409.757v13.183c0 .502.418.913.929.913H9.14c.51 0 .929-.41.929-.913v-7.075h3.909v7.075c0 .502.417.913.928.913h6.165c.511 0 .929-.41.929-.913V7.904c0-.301-.158-.584-.408-.758z"></path>
+              </g>
+            </svg>
+        </div>
+        <div class="list2">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M10.25 3.75c-3.59 0-6.5 2.91-6.5 6.5s2.91 6.5 6.5 6.5c1.795 0 3.419-.726 4.596-1.904 1.178-1.177 1.904-2.801 1.904-4.596 0-3.59-2.91-6.5-6.5-6.5zm-8.5 6.5c0-4.694 3.806-8.5 8.5-8.5s8.5 3.806 8.5 8.5c0 1.986-.682 3.815-1.824 5.262l4.781 4.781-1.414 1.414-4.781-4.781c-1.447 1.142-3.276 1.824-5.262 1.824-4.694 0-8.5-3.806-8.5-8.5z"></path></g></svg>
+        </div>
+        <div class="list2">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M19.993 9.042C19.48 5.017 16.054 2 11.996 2s-7.49 3.021-7.999 7.051L2.866 18H7.1c.463 2.282 2.481 4 4.9 4s4.437-1.718 4.9-4h4.236l-1.143-8.958zM12 20c-1.306 0-2.417-.835-2.829-2h5.658c-.412 1.165-1.523 2-2.829 2zm-6.866-4l.847-6.698C6.364 6.272 8.941 4 11.996 4s5.627 2.268 6.013 5.295L18.864 16H5.134z"></path></g></svg>
+        </div>
+        <div class="list2">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M1.998 5.5c0-1.381 1.119-2.5 2.5-2.5h15c1.381 0 2.5 1.119 2.5 2.5v13c0 1.381-1.119 2.5-2.5 2.5h-15c-1.381 0-2.5-1.119-2.5-2.5v-13zm2.5-.5c-.276 0-.5.224-.5.5v2.764l8 3.638 8-3.636V5.5c0-.276-.224-.5-.5-.5h-15zm15.5 5.463l-8 3.636-8-3.638V18.5c0 .276.224.5.5.5h15c.276 0 .5-.224.5-.5v-8.037z"></path></g></svg>
+        </div>
+        <div class="list2">
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M3 4.5C3 3.12 4.12 2 5.5 2h13C19.88 2 21 3.12 21 4.5v15c0 1.38-1.12 2.5-2.5 2.5h-13C4.12 22 3 20.88 3 19.5v-15zM5.5 4c-.28 0-.5.22-.5.5v15c0 .28.22.5.5.5h13c.28 0 .5-.22.5-.5v-15c0-.28-.22-.5-.5-.5h-13zM16 10H8V8h8v2zm-8 2h8v2H8v-2z"></path></g></svg>
+        </div>
+        <div class="list2"> 
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path></g></svg>
+        </div>
+        <div class="list2"> 
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M5.651 19h12.698c-.337-1.8-1.023-3.21-1.945-4.19C15.318 13.65 13.838 13 12 13s-3.317.65-4.404 1.81c-.922.98-1.608 2.39-1.945 4.19zm.486-5.56C7.627 11.85 9.648 11 12 11s4.373.85 5.863 2.44c1.477 1.58 2.366 3.8 2.632 6.46l.11 1.1H3.395l.11-1.1c.266-2.66 1.155-4.88 2.632-6.46zM12 4c-1.105 0-2 .9-2 2s.895 2 2 2 2-.9 2-2-.895-2-2-2zM8 6c0-2.21 1.791-4 4-4s4 1.79 4 4-1.791 4-4 4-4-1.79-4-4z"></path></g></svg>
+        </div>
+        <div class="list2"> 
+          <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1nao33i r-lwhw9o r-cnnz9e"><g><path d="M3.75 12c0-4.56 3.69-8.25 8.25-8.25s8.25 3.69 8.25 8.25-3.69 8.25-8.25 8.25S3.75 16.56 3.75 12zM12 1.75C6.34 1.75 1.75 6.34 1.75 12S6.34 22.25 12 22.25 22.25 17.66 22.25 12 17.66 1.75 12 1.75zm-4.75 11.5c.69 0 1.25-.56 1.25-1.25s-.56-1.25-1.25-1.25S6 11.31 6 12s.56 1.25 1.25 1.25zm9.5 0c.69 0 1.25-.56 1.25-1.25s-.56-1.25-1.25-1.25-1.25.56-1.25 1.25.56 1.25 1.25 1.25zM13.25 12c0 .69-.56 1.25-1.25 1.25s-1.25-.56-1.25-1.25.56-1.25 1.25-1.25 1.25.56 1.25 1.25z"></path></g></svg>
+        </div>
+      </div>
+      <div>
+        <button class="creat-post-button2">Post</button>
+      </div>
+      <div class="my-status2">
+        <img class="myProfileImage2" src="./images/farshad.png">
+      </div>
+    </section>
+    <section class="main-content">
+      <div class="new-post">
+        <div class="describe-feed">
+          <img class="myProfileImage" src="./images/farshad.png">
+          <div class="newTextField">
+            <textarea placeholder="What is new..."></textarea>
+            <div class="privacyDescribe">
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1d4mawv r-10ptun7 r-1janqcz" style="color: rgb(29, 155, 240);"><g><path d="M12 1.75C6.34 1.75 1.75 6.34 1.75 12S6.34 22.25 12 22.25 22.25 17.66 22.25 12 17.66 1.75 12 1.75zm-.25 10.48L10.5 17.5l-2-1.5v-3.5L7.5 9 5.03 7.59c1.42-2.24 3.89-3.75 6.72-3.84L11 6l-2 .5L8.5 9l5 1.5-1.75 1.73zM17 14v-3l-1.5-3 2.88-1.23c1.17 1.42 1.87 3.24 1.87 5.23 0 1.3-.3 2.52-.83 3.61L17 14z"></path></g></svg>
+              <p>Everyone can reply</p>
+            </div>
+          </div>
+          <div class="toolsbarNewPost">
+            <div class="toolsbarList">
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-z80fyv r-19wmn03" style="color: rgb(29, 155, 240);"><g><path d="M3 5.5C3 4.119 4.119 3 5.5 3h13C19.881 3 21 4.119 21 5.5v13c0 1.381-1.119 2.5-2.5 2.5h-13C4.119 21 3 19.881 3 18.5v-13zM5.5 5c-.276 0-.5.224-.5.5v9.086l3-3 3 3 5-5 3 3V5.5c0-.276-.224-.5-.5-.5h-13zM19 15.414l-3-3-5 5-3-3-3 3V18.5c0 .276.224.5.5.5h13c.276 0 .5-.224.5-.5v-3.086zM9.75 7C8.784 7 8 7.784 8 8.75s.784 1.75 1.75 1.75 1.75-.784 1.75-1.75S10.716 7 9.75 7z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-z80fyv r-19wmn03" style="color: rgb(29, 155, 240);"><g><path d="M3 5.5C3 4.119 4.12 3 5.5 3h13C19.88 3 21 4.119 21 5.5v13c0 1.381-1.12 2.5-2.5 2.5h-13C4.12 21 3 19.881 3 18.5v-13zM5.5 5c-.28 0-.5.224-.5.5v13c0 .276.22.5.5.5h13c.28 0 .5-.224.5-.5v-13c0-.276-.22-.5-.5-.5h-13zM18 10.711V9.25h-3.74v5.5h1.44v-1.719h1.7V11.57h-1.7v-.859H18zM11.79 9.25h1.44v5.5h-1.44v-5.5zm-3.07 1.375c.34 0 .77.172 1.02.43l1.03-.86c-.51-.601-1.28-.945-2.05-.945C7.19 9.25 6 10.453 6 12s1.19 2.75 2.72 2.75c.85 0 1.54-.344 2.05-.945v-2.149H8.38v1.032H9.4v.515c-.17.086-.42.172-.68.172-.76 0-1.36-.602-1.36-1.375 0-.688.6-1.375 1.36-1.375z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-z80fyv r-19wmn03" style="color: rgb(29, 155, 240);"><g><path d="M6 5c-1.1 0-2 .895-2 2s.9 2 2 2 2-.895 2-2-.9-2-2-2zM2 7c0-2.209 1.79-4 4-4s4 1.791 4 4-1.79 4-4 4-4-1.791-4-4zm20 1H12V6h10v2zM6 15c-1.1 0-2 .895-2 2s.9 2 2 2 2-.895 2-2-.9-2-2-2zm-4 2c0-2.209 1.79-4 4-4s4 1.791 4 4-1.79 4-4 4-4-1.791-4-4zm20 1H12v-2h10v2zM7 7c0 .552-.45 1-1 1s-1-.448-1-1 .45-1 1-1 1 .448 1 1z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-z80fyv r-19wmn03" style="color: rgb(29, 155, 240);"><g><path d="M8 9.5C8 8.119 8.672 7 9.5 7S11 8.119 11 9.5 10.328 12 9.5 12 8 10.881 8 9.5zm6.5 2.5c.828 0 1.5-1.119 1.5-2.5S15.328 7 14.5 7 13 8.119 13 9.5s.672 2.5 1.5 2.5zM12 16c-2.224 0-3.021-2.227-3.051-2.316l-1.897.633c.05.15 1.271 3.684 4.949 3.684s4.898-3.533 4.949-3.684l-1.896-.638c-.033.095-.83 2.322-3.053 2.322zm10.25-4.001c0 5.652-4.598 10.25-10.25 10.25S1.75 17.652 1.75 12 6.348 1.75 12 1.75 22.25 6.348 22.25 12zm-2 0c0-4.549-3.701-8.25-8.25-8.25S3.75 7.451 3.75 12s3.701 8.25 8.25 8.25 8.25-3.701 8.25-8.25z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-z80fyv r-19wmn03" style="color: rgb(29, 155, 240);"><g><path d="M6 3V2h2v1h6V2h2v1h1.5C18.88 3 20 4.119 20 5.5v2h-2v-2c0-.276-.22-.5-.5-.5H16v1h-2V5H8v1H6V5H4.5c-.28 0-.5.224-.5.5v12c0 .276.22.5.5.5h3v2h-3C3.12 20 2 18.881 2 17.5v-12C2 4.119 3.12 3 4.5 3H6zm9.5 8c-2.49 0-4.5 2.015-4.5 4.5s2.01 4.5 4.5 4.5 4.5-2.015 4.5-4.5-2.01-4.5-4.5-4.5zM9 15.5C9 11.91 11.91 9 15.5 9s6.5 2.91 6.5 6.5-2.91 6.5-6.5 6.5S9 19.09 9 15.5zm5.5-2.5h2v2.086l1.71 1.707-1.42 1.414-2.29-2.293V13z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-z80fyv r-19wmn03" style="color: rgb(29, 155, 240);"><g><path d="M12 7c-1.93 0-3.5 1.57-3.5 3.5S10.07 14 12 14s3.5-1.57 3.5-3.5S13.93 7 12 7zm0 5c-.827 0-1.5-.673-1.5-1.5S11.173 9 12 9s1.5.673 1.5 1.5S12.827 12 12 12zm0-10c-4.687 0-8.5 3.813-8.5 8.5 0 5.967 7.621 11.116 7.945 11.332l.555.37.555-.37c.324-.216 7.945-5.365 7.945-11.332C20.5 5.813 16.687 2 12 2zm0 17.77c-1.665-1.241-6.5-5.196-6.5-9.27C5.5 6.916 8.416 4 12 4s6.5 2.916 6.5 6.5c0 4.073-4.835 8.028-6.5 9.27z"></path></g></svg>
+
+            </div>
+            <button class="creat-post-button">Post</button>
+          </div>
+          <div class="show-more-feed">
+            show more
+          </div>
+        </div>
+      </div>
+      <div class="feed">
+        <img src="./images/farshad.png" class="feed-profile-image">
+        <div class="feed-content">
+          <div class="feed-title">
+            Farshad Bagdeli<span> @FBagdeli13</span>
+          </div>
+          <div class="feed-description">
+            Playing cards boxes store and protect decks, keeping them organized and portable for gaming, travel, and display purposes
+          </div>
+          <img class="feed-new-image" src="./images/playing cards boxex.png">
+          <div class="feed-tools">
+            <div class="part-1">
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1xvli5t r-1hdv0qi"><g><path d="M1.751 10c0-4.42 3.584-8 8.005-8h4.366c4.49 0 8.129 3.64 8.129 8.13 0 2.96-1.607 5.68-4.196 7.11l-8.054 4.46v-3.69h-.067c-4.49.1-8.183-3.51-8.183-8.01zm8.005-6c-3.317 0-6.005 2.69-6.005 6 0 3.37 2.77 6.08 6.138 6.01l.351-.01h1.761v2.3l5.087-2.81c1.951-1.08 3.163-3.13 3.163-5.36 0-3.39-2.744-6.13-6.129-6.13H9.756z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1xvli5t r-1hdv0qi"><g><path d="M4.5 3.88l4.432 4.14-1.364 1.46L5.5 7.55V16c0 1.1.896 2 2 2H13v2H7.5c-2.209 0-4-1.79-4-4V7.55L1.432 9.48.068 8.02 4.5 3.88zM16.5 6H11V4h5.5c2.209 0 4 1.79 4 4v8.45l2.068-1.93 1.364 1.46-4.432 4.14-4.432-4.14 1.364-1.46 2.068 1.93V8c0-1.1-.896-2-2-2z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1xvli5t r-1hdv0qi"><g><path d="M16.697 5.5c-1.222-.06-2.679.51-3.89 2.16l-.805 1.09-.806-1.09C9.984 6.01 8.526 5.44 7.304 5.5c-1.243.07-2.349.78-2.91 1.91-.552 1.12-.633 2.78.479 4.82 1.074 1.97 3.257 4.27 7.129 6.61 3.87-2.34 6.052-4.64 7.126-6.61 1.111-2.04 1.03-3.7.477-4.82-.561-1.13-1.666-1.84-2.908-1.91zm4.187 7.69c-1.351 2.48-4.001 5.12-8.379 7.67l-.503.3-.504-.3c-4.379-2.55-7.029-5.19-8.382-7.67-1.36-2.5-1.41-4.86-.514-6.67.887-1.79 2.647-2.91 4.601-3.01 1.651-.09 3.368.56 4.798 2.01 1.429-1.45 3.146-2.1 4.796-2.01 1.954.1 3.714 1.22 4.601 3.01.896 1.81.846 4.17-.514 6.67z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1xvli5t r-1hdv0qi"><g><path d="M8.75 21V3h2v18h-2zM18 21V8.5h2V21h-2zM4 21l.004-10h2L6 21H4zm9.248 0v-7h2v7h-2z"></path></g></svg>
+              
+            </div>
+            <div class="part-2">
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1xvli5t r-1hdv0qi"><g><path d="M4 4.5C4 3.12 5.119 2 6.5 2h11C18.881 2 20 3.12 20 4.5v18.44l-8-5.71-8 5.71V4.5zM6.5 4c-.276 0-.5.22-.5.5v14.56l6-4.29 6 4.29V4.5c0-.28-.224-.5-.5-.5h-11z"></path></g></svg>
+              <svg viewBox="0 0 24 24" aria-hidden="true" class="r-4qtqp9 r-yyyyoo r-dnmrzs r-bnwqim r-1plcrui r-lrvibr r-1xvli5t r-1hdv0qi"><g><path d="M12 2.59l5.7 5.7-1.41 1.42L13 6.41V16h-2V6.41l-3.3 3.3-1.41-1.42L12 2.59zM21 15l-.02 3.51c0 1.38-1.12 2.49-2.5 2.49H5.5C4.11 21 3 19.88 3 18.5V15h2v3.5c0 .28.22.5.5.5h12.98c.28 0 .5-.22.5-.5L19 15h2z"></path></g></svg>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="feed">
+        
+      </div>
+    
+    </section>
+    <section class="right-side-bar">
+      <div class="notification">
+        <h2>You might like</h2>
+        <div class="you-might-know">
+          <div class="notification-profile-image">
+            <img src="./images/farshad.png">
+          </div>
+          <div class="notification-profile-name">
+            <h5>Farshad Bagdeli</h5>
+            <p>@FBagdeli13</p>
+          </div>
+          <div>
+            <button class="follow-buttom">Follow</button>
+          </div>
+        </div>
+        <div class="you-might-know">
+          <div class="notification-profile-image">
+            <img src="./images/farshad.png">
+          </div>
+          <div class="notification-profile-name">
+            <h5>Farshad Bagdeli</h5>
+            <p>@FBagdeli13</p>
+          </div>
+          <div>
+            <button class="follow-buttom">Follow</button>
+          </div>
+        </div>
+        <div class="you-might-know">
+          <div class="notification-profile-image">
+            <img src="./images/farshad.png">
+          </div>
+          <div class="notification-profile-name">
+            <h5>Farshad Bagdeli</h5>
+            <p>@FBagdeli13</p>
+          </div>
+          <div>
+            <button class="follow-buttom">Follow</button>
+          </div>
+        </div>
+        <div class="show-more-text">
+          <p>Show more</p>
+        </div>
+      </div>
+      <div class="trneds">
+        <h2 class="world-trends">World trends</h2>
+        <div class="trends-profiles">
+          <div class="trends-number">1.Trending</div>
+          <div class="trends-name">Boolean</div>
+          <div class="trends-posts-number">5K posts</div>
+          <h4 class="trends-more-option">...</h4>
+        </div>
+        <div class="trends-profiles">
+          <div class="trends-number">2.Trending</div>
+          <div class="trends-name">Boolean</div>
+          <div class="trends-posts-number">5K posts</div>
+          <h4 class="trends-more-option">...</h4>
+        </div>
+        <div class="trends-profiles">
+          <div class="trends-number">3.Trending</div>
+          <div class="trends-name">Boolean</div>
+          <div class="trends-posts-number">5K posts</div>
+          <h4 class="trends-more-option">...</h4>
+        </div>
+        <div class="trends-profiles">
+          <div class="trends-number">4.Trending</div>
+          <div class="trends-name">Boolean</div>
+          <div class="trends-posts-number">5K posts</div>
+          <h4 class="trends-more-option">...</h4>
+        </div>
+        <div class="trends-profiles">
+          <div class="trends-number">5.Trending</div>
+          <div class="trends-name">Boolean</div>
+          <div class="trends-posts-number">5K posts</div>
+          <h4 class="trends-more-option">...</h4>
+        </div>
+        <div class="trends-profiles">
+          <div class="trends-number">6.Trending</div>
+          <div class="trends-name">Boolean</div>
+          <div class="trends-posts-number">5K posts</div>
+          <h4 class="trends-more-option">...</h4>
+        </div>
+        <div class="show-more-text">
+          <p>Show more</p>
+        </div>
+      </div>
+      
+    </section>
+  </div>
+</main>
+</body>
+</html>
\ No newline at end of file
diff --git a/images/farshad.png b/images/farshad.png
new file mode 100644
index 00000000..00348663
Binary files /dev/null and b/images/farshad.png differ
diff --git a/images/playing cards boxex.png b/images/playing cards boxex.png
new file mode 100644
index 00000000..0da03a39
Binary files /dev/null and b/images/playing cards boxex.png differ