@charset "UTF-8";
/* CSS Document */
body {
margin:0;
padding:0;
box-sizing: border-box;
font-size: 13px; 
font-family: "DBSansRegular", Georgia;
}
	
html, body{
  height:100%
}


html {
overflow:hidden;
}

	
* {
  box-sizing: border-box;
}


#aspectratio {
  position: absolute;
  max-width: 1200px;
  padding-right: 1%;
  align-self: center;
  top: 6vw;
  width: 90%;
  aspect-ratio: 12 / 5;
  box-shadow: 0 0 1rem 0 #d7dce1;;
  border-radius: 0.4vw;
overflow: hidden;
}
 



#wrapper {position:relative; width: 100%; height: 100%;}
.clickable {height: 100%; width: 100%; left: 0; top: 0; position: absolute; z-index: 1;}
#container_map_hg { position:absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #FFF}
.map {position: absolute; top:0px; left:0px; width: 100%; height: 100%;}
.map_h {position: absolute; top:0px; left:0px; width: 100%; height: 100%; display: none}
.map_sf {position: absolute; top:0px; left:0px; width: 100%; height: 100%; pointer-events: none}
.layer {position: absolute; top:0px; left:0px; width: 100%; height: 100%; pointer-events: none;}
.hl {position: absolute; top:0px; left:0px; width: 100%; height: 100%; pointer-events: none;}
#container_sf { position:absolute; left: 0%; top: 45%; width: 100%; height: 100%;}
.sf {position:absolute; cursor:pointer; pointer-events: auto; background: url(../img/t01.png);}
.sf3,.sf3n { position:absolute; cursor:pointer; background: url(../img/t01.png)}
.sfm { position:absolute; cursor:pointer; left: 0%; top: 0%; width: 100%; height: 100%;}
.sfmo { position:absolute; left: 0%; top: 0%; width: 100%; height: 100%; display: none}
.sfmn_v { position:absolute; cursor:pointer; top: 0; left:0; width: 50%; height: 100%; background: url(../img/t01.png);}
.sfmn_n { position:absolute; cursor:pointer; top: 0; right:0; width: 50%; height: 100%; background: url(../img/t01.png);}
.sfa1 { position:absolute; width: 100%; height: 100%;}
.sfa2 { position:absolute; width: 100%; height: 100%; display:none;}
.menue { position:absolute;}
#schliesser { position:absolute; top:3.5%; right:3%; width: 2.27%; height: 2.88%; cursor:pointer;}
.popup {position: absolute; z-index: 100; display: none; overflow: hidden}
.marker { position: absolute; display: none}
.touch { position: absolute; border-radius:10px; background-color: #9BA2A7; display: none}
.hw { position: absolute; display: none}
.hg {display:none; cursor:pointer;}
.sfa {position:absolute; left: 0%; bottom: 0%; width: 100%; height: 20%; cursor:pointer; background: url(../img/t01.png);}
.sfa_2 {position:absolute; cursor:pointer; background: url(../img/t01.png);}
.sfx {position:absolute;left: 0%; top: 0%; width: 100%; height: 30%; cursor:pointer; background: url(../img/t01.png);}
.container_popup {position: absolute; width: 100%; height: 100%; overflow: hidden}

#Tip1 {
	position: absolute;
    margin: 15px;
	
	display: none;
	width: 350px;
	height: 260px;
	overflow-y: scroll;
	overflow-x: hidden;
	background: #fff;
    border-radius: 4px;
    box-shadow: 0.3em 0.3em 0.5em 0 rgba(0, 0, 0, 0.4), 0.3em 0.3em 1em 0 rgba(0, 0, 0, 0.25);
}		
	


#Tip2 {
	position: absolute;
    margin: 15px;
	
	display: none;
	width: 350px;
	height: 244px;
	overflow-y: scroll;
	overflow-x: hidden;
	background: #fff;
    border-radius: 4px;
    box-shadow: 0.3em 0.3em 0.5em 0 rgba(0, 0, 0, 0.4), 0.3em 0.3em 1em 0 rgba(0, 0, 0, 0.25);
}		

#Tip3 {
	position: absolute;
    margin: 15px;
	padding: 15px;
	display: none;
	width: 350px;
	height: auto;
	background: #fff;
    
    border-radius: 4px;
    box-shadow: 0.3em 0.3em 0.5em 0 rgba(0, 0, 0, 0.4), 0.3em 0.3em 1em 0 rgba(0, 0, 0, 0.25);
}

@media screen and (max-width: 900px) {
#Tip1 {
width: 245px;
height: 182px;
border-radius: 3px;
		}
	
#Tip2 {
width: 245px;
height: 170.8px;
border-radius: 3px;
		}
}

#Tip3 {
width: 245px;
border-radius: 3px;
		}


#f_cont {
position: absolute;
z-index: 100;
max-width: 1180px;
align-self: center;
top: 5%;
width: 90%;
height:90%;
background-color: #FFF;
border-radius: 6px;
		}

#frame1 {
top: 0;
left: 0;
width: 100%;
height: 100%;
border-radius: 6px;
border: none;
		}
	

.frame1 {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
border: none;
background-color: #FFF;
overflow: hidden;	
		}

#overlay {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3); display: none;
		}

#flex_cont {
position: absolute;
left: 0;
top: 0;
width: 100%; 
height: 100%; 
display: flex;
flex-direction: column;
		}

#close {
position: absolute;
right: 5px;
top: 5px;
width: 50px;
height: 50px;
		}


