Image

HTML Text

<div class="p-5 sm:p-12 text-center">
  <h1 class="text-bold text-4xl text-black py-4">30% OFF COUPON</h1>
  <h3 class="text-lg mb-5">if you are looking for a new way to promote your business.</h3>
  <div class="w-full mb-8 p-2 border-dashed text-center text-bold text-gray-600 text-2xl border-4 border-blue-400">SUMMER30</div>
  <a class="block text-center w-full bg-blue-400 hover:bg-blue-500 p-3 text-white hover:text-white text-bold mb-5" href="#">Explore Collection</a>
  <a class="block text-gray-400 text-lg underline hover:text-gray-500 fabclosemodal" href="#">No, I don't like to save money.</a>
</div>

CSS Code

.jconfirm-fab-modal-439 .fab-modal-content img {
    object-fit: cover;
}

.jconfirm-fab-modal-439 .featured-img-container {
    max-width: 300px;
}

.jconfirm-fab-modal-439 .featured-img-container img {
    height: 100% !important;
}

@media (max-width: 639px) {
.jconfirm-fab-modal-439 .featured-img-container {
   max-width: 100%;
   width: 100%;
}

.jconfirm-fab-modal-439 .featured-img-container img {
   max-height: 300px;
   width: 100%;
}
}