/*
 * Custom CSS for @kariol's profile on Hjonk
 * Generated on 2025-11-01 20:16:44
 * This CSS file was last modified on: 2025-01-29 20:40:33
 * Length: 9935 characters
 *
 * Please be respectful: copying, modifying, or redistributing without permission
 * is not nice <3
 */

.container::after { display: none; } /* hack for new layout *//*  ____  _     _                   
   / __ \| |__ (_)_   _  __ _ _ __  
  / / _` | '_ \| | | | |/ _` | '_ \ 
 | | (_| | |_) | | |_| | (_| | | | |
  \ \__,_|_.__// |\__,_|\__,_|_| |_|
   \____/    |__/                   
                    juans your code.
                    infact, new-ass
                               code.
 */

:root {
    --main-color: #222;
    --dark-main-color: #111;
    --main-tbh: rgba(255,255,255,0.15);
    --dark-main-tbh: rgba(20,20,20,0.85);
}
body::before {
    width: 100vw;
    height: 1000vh;
    display: block;
    content: " ";
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    background: url(//images.weserv.nl/?url=https://st.prntscr.com/2023/07/24/0635/img/page-bg.png);
    /* ^^^ SHOUTOUT TO SKILLBRAINS (from lightshot) ^^^ */
    filter: brightness(0.315) grayscale() contrast(1.8595);
}
.header-container { margin: 44px auto auto; }
.header-container .language-select, .alert { text-align: center; }
.alert .icon { filter: none; }
.post-metadata::before, .alert::before, li.selected::before { background-image: none; }
.side-panel-separate { background: none; }
.logo, .icon, .floating-heart, #webamp, .emisoft-logo { filter: grayscale(); }
.primary { background: #555; }
.primary:hover { background: #777; }
.post-metadata, .new-post .post-metadata {
  background-color: #000;
      background-image: linear-gradient(45deg,#222,#222 6px,#666666 6px);
  border-color: #444;
  color: white;
}
.post-body {
  width: 90%;
}
.image-preview img {;
  border: 1px solid #777;
}
.css-editor button {
  background: linear-gradient(0deg,#f0f0f0,#fff);
  color: black;
  border: 1px solid grey;
}
.profile-border, .place-container-full, .toasters-container-full, #webamp {
    display: none;
}
.css-editor .inline-block { color: black; }
.container { width: 90%; }
.special-bg .cd-component { text-align: left !important; }
.post-metadata { width: 100%; }
.header .top-part.special-bg {
    margin: 0 auto;
    text-align: center;
    background: var(--dark-main-color) !important;
}
.container, .special-bg, .replies {
    background: var(--main-color);
    color: white;
    border: 1px solid grey;
    box-shadow: 0 0 4px black;
}
.repost-header {
    color: white;
}
.section-header .caption { color: white !important; }
.container::before, .new-post {
    background: transparent;
}
a { text-decoration: none; color: grey; }
a:hover {
    color: white;
    text-shadow: 0 0 4px white;
}
.language-select a, .pagination-elements a, .container.min.mt-10 a, a.mt-3 {
    color: grey;
}
.language-select a:hover, .pagination-elements a:hover, .container.min.mt-10 a:hover, a.mt-3:hover {
    color: white;
    text-shadow: 0 0 10px white;
}
.container.container-main .profile-banner-section .profile-picture {
    height: 40px;
    border: 1px solid white;
}
.container.header-container .column a, .container.header-container .profile-picture {
    display: block;
}
.container.header-container .column a, .container.header-container .profile-picture, .post .profile-picture {
    height: 28px;
}
.profile-dropdown:hover, .section:hover {
    background: rgba(255,255,255,0.25) !important
}
button, [type="button"], [type="reset"], [type="submit"],
.primary,
.profile-dropdown {
    -webkit-appearance: none;
    transition: 0.35s;
    background: transparent !important;
    border: 0 !important;
    color: white;
}
button:hover, input[type="submit"]:hover {
    background: rgba(255,255,255,0.65);
}
button, input[type="submit"] {
    border: 1px solid rgba(255,255,255,0.15);
}
.alert {
    background-color: var(--main-color);
    color: white;
    border-bottom: 1px solid grey;
}
.banner-user-area {
    border-top: 1px solid;
    border-right: 1px solid;
    border-color: transparent;
    background-color: transparent;
}
.fancy-list li {
    background-color: var(--dark-main-color);
    border-bottom: 1px solid var(--dark-main-color);
}
.fancy-list li:hover {
    background-color: #393939;
}
.fancy-list li.selected {
    background-color: rgba(255,255,255,0.25);
}
.embed, .embed.youtube, .image, .quote, .modal {
    background: var(--dark-main-color);
    border: 0;
}
.embed {
    padding: 5px 10px 2px;
}
.embed:hover, .image:hover, .quote:hover {
    background: var(--dark-main-tbh);
}
.utue-player {
    border: 1px solid var(--dark-main-color);
}
.fancy-list {
    border: 1px solid white;
}
.section-header {
    border-bottom: 1px dashed grey;
}

.dreamy-textbox {
    background: transparent;
    color: white;
}
.dreamy-textbox textarea {
    color: white;
}
.dreamy-textbox button {
    border: 1px solid white !important;
}
.side-panel-separate {
  max-width: 240px;
}
.gallery-container a {
  flex: 1 1 calc(20% - 10px);
}
.gallery-container a:first-child:nth-last-child(1) {
  aspect-ratio: none;
}
.side-panel-separate li, .header-buttons a {
	background: transparent !important;
}
.header-buttons a {
    transition: 0.5s;
    color: grey;
    text-shadow: 0 10px 4px transparent, 0 -10px 4px transparent;
}
.header-buttons a:hover {
    text-shadow: 0 0 2px white, 0 0 4px white;
}
.post {
    width: 100%;
}