diff --git a/package.json b/package.json
index 142486f..ffd540b 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "prop-types": "^15.7.2",
     "query-string": "^6.9.0",
     "react": "^16.12.0",
+    "react-countup": "^4.3.3",
     "react-dom": "^16.12.0",
     "react-helmet": "^5.2.1",
     "react-paginate": "^6.3.2",
diff --git a/src/components/layout.js b/src/components/layout.js
index f83e167..838beac 100644
--- a/src/components/layout.js
+++ b/src/components/layout.js
@@ -19,15 +19,11 @@ export const Navbar = props => {
   const content = [
     {
       li: "Our Databases",
-      link: "/",
-    },
-    {
-      li: "About",
-      link: "/",
+      link: "/databases",
     },
     {
       li: "Contact",
-      link: "/",
+      externalLink: "https://platform.x5gon.org/team",
     },
   ]
 
@@ -75,9 +71,15 @@ export const Navbar = props => {
           {content.map((li, index) => {
             return (
               <li className="nav-item active ml-lg-3" key={index}>
-                <Link className="nav-link mx-md-2 x-xs-1" to={li.link}>
-                  {li.li}
-                </Link>
+                {li.link ? (
+                  <Link className="nav-link mx-md-2 x-xs-1" to={li.link}>
+                    {li.li}
+                  </Link>
+                ) : (
+                  <a className="nav-link mx-md-2 x-xs-1" href={li.externalLink}>
+                    {li.li}
+                  </a>
+                )}
               </li>
             )
           })}
@@ -86,186 +88,3 @@ export const Navbar = props => {
     </nav>
   )
 }
-
-export const Footer = () => {
-  const contents = {
-    "GO-TO": [
-      {
-        page: "Products",
-        link: "/#products",
-      },
-      {
-        page: "Join",
-        link: "/join",
-      },
-      {
-        page: "Policy",
-        link: "/policy",
-      },
-      {
-        page: "Team",
-        link: "/team",
-      },
-    ],
-    PRODUCTS: [
-      {
-        page: "recommend",
-        link: "/products/recommend",
-      },
-      {
-        page: "analytics",
-        link: "/products/analytics",
-      },
-      {
-        page: "discovery",
-        link: "/products/discovery",
-      },
-      {
-        page: "translate",
-        link: "/products/translate",
-      },
-      {
-        page: "connect",
-        link: "/products/connect",
-      },
-      {
-        page: "feed",
-        link: "/products/feed",
-      },
-    ],
-    CONTACT: [
-      {
-        page: "General Enquiries",
-        link: "mailto:info@x5gon.org",
-      },
-      {
-        page: "Partnering Projects",
-        link: "mailto:partnering@x5gon.org",
-      },
-      {
-        page: "Project Coordination",
-        link: "mailto:admin@x5gon.org",
-      },
-      {
-        page: "Press Enquiries",
-        link: "mailto:press@x5gon.org",
-      },
-    ],
-    SUPPORT: [
-      {
-        page: "Github Repository",
-        externalLink: "https://github.com/JozefStefanInstitute/x5gon",
-      },
-      /* {
-				page: 'Cookies Subpage',
-				link: 'Cookies Subpage'
-			}, */
-      {
-        page: "Documentation",
-        externalLink: "/files/x5gon-docs.pdf",
-      },
-      {
-        page: "Privacy & policy",
-        link: "/privacy",
-      },
-    ],
-  }
-  const UL = name => {
-    name = name.name
-    const style = "d-block footer-li-text"
-    return (
-      <div className={"col-6 col-md-3 pl-0 pb-5"}>
-        <p
-          style={{
-            fontSize: "12px",
-            letterSpacing: "3.4px",
-            lineHeight: "24px",
-            fontWeight: "700",
-          }}
-        >
-          {name}
-        </p>
-        {contents[name].map((object, index) => {
-          if (object.externalLink) {
-            return (
-              <a
-                style={{ textTransform: "capitalize" }}
-                href={object.externalLink}
-                key={index}
-                className={style}
-                target="blank"
-              >
-                {object.page}
-              </a>
-            )
-          } else if (name !== "CONTACT") {
-            return (
-              <Link
-                style={{ textTransform: "capitalize" }}
-                to={object.link}
-                key={index}
-                className={style}
-              >
-                {object.page}
-              </Link>
-            )
-          } else {
-            return (
-              <a
-                style={{ textTransform: "capitalize" }}
-                href={object.link}
-                key={index}
-                className={style}
-              >
-                {object.page}
-              </a>
-            )
-          }
-        })}
-      </div>
-    )
-  }
-  return (
-    <div className="foot bg-black text-white p-md-5">
-      <div className="maxer mx-auto row py-5 px-4">
-        <div className="col-md-3 col-lg-4 col-12 pl-0 pb-4 pb-md-0 px-1 mt-5 mt-md-0">
-          <Link to="/">
-            <img
-              src={"/imgs/logo/x5gon_logo_dark.svg"}
-              height="22px"
-              alt="logo"
-            ></img>
-          </Link>
-        </div>
-        <div className="col-md-9 col-lg-8 col-12 mt-4 mt-md-0 pl-3 ml-1 pl-md-0 ml-md-0">
-          <div className="row border-bottom flex-row-reverse flex-md-row">
-            <UL name="GO-TO"></UL>
-            <UL name="PRODUCTS"></UL>
-            <UL name="CONTACT"></UL>
-            <UL name="SUPPORT"></UL>
-          </div>
-          <div className="row mt-5">
-            <div className="col-2 m-0 pl-0">
-              <img
-                alt="flag"
-                src="/imgs/euflag.png"
-                width="100%"
-                className="m-0"
-              />
-            </div>
-            <div className="col-9 m-0 col-xl-7">
-              <p
-                className="my-auto m-0 p-0 footer-li-text"
-                style={{ lineHeight: "20px" }}
-              >
-                This project has received funding from the European Union’s
-                Horizon new policy 2020 research and innovation programme under
-                grant agreement No 761758.
-              </p>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  )
-}
diff --git a/src/pages/databases.js b/src/pages/databases.js
index 8095e8a..4402f0d 100644
--- a/src/pages/databases.js
+++ b/src/pages/databases.js
@@ -4,45 +4,109 @@ import { Layout, Navbar } from "../components/layout"
 import list from "../images/icons/list.svg"
 import nantes from "../images/nantes.png"
 
+import CountUp from "react-countup"
+
 const Provider = provider => (
-  <div className="row p-5 mb-3 bg-white">
-    <div className="col-4">
-      <img src={nantes} alt="list" height={64} className="my-auto" />
-    </div>
+  <div className="row p-3 py-2 mb-3 bg-white mx-3">
     <div className="col">
-      <p className="p2 mb-0">{provider.provider}</p>
-      <p className="mb-0">1260 Materials</p>
+      <a href={provider.provider.link}>
+        <p className="p2 mb-0">{provider.provider.name}</p>
+      </a>
+      <p className="mb-0">{provider.provider.number_materials} Materials</p>
     </div>
-    <div className="col-1">
-      <img src={list} alt="list" height={32} className="my-auto" />
+    <div className="col-2 col-sm-1">
+      <img src={list} alt="list" height={32} className="mt-3" />
     </div>
   </div>
 )
 
 const providers = [
-  "Université de Nantes",
-  "nantes",
-  "farewell",
-  "data",
-  "through",
-  "api",
+  {
+    name: "Videolectures.NET",
+    link: "http://videolectures.net/",
+    number_materials: 1260,
+  },
+  {
+    name: "UNIVERSITAT POLITÈCNICA DE VALÈNCIA",
+    link: "https://media.upv.es",
+    number_materials: 1100,
+  },
 ]
 
+const Stats = () => {
+  const stats = [
+    {
+      name: "OER Materials",
+      value: 118,
+      suffix: "k",
+    },
+    {
+      name: "User Activities",
+      value: 10.9,
+      suffix: "M",
+    },
+    {
+      name: "Unique Users",
+      value: 2.25,
+      suffix: "M",
+    },
+  ]
+  return (
+    <div className="row text-center p-64">
+      {stats.map((stat, index) => {
+        return (
+          <div className="col-sm-4 my-3 my-sm-0">
+            <div className="stats">
+              <h4 className="">
+                <CountUp
+                  end={stat.value}
+                  suffix={stat.suffix}
+                  decimals={index}
+                />
+              </h4>
+              <p className="stats__label">
+                <span>{stat.name}</span>
+              </p>
+            </div>
+          </div>
+        )
+      })}
+    </div>
+  )
+}
+
 const repos = () => (
   <Layout>
     <Navbar light={true} />
     <div className="bg-light-gray p-128">
-      <div className="maxer mx-auto text-light-dark">
-        <p className="text-ecosystem pb-0 mb-0 pl-1">CONNECTED DATABASES</p>
-        <h2 className="py-4 text-black">Connected Databases</h2>
-        <h4 className="pl-1 maxer-800">
-          Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras sit amet
-          pretium ipsum.
-        </h4>
-        <div className="p-64">
-          {providers.map(item => (
-            <Provider provider={item} key={item} />
-          ))}
+      <div className="maxer-880 mx-auto text-purple px-4 px-md-5 px-lg-0">
+        <div className="col">
+          <h2 className="">Database Statistics</h2>
+          <Stats />
+          <p className="information">
+            The basic X5GON database statistics - showing the number of OER
+            materials, user activity data (visits) and number of unique users
+            that accessed the registered OER repositories in the X5GON network.
+          </p>
+        </div>
+
+        <div className="maxer mx-auto text-light-dark p-64">
+          <h4 className="pl-1 maxer-800">Connected providers</h4>
+          <div className="mt-5">
+            {providers.map(item => (
+              <Provider provider={item} key={item} />
+            ))}
+          </div>
+          <p className="mt-5">
+            Check statistics about your database{" "}
+            <a
+              className="text-green"
+              href="https://platform.x5gon.org/oer_provider/"
+            >
+              here
+            </a>
+            .
+          </p>
         </div>
       </div>
     </div>
diff --git a/src/pages/index.js b/src/pages/index.js
index b24a947..5c40b07 100644
--- a/src/pages/index.js
+++ b/src/pages/index.js
@@ -86,9 +86,45 @@ const IndexPage = () => {
     /*eslint-enable */
   }
 
+  const About = () => {
+    return (
+      <div className="maxer-880 mx-auto p-64 text-purple px-5">
+        <p className="search-description">
+          The material search enables anyone to search through the indexed OER
+          materials that are connected in our network via our Connect service.
+          The material search functionality is cross-lingual and functions as a
+          Recommendation engine.
+        </p>
+        <h4 className="mb-4">Technical description</h4>
+        <p className="search-description pr-5">
+          The materials shown currently are text, video and audio. They are
+          enriched them through a process called Wikification and stored into a
+          database that contains data about user activities on the OER
+          repositories that integrated the Connect Service, a library developed
+          for acquiring behavior data.{" "}
+        </p>
+        <p className="search-description pr-5">
+          The platform consists of four major components – the database,
+          ingesting and processing pipeline, services and platform API – each
+          employed to perform a separate task. The platform is able to process
+          three types of OER materials: text, video and audio. In addition, it
+          enriches them through a process called Wikification. The processed
+          materials are stored into the database. The database also contains
+          data about user activities on the OER repositories that integrated the
+          X5GON Connect Service, a library developed for acquiring behaviour
+          data. The database is accessed by the different services developed
+          within the project – the recommender engine, the quality assurance
+          tool and the learning analytics tool – which can be accessed through
+          the platform API.
+        </p>
+      </div>
+    )
+  }
+
   return (
     <Layout>
       <Header />
+      <About />
     </Layout>
   )
 }