diff --git a/assets/css/main.css b/assets/css/main.css
index b677861..289f407 100644
--- a/assets/css/main.css
+++ b/assets/css/main.css
@@ -2046,6 +2046,117 @@ input, select, textarea {
font-family: 'Font Awesome 5 Brands';
}
+/* Image2 */
+
+ .image2 {
+ border-radius: 0.35em;
+ border: 0;
+ display: inline-block;
+ position: relative;
+ }
+
+ .image2:before {
+ -moz-transition: opacity 0.2s ease-in-out;
+ -webkit-transition: opacity 0.2s ease-in-out;
+ -ms-transition: opacity 0.2s ease-in-out;
+ transition: opacity 0.2s ease-in-out;
+ background: url("images/overlay.png");
+ border-radius: 0.35em;
+ content: '';
+ display: block;
+ height: 100%;
+ left: 0;
+ opacity: 0.5;
+ position: absolute;
+ top: 0;
+ width: 100%;
+ }
+
+ .image2.thumb {
+ text-align: center;
+ }
+
+ .image2.thumb:after {
+ -moz-transition: opacity 0.2s ease-in-out;
+ -webkit-transition: opacity 0.2s ease-in-out;
+ -ms-transition: opacity 0.2s ease-in-out;
+ transition: opacity 0.2s ease-in-out;
+ border-radius: 0.35em;
+ border: solid 3px rgba(255, 255, 255, 0.5);
+ color: #fff;
+ content: 'Visit shop';
+ display: inline-block;
+ font-size: 0.8em;
+ font-weight: 400;
+ left: 50%;
+ line-height: 2.25em;
+ margin: -1.25em 0 0 -3em;
+ opacity: 0;
+ padding: 0 1.5em;
+ position: absolute;
+ text-align: center;
+ text-decoration: none;
+ top: 50%;
+ white-space: nowrap;
+ }
+
+ .image2.thumb:hover:after {
+ opacity: 1.0;
+ }
+
+ .image2.thumb:hover:before {
+ background: url("images/overlay.png"), url("images/overlay.png");
+ opacity: 1.0;
+ }
+
+ .image2 img {
+ border-radius: 0.35em;
+ display: block;
+ }
+
+ .image2.left {
+ float: left;
+ margin: 0 1.5em 1em 0;
+ top: 0.25em;
+ }
+
+ .image2.right {
+ float: right;
+ margin: 0 0 1em 1.5em;
+ top: 0.25em;
+ }
+
+ .image2.left, .image2.right {
+ max-width: 40%;
+ }
+
+ .image2.left img, .image2.right img {
+ width: 100%;
+ }
+
+ .image2.fit {
+ display: block;
+ margin: 0 0 2em 0;
+ width: 100%;
+ }
+
+ .image2.fit img {
+ width: 100%;
+ }
+
+ .image2.avatar {
+ border-radius: 100%;
+ }
+
+ .image2.avatar:before {
+ display: none;
+ }
+
+ .image2.avatar img {
+ border-radius: 100%;
+ width: 100%;
+ }
+
/* Image */
.image {
@@ -2572,6 +2683,10 @@ input, select, textarea {
margin: 0 0 1.5em 0;
}
+ .work-item .image2 {
+ margin: 0 0 1.5em 0;
+ }
+
.work-item h3 {
font-size: 1em;
margin: 0 0 0.5em 0;
diff --git a/images/thumbs/05.jpg b/images/thumbs/05.jpg
deleted file mode 100644
index 27ee883..0000000
Binary files a/images/thumbs/05.jpg and /dev/null differ
diff --git a/images/thumbs/06.jpg b/images/thumbs/06.jpg
deleted file mode 100644
index 845aa9b..0000000
Binary files a/images/thumbs/06.jpg and /dev/null differ
diff --git a/images/thumbs/t1.jpg b/images/thumbs/t1.jpg
new file mode 100644
index 0000000..dd748da
Binary files /dev/null and b/images/thumbs/t1.jpg differ
diff --git a/images/thumbs/t1.png b/images/thumbs/t1.png
new file mode 100644
index 0000000..9fd553f
Binary files /dev/null and b/images/thumbs/t1.png differ
diff --git a/images/thumbs/t2.jpg b/images/thumbs/t2.jpg
new file mode 100644
index 0000000..be3b68b
Binary files /dev/null and b/images/thumbs/t2.jpg differ
diff --git a/images/thumbs/t2.png b/images/thumbs/t2.png
new file mode 100644
index 0000000..001b0e6
Binary files /dev/null and b/images/thumbs/t2.png differ
diff --git a/images/thumbs/t3.jpg b/images/thumbs/t3.jpg
new file mode 100644
index 0000000..3100454
Binary files /dev/null and b/images/thumbs/t3.jpg differ
diff --git a/images/thumbs/t3.png b/images/thumbs/t3.png
new file mode 100644
index 0000000..91ec74f
Binary files /dev/null and b/images/thumbs/t3.png differ
diff --git a/index.html b/index.html
index e7d6737..633bd78 100644
--- a/index.html
+++ b/index.html
@@ -13,9 +13,9 @@
I spend a lot of time researching and thinking about blockchain, often while walking through the Finnish woods. And then, every now and again, I find myself compelled to write a book about what I've discovered.
+ + + +Prices shown are estimates and may differ depending on your shipping destination
+