var list = document.getElementById('itemList');

var li = list.getElementsByTagName('li');

li[0].className = 'active'
document.getElementById('index_icon1').src = './static/images/index_icon7.png';

function changeTab(id,that){

    for (var i = 0; i < li.length; i++) {

        li[i].className = '';

        if(i<6){
            document.getElementById('img'+(i+1)).style.display = 'none';
            document.getElementById('index_icon'+(i+1)).src = './static/images/index_icon'+(i+1)+'.png';
        }

    }

    that.className = 'active';

    document.getElementById('index_icon'+id).src = './static/images/index_icon'+(id+6)+'.png';

    document.getElementById('img'+id).style.display = 'table-cell';

}

var servicelist = document.getElementById('serviceList');

var serviceli = servicelist.getElementsByTagName('li');

serviceli[0].className = 'active'

document.getElementById('index_icon1').src = './static/images/index_icon7.png';

function changeTabService(id,that){

    for (var i = 0; i < serviceli.length; i++) {

        serviceli[i].className = '';

        if(i<6){
            document.getElementById('img0'+(i+1)).style.display = 'none';
        }

    }

    that.className = 'active';

    document.getElementById('img0'+id).style.display = 'table-cell';

}