diff --git a/src/components/Loader/Loader.module.css b/src/components/Loader/Loader.module.css
new file mode 100644
index 00000000..cecff5a2
--- /dev/null
+++ b/src/components/Loader/Loader.module.css
@@ -0,0 +1,84 @@
+.loader {
+  -webkit-animation: load1 1s infinite ease-in-out;
+  animation: load1 1s infinite ease-in-out;
+  width: 1em;
+  height: 4em;
+}
+
+.loader::before,
+.loader::after {
+  -webkit-animation: load1 1s infinite ease-in-out;
+  animation: load1 1s infinite ease-in-out;
+  width: 1em;
+  height: 4em;
+}
+
+.loader::before,
+.loader::after {
+  position: absolute;
+  top: 0;
+  content: '';
+}
+
+.loader::before {
+  left: -1.5em;
+  -webkit-animation-delay: -0.32s;
+  animation-delay: -0.32s;
+}
+
+.loadingSection {
+  height: 70px;
+  margin: 40px 0 40px 40px;
+}
+
+@media only screen and (max-width: 768px) {
+  .loadingSection {
+    display: block;
+    position: relative;
+    margin: 45vh 0;
+  }
+}
+
+.loader {
+  text-indent: -9999em;
+  margin: 20px 20px;
+  position: relative;
+  font-size: 11px;
+  -webkit-transform: translateZ(0);
+  -ms-transform: translateZ(0);
+  transform: translateZ(0);
+  -webkit-animation-delay: -0.16s;
+  animation-delay: -0.16s;
+}
+
+.loader::after {
+  left: 1.5em;
+}
+
+@media only screen and (max-width: 768px) {
+  .loader {
+    margin: 20px auto;
+  }
+}
+
+@-webkit-keyframes load1 {
+  0%, 80%, 100% { box-shadow: 0 0; height: 2em; }
+  40% { box-shadow: 0 -2em; height: 3em; }
+}
+
+@keyframes load1 {
+  0%, 80%, 100% { box-shadow: 0 0; height: 2em; }
+  40% { box-shadow: 0 -2em; height: 3em; }
+}
+
+@media only screen and (max-width: 768px) {
+  @-webkit-keyframes load1 {
+    0%, 80%, 100% { box-shadow: 0 0; height: 4em; }
+    40% { box-shadow: 0 -2em; height: 5em; }
+  }
+
+  @keyframes load1 {
+    0%, 80%, 100% { box-shadow: 0 0; height: 3em; }
+    40% { box-shadow: 0 -2em; height: 4em; }
+  }
+}
diff --git a/src/components/Loader/Loader.tsx b/src/components/Loader/Loader.tsx
new file mode 100644
index 00000000..9a67d157
--- /dev/null
+++ b/src/components/Loader/Loader.tsx
@@ -0,0 +1,12 @@
+import React from 'react';
+import styles from './Loader.module.css';
+
+export const Loader: React.FC = () => {
+  return (
+    <div className={styles.loadingSection}>
+      <div className={styles.loader}>
+        Loading...
+      </div>
+    </div>
+  );
+};