/* source-sans-3-200 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 200;
  src: url('../../fonts/source/source-sans-3-v19-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-300 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 300;
  src: url('../../fonts/source/source-sans-3-v19-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-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: 'Source Sans 3';
  font-style: normal;
  font-weight: 400;
  src: url('../../fonts/source/source-sans-3-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-500 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 500;
  src: url('../../fonts/source/source-sans-3-v19-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-600 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 600;
  src: url('../../fonts/source/source-sans-3-v19-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-700 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 700;
  src: url('../../fonts/source/source-sans-3-v19-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-800 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 800;
  src: url('../../fonts/source/source-sans-3-v19-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* source-sans-3-900 - 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: 'Source Sans 3';
  font-style: normal;
  font-weight: 900;
  src: url('../../fonts/source/source-sans-3-v19-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


.icon {
  font-family: 'Material Icons';
  font-weight: normal;
  font-style: normal;
  font-size: 100%;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -moz-font-feature-settings: 'liga';
  -moz-osx-font-smoothing: grayscale;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 48;
}



:root {
	--textFont: 'Source Sans 3', sans-serif;
	--titleFont: 'Source Sans 3', sans-serif;
	--primary: #e8b600;
	--color: #efefef;
	--darkColor: #3a3a3d;
}

/*panostyle Start*/
.ggskin {
 font-family: var(--textFont) !important; 
 font-size: 14px!important;
}

.ggskin.ggskin_svg.logo_link { height: 100px!important; width: 20%!important; max-width: 200px!important; left: 5%!important; cursor:pointer!important; }
.copyPano { font-size:9px !important; }
.titelPano { font-size:17px !important; }
.titelPanokursiv { font-size:17px !important; font-style:italic !important; }
.kursivNode { font-style:italic !important; }

@media screen and (max-width:800px) {
.ggskin.ggskin_svg.logo_link { height: 80px!important; }
}

@media screen and (max-width:500px) {
.ggskin_svg[src^="images/logo.svg"] { left: 0%!important; width: 30%!important; }
.ggskin.ggskin_svg.logo_link { left: 0!important; height: 70px!important; width: 30%!important; }
}
/*panostyle End*/

