.detection-demo {
    /*box-sizing: content-box;*/
    width: 100%;
    margin: 0 auto;
    max-width: 1920px;
}

#detection, #verification {
    display: inline-block;
}

.detection-demo-intro {
    font-size: 15px;
    font-family: "Segoe UI Light","Microsoft YaHei","微软雅黑";
    font-weight: 300;
    margin-bottom: 15px;
}

.detection-demo-right {
    float: right;
    width: 50%;
    position: relative;
    display: inline-block;
}

    .detection-demo-right div.filler {
        margin-top: calc(73.92% + 32px);
    }

.luis-white-tooltip + .tooltip > .tooltip-inner {
    background-color: white; color:black; 
    opacity:1;
    filter:alpha(opacity=100);
    border: solid 1px #004b50;
    
}
.luis-white-tooltip + .tooltip > .tooltip-arrow {
    border-bottom-color:#004b50!important;
}



.detection-demo .image-list {
    /*left: -6px;
    bottom: -6px;*/
    position: absolute;
    width: 100%;
    position: relative;
    height: 1px;
    margin-top: 50px;
}

    .detection-demo .image-list .image-item {
        float: left;
        min-height: 96px;
        width: calc(16.66% - 6px);
        margin: 0 0px 20px 6px;
        position: relative;
    }

        .detection-demo .image-list .image-item:first-child {
            margin-left: 0px;
        }

        .detection-demo .image-list .image-item div {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(255,255,255,0.5);
            cursor: pointer;
        }

        .detection-demo .image-list .image-item img {
            width: 100%;
        }

.demo-codes {
    word-wrap: break-word;
    color: #2a2a2a;
    border: solid 1px #939393;
}

    pre.code[data-name='code'] {
        text-align: left;
    }

     pre.code[data-name='text'] {
        text-align: left;
    }

.demo-btn-list {
    text-align: left;
    }

.detection-demo-codes pre:before {
    content: "Detection Result:\a ";
}

.verification-demo-codes pre:before {
    content: "Verification Result:\a ";
}

.detection-demo-codes {
    display: inline-block;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    overflow-y: scroll;
    overflow-x: hidden;
}

.verification-demo-codes {
    display: block;
    position: relative;
    width: 100%;
    height: 76px;
    margin-top: 40px;
    overflow: hidden;
}

    .verification-demo-codes pre {
        padding-top: 10px !important;
    }

.verification-demo {
    width: 100%;
    margin: 0 auto;
    max-width: 1920px;
}

.verification-demo-intro {
    font-size: 15px;
    font-family: "Segoe UI Light","Microsoft YaHei","微软雅黑";
    font-weight: 300;
}

.verification-demo-box {
    width: 100%;
    display: inline-block;
}

.verification-leftDemo, .verification-rightDemo {
}

    .verification-leftDemo > div {
        float: left;
    }

    .verification-rightDemo > div {
        float: right;
    }

.verification-demo .image-list {
    width: 100%;
    margin-top: 10px;
    display: inline-block;
}

    .verification-demo .image-list .image-item {
        float: left;
        width: 24.4%;
        margin-right: 0.8%;
        position: relative;
    }


        .verification-demo .image-list .image-item:last-child {
            margin-right: 0;
        }

        .verification-demo .image-list .image-item div {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(255,255,255,0.5);
            cursor: pointer;
        }


        .verification-demo .image-list .image-item img {
            float: left;
            width: 49%;
            margin-bottom: 3px;
            margin-right: 0%;
        }

            .verification-demo .image-list .image-item img:first-child {
                margin-right: 2%;
            }

pre {
    padding: 15px 26px 0px 26px;
    font-family: Consolas,Courier,monospace !important;
    font-size: 13px;
    border: 0px;
    background-color: #ffffff;
}

.negative {
    color: #f7941d;
    background-color: white;
}

    .negative.down {
        color: white;
        background-color: #f7941d;
    }

    .negative:hover {
        color: white;
        background-color: #fbaf5d;
    }

.positive {
    color: #00b294;
    background-color: white;
}

    .positive.down {
        color: white;
        background-color: #00b294;
    }

    .positive:hover {
        color: white;
        background-color: #68dcbf;
    }

.maskLayer{
    position: absolute;
    left: 0px;
    top: 0px;
    height: 100%;
    width: 100%;
    z-index: 1000;
    background-color: rgba(51,51,51,0.7);
    display: none;
} 

.googleReCaptcha-normal{
    top:calc(50% - 40px);
    margin:auto auto;
    text-align:center;
    width:300px;
    position:relative;
}

 .googleReCaptcha-compact{
    top:calc(50% - 70px);
    margin:auto auto;
    text-align:center;
    width:160px;
    position:relative;
}