@font-face {
    font-family: 'courgetteregular';
    src: url('fonts/courgette-regular-webfont.woff2') format('woff2'),
         url('fonts/courgette-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'bebas_neueregular';
    src: url('fonts/bebasneue-regular-webfont.woff2') format('woff2'),
         url('fonts/bebasneue-regular-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'bignoodletitlingregular';
    src: url('fonts/big_noodle_titling-webfont.woff2') format('woff2'),
         url('fonts/big_noodle_titling-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'cardenio_modernregular';
    src: url('fonts/cardenio_modern_std-webfont.woff2') format('woff2'),
         url('fonts/cardenio_modern_std-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'lane_-_narrowregular';
    src: url('fonts/lane-webfont.woff2') format('woff2'),
         url('fonts/lane-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

*{
    box-sizing: border-box;
    padding: 0;
    margin: 0;

    font-family: "lane_-_narrowregular";
    font-weight: bold;
    transition-duration: 0.3s;

    scroll-behavior: smooth;
}

/* .section {
    zoom: 0.9;
    -moz-transform: scale(0.9);
    -moz-transform-origin: 0 0;
} */

input, textarea{
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
}

h1, h2, h3 {
    font-family: "bebas_neueregular";
}

img {
    filter: grayscale(100%);
}

#preloader {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #333;
    z-index: 999;
    height: 100%;
}

#status {
    width: 100%;
    max-width: 150px;
    height: auto;
    filter: grayscale(0%);
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

#background {
  display: block;
  position: fixed;
  left: -8px;
  top: -8px;
  width: 105%;
  height: 105%;
  z-index: -10;
  background: url(images/startImg.jpg);
  background-repeat: no-repeat;
  background-position: 50% 50%;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  -webkit-filter: blur(5px);
  -moz-filter: blur(5px);
  -o-filter: blur(5px);
  -ms-filter: blur(5px);
  filter: blur(5px);
}

#pageBorder {
    height: 100vh;
    width: 100vw;
    position: fixed;
    border: 30px solid #fff;
    box-sizing: border-box;
}

#pageBorderTop {
    z-index: 997;
    width: 100vw;
    border-top: 30px solid #fff;
    position: absolute;
    top: 0;
    left: 0;
    box-sizing: border-box;
}

#pageBorderBottom {
    z-index: 997;
    width: 100vw;
    border-top: 30px solid #fff;
    position: absolute;
    bottom: 0;
    left: 0;
    box-sizing: border-box;
}

#borderTitleWrapper {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998;
    height: 30px;
}

#borderLogo {
    float: left;
    height: 30px;
    width: auto;
    margin-left: 30px;
    filter: grayscale(0%);
}

.borderLogoStart {
    opacity: 0;
}

#borderTitleWrapper p {
    float: left;
    display: none;
    font-size: 27px;
    padding-left: 8px;
    color: #000;
    text-transform: uppercase;
    font-family: "bebas_neueregular";
    line-height: 1.18;
}

.borderTitleVisible {
    display: block !important;
    animation: titleOn 0.6s;
}

.borderTitleOff {
    animation: titleOff 0.3s;
}

@keyframes titleOn {
    0%   {opacity: 0;}
    50%  {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes titleOff {
    0%   {opacity: 1;}
    100% {opacity: 0;}
}


#fp-nav ul li a span {
    background: #000 !important;
}

#fp-nav.right {
    right: 1px !important;
}

.fp-next {
    right: 55px !important;
    border: none !important;
    background-image: url(images/arrowRight.png) !important;
    width: 64px !important;
    height: 64px !important;
    min-height: 1px;
    min-width: 1px;
    background-size: contain;
    background-repeat: no-repeat;
}

.fp-prev {
    left: 60px !important;
    border: none !important;
    background-image: url(images/arrowLeft.png) !important;
    width: 64px !important;
    height: 64px !important;
    min-height: 1px;
    min-width: 1px;
    background-size: contain;
    background-repeat: no-repeat;
}

.slick-left, .slick-left-blog, .slick-left-band {
    display: block;
    left: -60px !important;
}

.slick-left img, .slick-left-blog img, .slick-left-band img {
    width: 64px;
    height: auto;
    transform: rotate(90deg);
    filter: invert(100%);
}

