diff --git a/layouts/DefaultLayout.js b/layouts/DefaultLayout.js
index de26fa3..230b905 100644
--- a/layouts/DefaultLayout.js
+++ b/layouts/DefaultLayout.js
@@ -1,4 +1,5 @@
 import Header from "../components/Header";
+import Footer from "../components/Footer";
 
 const DefaultLayout = ({ children }) => (
   <>
@@ -6,10 +7,12 @@ const DefaultLayout = ({ children }) => (
     <div className="page-content-wrapper">
       <div className="page-content">{children}</div>
 
+      <Footer />
       <style jsx global>{`
         .page-content-wrapper {
           display: flex;
           justify-content: center;
+          padding-bottom: 300px;
         }
         .page-content {
           display: grid;
diff --git a/layouts/SingleBookLayout.js b/layouts/SingleBookLayout.js
index 2b71689..ae1a2c9 100644
--- a/layouts/SingleBookLayout.js
+++ b/layouts/SingleBookLayout.js
@@ -25,6 +25,7 @@ const SingleBookLayout = ({ children }) => (
         .single-book-wrapper {
           display: flex;
           justify-content: center;
+          padding-bottom: 300px;
         }
         .single-book {
           display: grid;