← Back to Layouts
Pretty Little Haunting - Halloween Layout

Name: FriendRewind
Author: FriendRewind
Author: Kayla⟡
Category: Holiday
Created: September 14, 2026
Halloween.
Comments (0)

No comments yet. Be the first!
You must log in to comment.
CSS Code

<style id="fr-vb2">
/* VB2_STATE:{"cursorUrl":"","overlayUrl":"","overlayOpacity":0.2,"avatarAnimation":"","pageFont":"","useLiveProfile":true,"previewUrl":"/profile?id=4","pageBgImage":"","pageBgMode":"cover","heroImageUrl":"","profileRowBgImage":"","profileRowBgMode":"cover","navBgColor":"#2b333f","navBgImage":"","navBgMode":"cover","navLinkColor":"#ffffff","navLinkHover":"#66aaff","boxBgColor":"#ffffff","boxOpacity":1,"boxRadius":8,"contactHeaderBg":"#4169E1","contactHeaderText":"#ffffff","contactContentBg":"#ffffff","contactBorderColor":"#4169E1","contactBorderWidth":1,"contactBorderRadius":5,"contactBoxAnimation":"","interestsHeaderBg":"#DAA520","interestsHeaderText":"#ffffff","interestsContentBg":"#ffffff","interestsBorderColor":"#DAA520","interestsBorderWidth":1,"interestsBorderRadius":5,"contentBoxAnimation":"","textBody":"#000000","textHeading":"#000000","textLink":"#0066cc","headingShadowColor":"#000000","headingShadowBlur":2,"headingShadowEnable":false,"moduleImages":{"contact":"","urlInfo":"","tableSection":"","tunes":"","blogPreview":"","blurbs":"","friends":"","Comments Background":"","comments":""}} */
/* Generated by FriendRewind.com Visual Builder */
</style><style>


/* FR_MANUAL_EXTRAS */
</style>
<style>
@import url('https://fonts.googleapis.com/css2?family=Cherry+Bomb+One&family=Emilys+Candy&family=Nunito:wght@500;600;700;800&display=swap');

:root {
  --lavender-pale: #eee6fb;
  --lavender-milk: #dfd1f1;
  --lavender: #c6b4e1;
  --lavender-mid: #aa94c5;
  --lavender-deep: #8a739e;
  --bat-dark: #4d4452;
  --bat-mid: #625667;
  --bat-soft: #817384;
  --text: #625364;
  --text-soft: #7a6878;
  --border: #c7add0;
  --shadow: rgba(77,61,81,.14);

  --page-bg: url("https://64.media.tumblr.com/e84288de00b68a3126626de1f3047a81/tumblr_odpno6D5Lt1sjam19o7_400.pnj");
  --bats: url("https://64.media.tumblr.com/3fae5083dce93a53041b8aa777aa1168/tumblr_pfbqcq4zq31uwdbpvo5_1280.jpg");
  --sparkles: url("https://64.media.tumblr.com/4b01a2cb1602c6ddc1eafea1d129e857/tumblr_owrb6tF8jQ1ueqj0eo1_r1_400.pnj");
}

html,
body {
  background-color: #eadcf5 !important;
}

body.profile-page,
body {
  background-image: var(--page-bg) !important;
  background-repeat: repeat !important;
  background-position: top left !important;
  background-attachment: fixed !important;
  color: var(--text) !important;
  font-family: "Nunito", Arial, sans-serif !important;
}

body.profile-page .master-container,
body.profile-page main,
body.profile-page .row.profile {
  background: transparent !important;
}

body.profile-page nav {
  border: 0 !important;
  box-shadow: none !important;
}

body.profile-page nav .top {
  position: relative !important;
  min-height: 86px !important;
  background: linear-gradient(
    rgba(184,163,204,.94),
    rgba(161,139,184,.95)
  ) !important;
  border-top: 3px solid #d7c5eb !important;
  border-bottom: 3px solid #c3add5 !important;
  box-shadow: 0 3px 8px rgba(73,59,76,.12) !important;
  overflow: hidden !important;
}

body.profile-page nav .top::after {
  content: "₊˚⊹  🦇  ♡  💀  ♡  🎃  ⊹˚₊";
  position: absolute !important;
  right: 23px !important;
  bottom: 7px !important;
  color: rgba(255,255,255,.48) !important;
  font-size: 10px !important;
  letter-spacing: 5px !important;
  pointer-events: none !important;
}

