@font-face {
  font-family: 'Google Sans Flex';
  font-style: normal;
  font-weight: 1 1000;
  font-stretch: 100%;
  font-display: swap;
  src: url(/assets/fonts/v5/Google_Sans_Flex.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: 'Nunito';
  font-style: normal;
  font-weight: 200 1000;
  font-display: swap;
  src: url(/assets/fonts/v5/Nunito.woff2) format('woff2-variations');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* width */
#container *::-webkit-scrollbar, .kp-modal-wrapper *::-webkit-scrollbar, #secondary_menu_wrapper *::-webkit-scrollbar, .kp-theme-picker *::-webkit-scrollbar {
  height: 10px;
  width: 10px;
}

/* Track */
#container *::-webkit-scrollbar-track, .kp-modal-wrapperr *::-webkit-scrollbar-track, #secondary_menu_wrapper *::-webkit-scrollbar-track, .kp-theme-picker *::-webkit-scrollbar-track {
  background: transparent;
}

/* Handle */
#container *::-webkit-scrollbar-thumb, .kp-modal-wrapper *::-webkit-scrollbar-thumb, #secondary_menu_wrapper *::-webkit-scrollbar-thumb, .kp-theme-picker *::-webkit-scrollbar-thumb {
    background: var(--color-text-trans);
    border-radius: var(--border-radius-xl);
    border: 2px solid var(--color-content);
}

.kp-modal-wrapper *::-webkit-scrollbar-thumb {
    border-color: var(--color-content);
}

#container *.scrollbar-mini::-webkit-scrollbar, .kp-modal-wrapper *.scrollbar-mini::-webkit-scrollbar, .kp-theme-picker *.scrollbar-mini::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

#container *.scrollbar-toggle::-webkit-scrollbar-thumb, .kp-modal-wrapper *.scrollbar_toggle::-webkit-scrollbar-thumb {
    background: transparent;
    border-color: transparent;
}

#container *.scrollbar-toggle:hover::-webkit-scrollbar-thumb, .kp-modal-wrapper *.scrollbar_toggle:hover::-webkit-scrollbar-thumb {
    background: var(--color-text-mid);
    border-color: var(--color-content);
}

/* Handle on hover */
#container *::-webkit-scrollbar-thumb:hover, .kp-modal-wrapper *::-webkit-scrollbar-thumb:hover, #secondary_menu_wrapper *::-webkit-scrollbar-thumb:hover, .kp-theme-picker *::-webkit-scrollbar-thumb {
  background: var(--color-text-mid);
}

html {
    background: var(--color-primary);
    background: linear-gradient(90deg,var(--color-primary) 33%,var(--color-secondary) 100%);
}

body {
    background: var(--color-base);
    padding-top: 60px;
    color: var(--color-text);
}

h1, h2, h3, h4, h5, h1 *, h2 *, h3 *, h4 *, h5 * {
    font-family: "Nunito", "Google Sans Flex", Arial, Helvetica, sans-serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

h1 {
    color: var(--color-text);
    margin-top: 0;
    font-size: 1.313rem;
    font-weight: 600;
    margin: 10px 0 20px;
    text-transform: uppercase;
}

h1 strong {
    color: var(--color-text-mid);
}

h2 {
    font-size: 1.125rem;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--color-text);
    margin: 15px 0;
    text-align: left;
}

h1 > a, h2 > a {
    float: right;
    text-decoration: none;
    font-size: 0.875rem;
    text-transform: none;
    font-weight: 600;
    margin-top: 8px;
}

h2 > a {
    margin-top: 4px;
}

h1 > a:hover, h2 > a:hover {
    text-decoration: underline;
}

h1 > a.category-viewall, h2 > a.category-viewall {
    margin-right: 9%;
}

h2 > strong {
    background-image: linear-gradient(to right, var(--color-primary), var(--color-secondary));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

h3, h3 * {
    font-size: 1.125rem;
}

h4 {
    text-align: left;
    font-size: 0.875rem;
    color: var(--color-text);
    font-weight: 600;
    margin: 0 0 10px;
}

#content > h1 {
    text-align: center;
    margin: 25px 0;
    font-size: 26px;
}

button:focus, input:focus, select:focus, textarea:focus {
    box-shadow: 0 0 5px var(--color-primary);
}

.cc-window {
    border: 1px solid #30a59a !important;
    box-shadow: -3px 5px 10px rgba(0, 0, 0, 0.2) !important;
    font-size: 15px !important;
    padding: 20px !important;
}

#page_loading_bg {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-content-op);
    text-align: center;
    z-index: 999999 !important;
    opacity: 0;
    pointer-events: none;
    width: 0;
    height: 0;
    transition: opacity 0.25s;
}

#page_loading_bg.showing {
    width: 100%;
    height: 100%;
    opacity: 1;
    pointer-events: all;
}

#page_loader_inner {
    width: 60px;
    padding: 3px;
    aspect-ratio: 1;
    border-radius: 50%;
    background: var(--color-primary);
    --_m: conic-gradient(#0000 10%, #000), linear-gradient(#000 0 0) content-box;
    -webkit-mask: var(--_m);
    mask: var(--_m);
    -webkit-mask-composite: source-out;
    mask-composite: subtract;
    animation: pageloader_anim 1s infinite linear;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -30px;
    margin-left: -30px;
}

@keyframes pageloader_anim {to{transform: rotate(1turn)}}

#kpHeader, #kpFooter {
    background: var(--color-content);
    color: var(--color-text);
    line-height: 1;
}

#kpHeader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 60px;
    z-index: 100;
    transition: top .25s;
}

.sidebar-open #kpHeader {
    z-index: 850;
}

#header_bar_top {
    height: 100%;
    position: relative;
    z-index: 1;
    border-bottom: 1px solid var(--color-text-trans);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

#header_bar_bottom {
    display: none;
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: 999;
    height: 70px;
    border-top: 1px solid var(--color-neutral-trans);
    box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.1);
    background: var(--color-content);
}

#header_bar_bottom .header-links {
    height: 70px;
    padding-left: 0;
    float: none;
    margin-right: 0;
    display: flex;
    justify-content: space-around;
}

#header_bar_bottom .header-links > a {
    float: none !important;
    color: var(--color-text);
    text-decoration: none;
    height: 100%;
    font-weight: 500;
    text-transform: uppercase;
    width: auto;
    margin: 0;
    font-size: 10px;
    padding: 13px 0 !important;
    position: relative;
}

.navmenu-notif-bubble {
    position: absolute;
    left: 50%;
    margin-left: 5px;
    top: 27px;
    background: var(--color-primary);
    color: #fff;
    min-width: 16px;
    height: 16px;
    border-radius: 18px;
    text-align: center;
    font-size: 11px;
    padding: 3px 2px 0;
    line-height: 1;
}

.sidebar-open #header_bar_bottom .header-links > a#secondary_menu_trigger_mobile {
    color: var(--color-secondary);
}

#header_bar_bottom .header-links > a#header_create_btn_mobile {
    height: 60px;
    margin-top: 5px;
    border-radius: var(--border-radius-md);
    padding-top: 8px !important;
}

#header_bar_bottom .header-links > a:not(#secondary_menu_trigger_mobile):not(#mobile_search_toggle):hover {
    color: var(--color-secondary) !important;
}

#header_bar_bottom .header-links > a#mobile_search_toggle {
    display: block;
}

#header_bar_bottom .header-links > a#mobile_search_toggle.active {
    color: var(--color-secondary) !important;
}

#header_bar_bottom .header-links a > i {
    display: block;
    margin: 0;
    font-size: 21px;
    line-height: 1.5;
}

#header_bar_bottom .header-links > a.active {
    color: var(--color-secondary);
}

#header_bar_bottom .header-links a.secondary-menu-trigger > i {
    font-size: 26px;
    line-height: 1.1;
}

.header-inner, #footer_inner {
    width: 100%;
    height: 100%;
    padding: 0 30px;
    margin: 0 auto;
    position: relative;
    font-size: 0;
}

#head_left, .header-links, #head_right {
    display: inline-block;
    vertical-align: middle;
    width: 27%;
    padding: 0;
    height: 100%;
}

.kppro-msg {
    font-size: 14px;
    text-align: center;
    padding: 20px 35px 15px 15px;
    margin: 0 auto;
    background: var(--color-content-mid);
    position: relative;
}

.kppro-msg a {
    color: var(--color-text);
    text-decoration: none;
}

.kppro-msg a:hover {
    text-decoration: underline;
}

.kppro-msg a strong {
    color: var(--color-primary);
    white-space: nowrap;
}

#pro_banner_close {
    position: absolute;
    top: 50%;
    right: 15px;
    margin-top: -5px !important;
}

#shop_banner {
    padding: 15px;
    text-align: center;
    font-weight: 500;
    color: var(--color-accent-text);
    background: var(--color-secondary);
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
}

#shop_banner a {
    text-decoration: none;
    color: var(--color-accent-text);
}

body.shop #shop_banner a span {
    display: none !important;
}

.secondary-menu-trigger {
    font-size: 1.6rem;
    color: var(--color-text);
    display: inline-block;
    height: 100%;
    padding: 19px 10px 0;
    margin-left: -10px;
    margin-right: 18px;
    text-decoration: none;
    float: left;
    transition: margin 0.2s linear;
}

#secondary_menu_trigger:hover {
    opacity: 0.8;
}

#secondary_menu_wrapper {
    z-index: 849;
    position: fixed;
    width: 100%;
    height: calc(100% - 60px);
    top: 60px;
    overflow: hidden;
    left: 0;
    pointer-events: none !important;
}

body.sidebar-open #secondary_menu_wrapper {
    pointer-events: all !important;
}

#secondary_menu_wrapper a {
    text-decoration: none;
    color: var(--color-text);
    font-size: 14px;
    font-weight: 600;
}

#secondary_menu_wrapper a.moderation-link {
    text-align: center;
    padding: 14px 15px 13px 0;
    border: 1px solid var(--color-neutral-mid);
    border-radius: var(--border-radius-xl);
}

#secondary_inner ul li a.moderation-link > i {
    float: left;
    margin: -1px 0 0 15px;
    margin-right: -15px;
}

#secondary_menu {
    position: absolute;
    top: 0;
    left: -300px;
    z-index: 1;
    background: var(--color-content);
    width: 300px;
    height: 100%;
    box-shadow: 1px 5px 5px rgba(0, 0, 0, 0.1);
    overflow: auto;
    transition: 0.15s linear;
}

#secondary_menu_close {
    position: absolute;
    z-index: 1;
    top: 15px;
    right: 15px;
    font-size: 21px;
    color: var(--color-text-op);
    cursor: pointer;
    display: none;
}

#secondary_menu_close:hover {
    color: var(--color-text);
}

body.sidebar-open #secondary_menu {
    left: 0;
}

#secondary_inner {
    min-height: 100%;
    padding: 0 15px 175px;
    position: relative;
}

.logged #secondary_inner {
    padding-bottom: 210px;
}

#secondary_profile {
    text-align: center;
    padding-top: 30px;
    color: var(--color-text-mid);
}

#secondary_profile a {
    font-size: 1rem;
}

#secondary_profile img {
    border-radius: 60px;
    background: var(--color-content);
}

#secondary_profile a:nth-child(3) {
    display: block;
    padding: 15px;
}

#secondary_profile a > span {
    display: inline-block;
    vertical-align: middle;
    max-width: 80%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-right: 5px;
    font-weight: 500;
}

#secondary_profile a > i {
    color: #ffca00;
    display: inline-block;
    vertical-align: middle;
}

#secondary_profile #secondary_login_btn, #secondary_profile #secondary_signup_btn {
    display: inline-block;
    padding: 10px;
    font-weight: 500;
}

#secondary_profile #secondary_login_btn:hover, #secondary_profile #secondary_signup_btn:hover {
    background-image: linear-gradient(to right, var(--color-primary), var(--color-secondary));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

#secondary_inner ul {
    list-style: none;
    padding: 20px 0;
    margin: 0 10px;
    border-bottom: 1px solid var(--color-base);
}

#secondary_inner ul li {
    margin: 0 -10px;
}

#secondary_inner ul li a {
    padding: 16px 0 12px 10px;
    display: block;
    border-radius: var(--border-radius-md);
    text-transform: uppercase;
    line-height: 14px;
    position:relative;
}

#secondary_inner ul li a .sidebar-notif-bubble {
    position: absolute;
    right: 5px;
    top: 50%;
    margin-top: -9px;
    background: var(--color-primary);
    color: #fff;
    min-width: 18px;
    height: 18px;
    border-radius: 18px;
    text-align: center;
    font-size: 12px;
    padding: 4px 2px 0;
    line-height: 1;
}

#secondary_inner ul.secondary-editor {
    border: none;
    border-radius: var(--border-radius-md);
    margin: 15px 0 0;
    padding: 0;
}

#secondary_inner ul.secondary-editor li {
    margin: 0;
}

#secondary_inner ul.secondary-editor li a {
    padding: 15px;
    cursor: default;
}

#secondary_inner ul.secondary-editor li a.credits-count:hover {
    text-decoration: underline;
}

#secondary_inner ul.secondary-editor li a span {
    font-size: 16px;
}

#secondary_inner ul.secondary-editor .theme-bubble {
    margin-right: 0;
    margin-left: 10px;
}

#secondary_inner ul:not([class^="secondary"]) li a:hover {
    background: var(--color-base);
}

#secondary_inner ul li a > i, #secondary_inner ul li a > img {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    font-size: 18px;
    margin-right: 10px;
    margin-top: -2px;
}

#secondary_inner ul.secondary-footer {
    border-bottom: none;
    padding: 0;
    margin: 0;
    position: absolute;
    bottom: 10px;
    left: 25px;
}

#secondary_inner ul.secondary-footer li a {
    font-size: 13px;
    text-transform: none;
    font-weight: 400;
    padding: 10px;
    color: var(--color-text);
    opacity: 0.8;
    display: inline-block;
}

#secondary_inner ul.secondary-links a {
    padding: 12px 0 12px 10px;
    text-transform: none;
    display: inline-block;
    font-weight: 500;
}

#secondary_inner ul.policy-links a {
    font-size: 13px;
    padding: 10px 0 10px 10px;
}

#secondary_inner ul.secondary-links a:hover, #secondary_inner ul.secondary-footer li a:hover {
    text-decoration: underline;
    opacity: 1;
}

#secondary_inner ul.secondary-footer li a > i {
    font-size: 24px;
    margin: 0;
}