body, html { font-family: var(--textFont); display:flex; background-color: #3b3b3b; justify-content: center; align-items: center; color:var(--color); font-size: 120%; line-height: initial; font-weight: 400; width:100%; scroll-behavior: smooth; }
body.home { position: relative;background-color: #fff; }
b, strong { font-weight: 700; }
.home section { flex-direction: column; align-items: center; justify-content: flex-start; min-height:100vh; padding:2% 2% 60px 2% !important; color:var(--darkColor); }
.home section > div { width:100%; max-width: 1230px; }
.pButton { display: flex; justify-content: center; margin:60px 0 0 0; }
.pButton a { display: flex; justify-content: center; align-items: center; width:fit-content; height:60px; font-size: 120%; font-weight: 900; background-color: var(--primary); color:var(--darkColor); text-decoration: none; padding:0 3%; border-radius: 10px; }
.home .orgmenu { position:absolute; left:0; bottom:0; display: flex; align-items: center; column-gap:6px; }
.home .orgmenu a { text-decoration: none; color:#484847; display: block; padding:5px; font-size: 60%; }
.home .logo { max-width: 300px; display: block; margin:0 auto; }
.home .logo img { width:100%; height:auto; }
.vars { position: fixed; z-index: 10000; right:300px; top:10px; font-size: 60%; text-align: right; display: none; }
img { width:100%; height:auto; }
.iconText { display: flex; align-items: flex-start; column-gap:15px; }
.imgCon img { margin:0 auto; display: block; /*mix-blend-mode: multiply;*/ }
.imgCon.quer img { width:auto; height:100%; max-height:90vh; max-width:100%; }
.imgCon.hoch img { width:auto; height:100%; max-height:90vh; max-width:100%; }
.copy { font-size: 60%; margin:8px 0 0 0; text-align: left;}
.copy { text-align: center;}
.titelC { text-align: center; margin:10px 0 0 0; }
.brLogo { max-height:30px; width:auto; height:auto; }
audio, video { width:100%; display: block; }
video { aspect-ratio:16/9; }
video.hoch { aspect-ratio:9/16; width:auto; height:95vh; display: block; margin:0 auto; }
h1, h2, h3, h4 { text-transform: none; font-weight: 900; }
.iContainer { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; width:100%; min-height:100vh; }
section { width:100%; padding:2% 2% 3% 2%; display: flex; justify-content: center; }
section:first-of-type { padding-top:60px; }
.iContainer.poi1a section, .iContainer.poi1b section, .iContainer.poi2a section, .iContainer.poi2b section, .iContainer.poi2c section, .iContainer.poi3a section, .iContainer.poi3b section, .iContainer.poi3c section, .iContainer.poi3d section, .iContainer.poi4a section, .iContainer.poi4b section, .iContainer.poi5 section, .iContainer.poic-1 section, .iContainer.poic-2 section, .iContainer.poic-3 section, .iContainer.poic-4 section { width:auto; padding-left:4%; padding-right:4%; }
.iconWrapper { display:inline-flex; background: #fff; justify-content: center; align-items: center; border-radius:20px; width:40px; height:40px; flex-shrink:0; }
.iconWrapper img { width:60%; height:auto; }
.iconWrapper img.FB { width:100%; }
section a { color:#fff; }

.msg_head {	font-size: 140%; cursor: pointer; display: flex; column-gap:0px; margin:40px 0 20px 0; justify-content: center; }
.msg_head .less, .msg_head .more, .msg_head strong { color:#F8E800; }
.msg_head .less, .msg_head.opened .more { display: none; }
.msg_head.opened .less, .msg_head .more { display: block; }

div[class^="poi0"] section:nth-of-type(odd), .iContainer.poi1a section, .iContainer.poic-1 section, .iContainer.poic-2 section { background:var(--darkColor); color:#fff; }
div[class^="poi0"] section:nth-of-type(even) { background:#555; color:#fff; }
div[class^="poi0"] .icon { color:#F8E800; }

div[class^="poi1"] section:nth-of-type(odd), .iContainer.poi1a section, .iContainer.poic-1 section, .iContainer.poic-2 section { background:var(--darkColor); color:#fff; }
div[class^="poi1"] section:nth-of-type(even) { background:#555; color:#fff; }
div[class^="poi1"] .icon { color:#F8E800; }

div[class^="poi2"] section:nth-of-type(odd), .iContainer.poi2a section { background:var(--darkColor); color:#fff; }
div[class^="poi2"] section:nth-of-type(even) { background:#555; color:#fff; }
div[class^="poi2"] .icon { color:#F8E800; }

div[class^="poi3"] section:nth-of-type(odd), .iContainer.poi2a section, .iContainer.poic-3 section, .iContainer.poic-4 section { background:var(--darkColor); color:#fff; }
div[class^="poi3"] section:nth-of-type(even) { background:#555; color:#fff; }
div[class^="poi3"] .icon { color:#F8E800; }

div[class^="poi4"] section:nth-of-type(odd), .iContainer.poi2a section { background:#3A3A3D; color:#fff; }
div[class^="poi4"] section:nth-of-type(even) { background:#6a6d71; color:#fff; }
div[class^="poi4"] .icon { color:#F8E800; }

div[class^="poi5"] section:nth-of-type(odd), .iContainer.poi2a section { background:#3A3A3D; color:#fff; }
div[class^="poi5"] section:nth-of-type(even) { background:#6a6d71; color:#fff; }
div[class^="poi5"] .icon { color:#F8E800; }

div[class^="poi6"] section:nth-of-type(odd), .iContainer.poi2a section { background:#3A3A3D; color:#fff; }
div[class^="poi6"] section:nth-of-type(even) { background:#6a6d71; color:#fff; }
div[class^="poi6"] .icon { color:#F8E800; }

div[class^="poi7"] section:nth-of-type(odd), .iContainer.poi2a section { background:#3A3A3D; color:#fff; }
div[class^="poi7"] section:nth-of-type(even) { background:#6a6d71; color:#fff; }
div[class^="poi7"] .icon { color:#F8E800; }

div[class="poi1 iContainer"], div[class="poi2 iContainer"], div[class="poii iContainer"] { align-items: flex-start; background:#fff; }
div[class="poi1 iContainer"] section:nth-of-type(odd), div[class="poi2 iContainer"] section:nth-of-type(odd), div[class="poii iContainer"] section:nth-of-type(odd) { background:#fff; color:inherit; }
div[class="poi1 iContainer"] section:nth-of-type(even), div[class="poi2 iContainer"] section:nth-of-type(even), div[class="poii iContainer"] section:nth-of-type(even) { background:#eee; color:inherit; }
div[class="poi1 iContainer"] .icon, div[class="poi2 iContainer"] .icon { color:inherit; }
div[class="poi1 iContainer"] .copy, div[class="poi2 iContainer"] .copy { text-align: left; }

.iContainer section > div { max-width:1200px; width:100%; position: relative; }
.iContainer section > div h1:first-of-type, .iContainer section > div h2:first-of-type, .iContainer section > div h3:first-of-type { margin-top:0; }
.mImgCon { display: flex; flex-wrap:wrap; column-gap:2%; row-gap:2%; align-items: flex-end; }
.mImgCon > div { width:49%; }

.hoch iframe.medienstation { aspect-ratio:9/16; border:none; }
iframe.medienstation { aspect-ratio:16/9; border:none; }
.msLotzer iframe.medienstation { aspect-ratio:14/12; margin:0 auto; }
section.medCon { justify-content: center; text-align: center; /*background: #fff !important;*/ }
section.medCon > div { display:flex; flex-direction: column; align-items: center; text-align: center; /*background: #fff !important;*/ }
a.pdf, a.extLink { display: flex; margin:30px auto 0 auto; background: #fff; justify-content: center; align-items: center; border-radius: 20px; padding:10px 20px; width:fit-content; text-decoration: none; color:#3b3b3b; }
a.extLink { margin-bottom:30px; }
/*
div[class^="poi1"] a.pdf { color:#84918A; }
div[class^="poi2"] a.pdf { color:#928C98; }
div[class^="poi3"] a.pdf { color:#C98E79; }
div[class^="poi4"] a.pdf { color:#E0CAA3; }
div[class^="poi5"] a.pdf { color:#8DB6D8; }
*/

a.leichteSprache { display: block; position: absolute; top:0%; right:0%; width:50px; height:50px; }
a.leichteSprache img { width:100%; height:100%; }
a.kinderpfad { display: block; position: absolute; top:0%; right:60px; width:50px; height:50px; }
a.kinderpfad img { width:100%; height:100%; }

.karteSpezial { position:relative; }
.poiKarte { position:absolute; /*background-color:#000000aa;*/ cursor: pointer; width:15%; height:8%; border-radius: 40px; }
.poiKarte:nth-of-type(1) { left:55.3%; top:66.5%; }
.poiKarte:nth-of-type(2) { left:52.3%; top:36.5%; }
.poiKarte:nth-of-type(3) { left:43%; top:76%; }
.poiKarte:nth-of-type(4) { left:68%; top:43%; }
.poiKarte:nth-of-type(5) { left:18%; top:86%; }
.poiKarte:nth-of-type(6) { left:17%; top:75%; }
.poiKarte:nth-of-type(7) { left:68%; top:59%; }
.poiKarte:nth-of-type(8) { left:11%; top:54%; }
.poiKarte:nth-of-type(9) { left:1%; top:40%; }
.poiKarte:nth-of-type(10) { left:14%; top:65%; }
.poiKarte:nth-of-type(11) { left:36%; top:33%; }
.poiKarte:nth-of-type(12) { left:37%; top:6%; }
.poiKarte:nth-of-type(13) { left:52%; top:24%; }
.poiKarte:nth-of-type(14) { left:17%; top:7%; }
.poiKarte:nth-of-type(15) { left:32%; top:91%; }
.accordion { background-color: #fff; cursor: pointer; padding: 18px; width: 100%; border: none; text-align: left; outline: none; font-size: 120%; transition: 0.4s; border-top:1px solid #ddd; line-height: 1.45; }
.accordion:nth-of-type(1) { border-top:1px solid #fff; }
.accordion .more, .accordion.active .less { display: block; }
.accordion .less, .accordion.active .more { display: none; }
.active/*, .accordion:hover*/ { background-color: #eee; border-top:1px solid #fff; }
.panel { padding: 0 2% 60px 2%; display: none; background-color: white; overflow: hidden; }
.accordion:nth-of-type(1) { margin-top:40px; }
.karteAnkerLink { color:#000; text-decoration: none; }
.kBilder { display: flex; flex-wrap: nowrap; align-items: flex-end; column-gap:2%; margin-top:20px; }
.kBilder img { width:100%; height:auto; }

.block { margin:2vh 0; }
/*.block .head { font-size: 80%; }*/
.block .head { font-weight: 900; text-transform: uppercase; font-size: 130%; }
.impressum a { color:rgb(72, 72, 71); }
.block strong { font-weight: 600; }

.flipWrapper { display: flex; justify-content: center; }
.flip-card {
  background-color: transparent;
  width: 100%;
	max-width: 800px;
  aspect-ratio:4/3;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}

/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
/*.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}*/
.flip-card.fClicked .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  -webkit-backface-visibility: hidden; /* Safari */
  backface-visibility: hidden;
	display:flex;
	justify-content: center;
	align-items: center;
	padding:6% 6% 12% 6%;
	cursor: pointer;
	background-image: url('../img/flipF.svg?v=1');
	background-size: 10% auto;
	background-repeat: no-repeat;
	background-position: center 97%;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: #40434e;
  color: #f5e4bf;
	font-size: 200%;
	font-weight: 600;
	background-image: url('../img/flipF.svg?v=1');
}

/* Style the back side */
.flip-card-back {
  background-color: #8e9585;
  color: #000000;
  transform: rotateY(180deg);
	background-image: url('../img/flipB.svg?v=1');
}

@media screen and (orientation: portrait) {
	iframe.medienstation { width:100vw; height:auto; max-height:1080px; max-width:1920px; }
}
@media screen and (orientation: landscape) {
	iframe.medienstation { width:auto; height:90vh; max-height:1080px; max-width:1920px; }
}

@media screen and (max-width: 1400px)	{
}
@media screen and (max-width: 1200px)	{
}
@media screen and (max-width: 1000px)	{
	section { padding:3% 2% 4% 2%; }
}
@media screen and (max-width: 800px)	{
	body { font-size: 100%; }
	section { padding:4% 2% 5% 2%; }
}
@media screen and (max-width: 600px)	{
	section { padding:6% 2% 7% 2%; }
	.kBilder { flex-wrap: wrap; align-items: flex-end; row-gap:30px; }
	.kBilder img {  }
	.flip-card-front { font-size: 150%; }
}