Preview:
<style>
.container {
width: 100%;
max-width: 1600px;
}
</style>


<style>
main {
  background-color: transparent;
color: white;
  
}
</style>

<style>
h1, .count, .friends a p {
     color: white;
} 
</style>
<style>
body{background:url("https://images-wixmp-ed30a86b8c4ca887773594c2.wixmp.com/f/587caf08-d30d-4492-a90d-ca16fcec6aab/d3ho0tb-4660da4f-9b55-421f-95fd-3f71d64ef11e.jpg?token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJ1cm46YXBwOjdlMGQxODg5ODIyNjQzNzNhNWYwZDQxNWVhMGQyNmUwIiwiaXNzIjoidXJuOmFwcDo3ZTBkMTg4OTgyMjY0MzczYTVmMGQ0MTVlYTBkMjZlMCIsIm9iaiI6W1t7InBhdGgiOiJcL2ZcLzU4N2NhZjA4LWQzMGQtNDQ5Mi1hOTBkLWNhMTZmY2VjNmFhYlwvZDNobzB0Yi00NjYwZGE0Zi05YjU1LTQyMWYtOTVmZC0zZjcxZDY0ZWYxMWUuanBnIn1dXSwiYXVkIjpbInVybjpzZXJ2aWNlOmZpbGUuZG93bmxvYWQiXX0.RHW0zT9ZP7ikOdzFHkTq623kgkgX2VdChJdi62HGQkM") no-repeat fixed; background-size:cover;}
</style>

<style>
p {color: white;}
</style>

<style>
a {
  color: var(--white);
}

</style>

<style>
.profile .friends .person p{

    color: #fff;
}
</style>

<style>
 .blurbs .section h4{display: none !important;}
</style>

<style>
.profile .contact, .profile .table-section, .profile .url-info {
  border: 3px solid #25292A;
border-radius: 9px;
}
</style>

<style>
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
  background-color: #25292A;
  color: #bbb
border-radius: 4px;
}
</style>

<style>
.profile .table-section .details-table td {
  background-color: #25292A; 
  background-color: rgba(0, 0, 0, 0.5);
;
  color: #ccc;
border-radius: 7px;
}
</style>

<style>
.col.w-40.left .contact {background-color: #25292A; 
  background-color: rgba(0, 0, 0, 0.5);}
</style>

<style>
.profile .url-info{
background: url('https://i.postimg.cc/m287VjQ7/forgetamerie-ezgif-com-video-to-gif-converter.gif'); /*replace pic here*/
background-position: center;
background-size: cover;
border: var(--borders)!important;
border-radius: var(--curve);
height: 240px;
border: 3px solid #25292A;
border-radius: 15px;
 
} 
.url-info p{ opacity: 0.0; }
</style>