#secondary_inner ul.secondary-footer li a:hover > i.kp-facebook {
    color: #0866ff;
}

#secondary_inner ul.secondary-footer li a:hover > i.kp-discord {
    color: #738adb;
}

#secondary_cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.1);
    opacity: 0;
    z-index: 0;
    transition: opacity 0.1s linear;
}

.report-count-bubble {
    font-size: 0.75rem;
    color: var(--color-accent-text);
    background: var(--color-primary);
    border-radius: var(--border-radius-lg);
    padding: 3px 6px;
    min-width: 18px;
    text-align: center;
    float: right;
}

body.sidebar-open #secondary_cover {
    opacity: 0.7;
}

body.sidebar-open .has-dropdown.open .notice-dropdown, body.sidebar-open #modal_ai_credits, body.sidebar-open #modal_pro {
    z-index: 9999991;
}

.modal-section-divider {
    font-size: 0.875rem;
    color: var(--color-text-op);
    text-align: center;
    margin: 15px 0;
    position: relative;
}

.or-separator {
    padding: 15px 0;
}

.or-separator span {
    background: var(--color-content);
    position: relative;
    z-index: 1;
    display: block;
    width: 40px;
    margin: 0 auto;
}

.or-separator:before {
    content: '';
    width: 100%;
    border-top: 1px solid var(--color-base);
    position: absolute;
    left: 0;
    top: 50%;
    height: 0;
}

.social-login-btns {
    display: flex;
    column-gap: 4%;
    flex-wrap: wrap;
}

.social-login-btns .login-btn {
    width: 48%;
    height: 42px;
    padding: 3px 15px 0 42px;
    border-radius: var(--border-radius-xl);
    border: none;
    color: #fff;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    text-align: center;
    font-weight: 500;
}

.social-login-btns .login-btn:hover {
    opacity: 0.8;
}

.social-login-btns .login-btn:before {
    font-family: "kandi-pad";
    font-size: 1.1rem;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    pointer-events: none;
    width: 46px;
    padding-left: 4px;
    height: 100%;
    line-height: 2.6;
    border-right: 1px solid rgba(255, 255, 255, 0.1);
}

.login-google > div {
    width: 100% !important;
    position: absolute;
    left: 0;
    height: 100% !important;
    top: 0;
    z-index: 1;
    cursor: pointer;
}

.login-google iframe {
    margin: 0 !important;
    height: 45px !important;
    width: 100% !important;
}

.login-facebook {
    background: #4162a0;
}

.login-facebook:before {
    content: '\f30c';
}

.login-google:before {
    content: '\e888';
}

.login-google:after {
    content: 'Google';
    top: 0;
    position: absolute;
    background: #e04b3f;
    height: 100%;
    cursor: pointer;
    z-index: 1;
    width: 100%;
    left: 0;
    border-radius: var(--border-radius-xl);
    pointer-events: none;
    box-sizing: border-box;
    padding: 10px 15px 0 42px;
}

.share-buttons a {
    text-decoration: none;
    font-size: 24px;
    margin: 0 5px;
    color: var(--color-text-mid) !important;
}

.share-buttons a.fb-share-btn {
    color: #4267b2 !important;
}

.share-buttons a.twitter-share-btn {
    color: var(--color-text) !important;
}

.share-buttons a.reddit-share-btn {
    color: #ff4500 !important;
}

.share-buttons a.pinterest-share-btn {
    color: #E60023 !important;
}

#share_qrcode {
    padding: 8px;
    display: inline-block;
    border-radius: var(--border-radius-lg);
    background: #fff;
    font-size: 0;
    margin: 15px 0 25px;
}

#modal_share input {
    background: var(--color-base);
    font-size: 0.875rem;
    margin-bottom: 0px;
    text-align: center;
}

#modal_share input:hover {
    background: var(--color-content-light);
}

.copied-alert {
    font-size: 11px;
    background: #41d88c;
    color: var(--color-content);
    padding: 2px 15px;
    border-radius: var(--border-radius-md);
    display: none;
}

#modal_share .share-buttons a {
    text-decoration: none;
    font-size: 1.625rem;
    width: 50px;
    height: 50px;
    display: inline-block;
    border: 1px solid var(--color-text-trans);
    border-radius: 50%;
    text-align: center;
    padding-top: 8px;
    margin: 10px 5px 0;
}

#modal_share .share-buttons a:hover {
    background: var(--color-base);
    opacity: 0.9;
}

#modal_plur .modal-body {
    line-height: 1.8;
}

#modal_plur h4 {
    font-size: 18px;
    text-transform: uppercase;
    color: var(--color-secondary);
}

#modal_plur strong {
    text-transform: uppercase;
    font-size: 16px;
    color: var(--color-primary);
}

#modal_plur ul strong {
    color: var(--color-secondary);
}

#modal_content_ratings #content_ratings_content {
    padding: 15px;
    border: 1px solid rgba(255, 255, 255, 0.5);
    position: relative;
    border-radius: var(--border-radius-lg);
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: stretch;
    justify-content: space-between;
}

.content-rating {
    display: inline-block;
    vertical-align: top;
    border-radius: var(--border-radius-md);
    font-size: 2.3rem;
    font-family: 'Nunito';
    font-weight: 800;
    text-align: center;
    width: 50px;
    height: 50px;
    color: rgba(255, 255, 255, 0.4);
    position: relative;
}

.content-rating:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    mix-blend-mode: overlay;
    background: linear-gradient(220deg, #ffffff 48%, transparent 0);
    opacity: 0.2;
    border-radius: var(--border-radius-md);
}

.content-rating input {
    appearance: none;
}

label.content-rating {
    margin-right: 5px;
    cursor: pointer;
}

label.content-rating:last-of-type {
    margin-right: 0;
}

label.content-rating:hover:after {
    opacity: 0.4;
}

label.content-rating-e:hover, label.content-rating-e:has(input:checked) {
    background: #6fcf6f;
    box-shadow: 0 0 5px #6fcf6f;
}

label.content-rating-t:hover, label.content-rating-t:has(input:checked) {
    background: #f79814;
    box-shadow: 0 0 5px #f79814;
}

label.content-rating-m:hover, label.content-rating-m:has(input:checked) {
    background: #b51414;
    box-shadow: 0 0 5px #b51414;
}

label.content-rating-a:hover, label.content-rating-a:has(input:checked) {
    background: #7814db;
    box-shadow: 0 0 5px #7814db;
}

label.content-rating:hover span {
    color: rgba(255, 255, 255, 0.6);
}

label.content-rating input:checked + span {
    color: rgba(255, 255, 255, 0.8);
    text-shadow: 0 0 5px rgba(255, 255, 255, 0.5);
}

label.content-rating-e:has(input:checked) {
    box-shadow: inset 0 0 0 2px var(--color-content), 0 0 0 2px #6fcf6f, 0 0 3px 2px rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

label.content-rating-t:has(input:checked) {
    box-shadow: inset 0 0 0 2px var(--color-content), 0 0 0 2px #f79814, 0 0 3px 2px rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

label.content-rating-m:has(input:checked) {
    box-shadow: inset 0 0 0 2px var(--color-content), 0 0 0 2px #b51414, 0 0 3px 2px rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

label.content-rating-a:has(input:checked) {
    box-shadow: inset 0 0 0 2px var(--color-content), 0 0 0 2px #7814db, 0 0 3px 2px rgba(0, 0, 0, 0.5);
    pointer-events: none;
}

.thread-preview-content-rating {
    position: relative;
    top: 7px;
    float: left;
    margin-right: 6px;
}

.thread-preview-content-rating.recent-thread-rating {
    top: 2px;
    margin-right: 4px;
}

.thread-preview-content-rating .content-rating {
    width: 15px;
    height: 15px;
    font-size: 0.75rem;
    border-radius: var(--border-radius-sm);
}

.thread-preview-content-rating.recent-thread-rating .content-rating {
    width: 13px;
    height: 13px;
    font-size: 0.686rem;
}

#modal_content_ratings #content_ratings_content .content-rating {
    width: 24%;
    height: auto;
    font-size: 6rem;
}

#modal_content_ratings h3, #modal_content_ratings h4 {
    display: block;
    float: none;
    position: relative;
    text-align: center;
    width: 100%;
    color: #fff;
    margin: 0 0 15px;
    font-size: 1.5rem;
}

#modal_content_ratings h4 {
    margin: 0;
    mix-blend-mode: overlay;
    font-size: 1.313rem;
    line-height: 1;
}

.content-rating span {
    font-family: 'Nunito';
    mix-blend-mode: plus-lighter;
    color: rgba(255, 255, 255, 0.4);
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
}

.content-rating-e span {
    text-shadow: 0 0 22px rgba(255, 255, 255, 0.3);
}

.content-rating-t span {
    color: rgba(255, 255, 255, 0.3);
    text-shadow: 0 0 20px rgba(255, 255, 255, 0.3);
}

.content-rating p {
    font-size: 0.813rem;
    font-weight: 400;
    color: #fff;
    margin: -10px 0 0;
}

.content-rating p strong {
    font-family:  "Nunito";
    font-weight: 800;
    font-size: 1rem;
}

.content-rating p:last-child {
    margin: 5px 0 15px;
    padding: 0 5px;
    line-height: 1.2;
    font-family: 'Google Sans Flex';
}

.content-rating-e {
    background: #5cbc5c;
}

.content-rating-t {
    background: #e78601;
}

.content-rating-m {
    background: #930505;
}

.content-rating-a {
    background: #6200c3;
}

#breadcrumbs {
    margin: 10px 30px -10px;
    font-size: 0.725rem;
    z-index: 2;
    position: relative;
    max-width: 100%;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

#breadcrumbs a {
    color: var(--color-text-mid);
    text-decoration: none;
}

#breadcrumbs a:hover {
    text-decoration: underline;
}

#breadcrumbs i {
    display: inline-block;
    vertical-align: middle;
    color: var(--color-text-op);
    padding: 0 3px 0 5px;
    font-size: 0.5rem;
    line-height: 2;
}

#breadcrumbs > span {
    color: var(--color-text-op);
}

.site-msg {
    padding: 20px 15px;
    background: var(--color-primary-trans);
    font-size: 16px;
    color: var(--color-text);
    text-align: center;
    font-weight: 600;
    display: none;
    position: relative;
    z-index: 9;
}

.site-msg a {
    color: var(--color-primary);
}

#site-msg-error {
    background: #ff6d6d;
    color: #540808;
}

#kpFooter {
    margin-top: 60px;
    background: transparent;
    position: relative;
}

#footer_collage {
    height: 100px;
    background: url(/assets/images/site/footer-collage.png) bottom center repeat-x;
}

#footer_banner {
    background: linear-gradient(90deg, var(--color-primary), var(--color-secondary));
    height: 50px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: default;
    overflow: hidden;
}

#footer_banner a, #footer_banner span {
    color: var(--color-accent-text);
    opacity: 0.8;
    text-decoration: none;
    font-size: 1.5rem;
    font-family: 'Nunito', 'Google Sans Flex', Arial, Helvetica, sans-serif;
    font-weight: 600;
    transition: 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    padding: 0 10px;
    user-select: none;
}

#footer_banner a:hover {
    opacity: 1;
    text-decoration:  underline;
}

#footer_banner span {
    font-family: 'kandi-pad';
    font-weight: 400;
    width: 44px;
    text-align: center;
}

#footer_banner span:hover {
    font-size: 2rem;
    opacity: 1;
    transform: scale(1.3);
}

#footer_banner span:hover + span, #footer_banner span:has(+ span:hover) {
    opacity: 0.9;
    transform: scale(1.2);
}

#footer_banner span:hover + span + span, #footer_banner span:has(+ span + span:hover) {
    transform: scale(1.1);
}

#footer_inner {
    height: auto;
    padding: 80px 30px 30px;
    overflow: auto;
    background: var(--color-content);
}

#footer_copyright {
    background: var(--color-content-light);
    border-top: 1px solid var(--color-base);
    padding: 30px;
    text-align: center;
    font-size: 0.875rem;
    color: var(--color-text-op);
}

#footer_copyright span {
    font-size: 1.3rem;
    display: inline-block;
    vertical-align: top;
    margin-bottom: -10px;
}

body.has-kpstickyad.adhesion.highImpact_adhesion {
    padding-bottom: 0 !important;
}

body.has-kpstickyad:not(.landing) #kpFooter{
    padding-bottom: 150px;
}

.footer-links {
    display: inline-block;
    vertical-align: top;
    margin: 0 50px 50px 10px;
    list-style: none;
    padding: 0;
}

.footer-links li:not(:first-child) {
    padding: 5px 0;
    margin: 10px 0;
}

.footer-links a {
    color: var(--color-text);
    text-decoration: none;
    font-size: 1rem;
    font-weight: 500;
}

.footer-links a.footer-pro {
    color: #fb923c;
}

.footer-links span {
    font-size: 1.125rem;
    margin: 0 0 20px;
    display: block;
    font-weight: 700;
    text-transform: uppercase;
    font-family: 'Nunito', 'Google Sans Flex', Arial, Helvetica, sans-serif;
    color: var(--color-secondary);
}

.footer-links a:hover {
    text-decoration: underline;
}

.footer-links a i {
    display: inline-block;
    vertical-align: middle;
    padding-right: 6px;
}

.footer-contact {    
    float: right;
}

.footer-links li.social-icon {
    display: inline-block;
    margin-right: 15px;
    line-height: 0;
}

.footer-links li.social-icon a {
    font-size: 1.25rem;
    color: var(--color-text-op);
    background: var(--color-base);
    display: inline-block;
    width: 36px;
    height: 36px;
    text-align: center;
    border-radius: 50%;
    padding-top: 9px;
}

.footer-links li.social-icon a i {
    padding-right: 0px;
}

.footer-links li.social-icon:hover a {
    color: var(--color-content);
}

.footer-links li.social-icon.social-facebook:hover a {
    background: #3f7de3;
}

.footer-links li.social-icon.social-discord:hover a {
    background: #5662f6;
}

.footer-links li.social-icon.social-grivio:hover a {
    background: #8c5cf5;
}

#footer_inner .footer-copy {
    text-align: center;
    padding-top: 15px;
    margin-top: 15px;
    border-top: 1px solid rgba(255, 255, 255, 0.2);
    color: rgba(255, 255, 255, 0.8);
    font-size: 13px;
}

#footer_inner .footer-copy a {
    color: rgba(255, 255, 255, 0.8);
    text-decoration: none;
}

#kpLogo, #kpLogoMobile {
    display: block;
    float: left;
    margin-top: 16px;
}

