/*PROGRESS ICON STYLES*/
div.vueProgressIcon {
  position: relative;
  display: inline-block;
  width: 8.4rem;
  height: 2.1rem;
  line-height: 2.1rem;
  vertical-align: middle; }
  div.vueProgressIcon .progressBar {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    min-width: 26% !important;
    max-width: 100% !important; }
    div.vueProgressIcon .progressBar .progressCircle {
      position: absolute;
      top: 0px;
      border-radius: 50%;
      height: 100%;
      width: 2.1rem; }
      div.vueProgressIcon .progressBar .progressCircle.progressLeft {
        left: 0px; }
      div.vueProgressIcon .progressBar .progressCircle.progressRight {
        right: 0px; }
      div.vueProgressIcon .progressBar .progressCircle.progressBorder {
        top: -1px;
        border: 1px solid #FFFFFF; }
    div.vueProgressIcon .progressBar .progressMid {
      position: absolute;
      top: 0px;
      left: 1.05rem;
      height: 100%;
      width: calc(100% - 2.1rem); }
  div.vueProgressIcon .progressText {
    position: absolute;
    top: 0px;
    right: 5%;
    text-align: right;
    vertical-align: middle;
    font-size: 1.05rem;
    height: 100%;
    line-height: inherit;
    color: #FFFFFF; }
    div.vueProgressIcon .progressText .progressTextPercent {
      font-size: 0.7rem;
      margin-left: -0.1rem; }
  div.vueProgressIcon .progressIcon {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 2.1rem;
    background-size: 40%;
    background-repeat: no-repeat;
    background-position: center; }
    div.vueProgressIcon .progressIcon.icn {
      min-height: auto;
      min-width: auto;
      height: 100% !important;
      width: 2.1rem !important; }
  div.vueProgressIcon.small {
    width: 5.6rem;
    height: 1.4rem;
    line-height: 1.4rem; }
    div.vueProgressIcon.small .progressCircle {
      width: 1.4rem; }
    div.vueProgressIcon.small .progressMid {
      left: 0.7rem;
      width: calc(100% - 1.4rem); }
    div.vueProgressIcon.small .progressIcon {
      width: 1.4rem; }
      div.vueProgressIcon.small .progressIcon.icn {
        width: 1.4rem !important; }
    div.vueProgressIcon.small .progressText {
      font-size: 0.7rem; }
      div.vueProgressIcon.small .progressText .progressTextPercent {
        font-size: 0.46667rem; }
  div.vueProgressIcon.slightlyLarger {
    width: 12.6rem;
    height: 3.15rem;
    line-height: 3.15rem; }
    div.vueProgressIcon.slightlyLarger .progressCircle {
      width: 3.15rem; }
    div.vueProgressIcon.slightlyLarger .progressMid {
      left: 1.575rem;
      width: calc(100% - 3.15rem); }
    div.vueProgressIcon.slightlyLarger .progressIcon {
      width: 3.15rem; }
      div.vueProgressIcon.slightlyLarger .progressIcon.icn {
        width: 3.15rem !important; }
    div.vueProgressIcon.slightlyLarger .progressText {
      font-size: 1.575rem; }
      div.vueProgressIcon.slightlyLarger .progressText .progressTextPercent {
        font-size: 1.05rem; }
  div.vueProgressIcon.large {
    width: 16.8rem;
    height: 4.2rem;
    line-height: 4.2rem; }
    div.vueProgressIcon.large .progressCircle {
      width: 4.2rem; }
    div.vueProgressIcon.large .progressMid {
      left: 2.1rem;
      width: calc(100% - 4.2rem); }
    div.vueProgressIcon.large .progressIcon {
      width: 4.2rem; }
      div.vueProgressIcon.large .progressIcon.icn {
        width: 4.2rem !important; }
    div.vueProgressIcon.large .progressText {
      font-size: 2.1rem; }
      div.vueProgressIcon.large .progressText .progressTextPercent {
        font-size: 1.4rem; }
  div.vueProgressIcon.veryLarge {
    width: 21rem;
    height: 5.25rem;
    line-height: 5.25rem; }
    div.vueProgressIcon.veryLarge .progressCircle {
      width: 5.25rem; }
    div.vueProgressIcon.veryLarge .progressMid {
      left: 2.625rem;
      width: calc(100% - 5.25rem); }
    div.vueProgressIcon.veryLarge .progressIcon {
      width: 5.25rem; }
      div.vueProgressIcon.veryLarge .progressIcon.icn {
        width: 5.25rem !important; }
    div.vueProgressIcon.veryLarge .progressText {
      font-size: 2.625rem; }
      div.vueProgressIcon.veryLarge .progressText .progressTextPercent {
        font-size: 1.75rem; }
