html,body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
    -webkit-print-color-adjust: exact;
}
body {
    padding-bottom: 60px;
    font-family: 'Microsoft YaHei',sans-serif;
}
header {
    padding: 40px;
    width: 680px;
    margin: 0 auto;
    color: #02ae51;
    font-weight: bolder;
    font-size: 30px;
    position: relative;
}
header small {
    font-size: 13px;
    display: inline-block;
    padding-left: 30px;
    position: relative;
    margin-left: 10px;
    line-height: 1.5em;
}
header small:before {
    content: '';
    display: block;
    height: 40px;
    width: 2px;
    background: #02ae51;
    position: absolute;
    left: 0;
}
header .print,
header .pdf {
    background: #95d142;
    display: block;
    position: absolute;
    right: 60px;
    padding: 7px;
    border-radius: 50%;
    top: 40px;
    cursor: pointer;
}

header .pdf {
    right: 120px;
}

header .print:before,
header .pdf:before {
    content: '';
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAABfElEQVRYR+2X603DQBCEZyogHUAJUAHQAVRASggV4FSASwgduANCB9BBSqCDQWNdrCOy7MtdFCuSV/KPKOfdz+N9mZjYOBRf0gOA+xMwfpDc9fkZA6gAGGJbALEEsCTZ6yMFACQNkmWSHLiaAWYFLkMBSc72uO5vQur31nBiWdwC8P2/0fktybV/d2UoaQXA1ybRcckx94YVySYGaGu9pOZTiUJvsArVWQAkPQF4B/Dqp54CwK92D1CfHcCvxoNtX4qTAMT5cTkAoS+8pWb3wLnHuBMmKxAA3IxKekMdar7bB44FKOoNfftAFkDGevZl2U8J4Gbivp5q7nRHAyxIumm0FnKgfQWSnAvXCdF/SHaDZ0CBhmQdt2Ivn58HC6iDeqM1gMGswph5Ae2mZwC4OpiGd1bT5/4tpZIs8SKK4Km1KxlQAaAB8B35tc8WMnkrluRSfBl7/Oj/dVBu3oqLFbDspSvZc+5S6srwVWqbrG/D0qgp9w9WQYqD0jN/IkhPMEBwEwkAAAAASUVORK5CYII=");
    display: block;
    height: 1em;
    width: 1em;
    background-size: contain;
}
header .pdf:before {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAB/0lEQVRYR+2X/VHCQBDF36tArQCtQK1AqUCtQK1ArECoQK1AO9AOkAqECtQO6GCdh3vOJlwSwGT4x51hSHJ3ud/u7VeIIGb2BuAkPlvjeg7gAMAugHcAzyRvm9YzA7CvxU0Lc+Mkh2Z2CmDs41LogqTgspIDAEm9ZCMJADMAhwCmAPpVEF0CjAB8Anjyf1lCMAXpFMCP5NyP1NwSBYjOAaSumR0BkD8sQXQJoA31SyIIWWMSfaxLgCon7hagLnQ8zxSirHUL/AP8W2BtC5jZXVh05dcbFaMVisfS+2lmyk5bkyoAFZIoymJn4UEcV/1XhuuF8UkpC6YhWSDOQxaApJ6rL1hMJjnxexWSHR/Xxiq3M5VaMxsCSMc58kJUbm4eAEiZX6kDiC+ckjxOmzhAbDzShq9uqXTfeLyrAoh4z+nHGQCNqx2Tdi8AWgd4JDkwM5nwpgKgD0Ctl/rBBCArJtGRXpa9vdIC5YlmpsWL8KwBUAf0EQCiD8g6UqAgdUcgj03EhR5xG0dQpP6JkuiE6YhkIUG37gM5AIWhzDpXs2lmspgaUMnfAADIeaRhVXsenUsbKhHF+E7tWHle2QXyiWhpVocPtl8LonLes/VIKqm0Lqv0hAMA9wCuSbZekhsBpLKZqeCkbzrl9jZFkfJV+V3gAAoveW+5xLYFUvgu+AYB+Xp4Sk6lGgAAAABJRU5ErkJggg==");
}
/* 头部分割线 */
.line {
    font-size: 0;
    position: relative;
    text-align: center;
}
.line img {
    height: 40px;
}
.line:before {
    content: '';
    display: block;
    height: 40px;
    position: absolute;
    width: 1000px;
    background: #02ae51;
    right: 50%;
    margin-right: 24px;
}
.line:after {
    content: '';
    display: block;
    height: 20px;
    position: absolute;
    width: 1000px;
    background: #95d142;
    left: 50%;
    margin-left: 24px;
    top: 20px;
}

