diff --git a/custom.d.ts b/custom.d.ts
index b707078..ec9057b 100644
--- a/custom.d.ts
+++ b/custom.d.ts
@@ -1,6 +1,5 @@
 declare module '*.svg' {
-  import { url } from 'src/types/url';
-  const content: url;
+  const content: string;
   export default content;
 }
 
diff --git a/package.json b/package.json
index 0aaa0f9..42d4b80 100644
--- a/package.json
+++ b/package.json
@@ -52,13 +52,13 @@
     "optimize-css-assets-webpack-plugin": "^5.0.3",
     "postcss-loader": "^3.0.0",
     "prettier": "^1.19.1",
+    "raw-loader": "^4.0.2",
     "resolve-url-loader": "^3.1.1",
     "responsive-loader": "^1.2.0",
     "sass": "^1.26.10",
     "sass-loader": "^8.0.2",
     "sharp": "^0.23.4",
     "style-loader": "^1.2.1",
-    "svg-url-loader": "^3.0.3",
     "terser-webpack-plugin": "^2.3.8",
     "ts-loader": "^6.2.2",
     "typescript": "^3.9.7",
diff --git a/src/page/footer/footer.html.ts b/src/page/footer/footer.html.ts
index 76c92d4..770aeaa 100644
--- a/src/page/footer/footer.html.ts
+++ b/src/page/footer/footer.html.ts
@@ -1,44 +1,36 @@
 import { Footer } from '../../types/portfolio';
-
 import './footer.scss';
