← Back to Layouts
Alice in Wonderland BETA

Name: FriendRewind
Author: FriendRewind
Author: Profile Test
Category: General
Created: October 14, 2026
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=Cinzel:wght@500;700&family=Spectral:ital,wght@0,400;0,500;1,400&display=swap');

:root {
  --alice-red: #b30000;
  --alice-bright-red: #e60000;
  --alice-black: #080505;
  --alice-charcoal: #140d0d;
  --alice-panel: rgba(18, 12, 12, 0.97);
  --alice-white: #f7f4f4;
  --alice-border: #4a1212;
}

body {
  overflow-y: scroll !important;
  background: linear-gradient(rgba(8, 5, 5, 0.7), rgba(8, 5, 5, 0.85)), url("https://i.pinimg.com/736x/52/90/d0/5290d0f0fe48a596d7bd58b31faf4484.jpg") !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
  background-attachment: fixed !important;
  font-family: 'Spectral', serif;
  color: var(--alice-white);
  font-size: 19px;
}

.master-container {
  max-width: 920px !important;
  width: 100% !important;
  margin: 0 auto !important;
  box-sizing: border-box !important;
  padding: 0 15px !important;
  position: relative !important;
}

.master-container::before {
  display: none !important;
}

main {
  background: var(--alice-panel) !important;
  border-radius: 8px;
  overflow: hidden;
  padding: 0 !important;
  border: 2px solid var(--alice-red);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.95), inset 0 0 30px rgba(179, 0, 0, 0.1);
  margin-top: 0 !important;
}
  
main:before {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 180px !important;
  background: url("https://i.ibb.co/ycYF7hbw/20cvfwfa-Fq-Nbe9-Fc3-VEHJu-PRxmn-682x1024.jpg") !important;
  background-size: cover !important;
  background-position: center 30% !important;
  background-repeat: no-repeat !important;
  border-bottom: 2px solid var(--alice-red) !important;
  box-sizing: border-box !important;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.6) !important;
}

.profile,
.profile p,
.profile td,
.profile li,
.profile span,
.profile a,
.profile button,
.profile input,
.profile textarea {
  font-size: 1.05em !important;
  font-family: 'Spectral', serif !important;
}

.profile { 
  background: rgba(20, 14, 14, 0.9); 
  color: var(--alice-white); 
  display: flex !important;
  align-items: stretch !important;
  padding: 15px;
}

.myspace-header, 
nav, 
.navbar {
  border-top: none !important;
  border-bottom: 2px solid var(--alice-red) !important;
  box-shadow: 0 5px 25px rgba(0, 0, 0, 0.8) !important;
  background: var(--alice-black) !important; 
  height: auto !important;
  min-height: 0 !important;
  display: block !important;
}

.myspace-header .top-nav {
  background: transparent !important;
  border-bottom: 1px solid var(--alice-border) !important;
  border-top: none !important;
  box-shadow: none !important;
  padding: 10px 15px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  height: auto !important;
}

.myspace-header .top-nav .left,
.myspace-header .top-nav .right {
  display: flex !important;
  align-items: center !important;
}

.myspace-header a.site-name,
.myspace-header a.site-logo-link,
.myspace-header .logo {
  display: inline-block !important;
  width: 260px !important;
  height: 45px !important;
  min-width: 260px !important;
  min-height: 45px !important;
  max-width: 260px !important;
  max-height: 45px !important;
  flex: 0 0 260px !important;
  position: relative !important;
  background: url("https://i.ibb.co/23TVnZnM/Alice-In-Wonderland-Logo-PNG-Free-Download.png") no-repeat center left / contain !important;
}

.myspace-header a.site-name img,
.myspace-header a.site-logo-link img,
.myspace-header .logo img,
nav .logo img, 
.home img, 
.site-logo-link img, 
.site-name img { 
  display: none !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
}

.myspace-header a.site-name::before,
.myspace-header a.site-logo-link::before {
  content: none !important;
}

.myspace-header .main-nav-wrapper,
.myspace-header .main-nav-container {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  height: auto !important;
  padding: 0 !important;
  margin: 0 !important;
  width: 100% !important;
}

.myspace-header .main-nav,
.myspace-header .main-nav-navigation,
#mainNavItems {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.myspace-header .main-nav li {
  flex: 0 1 auto !important;
  text-align: center !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}

