/*
Theme Name: VintWood Child
Theme URI: https://www.jonasreindlmusik.at
Description: Child Theme for VintWood
Author: Jasmin Ossman
Template: vintwood
Version: 1.0
*/

/*
.fullscreen-carousel.vc_images_carousel,
.fullscreen-carousel .vc_images_carousel,
.fullscreen-carousel .vc_carousel-inner,
.fullscreen-carousel .vc_carousel-slideline,
.fullscreen-carousel .vc_carousel-slideline-inner,
.fullscreen-carousel .vc_item,
.fullscreen-carousel .vc_item > div {
  height: 100vh !important;
  max-height: 100vh !important;
}

.fullscreen-carousel img {
  width: 100% !important;
  height: 100vh !important;
  object-fit: cover !important;
}

.vc_row-o-full-height {
    min-height: 100vh !important;
}
*/



/*---------- Home Image Carousel ---------- set height & width ----------------- Begin*/
/* FORCE fullscreen carousel minus navbar */
@media (min-width: 1025px) {
    #home .fullscreen-carousel.vc_images_carousel,
    #home .fullscreen-carousel .vc_images_carousel,
    #home .fullscreen-carousel .vc_carousel-inner,
    #home .fullscreen-carousel .vc_carousel-slideline,
    #home .fullscreen-carousel .vc_carousel-slideline-inner,
    #home .fullscreen-carousel .vc_item,
    #home .fullscreen-carousel .vc_item > div {
    height: calc(100vh - 80px) !important;
    max-height: calc(100vh - 80px) !important;
    }

    #home .fullscreen-carousel img {
    width: 100% !important;
    height: calc(100vh - 80px) !important;
    object-fit: cover !important;
    object-position: top center !important;
    }

    /* Force entire row to full viewport height minus navbar and override JS inline styles */
    #home .vc_row.vc_row-o-full-height[data-vc-full-height="true"],
    #home .vc_row.vc_row-o-full-height {
        min-height: calc(100vh - 80px) !important;
        height: calc(100vh - 80px) !important;
    }

}




/* Remove default WPBakery bottom spacing for fullscreen carousel */
.fullscreen-carousel .wpb_content_element {
    margin-bottom: 0 !important;
}

@media (max-width: 1024px) {

  /* Row height adapts to its content */
  .vc_row.vc_row-o-full-height,
  .vc_row[data-vc-full-height="true"],
  .vc_row.vc_row-flex,
  .vc_row.vc_row-o-equal-height {
    min-height: auto !important;
    height: auto !important;
  }

  /* In case WPBakery sets inline min-height */
  .vc_row[style*="min-height"] {
    min-height: auto !important;
  }

  /* Deactivate flex-stretching */
  .vc_row.vc_row-flex {
    display: block !important;
  }
  .vc_row.vc_row-flex > .wpb_column,
  .vc_row.vc_row-flex > .vc_column_container {
    display: block !important;
  }

  /* Inner wrapper adapts to its content*/
  .cws_vc_column-inner,
  .cws_vc_column-inner > .wpb_wrapper {
    height: auto !important;
    min-height: 0 !important;
  }

  /* Carousel height equal to image height */
  .fullscreen-carousel,
  .fullscreen-carousel .vc_images_carousel,
  .fullscreen-carousel .vc_carousel-inner,
  .fullscreen-carousel .vc_carousel-slideline,
  .fullscreen-carousel .vc_carousel-slideline-inner,
  .fullscreen-carousel .vc_item,
  .fullscreen-carousel .vc_item > div {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
  }

  .fullscreen-carousel img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    display: block !important;
    object-position: top center !important;
  }
}

@media (max-width: 1024px) {

  #home,
  #home.vc_row,
  #home.vc_row-o-full-height,
  #home[data-vc-full-height="true"] {
    min-height: 0 !important;
    height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  #home > .fullscreen-carousel,
  #home .wpb_column,
  #home .vc_column_container,
  #home .cws_vc_column-inner,
  #home .wpb_wrapper {
    min-height: 0 !important;
    height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  .fullscreen-carousel,
  .fullscreen-carousel .vc_images_carousel,
  .fullscreen-carousel .vc_carousel-inner,
  .fullscreen-carousel .vc_carousel-slideline,
  .fullscreen-carousel .vc_carousel-slideline-inner,
  .fullscreen-carousel .vc_item,
  .fullscreen-carousel .vc_item > div {
    min-height: 0 !important;
    height: auto !important;
    max-height: none !important;
    overflow: visible !important;
  }
    /*
  .fullscreen-carousel img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    object-position: top center !important;
    margin: 0 !important;
  }
*/
  .fullscreen-carousel img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: top center !important;
  }

}

@media (max-width: 480px) {
    #home,
    #home.vc_row,
    #home.vc_row-o-full-height,
    #home[data-vc-full-height="true"] {
        margin-top: 10px !important;
    }
}

/* Otherwise Image Slider is cut on the top by navbar */
@media (min-width: 1025px) {
    #main main {
        padding-top: 30px !important;
    }
}

/*---------- Home Image Carousel ---------- set height & width ----------------- End*/


/*---------- Songs Overview ---------- discs styling ---------------------------- Start*/
/* Avoid weird effect of showing tiny part of next disc*/
.music-section {
    padding: 0px 130px !important;
}

.music-row {
    padding: 0px 150px !important;
}

