body {
	background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 25s ease infinite;
  margin: 0;
  padding: 0;

}

@keyframes gradient {
	0% {
		background-position: 0% 50%;
	}
	50% {
		background-position: 100% 50%;
	}
	100% {
		background-position: 0% 50%;
	}
}



html {
  margin: 0;
  padding: 0;
  background: white;
}
* {
  touch-action: manipulation;
}
*,
*:before,
*:after {
  box-sizing: border-box;
}

body {
  position: relative;
  color: white;
  letter-spacing: 2px;
  font-size: 11px;
  font-family: 'Arial', sans-serif;
  width: 100%;
  height: 100vh;
}
.wrapper {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
#c {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.loading {
  position: fixed;
  z-index: 50;
  width: 100%;
  height: 100%;
  top: 0; left: 0;
	background: linear-gradient(-45deg, #ee7752, #e73c7e, #23a6d5, #23d5ab);
	background-size: 400% 400%;
	animation: gradient 10s ease infinite;
  display: flex;
  justify-content: center;
  align-items: center;
}

.loader{
  -webkit-perspective: 120px;
  -moz-perspective: 120px;
  -ms-perspective: 120px;
  perspective: 120px;
  width: 100px;
  height: 100px;
}
.loader:before{
  content: "";
  position: absolute;
  left: 25px;
  top: 25px;
  width: 100px;
  height: 100px;
  background-image: url("b.png");
  background-size: cover;
background-size: contain;
background-repeat: no-repeat;
 /* animation: flip 1s infinite;*/
}

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

  50% {
    transform: rotateY(180deg);
  }

  100% {
    transform: rotateY(180deg)  rotateX(180deg);
  }
}









@keyframes pulse {
	0% {

		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
	}

	50% {

		box-shadow: 0 0 0 1em rgba(0, 0, 0, 0);
	}

	100% {

		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	}
}











#labels {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;
}

#labels>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
margin-left: 15px;
margin-top: 15px;
padding: 1em;
color: #fff;
background: #ee3292;
border-radius: 50%;
border: 0.2em solid orange;
line-height: 0.1;
opacity: 1;
transition: opacity .5s;
user-select: none; 
cursor: pointer;
animation: pulse 3s infinite;
}






#labels2 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;

}

#labels2>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
margin-left: 15px;
margin-top: 15px;
padding: 1em;
color: #fff;
background: royalblue;
border-radius: 50%;
font-size: 12px;
line-height: 0.5;
opacity: 1;
transition: opacity .5s;
user-select: none; 
cursor: pointer;
animation: pulse 3s infinite;
border: 0.2em solid silver;
}



#labels3 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;

}

#labels3>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
margin-left: 15px;
margin-top: 15px;
padding: 1em;
color: #fff;
background: yellow;
border-radius: 50%;
font-size: 12px;
line-height: 0.5;
opacity: 1;
transition: opacity .5s;
user-select: none; 
cursor: pointer;
animation: pulse 3s infinite;
border: 0.2em solid DarkViolet;
}



#labels4 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;

}

#labels4>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
margin-left: 15px;
margin-top: 15px;
padding: 1em;
color: #fff;
background: DarkCyan;
border-radius: 50%;
font-size: 12px;
line-height: 0.5;
opacity: 1;
transition: opacity .5s;
user-select: none; 
cursor: pointer;
animation: pulse 3s infinite;
border: 0.2em solid DarkGray;
}



#labels5 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;

}

#labels5>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
margin-left: 15px;
margin-top: 15px;
padding: 1em;
color: #fff;
background: red;
border-radius: 50%;
font-size: 12px;
line-height: 0.5;
opacity: 1;
transition: opacity .5s;
user-select: none; 
cursor: pointer;
animation: pulse 3s infinite;
border: 0.2em solid DarkSeaGreen;
}



#labels1_1 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;
}

#labels1_1>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;

padding: 0.5em;
color: #fff;
background: black;
border-radius: 10%;
/*border: 0.2em solid dimgrey;*/
/*background-image: url("text1.png");*/
opacity: 0.8;
transition: opacity .5s;
user-select: default; 
cursor: default;
display:none;
}



#labels2_1 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;
}

#labels2_1>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
padding: 0.5em;
color: #fff;
background: black;
border-radius: 10%;
/*border: 0.2em solid dimgrey;*/
/*background-image: url("text1.png");*/
opacity: 0.8;
transition: opacity .5s;
user-select: default; 
cursor: default;
display:none;
}


#labels3_1 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;
}

#labels3_1>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
padding: 0.5em;
color: #fff;
background: black;
border-radius: 10%;
/*border: 0.2em solid dimgrey;*/
/*background-image: url("text1.png");*/
opacity: 0.8;
transition: opacity .5s;
user-select: default; 
cursor: default;
display:none;
}


#labels4_1 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;
}

#labels4_1>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
padding: 0.5em;
color: #fff;
background: black;
border-radius: 10%;
/*border: 0.2em solid dimgrey;*/
/*background-image: url("text1.png");*/
opacity: 0.8;
transition: opacity .5s;
user-select: default; 
cursor: default;
display:none;
}


#labels5_1 {
position: absolute; 
left: 0;        
top: 0;
color: blue;
opacity: 1;
}

