.main-router-container{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;background-color:#f0f0f0;overflow:hidden}.container-home{display:flex;justify-content:center;text-align:center;align-items:center;height:100vh}.home-detail{display:flex;justify-content:center;max-width:fit-content}@media (min-width: 1200px){.home-detail{max-width:30%}}.home-text{width:80%}h3{font-size:25px}p{font-size:20px;font-weight:100;margin:1rem 0}button{color:#3dd800;font-size:20px;border:none;background:transparent;cursor:pointer}.container-user{height:100vh;background-image:url(/assets/BG-DqmWJagD.gif);background-size:contain;background-repeat:no-repeat;background-position:center;display:flex;justify-content:center;width:100%}.user-detail{display:flex;flex-direction:column;align-items:center;justify-content:space-around;max-width:fit-content}input{height:2rem;width:100%}.select-user{display:flex;flex-direction:column;align-items:start;justify-content:start;width:100%}select{padding:10px;border:1px solid #333;border-radius:5px;background-color:#fff;font-size:16px;cursor:pointer}.container-chapter1{display:flex;justify-content:center;height:100vh;background-size:contain;background-repeat:no-repeat;background-position:center;transition:background-image 2s ease-in-out;width:100%}.chapter1-detail{position:relative;height:100vh;width:auto;max-width:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}@media (min-width: 1200px){.chapter1-detail{max-width:30%}}.detail-text{max-width:90%;border-radius:25px}.btn-chapter1{position:absolute;bottom:5%;right:10%}#detail-text-chapter1{background:#ffffffcd;border-radius:25px}.container-chapter2{display:flex;justify-content:center;height:100vh;background-size:contain;background-repeat:no-repeat;background-position:center;transition:background-image 2s ease-in-out;width:100%}.chapter2-detail{position:relative;height:100vh;max-width:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center}@media (min-width: 1200px){.chapter2-detail{max-width:30%}}.btn-chapter2{position:absolute;bottom:5%;right:10%}#detail-h3-chapter2{margin-top:44vh}.ask-input{display:flex;flex-direction:column;justify-content:center;height:100vh}#detail-text-chapter2{background:#ffffffcd;border-radius:25px;margin-top:25vh}.container-chapter3{display:flex;justify-content:center;height:100vh;background-size:contain;background-repeat:no-repeat;background-position:center;transition:background-image 2s ease-in-out;width:100%}.chapter3-detail{position:relative;height:100vh;max-width:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:space-between;text-align:center}@media (min-width: 1200px){.chapter3-detail{max-width:30%}}.btn-chapter3{position:absolute;bottom:5%;right:10%}#detail-p-chapter3{margin-top:20vh}#detail-h3-chapter3{margin-top:44vh}.container-chapter4{display:flex;justify-content:center;height:100vh;background-size:contain;background-repeat:no-repeat;background-position:center;transition:background-image 2s ease-in-out;width:100%}.chapter4-detail{position:relative;height:100vh;max-width:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}@media (min-width: 1200px){.chapter4-detail{max-width:30%}}.detail-text{width:80%;border-radius:25px}.btn-chapter4{position:absolute;bottom:5%;right:10%}.question-chapter4{text-align:center;padding:35px}@media (min-width: 1200px){.question-chapter4{max-width:30%}}.btn-qsk{display:flex;justify-content:center;gap:10px;margin-top:10px}.btn-qsk button{padding:5px 10px;border:2px solid #333;background-color:#fff;color:#333;font-size:16px;border-radius:5px;cursor:pointer;transition:background-color .3s ease,color .3s ease}.btn-qsk button:hover{background-color:#333;color:#fff}.answer-container{display:flex;flex-direction:column;justify-content:start;align-items:center;text-align:center;max-width:80%}@media (min-width: 1200px){.answer-container{max-width:25%}}.answer-detail{padding-top:10rem;background:#ffffffcd;width:100%;opacity:0;transition:opacity 2s ease-in-out}.message-detail{opacity:0;transition:opacity 1s ease-in-out}.message-detail.fade-in{opacity:1}.fade-content{opacity:1;transition:opacity 2s ease-in-out}.fade-content.show{opacity:1}#detail-p-chapter4{margin-bottom:30vh}.fade-in-line{opacity:0;animation:fadeIn 2s forwards}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.container-chapter5{display:flex;justify-content:center;height:100vh;background-size:contain;background-repeat:no-repeat;background-position:center;transition:background-image 2s ease-in-out;width:100%}.chapter5-detail{position:relative;height:100vh;max-width:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}@media (min-width: 1200px){.chapter5-detail{max-width:30%}}.detail-text{border-radius:25px}.img-chapter5-book{width:200px;height:300px}.btn-chapter5{position:absolute;bottom:5%;right:10%}.show-buttonask{display:flex;flex-direction:column}.show-buttonask button{padding:5px 10px;border:2px solid #333;background-color:#ffffffa0;color:#333;font-size:16px;border-radius:5px;cursor:pointer;transition:background-color .3s ease,color .3s ease}.show-buttonask button:hover{background-color:#333;color:#fff}.fade-text{opacity:0;transition:opacity 3s ease-in-out}#detail-p-chapter6{background:#ffffffcd;border-radius:25px}.container-chapterend{display:flex;justify-content:center;height:100vh;background-size:contain;background-repeat:no-repeat;background-position:center;transition:background-image 2s ease-in-out;width:100%}.chapterend-detail{position:relative;height:100vh;max-width:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:start;text-align:center;padding-top:7rem}@media (min-width: 1200px){.chapterend-detail{max-width:30%}}.btn-chapterend{position:absolute;bottom:5%;right:10%}.fade-text{opacity:0;transition:opacity 1s ease-in-out}.fade-in{opacity:1}.fade-out{opacity:0}.main-container-toyou{width:100%}.container-toyou{display:flex;justify-content:center;height:100vh;width:100%;background-position:center center;background-size:auto 100vh;background-repeat:no-repeat;background-position:center;transition:background-image 2s ease-in-out;position:relative}.toyou-detail{position:relative;height:100vh;max-width:fit-content;display:flex;flex-direction:column;align-items:center;justify-content:start;text-align:center;padding-top:4rem}.toyou-detail span{font-size:14px;margin-top:2rem}.detail-text{width:80vw;border-radius:25px}.btn-toyou{position:absolute;bottom:5%;right:10%}#toyou-p{margin:0;padding:0;font-size:14px;color:#cae5ff}.container-toyou{width:100%;height:100vh;display:flex;flex-direction:column;justify-content:space-between;align-items:center;background-size:auto 100vh;background-position:center center;background-repeat:no-repeat}.toyou-detail{text-align:center;color:#fff;font-size:24px;max-width:80%;margin:auto}.fade-intoyou{opacity:0;transition:opacity 6s ease-in;animation:fadeIn 6s forwards}@keyframes fade-intoyou{to{opacity:1}}.btn-toyou-thankyou button{padding:5px 10px;border:2px solid #e1e1e1;background-color:#66adff4a;color:#fff;font-size:16px;border-radius:5px;cursor:pointer;transition:background-color .3s ease,color .3s ease}.btn-toyou-thankyou button:hover{background-color:#cacaca81;color:#fff}.btn-toyou-thankyou{cursor:pointer;margin-bottom:20px}.floating-message{position:absolute;bottom:40px;font-size:15px;color:#fff;opacity:1;animation:floatUp 14s ease-out forwards}@keyframes floatUp{0%{transform:translateY(0);opacity:0}20%{opacity:1}50%{opacity:1}to{transform:translateY(-1000px);opacity:0}}.btn-books{position:absolute;bottom:0;left:0;padding:1.2rem}.btn-books button{background:#66adff4a;padding:3px;border-radius:5px;color:#fff;font-size:15px}.btn-aboutme{position:absolute;bottom:0;right:0;padding:1.2rem}.btn-aboutme button{background:#66adff4a;padding:3px;border-radius:5px;color:#fff;font-size:15px}.btn-aboutme2{position:absolute;bottom:0;left:0;padding:1.2rem}.btn-aboutme2 button{background:#66adff4a;padding:3px;border-radius:5px;color:#fff;font-size:15px}.books-card{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100vh;text-align:center;background:#ffffff79;border-radius:80% 50%;margin-bottom:4rem}.books-card p{max-width:50%}.books-card img{margin-top:1rem}.btn-book-card{display:flex;justify-content:space-between}.btn-book-card button{width:5rem;height:2rem;margin:0 2rem;background:#51a2ffdc;padding:3px;border-radius:5px;color:#fff;font-size:3vw}.book-namebook{font-size:4vw}.book-details{font-size:3vw}.profile-card{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;text-align:center;background:#ffffff79;border-radius:50% 80%;margin-bottom:4rem}.profile-detail{display:flex;flex-direction:column;align-items:center;justify-content:center}.profile-detail .education{margin:0;padding:0}.contantflex{display:flex;flex-direction:column}.contantflex a{cursor:pointer;margin-top:5px}.about-profile{padding:0 2rem;max-width:80%}.name{font-size:4vw}.age,.education,.about-profile,.contact-profile{font-size:3vw}.img-toyou-book{width:200px;height:300px}.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;color:#fff}.popup-content{background:#65baffe4;padding:20px;border-radius:100% 60%;position:relative;width:300px;text-align:center}.qr-container{display:flex;flex-direction:column;align-items:center;justify-content:center}.qr-container img{width:100%;max-width:150px;margin-bottom:10px}.close-button{position:absolute;top:10px;right:10px;background:none;border:none;font-size:20px;cursor:pointer;color:#000}.copy-notice{color:#fff;font-size:10px;margin-top:5px;position:absolute;right:0;bottom:30px}.copyable{display:flex;position:relative;margin:0;padding:0}.name-account-bank{margin:0;padding:0}.copyable img{width:20px;cursor:pointer;margin-left:4px}*{margin:0;padding:0;box-sizing:border-box}@media (max-width: 480px){p{font-size:15px}.img-toyou-book,.img-chapter5-book{width:100px;height:auto}.show-buttonask button{font-size:13px}}
