/*
Theme Name: HIPUNI St. Anna
Author: Ulf Paule
Version: 1.2
*/

/* fonts

font-family: 'Heebo', sans-serif;
font-weight: 300; 500 700

font-family: 'Shadows Into Light Two', cursive;

*/


@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 300;
  src: url(fonts/Heebo-Light.ttf) format('truetype');
}

@font-face {
  font-family: 'Heebo';
  font-style: normal;
  font-weight: 500;
  src: url(fonts/Heebo-Medium.ttf) format('truetype');
}

@font-face {
  font-family: 'Shadows Into Light Two';
  font-style: normal;
  font-weight: 400;
  src: url(fonts/ShadowsIntoLightTwo-Regular.ttf) format('truetype');
}






/* global style reset */

img, iframe {
border: 0;
}

form {
margin: 0;
padding: 0;
}

table, td, input, textarea, select {
font-family: inherit;
font-size: 1em;
}

video {
object-fit: cover;
}

a {
color: inherit;
transition: color 0.2s ease;
}
.layout-text a:hover,
.teaser:hover a,
#footer a:hover {
	color: rgb(226,0,13);
}
/*#links .layout-text a:hover {
	color: inherit;
}*/

strong {
font-weight: 500;
}
em {
	font-style: normal;
	font-weight: normal;
	font-family: 'Shadows Into Light Two', cursive;
	color: #1a2c6c;
	font-size: 1.2em;
		letter-spacing: 0.03em;
}
em strong {
	font-weight: normal;
	text-shadow: 0 0 1px #1a2c6c;
}

.uppercase {
	text-transform: uppercase;
}

/* basics */


html {
height: 100%;
font-size: 22px;
}
@media (max-width: 1399px) {
 html { font-size: 21px; }
}
@media (max-width: 1299px) {
 html { font-size: 20px; }
}
@media (max-width: 1199px) {
 html { font-size: 19px; }
}
@media (max-width: 999px) {
 html { font-size: 18px; }
}
@media (max-width: 719px) {
 html { font-size: 17px; }
}
@media (max-width: 511px) {
 html { font-size: 16px; }
}

body {
margin: 0;
padding: 0;
min-height: 100%;
font-family: 'Heebo', sans-serif;
font-weight: 300;
font-size: 1em;
background-color: white;
color: #94a2ae;
-webkit-text-size-adjust: none;
text-size-adjust: none;
}


::-moz-selection {
background: #333;
color: #fff;
text-shadow: none;
}
::selection {
background: #333;
color: #fff;
text-shadow: none;
}


.overlay-open, .overlay-open body {
overflow: hidden;
}


#top {
position: absolute;
top: 0;
left: 0;
}

#one-em {
position: absolute;
top: -1em;
left: 0;
width: 1em;
}

#wrapper {
box-sizing: border-box;
}


/* mobile */

.mobile-only,
#mobile-test {
display: none;
}

@media (max-width: 999px) {
	.mobile-only,
	#mobile-test {
	display: block;
	}
	.desktop-only {
	display: none;
	}
}



/* text */

p, ul, ol,
.text-table td {
line-height: 140%;
padding: 0.5em 0 0.5em 0;
margin: 0;
}

ul {
list-style-type: none;
}

ol {
padding-left: 1em;
}

p[style*="center"] {
max-width: 36rem;
margin: 0 auto;
}

.layout-text ul li {
position: relative;
padding-left: 0.8em;
}
.layout-text ul li::before {
content: "\2022"; /* \2013 ndash \00B7 middot \2022 bull */
position: absolute;
left: 0;
top: 0;
}


h1, h2, h3, h4 {
font-weight: 300;
padding: 1.5em 0 0.5em 0;
margin: 0;
letter-spacing: 0.025em;
line-height: 140%;
}


h1 + h2,
h2 + h2,
h2 + h3,
h2 + h4,
h3 + h2,
h3 + h3,
h3 + h4,
h4 + h2,
h4 + h3,
h4 + h4 {
padding-top: 0;
margin-top: 0;
}