.myspace-header .main-nav li a {
  color: var(--alice-white) !important; 
  font-weight: 600 !important; 
  font-family: 'Cinzel', serif !important;
  letter-spacing: 1px !important; 
  font-size: 0.82rem !important;
  text-transform: uppercase !important;
  border-right: 1px solid var(--alice-border) !important;
  padding: 10px 12px !important;
  display: inline-block !important;
  width: auto !important;
  box-sizing: border-box !important;
  line-height: 1.2 !important;
  height: auto !important;
  text-align: center !important;
}

.myspace-header .main-nav li:last-child a { 
  border-right: none !important; 
}

.myspace-header .main-nav li a:hover {
  color: var(--alice-bright-red) !important;
  background: rgba(179, 0, 0, 0.15) !important;
  text-shadow: 0 0 10px rgba(230, 0, 0, 0.6);
}

.myspace-header .dropdown-menu,
#profileDropdownMenu { 
  position: absolute !important;
  top: 100% !important;
  left: 0 !important;
  right: auto !important;
  background-color: var(--alice-charcoal) !important; 
  border: 1px solid var(--alice-red) !important; 
  min-width: 180px !important; 
  padding: 8px 0 !important; 
  box-shadow: 0 10px 30px rgba(0,0,0,0.9) !important;
  text-align: left !important;
  z-index: 1000 !important;
}

.myspace-header .dropdown-menu *,
#profileDropdownMenu * {
  border: none !important;
  border-right: none !important;
}

.myspace-header .dropdown-menu li {
  display: block !important;
  width: 100% !important;
  text-align: left !important;
  padding: 0 !important;
  margin: 0 !important;
}

.myspace-header .dropdown-menu a { 
  color: var(--alice-white) !important; 
  font-family: 'Cinzel', serif !important; 
  font-size: 0.85rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  display: block !important; 
  width: 100% !important;
  box-sizing: border-box !important;
  padding: 10px 18px !important; 
  line-height: 1.3 !important; 
  height: auto !important; 
  margin: 0 !important; 
  white-space: nowrap !important; 
  text-align: left !important;
  background: transparent !important;
}

.myspace-header .dropdown-menu a:hover { 
  background-color: var(--alice-red) !important; 
  color: #fff !important; 
  text-shadow: none !important;
  text-align: left !important;
}

.profile .left h1 {
  font-family: 'Cinzel', serif; 
  font-size: 32px; 
  letter-spacing: 2px;
  color: var(--alice-white);
  text-transform: uppercase;
  text-shadow: 0 0 12px rgba(179, 0, 0, 0.5);
  display: block;
  text-align: center;
  margin-bottom: 15px;
  font-weight: 700;
}

.general-about {
  display: flex !important;
  align-items: flex-start !important;
  gap: 16px !important;
  width: 100% !important;
  margin-bottom: 15px !important;
}

.profile-pic { 
  width: 140px !important;
  height: 140px !important;
  max-width: 140px !important;
  max-height: 140px !important;
  flex-shrink: 0 !important;
  margin: 0 !important;
  border-radius: 6px !important; 
  overflow: hidden !important; 
  border: 2px solid var(--alice-red) !important; 
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.8) !important; 
  box-sizing: border-box !important;
  background: var(--alice-charcoal) !important;
  display: block !important;
}

.profile-pic img {
  content: url("https://i.ibb.co/jkyjznxC/tumblr-bb1b54a9205a71d7bfb7f104064d0362-834ec731-500.webp") !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 4px !important;
}

.details,
div.details {
  display: block !important;
  flex-grow: 1 !important;
  text-align: left !important;
  margin-top: 0 !important;
}

.details p {
  display: block !important;
  text-align: left !important;
  margin: 4px 0 !important;
  color: var(--alice-white) !important;
}

.profile .contact, .profile .url-info, .profile .table-section, .home-actions, .profile-playlist-widget {
  background: var(--alice-charcoal) !important; 
  border: 1px solid var(--alice-border) !important; 
  border-left: 4px solid var(--alice-red) !important;
  border-radius: 6px;
  box-shadow: 0 6px 20px rgba(0,0,0,0.6); 
  margin-bottom: 24px !important;
  overflow: hidden;
}

.col.left {
  display: flex !important;
  flex-direction: column !important;
}

.col.right {
  display: flex !important;
  flex-direction: column !important;
  flex: 0 0 58% !important;
}

.heading {
  background: var(--alice-black) !important;
  color: var(--alice-white) !important; 
  border-radius: 0px !important; 
  padding: 12px 18px !important;
  position: relative !important; 
  display: flex !important; 
  align-items: center !important;
  justify-content: flex-start !important; 
  text-align: left !important; 
  min-height: 40px !important;
  box-sizing: border-box !important; 
  border-bottom: 2px solid var(--alice-red) !important;
  visibility: visible !important;
}

