html, body {
	height: 100%;
	width: 100%;
	background-color: #ff7800;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}

a {
	border: none;
	background: none;
	outline: none;
	text-decoration: none;

	font-size: 5rem;
	font-weight: 400;
	color: black;

	border-radius: 50px;
	background: linear-gradient(145deg, #ff8000, #e66c00);
	box-shadow:  20px 20px 60px #d96600, -20px -20px 60px #ff8a00;
	padding: 3rem;
	aspect-ratio: 1/1;

	text-align: center;

	transition: 0.5s ease;

	cursor: pointer;
}

a:hover {
	border-radius: 50px;
	background: linear-gradient(145deg, #e66c00, #ff8000);
	box-shadow:  20px 20px 60px #d96600, -20px -20px 60px #ff8a00;
}

a:active {
	border-radius: 50px;
	background: #ff7800;
	box-shadow: inset 20px 20px 60px #d96600,
        	    inset -20px -20px 60px #ff8a00;
}