/* remove background and padding of discs */
.posts_grid.cws_portfolio_posts_grid .item.style_round .item_content .post_media {
    padding: 0px !important;
    background-image: none;
}
.posts_grid.cws_portfolio_posts_grid .item .item_content .post_media {
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}

.posts_grid.cws_portfolio_posts_grid {
    margin-bottom: 100px !important;
}

.song_overview_title_image{
    width: 250px !important;
    height: 250px !important;
}

#music .cws_custom_button {
    padding: 5px;
    border-color: black !important;
    color: black !important;
    text-decoration: none;
    text-transform: uppercase; 
    letter-spacing: 1px;      
    border-radius: 0px;
    transition: all 0.3s ease;
    font-size: 30px;
    margin-left: 0px;
}

#music .sc_button_wrapper {
    margin-top: 140px !important;
    margin-bottom: 0px !important;
}

/* Hover state styles */
#music .cws_custom_button:hover {
    border-color: #BF1E2E !important;
    color: #BF1E2E !important;
}

@media (min-width: 1025px) {
    #music {
        height: 100vh !important;
    }
}

@media (max-width: 1024px) {
    .music-section {
        padding: 15px !important;
    }

    .music-row {
        padding: 0px !important;
    }

    .music-row .cws_spacing {
        height: 40px !important;
    }

    /* Place title in the center of item ----------- start ---*/
    .music-row h3 {
        font-size: 18px !important;
        margin: 15px auto 15px auto !important;
        display: block !important;
        width: 100% !important;
        text-align: center !important;
    }

    .music-row .under_image_portfolio {
        width: 100% !important;
    }

    .music-row .owl-item .item_content {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
    }

    .music-row .cws_portfolio_post_title {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        position: relative !important;
    }

    .music-row .cws_portfolio_post_title::before,
    .music-row .cws_portfolio_post_title::after {
        position: absolute !important;
    }
    /* Place title in the center of item ----------- end ----*/

    /* break song title if too long*/
    .music-row .cws_portfolio_post_title a {
        display: inline-block;
        max-width: 200px;
        white-space: normal;
        overflow-wrap: break-word; 
        word-break: normal;
        text-align: center;
    }

    .posts_grid .item.under_img.style_round .under_image_portfolio{
      max-width: 100% !important;
    }

    .music-row .portfolio_item_grid_post {
      padding: 0 5px !important;
    }

    /* columns should stay next to each other in mobile view instead of below each other */
    .song_overview_title_column {
        width: 50% !important;
        float: left !important;
    }

    .album_link_column {
        width: 50% !important;
        float: right !important;
    }

    #music .vc_row.vc_inner {
        margin-bottom: 5px !important;
    }

    #music .cws_custom_button {
        font-size: 20px !important;
    }

    #music .sc_button_wrapper {
        margin-top: 80px !important;
    }


}

/* special spacing for galaxy tab s9+ 800px */
@media (min-width: 800px) and (max-width: 800px) {

    #music .vc_row.vc_inner{
        margin-bottom: 40px !important;
    }
}

@media (min-width: 481px) and (max-width: 834px) {
    .music-row h3 {
        font-size: 20px !important;
    }
    .song_overview_title_image {
        width: 180px !important;
        height: 150px !important;
    }
    .song_overview_title_image img {
        margin-top: -15px !important;
    }
}

@media (max-width: 480px) {
    .music-row h3 {
        font-size: 15px !important;
    }
    .song_overview_title_image {
        width: 110px !important;
        height: 80px !important;
    }
    .song_overview_title_image img {
        margin-top: -35px !important;
    }
    .music-row .cws_spacing {
        height: 60px !important;
    }

    #music .cws_custom_button {
        font-size: 15px !important;
    }

    #music .sc_button_wrapper {
        margin-top: 15px !important;/*55*/
    }
    
    #music .vc_row:not(.vc_row-no-padding) .vc_column-inner {
        padding-bottom: 0px !important;
    }

    .posts_grid.cws_portfolio_posts_grid {
        margin-bottom: 40px !important;
    }
}

@media (min-width: 414px) and (max-width: 480px) {
    .posts_grid.cws_portfolio_posts_grid {
        margin-bottom: 70px !important;
    }
}

/* Only very small devices should remove padding below title */
@media (max-width: 360px) {
    .music-row .cws_vc_shortcode_module {
        margin-bottom: 0px !important;
    }
}

/* Galaxy S25 Ultra 412px needs special sizing */
@media (min-width: 410px) and (max-width: 415px) {
    .music-row .cws_spacing {
        height: 70px !important;
    }
}


/* ----------- Custom Carousel Arrows------------------------- Start */
/* Navigation always visible */
.carousel_nav_panel {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    z-index: 9999 !important;
}

/* click areas */
.carousel_nav_panel .prev,
.carousel_nav_panel .next {
    display: block !important;
    position: absolute !important;
    top: 35% !important;
    width: 130px !important;
    height: 130px !important;
    margin: 0 !important;
    padding: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 9999 !important;
    background: transparent !important;
    border: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    overflow: visible !important;
}

/* position right */
.carousel_nav_panel .next {
    right: 0px !important;
    left: auto !important;
    transform: translateY(-50%) !important;
}

/* position left */
.carousel_nav_panel .prev {
    left: 0px !important;
    right: auto !important;
    transform: translateY(-50%) !important;
}

