← Back to Layouts
aaa

Name: FriendRewind
Author: FriendRewind
Author: ribbonated
Category: Classic
Created: October 18, 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>

/* 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;

}


</style>

<style>
/* SPARKLE IMAGE AROUND PROFILE PICTURE */

.profile-pic {
    position: relative !important;
    overflow: visible !important;
}

.profile-pic::after {
    content: "" !important;

    position: absolute !important;
    top: -30px !important;
    left: -30px !important;

    width: calc(100% + 60px) !important;
    height: calc(100% + 60px) !important;

    background-image: url("https://64.media.tumblr.com/0f03ce640e4a132a608a2c375f649dce/8ed13461ae3e8f6e-35/s75x75_c1/8e40e855db3aeebc045870015fffc062c9a3c0eb.gifv") !important;
    background-size: contain !important;
    background-position: center !important;
    background-repeat: no-repeat !important;

    opacity: 0 !important;
    transform: scale(.85) !important;

    transition:
        opacity .25s ease,
        transform .25s ease !important;

    pointer-events: none !important;
    z-index: 9999 !important;
}

/* SHOW SPARKLES ON HOVER */

.profile-pic:hover::after {
    opacity: 1 !important;
    transform: scale(1) !important;
}
</style>

<style>

/* Remove the search bar and its empty container */

nav .top form,
nav form[action*="search"],
nav .search,
nav .searchbar,
nav .top .center:has(form[action*="search"]),
nav .top .center:has(input[type="search"]) {
  display: none !important;
}
</style>

<style>
.profile .idle,
.general-about .idle,
.profile .offline,
.general-about .offline {
  display: none !important;
  visibility: hidden !important;
}
</style><style>


::selection {
   background: #c11869;
   color: white;
}
</style>
<style>


@import url('https://fonts.googleapis.com/css2?family=Alex+Brush&display=swap');

.alex-brush-regular {
  font-family: "Alex Brush", cursive;
  font-weight: 400;
  font-style: normal;
}

.profile-name,
h1 {
  font-family: "Alex Brush", cursive !important;
  font-size: 16px !important;
  color: #c11869 !important;

}

</style>