diff --git a/src/components/HomepageFeatures/index.js b/src/components/HomepageFeatures/index.js
index acc7621..b8e7d9f 100644
--- a/src/components/HomepageFeatures/index.js
+++ b/src/components/HomepageFeatures/index.js
@@ -1,50 +1,66 @@
 import clsx from 'clsx';
 import Heading from '@theme/Heading';
 import styles from './styles.module.css';
+import Link from '@docusaurus/Link';
+import useBaseUrl from '@docusaurus/useBaseUrl';
 
 const FeatureList = [
   {
-    title: 'Easy to Use',
-    Svg: require('@site/static/img/undraw_docusaurus_mountain.svg').default,
+    title: 'European Union',
+    image: '/img/Flag_of_Europe.svg',
+    redirectUrl : 'docs/europe/introduction-to-eu-privacy',
     description: (
       <>
-        Docusaurus was designed from the ground up to be easily installed and
-        used to get your website up and running quickly.
+        Introduction to privacy regulations in European Union.
       </>
     ),
   },
   {
-    title: 'Focus on What Matters',
-    Svg: require('@site/static/img/undraw_docusaurus_tree.svg').default,
+    title: 'United States of America',
+    image: '/img/Flag_of_the_United_States.svg',
+    redirectUrl : 'docs/usa/introduction-to-privacy-in-usa',
     description: (
       <>
-        Docusaurus lets you focus on your docs, and we&apos;ll do the chores. Go
-        ahead and move your docs into the <code>docs</code> directory.
+        Introduction to privacy regulations in United States of America.
       </>
     ),
   },
   {
-    title: 'Powered by React',
-    Svg: require('@site/static/img/undraw_docusaurus_react.svg').default,
+    title: 'United Kingdom',
+    image: '/img/Flag_of_the_United_Kingdom.svg',
+    redirectUrl : 'docs/uk/introduction-to-uk-privacy',
     description: (
       <>
-        Extend or customize your website layout by reusing React. Docusaurus can
-        be extended while reusing the same header and footer.
+        Introduction to privacy regulations in United Kingdom.
+      </>
+    ),
+  },
+  {
+    title: 'Commonwealth of Australia',
+    image: '/img/Flag_of_Australia.svg',
+    redirectUrl : 'docs/australia/introduction-to-privacy-in-australia',
+    description: (
+      <>
+        Introduction to privacy regulations in Commonwealth of Australia.
       </>
     ),
   },
 ];
 
