/* Please see documentation at https://docs.microsoft.com/aspnet/core/client-side/bundling-and-minification\ 
for details on configuring this project to bundle and minify static web assets. */
body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Wrapping element */
/* Set some basic padding to keep content from hitting the edges */
.body-content {
    padding-left: 5px;
    padding-right: 5px;
}

/* Carousel */
.carousel-caption p {
    font-size: 20px;
    line-height: 1.4;
}

/* Make .svg files in the carousel display properly in older browsers */
.carousel-inner .item img[src$=".svg"] {
    width: 100%;
}

/* QR code generator */
#qrCode {
    margin: 15px;
}

/* Hide/rearrange for smaller screens */
@media screen and (max-width: 767px) {
    /* Hide captions */
    .carousel-caption {
        display: none;
    }
}

/* .navbar-brand、.navbar-brand > imgは
    https://stackoverflow.com/questions/18474564/bootstrap-3-navbar-with-logo
    を参考にした
*/
.navbar-brand {
    padding: 0px;
}

.navbar-brand > img {
    max-height: 100%;
    height: 100%;
    -o-object-fit: contain;
    object-fit: contain;
}

/*
    split-panel
*/
html, body, .container {
    height: 100%;
    min-height: 100%;
    /*以下があるとロゴ位置が左寄りになる*/
    /*width: auto;*/
}

.body-content {
    min-height: 95%;
    height: 97%;
    width: auto;
    margin: 5px;
}

.split-pane {
    border: 2px solid #aaa;
}

.split-pane-divider {
    background: #aaa;
}
/* .split-paneの枠と#split-pane-verticalの
    枠が重なり太くなるので、0とする
*/
#split-pane-vertical {
    border: 0 solid #aaa;
}

#vertical-divider {
    left: 20em; /* same as left component width */
    width: 2px;
}

#horizontal-divider {
    bottom: 7em;
    height: 2px;
}

#top-component {
    bottom: 7em;
    min-height: 2px;
}

#left-component {
    width: 20em;
    padding: 5px;
}

#right-component {
    left: 20em;
    margin-left: 15px; /* same as divider width */
    margin-right: 15px;
    padding-left: inherit;
}

#bottom-component {
    padding: 5px;
    height: 7em;
}

#node_detail {
    width: 100%;
    max-height: 100%;
    padding: 8px;
    line-height: 20px;
    border: 1px solid #aaa;
}

#node_thumbnail {
    display: block;
    margin: 5px;
}

#node_raw_data {
    display: block;
    margin: 5px;
}

.active-toggle {
    background-color: #265a88;
}

.footer {
    padding-top: 5px;
    padding-right: 10px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
}