From 56012a004de8e26adfe62825cebd958f94e27f07 Mon Sep 17 00:00:00 2001
From: Esteban Munoz <esmunozdev@gmail.com>
Date: Fri, 18 Mar 2022 16:13:54 -0600
Subject: [PATCH] second section ready css

---
 index.html |  6 +++---
 styles.css | 35 +++++++++++++++++++++++++++++++++++
 2 files changed, 38 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index d2354d16c..bcb25da0b 100644
--- a/index.html
+++ b/index.html
@@ -51,9 +51,9 @@
         </div>
     </div>
     </section>
-    <section>
-        <img src="images\triangle-hexagon.svg" alt="triangle-hexagon">
-        <h1>Bring the best of open source to your company</h1>
+    <section class="sectionTwo">
+        <div class="sectionTwoDiv1"><img src="images\triangle-hexagon.svg" alt="triangle-hexagon"></div>
+        <h1 class="sectionTwoDiv2">Bring the best of open source to your company</h1>
         <article>npm is the tool used by over 11,000,000 JavaScript developers around the world. Your developers already use it. Your company depends on it. Create an Org and get more out of the tools your team already knows and loves.</article>
     </section>
     <section>
diff --git a/styles.css b/styles.css
index 4d51872d9..67bbfdadc 100644
--- a/styles.css
+++ b/styles.css
@@ -150,3 +150,38 @@ nav a {
   color: rgb(0, 0, 0);
   font-weight: bold;
 }
+
+.sectionTwo {
+  height: 600px;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  background-color: rgba(255, 255, 255, 0.3);
+}
+
+.sectionTwoDiv1 {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.sectionTwoDiv2 {
+  display: flex;
+  align-items: center;
+  background-color: rgba(255, 204, 53, 0.4);
+  transform: skew(9deg, 0deg);
+  font-style: italic;
+  background-size: 20px;
+}
+
+.sectionTwo img {
+  width: 200px;
+}
+
+.sectionTwo article {
+  width: 700px;
+  text-align: center;
+  margin-bottom: 50px;
+}