pageflow 13.1.0 → 13.2.0

data/app/assets/javascripts/pageflow/dist/{react.js → react-server.js}

@@ -8900,33 +8900,33 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var components = _interopRequireWildcard(_components);
 
-	var _selectors = __webpack_require__(492);
+	var _selectors = __webpack_require__(493);
 
 	var selectors = _interopRequireWildcard(_selectors);
 
-	var _media = __webpack_require__(498);
+	var _media = __webpack_require__(499);
 
-	var _interactivePageBackground = __webpack_require__(539);
+	var _interactivePageBackground = __webpack_require__(552);
 
 	var _pages = __webpack_require__(349);
 
-	var _registerPageType = __webpack_require__(544);
+	var _registerPageType = __webpack_require__(557);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
-	var _registerPageTypeWithDefaultBackground = __webpack_require__(546);
+	var _registerPageTypeWithDefaultBackground = __webpack_require__(559);
 
 	var _registerPageTypeWithDefaultBackground2 = _interopRequireDefault(_registerPageTypeWithDefaultBackground);
 
-	var _registerWidgetType = __webpack_require__(547);
+	var _registerWidgetType = __webpack_require__(560);
 
 	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
 
-	var _mapping = __webpack_require__(455);
+	var _mapping = __webpack_require__(454);
 
 	var _mapping2 = _interopRequireDefault(_mapping);
 
-	var _Container = __webpack_require__(458);
+	var _Container = __webpack_require__(457);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
@@ -8940,27 +8940,27 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _utils = __webpack_require__(340);
 
-	var _ServerSidePage = __webpack_require__(549);
+	var _ServerSidePage = __webpack_require__(562);
 
 	var _ServerSidePage2 = _interopRequireDefault(_ServerSidePage);
 
-	var _ServerSideWidget = __webpack_require__(591);
+	var _ServerSideWidget = __webpack_require__(607);
 
 	var _ServerSideWidget2 = _interopRequireDefault(_ServerSideWidget);
 
-	var _builtInPageTypes = __webpack_require__(592);
+	var _builtInPageTypes = __webpack_require__(608);
 
-	var _backgroundMedia = __webpack_require__(553);
+	var _backgroundMedia = __webpack_require__(566);
 
-	var _cookieNotice = __webpack_require__(556);
+	var _cookieNotice = __webpack_require__(569);
 
-	var _loadingSpinner = __webpack_require__(598);
+	var _loadingSpinner = __webpack_require__(612);
 
-	var _pageflow = __webpack_require__(601);
+	var _pageflow = __webpack_require__(615);
 
 	var _pageflow2 = _interopRequireDefault(_pageflow);
 
-	var _boot = __webpack_require__(550);
+	var _boot = __webpack_require__(563);
 
 	var _boot2 = _interopRequireDefault(_boot);
 
@@ -9272,71 +9272,71 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _PageBackgroundImage2 = _interopRequireDefault(_PageBackgroundImage);
 
-	var _PageShadow = __webpack_require__(439);
+	var _PageShadow = __webpack_require__(438);
 
 	var _PageShadow2 = _interopRequireDefault(_PageShadow);
 
-	var _PageContent = __webpack_require__(440);
+	var _PageContent = __webpack_require__(439);
 
 	var _PageContent2 = _interopRequireDefault(_PageContent);
 
-	var _PageForeground = __webpack_require__(441);
+	var _PageForeground = __webpack_require__(440);
 
 	var _PageForeground2 = _interopRequireDefault(_PageForeground);
 
-	var _PageScroller = __webpack_require__(442);
+	var _PageScroller = __webpack_require__(441);
 
 	var _PageScroller2 = _interopRequireDefault(_PageScroller);
 
-	var _PageHeader = __webpack_require__(444);
+	var _PageHeader = __webpack_require__(443);
 
 	var _PageHeader2 = _interopRequireDefault(_PageHeader);
 
-	var _PageText = __webpack_require__(445);
+	var _PageText = __webpack_require__(444);
 
 	var _PageText2 = _interopRequireDefault(_PageText);
 
-	var _PageLink = __webpack_require__(446);
+	var _PageLink = __webpack_require__(445);
 
 	var _PageLink2 = _interopRequireDefault(_PageLink);
 
-	var _PageThumbnail = __webpack_require__(448);
+	var _PageThumbnail = __webpack_require__(447);
 
 	var _PageThumbnail2 = _interopRequireDefault(_PageThumbnail);
 
-	var _LazyLoadedPageThumbnail = __webpack_require__(449);
+	var _LazyLoadedPageThumbnail = __webpack_require__(448);
 
 	var _LazyLoadedPageThumbnail2 = _interopRequireDefault(_LazyLoadedPageThumbnail);
 
-	var _PlayerControls = __webpack_require__(450);
+	var _PlayerControls = __webpack_require__(449);
 
 	var _PlayerControls2 = _interopRequireDefault(_PlayerControls);
 
-	var _CloseButton = __webpack_require__(489);
+	var _CloseButton = __webpack_require__(490);
 
 	var _CloseButton2 = _interopRequireDefault(_CloseButton);
 
-	var _MenuBar = __webpack_require__(484);
+	var _MenuBar = __webpack_require__(485);
 
 	var _MenuBar2 = _interopRequireDefault(_MenuBar);
 
-	var _Icon = __webpack_require__(454);
+	var _Icon = __webpack_require__(453);
 
 	var _Icon2 = _interopRequireDefault(_Icon);
 
-	var _editorOnly = __webpack_require__(491);
+	var _editorOnly = __webpack_require__(492);
 
 	var _editorOnly2 = _interopRequireDefault(_editorOnly);
 
-	var _withVisibilityWatching = __webpack_require__(488);
+	var _withVisibilityWatching = __webpack_require__(489);
 
 	var _withVisibilityWatching2 = _interopRequireDefault(_withVisibilityWatching);
 
-	var _reactDraggable = __webpack_require__(471);
+	var _reactDraggable = __webpack_require__(472);
 
 	var _reactDraggable2 = _interopRequireDefault(_reactDraggable);
 
-	var _reactMeasure = __webpack_require__(472);
+	var _reactMeasure = __webpack_require__(473);
 
 	var _reactMeasure2 = _interopRequireDefault(_reactMeasure);
 
@@ -10481,7 +10481,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _createPageType2 = _interopRequireDefault(_createPageType);
 
-	var _mergePageTypes = __webpack_require__(438);
+	var _mergePageTypes = __webpack_require__(437);
 
 	var _mergePageTypes2 = _interopRequireDefault(_mergePageTypes);
 
@@ -16650,7 +16650,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 /* 426 */
 /***/ (function(module, exports) {
 
-	module.exports = Backbone;
+	module.exports = {};
 
 /***/ }),
 /* 427 */
@@ -17213,7 +17213,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _react2 = _interopRequireDefault(_react);
 
-	var _reactDom = __webpack_require__(437);
+	var _reactDom = __webpack_require__(426);
 
 	var _reactDom2 = _interopRequireDefault(_reactDom);
 
@@ -17286,12 +17286,6 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 /***/ }),
 /* 437 */
-/***/ (function(module, exports) {
-
-	module.exports = ReactDOM;
-
-/***/ }),
-/* 438 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -17323,7 +17317,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 439 */
+/* 438 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -17400,7 +17394,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	;
 
 /***/ }),
-/* 440 */
+/* 439 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -17421,18 +17415,18 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	};
 
-	var _PageForeground = __webpack_require__(441);
+	var _PageForeground = __webpack_require__(440);
 
 	var _PageForeground2 = _interopRequireDefault(_PageForeground);
 
-	var _PageScroller = __webpack_require__(442);
+	var _PageScroller = __webpack_require__(441);
 
 	var _PageScroller2 = _interopRequireDefault(_PageScroller);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 441 */
+/* 440 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -17456,7 +17450,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 442 */
+/* 441 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -17464,6 +17458,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
+	exports.PageScroller = undefined;
 
 	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
@@ -17471,7 +17466,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _react2 = _interopRequireDefault(_react);
 
-	var _Scroller = __webpack_require__(443);
+	var _classnames = __webpack_require__(335);
+
+	var _classnames2 = _interopRequireDefault(_classnames);
+
+	var _Scroller = __webpack_require__(442);
 
 	var _Scroller2 = _interopRequireDefault(_Scroller);
 
@@ -17497,7 +17496,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	 * @alias pageflow.react.components.PageScroller
 	 * @since 12.1
 	 */
-	var PageScroller = function (_React$Component) {
+	var PageScroller = exports.PageScroller = function (_React$Component) {
 	  _inherits(PageScroller, _React$Component);
 
 	  function PageScroller() {
@@ -17543,7 +17542,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    value: function render() {
 	      return _react2.default.createElement(
 	        _Scroller2.default,
-	        { ref: 'scroller', className: this.props.className },
+	        { ref: 'scroller', className: className(this.props), style: style(this.props) },
 	        _react2.default.createElement(
 	          'div',
 	          { className: 'contentWrapper' },
@@ -17556,6 +17555,20 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return PageScroller;
 	}(_react2.default.Component);
 
+	function className(props) {
+	  return (0, _classnames2.default)(props.className, {
+	    'scroller-clipped_bottom': !!props.marginBottom
+	  });
+	}
+
+	function style(props) {
+	  if (props.marginBottom) {
+	    return {
+	      bottom: props.marginBottom
+	    };
+	  }
+	}
+
 	PageScroller.propTypes = {
 	  className: _react2.default.PropTypes.string
 	};
@@ -17570,7 +17583,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(PageScroller);
 
 /***/ }),
-/* 443 */
+/* 442 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -17583,10 +17596,6 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _react = __webpack_require__(334);
 
-	var _reactDom = __webpack_require__(437);
-
-	var _reactDom2 = _interopRequireDefault(_reactDom);
-
 	var _classnames = __webpack_require__(335);
 
 	var _classnames2 = _interopRequireDefault(_classnames);
@@ -17611,13 +17620,25 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  _createClass(Scroller, [{
 	    key: 'render',
 	    value: function render() {
+	      var _this2 = this;
+
 	      return React.createElement(
 	        'div',
-	        { ref: 'wrapper', className: (0, _classnames2.default)('scroller', this.props.className) },
+	        { className: 'scroller-wrapper', ref: function ref(element) {
+	            return _this2.wrapperElement = element;
+	          } },
 	        React.createElement(
 	          'div',
-	          null,
-	          this.props.children
+	          { ref: function ref(element) {
+	              return _this2.scrollerElement = element;
+	            },
+	            className: (0, _classnames2.default)('scroller', this.props.className),
+	            style: this.props.style },
+	          React.createElement(
+	            'div',
+	            null,
+	            this.props.children
+	          )
 	        )
 	      );
 	    }
@@ -17625,10 +17646,13 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    key: 'componentDidMount',
 	    value: function componentDidMount() {
 	      if (typeof jQuery !== 'undefined') {
-	        var element = jQuery(_reactDom2.default.findDOMNode(this.refs.wrapper));
+	        var element = jQuery(this.scrollerElement);
+
+	        element.scroller({
+	          eventListenerTarget: this.wrapperElement
+	        });
 
-	        element.scroller();
-	        window.sss = this.scroller = element.scroller('instance');
+	        this.scroller = element.scroller('instance');
 	      }
 	    }
 	  }, {
@@ -17652,22 +17676,15 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    value: function resetPosition(options) {
 	      this.scroller.resetPosition(options);
 	    }
-	  }, {
-	    key: 'resetPosition',
-	    value: function resetPosition(options) {
-	      this.scroller.resetPosition(options);
-	    }
 	  }]);
 
 	  return Scroller;
 	}(_react.Component);
 
-	;
-
 	exports.default = Scroller;
 
 /***/ }),
-/* 444 */
+/* 443 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -17747,24 +17764,27 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	;
 
 /***/ }),
-/* 445 */
+/* 444 */
 /***/ (function(module, exports, __webpack_require__) {
 
-	"use strict";
+	'use strict';
 
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-
-	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+	exports.default = PageText;
 
 	var _react = __webpack_require__(334);
 
-	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+	var _react2 = _interopRequireDefault(_react);
 
-	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+	var _classnames = __webpack_require__(335);
 
-	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+	var _classnames2 = _interopRequireDefault(_classnames);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 
 	/**
 	 * @desc Place inside
@@ -17778,39 +17798,33 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	 * @prop page
 	 *   Required. The page object to read configuration properties from.
 	 */
-	var PageText = function (_Component) {
-	  _inherits(PageText, _Component);
-
-	  function PageText() {
-	    _classCallCheck(this, PageText);
+	function PageText(props) {
+	  return _react2.default.createElement(
+	    'div',
+	    { className: className(props) },
+	    _react2.default.createElement('p', { dangerouslySetInnerHTML: text(props) }),
+	    props.children
+	  );
+	}
 
-	    return _possibleConstructorReturn(this, (PageText.__proto__ || Object.getPrototypeOf(PageText)).apply(this, arguments));
-	  }
+	PageText.defaultProps = {
+	  marginBottom: 'for_scroll_indicator_on_phone'
+	};
 
-	  _createClass(PageText, [{
-	    key: "render",
-	    value: function render() {
-	      return React.createElement(
-	        "div",
-	        { className: "contentText" },
-	        React.createElement("p", { dangerouslySetInnerHTML: this.text() }),
-	        this.props.children
-	      );
-	    }
-	  }, {
-	    key: "text",
-	    value: function text() {
-	      return { __html: this.props.page.text };
-	    }
-	  }]);
+	PageText.propTypes = {
+	  marginBottom: _react2.default.PropTypes.oneOf(['for_player_controls', 'for_scroll_indicator_on_phone', 'none'])
+	};
 
-	  return PageText;
-	}(_react.Component);
+	function className(props) {
+	  return (0, _classnames2.default)('contentText', _defineProperty({}, 'contentText-margin_' + props.marginBottom, props.marginBottom != PageText.defaultProps.marginBottom));
+	}
 
-	exports.default = PageText;
+	function text(props) {
+	  return { __html: props.page.text };
+	}
 
 /***/ }),
-/* 446 */
+/* 445 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -17829,7 +17843,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _utils = __webpack_require__(340);
 
-	var _selectors = __webpack_require__(447);
+	var _selectors = __webpack_require__(446);
 
 	var _selectors2 = __webpack_require__(376);
 
@@ -17895,7 +17909,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(PageLink);
 
 /***/ }),
-/* 447 */
+/* 446 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -17933,7 +17947,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 448 */
+/* 447 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18017,7 +18031,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(PageThumbnail);
 
 /***/ }),
-/* 449 */
+/* 448 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18026,7 +18040,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _PageThumbnail = __webpack_require__(448);
+	var _PageThumbnail = __webpack_require__(447);
 
 	var _PageThumbnail2 = _interopRequireDefault(_PageThumbnail);
 
@@ -18044,7 +18058,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(_PageThumbnail2.default);
 
 /***/ }),
