var myWidth = 1710;
    
    function px2vw (px) {
        px = px.slice(0, -2);
        let ratio = window.innerWidth / myWidth;
        let vw = 100 * px / myWidth;
        return vw.toFixed(3) + 'vw';
    }
    
    $(window).load(function() {
        var style = '@media screen and (min-width: 1200px) {\n';
        $('.t396__elem').each(function() {
            if($(this).attr('data-elem-type') === 'text' || $(this).attr('data-elem-type') === 'button') {
                oldPX = $(this).find('.tn-atom').css('font-size');
                style = style + '.tn-elem[data-elem-id="' + $(this).attr('data-elem-id') + '"] .tn-atom' + ' { font-size: ' + px2vw(oldPX) + ' !important; }\n';
                //$(this).find('.tn-atom').attr('style','font-size:' + px2vw(oldPX) + ';');
            }
            if($(this).attr('data-elem-type') === 'button') {
                oldPX = $(this).find('.tn-atom').css('border-radius');
                style = style + '.tn-elem[data-elem-id="' + $(this).attr('data-elem-id') + '"] .tn-atom' + ' { border-radius: ' + px2vw(oldPX) + ' !important; }\n';
            }
            $(this).attr('style', '');
            let oldHeight = $(this).css('height');
            let oldWidth = $(this).css('width');
            let oldTop = $(this).css('top');
            let oldLeft = $(this).css('left');

            //вычисление left на 1920
            let x = document.documentElement.clientWidth / 2 - 600 - oldLeft.slice(0, -2);
            x = x * -1;
            let newLeft = myWidth / 2 - 600 + x + 'px';
            
            $(this).attr('style', '');
            style = style + '.tn-elem[data-elem-id="' + $(this).attr('data-elem-id') + '"]' + ' { width: ' + px2vw(oldWidth) + ' !important; top: ' + px2vw(oldTop) + ' !important; left: ' + px2vw(newLeft) + ' !important; height: ' + px2vw(oldHeight) + ' !important; }\n';
        });
        
        $('.t396__artboard').each(function() {
            let oldArtHeight = $(this).css('height');
            style = style + '#rec' + $(this).attr('data-artboard-recid') + ' .t396__artboard' + ' { height: ' + px2vw(oldArtHeight) + ' !important; }\n';
        });
        style = style + '}';
        $('head').append('' + style + '');
        console.log(style);
    });
    