/* -------------------------------------
 * Bar container
 * ------------------------------------- */
.progress-radial {
    background-color: #f20056;
    border: medium none;
    border-radius: 50%;
    float: left;
    height: 300px;
    /* margin-right: 30px; */
    position: relative;
    width: 300px;
}

/* -------------------------------------
 * Optional centered circle w/text
 * ------------------------------------- */
.progress-radial .overlay {
    background-color: #fff;
    border-radius: 50%;
    font-size: 40px;
    height: 250px;
    line-height: 250px;
    margin-left: 27px;
    margin-top: 27px;
    position: absolute;
    text-align: center;
    width: 250px;
}

.overlay > img {
    border-radius: 50%;
    overflow: hidden;
    width: 100%;
}

/* -------------------------------------
 * Mixin for progress-% class
 * ------------------------------------- */
.progress-0 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(90deg, #f20056  50%, #ddd 50%, #ddd);
}

.progress-1 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(93.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-2 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(97.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-3 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(100.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-4 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(104.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-5 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(108deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-6 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(111.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-7 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(115.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-8 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(118.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-9 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(122.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-10 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(126deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-11 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(129.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-12 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(133.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-13 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(136.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-14 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(140.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-15 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(144deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-16 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(147.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-17 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(151.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-18 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(154.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-19 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(158.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-20 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(162deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-21 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(165.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-22 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(169.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-23 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(172.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-24 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(176.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-25 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(180deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-26 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(183.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-27 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(187.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-28 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(190.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-29 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(194.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-30 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(198deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-31 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(201.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-32 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(205.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-33 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(208.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-34 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(212.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-35 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(216deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-36 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(219.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-37 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(223.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-38 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(226.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-39 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(230.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-40 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(234deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-41 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(237.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-42 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(241.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-43 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(244.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-44 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(248.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-45 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(252deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-46 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(255.6deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-47 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(259.2deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-48 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(262.8deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-49 {
  background-image: linear-gradient(90deg, #ddd 50%, transparent 50%, transparent), linear-gradient(266.4deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-50 {
  background-image: linear-gradient(-90deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-51 {
  background-image: linear-gradient(-86.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-52 {
  background-image: linear-gradient(-82.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-53 {
  background-image: linear-gradient(-79.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-54 {
  background-image: linear-gradient(-75.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-55 {
  background-image: linear-gradient(-72deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-56 {
  background-image: linear-gradient(-68.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-57 {
  background-image: linear-gradient(-64.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-58 {
  background-image: linear-gradient(-61.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-59 {
  background-image: linear-gradient(-57.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-60 {
  background-image: linear-gradient(-54deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-61 {
  background-image: linear-gradient(-50.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-62 {
  background-image: linear-gradient(-46.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-63 {
  background-image: linear-gradient(-43.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-64 {
  background-image: linear-gradient(-39.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-65 {
  background-image: linear-gradient(-36deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-66 {
  background-image: linear-gradient(-32.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-67 {
  background-image: linear-gradient(-28.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-68 {
  background-image: linear-gradient(-25.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-69 {
  background-image: linear-gradient(-21.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-70 {
  background-image: linear-gradient(-18deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-71 {
  background-image: linear-gradient(-14.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-72 {
  background-image: linear-gradient(-10.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-73 {
  background-image: linear-gradient(-7.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-74 {
  background-image: linear-gradient(-3.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-75 {
  background-image: linear-gradient(0deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-76 {
  background-image: linear-gradient(3.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-77 {
  background-image: linear-gradient(7.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-78 {
  background-image: linear-gradient(10.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-79 {
  background-image: linear-gradient(14.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-80 {
  background-image: linear-gradient(18deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-81 {
  background-image: linear-gradient(21.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-82 {
  background-image: linear-gradient(25.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-83 {
  background-image: linear-gradient(28.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-84 {
  background-image: linear-gradient(32.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-85 {
  background-image: linear-gradient(36deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-86 {
  background-image: linear-gradient(39.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-87 {
  background-image: linear-gradient(43.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-88 {
  background-image: linear-gradient(46.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-89 {
  background-image: linear-gradient(50.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-90 {
  background-image: linear-gradient(54deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-91 {
  background-image: linear-gradient(57.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-92 {
  background-image: linear-gradient(61.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-93 {
  background-image: linear-gradient(64.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-94 {
  background-image: linear-gradient(68.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-95 {
  background-image: linear-gradient(72deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-96 {
  background-image: linear-gradient(75.6deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-97 {
  background-image: linear-gradient(79.2deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-98 {
  background-image: linear-gradient(82.8deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-99 {
  background-image: linear-gradient(86.4deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}

.progress-100 {
  background-image: linear-gradient(90deg, #f20056 50%, transparent 50%, transparent), linear-gradient(270deg, #f20056 50%, #ddd 50%, #ddd);
}