-/* 450 */
+/* 449 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18064,43 +18078,43 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _classnames2 = _interopRequireDefault(_classnames);
 
-	var _InfoBox = __webpack_require__(451);
+	var _InfoBox = __webpack_require__(450);
 
 	var _InfoBox2 = _interopRequireDefault(_InfoBox);
 
-	var _Container = __webpack_require__(452);
+	var _Container = __webpack_require__(451);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
-	var _LoadingSpinner = __webpack_require__(453);
+	var _LoadingSpinner = __webpack_require__(452);
 
 	var _LoadingSpinner2 = _interopRequireDefault(_LoadingSpinner);
 
-	var _PlayButton = __webpack_require__(464);
+	var _PlayButton = __webpack_require__(465);
 
 	var _PlayButton2 = _interopRequireDefault(_PlayButton);
 
-	var _CurrentTime = __webpack_require__(466);
+	var _CurrentTime = __webpack_require__(467);
 
 	var _CurrentTime2 = _interopRequireDefault(_CurrentTime);
 
-	var _TimeDivider = __webpack_require__(468);
+	var _TimeDivider = __webpack_require__(469);
 
 	var _TimeDivider2 = _interopRequireDefault(_TimeDivider);
 
-	var _Duration = __webpack_require__(469);
+	var _Duration = __webpack_require__(470);
 
 	var _Duration2 = _interopRequireDefault(_Duration);
 
-	var _ProgressSlider = __webpack_require__(470);
+	var _ProgressSlider = __webpack_require__(471);
 
 	var _ProgressSlider2 = _interopRequireDefault(_ProgressSlider);
 
-	var _MenuBar = __webpack_require__(484);
+	var _MenuBar = __webpack_require__(485);
 
 	var _MenuBar2 = _interopRequireDefault(_MenuBar);
 
-	var _withVisibilityWatching = __webpack_require__(488);
+	var _withVisibilityWatching = __webpack_require__(489);
 
 	var _withVisibilityWatching2 = _interopRequireDefault(_withVisibilityWatching);
 
@@ -18196,7 +18210,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = (0, _withVisibilityWatching2.default)(PlayerControls);
 
 /***/ }),
-/* 451 */
+/* 450 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18255,7 +18269,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = InfoBox;
 
 /***/ }),
-/* 452 */
+/* 451 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18285,7 +18299,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 453 */
+/* 452 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18302,14 +18316,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	};
 
-	var _Icon = __webpack_require__(454);
+	var _Icon = __webpack_require__(453);
 
 	var _Icon2 = _interopRequireDefault(_Icon);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 454 */
+/* 453 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18323,7 +18337,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _react2 = _interopRequireDefault(_react);
 
-	var _mapping = __webpack_require__(455);
+	var _mapping = __webpack_require__(454);
 
 	var _mapping2 = _interopRequireDefault(_mapping);
 
@@ -18354,7 +18368,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 455 */
+/* 454 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18363,7 +18377,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _icons = __webpack_require__(456);
+	var _icons = __webpack_require__(455);
 
 	var _icons2 = _interopRequireDefault(_icons);
 
@@ -18392,11 +18406,13 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  mediaQuality: _icons2.default.Gear,
 	  textTracks: _icons2.default.Subtitles,
 	  activeMenuItem: _icons2.default.Checkmark,
-	  loadingSpinner: _icons2.default.CircleWithNotch
+	  loadingSpinner: _icons2.default.CircleWithNotch,
+	  play: _icons2.default.Play,
+	  pause: _icons2.default.Pause
 	};
 
 /***/ }),
-/* 456 */
+/* 455 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18405,27 +18421,35 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _Checkmark = __webpack_require__(457);
+	var _Checkmark = __webpack_require__(456);
 
 	var _Checkmark2 = _interopRequireDefault(_Checkmark);
 
-	var _CircleWithNotch = __webpack_require__(459);
+	var _CircleWithNotch = __webpack_require__(458);
 
 	var _CircleWithNotch2 = _interopRequireDefault(_CircleWithNotch);
 
-	var _Disk = __webpack_require__(460);
+	var _Disk = __webpack_require__(459);
 
 	var _Disk2 = _interopRequireDefault(_Disk);
 
-	var _Gear = __webpack_require__(461);
+	var _Gear = __webpack_require__(460);
 
 	var _Gear2 = _interopRequireDefault(_Gear);
 
-	var _Info = __webpack_require__(462);
+	var _Info = __webpack_require__(461);
 
 	var _Info2 = _interopRequireDefault(_Info);
 
-	var _Subtitles = __webpack_require__(463);
+	var _Pause = __webpack_require__(462);
+
+	var _Pause2 = _interopRequireDefault(_Pause);
+
+	var _Play = __webpack_require__(463);
+
+	var _Play2 = _interopRequireDefault(_Play);
+
+	var _Subtitles = __webpack_require__(464);
 
 	var _Subtitles2 = _interopRequireDefault(_Subtitles);
 
@@ -18437,11 +18461,13 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  Disk: _Disk2.default,
 	  Gear: _Gear2.default,
 	  Info: _Info2.default,
+	  Pause: _Pause2.default,
+	  Play: _Play2.default,
 	  Subtitles: _Subtitles2.default
 	};
 
 /***/ }),
-/* 457 */
+/* 456 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18460,14 +18486,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	};
 
-	var _Container = __webpack_require__(458);
+	var _Container = __webpack_require__(457);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 458 */
+/* 457 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18544,7 +18570,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = Container;
 
 /***/ }),
-/* 459 */
+/* 458 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18563,14 +18589,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	};
 
-	var _Container = __webpack_require__(458);
+	var _Container = __webpack_require__(457);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 460 */
+/* 459 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18589,14 +18615,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	};
 
-	var _Container = __webpack_require__(458);
+	var _Container = __webpack_require__(457);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 461 */
+/* 460 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18621,14 +18647,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  ;
 	};
 
-	var _Container = __webpack_require__(458);
+	var _Container = __webpack_require__(457);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 462 */
+/* 461 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18649,7 +18675,34 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	};
 
-	var _Container = __webpack_require__(458);
+	var _Container = __webpack_require__(457);
+
+	var _Container2 = _interopRequireDefault(_Container);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/***/ }),
+/* 462 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+	exports.default = function (props) {
+	  return React.createElement(
+	    _Container2.default,
+	    _extends({}, props, { viewBoxWidth: 512, viewBoxHeight: 512 }),
+	    React.createElement("path", { d: "M162.642 148.337h86.034v215.317h-86.034v-215.316z" }),
+	    React.createElement("path", { d: "M293.356 148.337h86.002v215.317h-86.002v-215.316z" })
+	  );
+	};
+
+	var _Container = __webpack_require__(457);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
@@ -18667,6 +18720,32 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
+	exports.default = function (props) {
+	  return React.createElement(
+	    _Container2.default,
+	    _extends({}, props, { viewBoxWidth: 512, viewBoxHeight: 512 }),
+	    React.createElement("path", { d: "M152.443 136.417l207.114 119.573-207.114 119.593z" })
+	  );
+	};
+
+	var _Container = __webpack_require__(457);
+
+	var _Container2 = _interopRequireDefault(_Container);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+/***/ }),
+/* 464 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	"use strict";
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
 	exports.default = function (props) {
 	  return React.createElement(
 	    _Container2.default,
@@ -18676,14 +18755,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	};
 
-	var _Container = __webpack_require__(458);
+	var _Container = __webpack_require__(457);
 
 	var _Container2 = _interopRequireDefault(_Container);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 464 */
+/* 465 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18696,11 +18775,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _classnames2 = _interopRequireDefault(_classnames);
 
-	var _Icon = __webpack_require__(454);
+	var _Icon = __webpack_require__(453);
 
 	var _Icon2 = _interopRequireDefault(_Icon);
 
-	var _pageSkipLinkTarget = __webpack_require__(465);
+	var _pageSkipLinkTarget = __webpack_require__(466);
 
 	var _pageSkipLinkTarget2 = _interopRequireDefault(_pageSkipLinkTarget);
 
@@ -18745,7 +18824,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 465 */
+/* 466 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18769,7 +18848,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var _utils = __webpack_require__(340);
 
 /***/ }),
-/* 466 */
+/* 467 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18782,14 +18861,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return React.createElement(_TimeDisplay2.default, { className: "vjs-current-time", value: props.currentTime });
 	};
 
-	var _TimeDisplay = __webpack_require__(467);
+	var _TimeDisplay = __webpack_require__(468);
 
 	var _TimeDisplay2 = _interopRequireDefault(_TimeDisplay);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 467 */
+/* 468 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18809,7 +18888,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function TimeDisplay(props) {
 	  return React.createElement(
 	    'div',
-	    { className: (0, _classnames2.default)(props.className, 'vjs-current-time') },
+	    { className: (0, _classnames2.default)(props.className) },
 	    format(props.value)
 	  );
 	}
@@ -18841,7 +18920,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 468 */
+/* 469 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -18859,7 +18938,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 469 */
+/* 470 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -18872,14 +18951,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return React.createElement(_TimeDisplay2.default, { className: "vjs-duration", value: props.duration });
 	};
 
-	var _TimeDisplay = __webpack_require__(467);
+	var _TimeDisplay = __webpack_require__(468);
 
 	var _TimeDisplay2 = _interopRequireDefault(_TimeDisplay);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 470 */
+/* 471 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -18894,13 +18973,13 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _react2 = _interopRequireDefault(_react);
 
-	var _reactDraggable = __webpack_require__(471);
+	var _reactDraggable = __webpack_require__(472);
 
-	var _reactMeasure = __webpack_require__(472);
+	var _reactMeasure = __webpack_require__(473);
 
 	var _reactMeasure2 = _interopRequireDefault(_reactMeasure);
 
-	var _keyCodes = __webpack_require__(483);
+	var _keyCodes = __webpack_require__(484);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -19042,12 +19121,12 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 471 */
+/* 472 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	(function webpackUniversalModuleDefinition(root, factory) {
 		if(true)
-			module.exports = factory(__webpack_require__(334), __webpack_require__(437));
+			module.exports = factory(__webpack_require__(334), __webpack_require__(426));
 		else if(typeof define === 'function' && define.amd)
 			define(["react", "react-dom"], factory);
 		else if(typeof exports === 'object')
@@ -21502,7 +21581,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	//# sourceMappingURL=react-draggable.js.map
 
 /***/ }),
-/* 472 */
+/* 473 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -21512,7 +21591,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.default = undefined;
 
-	var _Measure = __webpack_require__(473);
+	var _Measure = __webpack_require__(474);
 
 	var _Measure2 = _interopRequireDefault(_Measure);
 
@@ -21522,7 +21601,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	module.exports = exports['default'];
 
 /***/ }),
-/* 473 */
+/* 474 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -21539,19 +21618,19 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _react2 = _interopRequireDefault(_react);
 
-	var _propTypes = __webpack_require__(474);
+	var _propTypes = __webpack_require__(475);
 
 	var _propTypes2 = _interopRequireDefault(_propTypes);
 
-	var _reactDom = __webpack_require__(437);
+	var _reactDom = __webpack_require__(426);
 
 	var _reactDom2 = _interopRequireDefault(_reactDom);
 
-	var _resizeObserverPolyfill = __webpack_require__(479);
+	var _resizeObserverPolyfill = __webpack_require__(480);
 
 	var _resizeObserverPolyfill2 = _interopRequireDefault(_resizeObserverPolyfill);
 
-	var _getNodeDimensions = __webpack_require__(480);
+	var _getNodeDimensions = __webpack_require__(481);
 
 	var _getNodeDimensions2 = _interopRequireDefault(_getNodeDimensions);
 
@@ -21721,7 +21800,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	module.exports = exports['default'];
 
 /***/ }),
-/* 474 */
+/* 475 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	/**
@@ -21750,12 +21829,12 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	} else {
 	  // By explicitly using `prop-types` you are opting into new production behavior.
 	  // http://fb.me/prop-types-in-prod
-	  module.exports = __webpack_require__(475)();
+	  module.exports = __webpack_require__(476)();
 	}
 
 
 /***/ }),
-/* 475 */
+/* 476 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	/**
@@ -21767,9 +21846,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	'use strict';
 
-	var emptyFunction = __webpack_require__(476);
-	var invariant = __webpack_require__(477);
-	var ReactPropTypesSecret = __webpack_require__(478);
+	var emptyFunction = __webpack_require__(477);
+	var invariant = __webpack_require__(478);
+	var ReactPropTypesSecret = __webpack_require__(479);
 
 	module.exports = function() {
 	  function shim(props, propName, componentName, location, propFullName, secret) {
@@ -21819,7 +21898,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 
 /***/ }),
-/* 476 */
+/* 477 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -21860,7 +21939,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	module.exports = emptyFunction;
 
 /***/ }),
-/* 477 */
+/* 478 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	/**
@@ -21918,7 +21997,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	module.exports = invariant;
 
 /***/ }),
-/* 478 */
+/* 479 */
 /***/ (function(module, exports) {
 
 	/**
@@ -21936,7 +22015,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 
 /***/ }),
-/* 479 */
+/* 480 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	/* WEBPACK VAR INJECTION */(function(global) {(function (global, factory) {
@@ -22975,7 +23054,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	/* WEBPACK VAR INJECTION */}.call(exports, (function() { return this; }())))
 
 /***/ }),
-/* 480 */
+/* 481 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -22987,11 +23066,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-	var _getCloneDimensions = __webpack_require__(481);
+	var _getCloneDimensions = __webpack_require__(482);
 
 	var _getCloneDimensions2 = _interopRequireDefault(_getCloneDimensions);
 
-	var _getMargin = __webpack_require__(482);
+	var _getMargin = __webpack_require__(483);
 
 	var _getMargin2 = _interopRequireDefault(_getMargin);
 
@@ -23036,7 +23115,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	module.exports = exports['default'];
 
 /***/ }),
-/* 481 */
+/* 482 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23048,7 +23127,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
 
-	var _getMargin = __webpack_require__(482);
+	var _getMargin = __webpack_require__(483);
 
 	var _getMargin2 = _interopRequireDefault(_getMargin);
 
@@ -23114,7 +23193,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	module.exports = exports['default'];
 
 /***/ }),
-/* 482 */
+/* 483 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -23139,7 +23218,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	module.exports = exports["default"];
 
 /***/ }),
-/* 483 */
+/* 484 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -23154,7 +23233,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var TAB = exports.TAB = 9;
 
 /***/ }),
-/* 484 */
+/* 485 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23168,15 +23247,15 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _classnames2 = _interopRequireDefault(_classnames);
 
-	var _QualityMenu = __webpack_require__(485);
+	var _QualityMenu = __webpack_require__(486);
 
 	var _QualityMenu2 = _interopRequireDefault(_QualityMenu);
 
-	var _TextTracksMenu = __webpack_require__(487);
+	var _TextTracksMenu = __webpack_require__(488);
 
 	var _TextTracksMenu2 = _interopRequireDefault(_TextTracksMenu);
 
-	var _MenuBarButton = __webpack_require__(486);
+	var _MenuBarButton = __webpack_require__(487);
 
 	var _MenuBarButton2 = _interopRequireDefault(_MenuBarButton);
 
@@ -23213,7 +23292,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  textTracksMenuItems: _TextTracksMenu2.default.propTypes.items,
 	  onTextTracksMenuItemClick: React.PropTypes.func,
 
-	  standAlone: React.PropTypes.bool
+	  standAlone: React.PropTypes.bool,
+	  inverted: React.PropTypes.bool
 	};
 
 	MenuBar.defaultProps = {
@@ -23224,7 +23304,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function className(props) {
 	  return (0, _classnames2.default)(props.className, 'player_controls-menu_bar', {
 	    'player_controls-menu_bar-hidden_on_phone': props.hiddenOnPhone,
-	    'player_controls-menu_bar-stand_alone': props.standAlone
+	    'player_controls-menu_bar-stand_alone': props.standAlone,
+	    'player_controls-menu_bar-inverted': props.inverted
 	  });
 	}
 
@@ -23249,7 +23330,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 485 */
+/* 486 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -23259,7 +23340,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.default = QualityMenu;
 
-	var _MenuBarButton = __webpack_require__(486);
+	var _MenuBarButton = __webpack_require__(487);
 
 	var _MenuBarButton2 = _interopRequireDefault(_MenuBarButton);
 
@@ -23288,7 +23369,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 486 */
+/* 487 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23303,7 +23384,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _classnames2 = _interopRequireDefault(_classnames);
 
-	var _Icon = __webpack_require__(454);
+	var _Icon = __webpack_require__(453);
 
 	var _Icon2 = _interopRequireDefault(_Icon);
 
@@ -23506,7 +23587,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 487 */
+/* 488 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	"use strict";
@@ -23516,7 +23597,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.default = TextTracksMenu;
 
-	var _MenuBarButton = __webpack_require__(486);
+	var _MenuBarButton = __webpack_require__(487);
 
 	var _MenuBarButton2 = _interopRequireDefault(_MenuBarButton);
 
@@ -23545,7 +23626,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 488 */
+/* 489 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23562,7 +23643,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _react2 = _interopRequireDefault(_react);
 
-	var _reactDom = __webpack_require__(437);
+	var _reactDom = __webpack_require__(426);
 
 	var _reactDom2 = _interopRequireDefault(_reactDom);
 
@@ -23643,7 +23724,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 489 */
+/* 490 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23652,7 +23733,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _selectors = __webpack_require__(490);
+	var _selectors = __webpack_require__(491);
 
 	var _utils = __webpack_require__(340);
 
@@ -23678,7 +23759,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(CloseButton);
 
 /***/ }),