#kpLogoMobile {
    display: none;
}

.ai-instructions {
    border-top: 1px solid var(--color-neutral-mid);
    border-bottom: 1px solid var(--color-neutral-mid);
    padding: 15px 10px 15px 50px;
    margin-top: 30px;
    position: relative;
}

.ai-instructions:before {
    content: '\4a';
    font-family: kandi-pad;
    position: absolute;
    left: 8px;
    top: 15px;
    font-size: 30px;
    line-height: 1;
    color: var(--color-primary);
}

.ai-instructions p {
    margin: 0;
    line-height: 1.6;
    font-size: 13px;
}

.ai-instructions p em {
    font-style: normal;
    white-space: nowrap;
}

.ai-credit-label {
    color: var(--color-text-op);
    white-space: nowrap;
    line-height: 1;
    font-size: 14px;
    display: inline-block;
    vertical-align: middle;
    margin: -8px 0 0 10px;
}

.ai-credit-label.hidden-credits {
    display: none;
}

.ai-credit-label > img {
    display: inline-block;
    vertical-align: bottom;
    margin-right: 5px;
}

.kp-modal-enhanced .kp-modal {
    border: none;
}

.kp-modal-enhanced .modal-head {
    margin: -15px -15px 0;
    padding: 24px 30px 0;
    height: 104px;
    background-size: cover;
}

#modal_ai_credits .modal-head {
    background: url(/assets/images/credits-modal-header.png) left center no-repeat;
}

#modal_pro .modal-head {
    height: 156px;
    background: url(/assets/images/pro-modal-header.png) center bottom no-repeat;
    border-bottom: none;
    margin-bottom: -15px;
}

.kp-modal-enhanced .modal-head h3 {
    font-size: 24px;
    color: #fff !important;
    text-shadow: 0 1px 10px rgba(0, 0, 0, 0.8);
    line-height: 1.2;
}

.kp-modal-enhanced .modal-head h3 span {
    font-size: 18px;
    color: #fff;
    display: inline;
}

.kp-modal-enhanced .close-modal {
    color: #fff;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.8);
    font-size: 21px;
}

.kp-modal-enhanced .close-modal:hover {
    opacity: 0.9;
}

#modal_ai_credits .credit-renewal-msg {
    color: var(--color-content) !important;
    background: var(--color-secondary);
    padding: 5px 10px;
    border: 1px solid var(--color-neutral-mid);
    text-align: center;
    font-size: 14px;
    border-radius: 30px;
    margin-bottom: -10px;
}

#ai_credits_bullets {
    border-left: 3px solid var(--color-primary);
    padding-left: 10px;
    margin: 25px 0;
}

#ai_credits_bullets p {
    margin: 0;
    line-height: 1.2;
    font-size: 13px;
    padding: 3px 0 3px 9px;
    text-indent: -9px;
}

#ai_credits_bullets p span {
    font-size: 14px;
    color: var(--color-primary);
    font-weight: 800;
}

#ai_credits_purchase_options .ai-credit-purchase-option {
    padding: 18px 15px 18px 50px;
    border: 1px solid var(--color-neutral-mid);
    border-radius: var(--border-radius-md);
    margin-bottom: 10px;
    line-height: 1;
    position: relative;
    cursor: pointer;
    font-size: 0;
    display: block;
}

#ai_credits_purchase_options .ai-credit-purchase-option.selected, #ai_credits_purchase_options .ai-credit-purchase-option:hover {
    border-color: var(--color-primary);
    box-shadow: 0 0 3px var(--color-primary);
}

.ai-credit-purchase-option:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 15px;
    background: url(/assets/images/credits-icon.png) center center no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    margin-top: -10px;
}

.ai-credit-purchase-option .credit-amt span {
    font-weight: 700;
}

.ai-credit-purchase-option .credit-amt {
    display: inline-block;
    vertical-align: middle;
    width: 36%;
    font-size: 16px;
    color: var(--color-text);
}

.ai-credit-purchase-option .credit-pack-cost {
    display: inline-block;
    vertical-align: middle;
    width: 20%;
    text-align: center;
    font-size: 14px;
    font-weight: 600;
    color: var(--color-text-op);
}

.ai-credit-purchase-option .credit-single-cost {
    font-size: 13px;
    color: var(--color-text-op);
    display: inline-block;
    vertical-align: middle;
    width: 33%;
    text-align: right;
}

.ai-credit-purchase-option .credit-single-cost strong {
    color: var(--color-text);
    font-size: 14px;
}

.ai-credit-purchase-option input {
    margin: 0;
    display: none !important;
}

.ai-credit-purchase-option label {
    width: 30px;
    height: 30px;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid var(--color-neutral-mid);
    border-radius: 50%;
    float: right;
    padding: 5px 0 0;
    margin-top: -6px;
    color: transparent;
    font-size: 0;
    text-align: center;
    pointer-events: none;
}

.ai-credit-purchase-option input:checked + label {
    background: var(--color-primary);
    border-color: var(--color-primary);
    color: var(--color-content);
    font-size: 18px;
}

#pro_perks_section {
    font-size: 0;
}

#pro_perks_section .pro-perk {
    display: inline-block;
    vertical-align: top;
    width: 48%;
    height: 70px;
    margin: 5px 1%;
    font-size: 14px;
    border: 1px solid var(--color-neutral-mid);
    border-radius: var(--border-radius-md);
    text-align: left;
    padding: 5px;
    position: relative;
}

#pro_perks_section .pro-perk img {
    width: 60px;
    height: 60px;
    margin-right: 5px;
    display: inline-block;
    vertical-align: middle;
}

#pro_perks_section .pro-perk p {
    margin: 0;
    display: inline-block;
    vertical-align: middle;
    max-width: 60%;
}

#pro_perks_section .pro-perk p.andmore {
    position: absolute;
    color: var(--color-text-mid);
    font-weight: 700;
    font-size: 18px;
    width: 100%;
    text-align: center;
    top: 50%;
    transform: translateY(-50%);
    max-width: unset;
}

#pro_perks_section .pro-perk p.andmore:hover {
    color: var(--color-primary);
}

#pro_perks_section .pro-perk p.andmore i {
    display: block;
    font-size: 42px;
    line-height: 0;
}

#modal_pro .modal-footer {
    text-align: center;
}

#modal_pro .modal-footer span {
    font-size: 13px;
    color: var(--color-text-op);
    display: block;
    padding-top: 10px;
}

.header-links {
    text-align: center;
    width: 46%;
}

.header-links a {
    display: inline-block;
    margin: 0 3px 0;
    vertical-align: middle;
    color: var(--color-text);
    font-size: 1rem;
    text-decoration: none;
    padding: 16px 14px 0;
    height: 100%;
    font-weight: 500;
    line-height: 2;
    position: relative;
}

body:not(.home.landing) .header-links a:first-child {
    font-size: 0;
}

.header-links a > i {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.1rem;
    margin-right: 10px;
    margin-top: -4px;
    line-height: 0;
}

body:not(.home.landing) .header-links a:first-child > i {
    margin: 4px 0 0;
    font-size: 1.2rem;
}

.header-links a:not(.shop-cart-icon) > i.kp-plus {
    font-size: 26px;
    line-height: 1.4;
    margin-right: 6px;
}

.header-links a:hover, .header-links a.active, .header-links a:hover i, .header-links a.active i, #header_btns a:not(#signup_btn):hover {
    background-image: linear-gradient(to right, var(--color-primary), var(--color-secondary));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

#header_bar_top .header-links a.active:after {
    content: '';
    position: absolute;
    bottom: -1px;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(to right, var(--color-primary), var(--color-secondary));
    border-radius: var(--border-radius-sm);
}

.landing #head_left, .landing #head_right, .landing .header-links {
    width: auto !important;
    position: relative;
}

.landing #head_left {
    z-index: 1;
}

.landing .header-inner {
    display: flex;
    justify-content: space-between;
}

#search_wrapper.search-wrapper {
    float: left;
    position: relative;
    width: 60%;
    margin-left: 20px;
}

#gallery_search_wrapper.search-wrapper {
    margin-top: -15px;
    margin-bottom: 15px;
    width: 300px;
}

.search-wrapper form {
    width: 100%;
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.search-wrapper input {
    border: none;
    border-radius: var(--border-radius-xl);
    font-size: 0.875rem;
    background: var(--color-base);
    line-height: 1;
    margin-top: 11px;
    color: var(--color-text);
    padding: 10px 15px 10px 42px;
    width: 100%;
}

#gallery_search_wrapper.search-wrapper input {
    border-radius: var(--border-radius-sm);
}

.search-wrapper button {
    position: absolute;
    left: 0;
    top: 10px;
    height: 38px;
    padding: 4px 10px 0;
    font-size: 1rem;
    background: transparent;
    border: none;
    color: var(--color-text-op);
    border-radius: 50%;
}

.search-wrapper input:focus {
    border-color: var(--color-content);
}

#account_dropdown, #notification_dropdown, #header_btns, .main-nav-shop {
    font-size: 0.875rem;
    float: right;
    height: 100% !important;
    cursor: pointer;
    position: relative;
}

#account_dropdown {
    font-size: 13px;
    height: auto;
    margin-left: 10px;
}

#account_dropdown .dropdown-trigger {
    padding: 12px 10px 0;
    height: 100%;
}

.current-theme-palette, .standard-theme-palette {
    float: right;
    height: 22px;
    width: 102px;
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--color-content);
    box-shadow: 0 0 0 1px var(--color-text-trans);
    overflow: hidden;
    display: flex;
    margin-top: -2px;
}

.standard-theme-palette {
    float: none;
    height: 40px;
    width: 100%;
    border-radius: var(--border-radius-md);
    border: 1px solid var(--color-content);
    margin: 0;
}

.current-theme-palette span, .standard-theme-palette span {
    display: block;
    height: 100%;
    width: 20%;
}

.upic {
    position: relative;
    display: inline-block;
}

.upic > img {
    border-radius: 50%;
}

.notification-header {
    padding: 20px 20px 0;
    border-bottom: 1px solid var(--color-text-trans);
    cursor: default;
}

.notification-header strong {
    font-size: 15px;
    color: var(--color-text);
    text-transform: uppercase;
}

.notification-header .notification-menu {
    float: right;
    margin-top: -4px;
}

.notification-header .notification-menu .menu-items {
    margin-top: 25px;
}

#notification_type_toggles {
    margin: 15px -20px 0;
    border-top: 1px solid var(--color-text-trans);
    background: var(--color-content-light);
    font-size: 0;
    display: flex;
    justify-content: space-around;
    align-items: center;
    cursor: default;
    overflow: hidden;
}

#notification_type_toggles label {
    padding: 9px 6px 0;
    font-size: 1.125rem;
    cursor: pointer;
    width: 12.5%;
    height: 36px;
    text-align: center;
    background: var(--color-content);
    box-shadow: 0 0 0 1px var(--color-text-trans);
}

#notification_type_toggles label:hover {
    opacity: 0.8;
    box-shadow: 0 0 0 1px var(--color-text-trans), inset 0 0 5px 2px var(--color-base);
    z-index: 1;
}

#notification_type_toggles label > i.kp-user-follow {
    color: #a243c9;
}

#notification_type_toggles label > i.kp-heart, #notification_type_toggles label > i.kp-heart-empty {
    color: #f00;
}

#notification_type_toggles label > i.kp-picture {
    color: #3dbb3d;
}

#notification_type_toggles label > i.kp-chat-bubbles, #notification_type_toggles label > i.kp-note {
    color: #189186;
}

#notification_type_toggles label > i.kp-comment {
    color: #1aa4d8;
}

#notification_type_toggles label input {
    display: none;
}

#notification_type_toggles label input:not(:checked) + i {
    color: var(--color-text-mid) !important;
    opacity: 0.7;
}

#notification_type_toggles label:not(:has(input:checked)) {
    background: var(--color-base);
    height: 60px;
    margin: -12px 0;
    padding-top: 21px;
    opacity: 0.8;
}

.load-more-notifs {
    text-align: center;
    display: none;
}

.load-more-notifs a {
    color: var(--color-text-op);
    font-size: 0.75rem;
}

.load-more-notifs a:hover {
    text-decoration: none;
    color: var(--color-text);
}

#notification_dropdown:hover .dropdown-trigger i {
    opacity: 1;
}

#notification_dropdown .dropdown-trigger .notification-count-bubble {
    position: absolute;
    background: var(--color-primary);
    padding: 2px 4px;
    color: var(--color-content);
    font-size: 0.75rem;
    font-weight: 600;
    border-radius: var(--border-radius-xl);
    min-width: 18px;
    height: 18px;
    text-align: center;
    line-height: 1;
    top: -3px;
    right: -3px;
    border: 1px solid var(--color-content);
    display: none;
}


#notification_dropdown.hasnew .dropdown-trigger .notification-count-bubble {
    display: block;
}

#notification_dropdown.hasnew .dropdown-trigger {
    opacity: 1;
}

#account_dropdown i, #account_dropdown img {
    display: inline-block;
    vertical-align: middle;
}

#account_dropdown img {
    border-radius: 50%;
    box-shadow: 0 0 8px rgba(255, 255, 255, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: var(--color-content);
}

#account_dropdown .dropdown-trigger i.kp-user {
    font-size: 24px;
    margin-right: 8px;
}

#header_create_btn, #secondary_create_btn {
    font-size: 1rem;
    text-transform: uppercase;
    border-radius: 40px;
    font-weight: 600;
    float: right;
    padding: 12px 15px 10px;
    margin-top: 10px;
    margin-left: 25px;
    font-family: 'Nunito';
}

#secondary_create_btn {
    float: none;
    margin: 15px auto 0;
    text-align: center;
    display: block;
    color: var(--color-accent-text) !important;
    font-weight: 700 !important;
}

#header_create_btn i {
    display: inline-block;
    padding-right: 5px;
    font-size: 1rem;
    margin-top: -6px;
}

#secondary_create_btn i {
    position: absolute;
    top: 10px;
    left: 15px;
    font-size: 1rem;
}

.main-nav-shop a, #notification_dropdown .dropdown-trigger {
    display: block;
    float: left;
    color: var(--color-text-mid);
    text-decoration: none;
    text-align: center;
    height: 40px;
    width: 40px;
    position: relative;
    font-size: 1rem;
    border-radius: 50%;
    border: 1px solid transparent;
    margin-top: 10px;
    padding-top: 11px;
}

#notification_dropdown.hasnew .dropdown-trigger {
    color: var(--color-text);
    border-color: var(--color-text-trans);
}

