#trustedui-container { width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); position: absolute; transition: transform ease 0.5s, opacity 0.5s; } #screen #trustedui-container.up { opacity: 0; transform: translateY(-100%); } #trustedui-inner { position: absolute; width: 86%; height: 86%; top: 7%; left: 7%; transition: transform ease 0.5s, opacity 0.5s; } #screen:not(.trustedui) #trustedui-inner { width: 100%; height: 100%; top: 0; left: 0; } #screen.trustedui #trustedui-container { opacity: 1; visibility: visible; transform: scale(1); } #screen.trustedui #trustedui-container.closing, #screen:not(.trustedui) #trustedui-container.closing { opacity: 0; transform: scale(0.6); } #trustedui-throbber { position: absolute; bottom: 0; left: 0; width: 100%; height: 3px; z-index: 1; } #trustedui-throbber.loading { height: 4px; background-image: url('../shared/progress.gif'); } #trustedui-inner > .title-container { height: 5rem; width: 100%; top: 0; left: 0; position: absolute; } #trustedui-inner > #trustedui-frame-container { position: absolute; top: 5rem; left: 0; width: 100%; height: calc(100% - 5rem); border: none; background-color: #fff; } #trustedui-frame-container > iframe { width: 100%; height: 100%; border: none; } #trustedui-inner iframe:not(.selected) { display: none; }