/*=============================================== *
        Captured Ghosts, vesta skin
         -------------------------
         with love, from arceus
        last updated: Sep 8, 2022
*=============================================== */

:root {
        --font1: 'Verdana';
        --font2: 'Rye';F
        --font3: 'Lucida Calligraphy';
        --font4: 'Georgia';
        --transition1: all 1s ease-in-out;
        --transition2: all .5s ease-in-out;
        --transition3: all .3s ease-in-out;
        --baccent1: #A53F43;
        --baccent2: #E1797D;
        --baccent3: #341A1B;
}

html, body { margin: 0; padding: 0; height: 100%; }
body { background: linear-gradient(var(--back2), var(--back2)), url(../images/gunfighter-2560-org.jpg); background-attachment: fixed;background-position: center;background-size: cover;font: 300 1em/1.4em var(--font1), sans-serif; color: var(--text2); display: flex; flex-direction: column; }

p { margin: 1.5em 0; }

a { color: var(--accent1); text-decoration: none; }
a:hover { color: var(--accent2); text-decoration: underline; }

.wrapper { margin: 40px auto; background: var(--back3); color: var(--text3); width: 85%;}
.inner {padding: 20px;}
.inner b, .inner strong, .inner bold {font-weight: normal;color: var(--accent1);}
.inner i, .inner em, .inner italic {font-family: var(--font3); font-size: 1.1em;}
.inner img { max-width: 100%; }
aside {padding: 20px;}

/* Structural */
.flex, .mobileflex { display: flex; }
.flex1 { flex: 1; }
.flex01 { flex: 0.1; }
.flex05 { flex: 0.5; }
.flex03 { flex: 0.3; }
.flex55 {flex: 1 1 55%;}
.flex100 { flex: 1 1 100%; }
.flexwrap { flex-wrap: wrap; }
.flexcenter { align-items: center; }
.flexend {justify-content: flex-end;align-items: flex-end;}
.centertext { text-align: center; padding-top: 14px; }
.righttext { text-align: right; }
.sticky {position: sticky;top: 0;}
.fade{opacity: 0;transition: opacity .15s linear;}
.fade.in{opacity: 1;}
.tab-content>.tab-pane{display:none;}
.tab-content>.active{display:block;}
.gap5 {gap: 5px;}
.gap10 {gap: 10px;}
.margin0 {margin: 0;}
.margin2 {margin: 2px;}
.margin5 {margin: 5px;}
.floatright {float: right;}
.flex45 {flex: 1 1 45%;}

pre.language-markup {white-space: pre-wrap;padding: 40px;margin: 40px;background: var(--back1);border: 1px solid var(--border2);outline: 1px solid var(--groupdk);outline-offset: -10px;font-size: 0.8em;}

hr {margin: 10px 0;border: 0;height: 1px;}
h1, h2, h3, h5, .h1, .h2, .h3, h5 { margin: 0 0 10px 0; font-family: var(--font2); color: var(--accent2); }
h1, .h1 { font-size: 2em; }
h2, .h2 { font-size: 1.8em; }
h3, .h3 { font-size: 1.6em; }
h5, .h5 { font-size: 1.3em; }

h4, h6, .h4, .h6 { margin: 0 0 10px 0; font-family: var(--font3); color: var(--accent2); }
h4, .h4 { font-size: 1.4em; }
h6, .h6 { font-size: 1em; }

.description, .error_box, .success_box, .warn_box { margin: 5px 0 10px 0; border: 1px solid; padding: 10px; }
.description { background: var(--info1); color: var(--info2); border-color: var(--info2); }
.success_box { background: var(--success1); color: var(--success2); border-color: var(--success2); }
.warn_box { background: var(--warning1); color: var(--warning2); border-color: var(--warning2); }
.error_box { background: var(--danger1); color: var(--danger2); border-color: var(--danger2); }

