* {
	margin: 0;
	padding: 0;
	background-color: white;
}

/* Raffles Automation */
.Name {
	font-family: sans-serif;
	font-size: 50px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	margin-top: 0px;
}

/* Email Address */
.Contact {
	font-family: serif;
	font-size: 20px;
	text-align: center;
	margin-top: 100px;
	margin-left: auto;
	margin-right: auto;
}

/* Coming soon title */
.ComingSoon {
	font-family: serif;
	font-size: 40px;
	text-align: center;
	margin-top: 20px;
	margin-left: auto;
	margin-right: auto;
}

/* Raffles Log */
.logo {
	display: block;
	margin-top: 100px;
	margin-left: auto;
	margin-right: auto;
	max-width: 10%;
	height: 200px;
	background-image: url(Logo.jpeg);
	background-size: contain;
	background-repeat: no-repeat;
}

/* Staff Login button */
.btn {
	position: absolute;
	top: 1px;
	right: 1px;
	border: none;
	color: white;
	padding: 15px 32px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 16px;
	cursor: pointer;
	background-color: #11386f;
	border-radius: 12px;
}

/* Style all font awesome icons */
.fa {
	padding: 15px;
	font-size: 30px;
	width: 30px;
	text-align: center;
	text-decoration: none;
	border-radius: 50%;
}

/* Add a hover effect if you want */
.fa:hover {
	opacity: 0.7;
}

/* Set a specific color for each brand */
/* Facebook */
.fa-facebook {
	position: absolute;
	top: 445px;
	left: 46%;
	background: #3B5998;
	color: white;
}

/* Twitter */
.fa-twitter {
	position: absolute;
	top: 445px;
	left: 880px;
	background: #55ACEE;
	color: white;
}

/* Instagram */
.fa-instagram {
	position: absolute;
	top: 445px;
	right: 46%;
	background: #125688;
	color: white;
}

/* Whatsapp */
.fa-whatsapp {
	position: absolute;
	top: 445px;
	left: 1060px;
	background: #00b489;
	color: white;
}

/* When the screen is larger than 1440px width wise */
@media only screen and (min-width: 1440px) {
	/* Raffles Log */
	.logo {
		max-width: 10%;
	}
	
	/* Raffles Automation */
	.Name {
		font-size: 50px;
		margin-top: 0px;
	}
	
	/* Coming soon title */
	.ComingSoon {
		font-size: 40px;
	}
	
	/* Email Address */
	.Contact {
		font-size: 20px;
	}
	
	/* Staff Login button */
	.btn {
		font-size: 16px;
	}
	
	/* Style all font awesome icons */
	.fa {
		font-size: 30px;
		width: 30px;
	}
	
	/* Set a specific color for each brand */
	/* Facebook */
	.fa-facebook {
		top: 445px;
		left: 45%;
	}

	/* Instagram */
	.fa-instagram {
		top: 445px;
		right: 45%;
	}
}

/* When the screen is larger than 1080px width wise */
@media only screen and (max-width: 1080px) and (min-width: 1439px;) {
	/* Set a specific color for each brand */
	/* Facebook */
	.fa-facebook {
		top: 445px;
		left: 40%;
	}

	/* Instagram */
	.fa-instagram {
		top: 445px;
		right: 40%;
	}
}

/* When the screen is less than 900px width wise */
@media only screen and (min-width: 900px) and (max-width: 1079px) {
	/* Raffles Log */
	.logo {
		max-width: 15%;
	}
	
	/* Raffles Automation */
	.Name {
		font-size: 45px;
		margin-top: -10px;
	}
	
	/* Coming soon title */
	.ComingSoon {
		font-size: 35px;
	}
	
	/* Email Address */
	.Contact {
		font-size: 18px;
	}
	
	/* Staff Login button */
	.btn {
		font-size: 14px;
	}
	
	/* Style all font awesome icons */
	.fa {
		font-size: 25px;
		width: 25px;
	}
	
	/* Set a specific color for each brand */
	/* Facebook */
	.fa-facebook {
		top: 420px;
		left: 43%;
	}

	/* Instagram */
	.fa-instagram {
		top: 420px;
		right: 43%;
	}
}

/* When the screen is less than 600px width wise */
@media only screen and (min-width: 600px) and (max-width: 899px) {
	/* Raffles Log */
	.logo {
		max-width: 20%;
	}
	
	/* Raffles Automation */
	.Name {
		font-size: 40px;
		margin-top: -12px;
	}
	
	/* Coming soon title */
	.ComingSoon {
		font-size: 30px;
	}
	
	/* Email Address */
	.Contact {
		font-size: 16px;
	}
	
	/* Staff Login button */
	.btn {
		font-size: 12px;
	}
	
	/* Style all font awesome icons */
	.fa {
		font-size: 20px;
		width: 20px;
	}
	
	/* Set a specific color for each brand */
	/* Facebook */
	.fa-facebook {
		top: 400px;
		left: 40%;
	}

	/* Instagram */
	.fa-instagram {
		top: 400px;
		right: 40%;
	}
}

/* When the screen is less than 400px width wise */
@media only screen and (min-width: 400px) and (max-width: 599px) {
	/* Raffles Log */
	.logo {
		max-width: 25%;
	}
	
	/* Raffles Automation */
	.Name {
		font-size: 30px;
		margin-top: -17px;
	}
	
	/* Coming soon title */
	.ComingSoon {
		font-size: 20px;
	}
	
	/* Email Address */
	.Contact {
		font-size: 14px;
	}
	
	/* Staff Login button */
	.btn {
		font-size: 10px;
	}
	
	/* Style all font awesome icons */
	.fa {
		font-size: 15px;
		width: 15px;
	}
	
	/* Set a specific color for each brand */
	/* Facebook */
	.fa-facebook {
		top: 380px;
		left: 37%;
	}

	/* Instagram */
	.fa-instagram {
		top: 380px;
		right: 37%;
	}
}

/* When the screen is less than 399px width wise */
@media only screen and (max-width: 399px) {
	/* Raffles Log */
	.logo {
		max-width: 30%;
	}
	
	/* Raffles Automation */
	.Name {
		font-size: 25px;
		margin-top: -22px;
	}
	
	/* Coming soon title */
	.ComingSoon {
		font-size: 15px;
	}
	
	/* Email Address */
	.Contact {
		font-size: 12px;
	}
	
	/* Staff Login button */
	.btn {
		font-size: 8px;
	}
	
	/* Style all font awesome icons */
	.fa {
		font-size: 10px;
		width: 10px;
	}
	
	/* Set a specific color for each brand */
	/* Facebook */
	.fa-facebook {
		top: 360px;
		left: 33%;
	}

	/* Instagram */
	.fa-instagram {
		top: 360px;
		right: 33%;
	}
}