.popup-bg-container{display:grid;opacity:0;position:fixed;z-index:1;user-select:none;pointer-events:none;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(0, 0, 0, 0.4)}.popup-bg-container.active{opacity:1;user-select:all;pointer-events:all}.popup-bg-container.active .popup-wrapper{scale:1}.popup-close{display:flex;justify-content:flex-end;margin-bottom:1rem;cursor:pointer}.popup-close .popup-close-btn{transition:0.2s}.popup-close .popup-close-btn:hover{transform:scale(1.2);transition:0.2s}.popup-wrapper{margin:auto;width:100%;transition:350ms scale ease-in-out;scale:0}.popup-body{position:relative;padding:2rem 0;background-color:#fff;overflow-y:scroll;-ms-overflow-style:none;scrollbar-width:none}.popup-body::-webkit-scrollbar{display:none}.popup-content{padding:0 3rem;max-width:750px;margin:auto}.popup-media-content{padding:0 2rem;max-width:850px;margin:auto}.popup-banner{background-image:url("../media/bg_image.png");background:linear-gradient(0deg, rgba(219, 255, 0, 0.7), rgba(219, 255, 0, 0.7)), url("../media/bg_image.png");background-size:cover;background-repeat:no-repeat;background-position:center center;padding:2rem 0}.popup-banner .popup-content{padding:0 2rem;max-width:850px;margin:auto}.popup-banner .banner-text{font-size:1.4rem;font-weight:700}.popup-media img{height:100%;object-fit:cover}.popup-quiz{padding:1rem 2rem;max-width:850px;margin:auto}.popup-quiz .quiz-headline{font-size:1.4rem;font-weight:700;padding-bottom:1rem}.btn-modal{font-size:1rem}@media (min-width:576px){.popup-wrapper{max-width:600px}.popup-body{max-height:700px}.popup-quiz{padding:1rem 4rem}}@media (min-width:992px){.popup-wrapper{max-width:960px}.popup-body{max-height:750px}.popup-banner{padding:1rem 0}.popup-quiz{padding:1rem 8rem}}