diff --git a/Rakefile b/Rakefile
index f423e18..905bde9 100644
--- a/Rakefile
+++ b/Rakefile
@@ -141,8 +141,13 @@ end
 # publish
 #
 desc "publish"
-task :publish do
-  sh "./upload.ion"
+task :publish => [:all] do
+  sh "./preview.ion"
+end
+
+desc "preview"
+task :preview => [:all] do
+  sh "./preview.ion"
 end
 
 
diff --git a/content/art/graffiti-wallpapers/index.md b/content/art/graffiti-wallpapers/index.md
index 6680eb5..fc153be 100644
--- a/content/art/graffiti-wallpapers/index.md
+++ b/content/art/graffiti-wallpapers/index.md
@@ -5,5 +5,5 @@ date: 2021-08-27
 
 Hier meine bilder
 
-{{< wallpaper-gallery >}}
+{{< wallpaper-gallery class="iphone-overlay" >}}
 
diff --git a/layouts/shortcodes/wallpaper-gallery.html b/layouts/shortcodes/wallpaper-gallery.html
index 3697ffd..3e3910f 100644
--- a/layouts/shortcodes/wallpaper-gallery.html
+++ b/layouts/shortcodes/wallpaper-gallery.html
@@ -1,9 +1,10 @@
+{{ $class := .Get "class" }}
 {{ with .Page.Resources.ByType "image" }}
-<div class="flexbox box-size-third">
+<div class="flexbox box-size-third {{ $class }}">
     {{ range . }}
     <div class="flexitem">
         {{- $image := .Resize "100x" -}}
-        <img src="{{ $image.RelPermalink }}" width="100%" >
+        <img src="{{ $image.RelPermalink }}">
     </div>
     {{ end }}
 </div>
diff --git a/preview.ion b/preview.ion
new file mode 100755
index 0000000..7dd0021
--- /dev/null
+++ b/preview.ion
@@ -0,0 +1,29 @@
+#!/usr/bin/env ion
+
+set -e
+
+let server      = sputnik.private
+let server_path = /srv/www/tech_preview
+let syncfolder  = sync
+
+echo
+echo "create page"
+echo
+hugo
+
+echo
+echo "copy stuff"
+echo
+rsync \
+  --recursive \
+  --compress \
+  --checksum \
+  --verbose \
+  --human-readable \
+  --partial --progress \
+  --protect-args \
+  --delete-after \
+  public/ $server:$server_path/
+
+
+
diff --git a/upload.ion b/publish.ion
similarity index 100%
rename from upload.ion
rename to publish.ion
diff --git a/src/lessc/page/custom-iphone.less b/src/lessc/page/custom-iphone.less
new file mode 100644
index 0000000..30ec3d3
--- /dev/null
+++ b/src/lessc/page/custom-iphone.less
@@ -0,0 +1,23 @@
+.flexbox.iphone-overlay {
+
+  &.box-size-third {
+    .flexitem {
+      margin: 1%;
+      flex: 0 0 31%;
+    }
+  }
+
+  &.box-size-half {
+    .flexitem {
+      margin: 1%;
+      flex: 0 0 49%;
+    }
+  }
+
+  img {
+    border-radius: 20px;
+    width: 100%;
+  }
+
+
+}
\ No newline at end of file
diff --git a/src/lessc/page/main.less b/src/lessc/page/main.less
index 9638290..3384828 100644
--- a/src/lessc/page/main.less
+++ b/src/lessc/page/main.less
@@ -10,6 +10,8 @@
 @import "main-listing.less";
 @import "chroma-highlighting-syntax.less";
 
+@import "custom-iphone.less";
+
 // left and right for notes and warning and and code blocks
 @special-info-padding-side: 0.5em;