diff --git a/attached_assets/image_1772792829860.png b/attached_assets/image_1772792829860.png
new file mode 100644
index 0000000..853d73d
Binary files /dev/null and b/attached_assets/image_1772792829860.png differ
diff --git a/client/src/components/photo-gallery.tsx b/client/src/components/photo-gallery.tsx
index 364ef6e..73e2429 100644
--- a/client/src/components/photo-gallery.tsx
+++ b/client/src/components/photo-gallery.tsx
@@ -32,7 +32,7 @@ function thumbUrl(src: string) {
   return src;
 }
 
-function LazyImage({ src, alt, className, onClick }: { src: string; alt: string; className?: string; onClick?: () => void }) {
+function LazyImage({ src, alt, className, onClick, objectPosition }: { src: string; alt: string; className?: string; onClick?: () => void; objectPosition?: string }) {
   const ref = useRef<HTMLDivElement>(null);
   const [visible, setVisible] = useState(false);
   const [loaded, setLoaded] = useState(false);
@@ -57,6 +57,7 @@ function LazyImage({ src, alt, className, onClick }: { src: string; alt: string;
             src={src}
             alt={alt}
             className={`w-full h-full object-cover transition-opacity duration-300 ${loaded ? "opacity-100" : "opacity-0"}`}
+            style={objectPosition ? { objectPosition } : undefined}
             onLoad={() => setLoaded(true)}
           />
         </>
@@ -342,7 +343,8 @@ export default function GalleryPage() {
                   <LazyImage
                     src={img.mobile || thumbUrl(img.thumb)}
                     alt={img.artist || img.fileName}
-                    className="absolute inset-0 w-full h-full transition-transform duration-500 group-hover:scale-110 [&_img]:object-[center_25%]"
+                    className="absolute inset-0 w-full h-full transition-transform duration-500 group-hover:scale-110"
+                    objectPosition="center 15%"
                   />
                   <div className="absolute inset-0 bg-black/0 group-hover:bg-black/20 transition-colors" />
                   {img.artist && (