
.dialog {
    width: 300px;
    height: 150px;
    background-color: white;
    border: 1px solid #ccc;
    -webkit-box-shadow: 0 1px 5px rgba(0,0,0,.2);
    -mz-box-shadow: 0 1px 5px rgba(0,0,0,.2);
    box-shadow: 0 1px 5px rgba(0,0,0,.2);
    position: absolute;
    z-index: 100;
    color: #666;
    resize: both;
    overflow: clip;
    min-width: 150px;
    min-height: 150px;
    visibility: hidden;
}

    .dialog .dialog-title {
        margin: 0;
        padding: 0;
        font: inherit;
        color: inherit;
        font-weight: bold;
        height: var(--dialog-title-height);
        line-height: 2em;
        overflow: hidden;
        padding: 0 .8em;
        background-color: #eee;
        cursor: move;
    }

    .dialog .dialog-client {
        /*max-height: 100%;*/
        overflow: hidden;
        padding: 0 5px 5px 5px;
        height: calc(100% - var(--dialog-title-height) - var(--dialog-sizer-width));
        background-color: #eee;
    }

        .dialog .dialog-client .dialog-content {
            display: inline-block;
            overflow-y: scroll;
            overflow-x: auto;
            width: 100%;
            height: 100%;
            border: 1px solid #ccc;
            background-color: white;
        }

    .dialog .dialog-close,
    .dialog .dialog-minmax {
        border: none;
        outline: none;
        background: none;
        font: inherit;
        font-family: Arial,Sans-Serif;
        font-style: normal;
        font-weight: bold;
        font-size: 150%;
        line-height: 1.4em;
        color: #aaa;
        text-decoration: none;
        position: absolute;
        top: 0;
        right: .3em;
        text-align: center;
        cursor: pointer;
    }

    .dialog .dialog-minmax {
        right: 1.5em
    }

    .dialog .dialog-sizer-left,
    .dialog .dialog-sizer-right {
        width: 5px;
        height: 100%;
        background-color: red;
        background: transparent;
        position: absolute;
        cursor: e-resize;
    }

    .dialog .dialog-sizer-top,
    .dialog .dialog-sizer-bottom,
    .dialog .dialog-sizer-bottom-right,
    .dialog .dialog-sizer-bottom-left,
    .dialog .dialog-sizer-top-right,
    .dialog .dialog-sizer-top-left {
        width: 100%;
        height: 5px;
        background-color: red;
        background: transparent;
        position: absolute;
        cursor: n-resize;
    }

    .dialog .dialog-sizer-right,
    .dialog .dialog-sizer-bottom,
    .dialog .dialog-sizer-bottom-right {
        right: 0;
        bottom: 0;
    }

    .dialog .dialog-sizer-bottom-right {
        width: 5px;
        cursor: se-resize;
    }

    .dialog .dialog-sizer-bottom-left {
        width: 5px;
        bottom: 0;
        cursor: ne-resize;
    }

    .dialog .dialog-sizer-top-right {
        width: 5px;
        right: 0;
        cursor: ne-resize;
    }

    .dialog .dialog-sizer-top-left {
        width: 5px;
        cursor: se-resize;
    }

