Live Preview
Tag didn’t load? Click here and let us know!Share this result
Previews are deleted daily. Get a permanent share link sent to your inbox:
Script
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<link rel="stylesheet" href="test.css" />
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB"
crossorigin="anonymous"
/>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"
integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
crossorigin="anonymous"
></script>
</head>
<body>
<!-- HEADER START -->
<div class="container mainbox">
<header
class="d-flex flex-wrap justify-content-center py-3 mb-4 border-bottom"
>
<a
href="/"
class="d-block mb-3 mb-md-0 me-md-auto link-body-emphasis text-decoration-none"
>
<span class="firsttext">AL-QURAN</span><br />
<span class="secondtext">INTERNATIONAL</span><br />
<span class="thirdtext">ACADEMY</span>
</a>
<ul class="nav nav-pills">
<li class="nav-item">
<a href="#" class="nav-link active" aria-current="page">Home</a>
</li>
<li class="nav-item"><a href="#" class="nav-link">about us</a></li>
<li class="nav-item"><a href="#" class="nav-link">all courses</a></li>
<li class="nav-item">
<a href="#" class="nav-link">Pricing and FAQs</a>
</li>
<li class="nav-item"><a href="#" class="nav-link">contact</a></li>
<li class="nav-item">
<a href="#" class="nav-link day3">3 days free trial</a>
</li>
</ul>
</header>
</div>
<!-- HEADER END -->
<!-- hero start -->
<div class="container col-xxl-8 px-4 py-5">
<div class="row flex-lg-row-reverse align-items-center g-5 py-5">
<div class="col-10 col-sm-8 col-lg-6">
<img
src="./2ff6177008c3c16966270f0539a179bd.jpg"
class="d-block mx-lg-auto img-fluid"
alt="Bootstrap Themes"
width="300"
height="200"
loading="lazy"
/>
</div>
<div class="col-lg-6">
<p class="fs-6">ON-DEMAND LIVE CLASSES</p>
<p class="lead fw-bold fs-4">
Start Learning Quran With
</p>
<h1 class="display-5 fw-bold text-body-emphasis lh-1 mb-3">
Al-Quran International Academy.
</h1>
<p class="fw-medium">Learn Quran Online with the #1 Trusted Quran Academy</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-start">
<button type="button" class="btn btn-primary btn-lg px-4 me-md-2">
book free trial
</button>
<button type="button" class="btn btn-outline-secondary btn-lg px-4">
browse course
</button>
</div>
</div>
</div>
</div>
<!-- hero complete -->
<!-- start learning quran -->
<div class="container col-xxl-8 px-4 py-5">
<div class="row flex-lg-row-reverse align-items-center g-5 py-5">
<div class="col-10 col-sm-8 col-lg-6">
<img
src="./2ff6177008c3c16966270f0539a179bd.jpg"
class="d-block mx-lg-auto img-fluid"
alt="Bootstrap Themes"
width="300"
height="200"
loading="lazy"
/>
</div>
<div class="col-lg-6">
<h2 class="display-5 fw-bold text-body-emphasis lh-1 mb-3">
Start <p class="color">Learning Quran</p> Today with Experts
</h2>
<p class="lead">
Register yourself or your child with us today and take your first <span class="fw-bold">Free Trial Class</span>
</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-start">
<ul>
<li>For beginners: Quran reading with Tajweed</li>
<li>Quran Memorization and Tafseer</li>
<li>Quran Traslation</li>
<li>Tajweed and Tarteel Course</li>
<li>Basic Islamic Education and Daily Supplications (Dua's) </li><br>
<button type="button" class="btn btn-outline-secondary btn-lg px-4">
BROWSE COURSES
</button>
</div>
</div>
</div>
</div>
<!-- start learning quran -->
<!-- every class -->
<div class="container col-xxl-8 px-4 py-5">
<div class="row flex-lg-row-reverse align-items-center g-5 py-5">
<div class="col-lg-6">
<h1 class="display-5 fw-medium text-body-emphasis lh-1 mb-3 p-3 ">
<span class="class fw-bold">Every Class</span> Your child moves one step forward
</h1>
<p class="lead fs-3 fw-normal">
Every child is different and learns better in their own way. Live tutors use a variety of teaching tools and advanced methods to engage your child and make learning fun anmd interesting.
</p>
<p class="para">With <span class=" para fw-bold">Al Quran International Academy</span> live classes, your child will learn about islam and more.</p>
<div class="d-grid gap-2 d-md-flex justify-content-md-start">
<button type="button" class="btn btn-outline-secondary button btn-lg">
ENROLL NOW
</button>
</div>
</div>
<div class="col-10 col-sm-8 col-lg-6">
<img
src="./2ff6177008c3c16966270f0539a179bd.jpg"
class="d-block mx-lg-auto img-fluid"
alt="Bootstrap Themes"
width="300"
height="200"
loading="lazy"/>
</div>
</div>
</div>
<!-- every class -->
<!-- discription -->
<div class="bg-white text-secondary px-4 py-5 text-center">
<div class="py-5">
<h2 class="text-body ">Something About</h2>
<h1 class="display-5 fw-bold text-success"> Al Quran International Academy </h1>
<div class="col-lg-6 mx-auto">
<p class="fs-5 mb-4 fw-bold">
Your Premier Online Quran & Arabic Learning Hub
</p>
<p class="fw-bolder">We offer a wide range of courses, including </p>
<ol class="fw-bold">
<li >Madani Qaida</li>
<li>Tajweed and Tarteel Quran</li>
<li>Quran Memorization</li>
<li>Basic Islamic education</li>
<li>Daily Supplications (Duas's) </li>
</ol>
</div>
</div>
</div>
<!-- discription -->
<!-- papular courses -->
<div class="display flex-wrap`">
<div>
<p class="top">Top Categories</p>
<p class="courses">Popular Courses</p>
</div>
<div>
<p class="paragraph"><span>Al Quran International Academy</span> offers a large number <br> of courses in the Quran, Arabic language,<br> and Islamic studies that suits both adults & kids.</p>
</div>
<div>
<button type="button" class="btn btn-outline-dark button btn2 btn-lg">
Payment Plans
</button>
</div>
</div>
<!-- popular couses -->
<div class="container"> <div class="row row-cols-1 row-cols-sm-2 row-cols-md-3 g-3"> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> <div class="col"> <div class="card shadow-sm"> <svg aria-label="Placeholder: Thumbnail" class="bd-placeholder-img card-img-top" height="225" preserveAspectRatio="xMidYMid slice" role="img" width="100%" xmlns="http://www.w3.org/2000/svg"><title>Placeholder</title><rect width="100%" height="100%" fill="#55595c"></rect><text x="50%" y="50%" fill="#eceeef" dy=".3em">Thumbnail</text></svg> <div class="card-body"> <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p> <div class="d-flex justify-content-between align-items-center"> <div class="btn-group"> <button type="button" class="btn btn-sm btn-outline-secondary">View</button> <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button> </div> <small class="text-body-secondary">9 mins</small> </div> </div> </div> </div> </div> </div>
</body>
</html>
Landing Page
This ad does not have a landing page available
Network Timeline
Performance Summary
5
Requests
2
Domains
73KB
Transfer Size
321KB
Content Size
137.0ms
Dom Content Loaded
220.0ms
First Paint
140.0ms
Load Time
Domain Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...
Timings (ms)
Loading...
Total Time
Loading...
Content Breakdown
Transfer Size (bytes)
Loading...
Content Size (bytes)
Loading...
Header Size (bytes)
Loading...
Requests
Loading...