calc.css

body{
	font-family: sans-serif;
background-color: black;
}
#container{

	height: 800px;
	width: 1500px;
	background-image: url('b.jpg');
	background-image: linear-gradient(rgba(0, 0, 0, 0.3));
	margin: 20px auto ;
}
#calculator{
	width: 320px;
	height: 520px;
	background-color: #eaedef;
	margin-left:250px;
	top: 75px;
	position: relative;
	border-radius: 10px;

}


#result{
	height: 120px;

}


#keyboard{
	height: 400px;
}
#history{
	text-align: right;
	margin: 0 20px;
	height: 20px;
	padding-top:20px;
	font-size: 15px;
	color: #919191; 
}
#output-value{
	text-align: right;
	height: 60px;
	margin: 10px 20px;
	font-size: 30px;
}

.operator,.number,.empty{
	height:50px; 
	margin:15px ;
	width: 50px;
	border-radius: 50%;
	float: left;
	border-width: 0;
	font-weight: bold;
	font-size: 15px;


}


.number,.empty{
	background-color:#eaedef; 
}

.number,.operator{
	cursor: pointer;
}


.operator:active,.number:active{
	font-size: 13px;
}

.operator:focus,.number:focus,.empty:focus{
	outline: 0;
}


button:nth-child(4){
	font-size: 20px;
	background-color:#282abf

}

button:nth-child(8){
	font-size: 20px;
	background-color:#282abf
}

button:nth-child(12){
	font-size: 20px;
	background-color:#282abf

}
button:nth-child(16){
	font-size: 20px;
	background-color: #282abf

}
button:nth-child(20){
	font-size: 20px;
	background-color:#11bf19

}