body {
    font-family: georgia,sans-serif;
    font-size: 15px;
    background-color: rgb(243, 243, 243);
    color: rgb(46, 46, 46);
    margin: 0;
}

#content {
    max-width: 780px;
    margin: 0 auto;   
}

#narrow-content {
    max-width: 624px;
    padding: 20px 10px;
    margin: auto;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
}

.banner {
    padding: 10px 0 0 0;
    border-bottom-left-radius: 3px;
    border-bottom-right-radius: 3px;
    margin: 5px auto;
    font-size: 80%;
    color: #5F5F5F;
}
.banner ul {
    padding: 0;
    margin: 0 auto;
}
.banner li {
    display: inline-block;
    list-style: none;
    padding: 0px 10px;
}

.info {
    margin: 20px auto;
}
.info > * {
    text-align: left;
    display: table-cell;
    vertical-align: middle;
}
.info .portrait {
    width: 20%;   
}
.info .portrait img {
    width: 100%;
    border-radius: 5px;
}
.introduction {
    padding: 0px 20px 0px 20px;
}
.introduction > p {
    padding: 0px;
    margin: 5px 0;
}
.introduction > p > b {
    color: #3e3cc7;
}


.underline {
    text-decoration: underline;
}

.title {
    text-align: center;
    font-size: 25px;
    margin: 20px auto;
}
.authors {
    text-align: center;
    font-size: 16px;
    margin: 10px
}
.publisher {
    text-align: center;
    font-size: 16px;
    margin: 10px
}
.teaser {
    width: 65%;
    text-align: center;
    margin: 10px auto;
    border-width: 2px;
    border-style: solid;
    border-radius: 0px;
    padding: 0;
}
.teaser > img {
    width: 100%;
    margin: 0;
    padding: 0;
    vertical-align: middle;
}

.news > h3 {
    margin-bottom: 0px;
}

.news > ul > li {
    margin: 10px 25px 10px -20px;
    list-style-type: none;
}
.news > ul > li > .time {
    margin-left: -20px;
    font-style: italic;
}


.publications {
    padding-top: 30px;
}
.publications > h3 {
    margin-bottom: 0px;
}
.publications > p {
    margin-top: 5px;
    word-break: break-word; 
    overflow-wrap: break-word;
    padding: 5px 10px;
}
.publications > p::first-letter {
    font-size: 25px;
}
.publications > table {
    margin: 5px auto auto 5px;
    width: 80%;
}
.publications > ul > li {
    margin: 10px 25px 10px -20px;
    list-style-type: circle;
}

.publications > ul > li:hover {
    list-style-type: disc;
}

.publications > ul > li > div.labels {
    margin: 2px auto;
}

.publications > ul > li > div.labels > span, .info .introduction > p > span {
    margin: 0 0.125em 0.333em 0;
    background-color: darkgray;
    color: white;
    border-radius: 2px;
    border-collapse: collapse;
    border: 1px solid transparent;
    padding-right: 4px;
    padding-left: 4px;
    font-size: 12px;
    font-weight: 500;
    display: inline-block;
    word-wrap: break-word;
}

.publications > ul > li > div.labels > span:hover {
    background-color: blue;
}

.publications > .education {
    margin: 5px auto 5px 20px;
    text-align: left;
}
.publications > .education > * {
    margin: 2px auto 2px 0px;
}
.publications > .education > .period {
    max-width: 140px;
    text-align: center;
    color: #E8E1D8;
    background-color: #4F4F4F;
    border-radius: 10px 10px 0px 10px;
    padding: 2px;
}



.footer {
    text-align: center;
    margin: 50px auto 0 auto;
    font-size:small;
    color: #6f6f6f;
    vertical-align: text-bottom;
}
.footer > hr {
    color:#6f6f6f;
}
.footer > img {
    height:12px;
    vertical-align:middle;
}
.footer > a {
    text-decoration: none;
    color: darkgray;
    vertical-align: middle;
    font-family: "ZCOOL QingKe HuangYou script=latin rev=2";
}

li.mail {
    padding: 0px;
}
li.mail > img {
    padding: 0px;
    border-radius: 8px;
}

