diff --git a/gallery/centerpiece/convertToWebp.sh b/gallery/centerpiece/convertToWebp.sh
new file mode 100755
index 0000000..73856f7
--- /dev/null
+++ b/gallery/centerpiece/convertToWebp.sh
@@ -0,0 +1,32 @@
+#!/bin/bash
+
+# Specify the input directory
+INPUT_DIR="../../assets/pics/gallery/centerpiece"
+
+# Ensure ImageMagick is installed
+
+
+for filename in $(find "$INPUT_DIR" -type f -name "*.heic"); do
+    # Define the output file name
+    CONVERTED_FILE="${filename%.heic}.webp"
+
+    # Skip if already converted
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        echo "Skipping $filename, already converted."
+        continue
+    fi
+
+    # Convert HEIC to WEBP
+    echo "Converting $filename to $CONVERTED_FILE..."
+    convert "$filename" -quality 85 "$CONVERTED_FILE"
+
+    # Verify conversion success
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        # Create a blank text file
+        txt_file="${CONVERTED_FILE%.webp}.txt"
+        echo -e "" > "$txt_file"
+        echo "Successfully converted $filename to $CONVERTED_FILE and created ${txt_file}"
+    else
+        echo "Error converting $filename"
+    fi
+done
diff --git a/gallery/centerpiece/index.html b/gallery/centerpiece/index.html
index 08e193e..b35fddd 100644
--- a/gallery/centerpiece/index.html
+++ b/gallery/centerpiece/index.html
@@ -58,7 +58,7 @@
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Centerpieces</h1>
+            <h1 class="title has-text-centered has-text-dark">Centerpieces</h1>
             <div class="gallery">
             </div>
         </div>
diff --git a/gallery/centerpiece/updateGallery.sh b/gallery/centerpiece/updateGallery.sh
index 84419fe..9bbfe6c 100755
--- a/gallery/centerpiece/updateGallery.sh
+++ b/gallery/centerpiece/updateGallery.sh
@@ -72,7 +72,7 @@ cat > "$OUTPUT_FILE" <<EOL
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Centerpieces</h1>
+            <h1 class="title has-text-centered has-text-dark">Centerpieces</h1>
             <div class="gallery">
 EOL
 
diff --git a/gallery/classic/convertToWebp.sh b/gallery/classic/convertToWebp.sh
new file mode 100755
index 0000000..4433b93
--- /dev/null
+++ b/gallery/classic/convertToWebp.sh
@@ -0,0 +1,32 @@
+#!/bin/bash
+
+# Specify the input directory
+INPUT_DIR="../../assets/pics/gallery/classic"
+
+# Ensure ImageMagick is installed
+
+
+for filename in $(find "$INPUT_DIR" -type f -name "*.heic"); do
+    # Define the output file name
+    CONVERTED_FILE="${filename%.heic}.webp"
+
+    # Skip if already converted
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        echo "Skipping $filename, already converted."
+        continue
+    fi
+
+    # Convert HEIC to WEBP
+    echo "Converting $filename to $CONVERTED_FILE..."
+    convert "$filename" -quality 85 "$CONVERTED_FILE"
+
+    # Verify conversion success
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        # Create a blank text file
+        txt_file="${CONVERTED_FILE%.webp}.txt"
+        echo -e "" > "$txt_file"
+        echo "Successfully converted $filename to $CONVERTED_FILE and created ${txt_file}"
+    else
+        echo "Error converting $filename"
+    fi
+done
diff --git a/gallery/classic/index.html b/gallery/classic/index.html
index 5453afe..77b8c0e 100644
--- a/gallery/classic/index.html
+++ b/gallery/classic/index.html
@@ -18,11 +18,11 @@
         .gallery-item { text-align: center; }
         .gallery img { object-fit: cover; border-radius: 10px; transition: transform 0.3s ease, box-shadow 0.3s ease; }
         .gallery img:hover { transform: scale(1.05); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2); }
-        .caption { font-size: 0.9rem; margin-top: 5px; color: #4a4a4a; font-family: 'Autour One', cursive; }
-        .lightbox { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); display: none; justify-content: center; align-items: center; z-index: 1000; }
-        .lightbox img { max-width: 90%; max-height: 80%; border-radius: 10px; }
+        .caption { font-size: 0.9rem; margin-top: 5px; color: #4a4a4a; font-family: 'Autour One', cursive; display:block; }
+        .lightbox { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.8); display: none; justify-content: center; align-items: center; z-index: 1000; }
+        .lightbox img { max-width: 90%; max-height: 100%; border-radius: 10px; }
         .lightbox:target { display: flex; }
