breatheco-de · sispizua · Nov 17, 2025 · Nov 17, 2025 · Nov 17, 2025 · Nov 17, 2025
diff --git a/.vscode/settings.json b/.vscode/settings.json
@@ -0,0 +1,5 @@
+{
+    "githubPullRequests.ignoredPullRequestBranches": [
+        "master"
+    ]
+}
diff --git a/website/assets/css/style.css b/website/assets/css/style.css
@@ -1,3 +0,0 @@
-body{
-    background: #BDBDBD;
-}

diff --git a/website/assets/img/fotojuan2.jpg b/website/assets/img/fotojuan2.jpg
diff --git a/website/index.html b/website/index.html
@@ -7,27 +7,34 @@
     <!-- Required meta tags -->
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 
-    <!-- Bootstrap CSS -->
-    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
+    <!-- Bootstrap CSS Migue Garcia Bello-->
+    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"
+        integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB" crossorigin="anonymous">
 
+    <!--FontAwesome Añadido por Migue Garcia Bello-->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/7.0.1/css/all.min.css">
     <!-- Custom CSS -->
     <link href="assets/css/style.css?v0.1" rel="stylesheet">
 </head>
 
 <body>
 
     <!-- Navigation -->
-    <div class="container-fluid">
+    <div class="">
         <span require-file="./templates/navbar.html"></span>
         <!-- Full Width Image Header -->
         <span require-file="./templates/tagline.html"></span>
     </div>
     <!-- Page Content -->
-    <div class="container-fluid">
+    <div class="container">
         <!-- First Featurette -->
         <span require-file="./templates/first_heading.html"></span>
         <span require-file="./templates/services.html"></span>
         <span require-file="./templates/portfolio.html"></span>
+        <span require-file="./templates/otroPortfolio.html"></span>
+
+    </div>
+    <div class="container-fluid p-0">
         <span require-file="./templates/contact.html"></span>
         <span require-file="./templates/footer.html"></span>
     </div>
@@ -37,9 +44,11 @@
     <script type="text/javascript" src="assets/js/fix.js"></script>
 
 
-    <!-- Optional JavaScript -->
-    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
+    <!-- Optional JavaScript Actualizado por Migue Garcia Bello -->
+    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
+        integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
+        crossorigin="anonymous"></script>
 
 </body>
 
-</html>
+</html>
diff --git a/website/templates/contact.html b/website/templates/contact.html
@@ -1,2 +1,43 @@
 <!-- your html code here -->
-<p>Hello, I'm contact.html</p>
+<div class="position-relative w-100" style="height: auto">
+
+    <!-- Imagen de fondo -->
+    <img src="/website/assets/img/fotojuan2.jpg" class="position-absolute top-0 start-0 w-100 h-100 object-fit-cover opacity-75"
+        alt="fondo">
+
+    <!-- CONTENIDO ENCIMA -->
+    <div class="position-relative container py-5">
+        <div class="row">
+            <!-- Bloque izquierda -->
+            <div class="col-md-6 bg-white p-4  bg-transparent text-light">
+                <h1>Obten tu cita con los mejores medicos</h1>
+                <p>Si no eres estudiante de 4geeks no puedes agendar</p>
+
+                <label class="form-label">Clínica 4 gatos</label>
+                <select class="form-select" aria-label="Default select example">
+                    <option selected>Selecciona Medicos Expertos</option>
+                    <option value="1">Juan Experto en Animales Exoticos</option>
+                    <option value="2">Aneth Experta en Aves</option>
+                    <option value="3">Migue Experto en animales acuaticos</option>
+                    <option value="3">Santiago Experto en Animales Domesticos</option>
+                </select>
+
+                <label for="fecha">Fecha</label>
+                <input type="date" class="form-control" id="fecha">
+
+                <button class="btn btn-danger w-100 ">BUSCAR CITA</button>
+            </div>
+
+            <!-- Bloque derecha -->
+            <div class="col-md-6 text-white mt-5 ">
+                <div class="p-4 bg-primary bg-opacity-75 rounded mt-md-0 position-absolute w-50 h-70">
+                    <h4>Estudiantes de 4Geeks</h4>
+                    <h3 class="mt-3">0800-Veterinaria</h3>
+                    <p>Clinica 4 Gatos<br>Estudiantes de 4geeks</p>
+                </div>
+            </div>
+
+        </div>
+    </div>
+
+</div>
diff --git a/website/templates/first_heading.html b/website/templates/first_heading.html
@@ -1,2 +1,18 @@
 <!-- your html code here -->
