Layout Preview | FriendRewind

Name: FriendRewind
Author: FriendRewind

FriendRewind

← Back to Layouts

RDR2

Author: sillybilly

Category: Games

Created: July 8, 2025

Hopefully this works last time it turned the badge section into the friends section

Comments (1)

Def3ct 07/09/2025 6:09 AM

Nice job!

You must log in to comment.

CSS Code

<style>
<style>/* Cursor & Scrollbar */

	* {cursor: url('https://cur.cursors-4u.net/cursors/cur-5/cur425.cur'), auto !important;}

		 /* Chrome, Edge, and Safari */

	*::-webkit-scrollbar {width: 18px;}

	*::-webkit-scrollbar-track {background: #000;}

	

	*::-webkit-scrollbar-thumb {

		background-color: #dc0d07;

		border-radius: 10px;

		border: 3px solid #dc0d07;

	}

</style>

<style>/* Profile Design Info */

    :root {

        --logo-blue: #dc0d07;

        --darker-blue: #d65615;

        --lighter-blue: #dc0d07;

        --even-lighter-blue: #000000;

        --lightest-blue: #000000;

        --dark-orange: #ffffff;

        --light-orange: #dc0d07;

        --even-lighter-orange: #000000;

        --green: #000000;

	}

    body

        {background: url("https://images2.imgbox.com/14/cb/S7bWpDvB_o.jpg");

background-position: left;

background-size: 100%;

background-repeat: no-repeat;

background-attachment: fixed;}

     

    .profile {background-color: #000; opacity: 0.80; color: #fff;}

    

	main {

        border-radius: 0 0 10px 10px;

        background: rgba(0,0,0, 0.80) !important;

padding: 0px 0px;

    }

	

	* {font-family: Monospace;}

	

	.container {

        border-radius: 15px 15px 0 0;

        overflow: hidden;

        margin-top: 30px;

        padding: 10px;

    }

    footer {

        border-radius: 15px;

        background: rgba(220,13,7) !important;

        color: #fff !important;

        display: block !important;

    }

	

	footer .links a{color: #ffffff !important;}

	

    footer .links a:hover{color: #ffffff !important;}

footer .copyright a{color: #ffffff !important;}

	

	.profile .contact,

    .profile .url-info,

    .profile .table-section,

    .home-actions {

        border: none;

    }

	

	a.addme {

        font-size: 2rem;

        font-weight: bold;

        margin-bottom: 15px;

        display: block;

    }

</style>

<style>/*Search Users Box (Background Color/Background Image)*/

    .top input{border-radius: 15px 15px 15px 15px;}

</style>

<style>/*Buttons (Background Color/Background Image)*/

    button{

    border-radius: 25px 25px 25px 25px !important;

	color: #dc0d07;

	font-weight: bold;

    background-color: #fff !important;

	}

</style>

<style>/* Logo & Navigation */

nav .top a{color: #fff;}

nav .top a:hover {color: #fff; !important;}

    nav {

        border-radius: 15px 15px 0 0;

        overflow: hidden;

    }

    

    nav .links a{

        color: #fff; !important;

        text-shadow: none !important;

font-weight: bolder;

    }

    

    nav .links a:hover {color: #fff; !important;}

    

    nav .links {

        text-align: center;

        padding: 3.5px 3.5px 5.5px 3.5px;

        font-size: 70%;

    }

</style>

    

<style>/* Links */

    a:hover {color: #fff;}

</style>

<style>/* Profile Header */

	main:before {

		width: 100%;

		height: 455px;

		display: block;

		content: "";

		background-image: url('https://images2.imgbox.com/e4/7f/1hcvIrwQ_o.jpg');

		background-position: center center;

		background-size: cover;

</style>

<style>/* Flip Profile */

    .profile{direction: rtl;}

.blog-preview{direction: ltr; text-align: center;}

    .blurbs{direction: ltr;}

    .friends{direction: ltr;}

    .general-info{direction: ltr;}

.profile .left h1{direction: ltr;}

    .details-table{direction: ltr;}

    .profile .table-section .heading{direction: ltr;}

    .details p{direction: ltr;}

	.mood{direction: ltr; text-align: right;}

.contact .heading {display: none !important;}

.url-info{direction: ltr; text-align: right;}

</style>

<style>/* Profile Name Header */

	@import url('https://fonts.cdnfonts.com/css/saira-condensed');

	.profile .left h1{ font-family: 'Saira Condensed', sans-serif; font-size: 40px; color: #ffffff; text-transform: uppercase; text-align: center; overflow-wrap: break-word;}

</style>

<style>/* Profile Picture & Online Icon */

	.details p {text-align: center; font-family: monospace; font-size: 15px; color: #ffffff;}

	.profile-pic {border-radius: 500px; overflow: hidden;}

.profile .mood {color: #dc0d07;}

	.mood {text-align: right;}

    .online {visibility: hidden;} 

    .online img { 

        content: url("https://ct.pimp-my-profile.com/online/26.gif"); 

        animation-name: none; 

        visibility: visible; 

        height: 15px; 

        width: 60px;

		display: block;

		margin-left: auto;

		margin-right: auto;

    }

.profile .url-info {color: #dc0d07;}

</style>   

<style>/* Headers Colors */

    .heading {

        padding: 5px 0 !important;

        margin-top: 15px;

        margin-bottom: 10px;

        background-color: #dc0d07 !important;

        color: #fff !important;

        text-align: center;

        border-bottom: 2px solid;

border-radius: 10px 10px 10px 10px;

    }

	

	.profile .blurbs .section h4{color: #dc0d07; font-weight: bolder;}

</style>

<style>/* Interests Table Info */

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

    table.details-table td {background-color: #000 !important;}

.details-table td:first-child {color: #dc0d07 !important;}

</style>

<style>/* Blog Info */

.blog-preview h4 {color: #fff;}

    .blog-preview p {

        background-color: none;

        padding: 5px 10px;

        border-radius: 10px;

        color: #fff;

font-weight: bolder;

    }

	

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

	

    .blog-preview p a:hover,

    .blog-preview p a:active,

    .blog-preview p a:focus{

        color: #fff !important;

    }

</style>

    

<style>/* Friends Info */

    .profile .friends .heading{color: #ffffff;}

.profile .friends{text-align: center;}

    .count {color: #dc0d07;}

    .profile .friends .person p{color: #fff !important;}

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

    .profile .friends .person img:not(.icon) {

        border-radius:15px;

        box-shadow: 1px 0px 7px 2px rgba(214, 86, 21, 0.71);

        border: 2px solid rgba(255,255,255);

    }

    

    .profile .friends .person img:not(.icon):hover {

        transform: scale(1.1);

        transition: 0.5s ease;

    }

    

    .profile .friends .person img:not(.icon) {transition: 0.5s ease}

</style>

<style>/* Comments Info */

    table.comments-table td {

        background-color: #000 !important;

        border: none;

    }

    .comments-table td:first-child img {

        width: 80px;

        border-radius: 500px;

    }

	

	.comments-table{

        display: block;

        height: 400px;

        overflow-y: scroll;

        border: none;

    }

</style>

<style>/* Custom Profile Headers */

.contact .heading{ font-size:0; }

.contact .heading:before{ content: "Contact Me"; font-size:.9rem; font-weight: bolder; }

.w-40 .table-section:nth-last-child(2) .heading h4{ font-size:0;}

.w-40 .table-section:nth-last-child(2) .heading:before{content: "â€¢ What I Like â€¢"; font-size:.9rem; font-weight: bolder; }

.w-40 .table-section:last-child .heading h4{ font-size:0; }

.w-40 .table-section:last-child .heading:before{ content: "â€¢ Follow Me â€¢"; font-size:.9rem; font-weight: bolder; }

.blog-preview h4{ font-size:0; }

.blog-preview h4 a{font-size:.8rem;margin-left:5px; }

.blog-preview h4:before{ content: "â€¢ My New Blogs â€¢"; font-size:.9rem; font-weight: bolder; }

.blurbs .heading{ font-size:0; }

.blurbs .heading:before{ content: "â€¢ My Life â€¢"; font-size:.9rem; font-weight: bolder; }

.blurbs .inner .section:nth-child(1) h4{ font-size:0; }

.blurbs .inner .section:nth-child(1) h4:before{ content: "About Me:"; font-size:.9rem; }

.blurbs .inner .section:nth-child(2) h4{ font-size:0; }

.blurbs .inner .section:nth-child(2) h4:before{ content: "Who I'd Like To Meet:"; font-size:.9rem; }

.friends .heading{ font-size:0; }

.friends .heading:before{ content: "â€¢ The Friends â€¢"; font-size:.9rem; font-weight: bolder;}

.friends#comments .heading{ font-size:0; }

.friends#comments .heading:before{ content: "â€¢ Leave Me A Comment â€¢"; font-size:.9rem; font-weight: bolder;}

</style></style>