2nd/day

lakshit-html · Oct 24, 2024 · 9d4655b · 9d4655b
1 parent 5721531
commit 9d4655b
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 20 deletions.
diff --git a/about.html b/about.html
@@ -2,15 +2,15 @@
 <html lang="en">
 <head>
     <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <meta name="viewport" content="width=2136, initial-scale=1.0">
     <title>About HELP</title>
     <style>
         *{
             padding:0px;
             margin: 0px;
         }
         h1{
-            color: rgb(10, 9, 9);
+            color: rgb(255, 255, 255);
             font-family: Impact, serif;
     font-size: 3rem;
     font-weight: 900;
@@ -19,14 +19,27 @@
     margin-bottom: 1rem;
     text-transform: uppercase;
     margin-top: 10px;
+
+
+        }
+        .fstpanel{
+            background-image: url(map-bg.png);
+            padding: 45px 500px;
+            margin-left: -40px;
+        }
+        .hd{
+            padding: 50px 50px 0px 50px;
+            margin-left: -4px;
         }
         .heading{
             color: darkorange;
             margin-top: -18px;
+            padding:  0px 50px 50px 50px;
+            margin-left: -4px;
         }
         div{
-            width: 550px;
-            margin-left: 60px;
+            width: 655px;
+            margin-left: 0px;
 
         }
         body{
@@ -53,17 +66,12 @@
     align-items: center;
     margin: 0px;
     padding: 0px;
+    background-color: rgba(8, 14, 24, 0.89)
 
  }
 
 
- .logo{
-    position: absolute;
-    display: flex;
-    z-index: 5;
-    filter:invert(1);
 
-}
 
 ul{
         list-style-type: none;
@@ -76,7 +84,7 @@
 
     display: flex;
     text-decoration: none;
-    margin-left: 850px;
+    margin-left: 650px;
     margin-top: 10px;
     z-index: 5;
     font-size: 30px;
@@ -103,7 +111,7 @@
 
  }
  a:hover{
-    font-size: 40px;
+    font-size: 34px;
  }
 
  @font-face {
@@ -121,20 +129,29 @@
 
 }
 .ourvalues{
-    margin-left: -3px;
+  margin-left: -3px;
 }
 .objects:hover{
 height: 30px;
 width: 30px;
 }
-
+.img1{
+    margin-left: 835px;
+    position: absolute;
+    margin-top: 80px;
+    border-radius: 10px;
+    width: 500px;
+}
+    .img2{
+        position: absolute;
+        margin-left: 800px;
+        margin-top: 530px;
+        border-radius: 10px;
+    }
     </style>
 </head>
 <body>
     <nav class="Nav">
-        <Div class="logo">
-            <img height="80px" width=150px; src="Screenshot_2024-10-22_154148-removebg-preview (1).png" alt="">
-        </Div>
         <ul class="ul">
             <li><a href="index.html">Home</a></li>
             <li><a href="about.html">About</a></li>
@@ -143,12 +160,14 @@
           </ul>
 
             </nav>
-    <div>
-        <h1>Empowering Communities To Advance Social Change Through</h1>
+    <div class="fstpanel">
+        <h1 class="hd">Empowering Communities To Advance Social Change Through</h1>
         <h1 class="heading">Accessible Technology Solutions</h1>
 
     </div>
     <div class="objects">
+        <img class="img1" src="360_F_598856174_OjkYL8BbXuYxRmHrV37SOUabxeJxQucq.jpg" alt="">
+        <img src="istockphoto-1093177328-612x612.jpg" alt="" class="img2">
     <div class="divbg">
         <h2>
             Introduction:

diff --git a/style.css b/style.css
@@ -16,7 +16,7 @@ ul{
     /* position:inherit; */
     display: flex;
     text-decoration: none;
-    margin-left: 850px;
+    margin-left: 650px;
     margin-top: 10px;
     z-index: 5;
     font-size: 30px;