#labels5_1>div {
position: absolute;
top: 0;
left: 0;
z-index: 1;
padding: 0.5em;
color: #fff;
background: black;
border-radius: 10%;
/*border: 0.2em solid dimgrey;*/
/*background-image: url("text1.png");*/
opacity: 0.8;
transition: opacity .5s;
user-select: default; 
cursor: default;
display:none;
}






















#label1_1_headline {
	position: fixed;
	font-size: 2.3em;
	color: #444444;
	font-family: 'Heebo', sans-serif;
	font-weight: bolder;
	margin-left: -2.5em;
	margin-top: 0.2em;
	font-style: italic;
}

#label1_1_headline2 {
	position: fixed;
	font-size: 3.3em;
	color: royalblue;
	font-weight: bolder;
	font-family: 'Heebo', sans-serif;
	margin-top: 1.1em;
	margin-left: -4.1em;
}

#label1_1_headline3 {
	position: fixed;
	font-size: 3.3em;
	color: royalblue;
	font-weight: bolder;
	font-family: 'Heebo', sans-serif;
	margin-top: 1.2em;
	margin-left: -2.7em;
}

#label1_1_headline4 {
	position: fixed;
	font-size: 3.3em;
	color: royalblue;
	font-weight: bolder;
	font-family: 'Heebo', sans-serif;
	margin-top: 1.3em;
	margin-left: -4.6em;
}

#label1_1_headline5 {
	position: fixed;
	font-size: 3.3em;
	color: royalblue;
	font-weight: bolder;
	font-family: 'Heebo', sans-serif;
	margin-top: 1.25em;
	margin-left: -4.3em;
}

#label1_1_bottomarrow {
	position: fixed;
	font-size: 3.3em;
	color: royalblue;
	font-weight: bolder;
	font-family: 'Heebo', sans-serif;
	margin-top: 2.1em;
	margin-left: -2.6em;
}

#label1_1_aLotOfTextBlock {
	position: fixed;
	width: 19.9em;
	font-size: 0.6em;
	color: #444444;
	opacity: 0.8;
	margin-top: 7em;
	margin-left: 5.9em;
	height: 3em;
	text-align: left;
	font-family: sans-serif;
}


#DefaultCustomizeTopBase {
	position: absolute;
	top: 0%;
	display: block;
	z-index: 10;
	color: white;
	margin-top: 1em;
}





.line-separator {
	width: 76em;
	position: fixed;
	margin-top: 9.9em;
	margin-left: -37.1em;
	z-index: 999;
	opacity: 0.4;
	padding: 1em;
}

.side-line {
    display: inline-block;
    border-top: 0.1em solid black;
    width: 20%;
}


.triangle {
	display: inline-block;
	height: 1em;
	width: 1em;
	transform: rotate(-135deg);
	transform-origin: center center;
	border-top: 0.1em solid black;
	border-left: 0.1em solid black;
	margin-left: -0.1em;
	margin-right: -0.1em;
	margin-bottom: -0.5em;
}




.line-separator2 {
	width: 70em;
	position: fixed;
	margin-top: 5.7em;
	margin-left: -34.5em;
	z-index: 999;
	opacity: 0.4;
	transform: rotate(-90deg);
	padding: 1em;
}

.side-line2 {
	display: inline-block;
	border-top: 0.1em solid black;
	width: 8%;
}






#hamburger_icon {
	position: fixed;
	width: 16.9em;
	font-size: 0.6em;
	color: #444444;
	opacity: 0.8;
	margin-top: -2.7em;
	right: 0em;
	height: 3em;
	text-align: left;
	font-family: sans-serif;
}


#b_icon {
	position: fixed;
	/*width: 6.9em;*/
	font-size: 0.6em;
	color: #444444;
	opacity: 0.8;
	margin-top: -1.7em;
	left: -1.6em;
	height: 3em;
	text-align: left;
	font-family: sans-serif;
z-index:99;
}


#b_icon_img {
	width: 72.5938px;
	margin-left: 3.4em;
	margin-top: 3.5em;
	z-index: 99;
}

#day_icon_jpg {
    z-index: 999;
    width: 45px;
    margin-left: 2em;
    margin-top: 1em;
}


#night_icon_jpg {
    width: 43.9px;
    margin-left: 5.6em;
    margin-top: 0.9em;
}


#hamburger_icon_img {
    width: 65px;
    margin-left: 5.6em;
    margin-top: 2.4em;
}



#top1_titles {
display:flex;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width:55%;
height: 95%;
background-color: rgba(0, 0, .0, .0	);
}
#topMenuImg {
margin-top: 55px;
}






.flexbox_1{
  display:flex;
  justify-content:center;

}


#night_icon {
	position: fixed;
	width: 16.9em;
	font-size: 0.6em;
	color: #444444;
	opacity: 0.8;
	margin-top: -1.7em;
	right: 8.8em;
	height: 4.2em;
	text-align: left;
	font-family: sans-serif;
}



#day_icon {
	position: fixed;
	width: 16.9em;
	font-size: 0.6em;
	color: #444444;
	opacity: 0.8;
	margin-top: -1.7em;
	right: 12.1em;
	height: 4.2em;
	text-align: left;
	font-family: sans-serif;
}


#contact_mail {
width: 45px;
right: 1.9em;
top: 5.6em;
cursor: pointer;
z-index: 19;
position: fixed;
display:none;
}

#contact_mails {
width: 45px;
    right: 0.7em;
    top: 5em;
    cursor: pointer;
    z-index: 19;
    position: fixed;
}