.main-nav-shop a {
    display: none;
}

#account_dropdown:hover .dropdown-trigger, #notification_dropdown:hover .dropdown-trigger, .main-nav-shop a:hover {
    background: rgba(255, 255, 255, 0.1);
    opacity: 0.9;
}

.notice-dropdown {
    position: absolute;
    top: 100%;
    margin-top: -2px;
    right: 0;
    background: var(--color-content);
    border-radius: var(--border-radius-lg);
    display: none;
    width: 300px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.1);
    border: 1px solid var(--color-text-trans);
}

.notice-dropdown:before {
    position: absolute;
    bottom: 100%;
    margin-bottom: 1px;
    right: var(--border-radius-lg);
    content: '';
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-bottom: 6px solid var(--color-text-trans);
}

.has-dropdown.open .notice-dropdown {
    display: block;
    z-index: 600;
}

.notice-dropdown > ul {
    list-style: none;
    padding: 0;
    margin: 6px 0;
}

.notice-dropdown > ul li {
    padding: 0 5px;
}

.notice-dropdown > ul li.divider {
    padding-top: 5px;
    margin-bottom: 5px;
    border-bottom: 1px solid var(--color-neutral-trans);
    width: 90%;
    margin-left: 5%;
}

.notice-dropdown > ul li a {
    padding: 15px;
    font-size: 1rem;
    display: block;
    color: var(--color-text);
    text-decoration: none;
    border-radius: var(--border-radius-lg);
}

.notice-dropdown > ul li#menu_item_pro a, .notice-dropdown > ul li.menu-item-pro a {
    font-weight: 600;
    color: #fb923c;
}

.notice-dropdown > ul li#menu_item_pro a i, .notice-dropdown > ul li.menu-item-pro a i {
    margin-top: -5px;
    margin-right: 8px;
}

.notice-dropdown > ul li.nohover a {
    cursor: default;
}

.notice-dropdown > ul li a:hover {
    background: var(--color-base);
}

.theme-bubble {
    width: 30px;
    height: 30px;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid var(--color-neutral-mid);
    border-radius: 50%;
    margin: -8px 0 0 10px;
    float: right;
    position: relative;
    cursor: pointer;
    color: var(--color-text);
}

.theme-bubble.show-all {
    background: var(--color-content-mid);
}

.theme-bubble:not(.selected):hover {
    opacity: 0.8;
    color: var(--color-primary);
}

.theme-bubble.selected {
    box-shadow: 0 0px 1px 2px var(--color-accent);
    cursor: default;
}

.theme-bubble > i, .theme-bubble.selected:after {
    position: absolute;
    line-height: 0 !important;
    top: 50%;
    margin-top: 1px;
    left: 0;
    width: 100%;
    text-align: center;
    padding: 0 !important;
    transform: translateY(-50%);
    font-size: 16px !important;
}

.theme-bubble.selected:after {
    content: '\e8b6';
    font-family: 'kandi-pad';
    font-size: 10px !important;
}

.toggle-switch[for="safesearch_toggle"] {
    float: right;
    margin-top: -12px;
}

.toggle-switch[for="safesearch_toggle"] span:before {
    content: 'OFF';
    font-size: 9px;
    font-weight: 600;
    color: var(--color-text-op);
    display: block;
    position: absolute;
    left: 25px;
    top: 8px;
}

.toggle-switch[for="safesearch_toggle"] input:checked + span:before {
    content: 'ON';
    font-size: 10px;
    color: var(--color-content);
    left: 5px;
    top: 7px;
}

.safesearch-option {
    border-radius: var(--border-radius-lg);
    overflow: hidden;
}

.safesearch-option:hover {
    background: var(--color-base);
}

.safesearch-option > label {
    cursor: pointer;
    display: inline-block;
    vertical-align: middle;
    width: 90%;
    padding: 10px 5px;
    position: relative;
}

.safesearch-option > label:first-child {
    width: 8%;
}

.safesearch-option > label:first-child input {
    display: none;
}

.safesearch-option > label:first-child:before {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    border-radius: var(--border-radius-xl);
    background: var(--color-content);
    border: 1px solid var(--color-text-trans);
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -15px;
    margin-left: -10px;
}

.safesearch-option > label p {
    margin: 5px 0;
}

.safesearch-option > label p strong {
    font-size: 14px;
}

.safesearch-option > label input + i {
    display: none;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -12px;
    margin-left: -6px;
    font-size: 0.875rem;
    color: var(--color-primary);
    z-index: 1;
}

.safesearch-option > label input:checked + i {
    display: block;
}

#notification_dropdown .notice-dropdown {
    width: 410px;
    max-width: 98vw;
    max-height: 500px;
    overflow: auto;
}

#notification_dropdown .notice-dropdown > ul li {
    font-size: 13px;
    color: var(--color-text-op);
    padding: 15px;
    border-bottom: 1px solid var(--color-primary-trans);
    position: relative;
}

#notification_dropdown .notice-dropdown > ul li a {
    color: var(--color-text-op);
}

#notification_dropdown .notice-dropdown > ul li:hover {
    background: var(--color-base);
}

#notification_dropdown .notice-dropdown > ul li.unseen, #notification_dropdown .notice-dropdown > ul li.unread:hover {
    background: var(--color-primary-trans);
}

#notification_dropdown .notice-dropdown > ul li.unseen:hover {
    background: var(--color-primary-mid);
}

#notification_dropdown .notice-dropdown > ul li.unread:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 3px;
    margin-top: -3px;
    background: var(--color-primary);
    width: 6px;
    height: 6px;
    border-radius: 50%;
}

#notification_dropdown .notice-dropdown > ul li.unread a {
    color: var(--color-text);
    font-weight: 600;
}

#notification_dropdown .notice-dropdown > ul li:last-child {
    border-bottom: none;
}

#notification_dropdown .notice-dropdown > ul li.no-notifications {
    background: var(--color-content);
}

#notification_dropdown .notice-dropdown > ul li[data-user=""] .notif-user-img {
    pointer-events: none;
    filter: grayscale(1);
    opacity: 0.2;
}

#notification_dropdown .notice-dropdown > ul li[data-user=""] i {
    opacity: 0.6;
}

.notice-dropdown > ul li a.notification-wrap {
    font-size: 13px;
    padding: 0;
    position: relative;
    border-radius: 0;
}

.notice-dropdown > ul li a.notification-wrap:hover {
    background: transparent;
    color: var(--color-text) !important;
}

.notice-dropdown > ul li a.notification-wrap .userpic-wrap {
    display: inline-block;
    vertical-align: middle;
    margin-right: 15px;
}

.notice-dropdown > ul li a.notification-wrap .userpic-wrap img {
    border-radius: 50%;
    background: var(--color-content);
}

.notice-dropdown > ul li a.notification-wrap > i {
    position: absolute;
    top: 0;
    right: 0px;
    font-size: 12px;
}

.notice-dropdown > ul li a.notification-wrap > i.kp-user-follow {
    color: #a243c9;
}

.notice-dropdown > ul li a.notification-wrap > i.kp-heart, .notice-dropdown > ul li a.notification-wrap > i.kp-heart-empty {
    color: #f00;
}

.notice-dropdown > ul li a.notification-wrap > i.pattern {
    color: #3dbb3d;
}

.notice-dropdown > ul li a.notification-wrap > i.forum {
    color: #189186;
}

.notice-dropdown > ul li a.notification-wrap > i.comment {
    color: #1aa4d8;
}

.notice-dropdown > ul li a.notification-wrap > i.kp-note {
    font-size: 16px;
}

.notice-dropdown > ul li a.notification-wrap .notification-content {
    line-height: 1.3;
    display: inline-block;
    vertical-align: middle;
    width: 275px;
    word-break: break-word;
}

.notice-dropdown > ul li a.notification-wrap .notif-date {
    position: absolute;
    bottom: 2px;
    right: 0;
    font-size: 10px;
    font-weight: 600;
    color: var(--color-text-mid);
    transform: scale(1, 1.1);
}

#credits_count span, .credits-count span {
    font-weight: 500;
}

#credits_count img, .credits-count img {
    border-radius: 0;
    margin-right: 3px;
    margin-top: -3px;
    box-shadow: none;
    border: none;
    background: transparent;
}

#header_btns {
    padding: 0 0 0 12px;
}

#header_btns a {
    text-decoration: none;
    color: var(--color-text);
    padding: 12px 20px;
    display: inline-block;
    font-weight: 500;
    font-size: 1rem;
    margin-top: 10px;
}

.subnav-standard {
    background: var(--color-content);
    border-radius: var(--border-radius-md);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.subnav-standard a {
    text-decoration:  none;
    display: inline-block;
    vertical-align: bottom;
    padding: 17px 15px;
    font-size: 0.875rem;
    text-transform: uppercase;
    line-height: 1;
    font-weight: 600;
    color: var(--color-text);
    border-bottom: 2px solid transparent;
    transition: 0.15s;
}

.subnav-standard a.active {
    color: var(--color-secondary);
    border-bottom-color: var(
    --color-secondary);
}

.subnav-standard a:hover {
    color: var(--color-secondary);
}

.category-block {
    display: inline-block;
    vertical-align: middle;
    width: 100%;
    height: 70px;
    margin: 0 auto 25px;
    border-radius: var(--border-radius-lg);
    background-size: 100% !important;
    background-color: 1px solid var(--color-text-trans) !important;
    position: relative;
    transition: 0.25s;
    border: 1px solid var(--color-text-trans);
    text-decoration: none;
}

.category-block span {
    position: absolute;
    bottom: 0;
    left: 50%;
    width: auto;
    padding: 5px 12px;
    text-decoration: none;
    color: var(--color-text);
    font-weight: 600;
    font-size: 0.875rem;
    text-shadow: 1px 1px 3px var(--color-content);
    background: var(--color-content-op);
    border-radius: var(--border-radius-xl);
    transition: 0.25s;
    border: 1px solid var(--color-text-trans);
    translate: -50% 50%;
    white-space: nowrap;
}

.category-block:hover {
    background-size: 106% !important;
}

.category-block:hover span {
    background: var(--color-content);
}

.category-block.view-all-categories {
    background: var(--color-text) !important;
    color: var(--color-content);
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    text-decoration: none;
    text-align: center;
    padding-top: 18px;
    width: 123px;
}

.category-block.view-all-categories span {
    position: relative;
    left: 0;
    padding: 0;
    background: transparent;
    color: var(--color-content);
    text-decoration: none;
    font-weight: 400;
    line-height: 1.2;
    display: inline-block;
    vertical-align: middle;
    translate: none;
    font-size: 0.813rem;
    width: 80px;
    text-shadow: none;
    text-align: left;
    white-space: normal;
    border: none;
}

.category-block.view-all-categories i {
    display: inline-block;
    vertical-align: middle;
    font-size: 0.813rem;
    transition: 0.25s;
}

.category-block.view-all-categories:hover i {
    margin-left: 3px;
    margin-right: -3px;
}

.has-kpstickyad #sidebar_content .sidebar-inner {
    padding-bottom: 100px;
}

body:not(.nostickysb) #sidebar_btf_placeholder, body:not(.nostickysb) #sidebar_atf_placeholder {
    margin-bottom: 30px;
}

body:not(.nostickysb) #sidebar_btf_sticky_wrapper.mv-stuck, body:not(.nostickysb) #sidebar_atf_sticky_wrapper.mv-stuck {
    position: relative;
    top: 0 !important;
}

.sidebar-widget {
    padding: 15px;
    border-radius: var(--border-radius-lg);
    background: var(--color-content);
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    margin-bottom: 30px;
    position: relative;
    min-height: 170px;
}

.sidebar-widget h3 {
    margin: 0 0 30px;
    font-weight: 700;
    line-height: 1;
}

.sidebar-widget h3 span {
    display: block;
    font-size: 0.875rem;
    color: var(--color-text-op);
    padding-top: 2px;
}

.sidebar-widget h3 span a {
    font-size: 0.875rem;
}

.sidebar-widget h3 a {
    font-weight: 600;
    text-decoration: none;
}

.sidebar-widget h3 a:hover {
    text-decoration: underline;
}

.sidebar-viewmore {
    float: right;
    text-decoration: none;
    color: var(--color-text-mid);
    font-size: 0.813rem;
    line-height: 1.6;
}

.sidebar-viewmore:hover {
    text-decoration: underline;
}

.sidebar-viewmore i {
    vertical-align: middle;
    display: inline-block;
    margin-left: 2px;
    font-size: 0.75rem;
}

.sidebar-widget .ringloader {
    margin: 0 auto;
}

.sidebar-widget#widget_forum_contests {
    min-height: 133px;
}

.sidebar-thread {
    display: block;
    color: var(--color-text-op);
    padding: 8px 0 8px 13px;
    font-size: 0;
    border-left: 2px solid var(--color-neutral);
    margin-left: -15px;
    border-bottom: 2px solid var(--color-content);
    border-top: 2px solid var(--color-content);
}

.sidebar-thread:hover .sidebar-thread-title {
    color: var(--color-primary) !important;
}

.sidebar-thread .sidebar-thread-img {
    display: inline-block;
    vertical-align: middle;
    width: 40px;
}

.sidebar-thread .sidebar-thread-img img {
    width: 100%;
    height: auto;
    border-radius: 50%;
    background: var(--color-content);
}

.sidebar-thread .sidebar-thread-info {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 40px);
    padding-left: 15px;
    font-size: 0.875rem;
}

.sidebar-thread .sidebar-thread-info p {
    margin: 0;
}

.sidebar-thread .sidebar-thread-info p a {
    color: var(--color-text-op);
    text-decoration: none;
}

.sidebar-thread .sidebar-thread-info p a:hover {
    text-decoration: underline;
}

.sidebar-thread .sidebar-thread-info .sidebar-thread-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: -2px;
    font-weight: 600;
    font-size: 1rem;
    color: var(--color-text);
}

.sidebar-thread .sidebar-thread-info .sidebar-thread-title a {
    font-weight: 600;
    font-size: 1rem;
    color: var(--color-text);
}

.sidebar-thread .sidebar-thread-info .sidebar-thread-title a:hover, a.sidebar-thread:hover .sidebar-thread-info .sidebar-thread-title {
    text-decoration: none;
    color: var(--color-primary);
}

.sidebar-thread:nth-child(2) {
    margin-top: -10px;
}

.sidebar-thread:last-child {
    margin-bottom: -5px
}

#widget_forum_recent_mobile {
    text-align: left;
    margin: 15px 0;
    display: none;
}

