#divAppSplashScreen
{
	background-color:#547736;
	height:100%;
	left:0px;
	position:fixed;
	top:0px;
	transition:opacity 0.25s;
	width:100%;
	z-index:2;
}

#divAppSplashScreen.fadeOut
{
	opacity:0;
}

#divAppSplashScreen.hide
{
	display:none;
}

#divAppSplashScreen .divSplashLogo1
{
	background-image:url('../img/logoText.png');
	background-position:0px 0px;
	background-repeat:no-repeat;
	background-size:800px 94px;
	height:94px;
	right:200%;
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	width:350px;
}

#divAppSplashScreen.showAnimation .divSplashLogo1
{
	animation-duration:0.5s;
	animation-name:animationLogo1;
	right:calc(50% + 75px);
}

#divAppSplashScreen .divSplashLogo2
{
	background-image:url('../img/logoText.png');
	background-position:-424px 0px;
	background-repeat:no-repeat;
	background-size:800px 94px;
	border-radius:0% 0% 0% 30%;
	height:44px;
	left:calc(50% + 22px);
	overflow:hidden;
	position:absolute;
	top:-200%;
	transform:translate(-50%, -50%);
	width:46px;
}

#divAppSplashScreen.showAnimation .divSplashLogo2
{
	animation-duration:1s;
	animation-name:animationLogo2;
	top:calc(50% - 25px);
}

#divAppSplashScreen .divSplashLogo3
{
	background-image:url('../img/logoText.png');
	background-position:-378px -34px;
	background-repeat:no-repeat;
	background-size:800px 94px;
	border-radius:0% 40% 0% 0%;
	height:62px;
	left:calc(50% - 16px);
	overflow:hidden;
	position:absolute;
	top:200%;
	transform:translate(-50%, -50%);
	width:62px;
}

#divAppSplashScreen.showAnimation .divSplashLogo3
{
	animation-duration:1s;
	animation-name:animationLogo3;
	top:calc(50% + 18px);
}

#divAppSplashScreen .divSplashLogo4
{
	background-image:url('../img/logoText.png');
	background-position:-494px 0px;
	background-repeat:no-repeat;
	background-size:800px 94px;
	height:94px;
	left:200%;
	position:absolute;
	top:50%;
	transform:translateY(-50%);
	width:308px;
}

#divAppSplashScreen.showAnimation .divSplashLogo4
{
	animation-duration:1.5s;
	animation-name:animationLogo4;
	left:calc(50% + 69px);
}

#divAppSplashScreen #divSplashScreenVersion
{
	bottom:10%;
	color:rgba(255, 255, 255, 0.8);
	font-size:12px;
	position:absolute;
	text-align:center;
	width:100%;
}

/* ANIMATIONS */
@keyframes animationLogo1
{
	0%   {right:200%;}
	1%   {right:200%;}
	100% {right:calc(50% + 75px);}
}

@keyframes animationLogo2
{
	0%   {top:-200%;}
	50%  {top:-200%;}
	100% {top:calc(50% - 25px);}
}

@keyframes animationLogo3
{
	0%   {top:200%;}
	50%  {top:200%;}
	100% {top:calc(50% + 18px);}
}

@keyframes animationLogo4
{
	0%   {left:200%;}
	66%  {left:200%;}
	100% {left:calc(50% + 69px);}
}

/* MEDIA QUERIES */
@media (max-width: 1200px)
{
	#divAppSplashScreen .divSplashLogo1
	{
		background-size:400px 47px;
		height:47px;
		width:175px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo1
	{
		right:calc(50% + 37px);
	}
	
	#divAppSplashScreen .divSplashLogo2
	{
		background-position:-212px 0px;
		background-size:400px 47px;
		height:22px;
		left:calc(50% + 12px);
		width:23px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo2
	{
		top:calc(50% - 13px);
	}
	
	#divAppSplashScreen .divSplashLogo3
	{
		background-position:-189px -17px;
		background-size:400px 47px;
		height:31px;
		left:calc(50% - 8px);
		width:31px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo3
	{
		top:calc(50% + 9px);
	}
	
	#divAppSplashScreen .divSplashLogo4
	{
		background-position:-247px 0px;
		background-size:400px 47px;
		height:47px;
		width:154px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo4
	{
		left:calc(50% + 35px);
	}
	
	/* ANIMATIONS */
	@keyframes animationLogo1
	{
		0%   {right:200%;}
		1%   {right:200%;}
		100% {right:calc(50% + 37px);}
	}

	@keyframes animationLogo2
	{
		0%   {top:-200%;}
		50%  {top:-200%;}
		100% {top:calc(50% - 13px);}
	}

	@keyframes animationLogo3
	{
		0%   {top:200%;}
		50%  {top:200%;}
		100% {top:calc(50% + 9px);}
	}
	
	@keyframes animationLogo4
	{
		0%   {left:200%;}
		66%  {left:200%;}
		100% {left:calc(50% + 35px);}
	}
}

@media (max-width: 600px)
{
	#divAppSplashScreen .divSplashLogo1
	{
		background-size:200px 24px;
		height:24px;
		width:88px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo1
	{
		right:calc(50% + 19px);
	}
	
	#divAppSplashScreen .divSplashLogo2
	{
		background-position:-106px 0px;
		background-size:200px 24px;
		height:11px;
		left:calc(50% + 5px);
		width:12px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo2
	{
		top:calc(50% - 7px);
	}
	
	#divAppSplashScreen .divSplashLogo3
	{
		background-position:-95px -9px;
		background-size:200px 24px;
		height:16px;
		left:calc(50% - 4px);
		width:16px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo3
	{
		top:calc(50% + 5px);
	}
	
	#divAppSplashScreen .divSplashLogo4
	{
		background-position:-124px 0px;
		background-size:200px 24px;
		height:24px;
		width:77px;
	}
	
	#divAppSplashScreen.showAnimation .divSplashLogo4
	{
		left:calc(50% + 17px);
	}
	
	/* ANIMATIONS */
	@keyframes animationLogo1
	{
		0%   {right:200%;}
		1%   {right:200%;}
		100% {right:calc(50% + 19px);}
	}

	@keyframes animationLogo2
	{
		0%   {top:-200%;}
		50%  {top:-200%;}
		100% {top:calc(50% - 7px);}
	}

	@keyframes animationLogo3
	{
		0%   {top:200%;}
		50%  {top:200%;}
		100% {top:calc(50% + 5px);}
	}
	
	@keyframes animationLogo4
	{
		0%   {left:200%;}
		66%  {left:200%;}
		100% {left:calc(50% + 17px);}
	}
}