:root {
--background-color: #ffffff;
--highlight-color: #b6274e;
--main-color: #684e43;
--link-color: #86985c;
--link-color-hover: #8e6e29;
--secondary-link-color: #6d8436;
--secondary-link-border-color: #a5af97;
--secondary-content-background-color: #fffefc;
--link-button-background-color: #fffdfa;
--side-note-color: #a98467;
/* fefbf5 a8826c 324d67 */
}
body{margin:0;padding:0;font-family:"Source Sans Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6;color:#333}
a{color:var(--link-color)}
a:hover{color:var(--link-color-hover);cursor:pointer}
#background{position:fixed;top:0;overflow:hidden;height:0}
#wave-canvas{display:block;position:relative;top:0;left:5%;width:55%;min-width:850px;height:150px;border:0}
/*#main{z-index:2;margin:0 auto;position:absolute;padding-top:5%;width:100%;min-width:240px;text-align:center;background-color:rgb(254,250,246)}*/
#main{margin:0 auto 15px;padding:45px 30px 15px;width:100%;min-width:240px;text-align:center;background-color:var(--background-color)}
.highlight{color:var(--highlight-color);font-weight:600}
.highlight:hover{color:var(--highlight-color);font-weight:600}
.side-note{color:var(--side-note-color)}

.profile-pendant {display:none;bottom:-15px;right:-200px;position:absolute}
@media (min-width: 768px) { .profile-pendant {display:block} }

.main-content{padding:0;text-align:center;cursor:default;text-align:center;}
/*.main-content{background:rgba(238,238,238,0.95);padding:0;text-align:center;cursor:default;text-align:center;}*/
/*.main-content{margin-left:6.5104167%;width:86.9791667%;}*/
@media (min-width: 768px) {.main-content{width:66%;min-width:668px;margin:auto;}}
@media (min-width: 1200px) {.main-content{width:66%;max-width:1080px;margin:auto;}}

/* Avatar, Name, etc. */
.name{font-size:2.2em;font-family:"Source Sans Pro",Helvetica,sans-serif;color:var(--main-color);margin:0; font-weight: bold;}
#main-content-container{margin:0 auto;padding:15px 0 0;max-width:1080px;}
@media (min-width: 768px) { #main-content-container{padding:15px 0 0;} }
#main-content-container .col-avatar{text-align:center;min-width:220px;}
@media (min-width: 768px) { #main-content-container .col-avatar{text-align:center} }
#main-content-container .col-avatar .avatar{z-index:100;width:200px;height:200px;border-radius:100%;box-shadow:0 0 0 0.2em #eee;opacity:1;}
@media (min-width: 1400px) { #main-content-container .col-avatar .avatar{margin-bottom:-20px} }

#main-content-container .col-info{height:100%;align-items:center;}
#main-info-container{padding-top:15px}
#main-info-container .col-name{text-align:center;margin-top:30px}
@media (min-width: 768px) { #main-info-container .col-name{text-align:left;margin-top:0;}
}
#main-info-container .col-name .text{text-align:left}
#main-info-container .col-name .name{margin:0;color:var(--main-color);font-size:2em;font-family:"Source Sans Pro",Helvetica,sans-serif}
#main-info-container .col-name .email{color:#666; font-size:14px}
#main-info-container .col-link{text-align:center;margin:-5px 0 -25px;}
#main-info-container .col-link ul {margin:0px auto auto;padding:0;list-style:none;text-align:center}
#main-info-container .col-link li {display:inline-block;margin:auto;padding:0 10px;color:#ccc;line-height:10px}
#main-info-container .col-link li a{width:45px;height:45px;color:#ccc;padding:0;font-size:45px;line-height:45px}
#main-info-container .col-link li a:focus,
#main-info-container .col-link li a:hover{text-decoration:none;cursor:hand}
#main-info-container .col-link li a.border{border:1px solid #ccc;border-radius:100%;}
#main-info-container .col-link li a.padding{padding:0px 0px;font-size:22px}

/* Other */
.content-container{width:100%;padding:0 30px}
.main-news-container{margin:auto;padding: 0 0em;max-width:1080px;text-align:left;padding-top:30px;max-width:1080px;font-size:1rem;line-height:1.4}
@media (min-width: 1200px) { .main-news-container{padding-top:45px;} }
.subtitle{margin-top:0px;color:var(--main-color)}

section.overview ul,section.overview li,section.overview h3,section.overview h1,section.overview p{margin:0;padding:0}
section.overview h1{font-weight:700}
section.overview li{font-weight:400;list-style:none}
.join,.up::after,.down::before{background-position:50% 50%}
.up::after,.down::before{background-repeat:no-repeat;content:"";display:block;height:20px}
.up::after{background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI3IiBoZWlnaHQ9IjQiIHZpZXdCb3g9IjAgMCA3IDQiPjxwYXRoIGZpbGw9IiM1NjZjN2YiIGQ9Ik0xIDRWM2gxVjJoM3YxaDF2MWgxVjJINlYxSDVWMEgydjFIMXYxSDB2MiIvPjwvc3ZnPg==)}
.down::before{background-image:url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IURPQ1RZUEUgc3ZnIFBVQkxJQyAiLS8vVzNDLy9EVEQgU1ZHIDEuMS8vRU4iICJodHRwOi8vd3d3LnczLm9yZy9HcmFwaGljcy9TVkcvMS4xL0RURC9zdmcxMS5kdGQiPjxzdmcgdmVyc2lvbj0iMS4xIiBpZD0iTGF5ZXJfMSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI3cHgiIGhlaWdodD0iNHB4IiB2aWV3Qm94PSIwIDAgNyA0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCA3IDQiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwb2x5Z29uIGZpbGw9IiM1NjZjN2YiIHBvaW50cz0iNiwwIDYsMSA1LDEgNSwyIDIsMiAyLDEgMSwxIDEsMCAwLDAgMCwyIDEsMiAxLDMgMiwzIDIsNCA1LDQgNSwzIDYsMyA2LDIgNywyIDcsMCAiLz48L3N2Zz4=)}
.join{background-repeat:repeat-y;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxcHgiIGhlaWdodD0iMXB4IiB2aWV3Qm94PSIwIDAgMSAxIiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAxIDEiIHhtbDpzcGFjZT0icHJlc2VydmUiPjxwYXRoIGZpbGw9IiM1NjZjN2YiIGQ9Ik0wLDBoMXYxSDBWMHoiLz48L3N2Zz4=)}
.thin,.thick{background:#ffffff}
.thin{border:1px solid var(--secondary-link-border-color);padding:.5em}
.thick{border:3px solid var(--secondary-link-border-color);padding:.5em;color:var(--main-color);font-size:1.25rem}
.main{text-align:center}
.main ul{display:block;width:150px;margin:1em auto 0}
ul.row{width:100%;display:flex;align-items:flex-start}
ul.row li.page{flex:1;margin:0 .5em;min-width:280px}
ul.row li.page.stretch{align-self:stretch}
ul.row li.page:first-child{margin-left:0}
ul.row li.page:last-child{margin-right:0}
ul.row li.page h3 + ul.content{margin-top:1.5em}
ul.row li.page ul.content li{border-top:1px solid var(--secondary-link-border-color);padding:2px 5px}
ul.row li.page ul.content li.level-2{padding:2px 12px}
ul.row li.page ul.content li ul.section li{border-top:none;padding:0}
ul.row li.page ul.content li ul.section li:before{content:"― "}
section.overview{background:var(--secondary-content-background-color);transition:max-width 400ms ease-in-out;padding:20px;margin:auto;z-index:99}
section.overview .thin h3{will-change:auto;transition:transform 400ms ease-in-out;transform-origin:0 50%}
section.overview .thin b{display:block;padding:2px 5px}
section.overview .thin ul.content{transition:opacity 200ms ease;opacity:1}
@media (max-width: 1480px) { ul.row li.page{margin:0} }

.toggle-overview {background:var(--background-color);display:block;text-align:center;padding:5px;color:var(--main-color);font-weight:500}
.toggle-overview:hover {text-decoration:none}
/* @media (max-width: 560px) {section.overview {display:none}} */
.thick>p {font-size: 1rem}
.thick>p>a, .think>p>a:hover {background:var(--link-button-background-color);display:block;text-align:center;padding:5px;color:var(--main-color);font-weight:500;text-decoration:none}

#pub-container{margin:auto;padding: 0 0em;max-width:1080px;text-align:left;padding-top:30px;max-width:1080px}
#pub-container .subtitle{color:var(--main-color);}
#pub-container .subtitle a {font-size:18px; color: var(--secondary-link-color); font-weight:400}
#pub-container .subtitle a.activated {color:#333333; font-weight:600}
#pub-container .subtitle a.activated:focus,
#pub-container .subtitle a.activated:hover {text-decoration:none;cursor:initial}

#pub-container .subtitle-aux {font-size:1rem}
#pub-container .subtitle-aux a.activated {color:#333333}
#pub-container .subtitle-aux a.activated:focus,
#pub-container .subtitle-aux a.activated:hover {text-decoration:none;cursor:initial}
#pub-container .subtitle-aux .note{margin-left:1em;color:#999999;text-decoration:none;font-size:14px}

#pub-card-container{}
#pub-card-container>h5{margin-bottom: 5px 0}
#pub-card-container .pub-card{width: 100%;padding-bottom:15px;font-size:1rem;transition:background-color 0.2s;border-radius:6px}
#pub-card-container .pub-card:hover{background-color:#faf7f2}
#pub-card-container .pub-card .col-l{text-align:center;padding-top:10px}
#pub-card-container .pub-card .col-r{padding-top:10px}
@media (min-width: 768px) {
#pub-card-container .pub-card .col-l{flex:0 0 30%;max-width:30%}
#pub-card-container .pub-card .col-r{flex:0 0 70%;max-width:70%}
}
#pub-card-container .pub-card img{width:240px;height:150px;margin:0 auto}
#pub-card-container .pub-card video{width:240px;height:150px;margin:0 auto}
#pub-card-container .pub-card-body{width:100%;background:transparent;padding-left:0px}
#pub-card-container .pub-card .title{font-weight:600;font-size:1rem;margin-bottom:4px;line-height:1.4}
#pub-card-container .pub-card .authors{font-weight:400;color:#666666;margin-bottom:4px;line-height:1.4}
#pub-card-container .pub-card .authors a{color:#666666}
#pub-card-container .pub-card .authors u{color:#333333;font-weight:600;text-decoration:none}
#pub-card-container .pub-card .conference{color:#333333;font-weight:600}
#pub-card-container .pub-card .note{display:block;color:#999999;text-decoration:none;font-size:14px}
#pub-card-container .pub-card .info{margin-bottom:0;}
#pub-card-container .pub-card .info .area{margin-bottom:0;}
#pub-card-container .row{margin:0}
#pub-card-container .col-l,
#pub-card-container .col-r{vertical-align:top;display:inline-block;margin:0;padding-left:0px}

/* #footer{padding:0 0 1.5em;margin-top:2rem;min-width:240px;background:#fff;font-size:14px;line-height:12px;text-align:left;background:#fef8f3} */
#footer{padding:0 0 0.5em;margin-top:2rem;min-width:240px;background:#fff;font-size:14px;line-height:12px;text-align:left;}
#footer{background:url("/?originalUrl=https%3A%2F%2Fshulin16.github.io%2Fstatic%2Fimg%2Floong%2Floong-bottom-repeat.png"); background-size: 15px 15px; background-repeat: repeat;}
#footer .container{max-width:540px;padding:0 45px;position:relative}
#footer .row{align-items:center}
#footer .comic{padding-right:15px;padding-top:15px;}
#footer .copyright{flex-grow:1;margin:25px auto 5px;text-align:center;display:block;font-size:1rem;line-height:1.4;color:var(--main-color)}
#footer .stat{width:60px;height:60px;overflow:hidden;margin:0 auto 5px;padding 0;}
@media (min-width: 420px){ #footer .stat{display:block;width:60px;height:60px;overflow:hidden;margin:5px auto -25px;padding-right:15px;} }
#footer a{color:#666666}
#footer a:hover{color:#333333}

.bold{font-weight:600}
.hide{display:none}
.icon {
    font-size: 30px;
    margin-right: 5px; /* Adds a right margin to separate the icon from adjacent text or other elements */
}

.dark-red {
  color: #8B0000;
  font-weight: bold;
}

.corresponding-icon {
  font-size: 0.7em;
  vertical-align: super;
  margin-left: 1px;
  color: #888;
}

.award-badge {
  display: inline-block;
  background: linear-gradient(135deg, #f5a523, #e8910c);
  color: #4a2800;
  font-size: 0.85em;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: 4px;
  vertical-align: middle;
  line-height: 1.4;
}