/* Replace arrows */
.carousel_nav_panel .prev::before,
.carousel_nav_panel .next::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    font-family: initial !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
	background-image: url('/wp-content/themes/vintwood-child/assets/images/glowing_arrow_black.png') !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
    background-size: contain !important;
}

/* reflect left arrow */
.carousel_nav_panel .prev::before {
    transform: scaleX(-1) !important;
}

/* Neutralize Hover-/Desktop-Rules of the Theme */
.cws_sc_carousel:hover .carousel_nav_panel,
.cws_sc_carousel .carousel_nav_panel,
.cws_sc_carousel.arrows_default .carousel_nav_panel,
.posts_grid_carousel:hover .carousel_nav_panel,
.posts_grid_carousel .carousel_nav_panel {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
}

.cws_sc_carousel:hover .carousel_nav_panel .prev,
.cws_sc_carousel .carousel_nav_panel .prev,
.cws_sc_carousel.arrows_default .carousel_nav_panel .prev,
.posts_grid_carousel:hover .carousel_nav_panel .prev,
.posts_grid_carousel .carousel_nav_panel .prev {
    left: 0px !important;
    right: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

.cws_sc_carousel:hover .carousel_nav_panel .next,
.cws_sc_carousel .carousel_nav_panel .next,
.cws_sc_carousel.arrows_default .carousel_nav_panel .next,
.posts_grid_carousel:hover .carousel_nav_panel .next,
.posts_grid_carousel .carousel_nav_panel .next {
    right: 0px !important;
    left: auto !important;
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Show arrows until 1190px: Theme didnt show */
@media screen and (max-width: 1190px) {
    .carousel_nav_panel {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    .carousel_nav_panel .prev,
    .carousel_nav_panel .next {
        width: 100px !important;
        height: 1o0px !important;
        top: 100% !important;
    }

    .carousel_nav_panel .prev {
        left: 100px !important;
    }

    .carousel_nav_panel .next {
        right: 100px !important;
    }
}


/* Arrows should always be visible */
.carousel_nav_panel .prev,
.carousel_nav_panel .next {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
}

/* Show even without hovern */
.cws_sc_carousel .carousel_nav_panel .prev,
.cws_sc_carousel .carousel_nav_panel .next,
.posts_grid_carousel .carousel_nav_panel .prev,
.posts_grid_carousel .carousel_nav_panel .next {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Neutralize hover rules, (otherwise Theme resets opacity) */
.cws_sc_carousel:hover .carousel_nav_panel .prev,
.cws_sc_carousel:hover .carousel_nav_panel .next,
.posts_grid_carousel:hover .carousel_nav_panel .prev,
.posts_grid_carousel:hover .carousel_nav_panel .next {
    opacity: 1 !important;
}

@media screen and (min-width: 500px) and (max-width: 850px) {

    .carousel_nav_panel .prev,
    .carousel_nav_panel .next {
        width: 150px !important;
    }
}

/* ----------- Custom Carousel Arrows-------------------------- End */




/*---------- Songs Overview ---------- discs styling ----------------------------- End*/


/*---------- About Us ---------- set height & width of Image Carousel images----- Begin*/
/* 1) Set fixed height for Carousel-Container */
.equal-images.vc_images_carousel,
.equal-images .vc_images_carousel,
.equal-images .vc_carousel-inner,
.equal-images .vc_carousel-slideline,
.equal-images .vc_carousel-slideline-inner,
.equal-images .vc_item {
  height: 500px !important;
  overflow: hidden !important;
}

/* 2) Resize image to "cover" */
.equal-images img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

/* 3) Mobile responsive */
@media (max-width: 711px) {
  .equal-images.vc_images_carousel,
  .equal-images .vc_images_carousel,
  .equal-images .vc_carousel-inner,
  .equal-images .vc_carousel-slideline,
  .equal-images .vc_carousel-slideline-inner,
  .equal-images .vc_item {
    height: 200px !important;
  }

  /* break name into next line if too long */
    .peter .cws_textmodule_title,
    .michi .cws_textmodule_title {
        max-width: 120px;
    }

    /* same space between text as images */
    .peter p {
        padding-right: 5px !important;
    }
    .michi p {
        padding-left: 5px !important;
    }
}

@media (max-width: 711px) {
  .equal-images.vc_images_carousel,
  .equal-images .vc_images_carousel,
  .equal-images .vc_carousel-inner,
  .equal-images .vc_carousel-slideline,
  .equal-images .vc_carousel-slideline-inner,
  .equal-images .vc_item {
    height: 200px !important;
  }

  /* break name into next line if too long */
    .peter .cws_textmodule_title,
    .michi .cws_textmodule_title {
        max-width: 120px;
    }

    /* same space between text as images */
    .peter p {
        padding-right: 5px !important;
    }
    .michi p {
        padding-left: 5px !important;
    }
}

@media (max-width: 1024px) {
    .about-us .cws_spacing {
        height: 10px !important;
    }

    .about-us {
        padding-top: 50px !important;
    }

    .peter {
        width: 50% !important;
        float: left !important;
    }

    .michi {
        width: 50% !important;
        float: right !important;
    }

    .vc_row:not(.vc_row-no-padding) .peter.vc_column_container > .vc_column-inner {
        padding-right: 7px !important;
    }

    .vc_row:not(.vc_row-no-padding) .michi.vc_column_container > .vc_column-inner {
        padding-left: 7px !important;
    }

    .peter div.wpb_content_element,
    .michi div.wpb_content_element {
        margin: 0px !important;
    }

    .about-us .vc_item,
    .about-us .vc_carousel-slideline-inner,
    .about-us .vc_carousel-slideline,
    .about-us .vc_carousel-inner,
    .about-us .equal-images .vc_images_carousel {
        height: auto !important;
        margin-bottom: 5px !important;
    }

    /* Center titles horizontally */
    .cws_textmodule_titles h3 {
        display: inline-block;
        text-align: center;
    }

    .cws_textmodule_content {
        margin-top: 15px !important;
    }
}

.peter p,
.michi p {
    text-align: justify !important;
}

@media (min-width: 712px) and (max-width: 712px) {
    .about-us {
        padding-top: 80px !important;
    }
}

/*---------- About Us ----------------------------------------------------------- End*/


/*---------- Song Details ---------- styling and specal effects ---------------- Start*/
/* Image size and position */
.cws_portfolio_post .pic {
	width: 300px !important;
	margin-left: auto;
	margin-right: auto;
	/*margin-top: 100px;*/
}

/* Remove backgound image and shadow */
.cws_portfolio .item .post_media .pic::before,
.cws_portfolio .item .post_media .pic::after {
    background-image: none !important;
    box-shadow: none !important;
    -webkit-box-shadow: none !important;
}
.cws_portfolio .item .post_media .pic {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
    background-image: none !important;
}
/* Remove background pattern image */
.header_wrapper_container.disabled_top_bar::after,
body.single .header_wrapper_container::after {
    background-image: none !important;
}

.post_content p {
    color: black !important;
}

/*----- Spin record when audio is playing Begin -----*/
@keyframes spinVinyl {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}

/* Portfolio Featured Image */
.cws_portfolio .item .post_media .pic img {
    animation-play-state: paused;
}

/* When audio plays */
.cws_portfolio .item .post_media .pic img.is-playing {
    animation: spinVinyl 3s linear infinite;
    animation-play-state: running;
}

/*----- Spin recorn when audio is playing End -----*/


/* Remove duplicate logo in header at song details */
.logo_desktop {
    display: none !important;
}

/* Change background color of portfio*/
.single-cws_portfolio #main {
    background: #DA7F58 !important;
}

/* Remove song image (schallplatte) if youtube video is embedded */
article.has-youtube-embed .post_media.post_post_media.post_posts_grid_post_media {
    display: none !important;
}

/* Set youtube video ratio for all screen sizes */
.cws_embed_wrapper,
.wpconsent-iframe-placeholder-youtube {
    width: 100%;
}
.wpconsent-iframe-placeholder-youtube iframe {
    display: block;
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 16 / 9;
    max-height: none !important;
}

.album_link {
    padding: 5px;
    background-color: #224a49;
    color: #ffffff;
    text-decoration: none;
    text-transform: uppercase; 
    letter-spacing: 1px;      
    border-radius: 0px;
    transition: all 0.3s ease;
    font-size: 20px;
}

@media (max-width: 1024px) {
    .single .site-main {
        padding-top: 20px !important;
    }

}

@media screen and (max-width: 767px) {
    /* Remove padding below embedded youtube videos */
  .cws_oembed_wrapper {
      padding-bottom: 0px !important;
  }

  /* Reduce size of song title */
  .post_single .cws_portfolio_post_title {
      font-size: 30px !important;
      margin-bottom: 30px !important;
  }


}

@media screen and (min-width: 481px) and (max-width: 767px) {
    /* Remove padding below embedded youtube videos */
  .cws_oembed_wrapper {
      padding-bottom: 0px !important;
  }

  /* Reduce size of song title */
  .post_single .cws_portfolio_post_title {
      font-size: 45px !important;
      margin-bottom: 30px !important;
  }


}

@media screen and (max-width: 480px) {

  /* Reduce size of song title */
  .post_single .cws_portfolio_post_title {
      font-size: 30px !important;
      margin-bottom: 30px !important;
      margin-top: 30px !important;
  }

    /* Image size and position */
    .cws_portfolio_post .pic {
        width: 200px !important;
    }

    /* Remove margin if youtube video is embedded */
    article.has-youtube-embed .cws_portfolio_post_title {
        margin-bottom: 0px !important;
    }

    .album_text_afoch {
        margin-bottom: -20px !important;
    }

    .album_text_zeit {
        margin-bottom: 0px !important;
    }
}

@media screen and (min-width: 481px) and (max-width: 850px){

    .album_text_afoch {
        margin-bottom: 180px !important;
    }

    .album_text_donau {
        margin-bottom: 200px !important;
    }

    .album_text_heit {
        margin-bottom: 200px !important;
    }

    .album_text_zeit {
        margin-bottom: 200px !important;
    }

    .album_text_johnny {
        margin-bottom: 110px !important;
    }

    .album_text_oide {
        margin-bottom: 80px !important;
    }

    .post_single .cws_portfolio_post_title {
      margin-top: 80px !important;
  }

}
/*---------- Song Details ---------- styling and specal effects ---------------- End*/


/*---------- Events ---------- style button ------------------------------------- Start*/
.event-ticket-wrapper {
    margin-top: 60px;
    text-align: start;
}

.event-ticket-button {
    margin-left: 5px !important;
    display: inline-block;
    background: #2790A5;;
    color: #fff !important;;
    padding: 10px;
    text-decoration: underline !important;;
    font-weight: 600;
    transition: all 0.3s ease;
}

.event-ticket-button:hover {
    background: #BF1E2E; 
    color: #fff !important;
    opacity: 1 !important; 
    transform: scale(1.05);
}

/* Hide date box of future event */
.post-768 .inline_date {
    display: none !important;
}

/* If event has gallery, title should have different styling -------------- start ---*/
/* Nur Titel von Beiträgen mit echtem Link unterstreichen */
#events article.has-custom-link h3.post_title a {
  text-decoration: underline !important;
}

#events article.has-custom-link h3.post_title a:hover {
  opacity: 0.8;
}

/* Klick-Effekt für das Bild  */
#events article.has-custom-link .pic img {
  cursor: pointer;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

#events article.has-custom-link .pic img:hover {
  opacity: 0.9;
  transform: scale(1.02); /* Sanfter Zoom beim Hover */
}

