@font-face {
    font-family: 'FontA';	src:	
		url("resources/A.woff") format("woff"), /* Modern Browsers */
		url("resources/A.otf") format("opentype"),
		url("resources/A.ttf")  format("truetype"); /* Safari, Android, iOS */
}

@font-face {
    font-family: 'FontA2';	src:	
		url("resources/A2.woff") format("woff"), /* Modern Browsers */
		url("resources/A2.otf") format("opentype"),
		url("resources/A2.ttf")  format("truetype"); /* Safari, Android, iOS */
}

@font-face {
    font-family: 'FontB';	src:	
		url("resources/B.woff") format("woff"), /* Modern Browsers */
		url("resources/B.otf") format("opentype"),
		url("resources/B.ttf")  format("truetype"); /* Safari, Android, iOS */
}

a 			{color:#eee; text-decoration:none;}
a:hover		{color:#fff; text-shadow: 0px 0px 12px #FFF;}
a:visited 	{color:#eee;}
a:active 	{color:#eee;}

a svg {
	margin: 5px auto 5px;
	width: calc(45px);
	height:calc(45px);
	fill: #eee;
	-webkit-transition-property: top, left, position;
	transition-property: 		 top, left, position;
	-webkit-transition-duration:	1.5s;
	transition-duration: 			1.5s;
}

a svg:hover {
	fill: #eee;
}

.animate {
	-webkit-transition-property: max-height, opacity;
	transition-property: 		 max-height, opacity;
	-webkit-transition-duration:	1.5s;
	transition-duration: 			1.5s;
}

body {
	background-image: url('gfx/bg0.jpg?20220925');
	background-position: 50% 0;	
	background-repeat: repeat-y;
	background-size: cover;
    font-family: 'fontA', 'Arial Black';
	margin: auto auto;
	max-width: 900px;
	background-color: #000;
	color: #FFF;
	font-size: calc(15pt + 2vw);
	text-shadow: 1px 1px 5px #0008;	
}

#divBody {
	margin-top: 3vh;
	text-align: center;	
}

#divLanguage{
	font-size: calc(4vh);
	float: right;
	margin: auto 4vw calc(5vh - 3vw);
}

#divCover {
	clear:both;
	height: calc(50vh + 15vw);

}
 
	#divCoverIn {
	}
		
		#divCoverInImg {
			border-radius: 3px;
			box-shadow: 13px 8px 10px 4px #00000063;	
			cursor: pointer;
			height:100%;
		/* 	opacity: .3; */
		}

		#divCoverInHeader {
		/* 	border: 1px solid white; */
			cursor: pointer;
			font-family: 'fontB', 'Comic Sans MS';
			font-size: calc(1.5vh + 0.5vw);
			left: 0px;
			margin: calc(9.7vh + 0.7vw + 5vh - 3vw) auto; 
			position: absolute;
			text-align: center; 
			top: 0px;
			width: 100%;
		}

		#divCoverInTitle {
		/* 	border: 1px solid black; */
			cursor: pointer;
			font-family: 'fontA', 'Arial Black';			
			font-weight: normal;
			left: calc(0.1vh + 0.2vw);
			line-height: calc(5.7vh + 1.5vw); 
			margin: calc(11.2vh + 2.5vw + 5vh - 3vw) auto;
			position: absolute;
			text-align: center; 
			text-transform: uppercase; 
			top: 0px;
			width: 100%;
		}

		#divCoverInTitleSub {
			cursor: pointer;
			font-family: 'fontA', 'Arial Black';		
			font-size: calc(1.3vh + 0.5vw);
			font-weight: bold;
			letter-spacing: 0.17vh;
			left: 0px;
			line-height: calc(1.5vh + 0.5vw); 
			margin: calc(46vh + 12vw + 5vh - 3vw) auto; 
			position: absolute;
			text-align: center; 
			text-shadow: 1px 1px 7px #000D;
			text-transform: uppercase; 
			top: -2vh;
			width: 100%;
		}

		#divCoverInTitleSubAuthor {
			cursor: pointer;
			font-family: 'fontB', 'Comic Sans MS';		
			font-size: calc(1.1vh + 0.2vw); 
			font-weight: bold;
			letter-spacing: 0.17vh;
			left: 0px;
			line-height: 2.2vh; 
			margin: calc(53vh + 14vw + 5vh - 3vw) auto; 
			position: absolute;
			text-align: center; 
			text-shadow: 1px 1px 7px #000B;
			top: 0px;
			width: 100%;
		}
		
		#divCoverInTap {
			cursor: pointer;
			left: 0px;
			margin: calc(29vh + 9vw + 4vh - 3vw) auto;
			opacity: 0;
			position: absolute;
			text-align: center; 
			top: 0px;
			width: 100%;
			-webkit-animation: 	animBlink 4s infinite linear;
			-moz-animation: 	animBlink 4s infinite linear;
			animation: 			animBlink 4s infinite linear;				
		}
		@keyframes animBlink {
		  0% 	{ opacity:0;}
		  35% 	{ opacity:0;}
		  45% 	{ opacity:1;}
		  50% 	{ opacity:0.5;}
		  55% 	{ opacity:1;}
		  60% 	{ opacity:0.5;}
		  65% 	{ opacity:1;}
		  70% 	{ opacity:0.5;}
		  75% 	{ opacity:1;}
		  90% 	{ opacity:0;}
		}		
		
			#divCoverInTapToGet {
