← Back to Layouts
my layout 2.0

Name: FriendRewind
Author: FriendRewind
Author: !! Ariadne
Category: General
Created: September 19, 2026
yay it should be working now
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>


/* FR_MANUAL_EXTRAS */
</style>
<style>

.profile-pic img {
  border-width: 7px;
    border-style: solid;
    border-image: url("https://i.imgur.com/SqhJATD.png") 8 fill round;
  }

/* online and offline icons */
.online, .offline {
  visibility: hidden !important;
}

.online img {
  content: url("https://friendrewind.com/uploads/gallery/29211/img_6a7fdec0e102a3.93722055.gif") !important;
  visibility: visible !important;

  display: block !important;
  width: 70px !important;
  height: auto !important;
  margin: 6px auto !important;
}

.offline img {
  content: url("https://friendrewind.com/uploads/gallery/29211/img_6a8333fad81493.92956162.gif") !important;
  visibility: visible !important;

  display: block !important;
  width: 70px !important;
  height: auto !important;
  margin: 6px auto !important;
}

.profile .contact {
border: 2px dashed black;
}

.icon {
display: none; 
}

/* contact icons */
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	    content: url("https://friendrewind.com/uploads/gallery/29211/img_6a80b96ecef161.70520679.gif")
    }
    .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	    content: url("https://friendrewind.com/uploads/gallery/29211/img_6a80b819853af9.17840412.gif")
    }
    .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	    content: url("https://friendrewind.com/uploads/gallery/29211/img_6a80b685940a54.39850901.gif")
    }
    .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	    content: url("https://friendrewind.com/uploads/gallery/29211/img_6a80b8bb1b7634.49227332.gif")
    }
    .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	    content: url("https://64.media.tumblr.com/7209af3408526716f17e48fdcfd5cf84/e0b92b6160ec4cbf-d0/s75x75_c1/c5bc47a8900907797a972cd5ceae3b74820729cf.gifv")
    }
    .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	    content: url("https://friendrewind.com/uploads/gallery/29211/img_6a80b91dc932b0.47117084.gif")
    }

/* PASTE YOUR GOOGLE FONT IMPORT BELOW */
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');


.profile-name,
h1 {

  /* PUT YOUR FONT NAME HERE */
  font-family: 'Press Start 2P' !important;

  /* CHANGE FONT SIZE */
  font-size: 28px !important;

  /* CHANGE FONT COLOR */
  color: blue !important;

}

/* Wide Square Profile Tunes */

  div#profile-playlist-container {
  width: 100%!important;
  display: block;
  max-width: 200%!important;
} 
  .profile-playlist-widget {
  background: #fff !important;
  border: 1px solid #000!important;
  backdrop-filter: blur(10px) saturate(160%);
  -webkit-backdrop-filter: blur(10px) saturate(160%);
  color: #000!important;
  box-shadow: 0 4px 18px rgba(0,0,0,0.4);
  max-width: 500%!important;
  font-size: 13px;
  border-radius: 0px!important;
  padding: 5px!important;
  margin: 5px 0!important;
  position: relative;
  z-index: 1;
  overflow: hidden;
  -webkit-user-select: none;
  user-select: none;
}
  .profile-playlist-widget h3 {
  margin: 0;
  font-size: 15px;
  color: #000!important;
  flex: 1;
}
  .profile-playlist-widget .song-info {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 12px;
  font-weight: 100;
  margin: 0px;
  line-height: 1;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0)!important;
}
  .profile-playlist-widget .song-artist {
  font-weight: 800;
  color: #000!important;
  font-size: 11px;
}
  .profile-playlist-widget .pp-drag {
  width: 19px;
  min-width: 8px;
  height: 0px;
  margin-right: 6px;
  color: #000!important;
  cursor: grab;
  user-select: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  touch-action: none;
  border-radius: 0px!important;
  transition: all 0.15s ease;
}
  .profile-playlist-widget button {
  background: none;
  border: none;
  color: #000!important;
  cursor: pointer;
  font-size: 14px;
  padding: 2px 4px;
  border-radius: 0px!important;
  transition: all 0.2s;
  margin-left: auto;
}
  .profile-playlist-widget li.current .song-info {
  color: #fff !important;
}
  .profile-playlist-widget li.current {
  color: #fff !important;
  background: black!important;
}
  .profile-playlist-widget li.current .song-artist {
  color: #fff !important;
}
  .profile-playlist-widget li.profile-playlist-item:hover {
  color: #fff !important;
  background: #6E6E6E!important;
  border: 1px solid #fff;
}
  .profile-playlist-widget li.profile-playlist-item {
  border-radius: 0px!important;
}

  li.profile-playlist-empty {
  border-radius: 0px!important;
  color: #000!important;
}
  .pp-equalizer {
  display: none;
  align-items: flex-end;
  gap: 0px;
  height: 32px!important;
  margin-right: auto;
  content: url('https://www.iconsdb.com/icons/download/white/musical-note-512.png');
}

/* Stack the profile picture, info, and online icon vertically */

.general-about {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  text-align: center !important;
}

.general-about .profile-pic {
  order: 1 !important;
  float: none !important;
}

.general-about .details {
  order: 2 !important;
  width: 100% !important;
}

.general-about .online {
  order: 3 !important;
  visibility: hidden !important;
}

/* Add a background image to the navigation links bar */

.top-nav.navbar{
  background-color: transparent !important;
  background-image: url ("https://friendrewind.com/uploads/gallery/29211/img_6aa3defb4663d7.97527553.webp")
  !important;

  background-repeat: repeat !important;
  background-position: center !important;
  background-size: auto !important;
}
 /* myspace header white ver by me */
.myspace-header .nav-logo {
  content: url('https://friendrewind.com/uploads/gallery/29211/img_6aa0cac99a0885.07167285.webp');
  width: 180px;
  height: auto;
}

.cb-like-icon {
display: none
}

/* intro screen by kayla */
body::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;

  background-image: url("https://friendrewind.com/uploads/gallery/29211/img_6aa2792919bd27.35758843.gifhttps://friendrewind.com/uploads/gallery/29211/img_6aa2792919bd27.35758843.gif");
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;

  z-index: 999999;
  pointer-events: none;

  animation: loadingScreen 1s ease forwards;
}

@keyframes loadingScreen {
  0% {
    opacity: 1;
  }

  75% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}
#top8-grid .person p, .cb-author-name {
color: black;
background-color: white;
}
</style>