.container { width: 500px; padding: 15px 0; background-color: #C7B198; border-radius: 10px; } .display { height: 100px; background-color: #DFD3C3; margin: 10px 18px 15px; border: 2px solid #596E79; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-end; font-family: 'Orbitron', sans-serif; font-weight: 500; font-size: 4.3em; padding: 4px; color: #000; } .buttons { display: flex; flex-wrap: wrap; justify-content: center; align-content: center; width: 500px; } .btn { padding: 20px; border: 2px solid #596E79; border-radius: 5px; cursor: pointer; margin: 5px; font-size: 25px; width: 110px; -webkit-transition: all 0.5s; /* add this line, chrome, safari, etc */ -moz-transition: all 0.5s; /* add this line, firefox */ -o-transition: all 0.5s; /* add this line, opera */ transition: all 0.5s; /* add this line */ } #clear { background-color: #F1C93B; } #action { background-color: #7EAA92; } #zero { width: 230px; } #action:hover { background-color: #F0ECE2; } #clear:hover { background-color: #FF6D60; } body { display: flex; justify-content: center; align-content: center; align-items: center; height: 75vh; min-height: 500px; margin-top: 80px; padding: 10px; background-color: #F0ECE2; }