*{margin:0;padding:0;font-size:10px;box-sizing:border-box;transition:all ease .3s}html{background-color:#ccd5ae}.wrapper{max-width:660px;margin:auto;padding:3rem;text-align:center;position:relative}@media screen and (max-width: 540px){.wrapper{padding:2rem}}.field{width:100%;padding-bottom:100%;position:relative;background-color:#e9edc9;margin-bottom:2rem}@media screen and (max-width: 540px){.field{margin-bottom:3rem}}.item{cursor:pointer;font:3rem/1.2 sans-serif;color:#d4a373;background-color:#fefae0;position:absolute;top:0;left:0;border:#faedcd solid;border-radius:5px}.item_3x3{width:33.3333333333%;height:33.3333333333%}.item_4x4{width:25%;height:25%}.item_5x5{width:20%;height:20%}.item_6x6{width:16.6666666667%;height:16.6666666667%}.item_7x7{width:14.2857142857%;height:14.2857142857%;border:#faedcd 1px solid;font:2rem/1.2 sans-serif}.item_8x8{width:12.5%;height:12.5%;font:2rem/1.2 sans-serif;border:#faedcd 1px solid}.btn{font:3rem/1.2 sans-serif;padding:2%;color:#ccd5ae;background-color:#d4a373;border:none;border-radius:5px;cursor:pointer}@media screen and (max-width: 540px){.btn{font:2rem/1.2 sans-serif;padding:1rem}}.options__field{width:30%;color:#d4a373;background-color:#ccd5ae;text-align:center;font-size:3rem;margin-right:2rem;border:#faedcd solid;border-radius:5px}@media screen and (max-width: 540px){.options__field{font:2rem/1.2 sans-serif;padding:.5rem}}.options__option{width:30%;color:#d4a373;background-color:#ccd5ae;text-align:center;font-size:3rem;margin-right:2rem;border:#faedcd solid;border-radius:5px}@media screen and (max-width: 540px){.options__option{font:2rem/1.2 sans-serif;padding:.5rem}}.container{width:100%;display:flex;justify-content:space-around;margin-bottom:1rem}.template__count,.template__timer,.template__sound{font-size:3rem;padding:.5rem 1rem;color:#ccd5ae;background-color:#d4a373;border-radius:5px}@media screen and (max-width: 540px){.template__count,.template__timer,.template__sound{font:2rem/1.2 sans-serif;padding:1rem}}@media screen and (max-width: 420px){.template__count,.template__timer,.template__sound{font:1.5rem/1.2 sans-serif;padding:.5rem}}.template__sound{display:flex;align-items:center}.template__sound>input{margin-left:1rem;display:block;transform:scale(2);cursor:pointer}.popup{z-index:5;position:absolute;right:0;display:flex;align-items:center;width:100%;height:82%;border-radius:1rem;padding:3rem;color:#ccd5ae;background-color:#d4a373;font-size:5rem}@media screen and (max-width: 540px){.popup{font:3.5rem/1.2 sans-serif;height:83%}}@media screen and (max-width: 420px){.popup{font:3rem/1.2 sans-serif}}@media screen and (max-width: 400px){.popup{height:78%}}.hidden{display:none}