/* Pfeil vor dem Titel einfügen */
#events article.has-custom-link h3.post_title a::before {
  content: "→ "; /* Hier kannst du auch andere Pfeile wie ➔, ➜ oder ➜ nutzen */
  display: inline-block;
  margin-right: 6px;
  transition: transform 0.2s ease;
}

/* Pfeil bewegt sich leicht nach rechts, wenn man drüber fährt */
#events article.has-custom-link h3.post_title a:hover::before {
  transform: translateX(4px);
}
/* If event has gallery, title should have different styling -------------- end ---*/


@media (max-width: 767px) {

    .events h3 {
        font-size: 20px !important;
    }

    .inline_date .day,
    .inline_date .month {
        font-size: 22px !important;
        padding: 0px !important;
    }
}

@media (min-width: 744px) and (max-width: 1024px) {

    .events h3 {
        font-size: 24px !important;
    }

    .inline_date .day,
    .inline_date .month {
        font-size: 28px !important;
        padding: 0px !important;
    }
}

@media (max-width: 480px) {

    .event-ticket-wrapper {
        margin-top: 10px;
    }
}

/*---------- Events ---------- style button ------------------------------------- End*/

/*---------- Presse ---------- responsive ------------------------------------- Start*/
@media (max-width: 767px) {

    .presse h3 {
        font-size: 20px !important;
    }

    .inline_date .day,
    .inline_date .month {
        font-size: 22px !important;
        padding: 0px !important;
    }
}