#widget_forum_topics > a {
    display: inline-block;
    text-decoration: none;
    font-weight: 600;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.9);
    background: var(--color-neutral);
    padding: 8px 16px;
    border-radius: var(--border-radius-xl);
    text-transform: uppercase;
    border: 1px solid var(--color-neutral-mid);
    margin-bottom: 10px;
    transition: 0.15s linear;
}

#widget_forum_topics > a:hover {
    padding-left: 22px;
}

.sidebar-btn {
    display: block;
    height: 62px;
    margin: 0 0 10px;
    border: 1px solid var(--color-text-trans);
    border-radius: var(--border-radius-md);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    background: var(--color-content);
    text-align: left;
    position: relative;
    padding-top: 19px;
    padding-left: 90px;
    text-decoration: none;
    font-weight: 500;
    overflow: hidden;
    transition: 0.15s;
    color: var(--color-text);
}

.sidebar-btn.btn-half {
    display: inline-block;
    vertical-align: top;
    width: 47%;
    margin: 0 1%;
    padding: 15px 10px;
    text-align: center;
}

.sidebar-btn:last-child {
    margin-bottom: 0;
}

.sidebar-btn:hover {
    background: var(--color-content-light);
}

.sidebar-btn:hover span {
    background-image: linear-gradient(to right, var(--color-primary), var(--color-secondary));
    background-clip: text;
    -webkit-background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

.sidebar-btn:not(.btn-half):hover {
    padding-left: 95px;
}

.sidebar-btn > img {
    position: absolute;
    bottom: -6px;
    left: 0;
    pointer-events: none;
    width: 74px;
    height: auto;
}

.sidebar-btn.btn-half > img {
    position: relative;
    margin-bottom: -15px;
    width: 100px;
}

.sidebar-btn > span {
    font-weight: 500;
}

.sidebar-btn > img.load-img {
    max-width: 22px;
    max-height: 22px;
    width: auto;
    height: auto;
    left: 40px;
    top: 18px;
    transform: translate(-50%, -50%);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

.sidebar-btn > img.load-img:nth-child(2) {
    transform: translate(-50%, -50%) rotate(-20deg);
    margin-left: -20px;
    margin-top: 10px;
}

.sidebar-btn > img.load-img:nth-child(3) {
    transform: translate(-50%, -50%) rotate(20deg);
    margin-left: 20px;
    margin-top: 10px;
}

.sidebar-btn-small {
    font-size: 13px !important;
    font-weight: 600;
    background: var(--color-secondary);
    color: var(--color-content);
    border-radius: var(--border-radius-lg);
    padding: 8px 15px 5px;
    cursor: pointer;
}

.sidebar-btn-small:hover {
    opacity: 0.8;
}

#sidebar_recent_projects {
    position: relative;
    font-size: 0;
    padding-bottom: 20px;
    display: flex;
    justify-content: space-between;
}

#sidebar_recent_projects > a {
    display: inline-block;
    vertical-align: middle;
    width: 90px;
    height: 90px;
    position: relative;
    border: 1px solid var(--color-text-trans);
    border-radius: var(--border-radius-lg);
    overflow: hidden;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
}

#sidebar_recent_projects > a:hover {
    opacity: 0.8;
}

#sidebar_recent_projects > a > img {
    max-width: 80%;
    max-height: 80%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border-radius: var(--border-radius-sm);
    transition: 0.15s linear;
}

#sidebar_recent_projects > a:hover > img {
    max-width: 85%;
    max-height: 85%;
}

.trending-user {
    padding-bottom: 15px;
    position: relative;
}

.trending-user:last-child {
    padding-bottom: 0;
}

.trending-user a {
    display: inline-block;
    vertical-align: middle;
    text-decoration: none;
    font-size: 0;
}

.trending-user a img {
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.trending-user a img:hover {
    opacity: 0.8;
}

.trending-user a.trending-username {
    margin-left: 15px;
    color: var(--color-text);
    font-size: 14px;
    max-width: 150px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.trending-user a.trending-username:hover {
    text-decoration: underline;
}

.trending-user a.follow-btn {
    float: right;
    margin-top: 5px;
    border: 1px solid var(--color-secondary);
}

.trending-user a.follow-btn.following {
    color: var(--color-secondary);
    background: var(--color-content);
}

#widget_collections {
    min-height: unset;
}

#widget_collections .related-collection {
    margin-bottom: 15px;
    position: relative;
}

#widget_collections .related-collection:before {
    content: '';
    position: absolute;
    top: 3px;
    left: 0;
    width: 44px;
    height: 32px;
    border: 1px solid var(--color-neutral);
    border-radius: var(--border-radius-sm);
    background: var(--color-content-light);
}

#widget_collections .related-collection:last-child {
    margin-bottom: 0;
}

#widget_collections .related-collection a {
    text-decoration: none;
}

#widget_collections .related-collection .rel-col-img {
    display: inline-block;
    vertical-align: middle;
    position: relative;
    width: 40px;
    margin: 0 15px 0 3px;
    height: 40px;
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid var(--color-neutral);
    border-radius: var(--border-radius-sm);
    overflow: hidden;
}

#widget_collections .related-collection .rel-col-img > img {
    position: absolute;
    top: 50%;
    left: 50%;
    max-width: 100%;
    max-height: 100%;
    transform: translate(-50%, -50%);
}

#widget_collections .related-collection .rel-col-img:hover img {
    opacity: 0.8;
}

#widget_collections .related-collection .rel-col-info {
    display: inline-block;
    vertical-align: middle;
    width: 225px;
    position: relative;
    line-height: 1.2;
}

#widget_collections .related-collection .rel-col-info .rel-col-title {
    font-weight: 600;
    font-size: 16px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: block;
    color: var(--color-text);
}

#widget_collections .related-collection .rel-col-info .rel-col-title:hover {
    color: var(--color-primary);
}

#widget_collections .related-collection .rel-col-user a {
    font-size: 0.875rem;
    color: var(--color-text-op);
}

#widget_collections .related-collection .rel-col-user a:hover {
    text-decoration: underline;
}

.sidebar-category {
    display: inline-block;
    vertical-align: middle;
    height: 70px;
    width: 47%;
    margin-left: 4%;
    margin-bottom: 15px;
    border-radius: var(--border-radius-lg);
    background-size: 100% !important;
    background-color: 1px solid var(--color-text-trans) !important;
    position: relative;
    transition: 0.25s;
    border: 1px solid var(--color-text-trans);
    text-decoration: none;
}

.sidebar-category:nth-child(odd) {
    margin-left: 0;
}

.sidebar-category span {
    position: absolute;
    top: 50%;
    left: 50%;
    width: auto;
    padding: 5px 12px;
    text-decoration: none;
    color: var(--color-text);
    font-weight: 700;
    font-size: 0.875rem;
    background: var(--color-content);
    border-radius: var(--border-radius-xl);
    transition: 0.25s;
    border: 1px solid var(--color-text-trans);
    translate: -50% -50%;
    white-space: nowrap;
    opacity: 0.93;
}

.sidebar-category:hover {
    background-size: 106% !important;
}

.sidebar-category:hover span {
    opacity: 1;
}

#modal_load_project .modal-body {
    text-align: center;
}

.project-file {
    display: inline-block;
    vertical-align: bottom;
    width: 31%;
    height: 175px;
    min-width: 140px;
    margin: 0 1% 10px;
    text-decoration: none;
    overflow: hidden;
    background: var(--color-content);
    border-radius: var(--border-radius-lg);
    text-align: center;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
    border: 1px solid var(--color-content-light);
}

.project-file .load-img-wrap {
    display: block;
    width: 100%;
    position: relative;
    height: 120px;
    background: var(--color-content-light);
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
}

.project-file .load-img-wrap img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 120px;
    max-height: 100px;
    width: auto;
    height: auto;
}

.project-file .load-proj-title {
    font-size: 0.813rem;
    line-height: 1.2;
    padding: 10px 5px 0;
    color: var(--color-text);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    text-overflow: ellipsis;
    height: 2.6rem;
}

.project-file:hover .load-img-wrap {
    border-color: var(--color-primary);
    opacity: 0.8;
}

.project-file:hover .load-proj-title {
    color: var(--color-primary);
}

.user-profile-card {
    text-align: center;
    padding: 15px;
    padding-top: 30px;
    border-radius: var(--border-radius-lg);
    background: linear-gradient(0deg, var(--profile-usercard-bg), var(--profile-usercard-fg));
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
    width: 330px;
    position: absolute;
    z-index: 100;
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);
}

.user-profile-card.no-banner {
    padding-top: 15px;
}

.user-profile-card .card-profile-banner {
    overflow: hidden;
    height: 128px;
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: -1;
    background: linear-gradient(45deg, var(--profile-accent-one-trans), var(--profile-accent-two-trans));
}

.user-profile-card .card-profile-banner img {
    position: absolute;
    top: 50%;
    left: 50%;
    translate: -50% -50%;
    height: 100%;
}

.user-profile-card.no-banner .card-profile-banner {
    display: none;
}

.user-profile-card.sidebar-widget {
    position: relative;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
}

.user-profile-card .card-profile-image {
    position: relative;
    border-radius: 50%;
    pointer-events: all;
    padding: 15px 0 10px;
}

.user-profile-card .card-profile-image img {
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
    background: var(--profile-usercard-fg);
    border-radius: 50%;
    border: 1px solid var(--profile-usercard-fg-trans);
}

.user-profile-card .profile-card-actions {
    position: relative;
    margin-top: -60px;
    height: 80px;
}

.profile-card-action {
    background: var(--profile-usercard-fg-mid);
    border: 1px solid var(--profile-usercard-text-trans);
    color: var(--profile-usercard-text-op);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    display: block;
    cursor: pointer;
    position: absolute;
    left: 50%;
    translate: -50% 0;
}

.profile-card-action.profile-card-share {
    padding-top: 4px;
    top: 0;
    margin-left: -120px;
}

.profile-card-action.profile-card-menu {
    margin-left: 120px;
    padding-top: 5px;
    top: 0;
}

.profile-card-action.user-card-image-upload-toggle {
    margin-left: 120px;
    padding-top: 7px;
    top: 0;
}

.profile-card-action .menu-trigger {
    color: var(--profile-usercard-text-op);
    width: 100%;
    display: block;
    background: transparent !important;
}

.profile-card-action.toggle-menu > ul {
    right: 35px;
    background: var(--profile-usercard-accent);
    border: 1px solid var(--profile-usercard-fg-trans);
}

.profile-card-action.toggle-menu > ul > li > a {
    color: var(--profile-usercard-fg);
}

.profile-card-action.toggle-menu > ul > li > a:hover {
    background: var(--profile-usercard-fg-trans);
}

.profile-card-action:hover, .profile-card-action:hover .menu-trigger {
    color: var(--profile-usercard-fg);
    background: var(--profile-usercard-accent);
}

.profile-card-action.profile-card-palette, .profile-card-action.user-card-frame-picker-toggle {
    bottom: 0;
    height: 36px;
    width: 36px;
    padding-top: 2px;
    margin-left: -96px;
}

.profile-card-action.user-card-frame-picker-toggle {
    margin-left: 96px;
}

.user-profile-card .profile-card-username {
    color: var(--profile-usercard-text);
    text-decoration: none;
    text-transform: none;
    font-weight: 700;
    margin: 0;
    display: inline-block;
    font-size: 1.315rem;
    font-family: "Nunito", "Google Sans Flex", Arial, Helvetica, sans-serif;
    max-width: 100%;
    line-height: 1;
    padding: 2px 0 5px;
    word-wrap: break-word;
}

.user-profile-card a.profile-card-username {
    margin-top: 10px;
}

.user-profile-card a.profile-card-username:hover {
    text-decoration: underline;
    filter: invert(0.6);
    opacity: 0.9;
}

.user-profile-card .profile-card-username + em {
    font-size: 0.75rem;
    color: var(--profile-usercard-text-mid);
    font-weight: 500;
    display: block;
    margin: -3px 0 5px;
}

.user-profile-card .profile-card-tags {
    display: flex;
    font-size: 0.75rem;
    color: var(--profile-usercard-text-op);
    font-weight: 500;
    justify-content: center;
    align-items: center;
    padding-bottom: 15px;
}

.profile-card-tag {
    margin: 2px 5px 10px;
}

.profile-card-tag > span {
    display: inline-block;
    height: 8px;
    width: 8px;
    vertical-align: middle;
    border-radius: 50%;
    margin-right: 3px;
    margin-top: -2px;
    background: var(--profile-usercard-bg);
}

.profile-card-stats {
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--profile-usercard-text-trans);
    background: var(--profile-usercard-fg-op);
    font-size: 0;
    max-width: 400px;
    margin: 0 auto;
    overflow: hidden;
}

.profile-card-stat {
    display: inline-block;
    vertical-align: middle;
    width: 33.3333%;
    font-size: 0.813rem;
    font-weight: 500;
    color: var(--profile-usercard-text-mid);
    text-decoration: none;
    padding: 10px 0;
    border-right: 1px solid var(--profile-usercard-text-trans);
    line-height: 1.3;
}

.profile-card-stat:last-child {
    border: none;
}

.profile-card-stat strong {
    display: block;
    font-size: 1.125rem;
    color: var(--profile-usercard-text-op);
}

.profile-card-stat:hover {
    background: var(--profile-usercard-fg-mid);
    color: var(--profile-usercard-text-op);
}

.profile-card-stat:hover strong {
    color: var(--profile-usercard-text);
}

/* Project Image Upload Form */

/* CROP */
.crop-img-wrap {
    display: none;
    height: 200px;
    margin-bottom: 40px;
    background: var(--color-base);
    font-size: 0;
}

.add-img-drop-zone {
    height: 215px;
    width: 100%;
    max-width: 700px;
    border: 2px dashed var(--color-primary);
    background-color: var(--color-content);
    background-size: 20px 20px;
    background-position: 0 0, 10px 10px;
    background-image: linear-gradient(45deg, var(--color-base) 25%, transparent 25%, transparent 75%, var(--color-base) 75%, var(--color-base)), linear-gradient(45deg, var(--color-base) 25%, transparent 25%, transparent 75%, var(--color-base) 75%, var(--color-base));
    cursor: pointer;
    position: relative;
    box-shadow: none;
    border-radius: var(--border-radius-md);
}   

.add-img-drop-zone:before {
    content: 'Drag & Drop to Upload';
    font-size: 18px;
    position: absolute;
    top: 50%;
    left: 0;
    font-weight: 500;
    width: 100%;
    padding: 10px 30px;
    margin-top: -5px;
    text-align: center;
    transform: translateY(-50%);
    color: var(--color-text);
    box-sizing: border-box;
}

