.modal{animation:popUpModal .7s .2s forwards;background-color:var(--color-purple);box-shadow:10px 10px #000;color:var(--color-white);display:flex;flex-direction:column;gap:20px;left:50%;max-width:100%;padding:20px 40px;position:fixed;text-align:center;top:50%;transform:scale(0) translate(-50%,-50%);width:500px;z-index:99}@media only screen and (max-width:48em){.modal{padding:20px;width:82%}}.modal .title{font-size:2.2rem}@media only screen and (max-width:48em){.modal .title{font-size:1.6rem}}.modal .body{font-family:var(--font-secondary);line-height:1.3}.modal:before{clip-path:polygon(0 100%,100% 0,100% 100%);right:100%}.modal:after,.modal:before{background-color:var(--color-purple);content:"";height:100%;position:absolute;top:0;width:5px}.modal:after{clip-path:polygon(0 0,100% 0,0 100%);left:100%}.modal strong{font-family:var(--font-primary)}.modal span{background-color:var(--color-black)}.modal a,.modal button,.modal span{color:var(--color-black)}.modal a,.modal button{background-color:var(--color-primary);cursor:pointer;font-family:var(--font-primary);font-size:.8rem;padding:10px 30px;text-transform:uppercase}.callout-menu .modal{left:60%}@keyframes popUpModal{0%{transform:scale(0) translate(-50%,-50%)}25%{transform:scale(1.05) translate(-50%,-50%)}50%{transform:scale(.97) translate(-50%,-50%)}75%{transform:scale(1.01) translate(-50%,-50%)}to{transform:scale(1) translate(-50%,-50%)}}