.output-cell {
    .output-cell-show {
        line-height: 50px;
        padding-left: 15px;
        color: #999;
        cursor: pointer;
        transition: all 0.1s ease-out;

        &:hover {
            background-color: #f9f9f9;
        }
    }

    table {
        width: 100%;
        border-color: #e9e9e9;
        text-align: left;

        thead {
            background-color: #f7f7f7;
        }

        thead th,
        th,
        td {
            text-align: left !important;
            color: #666;
            padding: 8px;
        }

    }

    code {
        white-space: pre-wrap;
    }

    .ansi-black-fg {
        color: #fff;
    }

    .ansi-black-bg {
        background-color: #333;
    }

    .output-error-line {
        margin: 0;
        cursor: pointer;

        &:hover {
            background-color: #f0f0f0;
        }
    }

    .cell-output-error {

        &:hover .demo-inner,
        .demo-inner {
            border: 1px solid #df3416;
        }

        .cell-active {
            border: 1px solid #df3416;
            transition: border-color 0.2s ease 0s;
            box-shadow: #ec9a8b 0px 0px 0px 2px;
        }
    }


}

.ansi-black-span {
    box-sizing: border-box;
    span {
        white-space: nowrap;
    }
}

.ansi-warp-span {
    span {
        white-space: pre-wrap;
        word-wrap: break-word;
    }
}