.add-img-drop-zone:after {
    content: 'or Click to Browse';
    display: block;
    font-size: 14px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-top: 18px;
    left: 0;
    width: 100%;
    text-align: center;
    color: var(--color-text);
}
    
.add-img-drop-zone.server-block-img {
    max-width: 338px;
}
    
.add-img-drop-zone:hover:before, .add-img-drop-zone:hover:after {
    color: var(--color-primary);
}
 
.is-dragover .add-img-drop-zone {
    box-shadow: inset 0 0 50px var(--color-primary-mid);
}

.is-dragover .add-img-drop-zone:before, .is-dragover .add-img-drop-zone:after {
    color: var(--color-primary);
}

.cr-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 65px;
    z-index: 10;
}

#preview_photo_thumb {
    float: left;
    margin-right: 15px;
}

#modal_project_pic .crop-wrap.project-image-uploaded {
    overflow: hidden;
    position: absolute;
    opacity: 0;
    border: 2px solid var(--color-primary);
    z-index: 1;
}

#modal_project_pic .crop-wrap.project-image-uploaded:hover {
    opacity: 0.7;
}

#modal_project_pic .crop-wrap.project-image-uploaded .add-img-drop-zone:hover:after {
    display: none;
}

#modal_project_pic .crop-wrap.project-image-uploaded .add-img-drop-zone:hover:before {
    color: var(--color-content);
}

#modal_project_pic .crop-wrap.project-image-uploaded:hover .add-img-drop-zone:before {
    top: 90px;
}

#project_img_upload_pattern strong {
    display: block;
}

/* SIGNUP FORM */

#modal_signup .step-one {
    display: block;
}

#modal_signup .step-two {
    display: none;
}

#modal_signup .chosen-username {
    margin-bottom: 15px;
}

#modal_signup .chosen-username strong {
    font-size: 21px;
}

#modal_signup .chosen-username span {
    margin-bottom: 25px;
    color: var(--color-primary);
    padding: 10px 15px 8px 10px;
}

#modal_signup .chosen-username span i {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
}

#modal_signup .chosen-username span:hover {
    text-decoration: underline;
}

#modal_signup #create_account_btn, #modal_login #do_login_btn {
    display: block;
    width: 100%;
    margin: 40px 0 0;
    border-radius: var(--border-radius-md);
}

.forgot-password {
    font-size: 0.75rem;
    color: var(--color-text-op);
    margin: 0;
}

.forgot-password a, .privacy-agree a {
    text-decoration: none;
}

.forgot-password a:hover, .privacy-agree a:hover {
    text-decoration:  underline;
}

#signup_back_btn {
    border: none;
    background: var(--color-base);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    color: var(--color-text);
    cursor: pointer;
}

#signup_back_btn i {
    transition: 0.25s;
}

#signup_back_btn:hover {
    opacity: 0.8;
}

#signup_back_btn:hover i {
    margin-left: -5px;
}

#modal_three_gallery .kp-modal .modal-body {
    height: calc(100% - 40px);
    max-height: unset;
    overflow: visible;
    position: relative;
    margin: 0 -30px -30px;
}

#modal_three_gallery .modal-body:after, #modal_three_viewer .modal-body:after {
    content: 'Loading...';
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 14px;
    transform: translate(-50%, -50%);
    margin-top: -25px;
    color: var(--color-text);
    background: url(/assets/images/3dicon.png) left center no-repeat;
    background-size: contain;
    padding-left: 25px;
    opacity: 0.8;
}

#modal_three_gallery .modal-body:before, #modal_three_viewer .modal-body:before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -6px;
    margin-left: -60px;
    height: 12px;
    width: 120px;
    border-radius: var(--border-radius-lg);
    background-image: linear-gradient(-45deg, var(--color-primary) 25%, var(--color-primary-trans) 25%, var(--color-primary-trans) 50%, var(--color-primary) 50%, var(--color-primary) 75%, var(--color-primary-trans) 75%);
    background-color: var(--color-primary-trans);
    background-size: 40px 40px;
    border: 1px solid var(--color-primary-mid);
    animation: load 2s linear infinite;
}

#modal_three_gallery .modal-body iframe, #modal_three_viewer .modal-body iframe {
    width: 100%;
    height: 100%;
    position: relative;
    z-index: 1;
}

#modal_collections .modal-body > p > span {
    font-style: italic;
    font-weight: 600;
}

#modal_collections #collections_list {
    list-style: none;
    margin: 0;
    padding: 0;
}

#modal_collections #collections_list li {
    position: relative;
}

#modal_collections #collections_list li:hover {
    background: var(--color-content-light);
    border-radius: var(--border-radius-md);
}

#modal_collections #collections_list li:hover * {
    color: var(--color-primary);
}

#modal_collections #collections_list li > input[type="checkbox"] {
    display: none;
}

#modal_collections #collections_list li > label {
    font-size: 16px;
    color: var(--color-text);
    padding: 15px 15px 15px 50px;
    display: block;
    cursor: pointer;
    position: relative;
    min-width: 22px;
    min-height: 22px;
}

#modal_collections #collections_list li > label:before {
    content: '';
    width: 20px;
    height: 20px;
    border: 1px solid var(--color-text-trans);
    position: absolute;
    left: 10px;
    border-radius: var(--border-radius-xl);
    text-align: center;
    font-family: 'Kandi-Pad';
    color: var(--color-primary);
    font-size: 0.875rem;
    line-height: 20px;
}

#modal_collections #collections_list li > input:checked + label:before {
    content: '\e82c';
    background: var(--color-content-light);
    border-color: var(--color-primary);
}

#modal_collections #collections_list li > label[for^="collection_new"] {
    display: inline-block;
    padding: 0;
    vertical-align: middle;
}

#modal_collections #collections_list li > input.new-collection-name {
    display: inline-block;
    vertical-align: middle;
    margin: 5px 0 5px -30px;
    background: transparent;
    border: none;
    box-shadow: none;
    color: var(--color-text);
    width: 100%;
    padding-left: 60px;
}

#modal_collections #new_collection_modal_btn {
    float: left;
    padding: 12px 20px 12px 15px;
}

#modal_collections #new_collection_modal_btn i {
    font-size: 21px;
    margin-right: 10px;
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
}

#creation_colors {
    display: inline-block;
    vertical-align: top;
    margin-bottom: 20px;
    max-width: 90%;
}

#creation_colors table {
    width: 100%;
    font-size: 14px;
}

#kandi_colors_suggested  {
    padding: 10px 10px 0 25px;
    margin-top: 5px;
    max-height: 75vh;
    overflow: auto;
    position: relative;
}

#kandi_colors_suggested:before {
    content: '\50';
    font-family: 'kandi-pad';
    color: var(--color-neutral);
    position: absolute;
    top: 5px;
    left: -1px;
}

#kandi_colors_suggested #info_suggested {
    text-align: left;
}

#kandi_colors_suggested #info_suggested tr td {
    color: var(--color-neutral);
    font-size: 21px;
}

#kandi_colors_suggested #info_suggested tr td:first-child {
    width: 100px;
}

#kandi_colors_suggested #info_suggested tr td .info-bead-color {
    margin: 2px 0;
    width: 75px;
    border-radius: 0;
    box-shadow: 0 2px 5px #ccc;
    text-align: left;
    padding-top: 0;
}

#kandi_colors_suggested #info_suggested tr td .info-bead-color span.bead-count {
    position: static;
    transform: none;
    display: inline-block;
    vertical-align: middle;
    padding: 1px 8px 0;
    margin-top: -2px;
    background: rgba(0, 0, 0, 0.1);
    text-shadow: 0 1px 3px rgb(0 0 0 / 50%);
}

#kandi_colors_suggested #info_suggested tr td:last-child .info-bead-color {
    margin-left: 20px;
}

#kandi_colors_suggested #info_suggested tr th {
    padding-bottom: 10px;
}

#kandi_colors_suggested #info_suggested tr th:last-child {
    padding-left: 45px;
}

#kandi_info_color.building {
    max-width: 520px;
}

#kandi_info_color.building .info-bead-color:not(.perler) {
    border-radius: 0;
    box-shadow: none;
    margin: 5px;
    border: 1px solid #000;
}

#creation_colors table#info_beads th {
    text-align: left;
    padding-left: 3px;
}

#creation_colors table#info_stats td{
    padding: 10px 0;
    width: 70%;
}

#creation_colors table#info_beads td{
    font-size: 18px;
    color: var(--color-neutral);
}

#creation_colors table#info_stats tr:nth-child(odd) td, #creation_colors table#info_stats tr:nth-child(odd) th {
    background: var(--color-base);
}

#creation_colors table#info_beads tr td:nth-child(odd), #creation_colors table#info_beads tr th:nth-child(odd) {
    width: 90px;
}

#creation_colors table#info_beads tr th:nth-child(even) {
    padding-left: 28px;
}

td#info_beads {
    font-size: 0;
}

#kandi_info_color {
    max-height: 200px;
    overflow: auto;
}

.info-bead-color {
    padding-top: 15px;
    display: inline-block;
    vertical-align: middle;
    height: 30px;
    width: 60px;
    text-align: center;
    position: relative;
    margin: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2), inset 0 0 0 3px rgba(255, 255, 255, 0.2);
    white-space: nowrap;
    border-radius: var(--border-radius-sm);
    overflow: hidden;
}

.info-bead-color[data-style="g"]:before {
    content: '';
    background-image: linear-gradient(0deg, rgba(220, 220, 220, 0.2) 1px, transparent 10px), radial-gradient(rgba(220, 220, 220, 0.5) 1px, transparent 3px), radial-gradient(rgba(150, 150, 150, 0.5) 1px, transparent 3px);
    background-size: 16px 16px;
    background-position: 0 0, 8px 8px;
    border: none;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    transform: rotate(20deg);
}

.info-bead-color[data-style="c"] {
    opacity: 0.7;
}

.info-bead-color[data-style="c"]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: linear-gradient(45deg, transparent, rgba(0, 0, 0, 0.2) 45%, rgba(255, 255, 255, 0.2) 72%);
    mix-blend-mode: luminosity;
}

.info-bead-color[data-style="l"]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: radial-gradient(#fff 25%, #666 75%);
    mix-blend-mode: hard-light;
    opacity: 0.5;
}

.info-bead-color[data-style="p"]:before {
    content: '';
    position: absolute;
    opacity: 0.2;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: linear-gradient(#000 0%, #fff 5%, #000 40%, #fff 80%, #000 100%);
    mix-blend-mode: difference;
}

.info-bead-color[data-style="s"]:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    background-image: repeating-conic-gradient(from 23deg, attr(data-secondary type(<color>), rgba(255, 255, 255, 0.6)) 0deg 45deg, transparent 45deg 90deg);
}

#color_reference_table .info-bead-color[data-style="s"]:before {
    background-image: repeating-linear-gradient(90deg, attr(data-secondary type(<color>), rgba(255, 255, 255, 0.6)) 0 15%, transparent 15% 28%);
}

.info-bead-color.perler {
    height: 45px;
    width: 45px;
    border-radius: 50%;
}

.info-bead-color span {
    color: var(--color-text);
    position: absolute;
    bottom: 1px;
    left: 100%;
    width: 100%;
    padding: 1px 0;
    font-size: 13px;
    margin-left: 15px;
    line-height: 30px;
    text-align: left;
    z-index: 2;
}

.info-bead-color span.bead-count {
    color: var(--color-content);
    text-shadow: 0 1px 3px #000;
    top: 50%;
    left: 50%;
    width: auto;
    height: 100%;
    padding: 0;
    margin-left: 0;
    line-height: 29px;
    transform: translate(-50%, -50%);
    cursor: default;
}

.info-bead-color.perler span.bead-count {
    color: var(--color-content);
    text-shadow: 0 1px 3px var(--color-text);
    top: 50%;
    left: 50%;
    width: auto;
    height: 100%;
    padding: 0;
    margin-left: 0;
    line-height: 44px;
    transform: translate(-50%, -50%);
}

.info-colors-suggested {
    margin: 10px 0 30px;
}

#suggested_toggle {
    font-size: 13px;
    color: var(--color-text-mid);
    border-left: 3px solid var(--color-primary);
    padding-left: 15px;
}

#suggested_toggle #suggested_palette {
    padding: 5px;
    margin: 5px 10px;
    border: 1px solid var(--color-text-mid);
    border-radius: 3px;
}

#permissions_toggles .permission-toggle {
    padding-top: 15px;
    border: none;
    margin-top: 0;
}

#permissions_toggles .permission-toggle .kp-select {
    width: 300px;
    max-width: 100%;
}

#permissions_toggles .permission-toggle .kp-select li {
    font-size: 14px;
    text-transform: uppercase;
    padding-bottom: 5px;
}

#permissions_toggles .permission-toggle .kp-select li.needspro {
    color: var(--color-text-mid);
}

#permissions_toggles .permission-toggle .kp-select.open {
    z-index: 1;
    position: relative;
}

#permissions_toggles .permission-toggle > p, #modal_project_name_prompt .permission-toggle > p {
    font-size: 12px;
    color: var(--color-text-op);
    margin: 5px 0 0 5px;
}

#permissions_toggles .permission-toggle.preview, #permissions_toggles .permission-toggle.unfinished, #permissions_toggles .permission-toggle.inappropriate, #modal_project_name_prompt .permission-toggle > p.preview, #modal_project_name_prompt .permission-toggle > p.unfinished, #modal_project_name_prompt .permission-toggle > p.inappropriate {
    opacity: 0.5;
    cursor: default;
    pointer-events: none;
}

#permissions_toggles .permission-toggle.inappropriate p:before {
    content: '(This project has been set to private by Kandi Pad Admin) ';
    color: var(--color-text);
}

#permissions_toggles .permission-toggle.unfinished p:before {
    content: '(This project has been set to private by Kandi Pad Admin) ';
    color: var(--color-text);
}

#project_redescription {
    display: block;
    width: 100%;
    height: 150px;
    resize: vertical;
}

#follow_btn, .profile-card-follow-btn {
    cursor: pointer;
    line-height: 0;
    border-radius: var(--border-radius-lg);
    background: var(--color-secondary);
    border: 1px solid var(--color-secondary);
    color: var(--color-content);
}

