#calculator {
	width: 400px;
	height: 290px;
	margin-top: 150px;
	margin-right: auto;
	margin-left: auto;
	background-color: red;
	background: linear-gradient(red, yellow, green);
	border-radius: 5px;
	box-shadow: 0px 0px 5px 10px black;
	/*cursor: wait;*/
}
/*This div edits the baqckground and acts as a container*/

#uppersection span#clear {
	float: left;
	background-color: black;
	color: white;
	box-shadow: gray 0px 4px;
}
/*This edits the clear button*/

#uppersection #answer {
	margin: 8px;
	width: 264px;
	height: 42px;
	float: right;
	padding: 0 10px;
	background-color: black;
	box-shadow: inset gray 0 4px;
	color: white;
	border-radius: 3px;
	text-align: right;
	font-size: 28px;
}
/*This sets the answer div*/

#buttons span, #uppersection span#clear {
	margin: 8px;
	width: 84px;
	height: 38px;
	float: left;
	background-color: black;
	color: white;
	box-shadow: gray 0 4px; 
	text-align: center;
	user-select: none;
	border-radius: 3px;
	cursor: pointer;
	padding-bottom: 4px;
	font-size: 22px;	
}
/*This makes the buttons uniform*/

#uppersection span#clear:hover {
	background-color: white;
	color: black;
}

#uppersection span#clear:active {
	box-shadow: none;
	padding-top: 4px;
	padding-bottom: 0px;
}

#buttons span:hover {
	background-color: white;
	color: black;
}

#buttons span:active {
	box-shadow: none;
	padding-top: 4px;
	padding-bottom: 0px;
}