.detail-page { width:92%; max-width:1120px; margin:110px auto 60px; color:#f1eef9; font-family:Roboto,Arial,sans-serif; }
.detail-page a { color:#73d9de; }
.detail-nav { margin-bottom:18px; line-height:2; }
.detail-nav a { display:inline-block; margin-right:16px; }
.detail-card { max-width:920px; padding:28px; background:#252537; border:1px solid #504968; border-radius:7px; font-size:16px; line-height:1.6; }
.detail-card h1 { margin-top:0; font-size:32px; line-height:1.16; }
.detail-card img { max-width:100%; height:auto; }
.detail-card .detail-avatar { width:96px; border-radius:8px; }
.detail-card table { width:100%; border-collapse:collapse; }
.detail-card th,.detail-card td { border-bottom:1px solid #514a65; padding:8px; text-align:left; }
.detail-card figure { margin:16px 0; }
.detail-card ul,.detail-card ol { padding-left:26px; }
.detail-list a { display:block; border-bottom:1px solid #514a65; padding:8px 0; }
.detail-action { display:inline-block; background:#64d7db; color:#1b1c29 !important; border:0; border-radius:5px; padding:9px 16px; margin:6px 6px 6px 0; cursor:pointer; text-decoration:none; }
.detail-modal { position:fixed; z-index:3000; top:0; left:0; right:0; bottom:0; padding:15vh 16px 16px; overflow:auto; background:rgba(0,0,0,.65); }
.detail-modal .detail-card { max-width:550px; margin:auto; }
@media(max-width:767px) {
  .detail-page { margin-top:84px; }
  .detail-card { padding:16px; }
  .detail-card h1 { font-size:24px; }
}