-/* 490 */
+/* 491 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23705,7 +23786,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 491 */
+/* 492 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -23725,7 +23806,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 492 */
+/* 493 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23737,17 +23818,17 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _selectors = __webpack_require__(376);
 
-	var _selectors2 = __webpack_require__(493);
+	var _selectors2 = __webpack_require__(494);
 
-	var _selectors3 = __webpack_require__(490);
+	var _selectors3 = __webpack_require__(491);
 
-	var _selectors4 = __webpack_require__(496);
+	var _selectors4 = __webpack_require__(497);
 
 	var _selectors5 = __webpack_require__(429);
 
-	var _selectors6 = __webpack_require__(447);
+	var _selectors6 = __webpack_require__(446);
 
-	var _selectors7 = __webpack_require__(497);
+	var _selectors7 = __webpack_require__(498);
 
 	exports.pageAttribute = _selectors.pageAttribute;
 	exports.pageAttributes = _selectors.pageAttributes;
@@ -23763,7 +23844,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.editingWidget = _selectors7.editingWidget;
 
 /***/ }),
-/* 493 */
+/* 494 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23776,9 +23857,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _selectors = __webpack_require__(376);
 
-	var _selectors2 = __webpack_require__(494);
+	var _selectors2 = __webpack_require__(495);
 
-	var _selectors3 = __webpack_require__(495);
+	var _selectors3 = __webpack_require__(496);
 
 	function currentParentChapterAttributes() {
 	  return function (state, props) {
@@ -23813,7 +23894,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 494 */
+/* 495 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23839,7 +23920,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var chapterAttributes = exports.chapterAttributes = selector;
 
 /***/ }),
-/* 495 */
+/* 496 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23863,7 +23944,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 496 */
+/* 497 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -23881,7 +23962,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 497 */
+/* 498 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23924,7 +24005,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 498 */
+/* 499 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -23932,54 +24013,66 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.PageBackground = exports.PageBackgroundAsset = exports.PageBackgroundVideo = exports.PagePrintImage = exports.MobilePageVideoPoster = exports.PageVideoPlayer = exports.Page = exports.pageBackgroundReduxModule = undefined;
+	exports.WaveformPlayerControls = exports.PageBackground = exports.PageBackgroundAsset = exports.PageBackgroundVideo = exports.PagePrintImage = exports.MobilePageVideoPoster = exports.PageVideoPlayer = exports.PageAudioFilePlayer = exports.Page = exports.pageBackgroundReduxModule = undefined;
 	exports.reduxModule = reduxModule;
 
-	var _Page = __webpack_require__(499);
+	var _Page = __webpack_require__(500);
 
 	var _Page2 = _interopRequireDefault(_Page);
 
-	var _PageVideoPlayer = __webpack_require__(507);
+	var _PageAudioFilePlayer = __webpack_require__(509);
+
+	var _PageAudioFilePlayer2 = _interopRequireDefault(_PageAudioFilePlayer);
+
+	var _PageVideoPlayer = __webpack_require__(519);
 
 	var _PageVideoPlayer2 = _interopRequireDefault(_PageVideoPlayer);
 
-	var _MobilePageVideoPoster = __webpack_require__(521);
+	var _MobilePageVideoPoster = __webpack_require__(525);
 
 	var _MobilePageVideoPoster2 = _interopRequireDefault(_MobilePageVideoPoster);
 
-	var _PageBackgroundVideo = __webpack_require__(522);
+	var _PageBackgroundVideo = __webpack_require__(526);
 
 	var _PageBackgroundVideo2 = _interopRequireDefault(_PageBackgroundVideo);
 
-	var _PageBackgroundAsset = __webpack_require__(523);
+	var _PageBackgroundAsset = __webpack_require__(527);
 
 	var _PageBackgroundAsset2 = _interopRequireDefault(_PageBackgroundAsset);
 
-	var _PageBackground = __webpack_require__(524);
+	var _PageBackground = __webpack_require__(528);
 
 	var _PageBackground2 = _interopRequireDefault(_PageBackground);
 
-	var _PagePrintImage = __webpack_require__(525);
+	var _PagePrintImage = __webpack_require__(529);
 
 	var _PagePrintImage2 = _interopRequireDefault(_PagePrintImage);
 
-	var _createReducer = __webpack_require__(526);
+	var _WaveformPlayerControls = __webpack_require__(530);
+
+	var _WaveformPlayerControls2 = _interopRequireDefault(_WaveformPlayerControls);
+
+	var _createReducer = __webpack_require__(538);
 
 	var _createReducer2 = _interopRequireDefault(_createReducer);
 
-	var _sagas = __webpack_require__(528);
+	var _reducer = __webpack_require__(540);
+
+	var _reducer2 = _interopRequireDefault(_reducer);
+
+	var _sagas = __webpack_require__(541);
 
 	var _sagas2 = _interopRequireDefault(_sagas);
 
-	var _fadeInWhenPageWillActivate = __webpack_require__(538);
+	var _fadeInWhenPageWillActivate = __webpack_require__(551);
 
 	var _fadeInWhenPageWillActivate2 = _interopRequireDefault(_fadeInWhenPageWillActivate);
 
-	var _fadeOutWhenPageWillDeactivate = __webpack_require__(536);
+	var _fadeOutWhenPageWillDeactivate = __webpack_require__(549);
 
 	var _fadeOutWhenPageWillDeactivate2 = _interopRequireDefault(_fadeOutWhenPageWillDeactivate);
 
-	var _muteBackgroundMediaOnPlayFailed = __webpack_require__(530);
+	var _muteBackgroundMediaOnPlayFailed = __webpack_require__(543);
 
 	var _muteBackgroundMediaOnPlayFailed2 = _interopRequireDefault(_muteBackgroundMediaOnPlayFailed);
 
@@ -23988,7 +24081,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function reduxModule(options) {
 	  return {
 	    reducers: {
-	      'media.default': (0, _createReducer2.default)({ scope: 'default' })
+	      'media.default': (0, _createReducer2.default)({ scope: 'default' }),
+	      'media.pageScrollerMargin': _reducer2.default
 	    },
 
 	    saga: /*#__PURE__*/regeneratorRuntime.mark(function saga() {
@@ -24032,15 +24126,17 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 	exports.Page = _Page2.default;
+	exports.PageAudioFilePlayer = _PageAudioFilePlayer2.default;
 	exports.PageVideoPlayer = _PageVideoPlayer2.default;
 	exports.MobilePageVideoPoster = _MobilePageVideoPoster2.default;
 	exports.PagePrintImage = _PagePrintImage2.default;
 	exports.PageBackgroundVideo = _PageBackgroundVideo2.default;
 	exports.PageBackgroundAsset = _PageBackgroundAsset2.default;
 	exports.PageBackground = _PageBackground2.default;
+	exports.WaveformPlayerControls = _WaveformPlayerControls2.default;
 
 /***/ }),
-/* 499 */
+/* 500 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24052,32 +24148,34 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _components = __webpack_require__(332);
 
-	var _media = __webpack_require__(498);
+	var _media = __webpack_require__(499);
 
-	var _PlayerControls = __webpack_require__(500);
+	var _PlayerControls = __webpack_require__(501);
 
 	var _PlayerControls2 = _interopRequireDefault(_PlayerControls);
 
-	var _NonJsLinks = __webpack_require__(505);
+	var _NonJsLinks = __webpack_require__(506);
 
 	var _NonJsLinks2 = _interopRequireDefault(_NonJsLinks);
 
-	var _playerStateClassNames = __webpack_require__(501);
+	var _playerStateClassNames = __webpack_require__(502);
 
 	var _playerStateClassNames2 = _interopRequireDefault(_playerStateClassNames);
 
 	var _utils = __webpack_require__(340);
 
-	var _selectors = __webpack_require__(447);
+	var _selectors = __webpack_require__(446);
+
+	var _selectors2 = __webpack_require__(503);
 
-	var _selectors2 = __webpack_require__(502);
+	var _selectors3 = __webpack_require__(508);
+
+	var _pages = __webpack_require__(349);
 
 	var _classnames = __webpack_require__(335);
 
 	var _classnames2 = _interopRequireDefault(_classnames);
 
-	var _reactRedux = __webpack_require__(399);
-
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 	function MediaPage(props) {
@@ -24110,15 +24208,18 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	        playerActions: props.playerActions,
 	        qualities: props.qualities,
 	        controlBarText: props.controlBarText,
-	        infoBox: infoBox }),
+	        infoBox: infoBox,
+	        playerControlsComponent: props.playerControlsComponent }),
 	      React.createElement(
 	        _components.PageScroller,
-	        { className: (0, _playerStateClassNames2.default)(playerState) },
+	        { className: (0, _playerStateClassNames2.default)(playerState),
+	          marginBottom: props.dynamicPageScrollerMargin && props.pageScrollerMarginBottom },
 	        React.createElement(_components.PageHeader, { page: page }),
 	        React.createElement(_media.PagePrintImage, { page: page }),
 	        React.createElement(
 	          _components.PageText,
-	          { page: page },
+	          { page: page,
+	            marginBottom: props.dynamicPageScrollerMargin ? 'none' : 'for_player_controls' },
 	          React.createElement(_NonJsLinks2.default, { file: props.file })
 	        )
 	      )
@@ -24126,7 +24227,12 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  );
 	}
 
-	exports.default = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
+	MediaPage.defaultProps = {
+	  playerControlsCanOverlapPageText: true
+	};
+
+	exports.default = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
+	  pageScrollerMarginBottom: _selectors3.pageScrollerMarginBottom,
 	  textTracks: (0, _selectors2.textTracks)({
 	    file: (0, _selectors.prop)('file'),
 	    defaultTextTrackFileId: (0, _selectors.prop)('page.defaultTextTrackFileId')
@@ -24157,7 +24263,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 500 */
+/* 501 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24170,21 +24276,21 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	exports.MediaPlayerControls = MediaPlayerControls;
 
-	var _playerStateClassNames = __webpack_require__(501);
+	var _playerStateClassNames = __webpack_require__(502);
 
 	var _playerStateClassNames2 = _interopRequireDefault(_playerStateClassNames);
 
-	var _PlayerControls = __webpack_require__(450);
+	var _PlayerControls = __webpack_require__(449);
 
 	var _PlayerControls2 = _interopRequireDefault(_PlayerControls);
 
 	var _utils = __webpack_require__(340);
 
-	var _selectors = __webpack_require__(502);
+	var _selectors = __webpack_require__(503);
 
-	var _selectors2 = __webpack_require__(490);
+	var _selectors2 = __webpack_require__(491);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _react = __webpack_require__(334);
 
@@ -24214,7 +24320,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    }
 	  };
 
-	  return _react2.default.createElement(_PlayerControls2.default, _extends({ hasProgress: true,
+	  var PlayerControls = props.playerControlsComponent;
+
+	  return _react2.default.createElement(PlayerControls, _extends({ hasProgress: true,
 	    controlBarText: props.controlBarText,
 
 	    isLoading: playerState.isLoading || playerState.bufferUnderrun,
@@ -24223,6 +24331,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    bufferedEnd: playerState.bufferedEnd,
 	    duration: playerState.duration,
 
+	    mediaElementId: playerState.mediaElementId,
+
 	    onPlayButtonClick: actions.togglePlaying,
 	    onScrub: actions.scrubTo,
 	    onSeek: actions.seekTo,
@@ -24256,6 +24366,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 	MediaPlayerControls.defaultProps = {
+	  playerControlsComponent: _PlayerControls2.default,
 	  qualities: [],
 	  textTracks: {
 	    files: []
@@ -24352,7 +24463,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 501 */
+/* 502 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24376,7 +24487,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 502 */
+/* 503 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24394,17 +24505,17 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.pageShouldAutoplay = pageShouldAutoplay;
 	exports.pageHasAutoplayOption = pageHasAutoplayOption;
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _selectors = __webpack_require__(429);
 
 	var _selectors2 = __webpack_require__(376);
 
-	var _selectors3 = __webpack_require__(496);
+	var _selectors3 = __webpack_require__(497);
 
-	var _selectors4 = __webpack_require__(490);
+	var _selectors4 = __webpack_require__(491);
 
-	var _selectors5 = __webpack_require__(504);
+	var _selectors5 = __webpack_require__(505);
 
 	var _utils = __webpack_require__(340);
 
@@ -24518,7 +24629,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 503 */
+/* 504 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24526,7 +24637,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.TOGGLE_INFO_BOX_DURING_PLAYBACK = exports.HIDE_INFO_BOX_DURING_PLAYBACK = exports.SHOW_INFO_BOX_DURING_PLAYBACK = exports.CONTROLS_HIDDEN = exports.FOCUS_LEFT_CONTROLS = exports.FOCUS_ENTERED_CONTROLS = exports.CONTROLS_LEFT = exports.CONTROLS_ENTERED = exports.USER_IDLE = exports.USER_INTERACTION = exports.HAS_NOT_BEEN_PLAYING_FOR_A_MOMENT = exports.WAITING = exports.SEEKED = exports.SEEKING = exports.ENDED = exports.TIME_UPDATE = exports.PAUSED = exports.PLAYING = exports.PROGRESS = exports.META_DATA_LOADED = exports.BUFFER_UNDERRUN_CONTINUE = exports.BUFFER_UNDERRUN = exports.ABORT_PREBUFFERING = exports.PREBUFFERED = exports.PREBUFFER = exports.SEEK_TO = exports.SCRUB_TO = exports.PLAYING_MUTED = exports.PLAY_FAILED = exports.CHANGE_VOLUME_FACTOR = exports.FADE_OUT_AND_PAUSE = exports.PAUSE = exports.PLAY_AND_FADE_IN = exports.PLAY = exports.TOGGLE_PLAYING = undefined;
+	exports.DISCARD_MEDIA_ELEMENT_ID = exports.SAVE_MEDIA_ELEMENT_ID = exports.TOGGLE_INFO_BOX_DURING_PLAYBACK = exports.HIDE_INFO_BOX_DURING_PLAYBACK = exports.SHOW_INFO_BOX_DURING_PLAYBACK = exports.CONTROLS_HIDDEN = exports.FOCUS_LEFT_CONTROLS = exports.FOCUS_ENTERED_CONTROLS = exports.CONTROLS_LEFT = exports.CONTROLS_ENTERED = exports.USER_IDLE = exports.USER_INTERACTION = exports.HAS_NOT_BEEN_PLAYING_FOR_A_MOMENT = exports.WAITING = exports.SEEKED = exports.SEEKING = exports.ENDED = exports.TIME_UPDATE = exports.PAUSED = exports.PLAYING = exports.PROGRESS = exports.META_DATA_LOADED = exports.BUFFER_UNDERRUN_CONTINUE = exports.BUFFER_UNDERRUN = exports.ABORT_PREBUFFERING = exports.PREBUFFERED = exports.PREBUFFER = exports.SEEK_TO = exports.SCRUB_TO = exports.PLAYING_MUTED = exports.PLAY_FAILED = exports.CHANGE_VOLUME_FACTOR = exports.FADE_OUT_AND_PAUSE = exports.PAUSE = exports.PLAY_AND_FADE_IN = exports.PLAY = exports.TOGGLE_PLAYING = undefined;
 	exports.actionCreators = actionCreators;
 	exports.updateTextTrackSettings = updateTextTrackSettings;
 	exports.updateVideoQualitySetting = updateVideoQualitySetting;
@@ -24581,6 +24692,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var HIDE_INFO_BOX_DURING_PLAYBACK = exports.HIDE_INFO_BOX_DURING_PLAYBACK = 'HIDE_INFO_BOX_DURING_PLAYBACK';
 	var TOGGLE_INFO_BOX_DURING_PLAYBACK = exports.TOGGLE_INFO_BOX_DURING_PLAYBACK = 'TOGGLE_INFO_BOX_DURING_PLAYBACK';
 
+	var SAVE_MEDIA_ELEMENT_ID = exports.SAVE_MEDIA_ELEMENT_ID = 'MEDIA_SAVE_MEDIA_ELEMENT_ID';
+	var DISCARD_MEDIA_ELEMENT_ID = exports.DISCARD_MEDIA_ELEMENT_ID = 'MEDIA_DISCARD_MEDIA_ELEMENT_ID';
+
 	function actionCreators() {
 	  var _ref = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {},
 	      _ref$scope = _ref.scope,
@@ -24724,6 +24838,12 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    },
 	    toggleInfoBoxDuringPlayback: function toggleInfoBoxDuringPlayback() {
 	      return pageAction(TOGGLE_INFO_BOX_DURING_PLAYBACK);
+	    },
+	    saveMediaElementId: function saveMediaElementId(id) {
+	      return pageAction(SAVE_MEDIA_ELEMENT_ID, { id: id });
+	    },
+	    discardMediaElementId: function discardMediaElementId() {
+	      return pageAction(DISCARD_MEDIA_ELEMENT_ID);
 	    }
 	  };
 
@@ -24759,7 +24879,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 504 */
+/* 505 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -24773,7 +24893,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 505 */
+/* 506 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24785,9 +24905,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _utils = __webpack_require__(340);
 
-	var _selectors = __webpack_require__(490);
+	var _selectors = __webpack_require__(491);
 
-	var _selectors2 = __webpack_require__(506);
+	var _selectors2 = __webpack_require__(507);
 
 	var _reactRedux = __webpack_require__(399);
 
@@ -24829,7 +24949,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(NonJsLinks);
 
 /***/ }),
