/*
 * Custom CSS for @macker's profile on Hjonk
 * Generated on 2025-08-02 15:05:32
 * This CSS file was last modified on: 2025-05-05 06:10:25
 * Length: 4741 characters
 *
 * Please be respectful: copying, modifying, or redistributing without permission
 * is not nice <3
 */

.container::after { display: none; } /* hack for new layout *//* most of this i figured out by looking at @vomitkommando's profile css, 'cause his css said to feel free to reuse */
/* didn't directly copy it though, i used it more as a guideline of how to edit certain parts of the webpage since i'm still fairly a noob to this stuff */
/* likewise, if anyone wants to use parts or the whole of my profile code to help them figure out theirs, they're free to do so ^^ go ham, man! */
/* i've sprinkled comments throughout to make the code easier to understand, from what i know of css. i apologize to any experts reading this, i have a rudimentary understanding of it-- */

/* cursor and scrollbar */
html{
    cursor: url('//images.weserv.nl/?url=https://i.ibb.co/XfZnG2nX/Splat-Cursor-Squid-Green-page-01.png'), auto;
    scrollbar-color: #ffd500 #313233}

body{
color: #A0E000;
padding: 0px !important}

/* .clouds is the main background */
.clouds{
    background-image: url("//images.weserv.nl/?url=https://i.ibb.co/dsFZcgTM/camo-black-outline-2x.png");
filter: contrast(120%)}

/* body of most of the boxes. you can set it to flat colors, images, etc. too, but for here i have a pretty gradient :D */
.container-section, .profile-hover-card, .adsbygoogle{
background: linear-gradient(to bottom,#525252 15%,#616161,#616161 85%,#525252);
box-shadow: 1px 1px 3px #ff9245;
border: 1px solid #363636;
outline: 1px solid #000;
border-radius: 5px}

.user-card{
background-image: url("//images.weserv.nl/?url=https://i.ibb.co/gKQd2m0/thangmegaextended.png"); background-size: 100%; background-position: center; !important
}

img[src$="cdn/border/41"]{content: url(/cdn/border/42)}
img[src$="cdn/border/41"], img[src$="cdn/border/42"], img[src$="cdn/border/11"]{filter: hue-rotate(0) !important}

/* the top section of the boxes, where the headers/titles of the sections are. i put a darker gradient to contrast with the lighter of the main bodies. */
.container-titlebar{
color: #ffd500;
background-color: #A0E000;
background-image: url("//images.weserv.nl/?url=https://i.ibb.co/B2YjKZ4V/gloomy-stripes-dark-background-tile.jpg");
filter: contrast(120%) ;
background-size: 100%, 2px 2px;
border-bottom-width: 0px}

/* colors/style for the store, awards, search, and newsfeed section of the top bar. */
.container-section.user-card.mb-5 .caption, .container-section.user-card.mb-5 a, .header .nav-bar .nav-item:hover, .header .nav-right .profile-mini-header:hover{color: #07572D}
.container-section.user-card.mb-5 a, .header-alt .nav-bar .nav-item a{text-shadow: 0 -1px 1px #000a}
.header-alt{background: linear-gradient(to bottom, #04542C 1px, #3DA721 0px, #A0E000, #04542C)}

/* color and style for the banner + pfp area box. */
.user-card-wide.container-section.mb-10{background-image: url("//images.weserv.nl/?url=https://i.ibb.co/7xBdj1hM/blob.png") !important; background-size: contain; background-position: center;}
.section{background: linear-gradient(to bottom, #424242, #232323) !important}
.user-card-wide.container-section.mb-10 .section{background: linear-gradient(to bottom, #04542C, #3DA721, #A0E000 20px, #3DA721, #04542C) !important}
.section{border-color: #232323}

/* quote hjonk background */
.post.quote.mb-10 {
background: linear-gradient(to bottom, #424242, #232323);
border-color: #000;
}

/* if you have no banner, this changes the color behind it! */
.profile-banner{
background-color: #232323;
border: 1px solid #000;
box-shadow: 5px 5px 15px inset #000a;
/*background-position: center*/}

/* nametag text */
.user-wide-card-meta h2{font-weight: bold; color: #ffd500}
.profile-hover-card .profile-banner{
border: 1px solid #000;
box-shadow: 2.5px 2.5px 7.5px inset #000a}

.caption{
color: #4eb500;
}

.user-card-wide button.primary.follow-user{
font-size: 0px;
}
.user-card-wide button.primary.follow-user:after {
font-size: 12px;
content: "woomy!"
}

/* this covers a few things, but it's all things on the top bar of the page. this includes the hjonk logo, color of text on the bar, bar background, etc. */
.header .nav-bar .nav-item, .mini-header-section, .header{border-color: #232323}
.header .nav-bar .nav-item a{
color: #0000;
background-clip: text;
background-image: linear-gradient(to top,#ff7700 10px,#f8ff36 35px);
filter: drop-shadow(0 -1px #ff7700) drop-shadow(0 0 1px #000)}
.header{
background: linear-gradient(to bottom,#2323236e, #0a4a0d8a 10%,#9eff367d 50%,#c0ff4a8f 45%,#2323236e);
border-bottom-width: 0px}
.nav-right, .nav-right .caption{color: #ffd500}
.header .nav-bar .nav-item:hover, .header .nav-right .profile-mini-header:hover{background: linear-gradient(to bottom,#2323236e, #0a4a0d8a 10%,#9eff367d 50%,#c0ff4a8f 45%,#2323236e) !important;}
.logo{content: url("//images.weserv.nl/?url=https://i.ibb.co/8DXKS2MN/hjonksquid.png"); filter: hue-rotate(65deg) saturate(300%) contrast(200%) !important}