$(function () {
    // activate slideshow on DOM-ready
    $('#slides').showcase({
        animation: {
            type: "fade",
            speed: 1700,
            stopOnHover: true
        },
        css: {
            border: "solid 1px black",
            width: "960px",
            height: "400px",
            margin: "0px",
            padding: "0px",
            overflow: "inherit"
        },
        images: slideshowImages,
        navigator: {
            position: "bottom-left",
            showMiniature: true,
            item: {
                css: {
                    width: "30px", height: "30px", "line-height": "20px",
                    background: "transparent",
                    border: "solid 1px #dddddd"
                }
            }
        },
        titleBar: {
            enabled: true,
            position: "top",
            autoHide: false,
            css: {
                textAlign: "center",
                fontSize: "20pt",
                width: "950px"
            }
        }
    });

});