-/* 506 */
+/* 507 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -24850,7 +24970,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 507 */
+/* 508 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24858,74 +24978,46 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.VideoPlayer = undefined;
+	exports.pageScrollerMarginBottom = undefined;
 
-	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-	exports.default = PageVideoPlayer;
-
-	var _VideoFilePlayer = __webpack_require__(508);
-
-	var _VideoFilePlayer2 = _interopRequireDefault(_VideoFilePlayer);
-
-	var _PageFilePlayer = __webpack_require__(520);
+	var _selectors = __webpack_require__(376);
 
-	var _PageFilePlayer2 = _interopRequireDefault(_PageFilePlayer);
+	var _utils = __webpack_require__(340);
 
-	var _selectors = __webpack_require__(504);
+	var pageScrollerMarginBottom = exports.pageScrollerMarginBottom = (0, _utils.memoizedSelector)((0, _selectors.pageState)('media.pageScrollerMargin'), function (pageState) {
+	  return pageState && pageState.bottom;
+	});
 
-	var _selectors2 = __webpack_require__(429);
+/***/ }),
+/* 509 */
+/***/ (function(module, exports, __webpack_require__) {
 
-	var _selectors3 = __webpack_require__(492);
+	'use strict';
 
-	var _utils = __webpack_require__(340);
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
 
-	var _reactRedux = __webpack_require__(399);
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+	exports.default = PageAudioFilePlayer;
 
-	function PageVideoFilePlayer(props) {
-	  return React.createElement(_PageFilePlayer2.default, _extends({}, props, {
-	    playerComponent: _VideoFilePlayer2.default,
-	    preloadComponent: _VideoFilePlayer.VideoFilePlayerPreload }));
-	}
+	var _PageFilePlayer = __webpack_require__(510);
 
-	var VideoPlayer = exports.VideoPlayer = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
-	  file: (0, _selectors2.file)('videoFiles', { id: (0, _selectors3.prop)('videoFileId') }),
-	  posterImageFile: (0, _selectors2.file)('imageFiles', { id: (0, _selectors3.prop)('posterImageFileId') }),
-	  muted: muted
-	}))(PageVideoFilePlayer);
+	var _PageFilePlayer2 = _interopRequireDefault(_PageFilePlayer);
 
-	function muted(state, props) {
-	  return props.muted || (0, _selectors.muted)(state);
-	}
+	var _AudioFilePlayer = __webpack_require__(511);
 
-	function PageVideoPlayer(props) {
-	  var page = props.page;
+	var _AudioFilePlayer2 = _interopRequireDefault(_AudioFilePlayer);
 
-	  var videoProperty = _utils.camelize.concat(props.propertyNamePrefix, props.videoPropertyBaseName);
-	  var posterProperty = _utils.camelize.concat(props.propertyNamePrefix, props.posterImagePropertyBaseName);
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-	  return React.createElement(VideoPlayer, { videoFileId: page[videoProperty + 'Id'],
-	    posterImageFileId: page[posterProperty + 'Id'],
-	    playerState: props.playerState,
-	    playerActions: props.playerActions,
-	    fit: props.fit,
-	    position: [page[videoProperty + 'X'], page[videoProperty + 'Y']],
-	    textTracksEnabled: props.textTracksEnabled,
-	    loop: props.loop,
-	    muted: props.muted,
-	    playsInline: props.playsInline });
+	function PageAudioFilePlayer(props) {
+	  return React.createElement(_PageFilePlayer2.default, _extends({}, props, { playerComponent: _AudioFilePlayer2.default }));
 	}
 
-	PageVideoPlayer.defaultProps = {
-	  videoPropertyBaseName: 'videoFile',
-	  posterImagePropertyBaseName: 'posterImage',
-	  fit: 'smart_contain'
-	};
-
 /***/ }),
-/* 508 */
+/* 510 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -24933,105 +25025,77 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.VideoFilePlayerPreload = undefined;
-
-	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
-
-	exports.default = VideoFilePlayer;
-
-	var _react = __webpack_require__(334);
-
-	var _react2 = _interopRequireDefault(_react);
-
-	var _createFilePlayer = __webpack_require__(509);
-
-	var _createFilePlayer2 = _interopRequireDefault(_createFilePlayer);
-
-	var _Positioner = __webpack_require__(516);
-
-	var _Positioner2 = _interopRequireDefault(_Positioner);
+	exports.PageFilePlayer = PageFilePlayer;
 
-	var _sources = __webpack_require__(519);
+	var _pages = __webpack_require__(349);
 
-	var _sources2 = _interopRequireDefault(_sources);
+	var _selectors = __webpack_require__(376);
 
 	var _utils = __webpack_require__(340);
 
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+	function PageFilePlayer(props) {
+	  var fileReady = props.file && props.file.isReady;
 
-	var FilePlayer = (0, _createFilePlayer2.default)({
-	  tagName: 'video',
-	  sources: _sources2.default,
-	  poster: poster
-	});
+	  if (fileReady && props.pageIsPrepared) {
+	    var FilePlayer = props.playerComponent;
 
-	function VideoFilePlayer(props) {
-	  return _react2.default.createElement(
-	    _Positioner2.default,
-	    { videoFile: props.file, fit: props.fit, position: props.position },
-	    _react2.default.createElement(FilePlayer, { file: props.file,
+	    return React.createElement(FilePlayer, { file: props.file,
 	      posterImageFile: props.posterImageFile,
 	      playerState: props.playerState,
 	      playerActions: props.playerActions,
 	      atmoDuringPlayback: props.atmoDuringPlayback,
-	      defaultTextTrackFileId: props.defaultTextTrackFileId,
-	      textTracksEnabled: props.textTracksEnabled,
+	      fit: props.fit,
+	      position: props.position,
 	      loop: props.loop,
 	      muted: props.muted,
-	      playsInline: props.playsInline })
-	  );
+	      playsInline: props.playsInline,
+	      defaultTextTrackFileId: props.defaultTextTrackFileId,
+	      textTracksEnabled: props.textTracksEnabled });
+	  } else if (props.preloadComponent && fileReady && props.pageIsPreloaded) {
+	    var Preload = props.preloadComponent;
+
+	    return React.createElement(Preload, { file: props.file,
+	      posterImageFile: props.posterImageFile });
+	  } else {
+	    return React.createElement('noscript', null);
+	  }
 	}
 
-	var VideoFilePlayerPreload = exports.VideoFilePlayerPreload = function (_React$Component) {
-	  _inherits(VideoFilePlayerPreload, _React$Component);
+	exports.default = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
+	  pageIsPrepared: (0, _selectors.pageIsPrepared)(),
+	  pageIsPreloaded: (0, _selectors.pageIsPreloaded)(),
+	  atmoDuringPlayback: (0, _selectors.pageAttribute)('atmoDuringPlayback'),
+	  defaultTextTrackFileId: (0, _selectors.pageAttribute)('defaultTextTrackFileId')
+	}))(PageFilePlayer);
 
-	  function VideoFilePlayerPreload() {
-	    _classCallCheck(this, VideoFilePlayerPreload);
+/***/ }),
+/* 511 */
+/***/ (function(module, exports, __webpack_require__) {
 
-	    return _possibleConstructorReturn(this, (VideoFilePlayerPreload.__proto__ || Object.getPrototypeOf(VideoFilePlayerPreload)).apply(this, arguments));
-	  }
+	'use strict';
 
-	  _createClass(VideoFilePlayerPreload, [{
-	    key: 'componentDidMount',
-	    value: function componentDidMount() {
-	      var _props = this.props,
-	          file = _props.file,
-	          posterImageFile = _props.posterImageFile,
-	          preloadImage = _props.preloadImage;
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
 
-	      var posterUrl = poster(file, posterImageFile);
+	var _createFilePlayer = __webpack_require__(512);
 
-	      if (posterUrl) {
-	        preloadImage(posterUrl);
-	      }
-	    }
-	  }, {
-	    key: 'render',
-	    value: function render() {
-	      return null;
-	    }
-	  }]);
+	var _createFilePlayer2 = _interopRequireDefault(_createFilePlayer);
 
-	  return VideoFilePlayerPreload;
-	}(_react2.default.Component);
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-	VideoFilePlayerPreload.defaultProps = {
-	  preloadImage: _utils.preloadImage
-	};
+	exports.default = (0, _createFilePlayer2.default)({
+	  tagName: 'audio',
 
-	function poster(videoFile, posterImageFile) {
-	  var style = (0, _utils.has)('mobile platform') ? 'medium' : 'large';
-	  return posterImageFile ? posterImageFile.urls[style] : videoFile.urls['poster_' + style];
-	}
+	  sources: function sources(audioFile) {
+	    return [{ type: 'audio/ogg', src: audioFile.urls.ogg + '?u=1' }, { type: 'audio/mp4', src: audioFile.urls.m4a + '?u=1' }, { type: 'audio/mp3', src: audioFile.urls.mp3 + '?u=1' }];
+	  },
+
+	  emulateTextTracksDisplay: true
+	});
 
 /***/ }),
