diff --git a/templates/kiddy/html/footer.html b/templates/kiddy/html/footer.html
new file mode 100644
index 0000000..2a1ef0e
--- /dev/null
+++ b/templates/kiddy/html/footer.html
@@ -0,0 +1,7 @@
+
+
diff --git a/templates/kiddy/html/index.html b/templates/kiddy/html/index.html
new file mode 100644
index 0000000..423cd96
--- /dev/null
+++ b/templates/kiddy/html/index.html
@@ -0,0 +1,22 @@
+
+
+
+
+
+ ${title}
+
+
+
+
+
+ ${navbar}
+
+ ${container}
+
+ ${footer}
+
+
+
+
+
+
diff --git a/templates/kiddy/html/navbar.html b/templates/kiddy/html/navbar.html
new file mode 100644
index 0000000..c19c213
--- /dev/null
+++ b/templates/kiddy/html/navbar.html
@@ -0,0 +1,22 @@
+
+
diff --git a/templates/kiddy/main.py b/templates/kiddy/main.py
new file mode 100644
index 0000000..abb38ea
--- /dev/null
+++ b/templates/kiddy/main.py
@@ -0,0 +1,18 @@
+from core import html
+
+static = [
+ {
+ "route" : "/templates/kiddy/css/",
+ "root" : "./templates/kiddy/static/css"
+ }
+]
+
+def main(dir, page):
+ html_template = html.main.get_html("templates/kiddy/html")
+ html_page = html.main.get_html(dir)
+ return {
+ "index" : html_template [ "index.html" ],
+ "navbar" : html_template [ "navbar.html" ],
+ "footer" : html_template [ "footer.html" ],
+ "container" : html_page [f"{page}.html" ]
+ }
diff --git a/templates/kiddy/static/css/style.css b/templates/kiddy/static/css/style.css
new file mode 100644
index 0000000..0c6b509
--- /dev/null
+++ b/templates/kiddy/static/css/style.css
@@ -0,0 +1,179 @@
+body {
+ font-family: 'Arial', sans-serif;
+ background-color: #f8f9fa;
+}
+.navbar {
+ margin-bottom: 0;
+}
+.header {
+ background: url('https://img.freepik.com/free-photo/little-cute-boy-proud-when-he-finish-drawing-with-happiness-raised-two-hands-his-head-smile_1150-15403.jpg') no-repeat center center;
+ background-size: cover;
+ color: white;
+ padding: 100px 0;
+ text-align: center;
+ position: relative;
+ min-height: 400px;
+}
+.header-overlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background-color: rgba(0, 123, 255, 0.6);
+ z-index: 1;
+}
+.header-content {
+ position: relative;
+ z-index: 2;
+}
+.header h1 {
+ margin: 0;
+ font-size: 3em;
+ font-family: 'Comic Sans MS', cursive, sans-serif;
+}
+.header p {
+ font-size: 1.5em;
+}
+.packages {
+ padding: 50px 0;
+ text-align: center;
+}
+.packages h2 {
+ font-size: 2.5em;
+ margin-bottom: 50px;
+}
+.package {
+ border-radius: 15px;
+ padding: 20px;
+ margin: 20px 0;
+ background-color: white;
+ box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+ transition: transform 0.2s;
+ color: white;
+}
+.package:hover {
+ transform: scale(1.05);
+}
+.package:nth-child(1) { background-color: #FF6F61; }
+.package:nth-child(2) { background-color: #6B5B95; }
+.package:nth-child(3) { background-color: #FFA07A; }
+.package:nth-child(4) { background-color: #88B04B; }
+.package .btn {
+ background-color: white;
+ color: black;
+ border: none;
+ margin-top: 10px;
+ padding: 10px 20px;
+ border-radius: 5px;
+}
+.package .btn:hover {
+ background-color: #f0f0f0;
+ color: black;
+}
+.package img {
+ width: 80px;
+ margin-bottom: 10px;
+}
+.about-us {
+ padding: 50px 0;
+ background-color: #FFC857;
+ text-align: center;
+}
+.about-us h2 {
+ font-size: 2.5em;
+ margin-bottom: 20px;
+}
+.about-us p {
+ font-size: 1.2em;
+ max-width: 800px;
+ margin: 0 auto;
+}
+.price-plan {
+ padding: 50px 0;
+ text-align: center;
+}
+.price-plan h2 {
+ font-size: 2.5em;
+ margin-bottom: 50px;
+}
+.price-card {
+ border-radius: 15px;
+ padding: 30px;
+ margin: 20px;
+ background: linear-gradient(135deg, #f6d365 0%, #fda085 100%);
+ box-shadow: 0 4px 8px rgba(0,0,0,0.1);
+ transition: transform 0.2s;
+ color: white;
+ position: relative;
+ overflow: hidden;
+}
+.price-card:hover {
+ transform: scale(1.05);
+}
+.price-card::before {
+ content: '';
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ background: rgba(0, 0, 0, 0.1);
+ z-index: 1;
+ pointer-events: none;
+}
+.price-card h3 {
+ font-size: 2em;
+ margin-bottom: 20px;
+}
+.price-card p {
+ font-size: 1.2em;
+ margin-bottom: 10px;
+ z-index: 2;
+ position: relative;
+}
+.price-card .btn {
+ margin-top: 20px;
+ padding: 10px 20px;
+ border-radius: 50px;
+ z-index: 2;
+ position: relative;
+ background-color: rgba(255, 255, 255, 0.9);
+ color: #333;
+ border: none;
+}
+.price-card .btn:hover {
+ background-color: rgba(255, 255, 255, 1);
+ color: #333;
+}
+.get-started {
+ padding: 50px 0;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ background-color: #f8f9fa;
+ text-align: left;
+}
+.get-started .content {
+ flex: 1;
+ font-size: 1.2em;
+ margin-right: 20px;
+}
+.get-started .btn {
+ font-size: 1.2em;
+ padding: 15px 30px;
+ border-radius: 50px;
+}
+.footer {
+ background-color: #343a40;
+ color: white;
+ padding: 20px 0;
+ text-align: center;
+}
+.footer a {
+ color: #ffc107;
+ text-decoration: none;
+}
+.footer a:hover {
+ text-decoration: underline;
+}