+import cvIcon from '../../static/icons/cv.svg';
+import emailIcon from '../../static/icons/email.svg';
 import { html } from '../../types/html';
 
 export const generate = ({
   title,
   email,
-  curiumVitaes,
+  curriculaVitae,
   lastEditText,
   lastEdit,
 }: Footer): html => `
-    <footer id="page-footer">
-        <h2>${title}</h2>
-        <ul>
-            ${curiumVitaes
-              .map(
-                (cv, i) =>
-                  `<li>
-                      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 512.002 512.002" style="enable-background:new 0 0 512.002 512.002;" xml:space="preserve" width="512px" height="512px" class="">
-                          <path d="M394.667,42.667h-128c-11.782,0-21.333,9.551-21.333,21.333v128c0,11.782,9.551,21.333,21.333,21.333h128     c11.782,0,21.333-9.551,21.333-21.333V64C416,52.218,406.449,42.667,394.667,42.667z M290.347,192     c7.707-22.268,32.007-34.072,54.275-26.365c12.366,4.28,22.085,13.999,26.365,26.365H290.347z M309.333,117.333     c0-11.782,9.551-21.333,21.333-21.333C342.449,96,352,105.551,352,117.333c0,11.782-9.551,21.333-21.333,21.333     C318.885,138.667,309.333,129.116,309.333,117.333z M394.667,192h-1.387c-4.028-18.843-16.331-34.868-33.493-43.627     c17.25-16.053,18.221-43.051,2.167-60.301c-16.053-17.25-43.051-18.221-60.301-2.167c-17.25,16.053-18.221,43.051-2.167,60.301     c0.696,0.748,1.419,1.471,2.167,2.167c-17.203,8.734-29.548,24.763-33.6,43.627h-1.387V64h128V192z" class="active-path" fill="#31343F"/>
-                          <path d="M432.429,0.002C432.357,0.001,432.285,0,432.214,0h-282.88c-2.835-0.016-5.56,1.097-7.573,3.093L56.427,88.427     c-1.997,2.013-3.11,4.738-3.093,7.573v389.547c0.058,14.586,11.868,26.395,26.453,26.453h352     c14.668,0.177,26.701-11.57,26.878-26.238c0.001-0.072,0.001-0.144,0.002-0.215V26.88     C458.844,12.213,447.097,0.179,432.429,0.002z M437.334,485.547c0,2.828-2.292,5.12-5.12,5.12h-352     c-2.818,0.236-5.293-1.858-5.529-4.675c-0.012-0.148-0.018-0.296-0.018-0.445V100.374l64-64v44.16     c-0.057,2.627-2.173,4.743-4.8,4.8h-27.2v21.333h32c12.352-2.351,21.299-13.133,21.333-25.707V21.333h272.213     c2.828,0,5.12,2.292,5.12,5.12V485.547z" class="active-path" fill="#31343F"/>
-                          <rect x="192" y="256" width="170.667" height="21.333" class="active-path" fill="#31343F"/>
-                          <rect x="149.333" y="309.333" width="213.333" height="21.333" class="active-path" fill="#31343F"/>
-                          <rect x="149.333" y="362.667" width="213.333" height="21.333" class="active-path" fill="#31343F"/>
-                          <rect x="149.333" y="416" width="170.667" height="21.333" class="active-path" fill="#31343F"/>
-                          <rect x="341.334" y="416" width="21.333" height="21.333" class="active-path" fill="#31343F"/>
-                      </svg>
-                    <a id="cv-${i}" href="${cv.url}" target="_blank">${cv.name}</a>
-                 </li>`
-              )
-              .join('\n')}
-            <li>
-                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" height="512px" viewBox="0 0 512.00018 512" width="512px">
-                    <path d="m401.738281 442.710938c6.046875 9.242187 3.453125 21.636718-5.792969 27.683593-41.585937 27.195313-89.9375 41.582031-139.824218 41.605469-.039063 0-.082032 0-.121094 0-68.097656.003906-132.101562-26.234375-180.253906-73.890625-48.183594-47.683594-75.078125-111.46875-75.7343752-179.597656-.6601568-68.558594 25.4453122-133.210938 73.5039062-182.054688 48.066406-48.851562 112.265625-76 180.773437-76.45312475.5625 0 1.136719-.00390625 1.699219-.00390625 53.46875 0 104.816407 16.546875 148.613281 47.90625 43.277344 30.988281 75.519532 73.652344 93.238282 123.378906 3.707031 10.40625-1.722656 21.847656-12.125 25.554688-10.40625 3.707031-21.84375-1.722656-25.554688-12.125-30.898437-86.707032-112.84375-144.714844-204.195312-144.714844-.476563 0-.9375 0-1.414063.003906-57.796875.378906-111.964843 23.289063-152.523437 64.507813-40.546875 41.210937-62.570313 95.765625-62.015625 153.613281 1.132812 117.949219 98.019531 213.875 215.992187 213.875h.097656c42.097657-.019531 82.886719-12.148438 117.953126-35.082031 9.242187-6.046875 21.636718-3.453125 27.683593 5.792969zm110.261719-165.710938c0 50.179688-40.820312 91-91 91-32.0625 0-60.304688-16.667969-76.519531-41.796875-20.71875 26.058594-52.679688 42.796875-88.480469 42.796875-62.308594 0-113-50.691406-113-113s50.691406-113 113-113c28.277344 0 54.160156 10.441406 74 27.667969v-3.535157c0-11.042968 8.953125-20 20-20s20 8.957032 20 20v109.867188c0 28.121094 22.878906 51 51 51s51-22.878906 51-51c0-11.046875 8.953125-20 20-20s20 8.953125 20 20zm-183-21c0-40.25-32.746094-73-73-73-40.25 0-73 32.75-73 73 0 40.253906 32.75 73 73 73 40.253906 0 73-32.746094 73-73zm0 0" class="active-path" fill="#31343F"/>
-                    </svg>
-                <a id="email" href="mailto:${email}">${email}</a>
-            </li>
-        </ul>
-        <aside class="other">
-           <p>${lastEditText} <time datetime="${lastEdit.toISOString()}">${lastEdit.toLocaleDateString()}</time></p>
-        </aside>
-    </footer>
+  <footer id="page-footer">
+    <h2>${title}</h2>
+    <ul>
+        ${curriculaVitae
+          .map(
+            (cv, i) => `
+              <li>
+               ${cvIcon}
+                <a id="cv-${i}" href="${cv.url}" target="_blank">${cv.name}</a>
+              </li>
+            `
+          )
+          .join('\n')}
+      <li>
+        ${emailIcon}
+        <a id="email" href="mailto:${email}">${email}</a>
+      </li>
+    </ul>
+    <aside class="other">
+      <p>${lastEditText} <time datetime="${lastEdit.toISOString()}">${lastEdit.toLocaleDateString()}</time></p>
+    </aside>
+  </footer>
 `;
