.dc-ui-block {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  opacity: 0;
  visibility: hidden;
  transition: all 150ms linear; }
  .dc-ui-block.dc-ui-block-overlay {
    background: rgba(0, 0, 0, 0.25); }
  .dc-ui-block.dc-ui-block-loader .loader {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translateX(-50%) translateY(-50%);
    width: 64px;
    height: 64px;
    background: #fff;
    border-radius: 50%; }
    .dc-ui-block.dc-ui-block-loader .loader:before {
      content: '';
      display: block;
      padding-top: 100%; }
    .dc-ui-block.dc-ui-block-loader .loader .circular {
      -webkit-animation: loading-rotate 2s linear infinite;
      -moz-animation: loading-rotate 2s linear infinite;
      -ms-animation: loading-rotate 2s linear infinite;
      width: 48px;
      height: 48px;
      transform-origin: center center;
      position: absolute;
      top: 0;
      bottom: 0;
      left: 0;
      right: 0;
      margin: auto; }
      .dc-ui-block.dc-ui-block-loader .loader .circular .path {
        -webkit-animation: loading-dash 1.5s ease-in-out infinite;
        -moz-animation: loading-dash 1.5s ease-in-out infinite;
        -ms-animation: loading-dash 1.5s ease-in-out infinite;
        stroke-dasharray: 1, 200;
        stroke-dashoffset: 0;
        stroke-linecap: round;
        stroke: #716aca; }

@-webkit-keyframes loading-rotate {
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg); } }

@keyframes loading-rotate {
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg); } }

@-webkit-keyframes loading-dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0; }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -35px; }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -124px; } }

@keyframes loading-dash {
  0% {
    stroke-dasharray: 1, 200;
    stroke-dashoffset: 0; }
  50% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -35px; }
  100% {
    stroke-dasharray: 89, 200;
    stroke-dashoffset: -124px; } }

@-webkit-keyframes loading-color {
  100%, 0% {
    stroke: blue; }
  40% {
    stroke: blue; }
  66% {
    stroke: blue; }
  80%, 90% {
    stroke: blue; } }

@keyframes loading-color {
  100%, 0% {
    stroke: blue; }
  40% {
    stroke: blue; }
  66% {
    stroke: blue; }
  80%, 90% {
    stroke: blue; } }

body.dc-ui-disabled-scroll {
  position: fixed;
  width: 100%; }

@keyframes show-block {
  0% {
    opacity: 0; }
  96% {
    min-height: 48px;
    padding: 8px 24px;
    margin: 12px;
    visibility: visible;
    opacity: 1;
    transform: translateY(0px); }
  98% {
    min-height: 48px;
    padding: 8px 24px;
    margin: 12px;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-100px); }
  100% {
    height: 0;
    min-height: 0;
    padding: 0;
    margin: 0;
    visibility: hidden;
    opacity: 0;
    transform: translateY(-100px); } }