@keyframes slide-top {
  0% {
    opacity: 0;
    transform: translateY(-15%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slide-right {
  0% {
    opacity: 0;
    transform: translateX(15%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes slide-bottom {
  0% {
    opacity: 0;
    transform: translateY(15%);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes slide-left {
  0% {
    opacity: 0;
    transform: translateX(-15%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* line 49, app/assets/stylesheets/popover.scss */
.demogAnnotate {
  max-width: 300px;
  padding: 0.8em;
  border: 1px solid var(--demog-brand-color);
  border-radius: 4px;
  background: var(--demog-brand-color);
  box-shadow: 0 1px 4px var(--demog-brand-color-bg-dark);
  color: var(--demog-brand-text-color);
  z-index: 1000;
  font-size: 16px;
}

/* line 66, app/assets/stylesheets/popover.scss */
.demogAnnotate button#next {
  background-color: var(--demog-brand-text-color);
  color: var(--demog-brand-color);
}

/* line 70, app/assets/stylesheets/popover.scss */
.demogAnnotate button#back {
  color: var(--demog-brand-text-color);
}

/* line 74, app/assets/stylesheets/popover.scss */
.demogAnnotate--top {
  margin-top: -16px;
  animation: .4s slide-top;
}

/* line 78, app/assets/stylesheets/popover.scss */
.demogAnnotate--top::before, .demogAnnotate--top::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top-color: var(--demog-brand-color);
}

/* line 88, app/assets/stylesheets/popover.scss */
.demogAnnotate--top::before {
  margin-top: 1px;
  border-top-color: var(--demog-brand-color);
}

/* line 94, app/assets/stylesheets/popover.scss */
.demogAnnotate--right {
  margin-left: 16px;
  animation: .4s slide-right;
}

/* line 98, app/assets/stylesheets/popover.scss */
.demogAnnotate--right::before, .demogAnnotate--right::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -8px;
  border: 8px solid transparent;
  border-right-color: var(--demog-brand-color);
}

/* line 108, app/assets/stylesheets/popover.scss */
.demogAnnotate--right::before {
  margin-right: 1px;
  border-right-color: var(--demog-brand-color);
}

/* line 114, app/assets/stylesheets/popover.scss */
.demogAnnotate--bottom {
  margin-top: 16px;
  animation: .4s slide-bottom;
}

/* line 118, app/assets/stylesheets/popover.scss */
.demogAnnotate--bottom::before, .demogAnnotate--bottom::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-bottom-color: var(--demog-brand-color);
}

/* line 128, app/assets/stylesheets/popover.scss */
.demogAnnotate--bottom::before {
  margin-bottom: 1px;
  border-bottom-color: var(--demog-brand-color);
}

/* line 134, app/assets/stylesheets/popover.scss */
.demogAnnotate--left {
  margin-left: -16px;
  animation: .4s slide-left;
}

/* line 138, app/assets/stylesheets/popover.scss */
.demogAnnotate--left::before, .demogAnnotate--left::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 100%;
  margin-top: -8px;
  border: 8px solid transparent;
  border-left-color: var(--demog-brand-color);
}

/* line 148, app/assets/stylesheets/popover.scss */
.demogAnnotate--left::before {
  margin-left: 1px;
  border-left-color: var(--demog-brand-color);
}

/* line 156, app/assets/stylesheets/popover.scss */
.demogPopover {
  padding: 1.5em;
  border: 1px solid #aaa;
  border-radius: 4px;
  background: white;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.2);
  color: rgba(0, 0, 0, 0.8);
  z-index: 1000;
  pointer-events: none;
}

/* line 173, app/assets/stylesheets/popover.scss */
.demogPopover--top {
  margin-top: -16px;
  animation: .4s slide-top;
}

/* line 177, app/assets/stylesheets/popover.scss */
.demogPopover--top::before, .demogPopover--top::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-top-color: white;
}

/* line 187, app/assets/stylesheets/popover.scss */
.demogPopover--top::before {
  margin-top: 1px;
  border-top-color: #6a6a6a;
}

/* line 193, app/assets/stylesheets/popover.scss */
.demogPopover--right {
  margin-left: 16px;
  animation: .4s slide-right;
}

/* line 197, app/assets/stylesheets/popover.scss */
.demogPopover--right::before, .demogPopover--right::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  margin-top: -8px;
  border: 8px solid transparent;
  border-right-color: white;
}

/* line 207, app/assets/stylesheets/popover.scss */
.demogPopover--right::before {
  margin-right: 1px;
  border-right-color: #6a6a6a;
}

/* line 213, app/assets/stylesheets/popover.scss */
.demogPopover--bottom {
  margin-top: 16px;
  animation: .4s slide-bottom;
}

/* line 217, app/assets/stylesheets/popover.scss */
.demogPopover--bottom::before, .demogPopover--bottom::after {
  content: "";
  position: absolute;
  bottom: 100%;
  left: 50%;
  margin-left: -8px;
  border: 8px solid transparent;
  border-bottom-color: white;
}

/* line 227, app/assets/stylesheets/popover.scss */
.demogPopover--bottom::before {
  margin-bottom: 1px;
  border-bottom-color: #6a6a6a;
}

/* line 233, app/assets/stylesheets/popover.scss */
.demogPopover--left {
  margin-left: -16px;
  animation: .4s slide-left;
}

/* line 237, app/assets/stylesheets/popover.scss */
.demogPopover--left::before, .demogPopover--left::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 100%;
  margin-top: -8px;
  border: 8px solid transparent;
  border-left-color: white;
}

/* line 247, app/assets/stylesheets/popover.scss */
.demogPopover--left::before {
  margin-left: 1px;
  border-left-color: #6a6a6a;
}