/**
 * @file
 * css layout for development.
 *
 * topic of this file may change in time
 *
 * the first part of the file is for mobile devices and generel stuff
 * so its "mobile first"
 *
 * later in the file there will come some breakpoints marked as "@media all and ( min-width:xxxpx ) {...}
 *
 * at the end you will developer debug helper rules
 * you can delete it at any time.
 */
/**
 * font-family declarations
 *
 * must stay on top
 * look at ../fonts/open-sans.css
 * for dokumentation
 */
/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'),
       url('../fonts/open-sans/open-sans-v17-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../fonts/open-sans/open-sans-v17-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-300italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'),
       url('../fonts/open-sans/open-sans-v17-latin-300italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-300italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: local('Open Sans Italic'), local('OpenSans-Italic'),
       url('../fonts/open-sans/open-sans-v17-latin-italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-600italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: local('Open Sans SemiBold Italic'), local('OpenSans-SemiBoldItalic'),
       url('../fonts/open-sans/open-sans-v17-latin-600italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-600italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('../fonts/open-sans/open-sans-v17-latin-600.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-600.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-700 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 700;
  src: local('Open Sans Bold'), local('OpenSans-Bold'),
       url('../fonts/open-sans/open-sans-v17-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}

/* open-sans-700italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 700;
  src: local('Open Sans Bold Italic'), local('OpenSans-BoldItalic'),
       url('../fonts/open-sans/open-sans-v17-latin-700italic.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/open-sans/open-sans-v17-latin-700italic.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/*!
Fork Awesome 1.1.7
License - https://forkaweso.me/Fork-Awesome/license

Copyright 2018 Dave Gandy & Fork Awesome

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
 */
@font-face {
  font-family: 'ForkAwesome';
  src: local('ForkAwesome'), local('FontAwesome'),
       url('../fonts/fork-awesome/forkawesome-webfont.woff2?v=1.1.7') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/fork-awesome/forkawesome-webfont.woff?v=1.1.7') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
  font-weight: normal;
  font-style: normal;
}

/**
 * Animation Keyframes
 */

@keyframes hide-messages{
  from { margin-left:0px;    }
  to   { margin-left:-50vw: }
}

/**
 * Basic elements
 *
 * very general basic rules for all fitting elements.
 *
 * @what
 *   html
 *   body
 *   headings
 *   content elements
 *   list styles
 *   code
 *   image
 *   abbreviation
 *   horizontal rule
 *   tables
 *   forms
 *   contextual links
 */
/* Font size to 10px at body */
html{
  font-size:1.25em;
}
body{
  font-size: 0.5em;
}

/**
 * container for non-responsive elements
 *
 * youtube/video 16:9 iframe
 * @see  https://benmarshall.me/responsive-iframes/?utm_source=duckduckgo.com&utm_medium=organic&utm_campaign=DuckDuckGo&redirect=1
 *
 * tables
 * @see  https://mdbootstrap.com/docs/jquery/tables/responsive/
 *
 * @see  more posibilities with aspect ratio
 *       https://css-tricks.com/responsive-iframes/
 *
 */
.iframe-container,
.youtube-preview{
  overflow:hidden;
  padding-top:56.25%; /* 16:9 aspect ratio */
  position:relative;
}
.youtube-preview{
  overflow:visible;
  margin-bottom:50%;
}
.iframe-container > iframe,
.youtube-preview > iframe,
.youtube-preview > a{
  border:0;
  height:100%;
  left:0;
  position:absolute;
  top:0;
  width:100%;
}
.table-container{
  width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
  -ms-overflow-style:-ms-autohiding-scrollbar;
}

/* youtube injection preview icon */
.youtube-preview > a{
  display:block;
}
.youtube-preview > a::before{
  display:block;
  position:absolute;
  top:calc(50% - 0.5em);
  left:calc(50% - 0.75em);
  height:1em;
  width:1.5em;
  line-height:1;
  font-size:4em;
  color:#433B33;
  text-align:center;
  font-family:'ForkAwesome';
  content:'\f16a';
  text-rendering:auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  z-index:50;
}
.youtube-preview > a::after{
  display:block;
  position:absolute;
  top:calc(50% - 0.75em);
  left:calc(50% - 1em);
  height:1.5em;
  width:2em;
  background:#FFFFFF;
  content:' ';
  z-index:40;
}
.youtube-preview > a:hover::before,
.youtube-preview > a:active::before{
  color:#FF0000;
}
.youtube-preview a img{
  margin:0;
}
.youtube-preview > figcaption{
  position:absolute;
  top:100%;
  left:0;
  right:0;
  padding:1em 1.5em;
  background:rgba(0, 0, 0, 0.5);
  font-size:0.7em;
}

/* youtube links list */
.youtube-list li::before{
  display:inline-block;
  margin:0 0.75em 0 0;
  font-family:'ForkAwesome';
  content:'\f167';
  text-rendering:auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* headings */
h2,
h3,
h4,
h5,
h6 {
  margin:0 0 0.3em 0;
}

/* content elements */
p,
table,
ul,
ol,
dl,
dt,
dd,
.columns,
img {
  margin:0 0 1em 0;
}
ul,
ol{
  padding-left:1.5em;
}

/* list styles */
ul          { list-style-type: disc;   }
ul ul       { list-style-type: circle; }
ul ul ul    { list-style-type: square; }
ul ul ul ul { list-style-type: circle; }

ol       { list-style-type: decimal;     }
ol ol    { list-style-type: lower-alpha; }
ol ol ol { list-style-type: decimal;     }
ul ul,
ul ol,
ol ol,
ol ul{
  padding-top:0.5em;
}
dt {
  margin-bottom:0;
}
dd {
  margin-bottom:0.5em;
}

/* code */
pre, code, tt{}
pre{}

/* image */
img{
  max-width:100%;
  height:auto;
  display:block;
}

/* abbreviation */
abbr {
  cursor: help;
  white-space: nowrap;
}

/* horizontal rule */
hr{
  border:1px solid #E1E1E1;
  border-width:0 0 1px 0;
  margin:3em 0;
}
.content hr{
  clear:both;
}

/* tables */
table{
  width:100%;
}
th{
  text-align:left;
}
tbody{
  border-color:transparent;
}
tr.even,
tr.odd{
  background:none;
}
td,
th{
  padding:0.3em 0.5em;
}
tr.even td,
tr.odd td{
}
tr + tr td,
thead + tbody tr:first-child td{
  border-top:1px solid #E1E1E1;
}
table .views-field-title{
  min-width:50vw;
}

/* forms */
fieldset{
  margin:0 0 0.5em 0;
}
label[for]{
  cursor:pointer;
  display:block;
}
button,
input,
select,
textarea{
  border:1px solid #F3F3F3;
  color:inherit;
  background:#F6F6F6;
  padding:0.3em 1em 0.4em 1em;
  line-height:2;
  margin:0 0 1em 0;
  max-width:100%;
  transition:all ease 500ms;
  box-sizing:border-box;
  border:1px solid #E6E6E6;
}
input[type="text"]:focus,
input[type="email"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
textarea:focus,
select:focus,
textarea:focus{
	outline:0;
  color:#000000;
}
button,
input[type="color"],
input[type="reset"],
input[type="button"],
input[type="submit"]{
  text-align:center;
  padding-left:1em;
  padding-right:1em;
  text-indent:0;
  border:1px solid #D5D5D5;
  cursor:pointer;
}
button:hover,
button:focus,
input[type="submit"]:focus,
input[type="submit"]:hover{
  border-color:#CCCCCC;
  color:#000000;
}
button[disabled],
input[disabled],
select[disabled],
textarea[disabled]{
	opacity:.5;
}
input[type="checkbox"],
input[type="radio"] {
	padding: 0;
	margin-bottom:0.5em:
}
button,
input:not([type="checkbox"]):not([type="radio"]),
select,
textarea{
  margin-right:0;
  width:100%;
}
input:not([type="checkbox"]):not([type="radio"]){
  padding-left:0;
  text-indent:1em;
}
input.text-full{
  width:100%;
  margin-right:0;
}
/* It's rather heartwarming to know you can style a <select> in a rather cross-browser friendly way that doesn't hurt accessibility. Kudos for documenting this Scott! */
select{
  display: block;
  width: 100%;
  max-width: 100%;
  padding-top:0.642857143em;
  padding-bottom:0.642857143em;
  margin-bottom:0.714285714em;
  border: 1px solid #E6E6E6;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%237F7F7F%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
  background-repeat: no-repeat;
  background-color: #FFFFFF;
  background-position: right 0.7em top 50%;
  background-size: 1em auto;
}
/* CAUTION: Internet Explorer hackery ahead */
select::-ms-expand {
  display: none; /* Remove default arrow in Internet Explorer 10 and 11 */
}
/* Target Internet Explorer 9 to undo the custom arrow */
@media screen and (min-width:0\0) {
  select {
    background: none\9;
    padding: 5px\9;
  }
}
.content select{
  padding-right:2em;
  width:auto;
}
select,
textarea{
}
button:not([type="reset"]),
input[type="submit"],
input[type="submit"]{
  padding:1.5em 2em 1.433333333em 2em;
  font-size:0.857142857em;
  line-height:1;
  font-weight:500;
  letter-spacing:0.1em;
  text-decoration:none;
  text-transform:uppercase;
  border-color:#1C1936;
  border-width:2px;
}
button:not([type="reset"]):hover,
button:not([type="reset"]):focus,
input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="submit"]:hover,
input[type="submit"]:focus{
  border-color:#1C1936;
  background-color:#1C1936;
  color:#FFFFFF;
}
input[type="checkbox"]{
  margin-top:0.2em;
  margin-right:1.5em;
}
textarea{
  line-height:1.4;
  padding-top:0.7em;
  padding-bottom:0.7em;
}
.js-form-type-checkbox{
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-align:start;
  -ms-flex-align:start;
  align-items:flex-start
}
.content button,
.content input,
.content select,
.content textarea{
	font-size:1em;
  padding:0.285714286em 0.714285714em;
}
.form-textarea-wrapper textarea{
  color:#666666;
}
#block-search-form div{
  display:block;
}

button + .description,
input + .description,
select + .description,
textarea + .description{
  margin-top:-0.8em;
  margin-bottom:1em;
}
button.toolbar-item,
button.toolbar-item{
  text-transform:none;
  letter-spacing:inherit;
}

/* drupal contextual links move out of block
.contextual{
  right:-36px;
  top:0;
  padding:5px;
}
.contextual .trigger{
  right:0;
}
*/

/**
 * Menus & Navigations
 *
 * @what
 *   nav container
 *   menu list
 *   -- items
 *   -- sub menu lists
 *   -- items with icons
 */
nav a,
.menu a{
  display:block;
  font-size:1.6em;
  padding:0.5em 1em 0.4em 1em;
}
.toolbar a{
  font-size:inherit;
}
.menu a{
  font-weight:500;
  white-space:nowrap;
  text-transform:uppercase;
  text-decoration:none;
}
nav a:link,
nav a:visited,
.menu a:link,
.menu a:visited{
}
nav a:hover,
nav a:focus,
.menu a:hover,
.menu a:focus{
}
nav a:focus,
.menu a:focus{
  outline:0;
}
nav a:focus,
nav a:active,
.menu a:focus,
.menu a:active,
nav a.active,
nav .active > a{
}
nav a:hover,
nav a:active,
.menu a:hover,
.menu a:active{
  background:#C8C9C9;
}
.toolbar nav a:hover,
.toolbar nav a:active{
  background:inherit;
}

/* Pagination navigation */
nav.pager{
  margin:2em;
}
.pager .pager__item{
  display:inline-block;
  margin:2px;
}
.pager .pager__item > *{
  font-size:1em;
  padding:0.357142857em 0.857142857em;
  border: 1px solid #BFBFBF;
  text-decoration: none;
}

/* Menus */
.menu .menu-item--active-trail > a,
.menu .menu-item--active > a,
.menu a.is-active-trail,
.menu a.is-active{
  background:#D7D8D9;
}
.menu .menu-item--expanded > a::before{
  display:inline-block;
  float:right;
  position:relative;
  top:-1px;
  margin-left:0.75em;
  font-size:1.1em;
  content:'\f0da';
  font-family:'ForkAwesome';
  text-rendering:auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transform:rotate(90deg);
  transition:transform 400ms ease;
}
.menu .menu-item--expanded:hover > a::before{
  transform:rotate(0deg);
}

/* sub menus */
.menu ul{
  border-top:2px solid #C8C9C9;
  border-bottom:4px solid #D7D8D9;
  background:#F5F5F5;
  -webkit-border-radius: 0 0 4px 4px;
  border-radius:0 0 4px 4px;
  -webkit-box-shadow:0 5px 5px -3px rgba(0,0,0,0.3), inset 0 5px 5px -5px rgba(0,0,0,0.3);
  box-shadow:0 5px 5px -3px rgba(0,0,0,0.3), inset 0 5px 5px -5px rgba(0,0,0,0.3);
}

/* sub sub menus */
.sub-menu ul{
  border:none;
  -webkit-border-radius: 0 4px 4px 0;
  border-radius:0 4px 4px 0;
  background:#F5F5F5;
  -webkit-box-shadow:0 0 7px -3px rgba(0,0,0,0.3);
  box-shadow:0 0 7px -3px rgba(0,0,0,0.3);
}
.menu ul a{
}
.menu ul a:link,
.menu ul a:visited{
}
.menu ul a:hover,
.menu ul a:focus{
  background:#D7D8D9;
}
.menu ul .menu-item--active-trail > a{
  background:#C8C9C9;
}
/* user account menu */
.user-logged-in .menu .menu-item-register,
.user-logged-in .menu .menu-item-login{
  display:none;
}
.menu .menu-item-user a::before,
.menu .menu-item-register a::before,
.menu .menu-item-login a::before,
.menu .menu-item-logout a::before{
  display: block;
  float:left;
  margin-right:1em;
  font-family: 'ForkAwesome';
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.menu .menu-item-user a::after,
.menu .menu-item-register a::after,
.menu .menu-item-login a::after,
.menu .menu-item-logout a::after{
  display:block;
  content:'';
  height:0;
  line-height:0;
  clear:both;
}
.menu .menu-item-user     a::before { content:'\f007'; }
.menu .menu-item-logout   a::before { content:'\f08b'; }
.menu .menu-item-login    a::before { content:'\f090'; }
.menu .menu-item-register a::before { content:'\f234'; }

/**
 * Fields & Blocks
 *
 * @what
 *   block font-sizes
 *   block tabs
 *
 *   fields general
 *   -- field types
 *   -- field type entity_reference
 *      -- field target_type node (content, default)
 *   -- field target_types
 *      -- field target_type taxonomy_term (inherits tabs, inherits menu)
 *      -- field target_type media
 *   -- field links list (inherits tabs)
 *
 *   block search_form
 *   block comment_form
 */

/* controls the whole font-size at once */
.block > .inner{
  font-size:1.4em;
  line-height:1.642857143;
}
.block-menu > .inner,
nav.block > .inner,
.site-branding > .inner{
  font-size:1em;
  line-height:inherit;
}

/* Tabs menu */
.tabs {
  /**
   * Setting display to flex makes this container lay
   * out its children using flexbox
   */
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
}
.tabs .tab{
}
.tabs .tab a{
  font-size:1em;
  border-bottom:2px solid #E6E6E6;
}
.tabs .tab > a:hover,
.tabs .tab > a:active,
.tabs .tab.tab-active > a{
  border-bottom-color:#BFBFBF;
}

/* Fields general */
.field.field-label-inline{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
}
.field .title{
  padding:0.5em 0 0.4em 0;
  font-size:1em;
}
.field.field-label-inline .title{
  margin-bottom:0;
  padding-right:1em;
  border-right:1px solid #E6E6E6;
}
.field.field-label-inline > .inner{
  padding-left:1em;
}

/* field type entity_reference */
.field-entity-reference{
  margin:1em 0 2em 0;
}
.field-entity-reference .field-item{
  padding:0.5em 0;
}
.field-entity-reference .field-item + .field-item{
  border-top:1px solid #E6E6E6;
}

/* field target_type taxonomy_term - inherits from tabs, menu */
.field-taxonomy-terms{
}
.field-taxonomy-terms .title{
  font-size:1em;
  font-weight:normal;
}
.field-taxonomy-terms .title::before{
  display: inline;
  margin-right:0.5em;
  font-family: 'ForkAwesome';
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content:'\f187';
  filter:brightness(200%);
}
.taxonomy-terms{
  flex-wrap:wrap;
}
.taxonomy-terms .taxonomy-term,
.taxonomy-terms .taxonomy-term + .taxonomy-term{
  border:none;
  padding:0;
}
.taxonomy-terms .taxonomy-term a{
  border:none;
  text-transform:capitalize;
}

/* field tags menu - inherits from terms */
.field-tags .title::before{
  content:'\f02c';
}
.tags .tag a{
}

/* field media entity reference - image display */
.field-medias .media{
  padding:2em 0;
}
.field-medias .media:first-child{
  padding-top:0.5em;
}
.field-medias .media img{
  margin:0;
}

/* field links list */
.field-links .links{
  flex-direction:row-reverse;
}

/* field event-start */
.field-event-start.field-label-inline > .inner > div{
  padding:0.5em 0;
}

/* block search form */
.search-block-form{
}
.searchform-enabled .search-form{
  position:relative;
}
.search-form > .inner{
  display:-webkit-box;
  display:-moz-box;
  display:-ms-flexbox;
  display:-webkit-flex;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -ms-flex-pack:distribute;
  justify-content:space-around;
}
.search-form > .inner{
}
.search-form label{
  display:none;
  text-indent:-9999em;
  padding:0;
  height:3.2em;
  width:3.2em;
  font-size:1.2em;
  line-height:1.4;
  color:#14244A;
  background:#F5F6F7;
}
.search-form label:hover,
.search-form label:focus,
.search-form label:active{
  background:#EDEDED;
}
.search-form label::before{
  display: block;
  float:left;
  height: 1.25em;
  line-height: 1.285714286em;
  padding:0.535714286em;
  width: 1.285714286em;
  text-align: center;
  text-indent: 0;
  font-family: 'ForkAwesome';
  content:'\f002';
  font-size: 1.4em;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.searchform-active .search-form label::before{
  content:'\f00d';
  font-family: 'ForkAwesome';
}
.searchform-enabled .search-form label{
  display:block;
}
.searchform-enabled .search-form > .inner{
  display:none;
  position:absolute;
  right:4.84em;
  top:0;
  width:74.4vw;
}
.searchform-active .search-form > .inner{
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
}
.search-form input,
.search-form button{
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
}
.search-form input{
  display:block;
  margin:0;
  padding-top:0.142857143em;
  padding-bottom:0.214285714em;
  -ms-flex-preferred-size:85%;
  flex-basis:85%;
  max-width:85%;
  background:#FFFFFF;
  border-color:#E6E6E6;
  border-right:none;
}
.search-form button{
  padding:0;
  margin:0;
  -ms-flex-preferred-size:15%;
  flex-basis:15%;
  line-height:1.85;
  color:#CCCCCC;
  background:#FFFFFF;
  border-color:#E6E6E6;
  border-left:none;
  text-align:center;
}
.search-form button:hover{
  color:#999999;
}
.search-form button::after{
  content:'\f002';
  font-family: 'ForkAwesome';
  font-style:normal;
  font-weight:normal;
  speak:none;
  font-variant:normal;
  text-transform:none;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}

/* comment form */
.comment-form{
  max-width:100%; /* breaks out of content otherwise */
}

/**
 * araes & regions
 *
 * areas mean defined by template "site" regions
 *
 * @what
 *   site containers
 *   site header
 *   -- block site branding
 *      -- site logo
 *      -- site name
 *      -- site slogan
 *   -- region secondary_menu
 *      -- block menu
 *         -- items with icons
 *   site menu
 *   -- block menu
 *      -- sub menus (dropdown)
 *   -- sideMenu Button
 *   site actions (extra container with interactive contents)
 *   -- overlays
 *   -- sideMenu
 *      -- block menu
 *         -- sub menus (accordeon)
 *         -- additional items & content
 *   site breadcrumbs
 *   -- items
 *   site main
 *   -- content
 *   -- sidebars
 *      -- blocks
 *      -- block titles
 *      -- block menu
 *  site footer
 *  -- region footer
 *  -- region footer_menu
 *     -- block menu
 *   site help
 *
 */
/* site containers */
.site-container > .inner{
  max-width:1137px;
  margin:0 auto;
  padding:1em;
}

/* site header */
/* Has 2 Regions inside .inner */
.site-header{
  background:#F5F6F7;
  position:fixed;
  top:0;
  left:0;
  right:0;
  z-index:20;
}
.toolbar-fixed .site-header{
  top:3.9em;
}
.site-branding > .inner{
  min-width:280px;
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
}
.scrolled .site-branding ~ *{
  display:none;
}
.site-header .site-branding > .inner > * + *{
  margin-left:1em;
}
.site-header .site-logo{
  max-height:100px;
}
.site-header .site-logo img{
  height:100%;
  width:auto;
}
.site-header .name-slogan{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-flow: column wrap;
  flex-flow: column wrap;
  -webkit-box-pack:center;
  -ms-flex-pack:center;
  justify-content:center;
}
/* take h1 default style for sitename even if its h2 */
.site-name{
  font-size:2.6em;
  line-height:1;
  margin-top:0;
  margin-bottom:0;
}
.site-slogan{
  font-size:1.4em;
  margin:0;
}
/* region-secondary-menu */
.site-header .region-secondary-menu{
  display:none;
}
.region-secondary-menu .menu{
}
.region-secondary-menu .menu ul ul{
  display:none;
}
.region-secondary-menu .menu,
.region-secondary-menu .sub-menu{
  margin:0;
}
.region-secondary-menu .menu > li{
  display:block;
  text-align:center;
}
.region-secondary-menu .menu li,
.region-secondary-menu .sub-menu li{
  position:relative;
}
.region-secondary-menu .menu a,
.region-secondary-menu .sub-menu a{
  text-transform:none;
  font-size:1.2em;
  line-height:1.583333333;
  padding:0.666666667em 1em;
}
/* reset general region rules for user menu */
.region-secondary-menu .menu-item-user a,
.region-secondary-menu .menu-item-register a,
.region-secondary-menu .menu-item-login a,
.region-secondary-menu .menu-item-logout a{
  text-indent:-9999em;
  padding:0;
  height:3.5em;
  width:3.5em;
  font-size:1em;
}
.region-secondary-menu .menu-item-user a::before,
.region-secondary-menu .menu-item-register a::before,
.region-secondary-menu .menu-item-login a::before,
.region-secondary-menu .menu-item-logout a::before{
  height: 1.357142857em;
  line-height: 1.357142857em;
  padding:0.571428571em;
  margin:0;
  width: 1.357142857em;
  text-align: center;
  text-indent: 0;
  font-size: 1.4em;
}
.region-secondary-menu .menu a:hover{
}
.region-secondary-menu .menu li + li a{
}
.region-secondary-menu .menu ul{
  position:absolute;
  top:3.6em;
  left:-9999em;
  z-index:50;
}

/**
 * Menu bar
 * Bar definitions start at 987px media query
 */
.site-menu{
}
/**
 * On moblile, header an site-menu have no height.
 * the next following element gets padding top
 * to start below the fixed elements
 */
.site-header + :not(.site-menu),
.site-menu + *{
  padding-top:13em;
}
.toolbar-fixed .site-header + :not(.site-menu),
.toolbar-fixed .site-menu + *{
  padding-top:16.9em;
}
/* reset padding of .site-container > .inner */
.site-menu > .inner{
  padding:0;
}
/* hide nav default on mobile */
.site-menu nav{
  z-index:60;
  width:100%;
  display:none;
}
.site-menu .menu > .menu-item--active > a::after,
.site-menu .menu > .menu-item--active-trail > a::after{
  display:block;
  position:absolute;
  bottom:-2px;
  left:0;
  height:4px;
  width:100%;
  background:#C8C9C9;
  content:' ';
}
.site-menu .search-form{
  width:100%;
}
.site-menu .search-form .search-field{
  width:60%;
  display:block;
  float:left;
}
.site-menu .search-form .search-submit{
  width:35%;
  display:block;
  float:right;
}
/* Side Menu JS Buttons inside .site-menu */
.site-menu .sideMenu{
  width: 2.4em;
  height: 1.6em;
  padding:2.2em 0.8em;
  position:fixed;
  right:1em;
  top:1em;
  cursor: pointer;
  z-index:120;
}
.toolbar-fixed .site-menu .sideMenu{
  top:4.8em;
}
.site-menu .sideMenu > div{
  width: 24px;
  height: 16px;
  position: relative;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
}
.site-menu .sideMenu span{
  display: block;
  position: absolute;
  height: 2px;
  width: 100%;
  background: #A4A5A6;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}
.site-menu .sideMenu span:nth-child(1) {
  top: 0px;
}
.site-menu .sideMenu span:nth-child(2),.site-menu .sideMenu span:nth-child(3) {
  top: 8px;
}
.site-menu .sideMenu span:nth-child(4) {
  top: 16px;
}
.site-menu .sideMenu.active span:nth-child(1) {
  top: 8px;
  width: 0%;
  left: 50%;
}
.site-menu .sideMenu.active span:nth-child(2) {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
.site-menu .sideMenu.active span:nth-child(3) {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
}
.site-menu .sideMenu.active span:nth-child(4) {
  top: 8px;
  width: 0%;
  left: 50%;
}


/**
 * Site Actions
 * ============
 */
.blackout,
#site-actions{
  position:fixed;
  height:100%;
  width:100%;
  left:0;
  top:0;
  pointer-events: none;
  background:#000000;
  opacity:0;
  z-index:30;
  transition:opacity ease-out 250ms;
}
#site-actions{
  background:none;
  opacity:1;
  z-index:100;
}

/* Side Menu */
.sideMenu-visible .blackout{
  opacity:0.35;
  pointer-events: auto;
  transition:opacity ease-in 200ms;
}
#site-actions .sideMenu{
  height:100vh;
  width:0;
  max-width:100%;
  position:absolute;
  top:0;
  right:0;
  overflow:hidden;
  overflow-y:auto;
  transition:width ease-in 250ms, height ease-in 250ms, top ease-in 100ms;
  background:#FFFFFF;
  -webkit-box-shadow:-5px 0 5px -3px rgba(0,0,0,0.5), inset 0 5px 5px -5px rgba(0,0,0,0.5);
  box-shadow:-5px 0 5px -3px rgba(0,0,0,0.5), inset 0 5px 5px -5px rgba(0,0,0,0.5);
  pointer-events:all;
  z-index:50;
}
.toolbar-fixed #site-actions .sideMenu{
  top:3.9em;
}
.sideMenu-visible #site-actions .sideMenu{
  width:45em;
  max-width:100%;
  transition:width ease-out 200ms, height ease-out 200ms, top ease-out 100ms;
}
.sideMenu > .menu,
.sideMenu > .additional{
  /*keep space for toggler overlayed on the right hand side */
  padding:1em 5em 1em 2em;
  width:100%;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
}
#site-actions .sideMenu > *:first-child{
  padding-top:1.6em;
}
.sideMenu > .additional::after{
  display:block;
  content:' ';
  height:1px;
  margin:2em 0 0 0;
  background:#E6E6E6;
}
.sideMenu > .additional > div{
  padding:0.8em 1.6em 0.7em 1.6em;
}
.sideMenu .menu a{
}

.sideMenu .menu-item-user a,
.sideMenu .menu-item-register a,
.sideMenu .menu-item-login a,
.sideMenu .menu-item-logout a{
  text-indent:0;
  padding:0.5em 1em 0.4em 1em;
  height:auto;
  width:auto;
  font-size:1.4em;
}
.sideMenu .menu-item-user a::before,
.sideMenu .menu-item-register a::before,
.sideMenu .menu-item-login a::before,
.sideMenu .menu-item-logout a::before{
  padding:0;
}
.sideMenu > .menu.additional a{
  font-size:1.2em;
  padding:0.666666667em 1.333333333em 0.583333333em 1.333333333em;
}
.sideMenu .menu > li > a:hover,
.sideMenu .menu a:active,
.sideMenu .menu .toggle-active > a{
}
.sideMenu .menu .menu-item--active-trail > a{
}
.sideMenu .menu li + li{
}
.sideMenu .menu .menu-item--expanded > a{
  position:relative;
}
.sideMenu .menu .menu-item--expanded > a::after{
  -moz-transform: rotate(90deg);
  -webkit-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
  -webkit-transition: all 500ms ease;
  -moz-transition: all 500ms ease;
  -ms-transition: all 500ms ease;
  -o-transition: all 500ms ease;
  transition: all 500ms ease;
}
.sideMenu .menu .menu-item--expanded.toggle-active > a::after{
  -moz-transform: rotate(270deg);
  -webkit-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  transform: rotate(270deg);
}
.sideMenu .sub-menu a{
}


/**
 * Breadcrumbs navigation
 */
.site-breadcrumbs{
  position:relative;
  margin-bottom:2em;
  z-index:10;
}
.site-breadcrumbs > .inner{
  padding:0;
  overflow:hidden;
  display:block;
}
.site-breadcrumbs > .inner::after{
  display:block;
  height:0;
  content:' ';
  clear:both;
}
.site-breadcrumbs li{
  float:left;
  display:block;
}
.site-breadcrumbs li::after {
  display:inline-block;
  position:relative;
  top:-1px;
  font-size:0.65em;
  content:'\f054';
  font-family:'ForkAwesome';
}
.site-breadcrumbs li.last::after{
  display:none;
}
.site-breadcrumbs li > *{
  display:inline-block;
  padding:0.7em 0.5em 0.6em 0.6em;
  font-size:1.4em;
}
.site-breadcrumbs a:hover,
.site-breadcrumbs a:focus{
  outline:0;
}
.site-breadcrumbs a:active{
  color:#000000;
}
.site-breadcrumbs li > meta{
  display:none;
}
.site-breadcrumbs li.last > *{
  color:#113300;
}
.site-breadcrumbs li.last > *::after{
  border-left-color:transparent;
}

/**
 * holy grail content layout
 *
 * https://en.wikipedia.org/wiki/Holy_grail_(web_design)
 * https://w3bits.com/flexbox-holy-grail-layout/
 * https://www.developerdrive.com/holy-grail-layout-flexbox/
 *
 * currently only for one sidebar
 */

/* mains .inner is a flex-container */
main > .inner{
  display:-webkit-box;
  display:-ms-flexbox;
  display:flex;
  -webkit-box-orient:horizontal;
  -webkit-box-direction:normal;
  -ms-flex-flow:row wrap;
  flex-flow:row wrap;
  -webkit-box-pack:justify;
  -ms-flex-pack:justify;
  justify-content:space-between;
}
main > .inner > *{
  -webkit-box-flex:1;
  -ms-flex:1 100%;
  flex:1 100%;
  max-width:100%;
}

/**
 * Sidebars specifica
 */

main aside{
  line-height:1.111111111;
}
main aside .block:first-child:not(.search-block-form){
  padding-top:1em;
}
main aside .block + .block{
  margin-top:8em;
}
main aside .block > .inner{
}
main aside .title{
  font-weight:600;
  text-transform:uppercase;
  border-bottom:1px solid #E6E6E6;
  padding:0 0 0.714285714em 0;
  margin:0 0 0.714285714em 0;
}
/* .main aside .menu */
main aside .menu{
  list-style:none;
  padding:0;
  margin:0;
}
main aside .menu .title{
  margin-bottom:0;
}
main aside .menu ul{
  background:none;
  border:none;
  -webkit-box-shadow:none;
  box-shadow:none;
}
main aside .menu li{
  border-bottom:1px solid #E6E6E6;
}
main aside .menu ul li:last-child{
  border:none;
}
main aside .menu a{
  display:block;
  padding:0.714285714em 0;
  font-weight:normal;
  color:#000000;
  border-width:0 4px 0 0;
}
main aside .menu a:hover,
main aside .menu a:active,
main aside .menu li:hover > a{
  background:none;
  color:#454545;
  text-decoration:none;
}
main aside .menu li:hover > a{
  background:none;
}
main aside .menu a:hover,
main aside .menu a:active{
  filter:brightness(200%);
}
main aside .menu a:hover,
main aside .menu a:active{
  filter:brightness(200%);
}
main aside .menu .menu-item--active > a,
main aside .menu .menu-item--active-trail > a,
main aside .menu a.is-active-trail,
main aside .menu a.is-active{
  color:#727373;
}
main aside .menu .menu-item--active-trail > a:not(:hover):not(:active),
main aside .menu .menu-item--active > a:not(:hover):not(:active),
main aside .menu a.is-active-trail:not(:hover):not(:active),
main aside .menu a.is-active:not(:hover):not(:active){
  background:none;
}
main aside .menu .menu-item--active > a,
main aside .menu a.is-active{
  border-bottom:2px solid #727373;
}
main aside .menu .menu-item--active > a,
main aside .menu a.is-active{
  filter:none;
}
main aside .menu .menu-item--active-trail > a,
main aside .menu a.is-active-trail{
  font-weight:600;
}
main aside .menu .menu-item--expanded:hover > a::before{
  -webkit-transform:rotate(90deg);
  -ms-transform:rotate(90deg);
  transform:rotate(90deg);
}
/* sub menu styles */
main aside .menu ul{
  padding:0;
  margin:0;
  display:none;
  font-size:0.8em;
  border-top:1px solid #E6E6E6;
}
main aside .menu-item--active-trail > ul,
main aside .menu-item--active > ul,
main aside a.is-active-trail + ul,
main aside a.is-active + ul{
  display:block;
}
main aside .menu ul a{
  padding-left:1.428571429em;
}
main aside .menu ul ul{
  font-size:0.9em;
}
main aside .menu ul ul a{
  padding-left:2.857142857em;
}
main aside .menu .menu-item--active-trail > a,
main aside .menu a.is-active-trail{
}
main aside .menu ul .menu-item--active > a,
main aside .menu ul a.is-active{
}

/* sub menu styles */
main aside .menu ul{
  font-size:0.9em;
  border-top:1px solid #E6E6E6;
}
main aside .menu ul a{
  padding-left:1.428571429em;
}
main aside .menu ul ul a{
  padding-left:2.857142857em;
}
main aside .menu .menu-item--active-trail > a,
main aside .menu a.is-active-trail{
}
main aside .menu ul .menu-item--active > a,
main aside .menu ul a.is-active{
}

/**
 * Content Region
 */
.region-content article + article{
  border-top:1px solid #383734;
  padding-top:4em;
  margin-top:4em;
}
/*
.region-content article::after{
  display:block;
  width:80%;
  height:1px;
  margin:4em 0;
  content:' ';
  background:#E6E6E6;
}
*/

/**
 * Footer
 */
.site-footer{
  background:#F5F6F7;
  padding:
}
.site-footer .region{
  padding:2em 0;
}
.region-footer-menu .menu{
}
.region-footer-menu .menu ul ul{
  display:none;
}
.region-footer-menu .menu,
.region-footer-menu .sub-menu{
  margin:0;
}
.region-footer-menu .menu > li{
  display:block;
  text-align:center;
}
.region-footer-menu .menu li,
.region-footer-menu .sub-menu li{
  position:relative;
}
.region-footer-menu .menu a,
.region-footer-menu .sub-menu a{
  text-transform:none;
  font-size:1.2em;
  line-height:1.583333333;
  padding:0.666666667em 1em;
  background:#E6E7E8;
}
/* reset general region rules for user menu */
.region-footer-menu .menu-item-user a,
.region-footer-menu .menu-item-register a,
.region-footer-menu .menu-item-login a,
.region-footer-menu .menu-item-logout a{
  text-indent:-9999em;
  padding:0;
  height:3.5em;
  width:3.5em;
  font-size:1em;
}
.region-footer-menu .menu-item-user a::before,
.region-footer-menu .menu-item-register a::before,
.region-footer-menu .menu-item-login a::before,
.region-footer-menu .menu-item-logout a::before{
  height: 1.357142857em;
  line-height: 1.357142857em;
  padding:0.571428571em;
  margin:0;
  width: 1.357142857em;
  text-align: center;
  text-indent: 0;
  font-size: 1.4em;
}
.region-footer-menu .menu a:hover,
.region-footer-menu .menu a:active{
  background:#C8C9C9;
}
.region-footer-menu .menu li + li a{
}

/**
 * Help Region
 */
.region-help{
  position:fixed;
  top:0;
  left:0;
  height:100%;
  width:100%;
  z-index:150;
  pointer-events:none;
}
.messages-list{
  margin-bottom:2em;
}
.region-help .messages-list{
  pointer-events:all;
  position:absolute;
  left:0;
  top:36vh;
  margin:0;
}
.messages-list .messages{
  position:relative;
  padding-left:3em;
  font-size:1.4em;
  border:1px solid #F5F6F7;
  -webkit-border-radius:2px;
  border-radius:2px;
}
.region-help .messages-list .messages{
  -webkit-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
  -webkit-box-shadow: 0 2px 4px -1px rgba(0,0,0,0.25);
  box-shadow: 0 2px 4px -1px rgba(0,0,0,0.25);
}
.messages-list .messages--status{
  border-color:#77B259;
  color:#325E1C;
  background:#F3FAEF;
}
.messages-list .messages--warning{
  border-color:#E09600;
  color:#734C00;
  background:#FDF8ED;
}
.messages-list .messages--error{
  border-color:#E62600;
  color:#A51B00;
  background:#FCF4F2;
}
.messages-list .messages .title{
  text-indent:-9999em;
  position:absolute;
  left:0;
  top:0;
  width:3.2em;
  height:100%;
  margin:0;
  font-size:1em;
  overflow:hidden;
}
.region-help .messages-list .messages .title{
  -webkit-border-radius: 0 2px 2px 0;
  border-radius: 0 2px 2px 0;
}
.messages-list .messages .title::before{
  display:block;
  position:absolute;
  left:0;
  top:0;
  height:100%;
  width:100%;
  padding:1.083333333em 0;
  text-align:center;
  text-indent:0;
  font-family:'ForkAwesome';
  text-rendering:auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  color:#FFFFFF;
}
.messages-list .messages--status .title::before{
  content:'\f00c';
  background:#77B259;
}
.messages-list .messages--warning .title::before{
  content:'\f071';
  background:#E09600;

}
.messages-list .messages--error .title::before{
  content:'\f057';
  background:#FCF4F2;
}
.messages-list .messages .title + *{
  padding:1.071428571em 1.285714286em;
}
.region-help .messages-list .messages .title + *{
  margin-left:-50vw;
  max-width:50vw;
  transition:margin ease 350ms;
  -webkit-animation:hide-messages 350ms ease-in-out 4000ms forwards;
  -moz-animation:hide-messages 350ms ease-in-out 4000ms forwards;
  -o-animation:hide-messages 350ms ease-in-out 4000ms forwards;
  animation:hide-messages 350ms ease-in-out 4000ms backwards;
}
.messages-list:hover .messages .title + *{
  margin-left:0;
}
.messages-list .messages p,
.messages-list .messages ul,
.messages-list .messages li{
  margin-bottom:0;
}


/**
 * Media query:min-width:360px
 */
@media screen and (min-width:360px){
  .youtube-preview{
    margin-bottom:40%;
  }
}

/**
 * Media query:min-width:420px
 */
@media screen and (min-width:420px){
  .youtube-preview{
    margin-bottom:25%;
  }
}
/**
 * Media query:min-width:480px
 */
@media screen and (min-width:480px){
  .youtube-preview{
    margin-bottom:20%;
  }
  .site-branding > .inner{
    min-width:320px;
  }
  .site-menu .menu{
    display:-webkit-box;
    display:-moz-box;
    display:-ms-flexbox;
    display:-webkit-flex;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -ms-flex-flow:row wrap;
    flex-flow:row wrap;
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    justify-content:flex-end;
  }
  .sideMenu > .menu,
  .sideMenu > .additional{
    /*keep space for toggler overlayed on the right hand side */
    padding-right:6em;
    padding-left:3em;
    min-width:34em;
  }
}

/**
 * Media query:min-width:550px
 */
@media screen and (min-width:550px){
  .youtube-preview{
    margin-bottom:3em;
  }
  .youtube-preview > figcaption{
    top:auto;
    bottom:0;

  }
}

/**
 * Media query:min-width:768px
 *
 * breakpoint where the single column mobile layout splits into more columns
 */
@media all and ( min-width:768px ) {
  table .views-field-title{
    min-width:50%;
  }
  .site-menu .block-search .form-text,
  .site-menu .block-search .form-submit,
  .site-menu .block-search .form-item,
  .site-menu .block-search .form-actions{
    display:inline-block;
    width:auto;
    float:none;
    margin:0;
  }
  .site-menu .block-search .form-text,
  .site-menu .block-search .form-submit{
    font-size:1.3em;
    line-height:1.923076923em;
  }
  main > .inner > aside{
    -ms-flex-preferred-size:45%;
    flex-basis:45%;
    max-width:50%;
  }
}

/**
 * Media query:min-width:987px
 *
 * Displays small desktop pages and Tablet landscape (w: 1024px) viewports
 */
@media screen and (min-width:987px){
  .blackout{
    display:none;
  }
  #site-actions .sideMenu,
  .site-menu .sideMenu{
    display:none;
  }
  .searchform-enabled .search-form > .inner{
    width:59em;
  }
  table .views-field-title{
    min-width:40%;
  }
  .site-header{
    position:static;
    top:auto;
    left:auto;
    right:auto;
  }
  /* site headers .inner is a flex-container */
  .site-header > .inner{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -ms-flex-flow:row wrap;
    flex-flow:row wrap;
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
  }
  /* all regions inside .site-header */
  .site-header .region{
    -webkit-box-flex:1;
    -ms-flex:1 45%;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
  }
  .site-header .region > * + *,
  .site-header .block > .inner > * + *{
    margin-left:1em;
  }
  .scrolled .site-branding ~ *{
    display:block;
  }
  .site-header .region-header{
    -webkit-box-pack:justify;
    -ms-flex-pack:justify;
    justify-content:space-between;
  }
  .site-header .region-secondary-menu{
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    justify-content:flex-end;
  }
  .region-secondary-menu .block,
  .region-footer-menu .block{
    padding:0 0.5em;
  }
  .region-secondary-menu .block:first-child,
  .region-footer-menu .block:first-child{
    padding-left:0;
  }
  .region-secondary-menu .block:last-child,
  .region-footer-menu .block:last-child{
    padding-right:0;
  }
  .region-secondary-menu .search-block-form,
  .region-footer-menu .search-block-form{
  }
  .region-secondary-menu .block + .block,
  .region-footer-menu .block + .block{
    margin-left:0.5em;
  }
  .region-secondary-menu .block-menu,
  .region-footer-menu .block-menu{
	  flex:none;
  }
  .region-secondary-menu .menu,
  .region-footer-menu .menu{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
  }
  .site-header .region-secondary-menu .menu{
    -webkit-box-pack:end;
    -ms-flex-pack:end;
    justify-content:flex-end;
  }
  .region-secondary-menu .menu > li,
  .region-footer-menu .menu > li{
    white-space:nowrap;
  }
  .region-footer-menu .menu > li{
    margin:1px;
  }
  .region-secondary-menu .menu > li + li,
  .region-footer-menu .menu > li + li{
    /* border-left:1px solid #E6E6E6; */
  }
  .region-secondary-menu .menu a,
  .region-secondary-menu .sub-menu a,
  .region-footer-menu .menu a,
  .region-footer-menu .sub-menu a{
  }
  .region-secondary-menu .menu li + li a,
  .region-footer-menu .menu li + li a{
  }
  .region-secondary-menu .block-block-content  > .inner,
  .region-footer-menu .block-block-content  > .inner{
    font-size:1.4em;
  }
  .region-secondary-menu .block:last-child{
    text-align:right;
  }
  .toolbar-fixed .site-header + :not(.site-menu),
  .toolbar-fixed .site-menu + *,
  .site-header + :not(.site-menu),
  .site-menu + *{
    padding-top:0;
  }
  .site-menu{
    padding:0;
    margin-bottom:0;
    -webkit-box-shadow:0 5px 5px -3px rgba(0,0,0,0.2);
    box-shadow:0 5px 5px -3px rgba(0,0,0,0.2);
    position:relative;
    max-width:100%;
    background:#E6E7E8;
    -webkit-box-shadow:0 2px 4px -1px rgba(0,0,0,0.25);
    box-shadow:0 2px 4px -1px rgba(0,0,0,0.25);
    /* use a border instead of shadow:
    border-bottom:1px solid #E9EAED;
    */
    /* use another shadow instead of border:
    -webkit-box-shadow:0 5px 5px -3px rgba(0,0,0,0.2);
    box-shadow:0 5px 5px -3px rgba(0,0,0,0.2);
    */
    z-index:20;
  }
  body > .site-menu > .inner{
  }
  .site-menu nav{
    display:block;
  }
  .site-menu .menu > li:first-child,
  .site-menu .menu > li:last-child{
  }
  .site-menu .menu ul{
    position:absolute;
    left:-9999em;
    padding:0;
    z-index:60;
    min-width:200px;
  }
  /* relative container for absolute positioning of .sub-menu elements */
  .site-menu .menu li{
    position:relative;
  }
  /* automatic left positioning for absolute positioned .sub-menu elments */
  .site-menu .menu li:hover > ul{
    left:auto;
  }
  .site-menu .menu > li:last-child{
  }
  .site-menu .sub-menu ul{
    top:0;
  }
  .site-menu .sub-menu li:hover > ul{
    margin-left:100%;
  }
  .site-menu ul.sub-menu a{
    white-space:normal;
    min-width:8em;
  }
  main > .inner > *{
    order:2;
  }
  main > .inner > .sidebar-first{
    order:1;
  }
  .has-one-sidebar main > .inner > .page-content{
    -ms-flex-preferred-size:calc(100% - 220px);
    flex-basis:calc(100% - 220px);
    max-width:calc(100% - 220px);
  }
  .has-two-sidebars main > .inner > .page-content{
    -ms-flex-preferred-size:calc(100% - 440px);
    flex-basis:calc(100% - 440px);
    max-width:calc(100% - 440px);
  }
  main > .inner > aside{
    -ms-flex-preferred-size:200px;
    flex-basis:200px;
    max-width:200px;
  }
}

/**
 * Media query:min-width:1200
 *
 * Displays medium desktop pages (eg resolution: 1280x1024)
 */
@media screen and (min-width:1200px){
  .has-one-sidebar main > .inner > .page-content{
    -ms-flex-preferred-size:calc(100% - 280px);
    flex-basis:calc(100% - 280px);
    max-width:calc(100% - 280px);
  }
  .has-two-sidebars main > .inner > .page-content{
    -ms-flex-preferred-size:calc(100% - 560px);
    flex-basis:calc(100% - 560px);
    max-width:calc(100% - 560px);
  }
  main > .inner > aside{
    -ms-flex-preferred-size:230px;
    flex-basis:230px;
    max-width:230px;
  }

}