diff --git a/_layouts/default.html b/_layouts/default.html
index 3cae08c0e7d9712742636546f01178c162907aff..01f751692c88aa7db244db22662ff404b1195b35 100644
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -7,7 +7,7 @@
 
         <link rel="stylesheet" href="{{ "/assets/main.css" | relative_url }}">
         <link rel="shortcut icon" href="{{ "/assets/favicon.png" | relative_url }}" />
-        <link type="text/css" rel="stylesheet" href="//fonts.googleapis.com/css?family=Lato:400,400italic,700" media="all">
+        <link type="text/css" rel="stylesheet" href="{{ "/assets/lato.css" | relative_url }}" media="all">
 
         <title>{{ site.title }}{% if page.title %} - {{ page.title }}{% endif %}</title>
     </head>
diff --git a/_layouts/index.html b/_layouts/index.html
index 570a9cf192b40181f91034b2844dd8ca0a301f58..b3dfc126a507ecbcbe2a73998bf09e4fb6fd7ce0 100644
--- a/_layouts/index.html
+++ b/_layouts/index.html
@@ -22,9 +22,9 @@ layout: default
 
           <div class="index-photo">
             <picture>
-              <source media="(min-width: 200px)" srcset="https://webdav-r3lab.uni.lu/public/elixir/website/images/cover_big.jpg" alt="Elixir Luxembourg" />
-              <source media="(max-width: 200px)" srcset="https://webdav-r3lab.uni.lu/public/elixir/website/images/cover_small.jpg" alt="Elixir Luxembourg" />
-              <img src="https://webdav-r3lab.uni.lu/public/elixir/website/images/cover_small.jpg" alt="Elixir Luxembourg" />
+              <source media="(min-width: 200px)" srcset="{{ '/assets/cover_big.webp' | relative_url }}" alt="Elixir Luxembourg" />
+              <source media="(max-width: 200px)" srcset="{{ '/assets/cover_small.webp' | relative_url }}" alt="Elixir Luxembourg" />
+              <img src="{{ '/assets/cover_small.webp' | relative_url }}" alt="Elixir Luxembourg" />
             </picture>
           </div>
         </div>
