Fix fonts

assets/roboto-mono.scss

@@ -0,0 +1,12 @@
+@font-face {
+  font-family: 'Roboto Mono';
+  src:
+    local('Roboto Mono'),
+    url('../webfonts/roboto-mono/robotomono-regular-webfont.woff2') format('woff2'),
+    url('../webfonts/roboto-mono/robotomono-regular-webfont.woff') format('woff'),
+    url('../webfonts/roboto-mono/robotomono-regular-webfont.ttf') format('truetype'),
+    url('../webfonts/roboto-mono/robotomono-regular-webfont.svg#roboto_monoregular') format('svg');
+  font-weight: 400;
+  font-display: swap;
+  font-style: normal;
+}

assets/roboto.scss

@@ -0,0 +1,51 @@
+@font-face {
+  font-family: 'Roboto';
+  src:
+    local('Roboto Italic'),
+    url('../webfonts/roboto/roboto-italic-webfont.woff2') format('woff2'),
+    url('../webfonts/roboto/roboto-italic-webfont.woff') format('woff'),
+    url('../webfonts/roboto/roboto-italic-webfont.ttf') format('truetype'),
+    url('../webfonts/roboto/roboto-italic-webfont.svg#roboto-italic-webfont') format('svg');
+  font-weight: normal;
+  font-display: swap;
+  font-style: italic;
+}
+
+@font-face {
+  font-family: 'Roboto';
+  src:
+    local('Roboto Bold'),
+    url('../webfonts/roboto/roboto-bold-webfont.woff2') format('woff2'),
+    url('../webfonts/roboto/roboto-bold-webfont.woff') format('woff'),
+    url('../webfonts/roboto/roboto-bold-webfont.ttf') format('truetype'),
+    url('../webfonts/roboto/roboto-bold-webfont.svg#roboto-bold-webfont') format('svg');
+  font-weight: bold;
+  font-display: swap;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Roboto';
+  src:
+    local('Roboto Medium'),
+    url('../webfonts/roboto/roboto-medium-webfont.woff2') format('woff2'),
+    url('../webfonts/roboto/roboto-medium-webfont.woff') format('woff'),
+    url('../webfonts/roboto/roboto-medium-webfont.ttf') format('truetype'),
+    url('../webfonts/roboto/roboto-medium-webfont.svg#roboto-medium-webfont') format('svg');
+  font-weight: 500;
+  font-display: swap;
+  font-style: normal;
+}
+
+@font-face {
+  font-family: 'Roboto';
+  src:
+    local('Roboto'),
+    url('../webfonts/roboto/roboto-regular-webfont.woff2') format('woff2'),
+    url('../webfonts/roboto/roboto-regular-webfont.woff') format('woff'),
+    url('../webfonts/roboto/roboto-regular-webfont.ttf') format('truetype'),
+    url('../webfonts/roboto/roboto-regular-webfont.svg#roboto-regular-webfont') format('svg');
+  font-weight: normal;
+  font-display: swap;
+  font-style: normal;
+}

assets/style.scss

@@ -1,4 +1,3 @@
-@import url('https://fonts.googleapis.com/css?family=Roboto:400,500,700|Roboto+Mono:400');
 @import 'fontawesome.scss';
 
 $white:    #fff   ; // color5

content/en/_index.md

@@ -6,8 +6,6 @@ menu:
     weight: -99
 ---
 
-{{< youtube id="IPSbNdBmWKE" caption="An introductory video explaining basic Mastodon concepts with visual animations" >}}
-
 ## What is a microblog? {#microblogging}
 
 Similar to how blogging is the act of publishing updates to a website, **microblogging** is the act of publishing small updates to a stream of updates on your profile. You can publish text posts and optionally attach media such as pictures, audio, video, or polls. Mastodon lets you follow friends and discover new ones.

content/ja/_index.md

@@ -6,8 +6,6 @@ menu:
     weight: -99
 ---
 
-{{< youtube id="IPSbNdBmWKE" caption="視覚的なアニメーションを通して基本的なMastodonの概念を説明している紹介動画" >}}
-
 ## マイクロブログとは？ {#microblogging}
 
 ブログを行うことは、ウェブサイトにおいて記事を更新して掲載する行為と言えます。それと似ていて、**マイクロブログ**を行うことは、自分に関して刻一刻と変化する小さな情報を更新して掲載する行為と言えるでしょう。あなたはテキストの投稿を掲載できます。さらに画像や音声、動画、投票を添付することもできます。Mastodonでは、友達をフォローしたり、新しい友達を見つけたりできるでしょう。

content/pl/_index.md

@@ -6,8 +6,6 @@ menu:
     weight: -99
 ---
 
-{{< youtube id="IPSbNdBmWKE" caption="Wideo wprowadzające, wyjaśniające podstawowe koncepcje Mastodona z użyciem ładnych animacji" >}}
-
 ## Czym jest mikroblog? {#microblogging}
 
 Tak jak blogowaniem nazwiemy publikowanie aktualności na stronie, **mikroblogowanie** to publikowanie mniejszych aktualności na strumieniu aktualności na własnym profilu. Możesz publikować wpisy tekstowe, dodatkowo umieszczając media takie jak zdjęcia, dźwięk, filmy czy ankiety. Mastodon pozwala na obserwowanie znajomych i poznawanie nowych.

content/zh-cn/_index.md

@@ -6,8 +6,6 @@ menu:
     weight: -99
 ---
 
-{{< bilibili id="21139681" caption="一个使用动画介绍Mastodon概念的视频" >}}
-
 ## 什么是微博客？ {#microblogging}
 
 类似于发布博客是将更新发布到网站上，**发布微博客**是将小的更新发布到你的个人信息流。你可以发布文本，也可以附加图片、音频、视频等媒体，或是发起投票。Mastodon可以让你发现并关注新的朋友们。