.heading h4, .heading h2, .heading .title, 
.blog-preview h4:not(.blog-title-override),
.table-section.videos-preview .heading h4:not(.video-title-override),
.profile .friends.badges-widget .heading h4 {
  font-size: 0 !important; 
  color: transparent !important; 
  display: block !important; 
  width: 0 !important; 
  height: 0 !important; 
  margin: 0 !important; 
  padding: 0 !important; 
  overflow: hidden !important;
}

.heading:before {
  font-family: 'Cinzel', serif !important; 
  font-size: 0.95rem !important;
  font-weight: 700 !important; 
  letter-spacing: 2px !important; 
  text-transform: uppercase !important;
  color: var(--alice-white) !important; 
  position: relative !important; 
  z-index: 1 !important;
  text-shadow: 0 1px 4px rgba(0,0,0,0.8);
}

.table-section:has(a[href*="photo"]) .heading:before { content: "Reflections in the Glass"; }
.table-section:has(a[href*="video"]) .heading:before { content: "Shadows & Wonderland Reels"; }
.blurbs .heading:before { content: "The Rabbit Hole Diaries"; }
.profile .friends:not(#comments):not(.badges-widget) .heading:before { content: "The Mad Tea Society"; }
.profile .friends.badges-widget .heading:before { content: "Curiosities & Keepsakes"; }
.profile .friends#comments .heading:before { content: "The Queen's Decrees"; }
.contact .heading:before { content: "The Cheshire's Messenger"; }
.profile .left .table-section.interests .heading:before { content: "Obsessions & Anomalies"; }
.profile .left .table-section.social-links .heading:before { content: "Other Dimensions"; }
.table-section.videos-preview .heading:before { content: "Shadows & Wonderland Reels" !important; }
.table-section.mutual-friends-section .heading:before { content: "Shared Madness" !important; }

.heading a, .heading small a, .heading span a, .heading div a, .heading > a, .heading * a, .profile .friends .heading a, .profile .friends .heading a:visited, .blog-preview h4 a, .table-section.videos-preview .heading h4 a {
  font-size: 0 !important; 
  color: transparent !important; 
  text-decoration: none !important; 
  display: inline-block !important;
  position: absolute !important; 
  right: 18px !important; 
  top: 50% !important; 
  transform: translateY(-50%) !important;
  z-index: 999 !important; 
  visibility: visible !important; 
  opacity: 1 !important; 
  width: auto !important; 
  height: auto !important;
}

.heading a:hover, .heading small a:hover, .heading span a:hover, .heading div a:hover, .heading > a:hover, .heading * a:hover, .profile .friends .heading a:hover, .blog-preview h4 a:hover, .table-section.videos-preview .heading h4 a:hover {
  text-decoration: none !important;
  color: transparent !important;
}

.heading a::after, .profile .friends .heading a.more::after, .heading * a::after, .blog-preview h4 a::after, .table-section.videos-preview .heading h4 a::after {
  content: "♦ VIEW ALL ♦" !important; 
  font-family: 'Cinzel', sans-serif !important; 
  font-size: 9px !important;
  font-weight: 700 !important; 
  letter-spacing: 1px !important; 
  text-transform: uppercase !important;
  color: var(--alice-bright-red) !important; 
  display: inline-block !important; 
  text-shadow: 0 1px 2px rgba(0,0,0,0.9) !important; 
  visibility: visible !important;
  text-decoration: none !important;
}

.heading a:hover::after, .profile .friends .heading a:hover::after, .heading * a:hover::after, .blog-preview h4 a:hover::after, .table-section.videos-preview .heading h4 a:hover::after {
  color: var(--alice-bright-red) !important; 
  text-shadow: 0 0 10px rgba(230, 0, 0, 0.9) !important;
  text-decoration: none !important;
}

.details-table td { 
  background: var(--alice-charcoal) !important; 
  border-bottom: 1px solid var(--alice-border) !important; 
  color: var(--alice-white) !important; 
  padding: 12px 16px !important;
}

.details-table td:first-child { 
  display: none !important; 
}

.details-table td:last-child { 
  width: 100% !important; 
}

table.details-table { 
  border-collapse: collapse; 
}

a, a:visited { 
  color: #ff8080 !important; 
  text-decoration: none !important;
}

a:hover { 
  color: #fff !important; 
  text-shadow: 0 0 6px rgba(230, 0, 0, 0.8);
  text-decoration: underline !important;
}

.contact .inner img {
  display: inline-block !important;
}

#comments {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

#comments .inner {
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
}

