﻿
#app {

    .centerPanel {

        @img-path: '../../../modules/uv-seadragoncenterpanel-module/img/';

        .content{
            position: relative;

            .displayregion {
                border: 2px solid #fff !important;
            }

            #viewer {
                margin: 0 8px 0 8px;

                .navigator.extraMargin {
                    margin: 0 30px 0 0 !important;
                }

                .paging.btn {
                    position: absolute !important;
                    width: 30px;
                    height: 90px;
                    background-repeat: no-repeat;
                    background-color: @body-bg;
                    background-position: 0px 50%;
                    cursor: pointer;

                    .border-radius(0);

                    &.prev {
                        background-image: url('@{img-path}prev_page.png');
                        left: 0;
                        &.disabled {
                            background-image: url('@{img-path}prev_page_disabled.png');
                        }
                    }

                    &.next {
                        background-image: url('@{img-path}next_page.png');
                        right: 0;
                        &.disabled {
                            background-image: url('@{img-path}next_page_disabled.png');
                        }
                    }
                }

                .zoomIn{
                    cursor: pointer !important;
                    .btn-focus() !important;
                }

                .zoomOut{
                    cursor: pointer !important;
                    .btn-focus() !important;
                }

                .goHome{
                    cursor: pointer !important;
                    .btn-focus() !important;
                }

                div[title="Rotate left"] {
                    display: none !important;
                }

                .rotate{
                    cursor: pointer !important;
                    .btn-focus() !important;
                }

                div[title="Previous page"] {
                    display: none !important;
                }

                div[title="Next page"] {
                    display: none !important;
                }
            }

            .spinner {
                position: absolute;
                background: fadeout(#000, 10%);
                width: 34px;
                height: 34px;
                border-radius: 34px;

                .loading(@loader-black-bg);
            }

            .searchOverlay{
                background-color: @brand-secondary;
                .opacity(.5);
            }
        }
    }

    .openseadragon-canvas {
        outline: none;
    }
}
