.overlay-leave-active{transition:opacity .6s ease,-webkit-backdrop-filter .6s ease;transition:opacity .6s ease,backdrop-filter .6s ease;transition:opacity .6s ease,backdrop-filter .6s ease,-webkit-backdrop-filter .6s ease}.overlay-leave-active .close{transition:opacity .3s}.overlay-leave-active .modal{transition:transform .3s}.overlay-enter-active{transition:opacity .3s ease,-webkit-backdrop-filter .6s ease;transition:opacity .3s ease,backdrop-filter .6s ease;transition:opacity .3s ease,backdrop-filter .6s ease,-webkit-backdrop-filter .6s ease}.overlay-enter-active .close{transition:opacity .3s}.overlay-enter-active .modal{transition:transform .6s}.overlay-enter-from,.overlay-leave-to{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);opacity:0}.overlay-enter-from .close,.overlay-leave-to .close{opacity:0}.overlay-enter-from .modal.modal-right,.overlay-leave-to .modal.modal-right{transform:translate(100%)}.overlay-enter-from .modal.modal-left,.overlay-leave-to .modal.modal-left{transform:translate(-100%)}.overlay .modal.modal-right{border-radius:16px 0 0 16px}.overlay .modal.modal-right .modal-inner{padding-left:calc(var(--padding-outofgrid)*2);padding-right:calc(var(--padding-outofgrid)*2);width:calc(var(--onecol-width)*4 + var(--gap)*3 + var(--viewport-spacing)/2)}@media (min-width: 640px){.overlay .modal.modal-right .modal-inner{width:calc(var(--onecol-width)*6 + var(--gap)*5 + var(--viewport-spacing)/2)}}@media (min-width: 768px){.overlay .modal.modal-right .modal-inner{padding-left:var(--two-gap);padding-right:calc(var(--padding-outofgrid)*2);width:calc(var(--onecol-width)*8 + var(--gap)*7 + var(--viewport-spacing)/2 + var(--two-gap))}}@media (min-width: 1024px){.overlay .modal.modal-right .modal-inner{padding-left:var(--two-gap);padding-right:calc(var(--padding-outofgrid)*2);width:calc(var(--onecol-width)*6 + var(--gap)*5 + var(--viewport-spacing)/2 + var(--two-gap))}}@media (min-width: 1536px){.overlay .modal.modal-right .modal-inner{padding-left:var(--two-gap);padding-right:calc(var(--padding-outofgrid)*2);width:calc(var(--onecol-width)*4 + var(--gap)*3 + var(--viewport-spacing)/2 + var(--two-gap))}}.overlay .modal.modal-right .modal-inner .modal-container{margin-left:calc(var(--two-gap)*-1);margin-right:calc(var(--two-gap)*-1);padding-left:var(--two-gap);padding-right:var(--two-gap)}@media (min-width: 640px){.overlay .modal.modal-right .modal-inner .modal-container{margin-left:calc(var(--onecol-width)/-2);margin-right:calc(var(--onecol-width)/-2);padding-left:calc(var(--onecol-width)/2);padding-right:calc(var(--onecol-width)/2)}}@media (min-width: 768px){.overlay .modal.modal-right .modal-inner .modal-container{margin-left:calc((var(--gap)/2 + var(--onecol-width))*-1);margin-right:calc((var(--two-gap) + var(--onecol-width))*-1);padding-left:calc(var(--gap)/2 + var(--onecol-width));padding-right:calc(var(--two-gap) + var(--onecol-width))}}.overlay .modal.modal-left{border-radius:0 16px 16px 0}.overlay .modal.modal-left .modal-inner{padding-left:calc(var(--padding-outofgrid)*2);padding-right:calc(var(--padding-outofgrid)*2);width:calc(var(--onecol-width)*4 + var(--gap)*3 + var(--viewport-spacing)/2)}@media (min-width: 640px){.overlay .modal.modal-left .modal-inner{width:calc(var(--onecol-width)*6 + var(--gap)*5 + var(--viewport-spacing)/2)}}@media (min-width: 768px){.overlay .modal.modal-left .modal-inner{padding-left:calc(var(--padding-outofgrid)*2);padding-right:var(--two-gap);width:calc(var(--onecol-width)*8 + var(--gap)*7 + var(--viewport-spacing)/2 + var(--two-gap))}}@media (min-width: 1024px){.overlay .modal.modal-left .modal-inner{padding-left:calc(var(--padding-outofgrid)*2);padding-right:var(--two-gap);width:calc(var(--onecol-width)*6 + var(--gap)*5 + var(--viewport-spacing)/2 + var(--two-gap))}}@media (min-width: 1536px){.overlay .modal.modal-left .modal-inner{padding-left:calc(var(--padding-outofgrid)*2);padding-right:var(--two-gap);width:calc(var(--onecol-width)*4 + var(--gap)*3 + var(--viewport-spacing)/2 + var(--two-gap))}}.overlay .modal.modal-left .modal-inner .modal-container{margin-left:calc(var(--two-gap)*-1);margin-right:calc(var(--two-gap)*-1);padding-left:var(--two-gap);padding-right:var(--two-gap)}@media (min-width: 640px){.overlay .modal.modal-left .modal-inner .modal-container{margin-left:calc(var(--onecol-width)/-2);margin-right:calc(var(--onecol-width)/-2);padding-left:calc(var(--onecol-width)/2);padding-right:calc(var(--onecol-width)/2)}}@media (min-width: 768px){.overlay .modal.modal-left .modal-inner .modal-container{margin-left:calc((var(--two-gap) + var(--onecol-width))*-1);margin-right:calc((var(--gap)/2 + var(--onecol-width))*-1);padding-left:calc(var(--two-gap) + var(--onecol-width));padding-right:calc(var(--gap)/2 + var(--onecol-width))}}