.profile .friends#comments,
.profile .friends#comments .person,
.profile .friends#comments table {
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

table.comments-table {
  display: block !important;
  width: 100% !important;
  table-layout: fixed !important;
  height: auto !important;
  max-height: 600px !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  border: none !important;
  box-sizing: border-box !important;
}

table.comments-table tbody {
  display: block !important;
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  overflow-y: visible !important;
}

.comments-table tr {
  display: flex !important;
  width: 100% !important;
  clear: both !important;
  border-bottom: 1px solid var(--alice-border) !important;
  box-sizing: border-box !important;
}

.comments-table td {
  display: block !important;
  box-sizing: border-box !important;
  background: var(--alice-charcoal) !important;
  border: none !important;
  vertical-align: top !important;
  padding: 18px !important;
}

.comments-table td:first-child {
  width: 140px !important;
  min-width: 140px !important;
  text-align: center !important;
  flex-shrink: 0 !important;
}

.comments-table td:first-child * {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
}

.comments-table td:first-child img {
  width: 70px !important;
  height: auto !important;
  border-radius: 4px;
  border: 2px solid var(--alice-red);
}

.comments-table td:last-child {
  flex-grow: 1 !important;
  width: auto !important;
  max-width: calc(100% - 140px) !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

.comments-table td:last-child p,
.comments-table td:last-child .comment-text,
.comments-table td:last-child div {
  max-width: 100% !important;
  width: 100% !important;
  white-space: normal !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  line-height: 1.6 !important;
  margin-bottom: 8px !important;
  overflow: visible !important;
  height: auto !important;
}

.profile .friends .person img:not(.icon) { 
  border-radius: 4px; 
  border: 2px solid var(--alice-red); 
  transition: .3s ease; 
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.7);
}

.profile .friends .person img:not(.icon):hover { 
  transform: scale(1.04); 
  border-color: #fff; 
}

.profile .friends .person {
  padding: 8px !important;
}

.profile .friends .person p, .profile .friends .person a, .profile .friends .person a:visited { 
  color: #ff8080 !important; 
}

.profile .friends .person a:hover { 
  color: #fff !important; 
  text-shadow: 0 0 6px rgba(230, 0, 0, 0.7); 
}

.count { 
  color: var(--alice-bright-red) !important; 
}

.profile .friends .person img { 
  border-radius: 4px; 
}

.profile .friends.badges-widget .heading { 
  justify-content: center; 
}

.profile .friends.badges-widget .heading h4 { 
  position: absolute; 
  opacity: 0; 
}

.profile .friends .person p, .profile .friends .person a { 
  display: block !important; 
  text-align: center !important; 
  margin: 8px auto 0 auto !important; 
  width: 100% !important; 
}

.table-section.mutual-friends-section { 
  display: block !important; 
  visibility: visible !important; 
}

.table-section.mutual-friends-section .heading { 
  display: flex !important; 
  visibility: visible !important; 
  height: auto !important; 
}

.table-section.mutual-friends-section .heading h4 { 
  display: none !important; 
}

.table-section.mutual-friends-section .heading:before { 
  content: "Shared Madness" !important; 
  font-family: 'Cinzel', serif !important; 
  font-size: 0.95rem !important; 
  color: var(--alice-white) !important; 
}

.blurbs { 
  padding: 0 !important; 
  background: none !important; 
  font-size: 20px !important;
}

.blurbs * {
  font-size: 20px !important;
}

.blurbs .heading { 
  display: flex !important; 
  align-items: center !important; 
  justify-content: flex-start !important; 
  text-align: left !important; 
}

.blurbs .section { 
  background: transparent !important; 
  border: none !important; 
  border-left: none !important;
  border-radius: 0 !important; 
  box-shadow: none !important; 
  padding: 15px 0 !important; 
  margin: 0 0 24px 0 !important; 
  text-align: left !important; 
}

.blurbs h4, .blurbs .section-title { 
  visibility: hidden; 
  height: 0; 
  margin: 0; 
  padding: 0; 
  display: none; 
}

.blurbs .section p { 
  color: var(--alice-white) !important; 
  font-size: 21px; 
  line-height: 1.85; 
  max-width: 100%; 
  margin: 0 0 16px 0 !important; 
  text-align: left !important; 
  font-style: italic; 
}

.blurbs ul, .blurbs ol { 
  list-style: none !important; 
  margin: 0 !important; 
  padding: 0 !important; 
}