.form_group { padding: 2px;gap: 4px; }
.form_prepend { padding: 10px 12px; flex: 1 1 15%; margin: 0; color: var(--accent1);min-width: 328px; }
.form_control {background: var(--back6);border: 1px solid var(--border2);font: 10pt/120% var(--font1), sans-serif;color: var(--text3);flex: 1 1 55%;padding: 0 10px;transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;}
.btn-file { position: relative; overflow: hidden; }
.btn-file input[type="file"] { position: absolute; top: 0; right: 0; min-width: 100%; min-height: 100%; font-size: 100px; text-align: right; filter: alpha(opacity=0); opacity: 0; outline: none; background: white; cursor: inherit; display: block; }

.input_check { position: absolute; opacity: 0; left: 0; top: 0; z-index: 2; }
.checkmark { position: absolute; top: 0; left: 0; height: 15px!important; width: 15px!important; background-color: var(--checkmark); border: 1px solid var(--border2); }
.checkbox { position: relative; margin: 4px 0; }
.checkbox label { margin-left: 20px; }
.checkmark:after { content: ""; position: absolute; display: none; }
.input_check:checked ~ .checkmark { background-color: var(--back4); }
.input_check:checked ~ .checkmark:after { display: block; left: 4px; top: 2px; width: 4px; height: 8px; border: solid var(--accent2); border-width: 0 2px 2px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }

