.ngdt-desktop-wrapper-hidden {
    position: absolute;
    left: -9999px;
}

.js .seadragon-nav-bar-close-css {
    cursor: pointer;
    width: 43px;
    height: 43px;
    background: transparent url(scripts/openseadragon-bin-2.3.1/images/close_hover.png) top left no-repeat;
    display: block;
}

.no-js .ngdt-desktop-wrapper {
    display: none;
}

.menu-panel {
    background-color: #f0f4f9;
}

.menu-toc li a,
.menu-toc li a:hover {
    background: #109cf1;
    border-bottom: 1px solid #1380dd;
}

.menu-toc li.menu-toc-current a {
    background: #0465bb;
}

.cursor-magnify-css {
    cursor: url(zoomin.png), pointer;
}

.openseadragon-canvas {
    cursor: url(hand.png), pointer;
}

.ngdt-map-css {
    width: 100%;
    height: 100vh;
    y-background-color: #404040;
    position: absolute;
    top: 0px;
    left: -99999px;
}

@media (max-width: 991px) {
    .ngdt-map-css {
        left: 0px !important;
    }
}

.ngdt-map-zone-visible {
    z-index: 10000;
    position: relative !important;
    left: 0px !important;
}

@media (max-width: 991px) {
    .ngdt-map-zone-visible {
        left: 0px !important;
    }
}

@media (max-width: 991px) {
    body,
    html {
        height: 90vh !important;
    }
    .container {
        height: 90vh;
        y-overflow: hidden;
    }
    .js .menu-panel {
        height: 90vh;
        overflow: hidden;
    }
    .mobile-wrapper-css {
        border: 0px dotted blue;
        box-sizing: content-box;
        height: 90vh;
        overflow: hidden;
    }
    .ngdt-seadragon-mobile-map-css {
        height: 90vh;
        box-sizing: content-box;
        margin-top: 0px;
        padding: 0;
        y-margin-bottom: -10vh;
        y-background-color: #808080;
    }
    .menu-panel-childscroll {
        height: 70vh;
        padding: 0.5em;
        overflow: hidden;
        overflow-y: scroll
    }
    .current-menuitem-mobile a {
        color: yellow !important;
    }
    .current-menuitem-mobile:nth-child(1) img {
        border: 1px solid blue;
        border-right: 0;
    }
    .current-menuitem-mobile:nth-child(2) img {
        border: 1px solid blue;
        border-left: 0;
    }
}

.ngd-seadragon-mobile-fullheight {
    y-height: 100vh;
}

.scroller {
    y-padding: 0px 2% 0px 2%;
    padding: 0;
}

.page6bg-left {
    display: inline-block;
    y-height: 80vh;
    vertical-align: middle;
    line-height: 1;
    padding: 0;
    margin: 0;
    width: 50%;
    text-align: right;
}

.page6bg-right {
    display: inline-block;
    y-height: 80vh;
    vertical-align: middle;
    line-height: 1;
    padding: 0;
    margin: 0;
    width: 50%;
    text-align: left;
}

.page6bg-left a,
.page6bg-left a img,
.page6bg-right a,
.page6bg-right a img {
    float: none;
}

body,
html {
    height: 100%;
}

.logo {
    display: block;
    text-indent: -9999px;
    max-width: 140px;
    min-height: 24px;
    background: url(panasonic_logo_-blue.svg) no-repeat top left;
    background-size: 100% auto;
    transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -webkit-transition: all .3s ease-in-out;
}

[ng\:cloak],
[ng-cloak],
[data-ng-cloak],
[x-ng-cloak],
.ng-cloak,
.x-ng-cloak {
    display: none !important;
}

.displaynone {
    display: none;
}

.toc-slide {
    cursor: pointer;
    text-align: center;
    margin: 0.5em auto;
    float: none;
}

.toc-slide img {
    text-align: center;
    margin: 0.5em auto;
    border: 1px solid blue;
}

.toc-area {
    background-color: #F8F8F8;
    overflow-y: scroll;
    height: 70vh;
}

.bookpage-area>div {
    background-repeat: no-repeat;
    background-size: cover;
}

.bookpage-area div img {
    y-visibility: hidden;
    max-width: 100%;
}

.desaturate {
    -webkit-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
    filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");
}

img {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

.noselect {
    -webkit-touch-callout: none;
    /* iOS Safari */
    -webkit-user-select: none;
    /* Safari */
    -khtml-user-select: none;
    /* Konqueror HTML */
    -moz-user-select: none;
    /* Firefox */
    -ms-user-select: none;
    /* Internet Explorer/Edge */
    user-select: none;
    /* Non-prefixed version, currently
                                  supported by Chrome and Opera */
    outline: none !important;
}

.seadragon-nav-bar img {
    padding: 10px 5px !important;
}

body {
    font-family: "Microsoft JhengHei", Helvetica, Arial, sans-serif;
    font-size: 14px;
}