-/* 509 */
+/* 512 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25075,6 +25139,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	        });
 
 	        _this.player.ready(function () {
+	          _this.props.playerActions.saveMediaElementId(element.id);
+
 	          (0, _handlePlayerState.initPlayer)(_this.player, function () {
 	            return _this.props.playerState;
 	          }, _this.props.playerActions, _this.prevFileId, _this.props.file.id);
@@ -25096,6 +25162,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      _this.disposeMediaTag = function () {
 	        _this.player.dispose();
 	        _this.player = null;
+
+	        _this.props.playerActions.discardMediaElementId();
 	      };
 	      return _this;
 	    }
@@ -25183,33 +25251,33 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return result;
 	};
 
-	var _MediaTag = __webpack_require__(510);
+	var _MediaTag = __webpack_require__(513);
 
 	var _MediaTag2 = _interopRequireDefault(_MediaTag);
 
-	var _createPageflowPlayer = __webpack_require__(511);
+	var _createPageflowPlayer = __webpack_require__(514);
 
 	var _createPageflowPlayer2 = _interopRequireDefault(_createPageflowPlayer);
 
-	var _watchPlayer = __webpack_require__(512);
+	var _watchPlayer = __webpack_require__(515);
 
 	var _watchPlayer2 = _interopRequireDefault(_watchPlayer);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
-	var _handlePlayerState = __webpack_require__(513);
+	var _handlePlayerState = __webpack_require__(516);
 
-	var _textTracks = __webpack_require__(514);
+	var _textTracks = __webpack_require__(517);
 
-	var _selectors = __webpack_require__(502);
+	var _selectors = __webpack_require__(503);
 
-	var _selectors2 = __webpack_require__(496);
+	var _selectors2 = __webpack_require__(497);
 
-	var _selectors3 = __webpack_require__(492);
+	var _selectors3 = __webpack_require__(493);
 
-	var _selectors4 = __webpack_require__(447);
+	var _selectors4 = __webpack_require__(446);
 
-	var _selectors5 = __webpack_require__(515);
+	var _selectors5 = __webpack_require__(518);
 
 	var _react = __webpack_require__(334);
 
@@ -25257,7 +25325,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 510 */
+/* 513 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25447,7 +25515,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 511 */
+/* 514 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25502,7 +25570,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 512 */
+/* 515 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25546,7 +25614,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 513 */
+/* 516 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25607,7 +25675,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 514 */
+/* 517 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25678,7 +25746,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 515 */
+/* 518 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -25694,7 +25762,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 516 */
+/* 519 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25702,34 +25770,215 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
+	exports.VideoPlayer = undefined;
 
 	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
 
-	exports.default = Positioner;
+	exports.default = PageVideoPlayer;
 
-	var _getDimensions = __webpack_require__(517);
+	var _VideoFilePlayer = __webpack_require__(520);
 
-	var _getDimensions2 = _interopRequireDefault(_getDimensions);
+	var _VideoFilePlayer2 = _interopRequireDefault(_VideoFilePlayer);
 
-	var _getCueOffsetClassName = __webpack_require__(518);
+	var _PageFilePlayer = __webpack_require__(510);
 
-	var _getCueOffsetClassName2 = _interopRequireDefault(_getCueOffsetClassName);
+	var _PageFilePlayer2 = _interopRequireDefault(_PageFilePlayer);
 
-	var _react = __webpack_require__(334);
+	var _selectors = __webpack_require__(505);
 
-	var _react2 = _interopRequireDefault(_react);
+	var _selectors2 = __webpack_require__(429);
 
-	var _reactMeasure = __webpack_require__(472);
+	var _selectors3 = __webpack_require__(493);
 
-	var _reactMeasure2 = _interopRequireDefault(_reactMeasure);
+	var _utils = __webpack_require__(340);
+
+	var _reactRedux = __webpack_require__(399);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-	function Positioner(props) {
-	  return _react2.default.createElement(
-	    _reactMeasure2.default,
-	    { whitelist: ['width', 'height'] },
-	    function (wrapperDimensions) {
+	function PageVideoFilePlayer(props) {
+	  return React.createElement(_PageFilePlayer2.default, _extends({}, props, {
+	    playerComponent: _VideoFilePlayer2.default,
+	    preloadComponent: _VideoFilePlayer.VideoFilePlayerPreload }));
+	}
+
+	var VideoPlayer = exports.VideoPlayer = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
+	  file: (0, _selectors2.file)('videoFiles', { id: (0, _selectors3.prop)('videoFileId') }),
+	  posterImageFile: (0, _selectors2.file)('imageFiles', { id: (0, _selectors3.prop)('posterImageFileId') }),
+	  muted: muted
+	}))(PageVideoFilePlayer);
+
+	function muted(state, props) {
+	  return props.muted || (0, _selectors.muted)(state);
+	}
+
+	function PageVideoPlayer(props) {
+	  var page = props.page;
+
+	  var videoProperty = _utils.camelize.concat(props.propertyNamePrefix, props.videoPropertyBaseName);
+	  var posterProperty = _utils.camelize.concat(props.propertyNamePrefix, props.posterImagePropertyBaseName);
+
+	  return React.createElement(VideoPlayer, { videoFileId: page[videoProperty + 'Id'],
+	    posterImageFileId: page[posterProperty + 'Id'],
+	    playerState: props.playerState,
+	    playerActions: props.playerActions,
+	    fit: props.fit,
+	    position: [page[videoProperty + 'X'], page[videoProperty + 'Y']],
+	    textTracksEnabled: props.textTracksEnabled,
+	    loop: props.loop,
+	    muted: props.muted,
+	    playsInline: props.playsInline });
+	}
+
+	PageVideoPlayer.defaultProps = {
+	  videoPropertyBaseName: 'videoFile',
+	  posterImagePropertyBaseName: 'posterImage',
+	  fit: 'smart_contain'
+	};
+
+/***/ }),
+/* 520 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.VideoFilePlayerPreload = undefined;
+
+	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+	exports.default = VideoFilePlayer;
+
+	var _react = __webpack_require__(334);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _createFilePlayer = __webpack_require__(512);
+
+	var _createFilePlayer2 = _interopRequireDefault(_createFilePlayer);
+
+	var _Positioner = __webpack_require__(521);
+
+	var _Positioner2 = _interopRequireDefault(_Positioner);
+
+	var _sources = __webpack_require__(524);
+
+	var _sources2 = _interopRequireDefault(_sources);
+
+	var _utils = __webpack_require__(340);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+	function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+	function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+	var FilePlayer = (0, _createFilePlayer2.default)({
+	  tagName: 'video',
+	  sources: _sources2.default,
+	  poster: poster
+	});
+
+	function VideoFilePlayer(props) {
+	  return _react2.default.createElement(
+	    _Positioner2.default,
+	    { videoFile: props.file, fit: props.fit, position: props.position },
+	    _react2.default.createElement(FilePlayer, { file: props.file,
+	      posterImageFile: props.posterImageFile,
+	      playerState: props.playerState,
+	      playerActions: props.playerActions,
+	      atmoDuringPlayback: props.atmoDuringPlayback,
+	      defaultTextTrackFileId: props.defaultTextTrackFileId,
+	      textTracksEnabled: props.textTracksEnabled,
+	      loop: props.loop,
+	      muted: props.muted,
+	      playsInline: props.playsInline })
+	  );
+	}
+
+	var VideoFilePlayerPreload = exports.VideoFilePlayerPreload = function (_React$Component) {
+	  _inherits(VideoFilePlayerPreload, _React$Component);
+
+	  function VideoFilePlayerPreload() {
+	    _classCallCheck(this, VideoFilePlayerPreload);
+
+	    return _possibleConstructorReturn(this, (VideoFilePlayerPreload.__proto__ || Object.getPrototypeOf(VideoFilePlayerPreload)).apply(this, arguments));
+	  }
+
+	  _createClass(VideoFilePlayerPreload, [{
+	    key: 'componentDidMount',
+	    value: function componentDidMount() {
+	      var _props = this.props,
+	          file = _props.file,
+	          posterImageFile = _props.posterImageFile,
+	          preloadImage = _props.preloadImage;
+
+	      var posterUrl = poster(file, posterImageFile);
+
+	      if (posterUrl) {
+	        preloadImage(posterUrl);
+	      }
+	    }
+	  }, {
+	    key: 'render',
+	    value: function render() {
+	      return null;
+	    }
+	  }]);
+
+	  return VideoFilePlayerPreload;
+	}(_react2.default.Component);
+
+	VideoFilePlayerPreload.defaultProps = {
+	  preloadImage: _utils.preloadImage
+	};
+
+	function poster(videoFile, posterImageFile) {
+	  var style = (0, _utils.has)('mobile platform') ? 'medium' : 'large';
+	  return posterImageFile ? posterImageFile.urls[style] : videoFile.urls['poster_' + style];
+	}
+
+/***/ }),
+/* 521 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+	exports.default = Positioner;
+
+	var _getDimensions = __webpack_require__(522);
+
+	var _getDimensions2 = _interopRequireDefault(_getDimensions);
+
+	var _getCueOffsetClassName = __webpack_require__(523);
+
+	var _getCueOffsetClassName2 = _interopRequireDefault(_getCueOffsetClassName);
+
+	var _react = __webpack_require__(334);
+
+	var _react2 = _interopRequireDefault(_react);
+
+	var _reactMeasure = __webpack_require__(473);
+
+	var _reactMeasure2 = _interopRequireDefault(_reactMeasure);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function Positioner(props) {
+	  return _react2.default.createElement(
+	    _reactMeasure2.default,
+	    { whitelist: ['width', 'height'] },
+	    function (wrapperDimensions) {
 	      return renderWrapper(props, wrapperDimensions);
 	    }
 	  );
@@ -25762,7 +26011,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 517 */
+/* 522 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25816,7 +26065,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 518 */
+/* 523 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25839,7 +26088,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 519 */
+/* 524 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -25886,59 +26135,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 520 */
-/***/ (function(module, exports, __webpack_require__) {
-
-	'use strict';
-
-	Object.defineProperty(exports, "__esModule", {
-	  value: true
-	});
-	exports.PageFilePlayer = PageFilePlayer;
-
-	var _pages = __webpack_require__(349);
-
-	var _selectors = __webpack_require__(376);
-
-	var _utils = __webpack_require__(340);
-
-	function PageFilePlayer(props) {
-	  var fileReady = props.file && props.file.isReady;
-
-	  if (fileReady && props.pageIsPrepared) {
-	    var FilePlayer = props.playerComponent;
-
-	    return React.createElement(FilePlayer, { file: props.file,
-	      posterImageFile: props.posterImageFile,
-	      playerState: props.playerState,
-	      playerActions: props.playerActions,
-	      atmoDuringPlayback: props.atmoDuringPlayback,
-	      fit: props.fit,
-	      position: props.position,
-	      loop: props.loop,
-	      muted: props.muted,
-	      playsInline: props.playsInline,
-	      defaultTextTrackFileId: props.defaultTextTrackFileId,
-	      textTracksEnabled: props.textTracksEnabled });
-	  } else if (props.preloadComponent && fileReady && props.pageIsPreloaded) {
-	    var Preload = props.preloadComponent;
-
-	    return React.createElement(Preload, { file: props.file,
-	      posterImageFile: props.posterImageFile });
-	  } else {
-	    return React.createElement('noscript', null);
-	  }
-	}
-
-	exports.default = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
-	  pageIsPrepared: (0, _selectors.pageIsPrepared)(),
-	  pageIsPreloaded: (0, _selectors.pageIsPreloaded)(),
-	  atmoDuringPlayback: (0, _selectors.pageAttribute)('atmoDuringPlayback'),
-	  defaultTextTrackFileId: (0, _selectors.pageAttribute)('defaultTextTrackFileId')
-	}))(PageFilePlayer);
-
-/***/ }),
-/* 521 */
+/* 525 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -25992,7 +26189,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(MobilePageVideoPoster);
 
 /***/ }),
-/* 522 */
+/* 526 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26005,51 +26202,408 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	exports.PageBackgroundVideo = PageBackgroundVideo;
 
-	var _PageVideoPlayer = __webpack_require__(507);
+	var _PageVideoPlayer = __webpack_require__(519);
+
+	var _PageVideoPlayer2 = _interopRequireDefault(_PageVideoPlayer);
+
+	var _MobilePageVideoPoster = __webpack_require__(525);
+
+	var _MobilePageVideoPoster2 = _interopRequireDefault(_MobilePageVideoPoster);
+
+	var _utils = __webpack_require__(340);
+
+	var _selectors = __webpack_require__(429);
+
+	var _selectors2 = __webpack_require__(446);
+
+	var _reactRedux = __webpack_require__(399);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function PageBackgroundVideo(props) {
+	  if (props.hasMobilePlatform && mobilePosterExists(props)) {
+	    return React.createElement(_MobilePageVideoPoster2.default, { page: props.page,
+	      propertyNamePrefix: props.propertyNamePrefix });
+	  } else {
+	    return React.createElement(_PageVideoPlayer2.default, _extends({ loop: true,
+	      fit: 'cover',
+	      muted: !props.hasAutoplaySupport,
+	      playsInline: true,
+	      textTracksEnabled: false
+	    }, props));
+	  }
+	}
+
+	function mobilePosterExists(props) {
+	  var property = _utils.camelize.concat(props.propertyNamePrefix, 'mobilePosterImageId');
+	  return props.fileExists('imageFiles', props.page[property]);
+	}
+
+	exports.default = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
+	  fileExists: (0, _selectors.fileExists)(),
+	  hasMobilePlatform: (0, _selectors2.has)('mobile platform'),
+	  hasAutoplaySupport: (0, _selectors2.has)('autoplay support')
+	}))(PageBackgroundVideo);
+
+/***/ }),
+/* 527 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.PageBackgroundAsset = PageBackgroundAsset;
+
+	var _components = __webpack_require__(332);
+
+	var _PageBackgroundVideo = __webpack_require__(526);
+
+	var _PageBackgroundVideo2 = _interopRequireDefault(_PageBackgroundVideo);
+
+	var _selectors = __webpack_require__(503);
+
+	var _pages = __webpack_require__(349);
+
+	var _selectors2 = __webpack_require__(376);
+
+	var _utils = __webpack_require__(340);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function PageBackgroundAsset(_ref) {
+	  var page = _ref.page,
+	      playerState = _ref.playerState,
+	      playerActions = _ref.playerActions,
+	      propertyNamePrefix = _ref.propertyNamePrefix;
+
+
+	  var typePropertyName = _utils.camelize.concat(propertyNamePrefix, 'backgroundType');
+
+	  if (page[typePropertyName] == 'video') {
+	    return React.createElement(_PageBackgroundVideo2.default, { page: page,
+	      playerState: playerState,
+	      playerActions: playerActions,
+	      propertyNamePrefix: propertyNamePrefix });
+	  } else {
+	    return React.createElement(_components.PageBackgroundImage, { page: page,
+	      propertyNamePrefix: propertyNamePrefix });
+	  }
+	}
+
+	exports.default = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
+	  page: (0, _selectors2.pageAttributes)(),
+	  playerState: (0, _selectors.playerState)({ scope: 'background' })
+	}), (0, _utils.combine)({
+	  playerActions: (0, _selectors.playerActions)({ scope: 'background' })
+	}))(PageBackgroundAsset);
+
+/***/ }),
+/* 528 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.default = MediaPageBackground;
+
+	var _components = __webpack_require__(332);
+
+	var _PageBackgroundAsset = __webpack_require__(527);
+
+	var _PageBackgroundAsset2 = _interopRequireDefault(_PageBackgroundAsset);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function MediaPageBackground(props) {
+	  return React.createElement(
+	    _components.PageBackground,
+	    null,
+	    React.createElement(_PageBackgroundAsset2.default, { propertyNamePrefix: props.propertyNamePrefix }),
+	    React.createElement(_components.PageShadow, { page: props.page })
+	  );
+	}
+
+/***/ }),
+/* 529 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _reactRedux = __webpack_require__(399);
+
+	var _pages = __webpack_require__(349);
+
+	var _selectors = __webpack_require__(507);
+
+	var _selectors2 = __webpack_require__(376);
+
+	var _selectors3 = __webpack_require__(493);
+
+	var _utils = __webpack_require__(340);
+
+	function PagePrintImage(_ref) {
+	  var page = _ref.page,
+	      isEntryReady = _ref.isEntryReady;
+
+	  if (!isEntryReady) {
+	    return null;
+	  }
+	  if (page.backgroundType == 'video' || page.type == 'video') {
+	    return React.createElement(PrintVideoPoster, { videoId: page.videoFileId, posterImageId: page.posterImageId });
+	  } else {
+	    return React.createElement(PrintImage, { imageId: page.backgroundImageId });
+	  }
+	}
+
+	exports.default = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
+	  isEntryReady: _selectors.isEntryReady
+	}))(PagePrintImage);
+
+
+	var PrintVideoPoster = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
+	  videoFile: (0, _selectors3.file)('videoFiles', {
+	    id: (0, _selectors3.prop)('videoId')
+	  }),
+	  posterImageFile: (0, _selectors3.file)('imageFiles', {
+	    id: (0, _selectors3.prop)('posterImageId')
+	  })
+	}))(function (_ref2) {
+	  var videoFile = _ref2.videoFile,
+	      posterImageFile = _ref2.posterImageFile;
+
+	  if (posterImageFile) {
+	    return React.createElement(PrintImageTag, { file: posterImageFile });
+	  } else {
+	    return React.createElement(PrintImageTag, { file: videoFile });
+	  }
+	});
+
+	var PrintImage = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
+	  file: (0, _selectors3.file)('imageFiles', {
+	    id: (0, _selectors3.prop)('imageId')
+	  }),
+	  pageIsPrepared: (0, _selectors2.pageIsPrepared)()
+	}))(PrintImageTag);
+
+	function PrintImageTag(_ref3) {
+	  var file = _ref3.file;
+
+	  if (file && _selectors2.pageIsPrepared) {
+	    return React.createElement('img', { src: file.urls.print,
+	      alt: file.alt,
+	      className: 'print_image' });
+	  } else {
+	    return React.createElement('noscript', null);
+	  }
+	}
+
+/***/ }),
+/* 530 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _InfoBox = __webpack_require__(531);
+
+	var _InfoBox2 = _interopRequireDefault(_InfoBox);
+
+	var _Container = __webpack_require__(532);
+
+	var _Container2 = _interopRequireDefault(_Container);
+
+	var _Waveform = __webpack_require__(534);
+
+	var _Waveform2 = _interopRequireDefault(_Waveform);
+
+	var _MenuBar = __webpack_require__(485);
+
+	var _MenuBar2 = _interopRequireDefault(_MenuBar);
+
+	var _TimesDisplay = __webpack_require__(537);
+
+	var _TimesDisplay2 = _interopRequireDefault(_TimesDisplay);
+
+	var _utils = __webpack_require__(340);
+
+	var _pages = __webpack_require__(349);
+
+	var _selectors = __webpack_require__(376);
+
+	var _classnames = __webpack_require__(335);
+
+	var _classnames2 = _interopRequireDefault(_classnames);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function WaveformPlayerControls(props) {
+	  return React.createElement(
+	    'div',
+	    { className: className(props) },
+	    React.createElement(
+	      _Container2.default,
+	      null,
+	      React.createElement(_Waveform2.default, { isPlaying: props.isPlaying,
+	        inverted: props.inverted,
+	        playButtonTitle: props.playButtonTitle,
+	        mediaElementId: props.mediaElementId,
+	        onPlayButtonClick: props.onPlayButtonClick }),
+	      React.createElement(_TimesDisplay2.default, { currentTime: props.currentTime,
+	        duration: props.duration }),
+	      React.createElement(_InfoBox2.default, props.infoBox)
+	    ),
+	    React.createElement(_MenuBar2.default, { inverted: props.inverted,
+	      qualityMenuButtonTitle: props.qualityMenuButtonTitle,
+	      qualityMenuItems: props.qualityMenuItems,
+	      onQualityMenuItemClick: props.onQualityMenuItemClick,
+	      textTracksMenuButtonTitle: props.textTracksMenuButtonTitle,
+	      textTracksMenuItems: props.textTracksMenuItems,
+	      hiddenOnPhone: !props.isPlaying,
+	      onTextTracksMenuItemClick: props.onTextTracksMenuItemClick })
+	  );
+	}
+
+	exports.default = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
+	  inverted: (0, _selectors.pageAttribute)('invert')
+	}))(WaveformPlayerControls);
+
+
+	function className(props) {
+	  return (0, _classnames2.default)('waveform_player_controls', {
+	    'waveform_player_controls-inverted': props.inverted
+	  });
+	}
+
+/***/ }),
+/* 531 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.default = InfoBox;
+
+	var _classnames = __webpack_require__(335);
+
+	var _classnames2 = _interopRequireDefault(_classnames);
+
+	var _utils = __webpack_require__(340);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function InfoBox(props) {
+	  return React.createElement(
+	    'div',
+	    { className: 'waveform_player_controls-info_box' },
+	    renderTitle(props),
+	    renderDescription(props)
+	  );
+	}
+
+	function renderTitle(props) {
+	  if (!(0, _utils.isBlank)(props.title)) {
+	    return React.createElement(
+	      'h3',
+	      { className: titleClassName(props) },
+	      props.title
+	    );
+	  }
+	}
+
+	function titleClassName(props) {
+	  var titleAndDescriptionPresent = !(0, _utils.isBlank)(props.title) && !(0, _utils.isBlank)(props.description);
+
+	  return (0, _classnames2.default)('waveform_player_controls-info_box-title', {
+	    'waveform_player_controls-info_box-title-with_separator': titleAndDescriptionPresent
+	  });
+	}
+
+	function renderDescription(props) {
+	  if (!(0, _utils.isBlank)(props.description)) {
+	    return React.createElement('p', { className: 'waveform_player_controls-info_box-description',
+	      dangerouslySetInnerHTML: { __html: props.description } });
+	  }
+	}
+
+/***/ }),
+/* 532 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _actions = __webpack_require__(533);
 
-	var _PageVideoPlayer2 = _interopRequireDefault(_PageVideoPlayer);
+	var _pages = __webpack_require__(349);
 
-	var _MobilePageVideoPoster = __webpack_require__(521);
+	var _reactMeasure = __webpack_require__(473);
 
-	var _MobilePageVideoPoster2 = _interopRequireDefault(_MobilePageVideoPoster);
+	var _reactMeasure2 = _interopRequireDefault(_reactMeasure);
 
-	var _utils = __webpack_require__(340);
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-	var _selectors = __webpack_require__(429);
+	function Container(props) {
+	  return React.createElement(
+	    _reactMeasure2.default,
+	    { whitelist: ['height'],
+	      onMeasure: function onMeasure(_ref) {
+	        var height = _ref.height;
+	        return props.setPageScrollerMarginBottom(height);
+	      } },
+	    React.createElement(
+	      'div',
+	      { className: 'waveform_player_controls-container' },
+	      props.children
+	    )
+	  );
+	}
 
-	var _selectors2 = __webpack_require__(447);
+	exports.default = (0, _pages.connectInPage)(null, {
+	  setPageScrollerMarginBottom: _actions.setPageScrollerMarginBottom
+	})(Container);
 
-	var _reactRedux = __webpack_require__(399);
+/***/ }),
+/* 533 */
+/***/ (function(module, exports) {
 
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+	'use strict';
 
-	function PageBackgroundVideo(props) {
-	  if (props.hasMobilePlatform && mobilePosterExists(props)) {
-	    return React.createElement(_MobilePageVideoPoster2.default, { page: props.page,
-	      propertyNamePrefix: props.propertyNamePrefix });
-	  } else {
-	    return React.createElement(_PageVideoPlayer2.default, _extends({ loop: true,
-	      fit: 'cover',
-	      muted: !props.hasAutoplaySupport,
-	      playsInline: true,
-	      textTracksEnabled: false
-	    }, props));
-	  }
-	}
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.setPageScrollerMarginBottom = setPageScrollerMarginBottom;
+	var SET_BOTTOM = exports.SET_BOTTOM = 'MEDIA_PAGE_SCROLLER_MARGIN_SET_BOTTOM';
 
-	function mobilePosterExists(props) {
-	  var property = _utils.camelize.concat(props.propertyNamePrefix, 'mobilePosterImageId');
-	  return props.fileExists('imageFiles', props.page[property]);
+	function setPageScrollerMarginBottom(value) {
+	  return {
+	    type: SET_BOTTOM,
+	    payload: {
+	      value: value
+	    },
+	    meta: {
+	      collectionName: 'pages'
+	    }
+	  };
 	}
 
-	exports.default = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
-	  fileExists: (0, _selectors.fileExists)(),
-	  hasMobilePlatform: (0, _selectors2.has)('mobile platform'),
-	  hasAutoplaySupport: (0, _selectors2.has)('autoplay support')
-	}))(PageBackgroundVideo);
-
 /***/ }),
