.map-progress.map-left .to-be-circle {
    border: 1px solid #fff;
    background-color: #fff;
    border-radius: 50%;
    height: 25px;
    margin: auto;
    position: relative;
    width: 25px;
}
.map-progress.map-left .to-be-circle:before {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #50be97;
    border-radius: 50%;
    content: attr(data-progress) '%';
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 1px;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    left: 3px;
    right: 3px;
    top: 3px;
    bottom: 3px;
    -webkit-transition: -webkit-transform 0.2s ease;
    transition: -webkit-transform 0.2s ease;
    transition: transform 0.2s ease;
    transition: transform 0.2s ease, -webkit-transform 0.2s ease;
    border: 1px solid #fff;
    color: transparent;
}
.map-progress.map-left .to-be-circle:after {
    background-color: #50be97;
    border-radius: 50%;
    content: '';
    display: inline-block;
    height: 100%;
    width: 100%;
}
/**
* $step is set to 5 by default, meaning you can only use percentage classes in increments of five (e.g. 25, 30, 45, 50, and so on). This helps to reduce the size of the final CSS file. If you need a number that doesn't end in 0 or 5, you can change the text percentage while rounding the class up/down to the nearest 5.
*/
.map-progress-0.map-left .to-be-circle:after, .map-progress-.map-left .to-be-circle:after  {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, transparent), to(transparent)), -webkit-gradient(linear, left top, right top, color-stop(50%, #50be97), color-stop(50%, #fff), to(#fff));
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(90deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-1.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(93.6deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-2.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(97.2deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-3.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(100.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-4.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(104.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-5.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(108deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-6.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(111.6deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-7.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(115.2deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-8.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(118.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-9.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(122.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-10.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(126deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-11.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(129.6deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-12.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(133.2deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-13.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(136.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-14.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(140.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-15.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(144deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-16.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(147.6deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-17.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(151.2deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-18.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(154.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-19.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(158.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-20.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(162deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-21.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(165.60000000000002deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-22.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(169.2deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-23.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(172.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-24.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(176.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-25.map-left .to-be-circle:after {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #fff), color-stop(50%, transparent), to(transparent)), -webkit-gradient(linear, left top, left bottom, color-stop(50%, #50be97), color-stop(50%, #fff), to(#fff));
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(180deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-26.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(183.60000000000002deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-27.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(187.2deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-28.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(190.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-29.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(194.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-30.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(198deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-31.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(201.60000000000002deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-32.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(205.2deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-33.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(208.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-34.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(212.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-35.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(216deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-36.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(219.6deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-37.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(223.20000000000002deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-38.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(226.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-39.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(230.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-40.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(234deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-41.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(237.6deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-42.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(241.20000000000002deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-43.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(244.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-44.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(248.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-45.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(252deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-46.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(255.6deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-47.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(259.20000000000005deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-48.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(262.8deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-49.map-left .to-be-circle:after {
    background-image: linear-gradient(90deg, #fff 50%, transparent 50%, transparent), linear-gradient(266.4deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-50.map-left .to-be-circle:after {
    background-image: -webkit-gradient(linear, right top, left top, color-stop(50%, #50be97), color-stop(50%, transparent), to(transparent)), -webkit-gradient(linear, right top, left top, color-stop(50%, #50be97), color-stop(50%, #fff), to(#fff));
    background-image: linear-gradient(-90deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-51.map-left .to-be-circle:after {
    background-image: linear-gradient(-86.4deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-52.map-left .to-be-circle:after {
    background-image: linear-gradient(-82.8deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-53.map-left .to-be-circle:after {
    background-image: linear-gradient(-79.2deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-54.map-left .to-be-circle:after {
    background-image: linear-gradient(-75.6deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-55.map-left .to-be-circle:after {
    background-image: linear-gradient(-72deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-56.map-left .to-be-circle:after {
    background-image: linear-gradient(-68.4deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-57.map-left .to-be-circle:after {
    background-image: linear-gradient(-64.8deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-58.map-left .to-be-circle:after {
    background-image: linear-gradient(-61.2deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-59.map-left .to-be-circle:after {
    background-image: linear-gradient(-57.6deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-60.map-left .to-be-circle:after {
    background-image: linear-gradient(-54deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-61.map-left .to-be-circle:after {
    background-image: linear-gradient(-50.4deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-62.map-left .to-be-circle:after {
    background-image: linear-gradient(-46.8deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-63.map-left .to-be-circle:after {
    background-image: linear-gradient(-43.199999999999996deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-64.map-left .to-be-circle:after {
    background-image: linear-gradient(-39.6deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-65.map-left .to-be-circle:after {
    background-image: linear-gradient(-36deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-66.map-left .to-be-circle:after {
    background-image: linear-gradient(-32.4deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-67.map-left .to-be-circle:after {
    background-image: linear-gradient(-28.799999999999997deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-68.map-left .to-be-circle:after {
    background-image: linear-gradient(-25.200000000000003deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-69.map-left .to-be-circle:after {
    background-image: linear-gradient(-21.599999999999994deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-70.map-left .to-be-circle:after {
    background-image: linear-gradient(-18deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-71.map-left .to-be-circle:after {
    background-image: linear-gradient(-14.399999999999991deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-72.map-left .to-be-circle:after {
    background-image: linear-gradient(-10.799999999999997deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-73.map-left .to-be-circle:after {
    background-image: linear-gradient(-7.200000000000003deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-74.map-left .to-be-circle:after {
    background-image: linear-gradient(-3.599999999999994deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-75.map-left .to-be-circle:after {
    background-image: -webkit-gradient(linear, left bottom, left top, color-stop(50%, #50be97), color-stop(50%, transparent), to(transparent)), -webkit-gradient(linear, right top, left top, color-stop(50%, #50be97), color-stop(50%, #fff), to(#fff));
    background-image: linear-gradient(0deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-76.map-left .to-be-circle:after {
    background-image: linear-gradient(3.600000000000009deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-77.map-left .to-be-circle:after {
    background-image: linear-gradient(7.200000000000003deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-78.map-left .to-be-circle:after {
    background-image: linear-gradient(10.799999999999997deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-79.map-left .to-be-circle:after {
    background-image: linear-gradient(14.400000000000006deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-80.map-left .to-be-circle:after {
    background-image: linear-gradient(18deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-81.map-left .to-be-circle:after {
    background-image: linear-gradient(21.60000000000001deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-82.map-left .to-be-circle:after {
    background-image: linear-gradient(25.200000000000003deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-83.map-left .to-be-circle:after {
    background-image: linear-gradient(28.799999999999997deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-84.map-left .to-be-circle:after {
    background-image: linear-gradient(32.400000000000006deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-85.map-left .to-be-circle:after {
    background-image: linear-gradient(36deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-86.map-left .to-be-circle:after {
    background-image: linear-gradient(39.599999999999994deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-87.map-left .to-be-circle:after {
    background-image: linear-gradient(43.20000000000002deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-88.map-left .to-be-circle:after {
    background-image: linear-gradient(46.80000000000001deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-89.map-left .to-be-circle:after {
    background-image: linear-gradient(50.400000000000006deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-90.map-left .to-be-circle:after {
    background-image: linear-gradient(54deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-91.map-left .to-be-circle:after {
    background-image: linear-gradient(57.599999999999994deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-92.map-left .to-be-circle:after {
    background-image: linear-gradient(61.20000000000002deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-93.map-left .to-be-circle:after {
    background-image: linear-gradient(64.80000000000001deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-94.map-left .to-be-circle:after {
    background-image: linear-gradient(68.4deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-95.map-left .to-be-circle:after {
    background-image: linear-gradient(72deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-96.map-left .to-be-circle:after {
    background-image: linear-gradient(75.6deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-97.map-left .to-be-circle:after {
    background-image: linear-gradient(79.20000000000002deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-98.map-left .to-be-circle:after {
    background-image: linear-gradient(82.80000000000001deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-99.map-left .to-be-circle:after {
    background-image: linear-gradient(86.4deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}
.map-progress-100.map-left .to-be-circle:after {
    background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, #50be97), color-stop(50%, transparent), to(transparent)), -webkit-gradient(linear, right top, left top, color-stop(50%, #50be97), color-stop(50%, #fff), to(#fff));
    background-image: linear-gradient(90deg, #50be97 50%, transparent 50%, transparent), linear-gradient(270deg, #50be97 50%, #fff 50%, #fff);
}

@media screen and (max-width: 767px) {
    .map-progress.map-left .to-be-circle {
        height: 18px;
        width: 18px;
        border-width: 1px;
    }

    .map-progress.map-left .to-be-circle:before {
        border-width: 1px;
        left: 2px;
        right: 2px;
        top: 2px;
        bottom: 2px;
    }
}


.map-progress-0.map-left .to-be-circle:before, .map-progress-.map-left .to-be-circle:before{    
    left: 1px;
    right: 1px;
    top: 1px;
    bottom: 1px;
    border: 0px solid #fff;
}