<!DOCTYPE html>
<html>
    <head>
        <title>Mirador POC</title>
        <script type="text/javascript" src='../../../build/openseadragon/openseadragon.js'></script>
        <script type="text/javascript" src='../../lib/jquery-1.9.1.min.js'></script>
        <script src="js/main.js"></script>
        <script src="js/tilesources.js"></script>
        <style type="text/css">

            html,
            body {
                width: 100%;
                height: 100%;
                margin: 0;
            }

            body {
                background: #eee;
                overflow: scroll;
            }

            .header {
                height: 30px;
            }

            .nav {
                display: inline-block;
                margin-left: 50px;
            }

            .active {
                background: #ddf;
            }

            .hidden {
                visibility: hidden;
            }

            .openseadragon1 {
                background: white;
            }

            .openseadragon1.full {
                position: absolute;
                left: 0;
                top: 30px;
                right: 0;
                bottom: 0;
            }

            .openseadragon1.thumbs {
            }

        </style>
    </head>
    <body>
        <div class="header">
            <button class="thumbs">Thumbnails</button>
            <button class="scroll">Scroll</button>
            <button class="book">Book</button>
            <button class="page">Page</button>
            <div class="nav">
                <button class="previous">Previous</button>
                <button class="next">Next</button>
            </div>
        </div>
        <div id="contentDiv" class="openseadragon1"></div>
    </body>
</html>