.frm-overlay--wrapper { position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; z-index: 1002; color:white; } .frm-overlay--wrapper:before { content: ''; display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: rgba( 16, 24, 40, 0.85 ); z-index: 1; } .frm-overlay--close { position: absolute; top: 32px; right: 32px; z-index:10; display:block; width: 32px; height: 32px; background: url( '../images/overlay/close-overlay.svg' ) no-repeat; cursor: pointer; } body.admin-bar:not(.frm-full-screen) .frm-overlay--close { top:40px; } .frm-overlay--container { text-align: center; position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; z-index:8; max-width: 468px; height: 260px; } .frm-overlay--container .frm-overlay--heading { margin-bottom: var( --gap-xs ); font-weight: 600; color: white; } .frm-overlay--container .frm-overlay--cta { margin-top: var(--gap-lg); justify-content: center; gap: var( --gap-sm ); } .frm-overlay--container .frm-overlay--cta a:nth-child(2){ color: white; background: var( --primary-color ); } .frm-overlay--hero-image, .frm-overlay--heading, .frm-overlay--copy, .frm-overlay--cta a { opacity:0.0; transform: matrix3d( 1,0,0,0,0,1,0,-0.00095,0,0,1,0,0,0,0,1 ) translateY( 15px ) scale3d( 0.92, 0.92, 1 ); } .frm-overlay--wrapper.frm-active .frm-overlay--hero-image, .frm-overlay--wrapper.frm-active .frm-overlay--heading, .frm-overlay--wrapper.frm-active .frm-overlay--copy, .frm-overlay--wrapper.frm-active .frm-overlay--cta a { opacity:1; transform: matrix3d( 1,0,0,0,0,1,0,0,0,0,1,0,0,0,0,1 ) translateY( 0px ) scale3d( 1, 1, 1 ); transition: 0.35s transform, 0.5s opacity linear; } .frm-overlay--wrapper.frm-active .frm-overlay--hero-image { transition-delay: 0.05s; } .frm-overlay--wrapper.frm-active .frm-overlay--heading { transition-delay: 0.05s; } .frm-overlay--wrapper.frm-active .frm-overlay--copy { transition-delay: 0.1s; } .frm-overlay--wrapper.frm-active .frm-overlay--cta a:nth-child(1) { transition-delay: 0.15s; } .frm-overlay--wrapper.frm-active .frm-overlay--cta a:nth-child(2) { transition-delay: 0.2s; }