← Back to Layouts
Madoka Kaname

Name: FriendRewind
Author: FriendRewind
Author: 🐾 Nyxxie 🐾
Category: General
Created: September 13, 2026
Comments (1)

Corpse-princess2.0 23 mins ago
HOW CUTEEEEE
You must log in to comment.
CSS Code

<style id="fr-vb2">
/* VB2_STATE:{"cursorUrl":"","overlayUrl":"","overlayOpacity":0.2,"avatarAnimation":"","pageFont":"Bree Serif","useLiveProfile":true,"previewUrl":"/profile?id=4","pageBgImage":"","pageBgMode":"cover","heroImageUrl":"","profileRowBgImage":"","profileRowBgMode":"cover","navBgColor":"#935ba9","navBgImage":"","navBgMode":"cover","navLinkColor":"#ffffff","navLinkHover":"#66aaff","boxBgColor":"#ffffff","boxOpacity":1,"boxRadius":8,"contactHeaderBg":"#935b9f","contactHeaderText":"#ffffff","contactContentBg":"#ffffff","contactBorderColor":"#4169E1","contactBorderWidth":1,"contactBorderRadius":5,"contactBoxAnimation":"float","interestsHeaderBg":"#935b9f","interestsHeaderText":"#ffffff","interestsContentBg":"#ffffff","interestsBorderColor":"#DAA520","interestsBorderWidth":1,"interestsBorderRadius":5,"contentBoxAnimation":"float","textBody":"#eb05c1","textHeading":"#a267a0","textLink":"#0066cc","headingShadowColor":"#000000","headingShadowBlur":2,"headingShadowEnable":false,"moduleImages":{"contact":"","urlInfo":"","tableSection":"","tunes":"","blogPreview":"","blurbs":"","friends":"","Comments Background":"","comments":"https://friendrewind.com/uploads/gallery/23851/img_6aa6e9a5683357.29204105.webp"}} */
/* Generated by FriendRewind.com Visual Builder */

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

body, body.profile-page {
  color: #eb05c1 !important;
  font-family: 'Bree Serif', 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', 'Noto Sans', Arial, sans-serif !important;
}

@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, .module, .profileInfo{animation:boxFloat 3s infinite ease-in-out;}

.myspace-header .top-nav {
  background: #935ba9;
}

.myspace-header .main-nav-wrapper {
  background: #935ba9;
}

.contact {
    border: 1px solid #935b9f !important;
    border-radius: 5px !important;
  }

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

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

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

.profile, .table-section, .module, .blurbs, .section, .profileInfo, .friend-space, .badges-section, .url-info, .contact, .interests {
  color: #eb05c1 !important;
}

h1, h2, h3, h4, h5, h6, .table-section h4, .module h4, .blurbs h4, .section h4 {
  color: #a267a0 !important;
}

.comments-table td {
  background-image: url("https://friendrewind.com/uploads/gallery/23851/img_6aa6e9a5683357.29204105.webp") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
}
</style><style>


/* FR_MANUAL_EXTRAS */
</style><img src="/proxy/image.php?url=https%3A%2F%2Fpub-e0f0b5c621034cec9e9bbeea845826fb.r2.dev%2Fstamps%2F2026-09-08%2Ff36ab5ce-eee6-43ef-8824-65f1b7c450b5.gif" width="105" height="120" alt="sticker">


<div id="camera">
  <img class="camera-gif" src="/proxy/image.php?url=https%3A%2F%2Fcdn.imageurlgenerator.com%2Fuploads%2F1576f93e-2030-415b-aa07-d84438637a03.webp">

  <img class="camera-img" src="/proxy/image.php?url=https%3A%2F%2Fi.postimg.cc%2FhtPrXrZm%2FIlustrac-a-o-Sem-Ti-tulo.png">
</div><style>
#camera {
  position: fixed;
  top: 80px;
  left: 800px; /* Changed from 40px to 0 to align to the far left */
  width: 180px;
  z-index: 999;
}

.camera-gif {
  position: absolute;
  width: 95px;
  height: 80px;
  object-fit: cover;
  top: 170px;
  left: 24px;
  z-index: 1;
}

.camera-img {
  position: relative;
  width: 180px;
  height: auto;
  z-index: 2;
}
</style>

