#blazor-error-ui { background: lightyellow; bottom: 0; box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2); display: none; left: 0; padding: 0.6rem 1.25rem 0.7rem 1.25rem; position: fixed; width: 100%; z-index: 1000; } #blazor-error-ui .dismiss { cursor: pointer; position: absolute; right: 0.75rem; top: 0.5rem; } .app-load { margin: 100px auto; width: 50px; height: 40px; text-align: center; font-size: 10px; } .app-load > div { background-color: #333; height: 100%; width: 6px; display: inline-block; -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out; animation: sk-stretchdelay 1.2s infinite ease-in-out; } .app-load .rect2 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s; } .app-load .rect3 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s; } .app-load .rect4 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s; } .app-load .rect5 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s; } @-webkit-keyframes sk-stretchdelay { 0%, 40%, 100% { -webkit-transform: scaleY(0.4); } 20% { -webkit-transform: scaleY(1.0); } } @keyframes sk-stretchdelay { 0%, 40%, 100% { transform: scaleY(0.4); -webkit-transform: scaleY(0.4); } 20% { transform: scaleY(1.0); -webkit-transform: scaleY(1.0); } } .dropzone { position: relative; overflow: hidden; border: 2px dotted rgba(0,0,0,.2); background-color: rgba(0,0,0,.09); margin-bottom: 20px; border-radius: 5px; } .dropzone.dropzone-active { background-color: #999; } .dropzone label { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; } .fileProgress { vertical-align: middle !important; } .text-icon-light { color: #e9ecef; }