h1 {
	font-size: 3.6em;
	padding-bottom: 0.1em;
	letter-spacing: 0;
	text-align: center;
	line-height: 120%;
	display: inline-block;
text-transform: uppercase;
}
h1 strong {
	font-size: 1.32em;
	display: block;
}

h2 {
font-size: 1.25em;
padding: 0 0.8em;
position: relative;
margin: 0 auto;
	margin-bottom: 0.5em;
display: table;
text-transform: uppercase;
}
h2::before {
	content: "";
	position: absolute;
	top: -0.03em;
	left: 0;
	width: 100%;
	border-top: 1px currentColor solid;
}
h2::after {
	content: "";
	position: absolute;
	bottom: 0.1em;
	left: 0;
	width: 100%;
	border-top: 1px currentColor solid;
}

h3 {
font-size: 1em;
padding-bottom: 0;
font-weight: 500;
line-height: 130%;
}

h4 {
font-size: 1em;
padding-bottom: 0.75em;
margin-bottom: 0em;
line-height: 130%;
}

#links h4 {
	padding-bottom: 0em;
	text-transform: uppercase;
}


.text-table {
font-family: inherit;
font-size: 0.8em;
margin: 0.5em 0;
}
.text-table td {
	padding: 0.3em 0 0.2em 0;
	vertical-align: bottom;
}
.text-table tr:not(:last-child) td {
	border-bottom: 1px #1a2c6c solid;
}


.text-table td:first-child {
	padding-right: 0.5em;
}
.text-table td:last-child {
padding-left: 0.5em;
border-left: 1px #1a2c6c solid;
text-align: center;
}
@media (min-width: 512px) {
	.text-table td {
		padding-left: 1em !important;
		padding-right: 1em !important;
	}
}

#analyse .text-table tr:first-child td {
padding-top: 0;
}



.layout-text > :first-child {
padding-top: 0;
margin-top: -0.2em;
}


.button-link {
color: white;
background-color: rgb(226,0,13);
border: 1px rgb(226,0,13) solid;
padding: 0.34em 1em 0.22em 1em;
margin: 0.5em 0;
box-sizing: border-box;
text-align: center;
display: inline-block;
text-decoration: none;
}
.button-link-alt {
color: #333;
background-color: white;
}
.button-link + .button-link {
margin-left: 0.95em;
}

.button-link:hover {
	color: white !important;
}

/* inline images */

img.alignnone {
max-width: 100%;
height: auto;
}
img.alignright {
float: right;
max-width: 50%;
height: auto;
margin: 0.25em 0 1.5em 2em;
}
img.alignleft {
float: left;
max-width: 50%;
height: auto;
margin: 0.25em 2em 1.5em 0;
}
img.aligncenter {
float: none;
clear: both;
max-width: 100%;
height: auto;
display: block;
margin: 2em auto 2em auto;
}

@media (max-width: 719px) {
	img.alignleft,
	img.alignright {
		float: none;
		max-width: 100%;
		display: block;
		margin: 0.25em auto 1.5em auto;
	}
}



/* header */


#logo {
position: absolute;
left: 2em;
top: 0;
display: block;
width: 6em;
height: 5.5em;
background: white url(images/st.anna.svg) 50% 85% no-repeat;
background-size: 90%;
z-index: 10;
}
#logo span {
display: none;
}

@media (min-width: 1600px) {
	#logo {
		left: 50%;
		margin-left: -34em;
	}
}



/* footer */

#footer {
position: relative;
text-align: center;
}
#footer-in {
padding: 1.2em 0 1em 0;
box-sizing: border-box;
}

#footer ul,
#footer li {
margin: 0;
padding: 0;
list-style-type: none;
display: inline;
}

#footer-in a {
text-decoration: none;
display: inline-block;
padding: 0 1em;
text-transform: uppercase;
letter-spacing: 0.025em;
}



