diff --git a/cms.js b/cms.js
new file mode 100644
index 0000000..e69de29
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..14827fc
--- /dev/null
+++ b/index.html
@@ -0,0 +1,50 @@
+
+
+
+
+
+
+
+
+
+
+ food list
+
+
+
+ the ultimate grgr's guide to food
+ a list of allowed food and forbidden food,
+
+
+
✔✔✔
+
+
+
Cruciferous vegetables
+
+ - arugula
+ - bok choy
+ - broccoli
+ - brussel sprouts
+ - cauliflower
+ - collards
+ - kale
+ - kimchi
+ - kohlrabi
+ - napa cabbage
+ - radicchio
+
+
+
+
+
+
❌❌❌
+
+
+
+
+
\ No newline at end of file
diff --git a/style.css b/style.css
new file mode 100644
index 0000000..1c18d42
--- /dev/null
+++ b/style.css
@@ -0,0 +1,47 @@
+body{
+ margin: 0;
+ padding: 24px;
+ font-family: Arial, Helvetica, sans-serif;
+}
+
+h1,h3{
+ margin: 0;
+}
+
+.allfood{
+ display: flex;
+ justify-content:center;
+ flex-direction: row;
+ column-gap:8px;
+ margin-top: 6ch;
+
+}
+
+.allowed{
+ flex-basis: 50vw;
+ border: 1px solid palegreen;
+ border-radius: 8px;
+ padding: 8px;
+}
+
+.forbidden{
+ flex-basis: 50vw;
+ border: 1px solid palevioletred;
+ border-radius: 8px;
+ padding: 8px;
+}
+img{
+ display:none;
+ border-radius: 8px;
+}
+li{
+ position: relative;
+
+}
+li:hover img{
+ display:block;
+ position: absolute;
+ left: 70%;
+ width: 100px;
+ object-fit: contain;
+}
\ No newline at end of file