← Back to Layouts
Pink summer layout

Name: FriendRewind
Author: FriendRewind
Author: Heidi.mp3
Category: Pink
Created: August 3, 2026
Ummm... Its pink ig?
Comments (0)

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

<style>
<style>

/* =========================
   🌸 RESET / WIDTH FIX (THE IMPORTANT PART)
========================= */

* {
  box-sizing: border-box !important;
}

html, body {
  overflow-x: hidden !important;
  max-width: 100% !important;
}

/* 👇 THIS fixes the “too wide profile” bug */
main, .profile {
  max-width: 900px !important;
  margin: 0 auto !important;
}


/* =========================
   🌸 GLOBAL SETTINGS
========================= */

body, body.profile-page {
  background-image: url(https://i.pinimg.com/736x/da/8b/eb/da8beb9594ab9dfcf90e1f357976b2b5.jpg) !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-position: center center !important;
  font-family: 'Playfair Display', sans-serif !important;
  color: #e75480 !important;
}

/* ALL TEXT */
body, p, span, div, li, a,
h1, h2, h3, h4, h5, h6,
.status, .mood, .status-text, .mood-text {
  color: #e75480 !important;
  text-shadow:
    0 0 4px rgba(255,255,255,0.7),
    0 0 6px rgba(255,255,255,0.45) !important;
}

/* NO GLOW ON MEDIA */
audio, audio *, iframe, iframe * {
  text-shadow: none !important;
}


/* =========================
   🧍 PROFILE PIC + ✨ SPARKLES
========================= */

.profile-pic {
  position: relative;
  width: 180px;
  height: 180px;
  display: inline-block;
  overflow: hidden;
}

.profile-pic img {
  position: absolute;
  top: 9% !important;
  left: 7.6% !important;
  width: 84% !important;
  height: 85% !important;
  object-fit: cover;
  z-index: 1;
  clip-path: inset(2.2% 2.6% 3.2% 2% round 16% 20% 22% 16%) !important;
}

/* REMOVE STICKER */
.profile-pic::after {
  display: none !important;
}

/* ✨ FIXED SPARKLES */
.profile-pic::before {
  content: "XOXO";
  position: absolute;
  inset: 0px;
  color: #ff6f91;
  font-size: 16px;
  letter-spacing: 8px;
  opacity: 0.8;
  z-index: 5;
  animation: sparkleFloat 88s linear infinite;
  pointer-events: none;
}

@keyframes sparkleFloat {
  0% { transform: rotate(0deg) translateY(0px); }
  50% { transform: rotate(4deg) translateY(-2px); }
  100% { transform: rotate(0deg) translateY(0px); }
}


/* =========================
   🖼️ HEADER
========================= */

main::before {
  content: "" !important;
  display: block !important;
  width: 100% !important;
  height: 300px !important;
  background-image: url(https://i.pinimg.com/1200x/4e/e2/48/4ee24823fa6fe821f52ca8a7b164a407.jpg) !important;
  background-size: cover !important;
  background-position: center center !important;
}


/* =========================
   👤 PROFILE BACKGROUND
========================= */

.profile {
  background-image: url(https://i.pinimg.com/736x/6c/e5/86/6ce58625ad86764abaa85558c195f8ce.jpg) !important;
  background-size: cover !important;
  background-position: top center !important;
}


/* =========================
   👯 FRIENDS BOX
========================= */

.friends {
  background-image: url(https://i.pinimg.com/736x/de/75/dd/de75ddc2663e793dca2c51c8f8cdf6eb.jpg) !important;
  background-size: cover !important;
  background-position: center !important;
}

.friends,
.friends * {
  color: #ff6f91 !important;
  text-shadow:
    0 0 3px rgba(255,255,255,0.9),
    0 0 6px rgba(255,255,255,0.6) !important;
}


/* =========================
   📤 SHARE PROFILE
========================= */

.share,
.share-profile,
.shareProfile,
.share-this-profile {
  color: #e75480 !important;
  text-shadow: 0 0 4px rgba(0,0,0,0.45) !important;
}


/* =========================
   🔗 LINKS
========================= */

a, .profile a, .table-section a, .module a {
  color: #e75480 !important;
}


/* =========================
   ✉️ CONTACT BOX
========================= */

.contact {
  border: 1px solid #e75480 !important;
  border-radius: 5px !important;
  background-image: url(https://i.pinimg.com/736x/0e/d8/2b/0ed82bb5b156ae42f6ae73712521c722.jpg) !important;
  background-size: cover !important;
  background-position: center !important;
}


/* =========================
   💬 COMMENTS BOX
========================= */

#comments,
.comments-table td {
  background-image: url(https://i.pinimg.com/736x/bf/72/73/bf727384320f169fa0d0a383ff3feeca.jpg) !important;
  background-size: cover !important;
  background-position: center !important;
}


/* =========================
   📦 BOXES
========================= */

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

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

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


/* =========================
   🎨 OTHER BACKGROUNDS
========================= */

.url-info {
  background-image: url(https://i.pinimg.com/736x/e6/27/a6/e627a6f1ec5b5953e92ba0108c9a629b.jpg) !important;
}

.table-section {
  background-image: url(https://i.pinimg.com/736x/eb/29/75/eb2975214d4656ddcf2d989708fe7e97.jpg) !important;
}

.tunes {
  background-image: url("https://i.pinimg.com/1200x/f9/6d/dc/f96ddc960ffcfe6120a169174b42e53c.jpg") !important;
}

.blog-preview {
  background-image: url(https://i.pinimg.com/1200x/a3/68/0c/a3680cafd4320993a924389a6cefa230.jpg) !important;
}

.blurbs {
  background-image: url(https://i.pinimg.com/736x/0c/d5/cc/0cd5cc1d5e55bb2398d25a23eb54054f.jpg) !important;
}


/* =========================
   🧭 NAV
========================= */

.myspace-header .top-nav,
.myspace-header .main-nav-wrapper {
  background-size: cover !important;
  background-position: center !important;
}

.myspace-header .top-nav {
  background-image: url(https://i.pinimg.com/736x/8a/e7/f2/8ae7f2210526b6e8880c4508ce5e1814.jpg) !important;
}

.myspace-header .main-nav-wrapper {
  background-image: url(https://i.pinimg.com/736x/54/0a/55/540a55b146070c37918a01fffa9ef677.jpg) !important;
}

</style></style>