/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage base
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: base.init.css 907 2018-02-13 15:57:02Z mueller $
 **/

/*  =========================================================
general structure setup
general font setup
tools
buttons
mainWrapper
grid sections
sticky buttons
========================================================== */


/*  =========================================================
general structure setup
========================================================= */
@media screen {
  html {
    height: auto;
    background: #f2efeb;
    overflow-x: hidden;
  }
  html, body {
    margin: 0px; border: 0px; padding: 0px;
    width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box;
  }

  html.-state-noScroll,
  html.-state-noScroll > body{
    overflow-y: hidden;
  }

  a > img{ border: 0px none;}
  hr{ height: 1px; line-height: 1px; font-size: 1px; border: 0px; margin: 0px; padding: 0px; border-bottom: 1px solid;}
}

/*  =========================================================
general font setup
========================================================= */
@media screen {
  a{ cursor: pointer; color: inherit;}
  button{ cursor: pointer;}
}

/*  =========================================================
tools
========================================================= */
@media screen {
  .closing:after,
  .closer{
    content: '';
    clear: both; display: block;
    margin: 0px!important; padding: 0px!important;
    background: transparent!important;
  }

  .none, .hide{ display: none!important;}
  .noMargin{ margin: 0px !important;}
  .noPadding{ padding: 0px !important;}
  .noBorder{ border: 0px none transparent !important;}
}

/* old 'n crappy */
@media screen {
  div.fixfloat{ float: none; clear: both; width: 0px; height: 0px; margin: 0px; padding: 0px; font-size: 0px; line-height: 0px;}
}

/*  =========================================================
buttons
========================================================= */
@media screen {
  .-global-button{
    display: inline-block; border: none;
    padding: 10px 15px; -webkit-box-sizing: border-box; box-sizing: border-box;

    font-weight: 700; text-decoration: none; color: #fff;
  }

  .-global-button-info{
    display: inline-block; background: #4c5660; color: #fff;
    border-left: 1px #fff solid; padding: 10px 15px; margin: 0px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
  }
}

@media screen {
  .-global-button__cta{ background: #236db0;}
  .-global-button__cta.offerIsAdded{ background: #23af35;}
  .-global-button:not(.-global-button__cta){ background: #7d7c7a;}
}

@media screen and (min-width: 701px) {
  .-global-button__large,
  .-global-button__large + .-global-button-info{
    font: 700 normal 20px/30px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    height: 50px;
  }
  .-global-button:not(.-global-button__large),
  .-global-button:not(.-global-button__large) + .-global-button-info{
    font: 700 normal 16px/20px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    height: 40px;
  }
}
@media screen and (max-width: 700px) {
  .-global-button__large,
  .-global-button__large + .-global-button-info{
    font: 700 normal 18px/25px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    height: 45px;
  }
  .-global-button:not(.-global-button__large),
  .-global-button:not(.-global-button__large) + .-global-button-info{
    font: 700 normal 16px/20px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    height: 40px;
  }
}

/* icons in buttons */
@media screen {
  .-global-button > [class*='icon-']{ font-size: 18px;}
}

/*  =========================================================
mainWrapper
========================================================= */
@media screen {
  #mainWrapper{
    display: block; width: 100%;
    position: relative; overflow-x: hidden;
  }
}
/* spare some space for the pageHeader */
@media screen and (min-width: 701px) {
  #mainWrapper{ padding: 80px 0px 0px 0px;}
}
@media screen and (max-width: 700px) {
  #mainWrapper{ padding: 60px 0px 0px 0px;}
}
@media screen and (max-width: 400px){
  #mainWrapper{ padding: 100px 0px 0px 0px;}
}

/* general styling for section to overlap heroImage */
@media screen {
  #mainWrapper > section{
    position: relative; text-align: center;
  }
}

/*  =========================================================
grid sections
========================================================= */
@media screen {
  .gridSection{
    display: inline-block;
    width: 1272px; max-width: 92%/* 346/376 */;
    padding: 20px 0px;
  }
}

/* 3 part cols */
@media screen {
  .gridSection__col_1v3,
  .gridSection__col_2v3,
  .gridSection__col_3v3,
  .gridSection__col_1v4,
  .gridSection__col_2v4,
  .gridSection__col_3v4,
  .gridSection__col_4v4{
    display: inline-block; vertical-align: top;
  }
}

@media screen and (min-width: 801px) {
  .gridSection__col_1v3,
  .gridSection__col_2v3,
  .gridSection__col_3v3,
  .gridSection__col_1v4,
  .gridSection__col_2v4,
  .gridSection__col_3v4,
  .gridSection__col_4v4{
    padding: 0px 10px; -webkit-box-sizing: border-box; box-sizing: border-box;
  }
}

@media screen and (min-width: 1201px) {
  .gridSection__col_1v3{ width: 33.333% /* 424/1272 */;}
  .gridSection__col_2v3{ width: 66.666% /* 848/1272 */;}
  .gridSection__col_3v3{ width: 100%;}

  .gridSection__col_1v4{ width: 25%;}
  .gridSection__col_2v4{ width: 50%;}
  .gridSection__col_3v4{ width: 75%;}
  .gridSection__col_4v4{ width: 100%;}
}

@media screen and (max-width: 1200px) and (min-width: 801px) {
  .gridSection__col_1v3,
  .gridSection__col_2v3{ width: 50%;}
  .gridSection__col_3v3{ width: 100%;}

  .gridSection__col_1v4,
  .gridSection__col_2v4,
  .gridSection__col_3v4{ width: 50%;}
  .gridSection__col_4v4{ width: 100%;}
}

@media screen and (max-width: 800px) {
  .gridSection__col_1v3,
  .gridSection__col_2v3,
  .gridSection__col_3v3{ width: 100%;}

  .gridSection__col_1v4,
  .gridSection__col_2v4,
  .gridSection__col_3v4,
  .gridSection__col_4v4{ width: 100%;}
}

/*  =========================================================
sticky buttons
========================================================= */
@media screen {
  .stickyButtons{ left: 0px;}
  .stickyButtons--fixed{ -webkit-transition: top 0.25s ease; transition: top 0.25s ease;}

  .stickyButtons:not(.stickyButtons--fixed){ position: absolute;}
  .stickyButtons--fixed{ position: fixed;}

  .stickyButtons:not(.stickyButtons--hidden){
    top: 0px;
    z-index: 2;
  }
  .stickyButtons--hidden{ top: -100px;}
}
@media screen and (min-width: 701px) {
  #pageHeader:not(.-js-pageHeader--hidden) + #mainWrapper .stickyButtons--fixed:not(.stickyButtons--hidden){ top: 80px;}
}
@media screen and (max-width: 700px){
  #pageHeader:not(.-js-pageHeader--hidden) + #mainWrapper .stickyButtons--fixed:not(.stickyButtons--hidden){ top: 60px;}
}
@media screen and (max-width: 400px){
  #pageHeader:not(.-js-pageHeader--hidden) + #mainWrapper .stickyButtons--fixed:not(.stickyButtons--hidden){ top: 100px;}
}

@media screen {
  .stickyButtons__element{
    display: inline-block;
    cursor: pointer; background: #667481;
    text-align: center; text-decoration: none;
  }
}
@media screen and (min-width: 701px) {
  .stickyButtons__element{ width: 80px; height: 80px;}
}
@media screen and (max-width: 700px) {
  .stickyButtons__element{ width: 60px; height: 60px;}
}

@media screen {
  .stickyButtons__element > [class*='icon-']{ color: #fff; font-size: 35px;}
}
@media screen and (min-width: 701px) {
  .stickyButtons__element > [class*='icon-']{ line-height: 80px;}
}
@media screen and (max-width: 700px) {
  .stickyButtons__element > [class*='icon-']{ line-height: 60px;}
}

@media screen {
  .stickyButtons__element__counter{
    display: block; height: 15px; padding: 0px 4px;
    position: absolute;

    font: 700 normal 10px/15px 'Open Sans', Arial, sans-serif;
    color: #fff; background: #236db0;
    border: 1px #fff solid; -webkit-border-radius: 50%; border-radius: 50%;
  }
}
@media screen and (min-width: 701px) {
  .stickyButtons__element__counter{ right: 17px; bottom: 18px;}
}
@media screen and (max-width: 700px) {
  .stickyButtons__element__counter{ right: 7px; bottom: 8px;}
}


/*  =========================================================
map stylings
========================================================= */
@media screen{

  body.mapOpen > #mainWrapper > :not(.mapContent),
  body.mapOpen #pageHeader__functions > .openMap,
  body:not(.mapOpen) > #mainWrapper > .mapContent,
  body:not(.mapOpen) #pageHeader__functions > .closeMap,
  body:not(.mapOpen) #pageHeader__functions > .filterMap{
    display:none;
  }

  .openMap{
    cursor: pointer;
  }
}

/*  =========================================================
image copyright
========================================================= */
@media screen {
  .copyright{
    z-index: 1;
    bottom: 0px;
    position: absolute;
    color: #fff;
    padding: 0 0 2px 4px;
    font: 400 normal 13px/14px 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
  .copyright--hidden {
    bottom: 5px;
    right: 5px;
    font: 400 12px/1em 'Open Sans',Arial,sans-serif;
    color: #fff;
    text-shadow: 1px 1px 1px rgba(85,85,85,0);
    pointer-events: all;
    padding: 0;
  }
  .copyright--hidden > span{
    position: absolute; top: 0; left: 0;
    padding-left: 5px;

    font-size: 10px; white-space: nowrap;

    -webkit-transform: rotateZ(-90deg);

        -ms-transform: rotate(-90deg);

            transform: rotateZ(-90deg); -webkit-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0;

  }
  .copyright--hidden:not(:active):not(:focus):not(:hover) > span{
    display: none;
  }
  .copyright--hidden:active > span,
  .copyright--hidden:focus > span,
  .copyright--hidden:hover > span {
    display: block;
  }

}
/*  =========================================================
cookie
========================================================= */
@media screen {
  .cc_container .cc_btn,
  .cc_container .cc_btn:visited {
    background-color: #26547d !important;
    color: #f8f8f8 !important;
    -webkit-border-radius: 0px !important;
    border-radius: 0px !important;
  }
  .cc_container {
    color: #26547d !important;
    font: 400 normal 13px/14px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    border: none !important;
  }
  p.cc_message {
    text-align: left !important;
  }
  .cc_container a,
  .cc_container a:visited {
    color: #26547d !important;
  }
}

@font-face {
  font-family: 'icomoon';
  src:  url('../fonts/icomoon/icomoon.6f29a443.eot?j0aitg');
  src:  url('../fonts/icomoon/icomoon.6f29a443.eot?j0aitg#iefix') format('embedded-opentype'),
    url('../fonts/icomoon/icomoon.8c4a9005.woff2?j0aitg') format('woff2'),
    url('../fonts/icomoon/icomoon.60cf18b1.ttf?j0aitg') format('truetype'),
    url('../fonts/icomoon/icomoon.c4729acb.woff?j0aitg') format('woff'),
    url('../fonts/icomoon/icomoon.96ca67b6.svg?j0aitg#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"], [class*=" icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;

  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-instagram:before {
  content: "\e919";
}
.icon-burger:before {
  content: "\e900";
}
.icon-close:before {
  content: "\e901";
}
.icon-host:before {
  content: "\e902";
}
.icon-poi:before {
  content: "\e903";
}
.icon-magnifier:before {
  content: "\e904";
}
.icon-simpleArrow:before {
  content: "\e905";
}
.icon-doubleArrow:before {
  content: "\e906";
}
.icon-facebook:before {
  content: "\e907";
}
.icon-twitter:before {
  content: "\e908";
}
.icon-google:before {
  content: "\e909";
}
.icon-phone:before {
  content: "\e90a";
}
.icon-mail:before {
  content: "\e90b";
}
.icon-internet:before {
  content: "\e90c";
}
.icon-checkmark:before {
  content: "\e90d";
}
.icon-triangleDown:before {
  content: "\e90e";
}
.icon-calendar:before {
  content: "\e90f";
}
.icon-suitecase:before {
  content: "\e910";
}
.icon-externalLink:before {
  content: "\e911";
}
.icon-tipp:before {
  content: "\e912";
}
.icon-image:before {
  content: "\e913";
}
.icon-rss:before {
  content: "\e914";
}
.icon-panoramio:before {
  content: "\e915";
}
.icon-youtube:before {
  content: "\e916";
}
.icon-filter:before {
  content: "\e917";
}
.icon-triangleUp:before {
  content: "\e918";
}

/* perfect-scrollbar v0.6.16 */
.ps-container {
  -ms-touch-action: auto;
  touch-action: auto;
  overflow: hidden !important;
  -ms-overflow-style: none;
}
@supports (-ms-overflow-style: none) {
  .ps-container {
    overflow: auto !important;
  }
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .ps-container {
    overflow: auto !important;
  }
}
.ps-container.ps-active-x > .ps-scrollbar-x-rail,
.ps-container.ps-active-y > .ps-scrollbar-y-rail {
  display: block;
  background-color: transparent;
}
.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  background-color: #999;
  height: 11px;
}
.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  background-color: #999;
  width: 11px;
}
.ps-container > .ps-scrollbar-x-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  opacity: 0;
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  bottom: 0px;
  /* there must be 'bottom' for ps-scrollbar-x-rail */
  height: 15px;
}
.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  position: absolute;
  /* please don't change 'position' */
  background-color: #aaa;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -webkit-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  bottom: 2px;
  /* there must be 'bottom' for ps-scrollbar-x */
  height: 6px;
}
.ps-container > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x,
.ps-container > .ps-scrollbar-x-rail:active > .ps-scrollbar-x {
  height: 11px;
}
.ps-container > .ps-scrollbar-y-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  opacity: 0;
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  right: 0;
  /* there must be 'right' for ps-scrollbar-y-rail */
  width: 15px;
}
.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  position: absolute;
  /* please don't change 'position' */
  background-color: #aaa;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -webkit-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  right: 2px;
  /* there must be 'right' for ps-scrollbar-y */
  width: 6px;
}
.ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y,
.ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y {
  width: 11px;
}
.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  background-color: #999;
  height: 11px;
}
.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  background-color: #999;
  width: 11px;
}
.ps-container:hover > .ps-scrollbar-x-rail,
.ps-container:hover > .ps-scrollbar-y-rail {
  opacity: 0.6;
}
.ps-container:hover > .ps-scrollbar-x-rail:hover {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
  background-color: #999;
}
.ps-container:hover > .ps-scrollbar-y-rail:hover {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
  background-color: #999;
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage baseArticle
 * @author     gueldner
 * @since      10.11.2016
 * @version    $Id: baseArticle.init.css 895 2018-01-25 14:49:26Z mueller $
 **/

/*  =========================================================
general structure
tipp element
title
headlines
text
inline images
listings
buttons
tables
images
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .baseArticle{
    background: #fff; padding: 25px 0px;
    color: #4b4a49;
  }
  .baseArticle.baseArticle--background{
    background: #f2efeb;
  }
}

/* columns */
@media screen {
  .baseArticle__columns:not(:first-child){
    padding-top: 35px;
  }
}
@media screen and (min-width: 801px) {
  .baseArticle__columns{
    column-count: 2; column-gap: 100px;
    -moz-column-count: 2; -moz-column-gap: 100px;
    -webkit-column-count: 2; -webkit-column-gap: 100px;
  }
}

/*  =========================================================
tipp element
========================================================= */
@media screen {
  .baseArticle--tipp{
    position: relative;
  }

  .baseArticle--tipp:after{
    content: '';
    position: absolute; top: 0px; left: 50%; margin-left: -25px;
    display: block; width: 50px; height: 55px;
    background: url('../images/icon-tipp.d4e41cb8.svg') 0px 0px no-repeat; background-size: contain;
  }

  .baseArticle--tipp .gridSection{
    padding-top: 50px;
  }
}

/*  =========================================================
title
========================================================= */
@media screen{
  .baseArticle h1,
  .baseArticle h2{
    font-weight: 300; margin: 0px 0px 20px 0px;
    clear: both;
  }

  .baseArticle h2#eventDates{
    margin-top: 60px;
  }

  .baseArticle h1 > .subline,
  .baseArticle h2 > .subline{
    font-weight: 400;
    margin-top: 10px; display: block;
  }
}

@media screen and (min-width: 801px) {
  .baseArticle h1,
  .baseArticle h2{
    font: 300 normal 40px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }

  .baseArticle h1 > .subline,
  .baseArticle h2 > .subline{
    font: 400 normal 25px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 800px) {
  .baseArticle h1,
  .baseArticle h2{
    font: 300 normal 30px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }

  .baseArticle h1 > .subline,
  .baseArticle h2 > .subline{
    font: 400 normal 20px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
}

/*  =========================================================
headlines
========================================================= */
@media screen {
  .baseArticle h3{
    font: 300 normal 25px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
    margin: 30px 0px 10px 0px; text-align: left;
    clear: both;
  }
  .baseArticle h3:first-child{ margin-top: 0px;}
}

@media screen {
  .baseArticle h4{
    font: 400 normal 22px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
    margin: 20px 0px 10px 0px; text-align: left;
  }
  .baseArticle h4:first-child{ margin-top: 0px;}
}

/*  =========================================================
text
========================================================= */
@media screen {
  .baseArticle p:not(.description){ text-align: left;}
  .baseArticle p.description{ text-align: center;}

  .baseArticle p > a{ text-decoration: underline;}
  .baseArticle p > a[target='_blank']{
    position: relative;
    padding-left: 20px; margin-left: 5px;
  }
  .baseArticle p > a[target='_blank']:before{
    content: '\e911';
    font-family: 'icomoon'; text-decoration: none;
    position: absolute; top: 0px; left: 0px;
  }
}

@media screen {
  .baseArticle p{ margin: 0px 0px 15px 0px;}
  .baseArticle p:last-child{ margin: 0px;}
}

@media screen and (min-width: 801px) {
  .baseArticle table,
  .baseArticle p{
    font: 400 normal 18px/26px 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 800px) {
  .baseArticle table,
  .baseArticle p{
    font: 400 normal 16px/26px 'Open Sans', Arial, sans-serif;
  }
}

/*  =========================================================
inline images
========================================================= */
@media screen and (min-width: 801px) {
  .baseArticle img{ margin-bottom: 20px;}
  .baseArticle img.left{
    float: left; margin-right: 20px;
  }
  .baseArticle img.right{
    float: right; margin-left: 20px;
  }
}

@media screen and (max-width: 800px) {
  .baseArticle img{
    display: block; width: 100%; height: auto;
    margin-bottom: 20px;
  }
}

/*  =========================================================
listings
========================================================= */
@media screen {
  .baseArticle ul, .baseArticle ol{
    margin: 0px 0px 15px 0px; padding: 0px 0px 0px 25px;
    font: 400 normal 18px/22px 'Open Sans', Arial, sans-serif; text-align: left;
  }
  .baseArticle ul{
    list-style: square;
  }

  .baseArticle ol > li:not(:last-child),
  .baseArticle ul > li:not(:last-child){ margin-bottom: 15px;}
}

/*  =========================================================
buttons
========================================================= */
@media screen {
  .baseArticle .-global-button:not(:first-child){ margin-top: 50px;}
}


/*  =========================================================
tables
========================================================= */
@media screen{
  .baseArticle table {

    border-collapse: collapse;
    border-spacing: 0;
  }
  .baseArticle table th{
    background: #f2efeb;
  }
  .baseArticle table td,
  .baseArticle table th{
    border: 1px solid #ddd;
    text-align: left;
    padding: 8px;
  }
}


/*  =========================================================
images
========================================================= */
@media screen {
  .baseArticle .image.align-right{
    float: right;
    margin-left: 10px;
  }
  .baseArticle .image.align-left{
    float: left;
    margin-right: 10px;
  }
  .baseArticle .image.align-center{
    display: block;
    text-align: center;
  }
}


/*  =========================================================
youtube
========================================================= */
@media screen {
  .baseArticle iframe[data-youtubeid][align="left"]{
    margin-right: 10px;
  }
  .baseArticle iframe[data-youtubeid][align="right"]{
    margin-left: 10px;
  }
  .baseArticle iframe[data-youtubeid][align="middle"]{
    display: block;
    margin: 0 auto;
  }
}

/*  =========================================================
posting
========================================================= */
#postingSection .baseArticle p.center{
  text-align: center;
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage baseArticle
 * @author     gueldner
 * @since      10.11.2016
 * @version    $Id: baseArticle.event.css 615 2017-01-16 12:33:37Z mueller $
 **/

/*  =========================================================
events
========================================================== */

/*  =========================================================
 =1. events
========================================================= */
@media screen{
  #moreEventDates{
    display: none;
  }
  input[type=checkbox]#moreEventDates + div {
    overflow-y: hidden;
    max-height: 170px;
  }
  input[type=checkbox]#moreEventDates:checked + div {
    overflow-y: visible;
    max-height: 9999px;
    -webkit-transition: max-height 3s linear;
    transition: max-height 3s linear;
  }
  input[type=checkbox]#moreEventDates:checked ~ label.-global-button{
    display:none;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage baseArticle
 * @author     gueldner
 * @since      10.11.2016
 * @version    $Id: baseArticle.offer.css 796 2017-03-02 06:49:51Z mueller $
 **/

/*  =========================================================
offers
========================================================== */


/*  =========================================================
 =1. offers
========================================================= */
@media screen{
  .baseArticle #eventPriceDescription__title,
  .baseArticle #eventDates__title,
  .baseArticle #servicesInfo__title,
  .baseArticle #priceInfos__title,
  .baseArticle #availabilityInfos__title{
    text-align: left;
    padding-top: 25px;
    font: 400 normal 22px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
    margin: 20px 0px 10px 0px; text-align: left;
  }
  .baseArticle #eventPriceDescription__title:first-child,
  .baseArticle #eventDates__title:first-child,
  .baseArticle #servicesInfo__title:first-child,
  .baseArticle #priceInfos__title:first-child,
  .baseArticle #availabilityInfos__title:first-child{
    margin-top: 0px;
  }
}

