.calculator-screen {
	width: 100%;
	height: : 100px;
	background-color: #252525;
	color: #fff;
	text-align: right;
	font-size: 36px;
	border: none;
	padding: 0 20px;
	box-sizing: border-box;
}

.calculator-keys {
	width: 100%;
	cursor: pointer;
}

.row {
	display: flex;
}

button {
	height: 80px;
	background-color: gray;
	border: 1px solid black;
	font-size: 32px;
	color: #fff;
	width: 25%;
	outline: none;

}

.all-clear {
	width: 50%
}
.zero-btn {
	width: 25%
}
.operator, .equal-sign {
	background-color: orange;
}

button:hover {
	background-color: darkgray;

    float: left;
    color: #fafafa;
    cursor: pointer;
    outline: none;
  
}

.operator:hover, . equal-sign:hover {
	background-color: darkorange;
}

.calculator {
    width: 300px;
    background: #6e7479;
    border-radius: 5px;
    box-shadow: 0 15px 50px 0 rgba(0,0,0,0.4), 0 15px 20px 0 rgba(0,0,0,0.2);
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    -webkit-transform: translate(-50%, -50%);
    -moz-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    -o-transform: translate(-50%, -50%);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    padding: 10px;
}

.calculator-heading {
	 text-align: center;
    font-size: 30px;
    color: #ffffff;
    padding: 0 0 10px 0;
}

body {
	   background-color: #dcdcdc;
}