diff --git a/src/App.js b/src/App.js
index 83fecd2..514201c 100644
--- a/src/App.js
+++ b/src/App.js
@@ -5,6 +5,7 @@ import ContactForm from "./components/Contact";
 import Home from "./components/Home";
 import PostDetail from "./components/PostDetail";
 import Blog from "./components/Blog";
+import Donate from "./components/Donate";
 import Navbar from "./components/Navbar";
 
 function App() {
@@ -16,6 +17,7 @@ function App() {
         <Route component={ContactForm} path="/contact" />
         <Route component={PostDetail} path="/blog/:slug" />
         <Route component={Blog} path="/blog" />
+        <Route component={Donate} path="/donate" />
         <Route component={Home} path="/" />
       </Switch>
     </BrowserRouter>
diff --git a/src/components/Donate.js b/src/components/Donate.js
new file mode 100644
index 0000000..cf7bbea
--- /dev/null
+++ b/src/components/Donate.js
@@ -0,0 +1,54 @@
+import React, {Component} from "react";
+import {createGlobalStyle} from 'styled-components';
+import bot2 from "./assets/img/bot2.png";
+import './assets/Donate.scss'
+
+const GlobalStyle = createGlobalStyle`
+  html {
+    height: 100%
+  }
+  body {
+    background-color: #293241;
+    font-family: Arial, Helvetica, sans-serif;
+    height: 100%;
+    margin: 0;
+    color: #555;
+  }
+`;
+
+class Donate extends Component {
+    render() {
+        return(
+            <>
+            <GlobalStyle />
+              {/* <div className="content-box"> hjalsdklANSDFKJASNDF</div> */}
+            <div className="centered"> 
+            <p>
+              <h1>Donate Today</h1>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <h2>Paypal widget here</h2>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <span><br></br></span>
+              <h2>Gofundme widget here</h2>
+            </p>
+            </div>
+            <img className="landing-robot" src={bot2}> 
+              
+              </img>
+            </>
+        );
+    }
+}
+
+export default Donate;
\ No newline at end of file
diff --git a/src/components/assets/Donate.scss b/src/components/assets/Donate.scss
new file mode 100644
index 0000000..379dffc
--- /dev/null
+++ b/src/components/assets/Donate.scss
@@ -0,0 +1,36 @@
+.centered {  
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  height: 60%;
+  zoom: 1;
+	filter: alpha(opacity=100);
+	opacity: 0.8;
+  width: 40%;
+  background-color:#3d5a80;
+  border-radius: 10px;
+  transform: translate(-50%, -50%);
+}
+p {
+  margin-left:4em;
+  vertical-align: middle;
+}
+h1 {
+  font-family: "Poppins", sans-serif;
+  font-size:250%;
+  position: absolute;
+  color:#e0fbfc;
+}
+h2{
+  font-family: "Poppins", sans-serif;
+  font-size: 2em;
+  position: absolute;
+  color:#e0fbfc;
+}
+.landing-robot {
+  opacity: 0;
+  left: 8vw;
+  overflow: hidden;
+  animation: navLinkFade 0.5s ease forwards 0.5s;
+  height: 80%;
+}