Calculadora

:root{
	--cor1: #00326B;
	--cor2: #4795EE;
	--cor3: #006CEB;
}

.contentor{
	background-color: var(--cor3);
	padding: 2%;
	border-radius: 12px;
	border-style: solid;
	border-color: var(--cor1);
	width: 50%;
}
.linha{
	width: 100%;
	margin-bottom: 1%;
}
.linha input{
	border: none;
	font-size: xx-large;
	text-align: right;
	width: 90%;
	padding: 5%;
	border-radius: 12px;
}
.linha input:focus{
	outline: none;
}
.bt{
	width: 22%;
	padding: 5% 0.5%;
	margin: 0.5%;
	background-color: var(--cor1);
	color: var(--cor2);
	border-radius: 12px;
	text-align: center;
	font-size: large;
	display: inline-block;
}
.oper{
	background-color: var(--cor2);
	color: var(--cor1);
	font-style: bolder;
}
.bt:hover{
	background-color: var(--cor2);
	color: var(--cor1);
	cursor: pointer;
}
.oper:hover{
	background-color: var(--cor1);
	color: var(--cor2);
	cursor: pointer;
}
.oper:active{
	background-color: red;
}