:root{
    --color4-progress: #f9fbff;/*Цвет фона шкалы*/
    --color6-progress: #00469f; /*Цвет заголовка шкалы*/

    --progress-border-top: 2px solid #0d76fb; /*верхний бордер*/
    --progress-border-right: 2px solid #0d76fb; /*правый бордер*/
    --progress-border-bottom: 1px solid #0d76fb; /*нижний бордер*/
    --progress-border-left: 2px solid #0d76fb; /*левый бордер*/

    --color1-progress: transparent; /* цвет дырки */
    --color2-progress:#c0ddff; /* цвет кольца */

    --color3-progress: #135ab4; /* цвет заполнения */
    --color7-progress: #135ab4;/*Цифры прогресса*/

}


.prog_wrap{
 	background: var(--traning-zoloto-bg-fon)!important;
    padding: 20px 20px 10px!important;
    border-radius: var(--traning-zoloto-border-radius);
    max-width: 400px;
    margin: 0 auto 20px;
}

/*Стили для контейнера шкалы*/
.prog {
    background: var(--color4-progress);
    border-radius: var(--traning-zoloto-border-radius);
    border: 1px solid var(--color5-progress) !important;
    border-top: var(--progress-border-top) !important;
    border-right: var(--progress-border-right) !important;
    border-bottom: var(--progress-border-bottom) !important;
    border-left: var(--progress-border-left) !important;
    -webkit-box-shadow: var(--traning-zoloto-box-shadow) !important;
    box-shadow: var(--traning-zoloto-box-shadow) !important;
    max-width: 400px;
    width: 100%;
    margin: 0px auto 15px!important;
}

/*Заголовок для шкалы*/
.title_prog {
    font-family: var(--traning-zoloto-font-family-header)!important;
    font-style: normal;
    font-weight: 400;
    font-size: 20px;
    line-height: 1;
    text-align: center;
    letter-spacing: 0.02em;
    color:var(--color6-progress);
    margin-bottom: 0;

}

/*Стили шкалы достижений*/
.xdget-trainingAchievements {
    display:none;
}
svg.lessons-dount {
    display:block!important;
}
svg.lessons-dount .donut-hole {
    fill: var(--color1-progress);
}
svg.lessons-dount .donut-ring {
    stroke: var(--color2-progress);
    stroke-width: 4; /* толщина кольца */
    fill: transparent;
}
svg.lessons-dount .donut-segment {
    stroke:var(--color3-progress);
    stroke-width: 4; /* толщина заполнения */
    fill: transparent;
    stroke-dasharray: "0 100";
    stroke-dashoffset: 25;
}
.chart-text {
    fill: var(--color7-progress); 
    -ms-transform: translateY(0.25em); 
    -webkit-transform: translateY(0.25em); 
    transform: translateY(0.25em);
}
.chart-number {
    font-family: var(--traning-zoloto-font-family-header)!important;
    font-style: normal;
    font-weight: 400;
    font-size: 9px;
    line-height: 51px;
    text-anchor: middle; 
    -ms-transform: translateY(-0.25em); 
    -webkit-transform: translateY(-0.25em); 
    transform: translateY(-0.25em);
}
.chart-label {
    font-style: normal;
    font-weight: 400;
    font-size: 0.2em; 
    line-height: 36px;
    font-family: var(--traning-zoloto-font-family-header)!important;
    font-style: normal;
    text-transform: uppercase; 
    text-anchor: middle; 
    -ms-transform: translateY(0.7em); 
    -webkit-transform: translateY(0.7em);
    transform: translateY(0.7em);
}



@media (max-width:930px) {
    .tren_des {display:none;}
}

@media (min-width:930px) {
    .tren_mob {display:none;}
}


@media (max-width: 425px){
    .prog_wrap{
        max-width: 100%;
        width: calc(100% - 10px);
        margin: 0 auto 20px;
    }
}