add post on film photography

_posts/2018-01-01-film_photography.md

@@ -0,0 +1,124 @@
+---
+title: Film Photography
+date: 2018-01-01
+last_modified_at: 2024-06-30
+categories: [photography, film]
+tags: []
+media_subpath: /film-photography/
+description: Random collection of film photos
+image: 0010_S2Ark7u.webp
+published: True
+---
+
+
+<style>
+    .grid-2x2 {
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        grid-template-rows: auto auto;
+        column-gap: 20px; /* Keep horizontal gap */
+        justify-items: center;
+    }
+    .grid-3x2 {
+        display: grid;
+        grid-template-columns: 1fr 1fr 1fr;
+        grid-template-rows: auto auto;
+        column-gap: 20px; /* Keep horizontal gap */
+        justify-items: center;
+    }
+    .grid-container {
+        justify-items: center;
+    }
+    .grid-container > div {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        height: 100%; /* Ensure the div takes full height of the grid cell */
+        justify-content: flex-end; /* Align items to the bottom */
+    }
+    .grid-container img {
+        width: auto;
+        max-width: 100%;
+        height: auto;
+        object-fit: cover;
+        display: block;
+        margin-bottom: 5px; /* Small margin to separate the image and caption */
+    }
+    .grid-container .caption em {
+        display: block;
+        text-align: center;
+        font-style: normal;
+        font-size: 80%;
+        padding: 0;
+        color: #6d6c6c;
+    }
+</style>
+
+This is sampling of the film photos I took when I first started in 2017. I've got a bunch more on random hard drives that I'll need to sort through and post, but for now, this is a good start.
+
+Click on the photos to enlarge them.
+
+<div class="grid-container grid-2x2">
+    <div>
+        <img src="0064_2_YfKsZnQ.webp" alt="shortwave">
+    </div>
+    <div>
+        <img src="0032_xnZho87.webp" alt="white light">
+    </div>
+    <div class="caption">
+        <em>Crossing the Divide</em>
+    </div>
+    <div class="caption">
+        <em>Spanning the Distance</em>
+    </div>
+</div>
+
+
+<div class="grid-container grid-2x2">
+    <div>
+        <img src="0094_xrIFmE7.webp" alt="shortwave">
+    </div>
+    <div>
+        <img src="50710008a_ohdpwpW.webp" alt="white light">
+    </div>
+    <div class="caption">
+        <em>Uncanny Valley</em>
+    </div>
+    <div class="caption">
+        <em>Into the Void</em>
+    </div>
+</div>
+
+
+<div class="grid-container grid-2x2">
+    <div>
+        <img src="0023a_s9ip3CE.webp" alt="white light">
+    </div>
+    <div>
+        <img src="51660010a_LR2jzUY.webp" alt="shortwave">
+    </div>
+    <div class="caption">
+        <em>Monumental Sea</em>
+    </div>
+    <div class="caption">
+        <em>Lonely Road</em>
+    </div>
+</div>
+
+
+<div class="grid-container grid-2x2">
+    <div>
+        <img src="50700029a_QnWsSi5.webp" alt="shortwave">
+    </div>
+    <div>
+        <img src="54890024_HxYewsF.jpeg" alt="white light">
+    </div>
+    <div class="caption">
+        <em>Bounty</em>
+    </div>
+    <div class="caption">
+        <em>City Streets</em>
+    </div>
+</div>
+
+![img](50038900807_75981150a3_h.webp)