Pro for Onigiri Pls

/* Profile By AlthIndor */

html {
 --border-lite: #00000030;
 --border-dark: #FFFFFF30;
 --primary-color: #6441A4FF;
 --primary-darkr: #6441A480;
 --text-dark: #FFFFFFB2;
 --col1-width: 250px;
 --col3-width: 350px;
}

html {background: linear-gradient(to right, #19171C var(--col1-width), #FFFFFF var(--col1-width));}
html a {text-decoration: none !important;}

html, #columns {min-width: 768px;}

/* Header */

#viewer #gaia_header, #gaia_header #header_left, #gaia_header #header_right {
 background: var(--primary-color);
 height: 50px !important;
}
#viewer #gaia_header * {box-sizing: border-box;}
#viewer #gaia_header li.spacer {display: none !important;}

#gaia_header #header_left, #gaia_header #header_right {
 width: auto !important;
 font-size: 0 !important;
 padding: 0 3px !important;
}
#gaia_header #header_left {line-height: 48px !important;}

#gaia_header #header_right {
 float: right;
 line-height: 26px !important;
}

#header_left li img {
 background: url('https://graphics.gaiaonline.com/images/gaia_global/gaia_header/br_gaia_logo_header.png');
 background-size: 100% auto !important;
 width: 0 !important;
 padding: 0 50px 0 0 !important;
}

#viewer #gaia_header a {
 display: inline-block !important;
 padding: 0 8px;
}

#header_left a {
 color: var(--text-dark) !important;
 font-size: 14px !important;
 font-weight: normal;
}
#header_left li:nth-of-type(n+3) a {height: 100%;}
#header_left li:nth-of-type(n+3) a:hover {box-shadow: 0 -2px #FFFFFF inset;}
#header_left a:hover {color: #FFFFFF !important;}

#header_right a {
 background: #FFFFFF20;
 height: 28px;
 color: #FFFFFF !important;
 font-size: 11px !important;
 margin: 11px 5px 0 5px;
 border-radius: 3px;
}
#header_right a:hover {background: #FFFFFF30;}

/* Header Custom Texts */

#viewer #header_right a[href*='mode=edit'] {display: none !important;}
#header_right a[href*='report.php'] {font-size: 0 !important;}

#header_right a[href*='report.php']::after {
 content: 'Report Profile';
 font-size: 11px !important;
}

/* Columns */

#columns, #column_1, #column_2, #column_3 {
 padding: 0;
 margin: 0;
 box-sizing: border-box;
}

#columns {
 width: 100%;
 height: calc(100% - 50px);
 top: 50px;
}

#column_1, #column_2, #column_3 {
 line-height: 0;
 position: relative;
 overflow-y: scroll;
}
#column_1, #column_2 {height: 100%;}

#column_1 {
 background: #19171C;
 width: var(--col1-width);
 padding: 10px 0;
}

#column_2 {
 width: calc(100% - var(--col1-width) - var(--col3-width));
 padding: 0 20px;
 border-right: 1px solid var(--border-lite);
 transform: translateZ(0);
}

#column_3 {
 height: calc(100% - 60px);
 width: var(--col3-width);
 padding: 10px;
 border-bottom: 1px solid var(--border-lite);
}

/* Scrollbars */

.column {scrollbar-width: thin;}
#column_1 {scrollbar-color: #000000A0 #FFFFFF10;}
#column_2, #column_3 {scrollbar-color: #000000A0 #00000010;}

#columns ::-webkit-scrollbar {width: 8px;}
#column_1::-webkit-scrollbar {background: #FFFFFF10;}
#column_2::-webkit-scrollbar {background: #00000010;}
#column_3::-webkit-scrollbar {background: #00000010;}

#columns ::-webkit-scrollbar-thumb {
 background: #000000A0 content-box;
 border: 1px solid transparent;
 border-radius: 4px;
}

/* Panels */

.panel, .panel h2 {
 background: none;
 font-size: 11px;
 line-height: 1.5;
 padding: 0;
 margin: 0;
 box-sizing: border-box;
}

#column_1 .panel {color: var(--text-dark);}
#column_1 .panel:nth-last-of-type(n+2), #id_footprints {margin-bottom: 20px;}