-/* 523 */
+/* 534 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26057,53 +26611,79 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.PageBackgroundAsset = PageBackgroundAsset;
-
-	var _components = __webpack_require__(332);
 
-	var _PageBackgroundVideo = __webpack_require__(522);
+	var _PlayButton = __webpack_require__(535);
 
-	var _PageBackgroundVideo2 = _interopRequireDefault(_PageBackgroundVideo);
+	var _PlayButton2 = _interopRequireDefault(_PlayButton);
 
-	var _selectors = __webpack_require__(502);
+	var _utils = __webpack_require__(340);
 
 	var _pages = __webpack_require__(349);
 
-	var _selectors2 = __webpack_require__(376);
+	var _selectors = __webpack_require__(376);
 
-	var _utils = __webpack_require__(340);
+	var _selectors2 = __webpack_require__(536);
 
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+	var _reactMeasure = __webpack_require__(473);
 
-	function PageBackgroundAsset(_ref) {
-	  var page = _ref.page,
-	      playerState = _ref.playerState,
-	      playerActions = _ref.playerActions,
-	      propertyNamePrefix = _ref.propertyNamePrefix;
+	var _reactMeasure2 = _interopRequireDefault(_reactMeasure);
 
+	var _reactWavesurfer = __webpack_require__(426);
 
-	  var typePropertyName = _utils.camelize.concat(propertyNamePrefix, 'backgroundType');
+	var _reactWavesurfer2 = _interopRequireDefault(_reactWavesurfer);
 
-	  if (page[typePropertyName] == 'video') {
-	    return React.createElement(_PageBackgroundVideo2.default, { page: page,
-	      playerState: playerState,
-	      playerActions: playerActions,
-	      propertyNamePrefix: propertyNamePrefix });
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	var waveColor = 'rgba(170, 170, 170, 1)';
+	var waveColorForInvertedPage = 'rgba(0, 0, 0, 0.5)';
+
+	var cursorColor = '#fff';
+	var cursorColorForInvertedPage = '#888';
+
+	function Waveform(props) {
+	  if (props.pageIsPrepared && props.mediaElementId) {
+	    return React.createElement(
+	      _reactMeasure2.default,
+	      { whitelist: ['height'] },
+	      function (_ref) {
+	        var height = _ref.height;
+	        return React.createElement(
+	          'div',
+	          { className: 'waveform_player_controls-wave' },
+	          React.createElement(
+	            'div',
+	            { className: 'waveform_player_controls-wave_wrapper' },
+	            React.createElement(_reactWavesurfer2.default, { mediaElt: '#' + props.mediaElementId,
+	              options: {
+	                normalize: true,
+	                removeMediaElementOnDestroy: false,
+	                hideScrollbar: true,
+	                progressColor: props.waveformColor || props.mainColor,
+	                waveColor: props.inverted ? waveColorForInvertedPage : waveColor,
+	                cursorColor: props.inverted ? cursorColorForInvertedPage : cursorColor,
+	                height: height
+	              } }),
+	            React.createElement(_PlayButton2.default, { isPlaying: props.isPlaying,
+	              title: props.playButtonTitle,
+	              inverted: props.inverted,
+	              onClick: props.onPlayButtonClick })
+	          )
+	        );
+	      }
+	    );
 	  } else {
-	    return React.createElement(_components.PageBackgroundImage, { page: page,
-	      propertyNamePrefix: propertyNamePrefix });
+	    return null;
 	  }
 	}
 
 	exports.default = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
-	  page: (0, _selectors2.pageAttributes)(),
-	  playerState: (0, _selectors.playerState)({ scope: 'background' })
-	}), (0, _utils.combine)({
-	  playerActions: (0, _selectors.playerActions)({ scope: 'background' })
-	}))(PageBackgroundAsset);
+	  pageIsPrepared: (0, _selectors.pageIsPrepared)(),
+	  waveformColor: (0, _selectors.pageAttribute)('waveformColor'),
+	  mainColor: _selectors2.mainColor
+	}))(Waveform);
 
 /***/ }),
-/* 524 */
+/* 535 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26111,105 +26691,96 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	Object.defineProperty(exports, "__esModule", {
 	  value: true
 	});
-	exports.default = MediaPageBackground;
 
-	var _components = __webpack_require__(332);
+	var _Icon = __webpack_require__(453);
+
+	var _Icon2 = _interopRequireDefault(_Icon);
 
-	var _PageBackgroundAsset = __webpack_require__(523);
+	var _pageSkipLinkTarget = __webpack_require__(466);
 
-	var _PageBackgroundAsset2 = _interopRequireDefault(_PageBackgroundAsset);
+	var _pageSkipLinkTarget2 = _interopRequireDefault(_pageSkipLinkTarget);
+
+	var _classnames = __webpack_require__(335);
+
+	var _classnames2 = _interopRequireDefault(_classnames);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-	function MediaPageBackground(props) {
+	function PlayButton(props) {
 	  return React.createElement(
-	    _components.PageBackground,
-	    null,
-	    React.createElement(_PageBackgroundAsset2.default, { propertyNamePrefix: props.propertyNamePrefix }),
-	    React.createElement(_components.PageShadow, { page: props.page })
+	    'a',
+	    { href: '#',
+	      className: className(props),
+	      id: props.id,
+	      tabIndex: '4',
+	      title: props.title,
+	      onClick: clickHandler(props) },
+	    React.createElement(_Icon2.default, { name: props.isPlaying ? 'pause' : 'play' })
 	  );
 	}
 
-/***/ }),
-/* 525 */
-/***/ (function(module, exports, __webpack_require__) {
-
-	'use strict';
-
-	Object.defineProperty(exports, "__esModule", {
-	  value: true
-	});
-
-	var _reactRedux = __webpack_require__(399);
+	exports.default = (0, _pageSkipLinkTarget2.default)(PlayButton);
 
-	var _pages = __webpack_require__(349);
 
-	var _selectors = __webpack_require__(506);
+	function className(props) {
+	  return (0, _classnames2.default)('waveform_player_controls-play_button', {
+	    'waveform_player_controls-play_button-inverted': props.inverted
+	  });
+	}
 
-	var _selectors2 = __webpack_require__(376);
+	function clickHandler(props) {
+	  return function (event) {
+	    event.preventDefault();
 
-	var _selectors3 = __webpack_require__(492);
+	    if (props.onClick) {
+	      props.onClick();
+	    }
+	  };
+	}
 
-	var _utils = __webpack_require__(340);
+/***/ }),
+/* 536 */
+/***/ (function(module, exports) {
 
-	function PagePrintImage(_ref) {
-	  var page = _ref.page,
-	      isEntryReady = _ref.isEntryReady;
+	"use strict";
 
-	  if (!isEntryReady) {
-	    return null;
-	  }
-	  if (page.backgroundType == 'video' || page.type == 'video') {
-	    return React.createElement(PrintVideoPoster, { videoId: page.videoFileId, posterImageId: page.posterImageId });
-	  } else {
-	    return React.createElement(PrintImage, { imageId: page.backgroundImageId });
-	  }
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.mainColor = mainColor;
+	function mainColor(state) {
+	  return state.theme.mainColor;
 	}
 
-	exports.default = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
-	  isEntryReady: _selectors.isEntryReady
-	}))(PagePrintImage);
-
+/***/ }),
+/* 537 */
+/***/ (function(module, exports, __webpack_require__) {
 
-	var PrintVideoPoster = (0, _reactRedux.connect)((0, _utils.combineSelectors)({
-	  videoFile: (0, _selectors3.file)('videoFiles', {
-	    id: (0, _selectors3.prop)('videoId')
-	  }),
-	  posterImageFile: (0, _selectors3.file)('imageFiles', {
-	    id: (0, _selectors3.prop)('posterImageId')
-	  })
-	}))(function (_ref2) {
-	  var videoFile = _ref2.videoFile,
-	      posterImageFile = _ref2.posterImageFile;
+	"use strict";
 
-	  if (posterImageFile) {
-	    return React.createElement(PrintImageTag, { file: posterImageFile });
-	  } else {
-	    return React.createElement(PrintImageTag, { file: videoFile });
-	  }
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
 	});
+	exports.default = TimesDisplay;
 
-	var PrintImage = (0, _pages.connectInPage)((0, _utils.combineSelectors)({
-	  file: (0, _selectors3.file)('imageFiles', {
-	    id: (0, _selectors3.prop)('imageId')
-	  }),
-	  pageIsPrepared: (0, _selectors2.pageIsPrepared)()
-	}))(PrintImageTag);
+	var _TimeDisplay = __webpack_require__(468);
 
-	function PrintImageTag(_ref3) {
-	  var file = _ref3.file;
+	var _TimeDisplay2 = _interopRequireDefault(_TimeDisplay);
 
-	  if (file && _selectors2.pageIsPrepared) {
-	    return React.createElement('img', { src: file.urls.print,
-	      alt: file.alt,
-	      className: 'print_image' });
-	  } else {
-	    return React.createElement('noscript', null);
-	  }
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	function TimesDisplay(props) {
+	  return React.createElement(
+	    "div",
+	    { className: "waveform_player_controls-times_display" },
+	    React.createElement(_TimeDisplay2.default, { value: props.currentTime, className: "waveform_player_controls-times_display-current_time" }),
+	    "/",
+	    React.createElement(_TimeDisplay2.default, { value: props.duration, className: "waveform_player_controls-times_display-duration" })
+	  );
 	}
 
 /***/ }),
-/* 526 */
+/* 538 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26423,20 +26994,29 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	          infoBoxHiddenDuringPlayback: !state.infoBoxHiddenDuringPlayback
 	        });
 
+	      case _actions.SAVE_MEDIA_ELEMENT_ID:
+	        return _extends({}, state, {
+	          mediaElementId: action.payload.id
+	        });
+	      case _actions.DISCARD_MEDIA_ELEMENT_ID:
+	        return _extends({}, state, {
+	          mediaElementId: null
+	        });
+
 	      default:
 	        return state;
 	    }
 	  };
 	};
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
-	var _actions2 = __webpack_require__(527);
+	var _actions2 = __webpack_require__(539);
 
 	var _actions3 = __webpack_require__(330);
 
 /***/ }),