@media (min-width: 744px) and (max-width: 1024px) {

    .presse h3 {
        font-size: 24px !important;
    }

    .inline_date .day,
    .inline_date .month {
        font-size: 28px !important;
        padding: 0px !important;
    }
}

@media (min-width: 744px) and (max-width: 850px) {

    #press .cws_vc_shortcode_module {
        margin-top: 90px !important;
    }
}

@media (min-width: 712px) and (max-width: 712px) {

    #press .cws_vc_shortcode_module {
        margin-top: 120px !important;
    }
}


/*---------- Presse ---------- responsive ------------------------------------- End*/

.presse-btn {
    text-decoration: underline;
}

.presse-btn:hover {
    color: red;
}

/*---------- Projects ---------- responsive ------------------------------------- End*/

@media (max-width: 767px) {
    .projects h3 {
        font-size: 20px !important;
    }
}

@media (min-width: 744px) and (max-width: 1024px) {
    .projects h3 {
        font-size: 24px !important;
    }
}
/*---------- Projects ---------- responsive ------------------------------------- End*/

/*---------- Contact ---------- contact form ------------------------------------- Start*/

/* Contact form button color and hover */
.cws_submit {
    color:white !important;
}
.cws_submit:hover {
    color: #BF1E2E !important;
}

/* Remove padding below contact page */
.page_content:not(:empty){
    padding-bottom: 0px !important;
}

/* Reduce font size of contact form fields */
.wpcf7-form-control {
    font-size: 18px !important;
}
.wpcf7-submit {
    font-size: 30px !important;
}

.wpcf7-not-valid-tip {
    color: #BF1E2E !important;
}

.form-dsgvo-text {
    font-size: 14px;
}

/* Ändert den Button-Text/Optik, während die Seite/das Formular lädt */
form.wpcf7-form.submitting .wpcf7-submit {
    opacity: 0.5;                /* Macht den Button halb transparent */
    cursor: wait !important;     /* Zeigt die Sanduhr/den Lade-Mauszeiger */
    pointer-events: none;       /* Verhindert Mehrfach-Klicks */
}



/* Green popup when message was sent should be placed above fields */
/* 1. Verhindert, dass das Formular ungewollt Platz reserviert */
.wpcf7-form {
    position: relative !important;
}
/* 2. Versteckt die Box im normalen Textfluss vollständig */
.wpcf7-response-output {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important; /* Hegt sich genau an die Unterkante des Formulars */
    
    /* WICHTIG: Nimmt das Element komplett aus dem Layout-Fluss */
    margin: 0 !important; 
    box-sizing: border-box;
    
    /* Design der Box */
    z-index: 99 !important;
    background-color: #008a20 !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 0px;
    padding: 7px !important;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}


