﻿/* Copyright 2021 Epic Systems Corporation */
#come-back-later-graphic > img {
  display: block;
  margin: auto;
}

#place-in-line {
  font-weight: bold;
}

#progress-bar {
  position: relative;
  height: 2.4rem;
  padding: 0.6rem 1rem;
  max-width: 425px;
  margin: 0.75rem auto 0.75rem auto;
}

#progress-bar-back {
  height: 1.2rem;
  width: 100%;
  margin: 0;
  border-style: solid;
  border-width: 1px;
  border-radius: 0.75rem;
  overflow: hidden;
  border-color: #cccccc;
  background-color: #edf3f9;
}

#progress-bar-fill {
  height: 100%;
  width: 0%;
  margin: 0;
  border-radius: 0.75rem;
  background-color: #246fb5;
  box-shadow: none;
  transition: width 1s;
}

#progress-indicator {
  position: absolute;
  top: 0;
  height: 2.4rem;
  width: 2.4rem;
  transition: margin 1s;
  min-height: 0;
  margin: 0 0 0 -1.2rem;
  padding: 0;
  border: none;
  box-shadow: none;
  background-color: transparent;
}
#progress-indicator > svg {
  height: 100%;
  width: 100%;
}

.card-section {
  margin-bottom: 1rem;
}

.busyState {
  position: relative;
  height: 10rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.busyState > svg {
  position: absolute;
  height: 100%;
}
.busyState > [class|=circularAnimation] {
  height: 4em;
  width: 4em;
  overflow: visible;
}

.busyState > .busyState-IE {
  display: block;
}

.circularAnimation-1 {
  animation: circularPath-1 18s linear infinite;
}

.circularAnimation-2 {
  animation: circularPath-2 18s linear infinite;
}

.circularAnimation-3 {
  animation: circularPath-3 18s linear infinite;
}

.circularAnimation-4 {
  animation: circularPath-4 18s linear infinite;
}

@keyframes circularPath-1 {
  from {
    transform: rotate(0deg) translateX(3rem) rotate(0deg);
  }
  to {
    transform: rotate(360deg) translateX(3rem) rotate(-360deg);
  }
}
@keyframes circularPath-2 {
  from {
    transform: rotate(0deg) translateX(-3rem) rotate(0deg);
  }
  to {
    transform: rotate(360deg) translateX(-3rem) rotate(-360deg);
  }
}
@keyframes circularPath-3 {
  from {
    transform: rotate(0deg) translateY(3rem) rotate(0deg);
  }
  to {
    transform: rotate(360deg) translateY(3rem) rotate(-360deg);
  }
}
@keyframes circularPath-4 {
  from {
    transform: rotate(0deg) translateY(-3rem) rotate(0deg);
  }
  to {
    transform: rotate(360deg) translateY(-3rem) rotate(-360deg);
  }
}
