#top {
	position: relative;
	font-family: Verdana, Helvetica, sans-serif;
	user-select: none;
	
		/*border: 1px solid blue;*/
}

#home-container {
	position: absolute;
	top: 0;	

	display: flex;
	flex-direction: column;
	overflow: hidden;
	
	width: 100%;
	height: 99dvh;
	
		/*border: 1px solid red;*/
}

#home-header {
	display: flex;
	flex: 0 0 auto;
	justify-content: flex-end;
	width: 100%;
	height: 1vmin;
	min-height: 35px;
	margin-top: 1.2dvh;
	align-items: center;

	font-size: max(1.4vmin, 11px);
	color: #FFCC00;
	background-color: rgba(51, 51, 51, 0.75);
	padding: 6px 3vmin;
}

.home-socialIcons > *:not(:first-child),
.home-languageSelector > *:not(:first-child) {
  margin-left: 0.5vw;
}

.home-socialIcons a,
.home-languageSelector a {
	height: auto;
	width: auto;
	vertical-align: middle;
	text-decoration: none;
}

.home-socialIcons img,
.home-languageSelector img {
	height: 3vmin;
	width: auto;
	min-height: 25px;
	vertical-align: middle;
}

.home-socialIcons img:hover,
.home-languageSelector img:hover,
#home-selectedLanguageLink:hover #home-selectedLanguageIcon {
	filter: drop-shadow(0 0 6px rgba(255, 255, 255, 0.8));
	transform: scale(1.05);
}

#home-logoContainer {
	position: relative;
	z-index: 999;
	height: 30dvh;
	min-height: 30dvh;
	max-width: 90dvw;
	left: 50%;
	transform: translate(-50%, 0);
	margin-top: 2dvh;

			/*border: 1px solid red;*/
}

#home-logo-image,
#home-logo-glow {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	
				/*border: 1px solid orange;*/
}

#home-logo-glow {
    opacity: 0;
	animation: glowFade 5s infinite linear
}

@keyframes glowFade {
	0%   { opacity: 0; }
	5%  { opacity: 1; }
	10% { opacity: 0; }
	100% { opacity: 0; }
}

#home-strip-container {
	position: relative;
	z-index: 999;
	min-height: 19dvh;
	max-width: 90dvw;
	left: 50%;
	transform: translate(-50%, 0);
	margin-top: 8dvh;

			/*border: 1px solid green;*/
}

#home-strip-image {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	
		/*border: 1px solid red;*/
}

#home-menu-items {
	position: relative;
	z-index: 999;

	display: flex;
	flex: 0 0 auto;
	justify-content: space-between;
	background: none;
	margin: 0 auto;
	padding: 1dvh 0.4dvw 1dvh 0.4dvw;	
}

.home-menu-item {
	position: relative;
	left: 0;
	font-size: max(4vmin, 20px);
	text-decoration: none;
	color: #FFFFFF;
	transition: color 0.3s;
	text-shadow:
		-0.1rem -0.1rem 0 black,
		0.1rem -0.1rem 0 black,
		-0.1rem  0.1rem 0 black,
		0.1rem  0.1rem 0 black;
}

.home-menu-item:hover {
	color: #FFCC00; 
	text-shadow: 0 0 1rem #FFCC00;
	transform: scale(1.05)
}

.home-menu-item:hover .home-menu-description {
	color: #FFCC00;
	opacity: 1;
	visibility: visible;
	transform: scale(1.05)
}

.home-menu-description {
	position: absolute;
	top: 2.4em;
	left: 0;
	margin-top: 0;
	font-size: 1.5vmin;
	text-wrap: nowrap;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease, visibility 0.3s ease;
	
		/*border: 1px solid orange;	*/
}

#home-visualizer-container {
	position: absolute;
	z-index: 0;

    width: 100%;
	height: 30%;
	bottom: max(1vmin, 35px);
	
		/*border: 1px solid blue;*/
}

#home-canvasContainer {
    display: flex;
	flex: 1 1 0;
    justify-content: space-between; /* uno a sinistra, uno a destra */
    align-items: end;            /* opzionale: allinea verticalmente */
    width: 100%;
	height: 100%;

		/*border: 1px solid white;*/
}

#home-leftCanvasContainer {
	width: 40%;
	height: 100%;
	
		/*border: 1px solid orange;*/
}

#home-rightCanvasContainer {
	width: 40%;
	height: 100%;
}

canvas {
	display: block;
	width: 100%;
	height: 100%;

		/*border: 1px solid white;*/

}

#home-footer {
	display: flex;
	flex: 0 0 auto;
	justify-content: space-between;
	width: 100%;
	height: 1vmin;
	min-height: 35px;
	align-items: center;

	font-size: max(1.4vmin, 11px);
	color: #FFCC00;
	background-color: rgba(51, 51, 51, 0.75);
	padding: 6px 3vmin;
	
		/*border: 1px solid green;*/
}

#home-fullCopyright {display: inline}
#home-shortCopyright {display: none}

@media (max-width: 430px) {
    #home-fullCopyright {display: none}
    #home-shortCopyright {display: inline}
}