:root {
  --lauftext: #6f6259;
  --alfarbe: rgb(61,153,212);
  --aktivfarbe: #ff6d02;
}


html { 
	-webkit-text-size-adjust: none; 
	height: 100%;
	width: 100%;	
}
body {
	font-family: "Inter", sans-serif;
	font-size: clamp(1vw, 1vw, 1vw);
	margin:0px;
	padding:0px;
	width: 100%;
	overflow-x: hidden;
	background-image: url(../userfiles/images/meta/raster.svg);
	background-size:5%;
	color:#000;
}


.hg {
	position:relative;
	text-align: left;
	margin-right: auto;
	margin-left: auto;	
    z-index:1;
    /*
    width: 94%;
    max-width:1080px;
    */
    width: 1024px;
   /* width: 1080px;
    width: 1120px;*/
    background-color: gold;
    background-color: rgba(255,0,0,0.2); 
	margin-top:8vw; 
	margin-top:100px; 
    /*
    overflow:hidden;
    */
    /*
    background-color: #FFF;
    background-color: rgba(255,255,255,0.2);
    */
}
.temp1 .hg {
	     margin-top:20vw; /**/
}
.header { z-index:1000;/*height:calc(100vw / 9);*/ /*margin-top:calc(100vw * -0.02);*/ text-align:left;}
.header2 { z-index:1;/*height:calc(100vw / 9);*/ /*margin-top:calc(100vw * -0.02);*/ text-align:left; }