/* composer */

.composer {
	position: relative;
}

.composer-col {
padding: 0 2em;
}

.composer-cols {
margin: 0 auto;
max-width: 1200px;
}
.fullsize > .composer-cols {
max-width: 100%;
}

.fullsize > .composer-cols > .composer-col:first-child {
padding-left: 0;
}
.fullsize > .composer-cols > .composer-col:last-child {
padding-right: 0;
}

.composer-cols {
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.composer-col {
box-sizing: border-box;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
}
.composer-col[data-width="1"] {
width: 100%;
}
.composer-col[data-width="1:2"] {
width: 50%;
}
.composer-col[data-width="1:3"] {
width: 33.333%;
}
.composer-col[data-width="2:3"] {
width: 66.666%;
}
.composer-col[data-width="1:4"] {
width: 25%;
}
.composer-col[data-width="3:4"] {
width: 75%;
}

.align-flex-start {
-webkit-align-self: flex-start;
-ms-flex-item-align: start;
align-self: flex-start;
}
.align-flex-center {
-webkit-align-self: center;
-ms-flex-item-align: center;
align-self: center;
}
.align-flex-end {
-webkit-align-self: flex-end;
-ms-flex-item-align: end;
align-self: flex-end;
}


@media (max-width: 999px) {
	.composer-row:not(.custom-wrap-rule) > .composer-cols {
	display: block;
	}
	.composer-row:not(.custom-wrap-rule) > .composer-cols > .composer-col {
	width: 100% !important;
	}

	.mobile-flex-reverse > .composer-cols,
	.mobile-flex-reorder > .composer-cols {
	display: -ms-flexbox !important;
	display: -webkit-flex !important;
	display: flex !important;
	-webkit-flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	}
	.mobile-flex-reverse > .composer-cols {
	-webkit-flex-direction: column-reverse;
	-ms-flex-direction: column-reverse;
	flex-direction: column-reverse;
	}
	.mobile-flex-reverse > .composer-cols > *,
	.mobile-flex-reorder > .composer-cols > * {
	-webkit-flex: 1 0 auto;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	}

	.mobile-flex-reorder .mobile-order-1 {
	-webkit-order: 1;
	-ms-flex-order: 1;
	order: 1;
	}
	.mobile-flex-reorder .mobile-order-2 {
	-webkit-order: 2;
	-ms-flex-order: 2;
	order: 2;
	}
	.mobile-flex-reorder .mobile-order-3 {
	-webkit-order: 3;
	-ms-flex-order: 3;
	order: 3;
	}
	.mobile-flex-reorder .mobile-order-4 {
	-webkit-order: 4;
	-ms-flex-order: 4;
	order: 4;
	}
}

@media (max-width: 719px) {
	.wrap-below-720 > .composer-cols {
	display: block;
	}
	.wrap-below-720 > .composer-cols .composer-col {
	width: 100% !important;
	}
}

@media (max-width: 511px) {
	.wrap-below-512 > .composer-cols {
	display: block;
	}
	.wrap-below-512 > .composer-cols .composer-col {
	width: 100% !important;
	}
}


.layout {
padding: 1em 0;
}
.join-layouts .layout {
padding: 0;
}



/* TILE */

.tile {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.tile-link {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 10;
}



/* IMAGE */

.layout-image img {
width: 100%;
height: auto;
display: block;
}

.image {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
}

.image-alt {
display: none;
}

.image-caption {
font-size: 0.8em;
line-height: 140%;
padding: 0.75em 0;
}



/* SLIDER */

.slider {
position: relative;
width: 100%;
-webkit-touch-callout: none;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.slider-auto-height {
height: auto;
}
.slider-auto-height > .ratio {
display: none;
}

.slider-in {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
overflow: hidden;
}
.slider-in > * {
visibility: hidden;
}
.slider-page {
position: absolute;
left: 0px;
top: 0px;
width: 100%;
height: 100%;
box-sizing: border-box;
overflow: hidden;
-webkit-transform-origin: 0 0;
transform-origin: 0 0;
}
.slider-auto-height .slider-page {
height: auto;
}
.slider-page * {
-webkit-user-drag: none;
user-drag: none;
}

.slider-bullets,
.slider-text {
display: block;
position: absolute;
bottom: 1em;
left: 0%;
width: 100%;
text-align: center;
z-index: 900;
white-space: nowrap;
}

.adaptive-slider {
padding-bottom: 2em;
}
.adaptive-slider .slider-bullets {
bottom: -1.2em;
}

.slider-count-1 .slider-button,
.slider-count-1 .slider-bullets {
display: none;
}

.slider-bullet {
position: relative;
cursor: pointer;
z-index: 1;
width: 14px;
height: 14px;
overflow: hidden;
display: inline-block;
border-radius: 7px;
background-color: transparent;
border: 1px currentColor solid;
box-sizing: border-box;
transition: background-color 0.2s ease;
}
.slider-bullet + .slider-bullet {
margin-left: 28px;
}
.slider-bullet-active {
background-color: currentColor;
cursor: default;
}

.slider-button {
cursor: pointer;
position: absolute;
z-index: 20;
top: 50%;
background-color: currentColor;
width: 1em;
height: 1em;
margin-top: -0.5em;
}
.slider-next {
right: 1em;
}
.slider-previous {
left: 1em;
}


/* IFRAME CODE */

.layout-code iframe {
width: 100%;
box-sizing: border-box;
display: block;
}


/* TEASER */

.teaser {
position: relative;
}


.teaser a {
	text-decoration: none;
}

.teaser .image-caption {
display: none;
}

.teaser-text {
position: relative;
padding: 0.25em;
text-align: center;
box-sizing: border-box;
text-transform: uppercase;
letter-spacing: 0.025em;
}

.teaser-image {
position: relative;
overflow: hidden;
}
.teaser .image {
	transition: transform 0.25s ease, filter 0.25s ease;
}

/* pointer only */
@media (pointer: fine), not all and (-moz-touch-enabled) {
	.teaser-image {
	image-rendering: -webkit-optimize-contrast;
	}

	.teaser:hover .image {
	transform: scale(1.08);
	filter: brightness(1.1);
	}
}




/* TEASERLIST */

.teaser-container:not(.teaser-cols-1) {
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-align-content: flex-start;
-ms-flex-line-pack: start;
align-content: flex-start;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}

.teaser-cols-2 > * {
				  /* spacing / 2 */
width: calc(50% - 0.75em);
}

.teaser-cols-3 > * {
					/* spacing * 2 */
width: calc((100% - 3em) / 3);
}

.teaser-cols-4 > * {
					/* spacing * 3 */
width: calc((100% - 4.5em) / 4);
}

.teaser-container > * {
margin-bottom: 1em;
}

.teaser-container {
margin-bottom: -1em;
}

@media (min-width: 640px) {
	.teaser-container > * {
	margin-bottom: 2em;
	}
	.teaser-container {
	margin-bottom: -2em;
	}
}


.flexbox-fill {
height: 0px;
margin: 0 !important;
padding: 0 !important;
}

@media (max-width: 639px) {
	.teaser-container {
	display: block;
	}
	.teaser-container .teaser {
	width: 100% !important;
	}
}



/* CUSTOM */

.layout-text ul,
.layout-text ol,
.layout-text p {
	font-size: 0.8em;
}

#intro {
	background: white url(images/kv-bg.jpg) 80% 90% no-repeat;
	background-size: cover;
	min-height: calc(100vh - 3em);
	position: relative;
	overflow: hidden;
}

#flasche {
	position: absolute;
	left: 50%;
	top: 0;
	height: 100%;
	width: 50%;
	background: transparent url(images/St-Anna_Flasche.png) 20% 100% no-repeat;
	background-size: contain;
	pointer-events: none;
}

#siegel {
	position: absolute;
	left: calc(50% - 640px);
	top: 60%;
	height: 30vw;
	max-height: 12em;
	width: 30vw;
	max-width: 12em;
	background: transparent url(images/siegel.svg) 0 0 no-repeat;
	background-size: contain;
	pointer-events: none;
	filter: drop-shadow(0 0 3px white) drop-shadow(0 0 10px white);
	font-size: 0.95em;
}

