/*fonts*/
/* caveat-brush-regular - latin */
@font-face {
    font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
    font-family: 'Caveat Brush';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/caveat-brush/caveat-brush-v11-latin-regular.eot'); /* IE9 Compat Modes */
    src: url('fonts/caveat-brush/caveat-brush-v11-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('fonts/caveat-brush/caveat-brush-v11-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
    url('fonts/caveat-brush/caveat-brush-v11-latin-regular.woff') format('woff'), /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+, iOS 5+ */
    url('fonts/caveat-brush/caveat-brush-v11-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* bariol-regular - latin */
@font-face {
    font-family: 'Bariol';
    src: local('Bariol Regular'),url(fonts/bariol-regular/bariol_serif_regular-webfont.eot) format('eot'),
    url(fonts/bariol-regular/bariol_serif_regular-webfont.svg) format('svg'),
    url(fonts/bariol-regular/bariol_serif_regular-webfont.ttf) format('ttf'),
    url(fonts/bariol-regular/bariol_serif_regular-webfont.woff) format('woff'),
    url(fonts/bariol-regular/bariol_serif_regular-webfont.woff2) format('woff2');
    font-style: normal;
    font-display: swap;
    font-weight: 400
}
/* bariol-bold - 700 */
@font-face {
    font-family: 'Bariol';
    src: local('Bariol Bold'),
    url(fonts/bariol-bold/bariol_serif_bold-webfont.eot) format('eot'),
    url(fonts/bariol-bold/bariol_serif_bold-webfont.svg) format('svg'),
    url(fonts/bariol-bold/bariol_serif_bold-webfont.ttf) format('ttf'),
    url(fonts/bariol-bold/bariol_serif_bold-webfont.woff) format('woff'),
    url(fonts/bariol-bold/bariol_serif_bold-webfont.woff2) format('woff2');
    font-style: normal;
    font-display: swap;
    font-weight: 700
}
html {
    scroll-behavior: smooth;
}
body {
    background-color: #EDE8D0;
    margin: 0;
    line-height: 1.5;
    padding: 0;
    font-family:Bariol, sans-serif;
    font-weight: 400;
    overflow-x: clip;
    max-width: 100%;
}
/*fonts*/
.bariol-serif-regular {
    font-family:Bariol, sans-serif;
    font-weight: 400;
}
.bariol-serif-bold {
    font-family: Bariol, sans-serif;
    font-weight: 700;
}
.caveat-brush-regular {
    font-family: "Caveat Brush", sans-serif;
    font-weight: 400;
}
/*colors*/
.lime-color {
    color: #C9DA57;
}
.green-background {
    background-color: #557528;
}
.green-color {
    color: #557528;
}
.dark-green-color {
    color: #455611;
}
.background-beige {
    background-color: #EDE8D0;
    border: 2px solid #455611;
}
.background-beige:hover {
    color: #557528;
}
.background-lime {
    background-color: #C9DA57;
    border: 2px solid #C9DA57;
}
.background-lime:hover {
    background-color: #EDE8D0;
    border: 2px solid #455611;
    color: #455611;
}
.white-color {
    color: #ffffff;
    font-weight: 400;
}
/*uniform-classes*/
.margin-top-100 {
    margin-top: 35px;
}
.margin-top-50 {
    margin-top: 25px;
}
.relative {
    position: relative;
}
.uppercase-headline {
    text-transform: uppercase;
}
.no-break {
    display: inline-block;
}
a:hover {
    color: #CBD514;
}
.boxed {
    max-width: 1640px;
    margin: 0 auto;
    padding: 0 20px;
}
h1,
h2,
h3,
p,
li,
span,
img,
a {
    color: #557528;
    text-decoration: none;
    transition: all 0.3s ease-in-out;
}
/*header*/
header.home {
    margin: 0 0 260px 0;
}
nav {
    margin-top: 25px;
}
.nav-flex {
    display: flex;
    flex-direction: row;
    column-gap: 15px;
    justify-content: end;
}
.button {
    padding: 5px 15px 6px;
    min-width: fit-content;
    line-height: 1;
}
.gradient-light-to-dark {
    padding: 0 20px 0 10px;
    background: linear-gradient(270deg, rgb(86 117 40) 0%, rgb(114 140 73) 68%, rgb(146 167 112 / .8) 95%, rgb(163 181 134 / .8911939775910365) 100%);
    min-width: max-content;
}
.gradient-dark-to-light {
    padding: 0 60px 0 10px;
    background: linear-gradient(90deg, rgb(86 117 40) 0%, rgb(114 140 73) 50%, rgb(146 167 112 / .9) 70%, rgb(181 195 157 / .5) 85%, rgb(237 232 208 / .8) 95%, #fff0 100%);
    min-width: max-content;
}
.gradient-lime {
    padding: 0 60px 0 10px;
    background: linear-gradient(260deg, rgb(201 218 87) 0%, rgb(206 220 108) 68%, rgb(206 220 108) 80%, rgb(229 228 192 / .9192051820728291) 100%);
    min-width: max-content;
}
h1 {
    display: block;
    margin: 50px 0 0 0;
    line-height: 1.26;
    color: #567528;
    font-size: 30px;
    font-weight: 400;
    text-transform: uppercase;
    max-width: 70%;
}
h1 span {
    display: inline-block;
}
.big-img {
    max-width: 240px;
    height: auto;
    top: -60px;
    position: absolute;
    right: 0;
}
.img-width {
    max-width: 100%;
    position: relative;
}
.circle-text {
    font-size: 38px;
    text-align: center;
    line-height: 1;
}
.circle {
    height: 150px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    display: flex;
    flex-direction: row;
    position: absolute;
    right: 150px;
    bottom: -240px;
}
h2 {
    font-size: 20px;
    padding: 0;
    margin: 0 0 15px 0;
    line-height: 1.3;
    max-width: 1180px;
}
.color-theme {
    padding: 5px 30px;
    color: #EDE8D0;
    background: linear-gradient(to right, #557528, #CBD514);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 20px;
    width: fit-content;
    margin: 0 0 50px 0;
}
@media screen and (min-width: 768px) {
    .color-theme {
        font-size: 30px;
    }
}
@media screen and (min-width: 1024px) {
    .color-theme {
        font-size: 48px;
        margin: 0 0 100px 0;
    }
}
p {
    font-size: 20px;
    margin: 0;
    font-family: Bariol, sans-serif;
    font-weight: 400;
}
li {
    font-family: Bariol, sans-serif;
    font-weight: 400;
}
/*main-part*/
.info-text {
    max-width: 1550px;
    line-height: 1.2;
    font-size: 18px;
    margin: 0 0 90px 0;
}
.boxed .margin-top-50 ul,
.boxed .margin-top-100 ul {
    margin: 0;
    padding: 0;
}
li {
    list-style: none;
    margin: 0;
    padding: 15px 0 0 0;
    border-bottom: #CBD514 2px solid;
    max-width: 1345px;
}
.li-width {
    max-width: 1345px;
}
/*footer*/
footer {
    margin: 80px 0 37px 0;
}
p.festival-hosts {
    max-width: 945px;
    font-size: 16px;
    margin: 0 0 25px 0;
    line-height: 1.2;
}
@media screen and (min-width: 520px) {
    /*uniform-classes*/
    .margin-top-100 {
        margin-top: 45px;
    }
    .margin-top-50 {
        margin-top: 35px;
    }
    /*header*/
    .gradient-dark-to-light {
        padding: 0 200px 0 10px;
    }
    h1 {
        font-size: 50px;
    }
    .big-img {
        max-width: 280px;
        top: -200px;
    }
    .circle {
        height: 170px;
        top: 50px;
        right: 100px;
    }
    .circle-text {
        font-size: 45px;
    }
    /*main-part*/
    h2 {
        font-size: 30px;
    }
    p {
        font-size: 30px;
    }
    .info-text {
        font-size: 26px;
    }
    li {
        font-size: 20px;
    }
    /*footer*/
    footer {
        font-size: 24px;
        margin: 125px 0 37px 0;
    }
    p.festival-hosts {
        font-size: 24px;
        margin: 0 0 50px 0;
    }
}
@media screen and (min-width: 768px) {
    /*uniform-classes*/
    .margin-top-100 {
        margin-top: 55px;
    }
    .margin-top-50 {
        margin-top: 45px;
    }
    /*header*/
    header.home {
        margin: 0 0 300px 0;
    }
    nav {
        margin-top: 45px;
    }
    .nav-flex {
        column-gap: 25px;
    }
    .button {
        font-size: 20px;
    }
    h1 {
        font-size: 90px;
        margin: 100px 0 0 0;
    }
    .gradient-dark-to-light {
        padding: 0 250px 0 10px;
    }
    .big-img {
        max-width: 350px;
        top: -200px;
    }
    .circle {
        height: 180px;
        top: 90px;
        right: 140px;
    }
    .circle-text {
        font-size: 45px;
    }
    /*main-part*/
    p {
        font-size: 35px;
    }
    li {
        font-size: 25px;
    }
}
@media screen and (min-width: 1024px) {
    /*uniform-classes*/
    .margin-top-100 {
        margin-top: 70px;
    }
    .margin-top-50 {
        margin-top: 50px;
    }
    /*header*/
    h1 {
        font-size: 110px;
        margin: 125px 0 0 0;
    }
    .gradient-light-to-dark {
        padding: 0 70px 0 50px;
    }
    .gradient-dark-to-light {
        padding: 0 250px 0 50px;
    }
    .gradient-lime {
        padding: 0 60px 0 50px;
    }
    .big-img {
        max-width: 450px;
        top: -430px;
    }
    .circle {
        right: 200px;
        top: -50px;
    }
    p {
        font-size: 45px;
    }
    /*main-part*/
    h2 {
        font-size: 40px;
    }
    .info-text {
        font-size: 34px;
        margin: 0 0 180px 0;
    }
    li {
        font-size: 34px;
    }
    footer {
        margin: 200px 0 37px 0;
    }
    footer.festival-hosts {
        margin: 100px 0 40px 0;
    }
}
@media screen and (min-width: 1500px) {
    /*header*/
    header.home {
        margin: 0 0 260px 0;
    }
    .button {
        font-size: 30px;
        padding: 4px 25px 6px;
    }
    h1 {
        font-size: 150px;
        margin: 175px 0 0 0;
    }
    .big-img {
        max-width: 930px;
        top: -835px;
        right: -70px;
    }
    .circle-text {
        font-size: 75px;
    }
    .circle {
        height: 316px;
        top: 0;
        right: 0;
    }
    /*main-part*/
    p {
        font-size: 70px;
    }
    h2 {
        font-size: 48px;
    }
    .info-text {
        font-size: 42px;
    }
    li {
        padding: 20px 0 0 0;
    }
    /*footer*/
    footer {
        margin: 200px 0 37px 0;
    }
    footer.festival-hosts {
        margin: 190px 0 40px 0;
    }
}

/*Die Festwirte - Unterseite*/
.festival-block h2 {
    margin-top: 100px;
}
.img-with-text-block {
    margin-top: 25px;
    padding-bottom: 25px;
    border-bottom: 2px solid #C9DA57;
    .img-container img:hover {
        transform: scale(1.1);
    }
}
.img-with-text-block:last-child {
    border-bottom: none;
}
h3 {
    font-size: 20px;
    margin: 0 0 10px 0;
    font-weight: 400;
}
.festival-text {
    max-width: 985px;
    margin: 0 0 15px 0;
    line-height: 1.3;
    font-size: 16px;
}
.festival-block .button {
    max-width: min-content;
    line-height: 1;
}
.festival-block .background-beige:hover {
    background-color: #C9DA57;
    border: 2px solid #C9DA57;
}
.festival-block .info-text {
    margin-bottom: 60px;
}
.img-container {
    aspect-ratio: 1.59;
    min-width: 100%;
    overflow: hidden;
}
.festival-hosts-img {
    object-fit: cover;
    height: 100%;
    width: 100%;
}
.flex {
    display: flex;
    flex-direction: column;
    gap: 25px;
    min-width: 100%;
}
.flex70 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 100%;
}
.flex30 {
    max-width: 100%;
}

@media screen and (min-width: 520px){
    h3 {
        font-size: 25px;
    }
    .festival-text {
        font-size: 20px;
    }
}
@media screen and (min-width: 768px){
    h3 {
        font-size: 35px;
    }
    .festival-text {
        font-size: 24px;
    }
}
@media screen and (min-width: 1024px){
    .festival-block h2 {
        margin-top: 250px;
    }
    .img-with-text-block {
        margin-top: 50px;
        padding-bottom: 50px;
    }
    h3 {
        font-size: 42px;
    }
    .festival-block .info-text {
        margin-bottom: 115px;
    }
    .img-container {
        min-width: 570px;
    }
    .flex {
        flex-direction: row;
        gap: 50px;
        align-items: center;
    }
    .flex70 {
        width: 70%;
    }
    .flex30 {
        max-width: 570px;
    }
}

/*Rechtliche Unterseiten*/
header.legal {
    margin: 0 0 250px 0;
}
.legal-sites .boxed p {
    max-width: 1345px;
    text-align: left;
}
.legal-sites h2{
    margin-top: 20px;
    margin-bottom: 20px;
    max-width: 1345px;
}
.legal-sites p,
.legal-sites a {
    font-size: 18px;
}
.legal-sites p.bariol-serif-bold,
.legal-sites a.bariol-serif-bold {
    margin-bottom: -7px;
}
.legal .background-beige:hover,
.legal-sites .background-beige:hover {
    background-color: #C9DA57;
    border: 2px solid #C9DA57;
}
.legal-sites li {
    padding: 15px 0 0 0;
    border-bottom: none;
    display: flex;
}
.legal-sites li:before {
    content: "·";
    color: #455611;
    margin-right: 10px;
}
.legal-sites ul {
    padding: 0;
}

@media screen and (min-width: 520px) {
    .legal-sites p,
    .legal-sites a {
        font-size: 24px;
        margin-bottom: 20px;
    }
}
@media screen and (min-width: 1024px) {
    .legal-sites p,
    .legal-sites a {
        font-size: 30px;
    }
    /*Rechtliche Unterseiten*/
    .legal-sites p.bariol-serif-bold,
    .legal-sites a.bariol-serif-bold {
        margin-bottom: -20px;
    }
}
@media screen and (min-width: 1260px) {
    header.legal {
        margin: 0 0 350px 0;
    }
    .legal-sites p,
    .legal-sites a {
        font-size: 42px;
    }
}




.accordion-container {
    overflow: hidden;
    transition: height 0.5s ease;
    border-bottom: 2px solid #CBD514;
}

.accordion-container summary {
    cursor: pointer;
    padding: 20px 0;
    background: #EDE8D0;
    list-style: none;
    font-size: 20px;
    font-weight: 700;
    color: #557528;
    line-height: 1.1;
}
@media screen and (min-width: 1024px) {
    .accordion-container summary {
        font-size: 34px;
    }
    .accordion-container p {
        font-size: 24px !important;
    }
}

.accordion-container p {
    font-size: 16px;
    line-height: 1.3;
}

.accordion-container summary::-webkit-details-marker {
    display: none;
}

.accordion-container div {
    padding: 0 0 20px 0;
    margin-top: -15px;
    display: none;
}

::selection {
    color: #557528;
    background-color: #CBD514;
}