.slick-prev:before {
    display: none; !immportant;
}

.slick-right, .slick-right-blog, .slick-right-band {
    display: block;
    right: -20px !important;
}

.slick-right img, .slick-right-blog img, .slick-right-band img {
    width: 64px;
    height: auto;
    transform: rotate(270deg);
    filter: invert(100%);
}

.slick-next:before {
    display: none; !immportant;
}

/*Laggy
.fp-viewing-home #background {
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);
}*/

.slide {
    position: relative;
}

#startLogo{
    width: 100%;
    max-width: 380px;
    height: auto;

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    filter: grayscale(0%);
}

#weiterButtonWrapper{
    bottom: 0px;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}

#weiterButton img, #weiterButton{
    width: 64px;
}

.contentWrapper{
    width: 80%;
    max-width: 1400px;
    height: 70%;
    max-height: 700px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.contentWrapperLarge{
    width: 80%;
    max-width: 1600px;
    height: 70%;
    max-height: 900px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.contentWrapperSmall {
    width: 80%;
    max-width: 1400px;
    height: 60%;
    max-height: 580px;
    padding: 64px;
    position: absolute;
    top: 45%;
    left: 50%;
    transform: translate(-50%, -33%);
}

.content {
    background-color: rgba(255, 255, 255, 0.25);
    height: 100%;
}

.secTitle {
    color: white;
    margin: 0 0 0 -32px;
}

.secTitle h1 {
    margin-bottom: -24px;
}

.secTitle a {
    color: white;
    text-decoration: none;
}

.secTitle div {
    width: 1432px;
    border-bottom: 2px solid white;
}

#secTitleGallery div {
    width: calc(90vw + 32px);
}

#bandImgBig {
    height: 100%;
    width: 67%;
    object-fit: cover;
    display: inline-block;
}

.startText {
    height: 100%;
    width: 33%;
    background-color: rgba(0, 0, 0, 0.3);
    float: left;
    padding: 32px;
    color: #fff;
    font-size: 1.2em;
}

.startText h2 {
    font-size: 2em;
}

.bandButtonWrapper {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translate(-50%, 0);
    width: 100%;
    height: 0px;
    text-align: center;
    z-index: 500;
    opacity: 0;
    transition-duration: 0.6s;
}

.bandButtonIn {
    height: 30px;
    opacity: 1;
}

.bandButtonWrapper a {
    box-sizing: border-box;
    background-color: #fff;
	border: 1px solid #fff;
	/*border-radius: 20px;*/
	cursor:pointer;
	color: #000;
	font-size:24px;
	padding: 3px 40px;
	height: 30px;
	margin: 0;
	text-decoration:none;
	transition-duration: .3s;
	font-family: "bebas_neueregular";
}

.bandButtonWrapper a:hover{
    background-color: #000;
    color: #fff;
    border: 1px solid #000;
}

.bandButtonActive {
    background-color: #000 !important;
    color: #fff !important;
    border: 1px solid #fff !important;
}

.bandSlide img {
    height: 100%;
    width: 33%;
    object-fit: cover;
    float: left;
}

#imgPeter {
    object-position: 30% 50%;
}

.bandmitgliedInfo {
    width: 66%;
    float: left;
    padding: 7%;
}

.bandmitgliedInfo h2 {
    padding: 32px 32px 8px 32px;
    font-size: 2em;
}

.bandmitgliedInfo p {
    padding: 8px 32px 32px 32px;
    font-size: 1.4em;
}