<style>
.profile .blurbs .heading, .profile .friends .heading {
  background-color: #25292A;
  color: #fff;
border-radius: 8px;
</style>

<style>
.profile .friends .comments-table td {
  background-color: #25292A; 
  background-color: rgba(0, 0, 0, 0.5);
border-radius: 6px;
}
</style>

<style>

  .inner .comments-table {border: 3px solid #25292A;
border-radius: 15px;}
</style>

<style>
table.comments-table{
display: block;
height: 300px!important;
overflow-y: scroll;
}
</style>

<style>
footer {background-color: #25292A; 
  background-color: rgba(0, 0, 0, 0.5);
border-radius: 50px;}
</style>

<style>.nav .top , nav .links{

background: #25292A; 
  background-color: transparent;
border-radius: 50px;

text-align: center;

}
</style>

<style>
/* banner */
main:before {
	width: 100%;
	height: 190px;
	display: block;
	content: "";
	background-image: url('https://i.postimg.cc/Y2T0X78K/forgetamerie-ezgif-com-crop-2.gif');
	background-position: center center;
	background-size: cover;
border-radius: 50px;
}
@media only screen and (max-width: 600px) {
	main:before{
		height: 200px;</style>

<style>
nav .top {background-color: #25292A; 
  background-color: rgba(0, 0, 0, 0.5);
border-radius: 15px;}
</style>

<style>
@import url("https://fonts.googleapis.com/css2?family=Nothing+You+Could+Do&display=swap");

.w-40 h1{
font-family: Nothing You Could Do;
font-size: 40px;
text-align: center;
background: -webkit-linear-gradient(#fff, #fff);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
-webkit-text-stroke: 1px white;
}
</style>

<style>
a:hover {
color: white;
text-transform: uppercase;
font-style: ;
</style>
 
<style>
nav .links a:hover {
color: white;
text-transform: uppercase;
font-style: ;
</style>
 
 



<style>.online { visibility: hidden; } .online img { content: url("https://i8.glitter-graphics.org/pub/1243/1243728ndvxbd9uih.gif"); animation-name: none; visibility: visible; height: 25px; width: 90px; }</style>

<style>
li.active .icon { content:url('https://gifcity.carrd.co/assets/images/gallery95/9e75373c.png?v=d55ea43d'); width: 20PX;height: 20px;}
</style>

<style>

.contact .inner a img {

font-size: 0;

}

.contact .inner a img:before {

font-size: 1em;

display: block

}

</style>

<style>
.col.right .profile-info { border: 4px solid #25292A;
  border-radius: 15px;}
</style>

 <style>
img:hover {
 
  transform: scale(1.1);
    transition: 0.8s ease;
 
 
  animation-iteration-count: infinite;
}
 
img {
    transition: 0.5s ease
}
 </style>

<style>
.profile-pic > img { display:none; }
.profile-pic:after { background-image: url("https://i.postimg.cc/QCfMFzYJ/rowannn-ezgif-com-crop.gif"); display: inline-block; content:"" }
.general-about .profile-pic:after { background-size: cover; width: 160px; height: 160px; } /* profile */ 
</style>
 
<style>
.profile-pic {
    background: #E4E4E4;
    padding: 11px 11px 200px;
filter: drop-shadow(6px 5px 10px #404040);
transform: rotate(4deg);
}
</style>
 
<style>
.profile-pic:hover {
    transform: scale(1.5);
    transition: 0.5s ease;
transform: rotate(8deg);
filter: drop-shadow(15px 8px 15px #404040);
}
.profile-pic {
    transition: 0.5s ease
}
</style>

<style>
td .comment-replies { border: 3px solid #25292A;
  border-radius: 15px;}  
</style>

<style>
.friends-grid img{border-radius:500px;}
</style>

<style>
.comments-table img{border-radius:500px;}
</style>

<style>
/* width */
::-webkit-scrollbar {
  width: 20px;

}
 
/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 4px black; 
background: rgba(0, 0, 0, 0.6);
  border-radius:7px;
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #25292A ; 
  border-radius: 6px;
}
 
/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #1a1d1d; 
}
</style>

<style>
img.logo {
 
 content:url("https://gifcity.carrd.co/assets/images/gallery10/b4f58ba7.gif?v=d55ea43d");
width: 40px !important;
height: 40px !important;
    }
</style>

<style>* {cursor: url("http://www.rw-designer.com/cursor-view/124054.png"), url("http://www.rw-designer.com/cursor-view/124054.png"), auto !important;}</style>

<style>
    .profile{
        
    direction: rtl;
    
    }
    .blurbs{
    
    direction: ltr;
        
    }
    .blog-preview{
        
    direction: ltr;
        
    }
    .friends{
    
    direction: ltr;
        
    }
    .general-info{
        
    direction: ltr;
        
    }
    .contact{
        
    direction: ltr;
    
    }
    .url-info{
        
    direction: ltr;
        
    }
    .details-table{
        
    direction: ltr;
        
    }
    .profile .table-section .heading{
    
    direction: ltr;
        
    }
    .details p{

    direction: ltr;

   }
   .mood{

       direction: ltr;

   }
</style>

<style>
@import url('https://fonts.googleapis.com/css2?family=Short+Stack&display=swap');
p{
  font-family: 'Short Stack', cursive;
  font-size: 130%;
}
h1,h2,h3,h4,h5{
  font-family: 'Short Stack', cursive;
  font-size: 130%;  
</style>

<style>
.friends-grid .person img{
filter: grayscale(100%) 
mix-blend-mode: overlay;
}
</style>

<style>
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://i.postimg.cc/CMc40rvJ/rowananjajbe-ezgif-com-video-to-gif-converter.gif');
background-size: cover;
background-repeat: 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>

<style>

.friends-grid .person {
filter: grayscale(100%);
</style>

<style>.inner .comments-table img{
filter: grayscale(100%);
</style>

<style>
details .mb8 {color: white;}
 
details {text-align: center}
 
@import url('https://fonts.googleapis.com/css2?family=Short+Stack&display=swap');
details .mb8{
  font-family: 'Short Stack', cursive;
  font-size: 200%;}
</style>
downloadDownload PNG downloadDownload JPEG downloadDownload SVG

Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!

Click to optimize width for Twitter