<style type="text/css">
#fontsize-id{
position:relative;
float:center;
}
#fnt-table{
background: url(/files/0017/52/b5/52389.gif) center 0 no-repeat;
padding:0;
margin:0;
border-collapse:collapse;
position:fixed;right:30px;top:100px;z-index:100;
}
#fnt-table:hover {
background-position: center -19px;
}
@media screen and (max-width: 540px) {
#fnt-table{background: url(/files/0017/52/b5/98191.gif) center 0 no-repeat;
padding:0;
margin:0;
border-collapse:collapse;
position:absolute !important; right:2px; top:74px;}
}
</style>
<style id="font_size">.punbb {font-size:74.75%;}</style>
<script type="text/javascript">
var defaultFontSize = $('style#font_size').html().replace(/^.*?size:(.*?)%;\}/ig,'$1')
  function setcOOkie2(a,b,c) {if(c){var d = new Date();d.setDate(d.getDate()+c);}if(a && b) document.cookie = a+'='+ b +(c ? '; expires='+d.toUTCString() : '');else return false;}
  function getcOOkie2(a) {var b = new RegExp(a+'=([^;]){1,}');var c = b.exec(document.cookie);if(c) c = c[0].split('=');else return false;return c[1] ? c[1] : false;}
  var a = getcOOkie2('font_size')
  if(a) {setcOOkie2('font_size',''+a,30);$('style#font_size').html('.punbb {font-size:'+a+'%;}');}
$(document).ready(function(){
var s = '<div id="fontsize"><p id="fontsize-id"><table id="fnt-table" width=42  border=0><tr height=18><td width=33% class="left" title="Уменьшить шрифт"></td><td width=33% class="center" title="Сброс размера шрифта"></td><td  width=33% class="right" title="Увеличить шрифт"></td></tr></table></p></div>';
$('#pun-navlinks').append(s);
$('#fnt-table td ').click(function() {
var str = $('style#font_size').html();
var font_size = parseFloat(str.replace(/^.*?size:(.*?)%;\}/ig,'$1'));
var delta = font_size/20;
if($(this).hasClass('left'))font_size-=delta;
if($(this).hasClass('right'))font_size+=delta;
if(font_size < 1) return;
font_size = font_size.toFixed(2);
if($(this).hasClass('center')){ font_size = defaultFontSize; alert('Cброшено в исходное')}//
str = '.punbb {font-size:'+font_size+'%;}';
setcOOkie2('font_size',''+font_size,30);
$('style#font_size').html(str);
});
});
</script>

<style>
@media screen and (max-width:480px) {
    #fontsize {
        position: relative;
    }
    #fnt-table {
        top: -13px;
        width: 100%;
    }
    #fnt-table tr {
        display: flex;
        width: 42px;
        margin: 0 auto;
    }
}
</style>