/*
 Theme Name:   Alle wollen Twenty Twenty-Four
 Description:  a child theme
 Author:       Stephan Graap
 Template:     twentytwentyfour
 Version: 1.0
 Requires at least: 6.4
 Tested up to: 6.4
 Requires PHP: 7.0
*/

        :root {
            --para-wiesen: 0px;
            --para-feld: 0px;
            --para-claim: 0px;
        }

        body {
            background: rgb(0, 90, 140);
            background: linear-gradient(180deg, rgba(0, 90, 140, 1) 0%, rgba(233, 160, 84, 1) 67%, rgba(204, 75, 12, 1) 76%, rgba(197, 74, 13, 1) 81%, rgba(1, 29, 50, 1) 100%);
            min-height: 100vh;

        }

        .postercontainer {
            position: relative;
            flex: 1;
            display: flex;
            flex-direction: column;
            overflow: hidden;

        }

        .viewport {
            position: relative;
            flex: 1;
            display: flex;
            flex-direction: column;
            background-repeat: no-repeat;

        }




        .titelContainer {
            position: absolute;
            width: 100%;
            top: 15.6%;
            left: 0;
            --top: 0px;
            transform: translateY(var(--top));
            max-width: 1200px;
            transition: transform 155ms ease-out;
            z-index: 1;
        }

        .settled .titel {
            animation: scale 3s infinite;
            transform-origin: 50% 60%;
        }

        .bogen {
            width: 23%;
            position: absolute;
            top: 50%;
            right: 1%;
            animation: seilAnim 3s infinite;
        }   

        .bogen:before {
            content: "";
            display: block;
            width: 1px;
            height: 128%;
            background-color: #f8e9c4;
            position: absolute;
            top: -102%;
            right: 46%;
        }

        .bogen img {
            width: 100%;
			position: relative;
            animation: bogen 3s infinite;
        }


        @keyframes scale {
            0% {
                transform: rotate(0);
            }

            50% {
                transform: rotate(3deg);
            }

            100% {
                transform: rotate(0deg);
            }
        }

     @keyframes seilAnim {
            0% {
                transform: translateY(0) translateX(0);
            }

            50% {
                transform: translateY(20%) translateX(3%);
            }

            100% {
                transform: translateY(0deg) translateX(0);
            }
        }
     @keyframes bogen {
            0% {
                transform: rotate(0);
            }

            50% {
                transform: rotate(-5deg);
            }

            100% {
                transform: rotate(0);
            }
        }
  @keyframes slideOpen {
            0% {
                transform: translateX(100%);
            }

            100% {
                transform: translateX(0);
            }
        }


        .postercontainer {
            display: flex;
            flex-direction: column;
            max-width: 1200px;
            margin: auto;
        }

        .flackern {
            position: absolute;
            left: 46.7%;
            top: 52.9%;
            width: 10%;
            width: 10%;
        }

        .bgContainer {
            position: relative;
        }

        .bgContainer img {
            position: absolute;
            bottom: 0;
            left: 0;
            width: 100%;

        }

        .bgContainer .berg {
            position: relative;
            display: block;
            bottom: 0;
            left: 0;
            width: 100%;

        }

        .mainNav {
            position: relative;
            top: 0px;
            left: 0;
            width: 100%;
            z-index: 2;
        }



        .mainCont {
            max-width: 1200px;
            margin: auto;
        }

        .wp-site-blocks>footer {
            margin-top: 0
        }

        .tnp-field-button,
        .tnp-subscription {
            text-align: center !important
        }

        .postercontainer {
            position: relative;
            overflow: hidden;
        }
        .postercontainer img {
            width: 100%;
            height: auto;
        }

        .flackern {
            position: absolute;
            left: 46.7%;
            top: 52.9%;
            width: 10% !important;
            height: auto;
        }
        .para-claim {
            position: relative;
            transform: translateY(var(--para-claim));
        }

        .para-wiesen {
            position: relative;
            transform: translateY(var(--para-wiesen));
        }

        .para-feld {
            position: relative;
            transform: translateY(var(--para-feld));
        }
		main {
			background: transparent !important;
			padding: 0 !important;
		}
.wp-site-blocks {
	position: relative
}
.wp-block-cover__inner-container {
	margin-top: auto;
	margin-bottom: 1rem
}
.wp-block-navigation__responsive-container.is-menu-open {
	backdrop-filter: blur(10px); 
	background: rgba(21, 99, 127,.5) !important; 
    animation: slideOpen .25s normal ease-in-out;
  text-align: right;
}

.releaseP {
	position: absolute;bottom: 0;width: 100%;text-align: center;color: #f8e9c4;font-family: var(--wp--preset--font-family--heading);font-size: 1.5rem;line-height: 100%;
}
.claimP {
	position: absolute;top: 5%;width: 100%;text-align: center;color: #f8e9c4;font-family: var(--wp--preset--font-family--heading);font-size: 1.5rem;line-height: 100%;
}
button.wp-block-navigation__responsive-container-open  {
	margin-left: auto;
}	
.headerCover {
				aspect-ratio: 24/5 !important;
  min-height: 0 !important;
}
        @media only screen and (min-width: 1000px) {
			.headerCover {
				aspect-ratio: 24/5 !important;
  min-height: 0 !important;
}
			.releaseP {
				font-size: 3rem;
			}
			.claimP {
				font-size: 2.5rem;
				top: 10%;
			}
.wp-block-cover__inner-container {
	margin-bottom: 2rem
}

        }

.tnp-field-button .tnp-submit {
	font-family: var(--wp--preset--font-family--heading); font-size: 1.5rem !important;
border-radius:7px;color:#f8e9c4 !important; 
  background: black !important;
  border: 1px solid #f8e9c4 !important;
}

header.wp-block-template-part {
	max-width: 1000px !important
}
.event_text_wrapper {
	font-family: Segoe UI,Frutiger,Frutiger Linotype,Dejavu Sans,Helvetica Neue,Arial,sans-serif;
	position: absolute;
top: 1%;
width: 100%;
left: 0%;
	z-index:3
}
.event_text {
		font-size: 1rem;
		max-width:80%;
	margin: auto;
background: black;
padding: 1rem;
text-align: center;
color: white;
}
.event_text a {
	color: inherit;
	text-decoration:none
}
.event_text strong {
	font-size: 120%;
}
.event_text p {
	margin:0
}
@media only screen and (min-width: 600px) {
	.event_text_wrapper {
		top: 5%;
	}
}

@media only screen and (min-width: 1000px) {
	.event_text_wrapper {
		
top: 1%;
	}
	.event_text {
		font-size: 1.5rem;
	}
}