@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: local('Roboto Light'), local('Roboto-Light'), url(../fonts/roboto-light.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: local('Roboto'), local('Roboto-Regular'), url(../fonts/roboto-regular.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Just Me Again Down Here';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: local('Just Me Again Down Here'), local('JustMeAgainDownHere'), url(../fonts/jmadh.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
html {
	margin: 0;
    padding: 0;
    min-height: 100%;
    max-width: 100vw;
	height: auto !important;
    overflow-x: hidden;
}
body {
	font-weight: 300;
	color:#676767;
    font-family: 'Roboto', sans-serif;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-appearance: none;
    margin: 0;
    padding: 0;
    min-height: 100%;
    min-width: 230px;
	height: auto;
    position: relative;
    overflow: hidden;
    background-color: #fff;
    background-image: url(../images/general/bg_haus-badezeit.jpg);
    background-size: 100vw;
    background-attachment: fixed;
    background-repeat: repeat-y;
    background-position: center top;
}
body * {
    box-sizing: border-box;
}
*::-moz-selection {
    color: #fff;
    background-color: #1d4774;
}
*::selection {
    color: #fff;
    background-color: #1d4774;
}

/* FONT ADJUST */
html {
    font-size: 16px;
    line-height: 1.6em;
}

p {
    margin: 0 0 1.3em;
}
a {
    text-decoration: none;
    color: #1d4774;
}
a.button {
    display: block;
    text-align: center;
    width: 100%;
    background-color: #6493c6;
    padding: 20px;
    border-radius: 15px;
    box-shadow: 0 0 13px rgba(0,0,0,0.24);
    color: #fff;
    font-size: 1.2rem;
}
h1 {
    margin: 30px auto 3vh;
    font-size: 4rem;
    transform: rotate(-1.5deg);
    max-width: 750px;
    line-height: 1em;
    font-family: 'Just Me Again Down Here';
    color: #fff;
    text-align: center;
}
.headline {
    flex: 1 1 100%;
}
h1 small {
    text-transform: none;
    font-size: 0.55em;
    line-height: 1em;
    display: block;
    margin: 6px 0;
}
h2 {
    margin: 0px 0px 3vh;
    font-size: 3rem;
    line-height: 1em;
    color: #a6a298;
    font-weight: 400;
    font-family: 'Just Me Again Down Here';
    position: relative;
}
h3 {
    font-size: 1.2rem;
    line-height: 1.2em;
    color: #1d4774;
    text-transform: uppercase;
    margin: 0 0 1rem;
    font-weight: 300;
}
h4 {
    font-size: 1rem;
    line-height: 1.2em;
    color: #1d4774;
    margin: 0 0 1rem;
    font-weight: 400;
}
h5 {
    font-size: 1rem;
	line-height: 1em;
    color: #1d4774;
    margin: 0 0 1rem;
    font-weight: 400;
}
.secticon {
    position: absolute;
    right: 1rem;
    top: 1rem;
    transform: rotate(-1.5deg);
    font-size: 5rem;
    z-index: 0;
    pointer-events: none;
    opacity: 0.2;
}
blockquote {
    margin: 0;
    text-align: right;
    text-transform: uppercase;
    font-style: italic;
    line-height: 1em;
    margin-bottom: 0.3rem;
}
b {
    font-weight: 500;
}
p, b, a, ul, ol {
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
    break-inside: avoid;
}
.ri {
    text-align: right;
    display: block;
}
.wrapper {
    overflow: hidden;
    position: relative;
    z-index: 2;
}

/* HEADER STYLE */
#hundestempel {
    position: absolute;
    top: 30px;
    left: calc(88% - 30px);
    width: 15%;
    max-width: 180px;
    height: auto;
    z-index: 2;
    min-width: 50px;
    transform: rotate(-15deg);
}
.sharebox {
    position: relative;
    height: 85px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 35px;
    left: 0;
    top: 0;
    z-index: 2000;
}
.share {
    display: flex;
    flex-flow: column;
    align-items: center;
    position: relative;
}
.showshare, .showsearch  {
    display: inline-flex;
    cursor: pointer;
    margin: 0;
    height: 21px;
    align-items: center;
}
.showshare img {
    width: 20px;
    margin-right: 5px;
    height: 20px;
    border-radius: 100%;
    transform: scale(1);
    transition: transform 0.1s ease-in;
}
.showshare:active img {
    transform: scale(1.3);
}
.sharebuttons {
    overflow: hidden;
    max-height: 0px;
    width: auto;
    opacity: 0;
    transition: all 0.5s ease-in;
    display: flex;
    flex-flow: column;
    align-items: left;
    position: absolute;
    left: 10px;
    top: 20px;
    filter: drop-shadow(0px 0px 5px rgba(0,0,0,0.5));
}
.sharebuttons:before {
  content:"";
  display:block;
  width:0;
  height:0;
  border-left:10px solid #1d4774;
  border-right:10px solid transparent;
  border-bottom:10px solid #1d4774;
  border-top:10px solid transparent;
  position:absolute;
  transform:scale(0);
  transform-origin:bottom center;
  top:0;
  left:0;
  transition:transform 0.5s ease-in
 }
.sharebuttons.visible {
    overflow: hidden;
    max-height: 500px;
    opacity: 1;
    transition: all 0.5s ease-in;
}
.sharebuttons.visible:before {
  transform:scale(1);
  transition:transform 0.5s ease-in
 }
.sharebuttons > div:not(.tosoc) {
    padding: 5px 10px !important;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    background-color: #1d4774 !important;
    width: 100% !important;
    text-align: left;
    height: auto;
}
.sharebuttons > div.tosoc {
    padding: 0px 10px !important;
    display: block;
    background-color: #1d4774 !important;
    width: 100% !important;
    text-align: left;
    height: auto;
}
.sharebuttons > .tosoc p {
    margin: 0;
    color: #fff;
    hyphens: auto;
    font-size: 0.8rem;
    line-height: 1.3em;
}
.sharebuttons > .tosoc a {
    color: #fff;    
}
.sharebuttons > div:first-of-type {
    padding-top: 10px!important;
    margin-top: 15px;
}
.sharebuttons > div:last-child {
    padding-bottom: 10px!important;
}
.sharebuttons > div:only-child {
    padding-bottom: 10px!important;
}
.search {
    display: flex;
    flex-flow: row;
    justify-content: flex-end;
    align-items: center;
}
.searchbox .search-wrapper {
    margin-bottom: 0;
    margin-right: 10px;
    width: auto;
    max-width: 0px;
    overflow: hidden;
    transition: max-width 0.5s ease-in;
}
.searchbox.visible .search-wrapper {
    max-width: 500px;
}
header {
    width: 100%;
    text-align: center;
    position: relative;
    display: block;
    padding-top: 55px;
}
.logo {
    width: 50%;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    z-index: 2;
    min-width: 200px;
    max-width: 700px;
    background-color: #fff;
    margin: 0 auto;
    padding: 15px;
    border-radius: 0 0 20px 20px;
    box-shadow: 0 0 13px rgba(0,0,0,0.24);
}
.logo a {
    width: 100%;
    display: block;
}
.logo a img {
    width: 100%;
}
.headerbild {
    position: relative;
    z-index: 1;
    width: 100%;
    height: 30vh;
    min-height: 200px;
    max-height: 500px;
    background-image: url(../images/general/header_haus_badezeit.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    box-shadow: 0 0 13px rgba(0,0,0,0.75);
    display: flex;
    flex-flow: row wrap;
    align-content: flex-end;
    padding: 20px;
    align-items: center;
}
.headerbild.large {
    height: auto;
    min-height: calc(100vh - 55px);
    max-height: 1000000px;
    align-content: flex-end;
    align-items: stretch;
}
.sticked .headerbild {
    margin-bottom: 53px;
}
.headerbild .headteaser {
    padding: 20px;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0 0 13px rgba(0,0,0,.24);
    overflow: hidden;
    margin: 20px;
    flex: 1 1 300px;
    display: flex;
    flex-flow: row wrap;
}
.headerbild .headteaser > * {
    flex: 1 1 100%;
    align-self: flex-start;
}
.headerbild .headteaser h2 {
    margin-bottom: 0;
}
.headerbild .headteaser > *:last-child {
    align-self: flex-end;
}
.headerbild .headteaser ul {
    list-style: none;
    padding: 0;
    position: relative;
    height: 4.8em;
    overflow: hidden;
    display: flex;
    flex-flow: column;
    justify-content: stretch;
    align-items: center;
}
.headerbild .headteaser ul li {
    max-height: 0;
    pointer-events: none;
    left: 0;
    right: 0;
    margin: 0;
    padding: 0;
    opacity: 0;
    transform: translateY(1rem);
    transition: all 1s linear; 
    display:flex;
    flex-flow: column;
    justify-content: center;
    flex: 1 1 auto;
}
.headerbild .headteaser ul li > * {
    margin: 0;
}
.headerbild .headteaser ul li.selected {
    max-height: 300px;
    pointer-events: all;
    opacity: 1;
    transform: translateY(0);
    transition: all 1s ease-in-out 1s; 
}
.headerbild .headteaser:nth-child(2) ul li {
    transition: all 1s ease-in-out 1.5s; 
}
.headerbild .headteaser:nth-child(2) ul li.selected {
    transition: all 1s ease-in-out 2.5s; 
}
.headerbild .headteaser:nth-child(3) ul li {
    transition: all 1s ease-in-out 4s; 
}
.headerbild .headteaser:nth-child(3) ul li.selected {
    transition: all 1s ease-in-out 4.5s; 
}
.headerbild .htfewo li > *:not(.fewo-feed-infos) {
    display: none;
}
/* NAVI STYLING */
nav {
    font-size: 1rem;
    line-height: 1.2em;
    margin: 0;
    right: auto;
    z-index: 1000;
    background-color: #fff;
    transition: left 0.5s ease-in;
    position: relative;
    box-shadow: 0 0 13px rgba(0,0,0,0.75);
}
.navi {
    list-style: none;
    padding: 17px;
    height: auto;
    max-height: 53px;
    transition: max-height 0.5s ease-in;
    width: 100%;
    margin: 0;
    display: flex;
    position: relative;
}
nav a {
    color: #676767;
    transition: color 0.5s ease-in;
    white-space: nowrap;
    text-transform: uppercase;
    display: block;
    position: relative;
}
nav a .micon {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: -0.2em auto -0.5em;
    display: block;
    text-align: center;
    font-size: 2em;
    z-index: -1;
    color: rgba(29,71,116,0);
    transition: color 0.5s ease-in;
}
nav a:hover {
    color: rgba(103,103,103,0);
    transition: color 0.5s ease-in;
}
nav a:hover .micon {
    color: rgba(29,71,116,1);
}
.menuitem {
    position: relative;
    text-transform: uppercase;
    margin: 0 20px;
    font-weight: 300;
}

nav ul li.active > a {
    font-weight: 400;
    color: #1d4774;
}
.active2 {
    margin: 0px 0px 26px 0px !important;
}

.navbutton {
    color: #1d4774;
    cursor: pointer;
}

.navbutton p {
    margin: 0;
}
.sticked nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background-color: #fff;
    border-radius: 0;
}
.sticked nav::after {
    width: 100%;
}
.sticked .navi {
    padding: 17px 27px;
}
.sticked .contentwrapper {
    margin: 0 auto 0;
}
/* NORMALES MENÜ */
@media (min-width: 1265px){
.navi {
    flex-flow: row;
    justify-content: center;
    align-items: flex-start;
}
.navbutton {
    display: none;
}
}
/* DROPDOWN-MENÜ */
@media (max-width: 1264px){
.navi {
    flex-flow: column;
    justify-content: flex-start;
    align-items: center;
    overflow: hidden;
}
nav.drop .navi {
    max-height: 1000px;
}
.menuitem {
    margin: 20px auto;
}
.menuitem.navbutton {
    display: block;
    margin: 0px auto 10px;;
}
.submenu {
    display: none;
}
}
/* NAVI STYLING ENDE */
.content {
    width: 100%;
    position: relative;
    z-index: 1;
}
.content:after {
    content: "";
    background-color: #6493c6;
    box-shadow: 0 0 13px rgba(0,0,0,0.75);
    display: block;
    width: 100%;
    position: relative;
    z-index: -1;
    height: 80px;
    margin-top: -40px;
}
.contentwrapper {
    width: 90%;
    position: relative;
    z-index: 100;
    margin: 0 auto 0;
    max-width: 1500px;
}
article {
    position: relative;
}
.anchor {
    height: 100px;
    margin-top: -100px;
}
article.contentbox {
    flex: 1 1 100%;
}
article.veranstaltungen, article.nachrichten, article.insider-tipps {
    padding: 20px;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0 0 13px rgba(0,0,0,.24);
    overflow: hidden;
    margin: 20px;
}
ol { 
    counter-reset: item; 
}
ol li { 
    display: block; 
    text-indent:-13px
}
ol li:before {
    content: counter(item) ". ";
    counter-increment: item;
    color: #444;
    width: 13px;
    display: inline-block;
    text-indent: 0;
}
.main ul li a {
    display: block;
}
.main {
    width: 100%;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    padding: 20px 0px 0;
}
@media (max-width: 450px){
.main {
    padding: 20px 0px 0;
}
h1 {
    font-size: 2rem;
}
h2 {
    font-size: 2rem;
}
    .headerbild {
        padding: 20px 0;
    }
    article.veranstaltungen, article.nachrichten, article.insider-tipps {
        margin: 20px 0;
    }
    article.mod.fewo .rssbox .rssitem {
        margin: 0px;
    }
}
.main > * {
    padding: 0px 20px;
    max-width: 100%;
    margin: 30px auto;
    width: 100%;
    flex: 3 1 500px;
}
.main p, .main ul li, .main ol li {
    width: 100%;
}
.main p img {
    max-width: 100%;
}
.main p img.float {
    float: left;
    margin-right: 20px;
    margin-bottom: 20px;
}
.main ul, .main ol {
    padding-left: 23px;
    margin: 0 0 1.7em;
}
.main ul li, .main ol li {
    margin: 0 0 1em;
}
.main ul {
    list-style-image: url('../images/general/listicon.svg');
}
.sidebar {
    flex: 1 1 100px;
}
.sidebar h3 {
    text-transform: none;
    margin: 0;
}
/* STARTSEITE */
.fewoteaserbox {
    width: calc(100% + 40px);
    position: relative;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: flex-start;
    align-content: stretch;
    margin: 50px -20px 10px;
}
.fewoteaser {
    flex: 1 1 300px;
    max-width: 490px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    align-items: center;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0 0 13px rgba(0,0,0,0.24);
    overflow: hidden;
    margin: 20px;
}
.fewoteaser .img {
    flex: 1 1 75px;
    display: block;
    align-self: stretch;
    background-size: cover;
    background-position: center;
    min-height: 150px;
}
.fewoteaser > div {
    flex: 1 1 85px;
    padding: 20px;
}
.fewoteaser > div > *:not(a) {
    margin-bottom: 1rem;
}
.fewoteaser > div h3 {
    font-size: 1.8rem;
    text-transform: uppercase;
}
.fewoteaser > div h3 small {
    font-size: 1rem;
    line-height: 1em;
    display: block;
    text-transform: none;
}
.fewoteaser > div a {
    display: block;
    text-align: right;
}
/* FEWO SEITE */
ul.pricetable {
    padding-left: 0;
    width: 100%;
}
ul.pricetable li {
    display: flex;
    flex-flow: row wrap;
    align-items: flex-start;
    border-bottom: 1px solid #eee;
}
ul.pricetable li:last-child {
    border-bottom: none;
}
ul.pricetable li.actseason {
    font-weight: 500;
    color: #1d4774;
}
ul.pricetable li.th {
    color: #1d4774;
}
ul.pricetable li > span {
    padding: 5px 0;
}
ul.pricetable li > span.seas{
    padding-left: 0;
    flex: 1 1 150px;
}
ul.pricetable li > span.inf{
    padding-right: 0;
    flex: 2 1 300px;
    display: flex;
    flex-flow: row wrap;
}
ul.pricetable li > span > span {
    flex: 1 1 50px;
    padding: 0 5px;
}
ul.pricetable li span:first-child {
    padding-left: 0;
}
ul.pricetable li span:last-child {
    padding-right: 0;
}
ul.pricetable li > span > span:nth-last-child(-n+2) {
    text-align: right;
}
ul.pricetable li span:only-child {
    text-align: left;
    flex: 1 1 100%;
}
.fewogallery {
    margin: -15px;
}
.fewogallery img {
    display: inline-block;
    padding: 15px;
}
/* KONTAKT SEITE */
form {
    text-align: left;
    display: flex;
    flex-flow: row wrap;
    width: calc(100% + 40px);
    margin: 0px -20px;
    padding: 0px;
}
form .form-field, form .form-spacer {
    display: block;
    width: 100%;
    margin: 0px 0px 20px;
    padding: 0px 20px;
}
form .form-field.half {
    flex: 1 1 150px;
}
form .form-field.full {
    flex: 1 1 100%;
}
form .form-field .form-label {
    margin-bottom: 5px;
}
.form-input-wrapper, .form-input-wrapper input  {
    width: 100%;
}
.checkboxes {
    display: block;
}
.buttons {
    width: 100%;
    padding: 0px 20px;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
}
button {
    background-color: #1d4774;
    border: none;
    flex: 1 1 150px;
    max-width: 150px;
    padding: 10px;
    color: #fff;
    font-size: 1em;
    cursor: pointer;
    width: 30%;
    transition: all .2s ease-in;
    box-shadow: 0 0 13px rgba(0,0,0,0.24);
}
button:hover {
    background-color: #444;
    color: #fff;
}
.form-textarea-wrapper, .form-textarea-wrapper textarea {
    width: 100%;
}
.form-textarea-wrapper textarea {
    min-width: 100%;
    max-width: 100%;
    min-height: 200px;
    resize: none;
}
input, textarea, button {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 10px;
} 
input, textarea {
    border: 0px solid #aaa;
    padding: 10px;
    font-size: 1em;
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    background-color: #f8f8f8;
    color: #444;
    box-shadow: 0 0 0px rgba(0,0,0,0);
    transition: box-shadow 0.5s ease-in;
}
input:focus, textarea:focus {
    box-shadow: 0 0 13px rgba(0,0,0,0.24);
}
.radio {
	display: block;
}
input[type='checkbox'],
input[type='radio'] {
  width:auto;
  float:left;
  margin-right: .75em;
  background:transparent;
  border:none;
}

input[type='checkbox']:checked,
input[type='checkbox']:not(:checked),
input[type='radio']:checked,
input[type='radio']:not(:checked) {
  background: transparent;
  position: absolute;
  visibility: hidden;
  margin:0;
  padding:0;
}

input[type='checkbox'] + label,
input[type='radio'] + label {
    cursor: pointer;
    text-indent: -21px;
    padding-left: 20px;
    display: block !important;
}

input[type='checkbox']:checked + label::before,
input[type='checkbox']:not(:checked) + label::before,
input[type='radio']:checked + label::before,
input[type='radio']:not(:checked) + label::before {
    content: '';
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 17px;
    height:17px;
    border-radius: 50%;
    position: relative;
    top:-5px;
    background-color: #444;
    background-image: url(../images/general/check.png);
    margin-right: 2px;
    background-size: 0%;
    background-repeat: no-repeat;
    background-position: center;
    transition: all .2s ease-in;
    text-align: center;
    font-size: 2rem;
    line-height: 0.5em;
    text-indent: 0px;
}

input[type=radio]:checked + label::before,
input[type=radio]:not(:checked) + label::before {
  border-radius: 50%;
}

input[type='checkbox']:hover  + label::before,
input[type='radio']:hover  + label::before {
    background-color: #1d4774;
    background-size: 65%;
    background-repeat: no-repeat;
    background-position: center;
    transition: all .2s ease-in;
}

input[type='checkbox']:checked  + label::before,
input[type='radio']:checked  + label::before {
    background-color: #1d4774;
    background-size: 85%;
    background-repeat: no-repeat;
    background-position: center;
    transition: all .2s ease-in;
}
.notices {
    margin: 0 0 50px auto !important;
    color: #fff !important;
    position: relative;
    top: 33px;
    overflow: hidden;
    max-height: 0px;
    z-index: 200000;
    width: 100%;
    text-align: center;
    pointer-events: none;
    opacity: 0;
    animation: fadeout 5s linear;
}
@keyframes fadeout {
    0% {opacity: 1;max-height: 100px;}
    75% {opacity: 1;max-height: 100px;}
    100% {opacity: 0;max-height: 0px;}
}
.notices.yellow {
    border-left: 0px solid #ba9800 !important;
    background: #d89b26;
}
.notices.red {
    border-left: 0px solid #f14101 !important;
    background: #c9592e;
}
.notices.blue {
    border-left: 0px solid #005498 !important;
    background: #b9d5da !important;
}
.notices.green {
    border-left: 0px solid #1d4774 !important;
    background: #1d4774 !important;
}
.notices p {
    margin: 20px !important;
}

footer {
    width: 90%;
    max-width: 1500px;
    text-align: center;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: space-evenly;
    padding: 25px 50px;
    margin: 0 auto;
    line-height: 24px;
    position: relative;
    z-index: 100;
}
footer p {
    margin: 0;
}
footer p > span {
    white-space: nowrap;
}
footer p, footer a {
    color: #1d4774;
}
body .cc-banner.cc-top {
    border-bottom: 0px solid #fff;
}
body .cc-revoke, body .cc-window {
    font-family: inherit;
    font-size: 1rem;
}
body .cc-revoke, body .cc-window {
    z-index: 200000;
}
body .cc-banner .cc-message {
    padding-right: 30px;
}
.slider {
    position: relative;
    width: 100%;
    z-index: 0;
}
.slider:after {
    content: "";
    background-color: #6493c6;
    box-shadow: 0 0 13px rgba(0,0,0,0.75);
    display: block;
    width: 100%;
    position: relative;
    z-index: 2;
    height: 35px;
}
.sliderwrapper {
    position: relative;
    width: 90%;
    max-width: 1500px;
    margin: 0 auto;
}
.slider .slbox {
    z-index: 1;
    position: relative;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    justify-content: flex-start;
    width: calc(100% - 40px);
    padding: 0px 10px;
    margin: 0 auto;
    height: 131px;
    overflow: hidden;
}
.slider .slbox img {
    border: 8px solid #fff;
    box-shadow: 0 0 13px rgba(0,0,0,0.24);
    margin: 0 22px;
    transition: all 0.5s ease-in;
}
.slider .slbox img:hover {
    box-shadow: 0 0 13px rgba(0,0,0,0.75);
}
.slider .slbox img {
    display: block;
}
.slarrow {
    height: 131px;
    width: 30px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: auto;
    cursor: pointer;
    filter: brightness(100%);
    transition: filter 0.5s ease-in;
}
.slarrow:hover {
    filter: brightness(70%); 
}
#left {
    background-image: url(../images/general/slider_left.png);
    left: 0;
}
#right {
    background-image: url(../images/general/slider_right.png);
    right: 0;
}
img.pu {
    cursor: pointer;
    box-shadow: 0 0 0px rgba(0,0,0,0);
    transition: box-shadow 0.5s ease-in;
}
img.pu:hover {
    box-shadow: 0 0 13px rgba(0,0,0,0.24);
}
.pu-imagebox {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    max-width: 100vw;
    max-height: 100vh;
    background-color: rgba(0,0,0,0.7);
    z-index: 2000;
    width: auto;
    height: auto;
    padding: 40px;
    display: flex;
    flex-flow: column;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.5s ease-in;
}
.pu-imagebox.pu-show {
    pointer-events: all;
    opacity: 1;
    transition: opacity 0.5s ease-in;
}
.pu-sign {
    color: #fff;
    cursor: pointer;
    font-size: 3rem;
    position: absolute;
    -ms-user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none; 
    opacity: 0.7;
    transition: opacity 0.5s ease-in;
}
.pu-sign:hover {
    opacity: 1;
}
.pu-arr {
    top: 0;
    bottom: 0;
    margin: auto;
    height: 1em;
}
.pu-arr#pu-left {
    left: 20px;
}
.pu-arr#pu-right {
    right: 20px;
}
.pu-close {
    top: 15px;
    right: 20px;
}
.pu-imagewrapper {
    position: relative;
    height: calc(100% - 80px);
    width: calc(100% - 80px);
    margin: 0 auto;
}
.pu-imagewrapper img {
    max-width: 100%;
    max-height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    animation: pu-fadein 0.5s ease-in;
}
@keyframes pu-fadein {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
.pu-text {
    color: #fff;
    font-size: 1.5rem;
    text-align: center;
}
.pu-body .wrapper {
    transition: filter 0.5s ease-in;
}
.pu-body.pu-open .wrapper {
    filter: blur(2px);
}

.rsswrapper .rssbox {
    display: none;
    opacity: 0;
}
.rsswrapper .rssbox.visible {
    display: block;
    animation: fi 0.5s ease-in;
    animation-fill-mode: forwards;
}
@keyframes fi {
    0% {opacity: 0}
    100% {opacity: 1}
}
.rsspag {
    text-align: center;
    z-index: 10;
    position: relative;
    -webkit-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
}
.rsspag > span {
    display: inline-block;
    margin: 0 0.5em;
    cursor: pointer;
}
.rsspag > span.pagact {
    font-weight: 700;
}
.mod.fewo, .mod.tipps {
    flex: 1 1 100%;
}
.mod.fewo .rssbox.visible {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin: 0 -20px;
    flex-flow: row wrap;
}
.mod.fewo .rssbox .rssitem {
    flex: 1 1 300px;
    padding: 20px;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0 0 13px rgba(0,0,0,.24);
    overflow: hidden;
    margin: 20px;
}
.mod.fewo .rssbox .rssitem.empty{
    box-shadow: none;
    padding: 0 20px;
}
.mod.fewo .rssbox .rsscont {
    display: flex;
    flex-flow: row wrap;
}
.mod.fewo .rssbox .rsscont img {
    flex: 1 1 150px;
    order: 1;
    display: block;
    width: 100%;
    height: 200px;
    object-fit: cover;
    margin-bottom: 1rem;
}
.mod.fewo .rssbox .rsscont .fewo-feed-infos {
    flex: 1 1 150px;
    order: 2;
    padding: 10px;
}
.mod.fewo .rssbox .rsscont .fewo-feed-infos > span {
    display: block;
}
.mod.fewo .rssbox .rsscont .ctalink {
    flex: 1 1 100%;
    order: 3;
}
.mod.fewo .rssbox .rsscont > *:not(.fewo-feed-infos):not(.ctalink):not(img) {
    display: none;
}
a.ctalink {
    display: block;
    background-color: #1d4774;
    color: #fff;
    padding: 10px;
    border-radius: 5px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    font-size: 1rem;
    line-height: 1;
    width: 120px;
    margin: 0 auto 0 0;
    text-align: center;
}

.mod.tipps .textwrapper {
    text-align: left;
    -webkit-columns: 400px;
    -moz-columns: 400px;
    columns: 400px;
        column-count: auto;
    -webkit-column-gap: 40px;
    -moz-column-gap: 40px;
    column-gap: 60px;
    -webkit-column-count: 2;
    -moz-column-count: 2;
    column-count: 2;
    column-fill: balance;
}
.mod.tipps svg {
    width: 100%;
    display: block;
    /*! min-width: 100%; */
}
.mod.tipps svg g {
    transition: all 0.5s ease-in;
    cursor: pointer;
}
.mod.tipps .planwrapper {
    position: relative;
    padding-bottom: 57.24%;
    min-height: 458px;
    overflow: hidden;
}
.mod.tipps .planwrapper .pwr {
    overflow: hidden;    
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
}
.mod.tipps .planwrapper .pwr:hover {
    overflow: scroll;
    scrollbar-width: thin;
}
.mod.tipps .plan {
    display: block;
    position: relative;
    background-position: top left;
    background-size: cover;
    min-width: 800px;
    transform: scale(1);
    transition: transform 0.5s ease-in-out, width 0.5s ease-in-out;
    width: 100%;
}
.mod.tipps .planwrapper.zoom .plan {
    width: 200%;
    min-width: 1600px;
}
.mod.tipps .planwrapper.zoom2 .plan {
    width: 400%;
    min-width: 3200px;
}
.mod.tipps .planwrapper.zoom2 .plan, .mod.tipps .planwrapper.zoom .plan {
    cursor: grab;
}
.mod.tipps .planwrapper.zoom2 .plan.hold, .mod.tipps .planwrapper.zoom .plan.hold {
    cursor: grabbing;
}
.mod.tipps .planwrapper .tipp {
    position: absolute;
    padding: 10px;
    width: 100%;
    top: 0;
    left: 0;
    background-color: rgba(255,255,255,0);
    transition: all 0.5s ease-in;
    pointer-events: none;
}
.mod.tipps .planwrapper .tipp.filled {
    background-color: rgba(255,255,255,0.9);
}
.mod.tipps .planwrapper .zoomit {
    position: absolute;
    bottom: 0;
    right: 0;
    padding: 10px;
    color: #fff;
    background-color: #1d4774;
    cursor: pointer;
}