-/* 527 */
+/* 539 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26466,7 +27046,33 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 528 */
+/* 540 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
+
+	exports.default = function () {
+	  var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+	  var action = arguments[1];
+
+	  switch (action.type) {
+	    case _actions.SET_BOTTOM:
+	      return _extends({}, state, { bottom: action.payload.value });
+	    default:
+	      return state;
+	  }
+	};
+
+	var _actions = __webpack_require__(533);
+
+/***/ }),
+/* 541 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26479,35 +27085,35 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	exports.default = _callee;
 
-	var _togglePlaying = __webpack_require__(529);
+	var _togglePlaying = __webpack_require__(542);
 
 	var _togglePlaying2 = _interopRequireDefault(_togglePlaying);
 
-	var _muteBackgroundMediaOnPlayFailed = __webpack_require__(530);
+	var _muteBackgroundMediaOnPlayFailed = __webpack_require__(543);
 
 	var _muteBackgroundMediaOnPlayFailed2 = _interopRequireDefault(_muteBackgroundMediaOnPlayFailed);
 
-	var _handlePageDidActivate = __webpack_require__(531);
+	var _handlePageDidActivate = __webpack_require__(544);
 
 	var _handlePageDidActivate2 = _interopRequireDefault(_handlePageDidActivate);
 
-	var _disableScrollIndicatorDuringPlayback = __webpack_require__(533);
+	var _disableScrollIndicatorDuringPlayback = __webpack_require__(546);
 
 	var _disableScrollIndicatorDuringPlayback2 = _interopRequireDefault(_disableScrollIndicatorDuringPlayback);
 
-	var _hasNotBeenPlayingForAMoment = __webpack_require__(534);
+	var _hasNotBeenPlayingForAMoment = __webpack_require__(547);
 
 	var _hasNotBeenPlayingForAMoment2 = _interopRequireDefault(_hasNotBeenPlayingForAMoment);
 
-	var _idling = __webpack_require__(535);
+	var _idling = __webpack_require__(548);
 
 	var _idling2 = _interopRequireDefault(_idling);
 
-	var _fadeOutWhenPageWillDeactivate = __webpack_require__(536);
+	var _fadeOutWhenPageWillDeactivate = __webpack_require__(549);
 
 	var _fadeOutWhenPageWillDeactivate2 = _interopRequireDefault(_fadeOutWhenPageWillDeactivate);
 
-	var _goToNextPageOnEnd = __webpack_require__(537);
+	var _goToNextPageOnEnd = __webpack_require__(550);
 
 	var _goToNextPageOnEnd2 = _interopRequireDefault(_goToNextPageOnEnd);
 
@@ -26553,7 +27159,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 529 */
+/* 542 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26563,11 +27169,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.default = _callee;
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
-	var _actions2 = __webpack_require__(527);
+	var _actions2 = __webpack_require__(539);
 
-	var _selectors = __webpack_require__(502);
+	var _selectors = __webpack_require__(503);
 
 	var _reduxSaga = __webpack_require__(389);
 
@@ -26637,7 +27243,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 530 */
+/* 543 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26647,7 +27253,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.default = _callee;
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _reduxSaga = __webpack_require__(389);
 
@@ -26691,7 +27297,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 531 */
+/* 544 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26707,11 +27313,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _actions = __webpack_require__(330);
 
-	var _actions2 = __webpack_require__(503);
+	var _actions2 = __webpack_require__(504);
 
-	var _actions3 = __webpack_require__(532);
+	var _actions3 = __webpack_require__(545);
 
-	var _selectors = __webpack_require__(502);
+	var _selectors = __webpack_require__(503);
 
 	var _marked = /*#__PURE__*/regeneratorRuntime.mark(_callee2),
 	    _marked2 = /*#__PURE__*/regeneratorRuntime.mark(prebufferAndPlayOnUnmute),
@@ -26882,7 +27488,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 532 */
+/* 545 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -26909,7 +27515,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 533 */
+/* 546 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -26923,7 +27529,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(385);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _selectors = __webpack_require__(376);
 
@@ -27004,7 +27610,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 534 */
+/* 547 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27018,7 +27624,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(385);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _marked = /*#__PURE__*/regeneratorRuntime.mark(_callee3);
 
@@ -27077,7 +27683,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 535 */
+/* 548 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27091,9 +27697,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(385);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
-	var _actions2 = __webpack_require__(527);
+	var _actions2 = __webpack_require__(539);
 
 	var _marked = /*#__PURE__*/regeneratorRuntime.mark(_callee),
 	    _marked2 = /*#__PURE__*/regeneratorRuntime.mark(putAfterDelay);
@@ -27138,7 +27744,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 536 */
+/* 549 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27152,7 +27758,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(385);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _actions2 = __webpack_require__(330);
 
@@ -27195,7 +27801,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 537 */
+/* 550 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27209,7 +27815,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(385);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _selectors = __webpack_require__(376);
 
@@ -27267,7 +27873,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 538 */
+/* 551 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27281,7 +27887,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(385);
 
-	var _actions = __webpack_require__(503);
+	var _actions = __webpack_require__(504);
 
 	var _actions2 = __webpack_require__(330);
 
@@ -27376,7 +27982,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 539 */
+/* 552 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27386,11 +27992,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.Page = exports.reduxModule = undefined;
 
-	var _Page = __webpack_require__(540);
+	var _Page = __webpack_require__(553);
 
 	var _Page2 = _interopRequireDefault(_Page);
 
-	var _reenableScrollIndicator = __webpack_require__(542);
+	var _reenableScrollIndicator = __webpack_require__(555);
 
 	var _reenableScrollIndicator2 = _interopRequireDefault(_reenableScrollIndicator);
 
@@ -27405,7 +28011,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.Page = _Page2.default;
 
 /***/ }),
-/* 540 */
+/* 553 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27426,7 +28032,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _components = __webpack_require__(332);
 
-	var _selectors = __webpack_require__(541);
+	var _selectors = __webpack_require__(554);
 
 	var _pages = __webpack_require__(349);
 
@@ -27545,7 +28151,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}))(PageWithInteractiveBackground);
 
 /***/ }),
-/* 541 */
+/* 554 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -27564,7 +28170,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 542 */
+/* 555 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27578,7 +28184,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _effects = __webpack_require__(385);
 
-	var _actions = __webpack_require__(543);
+	var _actions = __webpack_require__(556);
 
 	var _selectors = __webpack_require__(376);
 
@@ -27628,7 +28234,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 543 */
+/* 556 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -27654,7 +28260,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 544 */
+/* 557 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27664,7 +28270,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.registry = undefined;
 
-	var _PageTypeRegistry = __webpack_require__(545);
+	var _PageTypeRegistry = __webpack_require__(558);
 
 	var _PageTypeRegistry2 = _interopRequireDefault(_PageTypeRegistry);
 
@@ -27675,7 +28281,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = registry.register;
 
 /***/ }),
-/* 545 */
+/* 558 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27777,7 +28383,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 546 */
+/* 559 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27805,16 +28411,16 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  });
 	};
 
-	var _registerPageType = __webpack_require__(544);
+	var _registerPageType = __webpack_require__(557);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
-	var _media = __webpack_require__(498);
+	var _media = __webpack_require__(499);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 547 */
+/* 560 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27824,7 +28430,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.registry = undefined;
 
-	var _WidgetTypeRegistry = __webpack_require__(548);
+	var _WidgetTypeRegistry = __webpack_require__(561);
 
 	var _WidgetTypeRegistry2 = _interopRequireDefault(_WidgetTypeRegistry);
 
@@ -27835,7 +28441,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = registry.register;
 
 /***/ }),
-/* 548 */
+/* 561 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -27875,7 +28481,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 549 */
+/* 562 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27888,9 +28494,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _collections = __webpack_require__(377);
 
-	var _registerPageType = __webpack_require__(544);
+	var _registerPageType = __webpack_require__(557);
 
-	var _boot = __webpack_require__(550);
+	var _boot = __webpack_require__(563);
 
 	var _boot2 = _interopRequireDefault(_boot);
 
@@ -27948,7 +28554,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = _class;
 
 /***/ }),
-/* 550 */
+/* 563 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -27995,7 +28601,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    window: isServerSide ? null : window
 	  };
 
-	  var store = (0, _createStore2.default)([_backgroundMedia2.default, _cookieNotice2.default, _i18n2.default, _theming2.default, _entry2.default, _current2.default, _storylines2.default, _chapters2.default, _pages2.default, _files2.default, _settings2.default, _hideText2.default, _widgets2.default, _widgetPresence2.default, _pageTypes2.default, _hotkeys2.default], options);
+	  var store = (0, _createStore2.default)([_backgroundMedia2.default, _cookieNotice2.default, _i18n2.default, _theming2.default, _entry2.default, _current2.default, _storylines2.default, _chapters2.default, _pages2.default, _files2.default, _settings2.default, _hideText2.default, _widgets2.default, _widgetPresence2.default, _pageTypes2.default, _hotkeys2.default, _theme2.default], options);
 
 	  if (!isServerSide) {
 	    _registerPageType.registry.forEach(function (options) {
@@ -28015,31 +28621,31 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  return store;
 	};
 
-	var _registerPageType = __webpack_require__(544);
+	var _registerPageType = __webpack_require__(557);
 
-	var _registerWidgetType = __webpack_require__(547);
+	var _registerWidgetType = __webpack_require__(560);
 
-	var _createStore = __webpack_require__(551);
+	var _createStore = __webpack_require__(564);
 
 	var _createStore2 = _interopRequireDefault(_createStore);
 
-	var _backgroundMedia = __webpack_require__(553);
+	var _backgroundMedia = __webpack_require__(566);
 
 	var _backgroundMedia2 = _interopRequireDefault(_backgroundMedia);
 
-	var _cookieNotice = __webpack_require__(556);
+	var _cookieNotice = __webpack_require__(569);
 
 	var _cookieNotice2 = _interopRequireDefault(_cookieNotice);
 
-	var _theming = __webpack_require__(562);
+	var _theming = __webpack_require__(575);
 
 	var _theming2 = _interopRequireDefault(_theming);
 
-	var _storylines = __webpack_require__(565);
+	var _storylines = __webpack_require__(578);
 
 	var _storylines2 = _interopRequireDefault(_storylines);
 
-	var _chapters = __webpack_require__(566);
+	var _chapters = __webpack_require__(579);
 
 	var _chapters2 = _interopRequireDefault(_chapters);
 
@@ -28047,50 +28653,54 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _pages2 = _interopRequireDefault(_pages);
 
-	var _pageTypes = __webpack_require__(567);
+	var _pageTypes = __webpack_require__(580);
 
 	var _pageTypes2 = _interopRequireDefault(_pageTypes);
 
-	var _current = __webpack_require__(570);
+	var _current = __webpack_require__(583);
 
 	var _current2 = _interopRequireDefault(_current);
 
-	var _files = __webpack_require__(574);
+	var _files = __webpack_require__(587);
 
 	var _files2 = _interopRequireDefault(_files);
 
-	var _settings = __webpack_require__(575);
+	var _settings = __webpack_require__(588);
 
 	var _settings2 = _interopRequireDefault(_settings);
 
-	var _i18n = __webpack_require__(577);
+	var _i18n = __webpack_require__(590);
 
 	var _i18n2 = _interopRequireDefault(_i18n);
 
-	var _entry = __webpack_require__(580);
+	var _entry = __webpack_require__(593);
 
 	var _entry2 = _interopRequireDefault(_entry);
 
-	var _hotkeys = __webpack_require__(583);
+	var _hotkeys = __webpack_require__(596);
 
 	var _hotkeys2 = _interopRequireDefault(_hotkeys);
 
-	var _hideText = __webpack_require__(584);
+	var _hideText = __webpack_require__(597);
 
 	var _hideText2 = _interopRequireDefault(_hideText);
 
-	var _widgets = __webpack_require__(587);
+	var _widgets = __webpack_require__(600);
 
 	var _widgets2 = _interopRequireDefault(_widgets);
 
-	var _widgetPresence = __webpack_require__(588);
+	var _widgetPresence = __webpack_require__(601);
 
 	var _widgetPresence2 = _interopRequireDefault(_widgetPresence);
 
+	var _theme = __webpack_require__(604);
+
+	var _theme2 = _interopRequireDefault(_theme);
+
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 /***/ }),
-/* 551 */
+/* 564 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	/* WEBPACK VAR INJECTION */(function(process) {'use strict';
@@ -28199,10 +28809,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	    return enhancer;
 	  }
 	}
-	/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(552)))
+	/* WEBPACK VAR INJECTION */}.call(exports, __webpack_require__(565)))
 
 /***/ }),
-/* 552 */
+/* 565 */
 /***/ (function(module, exports) {
 
 	// shim for using process in browser
@@ -28392,7 +29002,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 
 /***/ }),
-/* 553 */
+/* 566 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28402,13 +29012,13 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.registerWidgetTypes = registerWidgetTypes;
 
-	var _reducer = __webpack_require__(554);
+	var _reducer = __webpack_require__(567);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
-	var _actions = __webpack_require__(532);
+	var _actions = __webpack_require__(545);
 
-	var _UnmuteButton = __webpack_require__(555);
+	var _UnmuteButton = __webpack_require__(568);
 
 	var _reduxSaga = __webpack_require__(389);
 
@@ -28479,7 +29089,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 554 */
+/* 567 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28506,14 +29116,14 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(532);
+	var _actions = __webpack_require__(545);
 
 	var initialState = {
 	  muted: false
 	};
 
 /***/ }),
-/* 555 */
+/* 568 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28523,15 +29133,15 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.register = register;
 
-	var _registerWidgetType = __webpack_require__(547);
+	var _registerWidgetType = __webpack_require__(560);
 
 	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
 
-	var _selectors = __webpack_require__(504);
+	var _selectors = __webpack_require__(505);
 
-	var _selectors2 = __webpack_require__(490);
+	var _selectors2 = __webpack_require__(491);
 
-	var _actions = __webpack_require__(532);
+	var _actions = __webpack_require__(545);
 
 	var _utils = __webpack_require__(340);
 
@@ -28580,7 +29190,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 556 */
+/* 569 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28590,13 +29200,13 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.registerWidgetTypes = registerWidgetTypes;
 
-	var _CookieNoticeBar = __webpack_require__(557);
+	var _CookieNoticeBar = __webpack_require__(570);
 
-	var _actions = __webpack_require__(560);
+	var _actions = __webpack_require__(573);
 
-	var _selectors = __webpack_require__(558);
+	var _selectors = __webpack_require__(571);
 
-	var _createReducer = __webpack_require__(561);
+	var _createReducer = __webpack_require__(574);
 
 	var _createReducer2 = _interopRequireDefault(_createReducer);
 
@@ -28722,7 +29332,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 557 */
+/* 570 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28732,19 +29342,19 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.register = register;
 
-	var _registerWidgetType = __webpack_require__(547);
+	var _registerWidgetType = __webpack_require__(560);
 
 	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
 
-	var _selectors = __webpack_require__(558);
+	var _selectors = __webpack_require__(571);
 
-	var _selectors2 = __webpack_require__(559);
+	var _selectors2 = __webpack_require__(572);
 
-	var _selectors3 = __webpack_require__(497);
+	var _selectors3 = __webpack_require__(498);
 
-	var _selectors4 = __webpack_require__(490);
+	var _selectors4 = __webpack_require__(491);
 
-	var _actions = __webpack_require__(560);
+	var _actions = __webpack_require__(573);
 
 	var _utils = __webpack_require__(340);
 
@@ -28812,7 +29422,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 558 */
+/* 571 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -28826,7 +29436,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 559 */
+/* 572 */
 /***/ (function(module, exports) {
 
 	"use strict";
@@ -28840,7 +29450,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 560 */
+/* 573 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -28866,7 +29476,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 561 */
+/* 574 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28909,10 +29519,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  };
 	};
 
-	var _actions = __webpack_require__(560);
+	var _actions = __webpack_require__(573);
 
 /***/ }),
