summaryrefslogtreecommitdiff
path: root/lessons
diff options
context:
space:
mode:
authoraltaf-creator <athaalaa@gmail.com>2023-07-25 09:45:30 +0700
committeraltaf-creator <athaalaa@gmail.com>2023-07-25 09:45:30 +0700
commite71f6203faf13574ef45bf80e23a546ac7866d5d (patch)
tree2ef9f32f6c7feeb50096e0141eb1002a4e3e807a /lessons
Initial commit
Diffstat (limited to 'lessons')
-rw-r--r--lessons/1/1/materi1.html129
-rw-r--r--lessons/1/index.html53
-rw-r--r--lessons/index.html166
3 files changed, 348 insertions, 0 deletions
diff --git a/lessons/1/1/materi1.html b/lessons/1/1/materi1.html
new file mode 100644
index 0000000..641daa6
--- /dev/null
+++ b/lessons/1/1/materi1.html
@@ -0,0 +1,129 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="/style.css">
+ <link rel="icon" href="/assets/images/master.png">
+ <title>Al Azhar 9th Grade Lesson Notes</title>
+ <script src="https://kit.fontawesome.com/d279a1f519.js" crossorigin="anonymous"></script>
+</head>
+<body>
+ <a class="fixed-top-btn menu-btn" onclick="toggleNav()" href="javascript:void(0)"><i class="fa-solid fa-bars"></i></a>
+ <a href="../" class="fixed-top-btn back-btn" id="backbtn"><i class="fa-solid fa-chevron-left"></i></a>
+ <div id="console"></div>
+ <div id="sidebar">
+ <a href="/index.html">
+ <img src="/assets/images/master.png" alt="" class="sidebar-logo">
+ </a>
+ <h3 id="title" class="align-center">Al Azhar 9th Grade Lesson Notes</h3>
+ <hr class="divider">
+ <a href="/about/author.html" class="sidebar-link link">About the Author</a>
+ <a href="/about/school.html" class="sidebar-link link">About School</a>
+ <a href="/lessons" class="sidebar-link link">Lessons</a>
+ <a href="/lessons/1/" class="sidebar-link link sidebar-sublink">Lesson 1</a>
+ <a href="/lessons/2/" class="sidebar-link link sidebar-sublink">Lesson 2</a>
+ <a href="/lessons/3/" class="sidebar-link link sidebar-sublink">Lesson 3</a>
+
+ <hr class="divider">
+ <div id="toc">
+ <h4>Table of Contents</h4>
+ </div>
+ </div>
+
+ <div class="banner-container" id="banner">
+ <div class="banner-bg" id="img-supplies"></div>
+ <h1 class="banner-text" id="banner-txt">Lesson 1: Bab 1 - Materi 1</h1>
+ </div>
+
+ <div id="main">
+ <section>
+ <h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading2">Heading 2</h1>
+ <h2 id="subheading1">Sub Heading 1</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h2 id="subheading2">Sub Heading 2</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p><h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading2">Heading 2</h1>
+ <h2 id="subheading1">Sub Heading 1</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h2 id="subheading2">Sub Heading 2</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p><h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading2">Heading 2</h1>
+ <h2 id="subheading1">Sub Heading 1</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h2 id="subheading2">Sub Heading 2</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p><h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading2">Heading 2</h1>
+ <h2 id="subheading1">Sub Heading 1</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h2 id="subheading2">Sub Heading 2</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p><h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading2">Heading 2</h1>
+ <h2 id="subheading1">Sub Heading 1</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h2 id="subheading2">Sub Heading 2</h2>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ <h1 id="heading1">Heading 1</h1>
+ <p>
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas eleifend ligula ut mi hendrerit scelerisque. Vivamus ut orci mi. Quisque in mollis lectus, in varius ante. Nunc id aliquet nisl. Donec velit lorem, dignissim vitae aliquet quis, dapibus tincidunt mauris. Nullam quis volutpat est. Aliquam erat volutpat. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sed vehicula mauris. Maecenas vitae elementum lacus.
+ </p>
+ </section>
+ </div>
+
+ <script src="/scripts/toc.js"></script>
+ <script src="/scripts/sidebar.js"></script>
+</body>
+</html> \ No newline at end of file
diff --git a/lessons/1/index.html b/lessons/1/index.html
new file mode 100644
index 0000000..a7265d1
--- /dev/null
+++ b/lessons/1/index.html
@@ -0,0 +1,53 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="/style.css">
+ <link rel="icon" href="/assets/images/master.png">
+ <title>Al Azhar 9th Grade Lesson Notes</title>
+ <script src="https://kit.fontawesome.com/d279a1f519.js" crossorigin="anonymous"></script>
+</head>
+<body>
+ <a class="fixed-top-btn menu-btn" onclick="toggleNav()" href="javascript:void(0)"><i class="fa-solid fa-bars"></i></a>
+ <a href="../" class="fixed-top-btn back-btn" id="backbtn"><i class="fa-solid fa-chevron-left"></i></a>
+ <div id="console"></div>
+ <div id="sidebar">
+ <a href="/index.html">
+ <img src="/assets/images/master.png" alt="" class="sidebar-logo">
+ </a>
+ <h3 id="title" class="align-center">Al Azhar 9th Grade Lesson Notes</h3>
+ <hr class="divider">
+ <a href="/about/author.html" class="sidebar-link link">About the Author</a>
+ <a href="/about/school.html" class="sidebar-link link">About School</a>
+ <a href="/lessons" class="sidebar-link link">Lessons</a>
+ <a href="/lessons/1/" class="sidebar-link link sidebar-sublink">Lesson 1</a>
+ <a href="/lessons/2/" class="sidebar-link link sidebar-sublink">Lesson 2</a>
+ <a href="/lessons/3/" class="sidebar-link link sidebar-sublink">Lesson 3</a>
+
+ <hr class="divider">
+ <div id="toc">
+ <h4>Table of Contents</h4>
+ </div>
+ </div>
+
+ <div class="banner-container" id="banner">
+ <div class="banner-bg" id="img-supplies"></div>
+ <h1 class="banner-text" id="banner-txt">Lesson 1</h1>
+ </div>
+
+ <div id="main">
+ <section>
+ <h1 id="bab1">Bab 1</h1>
+ <p><a href="1/materi1.html" class="link">Materi 1</a></p>
+ <hr class="divider">
+ <h1 id="bab1">Bab 2</h1>
+ <p><a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ" class="link">Materi 1</a></p>
+ </section>
+ </div>
+
+ <script src="/scripts/toc.js"></script>
+ <script src="/scripts/sidebar.js"></script>
+</body>
+</html> \ No newline at end of file
diff --git a/lessons/index.html b/lessons/index.html
new file mode 100644
index 0000000..884758f
--- /dev/null
+++ b/lessons/index.html
@@ -0,0 +1,166 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+ <meta charset="UTF-8">
+ <meta http-equiv="X-UA-Compatible" content="IE=edge">
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
+ <link rel="stylesheet" href="/style.css">
+ <link rel="icon" href="/assets/images/master.png">
+ <title>Al Azhar 9th Grade Lesson Notes</title>
+ <script src="https://kit.fontawesome.com/d279a1f519.js" crossorigin="anonymous"></script>
+</head>
+<body>
+ <a class="fixed-top-btn menu-btn" onclick="toggleNav()" href="javascript:void(0)"><i class="fa-solid fa-bars"></i></a>
+ <div id="console"></div>
+ <div id="sidebar">
+ <a href="/index.html">
+ <img src="/assets/images/master.png" alt="" class="sidebar-logo">
+ </a>
+ <h3 id="title" class="align-center">Al Azhar 9th Grade Lesson Notes</h3>
+ <hr class="divider">
+ <a href="/about/author.html" class="sidebar-link link">About the Author</a>
+ <a href="/about/school.html" class="sidebar-link link">About School</a>
+ <a href="/lessons" class="sidebar-link link">Lessons</a>
+ <a href="/lessons/matematika/" class="sidebar-link link sidebar-sublink">Matematika</a>
+ <a href="/lessons/fisika/" class="sidebar-link link sidebar-sublink">Fisika</a>
+ <a href="/lessons/biologi/" class="sidebar-link link sidebar-sublink">Lesson 3</a>
+
+ <hr class="divider">
+ <div id="toc">
+ <h4>Table of Contents</h4>
+ </div>
+ </div>
+
+ <div class="banner-container" id="banner">
+ <div class="banner-bg" id="img-main"></div>
+ <h1 class="banner-text" id="banner-txt">Lessons</h1>
+ </div>
+
+ <div id="main">
+ <section>
+ <div class="card-container">
+ <div class="card">
+ <a href="/lessons/matematika/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/1/">
+ <h2>Matematika</h2>
+ </a>
+ <p>Pak Hidayatullah, S.Pd.</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/fisika/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/2/">
+ <h2>Fisika</h2>
+ </a>
+ <p>Bu Ayu Rezky Yulita, M.Pd.</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/biologi/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Biologi</h2>
+ </a>
+ <p>Bu Ir. Hj. Wiwit Parminta</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/ips/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>IPS</h2>
+ </a>
+ <p>Bu Uaeni Jahroh S.Pd.</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/agama/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Agama</h2>
+ </a>
+ <p>Pak Akrom Hasani, S.Ag.</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/quran/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Al-Qur'an</h2>
+ </a>
+ <p>Pak Muhammad Fathan S.Ag</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/ppkn/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>PPKn</h2>
+ </a>
+ <p>Bu Andini Nurlaily Hikmah, S.Pd.</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/informatika/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Informatika</h2>
+ </a>
+ <p>Bu Nurbaeti, SE., M.Ak</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/english/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>English</h2>
+ </a>
+ <p>Bu Sofia Nurbaiti, S.Pd.</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/indonesia/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Bahasa Indonesia</h2>
+ </a>
+ <p>Pak Maman Sulaeman, S.Pd.</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/musik/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Seni Musik</h2>
+ </a>
+ <p>Bu Dra. Kusnun Indrawati</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/lukis/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Seni Rupa</h2>
+ </a>
+ <p>Pak Miftah Izharul Haq, S.Pd</p>
+ </div>
+ <div class="card">
+ <a href="/lessons/pjok/" class="link-card"></a>
+ <img src="https://www.incimages.com/uploaded_files/image/1920x1080/getty_655998316_2000149920009280219_363765.jpg"
+ alt="" class="card-img">
+ <a href="/lessons/3/">
+ <h2>Penjasorkes</h2>
+ </a>
+ <p>Pak Supatri, S.Pd</p>
+ </div>
+ </div>
+ </section>
+ </div>
+
+ <script src="/scripts/toc.js"></script>
+ <script src="/scripts/sidebar.js"></script>
+</body>
+</html> \ No newline at end of file