#column_1 a {color: inherit;}
#column_1 .panel:not(#id_forum) a {font-weight: normal;}

#column_2 .panel, #column_3 .panel {color: #404040;}
#column_2 a, #column_3 a {color: var(--primary-color);}

.panel h2 {
 color: inherit;
 font-size: 14px;
 font-weight: normal;
 text-transform: capitalize;
}
#column_1 h2, #column_3 h2 {padding-bottom: 5px;}
#column_2 .panel:not(#id_details):not(#id_about) h2 {display: none;}

#column_1 h2 {
 margin: 0 10px 10px 10px;
 border-bottom: 1px solid var(--border-dark);
}

#column_3 h2 {
 margin: 0 0 10px 0;
 border-bottom: 1px solid var(--border-lite);
}

/* Friends, Wish List, Equipment */

#id_friends .style1 li, #id_equipment .item a, #id_wishlist .item a {
 display: grid;
 grid-template: 21px 1fr / 40px 1fr;
 grid-gap: 5px 10px;
}
#id_friends .style1 li:hover, #id_equipment .item:hover, #id_wishlist .item:hover {background: #FFFFFF10;}
#id_friends .style1 li:hover a::before, #id_equipment .item:hover a::before, #id_wishlist .item:hover a::before {color: #FFFFFF;}

#id_friends .dropBox, #id_equipment .item img[src*='thumbnail'], #id_wishlist .item img[src*='thumbnail'] {
 grid-area: 1/1/3/2;
 background: var(--primary-darkr);
 border-radius: 50%;
}

#column_1 a::before, #column_1 a::after {
 text-overflow: ellipsis;
 white-space: nowrap;
 overflow: hidden;
}

#id_friends a::before, #id_equipment .item a::before, #id_wishlist .item a::before {
 content: attr(title);
 font-size: 11px;
}
#id_friends a::after, #id_equipment .item a::after, #id_wishlist .item a::after {font: 6px monospace;}

/* Friends */

#id_friends a {font-size: 0;}
#id_friends h2 ~ p {display: none;}
#find_friends_banner {display: none;}

#id_friends .style1 li {
 height: auto;
 width: 100%;
 padding: 5px 10px;
 box-sizing: border-box;
}

#id_friends p {
 grid-area: 1/2/3/3;
 width: 170px;
 display: flex;
 align-items: center;
 text-align: left;
 margin: 0;
}
#id_friends p span {max-width: 100%;}

#id_friends a::after {
 content: attr(href);
 display: block;
 margin: 4px 0;
}

#id_friends .dropBox {
 width: 40px;
 height: 40px;
 overflow: hidden;
}
#id_friends .dropBox img {margin: -4px 0 0 -6px;}

/* Equipped, Wish List */

#id_equipment .item, #id_wishlist .item {
 float: none;
 padding: 5px 10px;
 position: relative;
}
.premium_sparkle {display: none;}

#id_equipment .item a::before, #id_wishlist .item a::before  {
 grid-area: 1/2/2/3;
 align-self: flex-end;
}

#id_equipment .item a::after, #id_wishlist .item a::after {
 content: attr(id);
 grid-area: 2/2/3/3;
 align-self: flex-start;
 text-indent: -4px;
}

#id_equipment .item img[src*='thumbnail'], #id_wishlist .item img[src*='thumbnail'] {
 width: 30px;
 height: 30px;
 padding: 5px;
}

.owner_checkmark {
 grid-area: 1/1/2/2;
 margin: 0;
 top: 35px;
 left: 10px;
}

/* Forums */

#id_forum {text-align: left;}
#id_forum p, #id_forum a {margin-left: 10px;}
#id_forum p:last-of-type {margin: 0;}
#id_forum a {color: #FF7FAC;}

/* Details */

#id_details {
 background: url('https://images8.alphacoders.com/739/739671.png') no-repeat center / cover;
 width: calc(100% + 40px);
 height: 430px;
 margin: 0 0 20px -20px;
}
#id_details p:nth-of-type(n+2) {display: none;}
#id_details .forum_userstatus {display: none;}