.blog-preview p { 
  background-color: transparent; 
  padding: 8px 0; 
  border-radius: 0px; 
  color: var(--alice-white); 
  font-weight: normal; 
  line-height: 1.6 !important;
  text-align: left !important; 
  width: 100% !important; 
  margin: 10px 0 !important; 
  display: block !important; 
}

.blog-preview p a { 
  color: #ff8080 !important; 
  display: inline-block !important; 
  margin: 0 !important; 
}

.blog-preview p a:hover { 
  color: #fff !important; 
}

.blog-preview h4, 
.profile .blog-preview h4 { 
  display: flex !important; 
  align-items: center !important; 
  justify-content: flex-start !important; 
  position: relative !important; 
  width: 100% !important; 
  height: auto !important; 
  background: var(--alice-black) !important; 
  border-radius: 0px !important; 
  padding: 12px 18px !important; 
  box-sizing: border-box !important; 
  visibility: visible !important; 
  font-size: 0 !important; 
  margin: 0 0 24px 0 !important; 
  border-bottom: 2px solid var(--alice-red) !important; 
}

.blog-preview h4::before { 
  content: "The Cheshire's Notebook" !important; 
  display: block !important; 
  font-family: 'Cinzel', serif !important; 
  font-size: 0.95rem !important; 
  font-weight: 700 !important; 
  color: var(--alice-white) !important; 
  letter-spacing: 2px !important; 
  text-align: left !important; 
}

.blog-preview h4 a { 
  font-size: 0 !important; 
  position: absolute !important; 
  right: 18px !important; 
  top: 50% !important; 
  transform: translateY(-50%) !important; 
  display: block !important; 
}

.blog-preview h4 a::after { 
  content: "♦ VIEW ALL ♦" !important; 
  font-family: 'Cinzel', sans-serif !important; 
  font-size: 9px !important; 
  font-weight: 700 !important; 
  color: var(--alice-bright-red) !important; 
  display: block !important; 
}

.blog-preview { 
  display: block !important; 
  width: 100% !important; 
}

.profile-playlist-widget { 
  background: var(--alice-charcoal) !important; 
  border: 1px solid var(--alice-border) !important; 
  border-left: 4px solid var(--alice-red) !important;
  box-shadow: 0 6px 20px rgba(0,0,0,0.6) !important; 
  padding: 16px !important;
}

.profile-playlist-widget * { 
  color: var(--alice-white) !important; 
}

.profile-playlist-widget a { 
  color: #ff8080 !important; 
}

.profile-playlist-widget h3, .profile-playlist-widget .heading { 
  text-align: center !important; 
  position: relative; 
}

.profile-playlist-widget h3 { 
  display: block; 
  width: 100%; 
  margin: 0 0 14px 0; 
  font-family: 'Cinzel', serif; 
  font-size: 0.95rem;
  letter-spacing: 2px;
  color: var(--alice-white);
  font-weight: 700;
  text-transform: uppercase;
}

.profile-playlist-widget li, .profile-playlist-widget .current, .profile-playlist-widget .active, .profile-playlist-widget .song {
  background: var(--alice-black) !important; 
  border: 1px solid var(--alice-border) !important; 
  box-shadow: none !important;
  padding: 10px 12px !important;
  margin-bottom: 6px !important;
  border-radius: 4px;
}

.profile-playlist-widget li:hover { 
  background: rgba(179, 0, 0, 0.25) !important; 
}

.pp-equalizer span, .profile-playlist-widget .pp-equalizer span { 
  background: var(--alice-bright-red) !important; 
  box-shadow: none !important; 
}

.music-player, .global-player, footer, #footer, .footer { 
  background: var(--alice-black) !important; 
  border-top: 3px solid var(--alice-red) !important; 
  backdrop-filter: none !important; 
}

.music-player * { 
  color: var(--alice-white) !important; 
  font-weight: 500 !important; 
  font-family: 'Spectral', serif !important; 
}

.music-player a { 
  color: #ff8080 !important; 
}

.music-player a:hover { 
  color: #fff !important; 
}

.music-player progress { 
  accent-color: var(--alice-bright-red) !important; 
}

.music-bar, #footer-music-bar { 
  background: var(--alice-black) !important; 
  border-top: 3px solid var(--alice-red) !important; 
  box-shadow: 0 -5px 25px rgba(0,0,0,0.95); 
}

.music-bar::before, #footer-music-bar::before { 
  display: none !important; 
}

