Fix alignment on small screens.

7 files changed, 49 insertions, 37 deletions

diff --git a/_site/projects/bumblebee/index.html b/_site/projects/bumblebee/index.html
index 26cdce0..8219448 100644
--- a/_site/projects/bumblebee/index.html
+++ b/_site/projects/bumblebee/index.html
@@ -40,10 +40,11 @@
 
     <main>
       <div class="container">
-        <h2 class="center" id="title">BUMBLEBEE: BROWSER AUTOMATION</h2>
-        <h6 class="center">02 APRIL 2025</h5>
-        <br>
-        <div class="twocol justify"><p>Bumblebee is a web browser that converts browser sessions into C# scripts for
+        <div class="container-2">
+          <h2 class="center" id="title">BUMBLEBEE: BROWSER AUTOMATION</h2>
+          <h6 class="center">02 APRIL 2025</h5>
+          <br>
+          <div class="twocol justify"><p>Bumblebee is a web browser that converts browser sessions into C# scripts for
 playback. It eliminates the need for authoring browser automation scripts.</p>
 
 <video style="max-width:100%; margin-bottom: 10px" controls="" poster="thumb.png">
@@ -63,13 +64,14 @@ intercepts events internal to the web browser, which it then interprets to
 generate C# code for the Selenium WebDriver in real time.</p>
 
 </div>
-        <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+          <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+        </div>
       </div>
     </main>
 
     <div class="footer">
   <div class="container">
-    <div class="twelve columns right">
+    <div class="twelve columns right container-2">
       <p id="footer-text">&copy; ASCIIMX - 2025</p>
     </div>
   </div>
diff --git a/_site/projects/e-reader/index.html b/_site/projects/e-reader/index.html
index ba3c700..01214be 100644
--- a/_site/projects/e-reader/index.html
+++ b/_site/projects/e-reader/index.html
@@ -40,10 +40,11 @@
 
     <main>
       <div class="container">
-        <h2 class="center" id="title">PROTOTYPE E-READER</h2>
-        <h6 class="center">24 OCTOBER 2023</h5>
-        <br>
-        <div class="twocol justify"><p>This project features a prototype e-reader powered by a 7.5-inch <a href="https://www.waveshare.com/" class="external" target="_blank" rel="noopener noreferrer">Waveshare</a> e-paper display and an
+        <div class="container-2">
+          <h2 class="center" id="title">PROTOTYPE E-READER</h2>
+          <h6 class="center">24 OCTOBER 2023</h5>
+          <br>
+          <div class="twocol justify"><p>This project features a prototype e-reader powered by a 7.5-inch <a href="https://www.waveshare.com/" class="external" target="_blank" rel="noopener noreferrer">Waveshare</a> e-paper display and an
 ESP-WROOM-32 development board.</p>
 
 <video style="max-width:100%;" controls="" poster="thumb.png">
@@ -120,13 +121,14 @@ how to build my own.</p>
 
 <p>Files: <a href="source.tar.gz">source.tar.gz</a></p>
 </div>
-        <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+          <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+        </div>
       </div>
     </main>
 
     <div class="footer">
   <div class="container">
-    <div class="twelve columns right">
+    <div class="twelve columns right container-2">
       <p id="footer-text">&copy; ASCIIMX - 2025</p>
     </div>
   </div>
diff --git a/_site/projects/etlas/index.html b/_site/projects/etlas/index.html
index d70c05e..bd18041 100644
--- a/_site/projects/etlas/index.html
+++ b/_site/projects/etlas/index.html
@@ -40,10 +40,11 @@
 
     <main>
       <div class="container">
-        <h2 class="center" id="title">ETLAS: E-PAPER DASHBOARD</h2>
-        <h6 class="center">05 SEPTEMBER 2024</h5>
-        <br>
-        <div class="twocol justify"><p>Etlas is a news, stock market, and weather tracker powered by an ESP32 NodeMCU
+        <div class="container-2">
+          <h2 class="center" id="title">ETLAS: E-PAPER DASHBOARD</h2>
+          <h6 class="center">05 SEPTEMBER 2024</h5>
+          <br>
+          <div class="twocol justify"><p>Etlas is a news, stock market, and weather tracker powered by an ESP32 NodeMCU
 D1, featuring a 7.5-inch <a href="https://www.waveshare.com/" class="external" target="_blank" rel="noopener noreferrer">Waveshare</a> e-paper display and a
 DHT22 sensor module.</p>
 
@@ -96,13 +97,14 @@ email at the address on my home page.</p>
 
 <p>Files: <a href="source.tar.gz">source.tar.gz</a></p>
 </div>
-        <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+          <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+        </div>
       </div>
     </main>
 
     <div class="footer">
   <div class="container">
-    <div class="twelve columns right">
+    <div class="twelve columns right container-2">
       <p id="footer-text">&copy; ASCIIMX - 2025</p>
     </div>
   </div>
diff --git a/_site/projects/fpm-door-lock/index.html b/_site/projects/fpm-door-lock/index.html
index 6cbbd31..025a9e1 100644
--- a/_site/projects/fpm-door-lock/index.html
+++ b/_site/projects/fpm-door-lock/index.html
@@ -40,10 +40,11 @@
 
     <main>
       <div class="container">
