Layout Preview | FriendRewind

Name: FriendRewind
Author: FriendRewind
FriendRewind
← Back to Layouts
Avril Lavigne layout

Author: Vampireprincess
Category: Music
Created: August 9, 2025
Comments (0)

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

<style>
/* Generated by Visual Builder v3 */

@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P:wght@400;700&display=swap');

body {
  background-image: url("https://cdn.wallpapersafari.com/16/79/mjhHpU.jpg");
  background-size: cover;
  background-attachment: fixed;
  background-position: center center;
  color: #000000;
  font-family: 'Press Start 2P', sans-serif;
}

:root{--cd-image:url('https://fluorescent-lights.neocities.org/Digital-CD-Disk-Vector-Transparent-PNG.png');}
.profile-pic{position:relative;width:183px;filter:drop-shadow(0 0 0.25rem gray);} 
.profile-pic:after{content:"";background:url('https://fluorescent-lights.neocities.org/f0rzNHe.png'),linear-gradient(150deg,rgba(255,255,255,0.4),rgba(255,255,255,0.2) 40%,rgba(255,255,255,0.1) 0%,rgba(255,255,255,0.6));background-size:contain,cover;position:absolute;top:0;left:0;width:100%;height:100%;}
.profile-pic:before{content:"";background:var(--cd-image);position:absolute;top:5px;left:-20px;width:150px;height:150px;background-repeat:no-repeat;z-index:-1;animation:cdspin 5s linear infinite;transition:left .5s ease;}
.profile-pic:hover:before{left:-75px;}
@keyframes cdspin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.profile-pic .pfp-fallback{float:right;width:163px;height:160px;border:none;}
.general-about .profile-pic img{max-width:inherit;}

.profile-pic img{border-radius:50%;}

@keyframes boxFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}} .contact{animation:boxFloat 3s infinite ease-in-out;}

@keyframes boxFloat{0%,100%{transform:translateY(0);}50%{transform:translateY(-10px);}} .table-section, .friends, .blurbs, .section, .module, .profileInfo{animation:boxFloat 3s infinite ease-in-out;}

main::before {
    content: "";
    display: block;
    width: 100%;
    height: 300px;
    background-image: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcSTYG15ea_oNPyirNqi7ja8QrWHlWjO9OdZ5Q&s');
    background-size: cover;
    background-position: center center;
  }


.profile {
  background-image: url("https://i.pinimg.com/736x/3e/7e/ca/3e7ecaf1194bcdf822a16d525e299430.jpg") !important;
  background-repeat: repeat-y !important;
  background-size: 100% auto !important;
  background-position: top center !important;
}

nav, nav .top, nav .links {
  background-color: #2b333f;
}

.blurbs, .section, .module, .profileInfo, .table-section {
    background-color: #ffffff;
    border-radius: 8px;
  }

.contact {
    border: 5px solid #e63b7a !important;
    border-radius: 15px !important;
  }

.contact .heading {
    background-color: #e63b7a !important;
    color: #ffffff !important;
  }

.table-section, .friends, .blurbs, .section, .module, .profileInfo {
    border: 5px solid #e63b7a !important;
    border-radius: 15px !important;
  }

.table-section .heading, .friends .heading, .blurbs .heading, .section .heading, .module .heading, .profileInfo .heading {
    background-color: #e63b7a !important;
    color: #fff6f5 !important;
  }

h1, h2, h3, h4, h5, h6 {
  color: #000000;
}

a { color: #b92d5d; }

.contact {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

.url-info {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

.table-section {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

.tunes {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

.blog-preview {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

.blurbs {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

.friends {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

#comments {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}

.comments-table td {
  background-image: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRWJmeEMYcLWxqj2C_Kn0XjKbXmJsNpAKJ70A&s");
  background-size: cover;
  background-position: center center;
}</style>