.bar-now-playing { 
  color: var(--alice-bright-red) !important; 
  font-weight: 700 !important; 
  text-transform: uppercase; 
  letter-spacing: 1.5px; 
  font-family: 'Cinzel', serif !important; 
  font-size: 11px !important;
}

.music-bar .bar-title { 
  color: var(--alice-white) !important; 
  font-weight: 600 !important; 
  font-family: 'Spectral', serif !important; 
  font-size: 14px !important; 
}

.bar-time-display, .bar-time-total { 
  color: var(--alice-bright-red) !important; 
  font-weight: 600; 
}

.bar-progress { 
  background: var(--alice-charcoal) !important; 
  border: 1px solid var(--alice-border); 
}

.bar-progress-fill { 
  background: var(--alice-bright-red) !important; 
}

.music-bar .bar-btn { 
  color: var(--alice-white) !important; 
  background: transparent !important; 
  border: none !important; 
}

.music-bar .bar-btn:hover { 
  color: var(--alice-bright-red) !important; 
}

#footer-music-bar #bar-playlist-btn, #footer-music-bar #bar-playlist-btn:hover, .music-bar #bar-playlist-btn {
  background: transparent !important; 
  border: none !important; 
  box-shadow: none !important;
  color: transparent !important; 
  font-size: 0 !important; 
  position: relative !important;
}

#footer-music-bar #bar-playlist-btn::before, .music-bar #bar-playlist-btn::before {
  content: "♦" !important; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  transform: translate(-50%,-50%);
  font-size: 18px; 
  font-weight: bold; 
  color: var(--alice-bright-red); 
  text-indent: 0; 
  display: block !important;
}

.volume-slider {
  -webkit-appearance: none !important;
  appearance: none !important;
  width: 100%;
  height: 6px;
  border-radius: 3px;
  background: var(--alice-charcoal) !important;
  outline: none !important;
  border: 1px solid var(--alice-border) !important;
}

.volume-slider:focus {
  outline: none !important;
  box-shadow: none !important;
}

.volume-slider::-webkit-slider-thumb {
  -webkit-appearance: none !important;
  appearance: none !important;
  height: 14px;
  width: 14px;
  background: var(--alice-bright-red) !important;
  border: 1px solid #000 !important;
  border-radius: 50% !important;
  cursor: pointer;
}

.volume-slider::-moz-range-thumb {
  appearance: none !important;
  height: 14px;
  width: 14px;
  background: var(--alice-bright-red) !important;
  border: 1px solid #000 !important;
  border-radius: 50% !important;
  cursor: pointer;
}

.table-section.videos-preview, .table-section:has(a[href*="vid/profile"]) { 
  display: block !important; 
  visibility: visible !important; 
  min-height: 50px !important; 
}

.table-section:has(a[href*="vid/profile"]) .heading { 
  display: flex !important; 
  visibility: visible !important; 
  opacity: 1 !important; 
}

button, input[type="submit"], .cb-delete-comment-btn, .cb-actions button, button.cb-like-btn { 
  background: var(--alice-charcoal) !important; 
  border: 1px solid var(--alice-red) !important; 
  border-radius: 4px !important; 
  color: var(--alice-white) !important; 
  font-family: 'Cinzel', serif !important; 
  font-weight: 600 !important; 
  font-size: 9px !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  padding: 4px 10px !important;
  line-height: 1.4 !important;
  height: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  transition: all 0.2s ease;
}

button:hover, input[type="submit"]:hover, .cb-delete-comment-btn:hover, .cb-actions button:hover, button.cb-like-btn:hover { 
  background: var(--alice-bright-red) !important; 
  color: #fff !important; 
  border-color: #fff !important; 
}

.cb-delete-comment-btn {
  width: 26px !important;
  height: 26px !important;
  padding: 0 !important;
  font-size: 0 !important;
  color: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}

.cb-delete-comment-btn::before {
  content: "✕" !important;
  font-size: 13px !important;
  font-weight: bold !important;
  color: var(--alice-bright-red) !important;
  display: inline-block !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  visibility: visible !important;
}

.cb-delete-comment-btn:hover::before {
  color: #fff !important;
}

button.cb-like-btn {
  width: 26px !important;
  height: 26px !important;
  padding: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
}

button.cb-like-btn .cb-like-icon {
  font-size: 0 !important;
  color: transparent !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 100% !important;
  position: absolute !important;
  top: 0 !important;
  left: 0 !important;
}

button.cb-like-btn .cb-like-icon::before {
  content: "♦" !important;
  font-size: 13px !important;
  color: var(--alice-bright-red) !important;
  visibility: visible !important;
  display: inline-block !important;
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
}