diff --git a/assets/cover_big.webp b/assets/cover_big.webp
new file mode 100644
index 0000000000000000000000000000000000000000..0312e2852383e14e204d7a534c8cdabd163ca4f4
Binary files /dev/null and b/assets/cover_big.webp differ
diff --git a/assets/cover_small.webp b/assets/cover_small.webp
new file mode 100644
index 0000000000000000000000000000000000000000..0e2a0ce245920cefcaa5396e17763ab291db6b95
Binary files /dev/null and b/assets/cover_small.webp differ
diff --git a/assets/lato.css b/assets/lato.css
new file mode 100644
index 0000000000000000000000000000000000000000..535aa07aa55420bc5dfa92734b8d020c34a2c822
--- /dev/null
+++ b/assets/lato.css
@@ -0,0 +1,50 @@
+/* Font faces from https://fonts.googleapis.com/css?family=Lato:400,400italic,700 */
+
+/* latin-ext */
+@font-face {
+    font-family: 'Lato';
+    font-style: italic;
+    font-weight: 400;
+    src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v16/S6u8w4BMUTPHjxsAUi-qNiXg7eU0.woff2) format('woff2');
+    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+  }
+  /* latin */
+  @font-face {
+    font-family: 'Lato';
+    font-style: italic;
+    font-weight: 400;
+    src: local('Lato Italic'), local('Lato-Italic'), url(https://fonts.gstatic.com/s/lato/v16/S6u8w4BMUTPHjxsAXC-qNiXg7Q.woff2) format('woff2');
+    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+  }
+  /* latin-ext */
+  @font-face {
+    font-family: 'Lato';
+    font-style: normal;
+    font-weight: 400;
+    src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v16/S6uyw4BMUTPHjxAwXiWtFCfQ7A.woff2) format('woff2');
+    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+  }
+  /* latin */
+  @font-face {
+    font-family: 'Lato';
+    font-style: normal;
+    font-weight: 400;
+    src: local('Lato Regular'), local('Lato-Regular'), url(https://fonts.gstatic.com/s/lato/v16/S6uyw4BMUTPHjx4wXiWtFCc.woff2) format('woff2');
+    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+  }
+  /* latin-ext */
+  @font-face {
+    font-family: 'Lato';
+    font-style: normal;
+    font-weight: 700;
+    src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v16/S6u9w4BMUTPHh6UVSwaPGQ3q5d0N7w.woff2) format('woff2');
+    unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
+  }
+  /* latin */
+  @font-face {
+    font-family: 'Lato';
+    font-style: normal;
+    font-weight: 700;
+    src: local('Lato Bold'), local('Lato-Bold'), url(https://fonts.gstatic.com/s/lato/v16/S6u9w4BMUTPHh6UVSwiPGQ3q5d0.woff2) format('woff2');
+    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
+  }
\ No newline at end of file
diff --git a/elixir-theme.gemspec b/elixir-theme.gemspec
index 84feb81ebb340eebfd2ae05bff1a31f0c480d452..fdf22ec5746a4d3bd5104bc177fd7a850d5639fe 100644
--- a/elixir-theme.gemspec
+++ b/elixir-theme.gemspec
@@ -2,7 +2,7 @@
 
 Gem::Specification.new do |spec|
   spec.name          = "jekyll-elixir-theme"
-  spec.version       = "0.9.15"
+  spec.version       = "0.9.16"
   spec.authors       = ["jacek.lebioda"]
   spec.email         = ["jacek.lebioda@uni.lu"]
 
diff --git a/index.md b/index.md
index f6d510267f4166fbb9060e31a7f29a6b4559f5b0..b56e9dd0192bd7e55431c44feb8cda230a425aff 100644
--- a/index.md
+++ b/index.md
@@ -24,9 +24,22 @@ Sustainable access management according to well-defined criteria, in order to me
 
 ---
 
-[![Data Catalog]({{ '/assets/buttons/data_catalog.jpg' | relative_url }}){:width="155px"}]({{ '/sustainability-data/' | relative_url }})
-[![Tools Registry]({{ '/assets/buttons/tools_registry.jpg' | relative_url }}){:width="155px"}]({{ '/sustainability-tools/' | relative_url }})
-[![GDPR activities]({{ '/assets/buttons/gdpr.jpg' | relative_url }}){:width="155px"}]({{ '/gdpr-activities/' | relative_url }})
+<a href="{{ '/sustainability-data/' | relative_url }}"><picture>
+    <source media="(max-width: 600px)" srcset="{{ '/assets/buttons/data_catalog_small.jpg' | relative_url }}" />
+    <source media="(min-width: 600px)" srcset="{{ '/assets/buttons/data_catalog.jpg' | relative_url }}" />
+    <img src="{{ '/assets/buttons/data_catalog.jpg' | relative_url }}" alt="Data catalog" style="width:155px;" />
+  </picture></a>
+<a href="{{ '/sustainability-tools/' | relative_url }}"><picture>
+    <source media="(max-width: 600px)" srcset="{{ '/assets/buttons/tools_registry_small.jpg' | relative_url }}" />
+    <source media="(min-width: 600px)" srcset="{{ '/assets/buttons/tools_registry.jpg' | relative_url }}" />
+    <img src="{{ '/assets/buttons/tools_registry.jpg' | relative_url }}" alt="Tools Registry" style="width:155px;" />
+</picture></a>
+<a href="{{ '/gdpr-activities/' | relative_url }}"><picture>
+    <source media="(max-width: 600px)" srcset="{{ '/assets/buttons/gdpr_small.jpg' | relative_url }}" />
+    <source media="(min-width: 600px)" srcset="{{ '/assets/buttons/gdpr.jpg' | relative_url }}" />
+    <img src="{{ '/assets/buttons/gdpr.jpg' | relative_url }}" alt="GDPR activities" style="width:155px;" />
+  </picture></a>
+
 
 ---