<style>

@import url('https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&display=swap');
.profile h1 { font-family: 'UnifrakturMaguntia'; text-align: center; font-size: xx-large; color:#C791C2 ; text-shadow: 2px 2px ##E6D3DD; }

body{
background: url(https://i.pinimg.com/736x/d1/3d/6f/d13d6f9aa616b9cdfc1419d6e1743593.jpg) no-repeat fixed;
background-size: cover;
text-transform: lowercase;
background-position-y: bottom;
}

background: -webkit-linear-gradient(#E6D3DD, #C791C2);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
body{
background: url(https://i.pinimg.com/736x/90/53/f7/9053f77bcee590f0a81408b5b6257ee2.jpg) no-repeat fixed;
background-size: cover;
text-transform: lowercase;
background-position-y: bottom;
}

nav .top{
margin-top: 10px;
background: url(https://i.pinimg.com/736x/c2/34/95/c234955743968729ceed90b40795a822.jpg);
    background-size: cover;
    background-position-y: 210px;
    border: 1px solid #E6D3DD;
    border-radius: 5px;
    box-shadow: 0 0 8px #C791C2;
  
}

nav .top .left .logo {
    width: 165px;
    height: 42px;
    filter: drop-shadow(2px 4px 6px #E6D3DD);
}

button, input {
    overflow: visible;
    background: #E6D3DD;
    color: #E6D3DD;
    border: none;
    box-shadow: 0 0 5px #C791C2;
    border-radius: 5px;
}

nav .links {
    background-color: transparent;
    padding: 3.5px 16px;
    text-align: center;
    margin-top: 10px!important;
    margin-bottom: 10px!important;
}

nav .links a {
    text-decoration: none;
    color: white;
    text-shadow: 0 0 2px #C791C2, 0 0 2px #C791C2, 0 0 2px #C791C2, 0 0 2px #C791C2, 0 0 2px #C791C2, 0 0 2px #C791C2;
    font-size: max(0.98em, 12px);
}

nav .links a:hover {
    text-decoration: underline;
    color: #C791C2;
}


nav .links .special a {
    color: #C791C2;
}

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

main{
background: url(https://i.pinimg.com/736x/41/0e/48/410e4864951c59d11608cf8b78c3d585.jpg);
    border: 1px solid #C791C2;
    box-shadow: 0 0 10px #C791C2;
    border-radius: 8px;
    color: E6D3DD;
    text-shadow: 1px 1px #C791C2;
    background-position-x: center;
;
}

nav .links a:hover {
    text-decoration: underline;
    color: #E6D3DD;
}

footer {
    text-align: center;
    font-size: 70%;
    margin: 10px 0 10px;
    padding: 10px 5px;
   color: #E6D3DD;
}

a {
    color: #E6D3DD;
    text-decoration: none;
}

.profile .blurbs .heading, .profile .friends .heading {
    background: #C791C2;
    color: #E6D3DD;
    border-radius: 8px;
    padding: 2px 7px;
    box-shadow: 0 0 10px #C791C2, 0 0 5px #E6D3DD;
}

.profile .contact, .profile .url-info, .profile .table-section, .setting-section, .home-actions {
    width: 100%;
    border: none;
    margin: 10px 0;
}

.profile .contact .heading, .profile .table-section .heading, .setting-section .heading, .home-actions .heading {
    background: #C791C2;
    color: #E6D3DD;
    padding: 2px 7px;
    box-shadow: 0 0 5px #C791C2, 0 0 10px #C791C2;
    border-radius: 8px;
}

.url-info{
background: url(https://i.pinimg.com/736x/3f/b0/c3/3fb0c397734111f86c2379287e0de34c.jpg);
    height: 256px;
    font-size: 0px;
    background-size: cover;
    border-radius: 8px;
    border: 1px solid white !important;
    box-shadow: 0 0 11px 4px #C791C2;

}

.icon, .award img {
    display: inline-block;
    height: 1.4em;
    width: 1.4em;
    aspect-ratio: 1/1;
    margin: 0 0.05em 0 0.1em;
    vertical-align: -0.3em;
    color: #E6D3DD;
    filter: brightness(10);
}

.details-table td:first-child {
    background: #C791C2;
    border-radius: 8px;
    color: #E6D3DD;
    font-weight: bold;
    width: 33%;
    box-shadow: 0 0 10px #C791C2, inset 3px 5px #C791C2, inset -7px -9px #C791C2;
    padding: 11px;
}

.details-table td {
    background: #C791C2;
    vertical-align: top;
    border-radius: 8px;
    box-shadow: 0 0 10px #C791C2, inset 5px 6px #C791C2, inset -5px -7px #C791C2;
    padding: 14px;
}

.profile-info{
background: url(https://i.pinimg.com/736x/90/7d/ef/907defe37105de8e7462a685c5bf4c7b.jpg);
    background-position-y: -104px;
    height: 120px;
    border: 1px solid #C791C2;
    border-radius: 8px;
    box-shadow: 0 0 10px #C791C2;
    background-size: cover;
}

.profile .blurbs .section h4 {
    margin: 0;
    color: #E6D3DD;
    text-transform: uppercase;
}

.count {
    color: #E6D3DD;
}

.profile .friends .person p {
    color: inherit;
    font-weight: bold;
    width: 100%;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 100%;
    text-align: center;
}

img.pfp-fallback {
    border: 1px solid #C791C2;
    box-shadow: 0 0 10px #C791C2;
    border-radius: 8px;
}

::-webkit-scrollbar {
    width: 12px;
    background-color: #E6D3DD;
}

::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px #E6D3DD
    background-color: #C791C2;
}

::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px #E6D3DD;
    border-radius: 10px;
    background-color: #C791C2;
}

.profile .friends .person img:not(.icon), .comments-table td:first-child img:not(.icon) {
    max-width: 95px;
    max-height: 95px;
    display: block;
    margin: 0 auto;
    filter: sepia(1) hue-rotate(295deg) brightness(1.1);
}
     .online {
        content: url("https://i.pinimg.com/736x/45/cc/a6/45cca6f5efe3dba89f12c2911152e6ec.jpg");
  content-position: center;
   width: 100px;
  height: 50px;

.online{
  animation: shake 3.5s;
  animation-iteration-count: infinite;
width: 26px;
  height: 26px;
}
}

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

.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);
}


<style>
    .general-about .profile-pic img {
        border-radius: 20px;
        animation: bounce 3s infinite alternate; 
    }

    @keyframes bounce {
        0% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-10px); 
        }
        100% {
            transform: translateY(0);
        }

</style>

<style>
    .artist-name{
      display: none;
    }

    .track-info:after {
      content: '[song] - [artist]';
    }
   .contact {

  border-radius: 25px;

  background: url(https://i.pinimg.com/1200x/3c/73/98/3c73986a86826c86960b50ce41ff8186.jpg);

  background-position: left top;

  background-repeat: repeat;

  padding: 0px;

  width: 250px;

  height: 150px;

  color: insert color!important;

}

</style>



<style>

.profile .friends .person img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/90zG2tXs/911-sin-t-tulo-20240530180740.png );-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}

</style>

<style>



.comments-table td:first-child img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/90zG2tXs/911-sin-t-tulo-20240530180740.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}


<style>

.contact .inner a img {
  font-size: 0;
}
.contact .inner a img:before {
  font-size: 1em;
  display: block
}
.contact .inner a:before {
  content: ""
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
  /* add to friends */
  display: inline-block;
  background: url("https://i5.glitter-graphics.org/pub/638/638145bltz6zqhdo.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
  /* add to favorites */
  display: inline-block;
  background: url("https://i6.glitter-graphics.org/pub/638/638146kvkkfs33zm.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
  /* send Message */
  display: inline-block;
  background: url("https://i10.glitter-graphics.org/pub/1065/1065500cl3si27n8p.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
  /* forward to friend */
  display: inline-block;
  background: url("https://i5.glitter-graphics.org/pub/553/553525locp67mrqu.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
  /* instant message */
  display: inline-block;
  background: url("https://i10.glitter-graphics.org/pub/1073/1073020lz9hw5tluj.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
  /* block user */
  display: inline-block;
  background: url("https://i6.glitter-graphics.org/pub/1864/1864126gg6pk5sjxk.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
  /* add to group */
  display: inline-block;
  background: url("https://i5.glitter-graphics.org/pub/1823/1823285xkz7w3dlz4.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
  /* report user */
  display: inline-block;
  background: url("https://i4.glitter-graphics.org/pub/1595/1595794joznotovno.gif")no-repeat 0 0;
  background-size: 100%;
  width: 16px;
  height: 16px;
}
<style>

   .contact {

  border-radius: 25px;

  background: url(https://i.pinimg.com/736x/5f/73/32/5f7332e54d094a604bbaacd6a1932cef.jpg);

  background-position: left top;

  background-repeat: repeat;

  padding: 0px;

  width: 250px;

  height: 150px;

  color: insert color!important;

}

<div class="snowflakes">
<div class="snowflake"><img src="https://files.catbox.moe/3ozzaa.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/xdhc73.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/d375rz.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/mlw3g4.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/twn9av.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/hf4ztv.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/sytodu.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/sytodu.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/3ozzaa.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/hf4ztv.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/xdhc73.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/twn9av.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/d375rz.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/mlw3g4.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/twn9av.png"/></div>
<div class="snowflake"><img src="https://files.catbox.moe/hf4ztv.png"/></div>
</div>


<style>
.snowflake {
font-size: 16px;
}
    @-webkit-keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@-webkit-keyframes snowflakes-shake{0%,100%{-webkit-transform:translateX(0);transform:translateX(0)}50%{-webkit-transform:translateX(80px);transform:translateX(80px)}}@keyframes snowflakes-fall{0%{top:-10%}100%{top:100%}}@keyframes snowflakes-shake{0%,100%{transform:translateX(0)}50%{transform:translateX(80px)}}.snowflake{position:fixed;top:-10%;z-index:9999;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;cursor:default;-webkit-animation-name:snowflakes-fall,snowflakes-shake;-webkit-animation-duration:10s,3s;-webkit-animation-timing-function:linear,ease-in-out;-webkit-animation-iteration-count:infinite,infinite;-webkit-animation-play-state:running,running;animation-name:snowflakes-fall,snowflakes-shake;animation-duration:10s,3s;animation-timing-function:linear,ease-in-out;animation-iteration-count:infinite,infinite;animation-play-state:running,running}.snowflake:nth-of-type(0){left:1%;-webkit-animation-delay:0s,0s;animation-delay:0s,0s}.snowflake:nth-of-type(1){left:10%;-webkit-animation-delay:1s,1s;animation-delay:1s,1s}.snowflake:nth-of-type(2){left:20%;-webkit-animation-delay:6s,.5s;animation-delay:6s,.5s}.snowflake:nth-of-type(3){left:30%;-webkit-animation-delay:4s,2s;animation-delay:4s,2s}.snowflake:nth-of-type(4){left:40%;-webkit-animation-delay:2s,2s;animation-delay:2s,2s}.snowflake:nth-of-type(5){left:50%;-webkit-animation-delay:8s,3s;animation-delay:8s,3s}.snowflake:nth-of-type(6){left:60%;-webkit-animation-delay:6s,2s;animation-delay:6s,2s}.snowflake:nth-of-type(7){left:70%;-webkit-animation-delay:2.5s,1s;animation-delay:2.5s,1s}.snowflake:nth-of-type(8){left:80%;-webkit-animation-delay:1s,0s;animation-delay:1s,0s}.snowflake:nth-of-type(9){left:90%;-webkit-animation-delay:3s,1.5s;animation-delay:3s,1.5s}.snowflake:nth-of-type(10){left:25%;-webkit-animation-delay:2s,0s;animation-delay:2s,0s}.snowflake:nth-of-type(11){left:65%;-webkit-animation-delay:4s,2.5s;animation-delay:4s,2.5s}
</style>

<style>
/* banner */
main:before {
	width: 100%;
	height: 170px;
	display: block;
	content: "";
	background-image: url('https://i.pinimg.com/1200x/3f/76/eb/3f76eb75ed4d0bb197cb436702dae94c.jpg');
	background-position: center center;
	background-size: cover;
}
@media only screen and (max-width: 600px) {
	main:before{
		height: 200px;
</style></style></style></style></style>