<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>
