← Back to Layouts
FriendRewind Sleak

Name: FriendRewind
Author: FriendRewind
Author: ↑ Ðüƨŧī₪ ↓
Category: Classic
Created: August 16, 2026
A little nostalgic, retro-polished layout but re-imagined for FriendRewind.
Comments (1)

lovelycat202086 08/19/2026 1:04 PM
I actually like how simple it is!
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>

/* =========================================================
   GLOBAL RESET & BACKGROUND
   ========================================================= */

html,
body,
body.profile-page,
body.profile-page * {
    box-sizing: border-box !important;
}

html {
    margin: 0 !important;
    padding: 0 !important;
    background: #000 !important;
}

body,
body.profile-page {
    margin: 0 !important;
    padding: 0 !important;
background: #000 url("https://www.mediafire.com/convkey/73d8/fsi8ewvgj362tsv7g.jpg") center center / cover repeat fixed !important;
}

/* =========================================================
   CENTER PROFILE CANVAS
   ========================================================= */

body.profile-page .master-container,
body.profile-page main {
    width: 760px !important;
    min-width: 760px !important;
    max-width: 760px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: 0 !important;
    position: relative !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    background: #fff !important;
}


/* =========================================================
   HEADER / NAVIGATION
   ========================================================= */

body.profile-page header,
body.profile-page nav {
    width: 760px !important;
    min-width: 760px !important;
    max-width: 760px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    position: relative !important;
    left: 0 !important;
    right: auto !important;
    transform: none !important;
}


/* =========================================================
   OUTER WRAPPERS
   ========================================================= */

body.profile-page > table {
    width: 760px !important;
    min-width: 760px !important;
    max-width: 760px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    border-spacing: 0 !important;
}

body.profile-page > div,
body.profile-page > main {
    margin-left: auto !important;
    margin-right: auto !important;
}


/* =========================================================
   PROFILE COLUMNS
   ========================================================= */

body.profile-page .profile-info .col.w-40.left,
body.profile-page .profile-info .col.w-60.right {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    position: relative !important;
}


/* =========================================================
   BLURBS
   ========================================================= */

body.profile-page .col.w-40.left .blurbs {
    display: block !important;
    float: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: center !important;
}

body.profile-page .col.w-40.left .blurbs .inner,
body.profile-page .col.w-40.left .blurbs .bio-text > center > div {
    margin-left: auto !important;
    margin-right: auto !important;
}


/* =========================================================
   PROFILE TABLES
   ========================================================= */

.profile-info,
.profile-info table {
    border-spacing: 0 !important;
}

.profile-info .table-section,
.profile-info .table-section > div,
.profile-info .table-section .heading {
    border-radius: 0 !important;
}

.profile-info .table-section {
    margin: 0 !important;
}

.profile-info .table-section + .table-section {
    margin-top: 0 !important;
}


/* =========================================================
   CONTACTING
   ========================================================= */

.contact a[data-action="invite-to-group"],
.contact a[onclick*="openReportModal"],
.contact > .heading {
    display: none !important;
}

.contact .instant-message-link {
    display: block !important;
}


/* =========================================================
   HIDDEN SECTIONS
   ========================================================= */

.blog-preview,
.table-section.photos-preview,
.table-section.videos-preview,
.friends,
div.friends#comments,
footer[role="contentinfo"] {
    display: none !important;
}


/* =========================================================
   HIDE BIO / BLURB HEADINGS
   ========================================================= */

.blurbs > .heading {
    display: none !important;
}


/* =========================================================
   ONLINE INDICATOR
   ========================================================= */

.online,
.online img {
    opacity: 1 !important;
    visibility: visible !important;
    animation: none !important;
    -webkit-animation: none !important;
    transition: none !important;
    -webkit-transition: none !important;
    filter: none !important;
}

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


/* =========================================================
   INTERESTS SECTION
   ========================================================= */

.table-section.interests {
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    overflow: hidden !important;
}

.table-section.interests > div:last-child {
    height: 400px !important;
    max-height: 400px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}


/* =========================================================
   INTERESTS SCROLLBAR
   ========================================================= */

.table-section.interests > div:last-child::-webkit-scrollbar {
    width: 8px !important;
}

.table-section.interests > div:last-child::-webkit-scrollbar-track {
    background: #eee !important;
}

.table-section.interests > div:last-child::-webkit-scrollbar-thumb {
    background: #888 !important;
    border: 1px solid #666 !important;
    border-radius: 0 !important;
}


/* =========================================================
   INTERESTS TITLE
   ========================================================= */

.table-section.interests > .heading {
    font-size: 0 !important;
}

.table-section.interests > .heading::after {
    content: "Interests" !important;
    font-size: 16px !important;
}


/* =========================================================
   PROFILE DETAILS
   ========================================================= */

div.details {
    position: relative !important;
    height: 175px !important;
    min-height: 175px !important;
    max-height: 175px !important;
    overflow: hidden !important;
    background: #fff !important;
    font-size: 0 !important;
    text-align: left !important;
}

div.details > * {
    display: none !important;
}

div.details::before {
    content: " (insert emoji here) \A\A(insert relationship status here)\A (insert age here) / (insert gender here)\A(insert location here)" !important;
    position: absolute !important;
    top: 6px !important;
    left: 8px !important;
    white-space: pre-line !important;
    font-family: Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: normal !important;
    line-height: 1.3 !important;
    color: #000 !important;
    text-align: left !important;
    z-index: 20 !important;
}


/* =========================================================
   ONLINE NOW GRAPHIC
   ========================================================= */

div.details::after {
    content: "" !important;
    position: absolute !important;
    top: 94px !important;
    left: 8px !important;
    width: 75px !important;
    height: 19px !important;
    background: url("https://i.ibb.co/gbYL4qx/onlinenow2.gif") left center / contain no-repeat !important;
    z-index: 21 !important;
}


/* =========================================================
   URL BOX
   ========================================================= */

.url-info {
    width: 284px !important;
    min-width: 284px !important;
    max-width: 284px !important;
    height: 47.64px !important;
    min-height: 47.64px !important;
    max-height: 47.64px !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 8px !important;
    overflow: hidden !important;
    font-size: 0 !important;
}

.url-info::after {
    content: "(insert profile URL here)" !important;
    display: block !important;
    white-space: pre !important;
    font-size: 12px !important;
    width: 100% !important;
    height: auto !important;
}


/* =========================================================
   FRIENDREWIND LOGO
   ========================================================= */

img[src*="friendrewind-logo.webp"] {
    content: url("https://i.ibb.co/Q7LkDN1N/FWL.png") !important;
    width: 180px !important;
    height: auto !important;
    object-fit: contain !important;
}


/* =========================================================
   HIDE MUSIC PLAYER
   ========================================================= */

#profile-playlist-mount {
    position: fixed !important;
    left: -10000px !important;
    top: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    opacity: 0 !important;
    pointer-events: none !important;
    overflow: hidden !important;
}


/* =========================================================
   LEFT ↔ RIGHT PROFILE FLIP
   ========================================================= */

.profile {
    direction: rtl !important;
}

.profile * {
    direction: ltr !important;
}

</style>