/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage baseList
 * @author     gueldner
 * @since      21.11.2016
 * @version    $Id: 200-baseList.element.css 824 2017-03-28 11:37:18Z mueller $
 **/

/*  =========================================================
general structure
image
text
tipp
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .baseList__element{
    text-align: left;
  }

  .baseList__element:not(:last-child){
    margin-bottom: 50px;
  }
}

/*  =========================================================
image
========================================================= */
@media screen {
  .baseList__element__image{
    position: relative; overflow: hidden;
    height: 0px; padding-bottom: 58.441% /* 360/616 */;
  }

  .baseList__element__image > img{
    position: absolute; top: 0px; left: 0px;
    display: block; width: 100%; height: auto;
  }
}

@media screen and (max-width: 800px) {
  .baseList__element__image{ margin-bottom: 20px;}
}

/* image info */
@media screen {
  .baseList__element__image__info{
    position: absolute; top: 24px; right: 0px;
    background: #fff; padding: 5px 10px;

    font: 400 normal 20px/28px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    font-weight: 400; color: #4b4a49;
  }
}

/*  =========================================================
text
========================================================= */
@media screen {
  .baseList__element__text > h3{
    margin: 0px; padding: 0px;
    word-wrap: break-word;
    hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto;
  }
}
@media screen and (min-width: 801px) {
  .baseList__element__text > h3{ font: 300 normal 30px/42px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
}
@media screen and (max-width: 800px) {
  .baseList__element__text > h3{ font: 400 normal 20px/30px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
}

@media screen {
  .baseList__element--meerwasser .baseList__element__text > h3:after,
  .baseList__element--schlick .baseList__element__text > h3:after,
  .baseList__element--algen .baseList__element__text > h3:after,
  .baseList__element--thalasso .baseList__element__text > h3:after{
    content: '';
    display: inline-block; width: 30px; height: 30px;
    margin-left: 10px; vertical-align: sub;
  }

  .baseList__element--meerwasser .baseList__element__text > h3:after{
    background: url('../images/icon-meerwasser.06a740b9.svg') 0px 0px no-repeat;
    background-size: contain;
  }
  .baseList__element--schlick .baseList__element__text > h3:after{
    background: url('../images/icon-schlick.1fad7f68.svg') 0px 0px no-repeat;
    background-size: contain;
  }
  .baseList__element--algen .baseList__element__text > h3:after{
    background: url('../images/icon-algen.9afd9838.svg') 0px 0px no-repeat;
    background-size: contain;
  }
  .baseList__element--thalasso .baseList__element__text > h3:after{
    background: url('../images/icon-thalasso.bcedc124.svg') 0px 0px no-repeat;
    background-size: contain;
  }
}

@media screen {
  .baseList__element__text > hr{
    width: 35%; border-color: #4b4a49;
    margin: 10px 0px; display: inline-block;
  }
}

@media screen {
  .baseList__element__text > p{
    font: 400 normal 18px/26px 'Open Sans', Arial, sans-serif;
    font-weight: 400; margin: 0px 0px 10px 0px; padding: 0px;
  }
  .baseList__element__text > .description{ font-style: italic;}
}
@media screen and (max-width: 800px) {
  .baseList__element__text > p{ font-size: 16px;}
}

@media screen {
  .baseList__element__text > .-global-button:not(:last-of-type){ margin-right: 10px;}

  .baseList__element a {text-decoration: none;}
}



/*  =========================================================
tipp
========================================================= */
.baseList__element--tipp .baseList__element__image:after{
  content: '';
  position: absolute; top: 0px; left: 30px;
  display: block; width: 50px; height: 55px;
  background: url('../images/icon-tipp.d4e41cb8.svg') 0px 0px no-repeat; background-size: contain;
}

.baseList__element--tipp .baseList__element__image:after{
  left: 50%;
  -webkit-transform: translateX(-50%) ;
      -ms-transform: translateX(-50%) ;
          transform: translateX(-50%) ;
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage baseList
 * @author     gueldner
 * @since      21.11.2016
 * @version    $Id: 100-baseList.init.css 711 2017-02-13 10:16:44Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .baseList{
    background: #fff; padding: 25px 0px;
    color: #4b4a49;
  }

  .baseList .noResults{
    font: 400 normal 25px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #4b4a49;
  }
} 
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage baseList
 * @author     gueldner
 * @since      23.11.2016
 * @version    $Id: 400-baseList.map.css 489 2016-12-07 08:55:09Z mueller $
 **/

/*  =========================================================
general structure
map container
button
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen and (min-width: 1201px) {
  .baseList__map{
    height: 100vh; width: 24.702% /* 415/1680 */;
    right: 0px;
  }
  
  .baseList__map--fixed,
  .baseList__map:not(.baseList__map--bottom){ top: 0px;}
  .baseList__map--bottom{ bottom: 0px;}
  
  .baseList__map--bottom,
  .baseList__map:not(.baseList__map--fixed){ position: absolute;}
  .baseList__map--fixed{ position: fixed;}
}

@media screen and (max-width: 1200px) {
  .baseList__map{ position: relative;}
}

/*  =========================================================
map container
========================================================= */
@media screen {
  .baseList__map__mapContainer{
    width: 100%; height: 100%;
  }
}

@media screen and (max-width: 1200px) {
  .baseList__map__mapContainer{
    position: absolute; top: 0px; left: 0px;
    width: 100%; height: 100%;
  }
}

/*  =========================================================
button
========================================================= */
@media screen {
  .baseList__map__button{
    width: 100%; text-align: center; padding: 20px 0px;
  }
}

@media screen and (min-width: 1201px) {
  .baseList__map__button{
    position: absolute; bottom: 0px; left: 0px;
    background: rgba(255, 255, 255, 0.75);
  }
}
@media screen and (max-width: 1200px) {
  .baseList__map__button{ position: relative;}
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage baseList
 * @author     gueldner
 * @since      21.11.2016
 * @version    $Id: 300-baseList.pages.css 674 2017-02-07 14:37:19Z mueller $
 **/

/*  =========================================================
general structure
simple links
list
info
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .baseList__pages{
    display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: flex;
  }

  .baseList__pages:first-child{
    margin-bottom: 60px; padding-bottom: 10px;
    border-bottom: 1px #7d7c7a solid;
  }
  .baseList__pages:last-child{
    margin-top: 60px; padding-top: 10px;
    border-top: 1px #7d7c7a solid;
  }
}

/*  =========================================================
simple links
========================================================= */
@media screen {
  .baseList__pages a{
    display: inline-block;
    font: 400 normal 20px/25px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #4b4a49; text-decoration: none;
  }
}
@media screen and (max-width: 800px){
  .baseList__pages a {
    font-size: 33px;
  }
  .baseList__pages a > span{ display: none;}
}

/*  =========================================================
list
========================================================= */
@media screen and (min-width: 801px) {
  .baseList__pages > ul{
    -webkit-box-flex: 1;
        -ms-flex: 1 1;
            flex: 1 1; -webkit-flex: 1 1;
    list-style: none;
    margin: 0px; padding: 0px;
  }
}
@media screen and (max-width: 800px) {
  .baseList__pages > ul{ display: none;}
}

@media screen and (min-width: 801px) {
  .baseList__pages > ul > li{
    display: inline-block;
  }

  .baseList__pages > ul > li > a{
    display: block; padding: 0px 5px;
  }
}

@media screen and (min-width: 801px) {
  .baseList__pages > ul > li > span{
    display: block; padding: 0px 10px;
    font: 400 normal 20px/25px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #fff; background: #4c5660;
  }
}

/*  =========================================================
info
========================================================= */
@media screen and (min-width: 801px) {
  .baseList__pages__info{ display: none;}
}

@media screen and (max-width: 800px) {
  .baseList__pages__info{
    -webkit-box-flex: 1;
        -ms-flex: 1 1;
            flex: 1 1; -webkit-flex: 1 1;
    font: 400 normal 20px/25px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #4b4a49;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage breadcrumb
 * @author     gueldner
 * @since      21.11.2016
 * @version    $Id: breadcrumb.init.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
list
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  #breadcrumb{
    padding: 15px 3.571% /* 60/1680 */;
    background: #7d7c7a; color: #fff;
  }
  
  #breadcrumb > h3{
    font: 600 normal 16px/20px 'Open Sans', Arial, sans-serif;
    margin: 0px; display: inline-block;
  }
}

/*  =========================================================
list
========================================================= */
@media screen {
  #breadcrumb > ul{
    list-style: none; margin: 0px 0px 0px 15px; padding: 0px;
    display: inline;
  }
  
  #breadcrumb > ul > li{
    display: inline;
    font: 400 normal 16px/20px 'Open Sans', Arial, sans-serif;
  }
  
  #breadcrumb > ul > li:not(:last-child):after{
    content: '>';
    margin: 0px 10px;
  }
  
  #breadcrumb > ul > li > a{
    text-decoration: underline;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage contact info
 * @author     gueldner
 * @since      21.11.2016
 * @version    $Id: contactInfo.init.css 694 2017-02-09 07:53:38Z mueller $
 **/

/*  =========================================================
general structure
static map
headline
address
links
simple text
listings
form overrides
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .contactInfo hr{
    border-color: #4b4a49;
    margin: 35px 0px;
  }
}

/*  =========================================================
static map
========================================================= */
@media screen {
  .contactInfo__staticMap{
    width: 100%; height: 0px; overflow: hidden;
    padding-bottom: 63.311% /* 390/616 */;
    position: relative;
  }

  .contactInfo__staticMap  img{
    display: block; width: 100%; height: auto;
    position: absolute; top: 0px; left: 0px;
  }

  .contactInfo__staticMap img ~ .openMap{
    position: absolute;
    right: 10px;
    bottom: 20px;
  }

}

@media screen and (max-width: 800px) {
  .contactInfo__staticMap{ margin-bottom: 30px;}
}