body.profile-page nav .top .left {
  display: flex !important;
  position: absolute !important;
  left: 18px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 190px !important;
  height: 52px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 55 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.profile-page nav .top .left img,
body.profile-page nav .top .left .logo,
body.profile-page nav .top .left [class*="logo"] {
  display: none !important;
}

body.profile-page nav .top .left::before {
  content: "FriendRewind" !important;
  display: block !important;
  padding: 7px 13px 8px !important;
  color: #67566f !important;
  background: rgba(232,220,246,.78) !important;
  border: 1px solid rgba(117,93,130,.30) !important;
  border-radius: 15px !important;
  box-shadow:
    0 2px 6px rgba(66,51,72,.12),
    inset 0 1px rgba(255,255,255,.55) !important;
  font-family: "Emilys Candy", cursive !important;
  font-size: 27px !important;
  line-height: 1 !important;
  letter-spacing: .4px !important;
  text-shadow:
    1px 1px 0 rgba(255,248,255,.85),
    -1px -1px 0 rgba(255,255,255,.55) !important;
  white-space: nowrap !important;
}

body.profile-page nav .top .center {
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  transform: translate(-50%,-50%) !important;
  width: 325px !important;
  margin: 0 !important;
  padding: 0 !important;
  z-index: 50 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body.profile-page nav .top .center *,
body.profile-page nav .search-form,
body.profile-page nav form[action*="search"] {
  visibility: visible !important;
  opacity: 1 !important;
}

body.profile-page nav .top .center form,
body.profile-page nav .search-form,
body.profile-page nav form[action*="search"] {
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  width: 325px !important;
  margin: 0 auto !important;
  padding: 0 !important;
}

body.profile-page nav .top .center form::before,
body.profile-page nav .search-form::before,
body.profile-page nav form[action*="search"]::before {
  content: "🕯️";
  position: absolute !important;
  left: 12px !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  z-index: 60 !important;
  font-size: 15px !important;
  pointer-events: none !important;
}

body.profile-page nav .top input[type="text"],
body.profile-page nav .top input[type="search"],
body.profile-page nav .search-input {
  box-sizing: border-box !important;
  width: 250px !important;
  height: 34px !important;
  padding: 5px 12px 5px 37px !important;
  background: var(--bat-dark) !important;
  border: 2px solid #77687f !important;
  border-right: 0 !important;
  border-radius: 18px 0 0 18px !important;
  color: #fff8ff !important;
  caret-color: #fff8ff !important;
  font-family: "Nunito", Arial, sans-serif !important;
  font-size: 12px !important;
  outline: none !important;
  box-shadow:
    inset 0 1px 4px rgba(0,0,0,.16),
    0 2px 5px rgba(61,49,64,.12) !important;
}

body.profile-page nav .top input::placeholder {
  color: #e8dff0 !important;
}

body.profile-page nav .top input[type="submit"],
body.profile-page nav .top button,
body.profile-page nav .search-button {
  box-sizing: border-box !important;
  height: 34px !important;
  padding: 4px 15px !important;
  background: var(--bat-mid) !important;
  border: 2px solid #77687f !important;
  border-left: 0 !important;
  border-radius: 0 18px 18px 0 !important;
  color: #fff9ff !important;
  font-family: "Nunito", Arial, sans-serif !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  text-shadow: none !important;
  cursor: pointer !important;
}

body.profile-page nav .top input[type="submit"]:hover,
body.profile-page nav .top button:hover {
  background: #75647a !important;
}

body.profile-page nav .links {
  background: #756479 !important;
  border: 0 !important;
  border-bottom: 3px solid #baa4d0 !important;
  box-shadow: inset 0 1px rgba(255,255,255,.14) !important;
}

body.profile-page nav .links a {
  color: #fff9ff !important;
  font-family: "Nunito", Arial, sans-serif !important;
  font-weight: 700 !important;
  text-shadow: none !important;
  border: 0 !important;
}

body.profile-page nav .links a:hover {
  color: #625266 !important;
  background: #dacced !important;
  border-radius: 8px !important;
}

body.profile-page .row.profile {
  margin-top: 12px !important;
  padding-top: 0 !important;
}

body.profile-page main,
body.profile-page .master-container {
  padding-top: 0 !important;
}

body.profile-page .col.w-40.left,
body.profile-page .col.w-60.right {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

body.profile-page span[itemprop="name"] {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
}

body.profile-page span[itemprop="name"] h1,
body.profile-page .profile h1 {
  display: block !important;
  width: fit-content !important;
  min-width: 265px !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 auto 15px auto !important;
  padding: 14px 25px 13px !important;
  background-image:
    linear-gradient(
      rgba(215,200,231,.42),
      rgba(215,200,231,.42)
    ),
    var(--sparkles) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border: 1px solid #baa2d1 !important;
  border-radius: 19px !important;
  box-shadow:
    0 4px 8px rgba(78,61,81,.14),
    inset 0 1px rgba(255,255,255,.50) !important;
  font-family: "Emilys Candy", cursive !important;
  font-size: 42px !important;
  font-weight: normal !important;
  letter-spacing: 1px !important;
  line-height: 1 !important;
  text-align: center !important;
  color: #615269 !important;
  text-shadow:
    2px 2px 0 rgba(255,245,252,.92),
    -1px -1px 0 rgba(255,255,255,.80),
    0 0 5px rgba(255,255,255,.35) !important;
}

body.profile-page .general-about {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  text-align: center !important;
}

body.profile-page .profile-pic {
  display: block !important;
  float: none !important;
  position: relative !important;
  width: 190px !important;
  margin: 0 auto 9px auto !important;
  text-align: center !important;
  overflow: visible !important;
}

body.profile-page .profile-pic::before,
body.profile-page .profile-pic::after {
  content: "" !important;
  position: absolute !important;
  top: 50% !important;
  width: 54px !important;
  height: 54px !important;
  background-image: url("https://graphic.neocities.org/tumblr_lth329SeAR1qip80b.gif") !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-size: contain !important;
  image-rendering: auto !important;
  z-index: 3 !important;
  pointer-events: none !important;
}

/* LEFT LAMP — mirrored */
body.profile-page .profile-pic::before {
  left: -62px !important;
  transform: translateY(-50%) scaleX(-1) !important;
}

/* RIGHT LAMP — original direction */
body.profile-page .profile-pic::after {
  right: -62px !important;
  transform: translateY(-50%) scaleX(1) !important;
}

body.profile-page .profile-pic::before {
  left: -62px !important;
}

body.profile-page .profile-pic::after {
  right: -62px !important;
}

body.profile-page .profile-pic img {
  display: block !important;
  position: relative !important;
  z-index: 2 !important;
  width: 190px !important;
  height: 190px !important;
  max-width: none !important;
  margin: 0 auto !important;
  object-fit: cover !important;
  border: 3px solid #bca6cd !important;
  border-radius: 16px !important;
  box-shadow:
    3px 3px 0 #dacced,
    0 4px 8px rgba(78,61,81,.11) !important;
}

body.profile-page .general-about .details {
  display: block !important;
  width: 88% !important;
  max-width: 285px !important;
  box-sizing: border-box !important;
  margin: 7px auto 10px auto !important;
  padding: 12px 14px 11px !important;
  text-align: center !important;
  background-image:
    linear-gradient(
      rgba(251,246,251,.85),
      rgba(239,231,242,.86)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border: 1px solid #bea5ca !important;
  border-radius: 16px !important;
  box-shadow: 0 3px 7px rgba(74,59,77,.11) !important;
  color: var(--text) !important;
}

body.profile-page .general-about .details p {
  display: block !important;
  margin: 3px auto 5px auto !important;
  padding: 0 !important;
  text-align: center !important;
  line-height: 1.35 !important;
}

body.profile-page .general-about .details p:first-child {
  color: #655568 !important;
  font-weight: 700 !important;
}

body.profile-page .general-about .details p:nth-child(2) {
  color: #665766 !important;
  font-size: 13px !important;
}

body.profile-page .online img,
body.profile-page img[alt*="Online"],
body.profile-page img[title*="Online"] {
  display: none !important;
}

body.profile-page .online {
  display: block !important;
  width: fit-content !important;
  margin: 6px auto 0 auto !important;
  padding: 3px 8px !important;
  background: rgba(255,255,255,.55) !important;
  border-radius: 13px !important;
  color: #69596d !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-align: center !important;
}

body.profile-page .online::before {
  content: "🦇 " !important;
}

body.profile-page .online::after {
  content: " ♡" !important;
  color: #9c789a !important;
}

body.profile-page .mood,
body.profile-page .profile .mood,
body.profile-page .col.w-40.left .mood,
body.profile-page .col.w-40.left > p:has(> b:first-child),
body.profile-page .col.w-40.left > div:has(> b:first-child) {
  display: block !important;
  width: fit-content !important;
  min-width: 145px !important;
  max-width: 90% !important;
  box-sizing: border-box !important;
  float: none !important;
  clear: both !important;
  position: relative !important;
  left: auto !important;
  right: auto !important;
  margin: 10px auto 11px auto !important;
  padding: 6px 15px !important;
  text-align: center !important;
  background:
    linear-gradient(
      90deg,
      rgba(239,211,229,.97),
      rgba(221,199,235,.97)
    ) !important;
  border: 1px solid #c39fbd !important;
  border-radius: 20px !important;
  box-shadow:
    0 2px 6px rgba(77,61,80,.11),
    inset 0 1px rgba(255,255,255,.66) !important;
  color: #654f64 !important;
  font-family: "Nunito", Arial, sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
}

body.profile-page .mood b,
body.profile-page .profile .mood b,
body.profile-page .col.w-40.left > p:has(> b:first-child) > b {
  display: inline !important;
  margin: 0 3px 0 0 !important;
  padding: 0 !important;
}

body.profile-page .view-my,
body.profile-page .profile .view-my,
body.profile-page .col.w-40.left > p:has(> a[href*="blog"]),
body.profile-page .col.w-40.left > div:has(> a[href*="blog"]) {
  box-sizing: border-box !important;
  width: 100% !important;
  margin-top: 5px !important;
  margin-bottom: 12px !important;
  padding: 8px 11px !important;
  text-align: center !important;
  background: linear-gradient(
    rgba(225,212,238,.90),
    rgba(216,201,231,.90)
  ) !important;
  border: 1px solid #baa0ca !important;
  border-radius: 17px !important;
  box-shadow: 0 2px 5px rgba(77,61,80,.08) !important;
  color: #625363 !important;
  font-weight: 800 !important;
}

body.profile-page .view-my a {
  color: #655469 !important;
  text-shadow: none !important;
}

body.profile-page .url-info,
body.profile-page .url,
body.profile-page .profile-info,
body.profile-page [href*="profile.edit"],
body.profile-page [href*="edit-profile"],
body.profile-page [href*="edit_profile"] {
  display: none !important;
}

body.profile-page .contact,
body.profile-page .table-section,
body.profile-page .blurbs,
body.profile-page .friends,
body.profile-page #comments {
  border: 1px solid #bea5ca !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  box-shadow: 0 3px 8px rgba(76,60,79,.11) !important;
}

body.profile-page .heading {
  min-height: 24px !important;
  padding: 6px 10px !important;
  background: linear-gradient(
    90deg,
    #d3c1e3,
    #c9b5dc
  ) !important;
  border: 0 !important;
}

body.profile-page .heading h1,
body.profile-page .heading h2,
body.profile-page .heading h3,
body.profile-page .heading h4 {
  color: #625367 !important;
  font-family: "Cherry Bomb One", cursive !important;
  font-weight: normal !important;
  text-shadow: none !important;
}

body.profile-page .heading a {
  color: #665568 !important;
}

body.profile-page .contact {
  background-image:
    linear-gradient(
      rgba(247,239,249,.78),
      rgba(234,223,239,.80)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

body.profile-page .contact .heading {
  background-image:
    linear-gradient(
      rgba(205,189,224,.82),
      rgba(192,174,211,.84)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

body.profile-page .contact .heading h4 {
  font-size: 0 !important;
}

body.profile-page .contact .heading h4::before {
  content: "🐈‍⬛ summon me";
  font-family: "Cherry Bomb One", cursive !important;
  font-size: 16px !important;
  color: #5f5063 !important;
}

body.profile-page .contact .inner,
body.profile-page .contact .f-row,
body.profile-page .contact .f-col {
  background: transparent !important;
  background-color: transparent !important;
}

body.profile-page .contact img {
  display: none !important;
}

body.profile-page .contact a::before {
  display: inline-block !important;
  width: 24px !important;
  margin-right: 4px !important;
  text-align: center !important;
  font-size: 14px !important;
  content: "" !important;
}

body.profile-page .contact .f-row:nth-of-type(1) .f-col:nth-of-type(1) a::before {
  content: "🎃" !important;
}

body.profile-page .contact .f-row:nth-of-type(1) .f-col:nth-of-type(2) a::before {
  content: "💀" !important;
}

body.profile-page .contact .f-row:nth-of-type(2) .f-col:nth-of-type(1) a::before {
  content: "👻" !important;
}

body.profile-page .contact .f-row:nth-of-type(2) .f-col:nth-of-type(2) a::before {
  content: "💌" !important;
}

body.profile-page .contact .f-row:nth-of-type(3) .f-col:nth-of-type(1) a::before {
  content: "🦇" !important;
}

body.profile-page .contact .f-row:nth-of-type(3) .f-col:nth-of-type(2) a::before {
  content: "☠️" !important;
}

body.profile-page .contact a {
  display: inline-flex !important;
  align-items: center !important;
  color: #65556a !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

body.profile-page .table-section {
  background-image:
    linear-gradient(
      rgba(250,246,250,.88),
      rgba(236,228,241,.89)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

body.profile-page .table-section .heading {
  background-image:
    linear-gradient(
      rgba(204,187,222,.84),
      rgba(190,172,208,.85)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

body.profile-page .table-section .heading h4 {
  font-size: 0 !important;
}

body.profile-page .table-section .heading h4::before {
  content: "🕯️ cabinet of curiosities";
  font-family: "Cherry Bomb One", cursive !important;
  font-size: 16px !important;
  color: #5f5063 !important;
}

body.profile-page .details-table td:first-child {
  background: rgba(221,211,233,.75) !important;
  color: #665568 !important;
  font-weight: 800 !important;
}

body.profile-page .details-table td {
  border-color: rgba(163,141,174,.18) !important;
}

body.profile-page .blurbs {
  background-image:
    linear-gradient(
      rgba(250,246,250,.90),
      rgba(238,230,242,.91)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

body.profile-page .blurbs .heading {
  background-image:
    linear-gradient(
      rgba(204,188,222,.85),
      rgba(190,173,210,.86)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center !important;
}

body.profile-page .blurbs .heading h4 {
  font-size: 0 !important;
}

body.profile-page .blurbs .heading h4::before {
  content: "🔮 my lore";
  font-family: "Cherry Bomb One", cursive !important;
  font-size: 16px !important;
  color: #5f5063 !important;
}

body.profile-page .blurbs .inner h4,
body.profile-page .blurbs .inner h3,
body.profile-page .blurbs .inner strong:first-child {
  display: none !important;
}

body.profile-page .blog-preview {
  position: relative !important;
  min-height: 230px !important;
  padding: 14px !important;
  background-image:
    linear-gradient(
      rgba(224,214,231,.56),
      rgba(224,214,231,.56)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  border: 1px solid #bca4c7 !important;
  border-radius: 15px !important;
  overflow: hidden !important;
  box-shadow: 0 4px 9px rgba(73,58,76,.12) !important;
}

body.profile-page .blog-preview > * {
  position: relative !important;
  z-index: 2 !important;
}

body.profile-page .blog-preview > h4:first-child {
  display: inline-block !important;
  margin: 0 0 8px 0 !important;
  padding: 5px 11px !important;
  background: rgba(255,250,250,.84) !important;
  border: 1px solid rgba(183,161,195,.40) !important;
  border-radius: 13px !important;
  color: #635467 !important;
  font-size: 0 !important;
}

body.profile-page .blog-preview > h4:first-child::before {
  content: "🕯️ read my blog";
  font-family: "Cherry Bomb One", cursive !important;
  font-size: 17px !important;
  color: #625366 !important;
}

body.profile-page .blog-preview p,
body.profile-page .blog-preview em {
  display: inline-block !important;
  padding: 4px 9px !important;
  background: rgba(255,250,250,.76) !important;
  border-radius: 11px !important;
  color: #625464 !important;
}

body.profile-page .blog-preview::before,
body.profile-page .blog-preview::after {
  content: none !important;
  display: none !important;
}

body.profile-page .friends {
  position: relative !important;
  background-image:
    linear-gradient(
      rgba(250,246,250,.78),
      rgba(239,231,242,.80)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

body.profile-page .friends .heading {
  background-image:
    linear-gradient(
      rgba(202,185,220,.84),
      rgba(187,170,206,.86)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
}

body.profile-page .friends .heading h4 {
  font-size: 0 !important;
}

body.profile-page .friends .heading h4::before {
  content: "🦇 hauntings";
  font-family: "Cherry Bomb One", cursive !important;
  font-size: 16px !important;
  color: #5e5062 !important;
}

body.profile-page .friends .count,
body.profile-page .friends .inner > p:first-child {
  display: none !important;
}

body.profile-page .friends-grid img {
  border: 2px solid #b49bc4 !important;
  border-radius: 11px !important;
  box-shadow:
    2px 2px 0 #d5c6e3,
    0 3px 6px rgba(72,58,75,.08) !important;
}

body.profile-page .friends-grid img:hover {
  transform: translateY(-2px) !important;
}

body.profile-page .friends::after {
  content: "♡  🦇  ♡  🎃  ♡  💀  ♡";
  display: block !important;
  padding: 5px 0 7px !important;
  text-align: center !important;
  color: #826b84 !important;
  font-size: 11px !important;
}

body.profile-page #comments {
  background-image:
    linear-gradient(
      rgba(250,246,250,.86),
      rgba(237,229,241,.87)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}

body.profile-page #comments .heading {
  background-image:
    linear-gradient(
      rgba(202,185,220,.85),
      rgba(187,170,206,.86)
    ),
    var(--bats) !important;
  background-size: cover !important;
  background-position: center center !important;
}

body.profile-page #comments .heading h4 {
  font-size: 0 !important;
}

body.profile-page #comments .heading h4::before {
  content: "👻 messages from the dead";
  font-family: "Cherry Bomb One", cursive !important;
  font-size: 16px !important;
  color: #5f5063 !important;
}

body.profile-page .comments-table {
  border-color: #bca4c7 !important;
}

body.profile-page .comments-table td:first-child {
  background: rgba(223,211,233,.72) !important;
}

body.profile-page .comments-table td {
  border-color: rgba(161,140,173,.20) !important;
}

body.profile-page .heading a[href*="view"],
body.profile-page .heading a[href*="friend"] {
  padding: 2px 7px !important;
  background: rgba(255,255,255,.48) !important;
  border: 1px solid rgba(151,131,161,.24) !important;
  border-radius: 11px !important;
  color: #655568 !important;
  font-size: 11px !important;
}

body.profile-page .row.profile a {
  color: #67566b !important;
  text-decoration: none !important;
}

body.profile-page .row.profile a:hover {
  color: #8a7090 !important;
}

body.profile-page small,
body.profile-page .caption,
body.profile-page .date {
  color: #7d6b7b !important;
}

body.profile-page .music-bar,
.music-bar {
  background: transparent !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: none !important;
  box-shadow: none !important;
}

body.profile-page .music-bar::before,
.music-bar::before {
  display: none !important;
}

body.profile-page::-webkit-scrollbar {
  width: 12px !important;
}

body.profile-page::-webkit-scrollbar-track {
  background: #ece2f5 !important;
}

body.profile-page::-webkit-scrollbar-thumb {
  background: #a48bb5 !important;
  border: 3px solid #ece2f5 !important;
  border-radius: 20px !important;
}

html {
  scrollbar-color: #a48bb5 #ece2f5 !important;
}

@media (max-width: 720px) {
  body.profile-page nav .top {
    min-height: 120px !important;
  }

  body.profile-page nav .top .left {
    left: 50% !important;
    top: 25px !important;
    transform: translateX(-50%) !important;
    justify-content: center !important;
    width: 210px !important;
  }

  body.profile-page nav .top .left::before {
    font-size: 23px !important;
    padding: 6px 11px 7px !important;
  }

  body.profile-page nav .top .center {
    left: 50% !important;
    top: 82px !important;
    transform: translateX(-50%) !important;
    width: 290px !important;
  }

  body.profile-page nav .top .center form,
  body.profile-page nav .search-form,
  body.profile-page nav form[action*="search"] {
    width: 290px !important;
  }

  body.profile-page nav .top input[type="text"],
  body.profile-page nav .top input[type="search"],
  body.profile-page nav .search-input {
    width: 210px !important;
  }

  body.profile-page .row.profile {
    margin-top: 8px !important;
  }

  body.profile-page span[itemprop="name"] h1,
  body.profile-page .profile h1 {
    min-width: 220px !important;
    font-size: 36px !important;
    padding: 12px 20px !important;
  }

  body.profile-page .profile-pic,
  body.profile-page .profile-pic img {
    width: 175px !important;
  }

  body.profile-page .profile-pic img {
    height: 175px !important;
  }

  body.profile-page .profile-pic::before,
  body.profile-page .profile-pic::after {
    width: 38px !important;
    height: 38px !important;
  }

  body.profile-page .profile-pic::before {
    left: -48px !important;
  }

  body.profile-page .profile-pic::after {
    right: -48px !important;
  }

  body.profile-page .general-about .details {
    width: 92% !important;
  }

  body.profile-page .mood,
  body.profile-page .profile .mood,
  body.profile-page .col.w-40.left .mood,
  body.profile-page .col.w-40.left > p:has(> b:first-child),
  body.profile-page .col.w-40.left > div:has(> b:first-child) {
    margin-left: auto !important;
    margin-right: auto !important;
  }
}
</style>