@import "https://fonts.googleapis.com/css?family=Press+Start+2P&display=swap";*{box-sizing:inherit;margin:0;padding:0}html{box-sizing:border-box;font-size:62.5%}body{color:#eee;background-color:#222;font-family:"Press Start 2P",sans-serif}header{border-bottom:7px solid #eee;height:35vh;position:relative}main{color:#eee;justify-content:space-around;align-items:center;min-height:60vh;display:flex}.left{flex-direction:column;align-items:center;width:52rem;display:flex}.right{width:52rem;font-size:2rem}h1{text-align:center;width:100%;font-size:4rem;position:absolute;top:52%;left:50%;transform:translate(-50%,-50%)}.number{color:#333;text-align:center;background:#eee;width:15rem;padding:3rem 0;font-size:6rem;position:absolute;bottom:0;left:50%;transform:translate(-50%,50%)}.between{font-size:1.4rem;position:absolute;top:2rem;right:2rem}.again{position:absolute;top:2rem;left:2rem}.clear{position:absolute;top:2rem;left:22rem}.guess{color:inherit;text-align:center;background:0 0;border:4px solid #eee;width:25rem;margin-bottom:3rem;padding:2.5rem;font-family:inherit;font-size:5rem;display:block}.btn{color:#222;cursor:pointer;background-color:#eee;border:none;padding:2rem 3rem;font-family:inherit;font-size:2rem}.btn:hover{background-color:#ccc}.clear:hover{background-color:#d51515}.message{height:3rem;margin-bottom:8rem}.label-score{margin-bottom:2rem}footer{flex-direction:column;gap:5px;display:flex}@media (width<=800px){html{font-size:50%}header{border-bottom:4px solid #eee;grid-template-columns:1fr 1fr;place-items:center;gap:2rem;height:auto;min-height:25vh;padding:2rem;display:grid}main{flex-direction:column;gap:4rem;min-height:auto;padding:4rem 2rem}h1{order:2;grid-column:span 2;margin:2rem 0;font-size:2.5rem;position:static;transform:none}.number{z-index:10;order:4;grid-column:span 2;width:12rem;margin:0 auto -4rem;font-size:4rem;position:static;transform:none}.again{order:1;justify-self:start;position:static}.clear{order:1;justify-self:end;position:static}.between{order:3;grid-column:span 2;font-size:1.6rem;position:static}.left,.right{text-align:center;width:100%;max-width:100%}.guess{max-content:20rem;width:100%;margin:0 auto 3rem}.message{height:auto;margin-bottom:3rem}}