﻿/* Schriften */
@font-face{font-family:Bauhaus;src:url(/fonts/bauhausb.ttf) format("truetype"),url(/fonts/bauhausb.woff2) format("woff2")}
@font-face{font-family:BauhausM;src:url(/fonts/bauhausm.ttf) format("truetype"),url(/fonts/bauhausm.woff2) format("woff2")}
@font-face{font-family:BauhausH;src:url(/fonts/bauhaush.ttf) format("truetype"),url(/fonts/bauhaush.woff2) format("woff2")}
@font-face {font-family:System;font-style:normal;font-weight:500;src:local("Tahoma"), local("Verdana"), local("Arial");font-display:swap}



/* Global */
*{margin:0;padding:0}
html,body{height:100%}
/*header,section,footer,nav,main,{display:block}*/
body{background-color:#9e9e9e;color:#333;font-size:1em;font-family:System, 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', sans-serif}
#main-back{position:fixed;top:0;bottom:0;left:0;right:0;background-repeat:no-repeat;background-position-x:center;background-position-y:top;background-size:cover}
main{position:relative;min-height:100%;min-width:300px;background:rgba(100,100,100,.8);overflow:hidden}
p,td{-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}
section p{text-align:justify}
iframe{border:0px solid transparent;overflow:hidden;display:block;box-sizing:border-box;min-height:50vh}
ul{list-style-type:disc;color:#5d005d;list-style-position:inside;margin-left:1vw}
li{color:#333;padding:.2em 1em}
video{max-width:100%}



/* Header */
header{width:100%;height:260px;position:relative}
#header-wrapper{height:260px;margin:0 auto;width:1260px;position:relative}
#header-wrapper #header-ani{width:1260px;height:198px}
#header-wrapper #header-motto{position:absolute;right:2vw;bottom:0}
#header-wrapper #header-abs{position:absolute;right:10px;bottom:-60px;width:auto;height:260px}
#header-wrapper .logo{position:absolute;bottom:1vw;left:2vw}
#header-wrapper .logo img{height:180px}
#header-wrapper .logo-withImg{position:absolute;top:52px;left:2vw}
#header-wrapper .logo-withImg img{height:80px}
#header-wrapper #notification{position:absolute;right:.2vw;bottom:1vw}
#header-wrapper #notification .notification-text{font-size:small;color:#5d005d;padding:0 40px;line-height:32px}
#header-wrapper #notification .notification-text a{position:absolute;bottom:0;right:0;font-size:1.4em;text-decoration:none}
#header-wrapper #notification .notification-text a img{vertical-align:middle}

#menu-wrapper{z-index:100000;background-color:#5d005d;height:80px;width:100%;transition:height 0.2s cubic-bezier(0.55, 0, 0.1, 1)}
.sticky{position:fixed;top:0;width:100%} /* The sticky class is added to the header with JS when it reaches its scroll position */
.sticky + #container{padding-top:80px} /* Add some top padding to the page content to prevent sudden quick movement (as the header gets a new position at the top of the page (position:fixed and top:0) */
.header-panels{position:absolute;top:0;left:0;right:0;height:50px;overflow:hidden;display:table;width:100%;z-index:1}
.header-panels .panel{width:33.33333%;float:left;height:50px;padding:0 2em;box-sizing:border-box;display:table-cell;line-height:50px}
.header-panels .panel:nth-child(1){background:rgba(255,255,255,.2)}
.header-panels .panel:nth-child(2){background:rgba(255,255,255,.7)}
.header-panels .panel:nth-child(3){background:rgba(255,255,255,.9);text-align:right}



/* Navigation */
#menuContainer{display:block;width:1260px;margin:0 auto;z-index:10;height:80px}
nav{position:relative;line-height:80px;transition:all 0.2s cubic-bezier(0.55, 0, 0.1, 1);margin-left:80px}
nav a{text-decoration:none}
nav ul{list-style:none;padding:0;margin:0;font-size:0}
nav ul li:not(.shariff-button){display:inline-block;box-sizing:border-box;text-align:center;width:23%;color:#FFF;font-size:20px;text-transform:uppercase;cursor:none;letter-spacing:10px;transition:background .4s ease-out;font-weight:bold;white-space:nowrap}
nav ul li:not(.shariff-button) a{display:block;color:#E1E1E1;transition:all .2s ease-out;cursor:pointer;font-weight:normal}
nav ul li:not(.shariff-button) a.special{transform:rotate(5deg)}
nav ul li:not(.shariff-button) a img{vertical-align:middle;opacity:0.5}
nav ul li:not(.shariff-button) a:hover img{opacity:1}
nav ul li:not(.shariff-button) a:visited{color:#E1E1E1}
nav ul li:not(.shariff-button):hover{background-color:#882288;color:#fff}
nav ul li:not(.shariff-button):hover a{color:#fff}
nav ul li:not(.shariff-button) a:hover{color:#fff;transform:scale(1.1)}
nav ul li:not(.shariff-button) span{letter-spacing:3px}
nav .current{background:#fff;color:#5d005d}

nav #share{position:absolute;top:0;right:0;line-height:initial;z-index:100}

.topnav{display:none}
#menu-banner #header-motto-mobile{display:none}

#share{text-align:right}
.sharenav{position:relative;display:none;float:right;box-sizing:border-box;z-index:100}
.sharenav.responsive {display:block;float:none}
#nav-share{text-align:center}

#nav-mobile .subitem{clear:both}
#nav-mobile .social{float:right;clear:unset;margin:1vw 2vw}
#nav-mobile .subitem img{height:1.4em;width:1.4em}
.fb1{border:#3b5998 3px solid}
.fb2{border:#E1E1E1 3px solid}
.in1{border:#fff 3px solid}
.in2{border:#fff0f5 3px solid}

/* Status-Popup */
.status{position:fixed;z-index:9999999;bottom:0;width:100%;text-align:center;padding:2em;color:#5d005d;background:#DAC600;box-sizing:border-box}
.status.start{opacity:1;transition:opacity 2s ease-out 15s}
.status .close{position:absolute;top:0;right:10px;transition:all 200ms;font-size:30px;font-weight:bold;text-decoration:none;color:#333}
.animation .status{opacity:0}
.status p .message-success{color:#31B404}
.status p .message-warn{color:#DF0101}
.status p .message-error{color:#DF0101;font-weight:bold}



/* Hauptfenster */
#container{margin:0 auto;width:1260px;padding-bottom:280px;position:relative}
#container .topnav{display:none}
#container .logo{display:none}
.page-main{position:relative;margin-top:50px}
.page-sub{margin:0;display:block}
.page-sub2{padding:4vw;background-color:#FFF}
.page-sub2 h1{padding:1vh 0}
.page-sub2 h2{padding:10vh 0 1vh 0}
.page-sub2 h3{padding:1vh 0 0 0;color:#9e9e9e}
.page-sub2 > img:not(.full){width:100%;padding:4vh 0;max-width:300px;height:auto}
.page-sub3 h1{padding:1vh 4vw}
.page-sub3 h2{padding:10vh 4vw 1vh 4vw}
.page-sub3 section h3{padding:2vh 4vw 0 4vw;color:#9e9e9e}
.page-sub2 h1,.page-sub2 h2,.page-sub3 h1,.page-sub3 h2{font-size:1.8em;color:#5d005d;font-family:Bauhaus;text-transform:uppercase;letter-spacing:3px}
.page-sub2 p,.page-sub2 section p,.page-sub2 section ul{padding:2vh 0;line-height:1.6em}
.page-sub3 section p,.page-sub3 section .cards-status{font-size:1.1em;padding:2vh 4vw;line-height:1.6em;box-sizing:content-box}
.page-sub3 section p span{font-size:.8em;font-weight:700}
.page-sub3 .cards .cards-status{display:none}
.page-sub3 .cards .list{padding-right:4vw}
.page-sub3 .cards .list .list{padding-right:0;padding-bottom:2vw}
.page-sub2 section p img:nth-child(1){float:left;margin-right:1vw}
.page-sub3 .fadeIn{margin-bottom:2vh}
.page-sub3 section .content{background-color:rgba(256,256,256,0.8)}
.page-sub3 .boxes{display:flex;justify-content:space-between}
.page-sub3 .boxes div{flex-basis:fit-content}
.page-sub3 .boxes p{text-align:initial}
.page-sub3 .img-thumb{width:100%;height:100%}
.page-sub3 .list p{text-align:inherit}
/*.page-sub3 .list p strong{display: none;}*/
.page-sub3 em{font-style:normal}



/* Tabellen allgemein */
.th{text-align:left;line-height:2em;margin-top:1em}
td{padding:.1em 1em;vertical-align:middle}



/* Links allgemein */
.popup a:link,.subFooter a:link,#container a:link,.popup a:visited,.subFooter a:visited,#container a:visited{text-decoration:none;color:#882288;transition:all .4s linear}
.popup a:hover,.subFooter a:hover, #container a:hover, .subFooter a:active, #container a:active{color:#5d005d}
/* Links auf dunklem Hintergrund allgemein */
.popup-img a:link,.popup-img a:visited{text-decoration:none;color:#fff !important;transition:all .4s linear}
.popup-img a:hover,.popup-img a:active{color:#882288}



/* Formulare allgemein */
table td form{display:table-cell;padding:.5em;vertical-align:middle}
input,select, option{font-family:System}
input[type=number],input[type=text],input[type=tel],input[type=email],select{border:1px solid #f0f0f0;background-color:#f0f0f0;transition:all .4s linear;padding:.5em;margin-right:1em}
input[type=number]{width:50px;text-align:center}
input[type=number]:hover,input[type=text]:hover,input[type=tel]:hover,input[type=email]:hover,select:hover{border:1px solid #5d005d}
input[readonly='readonly']{border:1px solid transparent;background-color:transparent;transition:none}
input[readonly='readonly']:hover{border:1px solid transparent}

select{-moz-appearance:none;-webkit-appearance:none;appearance:none;margin-right:.5em;text-align:right;border:1px solid transparent;background-color:transparent;transition:all .4s linear;padding:.5em;outline:none}
select::-ms-expand{display:none} /* IE Dropdown-Pfeil entfernen */
select:focus::-ms-value{background-color:transparent} /* IO nach Markierung das Dropdown transparent halten */
form:hover select{border:1px solid #5d005d;background-color:#f0f0f0}



/*Saison-Next + Special mit Plakat*/
#saison-next,.event-imp{width:100%;padding:0 0 4vh 0;overflow:hidden;box-sizing:border-box}
#saison-next .title{background-color:#5d005d;color:#fff;font-family:Bauhaus;text-transform:uppercase;letter-spacing:1px;position:relative}
#saison-next .title a{position:absolute;bottom:.1em;right:.1em;color:#fff;font-size:1.4em}

.news-next,.event-imp{display:flex;justify-content:center}
.event-next{display:flex;justify-content:space-between;flex-wrap:nowrap}
.news-next{flex-wrap:nowrap;background-color:#f0f0f0}
.event-next div{flex-shrink:2;align-items:stretch}
.news-next div{align-items:stretch}
.event-next .content{line-height:1.6em;display:grid} /*;margin:0 auto}*/
.event-next .img-thumb img{display:flex;max-height:200px} 
.news-next .center{margin:0 auto}
.news-next .left{margin:0 initial}
.news-next .content{position:relative}
.event-next .content p,.news-next .content p{padding:3vh 2vw;font-size:1.1em}
.event-next .content p span,.news-next .content p span{font-size:.8em}
.news-next .content p{line-height:1.6rem}
.news-next .content a{display:block} /*.event-next .content a,*/
.news-next .content .conditional a{display:initial}
.event-next .content img.ori,.event-imp .content img{width:100%;height:auto}
.news-next .content .img-content{max-height:300px;vertical-align:bottom}
.event-imp .content img{max-width:1200px}
.event-next div:nth-child(2) a,.news-next div:nth-child(2) a{display:block;height:100%}



/*Saison-Infos */
#events{padding:.5vh 45px}
.slides-nav .slide-nav{display:table;height:15vw;width:15vw;max-height:150px;max-width:150px;margin:0 auto;background-position:center;background-size:cover;overflow:hidden;border:#5d005d 1px solid;position: relative}
.slides-nav .slick-current .slide-nav{border-color:#f0f0f0}
.slides-nav .slide-nav p{cursor:pointer;display:table-cell;vertical-align:middle;text-align:center;color:#fff;font-family:Bauhaus;text-transform:uppercase;background-color:rgba(0, 0, 0, 0.7)}
.slides-nav .slick-current .slide-nav p{cursor:initial;background-color:rgba(0, 0, 0, 0.3)}
#slider-outer{padding:3vh 45px}
#slider{background-color:#fff}
.saison-image{float:left;width:50%}
.saison-image img{width:105%;height:auto}
.saison-info{width:50%;float:right;padding:1.8vh 0 0 0;box-sizing:border-box;position:relative}
.saison-pictures{padding:0}
.saison-cards{padding:0 0 2em 0}
.saison-info p,.saison-pictures p,.saison-cards p{padding:1vw 0}
.saison-info .meta,.saison-pictures .meta, #saison-next .meta,.saison-cards .meta{font-size:.9em;height:auto;padding-bottom:3px}
.saison-info .meta,.saison-pictures .meta,.saison-cards .meta{color:#a9a9a9}
#saison-next .meta{color:#fff}
.saison-info .meta,.data,.saison-info .cards{margin-left:3vw;margin-right:1vw}
.saison-pictures .meta, #saison-next .meta,.saison-cards .meta{margin-left:2vw}
.saison-info .meta span:last-child,.saison-pictures .meta span:last-child,.saison-cards .meta span:last-child{float:right;padding-right:1px}
.saison-info .title,.saison-pictures .title,.saison-cards .title{background-color:#DAC600;color:#fff;font-family:Bauhaus;text-transform:uppercase;letter-spacing:1px}
.saison-info .title-passed,.saison-pictures .title-passed,.saison-cards .title-passed{background-color:#a9a9a9;color:#fff;font-family:Bauhaus;text-transform:uppercase;letter-spacing:1px}
.saison-info .title,.saison-info .title-passed{padding:.4em 2vw}
.saison-info .title h1,.saison-info .title h2,.saison-info .title-passed h1,.saison-info .title-passed h2{font-size:1.8em}
.saison-info .title h3,.saison-pictures .title h3,#saison-next h4,.saison-cards .title h3,.saison-info .title-passed h3,.saison-pictures .title-passed h3,.saison-cards .title-passed h3{font-size:20px}
.saison-info .title h3,.saison-info .title-passed h3{text-align:right}
.data,.saison-info .cards{position:relative;margin-left:3vw}
.data td{text-align:left;vertical-align:top}
.data .c1{padding:0 1em 0 0}
.data .c2{padding:.8em 0 0 0;font-size:.8em;color:#a9a9a9;white-space:nowrap}
.data .c3{font-size:1em;line-height:1.4em}
.data .c3 .music{max-width:100%;min-height:1em;max-height:4em}
.data .c3 .small{font-size:.7rem}

.data > div,.cards > div:nth-child(2){clear:unset !important}

.data .event-date{font-size:1.5em;position:relative;height:6em}
.data .event-date span{font-size:.4em}
.cards .list:nth-child(2),.cards .list:nth-child(3),.cards .list:nth-child(4),.cards .list:nth-child(5),.cards .list:nth-child(6){clear:both}
.saison-info .cards .list .list{padding-right:0;padding-bottom:2vw}
.saison-info .slider-galleries-outer{float:right}
.cards iframe{float:right}
.cards div p{text-align:right;line-height:1.6rem;font-size:.8em}
.cards div p em{font-size:1.3em;font-style:normal;hyphenate-limit-chars:6}
.cards div p + table{margin-top:-1vw}
.cards div table{float:right}
.cards div table td{border:none}
.cards .cards-status{clear:none;float:left;padding:1vw 1vw .8em 0}
.cards .card-phone{clear:none;float:left;padding:.8em .8em .8em 0}
.cards div table,.popup .content table{border:none;margin:.2em;border-collapse:collapse}
.cards div table tr,.popup .content table tr{line-height:1.2em}
.cards div table td,.popup .content table td,.popup .content table th{height:2.4em}
.popup .content table th{font-size:.8em;color:#a9a9a9}
.popup .content table td.input span{font-size:.8em}
.popup .content table td img{vertical-align:sub}
.saison-info .gallery{padding-left:4em}
.saison-info .gallery .img-latest{overflow:hidden;text-align:right}
.saison-info .gallery .img-latest a{display:block}
/*.saison-info .gallery .img-latest img{width:-moz-available;width:-webkit-fill-available;width:available}*/
.saison-pictures,.saison-cards{width:100%;overflow:hidden}
.saison-pictures .title,#saison-next .title,.saison-cards .title{padding:.4em 2vw}
.popup .content table .total{font-weight:bold;border-top:1px solid #e9e9e9}
.cards div table td.input input,.popup .content table td.input input{vertical-align:middle}
.cards .card-phone{font-size:2em}
#saison-important{padding-top:3vh}


/* Galerie-Slider */
.slider-galleries-outer{overflow:hidden}
.slider-galleries{display:flex}
.slider-galleries img{height:145px;width:auto}
.slider-galleries .img_subtitle,.gallery .img_subtitle{position:relative;font-family:BauhausM}
.slider-galleries .img_subtitle img,.gallery .img_subtitle img{display:block}
.slider-galleries .img_subtitle span,.gallery .img_subtitle span{position:absolute;bottom:0;right:.2em;text-align:right;color:hsla(0, 0%, 100%, 0.7);opacity:0;font-size:2em}
.slider-galleries .img_subtitle:hover span,.gallery .img_subtitle:hover span{opacity:1;transition:.5s ease-in-out}


/* Teaserbanner */
.teaser-container{width:100%;height:auto;min-height:15em;background-color:#5d005d;display:flex;justify-content:center;align-items:center;box-sizing:border-box;padding:1vw}
.bc-aussen{color:#fff;background-image:url(../images/saison/bc-aussen_t.jpg);background-repeat:no-repeat;background-size:cover;background-position:center;}

.teaser-content{font-size:2.4em;font-family:'BauhausH';padding-top:3em;text-align:center;}
.teaser-content a{color:inherit !important}

/* Footer */
footer{position:absolute;bottom:0;width:100%;font-size:.9em} /*;height:150px*/
.mainFooter{display:table;background-color:#5d005d;height:40px;width:100%}
.mainFooter p{display:table-cell;vertical-align:middle;padding-left:8em;padding-right:8em;color:#FFF;position:relative;font-size:.9em}
.mainFooter p > a{font-family:BauhausM;font-size:1.1em;transition:all .2s ease-out;cursor:pointer;display: inline-block}
.mainFooter p > a+a{margin-left:4vw}
.mainFooter p > a:hover{transform:scale(1.1)}
.mainFooter span.right{position:absolute;right:8em}
.mainFooter a {color:#FFF !important;text-decoration:none}

.subFooter{margin:0 auto;width:1260px;height:230px;overflow:hidden}
.subFooter .panel{width:33.33333%;float:left;height:210px;padding:20px 2em;box-sizing:border-box;margin-top:20px;transition:.4s ease-out}
.subFooter .panel:hover{margin-bottom:0;margin-top:10px}
.subFooter .panel:nth-child(1){background-color:#DAC600;background-image:url(../images/components/panel_back_clown.png);background-repeat:no-repeat;background-position-x:right;background-position-y:top}
.subFooter .panel:nth-child(2){background-color:#AED200}
.subFooter .panel:nth-child(3){background-color:#58C200;background-image:url(../images/components/panel_back_elferrad.png);background-repeat:no-repeat;background-position-x:right;background-position-y:top}
.subFooter .panel p+p{margin-top:7px}
.subFooter .panel a img{display:block;float:left;box-sizing:border-box;background-color:rgba(0,0,0,0);padding:3px;transition:.4s ease-out}
.subFooter .panel a:hover img{background-color:rgba(0,0,0,0.4)}
.subFooter .panel p{line-height:1.6em;font-size:1em}
.subFooter .panel p em{font-weight:700;font-style:normal;white-space:nowrap}
.subFooter .panel p span{float:right;font-size:.8em}
.subFooter .panel .links{display:flex;flex-wrap:nowrap;justify-content:space-between;align-items:center;column-gap:3px;padding-bottom:3px;align-content:space-around}
.subFooter .panel .links div{padding:0;max-height:50px}
.subFooter .panel .links div img{height:47px}
.subFooter .panel .links div a img{height:50px;width:auto}
.subFooter .panel .links div a:hover{cursor:alias}
.subFooter .panel .links div img:hover{z-index:100;position:relative}

.layer{background:rgba(0, 0, 0, .7);position:absolute;top:0;left:0;right:0;bottom:0;padding:inherit}
.subFooter .bc-aussen{opacity:1;transition:.4s ease-out;position:relative;padding:20px 2em;}
.subFooter .bc-aussen .layer{opacity:1;transition:.4s ease-out}
/*.subFooter .bc-aussen:hover .layer{opacity:0}*/

/* Popup-Fenster */
.overlay{position:fixed;top:0;bottom:0;left:0;right:0;background:rgba(0, 0, 0, 0.7);transition:opacity 500ms;visibility:hidden;opacity:0;z-index:9999999}
.overlay:target{visibility:visible;opacity:1}
#popup-cart .popup,#popup-userdata .popup,#popup-summary .popup,.popup-news .popup{min-width:600px;max-width:600px}
.popup{margin:3vh auto;padding:2vw;background:#fff;display:table;position:relative;transition:all 5s ease-in-out}
.popup-img{box-sizing:border-box;margin:0 auto;height:100%;width:auto;padding:3vw;position:relative;transition:all 5s ease-in-out}
.popup h2,.popup-img h2{margin-top:0;color:#5d005d;font-family:Bauhaus;text-transform:uppercase;padding:0 0 1vh 0}
.popup h2 img,.popup-img h2 img{vertical-align:middle}
.popup p,.popup ul{padding:1vw 0}
.popup ul{list-style-type:none;font-size:1.1em}
.popup ul li{font-size:1em;line-height:1.8em;padding-left:1vw}
.popup .close,.popup-img .close{position:absolute;top:0;right:10px;transition:all 200ms;font-size:3em;font-weight:bold;text-decoration:none;color:#333;z-index:2}
.popup .close:hover,.popup-img .close:hover,.popup .nav a{color:#5d005d}
.popup .content{max-height:30%;overflow:hidden}
.popup .content img{max-height:70vh;max-width:600px;margin-right:1vw} /*float:left*/
.popup-img .content{position:absolute;top:3vh;left:3vw;right:3vw;bottom:3vh;text-align:center}
.popup-img .content img{width:auto;max-height:100%;object-fit:contain;max-width:100%}
.popup-news .content{text-align:center}
.popup-news .content p,.popup-news .content h3{text-align:left}
.popup .content table{padding:2vw}
.popup p.nav{padding:0 3vw;clear:both;text-align:center}
.popup p.nav a{transition:all 200ms;font-size:1.2em;font-weight:bold;text-decoration:none;color:#333;padding:0 3vw}



/* Formulare spezifisch */
#cards-form-delete{float:right}
#popup-button-backward{float:left;padding-left:.8em}
#popup-button-forward{padding-right:.8em;float:right}
#popup-button-download{padding-bottom:.8em;float:right}
#popup-cart input[type=number],#popup-cart input[type=text]{width:50px}
#form-userdata table{width:97%}
#form-userdata table td{padding:.5em}
#form-userdata table input[type=text],#form-userdata table input[type=email],#form-userdata table input[type=tel]{width:100%;box-sizing:border-box}
#form-summary p input[type=text],#form-summary p input[type=email],#form-summary p input[type=tel]{width:100%;box-sizing:border-box;padding:0}
#form-search{display:inline-flex;vertical-align:middle}
.hasPassed{color:#a9a9a9}
.ssl{float:right;margin-right:1vw}



/* Warenkorb */
.cart-status{padding:1vw !important;background-color:#AED200}
.action{font-size:0.8em;color:#58C200;font-weight:normal}
.action.start,.cart-status.start{opacity:1;transition:opacity 2s ease-out 4s}
.animation .action,.animation .cart-status{opacity:0}



/* Registerkarten rechts */
#tab{position:fixed;right:0;top:50%;z-index:1000}
#tab .short-ani{font-size:.9em;float:right;clear:both;padding:0;margin-bottom:.3em}
#tab .short-ani a{width:3em;padding:.8em 2em .8em .8em;transition:all .4s ease-out}
#tab .short-ani a:hover,#tab .short-ani a:focus,#tab .short-ani a:active{padding-right:5em}
#tab a{display:block;max-height:32px}
#tab a img{max-height:32px;max-width:32px}
#tab-fb{color:#fff;border:1px transparent}
#tab-fb div.tab-sub1{max-height:200px;overflow:hidden;background-color:#3b5998}
#tab-fb div.tab-sub2{max-height:0;opacity:0;background-color:#882288;transition:all 1s ease-out}
#tab-fb div.tab-sub1:hover div.tab-sub2,#tab-fb div.tab-sub1:active div.tab-sub2,#tab-fb div.tab-sub1:focus div.tab-sub2,#tab-inst div.tab-sub1:hover div.tab-sub2,#tab-inst div.tab-sub1:active div.tab-sub2,#tab-inst div.tab-sub1:focus div.tab-sub2{max-height:100px;opacity:1;animation:fadeIn 1s ease-out;transition:all 1s ease-in}
/*#tab-fb div.tab-sub2{display:none}
#tab-fb div.tab-sub1:hover div.tab-sub2,#tab-fb div.tab-sub1:active div.tab-sub2,#tab-fb div.tab-sub1:focus div.tab-sub2{display:block;animation:fadeIn 1s ease-out}*/

#tab-inst{border:1px transparent}
#tab-inst div.tab-sub1{max-height:200px;overflow:hidden;background-color:#fff}
#tab-inst div.tab-sub2{max-height:0;opacity:0;background-color:#fff0f5;transition:all 1s ease-out}

#tab-news{background-color:#5d005d;border:1px transparent}
#tab-cart{background-color:#AED200;border:1px transparent}



/* Individuell */
#galerie{margin-top:-50px}
.slidesSpec{display:grid;}
.loading{color:#a9a9a9;text-align:center;vertical-align:middle}
.clear{clear:both;height:1px;width:100%}
.conditional{font-size:.8em !important;text-align:justify;line-height:1.4em}
.conditional2{font-size:.7em;text-align:justify;line-height:1.2em}
p a > img{display:inline;vertical-align:middle} /* Bild in Absatzzeile mit Verlinkungstext vertikal mittig ausrichten */
.important{font-size:1.2em !important}
.full{width:100%;height:auto}
.red{color:#F00}
.right{float:right}
.error,.attention{color:#F00;font-weight:800}
.notification{background-color:#fff0f5;border-color:#5d005d;border-width:1px;border-style:solid;}
p.notification{padding:2vh;margin:2vh 0}
#logo-small{width:80px;height:80px;float:left;background-image:url(../images/components/logo-small.svg);background-size:auto 65px;background-repeat:no-repeat;background-position-x:center;background-position-y:center;opacity:0}
.visible{opacity:1!important;transition:all 1s ease-out}
.desaturated{filter:grayscale(100%);-webkit-filter:grayscale(100%);-moz-filter:grayscale(100%);filter:url(../images/components/desaturate.svg#greyscale);filter:gray;-webkit-filter:grayscale(1)}
.running{animation:blinker 3s linear infinite}
.running-slower{animation:blinker 7s linear infinite}
#map{border:1px solid #a9a9a9;width:100%;height:35vh}
.button-green{display:inline-block;background-color:#58C200;padding:.5em 1em;color:#fff !important;font-weight:700;letter-spacing:1px}
.button-red{display:inline-block;background-color:#a9a9a9;padding:.5em 1em;color:#fff !important;font-weight:700;letter-spacing:1px}
.button-green div,.button-red div{display:flex;align-items:center;column-gap:.5em}
.button-green div img,.button-red div img{width:auto;max-width:30vw;height:auto;max-height:27px}
@keyframes blinker{
	0%{opacity: 0}
	50%{opacity: 1}
	100%{opacity: 0}
}
.text-2columns{column-count:2;column-gap:2vw}
.text-3columns{column-count:3;column-gap:2vw}
.text-2columns div,.text-3columns div{display:inline-block;width:100%}
.scrollup{z-index:999;position:fixed;bottom:0;right:0;background-color:#5d005d;color:#fff !important;font-size:1.4em;height:40px;line-height:40px;text-align:center;width:30px;display:none;transition:all 1.6s linear;text-decoration:none}
.scrollup:hover{background-color:#f2f2f2;color:#5d005d !important}

/* Animation */
.ani{-webkit-animation-duration:1.6s;-moz-animation-duration:1.6s;animation-duration:1.6s;-o-animation-duration:1.6s;-ms-animation-duration:1.6s;-webkit-animation-fill-mode:both;-moz-animation-fill-mode:both;-o-animation-fill-mode:both;-ms-animation-fill-mode:both;animation-fill-mode:both}
.short-ani{-webkit-animation-duration:.6s;-o-animation-duration:.6s;-ms-animation-duration:.6s;animation-duration:.6s;-webkit-animation-fill-mode:both;-o-animation-fill-mode:both;-ms-animation-fill-mode:both;animation-fill-mode:both}
.delay1 {-webkit-animation-delay:.2s;-moz-animation-delay:.2s;-o-animation-delay:.2s;-ms-animation-delay:.2s;animation-delay:.2s}
.delay2 {-webkit-animation-delay:.6s;-moz-animation-delay:.6s;-o-animation-delay:.6s;-ms-animation-delay:.6s;animation-delay:.6s}
.delay3 {-webkit-animation-delay:1.2s;-moz-animation-delay:1.2s;-o-animation-delay:1.2s;-ms-animation-delay:1.2s;animation-delay:1.2s}
.delay4 {-webkit-animation-delay:1.8s;-moz-animation-delay:1.8s;-o-animation-delay:1.8s;-ms-animation-delay:1.8s;animation-delay:1.8s}



/* Fade In */
@-webkit-keyframes fadeIn{
  from{opacity:0} 
  to{opacity:1}
}
@keyframes fadeIn{
  from{opacity:0}
  to{opacity:1}
}
.fadeIn {-webkit-animation-name:fadeIn;-moz-animation-name:fadeIn;-o-animation-name:fadeIn;-ms-animation-name:fadeIn;animation-name:fadeIn}

@-webkit-keyframes fadeInRight {
  from{opacity:0;-webkit-transform:translate3d(100%, 0, 0);-moz-transform:translate3d(100%, 0, 0);-o-transform:translate3d(100%, 0, 0);-ms-transform:translate3d(100%, 0, 0);transform:translate3d(100%, 0, 0)}
  to{opacity:1;-webkit-transform:none;-moz-transform:none;-o-transform:none;-ms-transform:none;transform:none}
}
@keyframes fadeInRight {
  from{opacity:0;-webkit-transform:translate3d(100%, 0, 0);-moz-transform:translate3d(100%, 0, 0);-o-transform:translate3d(100%, 0, 0);-ms-transform:translate3d(100%, 0, 0);transform:translate3d(100%, 0, 0)}
  to{opacity:1;-webkit-transform:none;-moz-transform:none;-o-transform:none;-ms-transform:none;transform:none}
}
.fadeInRight {-webkit-animation-name:fadeInRight;-moz-animation-name:fadeInRight;-o-animation-name:fadeInRight;-ms-animation-name:fadeInRight;animation-name:fadeInRight}

@-webkit-keyframes fadeInDown {
  from{opacity:0;-webkit-transform:translate3d(0, 100%, 0);-moz-transform:translate3d(0, 100%, 0);-o-transform:translate3d(0, 100%, 0);-ms-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0)}
  to{opacity:1;-webkit-transform:none;-moz-transform:none;-o-transform:none;-ms-transform:none;transform:none}
}
@keyframes fadeInDown {
  from{opacity:0;-webkit-transform:translate3d(0, 100%, 0);-moz-transform:translate3d(0, 100%, 0);-o-transform:translate3d(0, 100%, 0);-ms-transform:translate3d(0, 100%, 0);transform:translate3d(0, 100%, 0)}
  to{opacity:1;-webkit-transform:none;-moz-transform:none;-o-transform:none;-ms-transform:none;transform:none}
}
.fadeInDown {-webkit-animation-name:fadeInDown;-moz-animation-name:fadeInDown;-o-animation-name:fadeInDown;-ms-animation-name:fadeInDown;animation-name:fadeInDown}

@-webkit-keyframes fadeInUp {
  from{opacity:0;-webkit-transform:translate3d(0, -100%, 0);-moz-transform:translate3d(0, -100%, 0);-o-transform:translate3d(0, -100%, 0);-ms-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0)}
  to{opacity:1;-webkit-transform:none;-moz-transform:none;-o-transform:none;-ms-transform:none;transform:none}
}
@keyframes fadeInUp {
  from{opacity:0;-webkit-transform:translate3d(0, -100%, 0);-moz-transform:translate3d(0, -100%, 0);-o-transform:translate3d(0, -100%, 0);-ms-transform:translate3d(0, -100%, 0);transform:translate3d(0, -100%, 0)}
  to{opacity:1;-webkit-transform:none;-moz-transform:none;-o-transform:none;-ms-transform:none;transform:none}
}
.fadeInUp {-webkit-animation-name:fadeInUp;-moz-animation-name:fadeInUp;-o-animation-name:fadeInUp;-ms-animation-name:fadeInUp;animation-name:fadeInUp}



/*Grün*/
.colorGreen{color:#3a7f00}
.colorGreenMain{color:#4b6d2e}
.colorGreenLighter{color:#80a660}
.colorGreenLight{color:#638844}
.colorGreenDark{color:#375122}
.colorGreenDarker{color:#213114}
/*Gelb*/
.colorYellow{color:#728a00}
.colorYellowMain{color:#727e39}
.colorYellowLighter{color:#b0bd71}
.colorYellowLight{color:#8f9c52}
.colorYellowDark{color:#555d2a}
.colorYellowDarker{color:#33391a}
/*Rot*/
.colorRed{color:#800027}
.colorRedMain{color:#551529}
.colorRedLighter{color:#8c455b}
.colorRedLight{color:#6e2a3e}
.colorRedDark{color:#3f101e}
.colorRedDarker{color:#260912}
/*Purple*/
.colorPurple{color:#5d005d} /* Hauptfarbe Verein */
.colorPurpleMain{color:#411341}
.colorPurpleLighter{color:#6a376a}
.colorPurpleLight{color:#542254}
.colorPurpleDark{color:#300e30}
.colorPurpleDarker{color:#1d081d}

/* Full HD und größer */
@media all and (min-width: 1920px){
	#header-wrapper #header-motto{right:20px;bottom:0px}
	#header-wrapper .logo{bottom:10px;left:20px}
}

@media all and (max-width: 1350px){	
	#tab{top:30%}
	#tab .short-ani a{width:2em}
	#tab .short-ani a:hover,#tab .short-ani a:focus,#tab .short-ani a:active{padding-right:4em}
	
	/*#tab div{width:2em;padding:.8em}
	#tab div:hover{padding-right:1.5em}*/
	
	.mainFooter p{padding-left:5vw;padding-right:5vw}
	.mainFooter span.right{right:4em}
}

@media all and (max-width: 1260px){
	header{height:200px}
	#header-wrapper{height:200px}
	#header-wrapper #header-abs{bottom:-45px;height:200px;width:auto;right:15px}
	#header-wrapper,#menuContainer,#container,.subFooter{width:100%}
	#header-wrapper{background-position-x:right;background-position-y:bottom;background-repeat:no-repeat}
	#header-wrapper #notification{right:1vw}
	#header-wrapper #header-motto{width:60vw}
	#header-wrapper .logo img{height:10vh}
	#header-wrapper .logo-withImg img{height:6vh}
	nav #share{right:1vw}
	
	.saison-info .meta,.saison-pictures .meta,#saison-next .meta,.saison-cards .meta{height:auto}
	
	.subFooter .panel p{line-height:1.3em;font-size:.9em}
	.subFooter .panel .links div img{height:47px}
	section table{border-collapse:collapse}
	section table td:not(.c1):not(.c2):not(.c3){border:1px solid #f2f2f2}
	
	.scrollup{background-color:#A971A9;opacity:.7}
}

@media all and (max-width: 1000px){
	#header-wrapper #notification{display:none}
	#header-wrapper .logo{display:block}
	#header-wrapper .logo-withImg img{height:5vh}
	#header-wrapper #header-ani{display:none}
	nav ul li:not(.shariff-button){letter-spacing:8px}
	.cards .card-phone{font-size:1.6em}
	.cards div p em{font-size:1.1em}
	.subFooter .panel .links div img{height:37px}
	.special-img .content .img-thumb{max-height:200px}
}

@media all and (max-width: 899px){
	#header-wrapper .logo-withImg img{display:none}
	.subFooter .panel{padding:2vw}
	.mainFooter p{padding-left:2vw;padding-right:2vw}
	.mainFooter span.right{right:2vw}
	.text-3columns{column-count:2}
}

@media all and (max-width: 800px){
	header{height:15vh}
	#header-wrapper{height:15vh}
	#header-wrapper .logo-withImg{top:2.2vh}
	#header-wrapper .logo-withImg img{display:block;height:10vh}
	#header-wrapper #header-abs{display:none}
	.header-panels{height:2vh}
	.header-panels .panel{height:2vh;padding:0;line-height:2vh}
	#form-search{display:none}
	#logo-small{height:80px}
	.page-sub3 .boxes{flex-direction:column}
	.event-next{flex-wrap:wrap}
	.event-next .img-thumb img{max-height:initial} 
	
	nav{display:none}
	#menu-banner{position: relative;}
	#menu-banner #header-motto-mobile{display:block;position:absolute;height:100px;width:auto;left:20px;top:3px;z-index:1}
	#tab{display:none}
	.sharenav{display:none}
	#menu-small{float:right}
	.topnav{position:relative;display:block;float:right;box-sizing:border-box;height:80px;z-index:100}
	.topnav a{color:#fff;text-decoration:none;text-transform:uppercase;font-size:1.8em;text-align:right;display:block}
	.topnav a.topitem{font-size:1.4em}
	.topnav a.subitem{font-size:1em;line-height:1.4em;text-transform:initial}
	#nav-mobile>span{color:#a9a9a9;text-decoration:none;text-transform:uppercase;font-size:1.4em;position:absolute;bottom:5px;right:2vw}
	
	#container{padding-bottom:2vh}
	.page-main{margin-top:2vh}
	#events{padding:.5vh 25px}
	.slides-nav .slick-slide p{font-size:.9em}
	#slider-outer{padding:3vh 25px}
	.saison-info .title h1,.saison-info .title h2,.saison-info .title-passed h1,.saison-info .title-passed h2{font-size:1.4em}
	
	.news-next {display:block}
	.news-next .content .img-content{width:100%;max-height:initial}
	
	table{font-size:.9em}
	.th{line-height:1.2em;margin-top:1vh}
	td{padding:.1em}
	
	.topnav a{display:none} /* When the screen is less than 600 pixels wide, hide all links. Show the link that contains should open and close the topnav (.icon) */
	.topnav a.icon,.topnav a.fb,.topnav a.in,.topnav a.ca,.topnav a.ln{transition:.5s;display:block;position:absolute;top:3px;padding:.2vh .2vw}
	.topnav a.icon{right:2vw}
	.topnav a.fb{right:14vw}
	.topnav a.in{right:26vw}
	.topnav a.ln{right:38vw}
	.topnav a.ca{right:50vw}
	.topnav a img{vertical-align:middle;height:1.4em;width:auto}
	
	/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens (display the links vertically instead of horizontally) */
	.topnav.responsive{padding-top:38px}
	.topnav.responsive span{display:none}
	.topnav.responsive a.topitem,.topnav.responsive a.subitem{padding:.5em 2vw .5em 2vw;transition:.5s;background-color:#5d005d}
	.topnav.responsive a.topitem:hover,.topnav.responsive a.topitem:focus,.topnav.responsive a.subitem:active,.topnav.responsive a.subitem:hover, .topnav.responsive a.subitem:focus,.topnav.responsive a.subitem:active{background-color:#882288}
	.topnav.responsive a{float:none;display:block}
	
	footer{position:relative}
	.subFooter{height:auto}
	.subFooter .panel{width:100%;float:left;height:auto;min-height:140px;padding:2vh 2vw;box-sizing:border-box;margin-top:0;transition:.4s ease-out}
	.subFooter .panel:hover{margin-bottom:0;margin-top:0}
	.subFooter .panel p{line-height:1.2em;font-size:.9em}
	.subFooter .panel p span{font-size:1em}
	.subFooter .panel .links{justify-content:center}
	/*.subFooter .panel .links div img{height:initial}*/
	.subFooter .panel:nth-child(1) a img{margin:5px 8px}
	
	.mainFooter{display:flex;height:auto;width:100%}
	.mainFooter p{text-align:center;display:block;padding:1vh 4vw}
	.mainFooter span.right{width:100%;position:unset;float:right;clear:both;padding-top:2vh}
}

@media screen and (max-width: 700px){
	.saison-image{float:none;width:100%}
	.saison-image img{width:100%;height:auto}
	.saison-info{width:100%;float:none}
	.saison-info .title h3,.saison-pictures .title h3,#saison-next h4,.saison-cards .title h3,.saison-info .title-passed h3,.saison-pictures .title-passed h3,.saison-cards .title-passed h3{font-size:1.1em}
	.saison-info .meta,.data,.saison-info .cards{margin-right:3vw}
	.subFooter .panel img{height:32px}
}

@media screen and (max-width: 600px){
	/*#header-wrapper .logo img{display:none}*/
	#header-wrapper #header-motto{width:80vw}
	#popup-cart .popup,#popup-userdata .popup,#popup-summary .popup,.popup-news .popup,.popup-news .popup .content,.popup-news .popup .content img.img-content{min-width:90vw;max-width:90vw}
	.slides-nav .slick-slide p{display:none}
	.slider-galleries .img_subtitle span{opacity:1;font-size:1.6em}
	.page-sub3 section{width:unset}
	.page-sub3 section.left{float:unset}
	.popup{font-size:.9em}

	.data td{padding-left:0;padding-right:0}
}

@media all and (max-width: 500px){
	h1,h2,h3{-moz-hyphens:auto;-o-hyphens:auto;-webkit-hyphens:auto;-ms-hyphens:auto;hyphens:auto}
	h3{font-size:.9em}
	.text-2columns{column-count:unset;column-gap:unset}
	.text-3columns{column-count:1}
	table{font-size:.8em}
	.event-next .content p,.news-next .content p{font-size:initial;padding:3vh 6vw}
	#slider-outer,#events{padding-left:18px;padding-right:18px}
	.saison-info .cards .card-phone{font-size:1.5em}
	.popup .close,.popup-img .close{position:absolute;top:2.5vh;right:5vw;font-size:2em}
	.popup .content .ics-form table td{border:1px solid #f2f2f2}
	.special-img{display:block}
	.special-img .content .img-thumb{max-height:unset;max-width:100vw}
	.page-sub3 section.right{text-align:center}

	.mainFooter p{line-height:1.6em}
}

@media all and (max-width: 400px){
	#header-wrapper #header-motto{width:95vw}
	#menu-banner #header-motto-mobile{left:70px}
	.page-sub2 h1,.page-sub2 h2,.page-sub3 h1,.page-sub3 h2{font-size:1.2em}
	.popup{font-size:.8em}
	.subFooter .panel .links div img{height:37px}

	.data .c3 .music{max-width:100%;max-height:60px}

	.mainFooter p{line-height:2em}
}

@media all and (max-width: 360px){
	#menu-banner #header-motto-mobile{display:none}
}

@media all and (max-width: 250px){
	.popup{font-size:.8em}
	.data .c3 .music{max-width:180px;max-height:30px}
}