#preload{
	width:100%;
	height:100%;
	background:#75b23b;
	position:fixed;
	left:0;
	top:0;
	z-index:100000;
}

#prelogo{
	width: 40%;
	margin-left:30%;
	margin-right:30%;
	margin-top:10%;
}

#prelogo img{
	width:100%;
}

#spinnerFrame{
	width:70px;
	heigth:70px;
	position:relative;
	margin:auto;
}

#spinner1, #spinner2{
	border: 4px solid transparent;
	border-radius: 50%;	
	position:absolute;
}

#spinner1{
	width: 70px;
	height: 70px;
	border-top: 4px solid white;
	border-bottom: 4px solid white;
	animation: clockwiseSpin 2s linear 100;
}

#spinner2{
	width: 60px;
	height: 60px;
	border-left: 4px solid white;
	border-right: 4px solid white;
	top:5px; left:5px;
	animation: counterclockwiseSpin 2s linear 100;
}

@keyframes clockwiseSpin{
	from {transform: rotate(0deg);}
	to {transform: rotate(360deg);}
}

@keyframes counterclockwiseSpin{
	from {transform: rotate(0deg);}
	to {transform: rotate(-360deg);}
}

@keyframes fade{
	
	from{opacity:1;}
	to{opacity:0;}
}

/*Mobile*/

@media screen and (max-width: 700px) {
	

#spinnerFrame{
	width:40px;
	heigth:40px;
}

#spinner1{
	width: 40px;
	height: 40px;
}

#spinner2{
	width: 30px;
	height: 30px;
}	

}