template, inicio del curso

contenido/02.html

@@ -0,0 +1,80 @@
+<style>
+  .fake {
+    background-image: url(img/bg00.jpg);
+    background-repeat: no-repeat;
+    background-position: center;
+    background-size: cover;
+    background-attachment: fixed;
+  }
+
+  .bul0 {
+    list-style-type: none;
+    list-style-image: url(img/bul0.png);
+  }
+
+  ul.bul0>li {
+    margin-bottom: .5rem;
+  }
+</style>
+<div class='page-sco py-2 py-md-0 h-100'>
+  <div class='container h-100'>
+    <div class='row justify-content-center align-items-center h-100'>
+      <div class='col-12'>
+        <div class='row justify-content-center'>
+          <div class="col-12 text-center animate__animated animate__bounceInDown">
+            <div class="position-relative d-inline-block">
+              <h2 class="text-primary mb-1 fw-bold">Contenidos</h2>
+              <hr class="border border-2 border-verde-oscuro hr-style my-0 mb-3 opacity-100">
+            </div>
+          </div>
+          <div class="col-8">
+            <div class="row justify-content-center align-items-center">
+              <div class="col-6">
+                <ul class="bul0 text-verde-oscuro fw-bold">
+                  <li>Vivir con enfermedad renal </li>
+                  <li>Inicio en la terapia de diálisis peritoneal </li>
+                  <li>Acceso peritoneal y sus cuidados </li>
+                  <li>Terapia segura en casa </li>
+                  <li>Autocuidado </li>
+                  <li>Manejo de medicamentos y terapia dialítica</li>
+                  <li>Entrega domiciliaria </li>
+                  <li>Actuación ante incidencias  </li>
+                  <li>Procedimientos</li>
+                  <li>Alarmas</li>
+                  <li>Despedida</li>
+                </ul>
+              </div>
+              <div class="col-6 text-center animate__animated animate__zoomIn">
+                <img src="img/02.0.png" class="img-fluid">
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+<script>
+  $(function () {
+    "use strict";
+    $('.wrap-course-content').addClass('fake');
+    gsap.fromTo(".bul0 li",
+      // Estado INICIAL (from)
+      {
+        opacity: 0,
+        y: 90
+      },
+      // Estado FINAL (to)
+      {
+        opacity: 1,
+        y: 0,
+        duration: 1,
+        stagger: 0.2,
+        ease: "power3.out",
+        onComplete: function() {
+          CourseNav.setSlideVisited();
+        }
+      }
+    );
+  });
+</script>