diff --git a/website/index.html b/website/index.html
index 5ca330f..b92a8b5 100644
--- a/website/index.html
+++ b/website/index.html
@@ -4,77 +4,7 @@
McDonald's Menu
-
+
diff --git a/website/style.css b/website/style.css
new file mode 100644
index 0000000..bd9f179
--- /dev/null
+++ b/website/style.css
@@ -0,0 +1,69 @@
+body {
+ font-family: Arial, sans-serif;
+ margin: 0;
+ display: flex;
+}
+
+/* Linkerkant: Het menu */
+.menu-list {
+ width: 30%;
+ background-color: #f2c14e;
+ padding: 20px;
+ height: 100vh;
+ overflow-y: auto;
+}
+
+.menu-list h2 {
+ color: #d32f2f;
+ font-size: 2em;
+ margin-bottom: 20px;
+}
+
+.menu-item {
+ background-color: #fff;
+ padding: 15px;
+ margin: 10px 0;
+ border-radius: 8px;
+ cursor: pointer;
+ font-size: 1.2em;
+}
+
+.menu-item:hover {
+ background-color: #f59e42;
+}
+
+/* Rechterkant: Detail weergave */
+.menu-detail {
+ width: 70%;
+ background-color: white;
+ padding: 20px;
+ display: none; /* Start verborgen */
+}
+
+.menu-detail img {
+ width: 100%;
+ max-width: 400px;
+ height: auto;
+ margin-bottom: 20px;
+}
+
+.menu-detail h2 {
+ color: #d32f2f;
+ font-size: 2em;
+}
+
+.menu-detail p {
+ font-size: 1.2em;
+ color: #555;
+ margin: 20px 0;
+}
+
+/* Footer */
+footer {
+ text-align: center;
+ padding: 20px;
+ background-color: #f2c14e;
+ position: fixed;
+ bottom: 0;
+ width: 100%;
+}
\ No newline at end of file