diff --git a/_includes/index.html b/_includes/index.html
index 51acbcee..ac57ff56 100644
--- a/_includes/index.html
+++ b/_includes/index.html
@@ -64,7 +64,7 @@
 
   <!-- Chart of Five Eyes, Nine Eyes, and Fourteen Eyes -->
   <div class="row mb-3">
-    {% include panel.html color="danger"
+    {% include components/panel.html color="danger"
     title="Five Eyes"
     body='
     <ol class="card-ol">
@@ -1129,7 +1129,7 @@
     website="mozilla.org"
     footer="OS: Windows, macOS, Linux, BSD."
     description="Mozilla Thunderbird is a free, open source, cross-platform email, news, and chat client developed by the Mozilla Foundation. Thunderbird is an email, newsgroup, news feed, and chat (XMPP, IRC, Twitter) client."
-    %}    {% include card.html color="primary"
+    %}    {% include components/card.html color="primary"
     title="Claws Mail"
     image="/assets/img/tools/Claws-Mail.png"
     url="http://www.claws-mail.org/"
@@ -1178,7 +1178,7 @@
     footer="OS: Windows, macOS, Linux."
     description="Bitmessage is a P2P communications protocol used to send encrypted messages to another person or to many subscribers. It is decentralized and trustless,
     meaning that you need-not inherently trust any entities like root certificate authorities. It uses strong authentication which means that the sender of a message cannot be spoofed, and it aims to hide \"non-content\" data."
-    %}    {% include card.html color="warning"
+    %}    {% include components/card.html color="warning"
     title="RetroShare"
     image="/assets/img/tools/RetroShare.png"
     url="http://retroshare.net"
@@ -1300,7 +1300,7 @@
     <strong>If you are currently using a Video & Voice Messenger like Skype, Viber or Google Hangouts, you should pick an alternative here.</strong>
   </div>
   <div class="row mb-2">
-    {% include card.html color="success"
+    {% include components/card.html color="success"
     title="Mobile: Signal"
     image="/assets/img/tools/Signal.png"
     url="https://signal.org"
@@ -1342,7 +1342,7 @@
     <li><a href="https://motherboard.vice.com/en_us/article/secure-messaging-app-wire-stores-everyone-youve-ever-contacted-in-plain-text">Secure Messaging App Wire Stores Everyone You've Ever Contacted in Plain Text | Motherboard</a></li>
   </ul>  <h1 id="filesharing" class="anchor"><a href="#filesharing"><i class="fas fa-link anchor-icon"></i></a> File Sharing</h1>
   <div class="row mb-2">
-    {% include card.html color="success"
+    {% include components/card.html color="success"
     title="OnionShare"
     image="/assets/img/tools/OnionShare.png"
     url="https://onionshare.org/"
@@ -1439,7 +1439,7 @@
     footer="OS: Windows, macOS, Linux."
     description="SparkleShare creates a special folder on your computer. You can add remotely hosted folders (or \"projects\") to this folder. These projects will be automatically
     kept in sync with both the host and all of your peers when someone adds, removes or edits a file."
-    %}    {% include card.html color="primary"
+    %}    {% include components/card.html color="primary"
     title="Syncthing"
     image="/assets/img/tools/Syncthing.png"
     url="https://syncthing.net/"
@@ -1460,13 +1460,13 @@
   </div>
   <div class="row mb-2">
 
-    {% include card.html color="success"
+    {% include components/card.html color="success"
     title="Bitwarden - Cloud/Self-host"
     image="assets/img/tools/bitwarden.png"
     url="https://bitwarden.com/"
     footer="OS: Windows, macOS, Linux, iOS, Android, Web."
     description="Bitwarden is a free and open source password manager. It aims to solve password management problems for individuals, teams, and business organizations. Bitwarden is among the easiest and safest solutions to store all of your logins and passwords while conveniently keeping them synced between all of your devices. If you don't want to use the Bitwarden cloud, you can easily host your own Bitwarden server."
-    %}    {% include card.html color="primary"
+    %}    {% include components/card.html color="primary"
     title="KeePass / KeePassXC - Local"
     image="assets/img/tools/KeePass.png"
     url="http://keepass.info/download.html"
@@ -1476,7 +1476,7 @@
     master key or a key file. The databases are encrypted using the best and most secure encryption algorithms currently known: AES and Twofish. See also: <a href="https://keepassxc.org/">KeePassXC</a> with official native cross-platform support for Windows/macOS/Linux.'
     %}
 
-    {% include card.html color="warning"
+    {% include components/card.html color="warning"
     title="LessPass - Browser"
     image="assets/img/tools/LessPass.png"
     url="https://lesspass.com/"
@@ -1722,7 +1722,7 @@
 
   <div class="row mb-2">
 
-    {% include card.html color="success"
+    {% include components/card.html color="success"
     title="Joplin"
     image="assets/img/tools/Laverna.png"
     image="assets/img/tools/Joplin.png"