diff --git a/assets/images/people/wryl.png b/assets/images/people/wryl.png
new file mode 100644
index 0000000..e588fc5
Binary files /dev/null and b/assets/images/people/wryl.png differ
diff --git a/assets/js/main.js b/assets/js/main.js
index 4609a71..9b6c2c5 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -36,7 +36,12 @@
 
 
   // modals 
-  // openers
+  function toggle_modal(target, show) {
+    target.classList.toggle("hidden", !show);
+    body.classList.toggle("overflow-hidden", show);
+    body.setAttribute("modal", show ? target.id : "");
+  }
+
   const body = document.querySelector("body");
   const show_modal_buttons = document.querySelectorAll("[data-modal-show]");
   show_modal_buttons.forEach((btn) => {
@@ -44,8 +49,7 @@
     const modal = document.querySelector(`#${target}`);
     if (modal) {
       btn.addEventListener("click", (e) => {
-        modal.classList.toggle("hidden", false);
-        body.classList.toggle("overflow-hidden", true);
+        toggle_modal(modal, true);
       });
     }
   });
@@ -56,8 +60,7 @@
     const modal = document.querySelector(`#${target}`);
     if (modal) {
       btn.addEventListener("click", (e) => {
-        modal.classList.toggle("hidden", true);
-        body.classList.toggle("overflow-hidden", false);
+        toggle_modal(modal, false);
       });
     }
   });
@@ -65,13 +68,19 @@
   const modal_bg = document.querySelectorAll(".modal-bg");
   modal_bg.forEach((bg) => {
     bg.addEventListener("click", (e) => {
-      if(e.target === bg) {
-        bg.classList.toggle("hidden", true);
-        body.classList.toggle("overflow-hidden", false);
+      if (e.target === bg) {
+        toggle_modal(bg, false);
       }
     });
   });
 
+  document.addEventListener("keydown", (e) => {
+    if (e.key === "Escape") {
+      var modal_id = body.getAttribute("modal");
+      if(modal_id) toggle_modal(document.querySelector(`#${modal_id}`), false);
+    }
+  });
+
   // Swipers
   // ----------------------------------------
   const swipers = document.querySelectorAll(".swiper-slider");
@@ -100,3 +109,5 @@
     });
   });
 })();
+
+// c > js -devon
\ No newline at end of file
diff --git a/assets/scss/custom.scss b/assets/scss/custom.scss
index 6631ed5..dc17c78 100644
--- a/assets/scss/custom.scss
+++ b/assets/scss/custom.scss
@@ -29,12 +29,14 @@
     background-color: #7A5DF9;
 }
 