@media (max-width: 1024px) {
    .wpcf7-form-control {
        font-size: 14px !important;
    }
    .wpcf7-submit {
        font-size: 25px !important;
    }
    
    #contact .vc_row:not(.vc_row-no-padding) .vc_column-inner {
        padding-bottom: 0px !important;
    }
}
@media (min-width: 744px) and (max-width: 1024px) {
    /* place form below text also for tablet */
    #contact {
        display: block !important;
    }
    #contact > .wpb_column {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        display: block !important;
    }
    #contact > .wpb_column {
        margin-bottom: 50px;
    }

    #contact > .wpb_column:last-child {
        margin-bottom: 0;
    }
}
/* special spacing for size 744 i-pad mini */
@media (min-width: 744px) and (max-width: 744px) {
    /* Center all items, because submit button is not centered */
    #contact .wpcf7 {
        margin-bottom: 150px !important;
    }
}

/* special spacing for size 712 galaxy tab s9 */
@media (min-width: 712px) and (max-width: 712px) {
    /* Center all items, because submit button is not centered */
    #contact .wpcf7 {
        margin-bottom: 180px !important;
    }
}

/* special spacing for size 800 galaxy tab s9+ */
@media (min-width: 800px) and (max-width: 800px) {
    #contact .cws_vc_shortcode_module {
        margin-bottom: 0px !important;
    }
    #contact .wpcf7 {
        margin-bottom: 100px !important;
    }
}

@media (max-width: 711px) {
    /* Center all items, because submit button is not centered */
    .wpcf7-form {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .form-dsgvo-text {
        text-align: center;
        font-size: 12px;
    }
}

@media (max-width: 450px) {

    #contact .cws_vc_shortcode_module {
        margin-bottom: 0px !important;
    }

    .wpcf7 textarea {
        height: 80px !important; 
        min-height: auto !important; /* Verhindert, dass das Theme eine Mindesthöhe erzwingt */
    }

}
/*---------- Contact ---------- contact form ------------------------------------- End*/

/*---------- Mobile Navbar --------------------------------------------------------- Start*/

/* Only mark navbar item if section is active ----------------- start ----*/
/* Desktop */
.main-menu li.active-section > a {
  color: #BF1E2E !important;
  filter: drop-shadow(2px 2px 0px rgba(191,30,46,0.27)) !important;
}
.current-menu-item > a,
.current_page_item > a {
  color: #2790A5 !important;
  filter: drop-shadow(2px 2px 0px #a9cabc) !important;
}
.current-menu-item > a:hover,
.current_page_item > a:hover {
  color: #BF1E2E !important;
  filter: drop-shadow(2px 2px 0px rgba(191,30,46,0.27)) !important;
}

/* Mobile*/
.mobile_menu_container ul.mobile_menu li .menu_row {
  background-color: #2790A5 !important;
}
.mobile_menu_container ul.mobile_menu li .menu_row.active-section {
  background-color: #BF1E2E !important;
}
/* Only mark navbar item if section is active --------------------- end ------*/

/* Make whole row clickable instead of just text */
.mobile_menu_wrapper .mobile_menu li a {
    display: block;
    width: 100%;
    height: 100%;
}


/* hide search bar in mobile nav bar*/
.mobile_menu_search {
    display: none;
}

/* Sticky navbar for mobile/tablet */
@media (max-width: 1024px) {
  .header_wrapper_container,
  .site_header,
  .sticky_header,
  .sticky,
  .site_sticky,
  .header_cont {
    position: sticky !important;
    top: 0 !important;
    z-index: 99999 !important;
    background-color: #f7f2e8;
  }

  .page_content:not(:empty) {
    padding-top: 0px !important;
    margin-top: -10px !important;
  }
}

/* fix navbar stripes -------------------------------------------------- start ----------------------*/

/* 1. Falls das Theme Zierleisten/-balken im Header hat */
.site_header::before,
.site_header::after,
.header_wrapper_container::before,
.header_wrapper_container::after,
.header_border,
.header_bg_img {
    /* Verhindert durchgehende Linien */
    max-width: 100% !important;
}

/* 2. Spezifische Anpassung für links/rechts Streifen (VintWood Theme Layout) */
@media (min-width: 1025px) {
    /* Setzt gezielt die Trennung zwischen rechtem und linkem Balken um */
    .header_wrapper_container .left_stripe,
    .site_header .left-stripe {
        width: 570px !important;
        display: block !important;
    }

    .header_wrapper_container .right_stripe,
    .site_header .right-stripe {
        width: 650px !important;
        display: block !important;
    }

    /* Falls das Theme einen durchgehenden Hintergrundstreifen nutzt, diesen unterbrechen */
    .header_wrapper_container {
        background-image: none !important; /* Entfernt eventuelle durchgehende Muster */
    }
}
/* fix navbar stripes -------------------------------------------------- end ----------------------*/



/* Mobile navbar menu should overlay instead moving page content */
@media (max-width: 1024px) {
    .menu_box {
        position: relative !important;
        margin-bottom: 0px !important; /* Remove margin below nav-bar */
    }

    .mobile_menu_wrapper {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        right: 0 !important;
        width: calc(100% + 30px) !important;
        z-index: 99999 !important;
        margin-top: 0px !important;
    }

    .mobile_menu_container {
        position: relative !important;
        z-index: 99999 !important;
    }
}
/* Adapt navbar menu width for tablet */
@media (min-width: 744px) and (max-width: 1024px){
    .mobile_menu_wrapper {
        width: 100% !important;
    }

}
/*---------- Mobile Navbar -------------------------------------------------------------- End*/


/* ----------Instagram Feed ------------------------------------------------------------------- Start*/

/* Instagram consent box */
.ig-consent-box {
  text-align: center;
  padding: 32px;
  border-radius: 16px;
  /* Instagram gradient */
  background: linear-gradient(
    135deg,
    #f58529cc,
    #dd2a7bcc,
    #8134afcc,
    #515bd4cc
    );
  max-width: 100%;
}
.ig-consent-box p {
  margin: 0 0 18px 0;
  color: #ffffff;
}

@media (max-width: 480px) {
    .ig-consent-box {
        margin-bottom: 40px !important;
    }
}

/* If consent placeholder is shown, additional margin is needed */
@media (min-width: 400px) and (max-width: 1024px) {
    /* If consent placeholder is shown, additional margin is needed */
    #ig-feed-container:has(#ig-consent-placeholder) {
        margin-bottom: 150px;
    }
}
@media (min-width: 800px) {
    #ig-feed-container:has(#ig-consent-placeholder) {
        margin-bottom: 550px;
    }
}
@media (min-width: 1024px) {
    #ig-feed-container:has(#ig-consent-placeholder) {
        margin-bottom: 350px;
    }
}

