portada

contenido/01.html

@@ -12,6 +12,14 @@
     background-position: left;
     background-size: 100% auto;
   }
+
+  .btn-comenzar {
+    border-radius: 20px;
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+    border: 0;
+    box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
+  }
 </style>
 <div class="page-sco py-2 py-md-4 h-100">
   <div class="container h-100">
@@ -21,13 +29,18 @@
           <div class="col-11">
             <div class="row justify-content-center align-items-center">
               <div class="col-8">
-                <h1 class="text-primary fw-bold">
+                <h1 class="text-white fw-bold animate__animated animate__lightSpeedInLeft">
                   INDUCCIÓN AL PROGRAMA DE
                   <br />
                   DIÁLISIS PERITONEAL
-                  <span class="fw-bold text-verde-oscuro">>>></span>
+                  <span class="fw-bold text-verde-ceniza">>>></span>
                 </h1>
-                <p class="text-primary">Extender vidas >>> Expandir posibilidades</p>
+                <p class="text-white animate__animated animate__lightSpeedInLeft">Extender vidas <span class="text-verde-ceniza">>>></span> Expandir posibilidades</p>
+                <div class="w-100 position-relative mt-3 animate__animated animate__zoomIn">
+                  <button class="btn bg-white text-verde-oscuro btn-comenzar animate__animated animate__pulse animate__infinite">
+                    <h4 class="my-0 fw-bold">Comenzar</h4>
+                  </button>
+                </div>
               </div>
               <div class="col-4">
                 <img src="img/0.1.png" class="img-fluid" alt="" />
@@ -50,8 +63,9 @@
     $('.wrap-course-content').addClass('fake');
     CourseNav.setSlideVisited();
 
-    // $('.btn-comenzar').on('click', function () {
+    $('.btn-comenzar').on('click', function () {
-    //     CourseNav.nextSlide();
+      CourseNav.nextSlide();
-    // });
+      $(this).removeClass('animate__animated animate__pulse animate__infinite');
+    });
   });
 </script>