.switch_contain { display: block; position: relative; cursor: pointer; user-select: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; padding: 10px; }
.switch_input { opacity: 0; position: relative; z-index: 9; width: 28px; height: 12px; }
.switch_display:after { font-family: 'Font Awesome 5 Free'; font-size: 25px; content: '\f204'; display: block; color: #A25959; visibility: visible; margin-top: -14px;font-weight: 600; }
.switch_input:checked ~ .switch_display:after { content: '\f205';font-weight: 600;color: #54AA4A; }

.btn {border: 0;padding: 8px 10px;font: 12pt/110% var(--font1), sans-serif;margin: 5px;}
.btn-file {text-align: center;}
p:first-child {margin-top: 0;}
p:last-child {margin-bottom: 0;}

main { flex: 1; }
.progress {background: var(--back4);}
.progress-bar-success {background-color: var(--success2);}
.progress-bar-warning {background-color: var(--warning2);}
.progress-bar-danger {background-color: var(--danger2);}

.nav-tabs {border: 0;list-style-type: none;margin: 0;padding: 0;}
.nav-tabs li {padding: 5px 10px;background: var(--back4);margin: 0 6px 0 0;display: inline-block;}
.nav-tabs li a:hover {text-decoration: none;}
.nav-tabs li.active {background: var(--accent2);}
.nav-tabs li.active a {color: var(--white);}
.nav-tabs li:hover {background: var(--accent1);}
.nav-tabs li:hover a {color: var(--black);}

.spacer {background: transparent;}
.tallycount {display: block;}
.smoltext {text-transform: none;font-variant: none;font-size: 0.7em;}
ul.pagination {list-style-type: none;margin:10px 0;padding: 0;display: flex;}
ul.pagination li {display: inline-block;background: var(--back2);padding: 6px 10px;}
ul.pagination li.active {background: var(--accent1);}
ul.pagination li.active a {color: var(--black);}
.button_strip {display: flex;}

/* Stylin */
aside div { flex: 1; margin: 2px; }
.inner_wrapper { display: flex; flex-wrap: wrap; }
#top_blocks, #bottom_blocks { display: flex; flex-wrap: wrap; flex: 1 1 100%; }
#left_blocks, #right_blocks { flex: 0.5; min-width: 274px; }
.content { flex: 3; }

.mobilemenu {display: none;position: absolute;top: 0;left: 0;bottom: 0;background: var(--back4);width: 25%;padding: 20px;z-index: 2;}
.mobilemenu a {display: block;margin: 10px 0;}
.showmobile {display: none;}
#mainmenu_click {padding: 10px;text-align: center;font-size: 2em;}

.header {width: 95%;max-width: 1200px;margin: 20px auto;position: relative;}
a.indexlink {position: absolute;top: 25px;left: 0;bottom: 0;right: 0;}
.menustrip {display: flex;justify-content: space-evenly;text-transform: none;}
.menustrip a {color: var(--text4);}

.headertitle1 {position: relative;top: -1.4em;left: 10em;font: 34pt serif;font-style: italic;text-transform: none;font: Rye;color: var(--text4);text-shadow: 0 0 5px var(--black);display: inline-block;}
.headertitle2 {position: relative;top: 0;left: 1.7em;text-transform: none;font: 50pt/200% Rye;color: var(--accent2);text-shadow: 0 0 5px var(--gray);display: inline-block;}

.usermenu {padding: 10px 6px;border: 1px solid var(--border2);border-width: 1px 0;background: var(--back3);font-size: 10pt;text-transform: none;}
.usermenu_avatar {position: absolute;left: 6px;}
.usermenu_avatar img {width: 25px;height: auto;border-radius: 100%;}
.usermenu_left, .usermenu_right {height: 30px;line-height: 30px;position: relative;}
.usermenu_left {padding: 0 0 0 30px;}

.menu_button { padding: 0 10px; border: solid var(--border1); border-width: 0 1px 0 0; position: relative; }
.menu_button:last-child { border: 0; }
.menu_button_children { position: absolute; top: 20px; left: 0; width: 300px; background: var(--back4); padding: 10px; display: none; }
a.menu_linkchild { display: block; }
.menu_button:hover > .menu_button_children { display: block; z-index: 9; }
a.newthings {color: var(--danger2);}

.toptitle {padding: 20px;font: 1.5em/1.2em var(--font2);text-transform: none;color: var(--accent1);background: var(--back1);border-bottom: 1px solid var(--border2);display: flex;}
.boardtitle {flex: 1;}
.navstrip {padding: 10px;background: var(--back3);border-bottom: 1px solid var(--border2);}
.nav2 .navstrip {border-top: 1px solid var(--border2);}
.navstrip a {margin: 0 20px 0 0;}
.navstrip a:last-child {margin: 0;}

#my_messages, #my_alerts {position: relative;}
#msg_drop, #alert_drop {position: absolute;width: 400px;background: var(--back4);border: 1px solid var(--border2);padding: 20px;z-index: 9;top: 34px;}
.msg_body, .alert_body {text-transform: none;}
.msg_body img, .alert_body img {width: 45px;height: auto;margin: 0 20px 0 0;}

.block_one {padding: 10px;background: var(--back1);border: 1px solid var(--border2);}
.block_too {padding: 10px;background: var(--back3);border: 1px solid var(--border2);}
.button_sm {font-size: 0.7em;text-transform: uppercase;padding: 5px 10px;background: var(--back4);margin: 2px;}

.category_title {padding: 10px 20px;font: 2.4em/1.2em var(--font2);text-transform: none;text-align: right;background: var(--back2);}
.forum_row {padding: 20px;background: var(--back1);}
.forum_icon {font-size: 22pt;background: var(--back2);width: 100px;height: 100px;display: flex;align-items: center;justify-content: center;outline: 1px solid var(--group);outline-offset: -10px;}
.forum_icon img { width: 80px; height: auto;opacity: 0.3;}
.forum_title {letter-spacing: .2em;text-align: center;text-transform: none;font-size: 1.6em;font-family: var(--font2);text-shadow: 0 0 5px var(--border2);padding-top: 8px;}
.forum_title a:hover {color: var(--text2);text-decoration: none;}
.newposts .forum_icon img {opacity: 1;}
.forum_information {flex: 1;padding: 10px;margin: 0 10px;}
.forum_desc {padding: 10px;}
.forum_lower {padding: 10px;border-top: 1px solid var(--groupdk);}
.forum_lastpost {width: 130px;text-align: center;}
.forum_lastpost img {width: 100px;border-radius: 100%;background: var(--back4);padding: 6px;border: 2px solid var(--groupdk);}

.online_row {padding: 20px;background: var(--back1);}
.onlav img {width: 50px;height: auto;}
.upper a img, .lower a img, .rcnttpcsav img {border-radius: 100%;outline: 1px solid var(--group);outline-offset: 3px;margin: 4px;}

.topic_row {display: flex;align-items: center;background: var(--back1);}
.modbox {position: absolute;right: 30px;top: 10px;}
.topic_info {position: relative;flex: 1;padding: 10px;text-align: center;}
.topic_stats {background: var(--border2);font-size: 10pt;-webkit-transform: rotate(-90deg);white-space: nowrap;width: 134px;display: flex;align-items: center;justify-content: center;text-transform: none;padding: 10px 0;gap: 10px;margin-left: -48px;color: var(--group);}
.topic_icon {flex: 0.1;}
.topic_info h6 {margin: 0;padding: 10px 5px;border-bottom: 1px solid var(--group);text-transform: none;font-size: 1.6em;font-weight: 300;}
.topic_info h6 .fas, .topic_info h6 .fab {margin: 0 10px;color: var(--warning2);}
.topicinfo {text-align: right;padding: 0 10px;}
.topicinfo strong {display: block;font-weight: 300;text-transform: none;font-size: 8pt;line-height: 100%;}
.topic_lastpost {flex: 0.1;text-align: center;background: var(--border2);padding: 57px 10px;}
.topic_info a {color: var(--group);}
.topic_block .row2, .topic_block .darkrow2 {display: none;}
.topic_block form .darkrow2 {display: block;text-transform: uppercase;font-size: 9pt;}
.topic_lpav {flex: 0.1;}
.topic_lpav img {width: 60px;height: auto;outline: 1px solid var(--group);outline-offset: 10px;border-radius: 100%;}
.topic_info .small {font-size: 10pt;text-transform: none;font-variant: small-caps;color: transparent;}
.topic_info .small a {background: var(--back1);padding: 2px 6px;margin: 2px;}
.topic-icons {position: relative;width: 90%;margin: 0 auto;top: 20px;}
.topic_info p {margin: 0.4em 0 1em 0;}

.topic-title {position: relative;width: 90%;letter-spacing: 2px;font-size: 30px;font-family: var(--font2);display: block;text-transform: none;color: var(--accent2);margin: 0 auto;}
.topic-desc { width: 100%; letter-spacing: 2px; font-size: 10pt; text-align: left; position: relative; display: block; text-transform: none; margin: 0 0 1em 8em; }
.topic-desc:before { content: "\f105";font-family: 'Font Awesome 5 Free'; font-weight: 600; margin-right:4px; display: inline; color: var(--accent1); font-size: 14pt; }
.topic_status {display: block;position: relative;width: 90%;margin: 10px auto;text-transform: none;font-size: 10pt;letter-spacing: 2px;}
.topic_status2 {text-transform: none;font-size: 10pt;letter-spacing: 2px;}
.topic-title .btn_smol {color: var(--text2);font-family: var(--font1), sans-serif;font-size: 14pt;}

.status {padding: 4px 10px;}
.open {background: var(--success1);color: var(--success2);}
.tagged {background: var(--info1);color: var(--info2);}
.complete {background: var(--baccent3);color: var(--baccent1);}

.navlinks a {display: block;padding: 4px;margin: 0 0 0 10px;}
.navlinks .h2 {color: var(--text2);text-transform: none;font-size: 1.5em;}
.claims .h4 { margin: 1em; font-size: 1.3em; letter-spacing: .2em; border-bottom: 3px solid var(--border1); font-family: var(--font2); text-transform: uppercase; color: var(--accent1); }
.claimrow h4 { margin-top: 2em; }
.claimrow { width: 90%; margin: 1em auto; }
ul.faces, ul.extras { width: 49%; display: inline-block; box-sizing: border-box; margin: 1em 0; list-style-type: none; padding: 0; }
.faces h4, .extras h4 { text-align: center; }
.faces li, .extras li { font-size: .85em; padding-left: 3em; text-transform: none; }
.faces li a, .extras li a { font-family: var(--font4); font-weight: bold; }
.extras li a:before { content: " | "; }
.claims strong { display: block; font-weight: 400; margin-left: 4em; font-size: .9em; text-transform: none; }
.claims strong:before { content: "- "; }
.claims .codetitle { margin: 2em 0 0; text-align: center; font: 1.2em/1em var(--font2); text-transform: uppercase; letter-spacing: .2em; color: var(--accent1); border-bottom: 1px solid; border-color: var(--border1); background-color: transparent; padding: 1em 1em 0; box-shadow: none; }
.claims .codecontent { background-color: transparent; }
.claims b, .claims strong { color: var(--text1); }
.claims .h5 {text-align: center;}

/*.post1 {margin: 20px auto;background: var(--back1);padding: 20px;border: 1px solid var(--border2);outline: 1px solid var(--accent1);outline-offset: 10px;}*/
.post1 dl {padding: 10px;margin: 10px;display: flex;flex-wrap: wrap;background: var(--back1);border: 1px solid var(--border2);}
.post1 dt {display: inline-block;color: var(--accent2);text-transform: uppercase;flex: 1 1 45%;padding: 10px;border-bottom: 1px solid var(--border1);}
.post1 dd {flex: 1 1 44%;padding: 10px;text-align: right;border-bottom: 1px solid var(--border1);margin: 0;}

.postcont {margin: 30px 0;}
.postcont:last-of-type {margin: 0;}

.poster_quote {font-family: var(--font4);font-style: italic;padding: 0 10px 10px 10px;margin: 0 20px 20px 20px;}
.post_block {width: 95%;margin: 0 auto 30px auto;outline: 1px solid var(--group);outline-offset: 10px;}
.post_bar {gap: 10px;padding: 10px;background: var(--back2);border: 1px solid var(--border2);}
.post_bar .fas {color: var(--group);}
.post_area {padding: 30px;background: var(--back1);border: 1px solid var(--border2);border-top: 0;margin-right: 245px;}

.post_side {position: absolute;top: 4px;right: 0;bottom: 0;}
.post_inner {position: relative;min-height: 420px;}

.poster_block {width: 240px;height: 420px;position: sticky;top: 4px;display: flex;align-items: center;}
.poster_img span {width: 220px;height: 400px;background-size: 220px;display: block;}
.poster_top {outline: 1px solid var(--group);outline-offset: 10px;margin: 0 auto;position: relative;overflow: hidden;}
.poster_slide {width: 220px;height: 400px;position: absolute;top: 400px;left: 0;background: var(--back6);backdrop-filter: blur(4px);transition: var(--transition2);}
.poster_top:hover > .poster_slide {top: 0;transition: var(--transition2);}

.poster_av {width: 100px;height: 100px;background-size: 100px;margin: 20px auto;outline: 1px solid var(--group);outline-offset: -5px;border: 1px solid var(--border2);}
.poster_infos {text-align: center;color: var(--text3); padding: 10px;}
.poster_rel {text-transform: uppercase;font-size: 9pt;line-height: 100%;margin: 0 0 20px 0;}
.poster_rel strong {display: block;font-weight: 300;color: var(--group);font-size: 16pt;font-family: var(--font1), sans-serif;letter-spacing: 3px;}

.poster_infos left {font-family: var(--font1), sans-serif;}
.poster_infos right {font-size: 8pt;}
.fcthing right {white-space: normal;}
.poster_infos hr {border-color: var(--group);}
.poster_name {padding: 0 10px 0 10px;margin: 0 20px 0 20px;font-size: 2.4em;font-family: var(--font2);line-height: 1em;text-transform: none;}
.poster_name .fas {font-size: 20pt;position: relative;top: -4px;}
.poster_title {text-align: center;margin: 20px 0 0 0;text-transform: none;font-size: 10pt;color: var(--text3);padding: 0 10px;}

.dir2 .poster_name, .dir2 .poster_quote {text-align: right;}
.dir2 .post_area {margin: 0;margin-left: 245px;}
.dir2 .post_side {left: 0;right: 1200px;}
.btn_smol {color: var(--text2);font-size: 0.8em;text-transform: uppercase;padding: 2px 6px;}
.postertime {color: var(--text2);font-size: 0.8em;text-transform: uppercase;}

.apost1 {width: 95%;margin: 30px auto;background: var(--back1);border: 1px solid var(--border2);outline: 1px solid var(--groupdk);outline-offset: 10px;}
.apost2 {padding: 30px;}

.recent_post {padding: 20px;background: var(--back3);position: relative;margin: auto;border: 1px solid var(--border2);}

.lp_avatar {outline: 1px solid var(--accent1);outline-offset: 10px;width: 40px;height: 40px;margin: 10px;border-radius: 100%;}
.lp_avatar img {border-radius: 100%;width: 40px;height: auto;}

.postheader .h2, .postheader .h5 {text-transform: none;text-align: center;}
.postheader .h2 a {color: var(--text3);}
.postbody { padding: 10px; }

.fayebox {width: 75%;margin: 30px auto;background: var(--back1);border: 1px solid var(--border2);outline: 1px solid var(--groupdk);outline-offset: 10px;position: relative;}
.fayebox_inner {padding: 20px;}
.fayebox_inner .tab-content {padding: 10px;height: 300px;overflow: auto;border-top: 1px solid var(--group);}
.fayepic {float: left;width: 50px;height: auto;margin-right: 10px;border-radius: 100%;}
.fayeheader1 {color: var(--group); font: 38px/20px var(--font3), display; text-transform: lowercase;}
.fayeheader2 {color: var(--group); font: 26px/28px var(--font2), display; text-transform: uppercase;}
.fayecredit:before {content: '\f5b7';font-family: 'Font Awesome 5 Free';font-weight: 600;color: var(--accent2);padding: 10px;position: absolute;bottom: -10px;left: -10px;font-size: 30px;}

.sitequotes .ianboard {outline: 0;margin: 10px;width: auto;}
.sitequotes .ianblock {padding: 0;}
.sitequotes .ianblock:before {content: '';}

.indexquote {margin: 0 40px 40px 40px;background: var(--back1);border: 1px solid var(--border2);padding: 20px;}

.character_row_av img {border-radius: 100%;margin: 0 10px 0 0;}
.pm_participants img {border-radius: 100%;margin: 4px;border: 1px solid var(--group);padding: 5px;}

.timeline_row {border: 1px solid var(--border2);padding: 10px;outline: 1px solid var(--group);margin: 10px 0;outline-offset: -10px;background: var(--back3);}
.timeline_row div {padding: 10px;text-align: center;}
.topicstatus-on {background: var(--success1);color: var(--success2);width: 120px;}
.topicstatus-off {background: var(--info1);color: var(--info2);width: 120px;}
.timeline_row img {outline: 1px solid var(--group);outline-offset: -4px;border-radius: 100%;}
.timeline_title a {font-size: 18pt;color: var(--accent2);}
div.timeline_data {text-transform: none;font-size: 10pt;margin: 0;padding: 0;}
.topicstatus {min-width: 140px;}

.imgupload { margin: 2px; }
.existing { position: relative; display: inline-block; }
.existing .checkbox { position: absolute; top: 0; right: 20px; }

.thread_box {margin: 10px 0;border: 1px solid var(--border2);padding: 10px;background: var(--back1);}
.thread_title {font-family: var(--font2);text-transform: none;font-size: 1.6em;line-height: 1.2em; margin-bottom: 5px;}

.profile_container {width: 90%;max-width: 980px;margin: 40px auto;position: relative;}
.profile_header {position: relative;background-image: url(../images/char-profile-1.jpg);}
.profile_header2 {width: 100%;height: 350px;outline: 1px solid var(--group);outline-offset: -10px;backdrop-filter: brightness(0.5);display: flex;justify-content: center;align-items: center;}
.profile_body {background: var(--back1);padding: 20px;align-items: flex-start;}
.profile_name {position: absolute;font: 30pt Lucida Calligraphy;text-transform: none;bottom: -2px;right: 20px;color: var(--group);text-shadow: 0 0 5px black;}
.profile_avatar img {border-radius: 100%;outline: 1px solid var(--group);outline-offset: 10px;width: 200px;height: auto;}
.profile_left {width: 275px;margin: 0 10px 0 0;}
.profile_left audio {width: 275px;height: 20px;margin: 20px 0;}
.profile_right {padding: 20px;flex: 1;background: var(--back1);}
.profile_right strong, .profile_right b {color: var(--group);font-weight: 300;}

.profile_row {display: flex;align-items: center;}
.profile_title {text-transform: none;font-weight: 600;font-size: 16pt;font-family: var(--font2);color: var(--group);padding: 0 10px;}
.profile_data {padding: 0 10px;text-align: right;}
.profile_row hr {flex: 1;border-color: var(--group);margin: 1em 0;}

.profile_interact {font-size: 24pt;display: flex;justify-content: space-evenly;}
.profile_interact a:hover {color: var(--group);}
.postquote {flex: 1 1 100%;margin: -18px 0 10px 50px;font-style: italic;font-size: 11pt;line-height: 1.2em;}

.profile_quote {text-align: center;padding: 10px;font-style: italic;font-family: var(--font4);}
.profile_quote .fas {margin: 0 10px 0 0;font-size: 18pt;color: var(--group);}

.profile_right dl {display: flex;flex-wrap: wrap;}
.profile_right dt {display: inline-block;color: var(--accent2);text-transform: none;flex: 1 1 45%;padding: 10px;border-bottom: 1px solid var(--groupdk); font-family: var(--font3); font-size: 18px; font-weight: bold;}
.profile_right dd {flex: 1 1 44%;padding: 10px;text-align: right;border-bottom: 1px solid var(--groupdk);margin: 0;}
#music_list audio {height: 20px;width: 100%;}
.profile_others {text-align: center;padding: 20px 0;border: 1px solid var(--group);border-width: 1px 0;margin: 20px 0 0 0;}
.profile_others img {width: 40px;height: auto;border-radius: 100%;border: 1px solid var(--group);padding: 2px;}
.profile_right dt.longanswer {flex: 1 1 100%;border: 0;padding-bottom: 8px; font-family: var(--font3); font-size: 24px; font-weight: bold;}
.profile_right dd.longanswer {flex: 1 1 100%;text-align: initial;padding-top: 5px; font: var(--font1);}

.profile_data {text-align: center;padding: 20px 0;border: 1px solid var(--group);border-width: 1px 0;background: var(--back1);}
.profile_avatar {position: relative;}
.profile_avatar .fas {position: absolute;bottom: 40px;font-size: 22pt;z-index: 2;}

.latest_news {color: var(--text4);letter-spacing: 0.2em;text-align: center;text-transform: none;font-size: 1.4em;font-family: var(--font2);text-shadow: 0 0 5px var(--border2);}

.character_row {display: flex;background: var(--back1);border: 1px solid black;outline: 1px solid var(--group);outline-offset: 10px;margin: 20px;}
.character_icon {font-size: 30pt;display: flex;align-items: center;background: var(--back4);}
.character_avatar img {width: 200px;height: auto;outline: 1px solid var(--group);outline-offset: -6px;}
.character_icon span {padding: 80px 75px;}
.character_info {padding: 10px;flex: 1;}
.character_link {font-size: 30pt;font-family: var(--font2);text-transform: none;margin: 10px;border-bottom: 1px solid var(--groupdk);line-height: 110%;}
.character_rel {text-align: center;color: var(--text2);text-transform: none;margin: 10px;}
.character_strip {text-align: center;align-items: center;display: flex;justify-content: space-evenly;margin: 10px;text-transform: none;}
.character_fc {font-size: 10pt;float: right;}

row {display: flex;width: 100%;align-items: center;}
left {color: var(--accent2);letter-spacing: 2px;text-transform: uppercase;}
middle {padding: 0 20px;height: 1px;width: auto;flex: 1;min-height: 20px;}
middle hr {background: var(--groupdk);}
right {letter-spacing: 2px;text-transform: none;font-size: 10pt;min-width: min-content;max-width: 300px;text-align: right;}

.flex-a { display: flex; justify-content: space-between; align-items: center; }
.memberlist { flex: 2; }
.member { width: 90%;margin: 40px auto;outline: 1px solid var(--group);outline-offset: 10px;padding: 10px;background: var(--back1);border: 1px solid black; }
.memberav { flex-shrink: 0;  height: 180px; width: 180px; border-radius: 35% 10%; padding: 0 20px 0 0;}
.memberav img { height: 100%; width: 100%; border-radius: 35% 10%; padding: 5px; background-image: linear-gradient(to bottom right, var(--group), var(--groupdk)); }
.membercontainer { flex: 2; padding: 10px;}
.membercontainer h6 { text-align: right; }
.reduce { font-size: .7em; font-family: var(--font2); text-transform: uppercase; color: var(--text3); }
span.details { display: block; padding: 15px 15px 0; text-transform: uppercase; letter-spacing: .2em; background-color: var(--back2); text-align: left;  }
span.details strong { font-weight: normal; display: block; }
span.memdeets { display: block; padding: 10px 0; }
.details em { font-style: normal; margin-bottom: 10px; display: block; text-align: center; font-family: var(--font4); }
.flex-a.h3 {  letter-spacing: .1em;  text-transform: none; font-size: 18pt;padding: 10px 0 0 0;}
.memberquote {padding: 10px 0;font-style: italic;font-family: var(--font4);}
.membercharacters {padding: 10px;display: flex;gap: 18px;flex-wrap: wrap;}
.membercharacters a img {border-radius: 100%;outline: 1px solid;outline-offset: 4px;width: 50px;height: auto;}

.postermobile {margin: 0 0 20px 0;text-align: center;}
.posterrow {display: flex;text-align: right;}
.postertitle {color: var(--group);text-align: initial;}

.recenttopic {text-transform: none;font-family: var(--font3);font-size: 1.0em;padding: 2px;}
.recenttime {border-top: 1px solid var(--accent2);padding: 2px 0 0 0;}

.quick_reply {margin: 16px;}
.quickreply_inner {padding: 10px;}

img.greyscale {filter: grayscale(1);opacity: 0.5;}

.character_block {text-align: center;background: var(--back1);padding: 10px;display: flex;justify-content: space-evenly;align-items: center;}
.character_left {flex: 1;}
.character_right {margin-left: 10px;}
.character_name {font-size: 20pt;line-height: 110%;font-family: var(--font2);text-transform: none;}
.character_boxes {display: flex;gap: 4px;}
.character_boxes span {background: rgba(0, 0, 0, 0.1);padding: 5px 12px;flex: 1;text-transform: uppercase;font-variant: small-caps;font-size: 8pt;}

.fullscreen_block {position: absolute;top: 25%;left: 25%;right: 25%;border: 1px solid var(--border1);outline: 1px solid var(--accent1);outline-offset: 10px;backdrop-filter: blur(5px);}
.fullscreen_footer {padding: 20px 10px 0 10px;text-align: center;text-transform: uppercase;font-size: 0.7em;}

.copyright { font-size: 0.5em; line-height: 2.1em; text-transform: lowercase; background: var(--back1); padding: 10px; }

.timeline_container { margin: 0 auto; max-width: 1200px; position: relative; }
.timeline_container::after { background-color: #808080; bottom: 0; content: ''; left: 50%; position: absolute; top: 0; width: 6px; }
.timeline_box {background-color: inherit;padding: 10px 40px;position: relative;width: 43.6%;}
.timeline_box::after { background: #222; border: 4px solid; border-radius: 50%; content: ''; height: 25px; position: absolute; top: 15px; right: -16px; width: 25px; z-index: 1; }
.timeline_left::before { border: medium solid white; border-color: transparent transparent transparent #343434; border-width: 10px 0 10px 10px; content: ''; height: 0; position: absolute; right: 30px; top: 22px; width: 0; z-index: 1; }
.timeline_right::before { border: medium solid white; border-color: transparent #343434 transparent transparent; border-width: 10px 10px 10px 0; content: ''; height: 0; left: 30px; position: absolute; top: 22px; width: 0; z-index: 1; }
.timeline_content { background: #343434; border-radius: 6px; padding: 10px 15px; position: relative; }
.timeline_box.timeline_right { margin-left: auto;margin-right: 0; }
.timeline_box.timeline_right::after { right: 0; left: -9px; }

@font-face {
        font-family: Hijrnotes;
        src: url(../font/hijrnotes.ttf);
}

/* Responsiveness */
@media screen and (max-width: 800px)
{
        .inner, .forum_row, .profile_right {padding: 4px;}
	.showmobile { display: block; }
	.nomobile { display: none!important; }
	.headertitle1 {left: 3em;}
        .headertitle2 {left: 0.4em;}
        .flex {display: block;}
        a.indexlink {display: none;}
        .post_area {margin: 0!important;}
        .showmobile.mobileflex {display: flex;}
        .indexquote {margin: 0 10px 10px 10px;}
        .forum_title {letter-spacing: 0.2em;}
        .button_strip {flex-wrap: wrap;}
        .profile_container {width: 98%;}
        .form_group.mobileflex {display: block;}
}