diff --git a/web/e.cash/components/homepage-tiles/styles.js b/web/e.cash/components/homepage-tiles/styles.js
--- a/web/e.cash/components/homepage-tiles/styles.js
+++ b/web/e.cash/components/homepage-tiles/styles.js
@@ -2,8 +2,12 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const GridCtn = styled.div`
+export const GridCtn = styled(motion.div).attrs(() =>
+    getAnimationSettings({ duration: 2, displacement: 200 }),
+)`
     margin-top: 30px;
     display: grid;
     grid-template-columns: repeat(3, 1fr);
diff --git a/web/e.cash/components/navbar/styles.js b/web/e.cash/components/navbar/styles.js
--- a/web/e.cash/components/navbar/styles.js
+++ b/web/e.cash/components/navbar/styles.js
@@ -2,16 +2,8 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
-import { motion } from 'framer-motion';
-import { getAnimationSettings } from '/styles/framer-motion';
-
-export const NavbarOuter = styled(motion.div).attrs(() =>
-    getAnimationSettings({
-        delay: 1,
-        animateUp: false,
-        onScroll: false,
-    }),
-)`
+
+export const NavbarOuter = styled.div`
     position: fixed;
     top: 0;
     width: 100%;
diff --git a/web/e.cash/components/roadmap/styles.js b/web/e.cash/components/roadmap/styles.js
--- a/web/e.cash/components/roadmap/styles.js
+++ b/web/e.cash/components/roadmap/styles.js
@@ -4,8 +4,12 @@
 import styled from 'styled-components';
 import Image from 'next/image';
 import { getStatusValues } from './status.js';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const Legend = styled.div`
+export const Legend = styled(motion.div).attrs(() =>
+    getAnimationSettings({ duration: 1, displacement: 200 }),
+)`
     display: flex;
     align-items: center;
     justify-content: center;
@@ -54,7 +58,9 @@
     position: relative;
 `;
 
-export const RoadmapBlock = styled.div`
+export const RoadmapBlock = styled(motion.div).attrs(() =>
+    getAnimationSettings({ duration: 2, displacement: 200 }),
+)`
     display: flex;
     width: 100%;
     margin-bottom: 100px;
diff --git a/web/e.cash/components/sub-page-hero/styles.js b/web/e.cash/components/sub-page-hero/styles.js
--- a/web/e.cash/components/sub-page-hero/styles.js
+++ b/web/e.cash/components/sub-page-hero/styles.js
@@ -2,12 +2,16 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
 export const OuterHeroCtn = styled.div`
     width: 100%;
     position: relative;
 `;
-export const HeroCtn = styled.div`
+export const HeroCtn = styled(motion.div).attrs(() =>
+    getAnimationSettings({ duration: 2, displacement: 300 }),
+)`
     display: flex;
     padding-top: 130px;
     position: relative;
diff --git a/web/e.cash/styles/pages/blog.js b/web/e.cash/styles/pages/blog.js
--- a/web/e.cash/styles/pages/blog.js
+++ b/web/e.cash/styles/pages/blog.js
@@ -3,6 +3,8 @@
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
 import Link from 'next/link';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
 export const BlogCtn = styled.div`
     padding: 160px 0;
@@ -14,7 +16,9 @@
     }
 `;
 
-export const FeaturedCardCtn = styled.div`
+export const FeaturedCardCtn = styled(motion.div).attrs(() =>
+    getAnimationSettings(),
+)`
     display: grid;
     grid-template-columns: repeat(3, 1fr);
     grid-template-rows: repeat(2, 1fr);
@@ -77,7 +81,7 @@
     display: flex;
     flex-direction: column;
     border: 1px solid ${props => props.theme.colors.primaryLight};
-    transition: all ease-in-out 200ms;
+    transition: border-color ease-in-out 200ms;
     position: relative;
     box-shadow: 0px 0px 22px 1px ${props => props.theme.colors.primaryLight}68;
     :nth-child(2) {
@@ -137,11 +141,11 @@
     }
 `;
 
-export const Card = styled(Link)`
+export const Card = styled(motion(Link)).attrs(() => getAnimationSettings())`
     display: flex;
     flex-direction: column;
     border: 1px solid ${props => props.theme.colors.primaryLight};
-    transition: all ease-in-out 200ms;
+    transition: border-color ease-in-out 200ms;
     position: relative;
     box-shadow: 0px 0px 22px 1px ${props => props.theme.colors.primaryLight}68;
     :hover {
@@ -172,7 +176,7 @@
     }
 `;
 
-export const PostCtn = styled.div`
+export const PostCtn = styled(motion.div).attrs(() => getAnimationSettings())`
     padding: 150px 0;
 `;
 
diff --git a/web/e.cash/styles/pages/careers.js b/web/e.cash/styles/pages/careers.js
--- a/web/e.cash/styles/pages/careers.js
+++ b/web/e.cash/styles/pages/careers.js
@@ -2,8 +2,12 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const CareersCtn = styled.div`
+export const CareersCtn = styled(motion.div).attrs(() =>
+    getAnimationSettings(),
+)`
     padding: 160px 0;
     background-size: 60px 103px;
     background-image: url(/images/logo-tile.png);
