style.css

body {
	background-image: url("img/footerimage.png");
	background-repeat: no-repeat;
	background-size: contain;
	background-attachment:fixed;
	background-position:center bottom;
	background-color: #95D7E5;
	font-family: 'Montserrat', sans-serif;
	color: #3A3A3A;
}
#maincontent {
	text-align: center;
	background-color: #EDEDEB;
	margin: 10px;
	padding: 10px;
	width: 100%;
	position: absolute;
  	left: 50%;
  	top: 40%;
	transform: translate(-50%, -50%)
}
#maincontent p {
	width: 40%;	
	text-align: center;
	display: inline-block;
}
#h1 {
	text-align: center;
}
#hello {
	font-size: 40px;
	text-align: center;
}
p {
	font-size: 20px;
	text-align: center;
}
#emojitext {
	font-size: 20px;
}
#welcome {
	position: absolute;
  	left: 50%;
  	top: 40%;
	transform: translate(-50%, -50%)
}
#join, #signin {
	display:inline-block;
	margin: 20px;
	padding: 20px;	
	font-size: 20px;
	opacity: 0.8;
}
#join:hover, #signin:hover {
	transition:all 0.2s;
	opacity: 1;
}
#join {
	background-color: #32A8CC;
	color: #3A3A3A;
	border-radius: 20px;
}
#signin {
	background-color: #3A3A3A;	
	color: #EDEDEB;
    border-radius: 20px;
}
header img {
    padding-left: 10px;
    padding-right: 10px;
    margin-top: 10px;
}
#debilitating, #intense, #mild, #nopain {
	font-family: "Times New Roman";
	font-size: 100px;
	display:inline-block;
	margin: 10px;
	padding: 10px;
	opacity: 0.5;
	text-align: center;
}

#debilitating:hover, #intense:hover, #mild:hover, #nopain:hover {
	font-size: 120px;
	opacity: 1;
	transition:all 0.2s;
}