/* ---------- Move "follow us" button to the top ---------------------------- Start*/
/* Text + Button next to each other */
#sb_instagram .sbi_feedtheme_header_text {
    display: flex;
    align-items: start;
    gap: 10px;
    flex-direction: row;
}

/* Name + Bio below each other */
#sb_instagram .custom-insta-text-wrap {
    display: flex;
    flex-direction: column;
}

#sb_instagram .custom-insta-text-wrap h3,
#sb_instagram .custom-insta-text-wrap .sbi_bio {
    margin: 0;
}

#sb_instagram .custom-insta-text-wrap .sbi_bio {
    margin-top: 6px;
}

/* Button-Container back to normal width */
#sb_instagram #sbi_load {
    width: auto !important;
    margin-left: auto !important;
    padding: 0 !important;
    clear: none !important;
    float: none !important;
    text-align: left !important;
}

/* Button */
#sb_instagram .sbi_follow_btn {
    display: inline-block;
    margin: 0;
}
#sb_instagram .sbi_follow_btn {
    display: inline-block;
    margin-left: auto;
}

#sb_instagram .sbi_follow_btn a {
    padding: 7px 10px !important;
}


/* ---------- Move "follow us" button to the top ------------------------------- End*/

/*
    FIX: Smash Balloon grid layout issue on mobile
    stylesheet (main.css) overrides .sbi_item with width: 50%.
    By forcing width: 100%, each item correctly fills its grid column again.
*/
@media (max-width: 480px) {
  #sb_instagram #sbi_images .sbi_item {
    width: 100% !important;
  }
}

/* ----------Instagram Feed ---------------------------------------------------------------------- End*/


/* ----------Cookies ------------------------------------------------------------------------------- Start*/

/*  Youtube Cookies Placeholder Button: Make button unclickable, change text styling */
.wpconsent-iframe-accept-button {
  white-space: normal;       
  word-break: break-word;   
  overflow-wrap: break-word;
  pointer-events: none;  
  cursor: default;  
  text-transform: none;      /* remove capital letters */
  font-size: 14px;
  line-height: 1.5;
  text-align: center;
  padding: 12px 16px;
  font-weight: 500;
}

/* --------------- Priming - Box ------------------------------------------------ Start*/
.ig-priming-overlay {
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 999999;
  pointer-events: none;
  background: rgba(0,0,0,0.3);
}

.ig-priming-box {
  max-width: 320px;
  padding: 24px;
  border-radius: 20px;
  text-align: center;
  background: linear-gradient(
    135deg,
    #f58529,
    #dd2a7b,
    #8134af,
    #515bd4
  );
  color: #fff;
  pointer-events: auto;
}

.ig-priming-text {
  font-size: 14px;
  line-height: 1.5;
  margin-bottom: 20px;
}

.ig-priming-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.ig-priming-accept {
  background: #fff;
  color: #000;
  border: none;
  padding: 10px;
  border-radius: 10px;
  cursor: pointer;
  margin: 0px;
}

.ig-priming-decline {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255,255,255,0.5);
  padding: 10px;
  border-radius: 10px;
  cursor: pointer;
  margin: 0px;
}

/* --------------- Priming - Box ------------------------------------------------ End*/

@media (max-width: 480px) {
  /* Stack the whole preferences button area vertically on mobile */
  #wpconsent-container::part(wpconsent-preferences-buttons) {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 5px !important;
  }

  /* Stack the left button group vertically as well */
  #wpconsent-container::part(wpconsent-preferences-buttons-left) {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 5px !important;
    padding-right: 0 !important;
  }

  /* Make all buttons full width */
  #wpconsent-container::part(wpconsent-preferences-accept-button),
  #wpconsent-container::part(wpconsent-preferences-cancel-button),
  #wpconsent-container::part(wpconsent-preferences-save-button) {
    width: 100% !important;
    max-width: 100% !important;
    white-space: normal !important;
    text-align: center !important;
  }

  

}
/* ----------Cookies ------------------------------------------------------------------------------- End*/


