2025-09-23 10:11:35 -06:00

59 lines
2.1 KiB
HTML

<style>
.fake {
background-image: url(img/bg11.jpg);
background-repeat: no-repeat;
background-position: center;
background-size: cover;
}
.hr-style {
opacity: 1;
width: 40%;
}
.bg-custom {
box-shadow: 0 0 10px rgba(0, 0, 0, .5);
}
</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-10 mb-2 animate__animated animate__bounceInDown">
<h2 class="text-center fw-bold text-primary">Características del sitio de salida</h2>
<hr class="border border-3 border-verde-oscuro hr-style mx-auto my-0">
</div>
<div class="col-12 px-0 mb-1 animate__animated animate__lightSpeedInLeft">
<div class="card bg-white border-0 my-2 rounded-0 bg-custom p-3 text-center">
<div class="d-flex justify-content-center align-items-center flex-row gap-2">
<img src="img/3.1.png" class="img-fluid mx-3">
<div class="parrafos text-start">
<p class="mb-2"><strong>Instrucciones:</strong> Observa las imágenes del sitio de salida que se presentan en las
tarjetas.</p>
<p class="mb-0">Si consideras que se encuentra sano, desliza la tarjeta a la <strong class="text-verde-pino">derecha</strong>. Si
crees que no está sano,
desliza la tarjeta a la <strong class="text-verde-pino">izquierda</strong>.</p>
</div>
</div>
</div>
</div>
<div class="col-12">
<div class="row justify-content-center">
<div class="col-12 mb-2">
<div class="d-flex justify-content-center align-items-center gap-2 flex-row"></div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script>
$(function () {
"use strict";
$('.wrap-course-content').addClass('fake');
});
</script>