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); }



	#master_class { 
		display:block; 
		position:absolute;
		top:0px; 
		left:0px;
		width:100%;
		max-width:calc(100vw);
		padding:0px;	
		margin:0px; 
		box-sizing:border-box;
		/*background:rgba(200,200,200,0.35);*/
	}
	
	
		#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:656;
		}

			#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; }

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

			#content_error {
				display:block;
				position:absolute;
				opacity:0;
				transition:opacity 0.50s;
				color: #20ADD0;
				font-weight:700;
				line-height:100%;
				filter: drop-shadow(5px 5px 2px rgba(0, 0, 0, 0.15));
				pointer-events:none;
				z-index:7007;
			}		
	

		#class_head {
			display:flex;
			position:relative;
			background:transparent;	
			margin-top:calc(0px); 
			min-height:calc(50px + 3vw);	
			opacity:0; 	
			filter: drop-shadow(5px 5px 2px rgba(0, 0, 0, 0.25));
			animation: head_splash 1.25s linear 0.75s forwards;
			-webkit-animation: head_splash 1.25s linear 0.75s forwards;	
		}

			#head_logo {
				display: inline-flex;
				position: absolute;
				border: none;
				outline: none;
				background: transparent;
				margin:auto 0px;
				opacity: 0.75;
				z-index: 66;
			}

				#logo_inner > g > path:first-child { 
					fill:#20ADD0; stroke:#20ADD0; }
				#logo_inner > g > path:nth-of-type(2) { 
					fill:#40E3E3; stroke:#40E3E3; }
				#logo_inner > g > path:nth-of-type(3) { 
					fill:#17CFCF; stroke:#17CFCF; }
				#logo_inner > g > path:nth-of-type(4) { 
					fill:#87F0F0; stroke:#87F0F0; }
				#logo_inner > g > path:nth-of-type(5) { 
					fill:#40E3E3; stroke:#40E3E3; }
				#logo_inner > g > path:nth-of-type(6) { 
					fill:#17CFCF; stroke:#17CFCF; }
					
				#logo_inner > g > .eff { 
					fill:#20ADD0; stroke:#20ADD0; }
				#logo_inner > g > .eff:hover { 
					fill:#17CFCF; stroke:#17CFCF; } 
				
			#head_logo:hover { opacity:1; transition:all ease-in 0.25s; }

			#head_legende { 
				display:inline-flex; 
				position:absolute; 
				float:right;
				border:none; outline:none; 
				background:transparent;
				margin-left: 0px;	
				opacity:0.80; 
				z-index:66;  
			}
				
		@keyframes head_splash {
			0% { opacity:0; background:transparent; }
			100% { opacity:0.95; background:rgba(242,242,252,0.05); } 
		} 


		#class_nav {
			display:block;
			background:transparent;	
			opacity:0; 		
			border-top:solid 1.5px rgba(100,145,210,1);
			border-bottom:solid 1.5px rgba(100,145,210,1);
			animation: nav_splash 1.25s linear 0.75s forwards;
			-webkit-animation: nav_splash 1.25s linear 0.75s forwards;	
		}
		
			#blue_functions { background:rgba(232,242,252,0.20); outline:none; }
			#blue_functions:hover { background:rgba(222,232,252,0.35);  }

			.dynamic{ 
				position:relative; 
				z-index:7777;
				top:calc(0px); 
				margin-top:calc(10px);
				min-height:75px;
				opacity:0; 	
				/*border-bottom:solid 1.5px rgba(100,145,210,1);*/
				animation: splash_nav 1.25s linear 0.75s forwards;
				-webkit-animation: splash_nav 1.25s linear 0.75s forwards;	
			}	
			.staticc{ 
				position: fixed;
				z-index:7777;
				top:calc(0px); 
				margin-top:calc(0px);
				min-height:75px;
				opacity:0;
				/*border-bottom:solid 1.5px rgba(100,145,210,1);*/
				animation: splash_nav 1.25s linear 0.75s forwards;
				-webkit-animation: splash_nav 1.25s linear 0.75s forwards;	
			}

		@keyframes nav_splash {
			0% { opacity:0; background: transparent; }
			100% { opacity:1; background: rgba(121,101,121,0.25); } 
		} 

		#class_inner {
			
		}
		
			#inner_axis {
				display:block;
				position:relative;		
				margin-top:calc(10px); 
				opacity:0; 	
				animation: axis_splash 1.25s linear 0.75s forwards;
				-webkit-animation: axis_splash 1.25s linear 0.75s forwards;	
			}	

			@keyframes axis_splash {
				0% { opacity:0; }
				100% { opacity:0.95; } 
			} 


			#inner_sticky {
				position: sticky;
				top:75px;
				background:rgba(100,145,210,1);
				border-top:solid 1.5px #682fdd ;
				border-bottom:solid 1.5px #682fdd ;
				transition: top 0.35s ease 0s;
				z-index: 10001;
			}
			
				.sticky-menu > a {
					color:rgb(255 255 255 / 89%);
					font-size:calc(0.50vw + 1vh);
					font-weight:600;
					text-decoration: none;
					border-bottom: 2px solid rgb(255 255 255 / 0%);
					filter: drop-shadow(5px 5px 2px rgba(0, 0, 0, 0.20));
				}

					.sticky-menu > a:hover {
						color:rgb(255 255 255 / 69%);
						text-decoration: none;
						border-bottom: 2px solid rgb(255 255 255 / 100%);
					}


		#class_foot {
			display:block;
			position:relative;
			background:transparent;		
			margin-top:calc(10px);
			border-top:solid 1.5px rgba(100,145,210,1) ;			
			padding:20px 4vw 20px 4vw;
			font-family: 'Arial';
			color: #666;
		}


			.foot_blue {
				opacity:0; 	
				animation: foot_splash 1.25s linear 0.75s forwards;
				-webkit-animation: foot_splash 1.25s linear 0.75s forwards;	
			}

			@keyframes foot_splash {
				0% { opacity:0; background: transparent; }
				100% { opacity:0.95; background: rgba(101,202,222,0.70); } 
			} 


			.f_copyright { position:relative;color:#666;transition:color 1s; }
				.f_title { color:#444;cursor:pointer; }
				.f_title:hover { color:#777; }			
				.f_mentions { position:relative;padding-top:calc(10px);padding-left:calc(.5rem);pointer-events:none;display:none; } 




		#class_return {  
			position:fixed;
			border-radius:3px; padding:10px;
			width:calc(38px);
			height:calc(40px);  
			right:calc(4vw);
			font-size:calc(15px); 
			text-align:center; 
			color:#fff; 
			background:rgba(0,0,0, 0.5); 
			opacity:1;
			transition:all ease-in 0.2s;
			backface-visibility: hidden; 
			-webkit-backface-visibility: hidden; 
			text-decoration: none;
			box-shadow: 5px 5px 10px 2px rgba(119, 119, 119, 0.75);
			-moz-box-shadow: 5px 5px 10px 2px rgba(119, 119, 119, 0.75);
			-webkit-box-shadow: 5px 5px 10px 2px rgba(119, 119, 119, 0.75);		
			z-index:11111; 
		}

		#class_return:before{ 
			content: "\25b2"; }
		#class_return.reInvisible{ 
			bottom:calc(-40px); opacity:0; transition:all ease-in 0.5s; }
		#class_return.reInvisible.blue:hover{ 
			color:#333; cursor:pointer; background:rgba(101,202,222, 0.75); transition:all ease-in 0.2s; }
		#class_return.reVisible{ 
			bottom:calc(15px); opacity:1; } 
		#class_return.reVisible.blue:hover{ 
			color:#333; cursor:pointer; background:rgba(101,202,222, 0.75); transition:all ease-in 0.2s; }






	@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);
			}
		#class_head { top:calc(0px); height:calc(50px + 3vw); left:calc(0px); width:calc(100vw); }
			#head_logo { 
				top:calc(22px + 0.5vw);
				height:calc(16px + 2vw); 
				left:calc(3.75vw); 
				width:calc(20vw + 6vh); 
			}
			#head_legende { 
				display:inline-flex; 
				top:calc(18px + 0.5vw);
				height:calc(24px + 2vw); 
				left:calc(3.75vw + 20vw + 6vh + .5rem); 
			}  
		#class_nav { left:calc(0px); width:calc(100vw); }
			.dynamic{ left:calc(0px); width:calc(100vw);}	
			.staticc{ left:calc(0px); width:calc(100vw);}
			.augmented{ margin-top: calc(50px + 3vw);}
			
		#class_foot { left:calc(0px); width:calc(100vw); font-size:calc(100vw / 75); }
	}


	@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);
			}			
		#class_head { top:calc(0px); height:calc(50px + 3vw); left:calc(0px); width:calc(100vw); } 
			#head_logo { 
				top:calc(22px + 0.5vw); 
				height:calc(16px + 2vw); 
				left:calc(3.75vw); 
				width:calc(24vw + 3vh); 
			}
			#head_legende { 
				display:inline-flex; 
				top:calc(18px + 0.5vw); 
				height:calc(24px + 2vw); 
				left:calc(3.75vw + 24vw + 3vh + .5rem); 
			} 
		#class_nav { left:calc(0px); width:calc(100vw); }
			.dynamic{ left:calc(0px); width:calc(100vw);}	
			.staticc{ left:calc(0px); width:calc(100vw);}
			.augmented{ margin-top: calc(50px + 3vw);}
			
		#class_foot { left:calc(0px); width:calc(100vw); font-size:calc(100vw / 60); }	
	}


	@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);
			}			
		#class_head { top:calc(0px); height:calc(50px + 3vw); left:calc(0px); width:calc(100vw); } 
			#head_logo { 
				top:calc(22px + 0.5vw); height:calc(16px + 2vw); left:calc(3.75vw); width:calc(30vw); }
			#head_legende { 
				display:inline-flex;top:calc(22px + 0.5vw);height:calc(16px + 2vw);left:calc(3.75vw + 30vw + .5rem); } 
				
		#class_nav { left:calc(0px); width:calc(100vw); }
			.dynamic{ left:calc(0px); width:calc(100vw);}	
			.staticc{ left:calc(0px); width:calc(100vw);}
			.augmented{ margin-top: calc(50px + 3vw);}
			
		#class_foot { left:calc(0px); width:calc(100vw); font-size:calc(100vw / 55); }	
	}


	@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);
			}
		#class_head { top:calc(0px); height:calc(50px + 3vw); left:calc(0px); width:calc(100vw); } 
			#head_logo { 
				top:calc(22px + 0.5vw); height:calc(16px + 2vw); left:calc(3.75vw); width:calc(32vw); }
			#head_legende { 
				display:inline-flex;top:calc(22px + 0.5vw);height:calc(16px + 2vw);left:calc(3.75vw + 32vw + .5rem); }	
		#class_nav { left:calc(0px); width:calc(100vw); }
			.dynamic{ left:calc(0px); width:calc(100vw);}	
			.staticc{ left:calc(0px); width:calc(100vw);}
			.augmented{ margin-top: calc(50px + 3vw);}	
			
		#class_foot { left:calc(0px); width:calc(100vw); font-size:calc(100vw / 50); }
	}

	@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);
			}			
		#class_head { top:calc(0px); height:calc(50px + 3vw); left:calc(0px); width:calc(100vw); }
			#head_logo { top:calc(20px + 0.5vw); height:calc(20px + 2vw); left:calc(3.75vw); width:calc(42vw); }
			#head_legende { display:none; }
		#class_nav { left:calc(0px); width:calc(100vw); }
			.dynamic{ left:calc(0px); width:calc(100vw);}	
			.staticc{ left:calc(0px); width:calc(100vw);}
			.augmented{ margin-top: calc(50px + 3vw);}
			
		#class_foot { left:calc(0px); width:calc(100vw); font-size:calc(100vw / 40); }	
	}

	@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);
			}	
		#class_head { top:calc(0px); height:calc(50px + 3vw); left:calc(0px); width:calc(100vw); }
			#head_logo { top:calc(20px + 0.5vw); height:calc(20px + 2vw); left:calc(3.75vw); width:calc(50vw); }
			#head_legende { display:none; }
		#class_nav { left:calc(0px); width:calc(100vw); }
			.dynamic{ left:calc(0px); width:calc(100vw);}	
			.staticc{ left:calc(0px); width:calc(100vw);}
			.augmented{ margin-top: calc(50px + 3vw);}
			
		#class_foot { left:calc(0px); width:calc(100vw); font-size:calc(100vw / 35); }
	}