Home Page Part 1 Done

src/Pages/Home/Part1/homePart1.css

@@ -45,3 +45,44 @@
     width:65%;
     font-size: 15px;
 }
+.stepsOfSignUp{
+    display: flex;
+    justify-content: center;
+    margin-top: 50px;
+}
+.stepsOfSignUp .step{
+    width:32.5%;
+}
+.stepsOfSignUp .step .firstStep{
+    padding: 10px 15px;
+    color:white;
+    border-radius:50% ;
+    background: linear-gradient(45deg, white, #006FFF);
+    box-shadow: 4px -4px #006FFF;
+    filter:blur(0px);
+   font-weight: bold;
+}
+.stepsOfSignUp .step .secondStep{
+    padding: 10px 15px;
+    color:white;
+    border-radius:50% ;
+    background: linear-gradient(45deg, white, #FF0900);
+    box-shadow: 4px -4px #FF0900;
+    filter:blur(0px);
+    font-weight: bold;
+}
+.stepsOfSignUp .step .thirdStep{
+    padding: 10px 15px;
+    color:white;
+    border-radius:50% ;
+    background: linear-gradient(45deg, white, #00FF2B);
+    box-shadow: 4px -4px #00FF2B;
+    filter:blur(0px);
+    font-weight: bold;
+}
+.stepsOfSignUp .step div{
+
+    margin:10px;
+    padding: 10px;
+    font-size: 15px;
+}

src/Pages/Home/Part1/homePart1.js

@@ -20,6 +20,31 @@ const HomePart1 = () =>{
 
                     <KhabarNameh />
 
+                    <div className="stepsOfSignUp">
+
+                        <div className="step">
+                            <span className="firstStep">1</span>
+                            <div>
+                                برای شروع کافیه که ایمیل خودتون را ثبت کرده و وبسایتی که می‌خواید باهاش از خدمات ما استفاده کنید رو داخل پنل ثبت کنید
+                            </div>
+                        </div>
+
+                        <div className="step">
+                            <span className="secondStep">2</span>
+                            <div>
+                            توی این مرحله کافیه که تنظیمات ابتدایی از جمله پیام خوش آمدگویی، ساعات کاری و ... رو شخصی سازی کنید تا ربات آماده راه اندازی بشه                            
+                            </div>
+                        </div>
+
+                        <div className="step">
+                            <span className="thirdStep">3</span>
+                            <div>
+                            تمام ! آخرین مرحله باید کد یا پلاگین ما رو روی‌ وبسایتتون ثبت کنید تا بتونید با مشتریانتون ارتباط برقرار کنید                            
+                            </div>
+                        </div>
+
+                    </div>
+
                 </div>
             </div>
         </div>