+ {/*this.tabs && this.tabs.length ? (
+
+ ) : (
+
+ {this.tabs.map(tab, index => (
+
+ {tab.title}
+
+ ))}
+
+ ) : (
+ ''
+ )*/}
+
+
+
+
+
+ Summary
+ Forest basic information
+ Forest biodiversity and nature
+ Forest and climate
+ Forest bioeconomy
+ Forest condition
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ Biodiversity and nature
++ Forests are intimately linked to Romania's cultural, + economic, social and historical development. The country + is located in the continental temperate region, with a + varied relief ranging from seaside to mountain. +
+
+
+
+
+
+
+
+
+
+
+
+
+ From 2001 to 2018, Romania lost 336kha of tree cover.
+
+ Tree species lost
+
+
+ 12
+
+ species threatened by extinction
+
+
+
+
+ Conifer
+ 8 species
+
+
+ Broadleaved
+ 4 species
+
+ Integer magna nunc, scelerisque in lacinia nec.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ From 2001 to 2018, Romania lost 336kha of tree cover.
+
+ Species Coverage
+
+ Vestibulum eget est ac lorem dapibus lacinia.
+ Integer magna nunc, scelerisque in lacinia nec,
+ laoreet non augue. Nunc quis pharetra magna, in
+ convallis ligula.
+
+
+
+
+
+
+
+
+
+
+
+
+ Forest coverage
+
+
+ 26%
+
+ of Romania's land surface 6.2 Mha
+
+
+
+ 2017 tree cover extent
+
+ 94% publicy owned
+
+
+ 6% private
+
+
+
+
+
+ Forest deadwood volume
+
+
+ 8
+
+ m3/ha
standing deadwood volume +
+ standing deadwood volume +
+
+ See all countries
+
+ Conifer
+ 94 species
+
+ Broadleaved
+
+
+
+
+
+
+
+
+
+
+
+
+ {map(content[blocksLayoutFieldname].items, (block) => {
+ let Block = null;
+ Block =
+ config.blocks.defaultBlocksViewMap[
+ content[blocksFieldname][block]['@type']
+ ];
+ return Block !== null ? (
+
+
+
+ {JSON.stringify(content[blocksFieldname][block]['@type'])}
+
+ );
+ })}
+
+
+
+
+
+
+
+ Country Report No 1/2019
++ Forests are rich in biodiversity and valuable for recreation, + water regulation and soil protection. As well as for providing + timber and other non-wood forest products, forests are important + for mitigating climate change and for the renewable energy + sector. +
+ +
+
+ Other reports and publications
+
+
+
+
+
+
+ State of Europe’s Forests 2018 Report
+
+
+
+
+
+ Romania: National Forest Data 2017
+
+
+
+
+
+ State of Europe’s Forests 2017 Report
+
+
+
+
+
+ Romania: Lorem ipsum documentarium 2014
+
+
+
+
+
+ Romania: National Forest Data 2017
+
+
+
+
+
+ State of Europe’s Forests 2017 Report
+
+
+
+
+
+ Romania: Lorem ipsum documentarium 2014
+
+ {content.description}
+ )} + {content.image && ( +
+ {content.map(item => (
+
+ {item.title}
+
+ ))}
+
+ );
+ this.setState({
+ tabs: tabs,
+ });
+ this.props.setFolderTabs(content);
+ }
+
+ componentDidMount() {
+ this.getFolderHeader();
+ this.renderTabs();
+ }
+
+ componentWillReceiveProps(nextProps) {
+ if (
+ JSON.stringify(nextProps.content) !== JSON.stringify(this.props.content)
+ ) {
+ this.getFolderHeader(nextProps.content);
+ this.renderTabs(nextProps.content);
+ }
+ }
+
+ componentWillUnmount() {
+ // this.props.setFolderHeader({ inCountryFolder: false });
+ }
+
+ render() {
+ const content = this.props.content;
+ return (
+
+
+ ) : (
+
+ // {intl.formatMessage(messages.unknownBlock, {
+ // block: content[blocksFieldname]?.[block]?.['@type'],
+ // })}
+ //
+ ''
+ );
+ })}
+ {''}
+ {content.title}
+ {content.description && ( +{content.description}
+ )} */} + {content.image && ( +{''}
+
+
+
+ ) : (
+
+ //
+}
+
+export default HeaderImage;
diff --git a/src/components/theme/Header/HomepageSlider.jsx b/src/components/theme/Header/HomepageSlider.jsx
new file mode 100644
index 0000000..07bb530
--- /dev/null
+++ b/src/components/theme/Header/HomepageSlider.jsx
@@ -0,0 +1,206 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+
+import 'react-image-gallery/styles/css/image-gallery.css';
+
+import ImageGallery from 'react-image-gallery';
+// import HomepageSliderPlaceholder from './HomepageSliderPlaceholder';
+import { LazyLoadImage } from 'react-lazy-load-image-component';
+import { Placeholder } from 'semantic-ui-react';
+import { getBasePath } from '~/helpers';
+// function SampleNextArrow(props) {
+// const { onClick } = props;
+// return (
+// {}}
+// >
+//
+// );
+// }
+
+// function SamplePrevArrow(props) {
+// const { onClick } = props;
+// return (
+// {}}
+// >
+//
+// );
+// }
+
+class HomepageSlider extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ slides: [],
+ };
+ this.getSlides = this.getSlides.bind(this);
+ }
+
+ static propTypes = {
+ items: PropTypes.arrayOf(
+ PropTypes.shape({
+ title: PropTypes.string,
+ url: PropTypes.string,
+ description: PropTypes.string,
+ }),
+ ),
+ };
+
+ renderThumbnail = (item) => {
+ return (
+
+ {/* 
*/}
+
+
+ );
+ };
+
+ renderSlide = (item) => {
+ return (
+ {item.title}
+
+ {/*
+ );
+ };
+
+ getSlides(items) {
+ const slidesArr = items ? items : this.props.items;
+
+ const slidesUrl =
+ (slidesArr &&
+ slidesArr.map((item, index) => {
+ return {
+ original: item.image,
+ thumbnail: item.image,
+ title: item.title,
+ description: item.description,
+ };
+ })) ||
+ [];
+ // this.setState({
+ // slides: slidesUrl,
+ // });
+
+ return slidesUrl;
+ }
+
+ // componentDidMount() {
+ // if (this.props.items && this.props.items.length) {
+ // this.getSlides();
+ // } else {
+ // this.setState({
+ // slides: [],
+ // });
+ // }
+ // }
+
+ // componentDidUpdate(prevProps) {
+ // if (
+ // !this.state.slides.length &&
+ // this.props.items &&
+ // this.props.items.length
+ // ) {
+ // this.getSlides();
+ // }
+ // }
+
+ render() {
+ // if (!this.state.slides.length) return '';
+ const slides = this.getSlides(this.props.items);
+ return (
+ */}
+ {item.original ? (
+ attributes as props
+ style={{ backgroundImage: `url(${getBasePath(item.original)})` }}
+ width={'100%'}
+ visibleByDefault={true}
+ placeholder={
+
+
+ }
+ />
+ ) : (
+
+
+ )}
+
+ {/*
*/}
+
+
+
+
+ {item.title || ''}
+ {item.description || ''}
+
+ {/* (this.slider1 = slider)}
+ {...settings}
+ >
+ {this.state.slides}
+
+ (this.slider2 = slider)}
+ slidesToShow={3}
+ slidesToScroll={1}
+ swipeToSlide={true}
+ focusOnSelect={true}
+ >
+ {this.state.slides}
+ */}
+ {/* 
*/}
+
+ );
+ }
+}
+
+// export default compose(
+// connect(
+// state => ({
+// items: state.frontpage_slides.items,
+// }),
+// { getFrontpageSlides },
+// ),
+// )(HomepageSlider);
+
+export default HomepageSlider;
diff --git a/src/components/theme/Header/HomepageSliderPlaceholder.jsx b/src/components/theme/Header/HomepageSliderPlaceholder.jsx
new file mode 100644
index 0000000..45a7838
--- /dev/null
+++ b/src/components/theme/Header/HomepageSliderPlaceholder.jsx
@@ -0,0 +1,18 @@
+import React from 'react';
+import { Placeholder } from 'semantic-ui-react';
+
+function HomepageSliderPlaceholder() {
+ return (
+
+
+ );
+}
+
+export default HomepageSliderPlaceholder;
diff --git a/src/components/theme/Header/slidercarret.svg b/src/components/theme/Header/slidercarret.svg
new file mode 100644
index 0000000..3c95d09
--- /dev/null
+++ b/src/components/theme/Header/slidercarret.svg
@@ -0,0 +1 @@
+
\ No newline at end of file
diff --git a/src/components/theme/HomepageView/HomepageView.jsx b/src/components/theme/HomepageView/HomepageView.jsx
new file mode 100644
index 0000000..df1028b
--- /dev/null
+++ b/src/components/theme/HomepageView/HomepageView.jsx
@@ -0,0 +1,285 @@
+/**
+ * View container.
+ * @module components/theme/View/View
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { Portal } from 'react-portal';
+import { injectIntl } from 'react-intl';
+import qs from 'query-string';
+import config from '@plone/volto/registry';
+import { Helmet } from '@plone/volto/helpers';
+import { Link } from 'react-router-dom';
+
+import { Comments, Tags, Toolbar } from '@plone/volto/components';
+import { listActions, getContent } from '@plone/volto/actions';
+import {
+ BodyClass,
+ getBaseUrl,
+ getLayoutFieldname,
+} from '@plone/volto/helpers';
+import BasicForestIMG from '~/components/theme/HomepageView/images/1.jpg';
+import ForestCarbonIMG from '~/components/theme/HomepageView/images/2.jpg';
+import ForestIMG from '~/components/theme/HomepageView/images/3.jpg';
+import NatureIMG from '~/components/theme/HomepageView/images/4.jpg';
+import ForestHealthIMG from '~/components/theme/HomepageView/images/5.jpg';
+
+import MosaicView from 'volto-mosaic/components/theme/View';
+
+/**
+ * View container class.
+ * @class View
+ * @extends Component
+ */
+class View extends Component {
+ /**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+ static propTypes = {
+ actions: PropTypes.shape({
+ object: PropTypes.arrayOf(PropTypes.object),
+ object_buttons: PropTypes.arrayOf(PropTypes.object),
+ user: PropTypes.arrayOf(PropTypes.object),
+ }),
+ listActions: PropTypes.func.isRequired,
+ /**
+ * Action to get the content
+ */
+ getContent: PropTypes.func.isRequired,
+ /**
+ * Pathname of the object
+ */
+ pathname: PropTypes.string.isRequired,
+ location: PropTypes.shape({
+ search: PropTypes.string,
+ pathname: PropTypes.string,
+ }).isRequired,
+ /**
+ * Version id of the object
+ */
+ versionId: PropTypes.string,
+ /**
+ * Content of the object
+ */
+ content: PropTypes.shape({
+ /**
+ * Layout of the object
+ */
+ layout: PropTypes.string,
+ /**
+ * Allow discussion of the object
+ */
+ allow_discussion: PropTypes.bool,
+ /**
+ * Title of the object
+ */
+ title: PropTypes.string,
+ /**
+ * Description of the object
+ */
+ description: PropTypes.string,
+ /**
+ * Type of the object
+ */
+ '@type': PropTypes.string,
+ /**
+ * Subjects of the object
+ */
+ subjects: PropTypes.arrayOf(PropTypes.string),
+ is_folderish: PropTypes.bool,
+ }),
+ error: PropTypes.shape({
+ /**
+ * Error type
+ */
+ status: PropTypes.number,
+ }),
+ };
+
+ /**
+ * Default properties.
+ * @property {Object} defaultProps Default properties.
+ * @static
+ */
+ static defaultProps = {
+ actions: null,
+ content: null,
+ versionId: null,
+ error: null,
+ };
+
+ state = {
+ hasObjectButtons: null,
+ };
+
+ /**
+ * Component will mount
+ * @method componentWillMount
+ * @returns {undefined}
+ */
+ componentWillMount() {
+ this.props.listActions(getBaseUrl(this.props.pathname));
+ this.props.getContent(
+ getBaseUrl(this.props.pathname),
+ this.props.versionId,
+ );
+ }
+
+ /**
+ * Component will receive props
+ * @method componentWillReceiveProps
+ * @param {Object} nextProps Next properties
+ * @returns {undefined}
+ */
+ componentWillReceiveProps(nextProps) {
+ if (nextProps.pathname !== this.props.pathname) {
+ this.props.listActions(getBaseUrl(nextProps.pathname));
+ this.props.getContent(
+ getBaseUrl(nextProps.pathname),
+ this.props.versionId,
+ );
+ }
+
+ if (nextProps.actions.object_buttons) {
+ const objectButtons = nextProps.actions.object_buttons;
+ this.setState({
+ hasObjectButtons: !!objectButtons.length,
+ });
+ }
+ }
+
+ /**
+ * Default fallback view
+ * @method getViewDefault
+ * @returns {string} Markup for component.
+ */
+ getViewDefault = () => config.views.defaultView;
+
+ /**
+ * Get view by content type
+ * @method getViewByType
+ * @returns {string} Markup for component.
+ */
+ getViewByType = () =>
+ config.views.contentTypesViews[this.props.content['@type']] || null;
+
+ /**
+ * Get view by content layout property
+ * @method getViewByLayout
+ * @returns {string} Markup for component.
+ */
+ getViewByLayout = () =>
+ config.views.layoutViews[
+ this.props.content[getLayoutFieldname(this.props.content)]
+ ] || null;
+
+ /**
+ * Cleans the component displayName (specially for connected components)
+ * which have the Connect(componentDisplayName)
+ * @method cleanViewName
+ * @param {string} dirtyDisplayName The displayName
+ * @returns {string} Clean displayName (no Connect(...)).
+ */
+ cleanViewName = (dirtyDisplayName) =>
+ dirtyDisplayName.replace('Connect(', '').replace(')', '').toLowerCase();
+
+ /**
+ * Render method.
+ * @method render
+ * @returns {string} Markup for the component.
+ */
+ render() {
+ if (this.props.error) {
+ let FoundView;
+ if (this.props.error.status === undefined) {
+ // For some reason, while development and if CORS is in place and the
+ // requested resource is 404, it returns undefined as status, then the
+ // next statement will fail
+ FoundView = config.views.errorViews['404'];
+ } else {
+ FoundView = config.views.errorViews[this.props.error.status.toString()];
+ }
+ if (!FoundView) {
+ FoundView = config.views.errorViews['404']; // default to 404
+ }
+ return (
+
+
+
+
+
+
+
+
+ );
+ }
+ if (!this.props.content) {
+ return ;
+ }
+ const RenderedView = MosaicView;
+ return (
+
+ {/* Body class if displayName in component is set */}
+
+
+
+ );
+ }
+}
+
+export default compose(
+ injectIntl,
+ connect(
+ (state, props) => ({
+ actions: state.actions.actions,
+ token: state.userSession.token,
+ content: state.content.data,
+ error: state.content.get.error,
+ pathname: props.location.pathname,
+ versionId:
+ qs.parse(props.location.search) &&
+ qs.parse(props.location.search).version_id,
+ }),
+ {
+ listActions,
+ getContent,
+ },
+ ),
+)(View);
diff --git a/src/components/theme/HomepageView/images/1.jpg b/src/components/theme/HomepageView/images/1.jpg
new file mode 100644
index 0000000..06bb1a7
Binary files /dev/null and b/src/components/theme/HomepageView/images/1.jpg differ
diff --git a/src/components/theme/HomepageView/images/2.jpg b/src/components/theme/HomepageView/images/2.jpg
new file mode 100644
index 0000000..3ecfbf9
Binary files /dev/null and b/src/components/theme/HomepageView/images/2.jpg differ
diff --git a/src/components/theme/HomepageView/images/3.jpg b/src/components/theme/HomepageView/images/3.jpg
new file mode 100644
index 0000000..783af77
Binary files /dev/null and b/src/components/theme/HomepageView/images/3.jpg differ
diff --git a/src/components/theme/HomepageView/images/4.jpg b/src/components/theme/HomepageView/images/4.jpg
new file mode 100644
index 0000000..0290707
Binary files /dev/null and b/src/components/theme/HomepageView/images/4.jpg differ
diff --git a/src/components/theme/HomepageView/images/5.jpg b/src/components/theme/HomepageView/images/5.jpg
new file mode 100644
index 0000000..24bea9c
Binary files /dev/null and b/src/components/theme/HomepageView/images/5.jpg differ
diff --git a/src/components/theme/HomepageView/images/basic-forest.png b/src/components/theme/HomepageView/images/basic-forest.png
new file mode 100644
index 0000000..e138577
Binary files /dev/null and b/src/components/theme/HomepageView/images/basic-forest.png differ
diff --git a/src/components/theme/HomepageView/images/forest-carbon.png b/src/components/theme/HomepageView/images/forest-carbon.png
new file mode 100644
index 0000000..fa1cd68
Binary files /dev/null and b/src/components/theme/HomepageView/images/forest-carbon.png differ
diff --git a/src/components/theme/HomepageView/images/forest.png b/src/components/theme/HomepageView/images/forest.png
new file mode 100644
index 0000000..d3654bd
Binary files /dev/null and b/src/components/theme/HomepageView/images/forest.png differ
diff --git a/src/components/theme/HomepageView/images/nature.png b/src/components/theme/HomepageView/images/nature.png
new file mode 100644
index 0000000..46c823b
Binary files /dev/null and b/src/components/theme/HomepageView/images/nature.png differ
diff --git a/src/components/theme/HomepageView/scrap.jsx b/src/components/theme/HomepageView/scrap.jsx
new file mode 100644
index 0000000..36eb1f7
--- /dev/null
+++ b/src/components/theme/HomepageView/scrap.jsx
@@ -0,0 +1,48 @@
+
+
+
+ {this.props.content.subjects &&
+ this.props.content.subjects.length > 0 && (
+
+
;
diff --git a/src/components/theme/MobileSearchWidget/MobileSearchWidget.jsx b/src/components/theme/MobileSearchWidget/MobileSearchWidget.jsx
new file mode 100644
index 0000000..cf20f18
--- /dev/null
+++ b/src/components/theme/MobileSearchWidget/MobileSearchWidget.jsx
@@ -0,0 +1,196 @@
+/**
+ * Search widget component.
+ * @module components/theme/SearchWidget/SearchWidget
+ */
+
+import React, { Component } from 'react';
+import { withRouter } from 'react-router-dom';
+import { Form, Input } from 'semantic-ui-react';
+import { compose } from 'redux';
+import { PropTypes } from 'prop-types';
+import { defineMessages, injectIntl } from 'react-intl';
+import { Popup } from 'semantic-ui-react';
+import { Icon } from '@plone/volto/components';
+import zoomSVG from '@plone/volto/icons/zoom.svg';
+import Person from './person.svg';
+import { connect } from 'react-redux';
+
+const messages = defineMessages({
+ search: {
+ id: 'Search',
+ defaultMessage: 'Search',
+ },
+ searchSite: {
+ id: 'Search Site',
+ defaultMessage: 'Search website',
+ },
+});
+
+/**
+ * SearchWidget component class.
+ * @class SearchWidget
+ * @extends Component
+ */
+class MobileSearchWidget extends Component {
+ /**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+ static propTypes = {
+ token: PropTypes.string,
+ pathname: PropTypes.string.isRequired,
+ };
+ static defaultProps = {
+ token: null,
+ };
+
+ /**
+ * Constructor
+ * @method constructor
+ * @param {Object} props Component properties
+ * @constructs WysiwygEditor
+ */
+ constructor(props) {
+ super(props);
+ this.onChangeText = this.onChangeText.bind(this);
+ this.onChangeSection = this.onChangeSection.bind(this);
+ this.onSubmit = this.onSubmit.bind(this);
+ this.showSearch = this.showSearch.bind(this);
+ this.handleClickOutsideSearch = this.handleClickOutsideSearch.bind(this);
+ this.state = {
+ text: '',
+ section: false,
+ showSearchField: false,
+ };
+ }
+
+ /**
+ * On change text
+ * @method onChangeText
+ * @param {object} event Event object.
+ * @param {string} value Text value.
+ * @returns {undefined}
+ */
+ onChangeText(event, { value }) {
+ this.setState({
+ text: value,
+ });
+ }
+
+ /**
+ * On change section
+ * @method onChangeSection
+ * @param {object} event Event object.
+ * @param {bool} checked Section checked.
+ * @returns {undefined}
+ */
+ onChangeSection(event, { checked }) {
+ this.setState({
+ section: checked,
+ });
+ }
+
+ /**
+ * Submit handler
+ * @method onSubmit
+ * @param {event} event Event object.
+ * @returns {undefined}
+ */
+ onSubmit(event) {
+ const section = this.state.section ? `&path=${this.props.pathname}` : '';
+ this.props.history.push(
+ `/search?SearchableText=${this.state.text}${section}`,
+ );
+ event.preventDefault();
+ }
+
+ showSearch() {
+ this.setState({ showSearchField: true });
+ }
+ componentDidMount() {
+ document.body.addEventListener('click', this.handleClickOutsideSearch);
+ }
+ componentWillUnmount() {
+ document.body.removeEventListener('click', this.handleClickOutsideSearch);
+ }
+ handleClickOutsideSearch(e) {
+ if (
+ this.state.showSearchField === false ||
+ document.querySelector('input[name="SearchableText"]').value
+ )
+ return;
+ const selectors = [
+ '.searchInput',
+ 'input[name="SearchableText"]',
+ '.searchbox',
+ '.searchIcon',
+ '.searchIcon svg.icon',
+ ];
+ let matchedSelector;
+ for (let selector of selectors) {
+ if (e.target.matches(selector)) {
+ matchedSelector = selector;
+ }
+ }
+ if (!matchedSelector) {
+ this.setState({ showSearchField: false });
+ }
+ }
+
+ /**
+ * Render method.
+ * @method render
+ * @returns {string} Markup for the component.
+ */
+ render() {
+ return (
+
+ );
+ }
+}
+
+export default compose(
+ connect(state => ({
+ token: state.userSession.token,
+ })),
+ withRouter,
+ injectIntl,
+)(MobileSearchWidget);
diff --git a/src/components/theme/MobileSearchWidget/person.svg b/src/components/theme/MobileSearchWidget/person.svg
new file mode 100644
index 0000000..d6c9a94
--- /dev/null
+++ b/src/components/theme/MobileSearchWidget/person.svg
@@ -0,0 +1,9 @@
+
\ No newline at end of file
diff --git a/src/components/theme/MosaicView/MosaicView.jsx b/src/components/theme/MosaicView/MosaicView.jsx
new file mode 100644
index 0000000..7d762a3
--- /dev/null
+++ b/src/components/theme/MosaicView/MosaicView.jsx
@@ -0,0 +1,198 @@
+/**
+ * Document view component.
+ * @module components/theme/View/DocumentView
+ */
+
+import 'react-mosaic-component/react-mosaic-component.css';
+
+import { Helmet } from '@plone/volto/helpers';
+import PropTypes from 'prop-types';
+import React, { Component } from 'react';
+
+import { Container, Image } from 'semantic-ui-react';
+// import { map } from 'lodash';
+import config from '@plone/volto/registry';
+
+import {
+ Mosaic,
+ MosaicWindow,
+ // Corner,
+ // createBalancedTreeFromLeaves,
+ // getLeaves,
+ // getNodeAtPath,
+ // getOtherDirection,
+ // getPathToCorner,
+ // MosaicDirection,
+ // MosaicNode,
+ // MosaicParent,
+ // MosaicZeroState,
+ // updateTree,
+} from 'react-mosaic-component';
+
+import {
+ getBlocksFieldname,
+ getBlocksLayoutFieldname,
+ // hasBlocksData,
+} from '@plone/volto/helpers';
+
+/**
+ * Component to display the document view.
+ * @function DocumentView
+ * @param {Object} content Content object.
+ * @returns {string} Markup of the component.
+ */
+
+class MosaicView extends Component {
+ constructor(props) {
+ super(props);
+
+ let content = props.content;
+ console.log('content', content);
+ const blocksLayoutFieldname = getBlocksLayoutFieldname(content);
+
+ let layout = content[blocksLayoutFieldname].layout;
+
+ if (!__SERVER__) {
+ this.state = {
+ currentNode: layout,
+ };
+ }
+
+ console.log('This.state in constructor', this.state, content);
+ }
+
+ createNode = () => {
+ // this.onAddBlock('text', 0);
+ console.log('Called createNode');
+ };
+
+ onChange = (currentNode) => {
+ this.setState({ currentNode });
+ };
+
+ onRelease = (currentNode) => {
+ console.log('Mosaic.onRelease():', currentNode);
+ };
+
+ renderBlock(blockid) {
+ const content = this.props.content;
+ const blocksFieldname = getBlocksFieldname(content);
+ const availableBlocks = content[blocksFieldname];
+ const blocktype = availableBlocks[blockid]['@type'];
+
+ console.log(
+ 'Rendering block:',
+ blockid,
+ blocktype,
+ blocksFieldname,
+ content,
+ );
+
+ let Block = null;
+ Block = config.blocks.defaultBlocksViewMap[blocktype];
+
+ return Block !== null ? (
+
+
+
+
+
+ Country Report No 1/2019
++ Forests are rich in biodiversity and valuable for recreation, water + regulation and soil protection. As well as for providing timber and + other non-wood forest products, forests are important for mitigating + climate change and for the renewable energy sector. +
+ +
+
+ Other reports and publications
+
+
+
+
+
+ State of Europe’s Forests 2018 Report
+
+
+
+ Romania: National Forest Data 2017
+
+
+
+ State of Europe’s Forests 2017 Report
+
+
+
+ Romania: Lorem ipsum documentarium 2014
+
+
+
+ Romania: National Forest Data 2017
+
+
+
+ State of Europe’s Forests 2017 Report
+
+
+
+ Romania: Lorem ipsum documentarium 2014
+
+
+ ) : (
+ {JSON.stringify(blocktype)}
+ );
+ }
+
+ render() {
+ const content = this.props.content;
+ console.log('This.state in render: ', this.state);
+
+ const blocksLayoutFieldname = getBlocksLayoutFieldname(content);
+ const height = content[blocksLayoutFieldname].layout_height || 500;
+
+ return true ? (
+
+ {/* (
+
+ {this.renderBlock(blockid)}
+
+ )}
+ value={this.state.currentNode}
+ onChange={this.onChange}
+ onRelease={this.onRelease}
+ />
+
+ ) : (
+ {content.title}
+ {content.description && ( +{content.description}
+ )} + {content.image && ( +{item.title}
+ +
+
+
+ {item.date && !(item.start && item.end) && (
+
+
+ Published:
+ {prettyDate(item.date)}
+
+ )}
+ {item.start && item.end && (
+
+
+ )}
+ {item.location && (
+
+ Starting:
+
+ {prettyDateTime(item.start)}
+
+
+
+ Ending:
+ {prettyDateTime(item.end)}
+
+
+ Location:
+ {item.location}
+
+ )}
+ {item.year && (
+
+ Year:
+ {item.year}
+
+ )}
+
+ {item.description && (
+ {item.description}
+ )}
+ {hasBlocksData(item) ? (
+
+ {item.image && (
+
+ )}
+
+
+ {item?.[blocksLayoutFieldname]?.items?.map((block) => {
+ const Block =
+ config.blocks.blocksConfig[
+ item[blocksFieldname]?.[block]?.['@type']
+ ]?.['view'] || null;
+ return Block !== null &&
+ item[blocksFieldname][block]['@type'] !== 'title' ? (
+
+ ) : (
+
+ // {intl.formatMessage(messages.unknownBlock, {
+ // block: content[blocksFieldname]?.[block]?.['@type'],
+ // })}
+ //
+ ''
+ );
+ })}
+ {title.capitalized}
; + const rssButton = ( + + Subscribe via RSS +
+
+
+ {itemsByYear &&
+ Object.keys(itemsByYear)
+ .sort((a, b) => b - a)
+ .map((year, yearIndex) => {
+ return itemsByYear[year].map((item, index) => {
+ if (item.initial_index < show) {
+ return (
+
+ {index === 0 ? (
+
+ );
+ }
+ });
+ })}
+
+ {items?.length > limit && show <= limit && (
+
+ )}
+ + {year !== 'undefined' ? year : ''} +
+ ) : ( + '' + )} +-
+ {data.map((m, i) => {
+ return (
+
-
+
+ {m.title}
+
+ {m.items && !!m.items.length &&
} +
+ );
+ })}
+
+
+ )}
+
+ {geo_coverage && geo_coverage.length > 0 && (
+ NUTS Level
+
+ {nuts_level.map(el => (
+
+ ))}
+
+
+
+ )}
+
+ {topics && topics.length > 0 && (
+ Geo coverage
+
+ {geo_coverage.map(el => (
+
+ ))}
+
+
+
+ )}
+
+ {keywords && keywords.length > 0 && (
+ Topics
+
+ {topics.map(el => (
+
+ ))}
+
+
+
+ )}
+ {publisher && publisher.length > 0 && (
+ Keywords
+
+ {keywords.map(el => (
+
+ ))}
+
+
+
+ )}
+ Publisher
+ {publisher.map((p, i) => ( + + ))} +
+
+ )}
+ {data_source && (
+ Resource type
: {resource_type.title} +
+
+ )}
+
+ {dataset && (
+ Data source
: {data_source.title} +
+
+ )}
+
+ {external_url && (
+ Dataset
: {dataset.title} +
+
+ )}
+
+ {publishing_year && (
+ External url
: Go to link +
+
+ )}
+
+ {collection_year_start && (
+ Publishing year
: {publisher} +
+
+ )}
+
+ {info_level && (
+ Collection period
: {collection_year_start} + {collection_year_end && ( + + {' '} + - {collection_year_end} + + )} +
+
+ )}
+
+ {accessibility_level && (
+ Info level
: {info_level.title} +
+
+ )}
+ Accessibility level
: {accessibility_level.title} +
+ {data.url ? (
+
+
+ 
+
+
+ )}
+
+
+
+ );
+ }
+}
+
+export default injectIntl(Edit);
diff --git a/src/customizations/volto/components/manage/Blocks/Video/VideoSidebar.jsx b/src/customizations/volto/components/manage/Blocks/Video/VideoSidebar.jsx
new file mode 100644
index 0000000..caa6eb7
--- /dev/null
+++ b/src/customizations/volto/components/manage/Blocks/Video/VideoSidebar.jsx
@@ -0,0 +1,211 @@
+import React, { useState } from 'react';
+import PropTypes from 'prop-types';
+import { Form } from 'semantic-ui-react';
+import { Accordion, Grid, Segment } from 'semantic-ui-react';
+import { defineMessages, FormattedMessage, injectIntl } from 'react-intl';
+import { CheckboxWidget, Icon, TextWidget } from '@plone/volto/components';
+import AlignBlock from '@plone/volto/components/manage/Sidebar/AlignBlock';
+
+import videoSVG from '@plone/volto/icons/videocamera.svg';
+import clearSVG from '@plone/volto/icons/clear.svg';
+import upSVG from '@plone/volto/icons/up-key.svg';
+import downSVG from '@plone/volto/icons/down-key.svg';
+import navTreeSVG from '@plone/volto/icons/nav.svg';
+
+const messages = defineMessages({
+ LinkTo: {
+ id: 'Link to',
+ defaultMessage: 'Link to',
+ },
+ openLinkInNewTab: {
+ id: 'Open in a new tab',
+ defaultMessage: 'Open in a new tab',
+ },
+ videoURL: {
+ id: 'Video URL',
+ defaultMessage: 'Video URL',
+ },
+ Preview_image: {
+ id: 'Preview Image URL',
+ defaultMessage: 'Preview Image URL',
+ },
+});
+
+const VideoSidebar = ({
+ data,
+ block,
+ onChangeBlock,
+ openObjectBrowser,
+ required = false,
+ resetSubmitUrl,
+ intl,
+}) => {
+ const [activeAccIndex, setActiveAccIndex] = useState(0);
+
+ function handleAccClick(e, titleProps) {
+ const { index } = titleProps;
+ const newIndex = activeAccIndex === index ? -1 : index;
+
+ setActiveAccIndex(newIndex);
+ }
+
+ return (
+
+ {data.url.match('youtu') ? (
+ <>
+ {data.url.match('list') ? (
+ data.preview_image ? (
+
+ ) : (
+
+ )
+ ) : data.preview_image ? (
+
+ ) : (
+
+ )}
+
+ ) : (
+ <>
+
+ {data.url.match('vimeo') ? (
+ data.preview_image ? (
+
+ ) : (
+
+ )
+ ) : (
+ <>
+
+ {data.url.match('.mp4') ||
+ data.url.includes('cmshare.eea.europa.eu') ? (
+ // eslint-disable-next-line jsx-a11y/media-has-caption
+
+ ) : (
+
+ ) : (
+
+
+
+
+
+
+ )}
+
+ )}
+
+ )}
+
+ e.stopPropagation()}
+ />
+ {this.state.url && (
+
+
+
+ )}
+
+
+
+
+
+
+
+
+
+
+ {data.url && (
+
+);
+
+/**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+View.propTypes = {
+ data: PropTypes.objectOf(PropTypes.any).isRequired,
+};
+
+export default View;
diff --git a/src/customizations/volto/components/manage/Blocks/Video/block-video.svg b/src/customizations/volto/components/manage/Blocks/Video/block-video.svg
new file mode 100644
index 0000000..e4be866
--- /dev/null
+++ b/src/customizations/volto/components/manage/Blocks/Video/block-video.svg
@@ -0,0 +1,7 @@
+
diff --git a/src/customizations/volto/components/manage/Widgets/ObjectListWidget.jsx b/src/customizations/volto/components/manage/Widgets/ObjectListWidget.jsx
new file mode 100644
index 0000000..1cc7db4
--- /dev/null
+++ b/src/customizations/volto/components/manage/Widgets/ObjectListWidget.jsx
@@ -0,0 +1,200 @@
+import React from 'react';
+import { defineMessages, useIntl } from 'react-intl';
+import { Accordion, Button, Segment } from 'semantic-ui-react';
+import { DragDropList, FormFieldWrapper, Icon } from '@plone/volto/components';
+import ObjectWidget from '@plone/volto/components/manage/Widgets/ObjectWidget';
+
+import upSVG from '@plone/volto/icons/up-key.svg';
+import downSVG from '@plone/volto/icons/down-key.svg';
+import deleteSVG from '@plone/volto/icons/delete.svg';
+import addSVG from '@plone/volto/icons/add.svg';
+import dragSVG from '@plone/volto/icons/drag.svg';
+import { v4 as uuid } from 'uuid';
+
+const messages = defineMessages({
+ labelRemoveItem: {
+ id: 'Remove item',
+ defaultMessage: 'Remove item',
+ },
+ labelCollapseItem: {
+ id: 'Collapse item',
+ defaultMessage: 'Collapse item',
+ },
+ labelShowItem: {
+ id: 'Show item',
+ defaultMessage: 'Show item',
+ },
+ emptyObjectList: {
+ id: 'Empty object list',
+ defaultMessage: 'Empty object list',
+ },
+});
+
+const ObjectListWidget = (props) => {
+ const {
+ block,
+ fieldSet,
+ id,
+ schema,
+ value = [],
+ onChange,
+ schemaExtender,
+ } = props;
+ const [activeColumn, setActiveColumn] = React.useState(value.length - 1);
+ const intl = useIntl();
+
+ function handleChangeColumn(e, blockProps) {
+ const { index } = blockProps;
+ const newIndex = activeColumn === index ? -1 : index;
+
+ setActiveColumn(newIndex);
+ }
+ const objectSchema = typeof schema === 'function' ? schema(props) : schema;
+
+ const topLayerShadow = '0 1px 1px rgba(0,0,0,0.15)';
+ const secondLayer = ', 0 10px 0 -5px #eee, 0 10px 1px -4px rgba(0,0,0,0.15)';
+ const thirdLayer = ', 0 20px 0 -10px #eee, 0 20px 1px -9px rgba(0,0,0,0.15)';
+
+ return (
+
+ {data.url.match('youtu') ? (
+ <>
+ {data.url.match('list') ? (
+ data.preview_image ? (
+
+ ) : (
+
+ )
+ ) : data.preview_image ? (
+
+ ) : (
+
+ )}
+
+ ) : (
+ <>
+ {data.url.match('vimeo') ? (
+ data.preview_image ? (
+
+ ) : (
+
+ )
+ ) : (
+ <>
+ {data.url.match('.mp4') ||
+ data.url.includes('cmshare.eea.europa.eu') ? (
+ // eslint-disable-next-line jsx-a11y/media-has-caption
+
+ ) : (
+
+ )}
+
+ )}
+
+ )}
+
+ )}
+
+
+
+ 1 ? secondLayer : ''}${
+ value.length > 2 ? thirdLayer : ''
+ }`,
+ }}
+ forwardedAriaLabelledBy={`fieldset-${
+ fieldSet || 'default'
+ }-field-label-${id}`}
+ childList={value.map((o, index) => [o['@id'] || index + 1, o])}
+ onMoveItem={(result) => {
+ const { source, destination } = result;
+ if (!destination) {
+ return;
+ }
+
+ const first = value[source.index];
+ const second = value[destination.index];
+ value[destination.index] = first;
+ value[source.index] = second;
+
+ onChange(id, value);
+ return true;
+ }}
+ >
+ {({ child, childId, index, draginfo }) => {
+ return (
+
+
+ );
+};
+export default ObjectListWidget;
diff --git a/src/customizations/volto/components/theme/App/App.jsx b/src/customizations/volto/components/theme/App/App.jsx
new file mode 100644
index 0000000..849ce74
--- /dev/null
+++ b/src/customizations/volto/components/theme/App/App.jsx
@@ -0,0 +1,300 @@
+/**
+ * App container.
+ * @module components/theme/App/App
+ */
+
+import React, { Component } from 'react';
+import { matchPath } from 'react-router';
+import PropTypes from 'prop-types';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { asyncConnect } from '@plone/volto/helpers';
+import { Segment, Container } from 'semantic-ui-react';
+import { renderRoutes } from 'react-router-config';
+import { Slide, ToastContainer, toast } from 'react-toastify';
+import split from 'lodash/split';
+import join from 'lodash/join';
+import trim from 'lodash/trim';
+import cx from 'classnames';
+import config from '@plone/volto/registry';
+import { PluggablesProvider } from '@plone/volto/components/manage/Pluggable';
+
+import Error from '@plone/volto/error';
+
+import ViewletsRenderer from '@eeacms/volto-addons-forest/Viewlets/Render';
+
+import {
+ Footer,
+ Header,
+ Icon,
+ OutdatedBrowser,
+ AppExtras,
+ SkipLinks,
+ Messages,
+} from '@plone/volto/components';
+import { BodyClass, getBaseUrl, getView, isCmsUi } from '@plone/volto/helpers';
+import {
+ getContent,
+ getNavigation,
+ getTypes,
+ getWorkflow,
+ purgeMessages,
+} from '@plone/volto/actions';
+import { getFrontpageSlides, getDefaultHeaderImage } from '~/actions';
+import { getPortlets } from '@eeacms/volto-addons-forest/actions';
+
+import clearSVG from '@plone/volto/icons/clear.svg';
+import * as Sentry from '@sentry/browser';
+
+/**
+ * @export
+ * @class App
+ * @extends {Component}
+ */
+class App extends Component {
+ /**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+ static propTypes = {
+ pathname: PropTypes.string.isRequired,
+ purgeMessages: PropTypes.func.isRequired,
+ };
+
+ state = {
+ hasError: false,
+ error: null,
+ errorInfo: null,
+ };
+
+ /**
+ * @method componentWillReceiveProps
+ * @param {Object} nextProps Next properties
+ * @returns {undefined}
+ */
+ UNSAFE_componentWillReceiveProps(nextProps) {
+ if (nextProps.pathname !== this.props.pathname) {
+ this.props.purgeMessages();
+ if (this.state.hasError) {
+ this.setState({ hasError: false });
+ }
+ }
+ }
+
+ /**
+ * ComponentDidCatch
+ * @method ComponentDidCatch
+ * @param {string} error The error
+ * @param {string} info The info
+ * @returns {undefined}
+ */
+ componentDidCatch(error, info) {
+ this.setState({ hasError: true, error, errorInfo: info });
+ if (__CLIENT__) {
+ if (window?.env?.RAZZLE_SENTRY_DSN || __SENTRY__?.SENTRY_DSN) {
+ Sentry.captureException(error);
+ }
+ }
+ }
+
+ /**
+ * Render method.
+ * @method render
+ * @returns {string} Markup for the component.
+ */
+ render() {
+ const { views } = config;
+ const path = getBaseUrl(this.props.pathname);
+ const action = getView(this.props.pathname);
+ const isCmsUI = isCmsUi(this.props.pathname);
+ const ConnectionRefusedView = views.errorViews.ECONNREFUSED;
+ const headerImage =
+ this.props.content?.image?.download || this.props.defaultHeaderImage;
+
+ return (
+
+
+
+ {value.length === 0 && (
+
+ )}
+
+
+
+
+
+
+
+
+ {
+ const newvalue = value.map((v, i) =>
+ i !== index ? v : fv,
+ );
+ onChange(id, newvalue);
+ }}
+ />
+
+
+
+
+ );
+ }}
+
+ {`${objectSchema.title} #${index + 1}`}
+
+
+
+ {activeColumn === index ? (
+
+
+
+
+ About
+
+
+
+ Partners
+
+
+
+ Other European Information Systems
+
+
+
+
+
+ -
+
-
+
+
+ +
+ -
+
+
+ +
+ - + + Contact us + + +
- + + EEA Systems Status + + + {!token && ( +
-
+
+
+ +
+ )}
+
+ Software version{' '} + + {version} + + , last updated {published_at} +
++ FISE - Forest Information System for Europe is a forest + knowledge base in support of the EU Forest Strategy.{' '} +
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ If you are certain you have the correct web address but are encountering + an error, please contact the{' '} + Site Administration. +
++ Or go back to Homepage. +
+Thank you.
+ {__CLIENT__ && + document.querySelector('.header-image-wrapper .header-image-content') && ( +Forbidden
+
+
+
+
+
+
+
+
+ );
+ }
+}
+export default connect((state) => ({
+ token: state.userSession.token,
+}))(Header);
diff --git a/src/customizations/volto/components/theme/Header/header-bg.png b/src/customizations/volto/components/theme/Header/header-bg.png
new file mode 100644
index 0000000..bd778d4
Binary files /dev/null and b/src/customizations/volto/components/theme/Header/header-bg.png differ
diff --git a/src/customizations/volto/components/theme/Login/Login.jsx b/src/customizations/volto/components/theme/Login/Login.jsx
new file mode 100644
index 0000000..8e592fa
--- /dev/null
+++ b/src/customizations/volto/components/theme/Login/Login.jsx
@@ -0,0 +1,364 @@
+/**
+ * Login container.
+ * @module components/theme/Login/Login
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { Helmet } from '@plone/volto/helpers';
+import { connect } from 'react-redux';
+import { compose } from 'redux';
+import { Link } from 'react-router-dom';
+import {
+ Container,
+ Button,
+ Form,
+ Input,
+ Segment,
+ Grid,
+} from 'semantic-ui-react';
+import { FormattedMessage, defineMessages, injectIntl } from 'react-intl';
+import qs from 'query-string';
+import { withRouter } from 'react-router-dom';
+
+import { Icon } from '@plone/volto/components';
+import { getNavigation, login } from '@plone/volto/actions';
+import { toast } from 'react-toastify';
+import { Toast } from '@plone/volto/components';
+
+import aheadSVG from '@plone/volto/icons/ahead.svg';
+import clearSVG from '@plone/volto/icons/clear.svg';
+
+import config from '@plone/volto/registry';
+
+const messages = defineMessages({
+ login: {
+ id: 'Log in',
+ defaultMessage: 'Log in',
+ },
+ loginName: {
+ id: 'Login Name',
+ defaultMessage: 'Login Name',
+ },
+ Login: {
+ id: 'Login',
+ defaultMessage: 'Login',
+ },
+ password: {
+ id: 'Password',
+ defaultMessage: 'Password',
+ },
+ cancel: {
+ id: 'Cancel',
+ defaultMessage: 'Cancel',
+ },
+ error: {
+ id: 'Error',
+ defaultMessage: 'Error',
+ },
+ loginFailed: {
+ id: 'Login Failed',
+ defaultMessage: 'Login Failed',
+ },
+ loginFailedContent: {
+ id:
+ 'Both email address and password are case sensitive, check that caps lock is not enabled.',
+ defaultMessage:
+ 'Both email address and password are case sensitive, check that caps lock is not enabled.',
+ },
+ register: {
+ id: 'Register',
+ defaultMessage: 'Register',
+ },
+ forgotPassword: {
+ id: 'box_forgot_password_option',
+ defaultMessage: 'Forgot your password?',
+ },
+});
+
+/**
+ * Login class.
+ * @class Login
+ * @extends Component
+ */
+class Login extends Component {
+ /**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+ static propTypes = {
+ login: PropTypes.func.isRequired,
+ error: PropTypes.shape({
+ message: PropTypes.string,
+ }),
+ loading: PropTypes.bool,
+ token: PropTypes.string, // eslint-disable-line react/no-unused-prop-types
+ returnUrl: PropTypes.string,
+ };
+
+ /**
+ * Default properties.
+ * @property {Object} defaultProps Default properties.
+ * @static
+ */
+ static defaultProps = {
+ error: null,
+ loading: null,
+ token: null,
+ returnUrl: null,
+ };
+
+ /**
+ * Constructor
+ * @method constructor
+ * @param {Object} props Component properties
+ * @constructs WysiwygEditor
+ */
+ constructor(props) {
+ super(props);
+ this.onLogin = this.onLogin.bind(this);
+ }
+
+ /**
+ * Component will receive props
+ * @method componentWillReceiveProps
+ * @param {Object} nextProps Next properties
+ * @returns {undefined}
+ */
+ UNSAFE_componentWillReceiveProps(nextProps) {
+ if (nextProps.token) {
+ const returnUrl =
+ this.props.returnUrl !== '/logout' ? this.props.returnUrl || '/' : '/';
+ this.props.history.push(returnUrl, {
+ isFromLogin: true,
+ });
+ if (toast.isActive('loginFailed')) {
+ toast.dismiss('loginFailed');
+ }
+ } else {
+ if (this.props.location.pathname === '/logout') {
+ this.props.history.push('/', {
+ isFromLogin: true,
+ });
+ }
+ }
+ if (nextProps.error) {
+ if (!toast.isActive('loginFailed')) {
+ toast.error(
+
+
+
+
+
+
+ {!hideSearch ? (
+
+
+ ) : null}
+
+
+
+ 
+
+
+ {this.state.isHomepage ? (
+
+
+ )}
+
+
+
+
+
+ );
+ }
+}
+
+export default compose(
+ withRouter,
+ injectIntl,
+ connect(
+ (state, props) => ({
+ lang: state.intl.locale,
+ error: state.userSession.login.error,
+ loading: state.userSession.login.loading,
+ token: state.userSession.token,
+ returnUrl:
+ qs.parse(props.location.search).return_url ||
+ props.location.pathname
+ .replace(/\/login$/, '')
+ .replace(/\/logout$/, '') ||
+ '/',
+ }),
+ { login, getNavigation },
+ ),
+)(Login);
diff --git a/src/customizations/volto/components/theme/Login/Readme.md b/src/customizations/volto/components/theme/Login/Readme.md
new file mode 100644
index 0000000..2c8615a
--- /dev/null
+++ b/src/customizations/volto/components/theme/Login/Readme.md
@@ -0,0 +1,5 @@
+Customized to solve a bug in login flow. See
+https://github.com/plone/volto/issues/1147
+
+Also, we need to add a special marker to the login flow push action, to be able
+to not "prefetch it". This might not be actually needed.
diff --git a/src/customizations/volto/components/theme/Logo/Logo-sm.svg b/src/customizations/volto/components/theme/Logo/Logo-sm.svg
new file mode 100644
index 0000000..c43b074
--- /dev/null
+++ b/src/customizations/volto/components/theme/Logo/Logo-sm.svg
@@ -0,0 +1,104 @@
+
+
+
diff --git a/src/customizations/volto/components/theme/Logo/Logo.jsx b/src/customizations/volto/components/theme/Logo/Logo.jsx
new file mode 100644
index 0000000..cbf0c61
--- /dev/null
+++ b/src/customizations/volto/components/theme/Logo/Logo.jsx
@@ -0,0 +1,73 @@
+/**
+ * Logo component.
+ * @module components/theme/Logo/Logo
+ */
+
+import React from 'react';
+import { Link } from 'react-router-dom';
+import { defineMessages, injectIntl } from 'react-intl';
+import LogoImage from '@plone/volto/components/theme/Logo/Logo.svg';
+import LogoImageSm from './Logo-sm.svg';
+import { LazyLoadImage } from 'react-lazy-load-image-component';
+import { Placeholder } from 'semantic-ui-react';
+
+const messages = defineMessages({
+ site: {
+ id: 'Site',
+ defaultMessage: 'Site',
+ },
+ plonesite: {
+ id: 'Plone Site',
+ defaultMessage: 'Plone Site',
+ },
+});
+
+/**
+ * Logo component class.
+ * @function Logo
+ * @param {Object} intl Intl object
+ * @returns {string} Markup of the component.
+ */
+const Logo = ({ intl }) => (
+
+ {JSON.stringify(this.props.navigation)}
+ const pathName = this.props.pathname;
+ const hideSearch = ['/header', '/head', '/footer'].includes(pathName);
+
+ return (
+
+ );
+ }
+}
+
+export default compose(injectIntl)(Navigation);
diff --git a/src/customizations/volto/components/theme/NotFound/NotFound.jsx b/src/customizations/volto/components/theme/NotFound/NotFound.jsx
new file mode 100644
index 0000000..687d65a
--- /dev/null
+++ b/src/customizations/volto/components/theme/NotFound/NotFound.jsx
@@ -0,0 +1,62 @@
+import React, { Component } from 'react';
+import { Portal } from 'react-portal';
+import { Route } from 'react-router-dom';
+/**
+ * @export
+ * @class NotFound
+ * @extends {Component}
+ */
+class NotFound extends Component {
+ /**
+ * Render method.
+ * @method render
+ * @returns {string} Markup for the component.
+ */
+ render() {
+ return (
+
+
+
+ )}
+
+ );
+ }}
+ >+ We apologize for the inconvenience, but the page you were trying + to access is not at this address. You can use the links below to + help you find what you are looking for. +
++ If you are certain you have the correct web address but are + encountering an error, please contact the{' '} + Site Administration. +
++ Or go back to Homepage. +
+Thank you.
+ {__CLIENT__ && + document.querySelector( + '.header-image-wrapper .header-image-content', + ) && ( ++ This page does not seem to exist… +
+
+
+
+
+
+
+ {this.props.title ? (
+ `${this.props.title}`
+ ) : (
+
+
+ {/*
+
+ {this.props.items.map((item, index) => (
+
+
+
+
+
+
+ ))}
+
+ {this.props.search?.batching && (
+
+
+
+
+ {this.props.title ? (
+ `${this.props.title}`
+ ) : (
+
+
+ {/*
+ {this.props.searchableText ? (
+
+ Results for:{' '}
+
+ {this.props.searchableText}
+
+
+ ) : (
+ ''
+ )}
+ {this.props.search?.items_total ? (
+ {this.props.search.items_total} results
+ ) : (
+
+ No results found
+ )} +
+
+
+
+
+
+
+ {this.state.expendedItemIndex === index
+ ? item.summary.fullSummary.length > 0
+ ? item.summary.fullSummary.map((paragraph, index) => (
+
+ {paragraph}
+
+ ))
+ : item.description
+ : item.summary.matchedParagraph.length > 0
+ ? item.summary.matchedParagraph[0]
+ : item.summary.firstParagraph.length > 0
+ ? item.summary.firstParagraph[0]
+ : item.description}
+
+
+
+
+ )}
+
+
+
+ )}
+
+ );
+ }}
+ >+ You are trying to access a protected resource, please + login + first. +
++ If you are certain you have the correct web address but are + encountering an error, please contact the{' '} + Site Administration. +
++ Or go back to Homepage. +
+Thank you.
+ {__CLIENT__ && + document.querySelector( + '.header-image-wrapper .header-image-content', + ) && ( +Unauthorized
+
+ {map(content[blocksLayoutFieldname].items, (block) => {
+ const Block =
+ config.blocks.blocksConfig[
+ content[blocksFieldname]?.[block]?.['@type']
+ ]?.['view'] || null;
+ return Block !== null &&
+ content[blocksFieldname][block]['@type'] !== 'title' ? (
+
+ ) : (
+
+ // {intl.formatMessage(messages.unknownBlock, {
+ // block: content[blocksFieldname]?.[block]?.['@type'],
+ // })}
+ //
+ ''
+ );
+ })}
+ {''}
+ {''}
+
+
+ ) : (
+
+ // {intl.formatMessage(messages.unknownBlock, {
+ // block: content[blocksFieldname]?.[block]?.['@type'],
+ // })}
+ //
+ ''
+ );
+ })}
+ {content.title}
+ {content.description && ( +{content.description}
+ )} */} + {content.image && ( +
+
+ ) : (
+
+ // {intl.formatMessage(messages.unknownBlock, {
+ // block: content[blocksFieldname]?.[block]?.['@type'],
+ // })}
+ //
+ ''
+ );
+ })}
+ {content.description}
+ )} + {content.image && ( +
+
+ );
+ }
+ if (!this.props.content) {
+ return ;
+ }
+ const RenderedView =
+ this.getViewByType() || this.getViewByLayout() || this.getViewDefault();
+
+ return (
+
+
+ {this.props.content.language && (
+
+ )}
+ {this.props.content.title}
+
+
+ {/* Body class if displayName in component is set */}
+
+
+ )}
+
+
+
+ )}
+
+ {__CLIENT__ &&
+ document.querySelector(
+ '.header-image-wrapper .header-image-content',
+ ) && (
+
+
+ )}
+
+ );
+ }
+}
+
+export default compose(
+ injectIntl,
+ connect(
+ (state, props) => ({
+ actions: state.actions.actions,
+ token: state.userSession.token,
+ content: state.content.data,
+ error: state.content.get.error,
+ apiError: state.apierror.error,
+ connectionRefused: state.apierror.connectionRefused,
+ pathname: props.location.pathname,
+ loading: state.content.get?.loading,
+ versionId:
+ qs.parse(props.location.search) &&
+ qs.parse(props.location.search).version,
+ }),
+ {
+ listActions,
+ getContent,
+ },
+ ),
+)(View);
diff --git a/src/customizations/volto/helpers/Html/Html.jsx b/src/customizations/volto/helpers/Html/Html.jsx
new file mode 100644
index 0000000..9c1db2e
--- /dev/null
+++ b/src/customizations/volto/helpers/Html/Html.jsx
@@ -0,0 +1,123 @@
+/**
+ * Html helper.
+ * @module helpers/Html
+ */
+
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import { Helmet } from '@plone/volto/helpers';
+import serialize from 'serialize-javascript';
+import { join } from 'lodash';
+import { BodyClass } from '@plone/volto/helpers';
+import { runtimeConfig } from '@plone/volto/runtime_config';
+
+/**
+ * Html class.
+ * Wrapper component containing HTML metadata and boilerplate tags.
+ * Used in server-side code only to wrap the string output of the
+ * rendered route component.
+ *
+ * The only thing this component doesn't (and can't) include is the
+ * HTML doctype declaration, which is added to the rendered output
+ * by the server.js file.
+ * @function Html
+ * @param {Object} props Component properties.
+ * @param {Object} props.assets Assets to be rendered.
+ * @param {Object} props.component Content to be rendered as child node.
+ * @param {Object} props.store Store object.
+ * @returns {string} Markup of the not found page.
+ */
+
+/**
+ * Html class.
+ * @class Html
+ * @extends Component
+ */
+class Html extends Component {
+ /**
+ * Property types.
+ * @property {Object} propTypes Property types.
+ * @static
+ */
+ static propTypes = {
+ extractor: PropTypes.shape({
+ getLinkElements: PropTypes.func.isRequired,
+ getScriptElements: PropTypes.func.isRequired,
+ getStyleElements: PropTypes.func.isRequired,
+ }).isRequired,
+ markup: PropTypes.string.isRequired,
+ store: PropTypes.shape({
+ getState: PropTypes.func,
+ }).isRequired,
+ };
+
+ /**
+ * Render method.
+ * @method render
+ * @returns {string} Markup for the component.
+ */
+ render() {
+ const { extractor, markup, store } = this.props;
+ const head = Helmet.rewind();
+ const bodyClass = join(BodyClass.rewind(), ' ');
+ const pathName = store.getState()?.router.location.pathname;
+ const renderScripts = ['/header', '/head', '/footer'].includes(pathName);
+ return (
+
+
+
+ {head.base.toComponent()}
+ {head.title.toComponent()}
+ {head.meta.toComponent()}
+ {!renderScripts && head.link.toComponent()}
+ {!renderScripts && head.script.toComponent()}
+
+
+
+
+
+
+
+ {/* Add the crossorigin while in development */}
+ {!renderScripts &&
+ extractor.getLinkElements().map((elem) =>
+ React.cloneElement(elem, {
+ crossOrigin:
+ process.env.NODE_ENV === 'production' ? undefined : 'true',
+ }),
+ )}
+ {/* Styles in development are loaded with Webpack's style-loader, in production,
+ they need to be static*/}
+ {!renderScripts && process.env.NODE_ENV === 'production' && (
+ <>{extractor.getStyleElements()}
+ )}
+
+
+
+
+
+
+ {/* Add the crossorigin while in development */}
+ {!renderScripts && this.props.extractScripts !== false
+ ? extractor.getScriptElements().map((elem) =>
+ React.cloneElement(elem, {
+ crossOrigin:
+ process.env.NODE_ENV === 'production' ? undefined : 'true',
+ }),
+ )
+ : ''}
+
+
+ );
+ }
+}
+export default Html;
diff --git a/src/helpers/index.js b/src/helpers/index.js
new file mode 100644
index 0000000..5b70bb0
--- /dev/null
+++ b/src/helpers/index.js
@@ -0,0 +1,109 @@
+import config from '@plone/volto/registry';
+import { getBaseUrl } from '@plone/volto/helpers';
+import { setConnectedDataParameters } from '@eeacms/volto-datablocks/actions';
+
+export function getBasePath(url) {
+ return getBaseUrl(url)
+ .replace(config.settings.apiPath, '')
+ .replace(config.settings.internalApiPath, '');
+}
+
+export const objectHasData = (obj) => {
+ return typeof obj === 'object' && obj !== null && Object.keys(obj).length > 0;
+};
+
+export const getSchemaWithDataQuery = (props) => {
+ if (!props.schema) return {};
+ let schemaWithDataQuery = {};
+ Object.keys(props.schema).forEach((element) => {
+ if (props.schema[element].type === 'data-provider') {
+ if (
+ !objectHasData(
+ props?.connected_data_parameters?.byProviderPath?.[props.path],
+ ) &&
+ !objectHasData(
+ props?.connected_data_parameters?.byContextPath?.[props.path],
+ )
+ ) {
+ const dataQuery = {};
+ dataQuery[element + '_data_query'] = {
+ defaultformat: 'compactnumber',
+ type: 'data-query',
+ };
+ schemaWithDataQuery[element] = props.schema[element];
+ schemaWithDataQuery = { ...schemaWithDataQuery, ...dataQuery };
+ }
+ }
+ schemaWithDataQuery[element] = props.schema[element];
+ });
+ return schemaWithDataQuery;
+};
+
+export function getLocation(href) {
+ var match = href.match(
+ /^(https?:)\/\/(([^:/?#]*)(?::([0-9]+))?)([/]{0,1}[^?#]*)(\?[^#]*|)(#.*|)$/,
+ );
+ return (
+ match && {
+ href: href,
+ protocol: match[1],
+ host: match[2],
+ hostname: match[3],
+ port: match[4],
+ pathname: match[5],
+ search: match[6],
+ hash: match[7],
+ }
+ );
+}
+
+export function samePath(url, path) {
+ // returns true if the router path is equal to the given url path
+ const parsed = getLocation(url);
+ const clean = url
+ .replace(config.settings.apiPath, '')
+ .replace(config.settings.internalApiPath, '')
+ .replace(parsed.hash, '')
+ .replace(parsed.search, '')
+ .replace(/\/$/, '');
+
+ const cleanPath = path.replace(/\/$/, '');
+ return clean === cleanPath;
+}
+
+export const updateConnectedDataParameters = (props) => {
+ props.schema &&
+ Object.keys(props.schema).forEach((element) => {
+ if (props.schema[element].type === 'data-query') {
+ if (
+ props?.newData?.columns?.[element] &&
+ (props?.newData?.columns?.[element]?.value?.i !==
+ props?.data?.columns?.[element]?.value?.i ||
+ props?.newData?.columns?.[element]?.value?.v !==
+ props?.data?.columns?.[element]?.value?.v)
+ ) {
+ const path = getBasePath(props.pathname);
+ const byPath = props?.connected_data_parameters?.byPath;
+ const connected_data_parameters =
+ (byPath?.[path]?.override?.length > 0 &&
+ byPath?.[path]?.override?.[`${props.id}_${element}`]) ||
+ null;
+ if (
+ connected_data_parameters === null ||
+ connected_data_parameters?.i !==
+ props?.newData?.columns?.[element]?.value?.i ||
+ connected_data_parameters?.v?.join(',') !==
+ props?.newData?.columns?.[element]?.value?.v
+ ) {
+ props.dispatch(
+ setConnectedDataParameters(
+ path.replace('/edit', ''),
+ props?.newData?.columns?.[element]?.value,
+ `${props.id}_${element}`,
+ ),
+ );
+ }
+ }
+ }
+ });
+};
diff --git a/src/index.js b/src/index.js
index cb042f0..34f6ab8 100644
--- a/src/index.js
+++ b/src/index.js
@@ -1,5 +1,64 @@
-const applyConfig = (config) => {
- return config;
-};
+import Forbidden from '@plone/volto/components/theme/Forbidden/Forbidden';
+import Unauthorized from '@plone/volto/components/theme/Unauthorized/Unauthorized';
+
+import { installBlocks } from '@eeacms/volto-plotlycharts';
+import { applyConfig as installFiseFrontend } from './localconfig';
+
+import ObjectListInlineWidget from './components/manage/Widgets/ObjectListInlineWidget';
+import reducers from '~/reducers';
+
+import '@plone/volto/config';
+
+export default function applyConfig(config) {
+ // Add here your project's configuration here by modifying `config` accordingly
+ config = [installBlocks, installFiseFrontend].reduce(
+ (acc, apply) => apply(acc),
+ config,
+ );
+
+ config.settings = {
+ ...config.settings,
+ frontendMeta: {
+ version: process.env.RAZZLE_FRONTEND_VERSION || null,
+ version_url: process.env.RAZZLE_FRONTEND_VERSION_URL || null,
+ published_at: process.env.RAZZLE_FRONTEND_PUBLISHED_AT || null,
+ },
+ timezone: 'CET',
+ matomoSiteId: 46,
+ pathsWithFullobjects: ['/news', '/events'],
+ pathsWithExtraParameters: {
+ '/news': { b_start: 0, b_size: 1000 },
+ '/events': { b_start: 0, b_size: 1000 },
+ },
+ };
-export default applyConfig;
+ config.views = {
+ ...config.views,
+ errorViews: {
+ ...config.views.errorViews,
+ '403': Forbidden,
+ '401': Unauthorized,
+ },
+ };
+
+ config.widgets = {
+ ...config.widgets,
+ widget: {
+ ...config.widgets.widget,
+ object_list_inline: ObjectListInlineWidget,
+ },
+ };
+
+ config.viewlets = [...(config.viewlets || [])];
+ config.addonReducers = { ...config.addonReducers, ...reducers };
+
+ // export const portlets = {
+ // ...config.portlets,
+ // };
+
+ config.editForms = {
+ ...config.editForms,
+ };
+
+ return config;
+}
diff --git a/src/localconfig.js b/src/localconfig.js
new file mode 100644
index 0000000..b8c065f
--- /dev/null
+++ b/src/localconfig.js
@@ -0,0 +1,236 @@
+import { defineMessages } from 'react-intl';
+
+import TokenWidget from '@plone/volto/components/manage/Widgets/TokenWidget';
+
+import CountryView from '~/components/theme/CountryView/CountryView';
+// import CountryPageView from '~/components/theme/CountryPageView/CountryPageView';
+//import HomepageView from '~/components/theme/HomepageView/HomepageView';
+import NewsView from '~/components/theme/NewsView/NewsView';
+import RefreshView from '~/components/theme/RefreshView/RefreshView';
+
+import chartIcon from '@plone/volto/icons/world.svg';
+
+import DefaultViewWide from '~/components/theme/DefaultViewWide/DefaultViewWide';
+import DefaultView from '~/customizations/volto/components/theme/View/DefaultView';
+
+import ForestMetadata from '~/components/theme/Viewlets/ForestMetadata';
+
+import NavigationBlockEdit from '~/components/manage/Blocks/NavigationBlock/Edit';
+import NavigationBlockView from '~/components/manage/Blocks/NavigationBlock/View';
+
+import RedirectView from '~/components/theme/View/RedirectView';
+import { uniqBy } from 'lodash';
+
+defineMessages({
+ custom_addons: {
+ id: 'custom_addons',
+ defaultMessage: 'Custom Addons',
+ },
+ plotly_chart: {
+ id: 'plotly_chart',
+ defaultMessage: 'Plotly Chart',
+ },
+ demo_chart: {
+ id: 'demo_chart',
+ defaultMessage: 'Demo Chart',
+ },
+ tableau: {
+ id: 'tableau',
+ defaultMessage: 'Tableau',
+ },
+ forests_specific: {
+ id: 'forests_specific',
+ defaultMessage: 'Forests Specific Blocks',
+ },
+});
+
+function addCustomGroup(config) {
+ const hasCustomGroup = config.blocks.groupBlocksOrder.filter(
+ (el) => el.id === 'custom_addons',
+ );
+ if (hasCustomGroup.length === 0) {
+ config.blocks.groupBlocksOrder.push({
+ id: 'custom_addons',
+ title: 'Custom addons',
+ });
+ }
+}
+
+export function applyConfig(config) {
+ addCustomGroup(config);
+ config.settings = {
+ ...config.settings,
+ navDepth: 4,
+ repo: 'eea/forests-frontend',
+ richTextEditorInlineToolbarButtons: [
+ // Underline,
+ ...config.settings.richTextEditorInlineToolbarButtons,
+ ],
+ nonContentRoutes: [
+ // handled differently in getBaseUrl
+ ...config.settings.nonContentRoutes,
+ '/manage-slider',
+ '/sitemap',
+ '/unauthorized',
+ ],
+ ownDomain: 'forest.eea.europa.eu',
+ matomoSiteId: 46,
+ // ...['navigation', '&expand.navigation.depth=3'],
+ };
+
+ config.views = {
+ ...config.views,
+ layoutViews: {
+ ...config.views.layoutViews,
+ full_view: CountryView,
+ // country_tab_view: CountryPageView,
+ //homepage_view: HomepageView,
+ // ...layoutViews,
+ news_item_listing_view: NewsView,
+ refresh_view: RefreshView,
+ document_view_wide: DefaultViewWide,
+ document_view: DefaultView,
+ redirect_view: RedirectView,
+ },
+ };
+
+ delete config.views.contentTypesViews['News Item'];
+ delete config.views.contentTypesViews['Event'];
+
+ // read @plone/volto/components/manage/Form/Field.jsx to understand this
+ config.widgets = {
+ ...config.widgets,
+ vocabulary: {
+ ...config.widgets.vocabulary,
+ 'fise.topics': TokenWidget,
+ 'fise.keywords': TokenWidget,
+ 'fise.publishers': TokenWidget,
+ },
+ };
+
+ config.blocks = {
+ ...config.blocks,
+
+ groupBlocksOrder: [
+ { id: 'common_blocks', title: 'Common blocks' },
+ { id: 'forests_specific', title: 'Forests Specific Blocks' },
+ ...uniqBy(config.blocks.groupBlocksOrder, 'id').filter(
+ (block) => !['text', 'mostUsed', 'media', 'common'].includes(block.id),
+ ),
+ ],
+
+ blocksConfig: {
+ navigation_tabs_block: {
+ id: 'navigation_tabs_block',
+ title: 'Navigation tabs block',
+ view: NavigationBlockView,
+ edit: NavigationBlockEdit,
+ icon: chartIcon,
+ group: 'forests_specific',
+ },
+ ...Object.keys(config.blocks.blocksConfig).reduce((acc, blockKey) => {
+ if (
+ ['text', 'mostUsed', 'media', 'common'].includes(
+ config.blocks.blocksConfig[blockKey].group,
+ )
+ ) {
+ acc[blockKey] = {
+ ...config.blocks.blocksConfig[blockKey],
+ group: 'common_blocks',
+ };
+ } else {
+ acc[blockKey] = config.blocks.blocksConfig[blockKey];
+ }
+ return acc;
+ }, {}),
+ },
+ };
+
+ config.viewlets = [
+ { path: '/', component: ForestMetadata },
+ ...(config.viewlets || []),
+ ];
+
+ config.settings.plotlyCustomColors = [
+ {
+ title: 'Forest Default',
+ colorscale: [
+ '#215511',
+ '#77BB12',
+ '#CBEE66',
+ '#ffffff',
+ '#F4F4F1',
+ '#000000',
+ ],
+ },
+ {
+ title: 'Forest Active',
+ colorscale: [
+ '#CA4300 ',
+ '#E0E1E2',
+ '#E30166',
+ '#074F7C',
+ '#000000',
+ '#ffffff',
+ ],
+ },
+ ];
+
+ // border-tile
+ config.settings.pluggableStyles = [
+ ...(config.settings.pluggableStyles || []),
+ {
+ id: 'borderBlock',
+ title: 'Border block',
+ cssClass: 'border-block',
+ },
+ {
+ id: 'marginBlock10',
+ title: 'Margin border',
+ cssClass: 'margin-block-10 border-block',
+ },
+ {
+ id: 'paddingBlock10',
+ title: 'Padding border',
+ cssClass: 'padding-block-10 border-block',
+ },
+ {
+ id: 'paddingMarginBlock10',
+ title: 'Padding margin border',
+ cssClass: 'padding-block-10 margin-block-10 border-block',
+ },
+ {
+ id: 'marginOnly10',
+ title: 'Margin only',
+ cssClass: 'margin-block-10',
+ },
+ {
+ id: 'dropShadow',
+ title: 'Drop shadow',
+ cssClass: 'drop-shadow-tile',
+ },
+ {
+ id: 'dropShadowMargin',
+ title: 'Drop shadow margin',
+ cssClass: 'drop-shadow-tile margin-block-10',
+ },
+ {
+ id: 'dropShadowPadding',
+ title: 'Drop shadow padding',
+ cssClass: 'drop-shadow-tile padding-block-10',
+ },
+ {
+ id: 'dropShadowPaddingMargin',
+ title: 'Drop shadow padding margin',
+ cssClass: 'drop-shadow-tile margin-block-10 padding-block-10',
+ },
+ ];
+ // config.settings.search_portal_types = [
+ // 'Event',
+ // 'News Item',
+ // 'Document',
+ // 'templated_country_factsheet',
+ // 'basic_data_factsheet',
+ // ];
+ return config;
+}
diff --git a/src/plugins/index.js b/src/plugins/index.js
new file mode 100644
index 0000000..0af503a
--- /dev/null
+++ b/src/plugins/index.js
@@ -0,0 +1,26 @@
+// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer');
+
+module.exports = function myRazzlePlugin(config, env, webpack, options) {
+ const { target, dev } = env;
+
+ const stats = `bundle-stats-${target}`.json;
+ const report = `bundle-stats-${target}`.html;
+
+ const webpackConfig = !dev
+ ? {
+ ...config,
+ plugins: [
+ ...config.plugins,
+ // new BundleAnalyzerPlugin.BundleAnalyzerPlugin({
+ // analyzerMode: 'static',
+ // generateStatsFile: true,
+ // statsFilename: stats,
+ // reportFilename: report,
+ // openAnalyzer: false,
+ // }),
+ ],
+ }
+ : {};
+
+ return webpackConfig;
+};
diff --git a/src/plugins/package.json b/src/plugins/package.json
new file mode 100644
index 0000000..b209486
--- /dev/null
+++ b/src/plugins/package.json
@@ -0,0 +1,11 @@
+{
+ "name": "razzle-plugin-forest-analyzer",
+ "version": "1.0.0",
+ "description": "",
+ "main": "index.js",
+ "scripts": {
+ "test": "echo \"Error: no test specified\" && exit 1"
+ },
+ "author": "",
+ "license": "ISC"
+}
diff --git a/src/reducers/current_version.js b/src/reducers/current_version.js
new file mode 100644
index 0000000..5df810a
--- /dev/null
+++ b/src/reducers/current_version.js
@@ -0,0 +1,33 @@
+/**
+ * Navigation reducer.
+ * @module reducers/frontpage_slides
+ */
+
+import { SET_CURRENT_VERSION } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: {},
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function current_version(state = initialState, action = {}) {
+ if (action.type === SET_CURRENT_VERSION) {
+ return {
+ ...state,
+ error: null,
+ items: action.payload,
+ loaded: true,
+ loading: false,
+ };
+ }
+ return state;
+}
diff --git a/src/reducers/default_header_image.js b/src/reducers/default_header_image.js
new file mode 100644
index 0000000..0a32e50
--- /dev/null
+++ b/src/reducers/default_header_image.js
@@ -0,0 +1,59 @@
+/**
+ * Navigation reducer.
+ * @module reducers/frontpage_slides
+ */
+
+import { map } from 'lodash';
+
+import { GET_DEFAULT_HEADER_IMAGE } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: [],
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function default_header_image(
+ state = initialState,
+ action = {},
+) {
+ switch (action.type) {
+ case `${GET_DEFAULT_HEADER_IMAGE}_PENDING`:
+ return {
+ ...state,
+ error: null,
+ loaded: false,
+ loading: true,
+ };
+ case `${GET_DEFAULT_HEADER_IMAGE}_SUCCESS`:
+ return {
+ ...state,
+ error: null,
+ items: map(action.result.items, (item) => ({
+ title: item.title,
+ image: item.image.download,
+ description: item.description,
+ })),
+ loaded: true,
+ loading: false,
+ };
+ case `${GET_DEFAULT_HEADER_IMAGE}_FAIL`:
+ return {
+ ...state,
+ error: action.error,
+ items: [],
+ loaded: false,
+ loading: false,
+ };
+ default:
+ return state;
+ }
+}
diff --git a/src/reducers/folder_header.js b/src/reducers/folder_header.js
new file mode 100644
index 0000000..42e4468
--- /dev/null
+++ b/src/reducers/folder_header.js
@@ -0,0 +1,60 @@
+/**
+ * Navigation reducer.
+ * @module reducers/frontpage_slides
+ */
+
+import { SET_FOLDER_HEADER } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: {},
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function folder_header(state = initialState, action = {}) {
+ switch (action.type) {
+ case `${SET_FOLDER_HEADER}_PENDING`:
+ return {
+ ...state,
+ error: null,
+ loaded: false,
+ loading: true,
+ };
+ case `${SET_FOLDER_HEADER}_SUCCESS`:
+ const image =
+ (action.result.image && action.result.image.download) || null;
+ const title = action.result.title || null;
+ const description = action.result.description || null;
+ const url = action.result['@id'] || null;
+ return {
+ ...state,
+ error: null,
+ items: {
+ image,
+ title,
+ description,
+ url,
+ },
+ loaded: true,
+ loading: false,
+ };
+ case `${SET_FOLDER_HEADER}_FAIL`:
+ return {
+ ...state,
+ error: action.error,
+ items: [],
+ loaded: false,
+ loading: false,
+ };
+ default:
+ return state;
+ }
+}
diff --git a/src/reducers/folder_tabs.js b/src/reducers/folder_tabs.js
new file mode 100644
index 0000000..fc7e256
--- /dev/null
+++ b/src/reducers/folder_tabs.js
@@ -0,0 +1,28 @@
+import { SET_FOLDER_TABS } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: null,
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function folder_tabs(state = initialState, action = {}) {
+ if (action.type === SET_FOLDER_TABS) {
+ return {
+ ...state,
+ error: null,
+ items: action.payload,
+ loaded: true,
+ loading: false,
+ };
+ }
+ return state;
+}
diff --git a/src/reducers/frontpage_slides.js b/src/reducers/frontpage_slides.js
new file mode 100644
index 0000000..47a33d1
--- /dev/null
+++ b/src/reducers/frontpage_slides.js
@@ -0,0 +1,56 @@
+/**
+ * Navigation reducer.
+ * @module reducers/frontpage_slides
+ */
+
+import { map } from 'lodash';
+
+import { GET_FRONTPAGESLIDES } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: [],
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function frontpage_slides(state = initialState, action = {}) {
+ switch (action.type) {
+ case `${GET_FRONTPAGESLIDES}_PENDING`:
+ return {
+ ...state,
+ error: null,
+ loaded: false,
+ loading: true,
+ };
+ case `${GET_FRONTPAGESLIDES}_SUCCESS`:
+ return {
+ ...state,
+ error: null,
+ items: map(action.result.items, (item) => ({
+ title: item.title,
+ image: item.image.download,
+ description: item.description,
+ })),
+ loaded: true,
+ loading: false,
+ };
+ case `${GET_FRONTPAGESLIDES}_FAIL`:
+ return {
+ ...state,
+ error: action.error,
+ items: [],
+ loaded: false,
+ loading: false,
+ };
+ default:
+ return state;
+ }
+}
diff --git a/src/reducers/index.js b/src/reducers/index.js
new file mode 100644
index 0000000..6e51106
--- /dev/null
+++ b/src/reducers/index.js
@@ -0,0 +1,35 @@
+/**
+ * Root reducer.
+ * @module reducers/root
+ */
+
+import defaultReducers from '@plone/volto/reducers';
+import frontpage_slides from '~/reducers/frontpage_slides';
+import folder_header from '~/reducers/folder_header';
+import folder_tabs from '~/reducers/folder_tabs';
+import default_header_image from '~/reducers/default_header_image';
+import parent_folder_data from '~/reducers/parent_folder_data';
+import localnavigation from '~/reducers/localnavigation';
+import navSiteMap from '~/reducers/sitemap';
+import current_version from '~/reducers/current_version';
+
+/**
+ * Root reducer.
+ * @function
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+const reducers = {
+ ...defaultReducers,
+ frontpage_slides,
+ folder_header,
+ default_header_image,
+ folder_tabs,
+ parent_folder_data,
+ localnavigation,
+ navSiteMap,
+ current_version,
+};
+
+export default reducers;
diff --git a/src/reducers/localnavigation.js b/src/reducers/localnavigation.js
new file mode 100644
index 0000000..cab5e3f
--- /dev/null
+++ b/src/reducers/localnavigation.js
@@ -0,0 +1,45 @@
+import { GET_LOCALNAVIGATION } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: {},
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function localnavigation(state = initialState, action = {}) {
+ switch (action.type) {
+ case `${GET_LOCALNAVIGATION}_PENDING`:
+ return {
+ ...state,
+ error: null,
+ loaded: false,
+ loading: true,
+ };
+ case `${GET_LOCALNAVIGATION}_SUCCESS`:
+ return {
+ ...state,
+ error: null,
+ items: action.result,
+ loaded: true,
+ loading: false,
+ };
+ case `${GET_LOCALNAVIGATION}_FAIL`:
+ return {
+ ...state,
+ error: action.error,
+ items: [],
+ loaded: false,
+ loading: false,
+ };
+ default:
+ return state;
+ }
+}
diff --git a/src/reducers/parent_folder_data.js b/src/reducers/parent_folder_data.js
new file mode 100644
index 0000000..9e53572
--- /dev/null
+++ b/src/reducers/parent_folder_data.js
@@ -0,0 +1,50 @@
+/**
+ * Navigation reducer.
+ * @module reducers/frontpage_slides
+ */
+
+import { GET_PARENT_FOLDER_DATA } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: [],
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function parent_folder_data(state = initialState, action = {}) {
+ switch (action.type) {
+ case `${GET_PARENT_FOLDER_DATA}_PENDING`:
+ return {
+ ...state,
+ error: null,
+ loaded: false,
+ loading: true,
+ };
+ case `${GET_PARENT_FOLDER_DATA}_SUCCESS`:
+ return {
+ ...state,
+ error: null,
+ items: action.result,
+ loaded: true,
+ loading: false,
+ };
+ case `${GET_PARENT_FOLDER_DATA}_FAIL`:
+ return {
+ ...state,
+ error: action.error,
+ items: [],
+ loaded: false,
+ loading: false,
+ };
+ default:
+ return state;
+ }
+}
diff --git a/src/reducers/set_folder_header.js b/src/reducers/set_folder_header.js
new file mode 100644
index 0000000..ae8646c
--- /dev/null
+++ b/src/reducers/set_folder_header.js
@@ -0,0 +1,33 @@
+/**
+ * Navigation reducer.
+ * @module reducers/frontpage_slides
+ */
+
+import { SET_FOLDER_HEADER } from '~/constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: {},
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function folder_header(state = initialState, action = {}) {
+ if (action.type === SET_FOLDER_HEADER) {
+ return {
+ ...state,
+ error: null,
+ items: action.payload,
+ loaded: true,
+ loading: false,
+ };
+ }
+ return state;
+}
diff --git a/src/reducers/sitemap.js b/src/reducers/sitemap.js
new file mode 100644
index 0000000..2baec88
--- /dev/null
+++ b/src/reducers/sitemap.js
@@ -0,0 +1,71 @@
+/**
+ * Navigation reducer.
+ * @module reducers/navigation/navigation
+ */
+
+import { map } from 'lodash';
+import config from '@plone/volto/registry';
+
+//import { GET_NAVIGATION } from '../../constants/ActionTypes';
+import { GET_NAVSITEMAP } from '../constants/ActionTypes';
+
+const initialState = {
+ error: null,
+ items: [],
+ loaded: false,
+ loading: false,
+};
+
+/**
+ * Recursive function that process the items returned by the navigation
+ * endpoint
+ * @function getRecursiveItems
+ * @param {array} items The items inside a navigation response.
+ * @returns {*} The navigation items object (recursive)
+ */
+function getRecursiveItems(items) {
+ return map(items, (item) => ({
+ title: item.title,
+ url: item['@id'].replace(config.settings.apiPath, ''),
+ ...(item.items && { items: getRecursiveItems(item.items) }),
+ }));
+}
+
+/**
+ * Navigation reducer.
+ * @function navigation
+ * @param {Object} state Current state.
+ * @param {Object} action Action to be handled.
+ * @returns {Object} New state.
+ */
+export default function navSiteMap(state = initialState, action = {}) {
+ switch (action.type) {
+ case `${GET_NAVSITEMAP}_PENDING`:
+ return {
+ ...state,
+ error: null,
+ loaded: false,
+ loading: true,
+ };
+
+ case `${GET_NAVSITEMAP}_SUCCESS`:
+ return {
+ ...state,
+ error: null,
+ items: getRecursiveItems(action.result.items),
+ loaded: true,
+ loading: false,
+ };
+
+ case `${GET_NAVSITEMAP}_FAIL`:
+ return {
+ ...state,
+ error: action.error,
+ items: [],
+ loaded: false,
+ loading: false,
+ };
+ default:
+ return state;
+ }
+}
diff --git a/theme/addons/volto-addons/imagecards/carousel.overrides b/theme/addons/volto-addons/imagecards/carousel.overrides
new file mode 100644
index 0000000..761d4f5
--- /dev/null
+++ b/theme/addons/volto-addons/imagecards/carousel.overrides
@@ -0,0 +1,278 @@
+
+.slider-image {
+ // width : 100%;
+ height: 601px;
+ display: block;
+ position: relative;
+ background-size: cover;
+ width: 100%;
+ }
+
+
+ .navSlider {
+ .slider-image {
+ height: 105px;
+ min-width: 150px;
+ width: 40%;
+ background-size: cover;
+ }
+
+ .slide-body {
+ background: white;
+ display: block;
+ position: relative;
+ height: 105px;
+ flex-grow: 1;
+ left: unset;
+ }
+
+ .slider-slide {
+ // width : 100%;
+ // display : inline-block;
+ // box-shadow : 1px 1px 3px #333;
+ box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
+ // background : white;
+ background-color: black;
+ border-radius: 6px;
+ overflow: hidden;
+ color: black;
+ display: inline-flex !important;
+ align-items: center;
+ margin: .8rem;
+ }
+
+ .slide-description {
+ display: none;
+ }
+
+ .slick-slide {
+ padding: .5rem;
+ }
+ }
+
+ .slideArrow {
+ position: absolute;
+ bottom: 9px;
+ z-index: 1;
+ width: 25px;
+
+ &.prevArrow {
+ left: 5px;
+ }
+
+ &.nextArrow {
+ left: 86px;
+ }
+
+ color: white;
+ }
+
+
+.slide-overlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: linear-gradient(45deg, rgba(0, 0, 0, 0.9) 0%, rgba(0, 0, 0, 0.64) 14%, rgba(0, 0, 0, 0) 49%, rgba(0, 0, 0, 0) 100%);
+ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+
+ // background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 66%,rgba(0,0,0,0) 70%,rgba(0,0,0,0) 86%,rgba(0,0,0,0) 97%,rgba(0,0,0,1) 98%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+ }
+
+ .slider-wrapper {
+ // max-width : 1670px;
+ border-top-left-radius: 4px;
+ border-top-right-radius: 4px;
+ position: relative;
+ overflow: hidden;
+ // margin-left : -3rem;
+ // margin-right : -3rem;
+ width: 100%;
+ height: 601px;
+ max-width: 100%;
+
+ .image-gallery-thumbnails-wrapper {
+ position: absolute !important;
+ z-index: 1;
+ top: 0;
+ right: 0;
+ // right: -50px;
+ bottom: 0;
+ width: 223px;
+ display: block;
+ .image-gallery-thumbnails {
+ height: 100%;
+ padding: 0;
+
+ .image-gallery-thumbnails-container {
+ transform: none !important;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ background: #000000ad;
+
+ .image-gallery-thumbnail {
+ width: auto;
+ color: white;
+ height: calc(25% - 3rem);
+ margin: 1.5rem 1rem;
+ transition: all 200ms;
+ width: 190px;
+
+ &:first-of-type {
+ margin-top: 1rem;
+ }
+
+ &:last-of-type {
+ margin-bottom: 1rem;
+ }
+
+ &.active {
+ .thumbnail-img {
+ transform: scale(1.05);
+ }
+
+ // transform: scale(1.1);
+ // opacity : 1;
+ // .thumbnail-img {
+ // }
+ }
+
+ .slider-thumbnail {
+ height: 100%;
+ width: 100%;
+ position: relative;
+ border: 1px solid black;
+ border-radius: 4px;
+
+ .thumbnail-img {
+ height: 100%;
+ background-size: cover;
+ box-shadow: 1px 3px 4px #000000bf;
+ border-radius: 4px;
+ transition: transform 300ms;
+ }
+
+ .slide-title {
+ position: absolute;
+ top: 100%;
+ font-size: .9rem;
+ width: 100%;
+ white-space: normal;
+ line-height: 1.2;
+ text-align: right;
+ padding: .6rem 0.3rem;
+ color: #fff;
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .slider-slide {
+ .slide-img {
+ height: 601px;
+ background-size: cover;
+ background-position: center;
+ }
+
+ .slide-body {
+ position: absolute;
+ // bottom : 40%;
+ bottom: 30%;
+ max-width: 600px;
+ margin-left: 4rem;
+ color: white;
+ left: unset;
+
+ @media(max-width: 700px) {
+ margin-left: 1rem;
+ }
+
+ .slide-title {
+ font-size: 3rem;
+ font-weight: bold;
+ margin-bottom: 1rem;
+
+ @media(min-width: 700px) {
+ margin-bottom: 3rem;
+ }
+
+ line-height: 1.2;
+
+ @media(max-width: 700px) {
+ font-size: 2rem;
+ }
+ }
+
+ .slide-description {
+ font-size: 1.2rem;
+ line-height: 1.2;
+ font-weight: 200;
+
+ // opacity : 0.8;
+ @media(max-width: 700px) {
+ font-size: 1rem;
+ font-weight: 400;
+ }
+ }
+ }
+ }
+
+ }
+
+
+ .image-gallery-left-nav {
+ left: 4rem;
+ bottom: -5.5rem;
+ top: unset;
+ }
+
+ .image-gallery-right-nav {
+ left: 8rem;
+ right: unset;
+ bottom: -5.5rem;
+ top: unset;
+ }
+
+
+ .image-gallery-right-nav,
+ .image-gallery-left-nav {
+ font-size: 3rem;
+ z-index: 1 !important;
+
+ @media(max-width: 600px) {
+ bottom: 0;
+ }
+ }
+
+ .image-gallery-thumbnail.active {
+ border-color: transparent;
+ }
+
+ .editor-toolbar-wrapper {
+ position: sticky;
+ top: 80px;
+ z-index: 2;
+ }
+
+ .modal {
+ .editor-toolbar-wrapper {
+ top: 0;
+ margin-bottom: 1.5rem;
+ }
+ }
+
+ .image-gallery-slides {
+ white-space: normal !important;
+ }
+
+ .image-gallery-fullscreen-button,
+ .image-gallery-left-nav,
+ .image-gallery-play-button,
+ .image-gallery-right-nav {
+ z-index: 1;
+ }
+
\ No newline at end of file
diff --git a/theme/site/assets/fonts/Lato/Lato-Black.ttf b/theme/site/assets/fonts/Lato/Lato-Black.ttf
new file mode 100644
index 0000000..a4a924f
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-Black.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-BlackItalic.ttf b/theme/site/assets/fonts/Lato/Lato-BlackItalic.ttf
new file mode 100644
index 0000000..d6f8945
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-BlackItalic.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-Bold.ttf b/theme/site/assets/fonts/Lato/Lato-Bold.ttf
new file mode 100644
index 0000000..b63a14d
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-Bold.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-BoldItalic.ttf b/theme/site/assets/fonts/Lato/Lato-BoldItalic.ttf
new file mode 100644
index 0000000..8f9a50d
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-BoldItalic.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-Italic.ttf b/theme/site/assets/fonts/Lato/Lato-Italic.ttf
new file mode 100644
index 0000000..49e9f2c
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-Italic.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-Light.ttf b/theme/site/assets/fonts/Lato/Lato-Light.ttf
new file mode 100644
index 0000000..9c0a705
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-Light.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-LightItalic.ttf b/theme/site/assets/fonts/Lato/Lato-LightItalic.ttf
new file mode 100644
index 0000000..53b140b
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-LightItalic.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-Regular.ttf b/theme/site/assets/fonts/Lato/Lato-Regular.ttf
new file mode 100644
index 0000000..33eba8b
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-Regular.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-Thin.ttf b/theme/site/assets/fonts/Lato/Lato-Thin.ttf
new file mode 100644
index 0000000..0c599a0
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-Thin.ttf differ
diff --git a/theme/site/assets/fonts/Lato/Lato-ThinItalic.ttf b/theme/site/assets/fonts/Lato/Lato-ThinItalic.ttf
new file mode 100644
index 0000000..7db3a8c
Binary files /dev/null and b/theme/site/assets/fonts/Lato/Lato-ThinItalic.ttf differ
diff --git a/theme/site/assets/fonts/Lato/OFL.txt b/theme/site/assets/fonts/Lato/OFL.txt
new file mode 100644
index 0000000..98383e3
--- /dev/null
+++ b/theme/site/assets/fonts/Lato/OFL.txt
@@ -0,0 +1,93 @@
+Copyright (c) 2010-2014 by tyPoland Lukasz Dziedzic (team@latofonts.com) with Reserved Font Name "Lato"
+
+This Font Software is licensed under the SIL Open Font License, Version 1.1.
+This license is copied below, and is also available with a FAQ at:
+http://scripts.sil.org/OFL
+
+
+-----------------------------------------------------------
+SIL OPEN FONT LICENSE Version 1.1 - 26 February 2007
+-----------------------------------------------------------
+
+PREAMBLE
+The goals of the Open Font License (OFL) are to stimulate worldwide
+development of collaborative font projects, to support the font creation
+efforts of academic and linguistic communities, and to provide a free and
+open framework in which fonts may be shared and improved in partnership
+with others.
+
+The OFL allows the licensed fonts to be used, studied, modified and
+redistributed freely as long as they are not sold by themselves. The
+fonts, including any derivative works, can be bundled, embedded,
+redistributed and/or sold with any software provided that any reserved
+names are not used by derivative works. The fonts and derivatives,
+however, cannot be released under any other type of license. The
+requirement for fonts to remain under this license does not apply
+to any document created using the fonts or their derivatives.
+
+DEFINITIONS
+"Font Software" refers to the set of files released by the Copyright
+Holder(s) under this license and clearly marked as such. This may
+include source files, build scripts and documentation.
+
+"Reserved Font Name" refers to any names specified as such after the
+copyright statement(s).
+
+"Original Version" refers to the collection of Font Software components as
+distributed by the Copyright Holder(s).
+
+"Modified Version" refers to any derivative made by adding to, deleting,
+or substituting -- in part or in whole -- any of the components of the
+Original Version, by changing formats or by porting the Font Software to a
+new environment.
+
+"Author" refers to any designer, engineer, programmer, technical
+writer or other person who contributed to the Font Software.
+
+PERMISSION & CONDITIONS
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of the Font Software, to use, study, copy, merge, embed, modify,
+redistribute, and sell modified and unmodified copies of the Font
+Software, subject to the following conditions:
+
+1) Neither the Font Software nor any of its individual components,
+in Original or Modified Versions, may be sold by itself.
+
+2) Original or Modified Versions of the Font Software may be bundled,
+redistributed and/or sold with any software, provided that each copy
+contains the above copyright notice and this license. These can be
+included either as stand-alone text files, human-readable headers or
+in the appropriate machine-readable metadata fields within text or
+binary files as long as those fields can be easily viewed by the user.
+
+3) No Modified Version of the Font Software may use the Reserved Font
+Name(s) unless explicit written permission is granted by the corresponding
+Copyright Holder. This restriction only applies to the primary font name as
+presented to the users.
+
+4) The name(s) of the Copyright Holder(s) or the Author(s) of the Font
+Software shall not be used to promote, endorse or advertise any
+Modified Version, except to acknowledge the contribution(s) of the
+Copyright Holder(s) and the Author(s) or with their explicit written
+permission.
+
+5) The Font Software, modified or unmodified, in part or in whole,
+must be distributed entirely under this license, and must not be
+distributed under any other license. The requirement for fonts to
+remain under this license does not apply to any document created
+using the Font Software.
+
+TERMINATION
+This license becomes null and void if any of the above conditions are
+not met.
+
+DISCLAIMER
+THE FONT SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO ANY WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT
+OF COPYRIGHT, PATENT, TRADEMARK, OR OTHER RIGHT. IN NO EVENT SHALL THE
+COPYRIGHT HOLDER BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY,
+INCLUDING ANY GENERAL, SPECIAL, INDIRECT, INCIDENTAL, OR CONSEQUENTIAL
+DAMAGES, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING
+FROM, OUT OF THE USE OR INABILITY TO USE THE FONT SOFTWARE OR FROM
+OTHER DEALINGS IN THE FONT SOFTWARE.
diff --git a/theme/site/assets/fonts/Roboto/LICENSE.txt b/theme/site/assets/fonts/Roboto/LICENSE.txt
new file mode 100644
index 0000000..d645695
--- /dev/null
+++ b/theme/site/assets/fonts/Roboto/LICENSE.txt
@@ -0,0 +1,202 @@
+
+ Apache License
+ Version 2.0, January 2004
+ http://www.apache.org/licenses/
+
+ TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+ 1. Definitions.
+
+ "License" shall mean the terms and conditions for use, reproduction,
+ and distribution as defined by Sections 1 through 9 of this document.
+
+ "Licensor" shall mean the copyright owner or entity authorized by
+ the copyright owner that is granting the License.
+
+ "Legal Entity" shall mean the union of the acting entity and all
+ other entities that control, are controlled by, or are under common
+ control with that entity. For the purposes of this definition,
+ "control" means (i) the power, direct or indirect, to cause the
+ direction or management of such entity, whether by contract or
+ otherwise, or (ii) ownership of fifty percent (50%) or more of the
+ outstanding shares, or (iii) beneficial ownership of such entity.
+
+ "You" (or "Your") shall mean an individual or Legal Entity
+ exercising permissions granted by this License.
+
+ "Source" form shall mean the preferred form for making modifications,
+ including but not limited to software source code, documentation
+ source, and configuration files.
+
+ "Object" form shall mean any form resulting from mechanical
+ transformation or translation of a Source form, including but
+ not limited to compiled object code, generated documentation,
+ and conversions to other media types.
+
+ "Work" shall mean the work of authorship, whether in Source or
+ Object form, made available under the License, as indicated by a
+ copyright notice that is included in or attached to the work
+ (an example is provided in the Appendix below).
+
+ "Derivative Works" shall mean any work, whether in Source or Object
+ form, that is based on (or derived from) the Work and for which the
+ editorial revisions, annotations, elaborations, or other modifications
+ represent, as a whole, an original work of authorship. For the purposes
+ of this License, Derivative Works shall not include works that remain
+ separable from, or merely link (or bind by name) to the interfaces of,
+ the Work and Derivative Works thereof.
+
+ "Contribution" shall mean any work of authorship, including
+ the original version of the Work and any modifications or additions
+ to that Work or Derivative Works thereof, that is intentionally
+ submitted to Licensor for inclusion in the Work by the copyright owner
+ or by an individual or Legal Entity authorized to submit on behalf of
+ the copyright owner. For the purposes of this definition, "submitted"
+ means any form of electronic, verbal, or written communication sent
+ to the Licensor or its representatives, including but not limited to
+ communication on electronic mailing lists, source code control systems,
+ and issue tracking systems that are managed by, or on behalf of, the
+ Licensor for the purpose of discussing and improving the Work, but
+ excluding communication that is conspicuously marked or otherwise
+ designated in writing by the copyright owner as "Not a Contribution."
+
+ "Contributor" shall mean Licensor and any individual or Legal Entity
+ on behalf of whom a Contribution has been received by Licensor and
+ subsequently incorporated within the Work.
+
+ 2. Grant of Copyright License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ copyright license to reproduce, prepare Derivative Works of,
+ publicly display, publicly perform, sublicense, and distribute the
+ Work and such Derivative Works in Source or Object form.
+
+ 3. Grant of Patent License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ (except as stated in this section) patent license to make, have made,
+ use, offer to sell, sell, import, and otherwise transfer the Work,
+ where such license applies only to those patent claims licensable
+ by such Contributor that are necessarily infringed by their
+ Contribution(s) alone or by combination of their Contribution(s)
+ with the Work to which such Contribution(s) was submitted. If You
+ institute patent litigation against any entity (including a
+ cross-claim or counterclaim in a lawsuit) alleging that the Work
+ or a Contribution incorporated within the Work constitutes direct
+ or contributory patent infringement, then any patent licenses
+ granted to You under this License for that Work shall terminate
+ as of the date such litigation is filed.
+
+ 4. Redistribution. You may reproduce and distribute copies of the
+ Work or Derivative Works thereof in any medium, with or without
+ modifications, and in Source or Object form, provided that You
+ meet the following conditions:
+
+ (a) You must give any other recipients of the Work or
+ Derivative Works a copy of this License; and
+
+ (b) You must cause any modified files to carry prominent notices
+ stating that You changed the files; and
+
+ (c) You must retain, in the Source form of any Derivative Works
+ that You distribute, all copyright, patent, trademark, and
+ attribution notices from the Source form of the Work,
+ excluding those notices that do not pertain to any part of
+ the Derivative Works; and
+
+ (d) If the Work includes a "NOTICE" text file as part of its
+ distribution, then any Derivative Works that You distribute must
+ include a readable copy of the attribution notices contained
+ within such NOTICE file, excluding those notices that do not
+ pertain to any part of the Derivative Works, in at least one
+ of the following places: within a NOTICE text file distributed
+ as part of the Derivative Works; within the Source form or
+ documentation, if provided along with the Derivative Works; or,
+ within a display generated by the Derivative Works, if and
+ wherever such third-party notices normally appear. The contents
+ of the NOTICE file are for informational purposes only and
+ do not modify the License. You may add Your own attribution
+ notices within Derivative Works that You distribute, alongside
+ or as an addendum to the NOTICE text from the Work, provided
+ that such additional attribution notices cannot be construed
+ as modifying the License.
+
+ You may add Your own copyright statement to Your modifications and
+ may provide additional or different license terms and conditions
+ for use, reproduction, or distribution of Your modifications, or
+ for any such Derivative Works as a whole, provided Your use,
+ reproduction, and distribution of the Work otherwise complies with
+ the conditions stated in this License.
+
+ 5. Submission of Contributions. Unless You explicitly state otherwise,
+ any Contribution intentionally submitted for inclusion in the Work
+ by You to the Licensor shall be under the terms and conditions of
+ this License, without any additional terms or conditions.
+ Notwithstanding the above, nothing herein shall supersede or modify
+ the terms of any separate license agreement you may have executed
+ with Licensor regarding such Contributions.
+
+ 6. Trademarks. This License does not grant permission to use the trade
+ names, trademarks, service marks, or product names of the Licensor,
+ except as required for reasonable and customary use in describing the
+ origin of the Work and reproducing the content of the NOTICE file.
+
+ 7. Disclaimer of Warranty. Unless required by applicable law or
+ agreed to in writing, Licensor provides the Work (and each
+ Contributor provides its Contributions) on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+ implied, including, without limitation, any warranties or conditions
+ of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+ PARTICULAR PURPOSE. You are solely responsible for determining the
+ appropriateness of using or redistributing the Work and assume any
+ risks associated with Your exercise of permissions under this License.
+
+ 8. Limitation of Liability. In no event and under no legal theory,
+ whether in tort (including negligence), contract, or otherwise,
+ unless required by applicable law (such as deliberate and grossly
+ negligent acts) or agreed to in writing, shall any Contributor be
+ liable to You for damages, including any direct, indirect, special,
+ incidental, or consequential damages of any character arising as a
+ result of this License or out of the use or inability to use the
+ Work (including but not limited to damages for loss of goodwill,
+ work stoppage, computer failure or malfunction, or any and all
+ other commercial damages or losses), even if such Contributor
+ has been advised of the possibility of such damages.
+
+ 9. Accepting Warranty or Additional Liability. While redistributing
+ the Work or Derivative Works thereof, You may choose to offer,
+ and charge a fee for, acceptance of support, warranty, indemnity,
+ or other liability obligations and/or rights consistent with this
+ License. However, in accepting such obligations, You may act only
+ on Your own behalf and on Your sole responsibility, not on behalf
+ of any other Contributor, and only if You agree to indemnify,
+ defend, and hold each Contributor harmless for any liability
+ incurred by, or claims asserted against, such Contributor by reason
+ of your accepting any such warranty or additional liability.
+
+ END OF TERMS AND CONDITIONS
+
+ APPENDIX: How to apply the Apache License to your work.
+
+ To apply the Apache License to your work, attach the following
+ boilerplate notice, with the fields enclosed by brackets "[]"
+ replaced with your own identifying information. (Don't include
+ the brackets!) The text should be enclosed in the appropriate
+ comment syntax for the file format. We also recommend that a
+ file or class name and description of purpose be included on the
+ same "printed page" as the copyright notice for easier
+ identification within third-party archives.
+
+ Copyright [yyyy] [name of copyright owner]
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
diff --git a/theme/site/assets/fonts/Roboto/Roboto-Black.ttf b/theme/site/assets/fonts/Roboto/Roboto-Black.ttf
new file mode 100644
index 0000000..2d45238
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-Black.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-BlackItalic.ttf b/theme/site/assets/fonts/Roboto/Roboto-BlackItalic.ttf
new file mode 100644
index 0000000..29a4359
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-BlackItalic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-Bold.ttf b/theme/site/assets/fonts/Roboto/Roboto-Bold.ttf
new file mode 100644
index 0000000..d998cf5
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-Bold.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-BoldItalic.ttf b/theme/site/assets/fonts/Roboto/Roboto-BoldItalic.ttf
new file mode 100644
index 0000000..b4e2210
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-BoldItalic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-Italic.ttf b/theme/site/assets/fonts/Roboto/Roboto-Italic.ttf
new file mode 100644
index 0000000..5b390ff
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-Italic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-Light.ttf b/theme/site/assets/fonts/Roboto/Roboto-Light.ttf
new file mode 100644
index 0000000..3526798
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-Light.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-LightItalic.ttf b/theme/site/assets/fonts/Roboto/Roboto-LightItalic.ttf
new file mode 100644
index 0000000..46e9bf7
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-LightItalic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-Medium.ttf b/theme/site/assets/fonts/Roboto/Roboto-Medium.ttf
new file mode 100644
index 0000000..f714a51
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-Medium.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-MediumItalic.ttf b/theme/site/assets/fonts/Roboto/Roboto-MediumItalic.ttf
new file mode 100644
index 0000000..5dc6a2d
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-MediumItalic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-Regular.ttf b/theme/site/assets/fonts/Roboto/Roboto-Regular.ttf
new file mode 100644
index 0000000..2b6392f
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-Regular.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-Thin.ttf b/theme/site/assets/fonts/Roboto/Roboto-Thin.ttf
new file mode 100644
index 0000000..4e797cf
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-Thin.ttf differ
diff --git a/theme/site/assets/fonts/Roboto/Roboto-ThinItalic.ttf b/theme/site/assets/fonts/Roboto/Roboto-ThinItalic.ttf
new file mode 100644
index 0000000..eea836f
Binary files /dev/null and b/theme/site/assets/fonts/Roboto/Roboto-ThinItalic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto_Condensed/LICENSE.txt b/theme/site/assets/fonts/Roboto_Condensed/LICENSE.txt
new file mode 100644
index 0000000..d645695
--- /dev/null
+++ b/theme/site/assets/fonts/Roboto_Condensed/LICENSE.txt
@@ -0,0 +1,202 @@
+
+ Apache License
+ Version 2.0, January 2004
+ http://www.apache.org/licenses/
+
+ TERMS AND CONDITIONS FOR USE, REPRODUCTION, AND DISTRIBUTION
+
+ 1. Definitions.
+
+ "License" shall mean the terms and conditions for use, reproduction,
+ and distribution as defined by Sections 1 through 9 of this document.
+
+ "Licensor" shall mean the copyright owner or entity authorized by
+ the copyright owner that is granting the License.
+
+ "Legal Entity" shall mean the union of the acting entity and all
+ other entities that control, are controlled by, or are under common
+ control with that entity. For the purposes of this definition,
+ "control" means (i) the power, direct or indirect, to cause the
+ direction or management of such entity, whether by contract or
+ otherwise, or (ii) ownership of fifty percent (50%) or more of the
+ outstanding shares, or (iii) beneficial ownership of such entity.
+
+ "You" (or "Your") shall mean an individual or Legal Entity
+ exercising permissions granted by this License.
+
+ "Source" form shall mean the preferred form for making modifications,
+ including but not limited to software source code, documentation
+ source, and configuration files.
+
+ "Object" form shall mean any form resulting from mechanical
+ transformation or translation of a Source form, including but
+ not limited to compiled object code, generated documentation,
+ and conversions to other media types.
+
+ "Work" shall mean the work of authorship, whether in Source or
+ Object form, made available under the License, as indicated by a
+ copyright notice that is included in or attached to the work
+ (an example is provided in the Appendix below).
+
+ "Derivative Works" shall mean any work, whether in Source or Object
+ form, that is based on (or derived from) the Work and for which the
+ editorial revisions, annotations, elaborations, or other modifications
+ represent, as a whole, an original work of authorship. For the purposes
+ of this License, Derivative Works shall not include works that remain
+ separable from, or merely link (or bind by name) to the interfaces of,
+ the Work and Derivative Works thereof.
+
+ "Contribution" shall mean any work of authorship, including
+ the original version of the Work and any modifications or additions
+ to that Work or Derivative Works thereof, that is intentionally
+ submitted to Licensor for inclusion in the Work by the copyright owner
+ or by an individual or Legal Entity authorized to submit on behalf of
+ the copyright owner. For the purposes of this definition, "submitted"
+ means any form of electronic, verbal, or written communication sent
+ to the Licensor or its representatives, including but not limited to
+ communication on electronic mailing lists, source code control systems,
+ and issue tracking systems that are managed by, or on behalf of, the
+ Licensor for the purpose of discussing and improving the Work, but
+ excluding communication that is conspicuously marked or otherwise
+ designated in writing by the copyright owner as "Not a Contribution."
+
+ "Contributor" shall mean Licensor and any individual or Legal Entity
+ on behalf of whom a Contribution has been received by Licensor and
+ subsequently incorporated within the Work.
+
+ 2. Grant of Copyright License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ copyright license to reproduce, prepare Derivative Works of,
+ publicly display, publicly perform, sublicense, and distribute the
+ Work and such Derivative Works in Source or Object form.
+
+ 3. Grant of Patent License. Subject to the terms and conditions of
+ this License, each Contributor hereby grants to You a perpetual,
+ worldwide, non-exclusive, no-charge, royalty-free, irrevocable
+ (except as stated in this section) patent license to make, have made,
+ use, offer to sell, sell, import, and otherwise transfer the Work,
+ where such license applies only to those patent claims licensable
+ by such Contributor that are necessarily infringed by their
+ Contribution(s) alone or by combination of their Contribution(s)
+ with the Work to which such Contribution(s) was submitted. If You
+ institute patent litigation against any entity (including a
+ cross-claim or counterclaim in a lawsuit) alleging that the Work
+ or a Contribution incorporated within the Work constitutes direct
+ or contributory patent infringement, then any patent licenses
+ granted to You under this License for that Work shall terminate
+ as of the date such litigation is filed.
+
+ 4. Redistribution. You may reproduce and distribute copies of the
+ Work or Derivative Works thereof in any medium, with or without
+ modifications, and in Source or Object form, provided that You
+ meet the following conditions:
+
+ (a) You must give any other recipients of the Work or
+ Derivative Works a copy of this License; and
+
+ (b) You must cause any modified files to carry prominent notices
+ stating that You changed the files; and
+
+ (c) You must retain, in the Source form of any Derivative Works
+ that You distribute, all copyright, patent, trademark, and
+ attribution notices from the Source form of the Work,
+ excluding those notices that do not pertain to any part of
+ the Derivative Works; and
+
+ (d) If the Work includes a "NOTICE" text file as part of its
+ distribution, then any Derivative Works that You distribute must
+ include a readable copy of the attribution notices contained
+ within such NOTICE file, excluding those notices that do not
+ pertain to any part of the Derivative Works, in at least one
+ of the following places: within a NOTICE text file distributed
+ as part of the Derivative Works; within the Source form or
+ documentation, if provided along with the Derivative Works; or,
+ within a display generated by the Derivative Works, if and
+ wherever such third-party notices normally appear. The contents
+ of the NOTICE file are for informational purposes only and
+ do not modify the License. You may add Your own attribution
+ notices within Derivative Works that You distribute, alongside
+ or as an addendum to the NOTICE text from the Work, provided
+ that such additional attribution notices cannot be construed
+ as modifying the License.
+
+ You may add Your own copyright statement to Your modifications and
+ may provide additional or different license terms and conditions
+ for use, reproduction, or distribution of Your modifications, or
+ for any such Derivative Works as a whole, provided Your use,
+ reproduction, and distribution of the Work otherwise complies with
+ the conditions stated in this License.
+
+ 5. Submission of Contributions. Unless You explicitly state otherwise,
+ any Contribution intentionally submitted for inclusion in the Work
+ by You to the Licensor shall be under the terms and conditions of
+ this License, without any additional terms or conditions.
+ Notwithstanding the above, nothing herein shall supersede or modify
+ the terms of any separate license agreement you may have executed
+ with Licensor regarding such Contributions.
+
+ 6. Trademarks. This License does not grant permission to use the trade
+ names, trademarks, service marks, or product names of the Licensor,
+ except as required for reasonable and customary use in describing the
+ origin of the Work and reproducing the content of the NOTICE file.
+
+ 7. Disclaimer of Warranty. Unless required by applicable law or
+ agreed to in writing, Licensor provides the Work (and each
+ Contributor provides its Contributions) on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or
+ implied, including, without limitation, any warranties or conditions
+ of TITLE, NON-INFRINGEMENT, MERCHANTABILITY, or FITNESS FOR A
+ PARTICULAR PURPOSE. You are solely responsible for determining the
+ appropriateness of using or redistributing the Work and assume any
+ risks associated with Your exercise of permissions under this License.
+
+ 8. Limitation of Liability. In no event and under no legal theory,
+ whether in tort (including negligence), contract, or otherwise,
+ unless required by applicable law (such as deliberate and grossly
+ negligent acts) or agreed to in writing, shall any Contributor be
+ liable to You for damages, including any direct, indirect, special,
+ incidental, or consequential damages of any character arising as a
+ result of this License or out of the use or inability to use the
+ Work (including but not limited to damages for loss of goodwill,
+ work stoppage, computer failure or malfunction, or any and all
+ other commercial damages or losses), even if such Contributor
+ has been advised of the possibility of such damages.
+
+ 9. Accepting Warranty or Additional Liability. While redistributing
+ the Work or Derivative Works thereof, You may choose to offer,
+ and charge a fee for, acceptance of support, warranty, indemnity,
+ or other liability obligations and/or rights consistent with this
+ License. However, in accepting such obligations, You may act only
+ on Your own behalf and on Your sole responsibility, not on behalf
+ of any other Contributor, and only if You agree to indemnify,
+ defend, and hold each Contributor harmless for any liability
+ incurred by, or claims asserted against, such Contributor by reason
+ of your accepting any such warranty or additional liability.
+
+ END OF TERMS AND CONDITIONS
+
+ APPENDIX: How to apply the Apache License to your work.
+
+ To apply the Apache License to your work, attach the following
+ boilerplate notice, with the fields enclosed by brackets "[]"
+ replaced with your own identifying information. (Don't include
+ the brackets!) The text should be enclosed in the appropriate
+ comment syntax for the file format. We also recommend that a
+ file or class name and description of purpose be included on the
+ same "printed page" as the copyright notice for easier
+ identification within third-party archives.
+
+ Copyright [yyyy] [name of copyright owner]
+
+ Licensed under the Apache License, Version 2.0 (the "License");
+ you may not use this file except in compliance with the License.
+ You may obtain a copy of the License at
+
+ http://www.apache.org/licenses/LICENSE-2.0
+
+ Unless required by applicable law or agreed to in writing, software
+ distributed under the License is distributed on an "AS IS" BASIS,
+ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ See the License for the specific language governing permissions and
+ limitations under the License.
diff --git a/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf
new file mode 100644
index 0000000..7fe3128
Binary files /dev/null and b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Bold.ttf differ
diff --git a/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-BoldItalic.ttf b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-BoldItalic.ttf
new file mode 100644
index 0000000..52ef6f3
Binary files /dev/null and b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-BoldItalic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Italic.ttf b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Italic.ttf
new file mode 100644
index 0000000..12216d6
Binary files /dev/null and b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Italic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Light.ttf b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Light.ttf
new file mode 100644
index 0000000..43dd8f4
Binary files /dev/null and b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Light.ttf differ
diff --git a/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-LightItalic.ttf b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-LightItalic.ttf
new file mode 100644
index 0000000..99d491b
Binary files /dev/null and b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-LightItalic.ttf differ
diff --git a/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf
new file mode 100644
index 0000000..62dd61e
Binary files /dev/null and b/theme/site/assets/fonts/Roboto_Condensed/RobotoCondensed-Regular.ttf differ
diff --git a/theme/site/assets/fonts/icons.eot b/theme/site/assets/fonts/icons.eot
new file mode 100644
index 0000000..8057c05
Binary files /dev/null and b/theme/site/assets/fonts/icons.eot differ
diff --git a/theme/site/assets/fonts/icons.svg b/theme/site/assets/fonts/icons.svg
new file mode 100644
index 0000000..308bf5a
--- /dev/null
+++ b/theme/site/assets/fonts/icons.svg
@@ -0,0 +1,320 @@
+
+
+
\ No newline at end of file
diff --git a/theme/site/assets/fonts/icons.ttf b/theme/site/assets/fonts/icons.ttf
new file mode 100644
index 0000000..2224f26
Binary files /dev/null and b/theme/site/assets/fonts/icons.ttf differ
diff --git a/theme/site/assets/fonts/icons.woff b/theme/site/assets/fonts/icons.woff
new file mode 100644
index 0000000..c4cec06
Binary files /dev/null and b/theme/site/assets/fonts/icons.woff differ
diff --git a/theme/site/assets/images/flags.png b/theme/site/assets/images/flags.png
new file mode 100644
index 0000000..cdd33c3
Binary files /dev/null and b/theme/site/assets/images/flags.png differ
diff --git a/theme/site/collections/breadcrumb.overrides b/theme/site/collections/breadcrumb.overrides
new file mode 100644
index 0000000..f124ffd
--- /dev/null
+++ b/theme/site/collections/breadcrumb.overrides
@@ -0,0 +1,44 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.breadcrumb {
+ display : flex;
+ align-items : center;
+ padding-right: 1rem;
+ padding-left : 1rem;
+
+ .home.icon {
+ margin-right: 0;
+ }
+
+ @media only screen and (min-width: @tabletBreakpoint) {
+ padding-right: 0;
+ padding-left : 0;
+ }
+}
+
+body .ui.vertical.segment.breadcrumbs:not(aside .ui.vertical.segment.breadcrumbs ) {
+ background : none;
+ padding : 0;
+ border-bottom : none;
+ position : absolute !important;
+ z-index : 1;
+ border-top-left-radius: 1rem;
+ top : 0;
+ overflow : hidden;
+
+ .ui.container {
+ padding: 0;
+ }
+
+ .breadcrumb {
+ background: black;
+ padding : 5px;
+ display : inline-flex;
+ }
+
+ .ui.breadcrumb .section {
+ color: white;
+ }
+}
\ No newline at end of file
diff --git a/theme/site/collections/breadcrumb.variables b/theme/site/collections/breadcrumb.variables
new file mode 100644
index 0000000..c1345af
--- /dev/null
+++ b/theme/site/collections/breadcrumb.variables
@@ -0,0 +1,22 @@
+/*******************************
+ Breadcrumb
+*******************************/
+
+/*-------------------
+ Breadcrumb
+--------------------*/
+
+// Pastanaga custom variable
+@breadcrumb-bg: @tealBackground;
+
+@dividerSpacing: @10px;
+@dividerColor : @teal;
+
+/* Coupling */
+
+
+/*-------------------
+ States
+--------------------*/
+
+@activeFontWeight: @normal;
\ No newline at end of file
diff --git a/theme/site/collections/form.overrides b/theme/site/collections/form.overrides
new file mode 100644
index 0000000..67cef9c
--- /dev/null
+++ b/theme/site/collections/form.overrides
@@ -0,0 +1,104 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.form .inline.field {
+ margin: 0;
+}
+
+.ui.form .inline.field.help .wrapper {
+ border-bottom: none;
+}
+
+.ui.form .inline.field.help {
+ padding-bottom: @15px;
+}
+
+.ui.form .inline.field .help {
+ padding-top: @10px;
+ padding-bottom: @10px;
+ border-bottom: 1px solid @lightGreyBorderColor;
+}
+
+.ui.form p.help {
+ color: #878f93;
+ font-size: @13px;
+ font-weight: 300;
+ line-height: initial;
+}
+
+.ui.form .ui.input input:not([type]),
+.ui.form .ui.input input[type='date'],
+.ui.form .ui.input input[type='datetime-local'],
+.ui.form .ui.input input[type='email'],
+.ui.form .ui.input input[type='number'],
+.ui.form .ui.input input[type='password'],
+.ui.form .ui.input input[type='search'],
+.ui.form .ui.input input[type='tel'],
+.ui.form .ui.input input[type='time'],
+.ui.form .ui.input input[type='text'],
+.ui.form .ui.input input[type='file'],
+.ui.form .ui.input input[type='url'],
+.ui.form textarea {
+ height: 60px;
+ border-width: 0 0 @1px 0;
+ border-radius: 0;
+
+ &:focus {
+ border-radius: 0;
+ }
+}
+
+.ui.form .field > .selection.dropdown {
+ height: 60px;
+}
+
+.ui.form .DraftEditor-root {
+ border-bottom: @inputBorder;
+}
+
+// From the original, due to the wrapper around label
+.ui.form .field .wrapper > label {
+ display: block;
+ margin: @labelMargin;
+ color: @labelColor;
+ font-size: @labelFontSize;
+ font-weight: @labelFontWeight;
+ text-transform: @labelTextTransform;
+}
+
+.ui.form .toolbar {
+ position: absolute;
+ z-index: 1;
+ top: 0;
+ right: 0;
+ display: flex;
+ height: 60px;
+ align-items: center;
+ margin-right: 1rem;
+
+ .item {
+ cursor: pointer;
+ }
+}
+
+.ui.form .field .ui.basic.button.delete-button {
+ padding: 0;
+ margin-left: 10px;
+ border: none;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+
+ &:hover,
+ &:focus {
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #e40166 !important;
+ }
+}
+
+
+// .ui.modal {
+// transform: none;
+// transform-origin: unset;
+// }
\ No newline at end of file
diff --git a/theme/site/collections/form.variables b/theme/site/collections/form.variables
new file mode 100644
index 0000000..2085b41
--- /dev/null
+++ b/theme/site/collections/form.variables
@@ -0,0 +1,79 @@
+/*******************************
+ Form
+*******************************/
+
+/*-------------------
+ Elements
+--------------------*/
+
+/* Form */
+
+/* Text */
+
+/* Field */
+
+/* Fields */
+
+/* Form Label */
+@labelFontSize: @14px;
+@labelFontWeight: 500;
+
+/* Input */
+
+/* Select */
+
+/* Text Area */
+
+/* Checkbox */
+
+/* Inline Validation Prompt */
+
+/*-------------------
+ States
+--------------------*/
+
+/* Focus */
+
+/* Input Focus */
+
+/* Text Area Focus */
+
+/* Disabled */
+
+/* Errored Input */
+
+/* AutoFill */
+
+/* Input Error */
+
+/* Dropdown Error */
+
+/* Focused Error */
+
+/* Placeholder Error */
+
+/* Loading Dimmer */
+
+/* Loading Spinner */
+
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Required */
+
+/* Inverted */
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Grouped Fields */
+
+/* Inline */
+
+/*-------------------
+ Groups
+--------------------*/
diff --git a/theme/site/collections/grid.overrides b/theme/site/collections/grid.overrides
new file mode 100644
index 0000000..209d6f5
--- /dev/null
+++ b/theme/site/collections/grid.overrides
@@ -0,0 +1,136 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.grid > .header.row {
+ padding-bottom: 0;
+}
+
+.ui.form .ui.grid > .row {
+ padding: 0;
+}
+/*******************************
+ Theme Overrides
+*******************************/
+.ui.grid > .header.row {
+ padding-bottom: 0;
+}
+
+.ui.form .ui.grid > .row {
+ padding: 0;
+}
+// lg: 1549, md: 1086, sm: 718
+
+
+@tablet-breakpoint: 1086px;
+@phone-breakpoint: 718px;
+@desktop-breakpoint: 1549px;
+
+// @tablet-query: min-width
+
+// .getQueryMax(@breakpoint) {
+// [max-width~=@breakpoint]
+// }
+
+.centered {
+ justify-content: center !important;
+}
+
+.reverse {
+ flex-flow: row-reverse wrap !important;
+}
+
+.vertically-aligned {
+ height: 100%;
+ align-items: center !important;
+}
+
+.element-grid {
+ display: flex;
+ flex-flow: row wrap;
+ justify-content: inherit;
+ align-items: flex-start;
+ width: 100% !important;
+ padding: 0rem;
+ // height: 100%;
+}
+
+.flex-size(@col) {
+ // flex-basis: calc(100% / (12 / @col));
+ width: 100% / (12 / @col);
+}
+
+
+.viewport-columns(@screen-type) {
+ .@{screen-type}-one {
+ .flex-size(1);
+ }
+
+ .@{screen-type}-two {
+ .flex-size(2);
+ }
+
+ .@{screen-type}-three {
+ .flex-size(3);
+ }
+
+ .@{screen-type}-four {
+ .flex-size(4);
+ }
+
+ .@{screen-type}-five {
+ .flex-size(5);
+ }
+
+ .@{screen-type}-six {
+ .flex-size(6);
+ }
+
+ .@{screen-type}-seven {
+ .flex-size(7);
+ }
+
+ .@{screen-type}-eight {
+ .flex-size(8);
+ }
+
+ .@{screen-type}-nine {
+ .flex-size(9);
+ }
+
+ .@{screen-type}-ten {
+ .flex-size(10);
+ }
+
+ .@{screen-type}-eleven {
+ .flex-size(11);
+ }
+
+ .@{screen-type}-twelve {
+ .flex-size(12);
+ }
+}
+
+
+[class*='desktop-'], [class*='tablet-'], [class*='phone-'], [class*="widescreen-"] {
+ margin: 0;
+}
+
+// @media (min-width: @tablet-breakpoint) {
+ .viewport-columns(widescreen);
+ .viewport-columns(desktop);
+ .viewport-columns(tablet);
+ .viewport-columns(phone);
+// }
+
+
+// @media (max-width: @tablet-breakpoint) {
+// }
+
+
+// [max-width~=@phone-breakpoint] {
+// }
+
+// @media (min-width: @desktop-breakpoins) {
+ // .viewport-columns(desktop);
+// }
diff --git a/theme/site/collections/grid.variables b/theme/site/collections/grid.variables
new file mode 100644
index 0000000..c1f7771
--- /dev/null
+++ b/theme/site/collections/grid.variables
@@ -0,0 +1,103 @@
+/*******************************
+ Grid
+*******************************/
+
+/* Inherited From Site */
+
+// @mobileBreakpoint
+// @tabletBreakpoint
+// @computerBreakpoint
+// @largeMonitorBreakpoint
+// @widescreenMonitorBreakpoint
+
+/*******************************
+ Grid
+*******************************/
+
+@minWidth: 320px;
+
+@gutterWidth: 2rem;
+@rowSpacing : 2rem;
+
+@tableWidth : ~"calc(100% + "@gutterWidth~")";
+@columnMaxImageWidth: 100%;
+
+@consecutiveGridDistance: (@rowSpacing / 2);
+
+/*******************************
+ Variations
+*******************************/
+
+/*--------------
+ Relaxed
+---------------*/
+
+@relaxedGutterWidth : 3rem;
+@veryRelaxedGutterWidth: 5rem;
+
+/*--------------
+ Divided
+---------------*/
+
+@dividedBorder : -1px 0px 0px 0px @borderColor;
+@verticallyDividedBorder: 0px -1px 0px 0px @borderColor;
+
+@dividedInvertedBorder : -1px 0px 0px 0px @whiteBorderColor;
+@verticallyDividedInvertedBorder: 0px -1px 0px 0px @whiteBorderColor;
+
+/*--------------
+ Celled
+---------------*/
+
+@celledMargin : 1em 0em;
+@celledWidth : 1px;
+@celledBorderColor: @solidBorderColor;
+
+@celledPadding : 1em;
+@celledRelaxedPadding : 1.5em;
+@celledVeryRelaxedPadding: 2em;
+
+@celledGridDivider : 0px 0px 0px @celledWidth @celledBorderColor;
+@celledRowDivider : 0px (-@celledWidth) 0px 0px @celledBorderColor;
+@celledColumnDivider: (-@celledWidth) 0px 0px 0px @celledBorderColor;
+
+
+/*--------------
+ Stackable
+---------------*/
+
+@stackableRowSpacing : @rowSpacing;
+@stackableGutter : @gutterWidth;
+@stackableMobileBorder : 1px solid @borderColor;
+@stackableInvertedMobileBorder: 1px solid @whiteBorderColor;
+
+
+/*******************************
+ Legacy
+*******************************/
+
+/*--------------
+ Page
+---------------*/
+
+/* Legacy (DO NOT USE)
+ */
+@mobileWidth : auto;
+@mobileMargin: 0em;
+@mobileGutter: 0em;
+
+@tabletWidth : auto;
+@tabletMargin: 0em;
+@tabletGutter: 2em;
+
+@computerWidth : auto;
+@computerMargin: 0em;
+@computerGutter: 3%;
+
+@largeMonitorWidth : auto;
+@largeMonitorMargin: 0em;
+@largeMonitorGutter: 15%;
+
+@widescreenMonitorWidth: auto;
+@widescreenMargin: 0em;
+@widescreenMonitorGutter: 23%;
\ No newline at end of file
diff --git a/theme/site/collections/menu.overrides b/theme/site/collections/menu.overrides
new file mode 100644
index 0000000..45cd772
--- /dev/null
+++ b/theme/site/collections/menu.overrides
@@ -0,0 +1,585 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+@menuColor : #564535;
+@hoverColor : #CA4300;
+@stickyMenuColor: #F1F0EE;
+
+.ui.menu {
+ font-family: @headerFont;
+ transition : none;
+}
+
+.navigation .menu .item {
+ text-transform: none !important;
+ font-size : 1rem;
+}
+
+.navigation .menu .firstLevel {
+ color : @menuColor;
+ font-weight: 700;
+ line-height: 21px;
+ padding : 1.7em 0 1.375em;
+}
+
+.ui.secondary.pointing.menu {
+ border-bottom: none !important;
+}
+
+.navigation .ui.secondary.pointing.menu>.item.dropdown {
+ position: relative;
+
+ .firstLevel:not(.item) {
+ padding: 0;
+ }
+
+ // &:not(a) {
+ // padding: 0;
+ // }
+}
+
+.navigation {
+ .ui.secondary.pointing.menu .item {
+ transition : none !important;
+ border-bottom: none;
+ }
+
+ .menu {
+ transition: none !important;
+
+ .firstLevel {
+ font-size : 18px !important;
+ line-height: 1;
+ border : 1px solid transparent;
+ // .firstLevel-title {
+ // @media(max-width:1200px) {
+ // padding-bottom: 1rem;
+ // }
+ // }
+
+ @media(max-width:1200px) {
+ border-color : transparent !important;
+ border-radius: 0 !important;
+
+ .firstLevel-title {
+ padding : 1rem;
+ margin-left : -1rem;
+ margin-top : -1rem;
+ margin-bottom: -1rem;
+ margin-right : -1rem;
+ width : calc(100% + 2rem);
+ }
+
+ &.dropdown {
+ overflow : hidden;
+ border : none !important;
+ box-shadow: none !important;
+
+ >.menu {
+ border : none !important;
+ margin-top : 1rem !important;
+ width : calc(100% + 3rem) !important;
+ border-top : 1px solid #eee !important;
+ border-bottom: 1px solid #eee !important;
+ }
+ }
+ }
+ }
+
+ // @media(min-width: 1200px) {
+
+ .item.firstLevel {
+ &:hover {
+ color: @hoverColor !important;
+
+ a.firstLevel {
+ color: #cc4400 !important;
+ }
+ }
+ }
+
+ // }
+
+ div.item.firstLevel {
+ border : 1px solid transparent !important;
+ border-bottom: 1px solid transparent !important;
+
+ &:hover {
+ @media(min-width: 1200px) {
+
+ border-color: #eee !important;
+
+ // box-shadow : 1px -2px 9px 0px rgba(0,0,0,0.3);
+ border-top-left-radius : 4px;
+ border-top-right-radius: 4px;
+ background : white !important;
+ }
+
+ // &:after {
+ // content : '';
+ // position : absolute;
+ // bottom : -2px;
+ // left : 0;
+ // right : 0;
+ // border-bottom: 2px solid white;
+ // display : block;
+ // }
+ }
+ }
+
+
+ .Countries--section {
+ display: block;
+
+ @media(min-width: 600px) {
+ min-width: 450px !important;
+ }
+
+ @media(max-width: 800px) {
+ max-height: 50vh;
+ overflow : auto !important;
+ }
+
+ .item.Countries--section-item {
+ display: inline-block !important;
+ width : 33%;
+
+ @media(max-width: 768px) {
+ width: 50% !important;
+ }
+
+ &:not(#Regions) {
+ a {
+ font-weight: 400 !important;
+ color : #564535;
+ font-size : .9rem;
+ padding : 0rem .5rem !important;
+ text-align : center;
+
+ // &:hover {
+ // color: #cc4400 !important;
+ // }
+ }
+ }
+
+ &#Regions {
+ width : 100%;
+ padding-bottom: .5rem;
+ margin-bottom : .5rem;
+ text-align : center;
+ cursor : initial !important;
+
+ @media(max-width: 768px) {
+ width: 100% !important;
+ }
+
+ >div.secondLevel {
+ pointer-events: none;
+ border-top : 1px solid #eee;
+ border-bottom : 1px solid #eee !important;
+ }
+
+ a {
+ padding : 0rem .5rem !important;
+ line-height: 2.5;
+ }
+
+
+ a:hover {
+ background: @hoverColor !important;
+ color : white !important;
+ text-decoration: none;
+ }
+
+ }
+ }
+ }
+ }
+}
+
+.ui.secondary.menu .dropdown.item > .menu, .ui.text.menu .dropdown.item > .menu {
+ border-radius: 0;
+}
+
+// @media(max-width: 1200px) {
+
+// a.item.secondLevel {
+
+// &:before {
+// content : "►";
+// color : rgb(34, 85, 17);
+// font-size : 0.8rem;
+// margin-right: 7px;
+// margin-left : -1rem;
+// position : absolute;
+// }
+// }
+// }
+
+.ui.secondary.pointing.menu a.item:active {
+ color : inherit;
+ border-bottom: 2px solid transparent;
+}
+
+.navigation .menu .dropdown>.menu>.dropdown .menu {
+ overflow: hidden;
+}
+
+
+.navigation .menu .dropdown>.menu>.item {
+
+ .item.thirdLevel {
+
+ @media (max-width: 1200px) {
+ padding-left: 2.5rem;
+ font-weight : 400;
+ }
+
+ }
+
+ >.item.secondLevel {
+ color : #005555;
+ font-weight : 500;
+ line-height : 2.5;
+ padding : 0 1.5rem;
+ margin : 0;
+ border-bottom-style: none;
+
+
+ @media (max-width: 1200px) {
+ font-weight: 400;
+ }
+
+ &:active {
+ border: none;
+ }
+
+ @media(min-width: 1200px) {
+ &:hover {
+ background: #cc4400;
+ color : #fff !important;
+ }
+ }
+ }
+
+ &:hover {
+ background: unset !important;
+ color : initial !important;
+ }
+
+ &:not(a) {
+ padding : 0 !important;
+ border-bottom: 1px solid #eee;
+ }
+}
+
+
+.navigation .menu>.dropdown.item>.menu .item {
+ margin : 0;
+ border-bottom: none !important;
+
+ &:not(a) {
+ padding : 0 !important;
+ border-bottom: 1px solid #eee;
+ }
+}
+
+
+.navigation .dropdown .submenu-wrapper {
+ max-height : 300px;
+ overflow-y : auto;
+ margin-bottom: 1rem;
+}
+
+.navigation .dropdown .submenu {
+ padding-top : 1rem;
+ column-count: 2;
+ column-gap : 1rem;
+
+ >a {
+ padding : 0.3rem 1.5rem !important;
+ font-size : .9rem !important;
+ color : @menuColor;
+ font-weight: 400;
+ display : block;
+ column-span: all; // ignore two column layout by default
+
+ @media(min-width: 1200px) {
+
+ &:hover {
+ color : @darkOrange !important;
+ text-decoration: underline;
+ }
+ }
+ }
+
+ // if more than 3 items are present
+ // wrap the list into two column
+ >a:nth-last-child(n+3),
+ >a:nth-last-child(n+3)~* {
+ column-span: none;
+ }
+}
+
+.ui.secondary.menu .dropdown.item>.menu,
+.ui.text.menu .dropdown.item>.menu {
+ margin-top: 0;
+}
+
+.navigation .menu>.dropdown.item>.menu {
+ box-shadow: none;
+
+ @media(min-width: 1200px) {
+ margin-top: -3px !important;
+ }
+
+ left : 50%;
+ border : 1px solid #eee;
+ transform : translateX(-50%);
+ border-top-left-radius : 0 !important;
+ border-top-right-radius: 0 !important;
+ // box-shadow : 0px 0px 25px 0px rgba(0, 0, 0, 0.2);
+ left : 50%;
+ transform : translateX(-50%);
+}
+
+.ui.menu .ui.dropdown .menu>.item:hover {
+ background-color: transparent !important;
+}
+
+
+.carretTop {
+ content : '';
+ width : 0;
+ height : 0;
+ border-left : 15px solid transparent;
+ border-right : 15px solid transparent;
+ border-bottom : 15px solid white;
+ position : absolute;
+ top : -15px;
+ // left : 25px;
+ // left : unset;
+ right : calc(100% - 2rem);
+ // -3rem pe sticky/
+}
+
+.sticky-outer-wrapper.active {
+ .carretTop {
+ top: -8px;
+ }
+}
+
+.navigation {
+
+
+ .ui.dropdown .menu>.header {
+ width : 0;
+ height : 0;
+ padding : 0 !important;
+ margin : 0 !important;
+ position: absolute;
+ right : 70px;
+ }
+}
+
+.sticky-outer-wrapper.active .sticky-inner-wrapper .navigation .ui.secondary.pointing.menu>.item.firstLevel {
+ margin: 0 12px;
+}
+
+.sticky-inner-wrapper {
+ z-index: 2;
+}
+
+.logoImageSm {
+ display: none !important;
+}
+
+.sticky-outer-wrapper.active {
+ .logoImage {
+ display: none !important;
+ }
+
+ .logoImageSm {
+ display: block !important;
+ }
+
+ .searchInput {
+ background: white;
+ }
+
+ .sticky-inner-wrapper {
+ background: @stickyMenuColor;
+
+ @media (max-width: 1200px) {
+ background: white;
+ }
+
+ z-index : 10;
+ box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.2);
+
+ .menu {
+ margin-bottom: 1rem;
+ margin-top : 1rem;
+ }
+
+ .showInput {
+ background: white;
+ }
+
+ .header {
+ display : flex;
+ justify-content: space-between;
+ align-items : center;
+
+ .nav-actions {
+ position : relative;
+ right : unset;
+ top : unset;
+ // margin-top: 1rem;
+ padding-right: 1rem;
+ }
+ }
+
+ .logo-nav-wrapper {
+ margin-top : 0;
+ flex-grow : 1;
+ padding-right: 0;
+ align-items : center;
+ }
+
+ .navigation .ui.secondary.pointing.menu>.item {
+ &.firstLevel {
+ @media(min-width: 1200px) {
+ margin: 0 .5rem;
+ }
+ }
+
+ >a {
+ padding: 0;
+ }
+ }
+
+ @media(max-width: 1200px) {
+
+ .ui.pointing.secondary.stackable.open.menu {
+ margin-top: 0 !important;
+ }
+ }
+
+ .navigation .ui.secondary.pointing.menu .item {
+ font-size: 1rem;
+ }
+
+ .logo {
+ margin: .5rem 0;
+
+ img {
+ height: 40px !important;
+ }
+
+ .logoImageSm {
+ height: 63px !important;
+ }
+ }
+
+ }
+}
+
+
+
+.ui.form .searchbox.field {
+ display : flex;
+ align-items: center;
+}
+
+
+.ui.menu .item>i.dropdown.icon {
+ display: none;
+}
+
+// hamburger
+.hamburger-inner,
+.hamburger-inner::before,
+.hamburger-inner::after,
+.hamburger.is-active .hamburger-inner,
+.hamburger.is-active .hamburger-inner::before,
+.hamburger.is-active .hamburger-inner::after {
+ background-color: #015610 !important;
+}
+
+
+
+.sticky-outer-wrapper.active {
+ @media(min-width: 1200px) and (max-width: 1300px) {
+ .sticky-inner-wrapper .navigation .ui.secondary.pointing.menu>.item.firstLevel {
+ margin: 0;
+ }
+ }
+}
+
+.nav-actions-mobile {
+ display: none !important;
+}
+
+.nav-actions {
+ display: none !important;
+}
+
+
+@media(min-width: 1200px) {
+ .firstLevel:active {
+ a.firstLevel {
+ pointer-events: none;
+ }
+ }
+}
+
+
+.zero-margin {
+ margin: 0 !important;
+}
+
+body {
+ @media(max-width: 1200px) {
+ .ui.pointing.secondary.stackable.open.firstLevel.menu {
+ z-index: 100;
+ }
+
+ .ui.simple.active.dropdown>.menu,
+ .ui.simple.dropdown:hover>.menu {
+ overflow: visible;
+ width : auto;
+ position: relative;
+ height : auto;
+ top : initial !important;
+ opacity : 1;
+ }
+
+ .ui.simple.active.dropdown>.menu,
+ .ui.simple.dropdown>.menu.hovered {
+ overflow: visible;
+ width : auto;
+ position: relative;
+ height : auto;
+ top : initial !important;
+ opacity : 1;
+ }
+ }
+}
+
+.navigation,
+.tools {
+ .ui.secondary.pointing.menu {
+ .item {
+ padding-top: @relativeBig;
+ margin: 0;
+ text-transform: uppercase;
+
+ @media only screen and (min-width: @largestTabletScreen) {
+ padding: .875em .8125em;
+ margin: 0;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/theme/site/collections/menu.overrides.bak b/theme/site/collections/menu.overrides.bak
new file mode 100644
index 0000000..4109cce
--- /dev/null
+++ b/theme/site/collections/menu.overrides.bak
@@ -0,0 +1,1508 @@
+/*******************************
+ Theme Overrides
+*******************************/
+@import url('https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css');
+@import url('../globals/site.variables');
+// @import url('menu.variables');
+
+
+//hamburger menu visible until 900px
+@media only screen and (min-width: 768px) and (max-width: 900px){
+ body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) [class*='mobile only']:not(.tablet), body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) [class*='tablet hidden'], body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) [class*='computer only']:not(.tablet), body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) [class*='large screen only']:not(.tablet), body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) [class*='widescreen only']:not(.tablet), body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) [class*='or lower hidden']:not(.mobile) {
+ display: unset !important;
+ }
+}
+
+
+@media only screen and (min-width: 768px) and (max-width: 900px){
+ body:not(.has-sidebar):not(.has-sidebar-collapsed) [class*='mobile only']:not(.tablet), body:not(.has-sidebar):not(.has-sidebar-collapsed) [class*='tablet hidden'], body:not(.has-sidebar):not(.has-sidebar-collapsed) [class*='computer only']:not(.tablet), body:not(.has-sidebar):not(.has-sidebar-collapsed) [class*='large screen only']:not(.tablet), body:not(.has-sidebar):not(.has-sidebar-collapsed) [class*='widescreen only']:not(.tablet), body:not(.has-sidebar):not(.has-sidebar-collapsed) [class*='or lower hidden']:not(.mobile) {
+ display: unset !important;
+ }
+}
+
+
+//Home Page
+
+body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) .ui.container {
+ width: @100ValuePercentage !important;
+ margin-right: 0 !important;
+ margin-left: 0 !important;
+}
+
+
+body.menu-open-homepage {
+ .content-area {
+ main {
+ display: none;
+ }
+ }
+ .menu .menu-items {
+ background: rgba(0, 134, 117, 0.5);
+ }
+}
+
+#main.homepage {
+
+ .content-area {
+ display: flex;
+ height: 100vh;
+ width: 100vw;
+ margin: 0;
+ padding: 0;
+ justify-content: center;
+ align-items: center;
+ main {
+ position: absolute;
+ top: 150px;
+ left: 22%;
+ width: 66%;
+ background: rgba(255, 255, 255, 0.1);
+ padding: 20px;
+ h1 {
+ color: @white;
+ border-bottom: none;
+ font-size: @h1documentFirstHeading;
+ &:before {
+ border-bottom: none;
+ }
+ @media (max-width: 900px){
+ font-size: @h1documentFirstHeading - .5rem;
+ }
+ }
+ p {
+ color: @white;
+ }
+ //Mobile to Tablet Media Queries
+ @media (max-width: 900px){
+ top: @mainContentTopPosition;
+ width: @mainContentWidth;
+ height: @mainContentHeight;
+ overflow: @autoValue;
+ left: @zeroValuePosition;
+ right: @zeroValuePosition;
+ margin-left: @mainContentMarginLeft;
+ }
+ //Tablet to Laptop
+ @media only screen and (min-width: 900px) and (max-width: 1300px) {
+ height: @mainContentHeight;
+ overflow: @autoValue;
+ }
+ }
+ main::-webkit-scrollbar{
+ background-color: @grayBgColor;
+ }
+ main::-webkit-scrollbar-track{
+ // -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
+ // border-radius: 10px;
+ background-color: @grayBgColor;
+ }
+ main::-webkit-scrollbar-thumb{
+ // border-radius: 10px;
+ // -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
+ background-color: rgba(245, 245, 245, .5);
+ }
+ }
+
+ .headerTop {
+ position: relative;
+ z-index: 2;
+ @media (max-width: 900px){
+ z-index: unset;
+ }
+ }
+ .header {
+ position: absolute;
+ width: @100ValuePercentage;
+ height: 115px;
+ display: flex;
+ justify-content: space-between;
+ top:0;
+ align-items: center;
+ padding-right: 6rem;
+ a {
+ pointer-events: none;
+ }
+ .ui.form .searchbox.field {
+ border-left: none;
+ top: -1rem;
+ // margin-right: -5rem;
+ position: relative;
+ z-index: 1;
+ input {
+ color: @white;
+ }
+ button {
+ color: @white;
+ }
+ //Mobile Media Queries
+ @media (max-width: 360px) {
+ position: @absolutePosition;
+ left: @zeroValuePosition;
+ top: @searchBoxTopPositionHomepage;
+ }
+ //Tablet Media Queries
+ @media only screen and (min-width: 360px) and (max-width: 900px) {
+ top: @searchBoxTopPositionHomepage;
+ position: @absolutePosition;
+ left: @zeroValuePosition;
+ }
+ }
+
+ img {
+ z-index: 1;
+ position: relative;
+ left: -6px;
+
+ //mobile + tablet queries
+ @media (max-width: 900px){
+ width: 500px;
+ left: 50px;
+ }
+ }
+ // .page-logo {
+ // width: 750px;
+ // margin-top: 2rem;
+ // }
+ }
+
+ #menu-background,
+ #menu-background-overlay,
+ #menu-underlay,
+ .header-wrapper {
+ background-size: cover;
+ width: @100ValuePercentage;
+ height: @100ValuePercentage;
+ position: absolute;
+ }
+ #menu-background-overlay {
+ background: rgba(0,0,0,0.45);
+ &.blue {
+ background: transparent;
+ }
+ }
+ #menu-underlay {
+ background: transparent;
+ &.blue {
+ background: #004B87;
+ }
+ }
+
+
+//Menu Homepage
+
+.menu {
+ position: relative;
+ padding-top: 150px;
+ width: 65%;
+ height: @100ValuePercentage;
+ float: left;
+ min-height: max-content;
+ display: flex;
+ flex-flow: row;
+ align-items: flex-start;
+
+
+ .hamburger{
+ padding: 10px 10px;
+ &:focus, &:active{
+ outline: none;
+ }
+ }
+
+ .hamburger-wrapper.mobile.only{
+ position: @absolutePosition;
+ left: 15px;
+ background: rgba(0, 134, 117, 0.9);
+ //Mobile Media Queries
+ @media (max-width: 360px){
+ top: calc(@mobileMenuTopPosition + 7px);
+ }
+ //Tablet Media Queries
+ @media only screen and (min-width: 360px) and (max-width: 900px){
+ position: @absolutePosition;
+ top: @mobileMenuTopPosition;
+ }
+ .hamburger{
+ @media (max-width: 900px){
+ padding: 10px 10px;
+ }
+ .hamburger-box{
+ @media (max-width: 900px){
+ height: 27px;
+ }
+ }
+ }
+ .hamburger-inner,
+ .hamburger-inner::before,
+ .hamburger-inner::after{
+ background-color: #fff;
+ }
+
+
+
+ }
+
+ a {
+ color: #fff;
+ &.router-link-exact-active {
+ color: #fff;
+ }
+ &:hover {
+ text-decoration: none;
+ }
+ }
+
+ .menu-items {
+ overflow: auto;
+ width: 33%;
+ position: absolute;
+ z-index: 1;
+ padding: 1rem;
+ padding-left: 2.5rem;
+ display: inline-block;
+ height: 100%;
+ top: 0;
+ bottom: 0;
+ padding-top:200px;
+ display: inline-block;
+
+ @media (max-width: 360px){
+ background: rgba(0, 134, 117, 0.9);
+ margin-left: 15px;
+ top: 4.5rem;
+ padding: 2rem;
+ }
+
+ @media only screen and (min-width: 360px) and (max-width: 900px){
+ background: rgba(0, 134, 117, 0.9);
+ margin-left: 15px;
+ top: 4.2rem;
+ padding: 2rem;
+ }
+
+ @media only screen (min-width: 900px) and (max-width: 1200px){
+ padding-left: -1rem;
+ }
+
+
+
+ .menu-item {
+ position: relative;
+ h2.menu-title {
+ font-size: 2rem!important;
+ margin-bottom: 2.5rem;
+ @media (max-width: 900px){
+ padding: 15px;
+ margin: 0px -31px;
+ font-size: 1.5rem!important;
+ }
+ &:hover{
+ @media (max-width: 900px){
+ background-color: rgba(0, 143, 124);
+ }
+ }
+ }
+ color: #fff;
+ &.active {
+ .menu-title {
+ font-weight: 400;
+ }
+ &:before {
+ content: ">";
+ font-family: @headerFontName;
+ font-size: 2rem;
+ font-weight: 100;
+ line-height: 0;
+ position: absolute;
+ left: calc(100% + 15px);
+ top:50%;
+ transform:translateY(-50%);
+ transition: all 200ms;
+ }
+
+ }
+ .menu-title {
+ text-transform: uppercase;
+ text-align: left;
+ font-weight: 100;
+ cursor: pointer;
+ &:hover {
+ font-weight: 400;
+ }
+ }
+ }
+ }
+
+ .menu-items.menu-open{
+ @media (max-width: 900px){
+ display: none;
+ }
+ }
+
+
+ .sub-menu {
+ position: relative;
+ display: flex;
+ -ms-flex-direction: column;
+ flex-direction: column;
+ padding-top: 200px;
+ /* margin-top: -400px; */
+ /* height: calc(100% + 400px); */
+ padding-left: 40%;
+ width: 33%;
+ /* left: -120px; */
+ background: rgba(0, 134, 117, 0.5);
+ left: 33%;
+ padding-left: 1rem;
+ position: absolute;
+ top: 0;
+ bottom: 0;
+ &.columns-2 {
+ background: linear-gradient(to right, rgba(29, 40, 39, 0.69) 1%, #004B87 80%, #004B87 100%);
+ .sub-menu-item {
+ width: 33.33%;
+ }
+ }
+
+ .sub-menu-item {
+ width: @100ValuePercentage;
+ margin-bottom: .8rem;
+ .sub-menu-title {
+ cursor: pointer;
+ &.active {
+ font-weight: 400;
+ }
+ margin: 0;
+ font-weight: 100;
+ text-align: left;
+ &:hover {
+ font-weight: 400;
+ }
+ }
+ }
+
+ }
+
+ .sub-menu-item,
+ .sub-topic-item {
+ padding-right: 1rem;
+ position: relative;
+ color: @white;
+ &:after {
+ content: '';
+ width: 35px;
+ // border-top: 1px solid white;
+ display: block;
+ margin-top: 15px;
+ }
+ .sub-menu-title,
+ .sub-topic-title {
+ &.active {
+ position: relative;
+ &:before {
+ content: ">";
+ font-family: @headerFontName;
+ font-size: 2rem;
+ font-weight: 100;
+ line-height: 0;
+ position: absolute;
+ left: calc(100% + 15px);
+ top:50%;
+ transform: translateY(-50%);
+ transition: all 200ms;
+ }
+ }
+ }
+ }
+
+ .sub-topics {
+ padding-top: 200px;
+ /* margin-top: -400px; */
+ /* height: calc(100% + 400px); */
+ background: rgba(255, 255, 255, 0.8);
+ left: 33%;
+ width: 33%;
+ position: absolute;
+ left: 66%;
+ top: 0;
+ bottom: 0;
+ .sub-topic-item {
+ margin-bottom: 2.5rem;
+ h4 {
+ &.active {
+ font-weight: 400;
+ }
+ }
+ cursor: pointer;
+ .sub-topic-title {
+ font-weight: 100;
+ a {
+ color: #444;
+ }
+ &:hover {
+ font-weight: 400;
+ }
+ }
+ }
+ }
+}
+//Menu Homepage End
+
+
+.floating-chart {
+ // display: none;
+ position: absolute;
+ left: 33%;
+ width: 66%;
+ height: calc(100vh - 150px);
+ top: 150px;
+ bottom: 0;
+ max-width: 700px;
+ padding-bottom: 2rem;
+ padding-right: 1rem;
+ img {
+ width: @100ValuePercentage;
+ max-height: @100ValuePercentage;
+ padding-left: 300px;
+ }
+}
+
+.content {
+ padding: 0 24px;
+ color: #000;
+ padding-top: 150px;
+ height: @100ValuePercentage;
+ float: right;
+ width: 40%;
+ position: relative;
+ color: #000;
+ background: rgba(255, 255, 255, 0.95);
+}
+
+// Props clases
+.absolute {
+ position: absolute;
+ top: 0;
+ left: 0;
+}
+.relative {
+ position: relative;
+}
+.background-transparent {
+ background-color: transparent;
+}
+.background-teal {
+ background-color: rgba(47, 119, 101, 0.85);
+}
+.background-peach {
+ background-color: rgba(155, 61, 56, 0.85);
+}
+.background-aqua {
+ background-color: rgba(31, 105, 182, 0.85);
+}
+.background-img {
+ background-image: url('/images/background/home.jpg')
+}
+.background-countries {
+ background-image: url('/images/background/countries.png');
+ background-size: contain!important;
+ background-repeat: no-repeat;
+ background-position-x: 50%;
+ mix-blend-mode: multiply;
+}
+.app-menu-toolbar {
+ position: absolute;
+ width: 30%;
+ z-index: 1;
+}
+
+#app-menu,
+#app-menu-content {
+ font-family: @headerFont;
+ width: @100ValuePercentage;
+ height: @100ValuePercentage;
+ min-height: max-content;
+ font-weight: 100;
+}
+
+ // Grid
+ .columns-2 {
+ position: relative;
+ width: @100ValuePercentage!important;
+ padding: 0 30px;
+ }
+ .columns-3 {
+ position: relative;
+ width: 33.333%;
+ padding: 0 30px;
+
+ }
+}
+
+
+.topics,
+.countries,
+.catalogue {
+ #app-menu-content {
+ font-family: @headerFont;
+ width: unset;
+ height: @100ValuePercentage;
+ min-height: max-content;
+ font-weight: 100;
+ color: @white;
+ z-index: 1;
+ position: fixed;
+ }
+}
+
+
+.headings_navigation {
+ padding: 1rem;
+ background: #eee;
+ color: #444;
+ margin-top: 2rem;
+ font-weight: 400;
+
+ position: sticky;
+ top: 0;
+ margin-left: -1rem;
+
+ @media (max-width: 900px){
+ margin-bottom: 2rem;
+ margin-left: 0rem;
+ }
+
+ .headings_navigation_list {
+ padding-left: 0;
+ list-style-type: none;
+ background: @white;
+ margin: -1rem;
+ border: 1px solid #eee;
+ overflow: hidden;
+ padding: 1rem;
+ font-size: 1rem;
+ margin-top: 1rem;
+ li {
+ cursor: pointer;
+ margin-bottom: 1rem;
+ color: #4a4a4a;
+ &:hover {
+ color: #007bff;
+ }
+ }
+}
+}
+
+//Home Page End
+
+//Topics Page
+
+.topics {
+ .cols {
+ display: flex;
+ @media (max-width: 900px){
+ flex-direction: column;
+ }
+ }
+ .content-page {
+ background: @white;
+ padding: 2rem;
+ color: #252525;
+ margin-top: -7rem;
+ font-family: @fontName;
+ font-size: 16px;
+ position: relative;
+
+ }
+ .intro {
+ font-weight: 300;
+ font-style: italic;
+ font-size: 16px;
+ }
+ .content-cols {
+ .content-page {
+ border-left: 1px solid #ddd;
+ @media (max-width: 900px){
+ border-left: none;
+ }
+ }
+ }
+
+ .navbar-body {
+ display: flex;
+ justify-content: space-between;
+ height: 57px;
+ }
+ .page-logo-sm {
+ position: absolute;
+ width: 350px;
+ top: -10px;
+ right: 2rem;
+ left: 0;
+ width: @100ValuePercentage;
+ }
+ .header-navbar {
+ position: fixed;
+ left: 0;
+ top: 0;
+ width: 100vw;
+ // background: #008675;
+ background-image: url(/images/background/topic-bg.jpg);
+ color: @white;
+ }
+ .header-navbar.vue-fixed-header--isFixed {
+ position: fixed;
+ left: 0;
+ top: 0;
+ width: 100vw;
+ background-image: url(/images/background/topic-bg.jpg);
+ background-size: cover;
+ .navbar-body {
+ background: rgba(0,0,0,0.5);
+ }
+ color: @white;
+ z-index: 100;
+ }
+ //Topics Header
+ .page-header {
+ width: @100ValuePercentage;
+ height: 230px;
+ position: relative;
+ @media (max-width: 600px){
+ height: 300px;
+ }
+ }
+ .page-bg,
+ .page-bg-overlay {
+ background-size: cover;
+ width: @100ValuePercentage;
+ height: @100ValuePercentage;
+ position: absolute;
+ background-image: url('/images/background/topic-bg.jpg');
+ @media (max-width: 900px){
+ height: 50%;
+ }
+ }
+ .page-bg-overlay {
+ // background: #008675;
+ background: rgba(0,0,0, 0.45);
+ }
+
+ h1 {
+ font-weight: bold;
+ }
+}
+
+
+
+body > #main:not(.homepage) {
+
+ #view{
+ top: -15px;
+ @media (max-width: 900px){
+ left: -2rem;
+ }
+ }
+
+ .tools{
+ position: absolute;
+ right: -2rem;
+ top: -2rem;
+ @media (max-width: 600px){
+ position: absolute;
+ right: -1rem;
+ top: -12rem;
+ }
+ @media only screen and (min-width: 600px) and (max-width: 900px){
+ position: absolute;
+ right: -1rem;
+ top: -10rem;
+ }
+ }
+
+ .topics {
+ .header {
+ a img {
+ margin-left: 1rem;
+ @media (max-width: 500px){
+ display: none;
+ }
+ @media only screen and (min-width: 500px) and (max-width: 900px){
+ width: @100ValuePercentage;
+ margin-top: -1rem;
+ margin-left: 6rem;
+ }
+ }
+ .searchbar{
+ top: @searchBoxTopPositionTopics !important;
+
+ //Tablet Media Queries
+ @media (max-width: 600px){
+ top: calc(@searchBoxTopPositionTopics + 3);
+ position: @absolutePosition;
+ left: @zeroValuePosition;
+ }
+
+ .ui.form .searchbox.field {
+ border-left: none;
+ input, button {
+ color: @white;
+ }
+ @media (max-width: 600px) {
+ position: @absolutePosition;
+ }
+ }
+ }
+
+ }
+ }
+
+
+ #app-menu-content {
+ position: relative;
+ top: 0;
+ width: @100ValuePercentage;
+ }
+
+ .sub-menu-item {
+ margin-bottom: 2rem;
+ margin-left: 1rem;
+ a {
+ color:@white;
+ }
+ }
+
+ .menu {
+ width: @100ValuePercentage;
+
+ .hamburger{
+ padding: 10px 10px;
+ &:focus, &:active{
+ outline: none;
+ }
+ }
+
+ .hamburger-wrapper.mobile.only{
+ //Mobile Media Queries
+ position: @absolutePosition;
+ left: 0;
+ background: rgba(0, 134, 117, 0.9);
+
+ .hamburger-box{
+ height: 27px;
+ }
+
+ @media (max-width: 600px){
+ top: @mobileMenuTopPositionTopics;
+ }
+
+ @media only screen and (min-width: 600px) and (max-width: 900px){
+ top: @mobileMenuTopPositionTopics + 4.4rem;
+ }
+
+ .hamburger-inner,
+ .hamburger-inner::before,
+ .hamburger-inner::after{
+ @media (max-width: 900px){
+ background-color: #fff;
+ }
+ }
+
+ }
+
+ .menu-items {
+ // width:400px;
+ z-index: 1;
+ margin-left: 1.5rem;
+ // padding: 1rem;
+ padding-top: 1rem;
+ display: inline-block;
+ // position: absolute;
+ max-width: 180px;
+ top: 0;
+ width: @100ValuePercentage;
+ padding-left: 3rem;
+ position: relative;
+ // @media (max-width: 900px){
+ // height: 0px;
+ // background: rgba(0, 134, 117, 0.9);
+ // transition: height 2s;
+ // }
+ @media (max-width: 900px){
+ max-width: 215px;
+ }
+
+ // &:hover {
+ // &:active{
+ // @media (max-width: 900px){
+ // height: 250px; /* */
+ // }
+ // }
+ // }
+
+
+ @media (max-width: 600px){
+ background: rgba(0, 134, 117, 0.9);
+ margin-left: 0;
+ top: -14.5rem;
+ padding: 2rem;
+ }
+
+ @media only screen and (min-width: 600px) and (max-width: 900px){
+ background: rgba(0, 134, 117, 0.9);
+ margin-left: 0;
+ top: -10.2rem;
+ padding: 2rem;
+ }
+
+ @media only screen (min-width: 900px) and (max-width: 1200px){
+ padding-left: -1rem;
+ }
+
+ h2.menu-title {
+ color: #444;
+ a {
+ color: #444;
+ }
+ &.white {
+ color: @white;
+ }
+ @media (max-width: 900px){
+ color: #fff;
+ }
+ }
+
+ .menu-item {
+ position: relative;
+ h2.menu-title {
+ font-size: 2rem!important;
+ margin-bottom: 2.5rem;
+ @media (max-width: 900px){
+ padding: 15px;
+ margin: 0px -31px;
+ font-size: 1.5rem!important;
+ }
+ &:hover{
+ @media (max-width: 900px){
+ background-color: rgba(0, 143, 124);
+ }
+ }
+ }
+ color: #fff;
+ &.active {
+ .menu-title {
+ font-weight: 400;
+ }
+ &:before {
+ content: ">";
+ font-family: @headerFontName;
+ font-size: 2rem;
+ font-weight: 100;
+ line-height: 0;
+ position: absolute;
+ left: calc(100% + 15px);
+ top:50%;
+ transform:translateY(-50%);
+ transition: all 200ms;
+ }
+ }
+ .menu-title {
+ text-transform: uppercase;
+ text-align: left;
+ font-weight: 100;
+ cursor: pointer;
+ &:hover {
+ font-weight: 400;
+ }
+ }
+ }
+ }
+
+ //for mobile menu
+ .menu-items.menu-open{
+ @media (max-width: 900px){
+ display: none;
+ }
+ }
+
+
+ .sub-menu {
+ position: fixed;
+ height: @100ValuePercentage;
+ display: block;
+ padding-top: 5rem;
+ margin-top: 0;
+ top:0;
+ left: -3%;
+ width: 38%;
+ padding-left: 22rem;
+ background: rgba(0, 134, 117, 0.8);
+ .sub-menu-item {
+ &.country {
+ display: inline-block;
+ width: 20%;
+ }
+ .sub-menu-title {
+ margin-bottom: 2.5rem;
+ }
+ }
+ }
+
+ .sub-topics {
+ position: fixed;
+ left: 38%;
+ width: 20%;
+ padding-top: 5rem;
+ top: 0;
+ margin-top: 0;
+ height: calc(100% + 150px);
+ background: rgba(215, 215, 215, 0.9);
+ left: 35%;
+ h2 {
+ color: #444;
+ }
+ p {
+ color: #444;
+ }
+ .sub-topic-item {
+ padding-right: 1rem;
+ margin-bottom: 2rem;
+ position: relative;
+ a {
+ color: #444;
+ }
+ }
+ }
+
+ }
+ }
+
+ .menu-item {
+ .menuExpanded {
+ // margin-top: -1.5rem;
+ // margin-bottom: 1rem;
+ // padding-left: .5rem;
+ color: #444;
+ h5 {
+ padding-bottom: 15px;
+ border-bottom: 1px solid #eee;
+ font-size: 1.2rem;
+ margin-top: -1rem;
+ }
+ ul {
+ padding-left: 5px;
+ list-style-type: none;
+ padding-left: 0;
+ li {
+ padding-bottom: 10px;
+ a {
+ color: #444!important;
+ }
+ &.active {
+ font-weight: bold;
+ color: #444;
+ }
+ }
+ }
+ }
+ }
+
+
+ .opened {
+ .menuExpanded {
+ color: @white!important;
+ ul li a{
+ color: @white!important;
+ }
+ }
+ }
+
+ .cols .col-3 .header-wrapper {
+ position: sticky;
+ top: 0;
+ }
+
+
+// Catalogue
+
+.catalogue-filters {
+ position: sticky;
+ top:68px;
+ }
+ .filters-list {
+ .filter {
+ margin-bottom: .5rem;
+ position: relative;
+ border: 1px solid transparent;
+ padding-left: 1.7rem;
+ cursor: pointer;
+ transition: all 200ms;
+ &.selected{
+ // border-color: red;
+ background: #f9f9f9;
+ border-radius: 6px;
+ i {
+ color: green;
+ }
+ }
+ &:hover {
+ border-color: #aaa;
+ }
+ i {
+ font-size: .8rem;
+ color: rgba(3, 26, 78, 1);
+ position: absolute;
+ left: .3rem;
+ // top: 50%;
+ top: 0;
+ line-height: 2.2;
+ // transform: translateY(-50%);
+ }
+ }
+ }
+ .catalogue-header {
+ position: relative;
+ margin-top: -2rem;
+ margin-bottom: 3rem;
+ i {
+ position: absolute;
+ right: 1rem;
+ font-size: 2rem;
+ top: 50%;
+ transform:translateY(-50%);
+ cursor: pointer;
+ }
+ input {
+ width: @100ValuePercentage;
+ font-size: 1.5rem;
+ padding: 1rem;
+ border: 1px solid #fff;
+ border-bottom-color: #eee;
+ }
+ }
+ .catalogue-body {
+ padding: 1rem;
+ margin-top: -1px;
+ }
+ .cols {
+ display: flex;
+ }
+ .content-page {
+ background: @white;
+ padding: 2rem;
+ color: #252525;
+ margin-top: -7rem;
+ font-family: @fontName;
+ font-size: 18px;
+ }
+ .intro {
+ font-weight: 300;
+ font-style: italic;
+ font-size: 16px;
+ }
+ .content-cols {
+ .col-9 {
+ .content-page {
+ border-left: 1px solid #ddd;
+ border-right: 1px solid #ddd;
+ }
+ }
+ }
+ #minimap2 {
+ display: none;
+ }
+ #minimap, #minimap2 {
+ position: sticky;
+ // top: 250px;
+ top: 270px;
+ right: 100px;
+ min-width: 100px!important;
+ height: 300px;
+ z-index: 100;
+ }
+ // .content-page * {
+ // // max-width: 100%!important;
+ // }
+ .badge {
+ border: 1px solid #ddd;
+ border-radius: 6px;
+ font-size: .8rem;
+ padding: .5rem .8rem;
+ background: #eee;
+ }
+
+
+ .catalogue-controls {
+ display: flex;
+ justify-content: space-between;
+ }
+ .full-width-catalogue {
+ .cards {
+ grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
+ .card {
+ flex-direction: row;
+ a {
+ // display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+ .card-detail {
+ flex: 1 auto;
+ margin-left: .5rem;
+ margin-right: .5rem;
+ padding-top: 0;
+
+ .card-content,
+ .card-bottom {
+ margin-top: 0.7rem;
+ }
+ }
+ .card-image {
+ width: 150px;
+ height: 150px;
+ }
+ }
+ }
+ }
+
+ //Catalogue End
+
+
+ // Cards
+ .cards{
+ display: grid;
+ grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
+ grid-auto-flow: row dense;
+ grid-gap: 2rem;
+ padding-bottom: 50px;
+ a {
+ color: inherit;
+ text-decoration: none!important;
+ }
+ .card{
+ overflow:hidden;
+ display:flex;
+ border: none;
+ flex-direction: column;
+ border-radius: 0;
+ height: @100ValuePercentage;
+ justify-content: space-between;
+ transition: box-shadow .3s ease-out, transform .3s ease-out, opacity .2s ease-out;
+ &:hover{
+ // transform: translate(0, -4px);
+ // box-shadow: rgba(45,45,45,0.05) 0px 2px 2px, rgba(49,49,49,0.05) 0px 4px 4px, rgba(42,42,42,0.05) 0px 8px 8px, rgba(32,32,32,0.05) 0px 16px 16px, rgba(49,49,49,0.05) 0px 32px 32px, rgba(35,35,35,0.05) 0px 64px 64px;
+ }
+ &-image{
+ overflow: hidden;
+ height: 180px;
+ display: block;
+ position: relative;
+ img{
+ object-position: center;
+ object-fit: cover;
+ width: @100ValuePercentage;
+ height: @100ValuePercentage;
+ top: -50%;
+ position: absolute;
+ transform: translateY(50%);
+ }
+ }
+ &-title{
+ padding:.5rem;
+ display:flex;
+ flex-direction:column;
+ margin-bottom: 0;
+ justify-content:center;
+ font-weight: bold;
+ .created{
+ font-size: 0.7rem;
+ color: rgba(179,192,200,0.8);
+ }
+ }
+ &-detail{
+ font-size: 1rem;
+ &.with-content {
+ flex: 1 0;
+ }
+ &.floating {
+ position: absolute;
+ top: .2rem;
+ right: .2rem;
+ border-top: none;
+ margin-left: 0!important;
+ margin-right: 0!important;
+ }
+ &:after {
+ content: "";
+ display: table;
+ clear: both;
+ }
+ &-left{
+ float:left;
+ }
+ &-right {
+ float:right;
+ }
+ button{
+ border:none;
+ background-color: transparent;
+ color: #B3C0C8;
+ cursor:pointer;
+ transition:color 0.2s ease;
+ &:hover{
+ color: #778D99;
+ }
+ }
+ // border-top: 1px solid #EAF1F6;
+ padding:.5rem;
+ }
+ }
+
+ }
+
+ //Cards End
+
+
+ .spinner {
+ margin: 100px auto;
+ width: 40px;
+ height: 40px;
+ position: relative;
+ text-align: center;
+
+ -webkit-animation: sk-rotate 2.0s infinite linear;
+ animation: sk-rotate 2.0s infinite linear;
+ }
+ .dot1, .dot2 {
+ width: 60%;
+ height: 60%;
+ display: inline-block;
+ position: absolute;
+ top: 0;
+ background-color: blue;
+ border-radius: @100ValuePercentage;
+
+ -webkit-animation: sk-bounce 2.0s infinite ease-in-out;
+ animation: sk-bounce 2.0s infinite ease-in-out;
+ }
+ .dot2 {
+ top: auto;
+ bottom: 0;
+ -webkit-animation-delay: -1.0s;
+ animation-delay: -1.0s;
+ }
+
+ @-webkit-keyframes sk-rotate { 100% { -webkit-transform: rotate(360deg) }}
+ @keyframes sk-rotate { 100% { transform: rotate(360deg); -webkit-transform: rotate(360deg) }}
+ @-webkit-keyframes sk-bounce {
+ 0%, 100% { -webkit-transform: scale(0.0) }
+ 50% { -webkit-transform: scale(1.0) }
+ }
+ @keyframes sk-bounce {
+ 0%, 100% {
+ transform: scale(0.0);
+ -webkit-transform: scale(0.0);
+ } 50% {
+ transform: scale(1.0);
+ -webkit-transform: scale(1.0);
+ }
+ }
+
+ .spin-wrapper {
+ position: fixed;
+ top: 0;
+ bottom: 0;
+ left: 0;
+ right: 0;
+ z-index: 99999;
+ background: rgba(0,0,0,0.5);
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+ .catalogue-body:not(.full-width-catalogue) {
+ .card-title,
+ .card-detail {
+ padding-left: 90px;
+ padding-top: 0;
+ }
+ .card-image {
+ position: absolute;
+ top: 5px;
+ width: 80px;
+ height: 80px;
+ }
+ }
+
+
+ .collapsible-panel__actions{-webkit-box-flex:1;-ms-flex-positive:1;flex-grow:1;text-align:right}.collapsible-panel__arrow{max-height:1rem;max-width:1rem;margin-right:.5rem;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transition:-webkit-transform .33s ease-out;transition:-webkit-transform .33s ease-out;transition:transform .33s ease-out;transition:transform .33s ease-out,-webkit-transform .33s ease-out}.collapsible-panel__arrow--expanded{-webkit-transform:rotate(0deg);transform:rotate(0deg)}.collapsible-panel__container{margin:0;padding:.3rem}.collapsible-panel__header{border-bottom:1px solid #dfdfdf;color:#333;padding:.3rem}.collapsible-panel__header,.collapsible-panel__headline{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex}.collapsible-panel__headline{background-color:transparent;border:none;color:#666;cursor:pointer;margin:0;padding:.3rem 0}.fade-bottom-enter-active,.fade-bottom-leave-active{-webkit-transition:-webkit-transform .33s ease-out;transition:-webkit-transform .33s ease-out;transition:transform .33s ease-out;transition:transform .33s ease-out,-webkit-transform .33s ease-out;height:auto;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:bottom;transform-origin:bottom}.fade-bottom-enter,.fade-bottom-leave-to{-webkit-transform:scaleY(0);transform:scaleY(0)}.fade-enter-active,.fade-leave-active{-webkit-transition:-webkit-transform .33s ease-out;transition:-webkit-transform .33s ease-out;transition:transform .33s ease-out;transition:transform .33s ease-out,-webkit-transform .33s ease-out;height:auto;-webkit-transform:scaleY(1);transform:scaleY(1);-webkit-transform-origin:top;transform-origin:top}.fade-enter,.fade-leave-to{-webkit-transform:scaleY(0);transform:scaleY(0)}
+
+
+ .tools {
+ position: absolute;
+ top:0;
+ right: 0;
+ z-index: 1;
+ a {
+ color: @white;
+ }
+ }
+
+
+.menu {
+ h3,h1,h2 {
+ cursor: pointer;
+ font-weight: 400;
+ }
+}
+
+.columns-2, .columns-3 {
+ position: relative;
+ padding: 0 30px;
+}
+
+
+.menu-open-contentpage {
+ .menu-item .menuExpanded ul li {
+ a {
+ color: @white!important;
+ }
+ }
+ .menuExpanded a {
+ color: @white!important;
+ }
+ .menu-title {
+ color: @white!important;
+ }
+}
+
+
+
+//Back to top btn
+.back_to_top {
+ position: sticky;
+ top: calc(100% - 3rem);
+ text-align: center;
+ width: @100ValuePercentage;
+ display: block;
+ cursor: pointer;
+ &:hover {
+ color: #007bff!important;
+ }
+}
+
+
+//Grid and Media Queries
+
+
+.col-3 {
+ flex: 0 0 25%;
+ max-width: 20%;
+ position: relative;
+ width: @100ValuePercentage;
+ padding-right: 15px;
+ padding-left: 15px;
+ z-index: 2;
+
+ @media (max-width: 900px){
+ max-width: @100ValuePercentage;
+ // .menu-hamburger{
+ // position: absolute;
+ // top: 25px;
+ // }
+ }
+}
+
+.col-6 {
+ flex: 0 0 50%;
+ max-width: 50%;
+ position: relative;
+ width: @100ValuePercentage;
+ padding-right: 15px;
+ padding-left: 15px;
+}
+
+
+@media only screen and (min-width: 1220px) {
+
+ body.has-toolbar-collapsed:not(.has-sidebar):not(.has-sidebar-collapsed) .ui.container, body.has-toolbar-collapsed:not(.has-sidebar):not(.has-sidebar-collapsed) .ui.wrapper > *, body.has-toolbar-collapsed:not(.has-sidebar):not(.has-sidebar-collapsed) .ui.wrapper > .ui.inner > *:not(.drag):not(.handle):not(.delete-button) {
+ width: @100ValuePercentage!important;
+ }
+
+}
+@media only screen and (min-width: 1280px) {
+
+ body.has-toolbar:not(.has-sidebar):not(.has-sidebar-collapsed) .ui.container, body.has-toolbar:not(.has-sidebar):not(.has-sidebar-collapsed) .ui.wrapper > *, body.has-toolbar:not(.has-sidebar):not(.has-sidebar-collapsed) .ui.wrapper > .ui.inner > *:not(.drag):not(.handle):not(.delete-button) {
+ width: @100ValuePercentage!important;
+
+ }
+}
+
+//G and MQ End
+
+
+
+//Admin Interface
+
+body.section-controlpanel,
+body.view-contentsview {
+ .col-3.inPageNavigation {
+ display: none;
+
+ }
+ .col-6 {
+ flex: 0 0 75%;
+ max-width: 75%;
+ padding-right: 0;
+ }
+}
+
+
+body:not(.section-controlpanel) {
+ .topics {
+ .header {
+ position: absolute;
+ width: @100ValuePercentage;
+ height: 115px;
+ display: flex;
+ justify-content: space-between;
+ top:0;
+ align-items: center;
+ // @media (max-width: 700px) {
+ // padding: 5px;
+ // }
+ img {
+ // @media (max-width: 700px) {
+ // width: 100%;
+ // margin-top: .5rem;
+ // }
+ // z-index: 1;
+ // position: relative;
+ // left: -6px;
+ }
+ a img {
+ // width: 750px;
+ // margin-top: 2rem;
+ }
+ }
+ }
+}
+
+.menu-open-contentpage,
+.menu-open-homepage {
+
+ .menu-underlay {
+
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ }
+
+}
+
+
+.homepage .tools {
+ z-index: 5;
+}
\ No newline at end of file
diff --git a/theme/site/collections/menu.variables b/theme/site/collections/menu.variables
new file mode 100644
index 0000000..416d1b3
--- /dev/null
+++ b/theme/site/collections/menu.variables
@@ -0,0 +1,151 @@
+/*******************************
+ Menu
+*******************************/
+
+/*-------------------
+ Collection
+--------------------*/
+
+/* Menu */
+
+
+/* Menu Item */
+@itemTextColor: @grey;
+
+/* Divider */
+
+/* Sub Menu */
+
+/* Text Item */
+
+
+/*--------------
+ Elements
+---------------*/
+
+/* Icon */
+@iconMargin: 0em @relative5px 0em @relative5px;
+
+/* Dropdown Icon */
+
+/* Header */
+
+/* Vertical Icon */
+@verticalIconFloat: none;
+
+/* Vertical Header */
+
+/* Pointing Arrow */
+
+
+/*--------------
+ Couplings
+---------------*/
+
+/* Button */
+
+/* Input */
+
+/* Image */
+
+/* Label */
+
+/* Dropdown in Menu */
+
+/* Dropdown Variations */
+
+
+/*--------------
+ States
+---------------*/
+
+/* Hovered Item */
+@hoverItemBackground: none;
+
+/* Pressed Item */
+@pressedItemBackground: none;
+
+/* Active Item */
+@activeItemBackground: none;
+
+/* Active Hovered Item */
+
+/* Selected Dropdown */
+
+/* Active Dropdown */
+
+/* Active Sub Menu */
+
+
+/*--------------
+ Types
+---------------*/
+
+/* Vertical */
+
+/* Secondary */
+
+/* Pointing */
+@secondaryPointingBorderWidth: 4px;
+@secondaryPointingItemHorizontalPadding: @relativeMini;
+
+@secondaryPointingActiveBorderColor: @pink;
+@secondaryPointingActiveTextColor: @black;
+@secondaryPointingActiveFontWeight: @normal;
+
+@secondaryPointingActiveDropdownBorderColor: transparent;
+
+/* Inverted Secondary */
+
+/* Inverted Pointing */
+
+/* Tiered */
+
+/* Icon */
+@iconMenuItemColor: @grey;
+
+/* Tabular */
+
+/* Pagination */
+
+/* Labeled Icon */
+
+/* Text */
+
+
+/*--------------
+ Variations
+---------------*/
+
+/* Inverted */
+
+/* Inverted Sub Menu */
+
+/* Inverted Hover */
+
+/* Pressed */
+
+/* Inverted Active */
+
+/* Inverted Active Hover */
+
+/* Inverted Menu Divider */
+
+/* Inverted Colored */
+
+/* Fixed */
+
+/* Floated */
+
+/* Attached */
+
+/* Resize large sizes */
+@mini: @9px;
+@huge: @16px;
+@big: @17px;
+
+/* Sizes */
+@miniWidth: 6rem;
+@mediumWidth: 6rem;
+@hugeWidth: 20rem;
+@bigWidth: 22rem;
diff --git a/theme/site/collections/message.overrides b/theme/site/collections/message.overrides
new file mode 100644
index 0000000..76a01a2
--- /dev/null
+++ b/theme/site/collections/message.overrides
@@ -0,0 +1,16 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.message .content {
+ font-size: @12px;
+}
+
+.ui.icon.message > .icon:not(.close) {
+ align-self: flex-start;
+ margin-top: -7px;
+}
+
+.ui.attached.message {
+ margin: 0;
+}
diff --git a/theme/site/collections/message.variables b/theme/site/collections/message.variables
new file mode 100644
index 0000000..fd74517
--- /dev/null
+++ b/theme/site/collections/message.variables
@@ -0,0 +1,41 @@
+/*******************************
+ Message
+*******************************/
+
+/*-------------------
+ Elements
+--------------------*/
+
+@verticalPadding: 1.5em;
+@borderRadius: 0;
+@borderWidth: 0;
+
+/* Header */
+@headerParagraphDistance: 0.15em;
+
+/* Paragraph */
+
+/* List */
+
+/* Icon */
+@iconDistance: 0.3em;
+
+/* Close Icon */
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Icon Message */
+@iconSize: 2em;
+@iconVerticalAlign: top;
+
+/* Attached */
+@attachedXOffset: 0;
+@attachedYOffset: 0;
+
+/* Floating */
+
+/* Colors */
+
+/* Warning / Positive / Negative / Info */
diff --git a/theme/site/collections/table.overrides b/theme/site/collections/table.overrides
new file mode 100644
index 0000000..3313274
--- /dev/null
+++ b/theme/site/collections/table.overrides
@@ -0,0 +1,54 @@
+.ui.table {
+ border: 1px double #d9d9d9;
+
+ th.selected,
+ td.selected {
+ border: solid 1px rgba(120, 192, 215, 1) !important;
+ }
+}
+
+.ui.table td,
+.ui.table th {
+ text-align: left;
+ padding: .6em;
+}
+
+/* Headers */
+.ui.table th {
+ cursor: auto;
+ // background: @headerBackground;
+ text-align: @headerAlign;
+ // color: @headerColor;
+ /* padding: @headerVerticalPadding @headerHorizontalPadding; */
+ vertical-align: @headerVerticalAlign;
+ font-style: @headerFontStyle;
+ font-weight: @headerFontWeight;
+ text-transform: @headerTextTransform;
+ border-left: @headerDivider;
+}
+
+.ui.table {
+ border-collapse: collapse;
+}
+
+.ui.table tr > th {
+ font-weight: 700;
+}
+
+.ui.celled.table tr th, .ui.celled.table tr td {
+ border: 1px solid #d9d9d9;
+}
+
+.ui.table tr > th:first-child {
+ border-left: none;
+}
+
+.ui.table tr:first-child > th:first-child {
+ border-radius: @borderRadius 0em 0em 0em;
+}
+.ui.table tr:first-child > th:last-child {
+ border-radius: 0em @borderRadius 0em 0em;
+}
+.ui.table tr:first-child > th:only-child {
+ border-radius: @borderRadius @borderRadius 0em 0em;
+}
diff --git a/theme/site/collections/table.variables b/theme/site/collections/table.variables
new file mode 100644
index 0000000..0c8e121
--- /dev/null
+++ b/theme/site/collections/table.variables
@@ -0,0 +1,244 @@
+/*******************************
+ Table
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+@verticalMargin : 1em;
+@horizontalMargin: 0em;
+@margin : @verticalMargin @horizontalMargin;
+@borderCollapse : separate;
+@borderSpacing : 0px;
+@borderRadius : @defaultBorderRadius;
+@transition : background @defaultDuration @defaultEasing,
+ color @defaultDuration @defaultEasing;
+@background : @white;
+@color : @textColor;
+@borderWidth : 1px;
+@border : @borderWidth solid @borderColor;
+@boxShadow : none;
+@textAlign : left;
+@internalBorderColor: transparent;
+
+/*--------------
+ Parts
+---------------*/
+
+/* Table Row */
+@rowBorder: 1px solid @internalBorderColor;
+
+/* Table Cell */
+@cellVerticalPadding : @relativeMini;
+@cellHorizontalPadding: @relativeMini;
+@cellVerticalAlign : inherit;
+@cellTextAlign : inherit;
+@cellBorder : 1px solid @internalBorderColor;
+
+/* Table Header */
+@headerBorder : 1px solid @internalBorderColor;
+@headerDivider : none;
+@headerBackground : @primaryColor;
+@headerAlign : inherit;
+@headerVerticalAlign : inherit;
+@headerColor : @white;
+@headerVerticalPadding : @relativeSmall;
+@headerHorizontalPadding: @cellHorizontalPadding;
+@headerFontStyle : none;
+@headerFontWeight : 400;
+@headerTextTransform : none;
+@headerBoxShadow : none;
+
+/* Table Footer */
+@footerBoxShadow : none;
+@footerBorder : 1px solid @borderColor;
+@footerDivider : none;
+@footerBackground : @offWhite;
+@footerAlign : inherit;
+@footerVerticalAlign : middle;
+@footerColor : @textColor;
+@footerVerticalPadding : @cellVerticalPadding;
+@footerHorizontalPadding: @cellHorizontalPadding;
+@footerFontStyle : @normal;
+@footerFontWeight : @normal;
+@footerTextTransform : none;
+
+/* Responsive Size */
+@responsiveHeaderDisplay : block;
+@responsiveFooterDisplay : block;
+@responsiveRowVerticalPadding : 1em;
+@responsiveRowBoxShadow : 0px -1px 0px 0px rgba(0, 0, 0, 0.1) inset !important;
+@responsiveCellVerticalPadding : 0.25em;
+@responsiveCellHorizontalPadding: 0.75em;
+@responsiveCellBoxShadow : none !important;
+@responsiveCellHeaderFontWeight : @bold;
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Definition */
+@definitionPageBackground: @white;
+
+@definitionHeaderBackground: transparent;
+@definitionHeaderColor : @unselectedTextColor;
+@definitionHeaderFontWeight: @normal;
+
+@definitionFooterBackground: @definitionHeaderBackground;
+@definitionFooterColor : @definitionHeaderColor;
+@definitionFooterFontWeight: @definitionHeaderFontWeight;
+
+@definitionColumnBackground : @subtleTransparentBlack;
+@definitionColumnFontWeight : @bold;
+@definitionColumnColor : @selectedTextColor;
+@definitionColumnFontSize : @relativeMedium;
+@definitionColumnTextTransform : '';
+@definitionColumnBoxShadow : '';
+@definitionColumnTextAlign : '';
+@definitionColumnHorizontalPadding: '';
+
+
+/*--------------
+ Couplings
+---------------*/
+
+@iconVerticalAlign: baseline;
+
+/*--------------
+ States
+---------------*/
+
+@stateMarkerWidth: 0px;
+
+/* Positive */
+@positiveColor : @positiveTextColor;
+@positiveBoxShadow : @stateMarkerWidth 0px 0px @positiveBorderColor inset;
+@positiveBackgroundHover: darken(@positiveBackgroundColor, 3);
+@positiveColorHover : darken(@positiveColor, 3);
+
+/* Negative */
+@negativeColor : @negativeTextColor;
+@negativeBoxShadow : @stateMarkerWidth 0px 0px @negativeBorderColor inset;
+@negativeBackgroundHover: darken(@negativeBackgroundColor, 3);
+@negativeColorHover : darken(@negativeColor, 3);
+
+/* Error */
+@errorColor : @errorTextColor;
+@errorBoxShadow : @stateMarkerWidth 0px 0px @errorBorderColor inset;
+@errorBackgroundHover: darken(@errorBackgroundColor, 3);
+@errorColorHover : darken(@errorColor, 3);
+
+/* Warning */
+@warningColor : @warningTextColor;
+@warningBoxShadow : @stateMarkerWidth 0px 0px @warningBorderColor inset;
+@warningBackgroundHover: darken(@warningBackgroundColor, 3);
+@warningColorHover : darken(@warningColor, 3);
+
+/* Active */
+@activeColor : @textColor;
+@activeBackgroundColor: #E0E0E0;
+@activeBoxShadow : @stateMarkerWidth 0px 0px @activeColor inset;
+
+@activeBackgroundHover: #EFEFEF;
+@activeColorHover : @selectedTextColor;
+
+/*--------------
+ Types
+---------------*/
+
+/* Attached */
+@attachedTopOffset : 0px;
+@attachedBottomOffset : 0px;
+@attachedHorizontalOffset: -@borderWidth;
+@attachedWidth : calc(100% - (@attachedHorizontalOffset * 2));
+@attachedBoxShadow : none;
+@attachedBorder : @borderWidth solid @solidBorderColor;
+@attachedBottomBoxShadow : @boxShadow,
+ @attachedBoxShadow;
+
+/* Striped */
+@stripedBackground : rgba(0, 0, 50, 0.02);
+@invertedStripedBackground: rgba(255, 255, 255, 0.05);
+
+/* Selectable */
+@selectableBackground : @transparentBlack;
+@selectableTextColor : @selectedTextColor;
+@selectableInvertedBackground: @transparentWhite;
+@selectableInvertedTextColor : @invertedSelectedTextColor;
+
+/* Sortable */
+@sortableBackground: '';
+@sortableColor : @textColor;
+
+@sortableBorder : 1px solid @borderColor;
+@sortableIconWidth : auto;
+@sortableIconDistance : 0.5em;
+@sortableIconOpacity : 0.8;
+@sortableIconFont : 'Icons';
+@sortableIconAscending : '\f0d8';
+@sortableIconDescending: '\f0d7';
+@sortableDisabledColor : @disabledTextColor;
+
+@sortableHoverBackground: @transparentBlack;
+@sortableHoverColor : @hoveredTextColor;
+
+@sortableActiveBackground: @transparentBlack;
+@sortableActiveColor : @selectedTextColor;
+
+@sortableActiveHoverBackground: @transparentBlack;
+@sortableActiveHoverColor : @selectedTextColor;
+
+@sortableInvertedBorderColor : transparent;
+@sortableInvertedHoverBackground : @transparentWhite @subtleGradient;
+@sortableInvertedHoverColor : @invertedHoveredTextColor;
+@sortableInvertedActiveBackground: @strongTransparentWhite @subtleGradient;
+@sortableInvertedActiveColor : @invertedSelectedTextColor;
+
+/* Colors */
+@coloredBorderSize : 0.2em;
+@coloredBorderRadius: 0em 0em @borderRadius @borderRadius;
+
+/* Inverted */
+@invertedBackground : #333333;
+@invertedBorder : none;
+@invertedCellBorderColor: @whiteBorderColor;
+@invertedCellColor : @invertedTextColor;
+
+@invertedHeaderBackground : @veryStrongTransparentBlack;
+@invertedHeaderColor : @invertedTextColor;
+@invertedHeaderBorderColor: @invertedCellBorderColor;
+
+@invertedDefinitionColumnBackground: @subtleTransparentWhite;
+@invertedDefinitionColumnColor : @invertedSelectedTextColor;
+@invertedDefinitionColumnFontWeight: @bold;
+
+/* Basic */
+@basicTableBackground: transparent;
+@basicTableBorder : @borderWidth solid @borderColor;
+@basicBoxShadow : none;
+
+@basicTableHeaderBackground : transparent;
+@basicTableCellBackground : transparent;
+@basicTableHeaderDivider : none;
+@basicTableCellBorder : 1px solid rgba(0, 0, 0, 0.1);
+@basicTableCellPadding : '';
+@basicTableStripedBackground: @transparentBlack;
+
+/* Padded */
+@paddedVerticalPadding : 1em;
+@paddedHorizontalPadding : 1em;
+@veryPaddedVerticalPadding : 1.5em;
+@veryPaddedHorizontalPadding: 1.5em;
+
+/* Compact */
+@compactVerticalPadding : 0.5em;
+@compactHorizontalPadding : 0.7em;
+@veryCompactVerticalPadding : 0.4em;
+@veryCompactHorizontalPadding: 0.6em;
+
+
+/* Sizes */
+@small: 0.9em;
+@medium: 1em;
+@large: 1.1em;
\ No newline at end of file
diff --git a/theme/site/elements/button.overrides b/theme/site/elements/button.overrides
new file mode 100644
index 0000000..c7fb0ec
--- /dev/null
+++ b/theme/site/elements/button.overrides
@@ -0,0 +1,90 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.circular.icon.button {
+ padding: 0.75em 0.25em 0;
+
+ .icon {
+ font-size: 2em;
+ }
+}
+
+.searchbox.field>.ui.action.input>.icon.button {
+ padding-top: 0;
+ padding-right: 0;
+ background: none;
+ color: @blue;
+ line-height: 1.6;
+
+ &:hover {
+ background: none;
+ }
+
+ .icon {
+ font-weight: bold;
+ }
+}
+
+.ui.basic.button {
+ padding: 0;
+ border: 0;
+ background: transparent;
+ cursor: pointer;
+ text-align: initial;
+
+ &:focus {
+ outline: none;
+ }
+}
+
+.ui.basic.primary.button,
+.ui.basic.secondary.button {
+ box-shadow: none !important;
+
+ &:hover {
+ box-shadow: none !important;
+ }
+}
+
+.ui.basic.secondary.button {
+ color: @brown !important;
+}
+
+.ui.noborder.button {
+ padding: 0 !important;
+ border: 0;
+ background: transparent;
+ cursor: pointer;
+ text-align: initial;
+
+ &:focus {
+ outline: none;
+ }
+}
+
+.ui.noborder.button:not(.icon)>.icon:not(.button):not(.dropdown) {
+ margin: 0;
+}
+
+.ck-editor-toolbar {
+ .ck-toolbar {
+ font-size: 14px !important;
+ display: flex;
+ justify-content: center;
+ border-radius: 4px !important;
+ border: none !important;
+ }
+
+
+ .ck-rounded-corners .ck.ck-button,
+ .ck-rounded-corners a.ck.ck-button,
+ .ck.ck-button.ck-rounded-corners,
+ a.ck.ck-button.ck-rounded-corners {
+ background-color: white !important;
+ }
+
+ .ck-focused {
+ box-shadow: none !important;
+ }
+}
\ No newline at end of file
diff --git a/theme/site/elements/button.variables b/theme/site/elements/button.variables
new file mode 100644
index 0000000..d389c99
--- /dev/null
+++ b/theme/site/elements/button.variables
@@ -0,0 +1,101 @@
+/*******************************
+ Button
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+/* Button */
+
+/* Text */
+
+/* Internal Shadow */
+
+/* Box Shadow */
+
+/* Icon */
+
+/* Loader */
+
+
+/*-------------------
+ Group
+--------------------*/
+
+
+/*-------------------
+ States
+--------------------*/
+
+/* Hovered */
+
+/* Focused */
+
+/* Disabled */
+
+/* Pressed Down */
+
+/* Active */
+
+/* Active + Hovered */
+
+/* Loading */
+
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Or */
+
+/* Icon */
+
+/* Labeled */
+
+/* Labeled Icon */
+
+/* Inverted */
+
+/* Basic */
+@basicBorderSize: @2px;
+@basicColoredBorderSize: @2px;
+
+@basicBoxShadow: 0px 0px 0px @basicBorderSize @textColor inset;
+
+/* Basic Hover */
+@basicHoverBoxShadow:
+ 0px 0px 0px @basicBorderSize @textColor inset,
+ 0px 0px 0px 0px @borderColor inset
+;
+/* Basic Focus */
+
+/* Basic Down */
+
+/* Basic Active */
+
+/* Basic Inverted */
+
+/* Basic Group */
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Colors */
+
+/* Colored */
+
+/* Inverted */
+
+/* Ordinality */
+
+/* Compact */
+
+/* Attached */
+
+/* Floated */
+@floatedMargin: 1.25em;
+
+/* Animated */
diff --git a/theme/site/elements/container.overrides b/theme/site/elements/container.overrides
new file mode 100644
index 0000000..fbf3f84
--- /dev/null
+++ b/theme/site/elements/container.overrides
@@ -0,0 +1,426 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+@toolbarWidth : 80px;
+@sidebarWidth : 375px;
+@collapsedWidth: 20px;
+
+/* All Sizes */
+.ui.container {
+ display: block;
+ max-width: 1700px !important;
+}
+
+.contentWidthMedia(@width, @gutter, @offset) {
+ .ui.container {
+ width: 100% !important;
+ margin-right: @gutter !important;
+ margin-left: @gutter !important;
+ padding-left: 2rem;
+ padding-right: 2rem;
+ }
+
+ .drag.handle.wrapper {
+ margin-left: @offset !important;
+ }
+
+ .block .delete-button {
+ margin-right: @offset !important;
+ }
+}
+
+// ~768
+.contentWidth(@offset) {
+
+ @media only screen and (max-width: @largestMobileScreen + @offset) {
+ .contentWidthMedia(@mobileWidth, @mobileGutter, -12px);
+
+ .ui.container {
+ padding-left: 0 !important;
+ padding-right: 0 !important;
+ }
+
+ .nav-actions {
+ position: relative;
+ justify-content: flex-end;
+ padding-right: 0;
+ }
+
+
+ .thematic-areas {
+ margin-left: 0;
+ margin-right: 0;
+ }
+
+ .sticky-outer-wrapper.active {
+ nav.navigation {
+ top: 0;
+ right: auto;
+ left: 0;
+ }
+ }
+
+ // .image-gallery-left-nav,
+ // .image-gallery-right-nav {
+ // bottom: 0 !important;
+ // }
+
+
+ .searchbox {
+ svg,
+ .accountIcon {
+ height: 24px !important;
+ }
+ }
+
+ .nav-actions {
+ position: relative;
+ justify-content: flex-end;
+ padding-right: 0;
+ }
+
+ .tools {
+ .accountIcon {
+ height: 24px !important;
+ }
+ }
+
+ .header .nav-actions {
+ bottom: 11px;
+ top: unset;
+ }
+
+ }
+
+
+ // 1200
+ @media (max-width: @largestTabletScreen + @offset) {
+ .contentWidthMedia(@tabletWidth, @tabletGutter, -30px);
+
+
+ .slider-wrapper .slider-slide .slide-img {
+ height: 550px;
+ }
+
+ .slider-wrapper {
+ height: 550px;
+ }
+
+ .content-area main {
+ padding: 1rem 10px;
+ padding-bottom: 2rem;
+ }
+
+ &.mosaic-view {
+ .content-area main {
+ padding: 0;
+ }
+ }
+
+
+ .footerWrapper {
+ .ui.grid {
+
+ margin: 0;
+ }
+ }
+
+ .image-gallery-thumbnails-wrapper {
+ display: none;
+ }
+
+ .slide-overlay {
+ border-bottom: none;
+ }
+
+ .image-gallery-left-nav {
+ left: unset;
+ right: 5rem;
+ bottom: -3.5rem!important;
+ }
+
+ .image-gallery-right-nav {
+ left: unset;
+ right: 1rem;
+ bottom: -3.5rem!important;
+ }
+
+ .searchInput {
+ width: 0 !important;
+
+ &.show {
+ width: 100% !important;
+ }
+ }
+
+ .logo-nav-wrapper {
+ justify-content: center;
+ align-items: center;
+
+ .logo {
+ flex-grow: 1;
+ }
+ }
+
+ .nav-actions-mobile {
+ margin: 0 1rem;
+
+ .searchInput {
+ background: transparent;
+
+ &.show {
+ background: #F1F0EE;
+ }
+ }
+ }
+
+ .sticky-outer-wrapper.active {
+ .nav-actions-mobile {
+ margin: 0 1rem;
+
+ .searchInput {
+ background: transparent;
+
+ &.show {
+ background: white !important;
+ }
+ }
+ }
+ }
+
+ .ui.pointing.secondary.stackable.open.menu {
+ position: absolute;
+ background: white;
+ left: 0;
+ display: flex;
+ flex-direction: column;
+ right: 0;
+ box-shadow: 1px 1px 3px #13131361;
+ margin-top: 17px;
+
+ >.item.firstLevel {
+ width: 100%;
+ margin-right: 0 !important;
+ flex-direction: column;
+ text-align: left;
+ align-items: flex-start;
+
+ >a {
+ width: 100%;
+ }
+
+ &:hover {
+ >.menu {
+ position: relative;
+ }
+ }
+ }
+ }
+
+ }
+
+
+
+ // 1600
+
+ @media (max-width: @largestSmallMonitor + @offset) {
+ .contentWidthMedia(@computerWidth, @computerGutter, -30px);
+
+ }
+
+
+ // 1200+
+
+ @media only screen and (max-width: @largeMonitorBreakpoint + @offset) {
+ .contentWidthMedia(@largeMonitorWidth, @largeMonitorGutter, -30px);
+
+ }
+
+
+
+
+
+ @media only screen and (max-width: @widescreenMonitorBreakpoint + @offset) {
+ .contentWidthMedia(@widescreenMonitorWidth, @largeMonitorGutter, -30px);
+
+
+ }
+
+
+
+
+
+
+ // ONLY STUFF
+ @media only screen and (max-width: @largestMobileScreen + @offset) {
+ .contentWidthMedia(@mobileWidth, @mobileGutter, -12px);
+
+ [class*='mobile hidden'],
+ [class*='tablet only']:not(.mobile),
+ [class*='computer only']:not(.mobile),
+ [class*='large screen only']:not(.mobile),
+ [class*='widescreen only']:not(.mobile),
+ [class*='or lower hidden'] {
+ display: none !important;
+ }
+ }
+
+ @media only screen and (min-width: @tabletBreakpoint + @offset) and (max-width: @largestTabletScreen + @offset) {
+ .contentWidthMedia(@tabletWidth, @tabletGutter, -30px);
+
+ [class*='mobile only']:not(.tablet),
+ [class*='tablet hidden'],
+ [class*='computer only']:not(.tablet),
+ [class*='large screen only']:not(.tablet),
+ [class*='widescreen only']:not(.tablet),
+ [class*='or lower hidden']:not(.mobile) {
+ display: none !important;
+ }
+ }
+
+
+
+ @media only screen and (min-width: @computerBreakpoint + @offset) and (max-width: @largestSmallMonitor + @offset) {
+ .contentWidthMedia(@computerWidth, @computerGutter, -30px);
+
+ [class*='mobile only']:not(.computer),
+ [class*='tablet only']:not(.computer),
+ [class*='computer hidden'],
+ [class*='large screen only']:not(.computer),
+ [class*='widescreen only']:not(.computer),
+ [class*='or lower hidden']:not(.tablet):not(.mobile) {
+ display: none !important;
+ }
+ }
+
+ @media only screen and (min-width: @largeMonitorBreakpoint + @offset) {
+ .contentWidthMedia(@largeMonitorWidth, @largeMonitorGutter, -30px);
+
+ [class*='mobile only']:not([class*='large screen']),
+ [class*='tablet only']:not([class*='large screen']),
+ [class*='computer only']:not([class*='large screen']),
+ [class*='large screen hidden'],
+ [class*='widescreen only']:not([class*='large screen']),
+ [class*='or lower hidden']:not(.computer):not(.tablet):not(.mobile) {
+ display: none !important;
+ }
+ }
+}
+
+body:not(.has-toolbar):not(.has-sidebar):not(.has-toolbar-collapsed):not(.has-sidebar-collapsed) {
+ .contentWidth(0);
+}
+
+body.has-toolbar:not(.has-sidebar):not(.has-sidebar-collapsed) {
+ // .contentWidth(@toolbarWidth);
+ .contentWidth(0);
+
+}
+
+body.has-toolbar.has-sidebar {
+ // .contentWidth(@toolbarWidth + @sidebarWidth);
+ .contentWidth(0);
+
+}
+
+body.has-toolbar.has-sidebar-collapsed {
+ // .contentWidth(@toolbarWidth + @collapsedWidth);
+ .contentWidth(0);
+
+}
+
+body.has-toolbar-collapsed:not(.has-sidebar):not(.has-sidebar-collapsed) {
+ // .contentWidth(@collapsedWidth);
+ .contentWidth(0);
+
+}
+
+body.has-toolbar-collapsed.has-sidebar {
+ // .contentWidth(@collapsedWidth + @sidebarWidth);
+ .contentWidth(0);
+
+}
+
+body.has-toolbar-collapsed.has-sidebar-collapsed {
+ // .contentWidth(@collapsedWidth + @collapsedWidth);
+ .contentWidth(0);
+
+}
+
+
+// body.has-toolbar:not(.has-sidebar):not(.has-sidebar-collapsed) {
+// .contentWidth(0);
+// }
+
+// body.has-toolbar.has-sidebar {
+// .contentWidth(0);
+// }
+
+// body.has-toolbar.has-sidebar-collapsed {
+// .contentWidth(0);
+// }
+
+// body.has-toolbar-collapsed:not(.has-sidebar):not(.has-sidebar-collapsed) {
+// .contentWidth(0);
+// }
+
+// body.has-toolbar-collapsed.has-sidebar {
+// .contentWidth(0);
+// }
+
+// body.has-toolbar-collapsed.has-sidebar-collapsed {
+// .contentWidth(0);
+// }
+
+.drag.handle.wrapper {
+ margin-left: -15px !important;
+}
+
+.block .delete-button {
+ margin-right: -25px !important;
+}
+
+/* Hack for escape the blocks container in blocks full width */
+.full-width {
+ position: relative;
+ right: 50%;
+ left: 50%;
+ width: 100vw !important;
+ max-width: initial !important;
+ margin-right: -50vw !important;
+ margin-left: -50vw !important;
+}
+
+body.view-editview {
+
+ @media only screen and (min-width: @computerBreakpoint) and (max-width: @largestSmallMonitor) {
+
+ [class*='mobile only']:not(.computer),
+ [class*='tablet only']:not(.computer),
+ [class*='large screen hidden'],
+ [class*='large screen only']:not(.computer),
+ [class*='widescreen only']:not(.computer),
+ [class*='or lower hidden']:not(.tablet):not(.mobile) {
+ display: none !important;
+ }
+ }
+
+
+}
+
+
+
+ // Hotfix because we can't really do anything else for this situation
+ @media only screen and (min-width: 1200px) and (max-width: 1219px) {
+ body.has-toolbar-collapsed .hamburger-wrapper.computer.hidden.large.screen.hidden.widescreen.hidden {
+ display: block!important;
+ }
+ }
+
+ @media only screen and (min-width: 1200px) and (max-width: 1279px) {
+ body.has-toolbar .hamburger-wrapper.computer.hidden.large.screen.hidden.widescreen.hidden {
+ display: block!important;
+ }
+ }
+
diff --git a/theme/site/elements/container.variables b/theme/site/elements/container.variables
new file mode 100644
index 0000000..431ae2c
--- /dev/null
+++ b/theme/site/elements/container.variables
@@ -0,0 +1,97 @@
+/*******************************
+ Container
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+/* Devices */
+
+/* Coupling (Add Negative Margin to container size) */
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Text */
+@textWidth: 376px;
+
+
+
+/*******************************
+ Container
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+/* Minimum Gutter is used to determine the maximum container width for a given device */
+
+@maxWidth: 100%;
+
+/* Devices */
+@mobileMinimumGutter: 0em;
+@mobileWidth: auto;
+@mobileGutter: auto;
+
+@tabletMinimumGutter: (@emSize * 1);
+@tabletWidth: @tabletBreakpoint - (@tabletMinimumGutter * 2) - @scrollbarWidth;
+@tabletGutter: auto;
+
+@computerMinimumGutter: (@emSize * 1.5);
+@computerWidth: @computerBreakpoint - (@computerMinimumGutter * 2) - @scrollbarWidth;
+@computerGutter: auto;
+
+@largeMonitorMinimumGutter: (@emSize * 2);
+@largeMonitorWidth: @largeMonitorBreakpoint - (@largeMonitorMinimumGutter * 2) - @scrollbarWidth;
+@largeMonitorGutter: auto;
+
+
+@widescreenlaptopWidth: @widescreenlaptopBreakpoint - (@largeMonitorMinimumGutter * 2) - @scrollbarWidth;
+@widescreenlaptopBigWidth: @widescreenlaptopBigBreakpoint - (@largeMonitorMinimumGutter * 2) - @scrollbarWidth;
+@widescreenmonitorSmallWidth: @widescreenmonitorSmallBreakpoint - (@largeMonitorMinimumGutter * 2) - @scrollbarWidth;
+@widescreenMonitorWidth: @widescreenMonitorBreakpoint - (@largeMonitorMinimumGutter * 2) - @scrollbarWidth;
+
+
+@widescreenlaptopGridWidth: ~"calc("@widescreenlaptopWidth~" + "@gridGutterWidth~")";
+@widescreenlaptopBigGridWidth: ~"calc("@widescreenlaptopBigWidth~" + "@gridGutterWidth~")";
+@widescreenmonitorSmallGridWidth: ~"calc("@widescreenmonitorSmallWidth~" + "@gridGutterWidth~")";
+@widescreenMonitorGridWidth: ~"calc("@widescreenMonitorWidth~" + "@gridGutterWidth~")";
+
+/* Coupling (Add Negative Margin to container size) */
+@gridGutterWidth: 2rem;
+@relaxedGridGutterWidth: 3rem;
+@veryRelaxedGridGutterWidth: 5rem;
+
+@mobileGridWidth: @mobileWidth;
+@tabletGridWidth: ~"calc("@tabletWidth~" + "@gridGutterWidth~")";
+@computerGridWidth: ~"calc("@computerWidth~" + "@gridGutterWidth~")";
+@largeMonitorGridWidth: ~"calc("@largeMonitorWidth~" + "@gridGutterWidth~")";
+
+
+@mobileRelaxedGridWidth: @mobileWidth;
+@tabletRelaxedGridWidth: ~"calc("@tabletWidth~" + "@relaxedGridGutterWidth~")";
+@computerRelaxedGridWidth: ~"calc("@computerWidth~" + "@relaxedGridGutterWidth~")";
+@largeMonitorRelaxedGridWidth: ~"calc("@largeMonitorWidth~" + "@relaxedGridGutterWidth~")";
+
+@mobileVeryRelaxedGridWidth: @mobileWidth;
+@tabletVeryRelaxedGridWidth: ~"calc("@tabletWidth~" + "@veryRelaxedGridGutterWidth~")";
+@computerVeryRelaxedGridWidth: ~"calc("@computerWidth~" + "@veryRelaxedGridGutterWidth~")";
+@largeMonitorVeryRelaxedGridWidth: ~"calc("@largeMonitorWidth~" + "@veryRelaxedGridGutterWidth~")";
+
+
+
+// @largerMonitorBreakpoint: 1440px;
+// @largerMonitorWidth: 1400px;
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Text */
+@textWidth: 700px;
+@textFontFamily: @pageFont;
+@textLineHeight: 1.5;
+@textSize: @large;
\ No newline at end of file
diff --git a/theme/site/elements/divider.overrides b/theme/site/elements/divider.overrides
new file mode 100644
index 0000000..aa3a701
--- /dev/null
+++ b/theme/site/elements/divider.overrides
@@ -0,0 +1,17 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.horizontal.divider:before,
+.ui.horizontal.divider:after {
+ background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC');
+}
+
+@media only screen and (max-width: (@tabletBreakpoint - 1px)) {
+ .ui.stackable.grid .ui.vertical.divider:before,
+ .ui.grid .stackable.row .ui.vertical.divider:before,
+ .ui.stackable.grid .ui.vertical.divider:after,
+ .ui.grid .stackable.row .ui.vertical.divider:after {
+ background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAABaAAAAACCAYAAACuTHuKAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyFpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChXaW5kb3dzKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1OThBRDY4OUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1OThBRDY4QUNDMTYxMUU0OUE3NUVGOEJDMzMzMjE2NyI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjU5OEFENjg3Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjU5OEFENjg4Q0MxNjExRTQ5QTc1RUY4QkMzMzMyMTY3Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+VU513gAAADVJREFUeNrs0DENACAQBDBIWLGBJQby/mUcJn5sJXQmOQMAAAAAAJqt+2prAAAAAACg2xdgANk6BEVuJgyMAAAAAElFTkSuQmCC');
+ }
+}
diff --git a/theme/site/elements/divider.variables b/theme/site/elements/divider.variables
new file mode 100644
index 0000000..21f56d4
--- /dev/null
+++ b/theme/site/elements/divider.variables
@@ -0,0 +1,29 @@
+/*******************************
+ Divider
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+/* Text */
+
+
+/*-------------------
+ Coupling
+--------------------*/
+
+/* Icon */
+
+
+/*******************************
+ Variations
+*******************************/
+
+/* Horizontal / Vertical */
+
+/* Inverted */
+
+/* Section */
+
+/* Sizes */
diff --git a/theme/site/elements/flag.overrides b/theme/site/elements/flag.overrides
new file mode 100644
index 0000000..dfda4b7
--- /dev/null
+++ b/theme/site/elements/flag.overrides
@@ -0,0 +1,1229 @@
+/* Flag Sprite Based On http://www.famfamfam.com/lab/icons/flags/ */
+
+/*******************************
+ Theme Overrides
+*******************************/
+
+i.flag.ad:before,
+i.flag.andorra:before {
+ background-position: 0 0;
+}
+
+i.flag.ae:before,
+i.flag.united.arab.emirates:before,
+i.flag.uae:before {
+ background-position: 0 -26px;
+}
+
+i.flag.af:before,
+i.flag.afghanistan:before {
+ background-position: 0 -52px;
+}
+
+i.flag.ag:before,
+i.flag.antigua:before {
+ background-position: 0 -78px;
+}
+
+i.flag.ai:before,
+i.flag.anguilla:before {
+ background-position: 0 -104px;
+}
+
+i.flag.al:before,
+i.flag.albania:before {
+ background-position: 0 -130px;
+}
+
+i.flag.am:before,
+i.flag.armenia:before {
+ background-position: 0 -156px;
+}
+
+i.flag.an:before,
+i.flag.netherlands.antilles:before {
+ background-position: 0 -182px;
+}
+
+i.flag.ao:before,
+i.flag.angola:before {
+ background-position: 0 -208px;
+}
+
+i.flag.ar:before,
+i.flag.argentina:before {
+ background-position: 0 -234px;
+}
+
+i.flag.as:before,
+i.flag.american.samoa:before {
+ background-position: 0 -260px;
+}
+
+i.flag.at:before,
+i.flag.austria:before {
+ background-position: 0 -286px;
+}
+
+i.flag.au:before,
+i.flag.australia:before {
+ background-position: 0 -312px;
+}
+
+i.flag.aw:before,
+i.flag.aruba:before {
+ background-position: 0 -338px;
+}
+
+i.flag.ax:before,
+i.flag.aland.islands:before {
+ background-position: 0 -364px;
+}
+
+i.flag.az:before,
+i.flag.azerbaijan:before {
+ background-position: 0 -390px;
+}
+
+i.flag.ba:before,
+i.flag.bosnia:before {
+ background-position: 0 -416px;
+}
+
+i.flag.bb:before,
+i.flag.barbados:before {
+ background-position: 0 -442px;
+}
+
+i.flag.bd:before,
+i.flag.bangladesh:before {
+ background-position: 0 -468px;
+}
+
+i.flag.be:before,
+i.flag.belgium:before {
+ background-position: 0 -494px;
+}
+
+i.flag.bf:before,
+i.flag.burkina.faso:before {
+ background-position: 0 -520px;
+}
+
+i.flag.bg:before,
+i.flag.bulgaria:before {
+ background-position: 0 -546px;
+}
+
+i.flag.bh:before,
+i.flag.bahrain:before {
+ background-position: 0 -572px;
+}
+
+i.flag.bi:before,
+i.flag.burundi:before {
+ background-position: 0 -598px;
+}
+
+i.flag.bj:before,
+i.flag.benin:before {
+ background-position: 0 -624px;
+}
+
+i.flag.bm:before,
+i.flag.bermuda:before {
+ background-position: 0 -650px;
+}
+
+i.flag.bn:before,
+i.flag.brunei:before {
+ background-position: 0 -676px;
+}
+
+i.flag.bo:before,
+i.flag.bolivia:before {
+ background-position: 0 -702px;
+}
+
+i.flag.br:before,
+i.flag.brazil:before {
+ background-position: 0 -728px;
+}
+
+i.flag.bs:before,
+i.flag.bahamas:before {
+ background-position: 0 -754px;
+}
+
+i.flag.bt:before,
+i.flag.bhutan:before {
+ background-position: 0 -780px;
+}
+
+i.flag.bv:before,
+i.flag.bouvet.island:before {
+ background-position: 0 -806px;
+}
+
+i.flag.bw:before,
+i.flag.botswana:before {
+ background-position: 0 -832px;
+}
+
+i.flag.by:before,
+i.flag.belarus:before {
+ background-position: 0 -858px;
+}
+
+i.flag.bz:before,
+i.flag.belize:before {
+ background-position: 0 -884px;
+}
+
+i.flag.ca:before,
+i.flag.canada:before {
+ background-position: 0 -910px;
+}
+
+i.flag.cc:before,
+i.flag.cocos.islands:before {
+ background-position: 0 -962px;
+}
+
+i.flag.cd:before,
+i.flag.congo:before {
+ background-position: 0 -988px;
+}
+
+i.flag.cf:before,
+i.flag.central.african.republic:before {
+ background-position: 0 -1014px;
+}
+
+i.flag.cg:before,
+i.flag.congo.brazzaville:before {
+ background-position: 0 -1040px;
+}
+
+i.flag.ch:before,
+i.flag.switzerland:before {
+ background-position: 0 -1066px;
+}
+
+i.flag.ci:before,
+i.flag.cote.divoire:before {
+ background-position: 0 -1092px;
+}
+
+i.flag.ck:before,
+i.flag.cook.islands:before {
+ background-position: 0 -1118px;
+}
+
+i.flag.cl:before,
+i.flag.chile:before {
+ background-position: 0 -1144px;
+}
+
+i.flag.cm:before,
+i.flag.cameroon:before {
+ background-position: 0 -1170px;
+}
+
+i.flag.cn:before,
+i.flag.china:before {
+ background-position: 0 -1196px;
+}
+
+i.flag.co:before,
+i.flag.colombia:before {
+ background-position: 0 -1222px;
+}
+
+i.flag.cr:before,
+i.flag.costa.rica:before {
+ background-position: 0 -1248px;
+}
+
+i.flag.cs:before,
+i.flag.serbia:before {
+ background-position: 0 -1274px;
+}
+
+i.flag.cu:before,
+i.flag.cuba:before {
+ background-position: 0 -1300px;
+}
+
+i.flag.cv:before,
+i.flag.cape.verde:before {
+ background-position: 0 -1326px;
+}
+
+i.flag.cx:before,
+i.flag.christmas.island:before {
+ background-position: 0 -1352px;
+}
+
+i.flag.cy:before,
+i.flag.cyprus:before {
+ background-position: 0 -1378px;
+}
+
+i.flag.cz:before,
+i.flag.czech.republic:before {
+ background-position: 0 -1404px;
+}
+
+i.flag.de:before,
+i.flag.germany:before {
+ background-position: 0 -1430px;
+}
+
+i.flag.dj:before,
+i.flag.djibouti:before {
+ background-position: 0 -1456px;
+}
+
+i.flag.dk:before,
+i.flag.denmark:before {
+ background-position: 0 -1482px;
+}
+
+i.flag.dm:before,
+i.flag.dominica:before {
+ background-position: 0 -1508px;
+}
+
+i.flag.do:before,
+i.flag.dominican.republic:before {
+ background-position: 0 -1534px;
+}
+
+i.flag.dz:before,
+i.flag.algeria:before {
+ background-position: 0 -1560px;
+}
+
+i.flag.ec:before,
+i.flag.ecuador:before {
+ background-position: 0 -1586px;
+}
+
+i.flag.ee:before,
+i.flag.estonia:before {
+ background-position: 0 -1612px;
+}
+
+i.flag.eg:before,
+i.flag.egypt:before {
+ background-position: 0 -1638px;
+}
+
+i.flag.eh:before,
+i.flag.western.sahara:before {
+ background-position: 0 -1664px;
+}
+
+i.flag.er:before,
+i.flag.eritrea:before {
+ background-position: 0 -1716px;
+}
+
+i.flag.es:before,
+i.flag.spain:before {
+ background-position: 0 -1742px;
+}
+
+i.flag.et:before,
+i.flag.ethiopia:before {
+ background-position: 0 -1768px;
+}
+
+i.flag.eu:before,
+i.flag.european.union:before {
+ background-position: 0 -1794px;
+}
+
+i.flag.fi:before,
+i.flag.finland:before {
+ background-position: 0 -1846px;
+}
+
+i.flag.fj:before,
+i.flag.fiji:before {
+ background-position: 0 -1872px;
+}
+
+i.flag.fk:before,
+i.flag.falkland.islands:before {
+ background-position: 0 -1898px;
+}
+
+i.flag.fm:before,
+i.flag.micronesia:before {
+ background-position: 0 -1924px;
+}
+
+i.flag.fo:before,
+i.flag.faroe.islands:before {
+ background-position: 0 -1950px;
+}
+
+i.flag.fr:before,
+i.flag.france:before {
+ background-position: 0 -1976px;
+}
+
+i.flag.ga:before,
+i.flag.gabon:before {
+ background-position: -36px 0;
+}
+
+i.flag.gb:before,
+i.flag.united.kingdom:before {
+ background-position: -36px -26px;
+}
+
+i.flag.gd:before,
+i.flag.grenada:before {
+ background-position: -36px -52px;
+}
+
+i.flag.ge:before,
+i.flag.georgia:before {
+ background-position: -36px -78px;
+}
+
+i.flag.gf:before,
+i.flag.french.guiana:before {
+ background-position: -36px -104px;
+}
+
+i.flag.gh:before,
+i.flag.ghana:before {
+ background-position: -36px -130px;
+}
+
+i.flag.gi:before,
+i.flag.gibraltar:before {
+ background-position: -36px -156px;
+}
+
+i.flag.gl:before,
+i.flag.greenland:before {
+ background-position: -36px -182px;
+}
+
+i.flag.gm:before,
+i.flag.gambia:before {
+ background-position: -36px -208px;
+}
+
+i.flag.gn:before,
+i.flag.guinea:before {
+ background-position: -36px -234px;
+}
+
+i.flag.gp:before,
+i.flag.guadeloupe:before {
+ background-position: -36px -260px;
+}
+
+i.flag.gq:before,
+i.flag.equatorial.guinea:before {
+ background-position: -36px -286px;
+}
+
+i.flag.gr:before,
+i.flag.greece:before {
+ background-position: -36px -312px;
+}
+
+i.flag.gs:before,
+i.flag.sandwich.islands:before {
+ background-position: -36px -338px;
+}
+
+i.flag.gt:before,
+i.flag.guatemala:before {
+ background-position: -36px -364px;
+}
+
+i.flag.gu:before,
+i.flag.guam:before {
+ background-position: -36px -390px;
+}
+
+i.flag.gw:before,
+i.flag.guinea-bissau:before {
+ background-position: -36px -416px;
+}
+
+i.flag.gy:before,
+i.flag.guyana:before {
+ background-position: -36px -442px;
+}
+
+i.flag.hk:before,
+i.flag.hong.kong:before {
+ background-position: -36px -468px;
+}
+
+i.flag.hm:before,
+i.flag.heard.island:before {
+ background-position: -36px -494px;
+}
+
+i.flag.hn:before,
+i.flag.honduras:before {
+ background-position: -36px -520px;
+}
+
+i.flag.hr:before,
+i.flag.croatia:before {
+ background-position: -36px -546px;
+}
+
+i.flag.ht:before,
+i.flag.haiti:before {
+ background-position: -36px -572px;
+}
+
+i.flag.hu:before,
+i.flag.hungary:before {
+ background-position: -36px -598px;
+}
+
+i.flag.id:before,
+i.flag.indonesia:before {
+ background-position: -36px -624px;
+}
+
+i.flag.ie:before,
+i.flag.ireland:before {
+ background-position: -36px -650px;
+}
+
+i.flag.il:before,
+i.flag.israel:before {
+ background-position: -36px -676px;
+}
+
+i.flag.in:before,
+i.flag.india:before {
+ background-position: -36px -702px;
+}
+
+i.flag.io:before,
+i.flag.indian.ocean.territory:before {
+ background-position: -36px -728px;
+}
+
+i.flag.iq:before,
+i.flag.iraq:before {
+ background-position: -36px -754px;
+}
+
+i.flag.ir:before,
+i.flag.iran:before {
+ background-position: -36px -780px;
+}
+
+i.flag.is:before,
+i.flag.iceland:before {
+ background-position: -36px -806px;
+}
+
+i.flag.it:before,
+i.flag.italy:before {
+ background-position: -36px -832px;
+}
+
+i.flag.jm:before,
+i.flag.jamaica:before {
+ background-position: -36px -858px;
+}
+
+i.flag.jo:before,
+i.flag.jordan:before {
+ background-position: -36px -884px;
+}
+
+i.flag.jp:before,
+i.flag.japan:before {
+ background-position: -36px -910px;
+}
+
+i.flag.ke:before,
+i.flag.kenya:before {
+ background-position: -36px -936px;
+}
+
+i.flag.kg:before,
+i.flag.kyrgyzstan:before {
+ background-position: -36px -962px;
+}
+
+i.flag.kh:before,
+i.flag.cambodia:before {
+ background-position: -36px -988px;
+}
+
+i.flag.ki:before,
+i.flag.kiribati:before {
+ background-position: -36px -1014px;
+}
+
+i.flag.km:before,
+i.flag.comoros:before {
+ background-position: -36px -1040px;
+}
+
+i.flag.kn:before,
+i.flag.saint.kitts.and.nevis:before {
+ background-position: -36px -1066px;
+}
+
+i.flag.kp:before,
+i.flag.north.korea:before {
+ background-position: -36px -1092px;
+}
+
+i.flag.kr:before,
+i.flag.south.korea:before {
+ background-position: -36px -1118px;
+}
+
+i.flag.kw:before,
+i.flag.kuwait:before {
+ background-position: -36px -1144px;
+}
+
+i.flag.ky:before,
+i.flag.cayman.islands:before {
+ background-position: -36px -1170px;
+}
+
+i.flag.kz:before,
+i.flag.kazakhstan:before {
+ background-position: -36px -1196px;
+}
+
+i.flag.la:before,
+i.flag.laos:before {
+ background-position: -36px -1222px;
+}
+
+i.flag.lb:before,
+i.flag.lebanon:before {
+ background-position: -36px -1248px;
+}
+
+i.flag.lc:before,
+i.flag.saint.lucia:before {
+ background-position: -36px -1274px;
+}
+
+i.flag.li:before,
+i.flag.liechtenstein:before {
+ background-position: -36px -1300px;
+}
+
+i.flag.lk:before,
+i.flag.sri.lanka:before {
+ background-position: -36px -1326px;
+}
+
+i.flag.lr:before,
+i.flag.liberia:before {
+ background-position: -36px -1352px;
+}
+
+i.flag.ls:before,
+i.flag.lesotho:before {
+ background-position: -36px -1378px;
+}
+
+i.flag.lt:before,
+i.flag.lithuania:before {
+ background-position: -36px -1404px;
+}
+
+i.flag.lu:before,
+i.flag.luxembourg:before {
+ background-position: -36px -1430px;
+}
+
+i.flag.lv:before,
+i.flag.latvia:before {
+ background-position: -36px -1456px;
+}
+
+i.flag.ly:before,
+i.flag.libya:before {
+ background-position: -36px -1482px;
+}
+
+i.flag.ma:before,
+i.flag.morocco:before {
+ background-position: -36px -1508px;
+}
+
+i.flag.mc:before,
+i.flag.monaco:before {
+ background-position: -36px -1534px;
+}
+
+i.flag.md:before,
+i.flag.moldova:before {
+ background-position: -36px -1560px;
+}
+
+i.flag.me:before,
+i.flag.montenegro:before {
+ background-position: -36px -1586px;
+}
+
+i.flag.mg:before,
+i.flag.madagascar:before {
+ background-position: -36px -1613px;
+}
+
+i.flag.mh:before,
+i.flag.marshall.islands:before {
+ background-position: -36px -1639px;
+}
+
+i.flag.mk:before,
+i.flag.macedonia:before {
+ background-position: -36px -1665px;
+}
+
+i.flag.ml:before,
+i.flag.mali:before {
+ background-position: -36px -1691px;
+}
+
+i.flag.mm:before,
+i.flag.myanmar:before,
+i.flag.burma:before {
+ background-position: -73px -1821px;
+}
+
+i.flag.mn:before,
+i.flag.mongolia:before {
+ background-position: -36px -1743px;
+}
+
+i.flag.mo:before,
+i.flag.macau:before {
+ background-position: -36px -1769px;
+}
+
+i.flag.mp:before,
+i.flag.northern.mariana.islands:before {
+ background-position: -36px -1795px;
+}
+
+i.flag.mq:before,
+i.flag.martinique:before {
+ background-position: -36px -1821px;
+}
+
+i.flag.mr:before,
+i.flag.mauritania:before {
+ background-position: -36px -1847px;
+}
+
+i.flag.ms:before,
+i.flag.montserrat:before {
+ background-position: -36px -1873px;
+}
+
+i.flag.mt:before,
+i.flag.malta:before {
+ background-position: -36px -1899px;
+}
+
+i.flag.mu:before,
+i.flag.mauritius:before {
+ background-position: -36px -1925px;
+}
+
+i.flag.mv:before,
+i.flag.maldives:before {
+ background-position: -36px -1951px;
+}
+
+i.flag.mw:before,
+i.flag.malawi:before {
+ background-position: -36px -1977px;
+}
+
+i.flag.mx:before,
+i.flag.mexico:before {
+ background-position: -72px 0;
+}
+
+i.flag.my:before,
+i.flag.malaysia:before {
+ background-position: -72px -26px;
+}
+
+i.flag.mz:before,
+i.flag.mozambique:before {
+ background-position: -72px -52px;
+}
+
+i.flag.na:before,
+i.flag.namibia:before {
+ background-position: -72px -78px;
+}
+
+i.flag.nc:before,
+i.flag.new.caledonia:before {
+ background-position: -72px -104px;
+}
+
+i.flag.ne:before,
+i.flag.niger:before {
+ background-position: -72px -130px;
+}
+
+i.flag.nf:before,
+i.flag.norfolk.island:before {
+ background-position: -72px -156px;
+}
+
+i.flag.ng:before,
+i.flag.nigeria:before {
+ background-position: -72px -182px;
+}
+
+i.flag.ni:before,
+i.flag.nicaragua:before {
+ background-position: -72px -208px;
+}
+
+i.flag.nl:before,
+i.flag.netherlands:before {
+ background-position: -72px -234px;
+}
+
+i.flag.no:before,
+i.flag.norway:before {
+ background-position: -72px -260px;
+}
+
+i.flag.np:before,
+i.flag.nepal:before {
+ background-position: -72px -286px;
+}
+
+i.flag.nr:before,
+i.flag.nauru:before {
+ background-position: -72px -312px;
+}
+
+i.flag.nu:before,
+i.flag.niue:before {
+ background-position: -72px -338px;
+}
+
+i.flag.nz:before,
+i.flag.new.zealand:before {
+ background-position: -72px -364px;
+}
+
+i.flag.om:before,
+i.flag.oman:before {
+ background-position: -72px -390px;
+}
+
+i.flag.pa:before,
+i.flag.panama:before {
+ background-position: -72px -416px;
+}
+
+i.flag.pe:before,
+i.flag.peru:before {
+ background-position: -72px -442px;
+}
+
+i.flag.pf:before,
+i.flag.french.polynesia:before {
+ background-position: -72px -468px;
+}
+
+i.flag.pg:before,
+i.flag.new.guinea:before {
+ background-position: -72px -494px;
+}
+
+i.flag.ph:before,
+i.flag.philippines:before {
+ background-position: -72px -520px;
+}
+
+i.flag.pk:before,
+i.flag.pakistan:before {
+ background-position: -72px -546px;
+}
+
+i.flag.pl:before,
+i.flag.poland:before {
+ background-position: -72px -572px;
+}
+
+i.flag.pm:before,
+i.flag.saint.pierre:before {
+ background-position: -72px -598px;
+}
+
+i.flag.pn:before,
+i.flag.pitcairn.islands:before {
+ background-position: -72px -624px;
+}
+
+i.flag.pr:before,
+i.flag.puerto.rico:before {
+ background-position: -72px -650px;
+}
+
+i.flag.ps:before,
+i.flag.palestine:before {
+ background-position: -72px -676px;
+}
+
+i.flag.pt:before,
+i.flag.portugal:before {
+ background-position: -72px -702px;
+}
+
+i.flag.pw:before,
+i.flag.palau:before {
+ background-position: -72px -728px;
+}
+
+i.flag.py:before,
+i.flag.paraguay:before {
+ background-position: -72px -754px;
+}
+
+i.flag.qa:before,
+i.flag.qatar:before {
+ background-position: -72px -780px;
+}
+
+i.flag.re:before,
+i.flag.reunion:before {
+ background-position: -72px -806px;
+}
+
+i.flag.ro:before,
+i.flag.romania:before {
+ background-position: -72px -832px;
+}
+
+i.flag.rs:before,
+i.flag.serbia:before {
+ background-position: -72px -858px;
+}
+
+i.flag.ru:before,
+i.flag.russia:before {
+ background-position: -72px -884px;
+}
+
+i.flag.rw:before,
+i.flag.rwanda:before {
+ background-position: -72px -910px;
+}
+
+i.flag.sa:before,
+i.flag.saudi.arabia:before {
+ background-position: -72px -936px;
+}
+
+i.flag.sb:before,
+i.flag.solomon.islands:before {
+ background-position: -72px -962px;
+}
+
+i.flag.sc:before,
+i.flag.seychelles:before {
+ background-position: -72px -988px;
+}
+
+i.flag.gb.sct:before,
+i.flag.scotland:before {
+ background-position: -72px -1014px;
+}
+
+i.flag.sd:before,
+i.flag.sudan:before {
+ background-position: -72px -1040px;
+}
+
+i.flag.se:before,
+i.flag.sweden:before {
+ background-position: -72px -1066px;
+}
+
+i.flag.sg:before,
+i.flag.singapore:before {
+ background-position: -72px -1092px;
+}
+
+i.flag.sh:before,
+i.flag.saint.helena:before {
+ background-position: -72px -1118px;
+}
+
+i.flag.si:before,
+i.flag.slovenia:before {
+ background-position: -72px -1144px;
+}
+
+i.flag.sj:before,
+i.flag.svalbard:before,
+i.flag.jan.mayen:before {
+ background-position: -72px -1170px;
+}
+
+i.flag.sk:before,
+i.flag.slovakia:before {
+ background-position: -72px -1196px;
+}
+
+i.flag.sl:before,
+i.flag.sierra.leone:before {
+ background-position: -72px -1222px;
+}
+
+i.flag.sm:before,
+i.flag.san.marino:before {
+ background-position: -72px -1248px;
+}
+
+i.flag.sn:before,
+i.flag.senegal:before {
+ background-position: -72px -1274px;
+}
+
+i.flag.so:before,
+i.flag.somalia:before {
+ background-position: -72px -1300px;
+}
+
+i.flag.sr:before,
+i.flag.suriname:before {
+ background-position: -72px -1326px;
+}
+
+i.flag.st:before,
+i.flag.sao.tome:before {
+ background-position: -72px -1352px;
+}
+
+i.flag.sv:before,
+i.flag.el.salvador:before {
+ background-position: -72px -1378px;
+}
+
+i.flag.sy:before,
+i.flag.syria:before {
+ background-position: -72px -1404px;
+}
+
+i.flag.sz:before,
+i.flag.swaziland:before {
+ background-position: -72px -1430px;
+}
+
+i.flag.tc:before,
+i.flag.caicos.islands:before {
+ background-position: -72px -1456px;
+}
+
+i.flag.td:before,
+i.flag.chad:before {
+ background-position: -72px -1482px;
+}
+
+i.flag.tf:before,
+i.flag.french.territories:before {
+ background-position: -72px -1508px;
+}
+
+i.flag.tg:before,
+i.flag.togo:before {
+ background-position: -72px -1534px;
+}
+
+i.flag.th:before,
+i.flag.thailand:before {
+ background-position: -72px -1560px;
+}
+
+i.flag.tj:before,
+i.flag.tajikistan:before {
+ background-position: -72px -1586px;
+}
+
+i.flag.tk:before,
+i.flag.tokelau:before {
+ background-position: -72px -1612px;
+}
+
+i.flag.tl:before,
+i.flag.timorleste:before {
+ background-position: -72px -1638px;
+}
+
+i.flag.tm:before,
+i.flag.turkmenistan:before {
+ background-position: -72px -1664px;
+}
+
+i.flag.tn:before,
+i.flag.tunisia:before {
+ background-position: -72px -1690px;
+}
+
+i.flag.to:before,
+i.flag.tonga:before {
+ background-position: -72px -1716px;
+}
+
+i.flag.tr:before,
+i.flag.turkey:before {
+ background-position: -72px -1742px;
+}
+
+i.flag.tt:before,
+i.flag.trinidad:before {
+ background-position: -72px -1768px;
+}
+
+i.flag.tv:before,
+i.flag.tuvalu:before {
+ background-position: -72px -1794px;
+}
+
+i.flag.tw:before,
+i.flag.taiwan:before {
+ background-position: -72px -1820px;
+}
+
+i.flag.tz:before,
+i.flag.tanzania:before {
+ background-position: -72px -1846px;
+}
+
+i.flag.ua:before,
+i.flag.ukraine:before {
+ background-position: -72px -1872px;
+}
+
+i.flag.ug:before,
+i.flag.uganda:before {
+ background-position: -72px -1898px;
+}
+
+i.flag.um:before,
+i.flag.us.minor.islands:before {
+ background-position: -72px -1924px;
+}
+
+i.flag.us:before,
+i.flag.america:before,
+i.flag.united.states:before {
+ background-position: -72px -1950px;
+}
+
+i.flag.uy:before,
+i.flag.uruguay:before {
+ background-position: -72px -1976px;
+}
+
+i.flag.uz:before,
+i.flag.uzbekistan:before {
+ background-position: -108px 0;
+}
+
+i.flag.va:before,
+i.flag.vatican.city:before {
+ background-position: -108px -26px;
+}
+
+i.flag.vc:before,
+i.flag.saint.vincent:before {
+ background-position: -108px -52px;
+}
+
+i.flag.ve:before,
+i.flag.venezuela:before {
+ background-position: -108px -78px;
+}
+
+i.flag.vg:before,
+i.flag.british.virgin.islands:before {
+ background-position: -108px -104px;
+}
+
+i.flag.vi:before,
+i.flag.us.virgin.islands:before {
+ background-position: -108px -130px;
+}
+
+i.flag.vn:before,
+i.flag.vietnam:before {
+ background-position: -108px -156px;
+}
+
+i.flag.vu:before,
+i.flag.vanuatu:before {
+ background-position: -108px -182px;
+}
+
+i.flag.gb.wls:before,
+i.flag.wales:before {
+ background-position: -108px -208px;
+}
+
+i.flag.wf:before,
+i.flag.wallis.and.futuna:before {
+ background-position: -108px -234px;
+}
+
+i.flag.ws:before,
+i.flag.samoa:before {
+ background-position: -108px -260px;
+}
+
+i.flag.ye:before,
+i.flag.yemen:before {
+ background-position: -108px -286px;
+}
+
+i.flag.yt:before,
+i.flag.mayotte:before {
+ background-position: -108px -312px;
+}
+
+i.flag.za:before,
+i.flag.south.africa:before {
+ background-position: -108px -338px;
+}
+
+i.flag.zm:before,
+i.flag.zambia:before {
+ background-position: -108px -364px;
+}
+
+i.flag.zw:before,
+i.flag.zimbabwe:before {
+ background-position: -108px -390px;
+}
diff --git a/theme/site/elements/flag.variables b/theme/site/elements/flag.variables
new file mode 100644
index 0000000..05ad3c3
--- /dev/null
+++ b/theme/site/elements/flag.variables
@@ -0,0 +1,7 @@
+/*******************************
+ Flag
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
diff --git a/theme/site/elements/header.overrides b/theme/site/elements/header.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/elements/header.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/elements/header.variables b/theme/site/elements/header.variables
new file mode 100644
index 0000000..7ab8a98
--- /dev/null
+++ b/theme/site/elements/header.variables
@@ -0,0 +1,44 @@
+/*******************************
+ Header
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+/* Sub Heading */
+
+/* Sub Header */
+
+/* Icon */
+
+/* Image */
+
+/* Label */
+
+/* Content */
+
+/* Paragraph after Header */
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Sizing */
+
+/* Sub Header */
+
+/* Icon Header */
+
+/* No Line Height Offset */
+
+/* Divided */
+
+/* Block */
+
+/* Attached */
+
+/* Inverted */
+
+/* Floated */
diff --git a/theme/site/elements/image.overrides b/theme/site/elements/image.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/elements/image.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/elements/image.variables b/theme/site/elements/image.variables
new file mode 100644
index 0000000..6e81a5b
--- /dev/null
+++ b/theme/site/elements/image.variables
@@ -0,0 +1,25 @@
+/*******************************
+ Image
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Avatar */
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Spaced */
+
+/* Floated */
+
+/* Size */
diff --git a/theme/site/elements/input.overrides b/theme/site/elements/input.overrides
new file mode 100644
index 0000000..2108fba
--- /dev/null
+++ b/theme/site/elements/input.overrides
@@ -0,0 +1,108 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.input input {
+ font-weight: @inputFontWeight;
+}
+
+.inline.field {
+ .wrapper {
+ display : flex;
+ min-height : 60px;
+ align-items : center;
+ border-bottom: 1px solid @lightGreyBorderColor;
+ }
+
+ &.required .wrapper {
+
+ label[for]::after,
+ .ui.label::after {
+ display : inline-block;
+ width : 10px;
+ height : 10px;
+ margin-left : 5px;
+ background-color: @pink;
+ border-radius : 50%;
+ content : '';
+ }
+ }
+
+ &.text {
+ .toolbar {
+ display : block;
+ margin-top: 18px;
+ }
+ }
+
+ &.textarea {
+
+ .wrapper,
+ .toolbar {
+ display : block;
+ margin-top: 18px;
+ }
+
+ textarea {
+ min-height: 60px;
+ padding : 0;
+ margin-top: 18px;
+ }
+ }
+
+ &.wysiwyg {
+
+ .wrapper,
+ .toolbar {
+ display : block;
+ margin-top: 18px;
+ }
+
+ .DraftEditor-root {
+ min-height: 60px;
+ margin-top: 18px;
+ }
+ }
+
+ .ui.checkbox~.ui.basic.label {
+ border: 0;
+ }
+}
+
+.ui.form .searchbox.field {
+ // display : flex;
+ // padding-left : 1em;
+ // border-bottom: 1px solid @purpleBackground;
+ // font-size : 1.3rem;
+ // padding-left : 0;
+ // min-width : 168px;
+ // padding : .5rem;
+
+ .ui.input input {
+ // width : 106px;
+ // height : auto;
+ // line-height: initial;
+ // color: white;
+ // font-weight: bold;
+ height: unset;
+ border: none;
+ }
+
+ // button {
+ // padding : 0;
+ // border : 0;
+ // background: transparent;
+ // color : white;
+ // ;
+ // cursor : pointer;
+ // text-align: initial;
+
+ // &:focus {
+ // outline: none;
+ // }
+ // }
+}
+
+.transparent {
+ line-height: initial;
+}
\ No newline at end of file
diff --git a/theme/site/elements/input.variables b/theme/site/elements/input.variables
new file mode 100644
index 0000000..f7cdfab
--- /dev/null
+++ b/theme/site/elements/input.variables
@@ -0,0 +1,43 @@
+/*******************************
+ Input
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+// Pastanaga variable
+@inputFontWeight: 300;
+
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Icon Input */
+
+/* Circular Icon Input */
+
+/* Labeled Input */
+
+
+/*-------------------
+ States
+--------------------*/
+
+/* Placeholder */
+
+/* Down */
+
+/* Focus */
+
+/* Error */
+
+/* Loader */
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Inverted */
diff --git a/theme/site/elements/label.overrides b/theme/site/elements/label.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/elements/label.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/elements/label.variables b/theme/site/elements/label.variables
new file mode 100644
index 0000000..0cf0322
--- /dev/null
+++ b/theme/site/elements/label.variables
@@ -0,0 +1,77 @@
+/*******************************
+ Label
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+/* Group */
+
+
+/*-------------------
+ Parts
+--------------------*/
+
+/* Link */
+
+/* Icon */
+
+/* Image */
+
+/* Detail */
+
+/* Delete */
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Image Label */
+
+
+/*-------------------
+ States
+--------------------*/
+
+/* Hover */
+
+/* Active */
+
+/* Active Hover */
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Basic */
+
+/* Tag */
+
+/* Ribbon */
+
+/* Colors */
+
+/* Attached */
+
+/* Corner */
+
+/* Corner Text */
+
+/* Horizontal */
+
+/* Circular Padding */
+
+/* Pointing */
+
+/* Basic Pointing */
+
+/* Floating */
+
+
+/*-------------------
+ Group
+--------------------*/
+
+/* Sizing */
diff --git a/theme/site/elements/list.overrides b/theme/site/elements/list.overrides
new file mode 100644
index 0000000..bb45d4f
--- /dev/null
+++ b/theme/site/elements/list.overrides
@@ -0,0 +1,24 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.inverted.list > a.item {
+ text-decoration: underline;
+}
+
+.ui.inverted.list .item a:not(.ui) {
+ color: @white!important;
+}
+.ui.grid > .row > .navigation.column {
+ margin-top: unit(-@relativeBig * 1.5, em);
+
+ .menu {
+ flex-wrap: wrap;
+ }
+}
+
+.header .tools.column .list .item {
+ color: @grey;
+ font-size: @13px;
+ font-weight: 100;
+}
diff --git a/theme/site/elements/list.variables b/theme/site/elements/list.variables
new file mode 100644
index 0000000..81303cf
--- /dev/null
+++ b/theme/site/elements/list.variables
@@ -0,0 +1,83 @@
+/*******************************
+ List
+*******************************/
+
+/*-------------------
+ View
+--------------------*/
+
+/* List */
+
+/* List Item */
+
+/* Sub List */
+
+/* Sub List Item */
+
+/*-------------------
+ Elements
+--------------------*/
+
+/* Icon */
+
+/* Image */
+
+/* Content */
+
+/* Header */
+
+/* Description */
+
+/* Link */
+
+/* Header Link */
+
+/* Linked Icon */
+
+/*-------------------
+ States
+--------------------*/
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Float */
+
+/* Horizontal */
+
+/* Inverted */
+@invertedItemLinkHoverColor: @white;
+
+/* Link List */
+
+/* Inverted Link List */
+
+/* Selection List */
+
+/* Selection List States */
+
+/* Inverted Selection List */
+
+/* Animated List */
+
+/* Bulleted */
+
+/* Horizontal Bullets */
+
+/* Ordered List */
+
+/* Horizontal Ordered */
+
+/* Divided */
+
+/* Divided Horizontal */
+
+/* Divided */
+
+/* Divided Horizontal */
+
+/* Relaxed */
+
+/* Very Relaxed */
diff --git a/theme/site/elements/loader.overrides b/theme/site/elements/loader.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/elements/loader.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/elements/loader.variables b/theme/site/elements/loader.variables
new file mode 100644
index 0000000..067eda8
--- /dev/null
+++ b/theme/site/elements/loader.variables
@@ -0,0 +1,24 @@
+/*******************************
+ Loader
+*******************************/
+
+/*-------------------
+ Standard
+--------------------*/
+
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Text */
+
+
+/*-------------------
+ States
+--------------------*/
+
+
+/*-------------------
+ Variations
+--------------------*/
diff --git a/theme/site/elements/placeholder.overrides b/theme/site/elements/placeholder.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/elements/placeholder.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/elements/placeholder.variables b/theme/site/elements/placeholder.variables
new file mode 100644
index 0000000..9c9696e
--- /dev/null
+++ b/theme/site/elements/placeholder.variables
@@ -0,0 +1,16 @@
+
+/* Key Content Sizing */
+
+/* Interval between consecutive placeholders */
+
+/* Repeated Placeholder */
+
+/* Image */
+
+/* Header Image */
+
+/* Paragraph */
+
+/* Glow Gradient */
+
+/* Variations */
diff --git a/theme/site/elements/rail.overrides b/theme/site/elements/rail.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/elements/rail.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/elements/rail.variables b/theme/site/elements/rail.variables
new file mode 100644
index 0000000..296671f
--- /dev/null
+++ b/theme/site/elements/rail.variables
@@ -0,0 +1,16 @@
+/*******************************
+ Rail
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Close */
+
+/* Dividing */
diff --git a/theme/site/elements/reveal.overrides b/theme/site/elements/reveal.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/elements/reveal.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/elements/reveal.variables b/theme/site/elements/reveal.variables
new file mode 100644
index 0000000..692c7a9
--- /dev/null
+++ b/theme/site/elements/reveal.variables
@@ -0,0 +1,5 @@
+/*******************************
+ Reveal
+*******************************/
+
+/* Types */
diff --git a/theme/site/elements/segment.overrides b/theme/site/elements/segment.overrides
new file mode 100644
index 0000000..e3dd054
--- /dev/null
+++ b/theme/site/elements/segment.overrides
@@ -0,0 +1,108 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.basic.segment.header-wrapper {
+ margin-bottom: 0;
+}
+
+.ui.basic.segment .header {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+
+ .logo-nav-wrapper {
+ display: flex;
+ flex: 1;
+ align-items: center;
+
+ .logo {
+ flex: 0 0 auto;
+ }
+
+ .navigation {
+ -ms-overflow-style: none; // IE 10+
+ overflow-x: auto;
+
+ &::-webkit-scrollbar {
+ height: 0; /* remove scrollbar space */
+ background: transparent; /* optional: just make scrollbar invisible */
+ }
+
+ /* optional: show position indicator in red */
+ &::-webkit-scrollbar-thumb {
+ background: #f00;
+ }
+
+ @media only screen and (max-width: @tabletBreakpoint) {
+ overflow-x: initial;
+ }
+ }
+ }
+
+ @media only screen and (max-width: @tabletBreakpoint) {
+ flex-direction: column;
+ align-items: initial;
+
+ .logo-nav-wrapper {
+ align-items: initial;
+ justify-content: space-between;
+ }
+ }
+}
+
+.ui.basic.segment.content-area {
+ flex: 1 0 auto; // IE11 fix, can't barely use flex: 1;
+ padding-right: 0;
+ padding-left: 0;
+}
+
+.ui.primary.segment {
+ border-bottom: @4px solid @greyBorderColor;
+ font-size: @16px;
+ font-weight: @headerFontWeight;
+}
+
+.ui.secondary.segment {
+ font-size: @12px;
+}
+
+.ui.discreet.segment {
+ color: @lightGrey;
+ font-size: @12px;
+}
+
+.ui.form.segment {
+ padding: 0;
+
+ .ui.grid > .row {
+ padding-top: 0;
+ padding-bottom: 0;
+ }
+}
+
+.ui.actions.segment {
+ border-top: @1px solid @lightGreyBorderColor;
+}
+
+.inverted.segment a.item {
+ color: @white;
+ text-decoration: underline;
+}
+
+.pusher > .ui.basic.segment {
+ padding-bottom: 0;
+}
+
+.ui.secondary.attached.segment {
+ text-transform: uppercase;
+}
+
+.ui.segment.dashed {
+ border: 3px dashed #ccc;
+ box-shadow: none;
+}
+
+.users-control-panel .ui.clearing.segment.actions {
+ text-transform: uppercase;
+}
diff --git a/theme/site/elements/segment.variables b/theme/site/elements/segment.variables
new file mode 100644
index 0000000..de9a169
--- /dev/null
+++ b/theme/site/elements/segment.variables
@@ -0,0 +1,64 @@
+/*******************************
+ Segment
+*******************************/
+
+/*-------------------
+ Element
+--------------------*/
+
+@borderRadius: 0;
+
+/*-------------------
+ Group
+--------------------*/
+
+@groupedSegmentDivider: none;
+
+
+/*-------------------
+ Coupling
+--------------------*/
+
+/* Page Grid Segment */
+
+
+/*******************************
+ States
+*******************************/
+
+/* Loading Dimmer */
+
+/* Loading Spinner */
+
+
+/*******************************
+ Variations
+*******************************/
+
+/* Piled */
+
+/* Circular */
+
+/* Stacked */
+
+/* Raised */
+
+/* Padded */
+
+/* Attached */
+@attachedHorizontalOffset: 0;
+@attachedWidth: 100%;
+@attachedBoxShadow: none;
+@attachedBorder: 0;
+
+/* Inverted */
+
+/* Floated */
+
+/* Basic */
+
+/* Colors */
+
+/* Ordinality */
+@secondaryBackground: @tealBackground;
+@secondaryColor: @teal;
diff --git a/theme/site/elements/step.overrides b/theme/site/elements/step.overrides
new file mode 100644
index 0000000..beea82a
--- /dev/null
+++ b/theme/site/elements/step.overrides
@@ -0,0 +1,17 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+@font-face {
+ font-family: 'Step';
+ src: url(data:application/x-font-ttf;charset=utf-8;;base64,AAEAAAAOAIAAAwBgT1MvMj3hSQEAAADsAAAAVmNtYXDQEhm3AAABRAAAAUpjdnQgBkn/lAAABuwAAAAcZnBnbYoKeDsAAAcIAAAJkWdhc3AAAAAQAAAG5AAAAAhnbHlm32cEdgAAApAAAAC2aGVhZAErPHsAAANIAAAANmhoZWEHUwNNAAADgAAAACRobXR4CykAAAAAA6QAAAAMbG9jYQA4AFsAAAOwAAAACG1heHAApgm8AAADuAAAACBuYW1lzJ0aHAAAA9gAAALNcG9zdK69QJgAAAaoAAAAO3ByZXCSoZr/AAAQnAAAAFYAAQO4AZAABQAIAnoCvAAAAIwCegK8AAAB4AAxAQIAAAIABQMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUGZFZABA6ADoAQNS/2oAWgMLAE8AAAABAAAAAAAAAAAAAwAAAAMAAAAcAAEAAAAAAEQAAwABAAAAHAAEACgAAAAGAAQAAQACAADoAf//AAAAAOgA//8AABgBAAEAAAAAAAAAAAEGAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAQAAAAADpAKYABUAHEAZDwEAAQFCAAIBAmoAAQABagAAAGEUFxQDEisBFAcBBiInASY0PwE2Mh8BATYyHwEWA6QP/iAQLBD+6g8PTBAsEKQBbhAsEEwPAhYWEP4gDw8BFhAsEEwQEKUBbxAQTBAAAAH//f+xA18DCwAMABJADwABAQpDAAAACwBEFRMCESsBFA4BIi4CPgEyHgEDWXLG6MhuBnq89Lp+AV51xHR0xOrEdHTEAAAAAAEAAAABAADDeRpdXw889QALA+gAAAAAzzWYjQAAAADPNWBN//3/sQOkAwsAAAAIAAIAAAAAAAAAAQAAA1L/agBaA+gAAP/3A6QAAQAAAAAAAAAAAAAAAAAAAAMD6AAAA+gAAANZAAAAAAAAADgAWwABAAAAAwAWAAEAAAAAAAIABgATAG4AAAAtCZEAAAAAAAAAEgDeAAEAAAAAAAAANQAAAAEAAAAAAAEACAA1AAEAAAAAAAIABwA9AAEAAAAAAAMACABEAAEAAAAAAAQACABMAAEAAAAAAAUACwBUAAEAAAAAAAYACABfAAEAAAAAAAoAKwBnAAEAAAAAAAsAEwCSAAMAAQQJAAAAagClAAMAAQQJAAEAEAEPAAMAAQQJAAIADgEfAAMAAQQJAAMAEAEtAAMAAQQJAAQAEAE9AAMAAQQJAAUAFgFNAAMAAQQJAAYAEAFjAAMAAQQJAAoAVgFzAAMAAQQJAAsAJgHJQ29weXJpZ2h0IChDKSAyMDE0IGJ5IG9yaWdpbmFsIGF1dGhvcnMgQCBmb250ZWxsby5jb21mb250ZWxsb1JlZ3VsYXJmb250ZWxsb2ZvbnRlbGxvVmVyc2lvbiAxLjBmb250ZWxsb0dlbmVyYXRlZCBieSBzdmcydHRmIGZyb20gRm9udGVsbG8gcHJvamVjdC5odHRwOi8vZm9udGVsbG8uY29tAEMAbwBwAHkAcgBpAGcAaAB0ACAAKABDACkAIAAyADAAMQA0ACAAYgB5ACAAbwByAGkAZwBpAG4AYQBsACAAYQB1AHQAaABvAHIAcwAgAEAAIABmAG8AbgB0AGUAbABsAG8ALgBjAG8AbQBmAG8AbgB0AGUAbABsAG8AUgBlAGcAdQBsAGEAcgBmAG8AbgB0AGUAbABsAG8AZgBvAG4AdABlAGwAbABvAFYAZQByAHMAaQBvAG4AIAAxAC4AMABmAG8AbgB0AGUAbABsAG8ARwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABzAHYAZwAyAHQAdABmACAAZgByAG8AbQAgAEYAbwBuAHQAZQBsAGwAbwAgAHAAcgBvAGoAZQBjAHQALgBoAHQAdABwADoALwAvAGYAbwBuAHQAZQBsAGwAbwAuAGMAbwBtAAAAAAIAAAAAAAAACgAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwAAAQIBAwljaGVja21hcmsGY2lyY2xlAAAAAAEAAf//AA8AAAAAAAAAAAAAAAAAAAAAADIAMgML/7EDC/+xsAAssCBgZi2wASwgZCCwwFCwBCZasARFW1ghIyEbilggsFBQWCGwQFkbILA4UFghsDhZWSCwCkVhZLAoUFghsApFILAwUFghsDBZGyCwwFBYIGYgiophILAKUFhgGyCwIFBYIbAKYBsgsDZQWCGwNmAbYFlZWRuwACtZWSOwAFBYZVlZLbACLCBFILAEJWFkILAFQ1BYsAUjQrAGI0IbISFZsAFgLbADLCMhIyEgZLEFYkIgsAYjQrIKAAIqISCwBkMgiiCKsAArsTAFJYpRWGBQG2FSWVgjWSEgsEBTWLAAKxshsEBZI7AAUFhlWS2wBCywB0MrsgACAENgQi2wBSywByNCIyCwACNCYbCAYrABYLAEKi2wBiwgIEUgsAJFY7ABRWJgRLABYC2wBywgIEUgsAArI7ECBCVgIEWKI2EgZCCwIFBYIbAAG7AwUFiwIBuwQFlZI7AAUFhlWbADJSNhRESwAWAtsAgssQUFRbABYUQtsAkssAFgICCwCUNKsABQWCCwCSNCWbAKQ0qwAFJYILAKI0JZLbAKLCC4BABiILgEAGOKI2GwC0NgIIpgILALI0IjLbALLEtUWLEHAURZJLANZSN4LbAMLEtRWEtTWLEHAURZGyFZJLATZSN4LbANLLEADENVWLEMDEOwAWFCsAorWbAAQ7ACJUKxCQIlQrEKAiVCsAEWIyCwAyVQWLEBAENgsAQlQoqKIIojYbAJKiEjsAFhIIojYbAJKiEbsQEAQ2CwAiVCsAIlYbAJKiFZsAlDR7AKQ0dgsIBiILACRWOwAUViYLEAABMjRLABQ7AAPrIBAQFDYEItsA4ssQAFRVRYALAMI0IgYLABYbUNDQEACwBCQopgsQ0FK7BtKxsiWS2wDyyxAA4rLbAQLLEBDistsBEssQIOKy2wEiyxAw4rLbATLLEEDistsBQssQUOKy2wFSyxBg4rLbAWLLEHDistsBcssQgOKy2wGCyxCQ4rLbAZLLAIK7EABUVUWACwDCNCIGCwAWG1DQ0BAAsAQkKKYLENBSuwbSsbIlktsBossQAZKy2wGyyxARkrLbAcLLECGSstsB0ssQMZKy2wHiyxBBkrLbAfLLEFGSstsCAssQYZKy2wISyxBxkrLbAiLLEIGSstsCMssQkZKy2wJCwgPLABYC2wJSwgYLANYCBDI7ABYEOwAiVhsAFgsCQqIS2wJiywJSuwJSotsCcsICBHICCwAkVjsAFFYmAjYTgjIIpVWCBHICCwAkVjsAFFYmAjYTgbIVktsCgssQAFRVRYALABFrAnKrABFTAbIlktsCkssAgrsQAFRVRYALABFrAnKrABFTAbIlktsCosIDWwAWAtsCssALADRWOwAUVisAArsAJFY7ABRWKwACuwABa0AAAAAABEPiM4sSoBFSotsCwsIDwgRyCwAkVjsAFFYmCwAENhOC2wLSwuFzwtsC4sIDwgRyCwAkVjsAFFYmCwAENhsAFDYzgtsC8ssQIAFiUgLiBHsAAjQrACJUmKikcjRyNhIFhiGyFZsAEjQrIuAQEVFCotsDAssAAWsAQlsAQlRyNHI2GwBkUrZYouIyAgPIo4LbAxLLAAFrAEJbAEJSAuRyNHI2EgsAQjQrAGRSsgsGBQWCCwQFFYswIgAyAbswImAxpZQkIjILAIQyCKI0cjRyNhI0ZgsARDsIBiYCCwACsgiophILACQ2BkI7ADQ2FkUFiwAkNhG7ADQ2BZsAMlsIBiYSMgILAEJiNGYTgbI7AIQ0awAiWwCENHI0cjYWAgsARDsIBiYCMgsAArI7AEQ2CwACuwBSVhsAUlsIBisAQmYSCwBCVgZCOwAyVgZFBYIRsjIVkjICCwBCYjRmE4WS2wMiywABYgICCwBSYgLkcjRyNhIzw4LbAzLLAAFiCwCCNCICAgRiNHsAArI2E4LbA0LLAAFrADJbACJUcjRyNhsABUWC4gPCMhG7ACJbACJUcjRyNhILAFJbAEJUcjRyNhsAYlsAUlSbACJWGwAUVjIyBYYhshWWOwAUViYCMuIyAgPIo4IyFZLbA1LLAAFiCwCEMgLkcjRyNhIGCwIGBmsIBiIyAgPIo4LbA2LCMgLkawAiVGUlggPFkusSYBFCstsDcsIyAuRrACJUZQWCA8WS6xJgEUKy2wOCwjIC5GsAIlRlJYIDxZIyAuRrACJUZQWCA8WS6xJgEUKy2wOSywMCsjIC5GsAIlRlJYIDxZLrEmARQrLbA6LLAxK4ogIDywBCNCijgjIC5GsAIlRlJYIDxZLrEmARQrsARDLrAmKy2wOyywABawBCWwBCYgLkcjRyNhsAZFKyMgPCAuIzixJgEUKy2wPCyxCAQlQrAAFrAEJbAEJSAuRyNHI2EgsAQjQrAGRSsgsGBQWCCwQFFYswIgAyAbswImAxpZQkIjIEewBEOwgGJgILAAKyCKimEgsAJDYGQjsANDYWRQWLACQ2EbsANDYFmwAyWwgGJhsAIlRmE4IyA8IzgbISAgRiNHsAArI2E4IVmxJgEUKy2wPSywMCsusSYBFCstsD4ssDErISMgIDywBCNCIzixJgEUK7AEQy6wJistsD8ssAAVIEewACNCsgABARUUEy6wLCotsEAssAAVIEewACNCsgABARUUEy6wLCotsEEssQABFBOwLSotsEIssC8qLbBDLLAAFkUjIC4gRoojYTixJgEUKy2wRCywCCNCsEMrLbBFLLIAADwrLbBGLLIAATwrLbBHLLIBADwrLbBILLIBATwrLbBJLLIAAD0rLbBKLLIAAT0rLbBLLLIBAD0rLbBMLLIBAT0rLbBNLLIAADkrLbBOLLIAATkrLbBPLLIBADkrLbBQLLIBATkrLbBRLLIAADsrLbBSLLIAATsrLbBTLLIBADsrLbBULLIBATsrLbBVLLIAAD4rLbBWLLIAAT4rLbBXLLIBAD4rLbBYLLIBAT4rLbBZLLIAADorLbBaLLIAATorLbBbLLIBADorLbBcLLIBATorLbBdLLAyKy6xJgEUKy2wXiywMiuwNistsF8ssDIrsDcrLbBgLLAAFrAyK7A4Ky2wYSywMysusSYBFCstsGIssDMrsDYrLbBjLLAzK7A3Ky2wZCywMyuwOCstsGUssDQrLrEmARQrLbBmLLA0K7A2Ky2wZyywNCuwNystsGgssDQrsDgrLbBpLLA1Ky6xJgEUKy2waiywNSuwNistsGsssDUrsDcrLbBsLLA1K7A4Ky2wbSwrsAhlsAMkUHiwARUwLQAAAEu4AMhSWLEBAY5ZuQgACABjILABI0SwAyNwsgQoCUVSRLIKAgcqsQYBRLEkAYhRWLBAiFixBgNEsSYBiFFYuAQAiFixBgFEWVlZWbgB/4WwBI2xBQBEAAA=)
+ format('truetype'),
+ url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAoUAA4AAAAAEPQAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABPUy8yAAABRAAAAEQAAABWPeFJAWNtYXAAAAGIAAAAOgAAAUrQEhm3Y3Z0IAAAAcQAAAAUAAAAHAZJ/5RmcGdtAAAB2AAABPkAAAmRigp4O2dhc3AAAAbUAAAACAAAAAgAAAAQZ2x5ZgAABtwAAACuAAAAtt9nBHZoZWFkAAAHjAAAADUAAAA2ASs8e2hoZWEAAAfEAAAAIAAAACQHUwNNaG10eAAAB+QAAAAMAAAADAspAABsb2NhAAAH8AAAAAgAAAAIADgAW21heHAAAAf4AAAAIAAAACAApgm8bmFtZQAACBgAAAF3AAACzcydGhxwb3N0AAAJkAAAACoAAAA7rr1AmHByZXAAAAm8AAAAVgAAAFaSoZr/eJxjYGTewTiBgZWBg6mKaQ8DA0MPhGZ8wGDIyMTAwMTAysyAFQSkuaYwOLxgeMHIHPQ/iyGKmZvBHyjMCJIDAPe9C2B4nGNgYGBmgGAZBkYGEHAB8hjBfBYGDSDNBqQZGZgYGF4w/v8PUvCCAURLMELVAwEjG8OIBwBk5AavAAB4nGNgQANGDEbM3P83gjAAELQD4XicnVXZdtNWFJU8ZHASOmSgoA7X3DhQ68qEKRgwaSrFdiEdHAitBB2kDHTkncc+62uOQrtWH/m07n09JLR0rbYsls++R1tn2DrnRhwjKn0aiGvUoZKXA6msPZZK90lc13Uvj5UMBnFdthJPSZuonSRKat3sUC7xWOsqWSdYJ+PlIFZPVZ5noAziFB5lSUQbRBuplyZJ4onjJ4kWZxAfJUkgJaMQp9LIUEI1GsRS1aFM6dCr1xNx00DKRqMedVhU90PFJ8c1p9SsA0YqVznCFevVRr4bpwMve5DEOsGzrYcxHnisfpQqkIqR6cg/dkpOlIaBVHHUoVbi6DCTX/eRTCrNQKaMYkWl7oG43f102xYxPXQ6vi5KlUaqurnOKJrt0fGogygP2cbppNzQ2fbw5RlTVKtdcbPtQGYNXErJbHSfRAAdJlLj6QFONZwCqRn1R8XZ588BEslclKo8VTKHegOZMzt7cTHtbiersnCknwcyb3Z2452HQ6dXh3/R+hdM4cxHj+Jifj5C+lBqfiJOJKVGWMzyp4YfcVcgQrkxiAsXyuBThDl0RdrZZl3jtTH2hs/5SqlhPQna6KP4fgr9TiQrHGdRo/VInM1j13Wt3GdQS7W7Fzsyr0OVIu7vCwuuM+eEYZ4WC1VfnvneBTT/Bohn/EDeNIVL+5YpSrRvm6JMu2iKCu0SVKVdNsUU7YoppmnPmmKG9h1TzNKeMzLj/8vc55H7HN7xkJv2XeSmfQ+5ad9HbtoPkJtWITdtHblpLyA3rUZu2lWjOnYEGgZpF1IVQdA0svph3Fab9UDWjDR8aWDyLmLI+upER521tcofxX914gsHcmmip7siF5viLq/bFj483e6rj5pG3bDV+MaR8jAeRnocmtBZ+c3hv+1N3S6a7jKqMugBFUwKwABl7UAC0zrbCaT1mqf48gdgXIZ4zkpDtVSfO4am7+V5X/exOfG+x+3GLrdcd3kJWdYNcmP28N9SZKrrH+UtrVQnR6wrJ49VaxhDKrwour6SlHu0tRu/KKmy8l6U1srnk5CbPYMbQlu27mGwI0xpyiUeXlOlKD3UUo6yQyxvKco84JSLC1qGxLgOdQ9qa8TpoXoYGwshhqG0vRBwSCldFd+0ynfxHqtr2Oj4xRXh6XpyEhGf4ir7UfBU10b96A7avGbdMoMpVaqn+4xPsa/b9lFZaaSOsxe3VAfXNOsaORXTT+Rr4HRvOGjdAz1UfDRBI1U1x+jGKGM0ljXl3wR0MVZ+w2jVYvs93E+dpFWsuUuY7JsT9+C0u/0q+7WcW0bW/dcGvW3kip8jMb8tCvw7B2K3ZA3UO5OBGAvIWdAYxhYmdxiug23EbfY/Jqf/34aFRXJXOxq7eerD1ZNRJXfZ8rjLTXZZ16M2R9VOGvsIjS0PN+bY4XIstsRgQbb+wf8x7gF3aVEC4NDIZZiI2nShnurh6h6rsW04VxIBds2x43QAegAuQd8cu9bzCYD13CPnLsB9cgh2yCH4lByCz8i5BfA5OQRfkEMwIIdgl5w7AA/IIXhIDsEeOQSPyNkE+JIcgq/IIYjJIUjIuQ3wmByCJ+QQfE0OwTdGrk5k/pYH2QD6zqKbQKmdGhzaOGRGrk3Y+zxY9oFFZB9aROqRkesT6lMeLPV7i0j9wSJSfzRyY0L9iQdL/dkiUn+xiNRnxpeZIymvDp7zjg7+BJfqrV4AAAAAAQAB//8AD3icY2BkAALmJUwzGEQZZBwk+RkZGBmdGJgYmbIYgMwsoGSiiLgIs5A2owg7I5uSOqOaiT2jmZE8I5gQY17C/09BQEfg3yt+fh8gvYQxD0j68DOJiQn8U+DnZxQDcQUEljLmCwBpBgbG/3//b2SOZ+Zm4GEQcuAH2sblDLSEm8FFVJhJEGgLH6OSHpMdo5EcI3Nk0bEXJ/LYqvZ82VXHGFd6pKTkyCsQwQAAq+QkqAAAeJxjYGRgYADiw5VSsfH8Nl8ZuJlfAEUYzpvO6IXQCb7///7fyLyEmRvI5WBgAokCAFb/DJAAAAB4nGNgZGBgDvqfxRDF/IKB4f935iUMQBEUwAwAi5YFpgPoAAAD6AAAA1kAAAAAAAAAOABbAAEAAAADABYAAQAAAAAAAgAGABMAbgAAAC0JkQAAAAB4nHWQy2rCQBSG//HSi0JbWui2sypKabxgN4IgWHTTbqS4LTHGJBIzMhkFX6Pv0IfpS/RZ+puMpShNmMx3vjlz5mQAXOMbAvnzxJGzwBmjnAs4Rc9ykf7Zcon8YrmMKt4sn9C/W67gAYHlKm7wwQqidM5ogU/LAlfi0nIBF+LOcpH+0XKJ3LNcxq14tXxC71muYCJSy1Xci6+BWm11FIRG1gZ12W62OnK6lYoqStxYumsTKp3KvpyrxPhxrBxPLfc89oN17Op9uJ8nvk4jlciW09yrkZ/42jX+bFc93QRtY+ZyrtVSDm2GXGm18D3jhMasuo3G3/MwgMIKW2hEvKoQBhI12jrnNppooUOaMkMyM8+KkMBFTONizR1htpIy7nPMGSW0PjNisgOP3+WRH5MC7o9ZRR+tHsYT0u6MKPOSfTns7jBrREqyTDezs9/eU2x4WpvWcNeuS511JTE8qCF5H7u1BY1H72S3Ymi7aPD95/9+AN1fhEsAeJxjYGKAAC4G7ICZgYGRiZGZMzkjNTk7N7Eomy05syg5J5WBAQBE1QZBAABLuADIUlixAQGOWbkIAAgAYyCwASNEsAMjcLIEKAlFUkSyCgIHKrEGAUSxJAGIUViwQIhYsQYDRLEmAYhRWLgEAIhYsQYBRFlZWVm4Af+FsASNsQUARAAA)
+ format('woff');
+}
+
+.ui.steps .step.completed > .icon:before,
+.ui.ordered.steps .step.completed:before {
+ content: '\e800'; /* '' */
+ font-family: 'Step';
+}
diff --git a/theme/site/elements/step.variables b/theme/site/elements/step.variables
new file mode 100644
index 0000000..dc0ccaf
--- /dev/null
+++ b/theme/site/elements/step.variables
@@ -0,0 +1,51 @@
+/*******************************
+ Step
+*******************************/
+
+/*-------------------
+ Group
+--------------------*/
+
+
+/*-------------------
+ Element
+--------------------*/
+
+/* Icon */
+
+/* Title */
+
+/* Description */
+
+/* Arrow */
+
+/* Mobile */
+
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Vertical */
+
+
+/*-------------------
+ Variations
+--------------------*/
+
+
+/*-------------------
+ States
+--------------------*/
+
+/* Completed */
+
+/* Hover */
+
+/* Down */
+
+/* Active */
+
+/* Active + Hover */
+
+/* Disabled */
diff --git a/theme/site/extras/blocks.less b/theme/site/extras/blocks.less
new file mode 100644
index 0000000..0cd8297
--- /dev/null
+++ b/theme/site/extras/blocks.less
@@ -0,0 +1,591 @@
+// Here should be placed all blocks that receive (faked) focus
+.block:focus {
+ outline: none;
+}
+
+.block .block:not(.inner)::before {
+ position: absolute;
+ z-index: -1;
+ top: -9px;
+ left: -9px;
+ width: ~'calc(100% + 18px)';
+ height: ~'calc(100% + 18px)';
+ border: 1px solid rgba(120, 192, 215, 0);
+ border-radius: 3px;
+ content: '';
+}
+
+.block .block-add-button {
+ display: none;
+}
+
+.block.selected .block-add-button {
+ display: inline-block;
+}
+
+.view-editview {
+ .block .block.selected::before,
+ .block .block.selected:hover::before {
+ border-width: 1px;
+ border-color: rgba(120, 192, 215, 0.75);
+ }
+}
+
+.view-editview {
+ .block .block:hover::before {
+ border-color: rgba(120, 192, 215, 0.375);
+ }
+}
+
+.ui.drag.block:not(:last-child) {
+ margin-bottom: 2rem;
+}
+
+.ui.drag.block.video,
+.ui.drag.block.image {
+ z-index: 2;
+ // This fixes the floating images in Volto Editor! Muahahaha
+ display: block;
+}
+
+.block .ui.image {
+ width: 100%;
+}
+
+.block .ui.message {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+
+ span {
+ margin-top: 20px;
+ }
+}
+
+.block.maps {
+ iframe {
+ width: 100%;
+ height: 45vh;
+ }
+}
+
+.block.align.left {
+ z-index: 2;
+
+ &.video .video-inner,
+ &.maps iframe,
+ img {
+ margin-right: 1em !important;
+ margin-bottom: 1em;
+ float: left;
+ }
+
+ &.video .video-inner {
+ width: 50%;
+ }
+
+ &.maps iframe {
+ width: 50%;
+ height: 45vh;
+ }
+
+ .ui.image,
+ img {
+ max-width: 50%;
+ }
+}
+
+.block.align.right {
+ z-index: 2;
+
+ &.maps iframe,
+ &.video .video-inner,
+ img {
+ margin-bottom: 1em;
+ margin-left: 1em !important;
+ float: right;
+ }
+
+ &.video .video-inner {
+ width: 50%;
+ }
+
+ &.maps iframe {
+ width: 50%;
+ height: 45vh;
+ }
+
+ .ui.image,
+ img {
+ max-width: 50%;
+ }
+}
+
+.block.align.center {
+ iframe,
+ img {
+ max-width: 100%;
+ margin-right: auto;
+ margin-left: auto;
+ }
+
+ iframe {
+ width: 100%;
+ }
+}
+
+// Hacks for the full width image
+body .ui.wrapper > .block.align.full,
+body.has-toolbar.has-sidebar .ui.wrapper > .ui.inner .block.align.full,
+body.has-toolbar-collapsed.has-sidebar
+.ui.wrapper
+> .ui.inner
+.block.align.full,
+body.has-toolbar-collapsed.has-sidebar-collapsed
+.ui.wrapper
+> .ui.inner
+.block.align.full,
+body.has-toolbar.has-sidebar-collapsed
+.ui.wrapper
+> .ui.inner
+.block.align.full {
+ width: 100% !important;
+
+ iframe {
+ width: 100%;
+ }
+
+ img {
+ width: 100%;
+ }
+}
+
+body.has-toolbar.has-sidebar .ui.wrapper > .ui.inner.block.full,
+body.has-toolbar-collapsed.has-sidebar .ui.wrapper > .ui.inner.block.full,
+body.has-toolbar-collapsed.has-sidebar-collapsed
+.ui.wrapper
+> .ui.inner.block.full,
+body.has-toolbar.has-sidebar-collapsed .ui.wrapper > .ui.inner.block.full {
+ width: 100% !important;
+
+ iframe {
+ width: 100%;
+ }
+
+ img {
+ width: 100%;
+ }
+}
+
+.block.align:not(.right):not(.left) {
+ clear: both;
+}
+
+.title.block .public-DraftEditorPlaceholder-inner {
+ font-size: @h1;
+ font-weight: @headerFontWeight;
+ line-height: @headerLineHeight;
+}
+
+.ui.block.table {
+ border: 0;
+}
+
+.block {
+ position: relative;
+ margin-bottom: 1em;
+
+ h1:last-child,
+ h2:last-child,
+ h3:last-child,
+ h4:last-child,
+ h5:last-child {
+ margin: @headerMargin;
+ }
+
+ p {
+ margin: @paragraphMargin;
+ }
+
+ .toolbar {
+ position: absolute;
+ z-index: 10;
+ top: -32px;
+ left: 50%;
+ display: flex;
+ padding: 4px;
+ background-color: rgba(255, 255, 255, 0.975);
+ border-radius: 2px;
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.05);
+ transform: translate(-50%, 0);
+
+ form {
+ display: flex;
+ }
+
+ & > svg {
+ display: inline-block !important;
+ box-sizing: content-box;
+ padding: 4px;
+ margin-right: 4px;
+ color: @brown !important;
+ }
+
+ .ui.input > input {
+ padding: 0;
+ border: none;
+ }
+
+ .ui.icon.button {
+ padding: 4px;
+ margin-left: 4px;
+ border-radius: 1px;
+ color: @brown !important;
+
+ &:hover {
+ background-color: #edf1f2 !important;
+ }
+ }
+
+ .ui.buttons:first-child {
+ & .ui.icon.button {
+ margin-left: 0;
+ }
+ }
+ }
+
+ .toolbar-inner {
+ display: flex;
+ min-width: 430px;
+ height: 40px;
+ padding: 4px;
+ background-color: rgba(255, 255, 255, 0.975);
+ border-radius: 2px;
+ box-shadow: 0 0 8px rgba(0, 0, 0, 0.1), 0 2px 4px rgba(0, 0, 0, 0.05);
+
+ form {
+ display: flex;
+ }
+
+ & > svg {
+ display: inline-block !important;
+ box-sizing: content-box;
+ padding: 4px;
+ margin-right: 4px;
+ color: @brown !important;
+ }
+
+ .ui.input {
+ width: 100%;
+ margin-left: 8px;
+ }
+
+ .ui.input > input {
+ padding: 0;
+ border: none;
+ }
+
+ .ui.icon.button {
+ padding: 4px;
+ margin-left: 4px;
+ border-radius: 1px;
+ color: @brown !important;
+
+ &:hover {
+ background-color: #edf1f2 !important;
+ }
+ }
+
+ .ui.buttons:first-child {
+ & .ui.icon.button {
+ margin-left: 0;
+ }
+ }
+ }
+
+ .ui.active.basic.icon.button {
+ border: 1px solid #2996da;
+ background: transparent !important;
+ }
+}
+
+// Hero block
+.block.hero {
+ clear: both;
+
+ .toolbar {
+ left: 25%;
+ }
+
+ .hero-body {
+ max-height: 400px;
+ flex: 1 1;
+ padding: 30px;
+ background-color: @tealBackground;
+ overflow-y: hidden;
+
+ h1 {
+ margin-top: 0;
+ }
+
+ p {
+ max-height: 287px;
+ margin: 0;
+ overflow-y: hidden;
+ word-break: break-word;
+ }
+ }
+
+ .hero-image {
+ display: block;
+ width: auto;
+ max-width: 50%;
+ height: auto;
+ max-height: 400px;
+ }
+
+ .image-add {
+ min-width: 50%;
+ }
+
+ .image-message {
+ min-height: 400px !important;
+ }
+
+ .block-inner-wrapper {
+ position: relative;
+ z-index: 1;
+ display: flex;
+ }
+
+ .title-editor,
+ .description-editor {
+ max-height: 287px;
+ overflow-y: hidden;
+ word-break: break-word;
+ }
+}
+
+.ui.basic.button.block-add-button {
+ // .ui.basic.button.block-delete-button {
+ position: absolute;
+ // margin-top: -21px;
+ top: -2px;
+ padding: 0;
+ margin-bottom: 0;
+ border: none;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #b8c6c8 !important;
+ transform: translateX(-40px);
+
+ &:hover,
+ &:focus {
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: @brown !important;
+ }
+}
+
+.block .ui.basic.button.delete-button {
+ position: absolute;
+ top: 0;
+ right: 0;
+ padding: 0;
+ border: none;
+ -webkit-box-shadow: none;
+ box-shadow: none;
+
+ &:hover,
+ &:focus {
+ -webkit-box-shadow: none;
+ box-shadow: none;
+ color: #e40166 !important;
+ }
+}
+
+// .ui.basic.button.block-delete-button {
+// top: 22px;
+// right: 0;
+// color: #b8c6b8 !important;
+// transform: translateX(40px);
+
+// &:hover,
+// &:focus {
+// -webkit-box-shadow: none;
+// box-shadow: none;
+// color: #e40166 !important;
+// }
+// }
+
+.drag.block.wrapper {
+ position: relative;
+}
+
+.drag.handle.wrapper {
+ position: absolute;
+ z-index: 1;
+ // top: 1px;
+ left: 0;
+ color: #b8c6c8;
+
+ .icon {
+ background: rgba(255, 255, 255, 0.2);
+ border-radius: 2px;
+ }
+
+ &:hover {
+ color: @brown;
+ }
+}
+
+.drag.block.title .drag.handle.wrapper {
+ top: 5px;
+}
+
+.drag.handle.wrapper.hidden {
+ display: none !important;
+}
+
+.description.block .public-DraftEditorPlaceholder-inner {
+ font-size: 1.125rem;
+ line-height: @lineHeight;
+}
+
+.callout {
+ padding: 1em;
+ margin: 1rem 0;
+ border: 1px solid rgba(34, 36, 38, 0.15);
+ border-radius: 0.28571429rem;
+ box-shadow: 0 1px 2px 0 rgba(34, 36, 38, 0.15);
+}
+
+.ui.blocker {
+ position: absolute;
+ z-index: 1;
+ width: 100%;
+ height: 100%;
+}
+
+.separator {
+ display: inline-block;
+ height: 24px;
+ margin: 0 0 4px 4px;
+ border-right: 1px solid #ddd;
+ vertical-align: bottom;
+}
+
+// HTML block
+.html-editor {
+ z-index: 1;
+ background-color: #f3f6f7;
+ border-radius: 4px;
+ font-family: monospace;
+ font-size: @16px;
+
+ &:focus-within textarea {
+ caret-color: #e40166;
+ outline: 0;
+ }
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+ color: #90a4ae;
+}
+
+.token.punctuation {
+ color: #9e9e9e;
+}
+
+.namespace {
+ opacity: 0.7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+ color: #e91e63;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+ color: #4caf50;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+ color: #795548;
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+ color: #3f51b5;
+}
+
+.token.function {
+ color: #f44336;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+ color: #ff9800;
+}
+
+.token.important,
+.token.bold {
+ font-weight: bold;
+}
+
+.token.italic {
+ font-style: italic;
+}
+
+.token.entity {
+ cursor: help;
+}
+
+.link-form-container {
+ button {
+ padding: 0;
+ border: 0;
+ background: transparent;
+ color: @linkColor;
+ cursor: pointer;
+ text-align: initial;
+ text-decoration: underline;
+
+ &:focus {
+ outline: none;
+ }
+ }
+}
+
+.accordion-tools {
+ display: flex;
+ align-items: center;
+
+ .ui.basic.button {
+ margin-right: 10px;
+
+ &:hover {
+ background-color: transparent !important;
+ }
+ }
+}
diff --git a/theme/site/extras/custom.overrides b/theme/site/extras/custom.overrides
new file mode 100644
index 0000000..a652411
--- /dev/null
+++ b/theme/site/extras/custom.overrides
@@ -0,0 +1,8 @@
+& {
+ @import 'blocks';
+ @import 'draftjs';
+ @import 'sidebar';
+
+ @import 'toolbar';
+ // @import 'utils';
+}
\ No newline at end of file
diff --git a/theme/site/extras/custom.variables b/theme/site/extras/custom.variables
new file mode 100644
index 0000000..e69de29
diff --git a/theme/site/extras/draftjs.less b/theme/site/extras/draftjs.less
new file mode 100644
index 0000000..b9b4f2a
--- /dev/null
+++ b/theme/site/extras/draftjs.less
@@ -0,0 +1,272 @@
+.draftJsToolbar__buttonWrapper__1Dmqh {
+ display: inline-block;
+}
+
+.draftJsToolbar__button__qi1gf {
+ width: 36px;
+ height: 34px;
+ padding-top: 5px;
+ border: 0;
+ background: #fbfbfb;
+ color: #888;
+ font-size: 18px;
+ vertical-align: bottom;
+}
+
+.draftJsToolbar__button__qi1gf svg {
+ fill: #888;
+}
+
+.draftJsToolbar__button__qi1gf:hover,
+.draftJsToolbar__button__qi1gf:focus {
+ background: #f3f3f3;
+ outline: 0; /* reset for :focus */
+}
+
+.draftJsToolbar__active__3qcpF {
+ background: #efefef;
+ color: #444;
+}
+
+.draftJsToolbar__active__3qcpF svg {
+ fill: #444;
+}
+
+.draftJsToolbar__separator__3U7qt {
+ display: inline-block;
+ height: 24px;
+ margin: 0 0.5em;
+ border-right: 1px solid #ddd;
+}
+
+.draftJsToolbar__toolbar__dNtBH {
+ position: absolute;
+ z-index: 2;
+ left: 50%;
+ box-sizing: border-box;
+ border: 1px solid #ddd;
+ background: #fff;
+ border-radius: 2px;
+ box-shadow: 0 1px 3px 0 rgba(220, 220, 220, 1);
+ -webkit-transform: translate(-50%) scale(0);
+ transform: translate(-50%) scale(0);
+}
+
+.draftJsToolbar__toolbar__dNtBH:after,
+.draftJsToolbar__toolbar__dNtBH:before {
+ position: absolute;
+ top: 100%;
+ left: 50%;
+ width: 0;
+ height: 0;
+ border: solid transparent;
+ content: ' ';
+ pointer-events: none;
+}
+
+.draftJsToolbar__toolbar__dNtBH:after {
+ margin-left: -4px;
+ border-width: 4px;
+ border-color: rgba(255, 255, 255, 0);
+ border-top-color: #fff;
+}
+
+.draftJsToolbar__toolbar__dNtBH:before {
+ margin-left: -6px;
+ border-width: 6px;
+ border-color: rgba(221, 221, 221, 0);
+ border-top-color: #ddd;
+}
+
+.draftJsToolbar__blockType__27Jwn {
+ width: 36px;
+ height: 36px;
+ box-sizing: border-box;
+ padding: 5px;
+ margin: 0;
+ border: 1px solid #ddd;
+ background: #fff;
+ border-radius: 18px;
+ cursor: pointer;
+ line-height: 36px;
+ text-align: center;
+}
+
+.draftJsToolbar__blockType__27Jwn svg {
+ fill: #888;
+}
+
+.draftJsToolbar__spacer__2Os2z {
+ position: absolute;
+ left: 50%;
+ width: 74px;
+ height: 8px;
+ -webkit-transform: translate(-50%);
+ transform: translate(-50%);
+}
+
+.draftJsToolbar__popup__GHzbY {
+ position: absolute;
+ z-index: 3;
+ left: 50%;
+ width: 74px;
+ box-sizing: border-box;
+ margin-top: 8px;
+ border: 1px solid #ddd;
+ background: #efefef;
+ background: #fff;
+ border-radius: 2px;
+ box-shadow: 0 1px 3px 0 rgba(220, 220, 220, 1);
+ -webkit-transform: translate(-50%);
+ transform: translate(-50%);
+}
+
+.draftJsToolbar__popup__GHzbY:after,
+.draftJsToolbar__popup__GHzbY:before {
+ position: absolute;
+ bottom: 100%;
+ left: 50%;
+ width: 0;
+ height: 0;
+ border: solid transparent;
+ content: ' ';
+ pointer-events: none;
+}
+
+.draftJsToolbar__popup__GHzbY:after {
+ margin-left: -4px;
+ border-width: 4px;
+ border-color: rgba(251, 251, 251, 0);
+ border-bottom-color: #fbfbfb;
+}
+
+.draftJsToolbar__popup__GHzbY:before {
+ margin-left: -6px;
+ border-width: 6px;
+ border-color: rgba(221, 221, 221, 0);
+ border-bottom-color: #ddd;
+}
+
+.draftJsToolbar__buttonWrapper__1Dmqh {
+ display: inline-block;
+}
+
+.draftJsToolbar__button__qi1gf {
+ width: 36px;
+ height: 34px;
+ padding-top: 5px;
+ border: 0;
+ background: #fbfbfb;
+ color: #888;
+ font-size: 18px;
+ vertical-align: bottom;
+}
+
+.draftJsToolbar__button__qi1gf svg {
+ fill: #888;
+}
+
+.draftJsToolbar__button__qi1gf:hover,
+.draftJsToolbar__button__qi1gf:focus {
+ background: #f3f3f3;
+ outline: 0; /* reset for :focus */
+}
+
+.draftJsToolbar__active__3qcpF {
+ background: #efefef;
+ color: #444;
+}
+
+.draftJsToolbar__active__3qcpF svg {
+ fill: #444;
+}
+
+.draftJsToolbar__separator__3M3L7 {
+ display: inline-block;
+ height: 24px;
+ margin: 0 0.5em;
+ border-right: 1px solid #ddd;
+}
+
+.draftJsToolbar__wrapper__9NZgg {
+ position: absolute;
+ z-index: 1;
+}
+
+.DraftEditor-editorContainer,
+.DraftEditor-root,
+.public-DraftEditor-content {
+ height: inherit;
+ text-align: initial;
+}
+
+.public-DraftEditor-content[contenteditable='true'] {
+ -webkit-user-modify: read-write-plaintext-only;
+}
+
+.public-DraftEditor-content[contenteditable='true'] {
+ caret-color: #e40166;
+}
+
+.public-DraftEditor-content {
+ min-height: 19px;
+}
+
+.DraftEditor-root {
+ position: relative;
+}
+
+.DraftEditor-editorContainer {
+ position: relative;
+ z-index: 1;
+}
+
+.public-DraftEditor-block {
+ position: relative;
+}
+
+.public-DraftEditorPlaceholder-root {
+ position: absolute;
+ z-index: 1;
+ color: @inputPlaceholderColor;
+}
+
+.DraftEditorPlaceholder-hidden {
+ display: none;
+}
+
+.draftJsToolbar__toolbar__dNtBH {
+ .block.toolbar();
+
+ z-index: 102;
+ padding: 3px;
+ border: none;
+
+ &:before {
+ border: none;
+ }
+}
+
+.draftJsToolbar__button__qi1gf {
+ width: 32px;
+ height: 32px;
+ padding: 0;
+ padding: 4px !important;
+ background: rgba(255, 255, 255, 0.975);
+ border-radius: 1px;
+ color: @brown;
+}
+
+.draftJsToolbar__buttonWrapper__1Dmqh + .draftJsToolbar__buttonWrapper__1Dmqh {
+ margin-left: 3px;
+}
+
+.draftJsToolbar__button__qi1gf.draftJsToolbar__active__3qcpF {
+ border-radius: 3px;
+ box-shadow: inset 0 0 0 1px @blue;
+ color: @blue;
+}
+
+.draftJsToolbar__separator__3U7qt {
+ height: 32px;
+}
diff --git a/theme/site/extras/extras.overrides b/theme/site/extras/extras.overrides
new file mode 100644
index 0000000..32e2bc3
--- /dev/null
+++ b/theme/site/extras/extras.overrides
@@ -0,0 +1,5 @@
+// Place here all the extra non-SemanticUI components/modules CSS
+// and make behave it like the SemanticUI ones
+
+// & { @import "main"; }
+// & { @import "custom"; }
diff --git a/theme/site/extras/main.overrides b/theme/site/extras/main.overrides
new file mode 100644
index 0000000..3207dcf
--- /dev/null
+++ b/theme/site/extras/main.overrides
@@ -0,0 +1,288 @@
+/*******************************
+ Theme
+*******************************/
+
+// @type: 'extra';
+// @element: 'main';
+
+// @import (multiple) '../../theme.config';
+
+// // Extras (third party libs)
+// @import (less) '~hamburgers/dist/hamburgers.css';
+// @import (less) '~react-toastify/dist/ReactToastify.css';
+
+// General Styling
+
+body {
+ display: flex;
+
+ @media only screen and (max-width: @largestMobileScreen) {
+ flex-direction: column;
+ }
+
+ &.has-toolbar-menu-open {
+ // The body scroll locker when the menu is active in mobile.
+ @media only screen and (max-width: @largestMobileScreen) {
+ overflow: hidden;
+ }
+ }
+}
+
+#main {
+ display: flex;
+ flex: 1;
+ flex-direction: column;
+}
+
+.documentFirstHeading {
+ position: relative;
+ border-bottom: 2px solid @purpleBackground;
+
+ &::before {
+ position: absolute;
+ bottom: -3px;
+ left: 0;
+ width: 30px;
+ height: 0;
+ border-bottom: 3px solid @pink;
+ content: '';
+ }
+}
+
+.documentDescription {
+ color: #5d7a8e;
+ font-size: 1.125rem;
+}
+
+::-moz-selection {
+ border-width: 20px;
+ border-style: solid;
+ background-color: rgba(31, 189, 238, 0.5);
+ border-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2MCIgaGVpZ2h0PSI2MCIgdmlld0JveD0iMCAwIDYwIDYwIj4KICA8ZyBmaWxsPSIjMUZCRUVGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIG9wYWNpdHk9Ii45NSI+CiAgICA8cGF0aCBkPSJNMTAgNjBDNC40NzcxNTI1IDYwIDAgNTUuNTI0MDYxOCAwIDUwIDMuNTUyNzEzNjhlLTE1IDQ0LjQ3NzE1MjUgNC40NzU5MzgxOCA0MCAxMCA0MEwyMCA0MCAyMCA1MEMyMCA1NS41MjI4NDc1IDE1LjUyNDA2MTggNjAgMTAgNjB6TTQwIDUwQzQwIDU1LjUyMjg0NzUgNDQuNDc1OTM4MiA2MCA1MCA2MEw1MCA2MEM1NS41MjI4NDc1IDYwIDYwIDU1LjUyNDA2MTggNjAgNTBMNjAgNTBDNjAgNDQuNDc3MTUyNSA1NS41MjQwNjE4IDQwIDUwIDQwTDQwIDQwIDQwIDUwIDQwIDUweiIvPgogIDwvZz4KPC9zdmc+Cg==')
+ 20 fill repeat;
+}
+
+::selection {
+ border-width: 20px;
+ border-style: solid;
+ background-color: rgba(31, 189, 238, 0.5);
+ border-image: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI2MCIgaGVpZ2h0PSI2MCIgdmlld0JveD0iMCAwIDYwIDYwIj4KICA8ZyBmaWxsPSIjMUZCRUVGIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiIG9wYWNpdHk9Ii45NSI+CiAgICA8cGF0aCBkPSJNMTAgNjBDNC40NzcxNTI1IDYwIDAgNTUuNTI0MDYxOCAwIDUwIDMuNTUyNzEzNjhlLTE1IDQ0LjQ3NzE1MjUgNC40NzU5MzgxOCA0MCAxMCA0MEwyMCA0MCAyMCA1MEMyMCA1NS41MjI4NDc1IDE1LjUyNDA2MTggNjAgMTAgNjB6TTQwIDUwQzQwIDU1LjUyMjg0NzUgNDQuNDc1OTM4MiA2MCA1MCA2MEw1MCA2MEM1NS41MjI4NDc1IDYwIDYwIDU1LjUyNDA2MTggNjAgNTBMNjAgNTBDNjAgNDQuNDc3MTUyNSA1NS41MjQwNjE4IDQwIDUwIDQwTDQwIDQwIDQwIDUwIDQwIDUweiIvPgogIDwvZz4KPC9zdmc+Cg==')
+ 20 fill repeat;
+}
+
+// SVGs
+svg.circled {
+ box-sizing: content-box;
+ padding: 4px;
+ border: 2px solid currentColor;
+ border-radius: 50px;
+}
+
+svg.icon {
+ // Experiment if this is ok for all icons
+ box-sizing: content-box;
+}
+
+button .close {
+ color: @darkHotPink;
+}
+
+// Override default behavior for forms and segments
+.ui.form,
+.ui.segments,
+.ui.segment {
+ position: static !important;
+}
+
+// Buttons colored
+button {
+ &.contents {
+ color: @teal-blue;
+ }
+
+ &.save {
+ color: @teal-blue;
+ }
+
+ &.cancel {
+ color: @darkHotPink;
+ }
+
+ &.edit {
+ color: @teal-blue;
+ }
+}
+
+// Button reset
+.button-reset {
+ padding: 0;
+ border: 0;
+ background: transparent;
+ cursor: pointer;
+ text-align: initial;
+
+ &:focus {
+ outline: none;
+ }
+}
+
+// Drag and drop
+.drag.handle {
+ cursor: move;
+}
+
+.drag.layer {
+ position: relative;
+ padding: 1rem 2rem 1rem 2rem;
+ margin: -1rem -2rem 0 -2rem;
+}
+
+.drag.layer:hover .drag.edit,
+.drag.layer:hover .drag.toolbar {
+ display: block;
+}
+
+.drag.layer .drag.handle {
+ margin-bottom: 0.5rem;
+}
+
+.drag.toolbar {
+ position: absolute;
+ top: 12px;
+ left: 0;
+ display: none;
+}
+
+.drag.edit {
+ position: absolute;
+ top: 12px;
+ right: 0;
+ display: none;
+}
+
+// Toolbar
+.editbar {
+ position: fixed;
+ z-index: 10;
+ top: 60px;
+ left: 400px;
+}
+
+// Diff view
+.deletion {
+ background-color: #f8cbcb;
+}
+
+.addition {
+ background-color: #a6f3a6;
+}
+
+// Socialmedia sharing
+.SocialMediaShareCount,
+.SocialMediaShareButton {
+ display: inline-block;
+}
+
+// Header
+.tools {
+ margin-right: 1em;
+}
+
+// Comments
+.comments {
+ margin-top: 20px;
+}
+
+// Toasts
+.Toastify__toast-container {
+ width: 480px;
+ color: inherit;
+
+ @media only screen and (max-width: @largestMobileScreen) {
+ width: 100vw;
+ }
+}
+
+.Toastify__toast-container--bottom-center {
+ bottom: 0;
+ padding: 0;
+ margin-left: -240px;
+
+ @media only screen and (max-width: @largestMobileScreen) {
+ margin-left: 0;
+ }
+
+ .Toastify__toast {
+ min-height: 60px;
+ align-items: center;
+ padding: 18px;
+ margin-bottom: 0;
+ }
+
+ .Toastify__toast-body {
+ display: flex;
+ }
+
+ .toast-inner-content {
+ margin-left: 8px;
+
+ h4 {
+ padding-top: 4px;
+ margin-bottom: 0;
+ font-weight: @bold;
+ }
+
+ p {
+ font-weight: 300;
+ }
+ }
+
+ .toast-dismiss-action {
+ }
+
+ .Toastify__toast--info {
+ background: #aee2f2;
+ }
+
+ .Toastify__toast--error {
+ background: #f5c1c1;
+ }
+
+ .Toastify__toast--success {
+ background: #c9eab1;
+ }
+
+ .Toastify__toast--warning {
+ background: #f3e2ab;
+ }
+}
+
+.users-control-panel .table {
+ overflow-x: scroll;
+
+ &::-webkit-scrollbar {
+ width: 3px;
+ height: 3px; /* scrollbar height */
+ background: transparent; /* optional: just make scrollbar invisible */
+ }
+}
+
+// @import 'utils';
+// @import 'toolbar';
+// @import 'draftjs';
+// @import 'blocks';
+// @import 'sidebar';
+
+// .loadUIOverrides();
+
+
+.document_wide_view {
+ .content-area {
+ main {
+ padding: 3rem 1rem;
+ #page-document {
+ padding: 0;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/theme/site/extras/sidebar.less b/theme/site/extras/sidebar.less
new file mode 100644
index 0000000..e4cfba6
--- /dev/null
+++ b/theme/site/extras/sidebar.less
@@ -0,0 +1,344 @@
+// Object Browser Container
+
+@media only screen and (max-width: @largestMobileScreen) {
+ .has-toolbar {
+ .sidebar-container {
+ top: 100px;
+ bottom: 0;
+ height: calc(100vh - 100px);
+ }
+ }
+
+ .has-toolbar-collapsed {
+ .sidebar-container {
+ top: 20px;
+ bottom: 0;
+ height: calc(100vh - 20px);
+ }
+ }
+}
+
+.sidebar-container {
+ position: fixed;
+ z-index: 100;
+ top: 0;
+ right: 0;
+ width: 375px;
+ height: 100vh;
+ background-color: #fff;
+ box-shadow: 0 1px 2px 0 #c7d5d8;
+ transition: right 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045),
+ height 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045),
+ top 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+
+ &.collapsed {
+ right: -355px;
+
+ .tabs-wrapper {
+ opacity: 0;
+ transition: opacity 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+ }
+ }
+
+ .ui.raised.segments {
+ display: flex;
+ height: 100%;
+ flex-direction: column;
+ }
+
+ button {
+ // Default reset for button
+ padding: 0;
+ border: 0;
+ background: transparent;
+ text-align: initial;
+
+ &:focus {
+ outline: none;
+ }
+ }
+
+ .trigger,
+ .trigger:focus,
+ .trigger:hover {
+ position: absolute;
+ z-index: 1;
+ top: 50%;
+ left: 0;
+ width: 20px;
+ height: 80px;
+ padding: 0;
+ margin-top: -40px;
+ background: transparent;
+ border-radius: 0;
+ opacity: 0.05;
+ transition: opacity 0.3s;
+ }
+
+ .trigger:hover {
+ opacity: 0.3;
+ transition: opacity 0.3s;
+ }
+
+ .trigger:before {
+ position: relative;
+ left: 8px;
+ display: block;
+ width: 4px;
+ height: 100%;
+ background: @blue;
+ content: '';
+ }
+
+ .tab-wrapper {
+ height: calc(100% - 61px);
+ padding: 0;
+ border-bottom: none;
+ overflow-x: hidden;
+ overflow-y: auto;
+
+ > * {
+ display: none;
+ }
+
+ > :last-child {
+ display: block;
+ }
+ }
+
+ .tabs-wrapper {
+ height: 100%;
+ }
+
+ .tab-forbidden {
+ margin: calc(50% - 24px) auto;
+ color: #bac5c7;
+ }
+
+ header {
+ display: flex;
+ height: 60px;
+ align-items: center;
+ justify-content: space-between;
+ padding: 8px 20px;
+ border-bottom: 4px solid #b8c6c8;
+
+ .icon {
+ padding-right: 10px;
+ }
+
+ h2 {
+ flex: 1 0 auto;
+ margin: 0 !important;
+ color: #517776;
+ font-size: 16px;
+ }
+
+ form {
+ flex: 1 0 auto;
+ }
+
+ .search {
+ width: 100%;
+
+ input {
+ border: none;
+ }
+ }
+
+ a {
+ display: flex;
+ }
+
+ &.pulled {
+ justify-content: flex-start;
+ padding-right: 10px;
+ padding-left: 10px;
+
+ button {
+ margin-right: 10px;
+ cursor: pointer;
+ }
+ }
+ }
+
+ .ui.segment:not(.tab) {
+ border-bottom: 1px solid #b8c6c8;
+ }
+
+ .ui.segment.tabbed-actions {
+ display: flex;
+ justify-content: space-around;
+ padding: 0;
+ border-top: 1px solid #b8c6c8;
+ border-bottom: 1px solid #b8c6c8;
+
+ .ui.buttons {
+ width: 100%;
+
+ .button:last-child {
+ border-radius: 0;
+ }
+ }
+
+ .ui.basic.active.button {
+ background-color: #edf1f2 !important;
+ }
+ }
+
+ .ui.segment.object-listing {
+ flex: 1 1 auto;
+ overflow-x: hidden;
+ overflow-y: scroll;
+ }
+
+ ul {
+ flex: 1 0 auto;
+ margin: 0;
+
+ li {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ padding: 10px 0 10px 5px;
+ cursor: pointer;
+
+ &.selected-item {
+ background-color: @tealBackground;
+ }
+
+ &.disabled {
+ opacity: 0.5;
+ }
+
+ span {
+ display: flex;
+ align-items: center;
+
+ .icon {
+ padding-right: 10px;
+ }
+ }
+ }
+ }
+
+ .ui.segment.form.actions,
+ .ui.segment.form.sidebar-image-data {
+ padding-bottom: 1em;
+ }
+
+ .ui.accordion {
+ .title {
+ display: flex;
+ justify-content: space-between;
+ }
+
+ .content {
+ padding: 0;
+ }
+ }
+}
+
+#sidebar .pusher.expanded {
+ margin-left: 375px;
+}
+
+#sidebar .pusher {
+ margin-left: 20px;
+ transition: margin-left 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+}
+
+#sidebar-properties {
+ header {
+ border-bottom: 2px solid #b8c6c8;
+ }
+}
+
+// Animation
+.sidebar-container {
+}
+
+.sidebar-container-enter {
+ .sidebar-container;
+
+ transform: translate(100%, 0%);
+}
+
+.sidebar-container-enter.sidebar-container-enter-active {
+ .sidebar-container;
+
+ transform: translate(0%, 0%);
+ transition: transform 0.5s cubic-bezier(0.09, 0.11, 0.24, 0.91);
+}
+
+.sidebar-container-enter-done {
+ .sidebar-container;
+}
+
+.sidebar-container-exit {
+ .sidebar-container;
+
+ transform: translate(0%, 0%);
+ transition: transform 0.5s cubic-bezier(0.09, 0.11, 0.24, 0.91);
+}
+
+.sidebar-container-exit.sidebar-container-exit-active {
+ .sidebar-container;
+
+ transform: translate(100%, 0%);
+ transition: transform 0.5s cubic-bezier(0.09, 0.11, 0.24, 0.91);
+}
+
+.sidebar-metadata-container {
+ display: flex;
+ justify-content: space-between;
+}
+
+.field-file-name {
+ display: flex;
+ align-items: flex-end;
+ padding: 20px 0;
+}
+
+.align-tools {
+ display: flex !important;
+ align-items: center;
+
+ .ui.icon.button {
+ padding: 4px;
+ margin-left: 4px;
+ border-radius: 1px;
+ color: @brown !important;
+
+ &:hover {
+ background-color: #edf1f2 !important;
+ }
+ }
+
+ .ui.buttons:first-child .ui.icon.button {
+ margin-left: 0;
+ }
+
+ .ui.active.basic.icon.button {
+ border: 1px solid #2996da;
+ background: transparent !important;
+ }
+}
+
+.ui.icon.input + button {
+ position: absolute;
+ top: 0;
+ right: 10px;
+ width: 2.67142857em;
+ height: 100%;
+ padding: 4px;
+ margin: 0;
+ border-radius: 1px;
+ color: @brown !important;
+ line-height: 1;
+ text-align: center;
+
+ &:hover {
+ background-color: #edf1f2 !important;
+ }
+}
diff --git a/theme/site/extras/toolbar.less b/theme/site/extras/toolbar.less
new file mode 100644
index 0000000..67f3787
--- /dev/null
+++ b/theme/site/extras/toolbar.less
@@ -0,0 +1,656 @@
+@teal-blue: #007eb1;
+@background-content: #f2f5f6;
+@silver-blue: #b8c6c8;
+@silver: #c7d5d8;
+@darkHotPink: #e40166;
+@toolbar-text: #252525;
+
+.has-toolbar {
+ .pusher {
+ height: 100px;
+ transition: height 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+ }
+}
+
+.has-toolbar-collapsed {
+ .pusher {
+ height: 20px;
+ transition: height 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+ }
+}
+
+#toolbar {
+ .toolbar {
+ position: fixed;
+ z-index: 100;
+ display: flex;
+ width: 100%;
+ height: 20px;
+ flex-direction: column;
+ background-color: #fff;
+ box-shadow: 0 1px 2px 0 #c7d5d8;
+ transition: height 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+
+ &.expanded {
+ height: 100px;
+
+ .toolbar-actions {
+ opacity: 1;
+ transition: opacity 0.1s 0.2s;
+
+ &.hidden {
+ opacity: 0;
+ transition: opacity 0.1s 0.2s;
+ }
+ }
+
+ .toolbar-body {
+ height: 100px;
+ }
+
+ .toolbar-handler {
+ button {
+ opacity: 0.3;
+ }
+
+ // State colors
+ .published:before {
+ background: @teal-blue;
+ }
+
+ .private:before {
+ background: @darkHotPink;
+ }
+ }
+
+ .toolbar-bottom {
+ a {
+ opacity: 1;
+ }
+ }
+
+ .toolbar-bottom {
+ .minipastanaga {
+ bottom: 10px;
+ opacity: 0;
+ transition: bottom 0.3s 0.3s, opacity 0.3s;
+ }
+ }
+
+ .toolbar-button-spacer {
+ margin-left: auto;
+ }
+ }
+
+ &-content {
+ overflow: hidden;
+ max-height: 0;
+ background-color: #fff;
+ box-shadow: 0 1px 2px 0 #c7d5d8;
+ opacity: 0;
+ // Removing this because is causing grey scroll appears
+ // overflow-y: scroll;
+ transition: max-height 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045),
+ opacity 0.3s 0.3s;
+
+ &.show {
+ max-height: 900px;
+ opacity: 1;
+ transition: max-height 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045),
+ opacity 0.3s 0.3s;
+ }
+ }
+
+ &-body {
+ display: flex;
+ height: 0;
+ flex-direction: row-reverse;
+ transition: height 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+
+ a,
+ button {
+ margin-left: 20px;
+ color: @brown;
+ cursor: pointer;
+ }
+
+ button {
+ // Default reset for button
+ padding: 0;
+ border: 0;
+ background: transparent;
+ text-align: initial;
+
+ &:focus {
+ outline: none;
+ }
+ }
+ }
+
+ &-actions {
+ display: flex;
+ height: 100%;
+ flex: 1;
+ flex-direction: row-reverse;
+ align-items: center;
+ padding: 0 20px;
+ opacity: 0;
+ transition: opacity 0.1s 0.2s;
+
+ .contents {
+ color: @teal-blue;
+ }
+
+ .save {
+ color: @teal-blue;
+ }
+
+ .cancel {
+ color: @darkHotPink;
+ }
+
+ .edit {
+ color: @teal-blue;
+ }
+
+ a,
+ button {
+ display: block;
+ }
+ }
+
+ &-handler {
+ position: absolute;
+ bottom: 0;
+ display: flex;
+ width: 100%;
+ justify-content: center;
+
+ button {
+ width: 80px;
+ height: 20px;
+ padding: 0;
+ border: 0;
+ background-color: transparent;
+ cursor: pointer;
+ transition: opacity 0.3s;
+
+ &::before {
+ position: relative;
+ display: block;
+ width: 100%;
+ height: 4px;
+ background-color: red;
+ content: '';
+ }
+ }
+ }
+
+ &-bottom {
+ display: flex;
+ // flex: 1;
+ align-items: center;
+
+ a {
+ opacity: 0;
+ }
+
+ .user {
+ display: none;
+ }
+
+ .divider {
+ display: none;
+ }
+
+ .pastanagalogo {
+ display: none;
+ }
+
+ .minipastanaga {
+ position: absolute;
+ bottom: 2px;
+ height: 14px;
+ padding: 0 6px;
+ opacity: 1;
+ transition: bottom 0.3s 0.3s, opacity 0.3s 0.3s;
+ }
+ }
+ }
+
+ .toolbar-content,
+ .toolbar {
+ button {
+ // Default reset for button
+ padding: 0;
+ border: 0;
+ background: transparent;
+ cursor: pointer;
+ text-align: initial;
+
+ &:focus {
+ outline: none;
+ }
+ }
+ }
+
+ .toolbar-content {
+ z-index: 3;
+ box-shadow: 0 1px 2px 0 #c7d5d8;
+ overflow-y: auto;
+ }
+
+ .pusher-puller {
+ position: relative;
+ z-index: 2;
+ display: flex;
+ width: 2000px;
+ // min-height: 500px;
+ transition: transform 300ms linear;
+ will-change: transform;
+
+ > * {
+ // position: absolute;
+ // width: 100%;
+ // height: 100%;
+ // top: 0;
+ // left: 0;
+ }
+
+ // > *:first-child {
+ // position: relative;
+ // }
+ }
+
+ @media only screen and (min-width: @largestMobileScreen) {
+ .toolbar {
+ width: 20px;
+ height: 100%;
+ flex-direction: row;
+ justify-content: flex-end;
+ transition: width 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+
+ & + .pusher {
+ margin-right: 20px;
+ transition: margin-right 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+ }
+
+ &.expanded {
+ width: 80px;
+ height: 100%;
+
+ & + .pusher {
+ margin-right: 80px;
+ transition: margin-right 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+ }
+
+ .toolbar-body {
+ height: 100%;
+ }
+
+ .toolbar-actions {
+ flex-direction: column;
+ }
+
+ .toolbar-bottom {
+ .user {
+ opacity: 1;
+ transition: opacity 0.1s 0.2s;
+ }
+
+ .pastanagalogo {
+ display: block;
+ }
+
+ .divider {
+ width: 40px;
+ height: 20px;
+ border-top: 1px solid #c7d5d8;
+ opacity: 1;
+ transition: opacity 0.1s 0.2s;
+ }
+ }
+ }
+
+ &-content {
+ position: fixed;
+ left: 84px;
+ width: 320px;
+ }
+
+ &-body {
+ display: flex;
+ width: 100%;
+ height: 100%;
+ flex-direction: column;
+ transition: width 0.3s cubic-bezier(0.6, -0.28, 0.735, 0.045);
+
+ a,
+ button {
+ margin-bottom: 20px;
+ margin-left: 0;
+ }
+ }
+
+ &-actions {
+ flex: 1;
+ flex-direction: column;
+ padding: 20px 0;
+
+ .more {
+ flex: 0;
+ }
+ }
+
+ &-bottom {
+ flex: 1;
+ flex-direction: column;
+ justify-content: flex-end;
+
+ .user {
+ display: block;
+ opacity: 0;
+ }
+
+ .divider {
+ display: block;
+ opacity: 0;
+ }
+
+ .minipastanaga {
+ bottom: 10px;
+ }
+
+ .pastanagalogo {
+ display: block;
+ padding-right: 6px;
+ padding-left: 6px;
+ margin-bottom: 10px;
+
+ img {
+ width: 100%;
+ }
+ }
+ }
+
+ &-handler {
+ display: flex;
+ width: 20px;
+ height: 100%;
+ flex-direction: column;
+ justify-content: center;
+
+ button {
+ width: 20px;
+ height: 80px;
+
+ &::before {
+ left: 8px;
+ width: 4px;
+ height: 100%;
+ }
+ }
+ }
+ }
+
+ .pusher-puller {
+ > * {
+ // TODO: look how to standard for all devices
+ width: 320px;
+ }
+ }
+ }
+
+ // Personal Tools
+ .pastanaga-menu {
+ width: 100vw;
+ height: calc(100vh - 100px);
+
+ &.has-inner-actions {
+ height: 100vh;
+
+ @media only screen and (min-width: @largestMobileScreen) {
+ height: auto;
+ }
+ }
+
+ header {
+ display: flex;
+ height: 60px;
+ align-items: center;
+ justify-content: space-between;
+ padding: 8px 20px;
+ border-bottom: 4px solid @silver-blue;
+
+ h2 {
+ flex: 1 0 auto;
+ margin: 0;
+ font-size: 16px;
+ font-weight: 500;
+ }
+
+ a {
+ display: flex;
+ }
+
+ &.pulled {
+ justify-content: flex-start;
+ padding-right: 10px;
+ padding-left: 10px;
+
+ button {
+ margin-right: 10px;
+ }
+ }
+ }
+
+ .ui.form {
+ height: 100%;
+ }
+
+ .ui.raised.segments {
+ display: flex;
+ height: calc(100vh - 60px);
+
+ @media only screen and (min-width: @largestMobileScreen) {
+ max-height: calc(520px - 60px);
+ }
+
+ .ui.segment:not(.actions) {
+ flex: 1 1 auto;
+ overflow-y: auto;
+ }
+ }
+
+ @media only screen and (min-width: @largestMobileScreen) {
+ width: 320px;
+ height: auto;
+ }
+ }
+
+ .pastanaga-menu-list {
+ ul {
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ padding: 10px 20px;
+ margin-top: 0;
+ list-style: none;
+ }
+
+ li {
+ // padding: 5px 0;
+
+ a,
+ button {
+ display: flex;
+ width: 100%;
+ height: 45px;
+ align-items: center;
+ justify-content: space-between;
+ padding: 0;
+ border: none;
+ background-color: transparent;
+ color: @toolbar-text;
+ cursor: pointer;
+ font-family: Poppins;
+ font-size: 14px;
+ font-weight: 500;
+ text-align: left;
+ text-transform: uppercase;
+
+ svg {
+ color: @teal-blue;
+ }
+ }
+ }
+
+ li:not(.state-select):not(.display-select) {
+ border-bottom: 1px solid @silver-blue;
+ }
+
+ .pastanaga-menu-label {
+ margin-right: 12px;
+ }
+
+ .pastanaga-menu-value {
+ font-weight: 300;
+ text-transform: initial;
+ }
+ }
+
+ .personal-tools {
+ header {
+ .back,
+ .vertical.divider {
+ @media only screen and (min-width: @largestMobileScreen) {
+ display: none;
+ }
+
+ margin-right: 10px;
+ }
+
+ .icon.logout {
+ color: @darkHotPink;
+ }
+ }
+
+ .avatar {
+ height: 220px;
+ background-color: #f2f5f6;
+
+ img {
+ width: 100%;
+ height: 100%;
+ object-fit: contain;
+ object-position: top;
+ }
+
+ &.default {
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ color: @brown;
+ }
+ }
+
+ .stats {
+ ul {
+ display: flex;
+ justify-content: center;
+ padding: 15px 0;
+ margin: 0;
+ background-color: #f2f5f6;
+ color: #878f93;
+ list-style: none;
+ }
+
+ li {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
+ padding: 0 10px;
+
+ span:first-child {
+ font-size: 30px;
+ font-weight: 200;
+ }
+
+ span:last-child {
+ font-size: 12px;
+ font-weight: 500;
+ text-transform: uppercase;
+ }
+ }
+ }
+ }
+
+ // Profile
+ .vertical.divider {
+ height: 30px;
+ margin-right: 20px;
+ border-left: 1px solid @silver;
+ }
+
+ .profile,
+ .personal-tools {
+ header {
+ button {
+ color: @teal-blue;
+ }
+ }
+ }
+
+ .menu-more {
+ header {
+ svg {
+ color: #d12c67;
+ }
+ }
+
+ .more-user {
+ @media only screen and (min-width: @largestMobileScreen) {
+ display: none;
+ }
+ }
+
+ .state-select,
+ .display-select {
+ display: flex;
+ width: 100%;
+
+ .react-select-container {
+ flex: 1 0 75%;
+ }
+
+ label {
+ flex: 1 0 25%;
+ padding-top: 18px;
+ margin-right: 5px;
+ border-bottom: 1px solid #edf1f2;
+ font-size: 14px;
+ font-weight: 500;
+ text-transform: uppercase;
+ }
+ }
+ }
+}
+// Orphaned CSS
+.ui.dropdown .menu.left {
+ right: 0;
+ left: auto;
+}
+
+.ui.segment.dashed {
+ border: 3px dashed #ccc;
+ box-shadow: none;
+}
+
+@media only screen and (max-width: 767px) {
+ .ui.menu.stackable > .menu,
+ .ui.menu.stackable > .menu.right {
+ display: block;
+ }
+}
+// End Orphaned CSS
diff --git a/theme/site/extras/utils.overrides b/theme/site/extras/utils.overrides
new file mode 100644
index 0000000..8a609f5
--- /dev/null
+++ b/theme/site/extras/utils.overrides
@@ -0,0 +1,63 @@
+/* Responsive visibility helper classes */
+
+body:not(.has-sidebar):not(.has-sidebar-collapsed) {
+ /* Mobile */
+ @media only screen and (max-width: 767px) {
+ [class*='mobile hidden'],
+ [class*='tablet only']:not(.mobile),
+ [class*='computer only']:not(.mobile),
+ [class*='large screen only']:not(.mobile),
+ [class*='widescreen only']:not(.mobile),
+ [class*='or lower hidden'] {
+ display: none !important;
+ }
+ }
+
+ /* Tablet / iPad Portrait */
+ @media only screen and (min-width: 768px) and (max-width: 903px) {
+ [class*='mobile only']:not(.tablet),
+ [class*='tablet hidden'],
+ [class*='computer only']:not(.tablet),
+ [class*='large screen only']:not(.tablet),
+ [class*='widescreen only']:not(.tablet),
+ [class*='or lower hidden']:not(.mobile) {
+ display: none !important;
+ }
+ }
+
+ /* Computer / Desktop / iPad Landscape */
+ @media only screen and (min-width: 992px) and (max-width: 1199px) {
+ [class*='mobile only']:not(.computer),
+ [class*='tablet only']:not(.computer),
+ [class*='computer hidden'],
+ [class*='large screen only']:not(.computer),
+ [class*='widescreen only']:not(.computer),
+ [class*='or lower hidden']:not(.tablet):not(.mobile) {
+ display: none !important;
+ }
+ }
+
+ /* Large Monitor */
+ @media only screen and (min-width: 1200px) and (max-width: 1919px) {
+ [class*='mobile only']:not([class*='large screen']),
+ [class*='tablet only']:not([class*='large screen']),
+ [class*='computer only']:not([class*='large screen']),
+ [class*='large screen hidden'],
+ [class*='widescreen only']:not([class*='large screen']),
+ [class*='or lower hidden']:not(.computer):not(.tablet):not(.mobile) {
+ display: none !important;
+ }
+ }
+
+ /* Widescreen Monitor */
+ @media only screen and (min-width: 1920px) {
+ [class*='mobile only']:not([class*='widescreen']),
+ [class*='tablet only']:not([class*='widescreen']),
+ [class*='computer only']:not([class*='widescreen']),
+ [class*='large screen only']:not([class*='widescreen']),
+ [class*='widescreen hidden'],
+ [class*='widescreen or lower hidden'] {
+ display: none !important;
+ }
+ }
+}
diff --git a/theme/site/globals/reset.overrides b/theme/site/globals/reset.overrides
new file mode 100644
index 0000000..1df2fb2
--- /dev/null
+++ b/theme/site/globals/reset.overrides
@@ -0,0 +1,461 @@
+/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */
+
+/* Document
+ ========================================================================== */
+
+/**
+ * 1. Correct the line height in all browsers.
+ * 2. Prevent adjustments of font size after orientation changes in
+ * IE on Windows Phone and in iOS.
+ */
+
+html {
+ line-height: 1.15; /* 1 */
+ -ms-text-size-adjust: 100%; /* 2 */
+ -webkit-text-size-adjust: 100%; /* 2 */
+}
+
+/* Sections
+ ========================================================================== */
+
+/**
+ * Remove the margin in all browsers (opinionated).
+ */
+
+body {
+ margin: 0;
+}
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+article,
+aside,
+footer,
+header,
+nav,
+section {
+ display: block;
+}
+
+/**
+ * Correct the font size and margin on `h1` elements within `section` and
+ * `article` contexts in Chrome, Firefox, and Safari.
+ */
+
+h1 {
+ margin: 0.67em 0;
+ font-size: 2em;
+}
+
+/* Grouping content
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in IE.
+ */
+
+figcaption,
+figure,
+main {
+ /* 1 */
+ display: block;
+}
+
+/**
+ * Add the correct margin in IE 8.
+ */
+
+figure {
+ margin: 1em 40px;
+}
+
+/**
+ * 1. Add the correct box sizing in Firefox.
+ * 2. Show the overflow in Edge and IE.
+ */
+
+hr {
+ overflow: visible; /* 2 */
+ height: 0; /* 1 */
+ box-sizing: content-box; /* 1 */
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+pre {
+ font-family: monospace, monospace; /* 1 */
+ font-size: 1em; /* 2 */
+}
+
+/* Text-level semantics
+ ========================================================================== */
+
+/**
+ * 1. Remove the gray background on active links in IE 10.
+ * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
+ */
+
+a {
+ background-color: transparent; /* 1 */
+ -webkit-text-decoration-skip: objects; /* 2 */
+}
+
+/**
+ * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
+ * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
+ */
+
+abbr[title] {
+ border-bottom: none; /* 1 */
+ text-decoration: underline; /* 2 */
+ text-decoration: underline dotted; /* 2 */
+}
+
+/**
+ * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
+ */
+
+b,
+strong {
+ font-weight: inherit;
+}
+
+/**
+ * Add the correct font weight in Chrome, Edge, and Safari.
+ */
+
+b,
+strong {
+ font-weight: bolder;
+}
+
+/**
+ * 1. Correct the inheritance and scaling of font size in all browsers.
+ * 2. Correct the odd `em` font sizing in all browsers.
+ */
+
+code,
+kbd,
+samp {
+ font-family: monospace, monospace; /* 1 */
+ font-size: 1em; /* 2 */
+}
+
+/**
+ * Add the correct font style in Android 4.3-.
+ */
+
+dfn {
+ font-style: italic;
+}
+
+/**
+ * Add the correct background and color in IE 9-.
+ */
+
+mark {
+ background-color: #ff0;
+ color: #000;
+}
+
+/**
+ * Add the correct font size in all browsers.
+ */
+
+small {
+ font-size: 80%;
+}
+
+/**
+ * Prevent `sub` and `sup` elements from affecting the line height in
+ * all browsers.
+ */
+
+sub,
+sup {
+ position: relative;
+ font-size: 75%;
+ line-height: 0;
+ vertical-align: baseline;
+}
+
+sub {
+ bottom: -0.25em;
+}
+
+sup {
+ top: -0.5em;
+}
+
+/* Embedded content
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+audio,
+video {
+ display: inline-block;
+}
+
+/**
+ * Add the correct display in iOS 4-7.
+ */
+
+audio:not([controls]) {
+ display: none;
+ height: 0;
+}
+
+/**
+ * Remove the border on images inside links in IE 10-.
+ */
+
+img {
+ border-style: none;
+}
+
+/**
+ * Hide the overflow in IE.
+ */
+
+svg:not(:root) {
+ overflow: hidden;
+}
+
+/* Forms
+ ========================================================================== */
+
+/**
+ * 1. Change the font styles in all browsers (opinionated).
+ * 2. Remove the margin in Firefox and Safari.
+ */
+
+button,
+input,
+optgroup,
+select,
+textarea {
+ margin: 0; /* 2 */
+ font-family: sans-serif; /* 1 */
+ font-size: 100%; /* 1 */
+ line-height: 1.15; /* 1 */
+}
+
+/**
+ * Show the overflow in IE.
+ * 1. Show the overflow in Edge.
+ */
+
+button,
+input {
+ /* 1 */
+ overflow: visible;
+}
+
+/**
+ * Remove the inheritance of text transform in Edge, Firefox, and IE.
+ * 1. Remove the inheritance of text transform in Firefox.
+ */
+
+button,
+select {
+ /* 1 */
+ text-transform: none;
+}
+
+/**
+ * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
+ * controls in Android 4.
+ * 2. Correct the inability to style clickable types in iOS and Safari.
+ */
+
+button,
+html [type="button"], /* 1 */
+[type="reset"],
+[type="submit"] {
+ -webkit-appearance: button; /* 2 */
+}
+
+/**
+ * Remove the inner border and padding in Firefox.
+ */
+
+button::-moz-focus-inner,
+[type='button']::-moz-focus-inner,
+[type='reset']::-moz-focus-inner,
+[type='submit']::-moz-focus-inner {
+ padding: 0;
+ border-style: none;
+}
+
+/**
+ * Restore the focus styles unset by the previous rule.
+ */
+
+button:-moz-focusring,
+[type='button']:-moz-focusring,
+[type='reset']:-moz-focusring,
+[type='submit']:-moz-focusring {
+ outline: 1px dotted ButtonText;
+}
+
+/**
+ * Correct the padding in Firefox.
+ */
+
+fieldset {
+ padding: 0.35em 0.75em 0.625em;
+}
+
+/**
+ * 1. Correct the text wrapping in Edge and IE.
+ * 2. Correct the color inheritance from `fieldset` elements in IE.
+ * 3. Remove the padding so developers are not caught out when they zero out
+ * `fieldset` elements in all browsers.
+ */
+
+legend {
+ display: table; /* 1 */
+ max-width: 100%; /* 1 */
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 3 */
+ color: inherit; /* 2 */
+ white-space: normal; /* 1 */
+}
+
+/**
+ * 1. Add the correct display in IE 9-.
+ * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
+ */
+
+progress {
+ display: inline-block; /* 1 */
+ vertical-align: baseline; /* 2 */
+}
+
+/**
+ * Remove the default vertical scrollbar in IE.
+ */
+
+textarea {
+ overflow: auto;
+}
+
+/**
+ * 1. Add the correct box sizing in IE 10-.
+ * 2. Remove the padding in IE 10-.
+ */
+
+[type='checkbox'],
+[type='radio'] {
+ box-sizing: border-box; /* 1 */
+ padding: 0; /* 2 */
+}
+
+/**
+ * Correct the cursor style of increment and decrement buttons in Chrome.
+ */
+
+[type='number']::-webkit-inner-spin-button,
+[type='number']::-webkit-outer-spin-button {
+ height: auto;
+}
+
+/**
+ * 1. Correct the odd appearance in Chrome and Safari.
+ * 2. Correct the outline style in Safari.
+ */
+
+[type='search'] {
+ -webkit-appearance: textfield; /* 1 */
+ outline-offset: -2px; /* 2 */
+}
+
+/**
+ * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
+ */
+
+[type='search']::-webkit-search-cancel-button,
+[type='search']::-webkit-search-decoration {
+ -webkit-appearance: none;
+}
+
+/**
+ * 1. Correct the inability to style clickable types in iOS and Safari.
+ * 2. Change font properties to `inherit` in Safari.
+ */
+
+::-webkit-file-upload-button {
+ -webkit-appearance: button; /* 1 */
+ font: inherit; /* 2 */
+}
+
+/* Interactive
+ ========================================================================== */
+
+/*
+ * Add the correct display in IE 9-.
+ * 1. Add the correct display in Edge, IE, and Firefox.
+ */
+
+details, /* 1 */
+menu {
+ display: block;
+}
+
+/*
+ * Add the correct display in all browsers.
+ */
+
+summary {
+ display: list-item;
+}
+
+/* Scripting
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 9-.
+ */
+
+canvas {
+ display: inline-block;
+}
+
+/**
+ * Add the correct display in IE.
+ */
+
+template {
+ display: none;
+}
+
+/* Hidden
+ ========================================================================== */
+
+/**
+ * Add the correct display in IE 10-.
+ */
+
+[hidden] {
+ display: none;
+}
+
+.unlist {
+ list-style-type: none;
+ padding-left: 0;
+ margin: 0;
+ width: 100%;
+ li {
+ display: inline-block;
+ margin-right: 1rem;
+ }
+}
\ No newline at end of file
diff --git a/theme/site/globals/reset.variables b/theme/site/globals/reset.variables
new file mode 100644
index 0000000..0eedf27
--- /dev/null
+++ b/theme/site/globals/reset.variables
@@ -0,0 +1,3 @@
+/*******************************
+ Reset
+*******************************/
\ No newline at end of file
diff --git a/theme/site/globals/site.less b/theme/site/globals/site.less
new file mode 100644
index 0000000..984de70
--- /dev/null
+++ b/theme/site/globals/site.less
@@ -0,0 +1,163 @@
+@type : 'global';
+@element : 'site';
+
+// @import (multiple) '../../theme.config';
+
+/*******************************
+ Page
+*******************************/
+
+// .loadFonts();
+
+@headingColor: #225511;
+
+html,
+body {
+ height: 100%;
+}
+
+html {
+ font-size: @emSize;
+}
+
+body {
+ margin: 0px;
+ padding: 0px;
+ overflow-x: @pageOverflowX;
+ min-width: @pageMinWidth;
+ background: @pageBackground;
+ font-family: @pageFont;
+ font-size: @fontSize;
+ line-height: @lineHeight;
+ color: @textColor;
+ font-smoothing: @fontSmoothing;
+}
+
+/*******************************
+ Headers
+*******************************/
+
+h1,
+h2,
+h3,
+h4,
+h5 {
+ font-family: @headerFont;
+ line-height: @headerLineHeight;
+ margin: @headerMargin;
+ font-weight: @headerFontWeight;
+ padding: 0em;
+ color: @headingColor;
+}
+
+@h1: 28px;
+@h2: 24px;
+@h3: 20px;
+
+h1 {
+ min-height: 1rem;
+ font-size: @h1;
+}
+
+h2 {
+ font-size: @h2;
+}
+
+h3 {
+ font-size: @h3;
+}
+
+h4 {
+ font-size: @h4;
+}
+
+h5 {
+ font-size: @h5;
+}
+
+#page-document {
+
+
+ p {
+ margin-bottom: 1em;
+ }
+}
+
+// h1:first-child,
+// h2:first-child,
+// h3:first-child,
+// h4:first-child,
+// h5:first-child {
+// margin-top: 0em;
+// }
+
+// h1:last-child,
+// h2:last-child,
+// h3:last-child,
+// h4:last-child,
+// h5:last-child {
+// margin-bottom: 0em;
+// }
+
+
+/*******************************
+ Text
+*******************************/
+
+p {
+ font-size: @fontSize;
+ margin: @paragraphMargin;
+ line-height: @paragraphLineHeight;
+ // color:
+}
+
+// p:first-child {
+// margin-top: 0em;
+// }
+
+// p:last-child {
+// margin-bottom: 0em;
+// }
+
+/*-------------------
+ Links
+--------------------*/
+
+a {
+ color: @linkColor;
+ text-decoration: @linkUnderline;
+}
+
+a:hover {
+ color: @linkHoverColor;
+ text-decoration: @linkHoverUnderline;
+}
+
+
+#page-document {
+ h1 {
+ border-bottom: none;
+
+ &:before {
+ display: none;
+ }
+ }
+}
+
+#page-document {
+ ul {
+ list-style-type: none;
+ padding-left: 15px;
+
+ li {
+ &:before {
+ content: '►';
+ color: @headingColor;
+ font-size: .8rem;
+ margin-right: 7px;
+ margin-left: -1rem;
+ position: absolute;
+ }
+ }
+ }
+}
\ No newline at end of file
diff --git a/theme/site/globals/site.overrides b/theme/site/globals/site.overrides
new file mode 100644
index 0000000..39d61bd
--- /dev/null
+++ b/theme/site/globals/site.overrides
@@ -0,0 +1,3202 @@
+@import './site.less';
+
+body {
+ color: @textColor;
+ background-color: #f4f4f1;
+}
+
+.ui.basic.segment .header .logo-nav-wrapper .navigation {
+ overflow: initial !important;
+ margin-top: 2rem;
+}
+
+.header .logo-nav-wrapper .navigation {
+ .mobile-nav-wrapper {
+ display: flex;
+ align-items: center;
+ .searchIcon {
+ fill: rgb(1, 86, 16) !important;
+ path {
+ stroke: rgb(1, 86, 16);
+ stroke-width: 1px;
+ }
+ }
+ }
+ .ui.menu {
+ flex-wrap: wrap;
+ }
+}
+
+.logo-nav-wrapper {
+ display: flex;
+ align-items: center;
+ margin-top: 1rem;
+ padding: 0 2rem;
+
+ @media (max-width: 1200px) {
+ padding: 0 1rem;
+ }
+}
+
+.ui.container {
+ padding: 0 0.5em;
+}
+
+.ui.basic.segment.header-wrapper {
+ padding-bottom: 0;
+ background-color: #fff;
+ position: relative !important;
+}
+
+.header-wrapper {
+ background: white;
+ position: relative;
+}
+
+.ui.basic.segment.content-area {
+ margin-top: 0;
+ padding-top: 0;
+}
+
+body.has-toolbar {
+ .content-area main {
+ width: 100%;
+ }
+}
+
+.content-area main {
+ background-color: #fff;
+ margin: auto;
+ // max-width : calc(100% + 6rem);
+ // margin-left : -3rem;
+ // margin-right : -3rem;
+ // padding : 1em;
+ padding: 3rem 1rem;
+ position: relative;
+}
+
+.view-viewview {
+ .contnet-area main {
+ padding-bottom: 0;
+ }
+}
+
+.header-bg {
+ // position: absolute;
+ // left : 0;
+ // right : 0;
+ // bottom : -5px;
+ position: absolute;
+ left: 0;
+ right: 0;
+ top: 20rem;
+
+ &.contentpage {
+ top: unset;
+ bottom: -2rem;
+
+ &:after {
+ display: none;
+ }
+ }
+
+ &:after {
+ position: absolute;
+ content: '';
+ left: 0;
+ right: 0;
+ background: #f6f6f4;
+ // background: red;
+ height: 600px;
+ top: calc(100% - 2rem);
+ }
+
+ img {
+ width: 100%;
+ }
+}
+
+.header-image-wrapper {
+ position: relative;
+ height: 280px;
+ overflow: hidden;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ flex-direction: column;
+
+ .header-image {
+ border-top-left-radius: 4px;
+ border-top-right-radius: 4px;
+ position: absolute;
+ width: 100%;
+ height: 100%;
+
+ background-size: cover;
+ background-position: center;
+ }
+
+ .header-image-overlay {
+ background-color: rgba(0, 0, 0, 0.3);
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ position: absolute;
+ }
+
+ .header-image-content {
+ position: relative;
+
+ h1,
+ p {
+ color: white;
+ text-align: center;
+ max-width: 800px;
+ }
+
+ h1 {
+ margin-bottom: 2rem;
+ font-weight: bold;
+ font-size: 48px;
+ }
+
+ h1.left,
+ p.left {
+ max-width: unset;
+ text-align: left;
+ padding: 0 100px !important;
+ width: 100%;
+ padding-right: 50% !important;
+ }
+ }
+}
+
+.search {
+ display: flex;
+ justify-content: flex-end;
+ &.mobileSearch {
+ padding: 0.875em 0.8125em;
+ &.open {
+ position: absolute;
+ left: 0;
+ background: #fff;
+ width: 100%;
+ margin-top: 17px;
+ box-shadow: 1px 1px 3px #13131361;
+ > div {
+ width: 100%;
+ }
+ }
+ }
+ .searchbox {
+ .floating_search_results {
+ padding: 1rem 0.5rem;
+ }
+ .searchIcon {
+ left: unset;
+ right: 0;
+ margin-right: 0.5rem;
+ fill: #075e1a !important;
+ }
+ .clearIcon {
+ display: none;
+ pointer-events: none;
+ }
+ div.input {
+ border: none;
+ border-radius: 5px;
+ background-color: #f2f1ee;
+ min-width: 276px;
+ padding: 0 0.5rem;
+ input {
+ &::placeholder {
+ color: #9a9a9a;
+ font-weight: 400;
+ opacity: 1;
+ }
+ }
+ }
+ }
+}
+
+.sticky-outer-wrapper.active {
+ .search {
+ float: right;
+ padding: 0.275em 0.8125em;
+ .searchbox {
+ div.input {
+ background-color: #fff;
+ input {
+ &::placeholder {
+ color: #9a9a9a;
+ font-weight: 400;
+ opacity: 1;
+ }
+ }
+ }
+ }
+ }
+}
+
+.search-meta {
+ span {
+ color: #333;
+ margin-right: 2rem;
+ font-size: 0.9rem;
+ }
+}
+
+@media only screen and (min-width: 1440px) {
+ body .ui.container {
+ width: 1400px;
+ }
+}
+
+.search {
+ .field.searchbox {
+ position: relative;
+
+ .overSearchIcon {
+ // position: absolute;
+ // right : 0;
+ position: absolute;
+ right: 0;
+ width: 31px;
+ height: 30px;
+
+ &:hover {
+ background: transparent !important;
+ }
+
+ svg {
+ stroke: #015610;
+ stroke-width: 3px;
+ }
+ }
+ }
+
+ .searchIcon {
+ position: absolute;
+ right: 0;
+ margin-right: 1rem;
+ }
+
+ .searchInput {
+ &.hidden {
+ width: 0 !important;
+ }
+
+ &.show {
+ width: 100%;
+ }
+
+ background: #f1f0ee;
+ border-radius: 4px;
+ border: none !important;
+ padding: 0.5rem;
+
+ transition: none;
+ padding-right: 39px;
+ }
+
+ .field.searchbox {
+ min-height: 45px;
+ // padding-right: 3rem;
+ }
+
+ .accountIcon {
+ position: absolute;
+ right: 0;
+ }
+}
+
+.no-border.button {
+ box-shadow: none !important;
+ border: none !important;
+}
+
+.header {
+ position: relative;
+ // height : 115px;
+
+ .nav-actions {
+ position: absolute;
+ top: 0;
+ right: 0;
+ // padding-right: 2rem;
+
+ // padding-right : 5rem;
+ padding-right: 62px;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ }
+}
+
+.ui.form .searchbox.field {
+ border-left: none !important;
+}
+
+.space-between {
+ justify-content: space-between;
+}
+
+@media only screen and (min-width: 768px) {
+ .navigation .ui.menu > .item {
+ padding: 0.5rem;
+ }
+}
+
+.slider-image {
+ // width : 100%;
+ height: 601px;
+ display: block;
+ position: relative;
+ background-size: cover;
+ width: 100%;
+}
+
+.navSlider {
+ .slider-image {
+ height: 105px;
+ min-width: 150px;
+ width: 40%;
+ background-size: cover;
+ }
+
+ .slide-body {
+ background: white;
+ display: block;
+ position: relative;
+ height: 105px;
+ flex-grow: 1;
+ }
+
+ .slider-slide {
+ // width : 100%;
+ // display : inline-block;
+ // box-shadow : 1px 1px 3px #333;
+ box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
+ // background : white;
+ background-color: black;
+ border-radius: 6px;
+ overflow: hidden;
+ color: black;
+ display: inline-flex !important;
+ align-items: center;
+ margin: 0.8rem;
+ }
+
+ .slide-description {
+ display: none;
+ }
+
+ .slick-slide {
+ padding: 0.5rem;
+ }
+}
+
+.slideArrow {
+ position: absolute;
+ bottom: 9px;
+ z-index: 1;
+ width: 25px;
+
+ &.prevArrow {
+ left: 5px;
+ }
+
+ &.nextArrow {
+ left: 86px;
+ }
+
+ color: white;
+}
+
+.footerImage {
+ width: 100%;
+ margin-top: -5rem;
+}
+
+.footerLinkBar {
+ background-color: transparent;
+ padding: 20px;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ width: 100%;
+
+ .release-info {
+ width: 100%;
+ text-align: right;
+ font-size: 0.9rem;
+ }
+
+ .separated {
+ border-right: 1px solid grey;
+ padding-right: 15px;
+ }
+}
+
+.footerWrapper {
+ .ui.grid {
+ padding-top: 3rem;
+ }
+
+ background: #f9f9f7 !important;
+ margin-top: 6rem !important;
+
+ .column {
+ p {
+ font-size: 0.9rem;
+ }
+
+ b {
+ color: #564535;
+ margin-bottom: 1rem;
+ display: block;
+ }
+ }
+
+ @media (max-width: 1100px) {
+ .empty-column {
+ display: none !important;
+ }
+ }
+
+ @media (max-width: 760px) {
+ .ui.grid > [class*='four column'].row > .column {
+ width: 100% !important;
+ }
+ }
+}
+
+.columnsWrapper {
+ .left-column {
+ width: 50%;
+ display: inline-block;
+ }
+
+ .right-column {
+ width: 50%;
+ display: inline-block;
+ }
+}
+
+.rich-text-body {
+ position: relative;
+ padding: 1rem;
+ flex-grow: 1;
+}
+
+.block .toolbar.toolbar-bottom {
+ top: 101%;
+ left: 50% !important;
+ transform: translateX(-50%);
+}
+
+body #page-document .imageAndRichText {
+ &.left {
+ width: calc(50% - 2rem) !important;
+ float: left;
+ margin-right: 2rem;
+ }
+
+ &.right {
+ width: calc(50% - 2rem) !important;
+ float: right;
+ margin-left: 2rem;
+ }
+
+ box-shadow: 1px 1px 3px #aaa;
+ overflow: hidden;
+ border-radius: 6px;
+ margin-bottom: 1rem;
+
+ .block-inner-wrapper {
+ display: flex;
+
+ img.card-image {
+ width: 50%;
+ }
+
+ .card-body {
+ flex-grow: 1;
+ padding-left: 0.5rem;
+ }
+ }
+}
+
+body #page-document .imageAndRichText + p {
+ clear: both;
+}
+
+.react-mosaic-example-app {
+ height: 1000px;
+}
+
+.download-button {
+ cursor: pointer;
+ position: absolute;
+ top: 1rem;
+ right: 1rem;
+ width: 20px !important;
+}
+
+.mosaic_view {
+ .chartWrapperView {
+ height: 100%;
+ min-height: 100px;
+
+ // padding: 10px;
+ // .download-button {
+ // padding-right: 1.5rem;
+ // }
+ h5 {
+ padding-left: 1rem;
+ padding-top: 1rem;
+ }
+
+ .sources {
+ padding-left: 1rem;
+ }
+
+ .ui.grid > .column:not(.row) {
+ padding-top: 1px;
+ padding-bottom: 1px;
+ }
+
+ .ui.grid > .column:not(.row),
+ .ui.grid > .row > .column {
+ padding-left: 1px;
+ padding-right: 1px;
+ }
+
+ .block-inner-wrapper {
+ // height: 100%;
+ height: calc(100% - 52px);
+ min-height: 100px;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ // padding: 10px;
+
+ > .recharts-responsive-container {
+ flex-grow: 1;
+ }
+ }
+ }
+}
+
+.chartWrapperView {
+ min-height: 100px;
+
+ // padding: 10px;
+ // .download-button {
+ // padding-right: 1.5rem;
+ // }
+ h5 {
+ padding-left: 1rem;
+ padding-top: 1rem;
+ }
+
+ .sources {
+ padding-left: 1rem;
+ }
+
+ .ui.grid > .column:not(.row) {
+ padding-top: 1px;
+ padding-bottom: 1px;
+ }
+
+ .ui.grid > .column:not(.row),
+ .ui.grid > .row > .column {
+ padding-left: 1px;
+ padding-right: 1px;
+ }
+
+ .block-inner-wrapper {
+ // height: 100%;
+ height: calc(100% - 52px);
+ min-height: 100px;
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ // padding: 10px;
+
+ > .recharts-responsive-container {
+ flex-grow: 1;
+ }
+ }
+}
+
+/*--- Country page ---*/
+
+.country-report-section {
+ color: @darkerGreen;
+
+ .ui.list {
+ .item {
+ color: @darkBrown;
+ }
+ }
+}
+
+/*--- Home page ---*/
+
+.home-tab.ui.item.menu {
+ max-width: 715px;
+ margin: 2em auto !important;
+}
+
+.ui.segment {
+ // min-height : 260px;
+ border-radius: 5px;
+ position: relative;
+}
+
+.ui.bulleted.list > .item {
+ font-size: 12px;
+}
+
+ul.ui.list li:before,
+.ui.bulleted.list .list > .item:before,
+.ui.bulleted.list > .item:before {
+ background-color: @darkOrange;
+ content: '';
+ border-radius: 50%;
+ height: 0.5rem;
+ width: 0.5rem;
+ top: 5px;
+}
+
+.centered-content {
+ max-width: 800px;
+ width: 100%;
+ margin: 2em auto;
+ margin-bottom: 3em;
+ text-align: center;
+
+ h2 {
+ font-size: 40px;
+ color: @darkGreen;
+ }
+}
+
+.tab-content {
+ margin-bottom: 5em;
+
+ // h5 {
+ // color : @darkBrown;
+ // text-transform: uppercase;
+ // font-weight : bold;
+ // }
+ //
+ // .land-data-wrapper {
+ // display : flex;
+ // align-items : center;
+ // background-color: #f6f6f5;
+ // border-radius : 5px;
+ // padding : 1em 1.5em;
+ // }
+ //
+ // .land-data {
+ // font-size : 50px;
+ // font-weight : bold;
+ // padding-right: 10px;
+ // }
+ //
+ // land-data-content span {
+ // font-weight: bold;
+ // }
+ //
+ // .coverage-segment {
+ //
+ // .land-data,
+ // .land-data-content span {
+ // color: @darkGreen;
+ // }
+ // }
+ //
+ // .data-box {
+ // .ui.list .item span {
+ // float: right;
+ // }
+ // }
+ //
+ // .data-box.orange-data-highlight {
+ //
+ // .land-data,
+ // .land-data-content span {
+ // color: @darkOrange;
+ // }
+ // }
+ //
+ // .data-box.deadwood-segment {
+ //
+ // .land-data,
+ // .land-data-content span {
+ // color: @lightGreen;
+ // }
+ //
+ // ul.ui.list li:before,
+ // .ui.bulleted.list .list>.item:before,
+ // .ui.bulleted.list>.item:before {
+ // background-color: @lightGreen;
+ // content : '';
+ // border-radius : 50%;
+ // height : 0.80rem;
+ // width : 0.80rem;
+ // top : 2px;
+ // }
+ //
+ // .ui.bulleted.list>.item {
+ // padding-bottom: 18px;
+ // }
+ // }
+ //
+ // .coverage-data {
+ // display : flex;
+ // color : #fff;
+ // font-size: 16px;
+ // margin : 1em 0;
+ //
+ // .owned-data {
+ // background-color: @lightGreen;
+ // padding : 1em;
+ // border-radius : 5px;
+ // width : 60%;
+ // margin-right : 0.2em;
+ // }
+ //
+ // .private-data {
+ // background-color: @darkGreen;
+ // padding : 1em;
+ // border-radius : 5px;
+ // flex : 1;
+ // }
+ //
+ // span {
+ // font-size : 28px;
+ // display : block;
+ // margin-bottom: 0.2em;
+ // }
+ // }
+ //
+ // .discreet {
+ // color : #999;
+ // font-size: 12px;
+ // position : absolute;
+ // bottom : 30px;
+ // }
+ //
+ // .chart-container {
+ // height: 250px;
+ // }
+ //
+ // .chart-description {
+ // color : @darkGreen;
+ // font-size : 14px;
+ // background-color: #f6f6f5;
+ // padding : 1em;
+ // }
+ //
+ // .map-wrapper {
+ // border : 1px solid @darkGreen;
+ // border-radius: 5px;
+ // padding : 5px;
+ // }
+ //
+ // .map-buttons {
+ // margin-top: 2em;
+ // }
+}
+
+.thematic_areas_wrapper {
+ max-width: 1267px;
+ margin: 0 auto !important;
+}
+
+.area-section {
+ text-align: center;
+ padding: 0 1.5em;
+
+ .area-content {
+ min-height: 130px;
+ margin-top: 1em;
+ }
+
+ .area-image {
+ width: 140px;
+ height: 140px;
+ position: relative;
+ overflow: hidden;
+ border-radius: 50%;
+ margin: 0 auto;
+ border: 4px solid white;
+
+ img {
+ display: inline;
+ margin: 0 auto;
+ height: 100%;
+ width: auto;
+ }
+ }
+
+ .area-title {
+ color: #003311;
+ font-size: 22px;
+
+ a {
+ color: inherit;
+ }
+ }
+
+ area-description {
+ font-size: 14px;
+ }
+
+ button {
+ box-shadow: 0 0 0 1px @darkGreen inset !important;
+ color: @darkGreen !important;
+ background-color: transparent;
+ }
+}
+
+@media only screen and (max-width: 1200px) {
+ .ui.stackable.grid > .column.area-section:not(.row) {
+ width: 50%;
+ }
+}
+
+.footerLogo {
+ width: 100px;
+}
+
+.footerLogoWrapper {
+ display: flex;
+ // justify-content: center;
+ align-items: center;
+ flex-wrap: wrap;
+
+ .footerLogo {
+ height: 35px;
+ width: auto;
+ margin: 0.5rem;
+ }
+}
+
+.unlist {
+ list-style-type: none;
+
+ li {
+ &:before {
+ display: none;
+ }
+ }
+
+ padding-left: 0;
+}
+
+.thematic-areas {
+ padding: 1rem;
+ padding-top: 2rem;
+ margin-right: -4rem;
+ margin-left: -4rem;
+ background: #f4f4f1;
+ margin-bottom: -5rem;
+}
+
+nav.navigation .menu > a.item:first-of-type {
+ display: none !important;
+}
+
+.modal .block {
+ min-height: 400px;
+}
+
+.ui.modal {
+ transform: translate(-50%, -50%);
+ margin: 0 !important;
+ top: 50%;
+ left: 50%;
+}
+
+.logo {
+ margin-bottom: 1rem;
+}
+
+// #047A79
+
+a {
+ color: #047a79;
+}
+
+// chart editor fixes
+.editor_controls .fold__top {
+ height: initial;
+}
+
+.tools {
+ // margin-right: 0!important;
+ margin-right: -3rem !important;
+ line-height: 1;
+}
+
+.hiddenWidget {
+ display: none;
+}
+
+h1,
+h2,
+h3,
+h4,
+h5 {
+ font-family: @fontName;
+}
+
+.modal {
+ .ck-editor,
+ .block.text,
+ .ck.ck-editor__main,
+ .ck .ck-content {
+ display: flex;
+ flex-direction: column;
+ flex-grow: 1;
+ }
+}
+
+.page_metadata {
+ font-size: 0.8rem;
+
+ h5 {
+ margin-bottom: 0.3rem;
+ margin-top: 1rem;
+ }
+}
+
+.inline-headings {
+ h5 {
+ display: inline-block;
+ }
+}
+
+// #page-document {
+// max-width: 800px !important;
+// margin: 0 auto !important;
+// }
+
+.folderWithContent {
+ padding: 0 100px !important;
+}
+
+.breadcrumbs:not(aside .breadcrumbs) {
+ @media (min-width: 700px) {
+ padding: 0 100px !important;
+ }
+
+ @media (max-width: 700px) {
+ border-top-left-radius: 0 !important;
+ }
+}
+
+.folderWithContent {
+ #page-document {
+ max-width: unset !important;
+ }
+
+ > .column {
+ padding: 0 !important;
+ }
+}
+
+.anon-actions-list {
+ margin-left: 1rem !important;
+ overflow: hidden;
+ white-space: nowrap;
+ width: auto;
+
+ &.hidden-width {
+ width: 0;
+ }
+
+ transition: width 100ms;
+}
+
+.searchbox {
+ padding-right: 0;
+}
+
+.accountIcon.insearch {
+ position: absolute;
+ right: -34px;
+}
+
+.slide-overlay {
+ position: absolute;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ background: linear-gradient(
+ 45deg,
+ rgba(0, 0, 0, 0.9) 0%,
+ rgba(0, 0, 0, 0.64) 14%,
+ rgba(0, 0, 0, 0) 49%,
+ rgba(0, 0, 0, 0) 100%
+ );
+ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+
+ // background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0) 66%,rgba(0,0,0,0) 70%,rgba(0,0,0,0) 86%,rgba(0,0,0,0) 97%,rgba(0,0,0,1) 98%,rgba(0,0,0,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
+}
+
+.slider-wrapper {
+ // max-width : 1670px;
+ border-top-left-radius: 4px;
+ border-top-right-radius: 4px;
+ position: relative;
+ overflow: hidden;
+ // margin-left : -3rem;
+ // margin-right : -3rem;
+ width: 100%;
+ height: 601px;
+ max-width: 100%;
+
+ .image-gallery-thumbnails-wrapper {
+ position: absolute !important;
+ z-index: 1;
+ top: 0;
+ right: 0;
+ // right: -50px;
+ bottom: 0;
+ width: 223px;
+
+ .image-gallery-thumbnails {
+ height: 100%;
+ padding: 0;
+
+ .image-gallery-thumbnails-container {
+ transform: none !important;
+ height: 100%;
+ display: flex;
+ flex-direction: column;
+ background: #000000ad;
+
+ .image-gallery-thumbnail {
+ width: auto;
+ color: white;
+ height: calc(25% - 3rem);
+ margin: 1.5rem 1rem;
+ transition: all 200ms;
+ width: 190px;
+
+ &:first-of-type {
+ margin-top: 1rem;
+ }
+
+ &:last-of-type {
+ margin-bottom: 1rem;
+ }
+
+ &.active {
+ .thumbnail-img {
+ transform: scale(1.05);
+ }
+
+ // transform: scale(1.1);
+ // opacity : 1;
+ // .thumbnail-img {
+ // }
+ }
+
+ .slider-thumbnail {
+ height: 100%;
+ width: 100%;
+ position: relative;
+ border: 1px solid black;
+ border-radius: 4px;
+
+ .thumbnail-img {
+ height: 100%;
+ background-size: cover;
+ box-shadow: 1px 3px 4px #000000bf;
+ border-radius: 4px;
+ transition: transform 300ms;
+ }
+
+ .slide-title {
+ position: absolute;
+ top: 100%;
+ font-size: 0.9rem;
+ width: 100%;
+ white-space: normal;
+ line-height: 1.2;
+ text-align: right;
+ padding: 0.6rem 0.3rem;
+ color: #fff;
+ }
+ }
+ }
+ }
+ }
+ }
+
+ .slider-slide {
+ .slide-img {
+ height: 601px;
+ background-size: cover;
+ background-position: center;
+ }
+
+ .slide-body {
+ position: absolute;
+ bottom: 30%;
+ max-width: 600px;
+ margin-left: 4rem;
+ color: #fff;
+ left: unset;
+
+ @media (max-width: 700px) {
+ margin-left: 1rem;
+ }
+
+ .slide-title {
+ font-size: 3rem;
+ font-weight: bold;
+ margin-bottom: 1rem;
+
+ @media (min-width: 700px) {
+ margin-bottom: 3rem;
+ }
+
+ line-height: 1.2;
+
+ @media (max-width: 700px) {
+ font-size: 2rem;
+ }
+ }
+
+ .slide-description {
+ font-size: 1.2rem;
+ line-height: 1.2;
+ font-weight: 200;
+
+ // opacity : 0.8;
+ @media (max-width: 700px) {
+ font-size: 1rem;
+ font-weight: 400;
+ }
+ }
+ }
+ }
+}
+
+.image-gallery-thumbnail.active {
+ border-color: transparent;
+}
+
+.editor-toolbar-wrapper {
+ position: sticky;
+ top: 80px;
+ z-index: 2;
+}
+
+.modal {
+ .editor-toolbar-wrapper {
+ top: 0;
+ margin-bottom: 1.5rem;
+ }
+}
+
+.image-gallery-slides {
+ white-space: normal !important;
+}
+
+.image-gallery-fullscreen-button,
+.image-gallery-left-nav,
+.image-gallery-play-button,
+.image-gallery-right-nav {
+ z-index: 1;
+}
+
+.footer-login {
+ list-style-type: none;
+ display: flex;
+ /* justify-content: center; */
+ align-items: center;
+ margin-top: 2rem;
+ border-top: 1px solid #aaa;
+ display: inline-flex;
+ padding-top: 1rem;
+ margin-top: 1rem;
+ font-size: 1rem;
+ color: #444;
+ font-weight: bold;
+
+ a {
+ color: #444;
+ }
+}
+
+.mosaic-page-modal-open {
+ &:not(.has-sidebar-collapsed).has-sidebar {
+ .ui.fullscreen.modal.mosaic-modal {
+ width: calc(100% - 400px) !important;
+ left: 1rem !important;
+ transform: none !important;
+ top: auto;
+ }
+ }
+
+ .sidebar-container {
+ z-index: 9999;
+ }
+}
+
+body {
+ .sidebar-container {
+ .trigger,
+ .trigger:focus,
+ .trigger:hover {
+ opacity: 0.3;
+ }
+
+ .trigger:hover {
+ opacity: 0.5;
+ }
+ }
+}
+
+// blocks
+
+@purple: #753852;
+
+.block_source {
+ line-height: 1.2;
+ display: block;
+}
+
+// General
+.block-container {
+ // padding: 10px;
+ padding: 10px;
+ height: 100%;
+}
+
+.block-wrapper {
+ height: 100%;
+}
+
+.block-box {
+ width: 30px;
+ height: 30px;
+
+ &.preview {
+ display: inline-block;
+ padding: 0.3rem;
+ margin: 1rem;
+ }
+}
+
+.title-title {
+ padding: 20px;
+ padding-bottom: 0;
+ margin-bottom: 0;
+}
+
+.block p {
+ margin: 0 !important;
+}
+
+// Block style types
+.default-block,
+.default-tile {
+ background-color: #fff;
+}
+
+.drop-shadow-block,
+.drop-shadow-tile {
+ -webkit-box-shadow: 0px 1px 6px 0 #c7d5d8;
+ -moz-box-shadow: 0px 1px 6px 0 #c7d5d8;
+ box-shadow: 0px 1px 6px 0 #c7d5d8;
+ border-radius: 5px;
+}
+
+.border-block,
+.border-tile {
+ border: 1px solid @lightGreyBorderColor;
+ border-radius: 5px;
+}
+
+.green-border-block,
+.green-border-tile {
+ border: 1px solid @blocksBorderGreen;
+ border-radius: 5px;
+ overflow: hidden;
+}
+
+.filled-block,
+.filled-tile {
+ background-color: #f6f6f5;
+ border-radius: 5px;
+}
+
+span.float-right {
+ float: right;
+}
+
+// Europe forest specific blocks
+.block-container,
+.columns-view {
+ h5 {
+ color: @darkBrown;
+ text-transform: uppercase;
+ font-weight: bold;
+ }
+
+ div {
+ &.flex {
+ display: flex;
+ }
+
+ &.flex-column {
+ flex-direction: column;
+ }
+
+ &.h-100 {
+ height: 100%;
+ }
+
+ &.w-100 {
+ width: 100%;
+ }
+
+ &.pa-1 {
+ padding: 10px;
+ }
+ }
+
+ .forest-block-wrapper {
+ display: flex;
+ height: 100%;
+ padding: 10px;
+ }
+
+ .forest-specific-block {
+ display: flex;
+ flex-direction: column;
+ width: 100%;
+ }
+
+ .land-data-wrapper,
+ .data-wrapper {
+ display: flex;
+ align-items: center;
+ border-radius: 5px;
+ padding: 1em;
+ margin-bottom: 1em;
+ }
+
+ .land-data,
+ .data {
+ padding-right: 10px;
+
+ span {
+ font-size: 50px;
+ line-height: 46px;
+ font-weight: 700;
+ }
+ }
+
+ .land-data-content,
+ .data-content {
+ font-size: 14px;
+ font-weight: 300;
+
+ span {
+ display: block;
+ font-size: 18px;
+ font-weight: 500;
+ }
+
+ .data-entity {
+ display: inline;
+ }
+ }
+
+ .data-wrapper {
+ &.brown {
+ background-color: @tileBackgroundColor;
+
+ span {
+ color: @darkBrown;
+ }
+ }
+
+ &.green {
+ background-color: @tileBackgroundColor;
+ color: @darkGreen;
+
+ .data-content {
+ color: initial;
+
+ span {
+ color: @darkGreen;
+ }
+ }
+ }
+
+ &.blue {
+ background-color: @tileBackgroundColor;
+ color: @darkBlue;
+
+ .data-content {
+ color: initial;
+
+ span {
+ color: @darkBlue;
+ }
+ }
+ }
+
+ &.purple {
+ background-color: @tileBackgroundColor;
+ color: @purple;
+
+ .data-content {
+ color: initial;
+
+ span {
+ color: @purple;
+ }
+ }
+ }
+ }
+
+ .ui.list .item span {
+ float: right;
+ }
+
+ .ui.bulleted.list > .item {
+ font-size: 14px;
+ padding: 7px 0;
+
+ a {
+ color: @textColor;
+ text-decoration: underline;
+ }
+ }
+
+ ul.ui.list li:before,
+ .ui.bulleted.list .list > .item:before,
+ .ui.bulleted.list > .item:before {
+ background-color: @darkBrown;
+ content: '';
+ border-radius: 50%;
+ height: 8px;
+ width: 8px;
+ top: 10px;
+ }
+
+ .forest-comparation {
+ .land-data-wrapper {
+ background-color: @tileBackgroundColor;
+
+ span {
+ color: @darkBrown;
+ }
+
+ margin-bottom: 0;
+ }
+ }
+
+ @tileBackgroundColor: #f6f6f5;
+ @darkBlue: #002d54;
+
+ .forest-area-block {
+ .land-data-wrapper.eu28-data {
+ background-color: @tileBackgroundColor;
+ color: @darkGreen;
+
+ .land-data-content {
+ color: initial;
+
+ span {
+ color: @darkGreen;
+ }
+ }
+
+ &.purple {
+ color: @purple;
+
+ .land-data-content {
+ color: initial;
+
+ span {
+ color: @purple;
+ }
+ }
+ }
+ }
+
+ .land-data-wrapper.eea39-data {
+ background-color: @tileBackgroundColor;
+ color: @darkBlue;
+
+ .land-data-content {
+ color: initial;
+
+ span {
+ color: @darkBlue;
+ }
+ }
+ }
+
+ .coverage-data {
+ display: flex;
+ color: #fff;
+ font-size: 16px;
+ margin: 1em 0;
+
+ span {
+ font-size: 28px;
+ display: block;
+ margin-bottom: 0.2em;
+ }
+ }
+ }
+
+ .discreet {
+ color: #999;
+ font-size: 12px;
+ line-height: normal;
+ margin-top: auto;
+ }
+
+ .map-wrapper {
+ border: 1px solid @darkGreen;
+ border-radius: 5px;
+ padding: 5px;
+ }
+
+ .map-buttons {
+ margin-top: 2em;
+ }
+}
+
+.forest-patch-size-distribution {
+ .square {
+ display: inline-block;
+ width: 15px;
+ height: 15px;
+ margin-right: 0.5rem;
+
+ &.blue {
+ background-color: blue;
+ }
+
+ &.orange {
+ background-color: orange;
+ }
+
+ &.grey {
+ background-color: grey;
+ }
+
+ &.yellow {
+ background-color: yellow;
+ }
+
+ &.lightblue {
+ background-color: lightblue;
+ }
+
+ &.green {
+ background-color: green;
+ }
+
+ &.darkblue {
+ background-color: darkblue;
+ }
+ }
+}
+
+// const SCHEMA = {
+// blue: {
+// title: '25-50',
+// defaultformat: 'percentage',
+// },
+// orange: {
+// title: '50-100',
+// defaultformat: 'percentage',
+// },
+// grey: {
+// title: '100-500',
+// defaultformat: 'percentage',
+// },
+// yellow: {
+// title: '500-2000',
+// defaultformat: 'percentage',
+// },
+// lightblue: {
+// title: '2000-10000',
+// defaultformat: 'percentage',
+// },
+// green: {
+// title: '10000-50000',
+// defaultformat: 'percentage',
+// },
+// darkblue: {
+// title: '>50000',
+// defaultformat: 'percentage',
+// },
+// };
+
+// BLOCKS END
+
+.homepage-content {
+ // frontpage chart block text
+ .block-text-content {
+ color: @darkGreen;
+ font-size: 14px;
+ font-weight: 300;
+
+ > div {
+ padding: 1em;
+ background-color: #f6f6f5;
+ border-radius: 5px;
+ }
+ }
+}
+
+.embedded-chart {
+ width: 100%;
+ height: 100%;
+}
+
+// Embedded map block
+.block-container {
+ .block.maps {
+ height: 100%;
+
+ .video-inner,
+ iframe {
+ height: 100% !important;
+ min-height: 100px;
+ }
+ }
+}
+
+.sidebar-container-enter-done .ui.segment.object-listing {
+ max-height: calc(100vh - 95px);
+}
+
+#floatBarsG {
+ position: absolute;
+ width: 120px;
+ height: 14px;
+ margin: auto;
+ left: 50%;
+ top: 0;
+ transform: translateX(-50%);
+}
+
+.floatBarsG {
+ position: absolute;
+ top: 0;
+ background-color: rgb(34, 85, 17);
+ width: 14px;
+ height: 14px;
+ animation-name: bounce_floatBarsG;
+ -o-animation-name: bounce_floatBarsG;
+ -ms-animation-name: bounce_floatBarsG;
+ -webkit-animation-name: bounce_floatBarsG;
+ -moz-animation-name: bounce_floatBarsG;
+ animation-duration: 1.105s;
+ -o-animation-duration: 1.105s;
+ -ms-animation-duration: 1.105s;
+ -webkit-animation-duration: 1.105s;
+ -moz-animation-duration: 1.105s;
+ animation-iteration-count: infinite;
+ -o-animation-iteration-count: infinite;
+ -ms-animation-iteration-count: infinite;
+ -webkit-animation-iteration-count: infinite;
+ -moz-animation-iteration-count: infinite;
+ animation-direction: normal;
+ -o-animation-direction: normal;
+ -ms-animation-direction: normal;
+ -webkit-animation-direction: normal;
+ -moz-animation-direction: normal;
+ transform: scale(0.3);
+ -o-transform: scale(0.3);
+ -ms-transform: scale(0.3);
+ -webkit-transform: scale(0.3);
+ -moz-transform: scale(0.3);
+}
+
+#floatBarsG_1 {
+ left: 0;
+ animation-delay: 0.446s;
+ -o-animation-delay: 0.446s;
+ -ms-animation-delay: 0.446s;
+ -webkit-animation-delay: 0.446s;
+ -moz-animation-delay: 0.446s;
+}
+
+#floatBarsG_2 {
+ left: 15px;
+ animation-delay: 0.5525s;
+ -o-animation-delay: 0.5525s;
+ -ms-animation-delay: 0.5525s;
+ -webkit-animation-delay: 0.5525s;
+ -moz-animation-delay: 0.5525s;
+}
+
+#floatBarsG_3 {
+ left: 30px;
+ animation-delay: 0.659s;
+ -o-animation-delay: 0.659s;
+ -ms-animation-delay: 0.659s;
+ -webkit-animation-delay: 0.659s;
+ -moz-animation-delay: 0.659s;
+}
+
+#floatBarsG_4 {
+ left: 45px;
+ animation-delay: 0.7755s;
+ -o-animation-delay: 0.7755s;
+ -ms-animation-delay: 0.7755s;
+ -webkit-animation-delay: 0.7755s;
+ -moz-animation-delay: 0.7755s;
+}
+
+#floatBarsG_5 {
+ left: 60px;
+ animation-delay: 0.882s;
+ -o-animation-delay: 0.882s;
+ -ms-animation-delay: 0.882s;
+ -webkit-animation-delay: 0.882s;
+ -moz-animation-delay: 0.882s;
+}
+
+#floatBarsG_6 {
+ left: 75px;
+ animation-delay: 0.9985s;
+ -o-animation-delay: 0.9985s;
+ -ms-animation-delay: 0.9985s;
+ -webkit-animation-delay: 0.9985s;
+ -moz-animation-delay: 0.9985s;
+}
+
+#floatBarsG_7 {
+ left: 90px;
+ animation-delay: 1.105s;
+ -o-animation-delay: 1.105s;
+ -ms-animation-delay: 1.105s;
+ -webkit-animation-delay: 1.105s;
+ -moz-animation-delay: 1.105s;
+}
+
+#floatBarsG_8 {
+ left: 105px;
+ animation-delay: 1.2115s;
+ -o-animation-delay: 1.2115s;
+ -ms-animation-delay: 1.2115s;
+ -webkit-animation-delay: 1.2115s;
+ -moz-animation-delay: 1.2115s;
+}
+
+@keyframes bounce_floatBarsG {
+ 0% {
+ transform: scale(1);
+ background-color: rgb(34, 85, 17);
+ }
+
+ 100% {
+ transform: scale(0.3);
+ background-color: rgb(255, 255, 255);
+ }
+}
+
+@-o-keyframes bounce_floatBarsG {
+ 0% {
+ -o-transform: scale(1);
+ background-color: rgb(34, 85, 17);
+ }
+
+ 100% {
+ -o-transform: scale(0.3);
+ background-color: rgb(255, 255, 255);
+ }
+}
+
+@-ms-keyframes bounce_floatBarsG {
+ 0% {
+ -ms-transform: scale(1);
+ background-color: rgb(34, 85, 17);
+ }
+
+ 100% {
+ -ms-transform: scale(0.3);
+ background-color: rgb(255, 255, 255);
+ }
+}
+
+@-webkit-keyframes bounce_floatBarsG {
+ 0% {
+ -webkit-transform: scale(1);
+ background-color: rgb(34, 85, 17);
+ }
+
+ 100% {
+ -webkit-transform: scale(0.3);
+ background-color: rgb(255, 255, 255);
+ }
+}
+
+@-moz-keyframes bounce_floatBarsG {
+ 0% {
+ -moz-transform: scale(1);
+ background-color: rgb(34, 85, 17);
+ }
+
+ 100% {
+ -moz-transform: scale(0.3);
+ background-color: rgb(255, 255, 255);
+ }
+}
+
+.sticky-outer-wrapper:not(.active) {
+ .searchShowTrigger {
+ display: none !important;
+ }
+
+ .searchInput {
+ width: 100% !important;
+ }
+}
+
+.sticky-outer-wrapper.active {
+ .searchInput.hidden {
+ background: transparent;
+ }
+
+ @media (min-width: 1200px) and (max-width: 1300px) {
+ .searchInput.show {
+ width: 133px !important;
+ }
+ }
+}
+
+#page-document {
+ h2,
+ h3 {
+ margin-top: 2rem;
+ margin-bottom: 1rem;
+ }
+}
+
+// placeholders
+
+.ui.placeholder.header-image {
+ max-width: 100%;
+}
+
+// .full-width-block {
+// left: 0;
+// right: 0;
+// position: absolute;
+// }
+
+body .ui.placeholder {
+ max-width: unset;
+}
+
+.blurr-transition {
+ transition: filter 300ms;
+}
+
+.blurred {
+ filter: blur(4px);
+}
+
+.block-container {
+ .ui.placeholder {
+ max-height: 200px;
+ margin: 2rem;
+ }
+}
+
+// table styling
+
+#page-document .table {
+ margin: 1em 0;
+}
+
+#page-document .table {
+ tr {
+ &:nth-child(odd) {
+ td {
+ background-color: #f4f4f2;
+ }
+ }
+ }
+}
+
+#page-document .table table {
+ border-collapse: collapse;
+ border-spacing: 0;
+}
+
+#page-document .table table td,
+#page-document .table table th {
+ text-align: left;
+ min-width: 2em;
+ padding: 0.7rem 1rem;
+ border: none;
+}
+
+#page-document .table table th {
+ font-weight: 700;
+ background-color: #fafafa;
+}
+
+// ckeditor
+
+.ck-content .table table td,
+.ck-content .table table th {
+ text-align: left;
+ padding: 0.6em !important;
+}
+
+.ck-content {
+ ul {
+ list-style-type: none;
+ padding-left: 15px;
+
+ li {
+ &:before {
+ content: '►';
+ color: @headingColor;
+ font-size: 0.8rem;
+ margin-right: 7px;
+ margin-left: -1rem;
+ position: absolute;
+ }
+ }
+ }
+}
+
+@media (max-width: 1100px) {
+ .block.image.align.left img {
+ margin-left: 0 !important;
+ }
+}
+
+body:not(.has-sidebar-collapsed) > #sidebar {
+ position: absolute;
+}
+
+main {
+ .ui.grid {
+ padding: 0 !important;
+
+ > .column {
+ padding: 0 !important;
+ }
+ }
+}
+
+.out-dated-message {
+ position: fixed !important;
+ top: 0;
+ left: 0;
+ bottom: 0;
+ right: 0;
+ z-index: 100;
+}
+
+.overflow-hidden {
+ overflow: hidden !important;
+}
+
+//fix full width block
+
+@media (max-width: 768px) {
+ .block.maps.align.full {
+ height: unset !important;
+ position: relative !important;
+
+ .full-width-block {
+ position: relative;
+ }
+ }
+}
+
+@media print {
+ @page {
+ margin: 1.5cm 0.5cm 1.5cm 0.5cm;
+ }
+
+ #toolbar {
+ display: none;
+ }
+
+ .react-grid-item {
+ page-break-inside: avoid;
+ }
+
+ a {
+ page-break-inside: avoid;
+ }
+
+ blockquote {
+ page-break-inside: avoid;
+ }
+
+ h1,
+ h2,
+ h3,
+ h4,
+ h5,
+ h6 {
+ page-break-after: avoid;
+ page-break-inside: avoid;
+ }
+
+ img {
+ page-break-inside: avoid;
+ page-break-after: avoid;
+ }
+
+ table,
+ pre {
+ page-break-inside: avoid;
+ }
+
+ ul,
+ ol,
+ dl {
+ page-break-before: avoid;
+ }
+
+ .thematic-areas {
+ page-break-before: always;
+ }
+}
+
+#main.print {
+ .ui.container {
+ width: 100% !important;
+ height: 100% !important;
+ margin: 0 !important;
+ padding: 0 !important;
+ float: none !important;
+ display: block !important;
+ position: relative !important;
+ }
+
+ .columns-view {
+ .grid.column-grid {
+ display: block;
+ width: 100% !important;
+ }
+ }
+ .column-blocks-wrapper {
+ width: 100% !important;
+ }
+ .ui.content-area {
+ width: 756px !important;
+ }
+
+ .border-block,
+ .border-tile {
+ border: none;
+ }
+
+ .chartWrapperView,
+ .block-inner-wrapper {
+ page-break-inside: avoid;
+ }
+
+ .header-wrapper {
+ background: transparent;
+ padding: 0 1rem !important;
+ // width: 756px !important;
+ display: flex !important;
+ flex-flow: column !important;
+ background: #fff !important;
+
+ .ui.container {
+ height: auto !important;
+ }
+
+ > * {
+ padding: 0 10px !important;
+ }
+
+ > .ui.container {
+ align-self: stretch;
+ align-items: center;
+ display: flex !important;
+ padding: 0 10px !important;
+ justify-content: flex-start;
+ background: #fff;
+ }
+
+ .header-bg.contentpage,
+ .ui.breadcrumbs,
+ .placeholder.header-image {
+ display: none !important;
+ }
+
+ .header-image-wrapper {
+ align-items: start;
+ padding: 0 10px;
+ height: auto;
+
+ .header-image {
+ width: 756px;
+ background-image: none !important;
+ }
+
+ .header-image-overlay {
+ background-color: #fff;
+ }
+
+ .header-image-content {
+ h1 {
+ color: #000 !important;
+ margin: 0 !important;
+ text-align: left !important;
+ }
+
+ p {
+ color: #000 !important;
+ margin: 0 !important;
+ text-align: left !important;
+ }
+ }
+ }
+
+ .sticky-outer-wrapper,
+ .sticky-inner-wrapper {
+ background: transparent;
+ position: relative !important;
+ width: 100% !important;
+ height: auto !important;
+ box-shadow: none;
+ }
+
+ .sticky-inner-wrapper {
+ .header {
+ background: #fff;
+
+ .navigation {
+ display: none;
+ }
+
+ .logo-nav-wrapper {
+ margin-top: 0;
+ padding: 0;
+ }
+ }
+ }
+ }
+
+ .footerWrapper {
+ display: none !important;
+ }
+
+ .react-grid-layout {
+ width: 100% !important;
+ height: auto !important;
+ }
+
+ .react-grid-item {
+ padding: 0 !important;
+ height: auto !important;
+ position: relative !important;
+ top: auto !important;
+ left: auto !important;
+ width: 756px !important;
+ }
+
+ .react-grid-item .block-container .block.maps .video-inner,
+ .react-grid-item .block-container .block.maps iframe {
+ height: 840px !important;
+ width: 100% !important;
+ padding: 0 !important;
+ }
+
+ .element-grid {
+ position: relative;
+ display: block;
+ width: 100%;
+
+ div {
+ position: relative;
+ display: block;
+ width: 100%;
+ }
+ }
+
+ .thematic-areas {
+ width: 756px !important;
+ padding: 0 !important;
+ margin: 0 !important;
+ background: #fff !important;
+ }
+
+ .svg-container {
+ width: 100%;
+ }
+
+ .print-button {
+ display: none;
+ }
+}
+
+.print-button {
+ position: absolute;
+ top: 0;
+ right: 10px;
+ padding: 10px;
+ cursor: pointer;
+ color: #c3c3c3;
+
+ .icon:hover {
+ color: #565656;
+ }
+}
+
+/**
+ * START NEWS STYLE
+ */
+.news-wrapper-view {
+ span.divider {
+ width: 1px;
+ height: 14px;
+ background: #e7e7e7;
+ margin: 0 8px;
+ }
+
+ .headline {
+ width: 100%;
+ display: block;
+ color: #1d5409;
+ font-size: 20px;
+ margin: 8px 0 !important;
+ }
+
+ article {
+ border-top: 1px solid #e6e6e6;
+ padding: 8px 0;
+
+ &:first-child {
+ border: none;
+ }
+
+ .article-headline {
+ display: inline-block;
+ align-items: center;
+ color: #005454;
+ cursor: pointer;
+ font-size: 16px;
+ margin: 0 !important;
+
+ .icon {
+ margin-right: 8px;
+ }
+ }
+
+ .article-body {
+ opacity: 0;
+ transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
+ pointer-events: none;
+
+ &.expanded {
+ opacity: 1;
+ pointer-events: auto;
+ transition: opacity 0.3s ease-in-out, max-height 0.3s ease-in-out;
+ }
+
+ .meta-data {
+ padding: 0;
+ font-size: 12px;
+
+ .format-text {
+ color: #9a9a9a;
+ }
+
+ .format-type {
+ color: #545454;
+ }
+ }
+
+ .article-content {
+ padding: 0;
+ font-size: 14px;
+
+ .block {
+ margin: 0.3em 0;
+ }
+
+ .actions {
+ color: #005454;
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+ }
+ }
+ }
+ }
+
+ .ui.pagination.menu {
+ max-width: 800px;
+ margin: 0 auto;
+ display: flex;
+ justify-content: center;
+ }
+
+ .toolbar {
+ max-width: 800px;
+ margin: 0 auto;
+ }
+
+ .ui.selection.dropdown {
+ border: 1px solid rgba(34, 36, 38, 0.15);
+ border-radius: 0.28571429rem;
+ padding: 0.78571429em 2.1em 0.78571429em 1em;
+ }
+
+ .ui.selection.active.dropdown {
+ border: 1px solid #96c8da;
+
+ &.upward {
+ border-bottom-left-radius: 0.28571429rem !important;
+ border-bottom-right-radius: 0.28571429rem !important;
+ border-top-left-radius: 0 !important;
+ border-top-right-radius: 0 !important;
+ border-top: none;
+
+ .menu {
+ border-top-left-radius: 0.28571429rem !important;
+ border-top-right-radius: 0.28571429rem !important;
+ }
+ }
+
+ &.downward {
+ border-top-left-radius: 0.28571429rem !important;
+ border-top-right-radius: 0.28571429rem !important;
+ border-bottom-left-radius: 0 !important;
+ border-bottom-right-radius: 0 !important;
+ border-bottom: none;
+
+ .menu {
+ border-bottom-left-radius: 0.28571429rem !important;
+ border-bottom-right-radius: 0.28571429rem !important;
+ }
+ }
+
+ .menu,
+ .menu:hover {
+ border: 1px solid #96c8da;
+ margin: 0 -1px;
+ }
+
+ .menu:last-child {
+ border-bottom: 1px solid #96c8da;
+ }
+ }
+}
+
+// .ui.compact.selection.dropdown {
+// position: relative;
+// display: flex;
+// flex-flow: row;
+// width: auto;
+// padding: 0 0 0 0.5em;
+// .text {
+// position: relative;
+// display: inline-block;
+// }
+// .icon {
+// position: relative;
+// top: auto;
+// right: auto;
+// margin: 0;
+// display: inline-block;
+// height: auto;
+// }
+// }
+
+.news-page-content {
+ position: relative;
+
+ article {
+ .article-headline {
+ display: inline-block;
+ }
+ }
+
+ a.rss-feed {
+ display: flex;
+ align-items: center;
+ position: absolute;
+ left: 100%;
+ transform: translateX(-100%);
+ white-space: nowrap;
+
+ .icon {
+ margin: 0 0 0 4px;
+ }
+ }
+}
+
+.news-page-content .news-wrapper-view article .article-body {
+ .meta-data {
+ padding: 0;
+ }
+
+ .article-content {
+ padding: 0;
+ font-size: 14px;
+ }
+}
+
+.news-expand-button {
+ display: flex;
+ flex-flow: row;
+ justify-content: center;
+ align-items: center;
+ width: 100%;
+ cursor: pointer;
+ background: transparent;
+ border: none;
+}
+
+.news-expand-button {
+ span {
+ width: 50%;
+ height: 1px;
+ background: #e7e7e7;
+ }
+
+ &:hover {
+ span {
+ background: #005454;
+ }
+
+ .icon {
+ fill: #005454 !important;
+ }
+ }
+}
+
+.text-center {
+ text-align: center;
+}
+
+/**
+ * END NEWS STYLE
+*/
+
+.ui.placeholder.header-image {
+ .rectangular {
+ padding-top: 45% !important;
+ }
+}
+
+/**
+ * SIDEBAR STYLE
+*/
+body:not(.has-sidebar-collapsed) > #sidebar {
+ position: relative !important;
+}
+
+body.has-sidebar #layout-preview-lg {
+ width: auto !important;
+}
+
+#sidebar .sidebar-container .tabs-wrapper {
+ padding: 0;
+}
+
+#sidebar .sidebar-container #sidebar-properties {
+ // padding: 20px;
+}
+
+#sidebar .sidebar-container #sidebar-properties > div {
+ height: auto !important;
+}
+
+#sidebar .sidebar-container .ui.raised.segments {
+ height: auto;
+}
+
+#visual-form,
+#sidebar-metadata,
+#sidebar-metadata > form > .segment {
+ padding-left: 0;
+ padding-right: 0;
+}
+
+#sidebar-metadata > form > .secondary.segment {
+ padding-left: 1em;
+ padding-right: 1em;
+}
+
+#sidebar-metadata > form > .segment .field:not(:last-child) {
+ margin-bottom: 2.5rem;
+}
+
+#sidebar-metadata > form > .segment .field-file-name {
+ padding-bottom: 0;
+}
+
+/**
+ * END SIDEBAR STYLE
+*/
+
+body.has-sidebar {
+ .ui.modal {
+ width: calc(100% - 400px) !important;
+ left: 1rem !important;
+ transform: none !important;
+ top: auto;
+ }
+}
+
+.ui.modal {
+ width: 95% !important;
+ left: auto !important;
+ transform: none !important;
+ top: auto;
+}
+
+.ui.icon.input + button.data-provider-widget-button {
+ background-color: #4296b2;
+ color: #fff !important;
+ border: none;
+ font-weight: bold;
+ cursor: pointer;
+
+ &:hover {
+ background-color: #387a91 !important;
+ }
+
+ &:focus {
+ outline: none !important;
+ }
+}
+
+.mb-0,
+h2.mb-0 {
+ margin-bottom: 0;
+}
+
+.mb-1,
+h2.mb-1 {
+ margin-bottom: 1rem;
+}
+
+.mb-2,
+h2.mb-2 {
+ margin-bottom: 2rem;
+}
+
+.mb-3,
+h2.mb-3 {
+ margin-bottom: 3rem;
+}
+
+.bold {
+ font-weight: bold;
+}
+
+mark.highlight.green {
+ color: #3b5705;
+ background-color: transparent;
+}
+
+article.tileItem {
+ // mark.highlight {
+ // color: #3B5705;
+ // font-weight: bold;
+ // background-color: transparent;
+ // }
+ margin-bottom: 2rem;
+
+ button.expendButton {
+ background: transparent;
+ border: none;
+ padding: 0;
+ margin: 1rem 0;
+ color: #047a79;
+ cursor: pointer;
+
+ &:hover {
+ color: #055251;
+ }
+
+ &:focus {
+ outline: none;
+ }
+ }
+}
+
+/* Tabs view nav */
+.tabs-view-menu {
+ padding-bottom: 1rem;
+ .ui.menu {
+ .active.item {
+ background: #cd4200;
+ color: #fff;
+ &:hover {
+ background: #cd4200;
+ color: #fff;
+ }
+ }
+ }
+
+ @media (max-width: 1199px) {
+ padding: 2rem 0 1rem 0;
+ }
+ @media (max-width: 600px) {
+ .ui.menu {
+ flex-flow: column;
+ .item {
+ width: 100% !important;
+ border: none;
+ border-bottom: 1px solid #c7d5d8;
+ &.active {
+ border: none;
+ }
+ &:first-child {
+ border-top: none;
+ }
+ &:last-child {
+ border-bottom: none;
+ }
+ }
+ }
+ }
+}
+
+body .content-area main {
+ @media (min-width: 1200px) {
+ padding: 3rem calc(1rem + 10px);
+ }
+}
+
+body.mosaic-view .content-area main {
+ .tabs-view-menu {
+ padding: 0 10px;
+ }
+ @media (min-width: 1200px) {
+ padding: 3rem 1rem;
+ }
+ @media (max-width: 1199px) {
+ div.tabs-view-menu {
+ padding: 3rem 10px 1rem 10px;
+ }
+ }
+}
+
+#page-document {
+ .block.listing {
+ .items {
+ display: flex;
+ flex-wrap: wrap;
+ .listing-item {
+ width: calc(33% - 10px);
+ border: 1px solid #eee;
+ margin: 5px;
+ padding: 10px;
+ transition: background-color 200ms ease-in;
+ &:hover {
+ background-color: #eee;
+ }
+ img {
+ display: none;
+ }
+ h3 {
+ margin-top: 0;
+ font-size: 1rem;
+ }
+ }
+ }
+ }
+}
+
+.block-wrapper.type-data_connected_embed {
+ > div {
+ height: 100%;
+ > div {
+ height: 100%;
+ }
+ }
+}
+
+.block.maps {
+ > div {
+ > div {
+ height: 100%;
+ }
+ }
+}
+
+.sticky-outer-wrapper:not(.active) {
+ .searchbox div.input {
+ border: none !important;
+ border-radius: 5px;
+ background-color: #f2f1ee !important;
+ min-width: 276px;
+ padding: 0 0.5rem !important;
+ }
+}
+
+.sticky-outer-wrapper.active {
+ .searchbox div.input {
+ border: none !important;
+ border-radius: 5px;
+ background-color: #fff !important;
+ min-width: 276px;
+ padding: 0 0.5rem !important;
+ }
+}
+
+.view-editview .block .block.selected:before,
+.view-editview .block .block.selected:hover:before {
+ z-index: 1;
+ pointer-events: none;
+}
+
+.sidebar-container {
+ .ui.segment.form {
+ padding: 1rem;
+ }
+}
+
+.tabsblock.factsheet {
+ > .ui.container {
+ padding: 0 !important;
+ }
+ .tabular.menu {
+ border-bottom: none;
+ display: flex;
+ justify-content: center;
+ align-items: center;
+ box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.1) !important;
+ .item {
+ border: 1px solid #e0e1e0 !important;
+ font-weight: 300;
+ color: #554433 !important;
+ &.active {
+ background-color: #cc4400 !important;
+ color: white !important;
+ margin-bottom: 0 !important;
+ border-radius: 0 !important;
+ }
+ }
+ }
+}
+
+.margin-block-10 {
+ margin: 10px;
+}
+
+.padding-block-10 {
+ padding: 10px;
+}
+
+.columns-view .ui.twelve.column.grid.column-grid {
+ margin: 0;
+}
+.block-toolbar {
+ z-index: 1;
+}
+
+.object-list-modal {
+ .ui.menu {
+ flex-wrap: wrap;
+ }
+}
+
+.ui.accordion .title {
+ cursor: auto !important;
+}
+
+.tabs-view-menu {
+ padding-bottom: 0;
+ .scroll-container {
+ height: 100%;
+ .ui.menu {
+ height: 100%;
+ }
+ }
+ .ui.menu {
+ border: none;
+ box-shadow: none;
+ background-color: transparent;
+ border-bottom: none !important;
+ // &.red-menu {
+ // min-height: unset !important;
+ // &.item {
+ // flex-wrap: nowrap !important;
+ // .item {
+ // font-size: 14px !important;
+ // font-weight: bold !important;
+ // color: #d63d27 !important;
+ // background-color: transparent !important;
+ // padding: 10px 30px !important;
+ // border-radius: 22px;
+ // border: 1px solid #d63d27;
+ // margin-right: 0 !important;
+ // margin-left: 0 !important;
+ // flex: 1;
+ // &:before {
+ // width: 0;
+ // background-color: transparent !important;
+ // }
+ // &.sibling-on-left {
+ // border-top-left-radius: 0;
+ // border-bottom-left-radius: 0;
+ // margin-left: -1px !important;
+ // }
+ // &.sibling-on-right {
+ // border-top-right-radius: 0;
+ // border-bottom-right-radius: 0;
+ // }
+ // }
+ // .active.item {
+ // color: #fff !important;
+ // padding: 10px 40px !important;
+ // border-radius: 22px;
+ // background-color: #d63d27 !important;
+ // border: 1px solid #d63d27 !important;
+ // &:hover {
+ // background-color: #d63d27 !important;
+ // color: #fff !important;
+ // }
+ // &:before {
+ // width: 0;
+ // background: transparent !important;
+ // background-color: transparent !important;
+ // }
+ // &.sibling-on-left {
+ // border-top-left-radius: 0;
+ // border-bottom-left-radius: 0;
+ // margin-left: -1px !important;
+ // }
+ // &.sibling-on-right {
+ // border-top-right-radius: 0;
+ // border-bottom-right-radius: 0;
+ // }
+ // }
+ // }
+ // font-weight: bold;
+ // @media (max-width: 768px) {
+ // &.item {
+ // .item {
+ // flex: 1 0 0;
+ // }
+ // }
+ // }
+ // }
+ // &.grey-menu {
+ // background-color: #ededed !important;
+ // // &.item {
+ // // align-items: stretch !important;
+ // // }
+ // .item {
+ // color: #000 !important;
+ // &:before {
+ // width: 0;
+ // background-color: transparent !important;
+ // }
+ // // &:first-child {
+ // // margin-left: 0 !important;
+ // // }
+ // }
+ // .active.item {
+ // background-color: transparent !important;
+ // color: #4296b3 !important;
+ // font-weight: bold;
+ // border-bottom: 2px solid #4296b3 !important;
+ // border-radius: 0;
+ // &:hover {
+ // background: transparent;
+ // color: #3b849e !important;
+ // }
+ // }
+ // }
+ // &.item {
+ // flex-wrap: wrap !important;
+ // text-align: left !important;
+ // justify-content: start !important;
+ // margin-left: auto !important;
+ // margin-right: auto !important;
+ // font-size: 18px;
+ // align-items: stretch;
+ // &:before {
+ // display: none;
+ // }
+ // &::-webkit-scrollbar {
+ // height: 6px;
+ // }
+ // &::-webkit-scrollbar-track {
+ // border-radius: 10em;
+ // }
+ // &::-webkit-scrollbar-thumb {
+ // background-color: darkgrey;
+ // outline: 1px solid slategrey;
+ // }
+ // .item {
+ // width: fit-content !important;
+ // margin-right: 1rem !important;
+ // margin-left: 1rem !important;
+ // padding-top: 0.5rem;
+ // padding-bottom: 0.5rem;
+ // }
+ // }
+ // .active.item {
+ // background-color: transparent !important;
+ // color: #4296b3 !important;
+ // font-weight: bold !important;
+ // border-bottom: 2px solid #4296b3 !important;
+ // border-radius: 0;
+ // &:hover {
+ // background: transparent !important;
+ // color: #3b849e !important;
+ // }
+ // }
+ }
+}
+
+.factsheet.menu {
+ // > .ui.container {
+ // padding: 0 !important;
+ // }
+ // .tabular.menu {
+ // border-bottom: none;
+ // display: flex;
+ // justify-content: center;
+ // align-items: center;
+ // box-shadow: 1px 2px 4px rgba(0, 0, 0, 0.1) !important;
+ .item {
+ border: 1px solid #e0e1e0 !important;
+ font-weight: 300;
+ color: #554433 !important;
+ &.active {
+ background-color: #cc4400 !important;
+ color: white !important;
+ margin-bottom: 0 !important;
+ border-radius: 0 !important;
+ }
+ }
+ // }
+}
+
+.slide-overlay {
+ position: absolute;
+ top: 0;
+ right: 0;
+ bottom: 0;
+ left: 0;
+ background: linear-gradient(
+ 45deg,
+ rgba(0, 0, 0, 0.9) 0%,
+ rgba(0, 0, 0, 0.64) 14%,
+ rgba(0, 0, 0, 0) 49%,
+ rgba(0, 0, 0, 0) 100%
+ );
+}
+
+.slider-slide {
+ .slide-img {
+ height: 600px;
+ background-position: center;
+ background-size: cover;
+ }
+
+ .slide-body {
+ position: absolute;
+ bottom: 35%;
+ left: 19em;
+ max-width: 600px;
+ color: white;
+ text-align: left;
+
+ @media screen and (max-width: 1500px) {
+ left: 8em;
+ }
+
+ @media screen and (max-width: 1100px) {
+ left: 2em;
+ }
+
+ @media (max-width: 600px) {
+ bottom: 40%;
+ }
+
+ .slide-title {
+ margin-bottom: 3rem;
+ font-family: @headerFont;
+ font-size: 60px;
+ font-weight: bold;
+ line-height: 1.2;
+
+ @media (max-width: 600px) {
+ margin-bottom: 2rem;
+ font-size: 2rem;
+ }
+ }
+
+ .slide-description {
+ max-width: 540px;
+ font-size: 24px;
+ font-weight: 200;
+ line-height: 1.2;
+
+ @media (max-width: 600px) {
+ font-size: 1rem;
+ font-weight: 400;
+ }
+ }
+ }
+}
+
+.image-gallery-right-nav,
+.image-gallery-left-nav {
+ font-size: 3rem;
+
+ @media (max-width: 600px) {
+ bottom: 0;
+ }
+
+ .image-gallery-svg {
+ width: 30px;
+ height: 60px;
+ }
+}
+
+// .image-gallery-left-nav {
+// top: unset;
+// bottom: -2.5rem;
+// left: 6em;
+
+// @media screen and (max-width: 1500px) {
+// left: 3em;
+// }
+
+// @media screen and (max-width: 1100px) {
+// left: 1em;
+// }
+
+// @media (max-width: 600px) {
+// bottom: 0.5em !important;
+// }
+// }
+
+// .image-gallery-right-nav {
+// top: unset;
+// right: unset;
+// bottom: -2.5rem;
+// left: 7em;
+
+// @media screen and (max-width: 1500px) {
+// left: 4em;
+// }
+
+// @media screen and (max-width: 1100px) {
+// left: 2em;
+// }
+
+// @media (max-width: 600px) {
+// bottom: 0.5em !important;
+// }
+// }
+
+.image-gallery-left-nav {
+ left: 4rem;
+ bottom: -5.5rem;
+ top: unset;
+}
+
+.image-gallery-right-nav {
+ left: 8rem;
+ right: unset;
+ bottom: -5.5rem;
+ top: unset;
+}
+
+.image-gallery-right-nav,
+.image-gallery-left-nav {
+ font-size: 3rem;
+ z-index: 1 !important;
+
+ @media (max-width: 600px) {
+ bottom: 0;
+ }
+}
+
+// .slider-wrapper {
+// position: relative;
+// overflow: hidden;
+// width: 100%;
+// max-width: 100%;
+// height: 600px;
+// border-top-left-radius: 4px;
+// border-top-right-radius: 4px;
+
+// @media (max-width: 600px) {
+// height: 550px;
+// }
+
+// }
+
+// .image-gallery-slide-wrapper {
+// position: relative;
+// }
+
+// .image-gallery-fullscreen-button:hover::before,
+// .image-gallery-left-nav:hover::before,
+// .image-gallery-play-button:hover::before,
+// .image-gallery-right-nav:hover::before {
+// color: #fff;
+// }
+
+// .image-gallery-slides {
+// white-space: normal !important;
+// }
+
+// .image-gallery-thumbnails-wrapper {
+// display: none;
+// }
+
+.columns-view {
+ > .grid.column-grid {
+ > .column.column-blocks-wrapper {
+ display: flex;
+ flex-direction: column;
+ > div {
+ flex-grow: 1;
+ display: flex;
+ flex-direction: column;
+ > div {
+ flex-grow: 1;
+ }
+ }
+ }
+ }
+}
+
+.discreet.block_source {
+ color: #999;
+ font-size: 12px;
+ line-height: normal;
+ margin-top: auto;
+}
diff --git a/theme/site/globals/site.variables b/theme/site/globals/site.variables
new file mode 100644
index 0000000..a3ee2dc
--- /dev/null
+++ b/theme/site/globals/site.variables
@@ -0,0 +1,393 @@
+/*******************************
+ Site Settings
+*******************************/
+
+/*-------------------
+ Fonts
+--------------------*/
+
+@fontName : 'Poppins';
+@headerFontName : 'Roboto';
+
+// @googleFontSizes : '300,400,500,700,400italic,700italic';
+
+@headerFont : 'Roboto', sans-serif;
+@pageFont : 'Roboto', sans-serif;
+
+@googleFontName : @fontName;
+@importGoogleFonts : true;
+@googleFontSizes : '300,400,500,600,700,400italic,700italic';
+@googleSubset : 'latin';
+
+@googleProtocol : 'https://';
+@googleFontRequest : '@{googleFontName}:@{googleFontSizes}|@{headerFontName}:@{googleFontSizes}';
+
+
+@bold : bold;
+@normal : normal;
+
+/*-------------------
+ Base Sizes
+--------------------*/
+/* This is the single variable that controls them all */
+@emSize : 16px;
+
+/* The size of page text */
+@fontSize : 16px;
+
+
+/*-------------------
+ Border Radius
+--------------------*/
+
+
+/*-------------------
+ Brand Colors
+--------------------*/
+@primaryColor : @darkGreen;
+
+@secondaryColor : @brown;
+
+@lightSecondaryColor : @lightGrey;
+
+
+/*--------------
+ Page Heading
+---------------*/
+
+@headerFontWeight : 500;
+
+
+/*--------------
+ Form Input
+---------------*/
+
+/* This adjusts the default form input across all elements */
+@inputHorizontalPadding : 0;
+
+/* Input Text Color */
+@inputPlaceholderColor: #B8C6C8;
+
+
+/*-------------------
+ Focused Input
+--------------------*/
+
+
+/*-------------------
+ Sizes
+--------------------*/
+
+/*
+ Sizes are all expressed in terms of 14px/em (default em)
+ This ensures these "ratios" remain constant despite changes in EM
+*/
+
+@bigSize : (19 / 14);
+@hugeSize : (22 / 14);
+@massiveSize : (26 / 14);
+
+
+/*-------------------
+ Page
+--------------------*/
+
+@pageBackground : @white;
+
+
+/*-------------------
+ Paragraph
+--------------------*/
+
+
+/*-------------------
+ Links
+--------------------*/
+
+@linkColor : @blue;
+
+
+/*-------------------
+ Scroll Bars
+--------------------*/
+
+
+/*-------------------
+ Highlighted Text
+--------------------*/
+
+
+/*-------------------
+ Loader
+--------------------*/
+
+
+/*-------------------
+ Grid
+--------------------*/
+
+@columnCount: 12;
+
+/*-------------------
+ Transitions
+--------------------*/
+
+
+/*-------------------
+ Breakpoints
+--------------------*/
+
+@mobileBreakpoint : 320px;
+@tabletBreakpoint : 768px;
+@computerBreakpoint : 1200px;
+@largeMonitorBreakpoint : 1600px;
+@widescreenMonitorBreakpoint : 1720px;
+
+
+// not used
+@widescreenlaptopBreakpoint : 1366;
+@widescreenlaptopBigBreakpoint : 1440;
+@widescreenmonitorSmallBreakpoint : 1626;
+
+
+/* Responsive */
+@largestMobileScreen : (@tabletBreakpoint - 1px);
+@largestTabletScreen : (@computerBreakpoint - 1px);
+@largestSmallMonitor : (@largeMonitorBreakpoint - 1px);
+@largestLargeMonitor : (@widescreenMonitorBreakpoint - 1px);
+@widescreenlaptopSize : (@widescreenlaptopBreakpoint - 1px);
+@widescreenlaptopBigSize : (@widescreenlaptopBigBreakpoint - 1px);
+@widescreenmonitorSmallSize : (@widescreenmonitorSmallBreakpoint - 1px);
+@widescreenMonitorSize : (@widescreenMonitorBreakpoint - 1px);
+
+/*-------------------
+ Site Colors
+--------------------*/
+
+/*--- Theme colors ---*/
+
+@lightGreen : #769e2e;
+@darkGreen : #225511;
+@darkerGreen : #003311;
+@darkBrown : #554433;
+@darkOrange : #cc4400;
+
+// @textColor : #002200;
+@textColor: #162A16;
+
+/*--- Colors ---*/
+@orange : #FA5C2A; // Palette: reddishOrange
+@yellow : #F6A808; // Palette: goldenRod
+@green : #51AA55; // Palette: darkPastelGreen
+@teal : #517776; // Palette: slate
+@blue : #007EB1; // Palette: Plone (tealBlue/cerulean)
+@pink : #E40166; // Palette: darkHotPink
+@brown : #826A6A; // Palette: reddishGrey
+@grey : #68778D; // Palette: blueishGrey
+@black : #252525; // Palette: darkishGrey
+
+/*--- Light Colors ---*/
+@lightOlive : #C9EAB1; // Palette: lightSage
+@lightGrey : #878F93;
+
+/*--- Neutrals ---*/
+@fullBlack : #000000;
+@offWhite : #F9FAFB;
+@darkWhite : #F3F4F5;
+@midWhite : #DCDDDE;
+@white : #FFFFFF;
+
+/*--- Colored Backgrounds ---*/
+@redBackground : #F5C1C1; // Palette: alertError
+@tealBackground : #EDF1F2; // Palette: Breadcrumbs
+@blueBackground : #F2F6F8;
+@purpleBackground : #B8C6C8; // Dublin Core Summary
+
+/*--- Colored Headers ---*/
+
+/*--- Colored Text ---*/
+@tealTextColor : @teal;
+
+/*--- Colored Border ---*/
+// Pastanaga custom borders colors
+@greyBorderColor : #C7D5D8; // breadcrumbs border
+@lightGreyBorderColor : #E0E1E0; // breadcrumbs background
+@blocksBorderGreen: #226622;
+
+
+/*-------------------
+ Alpha Colors
+--------------------*/
+
+
+/*-------------------
+ Accents
+--------------------*/
+
+
+/*******************************
+ Power-User
+*******************************/
+
+
+/*-------------------
+ Emotive Colors
+--------------------*/
+
+/* Positive */
+
+/* Negative */
+@negativeBackgroundColor : rgb(237, 195, 194);
+@negativeHeaderColor : @black;
+@negativeTextColor : @black;
+
+/* Info */
+
+/* Warning */
+
+
+/*-------------------
+ Paths
+--------------------*/
+
+
+/*-------------------
+ Em Sizes
+--------------------*/
+
+/* em */
+
+/* rem */
+
+
+/*-------------------
+ Icons
+--------------------*/
+
+
+/*-------------------
+ Neutral Text
+--------------------*/
+
+@selectedTextColor : @lightGrey;
+@inverteditemlinkcolor : @white;
+
+/*-------------------
+ Brand Colors
+--------------------*/
+
+@youtubeColor : #CC181E;
+
+
+/*-------------------
+ Borders
+--------------------*/
+
+@borderColor : @greyBorderColor;
+
+
+/*-------------------
+ Derived Values
+--------------------*/
+
+/* Loaders Position Offset */
+
+
+/* Rendered Scrollbar Width */
+
+/* Maximum Single Character Glyph Width, aka Capital "W" */
+
+/* Used to match floats with text */
+
+/* Header Spacing */
+
+/* Minimum Mobile Width */
+
+
+/* Positive / Negative Dupes */
+
+/*-------------------
+ Exact Pixel Values
+--------------------*/
+/*
+ These are used to specify exact pixel values in em
+ for things like borders that remain constantly
+ sized as emSize adjusts
+
+ Since there are many more sizes than names for sizes,
+ these are named by their original pixel values.
+
+*/
+
+/* Columns */
+
+
+/*******************************
+ States
+*******************************/
+
+/*-------------------
+ Disabled
+--------------------*/
+
+
+/*-------------------
+ Hover
+--------------------*/
+
+/*--- Shadows ---*/
+
+/*--- Colors ---*/
+
+/*--- Emotive ---*/
+
+/*--- Brand ---*/
+
+/*--- Dark Tones ---*/
+
+/*--- Light Tones ---*/
+
+
+/*-------------------
+ Focus
+--------------------*/
+
+/*--- Colors ---*/
+
+/*--- Emotive ---*/
+
+/*--- Brand ---*/
+
+/*--- Dark Tones ---*/
+
+/*--- Light Tones ---*/
+
+
+/*-------------------
+ Down (:active)
+--------------------*/
+
+/*--- Colors ---*/
+
+/*--- Emotive ---*/
+
+/*--- Brand ---*/
+
+/*--- Dark Tones ---*/
+
+/*--- Light Tones ---*/
+
+
+/*-------------------
+ Active
+--------------------*/
+
+/*--- Colors ---*/
+
+/*--- Emotive ---*/
+
+/*--- Brand ---*/
+
+/*--- Dark Tones ---*/
+
+/*--- Light Tones ---*/
diff --git a/theme/site/modules/accordion.overrides b/theme/site/modules/accordion.overrides
new file mode 100644
index 0000000..0077f18
--- /dev/null
+++ b/theme/site/modules/accordion.overrides
@@ -0,0 +1,26 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+/* Dropdown Icon */
+.ui.accordion .title .dropdown.icon,
+.ui.accordion .accordion .title .dropdown.icon {
+ float: right;
+}
+
+.ui.accordion .title .dropdown.icon:before,
+.ui.accordion .accordion .title .dropdown.icon:before {
+ content: '\e904';
+}
+
+.ui.accordion .active.title .dropdown.icon:before,
+.ui.accordion .accordion .active.title .dropdown.icon:before {
+ content: '\e9ce';
+}
+
+.ui.styled.accordion .title,
+.ui.styled.accordion .accordion .title {
+ background: @darkWhite;
+ font-size: @12px;
+ text-transform: uppercase;
+}
diff --git a/theme/site/modules/accordion.variables b/theme/site/modules/accordion.variables
new file mode 100644
index 0000000..d3c1835
--- /dev/null
+++ b/theme/site/modules/accordion.variables
@@ -0,0 +1,48 @@
+/*******************************
+ Accordion
+*******************************/
+
+/* Title */
+
+/* Icon */
+
+/* Child Accordion */
+
+/* Content */
+
+/*-------------------
+ Coupling
+--------------------*/
+
+/*-------------------
+ States
+--------------------*/
+
+@activeIconTransform: none;
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Styled */
+@styledBorderRadius: 0;
+@styledBoxShadow: none;
+
+/* Content */
+
+/* Child Content */
+
+/* Styled Title */
+@styledTitleFontWeight: @normal;
+@styledTitleColor: @teal;
+@styledTitleBorder: none;
+
+/* Styled Title States */
+@styledTitleHoverBackground: @darkWhite;
+@styledTitleHoverColor: @teal;
+@styledActiveTitleBackground: @darkWhite;
+@styledActiveTitleColor: @teal;
+
+/* Styled Child Title States */
+
+/* Inverted */
diff --git a/theme/site/modules/chatroom.overrides b/theme/site/modules/chatroom.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/modules/chatroom.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/modules/chatroom.variables b/theme/site/modules/chatroom.variables
new file mode 100644
index 0000000..0da971c
--- /dev/null
+++ b/theme/site/modules/chatroom.variables
@@ -0,0 +1,3 @@
+/*******************************
+ Chatroom
+*******************************/
\ No newline at end of file
diff --git a/theme/site/modules/checkbox.overrides b/theme/site/modules/checkbox.overrides
new file mode 100644
index 0000000..55b80f5
--- /dev/null
+++ b/theme/site/modules/checkbox.overrides
@@ -0,0 +1,34 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+@font-face {
+ font-family: 'Checkbox';
+ src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMg8SBD8AAAC8AAAAYGNtYXAYVtCJAAABHAAAAFRnYXNwAAAAEAAAAXAAAAAIZ2x5Zn4huwUAAAF4AAABYGhlYWQGPe1ZAAAC2AAAADZoaGVhB30DyAAAAxAAAAAkaG10eBBKAEUAAAM0AAAAHGxvY2EAmgESAAADUAAAABBtYXhwAAkALwAAA2AAAAAgbmFtZSC8IugAAAOAAAABknBvc3QAAwAAAAAFFAAAACAAAwMTAZAABQAAApkCzAAAAI8CmQLMAAAB6wAzAQkAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADoAgPA/8AAQAPAAEAAAAABAAAAAAAAAAAAAAAgAAAAAAADAAAAAwAAABwAAQADAAAAHAADAAEAAAAcAAQAOAAAAAoACAACAAIAAQAg6AL//f//AAAAAAAg6AD//f//AAH/4xgEAAMAAQAAAAAAAAAAAAAAAQAB//8ADwABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAAAAAAAAAAIAADc5AQAAAAABAEUAUQO7AvgAGgAAARQHAQYjIicBJjU0PwE2MzIfAQE2MzIfARYVA7sQ/hQQFhcQ/uMQEE4QFxcQqAF2EBcXEE4QAnMWEP4UEBABHRAXFhBOEBCoAXcQEE4QFwAAAAABAAABbgMlAkkAFAAAARUUBwYjISInJj0BNDc2MyEyFxYVAyUQEBf9SRcQEBAQFwK3FxAQAhJtFxAQEBAXbRcQEBAQFwAAAAABAAAASQMlA24ALAAAARUUBwYrARUUBwYrASInJj0BIyInJj0BNDc2OwE1NDc2OwEyFxYdATMyFxYVAyUQEBfuEBAXbhYQEO4XEBAQEBfuEBAWbhcQEO4XEBACEm0XEBDuFxAQEBAX7hAQF20XEBDuFxAQEBAX7hAQFwAAAQAAAAIAAHRSzT9fDzz1AAsEAAAAAADRsdR3AAAAANGx1HcAAAAAA7sDbgAAAAgAAgAAAAAAAAABAAADwP/AAAAEAAAAAAADuwABAAAAAAAAAAAAAAAAAAAABwQAAAAAAAAAAAAAAAIAAAAEAABFAyUAAAMlAAAAAAAAAAoAFAAeAE4AcgCwAAEAAAAHAC0AAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAIAAAAAQAAAAAAAgAHAGkAAQAAAAAAAwAIADkAAQAAAAAABAAIAH4AAQAAAAAABQALABgAAQAAAAAABgAIAFEAAQAAAAAACgAaAJYAAwABBAkAAQAQAAgAAwABBAkAAgAOAHAAAwABBAkAAwAQAEEAAwABBAkABAAQAIYAAwABBAkABQAWACMAAwABBAkABgAQAFkAAwABBAkACgA0ALBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhWZXJzaW9uIDIuMABWAGUAcgBzAGkAbwBuACAAMgAuADBDaGVja2JveABDAGgAZQBjAGsAYgBvAHhDaGVja2JveABDAGgAZQBjAGsAYgBvAHhSZWd1bGFyAFIAZQBnAHUAbABhAHJDaGVja2JveABDAGgAZQBjAGsAYgBvAHhGb250IGdlbmVyYXRlZCBieSBJY29Nb29uLgBGAG8AbgB0ACAAZwBlAG4AZQByAGEAdABlAGQAIABiAHkAIABJAGMAbwBNAG8AbwBuAC4AAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA)
+ format('truetype');
+}
+
+/* Checkmark */
+.ui.checkbox label:after,
+.ui.checkbox .box:after {
+ font-family: 'Checkbox';
+}
+
+/* Checked */
+.ui.checkbox input:checked ~ .box:after,
+.ui.checkbox input:checked ~ label:after {
+ content: '\e800';
+}
+
+/* Indeterminate */
+.ui.checkbox input:indeterminate ~ .box:after,
+.ui.checkbox input:indeterminate ~ label:after {
+ content: '\e801';
+ font-size: @12px;
+}
+
+/* UTF Reference
+.check:before { content: '\e800'; }
+.dash:before { content: '\e801'; }
+.plus:before { content: '\e802'; }
+*/
diff --git a/theme/site/modules/checkbox.variables b/theme/site/modules/checkbox.variables
new file mode 100644
index 0000000..2c6a1f4
--- /dev/null
+++ b/theme/site/modules/checkbox.variables
@@ -0,0 +1,50 @@
+/*******************************
+ Checkbox
+*******************************/
+
+/* Label */
+
+/* Checkbox */
+
+/* Checkmark */
+
+/* Label */
+
+/*-------------------
+ States
+--------------------*/
+
+/* Hover */
+
+/* Pressed */
+
+/* Focus */
+
+/* Active */
+
+/* Active Focus */
+
+/* Indeterminate */
+
+/* Disabled */
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Radio */
+/* Uses px to avoid rounding issues with circles */
+
+/* Slider & Toggle Handle */
+
+/* Slider */
+
+/* Slider States */
+
+/* Toggle */
+@toggleOffHandleBoxShadow: none;
+@toggleOnHandleBoxShadow: none;
+
+/*-------------------
+ Variations
+--------------------*/
diff --git a/theme/site/modules/dimmer.overrides b/theme/site/modules/dimmer.overrides
new file mode 100644
index 0000000..14fb0da
--- /dev/null
+++ b/theme/site/modules/dimmer.overrides
@@ -0,0 +1,3 @@
+/*******************************
+ Theme Overrides
+*******************************/
diff --git a/theme/site/modules/dimmer.variables b/theme/site/modules/dimmer.variables
new file mode 100644
index 0000000..29563c3
--- /dev/null
+++ b/theme/site/modules/dimmer.variables
@@ -0,0 +1,23 @@
+/*******************************
+ Dimmer
+*******************************/
+
+/* Hidden (Default) */
+
+/* Content */
+
+/* Visible */
+
+/*-------------------
+ Types
+--------------------*/
+
+/* Page Dimmer*/
+
+/*-------------------
+ Variations
+--------------------*/
+
+/* Inverted */
+
+/* Simple */
diff --git a/theme/site/modules/dropdown.overrides b/theme/site/modules/dropdown.overrides
new file mode 100644
index 0000000..a283c39
--- /dev/null
+++ b/theme/site/modules/dropdown.overrides
@@ -0,0 +1,68 @@
+/*******************************
+ Theme Overrides
+*******************************/
+
+.ui.dropdown.right {
+ float: right;
+}
+
+// This fixes the special height of all Pastanaga inputs in tags widget
+.ui.multiple.search.dropdown > input.search {
+ height: initial;
+}
+
+.ui.selection.dropdown:not(.multiple):not(.search) > .dropdown.icon {
+ position: static;
+ // custom padding for dropdowns
+ font-size: 2em;
+}
+
+.ui.selection.dropdown {
+ border-bottom: 1px solid @borderColor;
+}
+
+.ui.selection.dropdown:not(.multiple) {
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+}
+
+.ui.active.selection.dropdown {
+ border: none;
+ border-bottom: 1px dotted #b8c6c8;
+}
+
+.ui.selection.active.dropdown .menu {
+ margin-top: 1px;
+ border: none;
+
+ &:hover {
+ border: none;
+ }
+
+ &:last-child {
+ border-bottom: 1px solid @blue;
+ }
+}
+
+.ui.form .ui.dropdown:not(.multiple):not(.search) .menu .selected.item:after {
+ content: '\e929';
+ float: right;
+ font-family: 'Icons';
+}
+
+.ui.form .ui.dropdown .menu .item:hover:after {
+ color: @dropdownTextColor;
+ content: '\e929';
+ float: right;
+ font-family: 'Icons';
+}
+
+.ui.dropdown.multiple .menu .selected.item:hover {
+ background: @subtleTransparentBlack;
+}
+
+.ui.dropdown .menu.left {
+ right: 0;
+ left: auto;
+}
diff --git a/theme/site/modules/dropdown.variables b/theme/site/modules/dropdown.variables
new file mode 100644
index 0000000..204162c
--- /dev/null
+++ b/theme/site/modules/dropdown.variables
@@ -0,0 +1,140 @@
+/*******************************
+ Dropdown
+*******************************/
+@dropdownTextColor: #636363;
+
+/*-------------------
+ Element
+--------------------*/
+
+@borderRadius: 0;
+
+/*-------------------
+ Content
+--------------------*/
+
+/* Icon */
+@dropdownIconSize: 0;
+@dropdownIconMargin: 0;
+
+/* Current Text */
+
+/* Menu */
+
+/* Text */
+
+/* Menu Item */
+@itemColor: @dropdownTextColor;
+@itemFontWeight: 300;
+
+/* Sub Menu */
+
+/* Menu Header */
+
+/* Menu Divider */
+
+/* Menu Input */
+
+/* Menu Image */
+
+/* Item Sub-Element */
+
+/* Sub-Menu Dropdown Icon */
+
+/* Description */
+
+/* Message */
+
+/* Floated Content */
+
+/*-------------------
+ Types
+--------------------*/
+
+/*------------
+ Selection
+--------------*/
+
+@selectionItemDivider: none;
+
+/*
+
+
+ {this.props.content.subjects &&
+ this.props.content.subjects.length > 0 && (
+ {this.props.content.title}
+{this.props.content.description}
+