$(document).ready(function(){
    $('.diagrams-01 .f-subheader p').each(function() { // Ищем все .f-subheader p.
    	var val = $(this).text(); // Берем текст.
        val = String.prototype.replace.call(val,/[^\d]/g,''); // Заменяем все, что не числа на пустую строку.
        var deg = val * 3.6; // Переводим в градусы.
        var image = $(this).closest('.diagrams-01 .lt-tsr-content').find('.image'); // Ищем класс .image в том же блоке.
        
        // Проверяем наше значение в %.
        // Если <= 50 применяем угол поворота к правой части(::after).
        // Иначе добавляем класс .half, который закрепляет правую чать(::after) и применяем угол поворота левой части(::before);
        if (val <= 50) {
            image.addClass('deg-' + val); // Добавляем класс с указанием градусов.
            image.append('<style>.diagrams-01 .image.deg-' + val + '::after{ transform: rotate(' + deg + 'deg);}</style>'); // Добавляем стили для псевдоэлемента, поворачивая его на нужный угол.
        } else {
            image.addClass('deg-' + val).addClass('half'); // Добавляем класс с указанием градусов и класс .half, обозначающий значение больше половины.
            image.append('<style>.diagrams-01 .image.deg-' + val + '::before{ transform: rotate(' + deg + 'deg);}</style>'); // Добавляем стили для второго псевдоэлемента, поворачивая его на нужный угол.
        }
    });
});