diff --git a/src/AppV2.js b/src/AppV2.js
index 231989d4..50ac8b39 100644
--- a/src/AppV2.js
+++ b/src/AppV2.js
@@ -18,6 +18,7 @@ const Dashboard = lazy(() => import('v2/components/Dashboard'));
 const Validators = lazy(() => import('v2/components/Validators'));
 const ValidatorsAll = lazy(() => import('v2/components/Validators/All'));
 const ValidatorDetail = lazy(() => import('v2/components/Validators/Detail'));
+const TourDeSol = lazy(() => import('v2/components/TourDeSol'));
 
 const useStyles = makeStyles(theme => ({
   root: {
@@ -69,6 +70,7 @@ const App = () => {
                 path="/rc/validators/:id"
                 component={ValidatorDetail}
               />
+              <Route exact path="/rc/tour-de-sol" component={TourDeSol} />
             </Switch>
           </Suspense>
           <Footer />
diff --git a/src/v2/assets/icons/arrow-right-dark.png b/src/v2/assets/icons/arrow-right-dark.png
new file mode 100644
index 00000000..6fb3710b
Binary files /dev/null and b/src/v2/assets/icons/arrow-right-dark.png differ
diff --git a/src/v2/assets/icons/bicycle.svg b/src/v2/assets/icons/bicycle.svg
new file mode 100644
index 00000000..772afbea
--- /dev/null
+++ b/src/v2/assets/icons/bicycle.svg
@@ -0,0 +1,3 @@
+<svg width="44" height="25" viewBox="0 0 44 25" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M35.0704 7.23443C33.9138 7.23443 32.8034 7.46337 31.7855 7.87546L30.5363 5.26557V0.915751H35.4406C36.1346 0.915751 36.6435 1.4652 36.6435 2.10623C36.6435 2.79304 36.0883 3.2967 35.4406 3.2967H34.8391C34.5615 3.2967 34.3302 3.52564 34.3302 3.80037C34.3302 4.07509 34.5615 4.30403 34.8391 4.30403H35.4406C36.6435 4.30403 37.6151 3.34249 37.6151 2.15201C37.6151 0.961539 36.6435 0 35.4406 0H30.0736C29.796 0 29.5647 0.228938 29.5647 0.503663V4.99084H14.8517L13.4175 2.88461H16.3785C16.6562 2.88461 16.8875 2.65568 16.8875 2.38095C16.8875 2.10623 16.6562 1.87729 16.3785 1.87729H10.2713C9.99369 1.87729 9.76236 2.10623 9.76236 2.38095C9.76236 2.65568 9.99369 2.88461 10.2713 2.88461H12.2145L13.9727 5.44872L12.5846 8.1044C11.4742 7.60073 10.225 7.32601 8.92955 7.32601C4.02524 7.32601 0 11.2637 0 16.163C0 21.0165 3.97897 25 8.92955 25C13.6951 25 17.5815 21.2912 17.8128 16.6667H19.9411C20.0336 17.033 20.2187 17.3535 20.4963 17.6282C20.9127 18.0403 21.4217 18.2234 21.9769 18.2234C22.5321 18.2234 23.041 17.9945 23.4574 17.6282C24.1977 16.8956 24.244 15.7051 23.5962 14.881L29.9348 6.41026L30.8601 8.37912C28.0379 9.84432 26.1409 12.8205 26.1409 16.163C26.1409 21.0165 30.1199 25 35.0704 25C39.9748 25 44 21.0623 44 16.163C44 11.2179 40.021 7.23443 35.0704 7.23443ZM29.102 5.86081L22.8559 14.1941C22.5783 14.0568 22.3007 14.011 22.0231 14.011C21.7455 14.011 21.4679 14.0568 21.1903 14.1941L15.4995 5.86081H29.102ZM14.6204 6.27289L20.4501 14.7894C20.2187 15.0183 20.0799 15.3388 20.0336 15.6136H17.8591C17.674 12.5916 15.9621 9.9359 13.4637 8.4707L14.6204 6.27289ZM16.8875 15.6136H9.76236L13.0011 9.34066C15.2219 10.6227 16.7024 12.9121 16.8875 15.6136ZM8.97581 23.9469C4.58044 23.9469 1.01788 20.4212 1.01788 16.0714C1.01788 11.7216 4.58044 8.19597 8.97581 8.19597C10.1325 8.19597 11.1966 8.42491 12.1682 8.88278L8.55941 15.8425C8.46688 15.9799 8.46688 16.163 8.55941 16.3004C8.65195 16.4377 8.79075 16.5293 8.97581 16.5293H16.8875C16.6562 20.6502 13.1861 23.9469 8.97581 23.9469ZM22.8097 16.8498C22.3933 17.2619 21.653 17.2619 21.2366 16.8498C20.8202 16.4377 20.8202 15.7051 21.2366 15.293C21.4679 15.0641 21.7455 14.9725 22.0231 14.9725C22.3007 14.9725 22.5783 15.0641 22.8097 15.293C23.2261 15.7051 23.2261 16.4377 22.8097 16.8498ZM35.0704 23.9469C30.6751 23.9469 27.1125 20.4212 27.1125 16.0714C27.1125 13.0952 28.8244 10.4853 31.2766 9.15751L34.6078 16.2546C34.7003 16.4377 34.8854 16.5293 35.0704 16.5293C35.1167 16.5293 35.2093 16.5293 35.2555 16.4835C35.4869 16.3919 35.6257 16.0714 35.4869 15.8425L32.2019 8.74542C33.081 8.37912 34.0526 8.19597 35.0704 8.19597C39.4658 8.19597 43.0284 11.7216 43.0284 16.0714C43.0284 20.4212 39.4658 23.9469 35.0704 23.9469Z" fill="#00FFAD"/>
+</svg>
diff --git a/src/v2/components/Dashboard/NetworkOverview/index.jsx b/src/v2/components/Dashboard/NetworkOverview/index.jsx
index 6aeb8acd..625c555f 100644
--- a/src/v2/components/Dashboard/NetworkOverview/index.jsx
+++ b/src/v2/components/Dashboard/NetworkOverview/index.jsx
@@ -37,7 +37,7 @@ const NetworkOverview = () => {
   return (
     <Container>
       <div className={classes.root}>
-        <SectionHeader>Network Overview</SectionHeader>
+        <SectionHeader title="Network Overview" />
         <Grid container spacing={2} className={classes.row}>
           <Grid item xs={6}>
             <TPS />
diff --git a/src/v2/components/Dashboard/ViewAll/index.jsx b/src/v2/components/Dashboard/ViewAll/index.jsx
index 35159e5a..bf425efe 100644
--- a/src/v2/components/Dashboard/ViewAll/index.jsx
+++ b/src/v2/components/Dashboard/ViewAll/index.jsx
@@ -11,7 +11,7 @@ const ViewAll = () => {
   return (
     <Container>
       <div className={classes.root}>
-        <SectionHeader>View All</SectionHeader>
+        <SectionHeader title="View All" />
         <Grid container spacing={8}>
           <Grid item xs={4}>
             <Button variant="contained" size="large" fullWidth color="primary">
diff --git a/src/v2/components/HelpLink/styles.js b/src/v2/components/HelpLink/styles.js
index b8e9348d..ab07fe58 100644
--- a/src/v2/components/HelpLink/styles.js
+++ b/src/v2/components/HelpLink/styles.js
@@ -13,6 +13,7 @@ export default makeStyles(theme => ({
     padding: '0 5px',
     color: getColor('greenDark')(theme),
     transition: '.15s ease-in-out',
+    marginLeft: 15,
     '&:hover': {
       color: getColor('main')(theme),
       borderColor: getColor('main')(theme),
diff --git a/src/v2/components/TourDeSol/Cards/index.jsx b/src/v2/components/TourDeSol/Cards/index.jsx
new file mode 100644
index 00000000..72461d6f
--- /dev/null
+++ b/src/v2/components/TourDeSol/Cards/index.jsx
@@ -0,0 +1,78 @@
+// @flow
+import {map} from 'lodash/fp';
+import React from 'react';
+import {observer} from 'mobx-react-lite';
+import NodesStore from 'v2/stores/nodes';
+import Card from 'v2/components/UI/StatCard';
+
+import useStyles from './styles';
+
+const Cards = () => {
+  const classes = useStyles();
+  const {cluster} = NodesStore;
+  const {nodes} = cluster;
+  const cards = [
+    {
+      title: 'Stage Duration Blocks',
+      value: 'TODO',
+      changes: '',
+      period: 'since yesterday',
+    },
+    {
+      title: 'Days Left In Stage',
+      value: 'TODO',
+      changes: '',
+      period: 'since yesterday',
+    },
+    {
+      title: 'Total SOL In Circulation',
+      value: cluster.supply / Math.pow(2, 34).toFixed(2),
+      changes: '',
+      period: 'since yesterday',
+    },
+    {
+      title: 'Total Bonded Tokens',
+      value: 'TODO',
+      changes: '',
+      period: 'since yesterday',
+    },
+    {
+      title: 'Current Network Inflation Rate',
+      value: 'TODO',
+      changes: '',
+      period: 'since yesterday',
+    },
+    {
+      title: '# of Active Validators',
+      value: nodes.length,
+      changes: '',
+      period: 'since yesterday',
+    },
+    {
+      title: '# of Inactive Validators',
+      value: 'TODO',
+      changes: '',
+      period: 'since yesterday',
+    },
+    {
+      title: 'Circulating Supply Staked',
+      value: 'TODO',
+      changes: '',
+      period: 'since yesterday',
+    },
+  ];
+
+  const renderStats = ({
+    title,
+    value,
+    changes = null,
+  }: {
+    title: string,
+    value: string | (() => React$Node),
+    changes?: string,
+  }) => <Card title={title} value={value} changes={changes} />;
+
+  return <div className={classes.cards}>{map(renderStats)(cards)}</div>;
+};
+
+export default observer(Cards);
diff --git a/src/v2/components/TourDeSol/Cards/styles.js b/src/v2/components/TourDeSol/Cards/styles.js
new file mode 100644
index 00000000..3b85acad
--- /dev/null
+++ b/src/v2/components/TourDeSol/Cards/styles.js
@@ -0,0 +1,9 @@
+import {makeStyles} from '@material-ui/core';
+
+export default makeStyles(() => ({
+  cards: {
+    '& div:not(:last-child)': {
+      marginBottom: 20,
+    },
+  },
+}));
diff --git a/src/v2/components/TourDeSol/Ranking/index.jsx b/src/v2/components/TourDeSol/Ranking/index.jsx
new file mode 100644
index 00000000..64db870f
--- /dev/null
+++ b/src/v2/components/TourDeSol/Ranking/index.jsx
@@ -0,0 +1,40 @@
+import React from 'react';
+import {observer} from 'mobx-react-lite';
+import {map} from 'lodash/fp';
+import HelpLink from 'v2/components/HelpLink';
+import NodesStore from 'v2/stores/nodes';
+import {ReactComponent as BicycleIcon} from 'v2/assets/icons/bicycle.svg';
+
+import useStyles from './styles';
+
+const Ranking = () => {
+  const classes = useStyles();
+  const {
+    cluster: {nodes},
+  } = NodesStore;
+
+  const renderNode = node => (
+    <li className={classes.item}>
+      <div className={classes.name}>{node.pubkey}</div>
+      <div className={classes.bar}>
+        <div className={classes.icon}>
+          <BicycleIcon />
+        </div>
+      </div>
+    </li>
+  );
+
+  return (
+    <div className={classes.root}>
+      <div className={classes.header}>
+        Top Validator Ranking
+        <HelpLink text="" term="" />
+      </div>
+      <ul className={classes.list}>{map(renderNode)(nodes)}</ul>
+    </div>
+  );
+};
+
+Ranking.propTypes = {};
+
+export default observer(Ranking);
diff --git a/src/v2/components/TourDeSol/Ranking/styles.js b/src/v2/components/TourDeSol/Ranking/styles.js
new file mode 100644
index 00000000..bbdace86
--- /dev/null
+++ b/src/v2/components/TourDeSol/Ranking/styles.js
@@ -0,0 +1,50 @@
+import {makeStyles} from '@material-ui/core';
+import getColor from 'v2/utils/getColor';
+
+export default makeStyles(theme => ({
+  root: {
+    background: getColor('grey2')(theme),
+    padding: '17px 24px',
+  },
+  list: {
+    padding: 0,
+  },
+  item: {
+    display: 'flex',
+    alignItems: 'center',
+    '&:not(:last-child)': {
+      marginBottom: 17,
+    },
+  },
+  name: {
+    maxWidth: 130,
+    whiteSpace: 'nowrap',
+    overflow: 'hidden',
+    textOverflow: 'ellipsis',
+    color: getColor('main')(theme),
+    marginRight: 20,
+    flexShrink: 0,
+    '&::before': {
+      content: '""',
+      display: 'inline-block',
+      verticalAlign: 'middle',
+      width: 33,
+      height: 33,
+      background: getColor('main')(theme),
+      borderRadius: '50%',
+      marginRight: 22,
+    },
+  },
+  bar: {
+    flex: 1,
+    height: 8,
+    borderRadius: 10,
+    background: getColor('greyW1')(theme),
+    position: 'relative',
+  },
+  icon: {
+    position: 'absolute',
+    top: '50%',
+    transform: 'translateY(-50%)',
+  },
+}));
diff --git a/src/v2/components/TourDeSol/Table/index.jsx b/src/v2/components/TourDeSol/Table/index.jsx
new file mode 100644
index 00000000..12aba84d
--- /dev/null
+++ b/src/v2/components/TourDeSol/Table/index.jsx
@@ -0,0 +1,114 @@
+// @flow
+
+import React from 'react';
+import {
+  Typography,
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableRow,
+  Grid,
+} from '@material-ui/core';
+import cn from 'classnames';
+import useMediaQuery from '@material-ui/core/useMediaQuery';
+import {useTheme} from '@material-ui/core/styles';
+import {observer} from 'mobx-react-lite';
+import {Link} from 'react-router-dom';
+import {map} from 'lodash/fp';
+import NodesStore from 'v2/stores/nodes';
+import HelpLink from '../../HelpLink';
+
+import useStyles from './styles';
+
+const ValidatorsTable = ({separate}: {separate: boolean}) => {
+  const classes = useStyles();
+  const theme = useTheme();
+  const showTable = useMediaQuery(theme.breakpoints.up('md'));
+  const {
+    cluster: {voting = []},
+  } = NodesStore;
+
+  const renderRow = row => {
+    return (
+      <TableRow hover key={row.nodePubkey}>
+        <TableCell>1</TableCell>
+        <TableCell>
+          <Link
+            to={`/rc/validators/${row.nodePubkey}`}
+            className={classes.name}
+          >
+            <span />
+            <div>{row.nodePubkey}</div>
+          </Link>
+        </TableCell>
+        <TableCell>{row.stake}</TableCell>
+        <TableCell>TODO</TableCell>
+      </TableRow>
+    );
+  };
+  const renderCard = card => {
+    return (
+      <div
+        className={cn(classes.card, separate && classes.cardVertical)}
+        key={card.nodePubkey}
+      >
+        <Link to={`/rc/validators/${card.nodePubkey}`} className={classes.name}>
+          <span />
+          <div>{card.nodePubkey}</div>
+        </Link>
+        <Grid container>
+          <Grid item xs={4} zeroMinWidth>
+            <div className={classes.cardTitle}>Stake</div>
+            <div>{card.stake}</div>
+          </Grid>
+          <Grid item xs={4} zeroMinWidth>
+            <div className={classes.cardTitle}>Uptime</div>
+            <div>TODO</div>
+          </Grid>
+        </Grid>
+      </div>
+    );
+  };
+  return (
+    <div className={classes.root}>
+      <div className={classes.header}>
+        <Typography>
+          Active Validators
+          <HelpLink text="" term="" />
+        </Typography>
+        <Typography variant="h5">{voting.length}</Typography>
+        {!separate && (
+          <Link to="/rc/validators/all" className={classes.link}>
+            See all &gt;
+          </Link>
+        )}
+      </div>
+      {showTable ? (
+        <Table>
+          <TableHead className={classes.head}>
+            <TableRow>
+              <TableCell width={100}>Ranking</TableCell>
+              <TableCell width={230}>Name</TableCell>
+              <TableCell>Stake</TableCell>
+              <TableCell width={100}>Uptime</TableCell>
+            </TableRow>
+          </TableHead>
+          <TableBody
+            classes={{
+              root: classes.body,
+            }}
+          >
+            {map(renderRow)(voting)}
+          </TableBody>
+        </Table>
+      ) : (
+        <div className={cn(classes.list, separate && classes.vertical)}>
+          {map(renderCard)(voting)}
+        </div>
+      )}
+    </div>
+  );
+};
+
+export default observer(ValidatorsTable);
diff --git a/src/v2/components/TourDeSol/Table/styles.js b/src/v2/components/TourDeSol/Table/styles.js
new file mode 100644
index 00000000..ea75a43e
--- /dev/null
+++ b/src/v2/components/TourDeSol/Table/styles.js
@@ -0,0 +1,110 @@
+import {makeStyles} from '@material-ui/core';
+import getColor from 'v2/utils/getColor';
+
+export default makeStyles(theme => ({
+  root: {
+    marginTop: 19,
+    background: getColor('grey2')(theme),
+    padding: '25px 44px',
+    [theme.breakpoints.down('sm')]: {
+      padding: 0,
+      paddingBottom: 27,
+      marginBottom: 50,
+    },
+  },
+  head: {
+    border: '1px solid #979797',
+    '& th': {
+      textTransform: 'uppercase',
+      fontSize: 15,
+      letterSpacing: 2,
+      paddingRight: 5,
+      fontWeight: 'bold',
+      borderBottom: 'none',
+    },
+  },
+  body: {
+    '& td': {
+      fontSize: 15,
+      paddingTop: 18,
+      paddingBottom: 18,
+      paddingRight: 5,
+      maxWidth: 0,
+      whiteSpace: 'nowrap',
+      textOverflow: 'ellipsis',
+      overflow: 'hidden',
+    },
+  },
+  header: {
+    display: 'flex',
+    alignItems: 'baseline',
+    flexWrap: 'wrap',
+    '& *:first-child': {
+      marginRight: 35,
+    },
+    marginBottom: 23,
+    [theme.breakpoints.down('sm')]: {
+      padding: '10px 27px 0',
+      marginBottom: 10,
+    },
+  },
+  link: {
+    marginLeft: 'auto',
+    textTransform: 'uppercase',
+    color: getColor('main')(theme),
+    fontSize: 15,
+    textDecoration: 'none',
+  },
+  name: {
+    display: 'flex',
+    alignItems: 'center',
+    color: getColor('main')(theme),
+    textDecoration: 'none',
+    '& span': {
+      width: 33,
+      height: 33,
+      flexShrink: 0,
+      background: getColor('main')(theme),
+      borderRadius: '50%',
+      marginRight: 22,
+    },
+    '& div': {
+      whiteSpace: 'nowrap',
+      textOverflow: 'ellipsis',
+      overflow: 'hidden',
+    },
+    [theme.breakpoints.down('sm')]: {
+      marginBottom: 22,
+    },
+  },
+  list: {
+    display: 'flex',
+    width: '100%',
+    overflowX: 'auto',
+  },
+  vertical: {
+    [theme.breakpoints.down('sm')]: {
+      flexDirection: 'column',
+    },
+  },
+  card: {
+    padding: 17,
+    background: '#505050',
+    marginRight: 12,
+    maxWidth: 326,
+  },
+  cardVertical: {
+    [theme.breakpoints.down('sm')]: {
+      marginBottom: 2,
+      marginRight: 0,
+      maxWidth: '100%',
+    },
+  },
+  cardTitle: {
+    fontSize: 12,
+    textTransform: 'uppercase',
+    color: '#C4C4C4',
+    letterSpacing: 2,
+    fontWight: 'bold',
+  },
+}));
diff --git a/src/v2/components/TourDeSol/index.jsx b/src/v2/components/TourDeSol/index.jsx
new file mode 100644
index 00000000..b3f2f3b0
--- /dev/null
+++ b/src/v2/components/TourDeSol/index.jsx
@@ -0,0 +1,50 @@
+// @flow
+import {Container, Grid} from '@material-ui/core';
+import React from 'react';
+import cn from 'classnames';
+import {observer} from 'mobx-react-lite';
+import SectionHeader from 'v2/components/UI/SectionHeader';
+import iconRight from 'v2/assets/icons/arrow-right-dark.png';
+
+import Ranking from './Ranking';
+import Table from './Table';
+import Cards from './Cards';
+import useStyles from './styles';
+
+const TourDeSol = () => {
+  const classes = useStyles();
+
+  return (
+    <Container>
+      <div className={classes.root}>
+        <SectionHeader title="Tour de sol leaderboard">
+          <ul className={classes.stages}>
+            <li className={cn(classes.stage, classes.stageActive)}>
+              <div>
+                Stage 1 (live!)
+                <img src={iconRight} width={47} height={13} alt="" />
+              </div>
+            </li>
+            <li className={classes.stage}>
+              Stage 1<span>(coming 09/01/19)</span>
+            </li>
+            <li className={classes.stage}>
+              Stage 3<span>(coming 10/01/19)</span>
+            </li>
+          </ul>
+        </SectionHeader>
+        <Grid container spacing={2}>
+          <Grid item xs={12} md={8} lg={9}>
+            <Ranking />
+            <Table />
+          </Grid>
+          <Grid item xs={12} md={4} lg={3}>
+            <Cards />
+          </Grid>
+        </Grid>
+      </div>
+    </Container>
+  );
+};
+
+export default observer(TourDeSol);
diff --git a/src/v2/components/TourDeSol/styles.js b/src/v2/components/TourDeSol/styles.js
new file mode 100644
index 00000000..4d2a3b1b
--- /dev/null
+++ b/src/v2/components/TourDeSol/styles.js
@@ -0,0 +1,48 @@
+import {makeStyles} from '@material-ui/core';
+import getColor from 'v2/utils/getColor';
+
+export default makeStyles(theme => ({
+  root: {
+    padding: '40px 0',
+  },
+  stages: {
+    display: 'flex',
+    width: '100%',
+    padding: 0,
+    marginLeft: 50,
+    maxWidth: 675,
+    [theme.breakpoints.down('sm')]: {
+      maxWidth: '100%',
+      marginLeft: 0,
+    },
+  },
+  stage: {
+    height: 55,
+    display: 'flex',
+    flexDirection: 'column',
+    alignItems: 'center',
+    justifyContent: 'center',
+    color: getColor('white')(theme),
+    padding: '0 15px',
+    fontSize: 15,
+    lineHeight: 1,
+    textTransform: 'uppercase',
+    lettersSpacing: 2.5,
+    border: `1px solid ${getColor('grey3')(theme)}`,
+    flex: 1,
+    fontWeight: 'bold',
+    '&:not(:first-child)': {
+      borderLeft: 'none',
+    },
+    '& span': {
+      fontSize: 10,
+      marginTop: 3,
+      fontWeight: 'normal',
+    },
+  },
+  stageActive: {
+    background: getColor('main')(theme),
+    color: getColor('dark')(theme),
+    borderColor: getColor('main')(theme),
+  },
+}));
diff --git a/src/v2/components/UI/SectionHeader/index.jsx b/src/v2/components/UI/SectionHeader/index.jsx
index fabfd6f6..dd57529d 100644
--- a/src/v2/components/UI/SectionHeader/index.jsx
+++ b/src/v2/components/UI/SectionHeader/index.jsx
@@ -5,14 +5,21 @@ import React from 'react';
 import decor from './assets/decorate.png';
 import useStyles from './styles';
 
-const SectionHeader = ({children}: {children: React$Node}) => {
+const SectionHeader = ({
+  title,
+  children,
+}: {
+  title: string,
+  children?: React$Node,
+}) => {
   const classes = useStyles();
   return (
     <div className={classes.root}>
       <img className={classes.decor} src={decor} width={99} alt="" />
       <Typography className={classes.title} variant="h3">
-        {children}
+        {title}
       </Typography>
+      {children}
     </div>
   );
 };
diff --git a/src/v2/components/UI/SectionHeader/styles.js b/src/v2/components/UI/SectionHeader/styles.js
index a3ca6c3a..1010590a 100644
--- a/src/v2/components/UI/SectionHeader/styles.js
+++ b/src/v2/components/UI/SectionHeader/styles.js
@@ -4,15 +4,23 @@ export default makeStyles(theme => ({
   root: {
     position: 'relative',
     marginBottom: 47,
+    display: 'flex',
+    alignItems: 'center',
+    justifyContent: 'space-between',
+    [theme.breakpoints.down('sm')]: {
+      flexWrap: 'wrap',
+    },
   },
   title: {
     display: 'flex',
     alignItems: 'center',
+    whiteSpace: 'nowrap',
   },
   decor: {
     position: 'absolute',
     left: -120,
-    top: -7,
+    top: '50%',
+    transform: 'translateY(-50%)',
     [theme.breakpoints.down('sm')]: {
       display: 'none',
     },
diff --git a/src/v2/components/UI/StatCard/index.jsx b/src/v2/components/UI/StatCard/index.jsx
index c74fe8f6..1f407905 100644
--- a/src/v2/components/UI/StatCard/index.jsx
+++ b/src/v2/components/UI/StatCard/index.jsx
@@ -1,6 +1,7 @@
 // @flow
 import React from 'react';
 import {Paper, Typography} from '@material-ui/core';
+import HelpLink from 'v2/components/HelpLink';
 
 import useStyles from './styles';
 
@@ -35,6 +36,7 @@ const StatCard = (props: StatCardProps) => {
     <Paper className={classes.root}>
       <Typography align="center" variant="body1">
         {title}
+        <HelpLink text="" term="" />
       </Typography>
       {renderValue()}
       <Typography align="center" variant="h2" className={classes.changes}>
diff --git a/src/v2/components/Validators/Detail/index.jsx b/src/v2/components/Validators/Detail/index.jsx
index 319bb44f..baeea87d 100644
--- a/src/v2/components/Validators/Detail/index.jsx
+++ b/src/v2/components/Validators/Detail/index.jsx
@@ -135,8 +135,7 @@ const ValidatorsDetail = ({match}: {match: Match}) => {
   return (
     <Container>
       <div className={classes.root}>
-        <SectionHeader>
-          Validator Detail
+        <SectionHeader title=" Validator Detail">
           {!isMobile && (
             <div className={classes.validatorName}>
               <span />
diff --git a/src/v2/components/Validators/index.jsx b/src/v2/components/Validators/index.jsx
index fa3fbaa6..9ff89faf 100644
--- a/src/v2/components/Validators/index.jsx
+++ b/src/v2/components/Validators/index.jsx
@@ -70,8 +70,7 @@ const Validators = () => {
   return (
     <Container>
       <div className={classes.root}>
-        <SectionHeader>
-          Validators Overview
+        <SectionHeader title="Validators Overview">
           <div className={classes.becomeBtn}>
             <Button variant="contained" color="primary">
               Become a validator
diff --git a/src/v2/theme.js b/src/v2/theme.js
index b61245ad..8bcc7f99 100644
--- a/src/v2/theme.js
+++ b/src/v2/theme.js
@@ -6,6 +6,7 @@ export default createMuiTheme({
     primary: {
       dark: '#000',
       grey: '#242424',
+      greyW1: '#424242',
       grey2: '#202020',
       grey3: '#979797',
       grey4: '#c4c4c4',