.galleryWrapper {
    height: 85%;
    width: 83%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.gallerySlider {
    height: 100%;
    width: 100%;
}

.gallerySliderSingle {
    display: none !important;
    width: 100%;
    height: 60vw;
}

.gallerySliderSingle a, .gallerySliderSingle iframe {
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.gallerySlider iframe {
    filter: grayscale(100%);
}

.gallerySlider a, .gallerySlider iframe {
    height: 33.33333332%;
    width: 100%;
    overflow: hidden;
}

.gallerySlider iframe:hover {
    filter: grayscale(0%);
}

.gallerySlider a img, .gallerySliderSingle a img {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: 50% 15%;
}

.gallerySlider a img:hover {
    transform: scale(1.05);
    filter: grayscale(0%);
}

.lightbox img {
    filter: grayscale(0%);
}

.fanmailWrapper {
    position: absolute;
    top: 0px;
    left: 0;
    width: 100%;
    padding: 64px 16px 0 16px;
    display: flex;
    justify-content: space-between;
}

.fanmail {
    text-align: center;
    width: 33%;
    padding: 0 48px 0 48px;
    color: white;
}

.fanmail h2 {
    font-family: 'cardenio_modernregular';
    font-size: 1.75vw;
    font-weight: lighter;
    /*text-shadow: -2px 2px 3px rgba(180, 120, 180, 1);*/
}

.fanmail p {
    font-family: 'cardenio_modernregular';
    font-size: 1.55em;
    font-weight: lighter;
    /*text-shadow: -2px 2px 2px rgba(180, 120, 180, 1);*/
}

.fanmail:first-child {
    text-align: left;
}

.fanmail:last-child {
    text-align:right;
}

.terminText {
    height: 100%;
    width: 30%;
    margin-right: 3%;
    background-color: rgba(0, 0, 0, 0.3);
    displaY: inline-block;
    vertical-align: top;
    padding: 32px;
    color: #fff;
    font-size: 1.4em;
}

.terminText h2 {
    font-size: 2em;
}

.terminWrapper {
    width: 67%;
    height: 100%;
    display: inline-block;
    background-color: rgba(0, 0, 0, 0.3);
    color: white;
    padding: 32px;
}

.terminContainer {
    overflow-y: auto;
}

.terminContainer h2 {
    font-size: 2em;
}

.termin {
    display: flex;
    flex-wrap: wrap;
}
.termin p {
    width: 20%;
    padding: 4px;
}

.termin p a {
    color: white;
}

.termin p a:visited {
    color: white;
}

.terminEven {
    background-color: rgba(255, 255, 255, 0.25) !important;
}

.terminToggle, .linkToBlog {
    cursor: pointer;
}

.terminInfos {
    display: none;
    width: 100% !important;
    text-align: center;
}

.terminInfosVisible {
    display: flex !important;
}

.postSlider .slick-current .post img {
    filter: grayscale(0%);
}

.post {
    width: 100%;
    height: 100%;
}

.postExternal {
    background-color: rgba(128, 128, 128, 0.25);
}

.post img {
    width: 100%;
    height: 40%;
    object-fit: cover;
}

.post .postContent {
    padding: 12px;
}

.post h2 {
    margin-top: 8px;
    font-size: 1.8em;
    font-weight: lighter;
}

.post .postDate {
    font-size: 90%;
}

.post .postDescription {
    margin-top: 8px;
    font-size: 1.2em;
}

.post a {
    color: #222;
}

.post a:visited {
    color: #222;
}

.post .postSource {
    font-size: 90%;
    margin-top: 32px !important;
    display: inline-block;
}

.kontaktPicker {
    color: white;
    display: flex;
    align-items: left;
    margin-bottom: 8px;
}

.kontaktPickerTitle {
    display: inline-block;
    margin: 0 48px 0 0;
    padding: 4px 24px 0 24px;

    border: 1px solid white;
    /*border-radius: 20px;*/
}

.kontaktPickerTitle a {
    color: white;
    text-decoration: none;
    font-size: 1.15em !important;
    font-weight: lighter;
    font-family: "bebas_neueregular";
}

.kontaktPickerTitle h1 {
    cursor: pointer;
}

.kptRight {
    margin: 0 0 0 auto;
}

.kontaktActive, .kontaktPickerTitle:hover {
    background-color: rgba(0, 0, 0, 0.4);
}

.download-link {
    margin: 12px 0;
    display: inline-block;
    color: white !important;
}

.impressumPicker {
    color: white;
    text-align: right;
}

.impressumPicker a {
    color: white;
}

.impressumPicker a:visited {
    color: white;
}

.kontaktSlider {
  -webkit-user-select: text !important;
  -khtml-user-select: text !important;
  -moz-user-select: text !important;
  -ms-user-select: text !important;
  user-select: text !important;
  overflow-y: visible !important;
}

#kontaktForm, #fanmailForm, #veranstalterInfo {
    width: 100%;
    height: 100%;
    position: relative;
}

.kontaktInputWrapper {
    width: 50%;
    height: 80%;
    position: absolute;
    top: 60%;
    left: 12%;
    transform: translate(0%, -50%);
}

.kontaktText {
    width: 20%;
    height: 80%;
    position: absolute;
    top: 60%;
    left: 88%;
    transform: translate(-100%, -50%);
    margin-top: 16px;
}

.kontaktText p {
    font-size: 1.4em;
    padding-top: 16px;
}

.kontaktText h2 {
    font-weight: bold;
}

.fanmailInputWrapper {
    width: 50%;
    height: 80%;
    position: absolute;
    top: 55%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.formInput {
    color: black;
    font-size: 16px;
    margin: 16px 0;
    padding: 8px;
    border: 1px solid #fff;
    /*border-radius: 20px;*/
    background-color: rgba(255, 255, 255, 0.1);
    width: 100%;
    display: block;
    height: auto;
}

#kontaktForm textarea, #fanmailForm textarea{
    color: black;
    height: 200px;
    margin: 16px 0;
    padding: 8px;
    border: 1px solid #fff;
    /*border-radius: 20px;*/
    background-color: rgba(255, 255, 255, 0.1);
    width: 100%;
    display: block;
}

*::-webkit-input-placeholder{
    color: #444;
    opacity: 1;
}

*::-moz-placeholder{
    color: #444;
    opacity: 1;
}

*::-ms-input-placeholder{
    color: #444;
    opacity: 1;
}

*:-ms-input-placeholder{
    color: #444;
    opacity: 1;
}

*:focus::-webkit-input-placeholder{
    color: #121212;
    opacity: 1;
}

*:focus::-moz-placeholder{
    color: #121212;
    opacity: 1;
}

*:focus::-ms-input-placeholder{
    color: #121212;
    opacity: 1;
}

*:focus:-ms-input-placeholder{
    color: #121212;
    opacity: 1;
}

#kontaktButton, #fanmailButton, #infoButton {
	background-color: rgba(255, 255, 255, 0.1);
	border: 1px solid #fff;
	/*border-radius: 20px;*/
	cursor:pointer;
	color: #000;
	font-size:16px;
	padding:8px 40px;
	text-decoration:none;
	transition-duration: .3s;
}