-        .close { position: absolute; top: 20%; right: 10%; font-size: 30px; color: white; text-decoration: none; }
+        .close { position: absolute; top: 20%; right: 10%; font-size: 30px; color: white; text-decoration: none; display: none;}
     </style>
 </head>
 <body>
@@ -58,28 +58,70 @@
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Classic Balloon Décor</h1>
+            <h1 class="title has-text-centered has-text-dark">Classic Balloon Décor</h1>
             <div class="gallery">
                 <div class="gallery-item">
-                    <a href="#lightbox1"><img src="../../assets/pics/gallery/classic/20230617_131551.webp" alt="20' Classic Arch"></a>
-                    <p class="caption">20' Classic Arch</p>
+                    <a href="#lightbox1"><figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20230617_131551.webp" alt="20' Classic Arch"></figure></a>
+                    <div class="caption">20' Classic Arch</div>
                 </div>
                 <div class="gallery-item">
-                    <a href="#lightbox2"><img src="../../assets/pics/gallery/classic/_Photos_20241207_083534.webp" alt="Classic Columns"></a>
-                    <p class="caption">Classic Columns</p>
+                    <a href="#lightbox2"><figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20241116_194051.webp" alt="Column with Custom Vinyl and a Bouquet"></figure></a>
+                    <div class="caption">Column with Custom Vinyl and a Bouquet</div>
+                </div>
+                <div class="gallery-item">
+                    <a href="#lightbox3"><figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20241123_094218.webp" alt="Classic 25' Arch"></figure></a>
+                    <div class="caption">Classic 25' Arch</div>
+                </div>
+                <div class="gallery-item">
+                    <a href="#lightbox4"><figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20241231_171144.webp" alt="Ceiling Fill"></figure></a>
+                    <div class="caption">Ceiling Fill</div>
+                </div>
+                <div class="gallery-item">
+                    <a href="#lightbox5"><figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20250129_121605.webp" alt="Classic Columns"></figure></a>
+                    <div class="caption">Classic Columns</div>
+                </div>
+                <div class="gallery-item">
+                    <a href="#lightbox6"><figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20250129_121638.webp" alt="
+Classic 20' Arch with SIgnature Arrangement"></figure></a>
+                    <div class="caption">
+Classic 20' Arch with SIgnature Arrangement</div>
+                </div>
+                <div class="gallery-item">
+                    <a href="#lightbox7"><figure class="image is-square">  <img src="../../assets/pics/gallery/classic/_Photos_20241207_083534.webp" alt="Classic Columns"></figure></a>
+                    <div class="caption">Classic Columns</div>
                 </div>
             </div>
         </div>
     </section>
         <div id="lightbox1" class="lightbox">
-            <a href="#" class="close">&times;</a>
                     <a href="#lightbox1"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20230617_131551.webp" alt="20' Classic Arch"></figure></a>
-            <div><p class="caption" style="color: black; text-align: center; margin-top: 10px;">20' Classic Arch</p></div>
+            <br/><p class="caption" style="color: black; text-align: center; margin-top: 10px; padding: 10px;">20' Classic Arch</p>
         </div>
         <div id="lightbox2" class="lightbox">