/* 信息块的头部 */
.title {
    border-bottom: solid 2px #02ae51;
    position: relative;
    font-size: 0;
}

.title:before {
    content: '';
    background-image: url(../image/left-square.svg);
    height: 42px;
    width: 30px;
    position: absolute;
    left: -30px;
    top: 0;
    background-size: 100% 100%;
}
.title span {
    background: #02ae51;
    color: #fff;
    padding: 5px 20px;
    font-size: 14px;
    position: relative;
    display: inline-block;
    letter-spacing: 5px;
}
.title span:after {
    content: '';
    background-image: url(../image/lines.svg);
    height: 30px;
    width: 51px;
    display: block;
    position: absolute;
    right: -51px;
    top: 0;
    background-size: 100% 100%;
}

.resume {
    width: 680px;
    margin: 0 auto;
    padding-top: 40px;
    position: relative;
    color: #7b7b7b;
}
.resume:before {
    content: '';
    height: 100%;
    width: 2px;
    background: #02ae51;
    position: absolute;
    left: 0;
    top: 0;
}
.resume section {
    padding: 20px;
}
.resume table td {
    padding: 3px;
}
/* 右上角注意悬浮框 */
.attention {
    position: fixed;
    right: 0;
    border-radius: 5px 0 0 5px;
    background: #fff;
    padding: 10px;
    text-align: right;
    box-shadow: 0 0 9px 1px rgba(0, 0, 0, 0.44);
    line-height: 1.8em;
    font-family: cursive;
    font-size: 12px;
    top: 10px;
    width: 14em;
    text-align: left;
    display: none;
    z-index: 2;
}
.resume a {
    color: blue;
    text-decoration:none;
}
.resume span a {
    color: white;
    text-decoration:none;
}
/* 技能百分比样式 */
.resume .skills > span {
    margin: 5px;
    display: inline-block;
}
.resume .skills .c100 {
    font-size: 65px;
}
.skills .c100 .bar,
.skills .c100 .fill {
    border-color: #95d142 !important;
}
.skills .c100 > span,
.skills .c100:hover > span {
    color: #7b7b7b;
}
.skills .c100.small > span {
    font-size: 0.14em;
    line-height: 7em;
    width: 7em;
}
.skills .c100.small:hover > span {
    font-size: 0.17em;
    line-height: 6em;
    width: 6em;
    font-weight: bold;
}
.skills .c100.small.two-lines > span {
    font-size: 0.14em;
    line-height: 1.2em;
    width: 7em;
    top: 50%;
    margin-top: -15%;
}
.skills .c100.small.two-lines:hover > span {
    font-size: 0.17em;
    line-height: 1.2em;
    width: 6em;
    top: 50%;
    margin-top: -20%;
    font-weight: bold;
}
.skills .c100.p10 {
    opacity: .5;
}
.skills .c100.p10:hover {
    opacity: 1;
}

/* 项目经历 */
.project-title {
    font-weight: bold;
}
.project-title .company,
.project-title .job {
    margin-left: 57px;
    float: right;
}
.projects ul + .project-title {
    margin-top: 40px;
}
.projects ul li {
    margin-bottom: 10px;
    line-height: 1.5em;
    font-size: 15px;
}
/* 证书和个人观点文字样式 */
.certificate ul,
.opinion ul {
    margin: 0;
}
.certificate ul li,
.opinion ul li,
.skills ul li {
    margin-top: 10px;
    line-height: 1.5em;
}
/* 观点小问号 */
.opinion small {
    background: rgba(0, 0, 0, 0.63);
    display: inline-block;
    height: 15px;
    width: 15px;
    line-height: 15px;
    vertical-align: middle;
    text-align: center;
    color: #fff;
    border-radius: 50%;
    font-size: 12px;
    cursor: pointer;
}
.stop-watch {
    width: 100%;
    text-align: center;
    position: fixed;
    top: 0;
    background: #95d142;
    z-index: 10;
    padding: 2px;
    font-size: 12px;
    color: #fff;
}
/* 打印样式 */
@media print {
    header .print,
    header .pdf {
        display: none;
    }
    .stop-watch,
    .attention {
        display: none !important;
    }
}
footer {
    text-align: center;
    padding-top: 40px;
    font-size: 14px;
    color: #616161;
}
footer a {
    color: inherit;
}

.bold {
    font-weight: bold;
}

.domain {
    color: #c21111;
}