fomantic-ui-react/es/dimmer/style/index.css

Fomantic-UI React -- A React Component Library.

.dimmable:not(body){position:relative}.ui.dimmer{display:none;position:absolute;top:0!important;left:0!important;width:100%;height:100%;text-align:center;vertical-align:middle;padding:1em;background:rgba(0,0,0,.85);opacity:0;line-height:1;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-duration:.5s;animation-duration:.5s;transition:background-color .5s linear;flex-direction:column;align-items:center;justify-content:center;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;will-change:opacity;z-index:1000}.ui.dimmer>.content{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text;color:#fff}.ui.segment>.ui.dimmer:not(.page){border-radius:inherit}.ui.dimmer:not(.inverted)::-webkit-scrollbar-track{background:hsla(0,0%,100%,.1)}.ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.25)}.ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:window-inactive{background:hsla(0,0%,100%,.15)}.ui.dimmer:not(.inverted)::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,100%,.35)}.animating.dimmable:not(body),.dimmed.dimmable:not(body){overflow:hidden}.dimmed.dimmable>.ui.animating.dimmer,.dimmed.dimmable>.ui.visible.dimmer,.ui.active.dimmer{display:flex;opacity:1}.ui.disabled.dimmer{width:0!important;height:0!important}.dimmed.dimmable>.ui.animating.legacy.dimmer,.dimmed.dimmable>.ui.visible.legacy.dimmer,.ui.active.legacy.dimmer{display:block}.ui[class*="top aligned"].dimmer{justify-content:flex-start}.ui[class*="bottom aligned"].dimmer{justify-content:flex-end}.ui.page.dimmer{position:fixed;transform-style:"";perspective:2000px;transform-origin:center center}.ui.page.dimmer.modals{-moz-perspective:none}body.animating.in.dimmable,body.dimmed.dimmable{overflow:hidden}body.dimmable>.dimmer{position:fixed}.blurring.dimmable>:not(.dimmer){filter:none;transition:filter .8s ease}.blurring.dimmed.dimmable>:not(.dimmer):not(.popup){filter:blur(5px) grayscale(.7)}.blurring.dimmable>.dimmer{background:rgba(0,0,0,.6)}.blurring.dimmable>.inverted.dimmer{background:hsla(0,0%,100%,.6)}.ui.dimmer>.top.aligned.content>*{vertical-align:top}.ui.dimmer>.bottom.aligned.content>*{vertical-align:bottom}.medium.medium.medium.medium.medium.dimmer{background:rgba(0,0,0,.65)}.light.light.light.light.light.dimmer{background:rgba(0,0,0,.45)}.very.light.light.light.light.dimmer{background:rgba(0,0,0,.25)}.ui.inverted.dimmer{background:hsla(0,0%,100%,.85)}.ui.inverted.dimmer>.content,.ui.inverted.dimmer>.content>*{color:#000}.medium.medium.medium.medium.medium.inverted.dimmer{background:hsla(0,0%,100%,.65)}.light.light.light.light.light.inverted.dimmer{background:hsla(0,0%,100%,.45)}.very.light.light.light.light.inverted.dimmer{background:hsla(0,0%,100%,.25)}.ui.simple.dimmer{display:block;overflow:hidden;opacity:0;width:0;height:0;z-index:-100;background:transparent}.dimmed.dimmable>.ui.simple.dimmer{overflow:visible;opacity:1;width:100%;height:100%;background:rgba(0,0,0,.85);z-index:1}.ui.simple.inverted.dimmer{background:hsla(0,0%,100%,0)}.dimmed.dimmable>.ui.simple.inverted.dimmer{background:hsla(0,0%,100%,.85)}.ui[class*="bottom dimmer"],.ui[class*="center dimmer"],.ui[class*="top dimmer"]{height:auto}.ui[class*="bottom dimmer"]{top:auto!important;bottom:0}.ui[class*="center dimmer"]{top:50%!important;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}.ui.segment>.ui.ui[class*="top dimmer"]{border-bottom-left-radius:0;border-bottom-right-radius:0}.ui.segment>.ui.ui[class*="center dimmer"]{border-radius:0}.ui.segment>.ui.ui[class*="bottom dimmer"]{border-top-left-radius:0;border-top-right-radius:0}.ui[class*="center dimmer"].transition[class*="fade up"].in{-webkit-animation-name:fadeInUpCenter;animation-name:fadeInUpCenter}.ui[class*="center dimmer"].transition[class*="fade down"].in{-webkit-animation-name:fadeInDownCenter;animation-name:fadeInDownCenter}.ui[class*="center dimmer"].transition[class*="fade up"].out{-webkit-animation-name:fadeOutUpCenter;animation-name:fadeOutUpCenter}.ui[class*="center dimmer"].transition[class*="fade down"].out{-webkit-animation-name:fadeOutDownCenter;animation-name:fadeOutDownCenter}.ui[class*="center dimmer"].bounce.transition{-webkit-animation-name:bounceCenter;animation-name:bounceCenter}@-webkit-keyframes fadeInUpCenter{0%{opacity:0;transform:translateY(-40%);-webkit-transform:translateY(calc(-40% - .5px))}to{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}}@keyframes fadeInUpCenter{0%{opacity:0;transform:translateY(-40%);-webkit-transform:translateY(calc(-40% - .5px))}to{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}}@-webkit-keyframes fadeInDownCenter{0%{opacity:0;transform:translateY(-60%);-webkit-transform:translateY(calc(-60% - .5px))}to{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}}@keyframes fadeInDownCenter{0%{opacity:0;transform:translateY(-60%);-webkit-transform:translateY(calc(-60% - .5px))}to{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}}@-webkit-keyframes fadeOutUpCenter{0%{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}to{opacity:0;transform:translateY(-45%);-webkit-transform:translateY(calc(-45% - .5px))}}@keyframes fadeOutUpCenter{0%{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}to{opacity:0;transform:translateY(-45%);-webkit-transform:translateY(calc(-45% - .5px))}}@-webkit-keyframes fadeOutDownCenter{0%{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}to{opacity:0;transform:translateY(-55%);-webkit-transform:translateY(calc(-55% - .5px))}}@keyframes fadeOutDownCenter{0%{opacity:1;transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}to{opacity:0;transform:translateY(-55%);-webkit-transform:translateY(calc(-55% - .5px))}}@-webkit-keyframes bounceCenter{0%,20%,50%,80%,to{transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}40%{transform:translateY(calc(-50% - 30px))}60%{transform:translateY(calc(-50% - 15px))}}@keyframes bounceCenter{0%,20%,50%,80%,to{transform:translateY(-50%);-webkit-transform:translateY(calc(-50% - .5px))}40%{transform:translateY(calc(-50% - 30px))}60%{transform:translateY(calc(-50% - 15px))}}
.dimmer.transition:not(.hidden){display:flex!important}