diff --git a/general.css b/general.css index e94a2c8..5f3ef91 100644 --- a/general.css +++ b/general.css @@ -1,14 +1,110 @@ -p { - margin-top: 0; - margin-bottom: 0; +* { + margin: 0; + padding: 0; + box-sizing: border-box; } body { - /* This style below will be inherited */ - font-family: Roboto, Arial; - margin: 0; - padding-top: 80px; - padding-left: 96px; - padding-right: 24px; - background-color: rgb(196, 140, 227); + font-family: 'Arial', sans-serif; + line-height: 1.6; + background-color: #f5f5f5; + color: #333; + padding: 20px; +} + +header { + text-align: center; + margin-bottom: 40px; +} + +header h1 { + font-size: 3rem; + color: #ff6b6b; +} + +header p { + font-size: 1.2rem; + color: #4d4d4d; +} + +section { + margin-bottom: 40px; +} + +#about { + text-align: center; +} + +#about img { + width: 150px; + border-radius: 50%; + margin-top: 10px; +} + +h2 { + color: #ff6b6b; + font-size: 2rem; + margin-bottom: 10px; +} + +p { + font-size: 1.1rem; + color: #333; + margin-bottom: 20px; +} + +#social .social-icons { + display: flex; + justify-content: center; + gap: 20px; +} + +#social a { + color: #ff6b6b; + text-decoration: none; + font-weight: bold; + font-size: 1.2rem; +} + +#social a:hover { + color: #ff3333; +} + +#contact { + text-align: center; +} + +#contact-form { + display: inline-block; + text-align: left; + width: 300px; +} + +#contact-form input, #contact-form textarea { + width: 100%; + padding: 10px; + margin-bottom: 10px; + border: 1px solid #ccc; + border-radius: 5px; +} + +button { + width: 100%; + padding: 10px; + background-color: #ff6b6b; + border: none; + color: white; + font-size: 1.1rem; + cursor: pointer; + border-radius: 5px; +} + +button:hover { + background-color: #ff3333; +} + +footer { + text-align: center; + margin-top: 20px; + color: #666; } diff --git a/index.html b/index.html index 3540eff..41b2f60 100644 --- a/index.html +++ b/index.html @@ -14,14 +14,26 @@
-
- -

Welcome to Noor's World

+
+

About Me

+

I'm a tech enthusiast and designer who loves creative projects. I enjoy reading, journaling, and making cool things happen using one little secret--design!

+ A drawing of me +
+ +
+

Connect with me!

+
+ LinkedIn + GitHub + Instagram +
+
+