.modal-container{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;transform:scale(0);z-index:999}.modal-container.active{transform:scaleY(.01) scaleX(0);animation:unfoldIn 1s cubic-bezier(.165,.84,.44,1) forwards}.modal-container.active .modal-background .modal{transform:scale(0);animation:zoomIn .5s cubic-bezier(.165,.84,.44,1) .8s forwards}.modal-container.active.close{transform:scale(1);animation:unfoldOut 1s cubic-bezier(.165,.84,.44,1) .3s forwards}.modal-container.active.close .modal-background .modal{animation:zoomOut .5s cubic-bezier(.165,.84,.44,1) forwards}.modal-container .modal-background{position:absolute;inset:0;background:rgba(0,0,0,.8);display:flex;justify-content:center;align-items:center}.modal-container .modal-background .modal{background:#fff;width:auto;max-width:500px;max-height:-moz-fit-content;max-height:fit-content;padding:1rem;display:inline-block;border-radius:3px;font-weight:300;position:relative}.modal-container .modal-background .modal img{display:block;object-fit:contain}.modal-container .modal-header-wrapper{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.modal-container .modal-header-wrapper .modal-close-button{display:flex;align-items:center;justify-content:center;width:1.5rem;height:1.5rem;padding:0;border-radius:50%;color:#e91e63;background-color:#fff;box-shadow:0 3px 10px rgba(0,0,0,.2);border:none;transform:rotate(0deg);cursor:pointer}.modal-container .modal-header-wrapper .modal-close-button:hover{background-color:#f26622;transform:rotate(90deg);color:#fff;transition:all .4s ease-in-out}@keyframes unfoldIn{0%{transform:scaleY(.005) scaleX(0)}50%{transform:scaleY(.005) scaleX(1)}to{transform:scaleY(1) scaleX(1)}}@keyframes unfoldOut{0%{transform:scaleY(1) scaleX(1)}50%{transform:scaleY(.005) scaleX(1)}to{transform:scaleY(.005) scaleX(0)}}@keyframes zoomIn{0%{transform:scale(0)}to{transform:scale(1)}}@keyframes zoomOut{0%{transform:scale(1)}to{transform:scale(0)}}