/*------------- gallery ----------------------------------------- start -----------*/
[id^="gallery-"].gallery[class*="galleryid-"] {
    margin: 30px 0px 10px 0px !important;
}
@media (max-width: 1024px) {

   /* Open img fix--------------------------- start ----- */
  .fancybox-wrap {
    position: fixed !important;
    top: 50% !important;
    left: 50% !important;
    width: calc(100vw - 20px) !important;
    max-width: calc(100vw - 20px) !important;
    transform: translate(-50%, -50%) !important;
    height: auto !important;
  }

  .fancybox-skin,
  .fancybox-outer,
  .fancybox-inner {
    width: 100% !important;
    height: auto !important;
    box-sizing: border-box !important;
  }

  .fancybox-inner {
    overflow: hidden !important;
  }

  .fancybox-image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    max-height: 85vh !important;
    object-fit: contain !important;
  }

  /* optional: animation/jump minimieren */
  .fancybox-wrap,
  .fancybox-skin,
  .fancybox-overlay {
    -webkit-transition: none !important;
    transition: none !important;
  }
  
  /* Show arrows */
  .fancybox-nav span {
    visibility: visible !important;
    opacity: 1 !important;
  }
  .fancybox-prev span,
  .fancybox-next span {
    display: block !important;
  }
   /* Open img fix--------------------------- end ----- */

  /* Show 2 columns galery for mobile */
  [id^="gallery-"].gallery {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    max-width: 100% !important;
    margin: 0 !important;
  }
  [id^="gallery-"].gallery .gallery-item {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  [id^="gallery-"].gallery br {
    display: none !important;
  }
  [id^="gallery-"].gallery[class*="galleryid-"] .gallery-item {
    margin-top: 0 !important;
  }
  [id^="gallery-"].gallery[class*="galleryid-"] {
    margin: 30px 0px 0px 0px !important;
  }
}

/* event galeries title*/
.event_galery_title {
    margin: 60px 15px 0px 15px;
}

.event_galery_title_schloss {
    margin: 60px 15px 60px 15px !important;
}

@media (max-width: 480px) {
    /*reduce title size of event galeries*/
    .event-galerie h1{
        font-size: 33px !important;
    }
    .event_galery_title_schloss {
        margin: 40px 15px 30px 15px !important;
    }

    .event_galery_title {
        margin: 40px 15px 30px 15px !important;
    }

    #gallery .sc_button_wrapper  {
        margin-top: -10px !important;
    }
}

@media (min-width: 801px) and (max-width: 850px) {
    #gallery .cws_textmodule_titles .cws_textmodule_title {
        margin-bottom: 50px !important;
    }
}

@media (min-width: 481px) and (max-width: 800px) {
    #gallery .cws_textmodule_titles .cws_textmodule_title {
        margin-bottom: -10px !important;
    }
}

@media (min-width: 713px) {

    #gallery .cws_vc_shortcode_module {
        margin-bottom: 0px !important;
    }

}

@media (max-width: 712px) {

    #gallery .cws_vc_shortcode_module {
        margin-bottom: 0px !important;
    }

}

@media (min-width: 1025px) {

    #gallery h2 {
        margin-bottom: -30px !important;
    }

    #gallery .gallery {
        margin-bottom: -20px !important;
    }

}
/*------------- gallery ----------------------------------------- end -----------*/

/*------------- navbar ----------------------------------------- start -----------*/

/* Show sticky header for desktop */
@media (min-width: 1025px) {
    .sticky_header {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }
}

/* Show sticky header only after initializing */
@media (max-width: 1024px) {
    .sticky_header {
        visibility: hidden;
        opacity: 0;
        transition: opacity 0.2s ease;
    }

    body.mobile-header-ready .sticky_header {
        visibility: visible;
        opacity: 1;
    }
}
/*------------- navbar ----------------------------------------- end -----------*/


/* Hide h1 title added for SEO */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Title h2 */
.bigHeading .cws_textmodule_title.small{
    font-size: 80px !important;
}
@media (max-width: 1024px) {
    .cws_textmodule_title {
        padding-top: 10px !important;
    }
    .bigHeading .cws_textmodule_title.small{
        font-size: 60px !important;
    }
}
@media screen and (max-width: 767px) {
    .bigHeading .cws_textmodule_title.small {
    font-size: 40px !important;
  }
}

/* Post headings should not be clickable, like projects, presse */
a[href="#"] {
    pointer-events: none;
    cursor: default;
}

/* footer always at the bottom */
@media (max-width: 1024px) {
  .copyrights_area.bottom_fixed {
    position: fixed !important;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 999;
  }
}

/* Center Copyright text */
.copyrights_container {
    display: flex;
    justify-content: center;   /* horizontal */
    align-items: center;       /* vertical */
}

/* font size */
.plaintext,
.post_content p
{
    font-size: 18px !important;
}
@media (max-width: 767px) {
    .plaintext,
    .post_content p
    {
        font-size: 14px !important;
    }
/*
    .plaintext p {
        text-align: justify !important;
    }
*/
}

@media (min-width: 744px) and (max-width: 1024px) {
    .plaintext,
    .post_content p
    {
        font-size: 16px !important;
    }
}


/* special spacing for galaxy tab s9+ */
@media (min-width: 800px) and (max-width: 800px) {
    .sc_button_wrapper{
        margin-bottom: 100px !important;
    }
}