body, html { background: #ECEDEF; margin: 0; padding: 0; } .container { position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2), 0 6px 20px 0 rgba(0,0,0,0.2); border-radius: 10px; padding-bottom: 20px; width: 320px; font-family:Assistant; } .display { width: 100%; height: 60px; padding: 40px 0; background: #1D9DF7; border-top-left-radius: 10px; border-top-right-radius: 10px; } .buttons { padding: 20px 20px 0 20px; } .row { width: 280px; float: left; } input[type=button] { width: 60px; height: 60px; float: left; padding: 0; margin: 5px; box-sizing: border-box; background: #ecedef; border: none; font-size: 30px; line-height: 30px; border-radius: 10%; font-weight: 700; color: #5E5858; cursor: pointer; } input[type=text] { width: 270px; height: 60px; float: left; padding: 0; box-sizing: border-box; border: none; background: none; color: #ffffff; text-align: right; font-weight: 700; font-size: 60px; line-height: 60px; margin: 0 25px; } input[type=clr] { width: 270px; height: 60px; float: center; padding: 0; margin: 5px; box-sizing: border-box; background: #ecedef; border: none; font-size: 30px; line-height: 30px; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; font-weight: 700; color: #5E5858; cursor: pointer; text-align: center; } .blue { background: #1D9DF7 !important; color: #ffffff !important; } .reset { background: #DF3535 !important; color: #ffffff !important; /*-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;*/ display: block; }
top of page
Select an option
bottom of page