button.cb-like-btn:hover .cb-like-icon::before {
  color: #fff !important;
}

.fade-in-content { 
  animation: fadeIn 1s ease-in; 
}

@keyframes fadeIn { 
  from { opacity: 0; } 
  to { opacity: 1; } 
}

.status-gif { 
  display: none !important; 
}

#statusModal .status-modal-header { 
  background: var(--alice-black) !important; 
  border-bottom: 2px solid var(--alice-red) !important; 
  border-radius: 0 !important; 
  color: var(--alice-white) !important; 
  padding: 14px 18px !important;
}

#statusModal .status-modal { 
  background: var(--alice-charcoal) !important; 
  border: 2px solid var(--alice-red) !important; 
  color: var(--alice-white) !important; 
  box-shadow: 0 0 35px rgba(0, 0, 0, 0.95) !important; 
  border-radius: 6px !important; 
}

#statusModal .status-modal label, #statusModal .status-modal input, #statusModal .status-modal textarea { 
  color: var(--alice-white) !important; 
  background: var(--alice-black) !important; 
  border: 1px solid var(--alice-border) !important; 
}

#statusModal.status-modal-overlay { 
  background: rgba(0, 0, 0, 0.85) !important; 
}

#statusModal .status-field label strong { 
  color: var(--alice-bright-red) !important; 
  font-family: 'Cinzel', serif; 
}

#statusModal .status-modal-body input, #statusModal .status-modal-body textarea, #statusModal .status-modal-body select { 
  background-color: var(--alice-black) !important; 
  border: 1px solid var(--alice-border) !important; 
  color: var(--alice-white) !important; 
  padding: 10px !important;
  border-radius: 4px !important;
}

#statusModal .status-modal-body { 
  background-color: var(--alice-charcoal) !important; 
  padding: 18px !important;
}

#statusModal .status-field { 
  background: var(--alice-black) !important; 
  border: 1px solid var(--alice-border) !important; 
  padding: 14px !important; 
  border-radius: 4px !important; 
  margin-bottom: 16px !important; 
}

#statusModal .status-field label, #statusModal .status-field p.field-descr { 
  color: var(--alice-white) !important; 
  margin-bottom: 6px !important; 
}

#statusModal .status-field input[type="text"] { 
  background: var(--alice-black) !important; 
  border: 1px solid var(--alice-border) !important; 
  color: var(--alice-white) !important; 
  padding: 10px !important; 
  border-radius: 4px !important; 
  width: 100% !important; 
}

#modalEmojiPicker.emoji-picker-panel { 
  background-color: var(--alice-charcoal) !important; 
  border: 1px solid var(--alice-red) !important; 
  border-radius: 6px !important; 
  padding: 14px !important; 
}

.emoji-grid { 
  background-color: transparent !important; 
  gap: 5px !important;
}

.emoji-grid .emoji-btn { 
  border-radius: 4px !important; 
  transition: background 0.2s ease !important; 
  background: var(--alice-black) !important; 
  border: 1px solid var(--alice-border) !important; 
  color: var(--alice-white) !important; 
  display: flex !important; 
  align-items: center !important; 
  justify-content: center !important; 
  padding: 8px !important; 
}

.emoji-grid .emoji-btn:hover { 
  background: var(--alice-bright-red) !important; 
  border-color: #fff !important; 
  cursor: pointer !important; 
}

.emoji-grid .emoji-btn.selected { 
  background: var(--alice-bright-red) !important; 
  border: 1px solid #fff !important; 
}

.myBox { 
  max-height: 500px !important; 
  overflow-y: auto !important; 
}

.myspace-header .search-input, .myspace-header .nav-search-input { 
  border: 1px solid var(--alice-border) !important; 
  background-color: var(--alice-black) !important; 
  color: var(--alice-white) !important; 
  border-radius: 4px 0 0 4px !important; 
  padding: 6px 12px !important;
}

.myspace-header .search-button, 
.myspace-header .nav-search-btn { 
  background-color: var(--alice-charcoal) !important; 
  border: 1px solid var(--alice-border) !important; 
  color: var(--alice-bright-red) !important; 
  font-weight: 600 !important; 
  font-family: 'Cinzel', serif !important; 
  text-transform: uppercase !important; 
  display: flex !important;
  align-items: center !important;
  justify-content: center !important; 
  text-align: center !important; 
  padding: 0 16px !important;
  line-height: 1.6 !important;
  border-radius: 0 4px 4px 0 !important;
}

