{
    id: "jssort062",
    type: "thumbnail",
    name: "thumbnail skin 062 white",
    note: "<!-- Note: v:0 = id; v:1 = itemWidth; v:2 = itemHeight; v:3 = borderWidth -->",
    css: ''
        + '\r\n.jssort062 .p {position:absolute;top:0;left:0;border:2px solid rgba(0,0,0,.4);box-sizing:border-box;}'
        + '\r\n.jssort062 .t {position:absolute;top:0;left:0;width:100%;height:100%;border:none;opacity:.6;}'
        + '\r\n.jssort062 .p:hover {border-color:rgba(255,255,255,.6);}'
        + '\r\n.jssort062 .pav, .jssort062 .p:hover.pdn{border-color:#fff;}'
        + '\r\n.jssort062 .pav .t, .jssort062 .p:hover.pdn .t{opacity:1;}',
    html: ''
        + '\r\n<div data-u="thumbnavigator" class="jssort062" style="position:absolute;left:0px;bottom:0px;width:980px;height:100px;">'
        + '\r\n    <div data-u="slides">'
        + '\r\n        <div data-u="prototype" class="p" style="width:{{v:1}}px;height:{{v:2}}px;">'
        + '\r\n            <div data-u="thumbnailtemplate" class="t"></div>'
        + '\r\n        </div>'
        + '\r\n    </div>'
        + '\r\n</div>',
    itemHtml: ''
        + '\r\n<img data-u="thumb" data-tsize="{w:{{v:1,b:-4}},h:{{v:2,b:-4}}}" src="{{i:0}}" />'
        + '\r\n',
    defaultValue: {
        itemWidth: 64,
        itemHeight: 64,
        itemSpacingX: 5,
        itemSpacingY: 5,
        cntrHeight: 100,
        cntrAutoCenter: 1,
        bhvScalePos: .75
    }
}