.profile-card-follow-btn {
    text-transform: uppercase;
    font-size: 0.813rem;
    padding: 0;
    border-radius: var(--border-radius-md);
    margin: 0 auto 15px;
    max-width: 300px;
    background: var(--profile-usercard-accent);
    border-color: var(--profile-usercard-fg-mid);
    color: var(--profile-usercard-fg);
}

#follow_btn .follow-alerts, .profile-card-follow-btn .follow-alerts {
    vertical-align: middle;
    padding: 10px 8px 8px 10px;
    border-right: 1px solid var(--color-secondary-trans);
    font-size: 1.125rem;
    line-height: 0;
    display: none;
}

.profile-card-follow-btn .follow-alerts {
    border-right-color: var(--profile-usercard-accent-mid);
}

#follow_btn .follow-text, .profile-card-follow-btn .follow-text {
    display: block;
    padding: 20px 0 16px;
    border-radius: var(--border-radius-md);
    font-weight: 600;
}

#follow_btn .follow-text > i, .profile-card-follow-btn .follow-text > i {
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
    margin-top: -5px;
    font-size: 16px;
}

#follow_btn.following {
    color: var(--color-secondary);
    background: var(--color-content);
    padding: 0;
}

.profile-card-follow-btn.following {
    border-color: var(--profile-usercard-accent-mid);
    background: var(--profile-usercard-fg-op);
    color: var(--profile-usercard-accent);
    padding: 0;
}

#follow_btn .follow-text, .profile-card-follow-btn.following .follow-text {
    padding-right: 38px;
    margin-left: 40px;
    width: calc(100% - 40px);
}

#follow_btn.following .follow-alerts, .profile-card-follow-btn.following .follow-alerts {
    display: block;
    float: left;
}

#follow_btn.following .follow-alerts.alerts-off {
    color: var(--color-content-mid);
}

.profile-card-follow-btn.following .follow-alerts.alerts-off {
    color: var(--profile-usercard-accent-mid);
}

#follow_btn:not(.following):hover, .profile-card-follow-btn:not(.following):hover {
    opacity: 0.8;
}

#follow_btn.following .follow-alerts:hover, .profile-card-follow-btn.following .follow-alerts:hover {
    opacity: 0.8;
}

#follow_btn.following .follow-text:hover, .profile-card-follow-btn.following .follow-text:hover {
    opacity: 0.8;
}

/***************/

#container {
    width: 100%;
    margin: 0 auto 30px;
    overflow: hidden;
    position: relative;
    max-width: 1280px;
}

.full #container {
    max-width: unset;
}

#sidebar {
    position: absolute;
    width: 300px;
    margin-top: 35px;
    top: 0;
    right: 0;
}

.ppadlist {
    display: block;
    margin: 20px auto;
    max-width: 99%;
    max-height: 100px;
    width: 728px;
}

.ppadgrid {
    text-align: center;
    margin: 0 auto 30px;
    overflow: hidden;
    width: 1280px;
    max-width: 99%;
}

.ppadgrid .lsad {
    display: inline-block;
    vertical-align: top;
    width: 33%;
    text-align: center;
}

.ppadlist-block {
    display: inline-block;
    overflow: hidden;
    text-align: center !important;
    background: transparent !important;
    padding-top: 0 !important;
    box-shadow: none !important;
    border: none !important;
    height: 400px;
}

.ppadlist-block .pw-tag {
    margin: 0 auto;
    max-height: 400px !important;
    max-width: 100% !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.ppadlist-block .adsbygoogle, .ppadlist-block .adsbygoogle > div[id^="aswift_"], .ppadlist-block .adsbygoogle > div[id^="aswift_"] > iframe {
    max-width: 100% !important;
    margin-left: 0 !important;
}

.pro .ppadlist-block, .pro .ppadlist, .pro .ppadlist-pagewide, .pro.ppadgrid {
    display: none !important;
}

.ppadlist-pagewide {
    width: 100% !important;
    overflow: hidden !important;
    margin: 15px 0;
    min-height: 250px;
}

body.home:not(.logged) #pw-oop-bottom_rail, body.home:not(.logged) .dismissrail, body.home:not(.logged) .ppadlist-pagewide, body.home:not(.logged) .pw-corner-ad-video {
    display: none !important;
}

#content {
    padding: 15px 30px;
    overflow: hidden;
    position: relative;
    min-height: 100vh;
}

body.shop #container {
    max-width: 1280px;
}

body.shop #content {
    padding: 15px;
}

#content.has-sidebar {
    padding-left: 390px;
}

#content .content-section {
    padding: 15px 0 5px;
    position: relative;
}

#sidebar_content {
    position: absolute;
    top: 0;
    padding: 30px 0 0 30px;
    width: 360px;
    z-index: 1;
    bottom: auto;
}

#sidebar_content.stuck-top {
    position: fixed;
    top: 60px;
    bottom: auto;
}

#sidebar_content.stuck-bottom {
    position: fixed;
    bottom: 0;
    top: auto;
}

#sidebar_content.stuck-footer {
    position: fixed;
    top: auto;
}

input.full, textarea.full, select.full {
    width: 100%;
}

#birthdate_inputs {
    background: var(--color-base);
    border-radius: var(--border-radius-md);
    margin: 10px 0 25px;
    color: var(--color-text-op);
    padding: 0;
    display: block;
}

#birthdate_inputs input {
    display: inline-block;
    vertical-align: middle;
    width: 35px;
    margin: 0;
    padding: 12px 0;
    box-shadow: none !important;
    background: transparent;
    text-align: center;
}

#birthdate_inputs input:first-child {
    padding-left: 15px;
    width: 50px;
}

#birthdate_inputs:has(input:focus) {
    box-shadow: 0 0 5px var(--color-primary);
}

#birthdate_inputs input::-webkit-outer-spin-button,
#birthdate_inputs input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

#birthdate_inputs input[type=number] {
    -moz-appearance:textfield;
}

#modal_signup #next_step_btn {
    width: 100%;
    border-radius: var(--border-radius-md);
    margin-top: 20px;
}

/* ADS */

.ppadlist {
    display: block;
    margin: 20px auto;
    max-width: 99%;
    overflow: hidden;
}

.ppadgrid {
    text-align: center;
    margin: 0 auto 30px;
    overflow: hidden;
    width: 1280px;
    max-width: 99%;
}

.ppadgrid .lsad {
    display: inline-block;
    vertical-align: top;
    width: 33%;
    text-align: center;
}

.ppadlist-block {
    display: inline-block;
    overflow: hidden;
    text-align: center !important;
    background: transparent !important;
    padding-top: 0 !important;
    box-shadow: none !important;
    border: none !important;
    height: 400px;
}

.ppadlist-block .blockad-header {
    font-size: 14px;
    position: absolute;
    top: 0;
    left: 0;
    padding: 15px 15px 0;
    width: 100%;
    text-align: left;
}

.sidebar-widget.sidebar-ad .blockad-header {
    display: none !important;
}

.ppadlist-block .blockad-header > i {
    font-size: 14px;
    margin-left: 10px;
}

.ppadlist-block .blockad-header > span {
    float: right;
    font-size: 12px;
    padding-top: 3px;
}

.ppadlist-block .blockad-header > span a {
    text-decoration:  none;
}

.ppadlist-block .blockad-header > span a:hover {
    text-decoration: underline;
}

.ppadlist-block .blockad-container {
    position: absolute;
    top: 40px;
    left: 0;
    width: 100%;
    height: calc(100% - 40px);
}

.ppadlist-block .blockad-container:before {
    content: 'AD';
    color: var(--color-text-trans);
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    text-align: center;
    margin-top: -15px;
    font-size: 24px;
    line-height: 1;
    font-weight: 700;
}

.sidebar-ad .blockad-container {
    min-height: 270px;
}

.ppadlist-block .pw-tag {
    margin: 0 auto;
    max-height: 400px !important;
    max-width: 100% !important;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.partnerad-wrapper {
    text-align: center;
}

a.partnerad img {
    max-width: 95%;
}

.sidebar-widget.sidebar-ad:last-child {
    margin-bottom: 120px;
}

.sidebar-widget.sidebar-ad > div {
    margin-bottom: 15px;
    width: 100%;
    overflow: hidden;
}

.sidebar-widget.sidebar-ad > div:last-child {
    margin-bottom: 0;
}

.sidebar-widget.sidebar-ad h3 {
    margin-bottom: 20px;
}

.sidear-ad .info-bubble {
    float: right;
}

.sidebar-ad .info-bubble {
    float: right;
    font-size: 18px;
}

.pw-tag:not(#pw-oop-bottom_rail) {
    margin: 5px 0;
}

#pw-oop-bottom_rail {
    z-index: 848 !important;
    background: var(--color-content-op) !important;
    padding-top: 0 !important;
}

#pw-oop-bottom_rail > a.closesticky {
    position: absolute;
    top: 10px;
    right: 10px;
    color: var(--color-content-mid);
    text-decoration: none;
    font-size: 16px;
    z-index: 999;
    background: var(--color-content-op);
    border-radius: 50%;
    padding: 2px;
    line-height: 0;
}

#fixed_container_bottom {
    z-index: 848 !important;
}

.adhesion_wrapper.adhesion_container {
    background: var(--color-content-op) !important;
}

.ppadlist-block .adsbygoogle, .ppadlist-block .adsbygoogle > div[id^="aswift_"], .ppadlist-block .adsbygoogle > div[id^="aswift_"] > iframe {
    max-width: 100% !important;
    margin-left: 0 !important;
}

.pro .ppadlist-block, .pro .ppadlist, .pro .ppadlist-pagewide, .pro.ppadgrid, .ppad-mobile {
    display: none !important;
}

.dismissrail {
    position: fixed; 
    bottom: 35px;
    right: 10px;
    color: var(--color-text-mid);
    text-decoration: none;
    font-size: 16px;
    z-index: 849;
    background: var(--color-content-op);
    border-radius: 50%;
    padding: 2px;
    line-height: 0;
}

.pw-corner-ad-video {
    z-index: 848 !important;
}

/* FEEDBACK */

#feedback_form {
    border: none;
    padding: 10px 0;
}

#feedback_form > p {
    font-size: 14px;
    color: #f35555;
}

#feedback_form > p > strong {
    font-size: 16px;
    color: #189186;
}

#feedback_type, #report_reason, .removal-reason {
    display: block;
    width: 100%;
    padding: 10px;
    border-radius: var(--border-radius-md);
    border: none;
    margin: 10px 0 20px;
    background: var(--color-base);
    color: var(--color-text);
}

#feedback_text, #report_details, .removal-details {
    width: 100% !important;
    resize: vertical;
    min-height: 150px;
}

/* REWARDS */
#reward_popup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-content-op);
    z-index: 999999;
}

#reward_popup #reward_content {
    position: absolute;
    top: 50%;
    left: 50%;
    height: 0;
    width: 0;
    max-height: 90%;
    max-width: 800px;
    background: var(--color-base);
    border-radius: var(--border-radius-md);
    transform: translate(-50%, -50%);
    padding: 15px;
    box-shadow: 0 0 20px 3px var(--color-accent), inset 0 0 8px var(--color-accent);
    border: 2px solid var(--color-content);
    text-align: center;
    overflow: auto;
    opacity: 0;
}

#reward_popup #reward_content h2 {
    font-size: 32px;
    font-weight: 700;
    text-align: center;
    color: var(--color-primary);
}

#reward_popup .reward-body, #modal_profile_frame .reward-body {
    border: 1px solid var(--color-text-trans);
    border-radius: var(--border-radius-lg);
    margin-bottom: 15px;
    padding: 0 15px 15px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
    background: linear-gradient(0deg, var(--color-content-light), var(--color-content));
    text-align: center;
}

#reward_popup .reward-body p, #modal_profile_frame .reward-body p {
    font-size: 14px;
    margin: 30px 0;
}

#reward_popup .reward-body h3, #modal_profile_frame .reward-body h2 {
    margin-bottom: 30px;
}

#reward_popup .reward-actions button.btn-primary, #modal_profile_frame .reward-actions button.btn-primary {
    border: 1px solid var(--color-primary);
}

#reward_popup_footer button {
    width: 100%;
    font-weight: 700;
    text-transform: uppercase;
}

.frame-reward-preview > img {
    opacity: 0;
}

.equipped .frame-reward-preview > img {
    opacity: 1;
}

/* BLOCKING */
#block_msg_panel {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--color-content);
    text-align: center;
    padding-top: 50px;
}

/* CONTENT REMOVAL NOTICE */
#modal_content_removal_notice h4 {
    font-size: 16px;
    margin-top: 15px;
    margin-bottom: 5px;
    color: var(--color-secondary);
}

#modal_content_removal_notice .modal-body > h4:not(:first-child) {
    border-top: 1px solid var(--color-secondary-mid);
    padding-top: 15px;
}

#modal_content_removal_notice .content-remove-date {
    font-size: 13px;
    color: var(--color-text-op);
    margin-top: 0;
}

#modal_content_removal_notice .content-removal-evidence {
    padding: 0 15px 15px;
    background: var(--color-neutral-trans);
    border-radius: var(--border-radius-md);
    font-size: 13px;
    border: 1px solid var(--color-neutral-mid);
    white-space: pre-line;
}

/* THEME PICKER */

.kp-theme-picker {
    position: fixed;
    bottom: -150px;
    right: 25px;
    z-index: 9999998;
    background: var(--color-content);
    border-radius: var(--border-radius-lg);
    border: 1px solid var(--color-text-trans);
    box-shadow: 0 0 14px rgba(0, 0, 0, 0.1);
    width: 300px;
    height: 100px;
    transition: bottom 0.5s, height 0.5s;
}

.kp-theme-picker.picker-active {
    z-index: 9999999;
}

#profile_appearance_picker {
    right: 35px;
}

.kp-theme-picker.picker-open {
    bottom: 25px;
    height: 500px;
}

#profile_appearance_picker.picker-open {
    bottom: 35px;
    height: 505px;
}

.kp-theme-picker header {
    padding: 10px 15px;
    border-top: 1px solid var(--color-text-trans);
    line-height: 1;
    cursor: pointer;
    height: 37px;
}

.kp-theme-picker > header {
    font-size: 0.813rem;
    border: none;
    cursor: default;
    opacity: 1 !important;
    height: 33px;
    border-radius: var(--border-radius-lg) var(--border-radius-lg) 0 0;
    position: relative;
}

.kp-theme-picker > header:hover {
    background-color: var(--color-content-light);
}

.kp-theme-picker > header > i {
    position: absolute;
    font-size: 1rem;
    color: var(--color-text-mid);
    left: 50%;
    margin-left: -8px;
}