/* 				border: 1px solid white; */
				display: inline-block;
				font-family: 'fontB', 'Comic Sans MS';
				font-size: calc(1.7vh + 0.6vw);
			}
		
				#divCoverInTapToGetIcon {
					position:relative;
					float: left;
				}
		
				#divCoverInTapToGetCaption {
					float: left;
					position:relative;
					margin: 0px auto auto 5px;
				}

#divHello {
	font-family: 'fontB', 'Comic Sans MS';
	line-height: 24pt;
	margin: 60px 15px auto;
	overflow: auto; 
	padding: 10px;
	text-align: justify;
}
	
	#divHelloImageDiv {
	}
	
		#divHelloImageDivImg {
			box-shadow: 1px 2px 5px 6px #00000040;
			float:left;
			margin: 10px 20px;
			width: 15vw; min-width: 130px;
			height: auto;
			transform:rotateZ(-1deg); -webkit-transform:rotateZ(-1deg); -moz-transform:rotateZ(-1deg);	
		}

#divImagesTitle {
	font-size: 20pt;
	line-height: 24pt;
	margin: 40px 30px 20px;
	text-transform: uppercase;
}

#divImages {
	position: relative;
}

	#divImagesImg0 {
		opacity: 1;
		position: absolute;
	}

		#divImagesImg0 img {
			box-shadow: 4px 4px 8px 6px #00000040;
			margin-top: 2vh;
			transform: rotateZ(-2deg); -webkit-transform:rotateZ(-2deg); -moz-transform:rotateZ(-2deg); 
			width: 80%;
		}

#divImageOnlyForSpacing{
	opacity:0;
/* 	position:absolute; */
}

	#divImageOnlyForSpacing img {
		margin-top: 2vh;
		transform: rotateZ(-2deg); -webkit-transform:rotateZ(-2deg); -moz-transform:rotateZ(-2deg); 
		width: 70%;
	}

#divImagesCaptions {
	font-family: 'fontB', 'Comic Sans MS';
/* 	font-family: 'fontA', 'Arial Black'; */
	font-size: calc(2vh + 1vw);
	margin: calc(3vh + 3vw) auto auto;
	transform: rotateZ(-2deg); -webkit-transform:rotateZ(-2deg); -moz-transform:rotateZ(-2deg); 
	width: 96%;
}

#divImagesCaption0 {
	z-index:0;
}

#divButtons {
	margin: calc(2vw + 3vh) auto auto;
	width: 90%;
}
	#divButtonsTitle {
		font-family: 'fontA';
		font-size: calc(0.9vw + 2.9vh);
		padding: 15px;
/* 		text-align: center; */
	}
	
	#divButtonsHeader {
		font-family: 'fontB';
		font-size: calc(0.5vw + 2.0vh);
		padding: 10px;
		text-align: center;
	}
	
	#divButtonGetHandbook {
		border: 2px solid white;
		border-radius: 55px;
/* 		cursor: pointer; */
		display: inline-block;
		font-size: calc(0vw + 3vh);
		line-height: 1,1;
		margin: calc(1vw + 1vh);
		text-transform: uppercase; 
	    padding: calc(0.5vw + 1.3vh);
		width: calc(12vw + 13vh);
	}
	
#divSupportCommission {
	font-size:11pt;
	margin-top:5px;
}

#divIcons {
	line-height:13vh;
	margin: 12vh auto 12vh;
	position: relative;
	text-align: center;
	width: 100%; 
}
	.divIcon {
		display: inline-block;
		line-height: 140%;
		position: relative;
		margin: auto calc(5px + 1vw) auto;
		text-decoration: none;
		font-size: 20px;
	/* 	font-size: 4vh; */
	}

	.divIcon a {
		text-decoration: none;
	}
	
.divIcon svg:hover {
	-webkit-filter: drop-shadow( 1px 1px 5px #FFF);
	filter: 		drop-shadow( 1px 1px 5px #FFF);
}


#divFooter {
	font-family: 'fontB';
	font-size: calc(0.5vw + 1.3vh);
	padding: 5vh;
	}
	
#spanFooterPrivacyPolicy {
	font-size: calc(0.3vw + 1.1vh);
	cursor: pointer;
	
}
	#spanFooterPrivacyPolicy:hover {
		text-shadow: 0px 0px 12px #FFF;
	}

#divPrivacyPolicy {
	font-family: 'fontB';
		font-size: calc(0.3vw + 2.0vh);
		margin: auto 50px 50px;
		text-align: center;
}