#kontaktButton:hover, #fanmailButton:hover, #infoButton:hover {
	background-color: rgba(0, 0, 0, 0.4);
	color: #fff;
}

#kontaktForm input:focus, #kontaktForm textarea:focus, #fanmailForm input:focus, #fanmailForm textarea:focus{
    background-color: rgba(255, 255, 255, 0.4);
    color: #000;
}

#name_required, #f_name_required {
    position: absolute;
    left: -9000px;
}

#fanmailForm select {
    background: url("images/arrowDown.png") no-repeat right rgba(255, 255, 255, 0.1);
    background-size: 12px 8px;
    background-position-x: 275px;
    border: 1px solid white;
    /*border-radius: 20px;*/
    padding: 8px;
    color: #444;
    width: 300px;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    cursor: pointer;
}

select::-ms-expand {
     display: none;
}

#fanmailCheckboxWrapper {
    margin: 16px 0 16px 0;
    color: #121212;
}

#fanmailCheckboxWrapper input {
    display: inline-block;
    vertical-align: top;
}

#fanmailCheckboxWrapper p {
    display: inline-block;
    width: 90%;
}

.success {
    width: 100%;
    margin: 8px 0 16px 0;
    padding: 16px;
    color: #000;
    border: 1px solid #fff;
    border-radius: 20px;
    background-color: rgba(255, 255, 255, 0.1);
}

.error {
    width: 100%;
    margin: 8px 0 16px 0;
    padding: 16px;
    color: #000;
    border: 1px solid red;
    border-radius: 20px;
    background-color: rgba(255, 0, 0, 0.1);
}

.legalWrapper {
    padding: 64px;
    color: white;
    background-color: black;
    display: none;
}

.legalWrapper p {
    margin: 12px 0;
}

.legalWrapper td {
    color: white;
}