.kp-theme-picker > section {
    height: 37px;
    transition: height 0.15s linear;
    position: relative;
    overflow: hidden;
}

.kp-theme-picker > section.open {
    height: calc(100% - 107px);
}

#profile_appearance_picker > section.open {
    height: calc(100% - 72px);
}

#profile_appearance_picker .kp-theme-content {
    height: 390px;
}

.kp-theme-picker header > span {
    float: right;
    font-size: 1.5rem;
    margin-top: -1px;
    transition: opacity 0.15s;
}

.kp-theme-picker > header > span {
    font-size: 1rem;
    opacity: 0.5;
    cursor: pointer;
}

.kp-theme-picker > header > span:hover {
    opacity: 1;
}

.kp-theme-picker section:not(.open) header:hover {
    opacity: 0.8;
}

.kp-theme-picker .open header {
    cursor: default;
}

.kp-theme-picker .open header > span {
    opacity: 0;
}

.kp-theme-picker > section.open ~ section > header > span {
    rotate: 180deg;
    margin-top: -5px;
}

.kp-theme-picker > section.unsaved header:after {
    content: '*';
}

.kp-theme-picker > section.unsaved .kp-theme-content div[id*="_accessibility_warning"]:empty:after {
    content: '*You have unsaved changes';
    color: var(--color-text-op);
    font-style: italic;
}

.kp-theme-picker > section .kp-theme-content {
    height: 354px;
    overflow: auto;
}

.kp-theme-picker > section .kp-theme-content p {
    padding: 0 15px;
    font-size: 0.813rem;
    font-style: italic;
}

#kp_theme_browse_mode {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
    padding: 3px 15px 15px;
}

#kp_theme_browse_mode button {
    cursor: pointer;
    border: 1px solid var(--color-text-trans);
    border-radius: var(--border-radius-md);
    background: var(--color-content);
    padding: 10px;
    text-align: center;
    font-size: 0.875rem;
    box-shadow: none !important;
    color: var(--color-text);
    position: relative;
}

#kp_theme_browse_mode button > i {
    display: inline-block;
    vertical-align: middle;
    line-height: 0;
    font-size: 1.125rem;
    margin-right: 10px;
    margin-top: -2px;
}

#kp_theme_browse_mode button > span {
    position: absolute;
    top: -3px;
    right: -3px;
    background: var(--color-primary);
    padding: 0 3px;
    font-size: 0.688rem;
    border-radius: 10px;
    color: var(--color-accent-text);
    height: 15px;
    min-width: 15px;
    border: 1px solid var(--color-primary);
    display: none;
}

#kp_theme_browse_mode button > span.zero {
    background: var(--color-content);
    color: var(--color-primary);
}

#kp_theme_browse_mode button.active {
    background: var(--color-base);
    pointer-events: none;
}

#kp_theme_browse_mode button:not(.active):hover {
    background: var(--color-content-light);
}

#kp_theme_search {
    position: relative;
    border-top: 1px solid var(--color-base);
    border-bottom: 1px solid var(--color-base);
}

#kp_theme_search input {
    display: block;
    border: none;
    width: 100%;
    padding: 8px 15px 8px 42px;
    color: var(--color-text);
    font-size: 0.875rem;
    background: transparent;
}

#kp_theme_search i {
    position: absolute;
    top: 4px;
    left: 15px;
    font-size: 1.312rem;
    opacity: 0.5;
}
.theme-thumbs-gallery {
    position: relative;
    padding-bottom: 15px;
}

.theme-thumbs-gallery .ringloader {
    position: absolute;
    top: 20px;
    left: 50%;
    margin-left: -16px;
}

.theme-thumb-wrapper {
    padding: 10px 15px 0;
}

.theme-thumb-wrapper .theme-thumb {
    margin-bottom: 5px;
    cursor: pointer;
    border-radius: var(--border-radius-md);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    position: relative;
    font-size: 0;
    border: 1px solid var(--color-text-trans);
}

.theme-thumb-wrapper .theme-thumb:hover {
    opacity: 0.8;
}

.theme-thumb-wrapper.selected .theme-thumb {
    box-shadow: 0 0 0 1px var(--color-content), 0 0 0 3px var(--color-primary);
}

.theme-thumb-wrapper .theme-info {
    font-size: 0.75rem;
    color: var(--color-text-op);
}

.theme-thumb-wrapper .theme-info strong {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 0.813rem;
    color: var(--color-text);
    padding-right: 25px;
}

.theme-thumb-wrapper .theme-info > a {
    max-width: 70%;
    overflow: hidden;
    white-space: nowrap;
    display: inline-block;
    text-overflow: ellipsis;
    vertical-align: bottom;
    color: var(--color-text-op);
    text-decoration: none;
}

.theme-thumb-wrapper .theme-info > a:hover {
    text-decoration: underline;
}

.theme-thumb-wrapper .theme-info .toggle-menu {
    float: right;
    margin-top: -3px;
}

.theme-thumb-wrapper .theme-info .toggle-menu > ul {
    bottom: 0;
    top: auto;
    margin-bottom: 10px;
    transform: unset;
    right: 20px;
}

#kp_mythemes_gallery .theme-thumb-wrapper .theme-info .toggle-menu > ul {
    margin-bottom: -12px;
}

.theme-thumb-wrapper .theme-info .toggle-menu .menu-trigger {
    font-size: 1.125rem;
}

.theme-usercount {
    float: right;
    font-size: 0.625rem;
    font-weight: 500;
    margin-right: 6px;
}

.theme-usercount i {
    margin-right: 2px;
}

.theme-thumb-wrapper .theme-info .toggle-menu > ul > li > a {
    font-size: 0.875rem;
    padding: 8px 15px 8px 10px;
}

.theme-thumb-wrapper .theme-info .toggle-menu > ul > li > a > i {
    font-size: 0.875rem;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-sidebar {
    position: absolute;
    top: 13px;
    height: 100%;
    width: 20px;
    text-align: center;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-sidebar span:first-child {
    display: inline-block;
    background: var(--color-base);
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 1px solid var(--color-text-trans);
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-sidebar span:nth-child(2) {
    background: var(--gradient-primary);
    width: 10px;
    height: 4px;
    display: inline-block;
    border-radius: 10px;
    margin: 5px 0 8px;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-sidebar em {
    display: inline-block;
    width: 14px;
    height: 2px;
    background: var(--color-text-mid);
    margin: 2px 0 0;
    border-radius: 10px;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-inner {
    background: var(--color-base);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 20px;
    top: 8px;
    border-radius: var(--border-radius-md);
    border: 1px solid var(--color-text-trans);
    padding: 10px 0 0 8px;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-inner > span:first-child {
    width: 30px;
    height: 4px;
    background: var(--color-text);
    display: inline-block;
    border-radius: 10px;
    margin-left: 2px;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-inner > span:last-child {
    position: absolute;
    top: -8px;
    right: 27px;
    background: var(--gradient-primary);
    height: 6px;
    width: 22px;
    border-radius: 10px;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-inner .theme-thumb-patterns > div {
    background: var(--color-content);
    height: 50px;
    width: 29%;
    border-radius: var(--border-radius-sm);
    border: 1px solid var(--color-text-trans);
    padding: 4px;
    display: inline-block;
    margin: 7px 1% 0;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-inner .theme-thumb-patterns > div > span {
    display: block;
    height: 20px;
    background: var(--color-primary);
    border-radius: 3px;
    margin-bottom: 2px;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-inner .theme-thumb-patterns > div > em {
    display: inline-block;
    width: 16px;
    height: 2px;
    background: var(--color-text-op);
    border-radius: 10px;
    margin-top: 2px;
}

.theme-thumb-wrapper .theme-thumb .theme-thumb-inner .theme-thumb-patterns > div > em:last-child {
    width: 10px;
    height: 1px;
    background: var(--color-text-mid);
}

.kp-theme-customize .theme-customize-block {
    font-size: 0;
    color: var(--color-text);
    margin: 10px 15px;
}

.kp-theme-customize .theme-customize-block .theme-customize-picker {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    border: 1px solid var(--color-content);
    box-shadow: 0 0 0 1px var(--color-text-trans);
}

.kp-theme-customize .theme-customize-block .theme-customize-section {
    font-size: 0.875rem;
    color: var(--color-text);
    display: inline-block;
    vertical-align: middle;
    margin-left: 15px;
}

.kp-theme-customize .theme-customize-block .theme-customize-hex {
    font-size: 0.875rem;
    width: 110px;
    text-align: center;
    background: var(--color-base);
    border: 1px solid var(--color-content);
    box-shadow: 0 0 0 1px var(--color-text-trans);
    border-radius: var(--border-radius-sm);
    padding: 5px;
    float: right;
    margin-top: 5px;
    color: var(--color-text);
}

.save-custom-theme {
    display: block;
    margin: 40px auto 0;
    width: 268px;
}

#theme_accessibility_warning, #profilepage_accessibility_warning, #profilecard_accessibility_warning {
    font-size: 0.813rem;
    position: absolute;
    width: 100%;
    padding: 0 10px;
    text-align: center;
    color: #e35656;
}

/* SUPERBG */

.superbg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 0;
    background: #1b2027;
}

.superbg .superbg-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.superbg .orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    opacity: 0.5;
    animation: drift 20s infinite alternate ease-in-out;
    mix-blend-mode: screen; 
}

.superbg .orb-1 {
    width: 900px;
    height: 900px;
    background: linear-gradient(135deg, #189186 0%, #0d4d47 100%);
    top: -200px;
    left: -300px;
    animation-duration: 35s;
}

.superbg .orb-2 {
    width: 800px;
    height: 800px;
    background: linear-gradient(135deg, #935cc5 0%, #5d3a7d 100%);
    bottom: -200px;
    right: -200px;
    animation-duration: 38s;
    animation-delay: -10s;
}

.superbg .orb-3 {
    width: 600px;
    height: 600px;
    background: linear-gradient(135deg, #189186 0%, #935cc5 100%);
    top: 50%;
    left: 50%;
    margin-left: -300px;
    margin-top: -300px;
    transform: translate(-50%, -50%);
    animation-duration: 32s;
    animation-delay: -15s;
    opacity: 0.4;
}

.superbg .dot-matrix {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2;
    pointer-events: none;
    background-image: radial-gradient(rgba(255, 255, 255, 0.1) 4px, transparent 4px);
    background-size: 20px 20px;
    opacity: 0.6;
    -webkit-mask-image: linear-gradient(
        120deg, 
        rgba(0,0,0,0) 0%, 
        rgba(0,0,0,1) 25%, 
        rgba(0,0,0,0) 50%, 
        rgba(0,0,0,1) 75%, 
        rgba(0,0,0,0) 100%
    );
    mask-image: linear-gradient(
        120deg, 
        rgba(0,0,0,0) 0%, 
        rgba(0,0,0,1) 25%, 
        rgba(0,0,0,0) 50%, 
        rgba(0,0,0,1) 75%, 
        rgba(0,0,0,0) 100%
    );
    -webkit-mask-size: 200% 200%;
    mask-size: 200% 200%;
    animation: waveOpacity 5s linear infinite;
    mix-blend-mode: overlay;
}

.primary-superbg {
    background: transparent;
    position: fixed;
}

.primary-superbg .dot-matrix {
    background-image: radial-gradient(var(--color-content-light) 2px, transparent 2px);
    animation: none;
    background-size: 6px 6px;
    mask-image: none;
}

/* PWA */

#pwa_trigger {
    position: relative;
    width: 100%;
    background: var(--color-content);
    padding: 15px 15px 12px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    margin-top: -158px;
    margin-bottom: 30px;
    display: none;
}

.gallery #pwa_trigger, .home:not(.logged) #pwa_trigger {
    border-bottom: 1px solid var(--color-neutral-mid);
    box-shadow: none;
}

#pwa_trigger.notrigger {
    display: none !important;
}

#pwa_trigger img {
    padding: 10px;
    width: 50px;
    height: 50px;
    background: rgba(255, 255, 255, 0.9);
    border-radius: var(--border-radius-md);
    box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.2);
    float: left;
    margin-right: 15px;
}

#pwa_trigger_title {
    font-size: 14px;
    padding: 5px 0;
}

#pwa_trigger_title strong {
    font-size: 16px;
}

#pwa_trigger #get_app_btn {
    display: block;
    margin-top: 10px;
    text-align: center;
    padding: 10px 10px 6px;
    font-size: 14px;
    font-weight: 600;
    text-transform: uppercase;
    border-radius: var(--border-radius-md);
}

#pwa_install_close {
    position: absolute;
    top: 15px;
    right: 15px;
    color: var(--color-text-mid);
}

.pwa-trigger-btn {
    display: none;
}

.pwa-trigger-btn .get-app-btn {
    width: 100%;
    background: transparent;
    border: none;
    border-radius: var(--border-radius-md);
    text-align: left;
    padding: 5px;
    cursor: pointer;
    margin: -5px 0;
}

.pwa-trigger-btn .get-app-btn img {
    width: 48px;
    height: 48px;
    padding: 10px;
    border-radius: var(--border-radius-md);
    background: rgba(255, 255, 255, 0.9);
    box-shadow: 1px 2px 5px rgba(0, 0, 0, 0.2);
    display: inline-block;
    vertical-align: middle;
}

.pwa-trigger-btn .get-app-btn span {
    display: inline-block;
    vertical-align: middle;
    padding-left: 15px;
    font-weight: 600;
    font-size: 14px;
    color: var(--color-primary);
}

.pwa-trigger-btn .get-app-btn:hover {
    background: var(--color-primary);
}

.pwa-trigger-btn .get-app-btn:hover span {
    color: #fff;
}

@keyframes load {
    0%   { background-position: 0 0; }
    100% { background-position: 40px 40px; }
}

@keyframes drift {
    0% { transform: translate(0, 0) scale(1); }
    33% { transform: translate(30%, -50%) scale(1.1); }
    66% { transform: translate(-20%, 20%) scale(0.9); }
    100% { transform: translate(0, 0) scale(1); }
}

@keyframes waveOpacity {
    0% {
        -webkit-mask-position: 0% 0%;
        mask-position: 0% 0%;
    }
    100% {
        -webkit-mask-position: 100% 100%;
        mask-position: 100% 100%;
    }
}


@keyframes float-bob {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-15px);
    }
}

@keyframes float-shadow {
    0%, 100% {
        opacity: 0.4;
        transform: scale(0.9) translateY(0);
        filter: blur(4px);
    }
    50% {
        opacity: 0.15;
        transform: scale(1.15) translateY(15px); 
        filter: blur(8px);
    }
}