-/* 562 */
+/* 575 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28921,9 +29531,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _actions = __webpack_require__(563);
+	var _actions = __webpack_require__(576);
 
-	var _reducer = __webpack_require__(564);
+	var _reducer = __webpack_require__(577);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -28942,7 +29552,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 563 */
+/* 576 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -28963,7 +29573,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 564 */
+/* 577 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -28984,10 +29594,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(563);
+	var _actions = __webpack_require__(576);
 
 /***/ }),
-/* 565 */
+/* 578 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29020,7 +29630,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 566 */
+/* 579 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29052,7 +29662,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 567 */
+/* 580 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29061,9 +29671,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _actions = __webpack_require__(568);
+	var _actions = __webpack_require__(581);
 
-	var _reducer = __webpack_require__(569);
+	var _reducer = __webpack_require__(582);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -29084,7 +29694,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 568 */
+/* 581 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -29107,7 +29717,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 569 */
+/* 582 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29128,10 +29738,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(568);
+	var _actions = __webpack_require__(581);
 
 /***/ }),
-/* 570 */
+/* 583 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29141,11 +29751,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.watch = exports.reducers = undefined;
 
-	var _reducer = __webpack_require__(571);
+	var _reducer = __webpack_require__(584);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
-	var _watch = __webpack_require__(573);
+	var _watch = __webpack_require__(586);
 
 	var _watch2 = _interopRequireDefault(_watch);
 
@@ -29170,7 +29780,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.watch = _watch2.default;
 
 /***/ }),
-/* 571 */
+/* 584 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29191,10 +29801,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(572);
+	var _actions = __webpack_require__(585);
 
 /***/ }),
-/* 572 */
+/* 585 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -29217,7 +29827,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 573 */
+/* 586 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29232,10 +29842,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  });
 	};
 
-	var _actions = __webpack_require__(572);
+	var _actions = __webpack_require__(585);
 
 /***/ }),
-/* 574 */
+/* 587 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29294,7 +29904,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 575 */
+/* 588 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29306,7 +29916,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.createSaga = createSaga;
 	exports.watch = watch;
 
-	var _reducer = __webpack_require__(576);
+	var _reducer = __webpack_require__(589);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -29412,7 +30022,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 576 */
+/* 589 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29437,7 +30047,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	var _actions = __webpack_require__(331);
 
 /***/ }),
-/* 577 */
+/* 590 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29446,9 +30056,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _actions = __webpack_require__(578);
+	var _actions = __webpack_require__(591);
 
-	var _reducer = __webpack_require__(579);
+	var _reducer = __webpack_require__(592);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -29467,7 +30077,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 578 */
+/* 591 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -29490,7 +30100,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 579 */
+/* 592 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29511,10 +30121,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(578);
+	var _actions = __webpack_require__(591);
 
 /***/ }),
-/* 580 */
+/* 593 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29523,9 +30133,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _actions = __webpack_require__(581);
+	var _actions = __webpack_require__(594);
 
-	var _reducer = __webpack_require__(582);
+	var _reducer = __webpack_require__(595);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -29596,7 +30206,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 581 */
+/* 594 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -29627,7 +30237,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 582 */
+/* 595 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29652,10 +30262,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(581);
+	var _actions = __webpack_require__(594);
 
 /***/ }),
-/* 583 */
+/* 596 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29664,9 +30274,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _keyCodes = __webpack_require__(483);
+	var _keyCodes = __webpack_require__(484);
 
-	var _actions = __webpack_require__(527);
+	var _actions = __webpack_require__(539);
 
 	exports.default = {
 	  init: function init(_ref) {
@@ -29692,7 +30302,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 584 */
+/* 597 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29702,11 +30312,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.watch = exports.reducers = undefined;
 
-	var _watch = __webpack_require__(585);
+	var _watch = __webpack_require__(598);
 
 	var _watch2 = _interopRequireDefault(_watch);
 
-	var _reducer = __webpack_require__(586);
+	var _reducer = __webpack_require__(599);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
@@ -29733,7 +30343,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.watch = _watch2.default;
 
 /***/ }),
-/* 585 */
+/* 598 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29752,10 +30362,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	            });
 	};
 
-	var _actions = __webpack_require__(543);
+	var _actions = __webpack_require__(556);
 
 /***/ }),
-/* 586 */
+/* 599 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29789,9 +30399,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(543);
+	var _actions = __webpack_require__(556);
 
-	var _actions2 = __webpack_require__(572);
+	var _actions2 = __webpack_require__(585);
 
 	var initialState = {
 	  isActive: false,
@@ -29799,7 +30409,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 587 */
+/* 600 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29809,7 +30419,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.createWidgetType = createWidgetType;
 
-	var _reactDom = __webpack_require__(437);
+	var _reactDom = __webpack_require__(426);
 
 	var _reactDom2 = _interopRequireDefault(_reactDom);
 
@@ -29854,7 +30464,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 588 */
+/* 601 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29863,11 +30473,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  value: true
 	});
 
-	var _reducer = __webpack_require__(589);
+	var _reducer = __webpack_require__(602);
 
 	var _reducer2 = _interopRequireDefault(_reducer);
 
-	var _actions = __webpack_require__(590);
+	var _actions = __webpack_require__(603);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -29898,7 +30508,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	};
 
 /***/ }),
-/* 589 */
+/* 602 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29920,10 +30530,10 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	  }
 	};
 
-	var _actions = __webpack_require__(590);
+	var _actions = __webpack_require__(603);
 
 /***/ }),
-/* 590 */
+/* 603 */
 /***/ (function(module, exports) {
 
 	'use strict';
@@ -29946,7 +30556,86 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 591 */
+/* 604 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	var _actions = __webpack_require__(605);
+
+	var _reducer = __webpack_require__(606);
+
+	var _reducer2 = _interopRequireDefault(_reducer);
+
+	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+	exports.default = {
+	  createReducers: function createReducers() {
+	    return { theme: _reducer2.default };
+	  },
+	  init: function init(_ref) {
+	    var dispatch = _ref.dispatch,
+	        isServerSide = _ref.isServerSide;
+
+	    if (!isServerSide) {
+	      var probe = document.getElementById('theme_probe-main_color');
+
+	      dispatch((0, _actions.init)({
+	        mainColor: window.getComputedStyle(probe)['background-color']
+	      }));
+	    }
+	  }
+	};
+
+/***/ }),
+/* 605 */
+/***/ (function(module, exports) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+	exports.init = init;
+	var INIT = exports.INIT = 'THEME_INIT';
+
+	function init(payload) {
+	  return {
+	    type: INIT,
+	    payload: payload
+	  };
+	}
+
+/***/ }),
+/* 606 */
+/***/ (function(module, exports, __webpack_require__) {
+
+	'use strict';
+
+	Object.defineProperty(exports, "__esModule", {
+	  value: true
+	});
+
+	exports.default = function () {
+	  var state = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+	  var action = arguments[1];
+
+	  switch (action.type) {
+	    case _actions.INIT:
+	      return action.payload;
+	    default:
+	      return state;
+	  }
+	};
+
+	var _actions = __webpack_require__(605);
+
+/***/ }),
+/* 607 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -29957,7 +30646,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
 
-	var _boot = __webpack_require__(550);
+	var _boot = __webpack_require__(563);
 
 	var _boot2 = _interopRequireDefault(_boot);
 
@@ -29967,7 +30656,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _reactRedux = __webpack_require__(399);
 
-	var _registerWidgetType = __webpack_require__(547);
+	var _registerWidgetType = __webpack_require__(560);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -30011,7 +30700,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	exports.default = _class;
 
 /***/ }),
-/* 592 */
+/* 608 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -30021,11 +30710,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.register = register;
 
-	var _audio = __webpack_require__(593);
+	var _audio = __webpack_require__(609);
 
-	var _plain = __webpack_require__(596);
+	var _plain = __webpack_require__(610);
 
-	var _video = __webpack_require__(597);
+	var _video = __webpack_require__(611);
 
 	function register() {
 	  (0, _plain.register)();
@@ -30034,7 +30723,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 593 */
+/* 609 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -30044,23 +30733,21 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.register = register;
 
-	var _media = __webpack_require__(498);
+	var _media = __webpack_require__(499);
 
-	var _PageAudioFilePlayer = __webpack_require__(594);
-
-	var _PageAudioFilePlayer2 = _interopRequireDefault(_PageAudioFilePlayer);
+	var _components = __webpack_require__(332);
 
-	var _registerPageType = __webpack_require__(544);
+	var _registerPageType = __webpack_require__(557);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
 	var _pages = __webpack_require__(349);
 
-	var _selectors = __webpack_require__(502);
+	var _selectors = __webpack_require__(503);
 
 	var _selectors2 = __webpack_require__(376);
 
-	var _selectors3 = __webpack_require__(490);
+	var _selectors3 = __webpack_require__(491);
 
 	var _selectors4 = __webpack_require__(429);
 
@@ -30069,6 +30756,8 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
 	function AudioPage(props) {
+	  var playerControlsVariant = props.page.audioPlayerControlsVariant;
+
 	  return React.createElement(
 	    _media.Page,
 	    { className: 'audioPage',
@@ -30077,14 +30766,24 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	      playerState: props.playerState,
 	      playerActions: props.playerActions,
 	      controlBarText: props.t('pageflow.public.start_audio'),
+	      playerControlsComponent: playerControlsComponent(playerControlsVariant),
+	      dynamicPageScrollerMargin: playerControlsVariant == 'waveform',
 	      autoplayWhenBackgroundMediaMuted: false },
 	    React.createElement(_media.PageBackgroundAsset, null),
-	    React.createElement(_PageAudioFilePlayer2.default, { file: props.audioFile,
+	    React.createElement(_media.PageAudioFilePlayer, { file: props.audioFile,
 	      playerState: props.playerState,
 	      playerActions: props.playerActions })
 	  );
 	}
 
+	function playerControlsComponent(variant) {
+	  if (variant == 'waveform') {
+	    return _media.WaveformPlayerControls;
+	  } else {
+	    return _components.PlayerControls;
+	  }
+	}
+
 	function register() {
 	  (0, _registerPageType2.default)('audio', {
 
@@ -30104,61 +30803,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 594 */
-/***/ (function(module, exports, __webpack_require__) {
-
-	'use strict';
-
-	Object.defineProperty(exports, "__esModule", {
-	  value: true
-	});
-
-	var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-	exports.default = PageAudioFilePlayer;
-
-	var _PageFilePlayer = __webpack_require__(520);
-
-	var _PageFilePlayer2 = _interopRequireDefault(_PageFilePlayer);
-
-	var _AudioFilePlayer = __webpack_require__(595);
-
-	var _AudioFilePlayer2 = _interopRequireDefault(_AudioFilePlayer);
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-	function PageAudioFilePlayer(props) {
-	  return React.createElement(_PageFilePlayer2.default, _extends({}, props, { playerComponent: _AudioFilePlayer2.default }));
-	}
-
-/***/ }),
-/* 595 */
-/***/ (function(module, exports, __webpack_require__) {
-
-	'use strict';
-
-	Object.defineProperty(exports, "__esModule", {
-	  value: true
-	});
-
-	var _createFilePlayer = __webpack_require__(509);
-
-	var _createFilePlayer2 = _interopRequireDefault(_createFilePlayer);
-
-	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-
-	exports.default = (0, _createFilePlayer2.default)({
-	  tagName: 'audio',
-
-	  sources: function sources(audioFile) {
-	    return [{ type: 'audio/ogg', src: audioFile.urls.ogg + '?u=1' }, { type: 'audio/mp4', src: audioFile.urls.m4a + '?u=1' }, { type: 'audio/mp3', src: audioFile.urls.mp3 + '?u=1' }];
-	  },
-
-	  emulateTextTracksDisplay: true
-	});
-
-/***/ }),
-/* 596 */
+/* 610 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -30170,9 +30815,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _components = __webpack_require__(332);
 
-	var _media = __webpack_require__(498);
+	var _media = __webpack_require__(499);
 
-	var _registerPageType = __webpack_require__(544);
+	var _registerPageType = __webpack_require__(557);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
@@ -30216,7 +30861,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 597 */
+/* 611 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -30226,23 +30871,23 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.register = register;
 
-	var _media = __webpack_require__(498);
+	var _media = __webpack_require__(499);
 
-	var _registerPageType = __webpack_require__(544);
+	var _registerPageType = __webpack_require__(557);
 
 	var _registerPageType2 = _interopRequireDefault(_registerPageType);
 
 	var _pages = __webpack_require__(349);
 
-	var _selectors = __webpack_require__(502);
+	var _selectors = __webpack_require__(503);
 
 	var _selectors2 = __webpack_require__(376);
 
-	var _selectors3 = __webpack_require__(490);
+	var _selectors3 = __webpack_require__(491);
 
 	var _selectors4 = __webpack_require__(429);
 
-	var _selectors5 = __webpack_require__(447);
+	var _selectors5 = __webpack_require__(446);
 
 	var _utils = __webpack_require__(340);
 
@@ -30289,7 +30934,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 598 */
+/* 612 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -30299,9 +30944,9 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	});
 	exports.registerWidgetTypes = registerWidgetTypes;
 
-	var _ClassicLoadingSpinner = __webpack_require__(599);
+	var _ClassicLoadingSpinner = __webpack_require__(613);
 
-	var _TitleLoadingSpinner = __webpack_require__(600);
+	var _TitleLoadingSpinner = __webpack_require__(614);
 
 	function registerWidgetTypes() {
 	  (0, _ClassicLoadingSpinner.register)();
@@ -30309,7 +30954,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 599 */
+/* 613 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -30334,11 +30979,11 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _classnames2 = _interopRequireDefault(_classnames);
 
-	var _registerWidgetType = __webpack_require__(547);
+	var _registerWidgetType = __webpack_require__(560);
 
 	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
 
-	var _selectors = __webpack_require__(497);
+	var _selectors = __webpack_require__(498);
 
 	function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
@@ -30447,7 +31092,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 600 */
+/* 614 */
 /***/ (function(module, exports, __webpack_require__) {
 
 	'use strict';
@@ -30472,13 +31117,13 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 
 	var _classnames2 = _interopRequireDefault(_classnames);
 
-	var _registerWidgetType = __webpack_require__(547);
+	var _registerWidgetType = __webpack_require__(560);
 
 	var _registerWidgetType2 = _interopRequireDefault(_registerWidgetType);
 
-	var _selectors = __webpack_require__(506);
+	var _selectors = __webpack_require__(507);
 
-	var _selectors2 = __webpack_require__(497);
+	var _selectors2 = __webpack_require__(498);
 
 	var _selectors3 = __webpack_require__(429);
 
@@ -30644,7 +31289,7 @@ pageflow = typeof pageflow === "object" ? pageflow : {}; pageflow["react"] =
 	}
 
 /***/ }),
-/* 601 */
+/* 615 */
 /***/ (function(module, exports) {
 
 	module.exports = pageflow;