@media (max-width: 1499px) {
	#siegel {
		font-size: 0.92em;
		left: calc(50% - 580px);
	}
}

@media (max-height: 799px), (max-width: 1399px) {
	#siegel {
		font-size: 0.88em;
		top: 65%;
	}
}

@media (max-width: 1299px) {
	#siegel {
		font-size: 0.8em;
		left: 5%;
		top: 68%;
	}
}

@media (min-width: 800px) and (max-width: 1179px) {
	#siegel {
		display: none;
	}
}

@media  (max-width: 511px) {
	#siegel {
		font-size: 0.76em;
		left: 6%;
		top: 61%;
	}
}



#scroll-down-arrow {
	background: transparent url(images/arrow-down.svg) center center no-repeat;
	background-size: contain;
	margin: 0 auto;
	display: block;
	width: 2em;
	height: 1.5em;
	margin-top: -0.125em;
	transition: opacity 0.25s ease;
}
body:not(.scroll-top-0) #scroll-down-arrow {
	opacity: 0;
	pointer-events: none;
}


#intro p,
#intro ul {
	color: rgb(226,0,13);
	font-weight: 500;
	font-size: 1em;
	max-width: 17rem;
	margin-left: 6.9rem;
	text-shadow: 0 0 2px white;
}
#intro ul {
	font-size: 0.9em;
}


