.modal{width:100%;height:100%;position:fixed;z-index:-1;top:0;left:0;transition:var(--transition-movement) var(--transition-speed) all;visibility:hidden;max-height:100%;overflow:auto;display:grid;box-sizing:border-box;grid-template-areas:"top-start top top-end" "center-start center center-end" "bottom-start bottom-center bottom-end";grid-template-rows:minmax(min-content, auto) minmax(min-content, auto) minmax(min-content, auto);grid-template-columns:auto minmax(0, 1fr) auto}.modal.show{z-index:999;opacity:1;visibility:visible}.modal-bg{width:100%;height:100%;position:fixed;background-color:var(--color-gray);opacity:.7;top:0;left:0;z-index:0}.modal-box{width:95%;max-width:1050px;min-height:auto;padding:var(--spacing-xg);transition:var(--transition-movement) var(--transition-speed) all;margin:0;background-color:#fff;z-index:1;-webkit-box-shadow:3px 1px var(--spacing-md) var(--color-gray);box-shadow:3px 1px var(--spacing-md) var(--color-gray);margin:50px auto;grid-column:2;grid-row:2;align-self:center;justify-self:center}.modal-header{width:100%;display:flex;justify-content:space-between;align-items:center;padding-bottom:var(--spacing-md)}.modal-close-button{display:flex}.modal-content{width:100%;height:100%}