Anggie-Trejo · GabyFel20 · Apr 24, 2024 · Apr 25, 2024 · Apr 25, 2024 · May 7, 2024
diff --git a/About Us/about us.html b/About Us/about us.html
@@ -0,0 +1,246 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>FemTrek</title>
+
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
+
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&display=swap" rel="stylesheet">
+    <link href="https://fonts.googleapis.com/css2?family=Hammersmith+One&family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap" rel="stylesheet">
+
+    <link rel="stylesheet" href="./styles/Styles.css">
+    <link rel="stylesheet" href="./styles/bootstrap.css">
+
+</head>
+
+<body>
+    <section class="header">
+        <nav class="navbar navbar-expand-lg bg-body-tertiary ms-auto">
+            <div class="container-fluid">
+
+                <a class="navbar-brand" href="#">
+                    <img src="./pics/logo-vectorizado.png" alt="Logo" width="130" height="50" class="d-inline-block align-text-top">
+                </a>
+                  <button class="navbar-toggler bg-dark-outline" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
+                    <span class="navbar-toggler-icon"></span>
+                  </button>
+
+
+              <div class="collapse navbar-collapse" id="navbarSupportedContent">
+
+                <ul class="navbar-nav ms-auto mb-2 mb-lg-0">
+                  <li class="nav-item">
+                    <a class="nav-link active" aria-current="page" href="/principal/principal-carrusel.html">Inicio</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link" href="/About Us/about us.html">Acerca de Nosotras</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link" href="/ContactoPage/contactoMain.html">Contacto</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link" href="/comunidad/comunidad.html">Comunidad</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link" href="/Pagina-registro/pagina-registro.html">Regístrate</a>
+                  </li>
+                  <li class="nav-item">
+                    <a class="nav-link" href="/Iniciar_sesión/ingreso.html">Inicia Sesión</a>
+                  </li>
+                </ul>
+              </div>
+            </div>
+          </nav>
+</section>
+
+
+
+<!--<div id="carouselExampleCaptions" class="carousel slide">
+    <div class="carousel-indicators">
+      <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
+      <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
+      <button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
+    </div>
+    <div class="carousel-inner">
+      <div class="carousel-item active">
+        <img src="..." class="d-block w-100" alt="...">
+        <div class="carousel-caption d-none d-md-block">
+          <h5>First slide label</h5>
+          <p>Some representative placeholder content for the first slide.</p>
+        </div>
+      </div>
+      <div class="carousel-item">
+        <img src="..." class="d-block w-100" alt="...">
+        <div class="carousel-caption d-none d-md-block">
+          <h5>Second slide label</h5>
+          <p>Some representative placeholder content for the second slide.</p>
+        </div>
+      </div>
+      <div class="carousel-item">
+        <img src="..." class="d-block w-100" alt="...">
+        <div class="carousel-caption d-none d-md-block">
+          <h5>Third slide label</h5>
+          <p>Some representative placeholder content for the third slide.</p>
+        </div>
+      </div>
+    </div>
+    <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev">
+      <span class="carousel-control-prev-icon" aria-hidden="true"></span>
+      <span class="visually-hidden">Previous</span>
+    </button>
+    <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next">
+      <span class="carousel-control-next-icon" aria-hidden="true"></span>
+      <span class="visually-hidden">Next</span>
+    </button>
+  </div>-->
+
+
+<section class="team section-padding" id="team">
+    <div class="container">
+      <div class="row">
+          <div class="col-md-12">
+              <div class="section-header text-center pb-5">
+                  <h1>Sobre el equipo...</h1>
+                  <p> Somos un grupo de mujeres entusiastas y sororas, que buscan brindar
+                    un espacio seguro a otras mujeres, donde la confianza, el respeto, 
+                    sororidad, transparencia y solidaridad son nuestros principales valores 
+                    para conectar con otras mujeres con intereses afines; para viajar segura,
+                     o bien, conversar y hacer amistad. 
+              </div>
+          </div>
+      </div>
+
+      <div class="row">
+      <div class="col-12 col-md-6 col-lg-3">
+        <div class="card text-center">
+            <div class="card-body">
+                <img src="pics/Tamara-Ibarra.jpeg" alt="" class="img-fluid rounded-circle">
+            <h3 class="card-title py-2">Tamara Ibarra</h3>
+            <p class="card-text"> Amante de la comida. Dándolo todo aunque no sepa cómo. Si no lo intentas, no avanzas.
+            </p>
+
+            </div>
+        </div>
+    </div>          
+
+
+          <div class="col-12 col-md-6 col-lg-3">
+              <div class="card text-center">
+                  <div class="card-body">
+                      <img src="pics/Diana-Garcia.jpeg" alt="" class="img-fluid rounded-circle">
+                  <h3 class="card-title py-2">Diana García</h3>
+                  <p class="card-text"> Curiosa y disidente por naturaleza. Soy estudiante de la máxima casa de estudios: UNAM.
+                     </p>
+
+                  </div>
+              </div>
+          </div>
+          <div class="col-12 col-md-6 col-lg-3">
+              <div class="card text-center">
+                  <div class="card-body">
+                      <img src="pics/Giselle_Licona.png" alt="" class="img-fluid rounded-circle">
+                  <h3 class="card-title py-2">Giselle Licona</h3>
+                  <p class="card-text">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sequi ipsam nostrum illo tempora esse quibusdam.</p>
+
+                  </div>
+              </div>
+          </div>
+          <div class="col-12 col-md-6 col-lg-3">
+              <div class="card text-center">
+                  <div class="card-body">
+                      <img src="pics/Sandra_Riverol.jpg" alt="" class="img-fluid rounded-circle">
+                  <h3 class="card-title py-2">Sandra Riverol</h3>
+                  <p class="card-text"> Me entusiasman las infinitas posibilidades de creación en la industria tecnológica.</p>
+
+                  </div>
+              </div>
+          </div>
+
+
+          <div class="col-12 col-md-6 col-lg-3">
+            <div class="card text-center">
+                <div class="card-body">
+                    <img src="pics/Gabriela-Felipe.jpeg" alt="" class="img-fluid rounded-circle">
+                <h3 class="card-title py-2">Gabriela Felipe</h3>
+                <p class="card-text"> ¡En una misión para conquistar el 🌍 con la ciencia y la tecnología! </p>
+
+                </div>
+            </div>
+        </div>
+
+        <div class="col-12 col-md-6 col-lg-3">
+            <div class="card text-center">
+                <div class="card-body">
+                    <img src="pics/Ana-Ruiz.jpg" alt="" class="img-fluid rounded-circle">
+                <h3 class="card-title py-2">ventAna</h3>
+                <p class="card-text text-center"> Experta en imprimir "Hola mundo" </p>
+
+                </div>
+            </div>
+        </div>
+
+
+        <div class="col-12 col-md-6 col-lg-3">
+            <div class="card text-center">
+                <div class="card-body">
+                    <img src="pics/Angelica_Trejo.jpeg" alt="" class="img-fluid rounded-circle">
+                <h3 class="card-title py-2">Angelica Trejo</h3>
+                <p class="card-text text-center"> En pro de las mujeres</p>
+
+                </div>
+            </div>
+        </div>
+
+
+        <div class="col-12 col-md-6 col-lg-3">
+            <div class="card text-center">
+                <div class="card-body">
+                    <img src="pics/MiLai_Yamamoto.jpeg" alt="" class="img-fluid rounded-circle">
+                <h3 class="card-title py-2">Mi-Lai Yamamoto Joo</h3>
+                <p class="card-text"> Maestra en Gestion de Riesgos Financieros | Diseñadora UX/UI </p>
+
+                </div>
+            </div>
+        </div>
+
+        <div class="col-12 col-md-6 col-lg-3">
+            <div class="card text-center">
+                <div class="card-body">
+                    <img src="pics/Ileana-Ramirez.jpeg" alt="" class="img-fluid rounded-circle">
+                <h3 class="card-title py-2">Illeana Ramírez</h3>
+                <p class="card-text">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Sequi ipsam nostrum illo tempora esse quibusdam.</p>
+
+                </div>
+            </div>
+        </div>
+
+
+
+
+
+
+
+
+
+      </div>
+    </div>
+</section>
+
+
+
+
+
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
+  </body>
+    </section>
+
+    <footer>
+      <p> Copyright © 2024 Todos los derechos reservados - FemTrek </p>
+    </footer>
+</body>
+
+</html>
diff --git a/About Us/pics/Ana-Ruiz.jpg b/About Us/pics/Ana-Ruiz.jpg
diff --git a/About Us/pics/Angelica_Trejo.jpeg b/About Us/pics/Angelica_Trejo.jpeg
diff --git a/About Us/pics/Diana-Garcia.jpeg b/About Us/pics/Diana-Garcia.jpeg
diff --git a/About Us/pics/Gabriela-Felipe.jpeg b/About Us/pics/Gabriela-Felipe.jpeg
diff --git a/About Us/pics/Giselle_Licona.png b/About Us/pics/Giselle_Licona.png
diff --git a/About Us/pics/Ileana-Ramirez.jpeg b/About Us/pics/Ileana-Ramirez.jpeg
diff --git a/About Us/pics/MiLai_Yamamoto.jpeg b/About Us/pics/MiLai_Yamamoto.jpeg
diff --git a/About Us/pics/Sandra_Riverol.jpg b/About Us/pics/Sandra_Riverol.jpg
diff --git a/About Us/pics/Tamara-Ibarra.jpeg b/About Us/pics/Tamara-Ibarra.jpeg
diff --git a/logo-vectorizado.png → About Us/pics/logo-vectorizado.png b/logo-vectorizado.png → About Us/pics/logo-vectorizado.png
diff --git a/About Us/styles/Styles.css b/About Us/styles/Styles.css
@@ -0,0 +1,116 @@
+/*Estilos para la Navbar*/
+.header .navbar-brand {
+    color: white !important;
+}
+
+.header .nav-link {
+    color: white !important;
+    font-size: 16.5px;
+}
+
+.header .nav-link:hover {
+    color: rgb(99, 56, 56) !important;
+}
+
+@media(max-width: 700px){
+    .nav-link{text-align: center;}
+}
+
+.header .navbar {
+    background-image: linear-gradient(to right, #F5E2BE, #e07A76);
+}
+
+
+
+    body {
+        font-family: "IBM Plex Sans", sans-serif;
+        font-weight: 400;
+        font-style: normal;
+    }
+
+
+    h1,h2 {
+        font-family: "Hammersmith One", sans-serif;
+        font-weight: 400;
+        font-style: normal;
+        padding: 20px;
+    }
+
+h3 {
+    font-family: "Hammersmith One", sans-serif;
+    font-weight: 400;
+    font-style: normal;
+    font-size: 30px;
+}
+
+
+.custom-card{
+	width: 300px;
+	height: 500px;
+}
+
+    p{text-align: justify;} 
+
+.img-fluid {
+
+    max-width:100%;
+    height:auto;
+
+}
+
+.card-body{
+    flex:1 1 auto;padding:1rem 1rem
+}
+
+
+.card-text:last-child{
+
+    margin-bottom:0
+
+}
+
+.card-text{
+    font-family: "IBM Plex Sans", sans-serif;
+    font-weight: 400;
+    font-style: normal;
+    font-size: 15px;
+
+}
+
+
+ #team-container {
+            display: flex;
+            flex-wrap: wrap;
+            justify-content: space-around;
+            padding: 20px;
+        }
+
+        .team-member {
+            width: 300px;
+            margin: 20px;
+            padding: 20px;
+            border: 1px solid #ccc;
+            border-radius: 5px;
+            text-align: center;
+            position: relative;
+        }
+
+        .team-member img {
+            width: 150px;
+            height: 150px;
+            border-radius: 50%;
+            margin-bottom: 10px;
+            position: absolute;
+            top: -75px;
+            left: 75px;
+            border: 4px solid #fff;
+        }
+
+            footer {
+                background-color: #e07A76;
+                text-align: justify;
+                width: 1500px;
+                height: 40px;
+            }
+
+