#intro ul li + li {
	margin-top: 0.5em;
}

#intro .layout-code {
	padding: 0;
}

#notes {
	background: transparent url(images/kurpark-bg.jpg) top center no-repeat;
	background-size: cover;
	min-height: 28vw;
}

#notes p {
	color: #333;
	text-shadow: 0 0 2px white;
}

@media (min-width: 1300px) {
	#links .composer-col {
		padding: 0 0.5em;
	}
}

#links .layout-text {
	padding-top: 0;
}
#links .layout-image {
	box-sizing: border-box;
	margin: 0 auto;
	max-width: 14em;
}

@media (min-width: 1000px) {
	#links .layout-image {
		min-height: 7.5em;
	}
}

#links .bad-windsheim .layout-image {
	max-width: 16em;
}

#partner-links {
	margin-top: -1em;
}

.bad-windsheim img,
.deutsche-heilbrunnen img {
	margin-top: 0.5em;
}
.franken-therme img {
	margin-top: 0.2em;
}
.deutsche-heilbrunnen img {
	image-rendering: -webkit-optimize-contrast;
}
.franken-therme h4 {
	letter-spacing: 0em;
}


#start ~ .composer:not(#pflichttext):not(#links):not(#kontakt) {
	display: none;
}

#kontakt {
	background: transparent url(images/bg.jpg) center top no-repeat;
	background-size: cover;
}
#kontakt p {
	text-shadow: 0 0 2px white;
}
#last-text-a {
font-size: 0.8em;
line-height: 140%;
padding: 0 2rem;
box-sizing: border-box;
}

