*{
				margin: 0;
				padding: 0;
}
body{
				margin: 0;
				height: 100vh;
				display: flex;
				align-items: center;
				justify-content: center;
				background: radial-gradient(circle at center, blue, skyblue);
				overflow: hidden;
				font-family: system-ui;
}
#calculator{
				width: 300px;
				background-color: black;
				padding: 20px;
				border-radius: 15px;
}
input{
				width: 296px;
				border: none;
				background-color: black;
				color: white;
				font-size: 3rem;
				font-style: italic;
				font-weight: bold;
}
button{
				width: 71px;
				height: 71px;
				border: 0.5px solid white;
				border-radius: 50px;
				font-size: 3rem;
				font-style: italic;
				font-weight: bold;
				transition: 0.3s;
				cursor: pointer;
}
.operator{
				background-color: black;
				color: white;
}
.operator:hover{
				background-color: white;
				color: black;
}
.non-operator{
				background-color: white;
				color: black;
}
.non-operator:hover{
				background-color: black;
				color: white;
}
.pi{
				background: radial-gradient(circle at center, red, orange);
				color: white;
				border: none;
}
.pi:hover{
				background: radial-gradient(circle at center, orange, red);
				color: black;
}
.eq-operator{
				background-color: orange;
				color: white;
				border: none;
}
.eq-operator:hover{
				background-color: white;
				color: orange;
}
.e{
				background-color: yellowgreen;
				color: lemonchiffon;
				border: none;
}
.e:hover{
				background-color: lemonchiffon;
				color: yellowgreen;
}
.inf{
				background: radial-gradient(circle at center, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white);
				color: red;
				border: none;
}
.inf:hover{
				background: radial-gradient(circle at center, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black, white, black);
				color: blue;
}
.clr, .del:hover{
				background-color: red;
				color: white;
				border: none;
}
.clr:hover, .del{
				background-color: white;
				color: red;
				border: none;
}