Layout Preview | FriendRewind

Name: FriendRewind
Author: FriendRewind
FriendRewind
← Back to Layouts
layout from sph

Author: JvrrvsickFvrttt_
Category: >:[
Created: May 13, 2026
as stated
Comments (0)

No comments yet. Be the first!
You must log in to comment.
CSS Code

<style>
<style>

body {
    background-color: #e3e3e3;
    background: url(https://media3.giphy.com/media/v1.Y2lkPTZjMDliOTUyMWpiZjZ3ajF6ZW9xeXd5djJzOHV1ZDB4YTV2djg5NjkwdXYwMThiZyZlcD12MV9naWZzX3NlYXJjaCZjdD1n/j6fIR2VZFxKhdCYo7z/200w.gif);
    font-family: verdana, arial, sans-serif, helvetica;
}

body::before {
    content: " ";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(rgb(82 15 15 / 48%) 50%, rgb(0 0 0 / 0%) 50%);
    z-index: 2;
    background-size: 100% 2px, 3px 100%;
    pointer-events: none;
}

* {
    font-family: monospace;
    cursor: url(https://64.media.tumblr.com/d563e0636285b3919ed8b477d9bbdcac/9a5e59d4a20102aa-6d/s75x75_c1/a514a5c93521064070370e2d5e814740c469827f.gifv), url(https://64.media.tumblr.com/d563e0636285b3919ed8b477d9bbdcac/9a5e59d4a20102aa-6d/s75x75_c1/a514a5c93521064070370e2d5e814740c469827f.gifv), auto !important;
}

main {
    background: url(https://i.pinimg.com/474x/04/83/93/0483933….jpg) #0000007d;
    color: #0B65D9;
    padding: 6px 0px;
    font-size: 80%;
    background-size: cover;
    border: solid 3px #bc1419;
}

nav {
    color: #0B24D9;
    font-size: 72%;
    font-size: max(72%, 12px);
}
nav .links .special a {
    color: #ff0000;
}



.general-about .profile-pic {
    display: block;
    float: left;
    height: 150px;
    box-shadow: 0px 0px 15px #580BD9;
    border: #140BD9 double 5px;
}

.profile h1 {
    font-size: 2.7em;
    margin: 0 0 10px 0;
    font-family: fangsong;
    color: #000000;
}

.profile .friends .person img:not(.icon) {
    filter: grayscale(100%);
}

div.profile h1 {
    font-size: 2.5em;
    text-shadow: 2px 2px 0.5px #BB00DB;
    overflow: hidden;
    animation-name: example;
    animation-iteration-count: infinite;
    animation-duration: 1.4s;

}

a {
    color: #1E40AF;
    color: #648998;
    text-decoration: none;
    font-size: 10px;
}
p {
   font-size: max(0.875em, 14px);
}

nav .links a {
    text-decoration: none;
    color: #121047;
    font-size: 0.98em;
    font-size: max(0.98em, 12px);
}
div.profile h1 {
    font-size: 2.5em;
    text-shadow: 2px 2px 0.5px 
    overflow: hidden;
    animation-name: example;
    animation-iteration-count: infinite;
    animation-duration: 1.4s;
    text-shadow: 2px 2px 0.5px #ff0000;
}

b, strong {
    font-weight: bolder;
    color: #3b0094;
    font-size: 13.5px;
}

nav .links {
    background-color: #3b0094;
    background-color: #000000;
    padding: 3.5px 16px 5.5px 16px;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
    content: " ☆ ";
    color: #ff0202;

}

button, input {
    overflow: visible;
    background-color: #3b0094;
}

.inner {
       color: #6748DF !important;
    background: url(https://cdn.mos.cms.futurecdn.net/93LdnWN2G5p7XKPeDC9ShM.gif) #650b0b96;
    border: 6px double #000;
    background-color: #3b0000;
    background-color: #000000de;
    border-radius: 0px !important;
    box-shadow: 5px 8px #ba0000 !important;
    background-blend-mode: color;
    background-size: cover;
}

.details-table td {
    background: #DBEAFE;
    background: #312580;
    vertical-align: top;
    border-bottom: dashed #23375c;
    box-shadow: 2px 5px #5c2347;
    padding: 1px 12px 10px;
    border-spacing: 10px;
}


.details-table td p {
    margin: 0;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 12.5px;
}


.details-table {
    margin: 2px;
    border-spacing: 10px;
}

.comments-table td, .music-table td {
    background: #d3b8fc;
    background: #4c386b;
    vertical-align: top;
}

.comments-table td:first-child, .music-table td:first-child {
    background: #d3b8fc;
    background: #00000000;
    text-align: center;
    font-weight: bold;
    width: 29%;
}

.profile .blurbs .heading, .profile .friends .heading {
    background: #d3b8fc;
    background: #000000b3;
    color: #240194;
    color: #72878c;

    padding: 2px 7px;
    box-shadow: 4px 5px #0f0140;
    border: inset #00051c;
}

.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
    background: #60A5FA;
    background: #000000;
    color: #601414;
    padding: 2px 7px;
}

.profile .contact, .profile .url-info, .profile .table-section, .home-actions {
   width: 100%;
    border: 2px solid #60A5FA;
    border: 2px solid #122945;
    margin: 10px 0;
    background: url(https://64.media.tumblr.com/tumblr_me9cqjwDKa1qbm479o1_500.gif);
    background-blend-mode: color;
    background-size: cover;
    border: 9px double #000;
}

footer {
    text-align: center;
    font-size: 70%;
    margin: 10px 0 10px;
    padding: 10px 5px;
    background: url(https://file.garden/aVrYVu-I32YcFGz8/remina-img2.jpg) #59001ea6;
    background-size: auto;
    background-position: center;
    background-blend-mode: soft-light;
}

nav .links, footer .links {
    list-style: cambodian;
    margin-top: auto;
}

 .profile .blurbs .heading h4 {
    display: inline-block;
    font-size: 13.5px;
}


.profile .blurbs .section h4 {
    margin: 0;
    color: #ED0707;
    color: var(--dark-orange);
    font-size: 13px;
}


.details-table td:first-child {
    background: #BFDBFE;
    background: #520000;
    color: #1D4ED8;
    color: #000000;
    font-weight: bold;
    width: 33%;
    font-family: monospace;
    font-size: 3.5mm;
}

nav .top {
    background: #1D4ED8;
    background: url(https://file.garden/aVrYVu-I32YcFGz8/IMG_4087.gif) fixed repeat top;
    padding: 15px 10px 16px 10px;
    display: flex;
    background-size: cover;
    background-position: bottom;
}


.profile .url-info p {
    font-size: 100%;
    margin: 0;
    word-break: break-all;
    color: #8b8590;
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
    animation: float 3s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
}

.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 3s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 8px);
}
100% {
transform: translate(0, -0px);
}
.online img {
        content: url(https://64.media.tumblr.com/e8e32da722b70800fe7943ef29964013/25a5383a26de0a28-51/s100x200/22e21935c23f58a14df68cd244072c1ee82de352.gifv);}








div.scarletangel {
    background: url(https://i.imgur.com/3bkohfc.png);
    background-size: 100%!important;
    position: fixed;
    left: -701px;
    top: 100px;
    height: 320px;
    width: 320px;
    z-index: 100;
    opacity: 100%;
    background-blend-mode: color;
    background-color: #00000038;
}

div.mayura2 {
    background: url(https://i.imgur.com/4R6N5o9.png);
    background-size: 100%!important;
    position: fixed;
    left: 550px;
    bottom: 10px;
    height: 300px;
    width: 400px;
    z-index: 100;
    opacity: 100%;
}






.contact .inner a img {
        font-size: 0;
    }
    .contact .inner a img:before {
        font-size: 1em;
        display: block
    }
    .contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	    /* add to friends */
	    content: url("https://64.media.tumblr.com/39d12f494b1d12c0418c3376a47621fe/3fe4c2706e5d6a04-4e/s75x75_c1/db3dee7f8bdc11d1493dbd719b115b8eb0e71af4.gifv")
    }
    .contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	    /* add to favorites */
	    content: url("https://64.media.tumblr.com/ec41db978bff21c52c34f9fa50fbea75/a8a378b393f2415c-b4/s75x75_c1/034c261eeb9e5939039abd7cd6f2808721654930.gifv")
    }
    .contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	    /* send Message */
	    content: url("https://64.media.tumblr.com/cdb1a062c5b241ff54bda869be6b8fda/072f93d78594d9a6-ce/s75x75_c1/cd1f762c89a975fe5d6c1379a4812f15d8e03da8.gifv")
    }
    .contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	    /* forward to friend */
	    content: url("https://64.media.tumblr.com/39d12f494b1d12c0418c3376a47621fe/3fe4c2706e5d6a04-4e/s75x75_c1/db3dee7f8bdc11d1493dbd719b115b8eb0e71af4.gifv")
    }
    .contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	    /* instant message */
	    content: url("https://64.media.tumblr.com/4ebc06a9d6e50fffe3262071f5bf18b5/3fe4c2706e5d6a04-18/s75x75_c1/1c66b430dd5c44ebb37e1856f6910b93a7ce8948.gifv")
    }
    .contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	    /* block user */
	    content: url("https://64.media.tumblr.com/9514fdd886461875fe2f87dee8fa3adf/7c737a4fb030b56b-8d/s75x75_c1/c81eaeebef1cb9b98afdb09bcacfc67d4d98ac37.gifv")
    }
    .contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	    /* add to group */
	    content: url("https://64.media.tumblr.com/897c81c7be197898e44332b786946c0d/4d9ab15404ddfee1-cd/s75x75_c1/3f17315502213543bc2f847738eb65c5960973cb.gifv")
    }
    .contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	    /* report user */
	    content: url("https://64.media.tumblr.com/cdb1a062c5b241ff54bda869be6b8fda/072f93d78594d9a6-ce/s75x75_c1/cd1f762c89a975fe5d6c1379a4812f15d8e03da8.gifv")
    } 

div.contact:after {
    width: 98%;
    height: 30px;
    display: block;
    content: "";
    background-color: transparent;
    background-image: url(https://64.media.tumblr.com/231810d2b14bb8cbd0a3f717f3a3df3e/b2a4e94659fae40e-1d/s640x960/3e5e8d98a17f8328077e39ff55b23fd600ca8ae1.gifv);
    background-position: center;
    background-size: 242px;
    background-repeat: no-repeat;
}





.online {
    content: url(https://64.media.tumblr.com/bf47d42e5ae52f4c49497e3782ca9c12/005dbf061fabc0c8-6d/s250x250_c1/8807bd70d376c90b1309c6464833e9eb0fa6d238.gifv);
}



<---->


</style>

⠀


<!-- (c) Layout created by CAMSTARRS ☆ (https://layouts.spacehey.com/layout?id=26967) -->


<style>main:before {
	width: 100%;
	height: 125px ;
	display: block;
	content: "";
	background-image: url('https://64.media.tumblr.com/d08462e3f66c64b2a2fa216413a74d38/tumblr_onqtahSI3O1vhmslwo1_500.gif');
	background-position: center center;
	background-size: cover;
}
@media only screen and (max-width: 600px) {
	main:before{
		height: 200px;
	}
}</style>

<!-- (c) Layout created by Delovaya (https://layouts.spacehey.com/layout?id=107305) -->

<style>
.profile .url-info p:last-child:after {content: ""; display: block; background-image: url(https://media.tenor.com/HtkQRCop-ssAAAAj/minecraft-steve.gif);  width: auto; height: 150px; background-position: top center; background-size: 50%; background-repeat: no-repeat;}
.profile .url-info p {text-align: center;}
</style>

<!-- (c) Layout created by 𝖛𝖆𝖑𝖊𝖓𝖙𝖎𝖓𝖊 (https://layouts.spacehey.com/layout?id=84465) -->

<div style="float:  ; max-height: 200px; position: fixed; left: 25px; top: 6px; z-index: 300;">
<img src="https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/6db176ea-43fc-419e-b786-5bb3ee833976/dfsuidv-f361029c-28de-4513-8027-5f40cefc2041.gif?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzZkYjE3NmVhLTQzZmMtNDE5ZS1iNzg2LTViYjNlZTgzMzk3NlwvZGZzdWlkdi1mMzYxMDI5Yy0yOGRlLTQ1MTMtODAyNy01ZjQwY2VmYzIwNDEuZ2lmIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.rOaby85vduQbVrm777A1EzZwKmy6L_NpBYE0hpFHF74" height="360"/></div>
<style></style>

<!-- (c) Layout created by ᗡ˙∀ (https://layouts.spacehey.com/layout?id=27290) -->

<style>
  
  .logo {
  
  content:url("https://file.garden/aVrYVu-I32YcFGz8/Yamaha-SPX90-1-removebg-preview.png")
  
  }
  
  </style>



<style>

body:before {

content: " ";

height: 100vh;

width: 100vw;

display: block;

position: fixed; 

top: 0; 

left: 0; 

z-index: 100;

background-image: url(https://64.media.tumblr.com/925022eecb2b88a39dbf49ce8bdbb7f9/tumblr_nvv75kWO8y1ubpkvbo4_500.gifv);

background-size: cover;

background-repeat: no-repeat;

background-position:center;

animation: yourAnimation 1s ease 2s 1 normal forwards;

pointer-events: none;}

@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} } 

</style>

<!-- (c) Layout created by snoodle.doodle (https://layouts.spacehey.com/layout?id=105336) -->

<style>


.general-about{

  position: relative;

 margin-top: 30px;

}

.general-about .profile-pic::before{

  content: '';

  background: url('https://s7.ezgif.com/tmp/ezgif-7205bc2d5feff1ce.gif') no-repeat;

  background-size: cover;

  display: block;

  width: 100px;

  height: 60px;

  z-index: 999;

  position: absolute;

  top: -15px;

  left: -21px;




</style></style>