/*  =========================================================
headline
========================================================= */
@media screen {
  .contactInfo h3{
    color: #4b4a49; text-align: left; margin: 0px;
  }
}
@media screen and (min-width: 801px) {
  .contactInfo h3{ font: 400 normal 30px/42px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
}
@media screen and (max-width: 800px) {
  .contactInfo h3{ font: 400 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
}

@media screen {
  .contactInfo h3 + hr{
    width: 35%; border-color: #4b4a49;
    margin: 20px 0px; text-align: left;
  }
}

/*  =========================================================
address
========================================================= */
@media screen {
  .contactInfo__address{
    color: #4b4a49; text-align: left;
  }

  .contactInfo__address:not(:last-child){ margin: 0px 0px 10px 0px;}
  .contactInfo__address:last-child{ margin: 0px;}
}
@media screen and (min-width: 801px) {
  .contactInfo__address{ font: 400 italic 18px/26px 'Open Sans', Arial, sans-serif;}
}
@media screen and (max-width: 800px) {
  .contactInfo__address{ font: 400 italic 16px/26px 'Open Sans', Arial, sans-serif;}
}

/*  =========================================================
links
========================================================= */
@media screen {
  .contactInfo__links{
    color: #4b4a49; text-align: left;
  }
}
@media screen and (min-width: 801px) {
  .contactInfo__links{ font: 400 normal 18px/30px 'Open Sans', Arial, sans-serif;}
}
@media screen and (max-width: 800px) {
  .contactInfo__links{ font: 400 normal 16px/30px 'Open Sans', Arial, sans-serif;}
}

@media screen {
  .contactInfo__links > a{
    color: #236db0; text-decoration: underline;
    position: relative; margin-left: 30px;
  }

  .contactInfo__links [class*='icon-']{
    font-size: 25px; vertical-align: middle;
    color: #4b4a49;
  }
  .contactInfo__links > a > [class*='icon-']{
    position: absolute; top: 0px; left: -30px;

  }
}

/*  =========================================================
simple text
========================================================= */
@media screen {
  .contactInfo p:not([class]){
    color: #4b4a49; text-align: left;
  }

  .contactInfo p:not([class]) > a{ color: #236db0; text-decoration: underline;}

  .contactInfo p:not([class]):not(:last-child){ margin: 0px 0px 10px 0px;}
  .contactInfo p:not([class]):last-child{ margin: 0px;}
}
@media screen and (min-width: 801px) {
  .contactInfo p:not([class]){ font: 400 normal 18px/26px 'Open Sans', Arial, sans-serif;}
}
@media screen and (max-width: 800px) {
  .contactInfo p:not([class]){ font: 400 normal 16px/26px 'Open Sans', Arial, sans-serif;}
}

/* inline images */
@media screen {
  .contactInfo p:not([class]) > img{
    width: 75px; float: left;
    margin: 0px 10px 10px 0px;
  }
}

/*  =========================================================
listings
========================================================= */
@media screen {
  .contactInfo ul{
    color: #4b4a49;
    list-style: square; margin: 0px 0px 15px 0px; padding: 0px 0px 0px 25px;
    font: 400 normal 18px/22px 'Open Sans', Arial, sans-serif; text-align: left;
  }
  .contactInfo ul > li:not(:last-child){ margin-bottom: 15px;}

  .contactInfo ul > li > em{ font-style: italic; font-size: 16px;}
  .contactInfo ul > li > a{ color: #236db0; text-decoration: underline;}
}

/*  =========================================================
form overrides
========================================================= */
@media screen and (min-width: 801px) {
  .contactInfo .contentForm__line label:first-child{ width: 35%;}
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage contentForm
 * @author     gueldner
 * @since      22.11.2016
 * @version    $Id: contentForm.checkbox.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
the physical input
label with fake checkbox
========================================================== */


/*  =========================================================
the physical input
========================================================= */
@media screen {
  .contentForm [type=checkbox],
  .contentForm [type=radio]{
    opacity: 0; position: fixed; top: 50%; right: 150%;
  }
}

/*  =========================================================
label with fake checkbox
========================================================= */
@media screen {
  /* spare some space for the fake checkbox */
  .contentForm [type=checkbox] + label,
  .contentForm [type=radio] + label{
    padding: 0px 0px 0px 35px; margin-bottom: 15px;
  }
  
  /* add some space to the next element */
  .contentForm [type=checkbox] + label:not(:last-child),
  .contentForm [type=radio] + label:not(:last-child){ margin-right: 35px;}
  
  /* the fake checkbox itself */
  .contentForm [type=checkbox] + label:before,
  .contentForm [type=radio] + label:before{
    display: inline-block; vertical-align: text-top;
    width: 25px; height: 25px;
    background: #fff; color: #7d7c7a;
    -webkit-border-radius: 5px;
            border-radius: 5px; border: 1px #ecebeb solid; -webkit-box-sizing: border-box; box-sizing: border-box;
    margin: 0px 10px 0px -35px;
    
    font: 400 normal 15px/25px 'icomoon'; text-align: center;
  }
  
  /* checked/unchecked states */
  .contentForm [type=checkbox]:checked + label:before,
  .contentForm [type=radio]:checked + label:before{ content: '\e90d';}
  .contentForm [type=checkbox]:not(:checked) + label:before,
  .contentForm [type=radio]:not(:checked) + label:before{ content: '';}
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage contentForm
 * @author     gueldner
 * @since      22.11.2016
 * @version    $Id: contentForm.fieldset.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
legend
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .contentForm fieldset{
    margin: 0px; border: none;
    
  }
}
@media screen and (min-width: 801px) {
  .contentForm fieldset{ padding-top: 0px; padding-bottom: 0px;}
  .contentForm fieldset:not([class*='gridSection__col_']){ padding-left: 0px; padding-right: 0px;}
}
@media screen and (max-width: 800px) {
  .contentForm fieldset{ padding: 0px;}
}

/*  =========================================================
legend
========================================================= */
@media screen {
  .contentForm fieldset > legend{
    display: block; width: 100%; margin: 0px 0px 30px 0px;
    text-align: center;
  }
  .contentForm fieldset > legend:not([class*='gridSection__col_']){ padding: 0;}
}

@media screen and (min-width: 801px) {
  .contentForm fieldset > legend{ font: 400 normal 25px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif; color: #4b4a49;}
}
@media screen and (max-width: 800px) {
  .contentForm fieldset > legend{ font: 400 normal 22px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif; color: #4b4a49;}
}

@media screen {
  .contentForm fieldset > legend > strong{ font-weight: 600;}
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage contentForm
 * @author     gueldner
 * @since      22.11.2016
 * @version    $Id: contentForm.init.css 901 2018-01-26 08:26:42Z mueller $
 **/

/*  =========================================================
general structure
rows/lines
labels in general
title
background image
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  /* white line between fieldsets */
  .contentForm > hr{ border-color: #fff; border-width: 2px;}

  /* buttons have to arange on the right side */
  .contentForm .-global-button:not(.-global-button--left){ float: right;}

  /* this small long text usaly below forms that collect user data */
  .contentForm__disclaimer{
    margin: 0px; text-align: left;
    font: 400 normal 14px/20px 'Open Sans', Arial, sans-serif; color: #4b4a49;
  }
  .contentForm__disclaimer > strong{ font-weight: 600;}

  /* info for mandatory fields */
  .contentForm__info{
    float: left; margin: 20px 20px 0px 0px;
    font: 400 italic 14px/20px 'Open Sans', Arial, sans-serif; color: #4b4a49;
  }
}

/*  =========================================================
rows/lines
========================================================= */
@media screen {
  .contentForm__row,
  .contentForm__line{
    text-align: left;
  }
}

@media screen and (min-width: 801px) {
  .contentForm__line{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: flex;}

  .contentForm__row--center,
  .contentForm__line--center{
    text-align: center;
  }
}

/*  =========================================================
labels in general
========================================================= */
@media screen {
  .contentForm label{
    font: 400 normal 20px/1em 'Open Sans', Arial, sans-serif; color: #4b4a49;
    display: inline-block;
    vertical-align: middle;
  }

  .contentForm.contentFormContact label,
  .contentForm.contentFormNewsletter label{
    display: inherit;
  }
}

/* add the same margin as the input gets, to keep everything in line */
@media screen and (min-width: 801px) {
  .contentForm label{ margin-bottom: 15px;}
}

/* labels on small screens, shall use the whole width */
@media screen and (max-width: 800px) {
  .contentForm label{
    width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box;
  }
}

@media screen and (min-width: 801px) {
  .contentForm__line label{
    line-height: 2em; width: 16%;
  }
}

/*  =========================================================
title
========================================================= */
@media screen{
  .contentForm > :not(.baseArticle) h2 {
    font-weight: 400; margin: 0px 0px 20px 0px;
    clear: both; color: #fff; text-align: left;
    text-shadow: 0px 0px 25px rgba(0, 0, 0, 0.5);
  }

  .contentForm > :not(.baseArticle) h2 > .subline{
    font-weight: 400;
    margin-top: 10px; display: block;
  }
}

@media screen and (min-width: 801px) {
  .contentForm > :not(.baseArticle) h2{
    font: 400 normal 80px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }

  .contentForm > :not(.baseArticle) h2 > .subline{
    font: 400 normal 40px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 800px) {
  .contentForm > :not(.baseArticle) h2{
    font: 400 normal 50px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }

  .contentForm > :not(.baseArticle) h2 > .subline{
    font: 400 normal 30px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
}

/*  =========================================================
background image
========================================================= */
@media screen {
  .contentFormBg > div{
    position: absolute; top: 0px; left: 0px;
    width: 100%; height: 100%;
    background-position: 50%; background-repeat: no-repeat; background-size: cover;
  }
}

@media screen {
  .contentFormBg + .contentForm{ position: relative;}
}
@media screen and (min-width: 701px) {
  .contentFormBg + .contentForm{ padding: 200px 0px 75px 0px;}
}
@media screen and (max-width: 700px) {
  .contentFormBg + .contentForm{ padding: 50px 0px 25px 0px;}
}

@media screen {
  .contentFormBg + .contentForm fieldset{
    -webkit-box-sizing: border-box;
            box-sizing: border-box; background: #f2efeb;
  }
}
@media screen and (min-width: 701px) {
  .contentFormBg + .contentForm fieldset{ padding: 35px 40px 20px 40px;}
}
@media screen and (max-width: 700px) {
  .contentFormBg + .contentForm fieldset{ padding: 20px;}
}

@media screen {
  .contentForm__bg{
    background-image: url('../images/metasearch_background.b63ba1da.jpg');
  }
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage contentForm
 * @author     gueldner
 * @since      22.11.2016
 * @version    $Id: contentForm.inputs.css 830 2017-04-05 14:30:46Z mueller $
 **/

/*  =========================================================
general structure
icon helper
specific length versions
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .contentForm input[type=text],
  .contentForm input[type=email],
  .contentForm textarea,
  .contentForm input[type=date]{
    display: inline-block; vertical-align: middle; height: 40px;

    font: 400 normal 18px/40px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    background: #fff; color: #7d7c7a;

    -webkit-border-radius: 5px;

            border-radius: 5px; border: 1px #ecebeb solid; -webkit-box-sizing: border-box; box-sizing: border-box;
    padding: 0px 10px; box-sizing: border-box;
  }

  .contentForm.contentFormNewsletter textarea,
  .contentForm.contentFormContact textarea,
  .contentForm.contentFormNewsletter input[type=date],
  .contentForm.contentFormContact input[type=date],
  .contentForm.contentFormNewsletter input[type=email],
  .contentForm.contentFormContact input[type=email],
  .contentForm.contentFormNewsletter input[type=text],
  .contentForm.contentFormContact input[type=text]{
    display: inherit;
  }

  .contentForm textarea{
    height: 120px;
    line-height: 1.5;
  }
  .contentForm .contentForm__catalog--count {
    margin-bottom: 0;
  }
  .formerror,
  .contentForm [type=checkbox].formerror + label,
  .contentForm .formerror{
    color: red;
  }

  .contentForm [type=checkbox].formerror:checked + label{
    color: inherit;
  }

  .contentForm textarea:disabled,
  .contentForm input:disabled{
    background-color: #e0e0e0;
  }

  .contentForm :not(.contentForm__iconInput) > input[type=text],
  .contentForm :not(.contentForm__iconInput) > input[type=email],
  .contentForm :not(.contentForm__iconInput) > textarea,
  .contentForm :not(.contentForm__iconInput) > input[type=date]{
    margin-bottom: 15px;
  }
}

@media screen and (min-width: 801px) {
  .contentForm__line input[type=text],
  .contentForm__line input[type=email],
  .contentForm__line textarea,
  .contentForm__line input[type=date]{
    -webkit-box-flex: 1;
        -ms-flex: 1 1;
            flex: 1 1; -webkit-flex: 1 1;
  }

  .contentForm :not(.contentForm__iconInput) > label + input[type=text],
  .contentForm :not(.contentForm__iconInput) > label + input[type=email],
  .contentForm :not(.contentForm__iconInput) > label + textarea,
  .contentForm :not(.contentForm__iconInput) > label + input[type=date]{
    margin-left: 10px;
  }
  .contentForm :not(.contentForm__iconInput) > input[type=text]:not(:last-child),
  .contentForm :not(.contentForm__iconInput) > input[type=email]:not(:last-child),
  .contentForm :not(.contentForm__iconInput) > textarea:not(:last-child),
  .contentForm :not(.contentForm__iconInput) > input[type=date]:not(:last-child){
    margin-right: 35px;
  }
}

@media screen and (max-width: 800px) {
  .contentForm :not(.contentForm__iconInput) > input[type=text],
  .contentForm :not(.contentForm__iconInput) > input[type=email],
  .contentForm :not(.contentForm__iconInput) > textarea,
  .contentForm :not(.contentForm__iconInput) > input[type=date]{
    width: 100%;
    margin-top: 5px;
  }
}

/*  =========================================================
icon helper
========================================================= */
@media screen {
  .contentForm__iconInput{
    position: relative;
    display: inline-block; vertical-align: middle; overflow: hidden;
    margin-bottom: 15px;
  }
  .contentForm__iconInput > input{
    width: 100%; padding-right: 55px!important;
  }
}
@media screen and (min-width: 801px) {
  .contentForm__line .contentForm__iconInput{ -webkit-box-flex: 1; -ms-flex: 1 1; flex: 1 1; -webkit-flex: 1 1;}
  .contentForm label + .contentForm__iconInput{ margin-left: 10px;}
  .contentForm__iconInput:not(:last-child){ margin-right: 35px;}
}
@media screen and (max-width: 800px) {
  .contentForm__iconInput{
    width: 100%;
    margin-top: 10px;
  }
}

@media screen {
  .contentForm__iconInput > label{
    width: 45px; height: 100%; margin: 0px;
    position: absolute; top: 0px; right: 0px;

    border-left: 1px #ecebeb solid;
    font-size: 22px; line-height: 40px; text-align: center;

    pointer-events: none;
  }
}

/*  =========================================================
specific length versions
========================================================= */
@media screen and (min-width: 801px) {
  .contentForm input[name='arrival'],
  .contentForm input[name='departure']{
    width: 175px;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage contentForm
 * @author     gueldner
 * @since      22.11.2016
 * @version    $Id: contentForm.select.css 774 2017-02-27 15:12:22Z schoening $
 **/

/*  =========================================================
general structure
drop down label
select box itself
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .contentForm__select{
    position: relative;
    display: inline-block; vertical-align: middle; overflow: hidden;
    margin-bottom: 15px;

    -webkit-border-radius: 5px;

            border-radius: 5px; border: 1px #ecebeb solid; background: #fff;
  }

  .contentForm__select > select{ width: 100%;}

  label.icon-triangleDown.quickSearch{
    color:#7d7c7a;
    padding:5px;
  }
}
@media screen and (min-width: 801px) {
  .contentForm__line .contentForm__select{ -webkit-box-flex: 1; -webkit-flex: 1 1; -ms-flex: 1 1; flex: 1 1;}
  .contentForm label + .contentForm__select{ margin-left: 10px;}
  .contentForm__select:not(:last-child){ margin-right: 35px;}
}
@media screen and (max-width: 800px) {
  .contentForm__select{
    width: 100%;
    margin-top: 10px;
  }
}

/*  =========================================================
drop down label
========================================================= */
@media screen {
  .contentForm__select > label{
    width: 45px; height: 100%; margin: 0px;
    position: absolute; top: 0px; right: 0px;

    border-left: 1px #ecebeb solid; background: #fff;
    font-size: 15px; line-height: 38px; text-align: center;

    pointer-events: none;
    padding-left:8px;
  }
}

/*  =========================================================
select box itself
========================================================= */
@media screen {
  .contentForm__select > select{
    height: 38px; -webkit-border-radius: 5px; border-radius: 5px; min-width: 115px;
    display: inline-block; vertical-align: middle;

    font: 400 normal 18px 'Comfortaa', 'Open Sans', Arial, sans-serif;

    background: #fff; color: #7d7c7a;
    border: none; padding: 0px 0px 0px 10px;
  }

  .contentForm__select > select > option{
    font: 400 normal 14px 'Open Sans', Arial, sans-serif;
  }


  .contentForm__select > select:disabled{
    background-color: #e0e0e0;
  }

  .contentFormNewsletter .contentForm__select,
  .contentFormNewsletter .contentForm__select > select,
  .contentFormContact .contentForm__select,
  .contentFormContact .contentForm__select > select{
    display: inherit;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage contentForm
 * @author     gueldner
 * @since      23.11.2016
 * @version    $Id: contentForm.teaser.css 685 2017-02-08 09:59:59Z mueller $
 **/

/*  =========================================================
general structure
image
label
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen and (min-width: 801px) {
  .contentForm__teaser{
    text-align: left; margin: 0px 0px 20px 0px;
    position: relative; overflow: hidden; background: #fff; z-index: 0;

    position: relative; height: 0px; padding-bottom: 102.013% /* 304/298 */;
  }
}

@media screen and (max-width: 800px) {
  .contentForm__teaser{ text-align: left;}
}

/*  =========================================================
image
========================================================= */
@media screen {
  .contentForm__teaser > [type=checkbox] + label{
    cursor: pointer;
  }
}
@media screen and (min-width: 801px) {
  .contentForm__teaser__image{
    position: absolute; top: 0px; left: 0px;
    display: block; width: 100%; height: 0px; overflow: hidden;
    margin: 0px; padding: 0px 0px 78.523% /* 234/298 */ 0px;
  }
}
@media screen and (max-width: 800px) {
  .contentForm__teaser__image{ display: none;}
}

@media screen and (min-width: 801px) {
  .contentForm__teaser__image__picture{
    position: absolute; top: 0px; left: 0px;
    display: block; width: 100%; height: 100%;
    overflow: hidden;

    -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;

    transition: opacity 0.5s ease, -webkit-transform 0.5s ease;

    transition: transform 0.5s ease, opacity 0.5s ease;

    transition: transform 0.5s ease, opacity 0.5s ease, -webkit-transform 0.5s ease;
  }

  .contentForm__teaser__image__picture > img{
    display: block; width: 100%; height: auto;
  }
}

@media screen and (min-width: 801px) {
  .contentForm__teaser > [type=checkbox]:checked ~ .contentForm__teaser__image:after{
    content: '\e90d';
    font: 400 normal 50px 'icomoon'; color: #4b4a49;
    position: absolute; top: 10px; right: 10px;
  }

  .contentForm__teaser > [type=checkbox]:checked ~ .contentForm__teaser__image > .contentForm__teaser__image__picture{
    -webkit-transform: rotateZ(-2deg) scale(1.1);
        -ms-transform: rotate(-2deg) scale(1.1);
            transform: rotateZ(-2deg) scale(1.1);
    opacity: 0.5;
  }
}

/*  =========================================================
label
========================================================= */
@media screen and (min-width: 801px) {
  .contentForm__teaser > label{
    position: absolute; bottom: 0px; left: 0px; z-index: 1;
    display: block; width: 100%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; padding: 78.523% /* 234/298 */ 0px 0px 0px!important;
    margin: 0px!important; border-top: 15px transparent solid;

    font: 300 normal 30px/42px 'Comfortaa', 'Open Sans', Arial, sans-serif; color: #4b4a49;
  }

  .contentForm__teaser > label > span{
    background: #fff; padding: 15px; display: block;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/*! tash, Compiled at 2016-11-29 14:54:08 */

@charset "UTF-8";
/*!
 * Pikaday
 * Copyright © 2014 David Bushell | BSD & MIT license | http://dbushell.com/
 */

.pika-single {
  display: block;
  position: relative
}
.pika-single:after,
.pika-single:before {
  content: " ";
  display: table
}
.pika-single:after {
  clear: both
}
.pika-single.is-hidden {
  display: none
}
.pika-single.is-bound {
  position: absolute;
  -webkit-box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .5);
  box-shadow: 0 5px 15px -5px rgba(0, 0, 0, .5)
}
.pika-lendar {
  float: left;
  width: 240px;
  margin: 8px
}
.pika-title {
  position: relative;
  text-align: center
}
.pika-label {
  display: inline-block;
  position: relative;
  z-index: 9999;
  overflow: hidden;
  margin: 0;
  padding: 5px 3px;
  font-size: 14px;
  line-height: 20px;
  background-color: #fff
}
.pika-title select {
  cursor: pointer;
  position: absolute;
  z-index: 9998;
  margin: 0;
  left: 0;
  top: 5px;
  filter: alpha(opacity=0);
  opacity: 0
}
.pika-next,
.pika-prev {
  display: block;
  cursor: pointer;
  position: relative;
  outline: 0;
  border: 0;
  padding: 0;
  width: 20px;
  height: 30px;
  text-indent: 20px;
  white-space: nowrap;
  overflow: hidden;
  background-color: transparent;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 75% 75%;
  opacity: .5
}
.pika-next:hover,
.pika-prev:hover {
  opacity: 1
}
.is-rtl .pika-next,
.pika-prev {
  float: left;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAUklEQVR42u3VMQoAIBADQf8Pgj+OD9hG2CtONJB2ymQkKe0HbwAP0xucDiQWARITIDEBEnMgMQ8S8+AqBIl6kKgHiXqQqAeJepBo/z38J/U0uAHlaBkBl9I4GwAAAABJRU5ErkJggg==)
}
.is-rtl .pika-prev,
.pika-next {
  float: right;
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAeCAYAAAAsEj5rAAAAU0lEQVR42u3VOwoAMAgE0dwfAnNjU26bYkBCFGwfiL9VVWoO+BJ4Gf3gtsEKKoFBNTCoCAYVwaAiGNQGMUHMkjGbgjk2mIONuXo0nC8XnCf1JXgArVIZAQh5TKYAAAAASUVORK5CYII=)
}
.pika-next.is-disabled,
.pika-prev.is-disabled {
  cursor: default;
  opacity: .2
}
.pika-select {
  display: inline-block
}
.pika-table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border: 0
}
.pika-table td,
.pika-table th {
  width: 14.285714285714286%;
  padding: 0
}
.pika-table th {
  font-size: 12px;
  line-height: 25px;
  text-align: center
}
.pika-button {
  cursor: pointer;
  display: block;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  outline: 0;
  border: 0;
  margin: 0;
  width: 100%;
  padding: 5px;
  color: #666;
  font-size: 12px;
  line-height: 15px;
  text-align: right
}
.pika-week {
  font-size: 11px;
  color: #999
}
.is-endrange .pika-button,
.is-selected .pika-button,
.is-startrange .pika-button {
  color: #fff
}
.is-today .pika-button {
  font-weight: 700
}
.is-disabled .pika-button,
.is-outside-current-month .pika-button {
  pointer-events: none;
  cursor: default;
  color: #999;
  opacity: .3
}
.pika-table abbr {
  border-bottom: none;
  cursor: help
}
.verticalAlignHelper {
  content: '';
  display: inline-block;
  vertical-align: middle;
  width: 0;
  height: 100%;
  margin: 0
}
.pika-single {
  z-index: 2;
  border: 1px solid #dddfe1;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  background: #fff;
  color: #465c6d;
  font: 400 normal 1.8rem/1.38888889em 'Open Sans', Arial, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: 1.8rem;
  line-height: 1.38888889em;
  -webkit-box-sizing: border-box;
  box-sizing: border-box
}
.pika-label {
  color: #465c6d;
  font-weight: 400
}
.pika-table th {
  color: #aeaeae;
  font-weight: 400
}
.pika-button {
  background: #eee
}
.pika-button:hover {
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0;
  border-radius: 0;
  background: #465c6d;
  color: #fff
}
.is-disabled .pika-button {
  background: #eee;
  color: #465c6d
}
.is-today .pika-button {
  color: #465c6d
}
.is-today.is-selected .pika-button {
  color: #fff
}
.is-endrange .pika-button,
.is-selected .pika-button,
.is-startrange .pika-button {
  -webkit-box-shadow: none;
  box-shadow: none;
  -webkit-border-radius: 0;
  border-radius: 0;
  background: #236db0;
  font-weight: 400
}
.is-inrange .pika-button {
  background:#70abe0

}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage fullScaleMap
 * @author     gueldner
 * @since      29.11.2016
 * @version    $Id: fullScaleMap.init.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
map container
========================================================== */


/*  =========================================================
general structure
========================================================= */
/* the main container */
@media screen {
  .fullScaleMap{
    width: 100%; height: 100vh;
    position: relative;
  }
}

/*  =========================================================
map container
========================================================= */
@media screen {
  .fullScaleMap__mapContainer{
    width: 100%; height: 100%;
    position: absolute; top: 0px; left: 0px;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage fullScaleMap
 * @author     gueldner
 * @since      29.11.2016
 * @version    $Id: fullScaleMap.infowindow.css 540 2016-12-13 16:49:41Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */

@media screen{

  .imx-infowindow .ui-tabs .ui-tabs-panel {
    background: #f2efeb;
  }

  .imx-infowindow .ui-widget-header {
    border: 0px solid #fff;
    background: transparent;
  }

  .imx-infowindow .ui-widget-content {
    border: 0px solid #fff;
    background: transparent;
  }

  .imx-infowindow .ui-state-active,
  .imx-infowindow .ui-widget-content
  .imx-infowindow .ui-state-active,
  .imx-infowindow .ui-widget-header .ui-state-active{
    border: 0px solid #fff;
    background: #f2efeb;
    font-weight: normal;
    color: #000;
  }

} 
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage headerImage
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: headerImage.caption.css 747 2017-02-21 15:42:16Z schoening $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .headerImage__image__claim{
    position: absolute; top: 45%; left: 0px; z-index: 1;
    width: 100%; text-align: center;

    -webkit-transform: translateY(-50%);

        -ms-transform: translateY(-50%);

            transform: translateY(-50%); pointer-events: auto;

    font-weight: 400; color: #fff;
    text-shadow: 0px 0px 25px rgba(0, 0, 0, 0.5);

    word-wrap: break-word;
    hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto;
  }

  .headerImage__image__claim > h1{
    margin: 0px;
    font-weight: inherit; font-size: 1em;
  }

  .headerImage__image__claim > .-global-button{ margin-top: 25px; height:auto;}
}
@media screen and (min-width: 701px) {
  .headerImage__image__claim{ font: 400 normal 35px/40px 'Comfortaa', 'Open Sans', Arial, sans-serif;}

  .headerImage__image__claim strong{
    font-weight: 400; font-size: 80px; line-height: 90px;
  }
}
@media screen and (max-width: 700px) {
  .headerImage__image__claim{ font: 400 normal 20px/30px 'Comfortaa', 'Open Sans', Arial, sans-serif;}

  .headerImage__image__claim strong{
    font-weight: 400; font-size: 45px; line-height: 50px;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage headerImage
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: headerImage.destination.css 741 2017-02-20 15:59:17Z schoening $
 **/

/*  =========================================================
map version on large screens
apple dot version on smaller screens
========================================================== */


/*  =========================================================
map version on large screens
========================================================= */
@media screen and (min-width: 901px) and (min-height: 701px) {
  .headerImage__destination{
    position: absolute; bottom: 0px; right: 0px;
    width: 855px; height: 450px;
    background: url('../images/headerImage/destination.d8556efe.svg') 100% 100% no-repeat;
    background-size: contain;
    z-index:1;
  }
}

@media screen and (min-width: 901px) and (min-height: 701px) and (max-height: 1001px){
  .headerImage__destination{
    -webkit-transform-origin: 100% 100%;
        -ms-transform-origin: 100% 100%;
            transform-origin: 100% 100%;
    -webkit-transform: scale(0.75);
        -ms-transform: scale(0.75);
            transform: scale(0.75);
  }
}

@media screen and (min-width: 901px) and (min-height: 701px) {
  .headerImage__destination__element{
    position: absolute; z-index: 1; cursor: pointer;
    display: block; width: 28px; height: 28px;
    margin: 7px 0px 0px 14px; -webkit-border-radius: 50%; border-radius: 50%;
    background: #236db0;
  }
}

@media screen and (min-width: 901px) and (min-height: 701px) {
  .headerImage__destination__element--active > span{
    position: absolute; top: 50%; left: 50%;
    width: 140px; height: 140px;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);

    -webkit-border-radius: 50%;

            border-radius: 50%; border: 5px #fff solid;
  }

  .headerImage__destination__element--active > span:before,
  .headerImage__destination__element--active > span:after,
  .headerImage__destination__element--active:before{
    content: '';

    width: 150px; height: 150px;

    position: absolute; top: 50%; left: 50%;
    -webkit-transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);

    -webkit-border-radius: 50%;

            border-radius: 50%; border: 1px #fff solid;
  }

  .headerImage__destination__element--active > span:before{
    -webkit-animation-name: headerImage__destination__element__animation;
            animation-name: headerImage__destination__element__animation;
    -webkit-animation-duration: 3s;
            animation-duration: 3s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
            animation-direction: alternate;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  .headerImage__destination__element--active > span:after{
    -webkit-animation-name: headerImage__destination__element__animation;
            animation-name: headerImage__destination__element__animation;
    -webkit-animation-duration: 2s;
            animation-duration: 2s;
    -webkit-animation-delay: 0.5s;
            animation-delay: 0.5s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
            animation-direction: alternate;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
  .headerImage__destination__element--active:before{
    -webkit-animation-name: headerImage__destination__element__animation;
            animation-name: headerImage__destination__element__animation;
    -webkit-animation-duration: 4s;
            animation-duration: 4s;
    -webkit-animation-delay: 1s;
            animation-delay: 1s;
    -webkit-animation-iteration-count: infinite;
            animation-iteration-count: infinite;
    -webkit-animation-direction: alternate;
            animation-direction: alternate;
    -webkit-animation-timing-function: ease-in-out;
            animation-timing-function: ease-in-out;
  }
}

@-webkit-keyframes headerImage__destination__element__animation{
  0%{ width: 150px; height: 150px;}
  100%{ width: 220px; height: 220px;}
}

@keyframes headerImage__destination__element__animation{
  0%{ width: 150px; height: 150px;}
  100%{ width: 220px; height: 220px;}
}

/*  =========================================================
apple dot version on smaller screens
========================================================= */
@media screen and (max-width: 900px), screen and (max-height: 700px) {
  .headerImage__destination{
    position: absolute; bottom: 25px; left: 0px;
    width: 100%; text-align: center;
  }

  .headerImage__destination__element{
    display: inline-block; width: 15px; height: 15px;
    -webkit-border-radius: 50%;
            border-radius: 50%; margin: 0px 5px;
    cursor: pointer;
  }

  .headerImage__destination__element:not(.headerImage__destination__element--active){
    background: #fff;
  }
  .headerImage__destination__element--active{
    background: rgba(255, 255, 255, 0.25);
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage headerImage
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: headerImage.image.css 819 2017-03-20 12:38:06Z kracke $
 **/

/*  =========================================================
image row
figure
pagination states
picture
cropping
========================================================== */


/*  =========================================================
image row
========================================================= */
@media screen {
  .headerImage__row{
    width: 100%; height: 100%; overflow: hidden;
    position: absolute; top: 0px; left: 0px;
  }
}

/*  =========================================================
figure
========================================================= */
@media screen {
  .headerImage__row__image{
    position: absolute; top: 0%; left: 0%;
    overflow: hidden; width: 100%; height: 100%;
    display: inline-block; margin: 0px; padding: 0px;

    text-align: center;
    -webkit-transition: opacity 1s ease, -webkit-transform 1s ease;
    transition: opacity 1s ease, -webkit-transform 1s ease;
    transition: opacity 1s ease, transform 1s ease;
    transition: opacity 1s ease, transform 1s ease, -webkit-transform 1s ease;
    pointer-events: none;
  }
}

/*  =========================================================
pagination states
========================================================= */
@media screen {
  .headerImage__row__image--active{
    opacity: 1;
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1);
    z-index:1;
  }

  .headerImage__row__image:not(.headerImage__row__image--active){
    opacity: 0;
    -webkit-transform: scale(1.25);
        -ms-transform: scale(1.25);
            transform: scale(1.25);
  }
}

/*  =========================================================
picture
========================================================= */
@media screen {
  .headerImage__row picture{
    position: absolute; top: 0px; left: 0px;
    width: 100%; height: 100%;
  }

  .headerImage__row picture > img{
    display: inline-block;
  }
}

/*  =========================================================
cropping
========================================================= */
@media screen {
  .headerImage__row__image--verticalyCropped img{
    width: 100%;
    height: auto;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translateY(-50%) translateX(-50%);
        -ms-transform: translateY(-50%) translateX(-50%);
            transform: translateY(-50%) translateX(-50%);
  }

  .headerImage__row__image:not(.headerImage__row__image--verticalyCropped) img{
    width: auto; height: 100%;
    margin: 0px -100%;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage headerImage
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: headerImage.init.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
/* the main container */
@media screen {
  .headerImage{
    width: 100%; position: relative;
  }
  
  .headerImage:not(.headerImage--hero){ height: 600px;}
}
@media screen and (min-width: 701px) {
  .headerImage--hero{ height: -webkit-calc(100vh - 80px); height: calc(100vh - 80px);}
}
@media screen and (max-width: 700px) {
  .headerImage--hero{ height: -webkit-calc(100vh - 60px); height: calc(100vh - 60px);}
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage headerImage
 * @author     gueldner
 * @since      15.11.2016
 * @version    $Id: headerImage.simpleDots.css 745 2017-02-21 14:13:25Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .headerImage__simpleDots{
    position: absolute; bottom: 25px; left: 0px;
    width: 100%; text-align: center;
    z-index: 1;
  }

  .headerImage__simpleDots__element{
    display: inline-block; width: 15px; height: 15px;
    -webkit-border-radius: 50%;
            border-radius: 50%; margin: 0px 5px;
    cursor: pointer;
  }

  .headerImage__simpleDots__element:not(.headerImage__simpleDots__element--active){
    background: rgba(255, 255, 255, 0.25);
  }
  .headerImage__simpleDots__element--active{
    background: #fff;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage imageTeaser
 * @author     gueldner
 * @since      10.11.2016
 * @version    $Id: imageTeaser.image.css 893 2018-01-25 08:40:01Z mueller $
 **/

/*  =========================================================
general structure
inImage info
tipp element
avatar
========================================================== */

/*  =========================================================
general structure
========================================================= */
@media screen {
  .imageTeaser__image {
    position: relative;
    display: block;
    width: 100%;
    height: 0px;
    overflow: hidden;
    margin: 0px;
    padding: 0px 0px 52.415% /* 434/828 */ 0px;
    background: #fff;
  }

  .imageWrapper {
    width: -webkit-calc(66.666666% - 20px);
    width: calc(66.666666% - 20px);
  }

  .imageWrapper.left {
    float: left;
  }

  .imageWrapper.right {
    float: right;
  }

  .imageTeaser__image--l {
    width: 100%;
    float: left;
    position: relative;
    overflow: hidden;
    margin: 0px;
    padding: 0px 0px 58.385744% /* 557/954 */ 0px;
    background: #fff;
  }

  .imageTeaser__image--xl {
    position: relative;
    display: block;
    width: 100%;
    height: 0px;
    overflow: hidden;
    margin: 0px;
    padding: 0px 0px 40.705882% /* 519/1252 */ 0px;
    background: #fff;
  }
}

@media screen and (max-width: 900px) {
  .imageWrapper {
    width: 100%;
  }
}

@media screen and (max-width: 600px) {
  .imageTeaser__image--xl {
    padding: 0px 0px 100% 0px;
  }
}

@media screen {
  .imageTeaser__image__picture {
    position: absolute;
    top: 0px;
    left: 0px;
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;

    -webkit-transition: opacity 0.5s ease, -webkit-transform 0.5s ease;

    transition: opacity 0.5s ease, -webkit-transform 0.5s ease;

    transition: transform 0.5s ease, opacity 0.5s ease;

    transition: transform 0.5s ease, opacity 0.5s ease, -webkit-transform 0.5s ease;
  }

  .imageTeaser__image__picture > img {
    display: block;
    width: 100%;
    height: auto;
  }
}

@media screen and (max-width: 600px) {
  .imageTeaser__image--xl .imageTeaser__image__picture > img {
    width: auto;
    height: 100%;
  }
}

@media screen {
  .imageTeaser:active .imageTeaser__image__picture,
  .imageTeaser:focus .imageTeaser__image__picture,
  .imageTeaser:hover .imageTeaser__image__picture {
    -webkit-transform: rotateZ(-2deg) scale(1.1);
        -ms-transform: rotate(-2deg) scale(1.1);
            transform: rotateZ(-2deg) scale(1.1);
    opacity: 0.5;
  }
}

/*  =========================================================
inImage info
========================================================= */
@media screen {
  .imageTeaser__image__info {
    position: absolute;
    top: 24px;
    right: 0px;
    background: #fff;
    padding: 5px 10px;

    font: 400 normal 20px/28px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    font-weight: 400;
    color: #4b4a49;
  }
}

/*  =========================================================
tipp element
========================================================= */
@media screen {
  .imageTeaser--tipp > .imageTeaser__image:after {
    content: '';
    position: absolute;
    top: 0px;
    left: 30px;
    display: block;
    width: 50px;
    height: 55px;
    background: url('../images/icon-tipp.d4e41cb8.svg') 0px 0px no-repeat;
    background-size: contain;
  }
}

/*  =========================================================
avatar
========================================================= */
@media screen {

  .gridSection__col_2v4 .imageTeaser__text.has__avatar {
    position: relative;
    padding: 100px 45px 30px 45px;
  }

  .imageTeaser__avatar {
    width: 143px;
    height: 143px;
    position: absolute;
    top: -75px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
        transform: translateX(-50%);
    z-index: 1;
    border: 3px solid #fff;
    -webkit-border-radius: 100%;
            border-radius: 100%;
    margin: 0;
    overflow: hidden;
  }

  .imageTeaser__avatar img {
    width: 100%;
    height: auto;
  }

  .imageTeaser__text--l .imageTeaser__avatar {
    top: 45px;
    left: -75px;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
  }

  .imageTeaser__text--l .imageTeaser__avatar--right {
    left: 91%;
  }
}

@media screen and (max-width: 1100px) {
  .gridSection__col_2v4 .imageTeaser__text.has__avatar {
    position: relative;
    padding: 50px 45px 30px 45px;
  }

  .imageTeaser__avatar {
    top: -47px;
  }
}

@media screen and (max-width: 1200px) {
  .imageTeaser__text--l .imageTeaser__avatar {
    top: 45px;
    left: -103px;
    -webkit-transform: none;
        -ms-transform: none;
            transform: none;
  }
  .imageTeaser__text--l .imageTeaser__avatar--right {
    left: 91%;
  }
}

@media screen and (max-width: 1100px) {
  .imageTeaser__avatar {
    width: 87px;
    height: 87px;
  }
  .imageTeaser__text--l .imageTeaser__avatar--right {
    left: 91%;
  }
}

@media screen and (max-width: 900px) {
  .imageTeaser__text--l .imageTeaser__avatar {
    top: -47px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
        transform: translateX(-50%);
  }
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage imageTeaser
 * @author     gueldner
 * @since      10.11.2016
 * @version    $Id: imageTeaser.init.css 916 2018-02-26 14:44:03Z mueller $
 **/

/*  =========================================================
general structure
link
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .imageTeaser{
    text-align: left;
    position: relative; overflow: hidden;
  }

  .imageTeaser{
    margin: 0px 0px 20px 0px;
  }
}

/*  =========================================================
link
========================================================= */
@media screen {
  .imageTeaser > a{
    position: absolute; top: 0; left: 0;
    display: block; width: 100%; height: 100%;
    text-indent: -100%;
    z-index: 1;
  }
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage imageTeaser
 * @author     gueldner
 * @since      10.11.2016
 * @version    $Id: imageTeaser.text.css 884 2018-01-24 11:54:23Z mueller $
 **/

/*  =========================================================
general structure
headline
line
text
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .imageTeaser__text {
    background: #fff; color: #4b4a49;
  }
}

@media screen {
  .imageTeaser__text--xl{
    width: 100%;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%,-50%);
        -ms-transform: translate(-50%,-50%);
            transform: translate(-50%,-50%);
    z-index: 1;
  }
}

@media screen {
  .imageTeaser__text--l{
    width: 33.333333%;
    float: left;
    position: relative;
    color: #4b4a49;
  }
}
@media screen and (max-width: 900px) {
  .imageTeaser__text--l{
    width: 100%;
  }
}

/* different size padding settings */
@media screen and (min-width: 1201px) {
  .gridSection__col_2v3 .imageTeaser__text,
  .gridSection__col_3v3 .imageTeaser__text,
  .gridSection__col_3v4 .imageTeaser__text,
  .gridSection__col_4v4 .imageTeaser__text{
    padding: 50px;
  }
  .gridSection__col_2v4 .imageTeaser__text{ padding: 30px 45px;}
  .gridSection__col_1v3 .imageTeaser__text{ padding: 20px 25px;}
  .gridSection__col_1v4 .imageTeaser__text{ padding: 20px 15px;}
}

@media screen and (max-width: 1200px) and (min-width: 801px) {
  .gridSection__col_1v3 .imageTeaser__text,
  .gridSection__col_2v3 .imageTeaser__text,
  .gridSection__col_3v3 .imageTeaser__text,
  .gridSection__col_1v4 .imageTeaser__text,
  .gridSection__col_2v4 .imageTeaser__text,
  .gridSection__col_3v4 .imageTeaser__text,
  .gridSection__col_4v4 .imageTeaser__text{
    padding: 20px 25px;
  }
}

@media screen and (max-width: 800px) {
  .gridSection__col_1v3 .imageTeaser__text,
  .gridSection__col_2v3 .imageTeaser__text,
  .gridSection__col_3v3 .imageTeaser__text,
  .gridSection__col_1v4 .imageTeaser__text,
  .gridSection__col_2v4 .imageTeaser__text,
  .gridSection__col_3v4 .imageTeaser__text,
  .gridSection__col_4v4 .imageTeaser__text{
    padding: 20px 15px;
  }
}

/*  =========================================================
headline
========================================================= */
@media screen {
  .imageTeaser__text > h3{
    font-weight: 300; margin: 0px; padding: 0px;
    word-wrap: break-word;
    hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto;
  }
}

/* different size settings */
@media screen and (min-width: 1201px) {
  .gridSection__col_1v3 .imageTeaser__text > h3,
  .gridSection__col_2v3 .imageTeaser__text > h3,
  .gridSection__col_3v3 .imageTeaser__text > h3,
  .gridSection__col_2v4 .imageTeaser__text > h3,
  .gridSection__col_3v4 .imageTeaser__text > h3,
  .gridSection__col_4v4 .imageTeaser__text > h3{
    font: 300 normal 30px/42px 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
  .gridSection__col_1v4 .imageTeaser__text > h3{ font: 300 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
  .gridSection .imageTeaser__text--l > h3{
    font: 300 normal 40px/55px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    padding: 0 50px;
    margin: 50px 0 0 0;
  }
  .gridSection .imageTeaser__text--l.has__avatar > h3{
    padding: 0 20px 0 105px;
  }
  .gridSection .imageTeaser__text--xl > h3{
    font: 700 normal 60px/60px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #fff;
    text-align: center;
    cursor: pointer;
    margin: 0;
  }
}

@media screen and (max-width: 1200px) and (min-width: 1100px) {
  .imageTeaser__text--l > h3{
    font: 300 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    padding: 0 50px;
    margin: 20px 0 0 0;
  }
  .imageTeaser__text--l.has__avatar > h3{
    margin: 50px 0 0 0;
  }
}
@media screen and (max-width: 1200px) and (min-width: 801px) {
  .imageTeaser__text > h3{ font: 300 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
  .imageTeaser__text--xl > h3{
    font: 300 normal 40px/40px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #fff;
    text-align: center;
    cursor: pointer;
    margin: 0;
  }
}
@media screen and (max-width: 1100px) and (min-width: 800px) {
  .imageTeaser__text--l > h3{
    font: 300 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    padding: 0 20px;
    margin: 20px 0 0 0;
  }
  .imageTeaser__text--l.has__avatar > h3{
    margin: 50px 0 0 0;
  }
}
@media screen and (max-width: 800px) {
  .imageTeaser__text > h3{ font: 400 normal 20px/30px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
  .imageTeaser__text--l > h3{ font: 400 normal 20px/30px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
  .imageTeaser__text--xl > h3{
    font: 400 normal 20px/30px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #fff;
    text-align: center;
    cursor: pointer;
    margin: 0;
  }
}
@media screen and (max-width: 800px) {
  .imageTeaser__text--l > h3{
    font: 300 normal 20px/30px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    padding: 0 20px;
    margin: 20px 0 0 0;
  }
  .imageTeaser__text--l.has__avatar > h3{
    margin: 50px 0 0 0;
  }
}

/*  =========================================================
line
========================================================= */
@media screen {
  .imageTeaser__text > hr{
    width: 35%; border-color: #4b4a49;
    display: inline-block;
  }
  .imageTeaser__text--l > hr{
    width: 80%; border-color: #4b4a49;
    display: inline-block;
    margin: 20px 0px;
  }
}

@media screen and (max-width: 800px) {
  .imageTeaser__text--l > hr{
    width: 35%;
    margin: 20px 0px 20px -50px;
  }
}

/* different size settings */
@media screen {
  .gridSection__col_2v3 .imageTeaser__text > hr,
  .gridSection__col_3v3 .imageTeaser__text > hr,
  .gridSection__col_2v4 .imageTeaser__text > hr,
  .gridSection__col_3v4 .imageTeaser__text > hr,
  .gridSection__col_4v4 .imageTeaser__text > hr{
    margin: 20px 0px 20px -50px;
  }
  .gridSection__col_1v3 .imageTeaser__text > hr{ margin: 20px 0px 20px -25px;}
  .gridSection__col_1v4 .imageTeaser__text > hr{ margin: 20px 0px 20px -15px;}
}

/*  =========================================================
text
========================================================= */
@media screen {
  .imageTeaser__text > p,
  .imageTeaser__text--l > p{
    font-weight: 400; margin: 0px; padding: 0px;
    word-break: keep-all;
  }
  .imageTeaser__text--l > p{
    padding: 0 50px;
    -webkit-hyphens: auto;
       -moz-hyphens: auto;
        -ms-hyphens: auto;
            hyphens: auto;
  }

  .imageTeaser__text > p:after,
  .imageTeaser__text--l > p:after{
    content: '\e906';
    font: 400 normal 1em 'icomoon'; color: #26547d;
    margin-left: 15px;
  }
}

@media screen {
  .imageTeaser__text--xl > p{
    font: 700 normal 18px/18px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #fff;
    text-align: center;
    margin: 10px 0 0 0; padding: 0px;
    word-break: keep-all;
    cursor: pointer;
  }
  .imageTeaser__text--xl > p:after{
    content: '\e906';
    font: 300 normal 1em 'icomoon'; color: #fff;
    margin-left: 15px;
    cursor: pointer;
  }
}

@media screen and (min-width: 1201px) {
  .imageTeaser__text > p,
  .imageTeaser__text--l > p,
  .imageTeaser__text--xl > p{
    font: 400 normal 18px/26px 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 1200px) {
  .imageTeaser__text > p,
  .imageTeaser__text--l > p,
  .imageTeaser__text--xl > p{
    font: 400 normal 16px/26px 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 1100px) {
  .imageTeaser__text--l > p{
    padding: 0 20px 15px 20px;
  }
}

/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/*! jQuery UI - v1.10.4 - 2016-12-16
* http://jqueryui.com
* Includes: jquery.ui.core.css, jquery.ui.autocomplete.css, jquery.ui.menu.css, jquery.ui.theme.css
* To view and modify this theme, visit http://jqueryui.com/themeroller/?ffDefault=Arial%2CHelvetica%2Csans-serif&fsDefault=1em&fwDefault=normal&cornerRadius=3px&bgColorHeader=e9e9e9&bgTextureHeader=flat&borderColorHeader=dddddd&fcHeader=333333&iconColorHeader=444444&bgColorContent=ffffff&bgTextureContent=flat&borderColorContent=dddddd&fcContent=333333&iconColorContent=444444&bgColorDefault=f6f6f6&bgTextureDefault=flat&borderColorDefault=c5c5c5&fcDefault=454545&iconColorDefault=777777&bgColorHover=ededed&bgTextureHover=flat&borderColorHover=cccccc&fcHover=2b2b2b&iconColorHover=555555&bgColorActive=007fff&bgTextureActive=flat&borderColorActive=003eff&fcActive=ffffff&iconColorActive=ffffff&bgColorHighlight=fffa90&bgTextureHighlight=flat&borderColorHighlight=dad55e&fcHighlight=777620&iconColorHighlight=777620&bgColorError=fddfdf&bgTextureError=flat&borderColorError=f1a899&fcError=5f3f3f&iconColorError=cc0000&bgColorOverlay=aaaaaa&bgTextureOverlay=flat&bgImgOpacityOverlay=0&opacityOverlay=30&bgColorShadow=666666&bgTextureShadow=flat&bgImgOpacityShadow=0&opacityShadow=30&thicknessShadow=5px&offsetTopShadow=0px&offsetLeftShadow=0px&cornerRadiusShadow=8px
* Copyright jQuery Foundation and other contributors; Licensed MIT */

/* Layout helpers
----------------------------------*/
.ui-helper-hidden {
  display: none;
}
.ui-helper-hidden-accessible {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.ui-helper-reset {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  line-height: 1.3;
  text-decoration: none;
  font-size: 100%;
  list-style: none;
}
.ui-helper-clearfix:before,
.ui-helper-clearfix:after {
  content: "";
  display: table;
  border-collapse: collapse;
}
.ui-helper-clearfix:after {
  clear: both;
}
.ui-helper-clearfix {
  min-height: 0; /* support: IE7 */
}
.ui-helper-zfix {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  position: absolute;
  opacity: 0;
  filter:Alpha(Opacity=0);
}

.ui-front {
  z-index: 100;
}


/* Interaction Cues
----------------------------------*/
.ui-state-disabled {
  cursor: default !important;
}


/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
  display: block;
  text-indent: -99999px;
  overflow: hidden;
  background-repeat: no-repeat;
}


/* Misc visuals
----------------------------------*/

/* Overlays */
.ui-widget-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.ui-autocomplete {
  position: absolute;
  top: 0;
  left: 0;
  cursor: default;
}
.ui-menu {
  list-style: none;
  padding: 2px;
  margin: 0;
  display: block;
  outline: none;
}
.ui-menu .ui-menu {
  margin-top: -3px;
  position: absolute;
}
.ui-menu .ui-menu-item {
  margin: 0;
  padding: 0;
  width: 100%;
  /* support: IE10, see #8844 */
  list-style-image: url(data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7);
}
.ui-menu .ui-menu-divider {
  margin: 5px -2px 5px -2px;
  height: 0;
  font-size: 0;
  line-height: 0;
  border-width: 1px 0 0 0;
}
.ui-menu .ui-menu-item a {
  text-decoration: none;
  display: block;
  padding: 2px .4em;
  line-height: 1.5;
  min-height: 0; /* support: IE7 */
  font-weight: normal;
}
.ui-menu .ui-menu-item a.ui-state-focus,
.ui-menu .ui-menu-item a.ui-state-active {
  font-weight: normal;
  margin: -1px;
}

.ui-menu .ui-state-disabled {
  font-weight: normal;
  margin: .4em 0 .2em;
  line-height: 1.5;
}
.ui-menu .ui-state-disabled a {
  cursor: default;
}

/* icon support */
.ui-menu-icons {
  position: relative;
}
.ui-menu-icons .ui-menu-item a {
  position: relative;
  padding-left: 2em;
}

/* left-aligned */
.ui-menu .ui-icon {
  position: absolute;
  top: .2em;
  left: .2em;
}

/* right-aligned */
.ui-menu .ui-menu-icon {
  position: static;
  float: right;
}

/* Component containers
----------------------------------*/
.ui-widget {
  font-family: Arial,Helvetica,sans-serif;
  font-size: 1em;
}
.ui-widget .ui-widget {
  font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
  font-family: Arial,Helvetica,sans-serif;
  font-size: 1em;
}
.ui-widget-content {
  border: 1px solid #dddddd;
  background: #ffffff;
  color: #333333;
}
.ui-widget-content a {
  color: #333333;
}
.ui-widget-header {
  border: 1px solid #dddddd;
  background: #e9e9e9;
  color: #333333;
  font-weight: bold;
}
.ui-widget-header a {
  color: #333333;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
  border: 1px solid #c5c5c5;
  background: #f6f6f6;
  font-weight: normal;
  color: #454545;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited {
  color: #454545;
  text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus {
  border: 1px solid #cccccc;
  background: #ededed;
  font-weight: normal;
  color: #2b2b2b;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited {
  color: #2b2b2b;
  text-decoration: none;
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active {
  border: 1px solid #003eff;
  background: #007fff;
  font-weight: normal;
  color: #ffffff;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
  color: #ffffff;
  text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
  border: 1px solid #dad55e;
  background: #fffa90;
  color: #777620;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
  color: #777620;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
  border: 1px solid #f1a899;
  background: #fddfdf;
  color: #5f3f3f;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
  color: #5f3f3f;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
  color: #5f3f3f;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
  font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
  opacity: .7;
  filter:Alpha(Opacity=70);
  font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
  opacity: .35;
  filter:Alpha(Opacity=35);
  background-image: none;
}
.ui-state-disabled .ui-icon {
  filter:Alpha(Opacity=35); /* For IE8 - See #6059 */
}

/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
  width: 16px;
  height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
  background-image: url("images/ui-icons_444444_256x240.png");
}
.ui-widget-header .ui-icon {
  background-image: url("images/ui-icons_444444_256x240.png");
}
.ui-state-default .ui-icon {
  background-image: url("images/ui-icons_777777_256x240.png");
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon {
  background-image: url("images/ui-icons_555555_256x240.png");
}
.ui-state-active .ui-icon {
  background-image: url("images/ui-icons_ffffff_256x240.png");
}
.ui-state-highlight .ui-icon {
  background-image: url("images/ui-icons_777620_256x240.png");
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
  background-image: url("images/ui-icons_cc0000_256x240.png");
}

/* positioning */
.ui-icon-blank { background-position: 16px 16px; }
.ui-icon-carat-1-n { background-position: 0 0; }
.ui-icon-carat-1-ne { background-position: -16px 0; }
.ui-icon-carat-1-e { background-position: -32px 0; }
.ui-icon-carat-1-se { background-position: -48px 0; }
.ui-icon-carat-1-s { background-position: -64px 0; }
.ui-icon-carat-1-sw { background-position: -80px 0; }
.ui-icon-carat-1-w { background-position: -96px 0; }
.ui-icon-carat-1-nw { background-position: -112px 0; }
.ui-icon-carat-2-n-s { background-position: -128px 0; }
.ui-icon-carat-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -64px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -64px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 0 -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }
.ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-on { background-position: -96px -144px; }
.ui-icon-radio-off { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px; }
.ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px; }
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
.ui-icon-squaresmall-close { background-position: -80px -208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }


/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
  -webkit-border-top-left-radius: 3px;
          border-top-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
  -webkit-border-top-right-radius: 3px;
          border-top-right-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
  -webkit-border-bottom-left-radius: 3px;
          border-bottom-left-radius: 3px;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
  -webkit-border-bottom-right-radius: 3px;
          border-bottom-right-radius: 3px;
}

/* Overlays */
.ui-widget-overlay {
  background: #aaaaaa;
  opacity: .3;
  filter: Alpha(Opacity=30);
}
.ui-widget-shadow {
  margin: 0px 0 0 0px;
  padding: 5px;
  background: #666666;
  opacity: .3;
  filter: Alpha(Opacity=30);
  -webkit-border-radius: 8px;
          border-radius: 8px;
}

/*! fancyBox v2.1.4 fancyapps.com | fancyapps.com/fancybox/#license */
.fancybox-wrap,
.fancybox-skin,
.fancybox-outer,
.fancybox-inner,
.fancybox-image,
.fancybox-wrap iframe,
.fancybox-wrap object,
.fancybox-nav,
.fancybox-nav span,
.fancybox-tmp
{
  padding: 0;
  margin: 0;
  border: 0;
  outline: none;
  vertical-align: top;
}

.fancybox-wrap {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 8020;
}

.fancybox-skin {
  position: relative;
  background: #f9f9f9;
  color: #444;
  text-shadow: none;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.fancybox-opened {
  z-index: 8030;
}

.fancybox-opened .fancybox-skin {
  -webkit-box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
}

.fancybox-outer, .fancybox-inner {
  position: relative;
}

.fancybox-inner {
  overflow: hidden;
}

.fancybox-type-iframe .fancybox-inner {
  -webkit-overflow-scrolling: touch;
}

.fancybox-error {
  color: #444;
  font: 14px/20px "Helvetica Neue",Helvetica,Arial,sans-serif;
  margin: 0;
  padding: 15px;
  white-space: nowrap;
}

.fancybox-image, .fancybox-iframe {
  display: block;
  width: 100%;
  height: 100%;
}

.fancybox-image {
  max-width: 100%;
  max-height: 100%;
}

#fancybox-loading, .fancybox-close, .fancybox-prev span, .fancybox-next span {
  background-image: url('/portal/assets/images/vendor/fancybox/fancybox_sprite.png');
}

#fancybox-loading {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -22px;
  margin-left: -22px;
  background-position: 0 -108px;
  opacity: 0.8;
  cursor: pointer;
  z-index: 8060;
}

#fancybox-loading div {
  width: 44px;
  height: 44px;
  background: url('/portal/assets/images/vendor/fancybox/fancybox_loading.gif') center center no-repeat;
}

.fancybox-close {
  position: absolute;
  top: -18px;
  right: -18px;
  width: 36px;
  height: 36px;
  cursor: pointer;
  z-index: 8040;
}

.fancybox-nav {
  position: absolute;
  top: 0;
  width: 40%;
  height: 100%;
  cursor: pointer;
  text-decoration: none;
  background: transparent url('/portal/assets/images/vendor/fancybox/blank.gif'); /* helps IE */
  -webkit-tap-highlight-color: rgba(0,0,0,0);
  z-index: 8040;
}

.fancybox-prev {
  left: 0;
}

.fancybox-next {
  right: 0;
}

.fancybox-nav span {
  position: absolute;
  top: 50%;
  width: 36px;
  height: 34px;
  margin-top: -18px;
  cursor: pointer;
  z-index: 8040;
  visibility: hidden;
}

.fancybox-prev span {
  left: 10px;
  background-position: 0 -36px;
}

.fancybox-next span {
  right: 10px;
  background-position: 0 -72px;
}

.fancybox-nav:hover span {
  visibility: visible;
}

.fancybox-tmp {
  position: absolute;
  top: -99999px;
  left: -99999px;
  visibility: hidden;
  max-width: 99999px;
  max-height: 99999px;
  overflow: visible !important;
}

/* Overlay helper */

.fancybox-lock {
  overflow: hidden;
}

.fancybox-overlay {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  display: none;
  z-index: 8010;
  background: url('/portal/assets/images/vendor/fancybox/fancybox_overlay.png');
}

.fancybox-overlay-fixed {
  position: fixed;
  bottom: 0;
  right: 0;
}

.fancybox-lock .fancybox-overlay {
  overflow: auto;
  overflow-y: scroll;
}

/* Title helper */

.fancybox-title {
  visibility: hidden;
  font: normal 13px/20px Helvetica,Arial,sans-serif;
  position: relative;
  text-shadow: none;
  z-index: 8050;

  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, .8);

  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.fancybox-opened .fancybox-title {
  visibility: visible;
}

.fancybox-title-float-wrap {
  position: absolute;
  bottom: 0;
  right: 50%;
  margin-bottom: -35px;
  z-index: 8050;
  text-align: center;
}

.fancybox-title-float-wrap .child {
  display: inline-block;
  margin-right: -100%;
  padding: 2px 20px;
  background: transparent; /* Fallback for web browsers that doesn't support RGBa */
  background: rgba(0, 0, 0, 0.8);
  -webkit-border-radius: 15px;
  border-radius: 15px;
  text-shadow: 0 1px 2px #222;
  color: #FFF;
  font-weight: bold;
  line-height: 24px;
  white-space: nowrap;
}

.fancybox-title-outside-wrap {
  position: relative;
  margin-top: 10px;
  color: #fff;
}

.fancybox-title-inside-wrap {
  padding-top: 10px;
}

.fancybox-title-over-wrap {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  padding: 10px;
  background: #000;
  background: rgba(0, 0, 0, .8);
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage offCanvas
 * @author     gueldner
 * @since      24.11.2016
 * @version    $Id: offCanvas.form.checkbox.css 611 2016-12-20 15:13:13Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .offCanvas__element__form [type=checkbox],
  .offCanvas__element__form [type=radio]{
    opacity: 0; position: fixed; top: 50%; right: 150%;
  }
}

@media screen {
  /* spare some space for the fake checkbox */
  .offCanvas__element__form [type=checkbox] + label,
  .offCanvas__element__form [type=radio] + label{
    padding: 0px 0px 0px 35px; margin-bottom: 15px;
  }

  /* the fake checkbox itself */
  .offCanvas__element__form [type=checkbox] + label:before,
  .offCanvas__element__form [type=radio] + label:before{
    display: inline-block; vertical-align: text-top;
    width: 25px; height: 25px;
    background: #fff; color: #7d7c7a;
    -webkit-border-radius: 5px;
            border-radius: 5px; border: 1px #ecebeb solid; -webkit-box-sizing: border-box; box-sizing: border-box;
    margin: 0px 10px 0px -35px;

    font: 400 normal 15px/25px 'icomoon'; text-align: center;
  }

  /* checked/unchecked states */
  .offCanvas__element__form [type=checkbox]:checked + label:before,
  .offCanvas__element__form [type=radio]:checked + label:before{ content: '\e90d';}
  .offCanvas__element__form [type=checkbox]:not(:checked) + label:before,
  .offCanvas__element__form [type=radio]:not(:checked) + label:before{ content: '';}

  /* form error */
  .offCanvas__element__form [type=checkbox] + label.formerror:before,
  .offCanvas__element__form [type=radio] + label.formerror:before{
    background-color: rgb(255, 147, 147);
    color: white;
  }

  .offCanvas__filter_category>label {
    font: 400 normal 20px/24px 'Open Sans',Arial,sans-serif;
    text-align: center;
    color: #fff;
    display: block;
    padding: 15px 0;
    text-align: left;
  }
  .offCanvas__filter_category>[type='checkbox']+label>[class^="icon-"]{
    padding-right: 7px;
  }
  .offCanvas__filter_category>[type='checkbox']:checked+label>.icon-triangleDown,
  .offCanvas__filter_category>[type='checkbox']:not(:checked)+label>.icon-triangleUp,
  .offCanvas__filter_category>[type='checkbox']:not(:checked)~.offCanvas__filter__checkbox {
    display: none;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage offCanvas
 * @author     gueldner
 * @since      24.11.2016
 * @version    $Id: offCanvas.form.css 815 2017-03-13 09:22:08Z schoening $
 **/

/*  =========================================================
general structure
labels in general
row
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .offCanvas__element__form fieldset{
    border: none; padding: 0px;margin: 0px 0px 20px 0px;
  }
  .offCanvas__element__form fieldset.findAccommodations{
    margin:0px 0px -35px 0px;
  }

  /* buttons have to arange on the right side */
  .offCanvas__element__form .-global-button{ float: right;}

  /* info for mandatory fields */
  .offCanvas__element__form__info{
    text-align: right; display: block;
    font: 400 normal 16px/20px 'Open Sans', Arial, sans-serif; color: #fff;
  }
  .-global-button.-global-button__cta.-global-button__large.footerNewsletterButton{
    margin-left:-3px;
  }
}

/*  =========================================================
labels in general
========================================================= */
@media screen {
  .offCanvas__element__form label{
    display: block;
    font: 400 normal 16px/24px 'Open Sans', Arial, sans-serif; color: #fff;
  }

  .offCanvas__element__form label > em{
    font: 400 italic 16px/24px 'Open Sans', Arial, sans-serif; color: #fff;
  }
  .offCanvas__element__form label > strong{
    font: 700 normal 16px/24px 'Open Sans', Arial, sans-serif; color: #fff;
  }
  .offCanvas__element__form label > span{
    font: 400 normal 20px/24px 'Open Sans', Arial, sans-serif; color: #fff;
  }
}

/*  =========================================================
row
========================================================= */
@media screen {
  .offCanvas__element__form__row{
    display: inline-block; width: 50%;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; padding-right: 10px;
  }

  :not(.childAgeContainer) > .offCanvas__element__form__row + .offCanvas__element__form__row,
  .childAgeContainer > .offCanvas__element__form__row:nth-child(2n){
    padding-right: 0px; padding-left: 10px;
  }
}

@media screen {
  .offCanvas__element__form__row > .offCanvas__element__form__select{
    width: 100%;
  }
}



/*  =========================================================
success
========================================================= */

@media screen and (min-width: 801px) {

  .offCanvas__element__form.success h2{
    color: #23af35;
    font: 300 normal 30px/42px 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
  .offCanvas__element__form.success > .offCanvas__element__form__info,
  .offCanvas__element__form.success > fieldset {
    display: none;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage offCanvas
 * @author     gueldner
 * @since      24.11.2016
 * @version    $Id: offCanvas.form.inputs.css 772 2017-02-27 14:28:26Z schoening $
 **/

/*  =========================================================
general structure
icon helper
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .offCanvas__element__form input[type=text],
  .offCanvas__element__form input[type=email],
  .offCanvas__element__form input[type=date]{
    display: block; width: 100%; height: 40px;

    font: 400 normal 16px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    background: #fff; color: #7d7c7a;

    -webkit-border-radius: 5px;

            border-radius: 5px; border: 1px #ecebeb solid; -webkit-box-sizing: border-box; box-sizing: border-box;
    padding: 0px 10px; box-sizing: border-box;
  }

  .offCanvas__element__form :not(.offCanvas__element__form__iconInput) > input[type=text],
  .offCanvas__element__form :not(.offCanvas__element__form__iconInput) > input[type=email],
  .offCanvas__element__form :not(.offCanvas__element__form__iconInput) > input[type=date]{
    margin-bottom: 15px;
  }

  /* form error */
  .offCanvas__element__form input[type=text].formerror,
  .offCanvas__element__form input[type=date].formerror,
  .offCanvas__element__form input[type=email].formerror{
    background-color: rgb(255, 147, 147);
    color: white;
  }

  .offCanvas__element__form [type=checkbox].formerror + label,
  .offCanvas__element__form .formerror{
    color: red;
  }

  .offCanvas__element__form.formerror:checked + label{
    color: inherit;
  }
}

/*  =========================================================
icon helper
========================================================= */
@media screen {
  .offCanvas__element__form__iconInput{
    position: relative;
    display: block; overflow: hidden;
    margin-bottom: 15px;
  }
  .offCanvas__element__form__iconInput > input{
    width: 100%; padding-right: 55px!important;
    margin-bottom: 0px;
  }
  .offCanvas__element__form input[type=text]:disabled,
  .offCanvas__element__form input[type=email]:disabled,
  .offCanvas__element__form input[type=date]:disabled{
    background-color: #e0e0e0;
  }
}

@media screen {
  .offCanvas__element__form__iconInput > label{
    width: 40px; height: 100%; margin: 0px;
    position: absolute; top: 0px; right: 0px;

    border-left: 1px #ecebeb solid; color: #667481;
    font-size: 20px; line-height: 35px; text-align: center;

    pointer-events: none;
  }
}


/* hackfix for the damn shit in the offerrequest form*/
@media screen and (max-width: 393px) and (min-width: 290px){
  .offCanvas__element__form__row label[for="offerrequest--children"]{
    padding-top: 24px;
  }
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage offCanvas
 * @author     gueldner
 * @since      24.11.2016
 * @version    $Id: offCanvas.form.select.css 514 2016-12-09 11:12:31Z mueller $
 **/

/*  =========================================================
general structure
drop down label
select box itself
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .offCanvas__element__form__select{
    position: relative;
    display: inline-block; vertical-align: middle; overflow: hidden;
    margin-bottom: 15px;

    -webkit-border-radius: 5px;

            border-radius: 5px; border: 1px #ecebeb solid; background: #fff;
  }

  .offCanvas__element__form__select > select{ width: 100%;}
}

/*  =========================================================
drop down label
========================================================= */
@media screen {
  .offCanvas__element__form__select > label{
    width: 40px; height: 100%; margin: 0px;
    position: absolute; top: 0px; right: 0px;

    border-left: 1px #ecebeb solid; background: #fff; color: #667481;
    font-size: 15px; line-height: 33px; text-align: center;

    pointer-events: none;
  }
}

/*  =========================================================
select box itself
========================================================= */
@media screen {
  .offCanvas__element__form__select > select{
    height: 33px; -webkit-border-radius: 5px; border-radius: 5px; min-width: 150px;
    display: inline-block; vertical-align: middle;

    font: 400 normal 16px 'Comfortaa', 'Open Sans', Arial, sans-serif;

    background: #fff; color: #7d7c7a;
    border: none; padding: 0px 0px 0px 10px;
  }

  .offCanvas__element__form__select > select > option{
    font: 400 normal 14px 'Open Sans', Arial, sans-serif;
  }

  /* form error */
  .offCanvas__element__form__select > select.formerror{
    background-color: rgb(255, 147, 147);
    color: white;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage offCanvas
 * @author     gueldner
 * @since      24.11.2016
 * @version    $Id: offCanvas.init.css 816 2017-03-14 10:40:44Z schoening $
 **/

/*  =========================================================
general structure
offCanvas element
header
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  #offCanvas{
    position: fixed; top: 0px; left: 0px;
    height: 100vh; width: 0px;
    z-index: 2;
    -webkit-transition: height 0.25s ease, top 0.25s ease;
    transition: height 0.25s ease, top 0.25s ease;
  }
}

@media screen and (min-width: 701px) {
  #pageHeader:not(.-js-pageHeader--hidden) ~ #offCanvas{ top: 80px; height: -webkit-calc(100vh - 80px); height: calc(100vh - 80px);}
}
@media screen and (max-width: 700px) and (min-height: 401px) {
  #pageHeader:not(.-js-pageHeader--hidden) ~ #offCanvas{ top: 60px; height: -webkit-calc(100vh - 60px); height: calc(100vh - 60px);}
}
@media screen and (max-width: 400px){
  #pageHeader:not(.-js-pageHeader--hidden) ~ #offCanvas{ top: 100px; height: -webkit-calc(100vh - 100px); height: calc(100vh - 100px);}
}

/*  =========================================================
offCanvas element
========================================================= */
@media screen {
  .offCanvas__element{
    position: absolute; top: 0px; left: 0px;
    height: 100%; width: 400px; max-width: -webkit-calc(100vw - 17px); max-width: calc(100vw - 17px);
    background: #667481; overflow: hidden;

    -webkit-transition: left 0.25s ease;

    transition: left 0.25s ease;
    -webkit-overflow-scrolling: touch;
  }

  .offCanvas__element:not(.offCanvas__element--visible){ left: -400px;}
  .offCanvas__element--visible{ left: 0px;}
}

/* close element */
@media screen {
  .offCanvas__element__close{
    position: absolute; right: 17px; top: 19px;
    font-size: 35px; color: #fff; text-decoration: none;
  }
}

/* content area*/
@media screen {
  .offCanvas__element__content{
    position: relative;
    width: 100%; max-height: 100%; overflow-y: auto;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; padding: 8.75% /* 35/400 */;
  }
}

/*  =========================================================
header
========================================================= */
@media screen {
  .offCanvas__element__header{ padding-right: 35px;}

  .offCanvas__element__header > h3{
    margin: 0px; padding: 0px; color: #fff;
    word-wrap: break-word;
    hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto;
  }
}
@media screen and (min-width: 801px) {
  .offCanvas__element__header > h3{ font: 300 normal 30px/42px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
}
@media screen and (max-width: 800px) {
  .offCanvas__element__header > h3{ font: 400 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
}

@media screen {
  .offCanvas__element__header > hr{
    width: 65%; border-color: #fff;
    margin: 15px 0px 15px -11.864% /* 35/295 */;
  }
}

@media screen and (max-width: 450px) {
  .offCanvas__element__content.quickHostSearch{
    padding-bottom:120px;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageFooter
 * @author     gueldner
 * @since      11.11.2016
 * @version    $Id: pageFooter.init.css 684 2017-02-08 09:11:04Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  #pageFooter{
    background: #7d7c7a; padding: 50px 0px;
    margin-top: 0px;
    color: #fff; text-align: center;
  }

  #pageFooter > .gridSection{ text-align: left;}
} 
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageFooter
 * @author     gueldner
 * @since      11.11.2016
 * @version    $Id: pageFooter.linkList.css 680 2017-02-07 15:42:26Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .pageFooter__linklist > a{
    position: relative;
    font-weight: 400; text-decoration: underline;
  }

  .pageFooter__linklist > a:not(:last-child){ margin-right: 30px;}
  .pageFooter__linklist > a:not(:last-child):after{
    content: '-';
    position: absolute; top: 0px; right: -20px;
    text-decoration: underline;
  }
  .pageFooter__linklist > a:not(:last-child):after{
    text-decoration: none;
  }
}

@media screen and (min-width: 801px) {
  .pageFooter__linklist > a{
    font: 400 normal 18px 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 800px) {
  .pageFooter__linklist > a{
    font: 400 normal 16px 'Open Sans', Arial, sans-serif;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageFooter
 * @author     gueldner
 * @since      11.11.2016
 * @version    $Id: pageFooter.newsletter.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  #pageFooter__newsletter{ margin-bottom: 50px;}
  
  
  #pageFooter__newsletter > input{
    display: inline-block; vertical-align: top;
    width: 50%; -webkit-box-sizing: border-box; box-sizing: border-box;
    
    padding: 10px 20px; background: #fff;
    border: none; font-weight: 300; color: #4c5660;
  }
  
  #pageFooter__newsletter > .-global-button{ vertical-align: top;}
}

@media screen and (min-width: 701px) {
  #pageFooter__newsletter > input{ font: 300 normal 18px/26px 'Comfortaa', 'Open Sans', Arial, sans-serif; height: 50px;}
}
@media screen and (max-width: 700px) {
  #pageFooter__newsletter > input{ font: 300 normal 16px/24px 'Comfortaa', 'Open Sans', Arial, sans-serif; height: 45px;}
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageFooter
 * @author     gueldner
 * @since      11.11.2016
 * @version    $Id: pageFooter.text.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
headline
line
text
list
========================================================== */


/*  =========================================================
headline
========================================================= */
@media screen {
  #pageFooter h3{
    font-weight: 300;
    margin: 0px; padding: 0px;
  }
}

@media screen and (min-width: 801px) {
  #pageFooter h3{
    font: 300 normal 35px/45px 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 800px) {
  #pageFooter h3{
    font: 300 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
}

/*  =========================================================
list
========================================================= */
@media screen {
  #pageFooter hr{
    width: 50%; border-color: #fff;
    display: inline-block;
  }
}

@media screen and (min-width: 801px) {
  #pageFooter hr{ margin: 20px 0px;}
}

@media screen and (max-width: 800px) {
  #pageFooter hr{ margin: 10px 0px;}
}

/*  =========================================================
text
========================================================= */
@media screen {
  #pageFooter p{
    font-weight: 400; margin: 0px 0px 30px 0px; padding: 0px;
  }
}

@media screen and (min-width: 801px) {
  #pageFooter p{
    font: 400 normal 18px/26px 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 800px) {
  #pageFooter p{
    font: 400 normal 16px/26px 'Open Sans', Arial, sans-serif;
  }
}

@media screen {
  #pageFooter p > .-global-button{ margin: 10px 10px 0px 0px;}
  #pageFooter p > .-global-button[class*='icon-']{
    font-weight: 400; font-size: 25px;
  }
}

/*  =========================================================
list
========================================================= */
@media screen {
  #pageFooter ul{
    list-style: square; margin: 0px; padding: 0px 0px 0px 20px;
  }
  #pageFooter ul > li{
    font-weight: 400; margin: 0px 0px 10px 0px; padding: 0px;
  }
}

@media screen and (min-width: 801px) {
  #pageFooter ul > li{
    font: 400 normal 18px/26px 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 800px) {
  #pageFooter ul > li{
    font: 400 normal 16px/26px 'Open Sans', Arial, sans-serif;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageHeader
 * @author     gueldner
 * @since      28.11.2016
 * @version    $Id: pageHeader.autocomplete.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
headline
hitlist
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  #pageHeader__autocomplete{
    position: absolute; left: 0px; right: 0px;
    height: auto; -webkit-box-sizing: border-box; box-sizing: border-box;
    background: #f2efeb;
    -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
            box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
  }
  
  #pageHeader.-js-pageHeader--hidden #pageHeader__autocomplete{ max-height: 100vh;}
}

@media screen and (min-width: 1001px) {
  #pageHeader__autocomplete{ top: 80px;}
  #pageHeader:not(.-js-pageHeader--hidden) #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 80px); max-height: calc(100vh - 80px);}
}
@media screen and (max-width: 1000px) and (min-width: 701px) {
  #pageHeader__functions.-js-pageHeader__functions--searchFormVisible ~ #pageHeader__autocomplete{ top: 160px;}
  #pageHeader__functions:not(.-js-pageHeader__functions--searchFormVisible) ~ #pageHeader__autocomplete{ top: 80px;}
  
  #pageHeader:not(.-js-pageHeader--hidden) > #pageHeader__functions.-js-pageHeader__functions--searchFormVisible ~  #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 160px); max-height: calc(100vh - 160px);}
  #pageHeader:not(.-js-pageHeader--hidden) > #pageHeader__functions:not(.-js-pageHeader__functions--searchFormVisible) ~  #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 80px); max-height: calc(100vh - 80px);}
}
@media screen and (max-width: 700px) and (min-width: 401px) {
  #pageHeader__functions.-js-pageHeader__functions--searchFormVisible ~ #pageHeader__autocomplete{ top: 120px;}
  #pageHeader__functions:not(.-js-pageHeader__functions--searchFormVisible) ~ #pageHeader__autocomplete{ top: 60px;}
  
  #pageHeader:not(.-js-pageHeader--hidden) > #pageHeader__functions.-js-pageHeader__functions--searchFormVisible ~  #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 120px); max-height: calc(100vh - 120px);}
  #pageHeader:not(.-js-pageHeader--hidden) > #pageHeader__functions:not(.-js-pageHeader__functions--searchFormVisible) ~  #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 60px); max-height: calc(100vh - 60px);}
}
@media screen and (max-width: 400px){
  #pageHeader__autocomplete{ top: 100px;}
  #pageHeader:not(.-js-pageHeader--hidden) #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 100px); max-height: calc(100vh - 100px);}
  
  
  #pageHeader__functions.-js-pageHeader__functions--searchFormVisible ~ #pageHeader__autocomplete{ top: 160px;}
  #pageHeader__functions:not(.-js-pageHeader__functions--searchFormVisible) ~ #pageHeader__autocomplete{ top: 100px;}
  
  #pageHeader:not(.-js-pageHeader--hidden) > #pageHeader__functions.-js-pageHeader__functions--searchFormVisible ~  #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 160px); max-height: calc(100vh - 160px);}
  #pageHeader:not(.-js-pageHeader--hidden) > #pageHeader__functions:not(.-js-pageHeader__functions--searchFormVisible) ~  #pageHeader__autocomplete{ max-height: -webkit-calc(100vh - 100px); max-height: calc(100vh - 100px);}
}

@media screen and (min-width: 701px) {
  #pageHeader__autocomplete{ padding: 20px;}
}
@media screen and (max-width: 700px) {
  #pageHeader__autocomplete{ padding: 10px;}
}

@media screen {
  #pageHeader:not(.-js-pageHeader--autocompleteVisible) > #pageHeader__autocomplete{ display: none;}
  .-js-pageHeader--autocompleteVisible > #pageHeader__autocomplete{ display: block;}
}

/*  =========================================================
headline
========================================================= */
@media screen {
  #pageHeader__autocomplete > h3{
    font: 400 normal 25px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #4b4a49;
    margin: 0px 0px 20px 0px;
  }
}

/*  =========================================================
hitlist
========================================================= */
@media screen {
  #pageHeader__autocomplete > ul{
    list-style: none; margin: 0px 0px 20px 0px; padding: 0px;
    background: #fff; color: #4b4a49;
    -webkit-border-radius: 5px;
            border-radius: 5px; overflow: hidden;
  }
  #pageHeader__autocomplete > ul > li{ display: block;}
  #pageHeader__autocomplete > ul > li:not(:last-child){
    border-bottom: 1px #f2efeb solid;
  }
}

@media screen {
  .pageHeader__autocomplete__link{
    font: 400 normal 16px/20px 'Open Sans', Arial, sans-serif;
    display: block; padding: 15px 150px 15px 20px;
  }
  
  .pageHeader__autocomplete__link > strong{ font-weight: 700;}
  
  .pageHeader__autocomplete__link > span{
    font: 400 italic 14px/20px 'Open Sans', Arial, sans-serif;
    float: right; margin-right: -130px;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageHeader
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: pageHeader.functions.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
/* the main container */
@media screen {
  #pageHeader__functions{
    text-align: left;
  }
}
@media screen and (min-width: 401px){
  #pageHeader__functions{ -webkit-box-flex: 1; -ms-flex: 1 1; flex: 1 1; -webkit-flex: 1 1;}
}
@media screen and (max-width: 400px){
  #pageHeader__functions{ margin-top: 40px; }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageHeader
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: pageHeader.functions.elements.css 749 2017-02-22 15:12:39Z schoening $
 **/

/*  =========================================================
general structure
icon
text
navOpener
searchOpener
========================================================== */


/*  =========================================================
general structure
========================================================= */
/* the element itself */
@media screen {
  .pageHeader__functions__element{
    display: inline-block; cursor: pointer;
    color: #fff;
  }
}
@media screen and (min-width: 701px){
  .pageHeader__functions__element{ padding-left: 20px; height: 80px;}
}
@media screen and (max-width: 700px){
  .pageHeader__functions__element{ padding-left: 10px; height: 60px;}
}

/* vertical alignment helper */
@media screen {
  .pageHeader__functions__element:before{
    content: '';
    display: inline-block; vertical-align: middle;
    width: 0px; height: 100%;
  }
}

/* border line */
@media screen {
  .pageHeader__functions__element:after{
    content: '';
    display: inline-block; vertical-align: middle;
    width: 1px; height: 40px;
    background: rgba(255, 255, 255, 0.15);
  }
}
@media screen and (min-width: 701px){
  .pageHeader__functions__element:after{ margin-left: 20px;}
}
@media screen and (max-width: 700px){
  .pageHeader__functions__element:after{ margin-left: 10px;}
}

/*  =========================================================
icon
========================================================= */
@media screen {
  .pageHeader__functions__element > [class*='icon-']{
    line-height: 1em; vertical-align: middle;
  }
}
@media screen and (min-width: 701px){
  .pageHeader__functions__element > [class*='icon-']{ font-size: 35px;}
}
@media screen and (max-width: 700px){
  .pageHeader__functions__element > [class*='icon-']{ font-size: 25px;}
}

@media screen {
  .pageHeader__functions__element.-js-offCanvas__target--active > [class*='icon-']:before{ content: '\e901';}

  .pageHeader__functions__element.-js-offCanvas__target--active > .icon-filter[class*='icon-']:before{
    content:"\e917";
  }
  .closeButton{
    margin:0px 10px 0px 25px;
  }
  span.map-close-info{
    font: 400 normal 20px/24px 'Open Sans',Arial,sans-serif;
    font-size: 14px;
    position: relative;
    bottom: -15px;
    margin: 0px -20px 5px -65px;
  }
}
@media screen and (max-width: 700px){
  span.map-close-info{
    display:none;
  }
  .closeButton{
    margin:0px 0px 0px 0px;
  }
}

/*  =========================================================
text
========================================================= */
@media screen {
  .pageHeader__functions__element > .text{
    vertical-align: middle;
    font: 400 normal 25px/1em 'Comfortaa', "Open Sans", Arial, sans-serif;
    font-weight: 400;
  }

  .pageHeader__functions__element > [class*='icon-'] + .text{ margin-left: 5px;}
}
@media screen and (min-width: 701px){
  .pageHeader__functions__element > .text{ display: inline-block;}
}
@media screen and (max-width: 700px){
  .pageHeader__functions__element > .text{ display: none;}
}

/*  =========================================================
navOpener
========================================================= */
@media screen {
  .-js-pageHeader--navVisible #pageHeader__functions__element--navOpener > [class*='icon-']:before{ content: '\e901';}
}

/*  =========================================================
searchOpener
========================================================= */
@media screen and (min-width: 1001px) {
  #pageHeader__functions__element--searchOpener{ display: none;}
}

@media screen and (max-width: 1000px) {
  .-js-pageHeader__functions--searchFormVisible > #pageHeader__functions__element--searchOpener > span:before{ content: '\e901';}
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageHeader
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: pageHeader.functions.form.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
large screens
small screens
========================================================== */


/*  =========================================================
large screens
========================================================= */
@media screen and (min-width: 1001px) {
  #pageHeader__functions__search{
    display: inline-block; vertical-align: middle;
    width: 275px; height: 40px; background: #fff;
    margin-left: 20px; -webkit-border-radius: 5px; border-radius: 5px; overflow: hidden;
  }
  
  #pageHeader__functions__search > input{
    display: inline-block; vertical-align: middle;
    width: 199px; height: 100%; padding: 0px 15px;
    background: #fff; border: none;
    
    font: 400 normal 20px/40px 'Comfortaa', "Open Sans", Arial, sans-serif;
    font-weight: 400; color: #7d7c7a;
  }
  
  #pageHeader__functions__search > button{
    display: inline-block; vertical-align: middle;
    width: 45px; height: 100%;
    background: #fff; color: #7d7c7a;
    
    border-width: 0px 0px 0px 1px;
    border-style: solid; border-color: #ecebeb;
    
    font-size: 22px; line-height: 40px;
  }
}

/*  =========================================================
small screens
========================================================= */
@media screen and (max-width: 1000px) {
  #pageHeader__functions__search{
    position: absolute; top: 100%; left: 0px; right: 0px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box;
    background: #4b4a49;
  }
}
@media screen and (max-width: 1000px) and (min-width: 701px) {
  #pageHeader__functions__search{ padding: 20px; height: 80px;}
}
@media screen and (max-width: 700px) {
  #pageHeader__functions__search{ padding: 10px; height: 60px;}
}
@media screen and (max-width: 1000px) {
  #pageHeader__functions:not(.-js-pageHeader__functions--searchFormVisible) > #pageHeader__functions__search{ display: none;}
  .-js-pageHeader__functions--searchFormVisible > #pageHeader__functions__search{ display: block;}
}

@media screen and (max-width: 1000px) {
  #pageHeader__functions__search > input{
    display: inline-block; vertical-align: middle;
    width: 100%; height: 100%; margin-right: -45px;
    -webkit-box-sizing: border-box;
            box-sizing: border-box; padding: 0px 60px 0px 15px;
    border: none; -webkit-border-radius: 5px; border-radius: 5px;
    
    background: #fff;
    
    font: 400 normal 20px/40px 'Comfortaa', "Open Sans", Arial, sans-serif;
    font-weight: 400; color: #7d7c7a;
  }
}

@media screen and (max-width: 1000px) {
  #pageHeader__functions__search > button{
    display: inline-block; vertical-align: middle;
    width: 45px; height: 100%;
    background: transparent; color: #7d7c7a;
    
    border-width: 0px 0px 0px 1px;
    border-style: solid; border-color: #ecebeb;
    
    font-size: 22px; line-height: 40px;
  }
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageHeader
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: pageHeader.init.css 613 2017-01-16 10:28:13Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
/* the main container */
@media screen {
  #pageHeader{
    width: 100%;
    position: fixed; left: 0px; z-index: 2;
    background: #26547d;
    -webkit-transition: top 0.25s ease;
    transition: top 0.25s ease;

    -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);

            box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
  }
}

@media screen and (min-width: 401px){
  #pageHeader{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: flex;}
}

@media screen and (min-width: 701px){
  #pageHeader{ height: 80px;}
}
@media screen and (max-width: 700px) and (min-height: 401px) {
  #pageHeader{ height: 60px;}
}
@media screen and (max-width: 400px){
  #pageHeader{ height: 100px;}
}

/* hidden sticky */
@media screen {
  #pageHeader:not(.-js-pageHeader--hidden){ top: 0px;}
}
@media screen and (min-width: 701px) {
  .-js-pageHeader--hidden{ top: -80px;}
}
@media screen and (max-width: 700px){
  .-js-pageHeader--hidden{ top: -60px;}
}
@media screen and (max-width: 400px) {
  .-js-pageHeader--hidden{ top: -100px;}
}
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageHeader
 * @author     gueldner
 * @since      09.11.2016
 * @version    $Id: pageHeader.logo.css 688 2017-02-08 12:46:45Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
/* the main container */
@media screen {
  #pageHeader__logo{
    display: block;
    background-position: 50%; background-repeat: no-repeat;
    text-indent: -100%; overflow: hidden; color: transparent;
  } 
}
@media screen and (max-width: 400px){
  #pageHeader__logo{
    position: absolute; top: 0px; left: 0px;
    background-color: rgb(31, 65, 96);
  }
}

@media screen and (min-width: 401px){
  #pageHeader__logo{ height: 100%;}
}
@media screen and (max-width: 400px){
  #pageHeader__logo{ height: 40px;}
}

@media screen and (min-width: 701px){
  #pageHeader__logo{ width: 245px;}
}
@media screen and (max-width: 700px) and (min-width: 401px){
  #pageHeader__logo{ width: 150px;}
}
@media screen and (max-width: 400px){
  #pageHeader__logo{ width: 100%;}
}

@media screen and (min-width: 701px){
  #pageHeader__logo{ background-image: url('../images/pageHeader/logo-md.ae40924a.png');}
}
@media screen and (max-width: 700px){
  #pageHeader__logo{ background-image: url('../images/pageHeader/logo-sm.012f59b5.png');}
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageHeader
 * @author     gueldner
 * @since      11.11.2016
 * @version    $Id: pageHeader.nav.css 769 2017-02-27 12:46:38Z mueller $
 **/

/*  =========================================================
general structure
flex groups
head
body
body group
body subgroup
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  #pageHeader__nav{
    position: absolute; left: 0px; right: 0px;
    height: auto;
    background: #f2efeb;
    -webkit-box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
            box-shadow: 0px 2px 4px rgba(0, 0, 0, 0.3);
  }

  #pageHeader.-js-pageHeader--hidden #pageHeader__nav{ max-height: 100vh;}
}

@media screen and (min-width: 701px) {
  #pageHeader__nav{ top: 80px;}
  #pageHeader:not(.-js-pageHeader--hidden) #pageHeader__nav{ max-height: -webkit-calc(100vh - 80px); max-height: calc(100vh - 80px);}
}
@media screen and (max-width: 700px) and (min-height: 401px) {
  #pageHeader__nav{ top: 60px;}
  #pageHeader:not(.-js-pageHeader--hidden) #pageHeader__nav{ max-height: -webkit-calc(100vh - 60px); max-height: calc(100vh - 60px);}
}
@media screen and (max-width: 400px){
  #pageHeader__nav{ top: 100px;}
  #pageHeader:not(.-js-pageHeader--hidden) #pageHeader__nav{ max-height: -webkit-calc(100vh - 100px); max-height: calc(100vh - 100px);}
}

@media screen {
  #pageHeader:not(.-js-pageHeader--navVisible) > #pageHeader__nav{ display: none;}
}

@media screen and (min-width: 1201px) {
  .-js-pageHeader--navVisible > #pageHeader__nav{ display: -webkit-flex; display: -webkit-box; display: -ms-flexbox; display: flex;}
}

@media screen and (max-width: 1200px) {
  .-js-pageHeader--navVisible > #pageHeader__nav{ display: block;}
}

/*  =========================================================
flex groups
========================================================= */
@media screen and (max-width: 1200px) {
  .pageHeader__nav__flex:last-of-type {
    border-bottom: 80px solid #fff;
  }
}
@media screen and (min-width: 1201px) {
  .pageHeader__nav__flex{ -webkit-box-flex: 1; -ms-flex: 1 1; flex: 1 1; -webkit-flex: 1 1; width: 20%;}
}

@media screen and (min-width: 801px) and (max-width: 1200px) {
  .pageHeader__nav__flex{
    display: inline-block; vertical-align: top;
  }

  .pageHeader__nav__flex:not(:last-of-type){ width: 50%;}
  .pageHeader__nav__flex:last-of-type:not(:nth-of-type(even)){ width: 100%;}
}

@media screen and (max-width: 800px) {
  .pageHeader__nav__flex{ display: block;}
}

/*  =========================================================
head
========================================================= */
@media screen {
  .pageHeader__nav__flex__head{
    background: #fff; padding: 50px 30px 30px 30px;
  }
  .pageHeader__nav__flex__head > a{
    font: 400 normal 22px/28px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    font-weight: 400; color: #4c5660; text-decoration: none;
    white-space: nowrap;
  }
}
@media screen and (max-width: 1600px) and (min-width: 1200px){
  .pageHeader__nav__flex__head > a{
    font-size: -webkit-calc(100vw / 85);
    font-size: calc(100vw / 85);
  }
}

/*  =========================================================
body
========================================================= */
@media screen {
  .pageHeader__nav__flex__body{
    background: #f2efeb; padding: 10px 30px;
  }
}

/*  =========================================================
body group
========================================================= */
@media screen {
  .pageHeader__nav__flex__body__group{
    padding-left: 30px;
  }
  .pageHeader__nav__flex__body__group:not(:last-child){
    border-bottom: 1px #c8c9c8 solid;
  }
}

/* main link in group */
@media screen {
  .pageHeader__nav__flex__body__group > a{
    padding: 15px 0px; display: block;

    font: 400 normal 20px/28px 'Open Sans', Arial, sans-serif;
    font-weight: 400; color: #4c5660; text-decoration: none;
  }

  .pageHeader__nav__flex__body__group > a:before{
    content: '\e905';
    font: 400 normal 1em 'icomoon'; color: #26547d;

    display: inline-block; width: 20px; margin: 0px 10px 0px -30px;
    -webkit-transition: -webkit-transform 0.25s ease;
    transition: -webkit-transform 0.25s ease;
    transition: transform 0.25s ease;
    transition: transform 0.25s ease, -webkit-transform 0.25s ease;
    -webkit-transform-origin: 50% 50%;
        -ms-transform-origin: 50% 50%;
            transform-origin: 50% 50%;
  }
}
/* opens via hover on large screens */
@media screen and (min-width: 801px) {
  .pageHeader__nav__flex__body__group:hover > a:before{
    -webkit-transform: rotateZ(90deg);
        -ms-transform: rotate(90deg);
            transform: rotateZ(90deg);
  }
}
/* opens vial class on small screens */
@media screen and (max-width: 800px) {
  .-js-pageHeader__nav__flex__body__group--open > a:before{
    -webkit-transform: rotateZ(90deg);
        -ms-transform: rotate(90deg);
            transform: rotateZ(90deg);
  }
}

/* helper span for touch opening on small devices*/
@media screen and (max-width: 800px) {
  .pageHeader__nav__flex__body__group{ position: relative;}
  .pageHeader__nav__flex__body__group__opener{
    position: absolute; top: 0px; left: 0px;
    display: block; width: 30px; height: 58px;
  }
}

@media screen and (min-width: 1200px) and (max-width: 1600px){
  .pageHeader__nav__flex__body__group > a{
    font-size: -webkit-calc(100vw / 75);
    font-size: calc(100vw / 75);
  }
}

/*  =========================================================
body subgroup
========================================================= */
@media screen {
  .pageHeader__nav__flex__body__group__subgroup{
    max-height: 0px; overflow: hidden;

    -webkit-transition: max-height 0.5s ease;

    transition: max-height 0.5s ease; -webkit-transition-delay: 0.25s; transition-delay: 0.25s;
  }
}
/* opens via hover on large screens */
@media screen and (min-width: 801px) {
  .pageHeader__nav__flex__body__group:hover > .pageHeader__nav__flex__body__group__subgroup{
    max-height: 100vh; -webkit-transition-delay: 0s; transition-delay: 0s;
  }
}
/* opens vial class on small screens */
@media screen and (max-width: 800px) {
  .-js-pageHeader__nav__flex__body__group--open > .pageHeader__nav__flex__body__group__subgroup{
    max-height: 100vh; -webkit-transition-delay: 0s; transition-delay: 0s;
  }
}

@media screen {
  .pageHeader__nav__flex__body__group__subgroup > a{
    font: 400 normal 16px/28px 'Open Sans', Arial, sans-serif;
    font-weight: 400; color: #4c5660; text-decoration: none;

    display: block; padding: 8px 0px 10px 0px;
    border-top: 1px #c8c9c8 solid;
    word-wrap: break-word;
  }
}



@media screen and (min-width: 1200px) and (max-width: 1300px){
  .pageHeader__nav__flex__body__group__subgroup > a{
    font-size: -webkit-calc(100vw / 75);
    font-size: calc(100vw / 75);
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage pageTitle
 * @author     gueldner
 * @since      22.11.2016
 * @version    $Id: pageTitle.init.css 473 2016-11-29 14:34:08Z mueller $
 **/

/*  =========================================================
general structure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .pageTitle{ padding: 100px 0px;}
}

@media screen {
  .pageTitle > h1{
    margin: 0px; font-weight: 300; color: #4b4a49;
    word-wrap: break-word;
    hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto;
  }
}
@media screen and (min-width: 701px) {
  .pageTitle > h1{ font: 300 normal 45px/50px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
  
  .pageTitle > h1 > strong{
    font-weight: 300; font-size: 100px; line-height: 110px;
  }
}
@media screen and (max-width: 700px) {
  .pageTitle > h1{ font: 300 normal 25px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;}
  
  .pageTitle > h1 > strong{
    font-weight: 300; font-size: 60px; line-height: 65px;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2014 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @author     herbst
 * @since      14.01.2014
 * @version    $Id: socialMediaDashboard.init.css 607 2016-12-19 14:53:16Z mueller $
 **/

@media screen{
  body.socialMediaDashboard .fullScaleMap {
    height: 70vh;
  }
  body.socialMediaDashboard .baseArticle{
    text-align: center;
  }

  body.socialMediaDashboard .baseArticle {
    min-height: 450px;
  }
  #socialMediaDashboardButtonTable {
    width: auto;
    margin: 0 auto!important;
    padding-top: 20px;
  }

  #socialMediaDashboardButtonTable td {
    padding: 0 10px!important;
  }
  #socialMediaDashboardButtonTable img {
    max-width: 160px;
    padding: 20px 0 !important;
  }
  #socialMediaDashboardButtonTable tr.text {
    vertical-align: top;
  }
  #socialMediaDashboardButtonTable tr.text td p {
    font-family: 'Rotis-Regular', 'Sans-Serif';
    font-size: 0.9em;
    color: #4c5660;
    max-width: 120px;
    padding-left: 10%
  }
  #pageHeader.socialMediaDashboardHeader .headWrapper.content {
    height: 45px;
  }
  body.socialMediaDashboard .pageHeader {
    margin-left: 0!important;
    margin-right: 0!important;
    width: 100%!important;
  }
  body.socialMediaDashboard .baseArticle {
    background: transparent url(/portal/assets/images/socialMediaDashboard/socialMediaDashboard.png) repeat 0 0!important;
    border-top: 1px solid #4c5660;
  }
  body.socialMediaDashboard .bodyArea {
    width: 100%;
  }
  .socialMediaDashboard .fancybox-wrap {
    top: 100px !important;
  }
  .socialMediaDashboard .fancybox-iframe {
    overflow-x:hidden;
  }
  .socialMediaDashboard .fancybox-inner {
    height: 700px!important;
  }
  .socialMediaDashboard .overlayCloseBtn {
    background: url(/portal/assets/images/socialMediaDashboard/smd_close.png) no-repeat;
    width: 50px;
    height: 50px;
    top: 0;
    right: 50px;
  }
}

@media only screen and (min-width: 801px) {
  body.socialMediaDashboard .hideDesktop{
    display: none;
  }
}

@media only screen and (max-width: 800px) {
  body.socialMediaDashboard .hideMobile{
    display: none;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * Nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2016 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2016-12-05
 * @version    $$Id$$
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2015 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage tabArea
 * @author     gueldner
 * @since      24.11.2016
 * @version    $Id: tabArea.init.css 818 2017-03-20 10:07:59Z kracke $
 **/

/*  =========================================================
general structure
outside tabs
inside tabs
static map
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen and (min-width: 801px) {
  .tabArea{ border-top: 80px #fff solid;}
}


/*  =========================================================
outside tabs
========================================================= */
@media screen and (max-width: 800px) {
  .tabArea__tabs{ display: none;}
}

@media screen and (min-width: 801px) {
  .tabArea__tabs{
    position: absolute; bottom: 100%; left: 0px;
    width: 100%;
  }

  .tabArea__tabs > .gridSection{
    text-align: left; padding: 0px;
  }
}

@media screen and (min-width: 801px) {
  .tabArea__tabs__element{
    display: inline-block; height: 50px; padding: 0px 25px;
    font: 400 normal 25px/50px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #4b4a49; cursor: pointer;
  }

  .tabArea__tabs__element--active{ background: #f2efeb;}
}

/*  =========================================================
inside tabs
========================================================= */
@media screen and (min-width: 801px) {
  .tabArea__innerTab{ display: none;}
}

@media screen and (max-width: 800px) {
  .tabArea__innerTab{
    position: relative;
    padding: 15px 15px 10px 45px;
    border-bottom: 1px #fff solid; border-top: 5px #fff solid;

    background: #f2efeb; color: #4b4a49; cursor: pointer;
    font: 400 normal 25px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
    text-align: left;
  }

  .tabArea__innerTab:before{
    content: '\e905';
    display: block;
    position: absolute; left: 20px; top: 50%; margin-top: -5px;
    font: 400 normal 15px/1em 'icomoon'; color: #26547d;

    -webkit-transition: -webkit-transform 0.25s ease;

    transition: -webkit-transform 0.25s ease;

    transition: transform 0.25s ease;

    transition: transform 0.25s ease, -webkit-transform 0.25s ease;
  }
  .tabArea__innerTab--active:before{
    -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
            transform: rotate(90deg);
  }
}

@media screen {
  .tabArea__innerTab:not(.tabArea__innerTab--active) + [data-js_tab]{ display: none;}
  .tabArea__innerTab--active + [data-js_tab]{ display: block;}
}

/*  =========================================================
static map
========================================================= */
@media screen{
  #mapSmall img+div.imx-poi {
    position: absolute;
    width: 68px;
    left: 50%;
    top: 50%;
    margin: -69px 0 0 -34px;
    height: 69px;
    background: url(/portal/mapMarker.php?index=1);
  }
}

@media screen{
  .imx-infowindow {
    background: #f2efeb;
    max-width: 350px;
  }
  .tabArea__infowindow  .tabArea__innerTab + [data-js_tab] {
    background: #f2efeb;
  }
  .tabArea__infowindow .tabArea__innerTab + [data-js_tab] > div {
    padding: 10px;
  }

  .tabArea__infowindow .tabArea__tabs {
    background: #fff
  }

  .imx-infowindow > img[src$="/images/close.a35d055d.png"] {
    top: -43px !important;
    z-index: 2;
  }
  .tabArea__infowindow__tab p {
    word-wrap: break-word;
    word-break: break-all;
  }
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/* perfect-scrollbar v0.6.16 */
.ps-container {
  -ms-touch-action: auto;
  touch-action: auto;
  overflow: hidden !important;
  -ms-overflow-style: none;
}
@supports (-ms-overflow-style: none) {
  .ps-container {
    overflow: auto !important;
  }
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  .ps-container {
    overflow: auto !important;
  }
}
.ps-container.ps-active-x > .ps-scrollbar-x-rail,
.ps-container.ps-active-y > .ps-scrollbar-y-rail {
  display: block;
  background-color: transparent;
}
.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  background-color: #999;
  height: 11px;
}
.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  background-color: #999;
  width: 11px;
}
.ps-container > .ps-scrollbar-x-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  opacity: 0;
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  bottom: 0px;
  /* there must be 'bottom' for ps-scrollbar-x-rail */
  height: 15px;
}
.ps-container > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  position: absolute;
  /* please don't change 'position' */
  background-color: #aaa;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -webkit-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  bottom: 2px;
  /* there must be 'bottom' for ps-scrollbar-x */
  height: 6px;
}
.ps-container > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x,
.ps-container > .ps-scrollbar-x-rail:active > .ps-scrollbar-x {
  height: 11px;
}
.ps-container > .ps-scrollbar-y-rail {
  display: none;
  position: absolute;
  /* please don't change 'position' */
  opacity: 0;
  -webkit-transition: background-color 0.2s linear, opacity 0.2s linear;
  transition: background-color 0.2s linear, opacity 0.2s linear;
  right: 0;
  /* there must be 'right' for ps-scrollbar-y-rail */
  width: 15px;
}
.ps-container > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  position: absolute;
  /* please don't change 'position' */
  background-color: #aaa;
  -webkit-border-radius: 6px;
  border-radius: 6px;
  -webkit-transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out;
  transition: background-color 0.2s linear, height 0.2s linear, width 0.2s ease-in-out, border-radius 0.2s ease-in-out, -webkit-border-radius 0.2s ease-in-out;
  right: 2px;
  /* there must be 'right' for ps-scrollbar-y */
  width: 6px;
}
.ps-container > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y,
.ps-container > .ps-scrollbar-y-rail:active > .ps-scrollbar-y {
  width: 11px;
}
.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover.ps-in-scrolling.ps-x > .ps-scrollbar-x-rail > .ps-scrollbar-x {
  background-color: #999;
  height: 11px;
}
.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover.ps-in-scrolling.ps-y > .ps-scrollbar-y-rail > .ps-scrollbar-y {
  background-color: #999;
  width: 11px;
}
.ps-container:hover > .ps-scrollbar-x-rail,
.ps-container:hover > .ps-scrollbar-y-rail {
  opacity: 0.6;
}
.ps-container:hover > .ps-scrollbar-x-rail:hover {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover > .ps-scrollbar-x-rail:hover > .ps-scrollbar-x {
  background-color: #999;
}
.ps-container:hover > .ps-scrollbar-y-rail:hover {
  background-color: #eee;
  opacity: 0.9;
}
.ps-container:hover > .ps-scrollbar-y-rail:hover > .ps-scrollbar-y {
  background-color: #999;
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
.cc-window {
  opacity: 1;
  -webkit-transition: opacity 1s ease;
  transition: opacity 1s ease;
}
.cc-window.cc-invisible {
  opacity: 0;
}
.cc-animate.cc-revoke {
  -webkit-transition: -webkit-transform 1s ease;
  transition: -webkit-transform 1s ease;
  transition: transform 1s ease;
  transition: transform 1s ease, -webkit-transform 1s ease;
}
.cc-animate.cc-revoke.cc-top {
  -webkit-transform: translateY(-2em);
      -ms-transform: translateY(-2em);
          transform: translateY(-2em);
}
.cc-animate.cc-revoke.cc-bottom {
  -webkit-transform: translateY(2em);
      -ms-transform: translateY(2em);
          transform: translateY(2em);
}
.cc-animate.cc-revoke.cc-active.cc-bottom,
.cc-animate.cc-revoke.cc-active.cc-top,
.cc-revoke:hover {
  -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
          transform: translateY(0);
}
.cc-grower {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height 1s;
  transition: max-height 1s;
}
.cc-link,
.cc-revoke:hover {
  text-decoration: underline;
}
.cc-revoke,
.cc-window {
  position: fixed;
  overflow: hidden;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  font-family: Helvetica, Calibri, Arial, sans-serif;
  font-size: 16px;
  line-height: 1.5em;
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-wrap: nowrap;
  -webkit-flex-wrap: nowrap;
          flex-wrap: nowrap;
  z-index: 9999;
}
.cc-window.cc-static {
  position: static;
}
.cc-window.cc-floating {
  padding: 2em;
  max-width: 24em;
  -ms-flex-direction: column;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
          flex-direction: column;
}
.cc-window.cc-banner {
  padding: 1em 1.8em;
  width: 100%;
  -ms-flex-direction: row;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
          flex-direction: row;
}
.cc-revoke {
  padding: 0.5em;
}
.cc-header {
  font-size: 18px;
  font-weight: 700;
}
.cc-btn,
.cc-close,
.cc-link,
.cc-revoke {
  cursor: pointer;
}
.cc-link {
  opacity: .8;
  display: inline-block;
  padding: 0.2em;
}
.cc-link:hover {
  opacity: 1;
}
.cc-link:active,
.cc-link:visited {
  color: initial;
}
.cc-btn {
  display: block;
  padding: .4em .8em;
  font-size: .9em;
  font-weight: 700;
  border-width: 2px;
  border-style: solid;
  text-align: center;
  white-space: nowrap;
}
.cc-banner .cc-btn:last-child {
  min-width: 140px;
}
.cc-highlight .cc-btn:first-child {
  background-color: transparent;
  border-color: transparent;
}
.cc-highlight .cc-btn:first-child:focus,
.cc-highlight .cc-btn:first-child:hover {
  background-color: transparent;
  text-decoration: underline;
}
.cc-close {
  display: block;
  position: absolute;
  top: .5em;
  right: .5em;
  font-size: 1.6em;
  opacity: .9;
  line-height: 0.75;
}
.cc-close:focus,
.cc-close:hover {
  opacity: 1;
}
.cc-revoke.cc-top {
  top: 0;
  left: 3em;
  -webkit-border-bottom-left-radius: .5em;
          border-bottom-left-radius: .5em;
  -webkit-border-bottom-right-radius: 0.5em;
          border-bottom-right-radius: 0.5em;
}
.cc-revoke.cc-bottom {
  bottom: 0;
  left: 3em;
  -webkit-border-top-left-radius: .5em;
          border-top-left-radius: .5em;
  -webkit-border-top-right-radius: 0.5em;
          border-top-right-radius: 0.5em;
}
.cc-revoke.cc-left {
  left: 3em;
  right: unset;
}
.cc-revoke.cc-right {
  right: 3em;
  left: unset;
}
.cc-top {
  top: 1em;
}
.cc-left {
  left: 1em;
}
.cc-right {
  right: 1em;
}
.cc-bottom {
  bottom: 1em;
}
.cc-floating > .cc-link {
  margin-bottom: 1em;
}
.cc-floating .cc-message {
  display: block;
  margin-bottom: 1em;
}
.cc-window.cc-floating .cc-compliance {
  -ms-flex: 1 0 auto;
  -webkit-box-flex: 1;
  -webkit-flex: 1 0 auto;
          flex: 1 0 auto;
}
.cc-window.cc-banner {
  -ms-flex-align: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
          align-items: center;
}
.cc-banner.cc-top {
  left: 0;
  right: 0;
  top: 0;
}
.cc-banner.cc-bottom {
  left: 0;
  right: 0;
  bottom: 0;
}
.cc-banner .cc-message {
  -ms-flex: 1;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
          flex: 1;
}
.cc-compliance {
  display: -ms-flexbox;
  display: -webkit-box;
  display: -webkit-flex;
  display: flex;
  -ms-flex-align: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
          align-items: center;
  -ms-flex-line-pack: justify;
  -webkit-align-content: space-between;
          align-content: space-between;
}
.cc-compliance > .cc-btn {
  -ms-flex: 1;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
          flex: 1;
}
.cc-btn + .cc-btn {
  margin-left: 0.5em;
}
@media print {
  .cc-revoke,
  .cc-window {
    display: none;
  }
}
@media screen and (max-width: 900px) {
  .cc-btn {
    white-space: normal;
  }
}
@media screen and (max-width: 414px) and (orientation: portrait), screen and (max-width: 736px) and (orientation: landscape) {
  .cc-window.cc-top {
    top: 0;
  }
  .cc-window.cc-bottom {
    bottom: 0;
  }
  .cc-window.cc-banner,
  .cc-window.cc-left,
  .cc-window.cc-right {
    left: 0;
    right: 0;
  }
  .cc-window.cc-banner {
    -ms-flex-direction: column;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
            flex-direction: column;
  }
  .cc-window.cc-banner .cc-compliance {
    -ms-flex: 1;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
            flex: 1;
  }
  .cc-window.cc-floating {
    max-width: none;
  }
  .cc-window .cc-message {
    margin-bottom: 1em;
  }
  .cc-window.cc-banner {
    -ms-flex-align: unset;
    -webkit-box-align: unset;
    -webkit-align-items: unset;
            align-items: unset;
  }
}
.cc-floating.cc-theme-classic {
  padding: 1.2em;
  -webkit-border-radius: 5px;
          border-radius: 5px;
}
.cc-floating.cc-type-info.cc-theme-classic .cc-compliance {
  text-align: center;
  display: inline;
  -ms-flex: none;
  -webkit-box-flex: 0;
  -webkit-flex: none;
          flex: none;
}
.cc-theme-classic .cc-btn {
  -webkit-border-radius: 5px;
          border-radius: 5px;
}
.cc-theme-classic .cc-btn:last-child {
  min-width: 140px;
}
.cc-floating.cc-type-info.cc-theme-classic .cc-btn {
  display: inline-block;
}
.cc-theme-edgeless.cc-window {
  padding: 0;
}
.cc-floating.cc-theme-edgeless .cc-message {
  margin: 2em 2em 1.5em;
}
.cc-banner.cc-theme-edgeless .cc-btn {
  margin: 0;
  padding: .8em 1.8em;
  height: 100%;
}
.cc-banner.cc-theme-edgeless .cc-message {
  margin-left: 1em;
}
.cc-floating.cc-theme-edgeless .cc-btn + .cc-btn {
  margin-left: 0;
}
/*! NSG, Compiled at 2018-06-14 12:50:46 */
/**
 * nordsee
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2018 infomax websolutions GmbH
 * @link       https://www.infomax-online.de
 * @author     Florian Müller <mueller@infomax-it.de>
 * @since      2018-01-24
 */
/**

Navigation:
A.

**/
/*  =========================================================
 =A.
========================================================= */
/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2017 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage onlineMagazin - imageTeaser
 * @author     degener
 * @since      24.11.2017
 * @version    $Id$
 **/

/*  =========================================================
general structure
link
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {

  body.onlineMagazin .baseArticle {
    padding: 1vw 0;
  }
  body.onlineMagazin .headerImage--hero + section > .baseArticle {
    padding: 3vw 0!important;
  }
  body.onlineMagazin .gridSection {
    padding: 1vw 0;
  }
  body.onlineMagazin .baseArticle + .headerImage {
    margin-bottom: 50px;
  }


  section.margin--top {
    margin-top: 66px;
  }
  section.margin--bottom {
    margin-bottom: 66px;
  }

  body .gridSection.onlineMagazin {
    padding: 8px 0;
  }

  .onlineMagazin__gridWrapper {
    display: table;
    margin: 0 -20px;
  }
  .onlineMagazin__gridWrapper .grid--gutters {
    border-spacing: 20px 0;
  }
  .onlineMagazin__gridWrapper .gridSection__col_2v4 {
    display: table-cell;
    padding: 0;
    background-color: #fff;
  }
  .onlineMagazin .imageTeaser {
    margin-bottom: 0;
    background-color: #fff;
  }

}

/*
@media screen and (max-width: 1024px) {
	body.onlineMagazin .gridSection {
		padding: 20px 0;
	}
}
*/
@media screen and (max-width: 800px) {

  body.onlineMagazin .gridSection {
    padding: 3vw 0;
  }
  section.margin--top {
    margin-top: 3vw;
  }
  section.margin--bottom {
    margin-bottom: 3vw;
  }

  .onlineMagazin__gridWrapper {
    display: inline-block;
    margin: 0;
  }

  .onlineMagazin__gridWrapper .gridSection__col_2v4 {
    width: 100%;
    display: inline-block;
    background-color: transparent;
  }

  .onlineMagazin__gridWrapper .gridSection__col_2v4 .imageTeaser {
    margin-bottom: 20px;
  }

}

/*
@media screen and (max-width: 699px) {
	body.onlineMagazin .gridSection {
		padding: 10px 0;
	}
	body.onlineMagazin .baseArticle {
		padding: 0!important;
	}
}
*/

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2017 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage onlineMagazin - columns
 * @author     degener
 * @since      28.11.2017
 * @version    $Id$
 **/

/*  =========================================================
general structure
text
figure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {

  body.onlineMagazin .onlineMagazin__article__columns {
    padding: 1vw 0!important;
  }

  .onlineMagazin__article__columns--3 {
    -webkit-column-count: 3;
       -moz-column-count: 3;
            column-count: 3;
    -webkit-column-gap: 60px;
       -moz-column-gap: 60px;
            column-gap: 60px;
    float: left;
  }
  .onlineMagazin__article__columns--2 {
    width: 66.666666%;
    float: left;
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
    -webkit-column-gap: 60px;
       -moz-column-gap: 60px;
            column-gap: 60px;
  }

}

@media screen and (max-width: 1023px) {
  .onlineMagazin__article__columns--2 {
    width: 100%;
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
  }
  .onlineMagazin__article__columns--3 {
    -webkit-column-count: 2;
       -moz-column-count: 2;
            column-count: 2;
  }
}
@media screen and (max-width: 699px) {
  .onlineMagazin__article__columns--2,
  .onlineMagazin__article__columns--3 {
    -webkit-column-count: 1;
       -moz-column-count: 1;
            column-count: 1;
  }
}


/*  =========================================================
paragraph
========================================================= */
@media screen {

  [class^="onlineMagazin__article__columns"] > p strong {
    font-weight: 700;
    color: #26547d;
  }

  [class^="onlineMagazin__article__columns"]  > p:first-of-type::first-letter {
    font-size: 100px;
    color: #26547d;
    text-transform: uppercase;
    margin: 20px 20px 20px 0;
    float: left;
  }

}


@media screen and (max-width: 699px) {
  [class^="onlineMagazin__article__columns"]  > p:first-child::first-letter {
    font-size: 70px;
  }
}
@media screen and (max-width: 480px) {
  [class^="onlineMagazin__article__columns"]  > p:first-child::first-letter {
    font-size: 50px;
    margin: 10px 10px 10px 0;
  }
}


/*  =========================================================
blockquote
========================================================= */
@media screen {
  [class^="onlineMagazin__article__columns"] > blockquote > p,
  [class^="onlineMagazin__article__columns"] > blockquote {
    font: 400 normal 36px/38px 'Yellowtail', Times, serif;
    color: #26547d;
    margin: 0 0 15px 0;
    text-align: center !important;
    display: inline-block;
  }

}



/*  =========================================================
figure
========================================================= */
@media screen {

  .onlineMagazin__article__columns > .figure--column {
    width: -webkit-calc(33.333333% - 60px);
    width: calc(33.333333% - 60px);
    margin: 0;
  }
  .onlineMagazin__article__columns > .figure--column picture {
    width: 100%;
    display: inline-block;
    position: relative;
    padding: 133.333333% 0 0 0;
    overflow: hidden;
  }
  .onlineMagazin__article__columns > .figure--column picture img {
    width: 100%;
    height: auto;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .onlineMagazin__article__columns > .figure--column.left {
    float: left;
    margin-right: 60px;
  }
  .onlineMagazin__article__columns > .figure--column.right {
    float: right;
    margin-left: 60px;
  }
  .onlineMagazin__article__header > figure img {
    width: 100%;
    height: auto;
  }

  .onlineMagazin__article__columns .figure__image {
    position: relative;
  }

  .onlineMagazin__article__columns .figure__image .copyright {
    margin-bottom: 5px;
  }


}


@media screen and (max-width: 1023px) {
  .onlineMagazin__article__columns > .figure--column {
    width: 80%;
    margin: 15px 0;
  }
  .onlineMagazin__article__columns > .figure--column.left {
    float: none;
    display: inline-block;
    margin-right: 0;
  }
  .onlineMagazin__article__columns > .figure--column.right {
    float: none;
    display: inline-block;
    margin-left: 0;
  }
  .onlineMagazin__article__columns > .figure--column picture {
    padding: 75% 0 0 0;
  }
}
@media screen and (max-width: 480px) {
  .onlineMagazin__article__columns > .figure--column {
    width: 100%;
  }
}



/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2017 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage comments
 * @author     degener
 * @since      29.11.2017
 * @version    $Id$
 **/

/*  =========================================================
general structure
list element
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
  .onlineMagazin__comments {
    border-top: 1px solid #fff;
		padding: 25px 0px;
    color: #4b4a49;
  }
}

@media screen and (max-width: 600px) {
  .onlineMagazin__comments {
   padding-top: 50px;
  }
}

/*  =========================================================
list element
========================================================= */
@media screen {

  .onlineMagazin__comments__element {
    width: -webkit-calc(100% - 150px);
    width: calc(100% - 150px);
		float: right;
		position: relative;
		text-align: left;
		background-color: #fff;
		padding: 33px 45px 38px 45px;
		margin-bottom: 70px;
		-webkit-box-sizing: border-box;
		        box-sizing: border-box;
  }

	.onlineMagazin__comments__element > figure {
    width: 143px;
		height: 143px;
		position: absolute;
		top: -42px;
		left: -42px;
		z-index: 1;
		border: 3px solid #fff;
		-webkit-border-radius: 100%;
		        border-radius: 100%;
		margin: 0;
		overflow: hidden;
  }
	.onlineMagazin__comments__element > figure img {
    width: 100%;
		height: auto;
  }

	.onlineMagazin__comments__element > .date {
    font: 700 normal 18px/26px 'Open Sans', Arial, sans-serif;
  }
	.onlineMagazin__comments__element > h3 {
    font: 300 normal 20px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
		margin: 7px 0;
  }
	.onlineMagazin__comments__element > p {
    font: 400 normal 18px/26px 'Open Sans', Arial, sans-serif;
		margin: 0;
  }
}



@media screen and (max-width: 1023px) {
  .onlineMagazin__comments__element {
    width: -webkit-calc(100% - 50px);
    width: calc(100% - 50px);
  }
}

@media screen and (max-width: 800px) {
  .onlineMagazin__comments__element > h3 {
    font: 300 normal 20px/1em 'Comfortaa', 'Open Sans', Arial, sans-serif;
  }
  .onlineMagazin__comments__element > p,
	.onlineMagazin__comments__element > .date {
    font: 400 normal 16px/26px 'Open Sans', Arial, sans-serif;
  }
}

@media screen and (max-width: 600px) {
  .onlineMagazin__comments__element {
    width: 100%;
		padding: 50px 45px 30px 45px;
  }
	.onlineMagazin__comments__element > figure {
    width: 87px;
		height: 87px;
		top: -47px;
		left: 50%;
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		    transform: translateX(-50%);
  }
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2017 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage onlineMagazin - figcaption
 * @author     degener
 * @since      29.11.2017
 * @version    $Id$
 **/


/*  =========================================================
general structure
========================================================= */
@media screen {
  .headerImage__image__claim--onlineMagazin{
    position: absolute;
		top: 45%;
		right: 5%;
		z-index: 1;
    width: 35%;
		text-align: center;
    transform: translateY(-50%); -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%);
		pointer-events: auto;
    font-weight: 400;
		color: #fff;
    text-shadow: 0px 0px 25px rgba(0, 0, 0, 0.5);
    word-wrap: break-word;
    hyphens: auto; -moz-hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto;
  }

  .headerImage__image__claim--onlineMagazin  blockquote {
    font: 400 normal 50px/50px 'Yellowtail', Times, serif;
		white-space: pre-wrap;
		margin: 0;
  }
	.headerImage__image__claim--onlineMagazin cite {
    font: 700 normal 18px/18px 'Open Sans', Arial, sans-serif;
		margin: 0;
  }
}


@media screen and (max-width: 1024px) {
  .headerImage__image__claim--onlineMagazin {
		width: 60%;
	}
	.headerImage__image__claim--onlineMagazin > blockquote > p,
	.headerImage__image__claim--onlineMagazin > blockquote {
		font-size: 40px;
		line-height: 1;
	}
}
@media screen and (max-width: 600px) {
  .headerImage__image__claim--onlineMagazin {
		font-size: 35px;
		width: 90%;
	}
}


/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2017 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage onlineMagazin - gallery
 * @author     degener
 * @since      28.11.2017
 * @version    $Id$
 **/

/*  =========================================================
general structure
columns
figure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {

  .onlineMagazin__gallery{
    background: #fff;
		padding: 48px 0 0 0;
  }

}


@media screen and (max-width: 800px) {
	.onlineMagazin__gallery {
		padding-top: 0;
  }
}


/*  =========================================================
columns
========================================================= */
@media screen {

	.onlineMagazin__gallery__column {
		float: left;
  }
	.onlineMagazin__gallery__column:last-of-type {
		margin-top: -68px;
  }

}

@media screen and (max-width: 800px) {
	.onlineMagazin__gallery__column:last-of-type {
		margin-top: 0;
  }
}


/*  =========================================================
figure
========================================================= */
@media screen {

	.onlineMagazin__gallery__column figure {
		width: 100%;
		float: left;
		position: relative;
		padding: 0;
		margin: 0;
		overflow: hidden;
  }
	.onlineMagazin__gallery__column figure {
		margin-bottom: 20px;
  }

	.onlineMagazin__gallery__column figure img {
		width: 100%;
		height: auto;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
  }

	/* different dimensions */
	.onlineMagazin__gallery__column figure {
		padding: 58.333333% 0 0 0;
  }
	.onlineMagazin__gallery__column:last-of-type figure {
		padding: 116.584158% 0 0 0;
  }

}

@media screen and (max-width: 800px) {
	.onlineMagazin__gallery__column:last-of-type figure {
		padding: 58.333333% 0 0 0;
  }
	.onlineMagazin__gallery__column figure:last-of-type {
		margin-bottom: 20px;
  }
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2017 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage onlineMagazin - header
 * @author     degener
 * @since      27.11.2017
 * @version    $Id$
 **/

/*  =========================================================
general structure
text
figure
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {

  .onlineMagazin__article__header {
    width: -webkit-calc(75% - 20px);
    width: calc(75% - 20px);
    position: relative;
    text-align: left;
  }

}


@media screen and (max-width: 1023px) {
  .onlineMagazin__article__header {
    width: 100%;
  }
}


/*  =========================================================
headline
========================================================= */
@media screen {

  .onlineMagazin__article__header > h1 {
    font: 700 normal 80px/80px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    color: #26547d;
    padding-left: 214px;
    margin: 0;
  }

}

@media screen and (max-width: 1280px) {
  .onlineMagazin__article__header > h1 {
    font-size: 60px;
    line-height: 60px;
  }
}
@media screen and (max-width: 799px) {
  .onlineMagazin__article__header > h1 {
    padding: 100px 0 0 0;
  }
}
@media screen and (max-width: 700px) {
  .onlineMagazin__article__header > h1 {
    font-size: 45px;
    line-height: 45px;
  }
}
@media screen and (max-width: 500px) {
  .onlineMagazin__article__header > h1 {
    font-size: 30px;
    line-height: 30px;
    padding-top: 50px;
  }
}


/*  =========================================================
line
========================================================= */
@media screen {

  .onlineMagazin__article__header > hr {
    border-color: #7d7c7a;
    margin: 40px 0 40px -100%;
  }

}

@media screen and (max-width: 1023px) {
  .onlineMagazin__article__header > hr {
    width: 35%;
    margin-left: -4%;
  }
}
@media screen and (max-width: 600px) {
  .onlineMagazin__article__header > hr {
    width: 35%;
    margin-top: 20px;
    margin-bottom: 20px;
  }
}


/*  =========================================================
paragraph
========================================================= */
@media screen {

  .onlineMagazin__article__header > p {
    font: 400 normal 24px/35px 'Comfortaa', 'Open Sans', Arial, sans-serif;
    margin: 0;
  }

}

@media screen and (max-width: 800px) {
  .onlineMagazin__article__header > p {
    font-size: 18px;
    line-height: 26px;
  }
}


/*  =========================================================
figure
========================================================= */
@media screen {

  .onlineMagazin__article__header > figure {
    width: 224px;
    height: 224px;
    position: absolute;
    top: -165px;
    left: -24px;
    z-index: 1;
    border: 3px solid #fff;
    -webkit-border-radius: 100%;
            border-radius: 100%;
    overflow: hidden;
    margin: 0;
  }
  .onlineMagazin__article__header > figure img {
    width: 100%;
    height: auto;
  }

}


@media screen and (max-width: 799px) {
  .onlineMagazin__article__header > figure {
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
        transform: translateX(-50%);
  }
}
@media screen and (max-width: 500px) {
  .onlineMagazin__article__header > figure {
    width: 112px;
    height: 112px;
    top: -80px;
  }
}

/**
 * nsg 2013
 *
 * LICENSE
 *
 * This software and its source code is protected by copyright law (Sec. 69a ff. UrhG).
 * It is not allowed to make any kinds of modifications, nor must it be copied,
 * or published without explicit permission. Misuse will lead to persecution.
 *
 * @copyright  2017 infomax websolutions GmbH
 * @link       http://www.infomax-it.de
 * @package    css
 * @subpackage onlineMagazin - subline
 * @author     degener
 * @since      28.11.2017
 * @version    $Id$
 **/

/*  =========================================================
general structure
subline
========================================================== */


/*  =========================================================
general structure
========================================================= */
@media screen {
	
	.onlineMagazin__subline{
    background: #fff;
		position: relative;
		padding: 0 0 50px 0;
		margin: 0;
		text-align: right;
  }
	
}

@media screen and (max-width: 800px) {
	.onlineMagazin__subline{
		text-align: center;
  }
}
@media screen and (max-width: 800px) {
	.onlineMagazin__subline{
		padding-bottom: 20px;
  }
}
@media screen and (max-width: 600px) {
	.onlineMagazin__subline{
		padding-bottom: 10px;
  }
}


/*  =========================================================
subline
========================================================= */

@media screen {
	
  .onlineMagazin__subline strong {
    font: 400 normal 350px/0.5 'Yellowtail', Times, serif;
		color: #f2efeb;
		position: relative;
		display: block;
		padding: 0;
		margin: 0;
		z-index: 1;
  }	
	
}

@media screen and (max-width: 1023px) {
	.onlineMagazin__subline strong {
    font-size: 240px;
  }
}
@media screen and (max-width: 800px) {
	.onlineMagazin__subline strong {
    font-size: 25vw;
  }
}
@media screen and (max-width: 600px) {
	.onlineMagazin__subline strong {
		font-size: 21vw;
  }
}