@media (min-width: 1000px) {
	.paper-bg .composer-cols {
		background: transparent url(images/paper.jpg) 0 0 no-repeat;
		background-size: 100% 100%;
			box-sizing: border-box;
		padding: 2em;
	}
	
	#analyse .layout-image {
		margin: -4em 0 0em -2em;
		max-width: 20em;
	}
	
	#verwendung .layout-image {
		margin: -3.6em 0 -1em -1em;
		max-width: 22em;
	}
	
	#verwendung .paper-bg {
		padding-top: 1em;
		
	}
	
	#analyse .paper-bg {
		overflow: hidden;
		padding-top: 1em;
	}
	
	#analyse .paper-bg .composer-cols {
		padding-bottom: 4em;
		-webkit-transform: translateX(4px) rotate(-1.5deg);
		transform: translateX(4px) rotate(-1.5deg);
	}
	
	#analyse .paper-bg .composer-cols .composer-col:first-child .layout-text {
		padding-top: 0;
	}
	#analyse .paper-bg .composer-cols h3:not(:first-child) {
		padding-top: 1em;
	}
	
	#last-text-a {
	text-align: center;
	max-width: 90%;
	margin: -4.75em auto 0 auto;
	padding-bottom: 4.75em;
		-webkit-transform: translateX(4px) rotate(-1.5deg);
		transform: translateX(4px) rotate(-1.5deg);
	}
}

.max-20-image img {
	max-width: 12.5em !important;
	margin: 0 auto;
}

.close-section {
	position: absolute;
	left: 50%;
	margin-left: 24em;
	top: 4.75em;
	width: 1.5em;
	height: 1.5em;
	background: transparent url(images/x.svg) center center no-repeat;
	background-size: 75%;
}

.prev-section,
.next-section {
	position: absolute;
	top: 4.75em;
	width: 1.5em;
	height: 1.5em;
	background: transparent url(images/arrow-right.svg) center center no-repeat;
	background-size: 75%;
}

.next-section {
	left: 50%;
	margin-left: 24.1em;
}

.prev-section {
	right: 50%;
	margin-right: 24.1em;
	-webkit-transform: scaleX(-1);
	transform: scaleX(-1);
}

@media (max-width: 1079px) {
	
	.prev-section,
	.next-section,
	.close-section {
		top: 3.45em;
	}

	.next-section,
	.close-section {
		margin-left: 0;
		left: auto;
		right: 1.5em;
	}

	.prev-section {
		margin-right: 0;
		right: auto;
		left: 1.5em;
	}
}

@media (max-width: 1079px) {
	
	.prev-section,
	.next-section,
	.close-section {
		top: 2.75em;
	}
	
}

/* MOBIL */


#intro .composer-col {
	padding-left: 11.5%;
}


@media (max-width: 1079px) {
	h1 {
		font-size: 3em;
		margin-top: 0.65em !important;
	}
	#intro p,
	#intro ul {
	font-size: 0.825em;
	margin-left: 5em;
	}
	#intro .composer-col {
		padding-top: 2em;
	}
}

@media (max-width: 999px) {
	#flasche {
	background-image: url(images/St-Anna_Flasche.png);
	width: 18em;
	}
	
	#intro .composer-col {
	padding-left: 8%;
		padding-top: 3em;
	}
}

@media (max-width: 799px) {
	#flasche {
	left: auto;
	right: 1em;
	width: 18em;
	max-width: 50vw;
	}
	
	h1 {
		font-size: 2em;
		margin-top: 1.75em !important;
		margin-bottom: 0.25em;
	}

	#intro p,
	#intro ul {
	font-size: 0.8em;
	margin-left: 0em;
	}
	
	#intro {
		box-sizing: border-box;
		padding-bottom: 45vw;
		background-position: 70% 90%;
	}
	
	#intro .composer-col {
	padding-left: 10%;
		padding-top: 1em;
	}
	
	#logo {
		top: -0.5em;
	}
}
@media (max-width: 511px) {
	#intro {
	padding-bottom: 70vw;
	}
	
		
	#intro .composer-col {
	padding-left: 2em;
	}
}


@media (min-width: 1000px) and (max-width: 1079px) {
	.space {
		font-size: 0.66em;
	}
}