diff --git a/web/e.cash/styles/pages/core-tech.js b/web/e.cash/styles/pages/core-tech.js
--- a/web/e.cash/styles/pages/core-tech.js
+++ b/web/e.cash/styles/pages/core-tech.js
@@ -2,8 +2,12 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const TextImageBlockCtn = styled.div`
+export const TextImageBlockCtn = styled(motion.div).attrs(() =>
+    getAnimationSettings(),
+)`
     position: relative;
     display: flex;
     width: 100%;
diff --git a/web/e.cash/styles/pages/ecash-brand.js b/web/e.cash/styles/pages/ecash-brand.js
--- a/web/e.cash/styles/pages/ecash-brand.js
+++ b/web/e.cash/styles/pages/ecash-brand.js
@@ -3,8 +3,10 @@
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
 import Link from 'next/link';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const TextBlock = styled.div`
+export const TextBlock = styled(motion.div).attrs(() => getAnimationSettings())`
     width: 100%;
     margin-bottom: 150px;
     position: relative;
diff --git a/web/e.cash/styles/pages/faq.js b/web/e.cash/styles/pages/faq.js
--- a/web/e.cash/styles/pages/faq.js
+++ b/web/e.cash/styles/pages/faq.js
@@ -2,8 +2,12 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const QuestionBlock = styled.div`
+export const QuestionBlock = styled(motion.div).attrs(() =>
+    getAnimationSettings(),
+)`
     width: 100%;
     margin-bottom: 100px;
     position: relative;
diff --git a/web/e.cash/styles/pages/get-ecash.js b/web/e.cash/styles/pages/get-ecash.js
--- a/web/e.cash/styles/pages/get-ecash.js
+++ b/web/e.cash/styles/pages/get-ecash.js
@@ -3,8 +3,12 @@
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
 import Link from 'next/link';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const DescriptionBox = styled.div`
+export const DescriptionBox = styled(motion.div).attrs(() =>
+    getAnimationSettings(),
+)`
     width: 100%;
     margin-bottom: -100px;
     display: flex;
@@ -35,7 +39,7 @@
     }
 `;
 
-export const TitleBox = styled.div`
+export const TitleBox = styled(motion.div).attrs(() => getAnimationSettings())`
     width: 100%;
     border-left: 3px solid ${props => props.theme.colors.primary};
     background-image: linear-gradient(
@@ -73,7 +77,7 @@
     }
 `;
 
-export const Tile = styled(Link)`
+export const Tile = styled(motion(Link)).attrs(() => getAnimationSettings())`
     position: relative;
     padding: 50px;
     border-right: 1px solid ${props => props.theme.colors.gridlines};
@@ -107,7 +111,9 @@
     }
 `;
 
-export const MiningSectionCtn = styled.div`
+export const MiningSectionCtn = styled(motion.div).attrs(() =>
+    getAnimationSettings(),
+)`
     width: 100%;
     display: flex;
     align-items: center;
diff --git a/web/e.cash/styles/pages/homepage.js b/web/e.cash/styles/pages/homepage.js
--- a/web/e.cash/styles/pages/homepage.js
+++ b/web/e.cash/styles/pages/homepage.js
@@ -114,6 +114,7 @@
     bottom: 0;
     margin: auto;
     width: 80%;
+    max-width: 800px;
     height: 100%;
     z-index: -1;
     animation: bounce 6s infinite;
diff --git a/web/e.cash/styles/pages/wallets.js b/web/e.cash/styles/pages/wallets.js
--- a/web/e.cash/styles/pages/wallets.js
+++ b/web/e.cash/styles/pages/wallets.js
@@ -2,6 +2,8 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
 export const FlexCtn = styled.div`
     display: flex;
@@ -70,12 +72,14 @@
     }
 `;
 
-export const WalletCardCtn = styled.div`
+export const WalletCardCtn = styled(motion.div).attrs(() =>
+    getAnimationSettings(),
+)`
     width: 100%;
     margin-bottom: 50px;
     display: inline-block;
     padding: 30px 0;
-    transition: all ease-in-out 200ms;
+    transition: background-color ease-in-out 200ms;
     border-radius: 5px;
 
     ${props => props.theme.breakpoint.medium} {
@@ -93,7 +97,7 @@
     }
 `;
 
-export const TitleBox = styled.div`
+export const TitleBox = styled(motion.div).attrs(() => getAnimationSettings())`
     width: 100%;
     border-left: 3px solid ${props => props.theme.colors.primary};
     background-image: linear-gradient(
diff --git a/web/e.cash/styles/pages/wealth-redefined.js b/web/e.cash/styles/pages/wealth-redefined.js
--- a/web/e.cash/styles/pages/wealth-redefined.js
+++ b/web/e.cash/styles/pages/wealth-redefined.js
@@ -2,8 +2,10 @@
 // Distributed under the MIT software license, see the accompanying
 // file COPYING or http://www.opensource.org/licenses/mit-license.php.
 import styled from 'styled-components';
+import { motion } from 'framer-motion';
+import { getAnimationSettings } from '/styles/framer-motion';
 
-export const TextBlock = styled.div`
+export const TextBlock = styled(motion.div).attrs(() => getAnimationSettings())`
     width: 100%;
     margin-bottom: 150px;
     position: relative;