diff --git a/src/static/icons/cv.svg b/src/static/icons/cv.svg
new file mode 100644
index 0000000..1455470
--- /dev/null
+++ b/src/static/icons/cv.svg
@@ -0,0 +1,7 @@
+<svg xmlns="http://www.w3.org/2000/svg"  width="60" height="60" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M16 6h3a1 1 0 0 1 1 1v11a2 2 0 0 1 -4 0v-13a1 1 0 0 0 -1 -1h-10a1 1 0 0 0 -1 1v12a3 3 0 0 0 3 3h11" />
+  <line x1="8" y1="8" x2="12" y2="8" />
+  <line x1="8" y1="12" x2="12" y2="12" />
+  <line x1="8" y1="16" x2="12" y2="16" />
+</svg>
\ No newline at end of file
diff --git a/src/static/icons/email.svg b/src/static/icons/email.svg
new file mode 100644
index 0000000..c9ad225
--- /dev/null
+++ b/src/static/icons/email.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <circle cx="12" cy="12" r="4" />
+  <path d="M16 12v1.5a2.5 2.5 0 0 0 5 0v-1.5a9 9 0 1 0 -5.5 8.28" />
+</svg>
\ No newline at end of file
diff --git a/src/static/icons/github.svg b/src/static/icons/github.svg
new file mode 100644
index 0000000..538b919
--- /dev/null
+++ b/src/static/icons/github.svg
@@ -0,0 +1,4 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="60" height="60" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5" />
+</svg>
\ No newline at end of file
diff --git a/src/static/icons/info.svg b/src/static/icons/info.svg
new file mode 100644
index 0000000..c61b8c5
--- /dev/null
+++ b/src/static/icons/info.svg
@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg"  width="60" height="60" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <circle cx="12" cy="12" r="9" />
+  <line x1="12" y1="8" x2="12.01" y2="8" />
+  <polyline points="11 12 12 12 12 16 13 16" />
+</svg>
\ No newline at end of file
diff --git a/src/static/icons/loading.svg b/src/static/icons/loading.svg
new file mode 100644
index 0000000..7057118
--- /dev/null
+++ b/src/static/icons/loading.svg
@@ -0,0 +1,52 @@
+<?xml version="1.0" encoding="utf-8"?>
+  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin: auto; background: none; display: block; shape-rendering: auto;" width="200px" height="200px" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
+  <g transform="rotate(0 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.9166666666666666s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(30 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.8333333333333334s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(60 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.75s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(90 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.6666666666666666s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(120 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5833333333333334s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(150 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.5s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(180 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.4166666666666667s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(210 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.3333333333333333s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(240 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.25s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(270 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.16666666666666666s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(300 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="-0.08333333333333333s" repeatCount="indefinite"></animate>
+    </rect>
+  </g><g transform="rotate(330 50 50)">
+    <rect x="45" y="2" rx="5" ry="5" width="10" height="10" fill="#b7455e">
+      <animate attributeName="opacity" values="1;0" keyTimes="0;1" dur="1s" begin="0s" repeatCount="indefinite"></animate>
+    </rect>
+  </g>
+</svg>
\ No newline at end of file
diff --git a/src/static/icons/open.svg b/src/static/icons/open.svg
new file mode 100644
index 0000000..e3636bc
--- /dev/null
+++ b/src/static/icons/open.svg
@@ -0,0 +1,5 @@
+<svg xmlns="http://www.w3.org/2000/svg"  width="60" height="60" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
+  <path stroke="none" d="M0 0h24v24H0z" fill="none"/>
+  <path d="M14 8v-2a2 2 0 0 0 -2 -2h-7a2 2 0 0 0 -2 2v12a2 2 0 0 0 2 2h7a2 2 0 0 0 2 -2v-2" />
+  <path d="M20 12h-13l3 -3m0 6l-3 -3" />
+</svg>
\ No newline at end of file
diff --git a/src/static/icons/play-button.svg b/src/static/icons/play-button.svg
index d3c46ed..7768984 100644
--- a/src/static/icons/play-button.svg
+++ b/src/static/icons/play-button.svg
@@ -1,5 +1,5 @@
-<?xml version="1.0" encoding="iso-8859-1"?>
-<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+<?xml version="1.0"?>
+<svg version="1.1" fill="#ffffff" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 512 512" style="enable-background:new 0 0 512 512;" xml:space="preserve">
 			<path d="M256,0C114.833,0,0,114.844,0,256s114.833,256,256,256s256-114.844,256-256S397.167,0,256,0z M256,490.667
 				C126.604,490.667,21.333,385.396,21.333,256S126.604,21.333,256,21.333S490.667,126.604,490.667,256S385.396,490.667,256,490.667
diff --git a/webpack.config.js b/webpack.config.js
index 5416775..d3a0cbf 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -98,14 +98,6 @@ module.exports = {
           },
         ],
       },
-      {
-        test: /\.svg$/,
-        loader: 'svg-url-loader',
-        options: {
-          limit: 10 * 1024,
-          noquotes: true,
-        },
-      },
       {
         test: /\.(pdf)$/i,
         use: {
@@ -116,6 +108,10 @@ module.exports = {
           },
         },
       },
+      {
+        test: /\.svg$/i,
+        use: 'raw-loader',
+      },
       {
         test: /no-change.*(ico|html|txt)$/i,
         use: {