.fixed {
	position:fixed;
	
	
	top:0px;
	left:0px;
	width: 100%;

	
	height:6vw;
	height:60px;
	/*
		background-color: rgba(255,255,255,0.2);
		*/
	border:solid 1px blue;
	
	
}
.temp1 .header {
	z-index:100;
	border:solid 1px red;
}
.temp1 .header .logobox{
	display:none;/**/
}
.temp1 .header2 {
	/*display:none;*/
}
.hedertext1 {
	fill: var(--alfarbe);
	font-size:31px;
	font-weight:600;		
}
.hedertext1m {
	fill: var(--alfarbe);
	font-size:76px;
	font-weight:600;		
}
.hedertext2 {
	fill: var(--alfarbe,#3D99D4);
	font-size:76px;
	font-weight:600;
	display:none;	/**/
}
.temp1 .hedertext2 { display:block;}



.claim { 
	/*border:solid 1px pink;*/
	position:relative;
	bottom:16px;
	left:45%;
}


.demo-slidebar {
    background-color:var(--alfarbe);
    text-align: left;
    margin-top: 0px;
    width: 455px;
    width:calc(100vw / 9*3);
    height: calc(100vh - 0px);
    min-height: 400px;
}
.scrollbox {
    height: calc(100vh - 20px);
    overflow: auto;
    display: block;
    margin-top: 30px;
    padding-top: 0px;
    /*border:solid 1px red;*/
}
.closebox {
	cursor:pointer;
	position:absolute;
	z-index:2000;
	top:0px;
	right:0px;
	width:calc(100vw / 9);
	/*height:calc(100vw / 9);
	background-color:#FFF;
	*/
}

.menubox {
	cursor:pointer;
	position:absolute;
	z-index:3400;
	/*top:0px;*/
	bottom:5%;
	/*right:calc(100vw / 9 *-1);*/
	right:3.0%;
	/*min-width:calc(3vw);*/
	width:auto;
	height:auto;
	height:44px;
	background-color:#FFF;
	border:solid 2.5px #000;
	border-radius: 1vw;
	border-radius: 10px;
	/*overflow:hidden;*/
	background-color:#CCF;	

}
.karte{}
.logobox {
	position:absolute;
	z-index:0;
	left:calc(100vw / 9 *-1);
	left:3vw;
	width:calc(100vw / 7);
	width:350px;

	background-color:#FcF;
}
.temp1 .logobox {
	position:absolute;

	top:2vw;
	left:2vw;
	width:calc(50vw);

}
.logobox a { 	text-decoration: none; }
.logobox h1{
		color: #000;
		font-size: 2vw;
		font-size: clamp(16px, 2vw, 2vw);
		font-weight:800;
		text-transform: uppercase;
}
.temp1 .logobox h1{
		color: #eac919;
		font-size: 8vw;
		font-size: clamp(16px, 8vw, 8vw);
		font-weight:800;
		text-transform: uppercase;
		/*display:none;*/
}
.stitel h1{
		color: #eac919;
		font-size: 8.5vw;
		font-size: clamp(14px, 8.5vw, 8.5vw);
		font-weight:800;
		text-transform: uppercase;
}
strong { font-weight:800;}


.logo {
	/*
	position:relative;
	display:block;
	width: 90%;	margin:0px;
	padding:0%;
	*/

	/*background-color:pink;*/
}

.logo img {
	width:95%;
	height:auto;
}
.logocolor {
  fill: #000;
  stroke-width: 0px;
}
.temp1 .logocolor {
  fill: #eac919;
  stroke-width: 0px;
}

.stitel {
	position:absolute;
	top:6vw;
	/*left:60vw;
	border:solid 1px red;
	*/
	right:0px;
	width:calc(40vw);
	width:auto;
	margin:0px 3%;


}



.stext {
	position:absolute;
	top:16vw;
	right:4vw;
	width:40%;
}

.menubox img{
	/*
	width:95%;
	height:auto;
	*/
	
}
.topnav2 {
	font-size: clamp(1.4vw, 1.4vw, 1.4vw);
	font-size: clamp(1.4em, 1.4en, 1.4em);
		font-size: 18px;
	float:left;
	display:none;
}
.menu {
    background-image: url(../userfiles/images/meta/icon_menu.svg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 40px auto;
    height: 40px;
    width: 40px;
    margin:0px;
    cursor: pointer;
    /*display: none;*/
    float:left;
    
}
.iconprev {
    background-image: url(../userfiles/images/meta/icon_prev2.svg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 40px auto;
    height: 40px;
    width: 40px;

    margin:0px;
    cursor: pointer;
}
.aktiv { background-position: 0px -40px; }


.main {

}
.themen {
	min-height: calc(100vw /9*1.9);
	/*margin-left: calc(2% /7*-1);*/
	/*margin-left: -0.5%; */
}



.kachelbox2:hover .kachelblack {opacity:0.5;}
.kachelbox2 {
	float:left;
	width: calc(100% /7*1);
	width: 14.285%;
	/**/height:calc(100vw/9);

height:calc(11.1vw);
	margin:0px;
	margin-bottom:0px;
	padding:0px;	
	/*background-color:pink;*/
}
.kachelbox2 a{
	/*display:block;*/
	padding:0px;
	margin:0px;
	
}
.kachelbox2 svg{
	width: 100%;
	margin:0px;
	padding:0px;
	/*display:none;*/	
}

      .cls-1 {
        fill: #fff;
        stroke: #1d1d1b;
        stroke-miterlimit: 10;
        stroke-width: 3px;
        /*stroke-width: 0.7vw;*/
      }

      .cls-2 {
        fill: #1d1d1b;
        stroke-width: 0px;
      }
      
.svgwhite {fill:#FFF;}
.svgblue {fill:var(--alfarbe);}
.svgblack {fill:#000;}
.kachelwhite {fill:red;fill:white;}
.kachelgrau {fill:red;fill:#ccc; fill:#FFF;fill:transparent;}
.kachelgrau2 {fill:#ccc; fill:transparent; /**/}
.kachelblack {opacity:0;}
.temp2 .dreieck, .temp3 .dreieck {display:none;}
.dreieck {display:none;}
.dreieck2 {display:none;}



.h1 {width: 98%; }
.h2 {width: 48%; }

.links { background-color: red; width: 50%;float:left;}
.rechts { background-color: blue; width: 40%; margin: calc(16vw - 100px ) 0px 0px 10%; float:left;}

.storybox {
	position:absolute;
	position:relative;
	top:0px;
	left:0px;
	z-index:100;
	width:99%;
	width:100%;
	/*height:100%;*/	
	background-color: rgba(0,0,255,0.2);
	/*display:none;*/
	font-size: clamp(12px, 1.5vw, 1.5vw);
	

}

.storybox img{
	width:100%;
	/*width:99.5305164%;*/
	height:auto;
		border:solid 2.5px #000;
		border-radius: 3vw;
		border-radius: 20px;
}
.legende {
	position:absolute;
	top:calc(100vw /9*3.6); 
	left:0px;
	z-index:100;
	width:calc(100% /7*2); 
	height:calc(100vw /9); 
	background-color: rgba(255,0,255,0.2);
}
 
.play {
	background-image: url(../userfiles/images/meta/videoplay2.svg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 100% auto;

	position:absolute;
	top:calc(50%);
	left:50%;
	width:18%;	
	height:38%;
	margin-left:-9%;
	margin-top:-9%;
	/*
	margin-left:-50%
	border:solid 1px red;
	*/
}
.playi {
	background-image: url(../userfiles/images/meta/animationstarten2.svg);
	background-image: url(../userfiles/images/meta/animationstarten3.svg);
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 50% auto;

	position:absolute;
	top:calc(70%);
	left:20%;
	width:26%;	
	height:38%;
	margin-left:-13%;
	margin-top:-13%;
	/*
	margin-left:-50%
	border:solid 1px red;
	*/
}
.storyleft {
	margin:0px 0px 0px 0px; 
	width: calc(100% /7*3); 
	width: calc(100vw /9*2); 
	background-color: rgba(255,255,0,0.2); 
	float:left;
	
}
.lauftext {
	font-size: 1.5vw;
	font-size: clamp(14px, 1.5vw, 16.23px);	
	line-height:1.3em;	
	background-color: rgba(255,255,0,0.2); 
}
.lauftext h1 {
	font-size: 3vw;
	font-size: clamp(16px, 3vw, 33px);
	line-height:1.3em;	
	font-weight:800;
}

.lauftext h2{
	font-size: 3vw;
	font-size: clamp(16px, 3vw, 33px);
	line-height:1.1em;
	font-weight:800;	
}
.storytext {
	padding:0% 0% 6% 15%;
}
.storytext a { color:#FFF; }
.storytext h1 { margin-bottom:40px;}
.storybild {
	margin-left:25%;
	width:75%;	
	height:auto;
	float:left;
	background-color: rgba(255,0,0,0.2); 
}
.storybild img,
.thumbbox img {
	width:100%;	
}
.storycontrol {
	position:relative;
	position:absolute;
	top:0px;
	border:solid 1px gold;
	width:100%;
}
.thumbbox {
	margin:0% 0% 5vw 0%;
	width:100%;	
	cursor:pointer;
}
.bildbox {
	/*margin-left:-8%;*/
	width:110%;	
		width:100%;	
	background-color: rgba(255,0,0,0.2);/**/
	
}
.bildbox h2 { 
	margin:2em 0px 0px 13%; 
	margin:2em 0px 0.5em 0%; 
	font-size: 1.15vw; 
	font-size: clamp(16px, 1.15vw, 33px);  font-weight:800; /*background-color:#CFF;*/}
		

.kat1 {
	width:90.91%;	
	width:100%;
	margin-right:0%;
	float:left;
}
.kat2 {
	width:41.56%;	
	width:46%;
	/*
	margin-right:4%;
	margin-left:4%;
	*/
	float:left;

}
.bildbox .kat2{
	/*border-bottom: solid 10px red;*/
	
}
.bildbox .kat2:nth-child(even) {
  /*border-bottom: solid 10px blue;*/
  margin-left:8%;
  
  
}


.kat4 {
	width:49%;
	/*	
	margin-right:2%;
	
	*/
	margin-bottom:2%;
	float:left;
}
.bildbox .kat4{
	/*border-bottom: solid 10px red;*/
	
}
.bildbox .kat4:nth-child(even) {
  /*border-bottom: solid 10px blue;*/
  margin-left:2%;
  
}
/*
.bildbox .kat4:nth-of-type(2) {
	border-bottom: solid 10px green;
	
}

.kat4:nth-child(2n) div {
  border-bottom: solid 10px blue;
}
*/





.liste{
	cursor:pointer;
}
.liste h2{ 
    background-image: url(../userfiles/images/meta/icon_plus2.svg);
    background-repeat: no-repeat;
    background-position: 0px -20px;
    background-size: 20px auto;
    background-position: 0px 100%;
    background-size: auto 200%;
	line-height:1.4em;
    padding-top:2px;
    padding-left:25px;
    margin-left:-25px;
    padding-left:1.6em;
    margin-left:-1.6em;
    min-height:20px;
	color:var(--alfarbe);
}
.liste h2.collapsed { 
	background-position: 0px 0px;
	color:pink;
	color:var(--alfarbe);/**/
}
.liste:hover h2 {
	color:var(--alfarbe);
	color:#000;
}
.steuerung {
	position:relative;
	z-index:0px;

}

.next, .prev {
    background-repeat: no-repeat;
    background-position: 0px 0px;
    background-size: 40px auto;
    height: 40px;
    width: 44px;

    margin:0px;

    /*border: solid 2px #ccF;*/
    cursor: pointer;

 	height:44px;
	background-color:#FFF;
	border:solid 2.5px #000;
	border-radius: 10px;
	display:block;   
}


.prev {
	background-image: url(../userfiles/images/meta/icon_prev2.svg);
	position:absolute;	
	left:3%;
}
.next {
	background-image: url(../userfiles/images/meta/icon_next2.svg);
	position:absolute;	
	right:3%;
}
.stor {
	z-index:1;
	z-index:99;
	/*position:fixed;*/
	top: calc(100vw /9); 
	
	top: 0px;  
	top: calc(62vw); 
	top: 720px;
		top: 636px;
	/*border:solid 2px red;*/
	background-color: #CCF;
	
}


.footer .weiss2 {
	width: 96%;
	margin:0px 2%;
	background-color: pink;
}


.footer {
	background-color:pink;
	font-size: 1.6vw;
	font-size: clamp(18px, 1.6vw, 1.6vw);
	line-height:1.2em;
	font-weight:600;
	padding:0px 3%;
	margin-top:10%;
	margin-top:5vw;
}
.footer2 {
	position:relative;
	z-index:10;
	text-align:right;
	padding-top:10px;
	margin-bottom:10px;
	color:#999;
	min-height:40px;
}
footer2 a{
	
}
.footer1 {
	position:relative;
	z-index:10;
	color: #eac919;

}
.footer1 a {
	color: #eac919;
}
.footer1 a:hover {
	color:var(--lauftext);
}


.adressbox .adr {
	/*display:block;*/
	display:inline-block;
	display:block;
	margin:0.5% 0px 0px 0px;
	padding:0px;
	/*float:left;*/
}
.adressbox .left {
	/*background-color: yellow;*/
	width:38%; 	width:98%;
}
.adressbox .center {
	text-align:center;
	/*background-color: gold;*/
	width:32%;
}
.adressbox .right {
	text-align:right;
	/*background-color: pink;*/
	width:30%;
}
.footer1 div {
	margin-top:1%;
	margin-bottom:1%;
}
.footer1 t {
	display:inline;
	padding:0px 1px;
}

.adressbox { margin:0px; width: calc(100% /7*5); float:left;/**/ 	/**/}
.iconbox { margin:0px; width: calc(100% /7*2); background-color: pink; text-align:right; float:left;/**/}
.iconbox img { width:12%; height:auto; float:right; margin-left:10%; min-height:40px;}

.trenn {
	/*background-color: pink;*/
	margin: 0px 0.5em 0px 0.8em;
}

.adressbox .trenn:last-child(-1) {
  /*background: red;*/
}


bo {
	/*background-color: gold;*/
	white-space: nowrap;
}
.adressbox .left {
	/*border:solid 1px red;*/
	
}
.trenner {
	background-color: #A8CBDF;
	margin: 0px 2% 40px 2%;
	clear:left;
	height:1px;
	
}
.trenner2 {
	background-color: #C95B40;
	margin: 10px 2% 30px 0%;
	margin: 0.5em 2% 2em 0%;
	clear:left;
	height:1px;
	
}
.t1.trenner2 {
	background-color: #C95B40;
	margin: 0.5em 4% 2em 0%;
	clear:left;
	height:1px;
	
}


.anker, .anker1, .anker2 {
	height:10px;
	width: 10px;
	z-index:8000;
	font-size:10px;	
	left:-5250px;
	position: relative;
	position: absolute;
	background-color: #FFC;
}
.anker {background-color: #ccF;}
.anker1 { top:-130px; background-color: #ccF;}
.anker2 { top:540px; background-color: gold;}



.controll {
	position: fixed;
	top:50px;
	left:-5310px;
	height:auto;
	width: 500px;
	z-index:7400;
	/*border:solid 2px red;*/
	
}
.controll input {
	width: 90%;
}
.clr {
	clear:both;
	height:0px;
	font-size: 0px;
	line-height:0px;
	min-height:1px;
}
h2 { 	clear:both; }


.fenster {
	position:absolute;
	top:-3px;
	left:-3px;
	z-index:10;
	width: 330px;
	height: 330px;
	border-radius: 40px;	
	width: 25vw;
	height: 25vw;

	border-radius: 3vw;
	border:solid 3px #000;
}
.kbild {z-index:20;}

.c1 {
		background: #c89ec9; 

}
.c2 {
		background: #8dc68e; 

}
.c3 {
		background: #eac917; 

}
.c4 {
		background: #7797ce; 

}
.c5 {
		background: #de8e83; 

}
.text {
	position:absolute;
	top:26vw;
	left:5%;
	z-index:20;
	width: 90%;
	height: auto;
	background: #FFF; 

	font-size: 1.4vw;
	font-size: clamp(1.4vw, 1.4vw, 1.4vw);
	line-height:1em;/**/
	line-height:clamp(1.4vw, 1.4vw, 1.4em);
}
.text a {color:#000;}
.div3box .text {
	background: transparent; 
	font-size: 1.4vw;
	font-size: clamp(1.8vw, 1.8vw, 1.8vw);
	line-height:1.2em;
	line-height:clamp(1.8vw, 1.8vw, 1.8vw);
	top:3vw;
	font-weight:600;
}
.text p, .text .marker1, .text .marker2, .text marker2 {
	font-weight:600;	
	margin:0px;
}
.text .marker1 {
	font-size:1.8em;
	line-height:1.4em;
}
.text .marker2  {
	font-size:1.8em;
	line-height:1.4em;
}
.text .marker3  {
	font-size:1.4em;
	line-height:1.2em;
}
.touch {
	position:relative;
	z-index:2000;
	background: #ccc;/**/
	width: 100%;
	height: 100%;
}
.touch2 { display:none; }
.div1box {
	position:relative;
	z-index:100;
	
	background: transparent;
	background: #FcF;/**/
	width: 60vw;
	height: 200vw;
	margin:0px auto 0px auto;
}
.div2box {
	position:relative;
	z-index:0;
	background: #FcF;


	width: 60vw;
	height: 200vw;
	margin:0px auto;
}
.div3box {
	position:relative;
	z-index:0;
		
	background: transparent;
	background: #FcF;
	width: 100%;
	height: calc(50vw) ;
	margin:0px auto;
}
.div1box a, .div2box a  {
	color:#000;

}
.karte {
	position:absolute;
	width: 25vw;
	height: calc(25vw * 1.5);
	background: #fff;
	transition: left 2s, transform 2s;
	border-radius: 3vw;
	border:solid 3px #000;
}

.div3box .karte {

	transition: left 1s, transform 1s;

}
.div3box .fenster {

}

.div3box .text {

}


.farbe {
	z-index:40;
	opacity:1;
	transition: opacity 1s;
}

.div1box:hover .farbe  {

		opacity:0;

}
.starttext {
	transition: display 2s;	
}


.div1box:hover .starttext {
		display:none;
}
.div2box .farbe {
	z-index:0;
}
.div3box .farbe {
	z-index:0;
}

.div2box .starttext {
	display:none;
}

.div2box a {
	/*
	display:block;
	float:left;
	*/
}
.div3box .karte {
	/*
	width: 20vw;
	
	margin:0px 1vw 1vw 0px;
	position:relative;
	float:left;
	*/
}

.td1 {
	float:left;
	width: 99%;

}
.td2 {
	float:left;
	width: 48%;
	margin-right:1%;
}
.td3 {
	float:left;
	width: 33.333%;
}
.td4 {
	float:left;
	width: 23%;
	margin-right:1%;
}
.td6 {
	float:left;
	width: 64.666%;
	margin-left:2%;
}
.td8 {
	float:left;
	width: 73%;
	margin-right:1%;
}
.td1, .td2, .td3, .td4, .td6, .td8 {
	position:relative;
	z-index:0;
	margin-bottom:1%;

	/*border:dotted 1px grey;*/
}

	.desk {display:block;}
	.smart {display:none;}


.shadow { 
	border:solid 1px rgba(0,0,0,0.25);
	-webkit-box-shadow: 5px 5px 20px 4px rgba(0,0,0,0.20);
	-moz-box-shadow: 5px 5px 20px 4px rgba(0,0,0,0.20);
	box-shadow: 5px 5px 20px 4px rgba(0,0,0,0.20);
}

body { background-color: orange; font-size: 18px; line-height: 22px;/**/}




@media only screen and (max-width: 1919px) {
	body { background-color: gold; }

}
@media only screen and (max-width: 1599px) {
	body { background-color: orange; /*font-size: 18px; line-height: 24px;*/}

}




@media only screen and (max-width: 1279px) { /* Desktop */

	body {  background-color: grey; /*font-size: clamp(1.3vw, 1.4vw, 2vw); */}



}
@media only screen and (max-width: 1040px) {
	
}
@media only screen and (max-width: 1080px) { /* Desktop */

	.hg {

	    width: 94%;
	    /*max-width:1080px;*/
	    background-color: pink;
	    /*background-color: rgba(255,255,0,0.2); */

	    /*
	    margin-top:8vw; 
		margin-top:100px; 
	    overflow:hidden;
	    */

	}
	.lauftext {
		/*font-size: clamp(12px, 1.5vw, 16px);*/
		/*line-height:1.1em;	*/
	}
	.menubox { background-color:#CCC; right:3%;}
	.stor { top: 720px;  	top: calc(64vw);  top: calc(59vw); background-color:#CCC;/*border:solid 2px red;*/ }	
	
}
@media only screen and (min-width: 1080px) { /* Desktop */
	.div3box { height: 580px ; }
	.div3box .karte {
		border-radius: 32.4px;	
		width: 270px;
		height: calc(270px * 1.5);
	}
	.div3box .fenster {
		width: 270px;
		height: 270px;	
		border-radius: 32.4px;		
	}
	.div3box .text {	
		font-size:19.46px;		
	}
	.rechts { background-color: lightblue; margin:calc(16vw - 100px ) 0px 0px 10%; }
	
	
	
}





@media only screen and (max-width: 1024px) { /* Tablet quer*/
	body { background-color: blue; font-size: clamp(16px, 1.9vw, 2vw); line-height: 18px;	}	
	

	
}

@media only screen and (max-width: 768px) { /* Tablet hoch*/
	
	body { background-color: red; font-size: 16px; line-height: 20px; 	overflow:auto;	}
	.div3box { width: 50%; margin:0px auto; background-color: red;}
	.links { /*border:solid 1px red;*/ width: 96%; float:left; /*min-height:600px;*/}
	.rechts { /*border:solid 1px blue;*/ width: 96%; margin:0px auto; }

	.div1box {}



}


@media only screen and (max-width: 512px) {
	
	body { background-color: gold; 	background-size:10%; background-size:20%;}

	.hg  { width:96%; width:94%; width:100%; padding: 0px 3%;/**/ /*margin-left:2%;*/ margin-top:60px; margin-top:120px; background-color: gold; overflow:hidden;}
	
	.fixed  { width:100%; /*background-color: gold;*/}
	
	.steuerung {
		position:relative;	
		position:fixed;
		z-index:100;
		height:55px;
		background-color: gold;
		width:100%;
		top:0px;
		/*
		border:solid 1px red;
		display:none;*/
	}
	.stor {
		border-radius: 12px;
		border: solid 2px #000;
		margin-top:0px;
		top: 64px;  

		
	}
	.prev {left:2%;left:3%;}
	.next {right:1%;right:2%;right:3%;}
		
	.menubox { border:solid 2px #000; border-radius: 12px;	right:2%; right:3%; height:auto;}
	
	.div1box { width: 80%; height:94vw; height:108vw; margin:80vw auto 0px 2%; background-color: pink;}
	.div1box:hover { height:680vw; z-index:10000;}
	
	.div2box { width: 80%; height:680vw;/**/ margin:40vw auto 0px auto; left:-3%; background-color: gold;}
	
	.div3box { width: 80%; height:100vw; margin:40vw auto 0px 0px; left:-3%; background-color: gold;}
	
	.text { 
		top:46vw; 	
		font-size: clamp(1.8vw, 2.2vw, 2.2vw);
		font-size: 5vw;
		font-size: clamp(12px, 5vw, 5vw);
		line-height:1em;
		/*color:pink;*/
	}
.text .marker1 {
	font-size:1.2em;
	line-height:1.2em;
}
.text .marker2  {
	font-size:1.0em;
	line-height:1.2em;
	padding-bottom:0.3em;
	display:inline-block;
}
.text .marker3  {
	font-size:0.9em;
	line-height:1.0em;
}
	
	.div3box .text {
		font-size: 3.6vw;
		font-size: clamp(12px, 3.6vw, 3.6vw);
		line-height:1.4em;
		top:6vw;
	}
	.div2box .text {
		/*
		font-size: clamp(16px, 2.8vw, 2.8vw);
		line-height:1.4em;
		top:1vw;
		*/
	}	
	.fenster {
		width: 45vw;
		height: 45vw;
		border-radius: 3vw;
	}

	.karte {
		width: 45vw;
		height: calc(45vw * 1.5);
		border-radius: 3vw;
		border:solid 3px #000;
	}
	
	.fenster {
		width: 55vw;
		height: 55vw;
		border-radius: 6vw;
	}

	.karte {
		width: 55vw;
		height: calc(55vw * 1.5);
		border-radius: 6vw;
		border:solid 3px #000;
	}
	.text { 
		top:56vw; 
	}
	.fenster {
		top:-2px;
		left:-2px;
		width: 50vw;
		height: 50vw;
		border-radius: 6vw;
		border:solid 2px #000;
	}

	.karte {
		width: 50vw;
		height: calc(50vw * 1.5);
		border-radius: 6vw;
		border:solid 2px #000;
	}
	.text {  top:51vw;  }
	.storybox img{ border:solid 2px #000; /*border-radius: 6vw;*/ }	
	.storytext { padding: 0% 0% 6% 0%; }
	.td1, .td2, .td3, .td4, .td6, .td8 { width: 98%; margin-bottom:4%; margin-left:0px; /*border:solid 1px red;*/}
	.storytext p {margin:0px;}
	.storytext h1 { margin:20px 0px 20px 0px;}
	.logobox h1 { font-size: clamp(16px, 2vw, 2vw);}

	.lauftext h1 { font-size: clamp(16px, 3vw, 33px); font-size: 30px;}
	.lauftext h2 { font-size: clamp(16px, 3vw, 3vw); font-size: 30px;}
	.temp7 .lauftext h1 { font-size: clamp(16px, 3vw, 3vw); font-size: 20px;}
	
	.stitel { position:relative; top:9vw; text-align:center;}
	
	.temp1 .logobox h1 { font-size: clamp(14px, 26vw, 30vw);line-height:1.0em;}
	
	.stitel h1{ font-size: clamp(14px, 26vw, 30vw);line-height:1.0em;}
	
	.desk {display:none;}
	.smart {display:block;}	
	
	.topnav2 { position: absolute; z-index:2000; top:0px; left:0px; min-width:280px; 
		transform: translateX(-105px) translateY(210px)  rotate(-90deg) ; /* background-color:pink; display:block;*/
		text-align:right;
	} 
	.topnav2 ul li { border:solid 2px #000; padding:10px 0px 40px 0px; border-radius: 10px 10px 0px 0px; background-color:#FFF;}
	.bildbox { width:100%;}	
	.bildbox h2 { margin:2em 0px 0.5em 0%; font-size: 3vw; font-size: clamp(16px, 3vw, 33px);  font-weight:800; /*background-color:#CFF;*/}	
	.kat1 {
		width:98%;	
		width:100%;
		margin-left:0%;
		margin-right:0%;
		margin-bottom:10%;
		float:left;
	}
	.kat2 {
		width:98%;
		width:100%;
		margin-bottom:10%;
		float:left;
	}
	.bildbox .kat2:nth-child(even) {
	  margin-left:0%;
	}
	.kat4 {
		width:98%;
		width:100%;

		margin-bottom:10%;
	
	}
	.bildbox .kat4:nth-child(even) {
	  margin-left:0%;
	}
	.shadow { 
		border:solid 1px rgba(0,0,0,0.25);
		-webkit-box-shadow: 5px 5px 20px 4px rgba(0,0,0,0.20);
		-moz-box-shadow: 5px 5px 20px 4px rgba(0,0,0,0.20);
		box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.20);
	}

}