body{color:#fff;margin:0;font-family:sans-serif;font-size:x-large}#app{justify-content:end;display:flex}#main{opacity:0;flex-direction:column;justify-content:center;align-items:center;width:50%;height:100%;transition:opacity .6s;display:flex;position:absolute}#main.hidden{opacity:0;pointer-events:none}#next{opacity:0;pointer-events:none;cursor:pointer;border:none;border-radius:20px;width:40%;padding:5px;font-size:20px;transition:opacity .5s}#next.visible{opacity:1;pointer-events:auto}.slide{opacity:0;text-align:center;padding:20px;transition:opacity .5s,transform .5s;display:none;transform:translateY(-30px)}.slide.active{display:block}.slide.visible{opacity:1;transform:translateY(0)}.slide.exit{opacity:0;transform:translateY(30px)}#info-panel{opacity:0;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;width:50%;height:100%;transition:opacity .3s,transform .3s;display:flex;position:absolute}#info-panel #content{background:#0d0d0e;border-radius:8px;width:70%;padding:30px}#info-panel button{background:#e77474;border:none;border-radius:20px;width:100%;padding:5px;font-size:20px}#info-panel img{width:100%}#info-panel.visible{opacity:1;pointer-events:auto;transform:translate(0)translateY(0)}