.legalWrapper a {
    color: white;
}

.legalWrapper a:visited {
    color: white;
}

@media (max-width: 1300px) {
    .startText, .terminText {
        font-size: 1.1em;
    }

    .post .postDescription {
        font-size: 1em;
    }

    .kontaktText p {
        font-size: 1.05em;
    }

    .bandButtonWrapper a {
    	font-size:20px;
    	padding: 3px 28px;
    	height: 24px;
    }

    .bandButtonWrapper {
        position: absolute;
        bottom: 24px;
        left: 50%;
        transform: translate(-50%, 0);
        width: 100%;
        height: 0px;
        text-align: center;
        z-index: 500;
        opacity: 0;
        transition-duration: 0.6s;
    }

    .bandButtonIn {
        height: 30px;
        opacity: 1;
    }

    .contentWrapperSmall {
        padding: 0;
    }

    .kontaktPickerTitle a {
        font-size: 0.8em !important;
    }
}

.featherlight-close {
    margin: 10px;
}

.featherlight .featherlight-content {
    max-width: calc(100vw - 40px);
}

@media (max-width: 1000px) , (max-height: 800px) {

    #pageBorder, #pageBorderTop, #pageBorderBottom, #borderTitleWrapper, #borderLogo, .borderLogoStart, .borderTitleVisible, .bandButtonWrapper, .bandButtonIn, .bandButtonWrapper button {
        display: none;
    }

    .section {
        height: auto !important;
        min-height: 0 !important;
        padding: 64px 24px 64px 24px;
        margin: 0 max(0px, calc(50vw - 250px));
        max-width: min(100%, 500px);
    }

    .fp-section, .fp-table, .fp-tableCell {
        height: auto !important;
    }

    .contentWrapper, .contentWrapperSmall, .contentWrapperLarge {
        width: 100%;
        max-width: none;
        height: auto;
        max-height: none;
        position: static;
        top: auto;
        left: auto;
        transform: none;
        margin: 0;
        padding: 0;
    }

    .content {
        height: auto;
    }

    .slick-left, .slick-left-blog, .slick-left-band {
        left: 1px !important;
    }

    .slick-left img, .slick-left-blog img, .slick-left-band img {
        width: 24px;
    }

    .slick-right, .slick-right-blog, .slick-right-band {
        right: 6px !important;
    }

    .slick-right img, .slick-right-blog img, .slick-right-band img {
        width: 24px;
    }

    #startPage {
        height: 100vh !important;
    }

    #startLogo{
        width: 100%;
        max-width: 250px;
        height: auto;

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

    .startText {
        height: auto;
        width: 100%;
        padding: 32px;
        background-color: rgba(0, 0, 0, 0.3);
        displaY: block;
        font-size: 1em;
    }

    .startText h2 {
        font-size: 2em;
    }

    .bandSlide img {
        width: 100%;
        height: 50vw;
        max-height: 500px;
        min-height: 300px;
        float: none;
    }

    #bandImgBig {
        width: 100%;
        height: auto;
        float: none;
    }

    #imgPeter {
        object-position: 30% 50%;
    }

    #imgTom {
        object-position: 50% 40%;
    }

    #imgBernie {
        object-position: 50% 10%;
    }

    #imgChris {
        object-position: 50% 15%;
    }

    .bandmitgliedInfo {
        width: 100%;
        height: 100%;
        float: none;
    }

    .bandmitgliedInfo h2 {
        padding: 16px 16px 8px 16px;
    }

    .bandmitgliedInfo p {
        padding: 8px 16px 16px 16px;
        font-size: 1em;
    }

    .secGallery {
        height: 61vw !important;
    }

    .galleryWrapper {
        /* height: 84vw; */
        width: 100%;
        position: static;
        top: none;
        left: none;
        transform: none;
    }

    .gallerySlider {
        height: 23vw;
        max-height: 150px;
    }

    .gallerySlider a {
        height: 100%;
    }

    .gallerySlider iframe {
        height: calc(100% - 2px);
        width: calc(100% - 2px);
        margin: 1px;
    }

    .gallerySlider a img {
        margin: 1px;
    }

    .gallerySliderSingle {
        display: block !important;
        max-height: 300px;
    }

    .fanmailWrapper {
        position: relative;
        top: none;
        left: none;
        padding: 16px 16px 0 16px;
        display: block;
        height: 265px;
    }

    .fanmail {
        text-align: center;
        width: 100%;
        padding: none;
        opacity: 0;
        position: absolute;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    @keyframes fm1 {
        0%   {opacity: 1;}
        30%  {opacity: 1;}
        33.3333%  {opacity: 0;}
        66%  {opacity: 0;}
        96.6666% {opacity: 0;}
    }

    @keyframes fm2 {
        0%   {opacity: 0;}
        30%  {opacity: 0;}
        33.3333%  {opacity: 1;}
        63.3333%  {opacity: 1;}
        66.6666%  {opacity: 0;}
        100% {opacity: 0;}
    }

    @keyframes fm3 {
        0%   {opacity: 0;}
        30%  {opacity: 0;}
        63.3333%  {opacity: 0;}
        66.6666%  {opacity: 1;}
        96.6666%  {opacity: 1;}
    }

    .fanmail:first-child {
        animation: fm1 12s infinite;
        text-align: center;
    }

    .fanmail:nth-child(2) {
        animation: fm2 12s infinite;
    }

    .fanmail:last-child {
        animation: fm3 12s infinite;
        text-align: center;
    }

    .fanmail h2 {
        font-size: 2em;
    }

    .fanmail p {
        font-size: 1.2em;
    }

    .terminText {
        width: 100%;
        margin: 16px 0 16px 0;
        displaY: block;
        padding: 16px;
        font-size: 1em;
    }

    .terminWrapper {
        width: 100%;
        display: block;
        padding: 16px;
    }

    .termin p {
        width: 50%;
        padding: 4px;
    }

    .terminToggle, .linkToBlog {
        text-decoration: underline;
    }

    .terminInfos {
        width: 50% !important;
        text-align: left;
        flex-wrap: wrap;
    }

    .terminInfos p {
        width: 100% !important;
    }

    .post {
        height: auto;
    }

    .postSlider .slick-current .post img {
        filter: grayscale(100%);
    }

    .postExternal {
        background-color: rgba(0, 0, 0, 0);
    }

    .post img {
        height: 35vw;
    }

    .post .postContent {
        padding: 16px;
    }

    .post h2 {
        font-size: 1.7em;
    }

    .post .postDate {
        font-size: 80%;
    }

    .post .postDescription {
        font-size: 0.95em;
    }

    .post .postSource {
        font-size: 80%;
        margin-top: 24px !important;
        display: inline-block;
    }

    .kontaktPicker {
        display: block;
    }

    .kontaktPickerTitle {
        display: table;
        margin: 4px 0 4px 0;
        padding: 4px 8px 0 8px;
    }

    .kontaktPickerTitle a {
        font-size: 1em !important;
    }

    .kptRight {
        margin: 2px 0 2px 0;
    }

    #kontaktForm, #fanmailForm, #veranstalterInfo {
        width: 100%;
        height: 100%;
        position: static;
        display: flex;
        flex-flow: column;
        padding: 24px;
    }

    .kontaktInputWrapper {
        width: 100%;
        height: auto;
        position: static;
        top: none;
        left: none;
        transform: none;
        order: 2;
    }

    .kontaktText {
        width: 100%;
        height: auto;
        position: static;
        top: none;
        left: none;
        transform: none;
        margin: 0 0 16px 0;
        order: 1;
    }

    .kontaktText p {
        font-size: 1em;
        padding-top: 16px;
    }

    .kontaktText h2 {
        font-size: 2em;
    }

    .fanmailInputWrapper {
        width: 100%;
        height: auto;
        position: static;
        top: none;
        left: none;
        transform: none;
    }

    #kontaktForm textarea, #fanmailForm textarea{
        height: 200px;
    }

    #fanmailForm select {
        background-size: 12px 8px;
        background-position-x: calc(100% - 12px);
        padding: 8px;
        width: 100%;
    }

    #fanmailCheckboxWrapper {
        margin: 16px 0 16px 0;
        color: #121212;
    }

    .legalWrapper {
        padding: 32px;
    }

    #datenschutz {
        overflow: hidden;
    }
}