#id_details h2 {
 background: #F8F8F8;
 width: 100%;
 height: 50px;
 font-size: 18px;
 line-height: 50px;
 padding-left: 120px;
 position: absolute;
 bottom: 0px;
 left: 0;
 border-top: 1px solid var(--border-lite);
 border-bottom: 1px solid var(--border-lite);
}

#id_details p:first-of-type {
 background: #FFFFFF;
 width: 96px;
 height: 96px;
 position: absolute;
 bottom: -7px;
 left: 10px;
 border: 2px solid #FFFFFF;
 border-bottom-width: 4px;
 box-shadow: 0 3px 0 0 #FF7FAC;
 overflow: hidden;
}
#id_details p:first-of-type img {margin: -8px 0 0 -6px;}

/* Media */

.media_panel {
 height: calc((100vw - var(--col1-width) - var(--col3-width) - 40px) / 16 * 10) !important;
 margin-bottom: 20px;
 border: 1px solid #D8D8D8;
}
.media_panel h2 {display: none;}

.media_panel iframe {
 width: 100%;
 height: 100%;
}

/* About */

#id_about {
 float: left;
 width: calc(100% - 360px);
 min-height: 285px;
 margin: 15px 0 20px 20px;
}

#id_about h2 {
 float: left;
 margin: -15px 10px -5px -10px;
}

/* Contact, Store, Journal */

#id_about h2, #id_contact, #id_store, #id_journal {width: 310px;}

#id_contact, #id_store, #id_journal {
 float: left;
 margin-left: 20px;
}

#id_contact ul:not(.buttons) li:nth-of-type(n+2), #id_store, #id_journal, #id_about h2 {
 background: url('https://images2.imgbox.com/de/f3/NA27IPTk_o.png') no-repeat;
 height: 100px;
 font-size: 0;
 position: relative;
}

#id_contact ul:not(.buttons) li:nth-of-type(2) {background-position: 0 -100px;}
#id_contact ul:not(.buttons) li:nth-of-type(3) {background-position: 0 -200px;}
#id_store {background-position: 0 -300px;}
#id_journal {background-position: 0 -400px;}

#id_contact ul:not(.buttons) li a, #id_store a, #id_journal a[href*='?u'] {
 display: block;
 width: 100%;
 height: 100%;
 position: absolute;
 top: 0;
 left: 0;
}

#id_contact ul:not(.buttons) li:first-of-type {
 background: var(--primary-color);
 width: 120px;
 height: 30px;
 text-align: center;
 text-indent: -2px;
 position: fixed;
 top: 390px;
 right: 10px;
 border-radius: 3px;
}
#id_contact li span, #id_contact li a {font-size: 0;}

#id_contact ul:not(.buttons) li:first-of-type::after {
 content: '❤ Add Friend';
 color: #FFFFFF;
 font-size: 14px;
 line-height: 28px;
 pointer-events: none;
}

/* Journal */

#id_journal h3 {display: none;}
#id_journal ul {display: none;}
#id_journal p:last-of-type {display: none;}

/* Store */

#id_store {margin-bottom: 20px;}
#id_store h3 {display: none;}
#id_store div {display: none;}
#id_store p:first-of-type {display: none;}

/* Comments, Visitors */

#id_comments #alert_container {width: 100%;}
#id_comments #alerts_banner {display: none;}
#id_comments #alert_container {padding: 0px;}
#id_comments .dropBox {display: none;}
#id_comments .deletecomment {margin: 0 0 0 10px;}
#id_comments h2 ~ p {display: none;}

#id_comments dd:nth-last-of-type(n+2) {margin-bottom: 15px;}
#id_comments dd:last-of-type {margin-bottom: 0;}

#id_comments dt {
 height: auto;
 line-height: inherit;
 text-align: left;
 padding: 0;
 position: relative;
 border: none;
 overflow: hidden;
}

#id_comments .username {
 background: #FFFFFF;
 margin-left: 12px;
 position: relative;
 z-index: 2;
}
#id_comments .username::after {content: ':'}

#id_comments .date {
 color: var(--primary-color);
 margin-left: -5px;
}

