:root
	{
		--heiX: 5vh;
		--sizF: calc(3vw + 5vh);
		--color: white; --Koefaa: 9; --Koefsize: 0.5;
		--aa: calc(var(--sizF) * var(--Koefaa));
		--ab: calc(100vw - var(--aa));
		--widX: calc(100vw - calc(50vw * 1));
	}
	.svgX{ position: absolute; cursor: pointer; color: white;}
	#svgLanding{ width: inherit;  height: 66vh;}
	#dvTitleLanding{ background-color: ; height: 14vh}

	@media(min-width: 1800px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 35vw;
		 --top1: 58vh; --left1: 60vw;
		}

		#landing
		{
			width: var(--widX);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2);
			background-color: ; text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}	

		#svgLanding{ background-color: ;}
		.svgX:nth-child(1){ width: 5vw; left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: 5vw; left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: 4.5vw; left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: 4.5vw; left: var(--left1); top: var(--top1);}
	}

	@media(min-width: 1400px) and (max-width: 1799px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 35vw;
		 --top1: 58vh; --left1: 60vw;
		}

		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.9));
			width: var(--widX);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2); text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}

		.svgX:nth-child(1){ width: 5vw; left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: 5vw; left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: 4.5vw; left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: 4.5vw; left: var(--left1); top: var(--top1);}
	
	}

	@media(min-width: 1200px) and (max-width: 1399px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 35vw;
		 --top1: 58vh; --left1: 61vw;
		}
		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.8));
			width: var(--widX);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2); text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}
		.svgX:nth-child(1){ width: 4.8vw; left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: 4.8vw; left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: 4.2vw; left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: 4.2vw; left: var(--left1); top: var(--top1);}
	}


	@media(min-width: 900px) and (max-width: 1199px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 35vw;
		 --top1: 58vh; --left1: 60vw;
		}

		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.7));
			width: var(--widX);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2); text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}

		.svgX:nth-child(1){ width: 5vw; left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: 5vw; left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: 4.5vw; left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: 4.5vw; left: var(--left1); top: var(--top1);}
	}


	@media(min-width: 700px) and (max-width: 899px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 35vw;
		 --top1: 58vh; --left1: 60vw;
		 --widSvg: 4vw;
		}

		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.7));
			width: var(--widX);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2); text-align: center;
			--Koefsize: 0.6;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}

		.svgX:nth-child(1){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: var(--top1);}
	}

	@media(min-width: 570px) and (max-width: 699px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 35vw;
		 --top1: 58vh; --left1: 60vw;
		 --widSvg: 5vw;
		}

		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.6));
			width: var(--widX);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2); text-align: center;
			--Koefsize: 0.7;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}

		.svgX:nth-child(1){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: var(--top1);}
	}


	@media(min-width: 350px) and (max-width: 569px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 28vw;
		 --top1: 58vh; --left1: 64vw;
		 --widSvg: 8vw;
		}

		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.2));
			width: calc(var(--widX) - 2vw);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2); text-align: center;
			--Koefsize: 0.78;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}

		.svgX:nth-child(1){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: var(--top1);}
	}

	@media(max-width: 349px) and (orientation: landscape)
	{
		:root
		{
		 --top0: 28vh; --left0: 28vw;
		 --top1: 58vh; --left1: 64vw;
		 --widSvg: 8vw;
		}

		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.2));
			width: calc(var(--widX) - 2vw);
			height: 80vh;
			margin-left: calc(calc(100vw - var(--widX)) / 2); text-align: center;
			--Koefsize: 0.78;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}

		.svgX:nth-child(1){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top0);}
		.svgX:nth-child(2){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: calc(var(--top0) + 0.5vw);}
		.svgX:nth-child(3){ width: calc(var(--widSvg) + 2vw); left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: calc(var(--widSvg) + 2vw); left: var(--left1); top: var(--top1);}
	}

/**********************************************************************************************/
/**********************************************************************************************/

