Add files via upload

index.html

@@ -50,10 +50,14 @@ <H1>Hi, I'm Abdelrahman , <span class="multiText"></span>
             </H1>
 
             <p>
-                Lorem ipsum, dolor sit amet consectetur adipisicing elit. Repellendus rem eos aliquid quo rerum
-                temporibus ipsum distinctio numquam ut omnis placeat, nam sint atque quos dolorem laborum? Rerum, esse
-                dolorem.
+                I'm Abdelrahman Yasser – a graphic designer and Android developer. I love turning creative ideas into user-friendly designs and bringing them to life in the Android world. Let's build something awesome together!
+
             </p>
+            <div class="socials2">
+                <a href="https://www.facebook.com/abdellrahman.yasser.94/" target="_blank"><i class="ri-facebook-line"></i></a>
+                <a href="https://www.linkedin.com/in/vbdoyasser/" target="_blank"><i class="ri-linkedin-line"></i></a>
+                <a href="https://github.com/AbdoYasser74 "target="_blank"><i class="ri-github-line"></i></a>
+            </div>
             <a href ="images/CV.pdf"Download class="btn">Download CV</a>
         </div>
         <div class="image">
@@ -176,9 +180,9 @@ <h3>Movie App</h3>
                 Lorem ipsum dolor sit amet consectetur adipisicing elit.
             </p>
             <div class="socials">
-                <a href="#"><i class="ri-youtube-line"></i></a>
-                <a href="#"><i class="ri-instagram-line"></i></a>
-                <a href="#"><i class="ri-twitter-line"></i></a>
+                <a href="https://www.facebook.com/abdellrahman.yasser.94/" target="_blank"><i class="ri-facebook-line"></i></a>
+                <a href="https://www.linkedin.com/in/vbdoyasser/" target="_blank"><i class="ri-linkedin-line"></i></a>
+                <a href="https://github.com/AbdoYasser74 "target="_blank"><i class="ri-github-line"></i></a>
             </div>
         </div>
         <div class="column">

style.css

@@ -64,6 +64,28 @@ nav{
 .link a:hover::after{
     width: 70%;
 }
+.socials2{
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+    margin-bottom: 3rem;
+}
+
+.socials2 a{
+    color: #ccc;
+    border: 1px solid #ccc;
+    padding: 5px 10px;
+    font-size: 1.25rem;
+    border-radius: 100%;
+    transition: all 0.3s ease;
+}
+
+.socials2 a:hover{
+    color: #fff;
+    background-image:linear-gradient(90deg, #0ea5ea, #0bd1d1);
+
+    border-color: #0bd1d1;
+}
 
 .btn{
     padding: 1rem 2rem;
@@ -134,8 +156,8 @@ header .image{
 
 
 header .image img{
-    max-width: 600px;
-    margin: auto;
+    max-width: 500px;
+
 }
 
 section .header{