-        <h2 class="center" id="title">FINGERPRINT DOOR LOCK</h2>
-        <h6 class="center">03 OCTOBER 2025</h5>
-        <br>
-        <div class="twocol justify"><p>This project features a fingerprint door lock powered by an ATmega328P
+        <div class="container-2">
+          <h2 class="center" id="title">FINGERPRINT DOOR LOCK</h2>
+          <h6 class="center">03 OCTOBER 2025</h5>
+          <br>
+          <div class="twocol justify"><p>This project features a fingerprint door lock powered by an ATmega328P
 microcontroller.</p>
 
 <video style="max-width:100%;" controls="" poster="pcb.jpg">
@@ -150,13 +151,14 @@ rewarding journey from the messy breadboard to the shiny PCB.</p>
 
 <p>Files: <a href="source.tar.gz">source.tar.gz</a>, <a href="gerber.zip">gerber.zip</a></p>
 </div>
-        <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+          <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+        </div>
       </div>
     </main>
 
     <div class="footer">
   <div class="container">
-    <div class="twelve columns right">
+    <div class="twelve columns right container-2">
       <p id="footer-text">&copy; ASCIIMX - 2025</p>
     </div>
   </div>
diff --git a/_site/projects/index.html b/_site/projects/index.html
index 0526bc7..f23333a 100644
--- a/_site/projects/index.html
+++ b/_site/projects/index.html
@@ -97,7 +97,7 @@
 
     <div class="footer">
   <div class="container">
-    <div class="twelve columns right">
+    <div class="twelve columns right container-2">
       <p id="footer-text">&copy; ASCIIMX - 2025</p>
     </div>
   </div>
diff --git a/_site/projects/matrix-digital-rain/index.html b/_site/projects/matrix-digital-rain/index.html
index 9186272..bf08dce 100644
--- a/_site/projects/matrix-digital-rain/index.html
+++ b/_site/projects/matrix-digital-rain/index.html
@@ -40,10 +40,11 @@
 
     <main>
       <div class="container">
-        <h2 class="center" id="title">THE MATRIX DIGITAL RAIN</h2>
-        <h6 class="center">12 JANUARY 2024</h5>
-        <br>
-        <div class="twocol justify"><p>The famous digital rain from The Matrix, implemented in C.</p>
+        <div class="container-2">
+          <h2 class="center" id="title">THE MATRIX DIGITAL RAIN</h2>
+          <h6 class="center">12 JANUARY 2024</h5>
+          <br>
+          <div class="twocol justify"><p>The famous digital rain from The Matrix, implemented in C.</p>
 
 <video style="max-width:100%;" controls="" poster="thumb.png">
   <source src="matrix.mp4" type="video/mp4" />
@@ -65,13 +66,14 @@ instance, setting them to <code class="language-plaintext highlighter-rouge">0x3
 
 <p>Files: <a href="source.tar.gz">source.tar.gz</a></p>
 </div>
-        <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+          <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+        </div>
       </div>
     </main>
 
     <div class="footer">
   <div class="container">
-    <div class="twelve columns right">
+    <div class="twelve columns right container-2">
       <p id="footer-text">&copy; ASCIIMX - 2025</p>
     </div>
   </div>
diff --git a/_site/projects/my-first-pcb/index.html b/_site/projects/my-first-pcb/index.html
index d01085e..d0b7938 100644
--- a/_site/projects/my-first-pcb/index.html
+++ b/_site/projects/my-first-pcb/index.html
@@ -40,10 +40,11 @@
 
     <main>
       <div class="container">
-        <h2 class="center" id="title">MY FIRST PCB</h2>
-        <h6 class="center">14 JULY 2025</h5>
-        <br>
-        <div class="twocol justify"><p>In 2023, I started tinkering with DIY electronics as a hobby. Until now, I’ve
+        <div class="container-2">
+          <h2 class="center" id="title">MY FIRST PCB</h2>
+          <h6 class="center">14 JULY 2025</h5>
+          <br>
+          <div class="twocol justify"><p>In 2023, I started tinkering with DIY electronics as a hobby. Until now, I’ve
 been using development boards like the Arduino Uno and ESP-32-WROOM so that I
 can focus on the software. Recently, I decided to step outside of my comfort
 zone and design a PCB from scratch for a door lock I’m working on.</p>
@@ -101,13 +102,14 @@ an important milestone in my DIY electronics journey.</p>
 <p>Files: <a href="gerber_back.zip">gerber_back.zip</a>, <a href="gerber_front.zip">gerber_front.zip</a>,
        <a href="source.tar.gz">source.tar.gz</a></p>
 </div>
-        <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+          <p class="post-author right">by Wickramage Don Sadeep Madurange</p>
+        </div>
       </div>
     </main>
 
     <div class="footer">
   <div class="container">
-    <div class="twelve columns right">
+    <div class="twelve columns right container-2">
       <p id="footer-text">&copy; ASCIIMX - 2025</p>
     </div>
   </div>