Layout Preview | FriendRewind

Name: FriendRewind
Author: FriendRewind
FriendRewind
← Back to Layouts
♡

Author: ryisnotonfire
Category: a
Created: May 18, 2026
Comments (0)

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

<style>
<style>
main:before {
width: 100%;
height: 350px;
display: block;
content: "";
background-image: url('https://64.media.tumblr.com/e4549463d8519c00c1b73d4e2803c42b/00c92659a3b507fc-27/s500x750/f8c01c3cfbd6e1d2356499031c298a456169f3e8.gifv');
background-position: center;
background-size: cover;
}
</style>

<style>
.image {
    background: url('https://64.media.tumblr.com/e073c96c78ef8c89ecc48177b1684eba/63d975079f5eab12-7b/s640x960/7b30d1098db8b6932cff6c125c09c46bbf1df9dc.png') no-repeat;
    background-size: 100%!important;
    position: fixed;
    right: 270px;
    bottom: 0px;
    height: 522px;
    width: 300px;
    z-index: 1000;
    opacity: 1;
}
@media (max-width: 600px) {
.image{display:none;}
}
</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://64.media.tumblr.com/94dec31b591cc69f51053fc3dae9bce5/15f971a63fd8b49d-ad/s400x600/dbc95396052a9d821f324d4bc28cd4d178e8197c.gifv);  width: auto; height: 150px; background-position: top center; background-size: 95%; background-repeat: no-repeat;}
.profile .url-info p {text-align: center;}
</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/fa3b8fbeaab9be4cd4a8567982210b27/ca501c1e7eaea209-a9/s640x960/66ead3d7439c61faefff198358b9fb97f0086c09.gifv');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 3s ease 0s 1 normal forwards;
pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }
</style>

<div class="image"></div>

<div class="snowflakes">
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<div class="snowflake"><img src="https://64.media.tumblr.com/531946e16c254d0f3f0982efadd14884/tumblr_inline_mkhtbi7qce1qz4rgp.png"/></div>
<style>
    @-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>

:root {
  --logo-blue: #296294 !important;
  --darker-blue: #40190B !important;
  --lighter-blue: #6FA4D1 !important;
  --even-lighter-blue: #A9CBEB !important;
  --lightest-blue: #DCEAF7 !important;
  --dark-orange: #40190B !important;
  --light-orange: #CCCCCC !important;
  --even-lighter-orange: #E0E0E0 !important;
}
</style>

<style>

body {

background: white url('https://i.pinimg.com/1200x/63/98/78/639878a8bffed31268aba11efa986f2c.jpg') no-repeat !important;
background-size: 1900px;
background-attachment: fixed;

}

main {

background-color: white !important;
background-size: cover;

}

</style>

<style> .contact img.icon {
display: none;
}
.contact{background-color: white !important;}
.contact .inner .f-row:nth-child(1)  .f-col:nth-child(1) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('http://i205.photobucket.com/albums/bb186/mhilkas/favoicons/favicon5.png');
background-size: 100% 100%;
}
.contact .inner .f-row:nth-child(1)  .f-col:nth-child(2) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('http://i205.photobucket.com/albums/bb186/mhilkas/favoicons/favmusic2.gif');
background-size: 100% 100%;
}
.contact .inner .f-row:nth-child(2)  .f-col:nth-child(1) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('https://static.tumblr.com/rltvkjt/kI1lmr3nc/dialogo_heart.gif');
background-size: 100% 100%;
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('https://64.media.tumblr.com/tumblr_ll7xswC47u1qi6qow.gif');
background-size: 100% 100%;
}
.contact .inner .f-row:nth-child(3)  .f-col:nth-child(1) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('https://wilardo.crd.co/assets/images/gallery23/eb8a11de.gif?v=b62e9456');
background-size: 100% 100%;
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('https://64.media.tumblr.com/2aac090b683592e96e8fcd70e853126a/9eaca2561814f8fa-8b/s75x75_c1/70dff2832b744f570df918a6f4161953e6c186d8.gif');
background-size: 100% 100%;
}
.contact .inner .f-row:nth-child(4)  .f-col:nth-child(1) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('https://64.media.tumblr.com/8f4af4bb3171945b648cf8f128b99854/558928f97b1d2545-2a/s75x75_c1/278625c877c1f95c2584779fd13680cee6aff8de.gifv');
background-size: 100% 100%;
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a::before{

content: "";
display: inline-block;
width: 15px;
height: 15px;
background-image: url('https://wilardo.crd.co/assets/images/gallery02/d5b7d47e_original.gif?v=d0e71742');
background-size: 100% 100%;
}
</style>

<style>

footer{
width: 100%;
height: 130px;
background: white url('https://i.pinimg.com/originals/99/57/2e/99572e8d64d926e6634dafbfb3b2209d.gif') no-repeat right / contain !important;
}

</style></style>