-<p>Hello, I'm the first_heading.html</p>
+<!--Migue García Bello-->
+<div class="row p-2 mt-0 d-flex align-items-center">
+    <div class="col-lg-9 col-md-6 col-sm-12 order-md-1 order-sm-2">
+        <h2 class="text-primary">Su salud, nuestra prioridad</h2>
+        <h3 class="text-info">Cada animal es único:</h3>
+        <p>Nuestro experimentado equipo está compuesto por profesionales con una profunda trayectoria
+            en las diversas especialidades de la medicina veterinaria. Nuestro compromiso inquebrantable es con su
+            bienestar.</p>
+    </div>
+    <div class="col-lg-3 col-md-6 col-sm-12 order-md-2 order-sm-1 d-flex justify-content-center p-2">
+        <div class="ratio ratio-1x1 w-75">
+            <img class="rounded-circle border border-3 border-info" 
+                src="https://content.elmueble.com/medio/2022/09/08/gato-sin-pelo_00000000_230405095919_900x900.jpg"
+                alt="Gato_Persa.jpg">
+        </div>
+    </div>
+</div>
diff --git a/website/templates/footer.html b/website/templates/footer.html
@@ -1,7 +1,7 @@
 <footer>
     <div class="row">
-        <div class="col-lg-12">
-            <p>Copyright &copy; Your Website Name 2021</p>
+        <div class="col-lg-12 d-flex justify-content-center">
+            <p>Copyright Estudiantes: Santiago, Aneth, Migue y Juan presentan su proyecto colaborativo</p>
         </div>
     </div>
 </footer>
diff --git a/website/templates/navbar.html b/website/templates/navbar.html
@@ -1,2 +1,55 @@
 <!-- your html code here -->
-<p>Hello, I'm the navbar.html</p>
+<nav class="navbar navbar-expand-lg bg-primary p-0" style="height: 50px">
+  <div class="container-fluid">
+    <a class="navbar-brand text-white" href="#"><i class="fa-solid fa-paw"></i></a>
+    <button class="navbar-toggler border border-0 " type=" button" data-bs-toggle="collapse"
+      data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false"
+      aria-label="Toggle navigation">
+      <i class="fa-solid fa-bars text-white"></i>
+    </button>
+    <div class="collapse navbar-collapse" id="navbarSupportedContent">
+      <ul class="navbar-nav me-auto mb-2 mb-lg-0">
+        <li>
+          <a class="nav-link active text-white" href="#">Inicio</a>
+        </li>
+        <li class="nav-item m-0">
+          <a class="nav-link active text-white rounded bg-danger m-0" aria-current="page" href="#">Clínica 24H</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link active text-white" href="#">Urgencias</a>
+        </li>
+        <li class="nav-item dropdown">
+          <a class="nav-link dropdown-toggle text-white " href="#" role="button" data-bs-toggle="dropdown"
+            aria-expanded="false">
+            Clinicas
+          </a>
+          <ul class="dropdown-menu">
+            <li><a class="dropdown-item" href="#">Aquí</a></li>
+            <li><a class="dropdown-item" href="#">Allá</a></li>
+            <li><a class="dropdown-item" href="#">La via te guía</a></li>
+          </ul>
+        </li>
+        <li class="nav-item dropdown">
+          <a class="nav-link dropdown-toggle text-white" href="#" role="button" data-bs-toggle="dropdown"
+            aria-expanded="false">
+            Servicios
+          </a>
+          <ul class="dropdown-menu">
+            <li><a class="dropdown-item" href="#">Esterilización</a></li>
+            <li><a class="dropdown-item" href="#">Hospitalización</a></li>
+            <li><a class="dropdown-item" href="#">Exorcismo</a></li>
+            <li><a class="dropdown-item" href="#">Lectura de patas + recortado de garras</a></li>
+            <li><a class="dropdown-item" href="#">Matchmaking</a></li>
+            <li><a class="dropdown-item" href="#">Fisioterapia</a></li>
+          </ul>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link active text-white" href="#">Planes de Salud</a>
+        </li>
+        <li class="nav-item">
+          <a class="nav-link active text-white" href="#">Citas</a>
+        </li>
+      </ul>
+    </div>
+  </div>
+</nav>