@media(min-width: 100px) and (max-width: 399px) and (orientation: portrait)
	{
		:root
		{
		 --top0: 22vh; --left0: 22vw;
		 --top1: 52vh; --left1: 64vw;
		}
		#dvTitleLanding{ font-size: 9vw; background-color: inherit;}
		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.1));
			width: var(--widX);
			height: 80vh;
			--mleft: calc(calc(100vw - var(--widX)) / 2);
			margin-left: calc(var(--mleft) - 2vw); text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}
		.svgX:nth-child(1){ width: 18vw; left: calc(var(--left0) - 2vw); top: var(--top0);}
		.svgX:nth-child(2){ width: 15.8vw; left: var(--left1); top: calc(var(--top0) + 2vw);}
		.svgX:nth-child(3){ width: 14.5vw; left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: 14.5vw; left: var(--left1); top: var(--top1);}
	}

@media(min-width: 400px) and (max-width: 599px) and (orientation: portrait)
	{
		:root
		{
		 --top0: 22vh; --left0: 22vw;
		 --top1: 52vh; --left1: 64vw;
		 --widSvg: 14vw;
		}
		#dvTitleLanding{ font-size: 7vw; background-color: inherit;}
		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.1));
			width: var(--widX);
			height: 80vh;
			--mleft: calc(calc(100vw - var(--widX)) / 2);
			margin-left: calc(var(--mleft) - 2vw); text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}
		.svgX:nth-child(1){ width: var(--widSvg); left: calc(var(--left0) - 2vw); top: var(--top0);}
		.svgX:nth-child(2){ width: var(--widSvg); left: var(--left1); top: calc(var(--top0) + 2vw);}
		.svgX:nth-child(3){ width: var(--widSvg); left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: var(--widSvg); left: var(--left1); top: var(--top1);}
	}

@media(min-width: 600px) and (max-width: 969px) and (orientation: portrait)
	{
		:root
		{
		 --top0: 22vh; --left0: 22vw;
		 --top1: 52vh; --left1: 64vw;
		 --widSvg: 14vw;
		}
		#dvTitleLanding{ font-size: 7vw; background-color: inherit;}
		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.1));
			width: var(--widX);
			height: 80vh;
			--mleft: calc(calc(100vw - var(--widX)) / 2);
			margin-left: calc(var(--mleft) - 2vw); text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}
		.svgX:nth-child(1){ width: var(--widSvg); left: calc(var(--left0) - 2vw); top: var(--top0);}
		.svgX:nth-child(2){ width: var(--widSvg); left: var(--left1); top: calc(var(--top0) + 2vw);}
		.svgX:nth-child(3){ width: var(--widSvg); left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: var(--widSvg); left: var(--left1); top: var(--top1);}
	}

@media(min-width: 970px) and (max-width: 1199px) and (orientation: portrait)
	{
		:root
		{
		 --top0: 22vh; --left0: 22vw;
		 --top1: 52vh; --left1: 64vw;
		 --widSvg: 12vw;
		}
		#dvTitleLanding{ font-size: 7vw; background-color: inherit;}
		#landing
		{
			--widX: calc(100vw - calc(50vw * 0.1));
			width: var(--widX);
			height: 80vh;
			--mleft: calc(calc(100vw - var(--widX)) / 2);
			margin-left: calc(var(--mleft) - 2vw); text-align: center;
			font-size: calc(var(--sizF) * var(--Koefsize));
			color: var(--color);
		}
		.svgX:nth-child(1){ width: var(--widSvg); left: calc(var(--left0) - 2vw); top: var(--top0);}
		.svgX:nth-child(2){ width: var(--widSvg); left: var(--left1); top: calc(var(--top0) + 2vw);}
		.svgX:nth-child(3){ width: var(--widSvg); left: var(--left0); top: var(--top1);}
		.svgX:nth-child(4){ width: var(--widSvg); left: var(--left1); top: var(--top1);}
	}