.myspace-header .search-button:hover, .myspace-header .nav-search-btn:hover { 
  background-color: var(--alice-bright-red) !important; 
  color: #fff !important; 
}

footer nav[aria-label="Footer navigation"], footer nav[aria-label="Footer navigation"] ul, footer nav[aria-label="Footer navigation"] li {  
  background: transparent !important;  
  border: none !important;  
  margin: 0 !important;  
  padding: 0 !important;  
}

footer nav[aria-label="Footer navigation"] a {  
  color: var(--alice-white) !important;  
  text-decoration: none !important;  
  font-family: 'Spectral', serif !important;  
}

footer nav[aria-label="Footer navigation"] a:hover {  
  color: var(--alice-bright-red) !important;  
}

::-webkit-scrollbar { 
  width: 8px; 
}

::-webkit-scrollbar-track { 
  background: var(--alice-black); 
}

::-webkit-scrollbar-thumb { 
  background: var(--alice-red); 
  border-radius: 4px; 
}

.comments-table td, 
.comments-table tr, 
.cb-author-wrap, 
.fr-supporter-badge {
  overflow: visible !important;
}

#comments button, 
#comments input[type="submit"],
.comments-table button,
.comments-table input[type="submit"],
.cb-actions button,
.cb-actions input[type="submit"] {
  font-family: 'Cinzel', serif !important;
  font-size: 9px !important;
  padding: 4px 10px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
}

span.fr-supporter-tip {
  font-size: 10px !important;
  line-height: 1.3 !important;
  padding: 4px 8px !important;
  width: auto !important;
  max-width: none !important;
  white-space: nowrap !important;
  display: inline-block !important;
  box-sizing: border-box !important;
}

.profile-playlist-widget button, 
.profile-playlist-widget input[type="submit"],
.profile-playlist-widget input[type="text"] {
  font-size: 10px !important;
  padding: 4px 8px !important;
  height: auto !important;
}

.profile-playlist-widget .remove-btn,
.profile-playlist-widget button.remove,
.profile-playlist-widget input[value="Remove"],
.profile-playlist-widget input[type="submit"] {
  font-size: 9px !important;
  padding: 3px 6px !important;
  font-family: 'Cinzel', serif !important;
}

.profile .friends:not(#comments):not(.badges-widget) .inner > p {
  font-size: 20px !important;
  color: transparent !important;
  visibility: hidden !important;
  position: relative !important;
}

.profile .friends:not(#comments):not(.badges-widget) .inner > p b {
  font-size: 0 !important;
  visibility: visible !important;
}

.profile .friends:not(#comments):not(.badges-widget) .inner > p b::before {
  content: "Alice has " !important;
  font-size: 20px !important;
  color: var(--alice-white) !important;
  visibility: visible !important;
}

.profile .friends:not(#comments):not(.badges-widget) .inner > p b .count {
  font-size: 20px !important;
  color: var(--alice-bright-red) !important;
  visibility: visible !important;
}

.profile .friends:not(#comments):not(.badges-widget) .inner > p b::after {
  content: " curious companions." !important;
  font-size: 20px !important;
  color: var(--alice-white) !important;
  visibility: visible !important;
}

a.report {
  font-size: 11px !important;
  padding: 4px 10px !important;
  display: inline-block !important;
  vertical-align: middle !important;
  margin: 0 !important;
}

.comments-table td:last-child div[style*="display: flex"] {
  align-items: center !important;
  gap: 8px !important;
}

.pf-photo-grid {
  display: flex !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  padding: 10px !important;
  box-sizing: border-box !important;
  width: 100% !important;
}

.pf-photo-grid a {
  flex: 1 !important;
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

.pf-photo-grid img {
  width: 100% !important;
  height: auto !important;
  border-radius: 4px !important;
  border: 2px solid var(--alice-red) !important;
}

/* 1.5-Second Intro Fade-Out GIF Overlay */
@keyframes aliceIntroFade {
  0% { opacity: 1; visibility: visible; }
  75% { opacity: 1; visibility: visible; }
  100% { opacity: 0; visibility: hidden; }
}

#alice-intro-overlay {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  background: #080505 url("https://i.redd.it/eemjz9e8zq5f1.gif") center center / cover no-repeat !important;
  z-index: 999999 !important;
  animation: aliceIntroFade 2.3s ease-in-out forwards !important;
  pointer-events: none !important;
}
</style>
Alice in Wonderland *BETA*

Comments (0)

CSS Code

Alice in Wonderland BETA
