diff --git a/src/components/Home.js b/src/components/Home.js
index 01444af..417addf 100644
--- a/src/components/Home.js
+++ b/src/components/Home.js
@@ -7,10 +7,15 @@ import EnterTheCode from './account/EnterTheCode';
 import Collection from './collection/index';
 import Portal from './portal/index';
 
+import ExampleHome from './example/Home';
+import ExampleBase from './example/Base';
+import ExampleComponent from './example/ExampleComponent';
+import ExampleTwoDeepComponent from './example/ExampleTwoDeepComponent';
+
 export function Routing(props) {
   return (
     <div>
-      <Route exact path={props.match.url} component={Home} />
+      <Route exact path="/" component={Home} />
       <Route path="/PageNotFound" component={PageNotFound} />
       <Route path="/UnderConstruction" component={UnderConstruction} />
       <Route path="/EnterTheCode" component={EnterTheCode} />
diff --git a/src/components/example/Base.js b/src/components/example/Base.js
index 31ee78f..8b1f0b4 100644
--- a/src/components/example/Base.js
+++ b/src/components/example/Base.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import s from '../../styles/app.style';
 
 const propTypes = {
diff --git a/src/components/example/ExampleComponent.js b/src/components/example/ExampleComponent.js
index a31a3b6..a2d167b 100644
--- a/src/components/example/ExampleComponent.js
+++ b/src/components/example/ExampleComponent.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import s from '../../styles/exampleComponent.style';
 
 const propTypes = {
diff --git a/src/components/example/ExampleTwoDeepComponent.js b/src/components/example/ExampleTwoDeepComponent.js
index 312effb..d5809cc 100644
--- a/src/components/example/ExampleTwoDeepComponent.js
+++ b/src/components/example/ExampleTwoDeepComponent.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import s from '../../styles/exampleTwoDeepComponent.style';
 
 const propTypes = {
diff --git a/src/components/example/Home.js b/src/components/example/Home.js
index 00e43f6..f8da322 100644
--- a/src/components/example/Home.js
+++ b/src/components/example/Home.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import s from '../../styles/home.style';
 
 function ExampleHome() {
diff --git a/src/components/portal/Category/Attacks.js b/src/components/portal/Category/Attacks.js
index 9e1fe33..4a34a6a 100644
--- a/src/components/portal/Category/Attacks.js
+++ b/src/components/portal/Category/Attacks.js
@@ -1,9 +1,10 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
-import API from '../../SpreadsheetData';
-import s from '../../../styles/app.style';
+import { Link, Route } from 'react-router-dom';
 import {observer, inject} from 'mobx-react';
+import s from '../../../styles/app.style';
+import API from '../../SpreadsheetData';
+import Attack from '../Single/Attack';
 
 @inject((stores, props, context) => props) @observer
 export default class Attacks extends React.Component {
@@ -52,7 +53,7 @@ export default class Attacks extends React.Component {
         {output}
       </div>
       <div className="right">
-        {this.props.children}
+        <Route path={`${this.props.match.url}/:card`} component={Attack} />
       </div>
     </div>);
   }
diff --git a/src/components/portal/Category/Battlegear.js b/src/components/portal/Category/Battlegear.js
index b73007f..62412d1 100644
--- a/src/components/portal/Category/Battlegear.js
+++ b/src/components/portal/Category/Battlegear.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Category/Creatures.js b/src/components/portal/Category/Creatures.js
index 8b8c2c0..3ed59df 100644
--- a/src/components/portal/Category/Creatures.js
+++ b/src/components/portal/Category/Creatures.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Category/Locations.js b/src/components/portal/Category/Locations.js
index 62b1d01..0a2d5b0 100644
--- a/src/components/portal/Category/Locations.js
+++ b/src/components/portal/Category/Locations.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Category/Mugic.js b/src/components/portal/Category/Mugic.js
index 7db1e4c..182be0b 100644
--- a/src/components/portal/Category/Mugic.js
+++ b/src/components/portal/Category/Mugic.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Category/Tribes.js b/src/components/portal/Category/Tribes.js
index f97ce04..b128ca1 100644
--- a/src/components/portal/Category/Tribes.js
+++ b/src/components/portal/Category/Tribes.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Home.js b/src/components/portal/Home.js
index 1b1b2fa..d936e57 100644
--- a/src/components/portal/Home.js
+++ b/src/components/portal/Home.js
@@ -2,14 +2,29 @@ import React from 'react';
 import { Route } from 'react-router-dom';
 import API from '../SpreadsheetData';
 
+import Attacks from './Category/Attacks';
+import Battlegear from './Category/Battlegear';
+import Creatures from './Category/Creatures';
+import Locations from './Category/Locations';
+import Mugic from './Category/Mugic';
+import Tribes from './Category/Tribes';
+
 export function Routing(props) {
   console.log(props);
   const match = props.match;
 
+  const tribes = API.tribes.map((tribe, i) => (
+    <Route key={i} path={`${match.url}/${tribe}`} component={Tribes} />
+  ));
   return (
     <div>
       <Route exact path={match.url} component={Home} />
-      {/* <Route path={`${match.url}collection`} component={CollectionHome} /> */}
+      <Route path={`${match.url}/Attacks`} component={Attacks} />
+      <Route path={`${match.url}/Battlegear`} component={Battlegear} />
+      <Route path={`${match.url}/Creatures`} component={Creatures} />
+      <Route path={`${match.url}/Locations`} component={Locations} />
+      <Route path={`${match.url}/Mugic`} component={Mugic} />
+      {tribes}
     </div>
   );
 }
diff --git a/src/components/portal/Single/Attack.js b/src/components/portal/Single/Attack.js
index 3c4d1d2..7c99ec8 100644
--- a/src/components/portal/Single/Attack.js
+++ b/src/components/portal/Single/Attack.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Single/Battlegear.js b/src/components/portal/Single/Battlegear.js
index 1c1d0fb..47808ca 100644
--- a/src/components/portal/Single/Battlegear.js
+++ b/src/components/portal/Single/Battlegear.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Single/Creature.js b/src/components/portal/Single/Creature.js
index b2f5bcd..4806517 100644
--- a/src/components/portal/Single/Creature.js
+++ b/src/components/portal/Single/Creature.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import {PageNotFound} from '../../Snippets';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
diff --git a/src/components/portal/Single/Location.js b/src/components/portal/Single/Location.js
index dca5ba7..8f7f538 100644
--- a/src/components/portal/Single/Location.js
+++ b/src/components/portal/Single/Location.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';
 import {observer, inject} from 'mobx-react';
diff --git a/src/components/portal/Single/Mugic.js b/src/components/portal/Single/Mugic.js
index 5812d23..b3bf476 100644
--- a/src/components/portal/Single/Mugic.js
+++ b/src/components/portal/Single/Mugic.js
@@ -1,6 +1,6 @@
 import React from 'react';
 import Interactive from 'react-interactive';
-import { Link } from 'react-router';
+import { Link } from 'react-router-dom';
 import {PageNotFound} from '../../Snippets';
 import API from '../../SpreadsheetData';
 import s from '../../../styles/app.style';