-function Feature({Svg, title, description}) {
+function Feature({title, description, redirectUrl, image}) {
   return (
-    <div className={clsx('col col--4')}>
-      <div className="text--center">
-        <Svg className={styles.featureSvg} role="img" />
-      </div>
-      <div className="text--center padding-horiz--md">
-        <Heading as="h3">{title}</Heading>
-        <p>{description}</p>
-      </div>
+    <div className={clsx('col col--3')}>
+      <Link to={useBaseUrl(redirectUrl)} className="text--no-decoration">
+        <div className={clsx('text--primary', styles.card)}>
+          <div className="text--center">
+            <img src={useBaseUrl(image)} width="160" height="100" alt={title} />
+          </div>
+          <div className="text--center padding-horiz--md">
+            <Heading as="h3">{title}</Heading>
+            <p>{description}</p>
+          </div>
+        </div>
+      </Link>
     </div>
   );
 }
@@ -52,7 +68,7 @@ function Feature({Svg, title, description}) {
 export default function HomepageFeatures() {
   return (
     <section className={styles.features}>
-      <div className="container">
+      <div className="container py-100">
         <div className="row">
           {FeatureList.map((props, idx) => (
             <Feature key={idx} {...props} />
diff --git a/src/components/HomepageFeatures/styles.module.css b/src/components/HomepageFeatures/styles.module.css
index b248eb2..3e5841f 100644
--- a/src/components/HomepageFeatures/styles.module.css
+++ b/src/components/HomepageFeatures/styles.module.css
@@ -9,3 +9,14 @@
   height: 200px;
   width: 200px;
 }
+
+.card {
+  background-color: #E6E8EC;
+  padding: 25px 15px;
+  min-height: 300px;
+  margin-bottom: 20px;
+}
+
+.features:hover {
+  text-decoration: none;
+}
diff --git a/src/css/custom.css b/src/css/custom.css
index 0c9fdae..43ba266 100644
--- a/src/css/custom.css
+++ b/src/css/custom.css
@@ -123,3 +123,7 @@
   font-size: 18px;
   font-weight: 600;
 }
+
+.py-100 {
+  padding: 100px 0 !important;
+}
diff --git a/static/img/Flag_of_Australia.svg b/static/img/Flag_of_Australia.svg
new file mode 100644
index 0000000..3d1060d
--- /dev/null
+++ b/static/img/Flag_of_Australia.svg
@@ -0,0 +1,24 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1280" height="640" viewBox="0 0 10080 5040">
+<defs>
+<clipPath id="c1"><path d="M0,0H6V3H0z"/></clipPath>
+<clipPath id="c2"><path d="M0,0V1.5H6V3H6zM6,0H3V3H0V3z"/></clipPath>
+<path id="Star7" d="M0,-360 69.421398,-144.155019 281.459334,-224.456329 155.988466,-35.603349 350.974048,80.107536 125.093037,99.758368 156.198146,324.348792 0,160 -156.198146,324.348792 -125.093037,99.758368 -350.974048,80.107536 -155.988466,-35.603349 -281.459334,-224.456329 -69.421398,-144.155019z"/>
+<path id="Star5" d="M0,-210 54.859957,-75.508253 199.721868,-64.893569 88.765275,28.841586 123.434903,169.893569 0,93.333333 -123.434903,169.893569 -88.765275,28.841586 -199.721868,-64.893569 -54.859957,-75.508253z"/>
+</defs>
+<g transform="scale(840)">
+<rect width="12" height="6" fill="#012169"/>
+<path d="M0,0 6,3M6,0 0,3" stroke="#fff" stroke-width="0.6" clip-path="url(#c1)"/>
+<path d="M0,0 6,3M6,0 0,3" stroke="#e4002b" stroke-width="0.4" clip-path="url(#c2)"/>
+<path d="M3,0V3M0,1.5H6" stroke="#fff"/>
+<path d="M3,0V3M0,1.5H6" stroke="#e4002b" stroke-width="0.6"/>
+</g>
+<g fill="#fff">
+<use id="Comwlth" xlink:href="#Star7" transform="translate(2520, 3780) scale(2.1)"/>
+<use id="αCrucis" xlink:href="#Star7" x="7560" y="4200"/>
+<use id="βCrucis" xlink:href="#Star7" x="6300" y="2205"/>
+<use id="γCrucis" xlink:href="#Star7" x="7560" y="840"/>
+<use id="δCrucis" xlink:href="#Star7" x="8680" y="1869"/>
+<use id="εCrucis" xlink:href="#Star5" x="8064" y="2730"/>
+</g>
+</svg>
\ No newline at end of file
diff --git a/static/img/Flag_of_Europe.svg b/static/img/Flag_of_Europe.svg
new file mode 100644
index 0000000..0f22db6
--- /dev/null
+++ b/static/img/Flag_of_Europe.svg
@@ -0,0 +1,4 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" width="810" height="540"><desc>European flag</desc>
+<defs><g id="s"><g id="c"><path id="t" d="M0,0v1h0.5z" transform="translate(0,-1)rotate(18)"/><use xlink:href="#t" transform="scale(-1,1)"/></g><g id="a"><use xlink:href="#c" transform="rotate(72)"/><use xlink:href="#c" transform="rotate(144)"/></g><use xlink:href="#a" transform="scale(-1,1)"/></g></defs>
+<rect fill="#039" width="810" height="540"/><g fill="#fc0" transform="scale(30)translate(13.5,9)"><use xlink:href="#s" y="-6"/><use xlink:href="#s" y="6"/><g id="l"><use xlink:href="#s" x="-6"/><use xlink:href="#s" transform="rotate(150)translate(0,6)rotate(66)"/><use xlink:href="#s" transform="rotate(120)translate(0,6)rotate(24)"/><use xlink:href="#s" transform="rotate(60)translate(0,6)rotate(12)"/><use xlink:href="#s" transform="rotate(30)translate(0,6)rotate(42)"/></g><use xlink:href="#l" transform="scale(-1,1)"/></g>
+</svg>
\ No newline at end of file
diff --git a/static/img/Flag_of_the_United_Kingdom.svg b/static/img/Flag_of_the_United_Kingdom.svg
new file mode 100644
index 0000000..56487b0
--- /dev/null
+++ b/static/img/Flag_of_the_United_Kingdom.svg
@@ -0,0 +1,16 @@
+<?xml version="1.0"?>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 60 30" width="1200" height="600">
+<clipPath id="s">
+	<path d="M0,0 v30 h60 v-30 z"/>
+</clipPath>
+<clipPath id="t">
+	<path d="M30,15 h30 v15 z v15 h-30 z h-30 v-15 z v-15 h30 z"/>
+</clipPath>
+<g clip-path="url(#s)">
+	<path d="M0,0 v30 h60 v-30 z" fill="#012169"/>
+	<path d="M0,0 L60,30 M60,0 L0,30" stroke="#fff" stroke-width="6"/>
+	<path d="M0,0 L60,30 M60,0 L0,30" clip-path="url(#t)" stroke="#C8102E" stroke-width="4"/>
+	<path d="M30,0 v30 M0,15 h60" stroke="#fff" stroke-width="10"/>
+	<path d="M30,0 v30 M0,15 h60" stroke="#C8102E" stroke-width="6"/>
+</g>
+</svg>
diff --git a/static/img/Flag_of_the_United_States.svg b/static/img/Flag_of_the_United_States.svg
new file mode 100644
index 0000000..85c398e
--- /dev/null
+++ b/static/img/Flag_of_the_United_States.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1235" height="650" viewBox="0 0 7410 3900"><path d="M0,0h7410v3900H0" fill="#b31942"/><path d="M0,450H7410m0,600H0m0,600H7410m0,600H0m0,600H7410m0,600H0" stroke="#FFF" stroke-width="300"/><path d="M0,0h2964v2100H0" fill="#0a3161"/><g fill="#FFF"><g id="s18"><g id="s9"><g id="s5"><g id="s4"><path id="s" d="M247,90 317.534230,307.082039 132.873218,172.917961H361.126782L176.465770,307.082039z"/><use xlink:href="#s" y="420"/><use xlink:href="#s" y="840"/><use xlink:href="#s" y="1260"/></g><use xlink:href="#s" y="1680"/></g><use xlink:href="#s4" x="247" y="210"/></g><use xlink:href="#s9" x="494"/></g><use xlink:href="#s18" x="988"/><use xlink:href="#s9" x="1976"/><use xlink:href="#s5" x="2470"/></g></svg>
\ No newline at end of file