-            <a href="#" class="close">&times;</a>
-                    <a href="#lightbox2"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/_Photos_20241207_083534.webp" alt="Classic Columns"></figure></a>
-            <div><p class="caption" style="color: black; text-align: center; margin-top: 10px;">Classic Columns</p></div>
+                    <a href="#lightbox2"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20241116_194051.webp" alt="Column with Custom Vinyl and a Bouquet"></figure></a>
+            <br/><p class="caption" style="color: black; text-align: center; margin-top: 10px; padding: 10px;">Column with Custom Vinyl and a Bouquet</p>
+        </div>
+        <div id="lightbox3" class="lightbox">
+                    <a href="#lightbox3"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20241123_094218.webp" alt="Classic 25' Arch"></figure></a>
+            <br/><p class="caption" style="color: black; text-align: center; margin-top: 10px; padding: 10px;">Classic 25' Arch</p>
+        </div>
+        <div id="lightbox4" class="lightbox">
+                    <a href="#lightbox4"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20241231_171144.webp" alt="Ceiling Fill"></figure></a>
+            <br/><p class="caption" style="color: black; text-align: center; margin-top: 10px; padding: 10px;">Ceiling Fill</p>
+        </div>
+        <div id="lightbox5" class="lightbox">
+                    <a href="#lightbox5"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20250129_121605.webp" alt="Classic Columns"></figure></a>
+            <br/><p class="caption" style="color: black; text-align: center; margin-top: 10px; padding: 10px;">Classic Columns</p>
+        </div>
+        <div id="lightbox6" class="lightbox">
+                    <a href="#lightbox6"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/20250129_121638.webp" alt="
+Classic 20' Arch with SIgnature Arrangement"></figure></a>
+            <br/><p class="caption" style="color: black; text-align: center; margin-top: 10px; padding: 10px;">
+Classic 20' Arch with SIgnature Arrangement</p>
+        </div>
+        <div id="lightbox7" class="lightbox">
+                    <a href="#lightbox7"> <figure class="image is-square">  <img src="../../assets/pics/gallery/classic/_Photos_20241207_083534.webp" alt="Classic Columns"></figure></a>
+            <br/><p class="caption" style="color: black; text-align: center; margin-top: 10px; padding: 10px;">Classic Columns</p>
         </div>
 
     <footer class="footer has-background-primary-light">
diff --git a/gallery/classic/updateGallery.sh b/gallery/classic/updateGallery.sh
index 5117d54..2f3535c 100755
--- a/gallery/classic/updateGallery.sh
+++ b/gallery/classic/updateGallery.sh
@@ -32,11 +32,11 @@ cat > "$OUTPUT_FILE" <<EOL
         .gallery-item { text-align: center; }
         .gallery img { object-fit: cover; border-radius: 10px; transition: transform 0.3s ease, box-shadow 0.3s ease; }
         .gallery img:hover { transform: scale(1.05); box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.2); }
