

html, body {
	margin:0;
	padding:0;
	font-size:20px; 
}

body {
	overflow-X:hidden;
	scrollbar-face-color: rgba(101,202,222,0.4); 
	scrollbar-track-color: #fff;
	scrollbar-arrow-color: #000;
	-ms-overflow-style: -ms-autohiding-scrollbar; 
	box-sizing:border-box;
}

	::-webkit-scrollbar { width: 0 !important }
	::-webkit-scrollbar-track {  background-color: rgba(255,255,255,0.4);}
	::-webkit-scrollbar-track-piece { background-color: rgba(255,255,255,0.4);}
	::-webkit-scrollbar-thumb { height: 50px; background-color: rgba(101,202,222,0.4); border-radius: 0px;   }
	::-webkit-scrollbar-corner { background-color: rgba(255,255,255,0.4);}
	::-webkit-resizer { background-color: rgba(101,202,222,0.4); }


	#A {
		width:100%;
		height:100%;
	}
	
	#A_class { 
		display:block; 
		position:absolute;
		top:0px; 
		left:0px;
		width:100%;
		max-width:calc(100vw);
		padding:0px;	
		margin:0px; 
		box-sizing:border-box;
		background: #2A7B9B;
		background: linear-gradient(90deg, rgba(42, 123, 155, 0.55) 0%, rgba(87, 121, 199, 1) 71%, rgba(83, 222, 237, 0.95) 100%);
	}	
	

		#class_content { 
			position:relative;
			display:block;
			top:0px;
			left:0px;
			width:100%;
			height:calc(100vh);
			margin:0px;
			padding:0px;   
			transition: opacity 0.25s;
			opacity:0; 
			overflow:hidden;
			z-index:666;
		}

			#content_logo {
				display:block;
				position:absolute;
				opacity:0.75;
				transition:opacity 0.25s;
				filter: drop-shadow(5px 5px 2px rgba(0, 0, 0, 0.25));
				z-index:7007;
			}	

				#logo_svg > g > path:first-child { fill:#20ADD0; stroke:#20ADD0; }
				#logo_svg > g > path:nth-of-type(2) { fill:#40E3E3; stroke:#40E3E3; }
				#logo_svg > g > path:nth-of-type(3) { fill:#17CFCF; stroke:#17CFCF; }
				#logo_svg > g > path:nth-of-type(4) { fill:#87F0F0; stroke:#87F0F0; }
				#logo_svg > g > path:nth-of-type(5) { fill:#40E3E3; stroke:#40E3E3; }
				#logo_svg > g > path:nth-of-type(6) { fill:#17CFCF; stroke:#17CFCF; }	
				#logo_svg > g > .el { fill:#20ADD090; stroke:#20ADD0; }

			#content_logo:hover { opacity:1; cursor:pointer; }		
			
			


	@media screen and (min-width: 1024px)  { 
		#class_content { }
			#content_logo { 
				top:calc(50vh);height:calc(15vh);right:calc(4vw);width:calc(65vw - 8vw); }
			#content_legende { 
				top:calc(65vh);
				height:calc(10vh);
				right:calc(4vw);
				width:calc(64vw - 8vw); 
			}
			#content_error { 
				top:calc(75vh);
				height:calc(5vh);
				right:calc(4vw);
				width:calc(64vw - 8vw);
				text-align:end;
				font-size:calc(1.5vw + 1.5vh);
				letter-spacing:calc(0.5vw + 0.5vh);
			}
	}


	@media screen and (min-width: 860px) and (max-width: 1023.99px)  { 
		#class_content { }
			#content_logo { top:calc(50vh); height:calc(15vh); right:calc(4vw); width:calc(65vw - 8vw); }
			#content_legende { 
				top:calc(65vh); 
				height:calc(10vh); 
				right:calc(4vw); 
				width:calc(64vw - 8vw); 
			}
			#content_error { 
				top:calc(74.5vh);
				height:calc(5vh);
				right:calc(4vw);
				width:calc(64vw - 8vw);
				text-align:end;
				font-size:calc(1.5vw + 1.5vh);
				letter-spacing:calc(0.5vw + 0.5vh);
			}			
	}


	@media screen and (min-width: 640px) and (max-width: 859.99px)  { 
		#class_content { }
			#content_logo { top:calc(50vh); height:calc(15vh); right:calc(4vw); width:calc(70vw - 8vw); }
			#content_legende { 
				top:calc(65vh); 
				height:calc(10vh); 
				right:calc(4vw); 
				width:calc(69vw - 8vw); 
			}
			#content_error { 
				top:calc(74vh);
				height:calc(5vh);
				right:calc(4vw);
				width:calc(69vw - 8vw);
				text-align:end;
				font-size:calc(1.75vw + 1.75vh);
				letter-spacing:calc(0.65vw + 0.65vh);
			}			
	}


	@media screen and (min-width: 480px) and (max-width: 639.99px)  {
		#class_content { }
			#content_logo { top:calc(50vh); height:calc(15vh); right:calc(4vw); width:calc(80vw - 8vw); }
			#content_legende { 
				top:calc(65vh); 
				height:calc(10vh); 
				right:calc(4vw); 
				width:calc(79vw - 8vw); 
			}
			#content_error { 
				top:calc(74vh);
				height:calc(5vh);
				right:calc(4vw);
				width:calc(79vw - 8vw);
				text-align:end;
				font-size:calc(1.80vw + 1.80vh);
				letter-spacing:calc(0.75vw + 0.75vh);
			}
	}

	@media screen and (min-width: 341px) and (max-width: 479.99px)  { 
		#class_content { }
			#content_logo { top:calc(50vh); height:calc(15vh); right:calc(4vw); width:calc(100vw - 8vw); }
			#content_legende { 
				top:calc(65vh); 
				height:calc(10vh); 
				right:calc(4vw); 
				width:calc(99vw - 8vw); 
			}
			#content_error { 
				top:calc(74vh);
				height:calc(5vh);
				right:calc(4vw);
				width:calc(89vw - 8vw);
				text-align:end;
				font-size:calc(1.85vw + 1.85vh);
				letter-spacing:calc(0.80vw + 0.80vh);
			}				
	}

	@media screen and (max-width: 340.99px)  { 
		#class_content { }
			#content_logo { top:calc(50vh); height:calc(15vh); right:calc(4vw); width:calc(100vw - 8vw); }
			#content_legende { 
				top:calc(65vh); 
				height:calc(10vh); 
				right:calc(4vw); 
				width:calc(99vw - 8vw); 
			}
			#content_error { 
				top:calc(74vh);
				height:calc(5vh);
				right:calc(4vw);
				width:calc(99vw - 8vw);
				text-align:end;
				font-size:calc(1.90vw + 1.90vh);
				letter-spacing:calc(0.70vw + 0.70vh);
			}	
	}
			