*{
	box-sizing: border-box;
	margin: 0;
}

.wrapper{
	height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
	background: rgba(0,0,0,0.7);
}

.calculator{
	width: 300px;
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	grid-template-rows: 75px 75px 75px 75px 75px 75px;
	background: black;
	color: white;
margin: auto;

}

.calculator> div{
	border-color: grey;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid grey;
	cursor: pointer;
	font-size: 20px;
}
.calculator> div:nth-child(1){
	grid-column: 1/5;
}
.calculator> div:nth-child(18){
	grid-column: 1/3;
	justify-content: flex-start;
    padding-left: 33px;
}
#inp{
	    height: 100%;
    border: none;
    width: 100%;
    background: black;
    color: grey;
    text-align: right;
    font-size: 50px;
    padding-right: 10px;
}
.calculator .orangeBG{
	background: rgb(240, 120, 10)!important;
	color: white;
}
.greyBG{
	background: rgb(172, 172, 175);
	color: grey;
}

@media all and (max-width: 460px){
.calculator{
	grid-template-rows: 100px 100px 100px 100px 100px 100px;
	width: 90%;
}



}