.dialogContainer { display: flex; align-items: center; justify-content: center; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 999999 !important; contain: strict; } .dialog { margin: 0; border-radius: 4px; -webkit-font-smoothing: antialiased; border: 0; padding: 0; will-change: transform; /* Strict does not work well with actionsheet */ contain: style; box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14), 0 6px 30px 5px rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.4); } .dialog-fixedSize { border-radius: 0; max-height: none; max-width: none; } .dialog-fullscreen { /* Needed due to formDialog style */ position: fixed !important; top: 0; bottom: 0; left: 0; right: 0; margin: 0; box-shadow: none; } @media all and (max-width: 1280px), all and (max-height: 720px) { .dialog-fixedSize { position: fixed !important; top: 0 !important; bottom: 0 !important; left: 0 !important; right: 0 !important; margin: 0 !important; box-shadow: none; } } @media all and (min-width: 1280px) and (min-height: 720px) { .dialog-medium { width: 80%; height: 80%; } .dialog-medium-tall { width: 80%; height: 90%; } .dialog-small { width: 60%; height: 80%; } .dialog-fullscreen-border { width: 90%; height: 90%; } } .noScroll { overflow-x: hidden !important; overflow-y: hidden !important; } .dialogBackdrop { background-color: #000; opacity: 0; position: fixed !important; top: 0 !important; bottom: 0 !important; left: 0 !important; right: 0 !important; margin: 0 !important; z-index: 999999 !important; transition: opacity ease-out 0.2s; } .dialogBackdropOpened { opacity: .8; }