*{margin:0;padding:0;box-sizing:border-box}body{font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;background:#eeeeee}header{display:flex;justify-content:center;height:8rem}h1{text-align:center;font-size:2rem;text-transform:uppercase;padding:.5rem;color:#fff;background:#814a59}h2{background:#814a59;color:#fff;text-transform:uppercase;text-align:center;padding:.5rem 1rem;margin:.5rem 0}.content{background:#eeeeee;position:absolute;top:8rem;bottom:0;left:0;width:100vw;padding:1rem}.content .areas{position:absolute;width:100%;height:100%;display:flex;flex-direction:column;justify-content:top;gap:1rem}.content .areas .area{border:1px solid #814a59;color:#814a59;text-align:center;padding:1rem 0;font-size:2rem;cursor:pointer}.modal{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#fffa;display:flex;flex-direction:column;justify-content:center;align-items:center}.modal .contingut{background:white;border:1px solid #000000AA;box-shadow:0 3px 3px 3px #0002;max-width:80%}.modal .contingut .body{padding:1rem;display:flex;flex-direction:column;justify-content:center;align-items:center}.modal .contingut .footer{display:flex;flex-direction:row;justify-content:center;align-items:center}button{padding:.5rem 1rem;margin:.5rem;cursor:pointer}.teclat{display:flex;flex-direction:column;position:fixed;justify-content:center;align-items:center;width:100vw;background:#FFFFFFAA;bottom:1rem;padding:2rem}.teclat .tecla{display:inline-block;color:#000;margin:.2rem;font-size:2rem;background-size:contain;width:55px;height:55px;text-align:center;padding-top:9px;cursor:pointer;background-image:url(tecla.ac7dc0c1b6cfb507.png)}.teclat .espai{display:inline-block;color:#000;margin:.2rem;font-size:2rem;background-size:contain;width:220px;height:55px;text-align:center;padding-top:9px;cursor:pointer;background-image:url(espai.56f1f24c917a1115.png)}