#id_comments .date a {
 display: block;
 background: #FF7FAC;
 width: 8px;
 height: 8px;
 font-size: 0;
 position: absolute;
 bottom: 4px;
 left: 0;
 border-radius: 3px;
}
#id_comments .date a:hover {background: crimson;}

/* Comments Buttons */

#id_comments h2 + div, #id_comments h2 ~ p {
 display: block;
 background: var(--primary-color);
 width: calc(var(--col3-width) / 2 - 15px);
 height: 40px;
 text-align: center;
 margin: 0;
 position: fixed;
 bottom: 10px;
 border-radius: 3px;
}
#id_comments h2 ~ p {right: 10px;}

#id_comments h2 + div a, #id_comments h2 ~ p a {
 display: block;
 width: 100%;
 height: 100%;
 position: absolute;
 color: #FFFFFF;
 font-weight: normal;
 line-height: 38px;
}
#id_comments h2 ~ p a {font-size: 0;}

#id_comments h2 + div a, #id_comments h2 ~ p a::after {font-size: 14px;}
#id_comments h2 ~ p a::after {content: 'All Comments';}

/* Visitors */

#id_footprints .item:nth-of-type(n+2) {margin-top: 5px;}

/* Do Resize */

@media screen and (max-width: 1440px) {
  html {--col3-width: 250px;}

  #id_comments .username {
    float: none;
    margin: 0;
  }
  #id_comments .username::after {display: none;}

  #id_comments .date {
    position: relative;
    margin-left: -9px;
  }

  #id_comments .date a {
    left: calc(100% + 5px);
    top: 3px;
  }

  #id_comments h2 + div a, #id_comments h2 ~ p a::after {
    font-size: 11px;
    font-weight: bold;
  }
}

@media screen and (max-width: 1280px) {
  html {--col1-width: 70px;}
  #id_forum {display: none;}

  #id_wishlist, #id_equipment {text-align: center;}
  #id_friends .style1 li, #id_wishlist .item a, #id_equipment .item a {display: block;}
  #column_1 a::before, #column_1 a::after {display: none;}

  #column_1 h2 {
    font-size: 0;
    text-align: center;
  }
  #column_1 h2::after {font-size: 14px;}
  #id_friends h2::after {content: 'Adds';}
  #id_wishlist h2::after {content: 'Wish';}
  #id_equipment h2::after {content: 'Equip';}

  #id_friends .style1 a {
    display: block;
    width: 40px;
    height: 40px;
    margin-left: 5px;
    position: absolute;
    border-radius: 50%;
  }
}

@media screen and (max-width: 1024px) {
  html {--col3-width: 0px;}

  #columns, #column_2, #column_3 {
    height: auto;
    overflow: unset;
  }
  #columns, #column_1 {min-height: 0;}

  #columns {
    display: grid;
    grid-template: minmax(0, min-content) minmax(0, min-content) / 70px 1fr;
  }

  #column_1 {
    grid-row: 1 / span 2;
    grid-column: 1 / span 1;
  }

  #column_2, #column_3 {
    grid-column: 2 / span 1;
    width: 100%;
    border: none;
  }
  #column_2 {grid-row: 1 / span 1;}

  #column_3 {
    grid-row: 2 / span 1;
    padding: 0 40px 20px 40px;
  }

  #id_comments h2 + div, #id_comments h2 ~ p {
    width: 120px;
    height: 30px;
    position: absolute;
    top: -8px;
  }
  #id_comments h2 + div a, #id_comments h2 ~ p a {line-height: 30px;}
  #id_comments h2 + div {right: 125px;}
  #id_comments h2 ~ p {right: 0;}

  #id_comments .username {
    float: left;
    margin-left: 12px;
  }
  #id_comments .username::after {display: inline;}

  #id_comments .date {
    position: unset;
    margin: -5px;
  }

  #id_comments .date a {
    left: 0;
    top: 4px;
  }
  @-moz-document url-prefix() {#id_comments .date a {top: 5px;}}
}

@media screen and (max-width: 768px) {
  #column_3 {margin-top: 20px;}

  #id_about {
    width: calc(100% - 20px);
    min-height: unset;
  }
  #id_contact {margin-left: 10px;}
  #id_store{margin-left: 20px;}
}