-        .caption { font-size: 0.9rem; margin-top: 5px; color: #4a4a4a; font-family: 'Autour One', cursive; }
-        .lightbox { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); display: none; justify-content: center; align-items: center; z-index: 1000; }
-        .lightbox img { max-width: 90%; max-height: 80%; border-radius: 10px; }
+        .caption { font-size: 0.9rem; margin-top: 5px; color: #4a4a4a; font-family: 'Autour One', cursive; display:block; }
+        .lightbox { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: rgba(0, 0, 0, 0.8); display: none; justify-content: center; align-items: center; z-index: 1000; }
+        .lightbox img { max-width: 90%; max-height: 100%; border-radius: 10px; }
         .lightbox:target { display: flex; }
-        .close { position: absolute; top: 20%; right: 10%; font-size: 30px; color: white; text-decoration: none; }
+        .close { position: absolute; top: 20%; right: 10%; font-size: 30px; color: white; text-decoration: none; display: none;}
     </style>
 </head>
 <body>
@@ -72,7 +72,7 @@ cat > "$OUTPUT_FILE" <<EOL
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Classic Balloon Décor</h1>
+            <h1 class="title has-text-centered has-text-dark">Classic Balloon Décor</h1>
             <div class="gallery">
 EOL
 
@@ -91,8 +91,8 @@ for img in "$IMAGE_DIR"/*.{jpg,jpeg,png,gif,webp}; do
         fi
 
         echo "                <div class=\"gallery-item\">" >> "$OUTPUT_FILE"
-        echo "                    <a href=\"#lightbox$count\"><img src=\"$IMAGE_DIR/$filename\" alt=\"$caption\"></a>" >> "$OUTPUT_FILE"
-        echo "                    <p class=\"caption\">$caption</p>" >> "$OUTPUT_FILE"
+        echo "                    <a href=\"#lightbox$count\"><figure class=\"image is-square\">  <img src=\"$IMAGE_DIR/$filename\" alt=\"$caption\"></figure></a>" >> "$OUTPUT_FILE"
+        echo "                    <div class=\"caption\">$caption</div>" >> "$OUTPUT_FILE"
         echo "                </div>" >> "$OUTPUT_FILE"
 
         count=$((count+1))
@@ -120,9 +120,9 @@ for img in "$IMAGE_DIR"/*.{jpg,jpeg,png,gif,webp}; do
         fi
 
         echo "        <div id=\"lightbox$count\" class=\"lightbox\">" >> "$OUTPUT_FILE"
-        echo "            <a href=\"#\" class=\"close\">&times;</a>" >> "$OUTPUT_FILE"
+        # echo "            <a href=\"#\" class=\"close\">&times;</a>" >> "$OUTPUT_FILE"
         echo "                    <a href=\"#lightbox$count\"> <figure class=\"image is-square\">  <img src=\"$IMAGE_DIR/$filename\" alt=\"$caption\"></figure></a>" >> "$OUTPUT_FILE"
-        echo "            <div><p class=\"caption\" style=\"color: black; text-align: center; margin-top: 10px;\">$caption</p></div>" >> "$OUTPUT_FILE"
+        echo "            <br/><p class=\"caption\" style=\"color: black; text-align: center; margin-top: 10px; padding: 10px;\">$caption</p>" >> "$OUTPUT_FILE"
         echo "        </div>" >> "$OUTPUT_FILE"
 
         count=$((count+1))
diff --git a/gallery/classic/updateGallery1.sh b/gallery/classic/updateGallery1.sh
new file mode 100755
index 0000000..0a404d7
--- /dev/null
+++ b/gallery/classic/updateGallery1.sh
@@ -0,0 +1,71 @@
+#!/bin/bash
+
+# Check if input is provided
+if [ -z "$1" ]; then
+    echo "Usage: $0 DIRECTORY"
+    exit 1
+fi
+
+DIRECTORY=$1
+
+# Check if directory exists
+if [ ! -d "$DIRECTORY" ]; then
+    echo "Error: Directory does not exist."
+    exit 1
+fi
+
+# Set variables
+IMAGE_ DIR="$DIRECTORY"
+OUTPUT_FILE="index.html"
+
+# Generate gallery with captions
+count=1
+for img in $IMAGE_DIR/*.{jpg,jpeg,png,gif,webp}; do
+    if [ -f "$img" ]; then
+        filename=$(basename "$img")
+        caption_file="${filename%.*}.txt"
+        
+        # Read caption if available, otherwise use default
+        if [ -f "$caption_file" ]; then
+            caption=$(cat "$caption_file")
+        else
+            caption=""
+        fi
+
+        echo " <div class=\"gallery-item\">" >> $OUTPUT_FILE
+        echo "  <a href=\"#lightbox$count\"><figure class=\"image is-square\"> <img src=\"$IMAGE_DIR/$filename\" alt=\"$caption\"></figure></a>" >> $OUTPUT_FILE
+        echo "  <div class=\"caption\">$caption</div>" >> $OUTPUT_FILE
+        echo " </div>" >> $OUTPUT_FILE
+
+        count=$((count+1))
+    fi
+done
+
+# Add closing tags for the gallery
+cat >> $OUTPUT_FILE <<EOL
+ </div>
+</div>
+<footer class="footer has-background-primary-light">
+ <div class="content has-text-centered">
+  <h7>Copyright &copy; <span id="year"></span> Beach Party Balloons</h7>
+  <h7>All images & content are property of Beach Party Balloons. Use of images without written permission is prohibited.</h7>
+ </div>
+</footer>
+<div id="footer"></div>
+<script src="$IMAGE_DIR/script.js"></script>
+EOL
+
+# Add lightbox overlays with captions
+count=1
+for img in $IMAGE_DIR/*.{jpg,jpeg,png,gif,webp}; do
+    if [ -f "$img" ]; then
+        filename=$(basename "$img")
+        caption_file="${filename%.*}.txt"
+
+        if [ -f "$caption_file" ]; then
+            caption=$(cat "$caption_file")
+        else
+            caption=""
+        fi
+
+        echo " <div id=\"lightbox$count\" class=\"lightbox\">
\ No newline at end of file
diff --git a/gallery/organic/convertToWebp.sh b/gallery/organic/convertToWebp.sh
new file mode 100755
index 0000000..209cc6e
--- /dev/null
+++ b/gallery/organic/convertToWebp.sh
@@ -0,0 +1,32 @@
+#!/bin/bash
+
+# Specify the input directory
+INPUT_DIR="../../assets/pics/gallery/organic"
+
+# Ensure ImageMagick is installed
+
+
+for filename in $(find "$INPUT_DIR" -type f -name "*.heic"); do
+    # Define the output file name
+    CONVERTED_FILE="${filename%.heic}.webp"
+
+    # Skip if already converted
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        echo "Skipping $filename, already converted."
+        continue
+    fi
+
+    # Convert HEIC to WEBP
+    echo "Converting $filename to $CONVERTED_FILE..."
+    convert "$filename" -quality 85 "$CONVERTED_FILE"
+
+    # Verify conversion success
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        # Create a blank text file
+        txt_file="${CONVERTED_FILE%.webp}.txt"
+        echo -e "" > "$txt_file"
+        echo "Successfully converted $filename to $CONVERTED_FILE and created ${txt_file}"
+    else
+        echo "Error converting $filename"
+    fi
+done
diff --git a/gallery/organic/index.html b/gallery/organic/index.html
index 3693ee3..2fad89d 100644
--- a/gallery/organic/index.html
+++ b/gallery/organic/index.html
@@ -58,7 +58,7 @@
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Organic Balloon Décor</h1>
+            <h1 class="title has-text-centered has-text-dark">Organic Balloon Décor</h1>
             <div class="gallery">
                 <div class="gallery-item">
                     <a href="#lightbox1"> <figure class="image is-square">  <img src="../../assets/pics/gallery/organic/20241121_200047~2.jpg" alt=""></figure></a>
diff --git a/gallery/organic/updateGallery.sh b/gallery/organic/updateGallery.sh
index 0147cca..3284bdc 100755
--- a/gallery/organic/updateGallery.sh
+++ b/gallery/organic/updateGallery.sh
@@ -72,7 +72,7 @@ cat > "$OUTPUT_FILE" <<EOL
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Organic Balloon Décor</h1>
+            <h1 class="title has-text-centered has-text-dark">Organic Balloon Décor</h1>
             <div class="gallery">
 EOL
 
diff --git a/gallery/sculpture/convertToWebp.sh b/gallery/sculpture/convertToWebp.sh
new file mode 100755
index 0000000..2f2baca
--- /dev/null
+++ b/gallery/sculpture/convertToWebp.sh
@@ -0,0 +1,32 @@
+#!/bin/bash
+
+# Specify the input directory
+INPUT_DIR="../../assets/pics/gallery/sculpture"
+
+# Ensure ImageMagick is installed
+
+
+for filename in $(find "$INPUT_DIR" -type f -name "*.heic"); do
+    # Define the output file name
+    CONVERTED_FILE="${filename%.heic}.webp"
+
+    # Skip if already converted
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        echo "Skipping $filename, already converted."
+        continue
+    fi
+
+    # Convert HEIC to WEBP
+    echo "Converting $filename to $CONVERTED_FILE..."
+    convert "$filename" -quality 85 "$CONVERTED_FILE"
+
+    # Verify conversion success
+    if [[ -f "$CONVERTED_FILE" ]]; then
+        # Create a blank text file
+        txt_file="${CONVERTED_FILE%.webp}.txt"
+        echo -e "" > "$txt_file"
+        echo "Successfully converted $filename to $CONVERTED_FILE and created ${txt_file}"
+    else
+        echo "Error converting $filename"
+    fi
+done
diff --git a/gallery/sculpture/index.html b/gallery/sculpture/index.html
index 4cd1684..7eb4d45 100644
--- a/gallery/sculpture/index.html
+++ b/gallery/sculpture/index.html
@@ -58,7 +58,7 @@
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Sculptures and Themes</h1>
+            <h1 class="title has-text-centered has-text-dark">Sculptures and Themes</h1>
             <div class="gallery">
             </div>
         </div>
diff --git a/gallery/sculpture/updateGallery.sh b/gallery/sculpture/updateGallery.sh
index ee01f96..1555887 100755
--- a/gallery/sculpture/updateGallery.sh
+++ b/gallery/sculpture/updateGallery.sh
@@ -72,7 +72,7 @@ cat > "$OUTPUT_FILE" <<EOL
 </nav>
     <section class="section">
         <div class="container">
-            <h1 class="title has-text-centered">Sculptures and Themes</h1>
+            <h1 class="title has-text-centered has-text-dark">Sculptures and Themes</h1>
             <div class="gallery">
 EOL