.text--large{font-size:24px;font-size:1.4117647059rem;line-height:1.5}.text--large{font-size:24px;line-height:34px}.text--medium{font-size:16px;line-height:29px}.text--tiny{font-size:13px;line-height:25px}.text--small{font-size:14px;line-height:26px}.text--initial{text-transform:initial}.heading-0{font-size:55px;line-height:64px;font-family:"RocGroteskBold",sans-serif;color:#000;font-weight:600;letter-spacing:-0.02rem;margin-bottom:20px}@media screen and (min-width: 1024px){.heading-0{font-size:120px;line-height:140px}}.heading-1-alt{font-size:55px;line-height:64px;font-family:"Roboto",sans-serif;color:#000;font-weight:500;letter-spacing:-0.03rem;margin-bottom:20px}@media screen and (min-width: 1024px){.heading-1-alt{font-size:90px;line-height:100px}}.heading-2-alt{font-size:48px;line-height:58px;font-family:"RocGroteskBold",sans-serif;color:#000;font-weight:600;letter-spacing:-0.03rem;margin-bottom:20px}.heading-1,.heading-2,.heading-3,.heading-4,.heading-5,.heading-6{display:block}.mod_breadcrumb ol{list-style:none;margin:0;padding:0;display:-webkit-box;display:-ms-flexbox;display:flex;gap:10px}.mod_breadcrumb li{margin:0;padding:0;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mod_breadcrumb li:before{content:"»";margin-right:10px;color:#9e9e9e}.mod_breadcrumb li:first-child:before{display:none}.mod_breadcrumb li a{text-decoration:underline;color:#252424}
.text--large{font-size:24px;font-size:1.4117647059rem;line-height:1.5}.text--large{font-size:24px;line-height:34px}.text--medium{font-size:16px;line-height:29px}.text--tiny{font-size:13px;line-height:25px}.text--small{font-size:14px;line-height:26px}.text--initial{text-transform:initial}.heading-0{font-size:55px;line-height:64px;font-family:"RocGroteskBold",sans-serif;color:#000;font-weight:600;letter-spacing:-0.02rem;margin-bottom:20px}@media screen and (min-width: 1024px){.heading-0{font-size:120px;line-height:140px}}.heading-1-alt{font-size:55px;line-height:64px;font-family:"Roboto",sans-serif;color:#000;font-weight:500;letter-spacing:-0.03rem;margin-bottom:20px}@media screen and (min-width: 1024px){.heading-1-alt{font-size:90px;line-height:100px}}.heading-2-alt{font-size:48px;line-height:58px;font-family:"RocGroteskBold",sans-serif;color:#000;font-weight:600;letter-spacing:-0.03rem;margin-bottom:20px}.heading-1,.heading-2,.heading-3,.heading-4,.heading-5,.heading-6{display:block}.section{position:relative;z-index:1;padding:60px 0}@media screen and (min-width: 721px){.section{padding:150px 0}}.section--bottom-none{padding-bottom:0}.section--top-none{padding-top:0}.section--bottom-small{padding-bottom:65px}.section--top-small{padding-top:65px}.section--bottom-double{padding-bottom:105px}@media screen and (min-width: 1024px){.section--bottom-double{padding-bottom:210px}}.section--top-double{padding-top:105px}@media screen and (min-width: 1024px){.section--top-double{padding-top:210px}}.section--gradient1{background:linear-gradient(45deg, rgb(0, 181, 226) 0%, rgb(0, 181, 226) 20%, rgb(191, 223, 38) 80%, rgb(191, 223, 38) 100%)}.section--gradient1 h1,.section--gradient1 h2,.section--gradient1 h3,.section--gradient1 h4,.section--gradient1 h5,.section--gradient1 h6,.section--gradient1 p{color:#fff}.section--grey7{background:#f1f3f2}.section--grey7 .heading-2-alt{color:#252424}.section--map{background-position:center;background-size:contain}@media screen and (min-width: 1024px){.section--map{background-size:1170px auto}}.section--extend-top,.section--extend-bottom{z-index:0}.section--extend-top{margin-top:-150px;padding-top:210px}@media screen and (min-width: 721px){.section--extend-top{padding-top:300px}}.section--extend-top.secion--top-none{padding-top:90px}@media screen and (min-width: 721px){.section--extend-top.secion--top-none{padding-top:150px}}.section--extend-top.secion--top-small{padding-top:155px}@media screen and (min-width: 721px){.section--extend-top.secion--top-small{padding-top:215px}}.section--extend-top.secion--top-double{padding-top:300px}@media screen and (min-width: 721px){.section--extend-top.secion--top-double{padding-top:360px}}.section--extend-bottom{margin-bottom:-150px;padding-bottom:210px}@media screen and (min-width: 721px){.section--extend-bottom{padding-bottom:300px}}.section--extend-bottom.secion--bottom-none{padding-bottom:90px}@media screen and (min-width: 721px){.section--extend-bottom.secion--bottom-none{padding-bottom:150px}}.section--extend-bottom.secion--bottom-small{padding-bottom:155px}@media screen and (min-width: 721px){.section--extend-bottom.secion--bottom-small{padding-bottom:215px}}.section--extend-bottom.secion--bottom-double{padding-bottom:300px}@media screen and (min-width: 721px){.section--extend-bottom.secion--bottom-double{padding-bottom:360px}}.section__image{max-width:500px;margin-left:auto}@media screen and (min-width: 1024px){.section__image{position:absolute;right:0;width:50%;max-width:none}.section__image--top{top:0}.section__image--center{top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}.section__image--bottom{bottom:0}}.section__image .content-image{margin:0}.section__image .content-image img{display:block;margin-left:auto}
@charset "UTF-8";
/**
* basicss overrides
*
* any defaults in basicss/basicss/_settings.scss
* may be overridden...
*
* e.g. $prototyping: true;
*/
/**
* basicss.scss
*
* Author: Marian Friedmann
*
*/
/* ====================================================
Reset, Defaults, Mixins
==================================================== */
/**
* Reset, Default settings
*/
/**
* _settings.scss
*
* Author: Marian Friedmann
*/
/**
* Variables Mode
*/
/**
* Default colors
*/
/**
* Default objects
*/
/**
* Default helper
*/
/**
* Default fonts
*/
/**
* Default font size
*/
/**
* Default headings
*/
/**
* Default spacing
*/
/**
* Default breakpoints
*/
/**
* Default spaces
*/
/**
* Default constrains
*/
/**
* Arrows
*/
/**
* Global Variables
*/
/**
* Mixins
*/
/**
* _media.scss
*
* Author: Marius Scheel
*
* Usage:
* @include media(300px);
* or @include media(300px, false);
* or @include media(max-width 300px);
* or @include media(100px max-width 300px);
* or @include media(max-width 100px max-width 300px);
* or @include media(max-width 100px max-width 300px, true);
*
*/
/**
* _hdpi.scss
*
* Author: Marius Scheel
*
* defaults to 1.3 to include Google Nexus 7
* adapted from bourbon:
* https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/css3/_hidpi-media-query.scss
*
* Usage:
* @include hdpi {
* // your css for hdpi displays
* };
*
* you can use a custom ratio, if you like:
* @include hdpi(1.5) {
* // your css
* };
*/
/**
* _retina-image.scss
*
* Author: Marius Scheel
*
* Usage:
* .hero {
* @include retina-image("../path/to/hero", 200px 400px);
* }
*
* to use a specific filename:
* .hero {
* @include retina-image("../path/to/hero", 200px 400px, "../path/to/retina-hero");
* }
*
* modified version of bourbon's retina-image mixin.
* The mixin uses a @2x.png retina filename by default.
* https://github.com/thoughtbot/bourbon/blob/master/app/assets/stylesheets/addons/_retina-image.scss
*/
/**
* _font-size.scss
*
* Author: Marian Friedmann
*
*/
/**
* _px-to-rem.scss
*
* Author: Marian Friedmann
*
* Usage:
* .element {
* @include px-to-rem(padding, 0 24px)
* }
*
* Output:
* .element {
* padding: 0 24px;
* padding: 0 1.5rem;
* }
*
*/
/**
* _clearfix.scss
*
* Author: Marian Friedmann
*
* Usage:
* .element {
* @include clearfix;
* }
*
*/
/**
* _ellipsis.scss
*
* Author: Marian Friedmann
*
* ellipsis mixin
*
*/
/* ====================================================
Base Styles
==================================================== */
/**
* _main.scss
*
* Author: Marian Friedmann
*
*/
/**
* _baseline.scss
*
* Author: Marian Friedmann
*
*/
/**
* _typo.scss
*
* Author: Marian Friedmann
*
*/
.guides__title {
font-size: 20px;
font-size: 1.1764705882rem;
line-height: 1.1;
font-family: RocGroteskBold, sans-serif;
color: #000000;
font-weight: 700;
letter-spacing: -0.02rem;
}
/**
* _links.scss
*
* Author: Marian Friedmann
*
*/
/**
* media-src.scss
*
* Author: Marian Friedmann
*
*/
/* ====================================================
Objects
==================================================== */
/**
* _grid.scss
*
* Author: Marian Friedmann
*
* Usage:
*
*
* the example above combines the grid items with the widths from helper/_width.scss
*/
/**
* Reverse the order of grid items
*/
/**
* adds a seperator line to the grid
*/
/**
* Grid items without gutters
*/
/**
* Grid size variations
*/
/**
* _btn.scss
*
* Author: Marian Friedmann
*
* Usage:
* btn
* btn
*/
/* Button disguised as a link. */
/**
* _constrain.scss
*
* Author: Marius Scheel
*
*/
/**
* _nav.scss
*
* Author: Marian Friedmann
*
* source: Nav abstraction from csswizardry.com/2011/09/the-nav-abstraction
*
* Can be used on an `ol` or `ul` and displays the list items horizontally.
* Extend it with the following subclasses:
*
* - nav--stacked // displays the list items vertically
* - nav--banner // centres the list
* - nav--block // expands list items clickable areas
* - nav--fit // forces the list to occupy the full width of its parent
* - nav--keywords // display as a list of keywords
* - nav--breadcrumb // display as breadcrumbs
* - nav--parallel // display nav items with parallel separator
*
* Markup:
*
*
*/
/**
* 'nav-stacked' displays the list items vertically
*/
/**
* 'nav-banner' centres the list
*/
/**
* 'nav--block' expands list items clickable areas with padding
*/
/**
* 'nav--fit' forces the list to occupy the full width of its parent
*/
/**
* 'nav--keywords' display as a list of keywords
*/
/**
* 'nav--breadcrumbs' display as breadcrumbs
*/
/**
* 'nav--parallel' display with parallel separator
*/
/**
* _box.scss
*
* modified version of:
* https://github.com/inuitcss/objects.box/blob/master/_objects.box.scss
*
*/
/**
* _media.scss
*
* displays image and text side by side
*
* Example markup:
*
*
* use the `.media--rev` modifier to reverse the the image location and put it to the right
* use the `.media--small` modifier, to decrease the gutter width between image and content
*
* for more information have a look at:
* stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code
*
*/
/**
* _bare-list.scss
*
*/
/**
* _ui-list.scss
*
* based on Harry Roberts ui-list object:
* https://github.com/inuitcss/objects.ui-list/blob/master/_objects.ui-list.scss
*
* creates blocky items, can be used with lists or the corresponding markup:
*
*
*
* or:
*
*
*
* can optionally be used with --separator and --border, where --separator
* adds borders to the list element and --border to the list itself
*
* comes with different size modifiers
*
*/
/**
* Modifiers for sizing the list
*/
/**
* _arrow.scss
*
* Author: Marian Friedmann
*
* Usage:
*
* ...
*
*
*/
/**
* Arrow Top
*/
/**
* Arrow Bottom
*/
/**
* Arrow Left
*/
/**
* Arrow Right
*/
/**
* _icon.scss
*
* Author: Marian Friedmann
*
* Usage:
*
* ...
*
*
*/
/**
* Basic & spacing
*/
/**
* _width.scss
*
* Author: Marian Friedmann
*
* Usage:
*
*
*/
/**
* _typo.scss
*
* Author: Marian Friedmann
*
* Alt Text Styles.
*
* ## alignment
* - text--left
* - text--right
* - text--center
*
* ## utilities
* - text--secondary
* - text--inherit-color
* - text--no-wrap
* - text--large
*
* Usage:
*
*
Lorem Ipsum
*
Lorem ipsum
*