
body{

	font-family: helvetica;
	color: #FFFFFF;
	background-color: #111E36;
}

h1{

	top: 2%;
	left: 50%;
	text-align: center;

}

h2 {


	top: 10%;
	left: 50%;
	text-align: center;

}

.box {

	position: absolute;
	width: 90%;
	height: 47%;
	left: 2%;
	top: 20%;
	background: #444444;
	border-radius: 20px; 
}



.text1 {

	position: absolute;
	width: 25%;
	height: 50%;
	left: 10%;
	top: 25%;

}

.text2 {

	position: absolute;
	width: 25%;
	height: 50%;
	left: 30%;
	top: 25%;

}

.text3 {

	position: absolute;
	width: 25%;
	height: 50%;
	left: 50%;
	top: 25%;

}

.text4 {

	position: absolute;
	width: 25%;
	height: 50%;
	left: 70%;
	top: 25%;

}

.text5 {

	color: #111E36;
}

a {

	position: absolute;
	background: #91B7C7;
	padding: 15px 32px;
	text-align: center;
 	text-decoration: none;
  	display: inline-block;
  	font-size: 16px;
  	border-radius: 10px;
}

.button {

	top: 60%;
	left: 48%;
	

}

.button:hover {
	
 background-color: #4CAF50; /* Green */

}




.moveEarth {

	position: absolute;
	left: 2%;
	top: 90%;

}

.moveMars {

	position: absolute;
	left: 90%;
	top: 90%;

}

.root {

	--movementSide; 100px;

}

.moveSpaceship {

	position: absolute;
	left: var(--movementSide);
	top: 91.5%;

}

