The key thing is the "!important" keyword to overload the CSS precedence.

Types Initialization:

                       'types' : { 
                           'FOLDER' : {
                               'icon' : 'folderIcon'
                           },
                           'ROOT' : {
                               'icon' : 'rootIcon'
                           },
                           'default' : {
                               'icon' : 'folderIcon'
                           }
                       },

CSS:

               .rootIcon {
                   background-image: url(../_img/icon-grid-clr-16x16.jpg) !important;
                   width:16px;
                   height:16px;
                   background-position: -8px -16px !important;
               }
               .folderIcon {
                   background-image: url(../_img/icon-grid-clr-16x16.jpg) !important;
                   width:16px;
                   height:16px;
                   background-position: -8px 0px !important;
               }

javascript:

               .on('load_node.jstree', function (e,data) {
                    data.instance.set_type("#"+data.node.id,'ROOT');
               })