add title to the topics page, style the video items and the links, add about page.

add bootstrap, create a styling for the random places section
add the title todo
2020-01-15 14:32:33 +02:00 · 2020-01-15 12:48:57 +02:00 · 2019-01-23 16:14:38 +02:00 · 2019-01-22 19:44:20 +05:30 · 2019-01-22 14:12:30 +00:00 · 2019-01-22 14:11:27 +00:00
91 changed files with 22664 additions and 397 deletions
--- a/package-lock.json
+++ b/package-lock.json
--- a/package.json
+++ b/package.json
@ -3,14 +3,26 @@
  "version": "0.1.0",
  "private": true,
  "dependencies": {
-    "react": "^16.6.3",
-    "react-dom": "^16.6.3",
+    "bootstrap": "^4.4.1",
+    "browser-js": "^1.10.1",
+    "connected-react-router": "^5.0.1",
+    "font-awesome": "^4.7.0",
+    "history": "^4.7.2",
+    "jquery": "^3.4.1",
+    "node-sass": "^4.11.0",
+    "prop-types": "^15.6.2",
+    "react": "^16.8.0",
+    "react-bootstrap": "^1.0.0-beta.16",
+    "react-css-grid": "^2.0.0-0",
+    "react-dom": "^16.8.0",
    "react-redux": "^5.1.1",
+    "react-router": "^4.3.1",
    "react-router-dom": "^4.3.1",
-    "react-scripts": "2.1.1",
+    "react-scripts": "^2.1.3",
    "redux": "^4.0.1",
    "redux-logger": "^3.0.6",
    "redux-thunk": "^2.3.0",
+    "video-react": "^0.13.1",
    "whatwg-fetch": "^3.0.0"
  },
  "scripts": {
--- a/public/favicon.ico
+++ b/public/favicon.ico
--- a/public/index.html
+++ b/public/index.html
@ -19,7 +19,7 @@
      work correctly both with client-side routing and a non-root public URL.
      Learn how to configure a non-root public URL by running `npm run build`.
    -->
-    <title>React App</title>
+    <title>858</title>
  </head>
  <body>
    <noscript>
--- a/src/App.js
+++ b/src/App.js
@ -1,19 +1,41 @@
-import React, { Component } from 'react';
-import { Provider } from 'react-redux';
+import React, {Component} from 'react';
+import {Provider} from 'react-redux';
+import { ConnectedRouter } from 'connected-react-router'
 import './App.css';
-import { Route } from 'react-router-dom';
+import 'font-awesome/css/font-awesome.min.css';
+import { Route, Switch } from 'react-router-dom';
 import Home from './containers/Home';
-import TopicsList from './containers/TopicsList';
+import About from './containers/About';
+import TopicsListContainer from './containers/TopicsListContainer';
 import store from './store/configureStore';
+import history from './history';
+import Header from "./components/Header";
+import Footer from "./components/Footer";
+import Search from "./components/Search";
+import Nav from "./components/Nav";
+import Video from "./containers/Video";
+import Results from "./containers/Results";

 class App extends Component {
  render() {
    return (
-      <Provider store={ store }>
-        <div className="App">
-          <Route exact={ true } path="/" component={ Home } />
-          <Route path="/topics" component={ TopicsList } />
-        </div>
+      <Provider store={store}>
+        <ConnectedRouter history={ history }>
+          <div className="App">
+            <Header/>
+            <Search/>
+            <Switch>
+              <Route exact={true} path="/" component={Home}/>
+              <Route exact={true} path="/about" component={About}/>
+
+              <Route path="/topics" component={TopicsListContainer}/>
+              <Route path="/results/:categoryKey/:searchValue" component={Results}/>
+              <Route path="/videos/:videoId" component={Video}/>
+            </Switch>
+            <Nav />
+            <Footer/>
+          </div>
+        </ConnectedRouter>
      </Provider>
    );
  }
--- a/src/actions/action_types.js
+++ b/src/actions/action_types.js
@ -1,3 +1,22 @@
-export const TEST_ACTION = 'TEST_ACTION';
-export const START_LOADING_VIDEOS = 'START_LOADING_VIDEOS';
-export const RECEIVE_VIDEOS = 'RECEIVE_VIDEOS';
+// Topics Action Types
+export const START_LOADING_ALL_TOPICS = 'START_LOADING_ALL_TOPICS';
+export const LOADED_ALL_TOPICS = 'LOADED_ALL_TOPICS';
+export const START_LOADING_RANDOM_TOPIC = 'START_LOADING_RANDOM_TOPIC';
+export const LOADED_RANDOM_TOPIC = 'LOADED_RANDOM_TOPIC';
+// Locations/Places
+
+// Places Action Types
+export const START_LOADING_ALL_PLACES = 'START_LOADING_ALL_PLACES';
+export const LOADED_ALL_PLACES = 'LOADED_ALL_PLACES';
+export const START_LOADING_RANDOM_PLACE = 'START_LOADING_RANDOM_PLACE';
+export const LOADED_RANDOM_PLACE = 'LOADED_RANDOM_PLACE';
+
+// Videos Action Types
+export const ADD_VIDEOS_TO_STATE = 'ADD_VIDEOS_TO_STATE';
+export const START_LOADING_VIDEO = 'START_LOADING_VIDEO';
+export const LOADED_VIDEO = 'LOADED_VIDEO';
+
+
+// Search Results Action Types
+export const START_LOADING_ALL_RESULTS = 'START_LOADING_ALL_RESULTS';
+export const LOADED_ALL_RESULTS = 'LOADED_ALL_RESULTS';
--- a/src/actions/errors.js
+++ b/src/actions/errors.js
@ -0,0 +1,7 @@
+
+export function APIError(error) {
+  return {
+    type: 'ERROR',
+    payload: error
+  }
+}
--- a/src/actions/fetchVideos.js
+++ b/src/actions/fetchVideos.js
@ -1,49 +0,0 @@
-import config from '../config';
-import { START_LOADING_VIDEOS, RECEIVE_VIDEOS } from './action_types';
-
-function fetchVideos() {
-  console.log('fetchVideos called');
-  return dispatch => {
-    console.log('inside dispatch function');
-    dispatch(startLoadingVideos());
-    const params = {
-      "keys":["editable","modified","title","source","project","topic","language","duration","id"],
-      "query": {
-        "conditions":[],
-        "operator":"&"
-      },
-      "range":[0,100],
-      "sort": [{"key":"title","operator":"+"}]
-    };
-    let formData = new FormData();
-    formData.append('action', 'find');
-    formData.append('data', JSON.stringify(params));
-    fetch(config.apiUrl, {
-      method: 'POST',
-      // headers: {
-      //   "Content-Type": "application/x-www-form-urlencoded"
-      // },
-      body: formData
-    })
-    .then(response => response.json())
-    .then(json => {
-      dispatch(receiveVideos(json.data.items));
-    });
-
-  }
-}
-
-function startLoadingVideos() {
-  return {
-    type: START_LOADING_VIDEOS
-  }
-}
-
-function receiveVideos(videos) {
-  return {
-    type: RECEIVE_VIDEOS,
-    payload: videos
-  }
-}
-
-export default fetchVideos;
--- a/src/actions/places.js
+++ b/src/actions/places.js
@ -0,0 +1,85 @@
+import {
+  fetchPlaces,
+  fetchRandomPlace,
+  fetchVideosByPlace,
+  fetchPlaceItemCount 
+} from '../utils/api';
+import { APIError } from './errors';
+import { getItem, setItem } from '../utils/safe-storage';
+import { addVideosToState } from './videos';
+import { 
+  START_LOADING_ALL_PLACES, 
+  LOADED_ALL_PLACES,
+  START_LOADING_RANDOM_PLACE,
+  LOADED_RANDOM_PLACE
+} from './action_types';
+
+export function getAllPlaces() {
+  return dispatch => {
+    dispatch(startLoadingAllPlaces());
+    // this calls the API
+    fetchPlaces()
+      .then(places => {
+        dispatch(loadedPlaces(places));
+      }).catch(error => {
+        dispatch(APIError(error));
+      })
+  };
+};
+
+function startLoadingAllPlaces() {
+  return {
+    type: START_LOADING_ALL_PLACES
+  };
+};
+
+function loadedPlaces(places) {
+  return {
+    type: LOADED_ALL_PLACES,
+    payload: places
+  };
+};
+
+
+// actions :
+// - async actions
+// - simple: return action type and payload.
+export function getRandomPlaceVideos(numVideos=3) {
+  return dispatch => {
+    dispatch(loadingRandomPlaceVideos());
+    fetchRandomPlace()
+      .then(place => {
+        console.log('place', place);
+        return fetchPlaceItemCount(place.name)
+          .then(itemCount => {
+            fetchVideosByPlace(place.name, 0, numVideos)
+              .then(videos => {
+                console.log('place videos', videos);
+                dispatch(addVideosToState(videos));
+                dispatch(loadedRandomPlaceVideos(place, itemCount, videos))
+              });            
+          })
+  
+      })
+      .catch(e => {
+        console.log('error', e);
+      })
+  };
+};
+
+function loadedRandomPlaceVideos(place, itemCount, videos) {
+  return {
+    type: LOADED_RANDOM_PLACE,
+    payload: {
+      place: place,
+      itemCount: itemCount,
+      videos: videos
+    }
+  };
+};
+
+function loadingRandomPlaceVideos() {
+  return {
+    type: START_LOADING_RANDOM_PLACE
+  };
+};
--- a/src/actions/search.js
+++ b/src/actions/search.js
@ -0,0 +1,43 @@
+import {LOADED_ALL_RESULTS, LOADED_ALL_TOPICS, START_LOADING_ALL_RESULTS} from "./action_types";
+import {fetchVideosByTopic} from "../utils/api";
+import {APIError} from "./errors";
+import {setItem} from "../utils/safe-storage";
+
+export function getSearchResults(categoryKey, searchValue) {
+  // get the stuff from the api
+  // dispatch loaded
+
+  switch (categoryKey) {
+    case 'topic':
+      console.log('topic')
+      return dispatch => {
+        dispatch(loadingAllResults())
+        // this calls the API
+        fetchVideosByTopic(searchValue)
+          .then(videos => {
+            dispatch(loadedResults(videos));
+          }).catch(error => {
+            dispatch(APIError(error));
+          })
+      };
+    case 'date':
+      console.log('date')
+    case 'location':
+      console.log('location')
+    default:
+      console.log('none')
+  }
+
+}
+function loadingAllResults() {
+  return {
+    type: START_LOADING_ALL_RESULTS
+  }  
+}
+
+function loadedResults(videos) {
+  return {
+    type: LOADED_ALL_RESULTS,
+    payload: videos
+  };
+};
--- a/src/actions/test.js
+++ b/src/actions/test.js
@ -1,10 +0,0 @@
-import { TEST_ACTION } from './action_types';
-
-function testAction(data) {
-  return {
-    type: TEST_ACTION,
-    payload: data
-  }
-}
-
-export default testAction;
--- a/src/actions/topics.js
+++ b/src/actions/topics.js
@ -0,0 +1,70 @@
+import { fetchAllTopics, fetchVideosByTopic } from '../utils/api';
+import { APIError } from './errors';
+import { getItem, setItem } from '../utils/safe-storage';
+import getRandomTopic from '../utils/get-random-topic';
+import { addVideosToState } from './videos';
+import { 
+  START_LOADING_ALL_TOPICS, 
+  LOADED_ALL_TOPICS,
+  START_LOADING_RANDOM_TOPIC,
+  LOADED_RANDOM_TOPIC
+} from './action_types';
+
+export function getAllTopics() {
+  return dispatch => {
+    dispatch(startLoadingAllTopics());
+    // this calls the API
+    fetchAllTopics()
+      .then(topics => {
+        dispatch(loadedTopics(topics));
+      }).catch(error => {
+        dispatch(APIError(error));
+      })
+  };
+};
+
+function startLoadingAllTopics() {
+  return {
+    type: START_LOADING_ALL_TOPICS
+  };
+};
+
+function loadedTopics(topics) {
+  // cache
+  setItem('allTopics', JSON.stringify(topics));
+  setItem('topicsUpdatedAt', new Date());
+  return {
+    type: LOADED_ALL_TOPICS,
+    payload: topics
+  };
+};
+// actions :
+// - async actions
+// - simple: return action type and payload.
+export function getRandomTopicVideos(allTopics, numVideos=4) {
+  return dispatch => {
+    const randomTopic = getRandomTopic(allTopics);
+    dispatch(loadingRandomTopicVideos());
+    fetchVideosByTopic(randomTopic.name, 0, 4)
+      .then(videos => {
+        dispatch(addVideosToState(videos));
+        dispatch(loadedRandomTopicVideos(randomTopic, videos));
+      });
+  };
+};
+
+function loadedRandomTopicVideos(topic, videos) {
+  return {
+    type: LOADED_RANDOM_TOPIC,
+    payload: {
+      topic: topic,
+      videos: videos
+    }
+  };
+};
+
+function loadingRandomTopicVideos() {
+  return {
+    type: START_LOADING_RANDOM_TOPIC
+  };
+};
--- a/src/actions/videos.js
+++ b/src/actions/videos.js
@ -0,0 +1,8 @@
+import { ADD_VIDEOS_TO_STATE } from './action_types';
+
+export function addVideosToState(videos) {
+  return {
+    type: ADD_VIDEOS_TO_STATE,
+    payload: videos
+  };
+}
--- a/src/assets/fonts/BEBAS___.ttf
+++ b/src/assets/fonts/BEBAS___.ttf
--- a/src/assets/fonts/Fedra
+++ b/src/assets/fonts/Fedra
--- a/src/assets/fonts/Interstate-Bold.bmap
+++ b/src/assets/fonts/Interstate-Bold.bmap
--- a/src/assets/fonts/Interstate-Bold.ttf
+++ b/src/assets/fonts/Interstate-Bold.ttf
--- a/src/assets/fonts/Interstate-Regular.bmap
+++ b/src/assets/fonts/Interstate-Regular.bmap
--- a/src/assets/fonts/Interstate_Light.ttf
+++ b/src/assets/fonts/Interstate_Light.ttf
--- a/src/assets/fonts/MyriadPro-Regular.otf
+++ b/src/assets/fonts/MyriadPro-Regular.otf
--- a/src/assets/fonts/majalla
+++ b/src/assets/fonts/majalla
--- a/src/assets/images/Counter.svg
+++ b/src/assets/images/Counter.svg
@ -0,0 +1,44 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 376 384.9" style="enable-background:new 0 0 376 384.9;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#000000;stroke-width:3;stroke-miterlimit:10;}
+</style>
+<g>
+	<g>
+		<path d="M142.1,190.3l11.5,9.5l5.9-7.1l11.5,9.7l-9.5,11.6l-11.6-9.5l-5.8,7l-11.6-9.6L142.1,190.3z M171.3,213.8l13.3,35.8h6.2
+			v20.2h-13.6c-3.2-5-6-10.8-8.1-16.5c-2.8,4.4-8,12.8-8,12.8L136.6,256c0,0,1-18.8,1.1-18.9c6.2-8.5,23.7-15.1,23.7-15.1l0.7-5
+			L171.3,213.8z M152.7,236.7l13.6,9c-2.4-7.3-3.6-12.7-3.6-12.7L152.7,236.7z"/>
+		<path d="M215.5,232.4l-1.5,2.2c0,0,4.7,11.9,16.8,15h15c0.3,0-6.5,20.3-6.5,20.3s-52.8,0.1-52.9,0v-20.2h14.2c-4.5-5-6-9-6-9
+			s-0.9-2.5-0.8-3.1c1.3-4.8,6.9-18,16-23.6c11.6-6.6,27.4,7.1,27.4,7.1l-5.7,13.4C231.6,234.5,219.7,225.9,215.5,232.4z"/>
+		<path d="M257.5,198.3l14.2-10.3h1.6v61.7h11.1v20.2h-26.9V198.3z"/>
+		<path d="M279.9,269.9v-20.2h3.9c5.5-2.4,11.9-12,11.9-12l8.5,5.8c-1.2,2.3-2.2,4.4-3,6.2h24.6l-3.8-7.3l10.1-9.1
+			c0,0,7.1,7.4,7.1,16.4h15l-8.1-13l12.9-12.7c0,0,9.9,13.5,9.8,25.7c0.1-0.1-10.9,20.2-10.9,20.2h-23.3c0,0-1.2-1.8-2.7-4.5
+			c-3,3-6,4.5-6,4.5h-30.7l-2.8-4.6c-1.4,1.5-3.2,3.1-5.4,4.6H279.9z"/>
+	</g>
+	<rect x="118.8" y="1.5" class="st0" width="86.4" height="201.7"/>
+	<rect x="203.4" y="1.5" class="st0" width="86.4" height="201.7"/>
+	<rect x="288" y="1.5" class="st0" width="86.4" height="201.7"/>
+	<g>
+		<path d="M13.3,278.9h1.5v78.5H1.5H0v-68.9L13.3,278.9z"/>
+		<path d="M23.4,376c10.2-9.7,14.6-14.7,18.4-20.3c-13-3.8-18.2-16.1-20.5-21.1c3.5-22.7,30-26.2,30-26.2
+			c6.7,6.5,12.1,16.8,13.4,26.4c0,0-0.1,17.8-23.2,49.2L23.4,376z M49.4,336.6l-6-12.2c-1.1,0.8-4,3.4-5.9,6.3
+			C37.6,330.6,39.9,335.5,49.4,336.6z"/>
+		<path d="M130.9,336.8v19h-9.1l-4.7-6.5l-3.8,6.5h-29c-6.7-0.5-11.6-10-13.3-13.1l10.9-9.7c0,0,4,3.9,6.3,3.9h20.6l-14.7-19.9
+			l11.5-10c0,0,11.3,8.9,18.6,29.9H130.9z"/>
+		<path d="M128.2,359.8l10.8,8.9l5.5-6.7l10.8,9.1l-8.9,10.9l-10.9-8.9l-5.4,6.6l-10.9-9L128.2,359.8z M146.5,355.8
+			c0,0,13.4-19.1,13.3-19c0.9-9.3-10.2-29.7-10.2-29.7L137.5,319l8.6,17.8H127c0,0,0.1,19.1,0.1,19H146.5z"/>
+		<path d="M162.4,376.9c23.4-22.1,26.3-34,26.3-34l-10.2-17.4l13.9-11.6c0,0,9.9,18.7,10.2,23h7.3v19h-12.1
+			c-3.1,7.5-8.4,17.2-17.1,29.1L162.4,376.9z M184.5,292l10,10.1l-10,10l-10.1-10L184.5,292z"/>
+		<path d="M231.4,336.8h14.1v19h-15.3l-6.1-8.8l-6.3,8.8h-12.7v-19h12.5l-6.4-10.2c0,0,12-12,12.1-11.9
+			C223.3,314.6,232.3,327.5,231.4,336.8z M206.8,371.2l10.9,9l5.4-6.6l10.9,8.9l8.9-10.9l-10.8-9.1l-5.5,6.7l-10.8-8.9L206.8,371.2z
+			"/>
+		<path d="M243,355.8c0,0.1-0.1-19-0.1-19H262l-8.6-17.8l12.1-11.9c0,0,11,20.4,10.2,29.7c0.1-0.1-13.3,19-13.3,19H243z
+			 M262.3,361.4l10,10.1l-10,10l-10.1-10L262.3,361.4z"/>
+		<path d="M283.4,376c10.2-9.7,14.6-14.7,18.4-20.3c-13-3.8-18.2-16.1-20.5-21.1c3.5-22.7,30-26.2,30-26.2
+			c6.7,6.5,12.1,16.8,13.4,26.4c0,0-0.1,17.8-23.2,49.2L283.4,376z M309.4,336.6l-6-12.2c-1.1,0.8-4,3.4-5.9,6.3
+			C297.6,330.6,299.9,335.5,309.4,336.6z"/>
+	</g>
+</g>
+</svg>
--- a/src/assets/images/Logo.svg
+++ b/src/assets/images/Logo.svg
@ -0,0 +1,574 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 498.6 690" style="enable-background:new 0 0 498.6 690;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#221F1F;}
+	.st1{fill:#1B111E;}
+	.st2{fill:#FFFFFF;}
+</style>
+<g>
+	<g>
+		<g id="XMLID_5_">
+			<path d="M496,151.9l-19.7,74.9c-20.3-32.7-39.5-77.7-57.5-134.9c-14.2,49.9-33.2,95.2-56.9,135.7L342,152.6
+				C370.8,108.2,393,57.3,408.4,0h21.1c6.2,22.6,12.6,42.5,19.1,59.4C460.5,90.6,476.3,121.4,496,151.9z"/>
+			<path d="M458.1,351.9c23.4,14.3,37.1,32.7,37.1,59.2c0,41.8-27.6,67.7-76.9,67.7c-41.8,0-71.4-19.4-71.4-62.2
+				c0-22.5,10.9-42.5,35-56.1c-21.8-13.9-31.6-31.9-31.6-53.7c0-41.8,28.9-63.9,71-63.9c42.9,0,70.1,20.1,70.1,59.2
+				C491.4,323,479.1,340.3,458.1,351.9z M420.3,440c19,0,26.5-10.2,26.5-29.9c0-17.7-11.6-29.2-29.2-35.4
+				c-14.3,5.4-23.1,20.1-23.1,36C394.4,429.8,401.2,440,420.3,440z M422.3,338.6c13.3-5.8,21.4-19.7,21.4-33.3
+				c0-16.3-8.8-24.5-23.4-24.5c-15,0-23.5,8.5-23.5,23.8C396.8,320.6,405,332.5,422.3,338.6z"/>
+			<path d="M197.9,246.3h119.4c0,13-1.4,29.6-3.4,42.9h-76.5l-4.1,46.6h3.4c44.5,0,85,17.3,85,69.7c0,44.9-34,73.5-80.9,73.5
+				c-20.1,0-40.1-3.4-56.5-9.9v-49.7c5.8-0.7,14.9-1,20.7-1c6.1,0,13.6,0.4,19.4,1l3.1,18c4.8,1,8.8,1.7,13.9,1.7
+				c19.7,0,30.2-10.6,30.2-31.3c0-22.8-15.6-31.9-53-31.9h-31.3C188.7,332.3,193.1,283,197.9,246.3z"/>
+			<path d="M314.7,131.2c0,40.6-5.4,68.5-16.1,83.8c-7,9.9-25.5,14.7-55.6,14.7c-18.9,0-31.9-3.1-39.1-9.4c-8.7-7.7-13-22.8-13-45.4
+				c0-39.8,7.6-78.7,22.8-116.8c14-35.2,29.2-52.9,45.4-52.9c14.4,0,27.3,12.6,38.6,37.9C309.1,68.3,314.7,97.7,314.7,131.2z
+				 M279.5,152c0-13-2.1-27.3-6.5-42.9c-5.4-19.7-12.2-29.5-20.5-29.5c-6,0-11.8,9-17.2,27c-4.6,15.3-6.9,28-6.9,37.9
+				c0,6.8,2.9,11.1,8.6,13c2.6,0.9,7.6,1.4,15.1,1.4C260.1,158.9,269.2,156.6,279.5,152z"/>
+			<path d="M160.7,151.9l-19.7,74.9c-20.3-32.7-39.5-77.7-57.5-134.9c-14.2,49.9-33.2,95.2-56.9,135.7L6.8,152.6
+				C35.6,108.2,57.7,57.3,73.2,0h21.1c6.2,22.6,12.6,42.5,19.1,59.4C125.2,90.6,141,121.4,160.7,151.9z"/>
+			<path d="M118,351.9c23.4,14.3,37.1,32.7,37.1,59.2c0,41.8-27.6,67.7-76.9,67.7c-41.8,0-71.4-19.4-71.4-62.2
+				c0-22.5,10.9-42.5,35-56.1c-21.8-13.9-31.6-31.9-31.6-53.7c0-41.8,28.9-63.9,71-63.9c42.9,0,70.1,20.1,70.1,59.2
+				C151.3,323,139.1,340.3,118,351.9z M80.2,440c19,0,26.5-10.2,26.5-29.9c0-17.7-11.6-29.2-29.2-35.4c-14.3,5.4-23.1,20.1-23.1,36
+				C54.4,429.8,61.2,440,80.2,440z M82.3,338.6c13.3-5.8,21.4-19.7,21.4-33.3c0-16.3-8.8-24.5-23.4-24.5c-15,0-23.5,8.5-23.5,23.8
+				C56.7,320.6,64.9,332.5,82.3,338.6z"/>
+		</g>
+	</g>
+	<g>
+		<g>
+			<g>
+				<path class="st0" d="M34.7,689.5l-2.5-7.2H20.3l-2.5,7.2h-6.9l12.4-32.4h6.3l12.3,32.4H34.7z M27.9,670.2
+					c-0.6-1.9-1.3-3.8-1.6-5c-0.3,1.2-1,3.1-1.6,5l-2.1,5.9H30L27.9,670.2z"/>
+				<path class="st0" d="M59.5,689.5v-13.1c0-4.4-1.5-5.6-4.1-5.6c-2.6,0-4.2,1.3-4.2,5.5v13.3h-6.4v-24.3h6.4v1.6
+					c1.1-1.2,3.1-2.1,5.7-2.1c6.2,0,9,4.3,9,11.1v13.7H59.5z"/>
+				<path class="st0" d="M94.7,689.5v-1.6c-1.2,1.2-3.2,2.1-5.5,2.1c-4.5,0-9.1-2.8-9.1-8.7c0-5.4,4.4-8.1,9.9-8.1
+					c2.2,0,3.7,0.5,4.7,1v-1.2c0-1.7-1.2-3.1-3.5-3.1c-2.9,0-4.4,0.4-6.7,1.6l-2.5-4.4c2.8-1.6,5.2-2.5,9.1-2.5
+					c5.9,0,9.9,3.1,9.9,8.5v16.3H94.7z M94.7,679.3c-1.1-0.7-2.2-1-4.4-1c-2.4,0-3.7,1.1-3.7,3.1c0,1.7,1,3.2,3.7,3.2
+					c2.1,0,3.7-1.1,4.4-2.2V679.3z"/>
+				<path class="st0" d="M119.3,672.6c-1-0.9-2.3-1.6-3.7-1.6c-2.5,0-4.1,1.1-4.1,5.3v13.1h-6.4v-24.3h6.4v1.6
+					c1.1-1.2,2.7-2.1,5-2.1c2.1,0,3.7,0.8,4.5,1.7L119.3,672.6z"/>
+				<path class="st0" d="M132.3,690c-6.3,0-11.4-5.2-11.4-12.6c0-7.5,4.9-12.7,11.7-12.7c4.6,0,7.6,2.3,9.6,5.4l-4.2,4.3
+					c-1.4-2-3-3.5-5.6-3.5c-3.1,0-5,2.5-5,6.5c0,3.9,2,6.5,5,6.5c2.5,0,4.1-1.1,5.7-3.1l4.1,3.8C139.9,687.7,137.2,690,132.3,690z"
+					/>
+				<path class="st0" d="M159.7,689.5v-13.1c0-4.4-1.5-5.6-4.1-5.6s-4.2,1.3-4.2,5.5v13.3h-6.4v-30.5l6.4-3.2v11.1
+					c1.1-1.2,3.1-2.1,5.7-2.1c6.2,0,9,4.3,9,11.1v13.7H159.7z"/>
+				<path class="st0" d="M173.5,663.2c-2,0-3.7-1.7-3.7-3.7s1.7-3.7,3.7-3.7s3.7,1.7,3.7,3.7S175.5,663.2,173.5,663.2z M170.4,689.5
+					v-24.3h6.4v24.3H170.4z"/>
+				<path class="st0" d="M194.6,689.5H188l-8.7-24.3h7l3.6,11.2c0.6,1.9,1.3,4.2,1.5,5.3c0.3-1.2,0.9-3.4,1.5-5.3l3.6-11.2h6.9
+					L194.6,689.5z"/>
+				<path class="st0" d="M224.5,679.4H210c0.2,3.3,2.7,4.6,5,4.6c1.8,0,3.2-0.6,4.2-1.7l4.5,3.8c-1.9,2.5-5.5,3.9-8.7,3.9
+					c-7,0-11.4-5-11.4-12.6c0-7.5,4.7-12.7,10.8-12.7c6.5,0,10.2,5.7,10.2,12.7C224.6,678.3,224.6,678.9,224.5,679.4z M214.1,670.2
+					c-2.3,0-3.7,1.9-4,4.4h8.3C218.2,672.4,216.9,670.2,214.1,670.2z"/>
+				<path class="st0" d="M248.9,690c-6.3,0-11-5.2-11-12.6c0-7.5,4.6-12.7,11-12.7c6.3,0,11,5.2,11,12.7
+					C259.9,684.8,255.2,690,248.9,690z M248.9,670.8c-3.1,0-4.5,2.8-4.5,6.5c0,3.7,1.4,6.5,4.5,6.5c3.1,0,4.5-3.1,4.5-6.5
+					C253.4,673.7,251.9,670.8,248.9,670.8z"/>
+				<path class="st0" d="M272.5,661.2c-1.9,0-2.4,0.6-2.4,1.9v2h4.1v6h-4.1v18.3h-6.4v-18.3h-2.9v-6h2.9v-2.9c0-4.5,2.5-6.4,6.9-6.4
+					c1.6,0,2.9,0.2,4,0.7v5.1C274.1,661.4,273.4,661.2,272.5,661.2z"/>
+				<path class="st0" d="M303,672.6c-1-0.9-2.3-1.6-3.7-1.6c-2.5,0-4.1,1.1-4.1,5.3v13.1h-6.4v-24.3h6.4v1.6c1.1-1.2,2.7-2.1,5-2.1
+					c2.1,0,3.7,0.8,4.5,1.7L303,672.6z"/>
+				<path class="st0" d="M325.6,679.4h-14.5c0.2,3.3,2.7,4.6,5,4.6c1.8,0,3.2-0.6,4.2-1.7l4.5,3.8c-1.9,2.5-5.5,3.9-8.7,3.9
+					c-7,0-11.4-5-11.4-12.6c0-7.5,4.7-12.7,10.8-12.7c6.5,0,10.2,5.7,10.2,12.7C325.7,678.3,325.6,678.9,325.6,679.4z M315.1,670.2
+					c-2.3,0-3.7,1.9-4,4.4h8.3C319.3,672.4,318,670.2,315.1,670.2z"/>
+				<path class="st0" d="M337.6,690c-3.8,0-7.6-1.1-10.2-2.8l2.1-4.9c2.6,1.4,5.3,2.2,8.4,2.2c2.5,0,3.2-0.6,3.2-1.9
+					c0-1.1-0.9-1.7-3.6-2.5c-5.8-1.8-9.6-3.2-9.6-8.3c0-5,4-7.2,9.7-7.2c3.1,0,6.4,0.9,9,2.4l-2,5c-2.4-1.3-5-1.9-7.1-1.9
+					c-2.6,0-3.3,0.5-3.3,1.6c0,1,0.7,1.4,5,2.8c4.4,1.4,8.1,3,8.1,7.9C347.5,688,343.1,690,337.6,690z"/>
+				<path class="st0" d="M354.6,663.2c-2,0-3.7-1.7-3.7-3.7s1.7-3.7,3.7-3.7c2,0,3.7,1.7,3.7,3.7S356.6,663.2,354.6,663.2z
+					 M351.4,689.5v-24.3h6.4v24.3H351.4z"/>
+				<path class="st0" d="M371.6,690c-3.8,0-7.6-1.1-10.2-2.8l2.1-4.9c2.6,1.4,5.3,2.2,8.4,2.2c2.5,0,3.2-0.6,3.2-1.9
+					c0-1.1-0.9-1.7-3.6-2.5c-5.8-1.8-9.6-3.2-9.6-8.3c0-5,4-7.2,9.7-7.2c3.1,0,6.4,0.9,9,2.4l-2,5c-2.4-1.3-5-1.9-7.1-1.9
+					c-2.6,0-3.3,0.5-3.3,1.6c0,1,0.7,1.4,5,2.8c4.4,1.4,8.1,3,8.1,7.9C381.5,688,377,690,371.6,690z"/>
+				<path class="st0" d="M398.2,688.5c-1.1,0.8-3,1.5-5,1.5c-3.9,0-6.5-3.1-6.5-7.3v-11.5h-4.1v-6h4.1v-6.2l6.4-3.2v9.4h5.8v6h-5.8
+					v9.8c0,2.3,0.8,2.9,2.4,2.9c1.2,0,2-0.5,3.6-1.9L398.2,688.5z"/>
+				<path class="st0" d="M415.8,689.5v-1.6c-1.2,1.2-3.2,2.1-5.5,2.1c-4.5,0-9.1-2.8-9.1-8.7c0-5.4,4.4-8.1,9.9-8.1
+					c2.2,0,3.7,0.5,4.7,1v-1.2c0-1.7-1.2-3.1-3.5-3.1c-2.9,0-4.4,0.4-6.7,1.6l-2.5-4.4c2.8-1.6,5.2-2.5,9.1-2.5
+					c5.9,0,9.9,3.1,9.9,8.5v16.3H415.8z M415.8,679.3c-1.1-0.7-2.2-1-4.4-1c-2.4,0-3.7,1.1-3.7,3.1c0,1.7,1,3.2,3.7,3.2
+					c2.1,0,3.7-1.1,4.4-2.2V679.3z"/>
+				<path class="st0" d="M440.9,689.5v-13.1c0-4.4-1.5-5.6-4.1-5.6s-4.2,1.3-4.2,5.5v13.3h-6.4v-24.3h6.4v1.6
+					c1.1-1.2,3.1-2.1,5.7-2.1c6.2,0,9,4.3,9,11.1v13.7H440.9z"/>
+				<path class="st0" d="M461.4,690c-6.3,0-11.4-5.2-11.4-12.6c0-7.5,4.9-12.7,11.7-12.7c4.6,0,7.6,2.3,9.6,5.4l-4.2,4.3
+					c-1.4-2-3-3.5-5.6-3.5c-3.1,0-5,2.5-5,6.5c0,3.9,2,6.5,5,6.5c2.5,0,4.1-1.1,5.7-3.1l4.1,3.8C469,687.7,466.2,690,461.4,690z"/>
+				<path class="st0" d="M493.3,679.4h-14.5c0.2,3.3,2.7,4.6,5,4.6c1.8,0,3.2-0.6,4.2-1.7l4.5,3.8c-1.9,2.5-5.5,3.9-8.7,3.9
+					c-7,0-11.4-5-11.4-12.6c0-7.5,4.7-12.7,10.8-12.7c6.5,0,10.2,5.7,10.2,12.7C493.4,678.3,493.3,678.9,493.3,679.4z M482.8,670.2
+					c-2.3,0-3.7,1.9-4,4.4h8.3C487,672.4,485.7,670.2,482.8,670.2z"/>
+			</g>
+		</g>
+	</g>
+	<polygon class="st1" points="175.1,532.1 173.7,530.4 207.5,501.6 208.8,503.3 	"/>
+	<path class="st1" d="M336,528c2.6-3,4.9-4.5,6.7-4.5c2.1,0,3.1,1.4,3.1,4.3c0,4.4-1.7,8.8-4.9,13.2c-1.6,0.5-3.2,0.7-5,0.7
+		c-3.2,0-4.7-1.3-4.7-4C331.3,534.9,332.8,531.7,336,528z M340.9,536.3c1-2.1,1.5-4.3,1.5-6.6c0-1-0.3-1.5-0.9-1.5
+		c-0.6,0-1.5,0.7-2.8,2c-2.1,2-3.1,3.6-3.1,4.6c0,1.3,0.8,1.9,2.5,1.9C338.9,536.6,339.8,536.5,340.9,536.3z"/>
+	<g>
+		<g>
+			<path class="st2" d="M9.4,591.5c0.2,0,0.5,0.1,0.7,0.1c0.7,0.2,1.3,0.3,2,0.5l-0.1,0c1.7-0.5,3.2,3,5,0.1
+				c1.2-0.2,2.3-0.4,3.5-0.6l0.1,0l-0.1-0.1c0.5,0.4,1.1,0.8,1.6,1.2l0.3,0c0.3-0.2,0.6-0.4,0.9-0.6c0.3,0,0.6-0.1,0.9-0.1l-0.1,0.1
+				c0.5,0,0.9-0.1,1.4-0.1l-0.1,0.1c0.3,0,0.7,0,1-0.1c2,2.3,3.7,2,5.2-1c2.3,1.6,4.4,3.5,7.6,2.5c2-0.6,4-1,6-1.5l-0.1,0
+				c0.6,1,1.2,1.9,1.5,2.4c1.6-0.2,2.6-0.3,3.6-0.4c2.6-0.4,5.3-0.8,7.9-1.2c0.8,0.4,1.6,1.1,2.4,1.1c2.4,0.1,4.8,0,7.2,0
+				c0.3,0.7,0.6,1.3,0.9,2c0.1,0.1,0.1,0.3,0.2,0.4c0.5,0.2,0.9,0.5,1.4,0.7l-0.1-0.1c1.8-0.3,3.6-0.9,5.4-1c4.3-0.1,8.7,0,13,0.1
+				c0.3,0,0.6,0.1,0.9,0.2c1.3,0.5,2.5,1.5,3.8,1.6c3.1,0.2,6.1,0.2,9.2,0.1c4-0.2,8-0.5,11.9-0.7c1.5-0.1,3.5,0.2,3.2-2.4
+				c0.6-0.1,1.2-0.1,1.7-0.2l0-0.1c0,0.1-0.1,0.3-0.1,0.4c0.1-0.1,0.2-0.2,0.2-0.3l0.1,0c0.4-0.3,0.7-0.6,1.1-0.8l-0.1,0.1
+				c0.4,0,0.7,0,1.1-0.1l-0.1-0.1c1.1,2.4,2.4,0.7,3.7,0.3l-0.1,0.1c0.2,0.1,0.3,0.2,0.3,0.4c0.2-0.1,0.4-0.1,0.5-0.3
+				c0.3,0,0.6-0.1,0.9-0.1l-0.1,0c1,0,2.1,0,3.1,0c0.2,0,0.4,0,0.6,0c1,0,2,0,3-0.2c4-0.6,8-1.2,12-1.9c1-0.2,2.3-0.9,2.8-1.8
+				c1.9-3,3.6-6.1,5.4-9.3c1-1.9,2.1-3.7,2.9-5.7c1.5-3.7,0-6.1-3.5-7.6c-1.6-0.6-2.9-2.3-4.3-3.4c1.4-0.6,2.7-1.2,4.1-1.8
+				c0.5-0.2,1-0.5,1.5-0.5c3.1-0.4,4.3,0.9,3.7,4c-0.7,4-0.5,4.3,3.4,5.1c0.5-0.7,1-1.5,1.6-2.3c4.9-6.5,7-13.9,7-21.9
+				c0-2.1-1.5-3.9-3.5-3.2c-3,1.2-6.4,1.7-9.1,3c-4.7,2.2-9.2,1.5-13.9,1.6c-4.3,0.1-9.1-0.5-11.5,4.8c-1.6,3.7-4,7.1-5.6,10.8
+				c-1.2,2.7-1,5.6,1.1,8.1c1.2,1.4,2.4,2.8,3.9,4.4c-0.9,0.5-1.5,1.1-2.1,1.2c-6.6,1.1-13.1,2.3-19.7,3.3c-3,0.4-6,0.5-9,0.6
+				c-6.2,0.3-12.4,0.6-18.6,0.9c-0.1,0.1-0.1,0.3-0.2,0.4l-0.1,0.1c-0.2,0-0.3,0-0.5,0c-0.2-0.1-0.5-0.1-0.7-0.2
+				c-0.1-0.1-0.1-0.2-0.1-0.3c-3-0.3-6-1-8.9-0.8c-3.9,0.3-8.2-1.3-11.5,2.1l0.1-0.1c0,0.2,0,0.4-0.2,0.6c-0.4-0.4-0.7-0.8-1.1-1.1
+				c0,0.1-0.1,0.2-0.2,0.3c-1.1,0.1-2.2,0.1-3.3,0.2c-0.2-0.2-0.3-0.3-0.5-0.5c-2.7,0.5-5.6-1.4-8.2,0.6c-0.3,0.2-0.9,0.3-1.2,0.2
+				c-5.8-2.4-10.8,0.1-15.8,2.4l0.1-0.1c-0.6,0.2-1.2,0.5-1.8,0.7l0.2,0c-1.5-0.2-2.8-2.7-4.6-0.6c-0.2,0-0.4,0-0.6,0
+				c-0.4-0.2-0.8-0.4-1.3-0.6c-0.2-0.2-0.5-0.4-0.7-0.6c-0.1-0.2-0.1-0.4-0.2-0.5c-0.1,0.2-0.3,0.4-0.4,0.5c-0.2,0-0.4,0-0.6-0.1
+				c-2.4-1.4-4.4-0.3-6.5,1l0.1-0.1c-0.2,0.1-0.5,0.2-0.7,0.3l0.1,0.1c0-0.3,0-0.5,0-0.8c-1.6-1.2-2.7-1.1-3.4,0.9
+				c-0.5-0.1-0.9-0.2-1.4-0.3l0.1,0c-0.6-0.2-1.2-0.3-1.8-0.5c-0.4,0-0.8-0.1-1.2-0.1l0.1,0c-0.6,0-1.2,0.1-1.8,0.1
+				c-0.1,0-0.3,0-0.4,0c-0.3,0.2-0.6,0.5-0.8,0.7l0.1-0.1c-0.3,0-0.6,0-0.9,0l0,0.1c-0.3,0.1-0.6,0.1-0.9,0.2
+				c0.2,0.2,0.4,0.4,0.5,0.5l0.1,0c0.6,0.4,1.2,0.8,1.8,1.2c0.2,0,0.5,0,0.7,0c0.7-0.7,2.3,1.5,2.6-0.7c0.9,0.4,1.7,0.9,2.6,1.3
+				c0,0.2,0,0.5,0,0.7c0,0.2,0,0.4,0,0.6c-0.4,0.9-0.9,1.8,0.8,1.4L9.4,591.5z M200.1,591.9c0.1,0.3,0.2,0.7,0.3,1
+				c-3.9,6.2-9.5,10.7-15.2,15.2c-2.7,2.1-4.8,5.3-8.6,5.6c-2.6,0.2-3,1.5-2.1,3.8c2.8-0.3,5.8-0.1,8.4-0.9
+				c10.9-3.5,18.1-11.5,24.2-20.6c1.3-1.9,2.1-2.2,4-1.7c3.2,0.8,6.4,2.1,9.6,2.2c5.3,0.2,10.7,0,16-0.7c2.5-0.3,5.2-1.7,5.6-5.1
+				c0.6-4.6,0.8-9.3,2.4-13.6c1.2-3.5,0.5-6.2-0.6-9.3c-0.2-0.7-0.7-1.3-1.1-2c-0.4-0.8-0.7-1.6-1-2.4c-1,0.8-2.5,1.4-2.8,2.3
+				c-0.9,2.9-1.4,5.9-1.8,8.9c-0.5,4.1-2.3,6.3-6.2,6.5c-5.4,0.2-10.7,0.1-16.1-0.1c-0.7,0-1.8-1.1-1.9-1.9c-0.3-1.3,0-2.8,0.1-4.2
+				c0.3-4.2,0.9-8.5,0.9-12.7c0-1.1-1.8-3.3-2.6-3.2c-4.8,0.6-9.9,1.7-12.8,5.8c-5,7.1-8.7,14.9-7.8,24.1c0.3,2.7,3.2,4.7,5.6,3.7
+				C197.7,592.3,198.9,592.2,200.1,591.9z M50.6,632.4c1.2-0.2,2.1,0,2.4-0.4c4.1-4.8,10.5-7.3,13.1-13.7c1.8-4.4,1.7-5.1-3.2-5.5
+				c-5.5-0.4-6.5-1.3-8.4-6.4c-0.4-1.2-2.2-2.7-3.4-2.8c-4.6-0.4-7.8,3-10.9,5.5c-2.2,1.9-4.2,2.2-6.3,1.3c-3.5-1.5-6.7-3.5-10-5.3
+				c-0.5-0.3-1.3-0.7-1.7-0.5c-2.4,1.4-5.3,2.5-7.1,4.6c-2.5,2.8-4.4,6.2-6.2,9.5c-1.7,3-0.7,4.7,2.9,5.2c4.9,0.7,8.6,3.7,12.2,6.8
+				c0.9,0.8,2.9,1.7,3.5,1.3c2.3-1.6,4.1-3.7,6.2-5.5c0.8-0.7,1.9-1.6,2.8-1.6c5,0.1,9,2.7,12.5,6C49.4,631.6,50.1,632.1,50.6,632.4
+				z M252.7,537.8c-7.1,0-13.8-0.4-20.5,0.2c-3,0.3-5.6,0.9-8-1.1c-1.2-1-2.4-2.1-3.6-3.2c-4.7-4.7-4.7-4.7-8.1,0.9
+				c-2.8,4.5-4.9,9.1-3.9,14.6c0.4,2.4,1,4.1,4.2,5c3.8,1.1,7.3,4,10.2,6.8c2.5,2.4,2.9,3,5.4,0.4c3.8-4,8.4-5.4,13.7-5.2
+				c4,0.2,10.4-5.5,10.6-9.6C252.8,543.7,252.7,540.8,252.7,537.8z M184.4,556.6c-1.9,2.5-4.5,4.4-4.9,6.7c-1.3,6.8-6.5,11-9.8,16.4
+				c-4.2,6.7-9.4,12.9-14.2,19.3c-5.5,7.5-10.9,15.1-16.6,22.4c-1.7,2.2-1.6,4,0.2,5.2c1,0.6,3.5,0.1,4.6-0.8
+				c3.5-3.1,6.8-6.5,10-10.1c4.4-5.1,8.9-10.1,12.8-15.5c5.9-8.2,11.3-16.8,17.2-25.1c2.2-3,3.9-6.1,4.3-9.8
+				C188.2,562.1,187.6,559.2,184.4,556.6z M224.8,523.1c0,3.7,0.3,4,3.3,4.4c1.1,0.2,2.2,0.7,3,1.3c4.3,3.3,7.3,2.8,10-2
+				c0.3-0.6,0.6-1.1,0.9-1.7c4.1-7.3-1.1-14.6-8-16.2c-1-0.2-2.3,0.3-3.2,0.9C225.8,513.1,226.4,519,224.8,523.1z"/>
+			<path d="M126.5,594.2c-0.3,0-0.6,0.1-0.9,0.1c-0.2,0-0.4,0.1-0.5,0.3c0-0.2-0.1-0.3-0.3-0.4c0,0-0.1,0-0.1,0l0.2-0.1
+				c-1.3,0.4-2.6,2.1-3.7-0.3l0.1,0.1c-0.4,0-0.7,0-1.1,0.1c0,0,0.1-0.1,0.1-0.1c-0.4,0.3-0.7,0.6-1.1,0.8c0,0-0.1-0.1-0.1-0.1
+				l-0.1,0.2c-0.6,0.1-1.2,0.1-1.7,0.2c0.3,2.6-1.6,2.3-3.2,2.4c-4,0.3-7.9,0.6-11.9,0.7c-3.1,0.1-6.2,0.2-9.2-0.1
+				c-1.3-0.1-2.5-1-3.8-1.6c-0.3-0.1-0.6-0.2-0.9-0.2c-4.3,0-8.7-0.2-13-0.1c-1.8,0-3.6,0.6-5.4,1l0.1,0.1c-0.5-0.2-0.9-0.5-1.4-0.7
+				c0.2-0.1,0.3-0.2,0.4-0.4c0.1-0.1,0.2-0.1,0.2-0.2c0.3-0.1,0.7-0.3,1-0.4c0.1-0.1,0.2-0.2,0.2-0.2l-0.1-0.2l0.1-0.2
+				c-0.1-0.1-0.2-0.2-0.2-0.2c-0.1-0.1-0.2-0.3-0.3-0.4c-0.4,0-0.7,0-1.1,0l-0.2,0c-0.4,0-0.8,0-1.1,0c-2.4,0-4.8,0.1-7.2,0
+				c-0.8,0-1.6-0.7-2.4-1.1c1.6-2.7,2.2-5.6,1.4-8.7c0.2-0.2,0.2-0.3,0.2-0.6c0,0-0.1,0.1-0.1,0.1c3.4-3.4,7.7-1.8,11.5-2.1
+				c2.9-0.2,5.9,0.5,8.9,0.8c-0.1,0.1-0.2,0.1-0.2,0.2c0,0.1,0,0.2,0.1,0.2c0.1,0,0.2,0,0.2-0.1c0.2,0.1,0.5,0.1,0.7,0.2
+				c0.2,0,0.3,0,0.5,0l0.1-0.1l0.2-0.1l0-0.3c6.2-0.3,12.4-0.6,18.6-0.9c3-0.2,6-0.2,9-0.6c6.6-1,13.2-2.1,19.7-3.3
+				c0.6-0.1,1.2-0.7,2.1-1.2c-1.4-1.6-2.7-3-3.9-4.4c-2.2-2.5-2.3-5.4-1.1-8.1c1.6-3.7,4-7.1,5.6-10.8c2.4-5.4,7.2-4.7,11.5-4.8
+				c4.7-0.1,9.2,0.6,13.9-1.6c2.7-1.3,6.1-1.8,9.1-3c1.9-0.8,3.5,1.1,3.5,3.2c0,8-2.1,15.4-7,21.9c-0.6,0.7-1.1,1.5-1.6,2.3
+				c-3.9-0.8-4.1-1.1-3.4-5.1c0.6-3.1-0.7-4.4-3.7-4c-0.5,0.1-1,0.3-1.5,0.5c-1.4,0.6-2.7,1.2-4.1,1.8c1.4,1.2,2.6,2.8,4.3,3.4
+				c3.6,1.4,5,3.9,3.5,7.6c-0.8,2-1.9,3.8-2.9,5.7c-1.7,3.1-3.4,6.3-5.4,9.3c-0.6,0.9-1.8,1.6-2.8,1.8c-4,0.8-8,1.3-12,1.9
+				c-1,0.1-2,0.1-3,0.2c0-0.5-0.1-1-0.1-1.6c-0.1-0.1-0.3-0.1-0.4,0c0,0.5-0.1,1-0.1,1.6C128.5,594.1,127.4,594.2,126.5,594.2
+				c-0.1,0,0.1-0.1,0.1-0.1L126.5,594.2z"/>
+			<path d="M200.1,591.9c-1.2,0.3-2.4,0.3-3.4,0.8c-2.4,1-5.3-1-5.6-3.7c-0.9-9.2,2.8-17,7.8-24.1c2.9-4.1,8-5.1,12.8-5.8
+				c0.7-0.1,2.6,2.1,2.6,3.2c0,4.2-0.6,8.5-0.9,12.7c-0.1,1.4-0.4,2.8-0.1,4.2c0.2,0.7,1.2,1.8,1.9,1.9c5.4,0.2,10.7,0.3,16.1,0.1
+				c3.9-0.1,5.7-2.4,6.2-6.5c0.4-3,0.9-6,1.8-8.9c0.3-1,1.8-1.6,2.8-2.3c0.3,0.8,0.6,1.6,1,2.4c0.3,0.7,0.8,1.3,1.1,2
+				c1.1,3,1.8,5.8,0.6,9.3c-1.5,4.3-1.8,9-2.4,13.6c-0.4,3.4-3.1,4.8-5.6,5.1c-5.3,0.7-10.7,0.9-16,0.7c-3.2-0.1-6.4-1.4-9.6-2.2
+				c-1.8-0.5-2.7-0.2-4,1.7c-6.1,9.1-13.4,17.1-24.2,20.6c-2.6,0.8-5.6,0.6-8.4,0.9c-0.9-2.3-0.5-3.6,2.1-3.8
+				c3.8-0.3,5.9-3.4,8.6-5.6c5.7-4.4,11.2-9,15.2-15.2C200.3,592.6,200.2,592.3,200.1,591.9z"/>
+			<path d="M50.6,632.4c-0.4-0.3-1.1-0.9-1.7-1.5c-3.5-3.4-7.4-6-12.5-6c-0.9,0-2,0.9-2.8,1.6c-2.1,1.8-3.9,4-6.2,5.5
+				c-0.6,0.4-2.5-0.5-3.5-1.3c-3.6-3.1-7.3-6.1-12.2-6.8c-3.6-0.5-4.7-2.2-2.9-5.2c1.9-3.3,3.7-6.7,6.2-9.5c1.8-2,4.6-3.2,7.1-4.6
+				c0.3-0.2,1.1,0.2,1.7,0.5c3.3,1.8,6.6,3.9,10,5.3c2.1,0.9,4.1,0.6,6.3-1.3c3.1-2.6,6.3-6,10.9-5.5c1.2,0.1,3,1.5,3.4,2.8
+				c1.9,5.2,2.8,6.1,8.4,6.4c4.8,0.3,5,1.1,3.2,5.5c-2.6,6.4-9,8.9-13.1,13.7C52.7,632.4,51.8,632.3,50.6,632.4z"/>
+			<path d="M252.7,537.8c0,3,0.1,5.9,0,8.7c-0.2,4.1-6.5,9.8-10.6,9.6c-5.3-0.2-10,1.1-13.7,5.2c-2.5,2.7-2.9,2.1-5.4-0.4
+				c-3-2.8-6.5-5.6-10.2-6.8c-3.2-1-3.7-2.6-4.2-5c-1-5.5,1.2-10.1,3.9-14.6c3.4-5.6,3.4-5.6,8.1-0.9c1.1,1.1,2.3,2.2,3.6,3.2
+				c2.4,2,5,1.4,8,1.1C238.8,537.4,245.6,537.8,252.7,537.8z"/>
+			<path d="M184.4,556.6c3.2,2.6,3.7,5.5,3.4,8.7c-0.3,3.7-2.1,6.8-4.3,9.8c-5.9,8.3-11.2,16.9-17.2,25.1
+				c-3.9,5.4-8.4,10.5-12.8,15.5c-3.1,3.5-6.4,7-10,10.1c-1,0.9-3.6,1.4-4.6,0.8c-1.8-1.2-2-3-0.2-5.2c5.7-7.3,11.1-14.9,16.6-22.4
+				c4.7-6.4,10-12.5,14.2-19.3c3.4-5.4,8.5-9.6,9.8-16.4C179.9,561,182.5,559.1,184.4,556.6z"/>
+			<path d="M59.5,584.3c0.8,3.1,0.2,6-1.4,8.7c-2.6,0.4-5.3,0.8-7.9,1.2c-1,0.1-2,0.2-3.6,0.4c-0.3-0.5-0.9-1.4-1.6-2.4
+				c0,0-0.2,0-0.2,0l0.3,0c-2,0.5-4.1,0.9-6,1.5c-3.2,1-5.3-0.9-7.6-2.5c-1.5,3-3.2,3.3-5.2,1c0.5-2-0.4-3.1-2.2-3.8
+				c-0.1,0.1-0.2,0.1-0.3,0c-0.1-0.1-0.1-0.2-0.2-0.2c-0.1-0.1-0.1-0.2,0-0.3c-0.2-0.5-0.4-1-0.6-1.6c1.9-2.1,3.1,0.4,4.6,0.6
+				c-0.1,0-0.1,0.1-0.2,0.1c0.1,0,0.1,0,0.2,0c-0.1,0-0.1-0.1-0.2-0.1c0.6-0.2,1.2-0.5,1.8-0.7c0.1,0.3,0.3,0.6,0.1,0.3
+				c0.3,0.2,0,0-0.3-0.2c5-2.3,10-4.8,15.8-2.4c0.3,0.1,0.9,0,1.2-0.2c2.6-1.9,5.5-0.1,8.2-0.6c0.2,0.2,0.3,0.3,0.5,0.5
+				c1.1-0.1,2.2-0.1,3.3-0.2l0.2-0.1l0-0.2C58.8,583.6,59.1,583.9,59.5,584.3z"/>
+			<path d="M224.8,523.1c1.6-4.2,0.9-10,6.1-13.2c0.9-0.6,2.2-1.1,3.2-0.9c6.9,1.6,12.1,8.9,8,16.2c-0.3,0.6-0.6,1.1-0.9,1.7
+				c-2.7,4.7-5.7,5.3-10,2c-0.8-0.7-2-1.2-3-1.3C225.1,527.1,224.8,526.8,224.8,523.1z"/>
+			<path d="M12.9,585.9c2-1.2,4-2.4,6.5-1c0.2,0.2,0.4,0.5,0.6,0.7c0.2,0.2,0.4,0.4,0.6,0.6c-1.3,1.2-2.8,2.4-3.9,3.8
+				c-0.3,0.4,0.2,1.4,0.3,2.2c-1.7,2.9-3.3-0.6-5-0.1c-0.1-0.2-0.2-0.4-0.3-0.5c-0.1-0.1-0.2-0.1-0.2-0.2c-0.1-0.1-0.1-0.2,0-0.3
+				c0-0.4,0-0.8,0-1.2c-0.2-0.7-0.5-1.5-0.7-2.2c0.1-0.1,0.1-0.2,0.2-0.3l0.2-0.1l0.1,0.1c0.4,0,0.8,0,1.1,0
+				c-0.1-0.5-0.2-0.9-0.2-1.4c0.2-0.1,0.5-0.2,0.7-0.3L12.9,585.9z"/>
+			<path d="M16.9,592.2c-0.1-0.7-0.6-1.8-0.3-2.2c1.2-1.4,2.6-2.5,3.9-3.8c0-0.2,0-0.4,0-0.6c0.2,0,0.4,0,0.6,0
+				c0.4,0.2,0.8,0.4,1.3,0.6c-0.2,0.5-0.4,1.1-0.6,1.6c-0.2,0.3-0.4,0.5-0.7,0.8c0,0.4,0,0.8,0,1.1l0.1,0.3l-0.2,0.2
+				c-0.2,0.2-0.4,0.3-0.7,0.5c0,0.3-0.1,0.6-0.1,0.9C19.3,591.8,18.1,592,16.9,592.2z"/>
+			<path d="M22,587.8c0.2-0.5,0.4-1.1,0.6-1.6c0.2,0,0.4,0,0.6,0c0.2,0.5,0.4,1,0.6,1.6l0.1,0.2l-0.1,0.1c0.1,0.1,0.1,0.2,0.2,0.2
+				c0.1,0.3,0.3,0.7,0.4,1c0.1,0.1,0.1,0.2,0.2,0.3c0,0.1,0.1,0.1,0,0.2c0,0.1-0.1,0.3-0.1,0.4c-0.1,0.2-0.2,0.5-0.2,0.7
+				c-0.1-0.1-0.3-0.2-0.4-0.2c-0.2,0.2-0.3,0.4-0.5,0.7c-0.1,0.1-0.2,0.2-0.2,0.2c-0.2,0.2-0.4,0.4-0.6,0.5l0.1-0.1
+				c-0.2,0.2-0.3,0.5-0.5,0.7c-0.5-0.4-1.1-0.8-1.6-1.2c0.3,0,0.5-0.1,0.8-0.1c0.2-0.2,0.5-0.4,0.7-0.6c0.2-0.2,0.3-0.4,0.5-0.6
+				c0.1-0.1,0.2-0.2,0.2-0.2c0-0.3,0-0.7,0-1c-0.1-0.1-0.1-0.2-0.2-0.3C22.3,588.5,22.1,588.1,22,587.8z"/>
+			<path d="M7.5,586.1c0.5,0.1,0.9,0.2,1.4,0.3l-0.1-0.1c0.5,0,0.9,0,1.4,0l-0.1,0c0.2,0,0.5,0,0.7,0l-0.1-0.1
+				c0,0.4,0.1,0.8,0.1,1.2c-0.1,0.1-0.1,0.2-0.2,0.3c0.1,0.8,0.1,1.7,0.2,2.5c-0.4,0-0.8,0-1.3,0.1c-0.1-0.1-0.2-0.2-0.2-0.2
+				c-0.1-0.4-0.3-0.7-0.4-1.1l-0.2-0.2c-0.2-0.1-0.3-0.2-0.4-0.4c-0.1-0.1-0.1-0.2-0.2-0.2c-0.2-0.1-0.3-0.2-0.4-0.4
+				c-0.1-0.1-0.2-0.2-0.2-0.2c0-0.1-0.1-0.1,0-0.2c0-0.1,0.1-0.3,0.1-0.4C7.6,586.6,7.6,586.3,7.5,586.1z"/>
+			<path d="M3,585.6c0.6,0,1.2-0.1,1.8-0.1c0.1,0.5,0.2,1,0.3,1.5l0-0.1c0.2,0.2,0.5,0.5,0.7,0.7l0-0.1c-0.3,2.3-1.9,0-2.6,0.7
+				c-0.2-0.2-0.4-0.5-0.7-0.7l0,0.1C2.6,587,2.8,586.3,3,585.6z"/>
+			<path d="M24.3,588.3c1.7,0.7,2.7,1.8,2.2,3.8c-0.3,0-0.7,0-1,0.1c-0.1-0.2-0.1-0.4-0.2-0.6c-0.1-0.1-0.2-0.1-0.2-0.2
+				c0.1-0.2,0.2-0.4,0.3-0.6c-0.2,0-0.3-0.1-0.5-0.1c0.2-0.1,0.3-0.3,0.5-0.4c-0.2-0.2-0.5-0.4-0.7-0.6c-0.1-0.1-0.1-0.2-0.2-0.3
+				C24.3,589.1,24.3,588.7,24.3,588.3z"/>
+			<path d="M8.3,588.9c-0.9-0.4-1.7-0.9-2.6-1.3l0,0.1c-0.2-0.2-0.5-0.5-0.7-0.7c0,0,0,0.1,0,0.1c-0.1-0.5-0.3-1-0.4-1.5
+				c0.4,0,0.8,0.1,1.2,0.1c0.4,0.5,0.8,0.9,1.1,1.4c0.2,0.2,0.4,0.3,0.6,0.5c0.1,0.1,0.2,0.2,0.2,0.2c0.2,0.1,0.3,0.2,0.4,0.4
+				c0.1,0.1,0.1,0.2,0.2,0.2C8.5,588.6,8.4,588.8,8.3,588.9L8.3,588.9z"/>
+			<path d="M8.9,586.4c0.6-2,1.8-2.2,3.4-1c-0.2,0.2-0.4,0.5-0.7,0.8c-0.1,0.1-0.1,0.2-0.2,0.2c-0.2,0.1-0.4,0-0.6-0.2l0.1,0.1
+				c-0.1-0.2-0.2-0.3-0.3-0.5c-0.2,0.2-0.3,0.3-0.5,0.5l0.1,0C9.8,586.3,9.3,586.3,8.9,586.4L8.9,586.4z"/>
+			<path d="M69,594.2c0.4,0,0.7,0,1.1,0c0.1,0.1,0.2,0.3,0.3,0.4c0.1,0.1,0.2,0.2,0.2,0.2c0.1,0.1,0.1,0.3,0,0.4
+				c-0.1,0.1-0.2,0.2-0.2,0.2c-0.3,0.1-0.7,0.3-1,0.4c-0.1,0.1-0.2,0.1-0.2,0.2c-0.2,0-0.4,0-0.6,0c-0.3-0.7-0.6-1.3-0.9-2
+				c0.4,0,0.8,0,1.1,0l0.1,0.1L69,594.2z"/>
+			<path d="M0.8,586.2c0.3,0,0.6,0,0.9,0c0.2,0.5,0.4,0.9,0.7,1.4l0-0.1c0,0.2,0,0.4,0,0.7c-0.6-0.4-1.2-0.8-1.8-1.2
+				C0.7,586.7,0.8,586.5,0.8,586.2z"/>
+			<path class="st2" d="M2.5,587.7c-0.2-0.5-0.4-0.9-0.7-1.4l-0.1,0.1c0.3-0.2,0.6-0.5,0.8-0.7c0.1,0,0.3,0,0.4,0
+				C2.8,586.3,2.6,587,2.5,587.7z"/>
+			<path d="M9.1,591.5c-1.7,0.4-1.3-0.5-0.8-1.4c0.4,0,0.8-0.1,1.2-0.1c0.1,0.1,0.2,0.2,0.2,0.2c0.1,0.2,0,0.4-0.2,0.6l0.1-0.1
+				C9.4,591,9.3,591.3,9.1,591.5z"/>
+			<path class="st2" d="M29.3,586.4c0.3,0.2,0.5,0.3,0.3,0.2c0.1,0.3,0,0-0.1-0.3L29.3,586.4z"/>
+			<path class="st2" d="M6.9,587c-0.4-0.5-0.8-0.9-1.1-1.4c0.6,0.2,1.2,0.3,1.8,0.5c0,0,0,0.2,0,0.2C7.4,586.5,7.2,586.7,6.9,587
+				L6.9,587z"/>
+			<path class="st2" d="M9.5,590.1c-0.4,0-0.8,0.1-1.2,0.1c0-0.2,0-0.4,0-0.6c0.3-0.2,0.5-0.4,0.8-0.6
+				C9.2,589.4,9.3,589.7,9.5,590.1z"/>
+			<path d="M12.1,592.1c-0.7-0.2-1.3-0.3-2-0.5l0.2-0.2c0.4,0,0.7,0,1.1,0c0.1,0.1,0.2,0.1,0.2,0.2
+				C11.8,591.8,11.9,591.9,12.1,592.1z"/>
+			<path class="st2" d="M27.6,586.9c0.1,0,0.1,0.1,0.2,0.1c-0.1,0-0.1,0-0.2,0c0.1,0,0.1-0.1,0.2-0.1L27.6,586.9z"/>
+			<path d="M129.5,594.1c0-0.5,0.1-1,0.1-1.6l0.2,0l0.2,0c0,0.5,0.1,1,0.1,1.6C129.9,594.1,129.7,594.1,129.5,594.1z"/>
+			<path class="st2" d="M12.2,586.1c0.1,0.5,0.2,0.9,0.2,1.4c-0.1-0.4-0.1-0.8-0.2-1.2l0.1-0.1L12.2,586.1z"/>
+			<path class="st2" d="M11.6,586.2c0.2-0.3,0.4-0.5,0.7-0.8c0,0.3,0,0.5,0,0.8l-0.1,0.1C12,586.1,11.8,586.1,11.6,586.2z"/>
+			<path class="st2" d="M80.2,582.9c-0.1,0-0.2,0.1-0.2,0.1c-0.1,0-0.1-0.2-0.1-0.2c0-0.1,0.1-0.1,0.2-0.2
+				C80.1,582.7,80.1,582.8,80.2,582.9z"/>
+			<path class="st2" d="M119.1,594.8c-0.1,0.1-0.2,0.2-0.2,0.3C118.9,595,119,594.9,119.1,594.8C119,594.8,119.1,594.8,119.1,594.8z
+				"/>
+			<path class="st2" d="M4.6,585.5c0.1,0.5,0.3,1,0.4,1.5C4.9,586.5,4.8,586,4.6,585.5C4.7,585.5,4.6,585.5,4.6,585.5z"/>
+			<path class="st2" d="M70.1,597.3l-0.1-0.1C70,597.2,70.1,597.3,70.1,597.3z"/>
+			<path class="st2" d="M25.3,591.6c0.1,0.2,0.1,0.4,0.2,0.6l0.1-0.1C25.4,592,25.3,591.8,25.3,591.6z"/>
+			<path d="M25.3,591.6c0.1,0.2,0.1,0.4,0.2,0.6c-0.5,0-0.9,0.1-1.4,0.1c0.1-0.3,0.2-0.5,0.3-0.8c0.2,0,0.4-0.1,0.6-0.1
+				C25.1,591.4,25.2,591.5,25.3,591.6z"/>
+			<path class="st2" d="M81.7,582.5l0,0.3l-0.2,0.1C81.6,582.8,81.7,582.7,81.7,582.5z"/>
+			<path class="st2" d="M24.4,591.5c-0.1,0.3-0.2,0.5-0.3,0.8l0.1-0.1c-0.1-0.2-0.2-0.5-0.3-0.7l-0.1,0.1c0.2,0,0.5,0,0.7,0
+				L24.4,591.5z"/>
+			<path d="M23.9,591.5c0.1,0.2,0.2,0.5,0.3,0.7c-0.3,0-0.6,0.1-0.9,0.1c-0.1-0.1-0.2-0.2-0.2-0.2c-0.1-0.1-0.1-0.3,0-0.4
+				c0.1-0.1,0.2-0.2,0.2-0.2C23.5,591.4,23.7,591.4,23.9,591.5z"/>
+			<path class="st2" d="M21.3,591.5c-0.3,0-0.5,0-0.8,0.1c0,0,0.1,0.1,0.1,0.1c0,0,0-0.1,0-0.1C20.8,591.5,21,591.5,21.3,591.5
+				L21.3,591.5z"/>
+			<path class="st2" d="M12.1,592.1c-0.2-0.2-0.3-0.3-0.5-0.5c0.1,0.2,0.2,0.4,0.3,0.5C12,592.1,12.1,592.1,12.1,592.1z"/>
+			<path class="st2" d="M68.5,596.2c0.2,0,0.4,0,0.6,0c-0.1,0.2-0.2,0.4-0.4,0.4C68.7,596.4,68.6,596.3,68.5,596.2z"/>
+			<path class="st2" d="M45.2,592.2l-0.3,0c0,0,0.2,0,0.2,0C45.1,592.2,45.2,592.2,45.2,592.2z"/>
+			<path class="st2" d="M22.1,592.8c0.2-0.2,0.3-0.5,0.5-0.7c-0.1,0.2-0.1,0.5-0.2,0.7L22.1,592.8z"/>
+			<path d="M22.4,592.8c0.1-0.2,0.1-0.5,0.2-0.7l-0.1,0.1l0.3-0.2l0.3,0c0.1,0.1,0.2,0.2,0.2,0.2C23,592.4,22.7,592.6,22.4,592.8z"
+				/>
+			<path class="st2" d="M125.1,594.6c0.1-0.2,0.3-0.3,0.5-0.3C125.4,594.4,125.3,594.5,125.1,594.6z"/>
+			<polygon class="st2" points="119.1,594.8 119.1,594.7 119.2,594.8 119.1,594.8 119,594.8 			"/>
+			<path class="st2" d="M120.3,594c0,0-0.1,0.1-0.1,0.1L120.3,594z"/>
+			<polygon class="st2" points="126.5,594.2 126.6,594.1 126.4,594.2 			"/>
+			<path class="st2" d="M124.9,594.1l-0.2,0.1C124.7,594.2,124.8,594.2,124.9,594.1C124.8,594.2,124.9,594.1,124.9,594.1z"/>
+			<path class="st2" d="M121.3,594L121.3,594C121.2,593.9,121.3,594,121.3,594z"/>
+			<path class="st2" d="M7.5,586.1c0,0.3,0.1,0.5,0.1,0.8l0.1,0.1c0-0.2,0-0.5,0-0.7C7.7,586.3,7.6,586.1,7.5,586.1L7.5,586.1z"/>
+			<path class="st2" d="M0.8,586.2c-0.1,0.3-0.2,0.5-0.2,0.8c0,0-0.1,0-0.1,0C0.6,586.8,0.8,586.5,0.8,586.2L0.8,586.2z"/>
+			<path d="M0.9,586.3c-0.1,0.2-0.2,0.5-0.3,0.7c-0.2-0.2-0.4-0.4-0.5-0.5C0.3,586.4,0.6,586.3,0.9,586.3z"/>
+			<path class="st2" d="M12.9,585.9l0.1-0.1C12.9,585.8,12.9,585.9,12.9,585.9z"/>
+			<path d="M2.6,585.6c-0.3,0.2-0.6,0.5-0.8,0.7C2,586.1,2.3,585.9,2.6,585.6z"/>
+			<path d="M21.3,585.7c-0.2,0-0.4,0-0.6,0l-0.2-0.2c-0.1-0.2,0-0.4,0.2-0.5l-0.1,0.1C20.8,585.2,21.1,585.4,21.3,585.7z"/>
+			<path d="M20,585.7c-0.2-0.2-0.4-0.5-0.6-0.7c0.2,0.1,0.4,0.1,0.6,0.1l-0.1-0.1c0.2,0.1,0.3,0.3,0.2,0.5L20,585.7z"/>
+			<path d="M20,585c0.1-0.2,0.3-0.4,0.4-0.5c0.1,0.2,0.1,0.4,0.2,0.5l0.1-0.1C20.4,585,20.1,585,20,585L20,585z"/>
+			<path class="st2" d="M59.6,583.8C59.6,583.8,59.7,583.7,59.6,583.8L59.6,583.8z"/>
+			<path class="st2" d="M81.4,583c-0.2,0-0.3,0-0.5,0C81.1,583,81.2,583,81.4,583z"/>
+			<path class="st2" d="M58.4,583.2l0,0.2l-0.2,0.1C58.3,583.4,58.4,583.3,58.4,583.2z"/>
+			<path class="st2" d="M55,583.7c-0.2-0.2-0.3-0.3-0.5-0.5C54.6,583.4,54.8,583.5,55,583.7z"/>
+			<path class="st2" d="M20.5,591.6c0-0.3,0.1-0.6,0.1-0.9l0,0.1c0,0.2,0,0.5,0,0.7L20.5,591.6L20.5,591.6z"/>
+			<path d="M10.1,591.6c-0.2,0-0.5-0.1-0.7-0.1c0.1-0.2,0.1-0.5,0.2-0.7l-0.1,0.1c0.3,0.2,0.5,0.3,0.8,0.5L10.1,591.6z"/>
+			<path class="st2" d="M9.6,590.8c-0.1,0.2-0.1,0.5-0.2,0.7l-0.3,0C9.3,591.3,9.4,591,9.6,590.8z"/>
+			<path d="M9,589c-0.3,0.2-0.5,0.4-0.8,0.6c0-0.2,0-0.5,0-0.7l-0.1,0.1l0.2-0.2l0.3,0L9,589z"/>
+			<path class="st2" d="M2.4,588.2c0-0.2,0-0.4,0-0.7c0.2,0.2,0.4,0.5,0.7,0.7C2.8,588.2,2.6,588.2,2.4,588.2z"/>
+			<path class="st2" d="M69.3,595.9c0.3-0.1,0.7-0.3,1-0.4C70,595.6,69.7,595.8,69.3,595.9z"/>
+			<path class="st2" d="M70.6,595.2c0.1-0.1,0.1-0.3,0-0.4l-0.1,0.2L70.6,595.2z"/>
+			<path class="st2" d="M130,592.6l-0.2,0l-0.2,0C129.8,592.4,129.9,592.4,130,592.6z"/>
+			<path class="st2" d="M70.4,594.6c-0.1-0.2-0.2-0.3-0.3-0.4C70.2,594.4,70.3,594.5,70.4,594.6z"/>
+			<polygon class="st2" points="69,594.2 68.9,594.3 68.8,594.2 			"/>
+			<path class="st2" d="M24.3,588.3c0,0.4,0.1,0.7,0.1,1.1c-0.1-0.3-0.3-0.7-0.4-1C24.1,588.5,24.2,588.5,24.3,588.3z"/>
+			<path class="st2" d="M23.7,588.1l0.1-0.1l-0.1-0.2C23.6,587.9,23.6,588,23.7,588.1z"/>
+			<path class="st2" d="M10.9,590.2c-0.1-0.8-0.1-1.7-0.2-2.5c0.2,0.7,0.5,1.5,0.7,2.2c-0.2,0.1-0.4,0.2-0.6,0.2L10.9,590.2z"/>
+			<path class="st2" d="M10.3,591.4c-0.3-0.2-0.5-0.3-0.8-0.5c0.2-0.1,0.3-0.3,0.2-0.6c0.4,0,0.8,0,1.3-0.1l-0.1-0.1
+				c0.2,0.3,0.4,0.6,0.6,0.9c-0.1,0.1-0.1,0.2,0,0.3C11,591.4,10.7,591.4,10.3,591.4z"/>
+			<path d="M11.6,586.2c0.2-0.1,0.4,0,0.6,0.1c0.1,0.4,0.1,0.8,0.2,1.2c-0.4,0-0.8,0-1.1,0c0-0.4,0.1-0.7,0.1-1.1
+				C11.5,586.3,11.6,586.3,11.6,586.2z"/>
+			<path class="st2" d="M11.4,586.4c0,0.4-0.1,0.7-0.1,1.1l-0.1-0.1l-0.2,0.1c0-0.4-0.1-0.8-0.1-1.2C11,586.5,11.2,586.5,11.4,586.4
+				z"/>
+			<path d="M20.6,585.7c0,0.2,0,0.4,0,0.6c-0.2-0.2-0.4-0.4-0.6-0.6l0.1-0.2l0.2,0l0.2,0L20.6,585.7z"/>
+			<path d="M11.4,591.1c-0.2-0.3-0.4-0.6-0.6-0.9c0.2-0.1,0.4-0.2,0.6-0.2C11.4,590.3,11.4,590.7,11.4,591.1z"/>
+			<path class="st2" d="M22,587.8c0.2,0.3,0.3,0.6,0.5,0.9c-0.4,0-0.7-0.1-1.1-0.1C21.5,588.4,21.8,588.1,22,587.8z"/>
+			<path d="M21.3,588.6c0.4,0,0.7,0.1,1.1,0.1c0.1,0.1,0.1,0.2,0.2,0.3c0,0.3,0,0.7,0,1c-0.1,0.1-0.2,0.2-0.2,0.2
+				c-0.2,0-0.4-0.1-0.6-0.1c-0.2-0.1-0.3-0.3-0.5-0.4C21.3,589.4,21.3,589,21.3,588.6z"/>
+			<path class="st2" d="M20.6,590.7c0.2-0.2,0.4-0.3,0.7-0.5l0-0.1c0,0.2,0,0.5,0,0.7l0.1-0.1C21,590.8,20.8,590.8,20.6,590.7
+				L20.6,590.7z"/>
+			<path class="st2" d="M21.3,589.8c0.2,0.1,0.3,0.3,0.5,0.4l0.1-0.1c-0.2,0-0.5,0-0.7,0l0,0.1l0.2-0.2L21.3,589.8z"/>
+			<path class="st2" d="M22.6,590.1c0-0.3,0-0.7,0-1C22.6,589.4,22.6,589.7,22.6,590.1z"/>
+			<path class="st2" d="M23.1,592l-0.3,0l-0.3,0.2c0.2-0.2,0.4-0.4,0.6-0.5C23,591.7,23,591.9,23.1,592z"/>
+			<path class="st2" d="M23.9,591.5c-0.2,0-0.4-0.1-0.6-0.1c0.2-0.2,0.3-0.4,0.5-0.7l0,0.1c0,0.2,0,0.5,0,0.7L23.9,591.5z"/>
+			<path class="st2" d="M21.9,590.9c-0.2,0.2-0.5,0.4-0.7,0.6c0,0,0,0,0,0c0-0.2,0-0.5,0-0.7l-0.1,0.1
+				C21.4,590.9,21.7,590.9,21.9,590.9L21.9,590.9z"/>
+			<path class="st2" d="M23.8,590.7c0.1,0.1,0.3,0.2,0.4,0.2c0.1-0.2,0.2-0.5,0.2-0.7l-0.1-0.1c0,0.2,0,0.5,0,0.7l0.1-0.1
+				C24.3,590.8,24,590.8,23.8,590.7L23.8,590.7z"/>
+			<path class="st2" d="M21.8,590.2c0.2,0,0.4,0.1,0.6,0.1c-0.2,0.2-0.3,0.4-0.5,0.6c0,0,0,0,0,0c0-0.2,0-0.5,0-0.7L21.8,590.2z"/>
+			<path class="st2" d="M24.6,589.7c0.2,0.2,0.5,0.4,0.7,0.6l-0.1-0.1c-0.2,0-0.5,0-0.7,0l0.1,0.1c0.1-0.1,0.1-0.2,0.1-0.4
+				C24.7,589.8,24.6,589.7,24.6,589.7z"/>
+			<path class="st2" d="M8.9,586.3c0.5,0,0.9,0,1.4,0C9.8,586.3,9.3,586.3,8.9,586.3z"/>
+			<path class="st2" d="M7.5,587.5c-0.2-0.2-0.4-0.3-0.6-0.5c0,0,0,0,0,0c0.2,0,0.5,0,0.7,0l-0.1-0.1c0,0.1-0.1,0.3-0.1,0.4
+				C7.5,587.3,7.5,587.4,7.5,587.5z"/>
+			<path class="st2" d="M10.2,586.3c0.2-0.2,0.3-0.3,0.5-0.5c0.1,0.2,0.2,0.3,0.3,0.5C10.7,586.3,10.4,586.3,10.2,586.3z"/>
+			<path class="st2" d="M8.8,588.8l-0.3,0l-0.2,0.2c0.2-0.1,0.3-0.3,0.1-0.6C8.5,588.6,8.6,588.7,8.8,588.8z"/>
+			<path class="st2" d="M8.2,588.1c-0.1-0.2-0.2-0.3-0.4-0.4C7.8,587.9,8,588,8.2,588.1z"/>
+			<path class="st2" d="M5,586.9c0.2,0.2,0.5,0.5,0.7,0.7C5.5,587.4,5.2,587.2,5,586.9z"/>
+			<path class="st2" d="M25,591.4c-0.2,0-0.4,0.1-0.6,0.1l0.1,0.1c0-0.2,0-0.5,0-0.7l-0.1,0.1c0.2,0,0.5,0,0.7,0l0.1-0.1
+				C25.2,591,25.1,591.2,25,591.4z"/>
+			<path class="st2" d="M25.3,590.3c-0.2,0.1-0.3,0.3-0.5,0.4c0.2,0,0.3,0.1,0.5,0.1c0,0-0.1,0.1-0.1,0.1c0-0.2,0-0.5,0-0.7
+				L25.3,590.3z"/>
+			<path d="M7.7,587c-0.2,0-0.5,0-0.7,0c0.2-0.2,0.5-0.5,0.7-0.7C7.7,586.5,7.7,586.7,7.7,587z"/>
+			<path d="M24.5,590.8c0,0.2,0,0.5,0,0.7c-0.2,0-0.5,0-0.7,0c0-0.2,0-0.5,0-0.7C24,590.8,24.3,590.8,24.5,590.8z"/>
+			<path d="M21.3,590.8c0,0.2,0,0.5,0,0.7c-0.2,0-0.5,0-0.7,0c0-0.2,0-0.5,0-0.7C20.8,590.8,21,590.8,21.3,590.8z"/>
+			<path class="st2" d="M20.4,585.5l-0.2,0l-0.2,0c0.1-0.2,0-0.4-0.2-0.5c0.2,0,0.5,0,0.7,0C20.4,585.1,20.4,585.3,20.4,585.5z"/>
+			<path d="M21.9,590.1c0,0.2,0,0.5,0,0.7c-0.2,0-0.5,0-0.7,0c0-0.2,0-0.5,0-0.7C21.4,590.1,21.7,590.1,21.9,590.1z"/>
+			<path d="M25.2,590.1c0,0.2,0,0.5,0,0.7c-0.2,0-0.5,0-0.7,0c0-0.2,0-0.5,0-0.7C24.7,590.1,24.9,590.1,25.2,590.1z"/>
+		</g>
+	</g>
+	<g>
+		<g id="XMLID_4_">
+			<path d="M496.3,525.4c2.1,0.2,2.9,1.8,1.9,3.6c-1.1,1.9-2.6,3.6-3.9,5.5c-0.7,1.1-0.9,2.9-1.9,3.5c-2.3,1.3-4.9,2.1-7.5,3
+				c-0.4,0.1-1.3-0.5-1.5-1c-0.9-2.1-2.9-2.4-4.7-2.8c-3.7-0.8-4.9-2.2-5-6.1c-0.1-4,1.6-7.4,3-11c2.1-5,5-9.3,9.8-11.9
+				c1.1-0.6,3.6,0.2,4.8,1.2c0.7,0.6,0.8,2.8,0.3,4c-0.5,1.5-1.9,2.6-2.9,3.9c-0.6,0.8-1.4,1.5-1.8,2.5c-0.5,1.3-1.5,3.2-0.9,4
+				c0.8,1.2,2.7,1.6,4.2,2.3c0.2,0.1,0.5-0.1,1.3-0.3C492.6,525.6,494.5,525.2,496.3,525.4z"/>
+			<path d="M486.7,543.3c0.4-0.7,1-1.6,1.6-1.6c0.8,0,1.9,0.5,2.2,1.2c0.7,1.4,1.6,3.1,1.2,4.5c-1.2,4.9-0.2,9.8,0.5,14.5
+				c0.7,5.6-1.1,10.8-1.6,16.1c-0.1,1.7,0.2,3.4-0.1,5c-0.7,3.5,0.7,6.9,0.6,10.3c0,3-2.1,6-2.8,9c-0.6,2.8-1.8,4.9-4.1,6.6
+				c-3.9-2.3-4.3-4.4-2.9-8.7c0.7-2.1,0.5-4.6,0.2-6.8c-0.3-2.2-0.2-4.1,0.8-6.2c0.8-1.4,0.8-3.3,1-5c0.5-4.4,1-8.9,1.2-13.4
+				c0.1-2.4-1-4.9-0.5-7.1C485.6,555.8,483.3,549.1,486.7,543.3z"/>
+			<path d="M461.6,573.6c2.1,2.4,1.6,5.1,0.8,7.8c-2.6,8.1-4.9,16.4-7.9,24.4c-1.2,3.3-3.3,6.8-6.1,8.8c-3.1,2.3-7.3,3.1-11.1,4.3
+				c-0.7,0.2-1.7-0.9-2.6-1.4c-1-0.8-2-1.6-3-2.4c2.2-1.4,4.6-2.6,6.7-4.2c2.7-1.9,5-4.4,7.7-6.2c4.1-2.7,5.4-7.1,7.1-11.2
+				c0.8-1.9,0.1-4.3-0.1-6.5c-0.1-2-0.4-3.9,1.2-5.6c0.7-0.7,0.8-2,1-3C456.4,574.3,457.4,573.5,461.6,573.6z"/>
+			<path d="M449.7,544.7c1.4,0.8,2,3.1,3,5c-1.2,2.5-2.2,4.6-3.3,6.6c-1.2,2.2-2.7,4.2-3.6,6.5c-1.3,3.3-6.2,4.6-8.8,2.1
+				c-0.5-0.5-1.8-0.9-2.4-0.6c-2.6,1.1-5.2,2.2-7.5,3.8c-2.4,1.6-3,1.4-4.4-1c-0.7-1.2-2.3-1.9-3.5-2.8c-1.8-1.4-3.6-2.8-5.4-4.3
+				c-0.4-0.3-0.7-1-0.7-1.6c0.1-2.6,0.5-5.1,0.6-7.6c0.2-2.7,1.5-4.6,3.8-5.9c0.4-0.2,0.4-1.1,0.7-1.6c0.6-0.8,1.2-2,2-2.2
+				c0.9-0.2,2.1,0.4,2.9,1c0.9,0.7,1.2,2.1,2.1,2.8c1.7,1.4,2.9,3.3,6,2.1c2.1-0.8,5,0.7,7.5,0.5c2-0.1,3.9-1.2,5.9-1.7
+				C446.5,545.3,448.6,544,449.7,544.7z"/>
+			<path d="M446.3,521.3c2.6,0.2,2.8,1.9,3.1,4.4c-0.8,1.8-1.5,4.3-2.9,6.3c-1.8,2.8-4.1,5.2-6.2,7.7c-1,1.3-2,1.6-3.6,0.5
+				c-2.4-1.6-5.2-2.8-7.8-3.9c-1.9-0.8-3-2.7-1.8-4.1c2-2.6,2.6-5.6,3.6-8.5c0.7-1.9,1.7-3.8,2.9-5.5c1-1.4,2.1-1.9,3.8-0.2
+				C439.7,520.4,443.1,521,446.3,521.3z"/>
+			<path d="M430.4,617.8c0.3-1,0.9-1.8,1.4-2.7c1,0.8,2,1.6,3,2.4c-0.9,0.5-1.7,1.2-2.7,1.4C431.6,618.9,430.3,618,430.4,617.8z"/>
+			<path d="M413.4,612.1c0.5,4.4-1,8.2-4,11.4c-1.1,1.2-2.3,2.3-3.3,3.7c-1.8,2.6-2,2.8-5.4,3c-2.4-5.7-8.2-6.7-12.5-2.5
+				c-2.8,2.8-2.7,2.6-5.4-0.3c-1.4-1.5-3.5-2.5-5.4-3.2c-3.1-1.1-4.4-3-3.7-6.4c0.8-3.6,1.6-7.1,4.9-9.5c0.7-0.5,0.9-1.8,1.4-2.6
+				c1.8-3,4.4-3.2,6.4-0.3c1.6,2.3,3.7,2.8,6.5,3c3.5,0.2,6.2-0.8,8.8-2.9c1.3-1.1,2-0.5,3.5,0.4c1.9,1.2,2.8,4.7,6.2,3.7
+				C411.8,609.6,413.3,611.2,413.4,612.1z"/>
+			<path d="M394.4,523.7c2.1,0.4,4.1,1.7,4,3.8c-0.1,0.6-0.2,1.7-0.7,2.7c-1.8,4.2-3.7,8.4-6.8,11.9c-2.3,2.6-4.1,2.8-6.7,0.6
+				c-1.3-1.1-2.7-2-4.2-2.5c-2.1-0.8-2.8-2.1-2-4c1.4-3.6,2.9-7.2,4.6-10.7c0.7-1.4,1.8-2.8,3-3.9c1.2-1,2.4-1.1,3.9,0.1
+				C390.7,522.9,392.7,523.4,394.4,523.7z"/>
+			<path d="M360.3,584.7c13.7-0.9,16.4-2.3,16.4-2.3c2.6-1.1,3-2.6,2.1-5.4c-0.5-1.6-0.7-3.6-0.2-5.2c1.3-4,3-7.8,4.6-11.7
+				c0.8-2,0.8-4.5,3.1-5.7c1.3-0.6,2.8-1.6,4.1-1.4c2.6,0.2,5.2,0.9,7.7,1.7c2.4,0.7,2.9,3,3.3,5.2c0.2,1,0.2,2.1,0,3.1
+				c-1.4,5.4,0,11.4-3.6,16.2c-0.2,0.2,0,0.7-0.1,1.2c3.2-0.9,6.4-1.4,9.3-2.7c2.9-1.3,5.4-3.3,8.5-5.2c0.7,1.6,1.5,3.4,2.2,5.1
+				c0.9-1.2,2.1-2.9,3.1-4.2c2.3,1.9,4.1,3.3,5.9,4.7c0.2,0.1,0.3,0.2,0.5,0.4c1.3,0.7,2.6,1.2,3.7,2c2.8,2.1,4,1.7,5-1.5
+				c0.6-2,1.9-3.8,3.2-5.7c2.2,2.5,3.4,5,3.2,7.9c-0.2,3.9-0.6,7.7-1.1,11.5c-0.4,2.3-1,4.7-2,6.9c-1.6,3.2-3.7,3.1-6,0.2
+				c-1.9-2.3-4.1-4.4-6.3-6.4c-1-0.9-2.4-1.6-3.7-2.2c-1.8-0.9-2.9,0-3.6,1.7c-0.9,2.3-2,4.5-2.6,6.8c-0.6,2.1-2.1,2.3-3.4,1.7
+				c-0.9-0.4-1.5-1.9-1.9-3c-0.4-1.3-0.4-2.7-0.6-4.7c-4.1,1.1-7.7,2.1-11.3,3.1c-2.9,0.8-5.7,1.7-8.6,2.3c-0.6,0.1-1.8-0.7-2.2-1.4
+				c-1.5-2.4-2.7-2.9-5.4-1.8c-3.7,1.6-7.3,3.8-11.1,4.7l-7.3,0.4L360.3,584.7z"/>
+			<path d="M358.3,584.8l0.9,0C358.9,584.8,358.6,584.8,358.3,584.8z"/>
+			<path class="st2" d="M332.8,586.2v0.3l-0.2,0.1C332.6,586.5,332.7,586.4,332.8,586.2z"/>
+			<path class="st2" d="M331.1,586.3c0,0.1,0.1,0.2,0.1,0.3c-0.1,0-0.2,0.1-0.2,0.1c-0.1,0-0.1-0.1-0.1-0.2
+				C330.9,586.4,331,586.3,331.1,586.3z"/>
+			<path class="st2" d="M321.6,598.6c0.1,0.1,0.1,0.3,0,0.4l-0.1-0.2L321.6,598.6z"/>
+			<path class="st2" d="M321.1,597.9c0.1,0.1,0.2,0.3,0.3,0.4C321.3,598.2,321.2,598.1,321.1,597.9z"/>
+			<path d="M310.7,587.5c3.3-3.3,7.6-1.7,11.4-2c2.9-0.2,5.9,0.5,8.9,0.8c-0.1,0-0.2,0.1-0.2,0.2c0,0.1,0,0.2,0.1,0.2
+				c0,0,0.2,0,0.2-0.1c0.2,0.1,0.5,0.1,0.7,0.2c0.2,0,0.3,0,0.5,0l0.1-0.1l0.2-0.1v-0.3c6.2-0.3,12.4-0.6,18.6-0.9
+				c3-0.2,6-0.2,9-0.6l4.9,16.5c-4,0.3-7.9,0.6-11.9,0.7c-3.1,0.1-6.1,0.2-9.2-0.1c-1.3-0.1-2.6-1-3.8-1.6c-0.3-0.1-0.6-0.2-0.9-0.2
+				c-4.3,0-8.6-0.2-13,0c-1.8,0-3.6,0.6-5.4,0.9l0.1,0.1c-0.5-0.2-0.9-0.5-1.4-0.7c0.2-0.1,0.3-0.2,0.4-0.5c0.1-0.1,0.2-0.1,0.2-0.2
+				c0.4-0.1,0.7-0.3,1-0.4c0.1-0.1,0.2-0.2,0.2-0.2c0.1-0.1,0.1-0.3,0-0.4c-0.1-0.1-0.1-0.2-0.2-0.2c-0.1-0.2-0.2-0.3-0.3-0.4
+				c-0.4,0-0.7,0-1.1,0h-0.2c-0.4,0-0.7,0-1.1,0c-2.4,0-4.8,0.1-7.2,0c-0.8,0-1.6-0.7-2.4-1.1c1.6-2.7,2.2-5.6,1.4-8.7
+				C310.7,587.9,310.7,587.7,310.7,587.5z"/>
+			<polygon class="st2" points="320,597.9 319.9,598 319.8,597.9 			"/>
+			<path class="st2" d="M319.7,600.3c0-0.2-0.1-0.3-0.1-0.4c0.2,0,0.4,0,0.5,0C320.1,600.1,319.9,600.2,319.7,600.3z"/>
+			<path d="M320.1,599.9c-0.2,0-0.4,0-0.5,0c-0.3-0.7-0.6-1.3-0.9-2c0.4,0,0.8,0,1.1,0l0.1,0.1l0.1-0.1c0.4,0,0.7,0,1.1,0
+				c0.1,0.2,0.2,0.3,0.3,0.4c0.1,0.1,0.2,0.2,0.2,0.2l-0.1,0.2l0.1,0.2c-0.1,0.1-0.2,0.2-0.2,0.2c-0.3,0.1-0.7,0.3-1,0.4
+				C320.3,599.7,320.2,599.8,320.1,599.9z"/>
+			<path class="st2" d="M309.4,586.9l0,0.2l-0.2,0.1C309.4,587.1,309.4,587,309.4,586.9z"/>
+			<path d="M296.1,596c0.2,0.4,0.5,0.7,0.7,1C296.6,596.7,296.3,596.3,296.1,596z"/>
+			<path d="M296.2,595.9c0,0-0.1,0-0.1,0v0L296.2,595.9z"/>
+			<path d="M296.1,596L296.1,596C296.1,596,296.1,596,296.1,596L296.1,596z"/>
+			<path class="st2" d="M280.4,590.1c0,0,0.1,0,0.2-0.1c0,0.1,0.1,0.2,0.1,0.2C280.5,590.2,280.4,590.1,280.4,590.1z"/>
+			<path class="st2" d="M280.5,589.9C280.5,590,280.5,590,280.5,589.9c0,0.1-0.1,0.1-0.1,0.1L280.5,589.9z"/>
+			<path class="st2" d="M278.8,590.7c-0.1,0-0.1,0-0.2,0C278.7,590.7,278.7,590.7,278.8,590.7C278.8,590.7,278.8,590.7,278.8,590.7z
+				"/>
+			<path class="st2" d="M278.8,590.6L278.8,590.6C278.8,590.6,278.8,590.7,278.8,590.6c-0.1,0-0.1,0-0.1,0H278.8z"/>
+			<path d="M278.7,590.6C278.8,590.6,278.8,590.6,278.7,590.6L278.7,590.6C278.7,590.6,278.7,590.6,278.7,590.6z"/>
+			<path class="st2" d="M276.5,595.9L276.5,595.9C276.5,595.9,276.5,595.9,276.5,595.9C276.5,595.9,276.5,595.9,276.5,595.9z"/>
+			<path d="M274.8,591.6c-0.2-0.5-0.4-1-0.6-1.6c1.8-2,3,0.3,4.5,0.6c0,0,0,0-0.1,0c0,0,0,0,0.1,0c0,0-0.1,0-0.1,0.1
+				c0.1,0,0.1,0,0.2,0c0,0-0.1,0-0.1-0.1c0,0,0,0,0.1,0h0c0,0,0,0-0.1,0c0.6-0.2,1.2-0.4,1.7-0.7l-0.1,0.1c0.1,0,0.2,0.1,0.2,0.1
+				c0-0.1-0.1-0.1-0.1-0.2c5-2.3,9.9-4.7,15.6-2.3c0.3,0.1,0.9,0,1.2-0.2c2.6-1.9,5.5-0.1,8.2-0.6c0,0,0.1,0.1,0.1,0.1
+				c0.1,0.1,0.2,0.2,0.4,0.4c1.1-0.1,2.2-0.1,3.3-0.2l0.2-0.1l0-0.2c0.4,0.4,0.7,0.8,1.1,1.1c0.8,3.1,0.2,6-1.4,8.7
+				c-2.6,0.4-5.3,0.8-7.9,1.2c-1,0.1-2,0.2-3.6,0.4c-0.2-0.3-0.5-0.8-0.9-1.3c-0.2-0.3-0.5-0.7-0.7-1c0,0,0.1,0,0.1,0l-0.1,0h0
+				c0,0,0,0,0,0c-2,0.5-4,0.9-5.9,1.5c-3.2,1-5.3-0.9-7.5-2.5c-1.5,3-3.2,3.3-5.2,1c0.5-2-0.4-3.1-2.2-3.8c-0.1,0.1-0.2,0.1-0.3,0
+				c-0.1-0.1-0.1-0.2-0.2-0.2l0.1-0.1L274.8,591.6z"/>
+			<path d="M276.3,595.4c0.1,0.2,0.1,0.4,0.2,0.5c0,0,0,0-0.1,0C276.4,595.7,276.3,595.5,276.3,595.4z"/>
+			<path class="st2" d="M276.2,594.1c0-0.1,0-0.2,0-0.2l0.1,0.1C276.3,594,276.2,594.1,276.2,594.1z"/>
+			<path class="st2" d="M276.2,594.6c0,0,0-0.1,0-0.2c0,0,0.1,0,0.1,0L276.2,594.6z"/>
+			<path d="M276.2,594.1c0,0.1,0,0.2,0,0.3c-0.1,0-0.2-0.1-0.3-0.1C276,594.3,276.1,594.2,276.2,594.1z"/>
+			<path d="M275.5,594c0,0,0-0.1,0.1-0.1c0.2,0,0.4,0,0.6,0c0,0.1,0,0.2,0,0.2c-0.1,0.1-0.2,0.2-0.3,0.3c0.1,0,0.2,0,0.3,0.1
+				c0,0,0,0.1,0,0.2c-0.2,0-0.4,0-0.7,0c0,0,0,0,0-0.1c0,0,0,0-0.1,0c0-0.1,0-0.3,0-0.4C275.5,594.1,275.5,594,275.5,594z"/>
+			<path d="M275.6,593.4c-0.1-0.1-0.2-0.2-0.2-0.2c0-0.4-0.1-0.7-0.1-1.1c1.7,0.7,2.7,1.9,2.2,3.8c-0.3,0-0.7,0-1,0.1l0.1-0.1
+				c-0.1-0.2-0.2-0.3-0.2-0.5c0,0,0,0,0,0c-0.1-0.1-0.2-0.2-0.2-0.2c0.1-0.2,0.2-0.4,0.3-0.6c0,0-0.1,0-0.1,0c0-0.1,0-0.2,0-0.3
+				c0,0,0.1-0.1,0.1-0.1l-0.1-0.1C276,593.7,275.8,593.5,275.6,593.4z"/>
+			<path class="st2" d="M275.6,593.4c0.2,0.2,0.4,0.3,0.6,0.5c-0.2,0-0.4,0-0.6,0c0-0.1,0.1-0.2,0.1-0.3
+				C275.7,593.5,275.6,593.5,275.6,593.4z"/>
+			<path class="st2" d="M276,595.1c-0.2,0-0.3,0-0.5,0.1c0-0.2,0-0.4,0-0.6c0.2,0,0.4,0,0.7,0l0.1-0.1
+				C276.2,594.7,276.1,594.9,276,595.1z"/>
+			<path d="M275.5,595.2C275.5,595.2,275.5,595.2,275.5,595.2l-0.1,0C275.5,595.2,275.5,595.2,275.5,595.2z"/>
+			<path d="M275.5,594.5C275.5,594.6,275.5,594.6,275.5,594.5C275.5,594.6,275.5,594.6,275.5,594.5L275.5,594.5z"/>
+			<path d="M275.5,594.5L275.5,594.5C275.5,594.6,275.5,594.6,275.5,594.5C275.5,594.5,275.5,594.5,275.5,594.5z"/>
+			<path d="M276.5,595.9c-0.4,0-0.9,0.1-1.3,0.1l0.1-0.1c0,0,0,0,0,0c0.1-0.2,0.1-0.4,0.2-0.6c0,0,0.1,0,0.1,0c0,0,0,0,0-0.1
+				c0.2,0,0.3-0.1,0.5-0.1c0.1,0.1,0.2,0.2,0.2,0.2c0,0,0,0,0,0C276.3,595.5,276.4,595.7,276.5,595.9z"/>
+			<path d="M275.5,595.3c0,0-0.1,0-0.1,0c0,0,0,0,0-0.1L275.5,595.3z"/>
+			<path d="M275.6,593.9c0,0,0,0.1-0.1,0.1l0-0.1v0C275.5,593.9,275.5,593.9,275.6,593.9z"/>
+			<path d="M275.5,594c0,0,0,0.1,0,0.1C275.5,594,275.5,594,275.5,594L275.5,594z"/>
+			<path class="st2" d="M275.3,594.5c0-0.1,0.1-0.3,0.1-0.4c0,0.1,0,0.3,0,0.4C275.4,594.5,275.4,594.5,275.3,594.5z"/>
+			<path d="M275.3,594.7c-0.1,0-0.2-0.1-0.3-0.2c0.1,0,0.2,0,0.3,0C275.3,594.6,275.3,594.6,275.3,594.7z"/>
+			<path class="st2" d="M275.2,595.8c-0.1-0.2-0.2-0.4-0.2-0.6c0.2,0,0.3,0,0.5,0C275.3,595.4,275.3,595.6,275.2,595.8z"/>
+			<path d="M275.2,595.8C275.2,595.8,275.2,595.9,275.2,595.8C275.2,595.9,275.2,595.9,275.2,595.8
+				C275.2,595.9,275.2,595.8,275.2,595.8z"/>
+			<path class="st2" d="M275.2,595.9C275.2,595.9,275.2,595.9,275.2,595.9L275.2,595.9C275.2,595.9,275.2,595.9,275.2,595.9z"/>
+			<path class="st2" d="M275.4,593.1c-0.1-0.4-0.3-0.7-0.4-1.1c0.1,0.1,0.2,0.1,0.3,0C275.3,592.4,275.4,592.8,275.4,593.1z"/>
+			<path d="M274.8,595.2c0-0.2,0-0.5,0-0.7c0.1,0,0.1,0,0.2,0c0.1,0.1,0.2,0.1,0.3,0.2c0,0,0-0.1,0-0.2c0,0,0,0,0,0c0,0,0.1,0,0.1,0
+				c0,0,0,0,0,0.1c0,0,0,0,0.1,0c0,0.2,0,0.4,0,0.6c0,0-0.1,0-0.1,0c0,0,0,0,0,0.1c-0.1,0-0.3,0-0.5,0c0,0,0,0,0-0.1h0
+				C274.9,595.2,274.8,595.2,274.8,595.2z"/>
+			<path d="M274.8,595.3l0.1-0.1h0c0,0,0,0,0,0.1C274.9,595.3,274.9,595.3,274.8,595.3z"/>
+			<path class="st2" d="M274.9,591.7l-0.1,0.1c-0.1-0.1-0.1-0.2,0-0.3L274.9,591.7z"/>
+			<path class="st2" d="M274.8,594.5L274.8,594.5c0.1-0.1,0.1,0,0.2,0C274.9,594.5,274.9,594.5,274.8,594.5z"/>
+			<path d="M274.9,595.2l-0.1,0.1c0,0,0,0,0-0.1C274.8,595.2,274.9,595.2,274.9,595.2z"/>
+			<path class="st2" d="M274.3,595.1c0.2-0.2,0.3-0.4,0.5-0.7l0,0.1c0,0.2,0,0.4,0,0.7C274.7,595.1,274.5,595.1,274.3,595.1z"/>
+			<path d="M274.3,595.1c0.2,0,0.3,0,0.5,0.1c0,0,0,0,0,0.1c0,0,0.1,0,0.2,0c0.1,0.2,0.2,0.4,0.2,0.6c0,0,0,0,0,0
+				c-0.3,0-0.6,0.1-0.9,0.1c-0.1-0.1-0.2-0.2-0.2-0.2c-0.1-0.1-0.1-0.3,0-0.4C274.2,595.3,274.3,595.2,274.3,595.1z"/>
+			<path class="st2" d="M273.8,595.7l-0.2,0.1c0.2-0.2,0.4-0.3,0.5-0.5c-0.1,0.1-0.1,0.2,0,0.4L273.8,595.7z"/>
+			<path d="M274.3,596c-0.3,0.2-0.6,0.4-0.9,0.6c0.1-0.2,0.1-0.5,0.2-0.7v0l0.2-0.1l0.3,0C274.2,595.8,274.3,595.9,274.3,596z"/>
+			<polygon class="st2" points="273.6,595.8 273.6,595.8 273.6,595.8 			"/>
+			<path class="st2" d="M273.1,596.5c0.2-0.2,0.3-0.5,0.5-0.7h0c-0.1,0.2-0.1,0.5-0.2,0.7H273.1z"/>
+			<path class="st2" d="M273.4,594c-0.2,0.2-0.3,0.4-0.5,0.6c0-0.2,0-0.4,0-0.7C273.1,594,273.3,594,273.4,594z"/>
+			<path d="M272.4,593.5c0-0.4,0-0.8,0-1.1c0.4,0,0.7,0.1,1.1,0.1c0.1,0.1,0.1,0.2,0.2,0.3c0,0.3,0,0.7,0,1
+				c-0.1,0.1-0.1,0.2-0.2,0.2c-0.2,0-0.3-0.1-0.5-0.1c0,0,0,0,0-0.1c-0.1,0-0.1,0-0.2,0C272.7,593.7,272.5,593.6,272.4,593.5z"/>
+			<polygon points="273,594.6 273,594.6 273,594.6 			"/>
+			<path d="M273,593.9l-0.1,0c0,0,0,0,0,0C272.9,593.9,272.9,593.9,273,593.9z"/>
+			<path d="M273,593.9C273,593.9,273,593.9,273,593.9c0,0.1-0.1,0-0.1,0L273,593.9z"/>
+			<path class="st2" d="M272.4,592.4c0.2-0.3,0.4-0.5,0.7-0.8c0.2,0.3,0.3,0.6,0.5,0.9C273.1,592.4,272.7,592.4,272.4,592.4z"/>
+			<path d="M272.3,594l0.1-0.1c0,0,0,0,0,0c0.1,0,0.3,0,0.4,0c0,0,0,0,0,0c0,0,0.1,0,0.1,0c0,0.2,0,0.4,0,0.7l0,0
+				c-0.2,0-0.4,0-0.6,0c0,0,0,0,0-0.1c0,0,0,0-0.1,0C272.2,594.3,272.2,594.2,272.3,594C272.3,594,272.3,594,272.3,594z"/>
+			<path class="st2" d="M272.4,593.9L272.4,593.9l0-0.4c0.1,0.1,0.3,0.2,0.4,0.4C272.7,593.9,272.5,593.9,272.4,593.9z"/>
+			<path class="st2" d="M272.3,595.2c0-0.2,0-0.4,0-0.6c0.2,0,0.4,0,0.6,0C272.7,594.8,272.5,595,272.3,595.2z"/>
+			<path d="M272.3,595.2C272.3,595.2,272.3,595.2,272.3,595.2L272.3,595.2L272.3,595.2z"/>
+			<path d="M272.3,594.5C272.3,594.6,272.3,594.6,272.3,594.5C272.3,594.6,272.3,594.6,272.3,594.5L272.3,594.5z"/>
+			<path d="M272.4,593.9l-0.1,0.1l0-0.1C272.3,593.9,272.3,593.9,272.4,593.9z"/>
+			<path d="M272.2,594.5C272.3,594.5,272.3,594.5,272.2,594.5L272.2,594.5C272.2,594.6,272.2,594.6,272.2,594.5z"/>
+			<path d="M272.3,595.2L272.3,595.2c0,0-0.1,0-0.1,0C272.2,595.2,272.3,595.2,272.3,595.2z"/>
+			<path d="M272.2,594c0,0,0-0.1,0-0.1V594C272.3,594,272.3,594,272.2,594z"/>
+			<path class="st2" d="M271.6,594.5c0.2-0.2,0.4-0.3,0.6-0.5c0,0.2,0,0.3,0,0.5C272,594.5,271.8,594.5,271.6,594.5
+				C271.6,594.5,271.6,594.5,271.6,594.5z"/>
+			<path class="st2" d="M272.2,595.3c-0.2,0-0.4,0-0.6,0l0-0.1C271.8,595.2,272,595.3,272.2,595.3z"/>
+			<path d="M271.6,595.3c0.2,0,0.4,0,0.6,0c0,0,0.1,0,0.1,0c0,0,0,0,0,0c0.2-0.2,0.4-0.4,0.6-0.6h0v0c0.2-0.2,0.3-0.4,0.5-0.6
+				c0.1-0.1,0.1-0.2,0.2-0.2c0-0.3,0-0.7,0-1c-0.1-0.1-0.1-0.2-0.2-0.3c-0.2-0.3-0.3-0.6-0.5-0.9c0.2-0.5,0.4-1.1,0.6-1.6
+				c0.2,0,0.4,0,0.6,0c0.2,0.5,0.4,1,0.6,1.6c-0.1,0.1-0.1,0.2,0,0.3c0.1,0.1,0.1,0.2,0.2,0.2c0.1,0.4,0.3,0.7,0.4,1.1
+				c0.1,0.1,0.1,0.2,0.2,0.2c0,0.1,0.1,0.2,0,0.2c0,0.1-0.1,0.2-0.1,0.3c0,0-0.1,0-0.1,0v0c0,0.1,0,0.1,0,0.2c0,0.1-0.1,0.3-0.1,0.4
+				c0,0,0,0,0,0c-0.1,0-0.2,0-0.3,0c0,0-0.1-0.1-0.2-0.1c-0.2,0.2-0.3,0.5-0.5,0.7c-0.1,0.1-0.2,0.2-0.2,0.2
+				c-0.2,0.2-0.3,0.3-0.5,0.5l0,0c-0.2,0.2-0.3,0.5-0.5,0.7C272.6,596.2,272.1,595.8,271.6,595.3L271.6,595.3L271.6,595.3z"/>
+			<path d="M271.6,594.7c0,0,0-0.1,0-0.1c0.2,0,0.4,0,0.6,0c0,0,0,0,0,0.1c0,0,0,0,0.1,0c0,0.2,0,0.4,0,0.6l0,0c0,0-0.1,0-0.1,0
+				c-0.2,0-0.4,0-0.6,0C271.6,595.1,271.6,594.9,271.6,594.7L271.6,594.7z"/>
+			<path d="M271.7,588.7L271.7,588.7L271.7,588.7C271.6,588.7,271.6,588.7,271.7,588.7z"/>
+			<path class="st2" d="M271.7,588.7C271.6,588.7,271.6,588.7,271.7,588.7C271.6,588.7,271.6,588.7,271.7,588.7
+				C271.6,588.7,271.6,588.7,271.7,588.7z"/>
+			<path d="M271.6,588.8c0.2,0.2,0.5,0.4,0.7,0.6c-0.2,0-0.4,0-0.7,0l-0.2-0.2C271.4,589,271.4,588.8,271.6,588.8L271.6,588.8z"/>
+			<path class="st2" d="M271.6,594.5C271.6,594.5,271.6,594.5,271.6,594.5L271.6,594.5L271.6,594.5z"/>
+			<path d="M271.6,594.5c0,0,0,0.1,0,0.1C271.6,594.6,271.6,594.6,271.6,594.5L271.6,594.5z"/>
+			<path d="M271.4,588.2c0.1,0.2,0.1,0.3,0.2,0.5c-0.2,0-0.4,0-0.6,0C271.1,588.5,271.3,588.4,271.4,588.2z"/>
+			<path class="st2" d="M271.6,595.2L271.6,595.2L271.6,595.2C271.5,595.3,271.5,595.3,271.6,595.2c-0.1-0.1,0-0.3,0-0.6
+				C271.6,594.9,271.6,595.1,271.6,595.2z"/>
+			<path class="st2" d="M271.6,595.3L271.6,595.3L271.6,595.3C271.5,595.3,271.5,595.3,271.6,595.3z"/>
+			<path class="st2" d="M271,588.7c0.2,0,0.4,0,0.6,0c0,0,0,0,0,0c-0.2,0.1-0.2,0.3-0.1,0.5l-0.2,0l-0.2,0
+				C271.2,589,271.2,588.8,271,588.7C271,588.7,271,588.7,271,588.7z"/>
+			<path d="M271.3,589.2l0.2,0l0.2,0.2c0,0.2,0,0.4,0,0.6c-0.2-0.2-0.4-0.4-0.6-0.6l0.1-0.2L271.3,589.2z"/>
+			<path class="st2" d="M271,588.7C271,588.7,271,588.7,271,588.7C271,588.7,270.9,588.7,271,588.7C271,588.7,271,588.7,271,588.7z"
+				/>
+			<path d="M271,588.7L271,588.7L271,588.7C270.9,588.7,271,588.7,271,588.7z"/>
+			<path d="M271,588.7c0.2,0.1,0.2,0.3,0.1,0.5l-0.1,0.2c-0.2-0.2-0.4-0.5-0.6-0.7C270.6,588.7,270.8,588.7,271,588.7L271,588.7z"/>
+			<path d="M271.5,595.3c-1.2,0.2-2.3,0.4-3.5,0.6c-0.1-0.7-0.6-1.8-0.3-2.2c1.2-1.4,2.6-2.5,3.9-3.7c0-0.2,0-0.4,0-0.6
+				c0.2,0,0.4,0,0.7,0c0.4,0.2,0.8,0.4,1.3,0.6c-0.2,0.5-0.4,1.1-0.6,1.6c-0.2,0.3-0.4,0.5-0.7,0.8c0,0.4,0,0.7,0,1.1l0.1,0.3
+				l-0.1,0.1c0,0,0,0,0,0c0,0-0.1,0-0.1,0c0,0,0,0.1,0,0.1c-0.2,0.2-0.4,0.3-0.6,0.5l0,0.1c0,0,0,0.1,0,0.1v0
+				C271.6,594.9,271.5,595.1,271.5,595.3z"/>
+			<polygon class="st2" points="263.3,589.9 263.3,589.9 263.2,589.8 			"/>
+			<path class="st2" d="M263.3,589.8C263.3,589.8,263.3,589.9,263.3,589.8l-0.1,0C263.3,589.8,263.3,589.8,263.3,589.8z"/>
+			<path class="st2" d="M263.3,589.9C263.4,589.9,263.3,590,263.3,589.9c-0.1,0-0.1,0-0.1-0.1L263.3,589.9z"/>
+			<path class="st2" d="M263.2,590c0.1,0.4,0.1,0.8,0.2,1.2C263.4,590.8,263.3,590.4,263.2,590C263.2,590,263.2,590,263.2,590z"/>
+			<path d="M263.1,589c0,0,0.1,0.1,0.2,0.1v0h0C263.2,589.1,263.2,589,263.1,589z"/>
+			<path class="st2" d="M262.7,595.3c0.2,0.2,0.3,0.3,0.5,0.5c-0.1,0-0.1,0-0.2,0C262.9,595.6,262.8,595.5,262.7,595.3z"/>
+			<path class="st2" d="M263.1,595.8l-0.1,0c0,0,0,0-0.1-0.1C263,595.8,263.1,595.8,263.1,595.8z"/>
+			<path class="st2" d="M262.7,589.9c0.2-0.3,0.4-0.5,0.6-0.8h0c0,0.2,0,0.5,0,0.7c0,0-0.1,0-0.1,0c0,0,0,0.1,0,0.1v0c0,0,0,0,0,0
+				C263.1,589.9,262.9,589.8,262.7,589.9z"/>
+			<path class="st2" d="M262,593.8c0-0.8-0.1-1.6-0.2-2.4c0.2,0.7,0.5,1.5,0.7,2.2C262.3,593.7,262.1,593.8,262,593.8z"/>
+			<path d="M262.7,589.9c0.2-0.1,0.4,0,0.6,0.1c0.1,0.4,0.2,0.8,0.2,1.2c-0.4,0-0.7,0-1.1,0c0-0.4,0.1-0.7,0.1-1.1
+				C262.5,590.1,262.6,590,262.7,589.9z"/>
+			<path d="M261.1,595.3l0.2-0.2c0.3,0,0.7,0,1.1,0c0.1,0.1,0.2,0.2,0.2,0.2c0.1,0.2,0.2,0.3,0.3,0.5
+				C262.4,595.6,261.7,595.5,261.1,595.3z"/>
+			<path d="M262.5,593.7c-0.2-0.7-0.5-1.5-0.7-2.2c0.1-0.1,0.2-0.2,0.2-0.3l0.2-0.1l0.1,0.1c0.4,0,0.8,0,1.1,0
+				c-0.1-0.4-0.1-0.8-0.2-1.2v0c0,0,0.1-0.1,0.1-0.1v0c0,0,0-0.1,0-0.1c0.2-0.1,0.4-0.2,0.6-0.3l-0.1,0.1c2-1.2,4-2.4,6.5-1
+				c0.2,0.2,0.4,0.5,0.6,0.7c0.2,0.2,0.4,0.4,0.6,0.6c-1.3,1.2-2.8,2.4-3.9,3.7c-0.3,0.4,0.2,1.4,0.3,2.2c-1.7,2.9-3.3-0.6-4.9-0.1
+				l0.1,0c-0.2-0.2-0.3-0.3-0.5-0.5c-0.1-0.1-0.2-0.1-0.2-0.2c-0.1-0.1-0.1-0.2,0-0.3C262.5,594.4,262.5,594,262.5,593.7z"/>
+			<path d="M262.8,588.8c-0.9-0.6-1.6-0.6-2.2,0C261.2,588.2,261.9,588.2,262.8,588.8z"/>
+			<path d="M262.5,594.8c-0.2-0.3-0.4-0.6-0.6-0.8c0,0,0,0,0.1,0c0,0,0-0.1,0-0.1c0.2-0.1,0.3-0.1,0.5-0.2
+				C262.5,594,262.5,594.4,262.5,594.8z"/>
+			<path class="st2" d="M262,591.2c0-0.4-0.1-0.7-0.1-1.1c0,0,0,0,0.1,0h0c0.1,0.2,0.3,0.2,0.5,0.1c0,0.4-0.1,0.7-0.1,1.1l-0.1-0.1
+				L262,591.2z"/>
+			<path d="M261.8,593.9l0.1,0.1C262,594,261.9,594,261.8,593.9C261.9,593.9,261.9,593.9,261.8,593.9z"/>
+			<path d="M261.8,593.9c0,0,0.1,0,0.1,0c0,0,0,0.1,0,0.1L261.8,593.9z"/>
+			<path class="st2" d="M261.9,590C261.9,590,261.9,590,261.9,590C261.9,590,261.9,590,261.9,590C261.9,590,261.9,590,261.9,590z"/>
+			<path class="st2" d="M261.9,590c-0.2,0-0.4,0-0.6,0l0.1,0c0,0,0,0-0.1,0c0.2-0.2,0.3-0.3,0.5-0.5
+				C261.8,589.7,261.8,589.9,261.9,590L261.9,590C261.9,590,261.9,590,261.9,590C261.9,590,261.9,590,261.9,590z"/>
+			<path class="st2" d="M261.3,590L261.3,590L261.3,590C261.3,590,261.3,590,261.3,590z"/>
+			<path d="M260,590c0.2-0.6,0.4-1,0.7-1.2c0.6-0.6,1.3-0.5,2.2,0c0.1,0,0.2,0.1,0.3,0.2c0,0,0.1,0.1,0.2,0.1
+				c-0.2,0.2-0.4,0.5-0.6,0.8c-0.1,0.1-0.1,0.2-0.2,0.2c-0.2,0.1-0.4,0.1-0.5-0.1c-0.1-0.2-0.2-0.3-0.2-0.5
+				c-0.2,0.2-0.3,0.3-0.5,0.5C260.8,590,260.4,590,260,590z"/>
+			<path d="M260.4,595.3c0-0.2,0.1-0.4,0.2-0.6c0.2,0.2,0.5,0.3,0.8,0.5l-0.2,0.2C260.9,595.3,260.7,595.3,260.4,595.3z"/>
+			<path class="st2" d="M261.4,595.1c-0.3-0.2-0.5-0.3-0.8-0.5c0,0,0-0.1,0-0.1c0.1-0.1,0.2-0.3,0.1-0.5c0.4,0,0.8,0,1.2-0.1
+				c0.2,0.3,0.4,0.6,0.6,0.8c-0.1,0.1-0.1,0.2,0,0.3C262.1,595.1,261.7,595.1,261.4,595.1z"/>
+			<path class="st2" d="M260.6,594.5C260.6,594.6,260.6,594.6,260.6,594.5L260.6,594.5C260.6,594.6,260.6,594.6,260.6,594.5z"/>
+			<path class="st2" d="M260.6,594.6C260.6,594.6,260.6,594.5,260.6,594.6C260.6,594.6,260.6,594.6,260.6,594.6
+				C260.6,594.6,260.6,594.6,260.6,594.6z"/>
+			<path class="st2" d="M260.6,594.6c0,0.2-0.1,0.4-0.2,0.6h-0.3C260.3,595,260.4,594.8,260.6,594.6L260.6,594.6z"/>
+			<path class="st2" d="M260.1,592.7c0.1,0.4,0.3,0.7,0.4,1.1c-0.4,0-0.8,0.1-1.2,0.1c0-0.2,0-0.4,0-0.6
+				C259.6,593.1,259.8,592.9,260.1,592.7z"/>
+			<path d="M260,590C260,590,259.9,590.1,260,590L260,590C259.9,590,259.9,590,260,590z"/>
+			<path d="M259.3,592.6l0.2-0.1l0.3,0.1l0.2,0.2c-0.3,0.2-0.5,0.4-0.8,0.6C259.3,593.1,259.3,592.8,259.3,592.6L259.3,592.6z"/>
+			<path d="M260.1,595.3c-1.7,0.4-1.3-0.5-0.8-1.4c0.4,0,0.8-0.1,1.2-0.1c0.1,0.1,0.2,0.2,0.2,0.2c0.1,0.2,0,0.4-0.1,0.5
+				c0,0,0,0-0.1,0.1c0,0,0,0,0,0C260.4,594.8,260.3,595,260.1,595.3z"/>
+			<path class="st2" d="M259.4,592.1c0.1,0.2,0.2,0.3,0.4,0.4l-0.3-0.1l-0.2,0.1C259.5,592.5,259.5,592.3,259.4,592.1z"/>
+			<path class="st2" d="M258.8,591.4c0.2,0.1,0.3,0.2,0.4,0.4C259,591.8,258.9,591.6,258.8,591.4z"/>
+			<path d="M258.6,589.8c0.4,0.1,0.9,0.2,1.3,0.3c0,0,0,0,0-0.1h0c0.4,0,0.8,0,1.3,0l0,0c0.2,0,0.4,0,0.6,0c0,0.4,0.1,0.8,0.1,1.1
+				c-0.1,0.1-0.1,0.2-0.2,0.3c0.1,0.8,0.1,1.6,0.2,2.4c0,0-0.1,0-0.1,0c0,0,0,0,0.1,0.1c-0.4,0-0.8,0-1.2,0.1
+				c-0.1-0.1-0.2-0.2-0.2-0.2c-0.1-0.4-0.3-0.7-0.4-1.1l-0.2-0.2c-0.2-0.1-0.3-0.2-0.4-0.4c-0.1-0.1-0.2-0.2-0.2-0.2
+				c-0.1-0.2-0.2-0.3-0.4-0.4c-0.1-0.1-0.2-0.2-0.2-0.2c0-0.1-0.1-0.2,0-0.2c0-0.1,0.1-0.2,0.1-0.3c0,0,0.1,0,0.1,0
+				c0-0.2,0-0.5,0-0.7L258.6,589.8z"/>
+			<path d="M258.6,590.6l0.1,0.1c0,0-0.1,0-0.1,0C258.6,590.7,258.6,590.6,258.6,590.6z"/>
+			<path d="M258.7,590c0,0.2,0,0.5,0,0.7l-0.1-0.1C258.6,590.4,258.6,590.2,258.7,590C258.6,590,258.7,590,258.7,590z"/>
+			<path d="M258,590.7c0.2-0.2,0.4-0.4,0.6-0.6c0,0.2,0,0.3,0,0.5c0,0,0,0.1,0,0.1C258.4,590.7,258.2,590.7,258,590.7z"/>
+			<path class="st2" d="M258.6,589.8l0,0.2c0,0-0.1,0.1-0.1,0.1C258.6,590,258.6,589.9,258.6,589.8L258.6,589.8z"/>
+			<path class="st2" d="M258.6,590.1c-0.2,0.2-0.4,0.4-0.6,0.6c-0.4-0.5-0.7-0.9-1.1-1.4c0.6,0.1,1.2,0.3,1.7,0.4
+				C258.6,589.9,258.6,590,258.6,590.1z"/>
+			<path class="st2" d="M258.5,591.2c-0.2-0.2-0.4-0.3-0.6-0.5l0,0c0.2,0,0.4,0,0.6,0c0,0.1-0.1,0.2-0.1,0.3
+				C258.5,591,258.5,591.1,258.5,591.2z"/>
+			<path d="M256.7,591.2l0,0.1C256.7,591.3,256.7,591.3,256.7,591.2C256.7,591.3,256.7,591.3,256.7,591.2z"/>
+			<path d="M256.1,590.7C256.1,590.7,256.1,590.7,256.1,590.7L256.1,590.7C256,590.7,256,590.7,256.1,590.7z"/>
+			<path d="M259.4,592.1c0.1,0.2,0.1,0.4-0.1,0.5c-0.9-0.5-1.8-0.9-2.6-1.4c0,0,0,0,0,0c-0.2-0.2-0.4-0.4-0.6-0.6c0,0,0,0,0,0
+				c-0.1-0.5-0.2-1-0.3-1.4c0.4,0,0.7,0.1,1.1,0.1c0.4,0.5,0.7,0.9,1.1,1.4l0,0c0.2,0.2,0.4,0.3,0.6,0.5c0.1,0.1,0.2,0.2,0.2,0.2
+				c0.1,0.2,0.2,0.3,0.4,0.4C259.3,591.9,259.3,592,259.4,592.1z"/>
+			<path class="st2" d="M255.7,589.2c0.1,0.5,0.2,0.9,0.3,1.4C255.9,590.2,255.8,589.7,255.7,589.2
+				C255.7,589.2,255.7,589.2,255.7,589.2z"/>
+			<path class="st2" d="M255.7,589.2C255.7,589.2,255.7,589.2,255.7,589.2L255.7,589.2L255.7,589.2z"/>
+			<path d="M256.7,591.3c-0.3,2.2-1.8,0-2.6,0.7c-0.2-0.2-0.4-0.4-0.6-0.6c0.2-0.7,0.3-1.3,0.5-2c0.6,0,1.1-0.1,1.7-0.1
+				c0.1,0.5,0.2,0.9,0.4,1.4c0,0,0,0,0,0c0,0,0,0,0,0l0,0.1c0,0,0,0,0-0.1C256.3,590.9,256.5,591.1,256.7,591.3z"/>
+			<path class="st2" d="M253.4,591.9c0-0.2,0-0.4,0-0.7l0,0c0,0,0,0,0,0c0.2,0.2,0.4,0.4,0.6,0.6C253.9,592,253.6,592,253.4,591.9z"
+				/>
+			<path class="st2" d="M253.4,591.3c-0.2-0.4-0.4-0.9-0.6-1.3v0c0.2-0.2,0.5-0.4,0.8-0.7c0.1,0,0.3,0,0.4,0
+				C253.8,590,253.6,590.7,253.4,591.3C253.5,591.3,253.5,591.3,253.4,591.3L253.4,591.3z"/>
+			<path d="M253.4,591.3L253.4,591.3L253.4,591.3z"/>
+			<path class="st2" d="M252.8,590C252.8,590,252.8,590.1,252.8,590L252.8,590C252.8,590,252.8,590,252.8,590z"/>
+			<path class="st2" d="M251.9,589.9L251.9,589.9C251.9,590,251.9,590,251.9,589.9C251.9,590,251.9,590,251.9,589.9z"/>
+			<path d="M252.8,590c0.2,0.4,0.4,0.9,0.6,1.3c0,0.2,0,0.4,0,0.7c-0.4-0.3-0.9-0.6-1.3-0.9c-0.1-0.1-0.2-0.2-0.3-0.2
+				c0,0-0.1-0.1-0.1-0.1c0-0.1,0.1-0.3,0.1-0.4c0-0.1,0.1-0.2,0.1-0.3l0-0.1C252.2,589.9,252.5,590,252.8,590L252.8,590
+				C252.8,590.1,252.8,590,252.8,590z"/>
+			<path d="M251.8,590.3c0-0.1,0-0.2,0.1-0.3c0,0,0,0,0,0C251.8,590.1,251.8,590.2,251.8,590.3z"/>
+			<path d="M251.8,590c0,0.1-0.1,0.2-0.1,0.3c-0.1,0.2-0.1,0.3-0.2,0.5c-0.2-0.2-0.3-0.4-0.5-0.5C251.3,590.1,251.6,590.1,251.8,590
+				z"/>
+			<path d="M251.8,590.8c0.1,0.1,0.2,0.1,0.3,0.2C252,590.9,251.9,590.9,251.8,590.8z"/>
+			<path class="st2" d="M251.8,590.3c-0.1,0.1-0.1,0.3-0.1,0.4l-0.1,0C251.6,590.6,251.7,590.4,251.8,590.3z"/>
+		</g>
+	</g>
+	<polygon class="st1" points="75.5,642.5 74.2,640.9 107.9,612.1 109.3,613.7 	"/>
+</g>
+</svg>
--- a/src/assets/images/byline.ar.png
+++ b/src/assets/images/byline.ar.png
--- a/src/assets/images/counter.png
+++ b/src/assets/images/counter.png
--- a/src/assets/images/img1.png
+++ b/src/assets/images/img1.png
--- a/src/assets/images/img2.png
+++ b/src/assets/images/img2.png
--- a/src/assets/images/img3.png
+++ b/src/assets/images/img3.png
--- a/src/assets/images/img4.png
+++ b/src/assets/images/img4.png
--- a/src/assets/images/img5.png
+++ b/src/assets/images/img5.png
--- a/src/assets/images/logo.png
+++ b/src/assets/images/logo.png
--- a/src/assets/images/search.png
+++ b/src/assets/images/search.png
--- a/src/assets/images/search.svg
+++ b/src/assets/images/search.svg
@ -0,0 +1,16 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 21.0.2, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 64.5 64" style="enable-background:new 0 0 64.5 64;" xml:space="preserve">
+<g id="XMLID_12_">
+	<g>
+		<g id="XMLID_14_">
+			<g>
+				<path d="M56,63.7L40.9,48.5c-4.1,2.7-9.1,4.3-14.5,4.3C11.8,52.8,0,41,0,26.4C0,11.8,11.8,0,26.4,0C41,0,52.8,11.8,52.8,26.4
+					c0,5.1-1.4,9.9-3.9,13.9l15.2,15.3c0.8,0.8,0.1,2.7-1.5,4.4l-2.3,2.3C58.8,63.8,56.8,64.5,56,63.7z M44,26.4
+					c0-9.7-7.9-17.6-17.6-17.6c-9.7,0-17.6,7.9-17.6,17.6c0,9.7,7.9,17.7,17.6,17.7C36.1,44.1,44,36.1,44,26.4z"/>
+			</g>
+		</g>
+	</g>
+</g>
+</svg>
--- a/src/assets/images/video.jpg
+++ b/src/assets/images/video.jpg
--- a/src/components/Footer.js
+++ b/src/components/Footer.js
@ -0,0 +1,13 @@
+import React from 'react';
+class Footer extends React.Component{
+render(){
+  return(
+   <footer>
+     <span className="arabic-text"> ‫جميع الحقوق محفوظة لمؤسسة مٌصرين‬</span>
+
+     <span className="english-text">&nbsp; all rights reserved</span>
+   </footer>
+  )
+}
+}
+export default  (Footer);
--- a/src/components/Header.js
+++ b/src/components/Header.js
@ -0,0 +1,33 @@
+import React from 'react';
+import '../stylesheets/style.scss'
+import {Link} from 'react-router-dom';
+
+class Header extends React.Component {
+  render() {
+    const Logo = () => {
+      return (
+        <section className="logo-container">
+          <Link to="/">
+            <img className="site-logo" src={require('../assets/images/Logo.svg')} alt="logo 858 "/>
+            {/*<h1>An archive of resistance</h1>*/}
+          </Link>
+        </section>
+      );
+    }
+    const Counter = () => {
+      return (
+        <div className="counter-container">
+          <img src={require('../assets/images/Counter.svg') } alt="counter"/>
+        </div>
+      );
+    }
+    return (
+      <header>
+        <Logo/>
+        <Counter/>
+      </header>
+    )
+  }
+}
+
+export default (Header);
--- a/src/components/Loading.js
+++ b/src/components/Loading.js
@ -0,0 +1,13 @@
+import React from 'react';
+class Loading extends React.Component{
+	render(){
+	  return(
+	   <div className="loading">
+	   	<span></span>
+	   	<span></span>
+	   	<span></span>
+	   </div>
+	  )
+	}
+}
+export default Loading;
--- a/src/components/Nav.js
+++ b/src/components/Nav.js
@ -0,0 +1,49 @@
+import React from 'react';
+
+class Nav extends React.Component {
+  render() {
+    return (
+      <nav className={"nav-footer"}>
+        <ul>
+          <li>
+            <a href="/contact">
+              <span className="arabic-text">اتصل بنا</span>
+              <br/>
+              <span className="english-text"> contact us</span>
+            </a>
+          </li>
+          <li>
+            <a href="">
+              <span className="arabic-text">دليل توجيهي</span>
+              <br/>
+              <span className="english-text"> tutorials</span>
+            </a>
+          </li>
+          <li>
+            <a href="/">
+              <span className="arabic-text">الرئيسية</span>
+              <br/>
+              <span className="english-text"> main</span>
+            </a>
+          </li>
+          <li>
+            <a href="https://858.ma/">
+              <span className="arabic-text">الأرشيف</span>
+              <br/>
+              <span className="english-text"> the archive</span>
+            </a>
+          </li>
+          <li>
+            <a href="/about">
+              <span className="arabic-text">ماهذا الشيء</span>
+              <br/>
+              <span className="english-text"> what is this</span>
+            </a>
+          </li>
+        </ul>
+      </nav>
+    )
+  }
+}
+
+export default (Nav);
--- a/src/components/RandomDate.js
+++ b/src/components/RandomDate.js
@ -0,0 +1,75 @@
+import Grid from 'react-css-grid'
+import React from 'react';
+import PropTypes from 'prop-types';
+import VideoItem from "./VideoItem";
+import RandomItemTitle from "./SectionHeading";
+import { Link } from 'react-router-dom';
+
+class RandomDate extends React.Component {
+
+  shuffleDate() {
+    this.props.getRandomDateVideos(this.props.allDates);
+  }
+
+  render() {
+    return (
+      <section className="random-item-container">
+        <h2 className="section-heading">
+
+          <span className="arabic-text random-section-title"> يوم من أيام الارشيف</span>
+          <br />
+          <span className="section-title">
+            <span className='english-text bold-english-text random-section-title'> Dates from the archive
+        </span>
+          </span>
+        </h2>
+        <Grid
+          width={450}
+        >
+          {/* View all dates button*/}
+          <Link className="view-items-link" to="/dates">
+            <button className="view-all-items">
+              <span className={"highlighted-text"}>
+                <span className="english-text"> all dates    &nbsp; </span>
+                <span className="arabic-text"> 	 جميع الأيام	</span>
+              </span>
+            </button>
+          </Link>
+          {/* Shuffle button */}
+          <button className="shuffle-button" onClick={this.shuffleDate.bind(this)}>
+
+            <span className={"highlighted-text"}>
+              <span className="english-text">Shuffle Dates - </span>
+              <span className="arabic-text"> مكان عشوائي </span>
+            </span>
+            <i className="fa fa-random"></i>
+          </button>
+        </Grid>
+
+        <Grid className="random-dates"
+          width={220}
+          gap={12}>
+          {/*{this.props.videos.map(video =>*/}
+          {/*<VideoItem id={video.id} key={video.id} title={video.title}/>*/}
+          {/*)}*/}
+        </Grid>
+        <RandomItemTitle title={this.props.dateName}
+          count={this.props.dateCount}
+          src={'/results/date/' + this.props.dateName}
+        />
+      </section>
+
+    )
+  }
+}
+
+RandomDate.propTypes = {
+  dateName: PropTypes.string,
+  allDates: PropTypes.array,
+  videos: PropTypes.array,
+  loading: PropTypes.bool,
+  dateCount: PropTypes.number,
+  getRandomDateVideos: PropTypes.func
+};
+
+export default (RandomDate);
--- a/src/components/RandomPlace.js
+++ b/src/components/RandomPlace.js
@ -0,0 +1,95 @@
+import Grid from 'react-css-grid'
+import React from 'react';
+import PropTypes from 'prop-types';
+import { getStaticMapURL } from '../utils/mapbox';
+import VideoItem from "./VideoItem";
+import RandomItemTitle from "./SectionHeading";
+import {Link} from 'react-router-dom';
+import {Container, Row, Col} from 'react-bootstrap';
+
+class RandomPlace extends React.Component {
+
+  shufflePlace() {
+    this.props.getRandomPlaceVideos();
+  }
+
+  getStaticMapURL() {
+    return getStaticMapURL(this.props.place);
+  }
+
+  render() {
+    console.log('random place props', this.props);
+    return (
+      <section className="random-item-container">
+        <h2 className="section-heading">
+          <span className="arabic-text random-section-title">من أماكن الارشيف</span>
+          <br/>
+          <span className="section-title">
+          <span className='english-text bold-english-text random-section-title'> Places from the archive
+        </span>
+          </span>
+        </h2>
+        <Grid width={450}>
+          {/* View all places button*/}
+          <Link className="view-items-link" to="/places">
+            <button className="view-all-items">
+              <span className={"highlighted-text"}>
+                <span className="english-text"> all places    &nbsp; </span>
+               <   span className="arabic-text"> 	 جميع الأماكن	</span>
+                </span>
+            </button>
+          </Link>
+          {/* Shuffle button */}
+          <button className="shuffle-button" onClick={this.shufflePlace.bind(this)}>
+            <span className={"highlighted-text"}>
+            <span className="english-text">Shuffle Places - </span>
+            <span className="arabic-text"> مكان عشوائي </span>
+            </span>
+            <i className="fa fa-random"></i>
+          </button>
+        </Grid>
+
+        <Container>
+          <Row>
+            <Col sm={4} >
+              {this.props.place && (
+                  <img class={"place-map"} src={this.getStaticMapURL()} />
+              )}
+            </Col>
+            <Col sm={8} >
+              <Container>
+            <Row>
+              {this.props.videos.map(video =>
+                  <Col sm={4}>
+                     <VideoItem id={video.id} key={video.id} title={video.title}/>
+                  </Col>
+              )}
+            </Row>
+              </Container>
+            </Col>
+          </Row>
+        </Container>
+
+        {this.props.placeName && (
+          <RandomItemTitle 
+            title={this.props.placeName}
+            count={this.props.placeCount}
+            src={'/results/place/' + this.props.placeName}
+          />
+        )}
+      </section>
+
+    )
+  }
+}
+
+RandomPlace.propTypes = {
+  placeName: PropTypes.string,
+  allPlaces: PropTypes.array,
+  videos: PropTypes.array,
+  loading: PropTypes.bool,
+  placeCount: PropTypes.number,
+  getRandomPlaceVideos: PropTypes.func
+};
+
+export default (RandomPlace);
--- a/src/components/RandomTopic.js
+++ b/src/components/RandomTopic.js
@ -0,0 +1,79 @@
+import Grid from 'react-css-grid'
+import React from 'react';
+import PropTypes from 'prop-types';
+import VideoItem from "./VideoItem";
+import RandomItemTitle from "./SectionHeading";
+import { Link } from 'react-router-dom';
+
+// Refactor
+class RandomTopic extends React.Component {
+
+  shuffleTopic() {
+    this.props.getRandomTopicVideos(this.props.allTopics);
+  }
+
+  render() {
+    return (
+      <section className="random-item-container">
+        <h2 className="section-heading">
+          <span className="arabic-text random-section-title">من مواضيع الارشيف</span>
+          <br />
+          {/*<span className="english-text bold-english-text">topics from the Archive   </span>*/}
+          <span className="section-title">
+            <span className='english-text bold-english-text random-section-title'> topics from the archive
+        </span>
+          </span>
+        </h2>
+
+        <Grid
+          className={"buttons-grid"}
+          width={450}
+        >
+          {/* View all topics button*/}
+          <Link className="view-items-link" to="/topics">
+            <button className="view-all-items">
+              <span className="highlighted-text">
+                <span className="english-text"> all topics    &nbsp; </span>
+                <span className="arabic-text"> 	 جميع المواضيع	</span>
+              </span>
+            </button>
+          </Link>
+          {/* Shuffle button */}
+
+          <button className="shuffle-button" onClick={this.shuffleTopic.bind(this)}>
+            <span className="highlighted-text">
+              <span className="arabic-text"> موضوع عشوائي </span>
+              <span className="english-text">&nbsp; shuffle topics  </span>
+            </span>
+            &nbsp;
+            <i className="fa fa-random"></i>
+          </button>
+        </Grid>
+
+        <Grid className="random-topics"
+          width={220}
+          gap={12}>
+          {this.props.videos.map(video =>
+            <VideoItem id={video.id} key={video.id} title={video.title} />
+          )}
+        </Grid>
+        <RandomItemTitle title={this.props.topicName}
+          count={this.props.topicCount}
+          src={'/results/topic/' + this.props.topicName}
+        />
+      </section>
+
+    )
+  }
+}
+
+RandomTopic.propTypes = {
+  topicName: PropTypes.string,
+  allTopics: PropTypes.array,
+  videos: PropTypes.array,
+  loading: PropTypes.bool,
+  topicCount: PropTypes.number,
+  getRandomTopicVideos: PropTypes.func
+};
+
+export default (RandomTopic);
--- a/src/components/RelatedVideos.js
+++ b/src/components/RelatedVideos.js
@ -0,0 +1,50 @@
+import Grid from 'react-css-grid'
+import React from 'react';
+import PropTypes from 'prop-types';
+import VideoItem from "./VideoItem";
+import RandomItemTitle from "./SectionHeading";
+import {Link} from 'react-router-dom';
+class RandomTopic extends React.Component {
+
+  shuffleTopic() {
+    this.props.getRandomTopicVideos(this.props.allTopics);
+  }
+
+  render() {
+    return (
+      <section>
+        <h2 className="section-subheading">Related Videos</h2>
+        <Grid
+          width={450}
+        >
+          {/* Shuffle button */}
+          <button className="shuffle-button" onClick={this.shuffleTopic.bind(this)}>
+            <span className="english-text">Shuffle Videos - </span>
+            <span className="arabic-text"> ضربة حظ </span>
+            <i className="fa fa-random"></i>
+          </button>
+        </Grid>
+
+        <Grid className="random-topics"
+              width={220}
+              gap={12}>
+          {this.props.videos.map(video =>
+            <VideoItem id={video.id} key={video.id} title={video.title}/>
+          )}
+        </Grid>
+      </section>
+
+    )
+  }
+}
+
+RandomTopic.propTypes = {
+  topicName: PropTypes.string,
+  allTopics: PropTypes.array,
+  videos: PropTypes.array,
+  loading: PropTypes.bool,
+  topicCount: PropTypes.number,
+  getRandomTopicVideos: PropTypes.func
+};
+
+export default (RandomTopic);
--- a/src/components/Search.js
+++ b/src/components/Search.js
@ -0,0 +1,25 @@
+import React from 'react';
+
+class Search extends React.Component {
+  render() {
+    return (
+      <form action="">
+        <button className="search-button" type='submit'>
+          <img src={require('../assets/images/search.svg')} alt=""/>
+        </button>
+        {/*<div className="search-box">*/}
+          {/*<input type="text" required/>*/}
+            {/*<div className="placeholder">*/}
+              {/*<span className="english-text">Search</span>*/}
+              {/*<span className="arabic-text">بحث في الأرشيف - </span>*/}
+            {/*</div>*/}
+        {/*</div>*/}
+
+        {/* TODO: apply the font for search the archive */}
+        <input type="text" className="search-box" name="search-box" placeholder="search the Archive   بحث في الأرشيف"/>
+      </form>
+    )
+  }
+}
+
+export default (Search);
--- a/src/components/SectionHeading.js
+++ b/src/components/SectionHeading.js
@ -0,0 +1,19 @@
+import React from 'react';
+
+/**
+ * a section heading is any heading that needs the style of having a horizontal line underneath it.
+ * it could be the Topics Heading/Title, Date..etc.
+ */
+class SectionHeading extends React.Component {
+  render() {
+    return (
+      <h3 className="section-title">
+        <span>
+          <a className="normal-link highlighted-link" href={this.props.src}> {this.props.title} /{this.props.count}/</a>
+        </span>
+      </h3>
+    )
+  }
+}
+
+export default (SectionHeading);
--- a/src/components/TopicsList.js
+++ b/src/components/TopicsList.js
@ -0,0 +1,62 @@
+import React from 'react';
+import {Link} from 'react-router-dom';
+import Grid from "react-css-grid";
+
+class TopicsList extends React.Component {
+  constructor() {
+    super();
+    this.state = {
+      currentFilter: "",
+      filteredTopics: [],
+    }
+  }
+
+  componentDidMount() {
+    this.setState({
+      filteredTopics: this.props.allTopics
+    })
+  }
+
+  filterTopics(event) {
+    // find the topics that contain that string
+    // return filtered topics.
+    // this.
+    const input = event.target.value.toLowerCase();
+    this.setState({
+      filteredTopics: this.props.allTopics.filter(topic => topic.name.toLowerCase().indexOf(input) !== -1)
+    })
+  }
+
+  render() {
+    return (
+      <main className="topics-list">
+        <section className="filter-box">
+          <label className="label english-text" htmlFor="search-topics">
+            <i className="fa fa-filter">&nbsp;</i>
+            <span className="english-text">Filter Topics &nbsp;</span>
+            <span className="arabic-text"> تنقية المواضيع: </span>
+            <input type="text" id="search-topics" ref="filter-element" onChange={event => this.filterTopics(event)}/>
+          </label>
+        </section>
+        <Grid className="random-topics"
+              width={220}
+              gap={12}>
+          {this.state.filteredTopics.map(topic => {
+              return (
+                <section className="topic-item" key={topic.name}>
+                  <Link to={"/results/topic/" + topic.name}>
+                    <h3 className="english-text">{topic.name} ({topic.items} videos)</h3>
+                  </Link>
+                </section>
+              )
+            }
+          )}
+        </Grid>
+
+      </main>
+    )
+  }
+}
+
+
+export default TopicsList;
--- a/src/components/VideoItem.js
+++ b/src/components/VideoItem.js
@ -0,0 +1,26 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Link } from 'react-router-dom';
+import { getThumbnail } from '../utils/video';
+class VideoItem extends React.Component {
+
+  render() {
+    const videoLink = `/videos/${this.props.id}`;
+    return (
+      <Link to={ videoLink }>
+        <section className="video-item">
+          <section className="video-thumbnail-container">
+            <img className="video-thumbnail" src={ getThumbnail(this.props.id) } alt=""/>
+          </section>
+          <h3 className="video-title">{ this.props.title }</h3>
+        </section>
+      </Link>
+    )
+  }
+}
+
+VideoItem.propTypes = {
+  id: PropTypes.string,
+  title: PropTypes.string,
+}
+export default (VideoItem);
--- a/src/components/VideoPlayer.js
+++ b/src/components/VideoPlayer.js
@ -0,0 +1,70 @@
+import React from 'react';
+import {getVideo} from '../utils/video';
+import {Player} from 'video-react';
+import RelatedVideos from "./RelatedVideos";
+import {getAllTopics, getRandomTopicVideos} from "../actions/topics";
+import connect from "react-redux/es/connect/connect";
+
+class VideoPlayer extends React.Component {
+  componentDidMount() {
+    if (this.props.allTopics && this.props.allTopics.length > 0 && !this.props.randomTopic) {
+      this.props.getRandomTopicVideos(this.props.allTopics);
+    } else {
+      this.props.getAllTopics();
+    }
+  }
+
+  componentWillReceiveProps(nextProps) {
+    // This is slightly awkward - we need to check that we have all topics,
+    // But don't have a random topic yet (or at not already loading a random topic)
+    if ((this.props.allTopics || nextProps.allTopics) && !this.props.loadingRandomTopic && !nextProps.loadingRandomTopic && !this.props.randomTopic) {
+      this.props.getRandomTopicVideos(nextProps.allTopics);
+    }
+  }
+
+  render() {
+    return (
+      <section>
+        <Player src={getVideo(this.props.id)} controls>
+        </Player>
+        <h2 className='video-player-title'>{this.props.title}</h2>
+        <h3 className="video-player-date text-left">date {this.props.date} </h3>
+        <p className="text-left">{this.props.description}</p>
+        <RelatedVideos
+          topicName={this.props.randomTopic || ''}
+          allTopics={this.props.allTopics || []}
+          topicCount={this.props.randomTopicCount}
+          videos={this.props.randomTopicVideos || []}
+          loading={this.props.loadingAllTopics || this.props.loadingRandomTopic}
+          getRandomTopicVideos={this.props.getRandomTopicVideos}
+        />
+      </section>
+
+    )
+  }
+}
+
+//
+// VideoPlayer.propTypes = {
+//   title: PropTypes.string,
+//   date: PropTypes.string,
+//   description: PropTypes.string
+// };
+
+
+const mapStateToProps = state => ({
+  allTopics: state.topics.allTopics,
+  loadingAllTopics: state.topics.loadingAllTopics,
+  randomTopic: state.topics.randomTopic,
+  randomTopicCount: state.topics.randomTopicCount,
+  loadingRandomTopic: state.topics.loadingRandomTopic,
+  randomTopicVideos: state.topics.randomTopicVideos
+});
+
+const mapDispatchToProps = dispatch => ({
+  getAllTopics: () => dispatch(getAllTopics()),
+  getRandomTopicVideos: allTopics => dispatch(getRandomTopicVideos(allTopics))
+});
+
+
+export default connect(mapStateToProps, mapDispatchToProps)(VideoPlayer);
--- a/src/config.js
+++ b/src/config.js
@ -1,3 +1,6 @@
 export default {
-    apiUrl: 'https://858.ma/api'
+  baseUrl: 'https://858.ma',
+  videoBase: 'https://video22.858.ma',
+  apiUrl: 'https://858.ma/api',
+  mapboxKey: 'pk.eyJ1Ijoic2FuamF5YiIsImEiOiI3NjVvMFY0In0.byn_eCZGAwR1yaPeC-SVKw'
 };
--- a/src/containers/About.js
+++ b/src/containers/About.js
@ -0,0 +1,23 @@
+import React from 'react';
+import Grid from 'react-css-grid'
+
+class About extends React.Component {
+
+  render() {
+    return (
+      <div>
+
+        <Grid>
+          <div>
+          Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.        </div>
+          <div>
+            second Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
+          </div>
+        </Grid>
+      </div>
+    );
+  }
+}
+
+
+export default (About);
--- a/src/containers/Home.js
+++ b/src/containers/Home.js
@ -1,59 +1,79 @@
 import React from 'react';
 import {connect} from 'react-redux';
-import testAction from '../actions/test';
-import fetchVideos from '../actions/fetchVideos';
-import Search from '../subComponents/Search';
-import Footer from '../subComponents/Footer';
-import RandomLocation from "../subComponents/RandomLocation";
-import RandomDate from "../subComponents/RandomDate";
-import RandomTopic from "../subComponents/RandomTopic";
-import Header from "../subComponents/Header";
+import {getAllTopics, getRandomTopicVideos} from '../actions/topics';
+import {getAllPlaces, getRandomPlaceVideos} from '../actions/places';
+import RandomPlace from "../components/RandomPlace";
+import RandomDate from "../components/RandomDate";
+import RandomTopic from "../components/RandomTopic";
+
 class Home extends React.Component {
-  clickBtn() {
-    this.props.testAction('some new value');
+  componentDidMount() {
+    if (this.props.allTopics && this.props.allTopics.length > 0 && !this.props.randomTopic) {
+      this.props.getRandomTopicVideos(this.props.allTopics);
+    } else {
+      this.props.getAllTopics();
+    }
+    this.props.getRandomPlaceVideos();
+  }
+
+  componentWillReceiveProps(nextProps) {
+    // This is slightly awkward - we need to check that we have all topics,
+    // But don't have a random topic yet (or at not already loading a random topic)
+    if ((this.props.allTopics || nextProps.allTopics) && !this.props.loadingRandomTopic && !nextProps.loadingRandomTopic && !this.props.randomTopic) {
+      this.props.getRandomTopicVideos(nextProps.allTopics);
+    }
  }

  render() {
    return (
      <div>
-        <Header/>
-        <Search/>
-        <RandomTopic/>
-        <RandomLocation/>
+        <RandomTopic
+          topicName={this.props.randomTopic || ''}
+          allTopics={this.props.allTopics || []}
+          topicCount={this.props.randomTopicCount}
+          videos={this.props.randomTopicVideos || []}
+          loading={this.props.loadingAllTopics || this.props.loadingRandomTopic}
+          getRandomTopicVideos={this.props.getRandomTopicVideos}
+        />
+        <RandomPlace
+          place={this.props.randomPlace}
+          placeName={this.props.randomPlaceName || null}
+          placeId={this.props.randomPlaceId || ''}
+          placeCount={this.props.randomPlaceCount || null}
+          videos={this.props.randomPlaceVideos || []}
+          loading={this.props.loadingRandomPlace}
+          getRandomPlaceVideos={this.props.getRandomPlaceVideos}
+        />
        <RandomDate/>
-        <Footer/>
      </div>
    );
-    //
-    // <div>
-    //   This is home. {this.props.test}
-    //   <div>
-    //     <Link to="/topics">Go to topics</Link>
-    //   </div>
-    //   <div>
-    //     <button onClick={this.clickBtn.bind(this)}>Click me</button>
-    //     <button onClick={this.props.fetchVideos}>Fetch videos</button>
-    //   </div>
-    //   <div>
-    //     {this.props.loading && 'Loading...'}
-    //     {this.props.videos.map(video => {
-    //       return (<div key={video.id}>{video.title}</div>);
-    //     })}
-    //   </div>
-    // </div>
-
  }
 }

 const mapStateToProps = state => ({
-  test: state.home.test,
-  loading: state.home.loading,
-  videos: state.home.videos
+  allTopics: state.topics.allTopics,
+  loadingAllTopics: state.topics.loadingAllTopics,
+  randomTopic: state.topics.randomTopic,
+  randomTopicCount: state.topics.randomTopicCount,
+  loadingRandomTopic: state.topics.loadingRandomTopic,
+  randomTopicVideos: state.topics.randomTopicVideos,
+
+  // places
+  randomPlace: state.places.randomPlace,
+  randomPlaceName: state.places.randomPlaceName,
+  randomPlaceId: state.places.randomPlaceId,
+  randomPlaceCount: state.places.randomPlaceCount,
+  loadingRandomPlace: state.places.loadingRandomPlace,
+  randomPlaceVideos: state.places.randomPlaceVideos,
 });

 const mapDispatchToProps = dispatch => ({
-  testAction: value => dispatch(testAction(value)),
-  fetchVideos: () => dispatch(fetchVideos())
+  getAllTopics: () => dispatch(getAllTopics()),
+  getRandomTopicVideos: allTopics => dispatch(getRandomTopicVideos(allTopics)),
+  // places
+  getAllPlaces: () => dispatch(getAllPlaces()),
+  getRandomPlaceVideos: () => dispatch(getRandomPlaceVideos()),
+
 });

 export default connect(mapStateToProps, mapDispatchToProps)(Home);
--- a/src/containers/Results.js
+++ b/src/containers/Results.js
@ -0,0 +1,80 @@
+import React from 'react';
+import Grid from "react-css-grid";
+import Loading from "../components/Loading";
+import VideoItem from "../components/VideoItem";
+import PropTypes from "prop-types";
+import { getSearchResults } from "../actions/search";
+import connect from "react-redux/es/connect/connect";
+
+class Results extends React.Component {
+
+  componentDidMount() {
+    // get params from url
+    const categoryKey = this.props.match.params.categoryKey;
+    const searchValue = this.props.match.params.searchValue;
+    //FIXME: first check if current key / value / results is already in state
+    this.props.getSearchResults(categoryKey, searchValue);
+  }
+
+  render() {
+    let title = this.props.match.params.searchValue;
+
+    return (
+
+      <div>
+
+        <h2 className="section-heading">
+          <span className="section-title">
+            <span className='english-text bold-english-text random-section-title'>Topic: {title}
+            </span>
+          </span>
+        </h2>
+        <br />
+
+        <Grid className="random-topics"
+          width={220}
+          gap={12}>
+
+          {this.props.loadingResults && (
+            <Loading />
+          )}
+
+          {this.props.searchResults && this.props.searchResults.map(video =>
+            <VideoItem id={video.id} key={video.id} title={video.title} />
+          )}
+        </Grid>
+      </div>
+    );
+  }
+}
+
+const mapStateToProps = state => ({
+  searchResults: state.results.currentItems,
+  currentKey: state.results.currentKey,
+  currentValue: state.results.currentValue,
+  currentQuery: state.results.queryParams,
+  loadingResults: state.results.loadingResults
+});
+
+const mapDispatchToProps = dispatch => ({
+  // the category key is either {topic, date, date}
+  // the search value could be something like 25th-jan.
+  getSearchResults: (categoryKey, searchValue) => dispatch(getSearchResults(categoryKey, searchValue)),
+});
+
+// each result page has :
+// - currentKey:  858.ma/{key}/ where key could be like 'topic'
+// - currentValue: 858.ma/topic/{value} where value could be like 'alaa abd al fatah'
+// - currentQuery: 858.ma/{query} ?? not getting this! @TODO: clarify this please.
+// - currentItems: the list of items/videos.
+Results.propTypes = {
+  // the category key is either a {topic, location, date}.
+  currentKey: PropTypes.string,
+  currentValue: PropTypes.string,
+  currentItems: PropTypes.array,
+  loading: PropTypes.bool,
+  categoryItemCount: PropTypes.number,
+  getSearchResults: PropTypes.func
+};
+
+export default connect(mapStateToProps, mapDispatchToProps)(Results);
--- a/src/containers/TopicsList.js
+++ b/src/containers/TopicsList.js
@ -1,13 +0,0 @@
-import React, { Component } from 'react';
-
-class TopicsList extends React.Component {
-  render() {
-    return (
-      <div>
-        This is topics list.
-      </div>
-    );
-  }
-}
-
-export default TopicsList;
--- a/src/containers/TopicsListContainer.js
+++ b/src/containers/TopicsListContainer.js
@ -0,0 +1,54 @@
+import React from 'react';
+import SectionHeading from "../components/SectionHeading";
+import TopicsList from "../components/TopicsList";
+import {getAllTopics} from "../actions/topics";
+import  {connect} from 'react-redux'
+class TopicsListContainer extends React.Component {
+  componentDidMount(){
+    // if the data isn't there call the action.
+    if (!this.props.allTopics){
+      this.props.getAllTopics();
+    }
+  }
+  render() {
+    return (
+      <section className="all-items">
+        <h2 className="section-heading">
+          <span className="arabic-text random-section-title">جميع مواضيع الارشيف</span>
+          <br/>
+          {/*<span className="english-text bold-english-text">topics from the Archive   </span>*/}
+          <span className="section-title">
+          <span className='english-text bold-english-text random-section-title'> all topics
+        </span>
+          </span>
+        </h2>
+        {/* TODO: get the topics objects*/}
+        <TopicsList allTopics={this.props.allTopics}/>
+      </section>
+    );
+  }
+}
+
+// function ->
+// - recieves the global state.
+// - maps the global state to the local props of the component.
+// - maps the global actions to the local props of the component.
+/**
+ *
+ * @param state
+ * @returns object
+ */
+const mapStateToProps = state => ({
+  allTopics: state.topics.allTopics,
+  loadingAllTopics: state.topics.loadingAllTopics,
+});
+/**
+ *
+ * @param dispatch: Redux's action dispatcher.
+ * @returns {{}}
+ */
+const mapDispatchToProps = dispatch => ({
+  getAllTopics: () => dispatch(getAllTopics()),
+});
+
+export default connect(mapStateToProps, mapDispatchToProps)(TopicsListContainer);
--- a/src/containers/Video.js
+++ b/src/containers/Video.js
@ -0,0 +1,56 @@
+import React from 'react';
+import {connect} from 'react-redux';
+import VideoPlayer from "../components/VideoPlayer";
+import { fetchVideoById } from '../utils/api';
+
+class Video extends React.Component {
+
+  constructor() {
+    super();
+    this.state = {
+      currentVideo: null
+    };
+  }
+
+  componentDidMount() {
+    // get videoId from the URL
+    const videoId = this.props.match.params.videoId;
+
+    // if data for videoId is already part of allVideos, setState to currentVideo
+    if (this.props.allVideos && this.props.allVideos.hasOwnProperty(videoId)) {
+      const currentVideo = this.props.allVideos[videoId];
+      this.setState({currentVideo: currentVideo});
+    } else {
+      
+      // video is not part of allVideos, fetch it from the API
+      fetchVideoById(videoId)
+        .then(video => {
+          this.setState({
+            currentVideo: video
+          });
+        });
+    }
+  }
+
+  render() {
+    const video = this.state.currentVideo;
+    return (
+      <section>
+        { video && 
+          <VideoPlayer 
+            id={ video.id }
+            title={ video.title }
+            date = { video.date }
+            description={ video.description }
+          /> 
+        }
+      </section>
+    );
+  }
+}
+
+const mapStateToProps = state => ({
+  allVideos: state.videos.allVideos
+});
+
+export default connect(mapStateToProps)(Video);
--- a/src/history.js
+++ b/src/history.js
@ -0,0 +1,5 @@
+import { createBrowserHistory } from 'history';
+
+const history = createBrowserHistory();
+
+export default history;
--- a/src/index.js
+++ b/src/index.js
@ -3,12 +3,10 @@ import ReactDOM from 'react-dom';
 import './index.css';
 import App from './App';
 import * as serviceWorker from './serviceWorker';
-import { BrowserRouter } from 'react-router-dom';
+import 'bootstrap/dist/css/bootstrap.min.css';

 ReactDOM.render(
-  <BrowserRouter>
-    <App />
-  </BrowserRouter>,
+  <App />,
  document.getElementById('root')
 );

--- a/src/logo.svg
+++ b/src/logo.svg
@ -1,7 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3">
-    <g fill="#61DAFB">
-        <path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/>
-        <circle cx="420.9" cy="296.5" r="45.7"/>
-        <path d="M520.5 78.1z"/>
-    </g>
-</svg>
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@ -1,9 +1,15 @@
 import { combineReducers } from 'redux';

-import HomeReducer from './home'
+import TopicsReducer from './topics';
+import VideosReducer from './videos';
+import SearchReducer from './search';
+import PlacesReducer from './places';

-const rootReducer = combineReducers({
-  home: HomeReducer
+import { connectRouter } from 'connected-react-router'
+export default (history) => combineReducers({
+  router: connectRouter(history),
+  topics: TopicsReducer,
+  videos: VideosReducer,
+  results: SearchReducer,
+  places: PlacesReducer
 });
-
-export default rootReducer;
--- a/src/reducers/places.js
+++ b/src/reducers/places.js
@ -0,0 +1,38 @@
+import {
+  START_LOADING_ALL_PLACES, 
+  LOADED_ALL_PLACES,
+  START_LOADING_RANDOM_PLACE,
+  LOADED_RANDOM_PLACE
+} from '../actions/action_types';
+
+export default function(state={}, action) {
+  switch (action.type) {
+
+    case START_LOADING_ALL_PLACES:
+      return Object.assign({}, state, { loadingAllPlaces: true });
+
+    case LOADED_ALL_PLACES:
+      return Object.assign({}, state, {
+        loadingAllPlaces: false,
+        allPlaces: action.payload
+      });
+
+    case START_LOADING_RANDOM_PLACE:
+      return Object.assign({}, state, {
+        loadingRandomPlace: true
+      });
+
+    case LOADED_RANDOM_PLACE:
+      return Object.assign({}, state, {
+        loadingRandomPlace: false,
+        randomPlace: action.payload.place,
+        randomPlaceName: action.payload.place.name,
+        randomPlaceId: action.payload.place.id,
+        randomPlaceCount: action.payload.itemCount,
+        randomPlaceVideos: action.payload.videos
+      });
+
+    default:
+      return state;
+  }
+};
--- a/src/reducers/search.js
+++ b/src/reducers/search.js
@ -0,0 +1,21 @@
+import { 
+  START_LOADING_ALL_RESULTS,
+  LOADED_ALL_RESULTS
+} from '../actions/action_types';
+
+export default function(state={}, action) {
+  switch (action.type) {
+
+    case START_LOADING_ALL_RESULTS:
+      return Object.assign({}, state, { loadingResults: true });
+
+    case LOADED_ALL_RESULTS:
+      return Object.assign({}, state, {
+        loadingResults: false,
+        currentItems: action.payload
+      });
+
+    default:
+      return state;
+  }
+};
--- a/src/reducers/topics.js
+++ b/src/reducers/topics.js
@ -0,0 +1,36 @@
+import { 
+  START_LOADING_ALL_TOPICS,
+  LOADED_ALL_TOPICS,
+  START_LOADING_RANDOM_TOPIC,
+  LOADED_RANDOM_TOPIC 
+} from '../actions/action_types';
+
+export default function(state={}, action) {
+  switch (action.type) {
+
+    case START_LOADING_ALL_TOPICS:
+      return Object.assign({}, state, { loadingAllTopics: true });
+
+    case LOADED_ALL_TOPICS:
+      return Object.assign({}, state, {
+        loadingAllTopics: false,
+        allTopics: action.payload
+      });
+
+    case START_LOADING_RANDOM_TOPIC:
+      return Object.assign({}, state, {
+        loadingRandomTopic: true
+      });
+
+    case LOADED_RANDOM_TOPIC:
+      return Object.assign({}, state, {
+        loadingRandomTopic: false,
+        randomTopic: action.payload.topic.name,
+        randomTopicCount: action.payload.topic.items,
+        randomTopicVideos: action.payload.videos
+      });
+
+    default:
+      return state;
+  }
+};
--- a/src/reducers/videos.js
+++ b/src/reducers/videos.js
@ -0,0 +1,22 @@
+import {
+  ADD_VIDEOS_TO_STATE
+} from '../actions/action_types';
+
+export default function(state={}, action) {
+  switch (action.type) {
+    case ADD_VIDEOS_TO_STATE:
+      let clonedState = Object.assign({}, state);
+      if (!clonedState.allVideos) {
+        clonedState.allVideos = {};
+      }
+      const videosToAdd = action.payload;
+      videosToAdd.forEach(video => {
+        if (!clonedState.allVideos.hasOwnProperty(video.id)) {
+          clonedState.allVideos[video.id] = video;
+        }
+      });
+      return clonedState;
+    default:
+      return state;
+  }
+}
--- a/src/store/configureStore.js
+++ b/src/store/configureStore.js
@ -1,20 +1,21 @@
-import { createStore, applyMiddleware } from 'redux';
+import { createStore, applyMiddleware, compose } from 'redux';
 import thunk from 'redux-thunk';
+import history from '../history';
+import { routerMiddleware } from 'connected-react-router'
 import rootReducer from '../reducers';
+import getInitialState from '../utils/get-initial-state';

-// Add initial state here
-const initialState = {
-  'home': {
-    'test': 'foo',
-    'loading': false,
-    'videos': []
-  }
-};
+const initialState = getInitialState();

 const store = createStore(
-  rootReducer,
+  rootReducer(history),
  initialState,
-  applyMiddleware(thunk)
+  compose(
+    applyMiddleware(
+      routerMiddleware(history),
+      thunk
+    )
+  )
 );

 export default store;
--- a/src/styleSheets/style.css
+++ b/src/styleSheets/style.css
@ -1,4 +0,0 @@
-.site-logo{
-    max-width: 300px;
-}
-
--- a/src/stylesheets/footer.scss
+++ b/src/stylesheets/footer.scss
@ -0,0 +1,17 @@
+@import "variables";
+/* footer */
+footer {
+  background: $light-gray-color;
+  position: absolute;
+  width: 100%;
+  left: 0;
+  margin-top: 1em;
+  padding: 1em;
+  font-weight: bold;
+}
+
+.nav-footer {
+  a {
+    color: gray;
+  }
+}
--- a/src/stylesheets/globals.scss
+++ b/src/stylesheets/globals.scss
@ -0,0 +1,103 @@
+@import "variables";
+/* globals */
+* {
+  box-sizing: border-box;
+  margin: 0px;
+  border: 0px;
+}
+
+/* fonts */
+@font-face {
+  font-family: "Fedra Arabic";
+  src: url("../assets/fonts/Fedra Arabic Reg_beta.ttf") format("truetype");
+}
+
+@font-face {
+  font-family: "bebas";
+  src: url("../assets/fonts/BEBAS___.ttf") format("truetype");
+}
+
+@font-face {
+  font-family: "majalla";
+  src: url("../assets/fonts/majalla 2.ttf") format("truetype");
+}
+
+@font-face {
+  font-family: "MyriadPro Regular";
+  src: url("../assets/fonts/MyriadPro-Regular.otf") format("otf");
+}
+
+@font-face {
+  font-family: "interstate";
+  src: url("../assets/fonts/Interstate-Regular.bmap") format("bmap"),
+    url("../assets/fonts/Interstate-Bold.bmap") format("bmap");
+}
+
+@font-face {
+  font-family: "interstate-light";
+  src: url("../assets/fonts/Interstate_Light.ttf") format("truetype");
+}
+
+@font-face {
+  font-family: "interstate-bold";
+  src: url("../assets/fonts/Interstate-Bold.ttf") format("truetype");
+}
+
+.text-left {
+  text-align: left;
+}
+
+.arabic-text {
+  font-family: "Fedra Arabic";
+  //padding: .3em;
+  font-weight: normal;
+}
+
+.english-text {
+  font-family: interstate-light, serif;
+  //padding: .3em;
+}
+
+.bold-english-text {
+  font-family: interstate-bold, serif;
+}
+
+/* App */
+.App {
+  max-width: 1200px;
+  margin: 0 auto;
+}
+
+// buttons
+
+button {
+  padding: 1em;
+  font-weight: bold;
+  font-size: 1em;
+  max-width: 300px;
+  justify-self: center; // for the css grid
+  cursor: pointer;
+  
+}
+button:focus {outline:0 !important;}
+// spans
+span {
+  display: inline-block;
+  position: relative;
+}
+
+// links
+a {
+  text-decoration: none;
+  font-size: 14px;
+  color: black;
+}
+
+.normal-link {
+  text-decoration: underline;
+  font-size: 1em;
+  color: black;
+  &:hover {
+    color: gray;
+  }
+}
--- a/src/stylesheets/header.scss
+++ b/src/stylesheets/header.scss
@ -0,0 +1,26 @@
+@import "variables";
+@import "globals";
+
+/* header */
+header {
+    padding-top: 1em;
+}
+
+.site-logo {
+    max-width: 250px;
+    text-align: center;
+}
+
+.counter-container {
+    width: 18%;
+    position: absolute;
+    display: inline-block;
+    right: 0;
+    top: 0;
+    padding: 2em;
+}
+
+.counter {
+    position: relative;
+    right: 0;
+}
--- a/src/stylesheets/items-list.scss
+++ b/src/stylesheets/items-list.scss
@ -0,0 +1,43 @@
+@import "variables";
+@import "globals";
+// title
+.all-items {
+  .section-heading {
+    padding-bottom: 1em;
+  }
+  .section-title span:before,
+  .section-title span:after {
+    width: 530px;
+  }
+}
+
+#search-topics {
+  font-size: 1em;
+  padding: 1em;
+  border: 0.5px solid gray;
+  height: 30px;
+  position: relative;
+  top: -3px;
+  left: 1px;
+  font-size: 0.7em;
+}
+
+.label {
+  font-size: 1.3em;
+}
+
+.topic-item {
+  h3 {
+    color: rgb(16, 16, 16);
+    &:hover {
+      color: gray;
+    }
+
+    text-align: left;
+    padding: 1em;
+    //font-size: 30px;
+  }
+  border-left: 2px solid black;
+  border-bottom: 6px solid black;
+  margin-bottom: 2em;
+}
--- a/src/stylesheets/loading.scss
+++ b/src/stylesheets/loading.scss
@ -0,0 +1,24 @@
+@import "variables";
+/* loader */
+.loading {
+	span {
+		background: $dark-gray-color;
+		border-radius: 50%;
+		margin: 2em 0.2em;
+		width: 12px;
+		height: 12px;
+		display: inline-block;
+		scale: 1;
+		animation: loading-animation 2s linear infinite forwards;
+
+		@keyframes loading-animation {
+			50% {
+			  transform: scale(1.2);
+			}
+
+			100% {
+			  transform: scale(1);
+			}
+		}
+	}
+}
--- a/src/stylesheets/nav.scss
+++ b/src/stylesheets/nav.scss
@ -0,0 +1,31 @@
+@import "variables";
+@import "globals";
+@import "header";
+
+/* nav */
+nav {
+    margin: 3em;
+}
+
+nav ul li {
+    display: inline-block;
+    list-style-type: none;
+    padding: 0em 3em;
+    border-right: 2px solid black;
+    .arabic-text{
+        font-size: 1.2em;
+    }
+    .english-text{
+        font-size: 1.2em;
+        font-family: interstate-bold;
+    }
+}
+
+nav ul li:last-child {
+    border-right: none;
+}
+
+nav ul li a {
+    text-decoration: none;
+    color: black;
+}
--- a/src/stylesheets/random-item.scss
+++ b/src/stylesheets/random-item.scss
@ -0,0 +1,127 @@
+@import "variables";
+@import "globals";
+
+.section-heading,
+.section-subheading {
+  padding-top: 2em;
+}
+// TODO: Refactor
+.section-title {
+  line-height: 0.5;
+  text-align: center;
+}
+
+// the bottom section
+h3.section-title {
+  padding-top: 1em;
+}
+
+// --------------------------
+//        add horizontal lines around the section title.
+//----------------------------
+.section-title span:before,
+.section-title span:after {
+  content: "";
+  position: absolute;
+  height: 8px;
+  border-bottom: 1.7px solid black;
+  top: 0;
+  width: 400px;
+}
+
+.section-title span:before {
+  right: 100%;
+  margin-right: 10px;
+}
+
+.section-title span:after {
+  left: 100%;
+  margin-left: 10px;
+}
+
+// Topics
+.random-topics {
+  margin-top: .5em;
+}
+
+.random-section-title {
+  bottom: -3px;
+
+}
+// TODO: Refactor
+// buttons
+.random-item-container {
+  button {
+    background: white;
+  }
+  // view all and shuffle button
+  .view-items-link {
+    justify-self: left;
+    bottom: 36px;
+    position: relative;
+    padding: 0px;
+  }
+  .view-all-items {
+    left: 0;
+    //position: absolute;
+    justify-self: left;
+    padding: .9em 0px;
+    padding-right: 5px;
+  }
+  // shuffle
+  .shuffle-button {
+    justify-self: right;
+    bottom: 36px;
+    position: relative;
+    padding: 10px;
+    padding-right: 0px;
+  }
+}
+
+// fonts
+.shuffle-button, .view-all-items {
+  span.arabic-text {
+    font-size: 18px;
+  }
+  span.english-text {
+    font-size: 16px;
+  }
+}
+
+.buttons-grid {
+  height: 8px;
+}
+
+span.english-text.bold-english-text{
+  font-size: 28px;
+}
+span.arabic-text.bold-arabic-text{
+  font-size: 28px;
+}
+
+// highlighted text
+.highlighted-text:hover{
+  background: black;
+  color:white;
+  position: relative;
+}
+//.navbar-link-overlay {
+//  width: calc(100% + 6px);
+//  height: calc(100% - 3px - 2px);
+//  position: absolute;
+//  top: 3px;
+//  left: 0px;
+//  z-index: -1;
+//}
+//.navbar-link-neonblue:hover .navbar-link-overlay{
+//  background: black;
+//}
+
+// randome places map
+
+.place-map {
+  max-width: 500px;
+  display: block;
+  min-height: 300px;
+
+}
--- a/src/stylesheets/results.scss
+++ b/src/stylesheets/results.scss
@ -0,0 +1,5 @@
+@import "variables";
+@import "globals";
+@import "header";
+
+/* nav */
--- a/src/stylesheets/search.scss
+++ b/src/stylesheets/search.scss
@ -0,0 +1,59 @@
+@import "variables";
+@import "globals";
+@import "header";
+
+
+/* search */
+.search-button {
+    background: transparent;
+    bottom: 4px;
+    position: relative;
+    right: -39px;
+    padding: 0px;
+    margin: 0px;
+    width: 126px;
+}
+
+.search-button img {
+    max-width: 26%;
+}
+
+.search-box {
+    padding: .9em 1em .9em 1em;
+    width: 30%;
+    background: $light-gray-color;
+    margin-right: 7em;
+}
+
+.search-box::placeholder {
+    color: black;
+    text-align: center;
+    font-size: 1.5em;
+    color: gray;
+    font-family: "Fedra Arabic";
+    font-weight: normal;
+}
+
+@media screen and (max-width: 700px) {
+    .search-box::placeholder {
+        font-size: 1em;
+    }
+}
+
+@media screen and (max-width: 400px) {
+    .search-box::placeholder {
+        font-size: .75em;
+    }
+}
+
+// filter
+.filter-box{
+    //background: $light-gray-color;
+    //padding: 1em;
+    margin-bottom: 2em;
+    text-align: left;
+}
+
+.App form{
+    margin-top: 2em;
+}
--- a/src/stylesheets/style.scss
+++ b/src/stylesheets/style.scss
@ -0,0 +1,13 @@
+@import "variables";
+@import "globals";
+@import "header";
+@import "nav";
+@import "search";
+@import "random-item";
+@import "loading";
+@import "video-item";
+@import "video-player";
+@import "footer";
+@import "items-list";
+@import "results";
+@import "~video-react/styles/scss/video-react";
--- a/src/stylesheets/variables.scss
+++ b/src/stylesheets/variables.scss
@ -0,0 +1,3 @@
+$dark-gray-color: #777;
+$light-gray-color: #eaeaea;
+$normal-link-color: blue;
--- a/src/stylesheets/video-item.scss
+++ b/src/stylesheets/video-item.scss
@ -0,0 +1,35 @@
+@import "variables";
+@import "globals";
+@import "header";
+
+/* Video item*/
+.video-item {
+  background: $light-gray-color;
+  min-height: 300px;
+  padding: 1em;
+  color : rgb(16, 16, 16);
+}
+
+.video-thumbnail {
+  width: 100%;
+  max-height: 150px;
+  object-fit: cover;
+  transition: all .4s ease-in-out;
+}
+
+.video-thumbnail:hover {
+  transform: scale(1.1);
+}
+
+.video-thumbnail-container {
+  position: relative;
+  overflow: hidden;
+}
+
+.video-title {
+  padding-top: 1em;
+  font-weight: normal;
+}
+section.video-item:hover {
+  outline: 2px solid black;
+}
--- a/src/stylesheets/video-player.scss
+++ b/src/stylesheets/video-player.scss
@ -0,0 +1,20 @@
+@import "variables";
+
+video{
+  margin-top: 3em;
+}
+.video-player-title
+{
+  text-align: left;
+  padding: 1em 1em 0 1em;
+  background: $light-gray-color;
+  margin-top: 1em;
+}
+.video-player-date{
+  padding: 1em;
+  background: $light-gray-color;
+  text-align: left;
+}
+.video-react{
+  margin-top: 3em;
+}
--- a/src/subComponents/Footer.js
+++ b/src/subComponents/Footer.js
@ -1,9 +0,0 @@
-import React from 'react';
-class Footer extends React.Component{
-render(){
-  return(
-   'hello Footer!'
-  )
-}
-}
-export default  (Footer);
--- a/src/subComponents/Header.js
+++ b/src/subComponents/Header.js
@ -1,24 +0,0 @@
-import React from 'react';
-import logo from '../logo.png';
-import '../styleSheets/style.css'
-
-class Header extends React.Component {
-  render() {
-    const Logo = () => {
-      return (
-        <nav>
-          <img className="site-logo" src={logo} alt="logo 858 "/>
-        </nav>
-      );
-    }
-    return (
-      <header>
-        <section className="container">
-          <Logo/>
-        </section>
-      </header>
-    )
-  }
-}
-
-export default (Header);
--- a/src/subComponents/RandomDate.js
+++ b/src/subComponents/RandomDate.js
@ -1,9 +0,0 @@
-import React from 'react';
-class RandomDate extends React.Component{
-render(){
-  return(
-   'hello Dandom Date!'
-  )
-}
-}
-export default  (RandomDate);
--- a/src/subComponents/RandomLocation.js
+++ b/src/subComponents/RandomLocation.js
@ -1,9 +0,0 @@
-import React from 'react';
-class RandomLocation extends React.Component{
-render(){
-  return(
-   'hello Random Location!'
-  )
-}
-}
-export default  (RandomLocation);
--- a/src/subComponents/RandomTopic.js
+++ b/src/subComponents/RandomTopic.js
@ -1,9 +0,0 @@
-import React from 'react';
-class RandomTopic extends React.Component{
-render(){
-  return(
-   'hello Random Topic!'
-  )
-}
-}
-export default  (RandomTopic);
--- a/src/subComponents/Search.js
+++ b/src/subComponents/Search.js
@ -1,9 +0,0 @@
-import React from 'react';
-class Search extends React.Component{
-render(){
-  return(
-   'hello Search!'
-  )
-}
-}
-export default  (Search);
--- a/src/utils/api.js
+++ b/src/utils/api.js
@ -1,6 +1,16 @@
 import config from '../config';
 import 'whatwg-fetch';

+const VIDEO_KEYS = [
+  "title",
+  "source",
+  "project",
+  "topic",
+  "language",
+  "duration",
+  "id",
+  "date"
+];

 /*
  Base function to make API calls
@ -13,6 +23,7 @@ import 'whatwg-fetch';
  @returns {Promise} - Resolves with data if successful, else throws error.
 */
 export function callApi(action, data) {
+  console.log('API Call', action, data);
  let formData = new FormData();
  formData.append('action', action);
  formData.append('data', JSON.stringify(data));
@ -20,7 +31,7 @@ export function callApi(action, data) {
    method: 'POST',
    body: formData
  })
-  .then(response => response.json())
+  .then(response => response.json()) // convert the response to json (instead of response object).
  .then(data => {
    if (data.status.code === 200) {
      return data.data;
@ -40,6 +51,7 @@ export function callApi(action, data) {
  @returns {Promise<Array>} array of topic objects like: {'name': '<topicName>', 'items': <no_of_items>}
 */
 export function fetchAllTopics(startRange=0, endRange=1000) {
+  // the object that we need to send to the api
  const data = {
    "query": {
      "conditions": [],
@ -98,11 +110,11 @@ export function fetchAllDates(startRange=0, endRange=1000) {
 */
 export function fetchVideosByX(key, value, startRange, endRange, sortKey='random') {
  const data = {
-    "keys": ["editable", "modified", "title", "source", "project", "topic", "language", "duration", "id"],
+    "keys": VIDEO_KEYS,
    "query": {
      "conditions": [{
        "key": key,
-        "value": encodeURIComponent(value),
+        "value": value,
        "operator": "=="
      }],
      "operator": "&"
@ -152,12 +164,29 @@ export function fetchVideosByDate(date, startRange=0, endRange=100, sortKey='ran
  @param {Float} east - longitude of east bounds
 */
 export function fetchPlaces(north, south, west, east, startRange=0, endRange=100) {
+  
+  console.log("BAD: fetchPlaces called");
  const data = {
    "itemsQuery": {
      "conditions": [],
      "operator": "&"
    },
-    "keys": ["id", "name", "alternativeNames", "geoname", "countryCode", "type", "lat", "lng", "south", "west", "north", "east", "area", "editable"],
+    "keys": [
+      "id",
+      "name",
+      "alternativeNames",
+      "geoname",
+      "countryCode",
+      "type",
+      "lat",
+      "lng",
+      "south",
+      "west",
+      "north",
+      "east",
+      "area",
+      "editable"
+    ],
    "query": {
      "conditions": [{
        "key": "lat",
@ -179,30 +208,64 @@ export function fetchPlaces(north, south, west, east, startRange=0, endRange=100
  return callApi('findPlaces', data).then(data => data.items);
 }

+export function fetchPlaceItemCount(placeName) {
+  const data = {
+    "query": {
+      "conditions": [{
+        "key": "places",
+        "value": placeName
+      }],
+      "operator": "&"
+    }
+  };
+  return callApi('find', data).then(data => data.items);
+}
+
 /*
  Fetches a random place
 */
 export function fetchRandomPlace() {
+  const startRange = Math.floor(Math.random() * 50);
+  const endRange = startRange + 1;
  const data = {
    "itemsQuery": {
      "conditions": [],
      "operator": "&"
    },
-    "keys": ["id", "name", "alternativeNames", "geoname", "countryCode", "type", "lat", "lng", "south", "west", "north", "east", "area", "editable"],
+    "keys": [
+      "id",
+      "name",
+      "items",
+      "alternativeNames",
+      "geoname",
+      "countryCode",
+      "type",
+      "lat",
+      "lng",
+      "south",
+      "west",
+      "north",
+      "east",
+      "area",
+      "editable"
+    ],
    "query": {
      "conditions": [],
      "operator": "&"
    },
-    "range": [0, 1],
+    "range": [startRange, endRange],
    "sort": [{
-      "key": "random",
+      "key": "items",
      "operator": "-"
    }]
  };
  return callApi('findPlaces', data).then(data => data.items[0]);
 }

-
-export function fetchVideosByPlace(placeId, startRange=0, endRange=100, sortKey='random') {
-  return fetchVideosByX('place', placeId, startRange, endRange, sortKey);
+export function fetchVideosByPlace(placeName, startRange=0, endRange=100, sortKey='random') {
+  return fetchVideosByX('places', placeName, startRange, endRange, sortKey);
+}
+
+export function fetchVideoById(id) {
+  return callApi('get', {'id': id, keys: VIDEO_KEYS});
 }
--- a/src/utils/get-initial-state.js
+++ b/src/utils/get-initial-state.js
@ -0,0 +1,14 @@
+import { getItem } from './safe-storage';
+
+export default function getInitialState() {
+  let initialState = {
+    topics: {}
+  };
+  const allTopics = getItem('allTopics');
+  if (allTopics) {
+    initialState.topics.allTopics = JSON.parse(allTopics);
+    initialState.topics.loadingAllTopics = false;
+  }
+
+  return initialState;
+}
--- a/src/utils/get-random-place.js
+++ b/src/utils/get-random-place.js
@ -0,0 +1,5 @@
+
+export default function getRandomPlace(allPlaces, minVideos=3) {
+  const validPlaces = allPlaces.filter(place => place.items >= minVideos);
+  return validPlaces[Math.floor(Math.random() * validPlaces.length)];
+}
--- a/src/utils/get-random-topic.js
+++ b/src/utils/get-random-topic.js
@ -0,0 +1,5 @@
+
+export default function getRandomTopic(allTopics, minVideos=4) {
+  const validTopics = allTopics.filter(topic => topic.items >= minVideos);
+  return validTopics[Math.floor(Math.random() * validTopics.length)];
+}
--- a/src/utils/mapbox.js
+++ b/src/utils/mapbox.js
@ -0,0 +1,29 @@
+import config from '../config';
+
+function getStaticMapURL(place, size='800x300') {
+  const area = place.area;
+  const zoom = getZoom(area);
+  return `https://api.mapbox.com/v4/mapbox.emerald/pin-s-marker(${place.lng},${place.lat})/${place.lng},${place.lat},${zoom},0,0/${size}.png?access_token=${config.mapboxKey}`;
+}
+
+function getZoom(area) {
+  if (area < 100000) {
+    return 16;
+  }
+  if (area < 200000) {
+    return 15;
+  }
+  if (area < 500000) {
+    return 14;
+  }
+  if (area < 1000000) {
+    return 13;
+  }
+  if (area < 2000000) {
+    return 12;
+  } else {
+    return 10;
+  }
+}
+
+export { getStaticMapURL };
--- a/src/utils/safe-storage.js
+++ b/src/utils/safe-storage.js
@ -0,0 +1,40 @@
+// Transparent wrapper over Window.localStorage
+// Adheres to the Web Storage API:
+// https://developer.mozilla.org/en-US/docs/Web/API/Storage
+
+/**
+ * Wraps localStorage.getItem in a try/catch. Return null
+ * if the key does not exist or localStorage fails.
+ */
+function getItem(key) {
+  try {
+    return localStorage.getItem(key) || null;
+  } catch (err) {
+    console.warn('Could not read from localStorage.');
+    return null;
+  }
+}
+
+/**
+ * Wraps localStorage.setItem in a try/catch.
+ */
+function setItem(key, value) {
+  try {
+    localStorage.setItem(key, value);
+  } catch (err) {
+    console.warn('Could not write to localStorage.');
+  }
+}
+
+/**
+ * Wraps localStorage.removeItem in a try/catch.
+ */
+function removeItem(key) {
+  try {
+    localStorage.removeItem(key);
+  } catch (err) {
+    console.warn('Could not delete from localStorage.');
+  }
+}
+
+export { getItem, setItem, removeItem };
--- a/src/utils/video.js
+++ b/src/utils/video.js
@ -0,0 +1,9 @@
+import config from '../config';
+
+export function getThumbnail(id, size='200') {
+  return `${config.baseUrl}/${id}/${size}p.jpg`
+}
+
+export function getVideo(id, size='480') {
+  return `${config.videoBase}/${id}/${size}p.mp4`;
+}
--- a/yarn.lock
+++ b/yarn.lock
Author	SHA1	Message	Date
Ahmed Ayman	41a6213443	add title to the topics page, style the video items and the links, add about page.	2020-01-15 14:32:33 +02:00
Ahmed Ayman	c2f7b02fd5	add bootstrap, create a styling for the random places section	2020-01-15 12:48:57 +02:00
Ahmed-Ayman	7397002737	add the title todo	2019-01-23 16:14:38 +02:00
Sanjay Bhangar	013a7a1049	oops, add missed files	2019-01-22 19:44:20 +05:30
sanj	0cef9c313c	Merge branch 'feature/random-location' of 858/frontend into develop	2019-01-22 14:12:30 +00:00
sanj	ffbef3c915	Merge branch 'feature/thumb-aspect-ratio' of 858/frontend into develop	2019-01-22 14:11:27 +00:00
Sanjay Bhangar	b048d55b9f	implement random place on home-page with static map	2019-01-22 19:34:19 +05:30
imohkay	a1fc6ef6e7	aspect ratio for thumbnails, loading behaviour	2019-01-22 16:33:36 +05:30
Ahmed-Ayman	ba28a48fc9	style the home page	2019-01-03 08:07:39 +02:00
Ahmed-Ayman	0ed16ffe29	refactor the css to be global for all the random sections	2018-12-28 10:49:56 +02:00
Ahmed-Ayman	4a2372802e	style the heading titles	2018-12-22 14:36:49 +02:00
Ahmed-Ayman	b307c9bb39	change the counter to a fixed image, set the header image to one image instead of separated 3 imgs	2018-12-22 12:27:41 +02:00
Ahmed-Ayman	aa65fa4b11	implement the random location	2018-12-21 14:44:18 +02:00
Ahmed-Ayman	6e6af71ad1	fix #22 add related videos section for video player	2018-12-21 13:37:14 +02:00
Ahmed-Ayman	2fdeb6cb11	route the videos link for the title to the results page	2018-12-21 13:13:41 +02:00
Sanjay Bhangar	8c66fb0251	fix search results page for topics	2018-12-20 18:11:53 +05:30
Ahmed-Ayman	14d9c925f2	dispatch the loaded all results action.	2018-12-19 18:14:13 +02:00
Ahmed-Ayman	b5ae097872	create the results page action,reducer	2018-12-19 18:08:22 +02:00
Ahmed-Ayman	1779d04546	disable the results route	2018-12-19 15:05:03 +02:00
Ahmed-Ayman	fde16110cc	results page first commit.	2018-12-13 19:04:55 +02:00
Ahmed-Ayman	ff519477ac	fix #14 change the max-width of the topics list.	2018-12-13 18:30:24 +02:00
Ahmed-Ayman	ed1fffca88	fix #14 create the all topics page with the filter.	2018-12-13 18:19:33 +02:00
Ahmed-Ayman	3d20857fc1	change the cursor to pointer for the buttons	2018-12-13 16:35:02 +02:00
Sanjay Bhangar	c4603b8e03	implement shuffle topics button functionality	2018-12-13 16:22:58 +02:00
Sanjay Bhangar	9fe634dfd5	dont reload random topic on home view if random topic exists, fixes #10	2018-12-13 16:12:35 +02:00
Ahmed-Ayman	4c2a3361eb	create all topics (button), shuffle (button), all videos (link)	2018-12-13 09:18:44 +02:00
Ahmed-Ayman	474000833c	add more rules for the horizontal line around the title.	2018-12-12 20:12:56 +02:00
Ahmed-Ayman	06065dea6e	set a max-height for the thumbnails	2018-12-12 20:08:43 +02:00
Ahmed-Ayman	09dc73a5c1	install font-awesome to use icons	2018-12-12 20:06:42 +02:00
Ahmed-Ayman	1be52cd27e	set the images width to 100%	2018-12-12 20:04:15 +02:00
Ahmed-Ayman	53214b12ea	add just one line around the random topics title	2018-12-12 20:02:13 +02:00
sanj	6ff0019b79	Merge branch 'feature/fix-thumbnails' of 858/frontend into develop	2018-12-12 16:41:09 +00:00
Sanjay Bhangar	1eb6b8a1f4	fix thumbnail on videos	2018-12-12 18:37:34 +02:00
Ahmed-Ayman	34deaaeefe	add borders to the topic/item name	2018-12-11 14:41:57 +02:00
Ahmed-Ayman	935c6d210c	style the video item, title decoration, colors	2018-12-11 13:30:28 +02:00
Ahmed-Ayman	2bb636cb79	add link to the logo	2018-12-11 13:22:08 +02:00
Ahmed-Ayman	fcbfe7bc50	style the video player	2018-12-11 13:19:04 +02:00
Ahmed-Ayman	45da475ba6	add react-video	2018-12-11 13:01:02 +02:00
Ahmed-Ayman	45b435b201	refactor the project to use scss	2018-12-11 12:42:56 +02:00
Ahmed-Ayman	0b51135517	refactor the sass, section heading names	2018-12-11 12:25:35 +02:00
Ahmed-Ayman	a0489baae9	add sass	2018-12-11 12:25:05 +02:00
Ahmed-Ayman	3c7050bcdc	resolved merge conflict	2018-12-08 20:35:46 +02:00
Ahmed-Ayman	9cccc32dfd	style the video-items.	2018-12-08 20:32:45 +02:00
sanj	14adb5e86c	Merge branch 'feature/connected-react-router' of 858/frontend into develop	2018-12-08 16:29:32 +00:00
Sanjay Bhangar	6eb178ea39	fix connected-react-router	2018-12-08 18:27:19 +02:00
Sanjay Bhangar	ee15c0150d	failed attempt at setting up connected router	2018-12-08 18:01:20 +02:00
sanj	7d8778b51c	Merge branch 'feature/video-player' of 858/frontend into develop	2018-12-07 22:43:41 +00:00
Sanjay Bhangar	f1667af8de	make link to video player work, fetch video data if not available in global state	2018-12-08 00:42:02 +02:00
Sanjay Bhangar	86a90ca8da	[wip] video player page	2018-12-08 00:04:04 +02:00
Ahmed-Ayman	f0dc1e4f35	Merge remote-tracking branch 'origin/develop' into develop	2018-12-07 20:22:15 +02:00
Ahmed-Ayman	204f1de024	create a basic layout for the video player.	2018-12-07 20:21:25 +02:00
sanj	71a14e79d9	Merge branch 'feature/add-topic-count' of 858/frontend into develop	2018-12-07 17:44:24 +00:00
Sanjay Bhangar	2d755be6b8	add count for current topic in random topic component	2018-12-07 19:43:25 +02:00
Sanjay Bhangar	69c2181afa	add random topic items count to state	2018-12-07 19:38:24 +02:00
Ahmed-Ayman	5c048b2036	add the see all videos, topics links	2018-12-07 19:35:40 +02:00
Sanjay Bhangar	f667e9ea8f	really fix issues with random topic on first load	2018-12-07 19:33:42 +02:00
Sanjay Bhangar	c9d1495c43	fix bug on random topic not loading on first page load	2018-12-07 19:25:43 +02:00
sanj	7d48fad50a	Merge branch 'feature/topic-actions' of 858/frontend into develop	2018-12-07 17:03:22 +00:00
Ahmed-Ayman	d36d4e6c6e	create a video container, component static defaults.	2018-12-07 19:02:27 +02:00
Sanjay Bhangar	e7471420d2	fetch all topics, show random topic with 4 videos in home container	2018-12-07 18:59:16 +02:00
Ahmed-Ayman	461ed1af37	style the counter	2018-12-07 14:01:26 +02:00
Ahmed-Ayman	2dcd50d361	create the nav	2018-12-06 23:24:39 +02:00
Ahmed-Ayman	aef0af64b6	create the footer	2018-12-06 23:10:30 +02:00
Ahmed-Ayman	3a42fee6e2	create static homepage, create VideoPlayer and Title Components	2018-12-06 20:33:29 +02:00
Ahmed-Ayman	34f39d0253	import util.getThumbnail in the video item.	2018-12-06 17:22:03 +02:00
Ahmed-Ayman	c2bce65dce	install prop-types	2018-12-06 17:17:31 +02:00
Sanjay Bhangar	7a3e025278	Merge branch 'develop' of code.with.camp:858/frontend into develop	2018-12-06 17:08:31 +02:00
Sanjay Bhangar	d369c16540	add util to fetch video thumb / video	2018-12-06 17:08:12 +02:00
Ahmed-Ayman	bff021333f	add the site-wide components to app.js	2018-12-06 16:26:19 +02:00
Ahmed-Ayman	53de0e1916	add css-grid to package.json	2018-12-06 16:19:03 +02:00
Ahmed-Ayman	396005c9fc	fix #5 create a Random Location, Topic static content	2018-12-06 00:34:48 +02:00
Ahmed-Ayman	da380dff81	fix #4 create the search component.	2018-12-06 00:32:46 +02:00
Ahmed-Ayman	a3ed5426c5	fix #3 create a separate counter component	2018-12-06 00:02:33 +02:00
Ahmed-Ayman	4b90d1f895	add images and global css to be used later in the website	2018-12-05 23:56:22 +02:00
Ahmed-Ayman	ba0f08036e	fix #3 add fonts to be used for the header and the rest of the website.	2018-12-05 23:51:53 +02:00
Ahmed-Ayman	c17e153fd3	fix #3 create the header, style the site-logo to have a max-width	2018-12-05 22:09:11 +02:00
Ahmed-Ayman	401de982c8	change subComponents to components	2018-12-05 21:48:08 +02:00