CAMBIOS IMPORTANTES

index.html

@@ -49,16 +49,23 @@ <h1 id="titulo-sobre-nosotros">Who are we?</h1>
          experience in the teaching sector that has grown in recent years and is currently
           part of the Florida Group. </b></p>
       </div>
+        <div class="container-foto">
         <img src="styles/Edificios.jpg" id="florida-foto">
-      </div>
-      <div id="sobre-nosotros-dos">
-        <p> Lorem ipsum dolor sit amet consectetur 
-          adipisicing elit. Distinctio id deserunt 
-          tenetur beatae. Asperiores, tempore! Vero possimus
-           eius accusantium unde aliquid veniam. Numquam
+        </div>
+        <div id="container-sobre-nosotros">
+          <div id="sobre-nosotros-amarillo"> Lorem ipsum dolor sit amet consectetur 
+            adipisicing elit. Distinctio id deserunt 
+            tenetur beatae. Asperiores, tempore! Vero possimus
+            eius accusantium unde aliquid veniam. Numquam
             expedita dignissimos 
-          deserunt iste inventore doloremque minima.</p>
-      </div>
+            deserunt iste inventore doloremque minima.</p></div>
+          <div id="sobre-nosotros-rojo">Lorem ipsum dolor sit amet consectetur adipisicing 
+            elit. Expedita sequi nesciunt ad aut officia sint 
+            illum molestiae labore! Quidem voluptatem accusamus 
+            commodi voluptatibus. Accusamus perferendis at 
+            delectus quia eveniet amet.</p></div>
+    </div>
+
     </div>
     <div class="footer">
       <div class="footer-cnt">

styles/index.css

@@ -1,44 +1,69 @@
-#content-body{
-    height: max-content;
-    display: block;
+body {
+    height: 100%;
+    margin: 0;
+}
+
+#content-body {
     display: grid;
+    margin: 0;
     grid-column: 1/5;
-    margin-left: 0;
-    margin-right: 0;
     color: #1c1c1c;
-    padding-bottom: 10vh;
-    height: auto;
+    height: 100%;
     box-sizing: border-box;
-    padding: 200px;
-  }
+    flex-wrap: wrap;
+}
 
 #titulo-sobre-nosotros {
     display: flex;
+    position: static;
     justify-content: center;
     align-items: center;
     text-decoration: underline;
+    padding: 12% 0% 0% 0%;
+    flex-wrap: wrap;
 }
 
 #sobre-nosotros {
     display: flex;
-    border: 2px solid red;
+    border: 2px solid #E22636;
     border-radius: 10px;
-    width: 100%;
-    padding-left: 5%;
-    padding-right: 5%;
+    width: 90%;
+    margin: 0% 3% 0% 3%;
+    padding: 1%;
+    flex-wrap: wrap;
 }
-#florida-foto{
+
+.container-foto {
     display: flex;
-    margin: 50px;
-    margin-left: 0;
+    padding: 1% 10% 0% 10%;
+    align-items: center;
+    justify-content: center;
     flex-wrap: wrap;
 }
-#sobre-nosotros-dos{
+
+#florida-foto {
     display: flex;
-    margin: 100px;
-    color: black;
     flex-wrap: wrap;
-    width: fit-content;
-    margin: 0   ;
+    border-radius: 10%;
+    border: 2px solid #E22636;
+    flex-wrap: wrap;
+}
+
+#sobre-nosotros-amarillo {
+    background-color: #fcb900;
+    width: 50%;
+}
+
+#sobre-nosotros-rojo {
+    background-color: #E22636;
+    width: 50%;
+    flex-wrap: wrap;
 }
 
+#container-sobre-nosotros {
+    display: flex;
+    justify-content: flex-start;
+    flex-wrap: wrap;
+    padding: 2% 0% 2% 0%;
+    flex-wrap: wrap;
+}

styles/style.css

@@ -28,10 +28,10 @@ nav *{overflow: hidden;}
   display: flex;
   flex-direction: row;
   justify-content: space-between;
-  height: 75%;
+  height: 40%;
 }
 .nv-btn{
-  display:block;
+  display: block;
   width: 100%;
   text-align: center;
   padding: .5rem;
@@ -63,7 +63,7 @@ nav *{overflow: hidden;}
 
 #nv-img-cnt div img{
   display: block;
-  height: 8rem;
+  height: 6rem;
 }
 
 a{