body {
    font-family: consolas, Verdana, sans-serif;
    font-size: 1.2em;
    color: #696e71;
    display: grid;
    grid-template-columns: 1fr 5rem;
}

.main_section {
    width: 90%;
    margin: 0 auto;
}

#float_menu{
    position:fixed;
    top:0;
    right:0;
    text-align: center;
}

#float_menu .menu-item {
    cursor: pointer;
    padding: .5em;
    margin: .5em 0;
    color: #c08580;
    background-color: #f8f0ef;
    font-size: 1.2em;
}



.result{
    display: flex;
}


.result_table{
    border-collapse: collapse;
    border: 1px solid #f0e0e5;
    width: 30em;
    text-align: center;
    font-size: 1.0em;
}

.result_table td{
    border: 1px solid #f0e0e5;
    padding: .3em;
}

.result_barchart{
    width: 30em;
    margin: 0 5em 0 5em;
}

.barchar_item{
    margin: 2.5rem 0;
}

.barchart_barbox {
    margin: 0.5em 0;
    width: 100%;
    background-color: #fff;
    border: 1px solid #86c2dd;
    border-radius: .2em;
}

.barchart_bar {
    text-align: right;
    height: 1.2rem;
}





.h3_button {
    margin: 1.5em;
    cursor: pointer;
    color: #03a9f4;
}


.info
{
    white-space:pre-wrap;
    margin: .8em 1.5em;
}


.error-info
{
    color: #a64747
}

.suite_dir {
    margin: 1em .2em;
    padding: .3em;
    /* background-color: #dfeff6; */
    border: 1px solid #bcd8e4;
}
.suite_file {
    margin: 1em .2em;
    padding: .3em;
    border: 1px solid #bcd8e4;
}


.case {
    margin: 1em .2em;
    /* padding: .3em; */
    border: 1px solid #e7d4d4;
}

.case_class_path{
    margin: 0em 1em;
}


.folder_header {
    padding: .2em .7em;
    background-color: #fffaf9;
    cursor: pointer;
}


.setup{
    margin: .2em;
    /* padding: .3em; */
    /* border: 1px solid #e7d4d4; */
}
.teardown{
    margin: .2em;
    /* padding: .3em;*/
    /* border: 1px solid #e7d4d4; */
}
.test_steps{
    margin: .2em;
    padding: .3em;
    /* border: 1px solid #e7d4d4; */
}


.label {
    display: inline-block;
    padding: .1em .5em;
    font-size: .88em;
    letter-spacing: 1px;
    white-space: nowrap;
    color: #0d6ebc;
    border-radius: .2em;
    min-width: 5em;
    margin-right: 2em;
    font-family: consolas;
}

/* .suite_setup .label{
    color: #219e26 ;
}
.suite_teardown .label{
    color: #219e26;
} */


/* .case.pass   .casename{
    color: #329132 ;
} */
.case.pass   .caselabel{
    color: white;
    background-color: #3b9e3f;
}
/* .case.fail   .casename{
    color: #a64747;
} */
.case.fail   .caselabel{
    color: white;
    background-color: #a64747;
}
/* .case.abort   .casename{
    color: #953ab7;
} */
.case.abort   .caselabel{
    color: white;
    background-color: #9c27b0;
}



.case_step  {
    margin: .8em;
}
.checkpoint_pass {
    margin: .8em;
}
.checkpoint_fail {
    margin: .8em;
}

.case_step  .tag{
    color: #2196f3;;
    margin: .3em 1em .3em 0;
    padding: .1em .3em;
    font-size: .92em;
}

.checkpoint_pass .tag{
    color: #009806;
    margin:.3em 1em .3em .5em;
    padding: .1em .3em;
    font-size: .92em;
}
.checkpoint_fail .tag{
    color: #9c2020;
    margin:.3em 1em .3em .5em;
    padding: .1em .3em;
    font-size: .92em;
}

.screenshot {
    border: 1px solid #86c2dd;
}

.executetime {
    float: right;
}

/* 模态框内容 */
.modal-content {
    margin: auto;
    display: block;
    width: 95%;
    max-width: 700px;
    max-height: 80vh; /* 设置最大高度为视口高度的80% */
    object-fit: contain; /* 保持图片的宽高比 */
    zoom: 3;
}

/* 模态框 */
.modal {
    display: none; /* 隐藏 */
    position: fixed; /* 固定位置 */
    z-index: 1; /* 坐在顶部 */
    padding-top: 40px; /* 在图片上方添加一些内边距 */
    left: 0;
    top: 0;
    width: 100%; /* 宽度 */
    height: 100%; /* 高度 */
    overflow: auto; /* 启用滚动 */
    background-color: rgb(0,0,0); /* 背景颜色 */
    background-color: rgba(0,0,0,0.9); /* 黑色背景半透明 */
}

/* 关闭按钮 */
.close {
    position: absolute;  /* 定义元素的定位方式为绝对定位 */
    top: 10px;           /* 距离最近的已定位祖先元素顶部15像素 */
    right: 30px;         /* 距离最近的已定位祖先元素右侧35像素 */
    color: #f1f1f1;      /* 文本颜色为浅灰色 */
    font-size: 15px;     /* 字体大小为40像素 */
    font-weight: bold;   /* 字体加粗 */
    transition: 0.3s;    /* 过渡效果，0.3秒内完成 */
}


.close:hover,
.close:focus {
    color: #bbb;
    text-decoration: none;
    cursor: pointer;
}