@media (max-width: 999px) {
	.layout-image img {
		width: auto;
		max-width: 100%;
		margin: 0 auto;
		display: block;
	}
	
	#links-headline {
		margin-top: 2.5em;
	}
	
	.layout-text p,
	.layout-text h3,
	.layout-text h4	{
		text-align: left !important;
		max-width: 36rem;
		margin: 0 auto;
	}
	#links 	.layout-text p,
	#links 	.layout-text h3,
	#links 	.layout-text h4	{
		text-align: center !important;
	}
	
	.text-table {
		margin-left: auto;
		margin-right: auto;
	}
}



.page-id-2 #menu-item-316 {
	display: none;
}







#intro2020 {
	background: #a3dd65 url(images/fond202143a0.jpg?v3) 0% 100% no-repeat;
	background-size: 100% auto;
	height: calc(100vh - 3em);
	min-height: 45vw;
	position: relative;
	overflow: hidden;
}

#titel2020 {
	background: transparent url(images/st-anna-titel-w.png) center center no-repeat;
	background-size: contain;
	position: absolute;
	top: 8%;
	right: 30%;
	width: 46%;
	height: 40%;
	max-height: 25vh;
	max-width: 15em;
	font-size: 2rem !important;
	margin: 0 !important;
	/*	filter: drop-shadow(0px 2px 4px #d81913);*/
}
#titel2020 span {
	display: none;
}



#liste2020 {
	background-color: #d81913;
	background: linear-gradient(to right, rgba(216,25,19,1) 0%,rgba(216,25,19,0.5) 100%);
	border-radius: 50%;
	display: block;
	font-size: 1.5vw;
	right: 25%;
	/* top: 32%; */
	position: absolute;
	bottom: -2.5%;
	right: calc(5% + 16em);
	margin: 0;
	color: white;
	font-weight: 500;
	line-height: 120%;
	letter-spacing: 0.05em;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-direction: column;
	flex-direction: column;
	-webkit-flex-wrap: nowrap;
	flex-wrap: nowrap;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-align-items: center;
	align-items: center;
	width: 16em;
	height: 16em;
	box-sizing: border-box;
	padding: 0 1em;
}
#liste2020 li {
	position: relative;
	display: block;
	box-sizing: border-box;
	padding: 0.3em 1em;
	width: 100%;
}


#liste2020 li:first-child {
	padding: 0.3em 2em 0.3em 3em;
}
#liste2020 li:last-child {
	padding: 0.3em 2em 0.3em 2em;
}

#liste2020 span {
	display: block;
	position: relative;
}
#liste2020 span::before {
	content: "•";
	position: absolute;
	left: -0.5em;
	top: 0.05em;
	font-size: 2em;
}


#flasche2020 {
	background: transparent url(images/St-Anna_Flasche.png) bottom left no-repeat;
	background-size: contain;
	position: absolute;
	top: 5%;
	right: 5%;
	width: 25%;
	height: 102%;
	transform: rotate(6deg);
	image-rendering: optimizeQuality;
}



@media (min-aspect-ratio: 16/9) {
	#flasche2020 {
		background-image: url(images/St-Anna_Flasche.png);
		background-size: 70% auto;
		position: absolute;
		top: -10%;
		right: 0;
		width: 30%;
		height: 120%;
		background-position: 0% 80%;
	}
	#titel2020 {
		top: 0%;
	}
}


@media (max-aspect-ratio: 1/1) {
	#intro2020 {
		background-position: -8vw 100%;
		background-size: 108vw auto;
	}
	#flasche2020 {
		width: 30%;
	}

	#titel2020 {
		width: 64%;
		left: 6%;
		right: auto;
		top: 8%;
		height: 30%;
		max-width: 100%;
	}
	#liste2020 {
		font-size: 3vw;
		right: calc(15% + 3em);
		top: 5%;
		transform: scale(0.9);
	}
}


@media (max-aspect-ratio: 2/3) {
	#intro2020 {
		background-position: -4vw 100%;
		background-size: 115vw auto;
	}
	#titel2020 {
		top: 4.5%;
		width: 84%;
		left: 8%;
		max-width: 100%;
	}
	#liste2020 {
		top: 14%;
		transform: scale(1.2);
	}
}