:root{--main-background: hsl(222, 26%, 31%), --toggle-background: hsl(223, 31%, 20%), --screen-background: hsl(224, 36%, 15%), --special-key-background: hsl(225, 21%, 49%), --special-key-background-hover: hsl(225, 21%, 64%), --special-key-shadow: hsl(224, 28%, 35%), --equal-key-background: hsl(6, 63%, 50%), --equal-key-background-hover: hsl(6, 63%, 55%), --equal-key-shadow: hsl(6, 70%, 34%), --key-background: hsl(0, 0%, 90%), --key-background-hover: hsl(0, 0%, 95%), --key-shadow: hsl(28, 16%, 65%), --key-text: hsl(221, 14%, 31%), --special-key-text: hsl(0, 100%, 100%), --equal-key-text: hsl(0, 100%, 100%), --screen-text: hsl(0, 100%, 100%), }*,*:before,*:after{box-sizing:border-box}body{margin:0;font-family:League Spartan,sans-serif;font-optical-sizing:auto;font-weight:700;font-style:normal;padding:20px;background-color:var(--main-background)}