.center{display:flex;align-items:center;justify-content:center}.center,.menu{width:100%;height:100%}.menu{position:relative}#toggle{display:none}.toggle-btn,.toggle-btn2{width:60px;height:60px;display:flex;align-items:center;justify-content:center;cursor:pointer}.toggle-btn span{font-size:40px;color:#6d99d6}.page{height:100%;position:absolute;top:0;left:0;font-family:poppins;justify-content:center;flex-direction:column;transition:.3s}.head,.page{width:100%;display:flex;align-items:center}.head{height:60px;font-size:18px;font-family:500}.toggle-btn2 span{font-size:40px}.title{margin-left:5px;transition:.25s}.content{flex-grow:1;width:100%;display:flex;align-items:center;justify-content:center;transition:.2s ease-out}#toggle:checked~.page{transform:translate(10%,5%);border-radius:3mm;left:0!important}@media (max-width:768px){#toggle:checked~.page{transform:translate(5%,3%);border-radius:2mm}.head{height:50px;font-size:16px}.toggle-btn,.toggle-btn2{width:50px;height:50px}}#toggle:checked~.page .head .toggle-btn2{opacity:0;z-index:-1}#toggle:checked~.page .head .title{transform:translateX(-40px)}#toggle:checked~.page .content{opacity:0}.toggle-btn2{transition:.2s ease-out}#toggle:checked~#page2{transform:translate(16%,12%);border-radius:3mm;left:0!important}#toggle:checked~#page3{transform:translate(24%,20%);border-radius:3mm;left:0!important}#toggle:checked~#page4{transform:translate(32%,28%);border-radius:3mm;left:0!important}#toggle:checked~#page5{transform:translate(40%,36%);border-radius:3mm;left:0!important}#toggle:checked~#page6{transform:translate(48%,44%);border-radius:3mm;left:0!important}@media (max-width:768px){#toggle:checked~#page2{transform:translate(8%,6%);border-radius:2mm}#toggle:checked~#page3{transform:translate(12%,10%);border-radius:2mm}#toggle:checked~#page4{transform:translate(16%,14%);border-radius:2mm}#toggle:checked~#page5{transform:translate(20%,18%);border-radius:2mm}#toggle:checked~#page6{transform:translate(24%,22%);border-radius:2mm}}