sixth section completed

rohitmandhyan07 · Jun 4, 2024 · bfaf1f5 · bfaf1f5
1 parent 934ced1
commit bfaf1f5
Show file tree

Hide file tree

Showing 4 changed files with 146 additions and 20 deletions.
diff --git a/docs/assets/css/style.css b/docs/assets/css/style.css
@@ -3,11 +3,11 @@
   padding: 0;
   box-sizing: border-box;
 }
-/* body{
-    font-family: "Cormorant SC", serif; 
-     font-style: normal; 
-    
-} */
+body{
+    /* transform: scale(0.8);    */
+    transform: scale(0.75); /* Scale the body to 80% */
+    transform-origin: top left; /* Set the origin to the top-left corner */
+}
 .left-text, .right-img, img{
   display: inline-block;
 }
@@ -565,7 +565,8 @@ p.desc-5{
   position: relative;
   top: 2800px;
   left: -1px;
-  width: 1920px;
+  /* width: 1920px; */
+  width: 100%;
   height: fit-content;
   background: #FAFAFA 0% 0% no-repeat padding-box;
   opacity: 1;
@@ -607,18 +608,97 @@ div.fifth{
   .growth-images{
     margin-top: 60px;
     margin-left: 375px;
-    width: 100%;
+    /* width: 100%; */
     height: 233px;
-    display: grid;
-    grid-template-columns: repeat(270px,4);
-
+    display: flex;
+    /* border:2.5px solid black; */
+    gap: 30px;  
+
   }
-  .hover-boxes{
-    border: 1px solid red;
+  div.hover-boxes{
+    /* border: 1px solid red; */
     display: inline-block;
+    width: 270px;
+    height: 233px;
+    /* background: #FFFFFF 0% 0% no-repeat padding-box; */
+    background: #FFFFFF 0% 0% no-repeat padding-box;
+    /* box-shadow: 3px 6px 20px #672C2C1F; */
+    opacity: 1;  
+
+    img.red-icons{
+      display: inline-block;
+    }
+
+      /* p.number, p.subtitle{
+      
+      } */
+
+    p.number{
+      /* margin-left: 61px; */
+      margin-top: 20px;
+      width: 100%;
+      text-align: center;
+      font: normal normal 300 60px/65px Poppins;
+      letter-spacing: 0px;
+      color: #000000;
+      text-transform: uppercase;
+      opacity: 1;
+    }
+    p.subtitle{
+      text-align: center;
+      font: normal normal 300 20px/80px Poppins;
+      letter-spacing: 0px;
+      color: #000000;
+      opacity: 1;
+    }
+  }
+  .box-1 img{
+    width: 39px;
+    height: 34px;
+    margin-left: 115px;
+    margin-top: 34px;
+  }
+  .box-2 img{
+    width: 36px;
+    height: 36px;
+    margin-left: 117px;
+    margin-top: 33.35px;
   }
+  .box-3 img{
+    width: 44px;
+    height: 48px;
+    margin-left: 117px;
+    margin-top: 28px;
+  }
+  .box-4 img{
+    width: 36px;
+    height: 36px;
+    margin-left: 117px;
+    margin-top: 33.35px;
+  }
+  /* .box-1 p.number{
+
+  }
+  .box-2 p.number{
+
+  }
+  .box-3 p.number{
+    margin-top: 0px;
+  }
+  .box-4 p.number{
 
+  } */
+
+
+}
+.hover-boxes:hover{
+  /* cursor: pointer; */
+  cursor: url("/docs/assets/images/cursor-icon/icons8-cursor.svg"), auto;
+  border: 4px solid white;
+  box-shadow: 3px 6px 20px #672C2C1F;
 }
+
+
 /* div.l12{
   margin-left: 682px;
   margin-top: 40px;
@@ -634,3 +714,38 @@ div.fifth{
   display: inline-block;
   margin-top: 60px;
 } */
+
+div.sixth{
+  position: relative;
+  top: 2800px;
+  width: 100%;
+  div.l13{
+    text-align: center;
+    font: normal normal 600 24px/26px Cormorant SC;
+    letter-spacing: 0px;
+    color: #FF3147;
+    text-transform: uppercase;
+    opacity: 1;
+    margin-top: 100px;
+    margin-left: 800px;
+    display: inline-block;
+  }
+  div.l14{
+    display: inline-block;
+    text-align: center;
+    font: normal normal bold 45px/65px Cormorant SC;
+    letter-spacing: 0px;
+    color: #000000;
+    text-transform: uppercase;
+    opacity: 1;
+    margin-top: 40px;
+    margin-left: 661px;
+  }
+  img.comma{
+    position: absolute;
+    display: inline-block;
+    width: 64px;
+    height: 45px;
+    opacity: 1;
+  }
+}
diff --git a/docs/assets/images/Path4402completeProject/complete-tick.png b/docs/assets/images/Path4402completeProject/complete-tick.png
diff --git a/docs/assets/images/cursor-icon/icons8-cursor.svg b/docs/assets/images/cursor-icon/icons8-cursor.svg
diff --git a/docs/index.html b/docs/index.html
@@ -168,29 +168,39 @@ <h1 class="modal-title fs-5" id="staticBackdropLabel">Talk to us</h1>
             <div class="l11">Experts growts</div>
             <div class="l12">Our Company Growth</div>
             <div class="growth-images">
-                <div class="hover-boxes">
-                    <img src="" alt="" class="red-icons">
+                <div class="hover-boxes box-1">
+                    <img src="assets/images/heartSatisfiedCustomers/heart (2)@2x.png" alt="" class="red-icons">
                     <p class="number">199 +</p>
                     <p class="subtitle">Statisfied Customers</p>
                 </div>
-                <div class="hover-boxes">
-                    <img src="" alt="" class="red-icons">
+                <div class="hover-boxes box-2">
+                    <img src="assets/images/clock(3)DaysOfOperation/clock (3).svg" alt="" class="red-icons">
                     <p class="number">1591 +</p>
                     <p class="subtitle">Days Of Operation</p>
                 </div>
-                <div class="hover-boxes">
-                    <img src="" alt="" class="red-icons">
+                <div class="hover-boxes box-3">
+                    <img src="assets/images/Path4402completeProject/complete-tick.png" alt="" class="red-icons">
                     <p class="number">283 +</p>
                     <p class="subtitle">Complete Project</p>
                 </div>
-                <div class="hover-boxes">
-                    <img src="" alt="" class="red-icons">
+                <div class="hover-boxes box-4">
+                    <img src="assets/images/Path4406winAwards/Path 4406.svg" alt="" class="red-icons">
                     <p class="number">75 +</p>
                     <p class="subtitle">Win Awards</p>
                 </div>
             </div>
         </div>
 
+        <div class="sixth">
+            <div class="l13">client's feedback</div>
+            <div class="l14">people say's about us !</div>
+            <img src="assets/images/QuotemarksleftClientsAboveHeader/Quotemarks-left.svg" alt="" class="comma">
+            <div class="l15">Jannat Tumpa The standard chunk of Lorem Ipsum used since the 1500s is reproduced below for those interested. Sections Bonorum et Malorum original.</div>
+            <div class="l16">
+                <span class="name">JANNAT TUMPA</span>
+                <span class="post">- COO, AMERIMAR ENTERPRISES, INC.</span>
+            </div>
+        </div>
     <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script> <!-- Including Bootstrap JS-->
     <script src="assets/js script/script.js"></script>
 </body>