-.about-content a {
+.about-content a,
+.content-container a {
     color: var(--meetups-color) !important;
     text-decoration: none;
 }
 
-.about-content a:hover {
+.about-content a:hover,
+.content-container a:hover {
     text-decoration: underline !important;
 }
 
diff --git a/content/english/meetups/index.md b/content/english/meetups/index.md
index 293a3be..4dd9955 100644
--- a/content/english/meetups/index.md
+++ b/content/english/meetups/index.md
@@ -4,6 +4,7 @@ meta_title: "About"
 description: "this is meta description"
 image: "/images/avatar.png"
 draft: false
+layout: under_construction
 ---
 
 Lorem ipsum dolor sit amet consectetur adipisicing elit. Corporis illum nesciunt commodi vel nisi ut alias excepturi ipsum, totam, labore tempora, odit ex iste tempore sed. Fugit voluptatibus perspiciatis assumenda nulla ad nihil, omnis vel, doloremque sit quam autem optio maiores, illum eius facilis et quo consectetur provident dolor similique! Enim voluptatem dicta expedita veritatis repellat dolorum impedit, provident quasi at.
diff --git a/content/english/seattle/index.md b/content/english/seattle/index.md
index 56ecbba..a0a7797 100644
--- a/content/english/seattle/index.md
+++ b/content/english/seattle/index.md
@@ -60,9 +60,9 @@ features:
       title: ""
       title_class: "text-center"
       section_class: "mb-12"
-      img_title_class: "text-center text-2xl"
+      img_title_class: "text-center text-2xl no-underline hover:underline hover:color-[#150e31]"
       img_subtitle_class: "text-center"
-      img_class: ""
+      img_class: "hover:cursor-pointer devon_was_here"
       imgs:
         - title: "Abner Coimbre"
           title_class: "text-center text-2xl mt-2"
@@ -94,6 +94,18 @@ features:
           subtitle: "Co-Founder of [Hundred Rabbits](https://100r.co)"
           img: "/images/people/devine_square.webp"
           modal_target: "devine"
+        - title: "Andrew Kelley"
+          title_class: "text-center text-2xl mt-2"
+          subtitle_class: "text-center text-lg mb-4"
+          subtitle: "Present of [Zig](https://ziglang.org/) Software Foundation"
+          img: "/images/people/andrew-kelley.jpg"
+          modal_target: "andrew"
+        - title: "Wryl"
+          title_class: "text-center text-2xl mt-2"
+          subtitle_class: "text-center text-lg mb-4"
+          subtitle: "Computational artisan, author of [Modal](https://wiki.xxiivv.com/site/modal)"
+          img: "/images/people/wryl_sq.webp"
+          modal_target: "wyrl"
         - title: "Kagi Search"
           title_class: "text-center text-2xl mt-2"
           subtitle_class: "text-center text-lg mb-2"
@@ -222,6 +234,21 @@ modals:
     content: "We’ll wander through a corridors of a very special library, in which every book is one of the permutations of 64kb of ram."
     content_class: "text-white"
     img: "/images/modals/100r.png"
+  - active: true
+    id: "andrew"
+    title: "In Defense of the Free Software Movement"
+    img: ""
+    title_class: "text-white"
+    content: "**A candid and thorough examination of the societal forces that shape software**<br>Does open source software make your eyes roll so hard you can see your prefrontal cortex? Do you pray to Richard Stallman every night before you go to bed? Either way, prepare to have your assumptions checked, your values questioned, and the Handmade [Manifesto](https://handmade.network/manifesto) itself scrutinized.<br><br>You can come with an open mind, or you can hate-watch this talk. Either way, pay attention, because it’s what everyone’s going to be talking about in the halls and at lunch."
+    content_class: "text-white"
+  - active: true
+    id: "wyrl"
+    title: "Democratizing Software"
+    img: "/images/modals/simplex.png"
+    img_class: "bg-white rounded-lg"
+    title_class: "text-white"
+    content: "**Building ladders for the curious.**<br><br>Software is intimidating by virtue of its scale and scope.We build mountains upon mountains, and claim they are easy to climb because we’re the architects.<br><br>How did we get here? _How can we fix this?_<br><br>Join me for a tour through the software crisis and learn how to enable individuals, from all walks of life, to partake in the joy of crafting software."
+    content_class: "text-white"
   - active: true
     id: "kagi"
     title: "High quality search results with no ads or tracking."
diff --git a/layouts/media/single.html b/layouts/media/single.html
index 4e8c1f6..d0f2acd 100644
--- a/layouts/media/single.html
+++ b/layouts/media/single.html
@@ -3,7 +3,7 @@
     <div class="container flex flex-col gap-5">
       <div>
         <h2>{{ .Params.Title }}</h2>
-        <div>
+        <div class="content-container">
           {{ if eq .Params.Mediatype "talk" }}
             Presented by
           {{ else if eq .Params.Mediatype "demo" }}
@@ -54,7 +54,7 @@
           {{ end }}
         </div>
         <div class="flex flex-col gap-5 lg:w-1/3">
-          <div class="dark:text-white">
+          <div class="dark:text-white content-container">
             {{ .Content }}
           </div>
 
diff --git a/layouts/partials/components/img_grid.html b/layouts/partials/components/img_grid.html
index 0a6dbda..359edeb 100644
--- a/layouts/partials/components/img_grid.html
+++ b/layouts/partials/components/img_grid.html
@@ -2,9 +2,12 @@
 <div class="container relative mx-auto px-4 {{ .img_grid.section_class }} img_grid_container">
   <p class="{{ .img_grid.title_class }}">{{ .img_grid.title }}</p>
   <div class="flex flex-wrap justify-center mx-auto lg:w-full md:w-5/6">
+    {{ $img_title_class := .img_grid.img_title_class }}
+    {{ $img_subtitle_class := .img_grid.img_subtitle_class }}
+    {{ $option_class := .img_grid.img_class }}
     {{ range $i, $option := .img_grid.imgs }}
     <div class="w-1/2 md:w-1/3 p-2">
-      <div class="flex justify-center align-items-center items-center w-full justify-items-center row"
+      <div class="flex justify-center align-items-center items-center w-full justify-items-center row {{ $option_class }}"
       {{ if .modal_target }} data-modal-show="{{ .modal_target }}" {{ end }}>
       {{ $imgres := .resources.Get $option.img }}
       {{ if $option.link}}
@@ -12,10 +15,10 @@
       {{ end }}
         <img class="w-10/12 rounded-lg mx-auto col-12" src="{{ $option.img }}" alt="{{ $option.title }}">
         {{ if $option.title }}
-        <p class="{{ $option.title_class }} {{ .img_grid.img_title_class }} col-12">{{ $option.title | markdownify }}</p>
+        <p class="{{ $option.title_class }} {{ $img_title_class }} col-12">{{ $option.title | markdownify }}</p>
         {{ end }}
         {{ if $option.subtitle }}
-        <p class="{{ $option.subtitle_class }} {{ .img_grid.img_subtitle_class }} col-12">{{ $option.subtitle | markdownify }}</p>
+        <p class="{{ $option.subtitle_class }} {{ $img_subtitle_class }} col-12">{{ $option.subtitle | markdownify }}</p>
         {{ end }}
       {{ if $option.link}}
         </a>
diff --git a/layouts/partials/components/modals.html b/layouts/partials/components/modals.html
index ef5e253..d378b13 100644
--- a/layouts/partials/components/modals.html
+++ b/layouts/partials/components/modals.html
@@ -24,10 +24,10 @@
         <!-- Modal body -->
         <div class="p-4 md:p-6 pb-8 md:pb-12 space-y-4">
           {{ if $option.img }}
-            <img src="{{ $option.img }}" class="w-full max-h-48 object-contain {{ if $option.img_dark }}dark:hidden {{ end }}" />
+            <img src="{{ $option.img }}" class="w-full max-h-48 object-contain {{ if $option.img_dark }}dark:hidden {{ end }}{{ $option.img_class }}" />
           {{ end }}
           {{ if $option.img_dark }}
-          <img src="{{ $option.img_dark }}" class="w-full max-h-48 object-contain hidden dark:block" />
+          <img src="{{ $option.img_dark }}" class="w-full max-h-48 object-contain hidden dark:block {{ $option.img_class }}" />
           {{ end }}
           <h3 class="text-xl font-semibold text-gray-900 dark:text-white">
             {{ $option.title | markdownify }}
diff --git a/static/images/modals/simplex.png b/static/images/modals/simplex.png
new file mode 100644
index 0000000..02537c0
Binary files /dev/null and b/static/images/modals/simplex.png differ
diff --git a/static/images/people/andrew-kelley.jpg b/static/images/people/andrew-kelley.jpg
new file mode 100644
index 0000000..af15e6d
Binary files /dev/null and b/static/images/people/andrew-kelley.jpg differ
diff --git a/static/images/people/freya_dutch_game_day.png b/static/images/people/freya_dutch_game_day.png
new file mode 100644
index 0000000..b02f837
Binary files /dev/null and b/static/images/people/freya_dutch_game_day.png differ
diff --git a/static/images/people/wryl.png b/static/images/people/wryl.png
new file mode 100644
index 0000000..e588fc5
Binary files /dev/null and b/static/images/people/wryl.png differ
diff --git a/static/images/people/wryl_sq.webp b/static/images/people/wryl_sq.webp
new file mode 100644
index 0000000..51dcf3c
Binary files /dev/null and b/static/images/people/wryl_sq.webp differ