Report Blog Entry
includes transparent middle background, epic face notif bell and icon thingys, pink skull cursor, headphone online indicator, and von dutch by charli xcx autoplay
feel free to alter anything u like, comment if using ! ^^
<!-- (c) Layout created by 击DESTROYA击 -->
<style>
@font-face {
font-family: 'blackside';
src: url(https://dl.dropbox.com/s/dbo8631uydhb45w/Blackside%5B1%5D.ttf);
}
@font-face {
font-family: starlight;
src: url(https://dl.dropbox.com/s/cfcp07kvx3qut4s/starlight.ttf);
}
/* main configs */
body{background:url("https://64.media.tumblr.com/d6bc560e81aa4e34a40d5d807d43f04c/4cda6a48a23a0b26-ca/s400x600/2e2d81c6c13b6b5f887852e5542cd0bcdda54484.jpg") no-repeat fixed; background-size:cover;
font-weight: light;
}
main {
background: none;
position: 700px;
box-shadow: 0px 0px 25px 8px rgba(0,0,0,0.75);
}
.profile-pic {
border-style: solid black;
border-width: 3px;
box-shadow: 0px 0px 19px 0px ;
}
/* name */
h1{
font-size: 30px !important;
font-family: courier !important;
padding-left: 2px !important;
color: white;
text-shadow: 0px 0px 2px red;
}
.table-section .heading{ font-size:10; }
.table-section .heading:before{ content: url();
}
/* section h4 */
.profile .friends .inner, .profile .blurbs .section h4{
text-align: center;
background-image: url("https://64.media.tumblr.com/a7ad67878a6631e2124f9dd1b6bcd89b/4cda6a48a23a0b26-17/s400x600/69301e788c741f1dde5fef57f3d312cdbf0b1fe7.jpg");
text-shadow: 0 0 9px red;
}
.profile .blurbs .section h4 {
font-family: courier;
text-transform:lowercase;
color: white;
text-shadow: 0 0 9px red;
border: 3px white;
}
/* right headings */
.profile .blurbs .heading, .profile .friends .heading {
color: white;
background-color:transparent;
text-transform:lowercase !important;
color: white;
}
/* left headings */
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
background-color: transparent;
color: white;
}
.contact .heading h4{
display:none !important;}
.contact .heading{ font-size:20px; }
.contact .heading:before{ content: url();
overflow:hidden;
}
.table-section .heading{ font-size:0; }
.table-section .heading:before{ content: url();
}
/* text configs */
h4 {
font-size: 12px !important;
color: white;
text-shadow: 0 0 9px red;
}
p {
font-family: starlight;
color: white;
text-transform:lowercase !important;
text-shadow: 0 0 9px red;
}
a {
font-family: courier !important;
font-size: 12px;
color: white;
}
a:hover {
color: black;
}
.count {
color: white;
text-shadow: 0 0 9px red;
}
.profile .friends .person p {
color: #black;
font-family: courier !important;
}
.profile .friends .person p:hover {
color: black;
}
/* blog */
DIV.blog-preview{
text-align: center;
background-image: url(https://64.media.tumblr.com/a632a63c918783e1bb34aefc4c15b242/4cda6a48a23a0b26-b6/s400x600/2cbe026a3a169a32469ccc7e0a102187e0404eb2.jpg);
text-transform:lowercase !important;
color: white;
-webkit-box-shadow: inset 0px 0px 51px 0px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 0px 51px 0px rgba(0,0,0,0.75);
box-shadow: inset 0px 0px 51px 0px rgba(0,0,0,0.75);
}
.contact .heading h4{
font-size:10px;
}
/* images */
.profile .friends .person img:not(.icon) {
box-shadow: 0px 0px 19px 0px rgba(255,255,255,0.3);
border-style: solid;
border-width: 10px;
border-image: url("https://64.media.tumblr.com/bcf81aedfbd9573b3305f81f5813e02f/4cda6a48a23a0b26-39/s400x600/be10b1743e100d662e98836a7184dc28fa58bb91.jpg") 60 fill round;
}
.online {
margin:auto;
padding-bottom: 7px;
content: url(http://dl10.glitter-graphics.net/pub/2115/2115990hjhdyc6bpf.gif);
}
.icon {
content: url(https://64.media.tumblr.com/d0ff4547b59be58e9e6c973ce6b194a1/4cda6a48a23a0b26-c8/s400x600/609275b01772da0757d61f8ad0bee22d47688fb5.pnj);
display: inline-block;
height: 2.0em;
width: 2.0em;
margin: 0 .05em 0 .1em;
vertical-align: -0.3em;
color: rgba(0,0,0,0);
}
/* contact configs */
.profile .contact {
background-color: rgba(171, 118, 207, 0.4);
}
.profile .contact {
border: white;
font-family: 'blackside';
background: transparent;
text-transform: lowercase;
}
.f-col{
border: 2px hotpink;
}
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add friend */
content: url();
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add 2 fav */
content: url()
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* chat */
content: url()
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* forward */
content: url()
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant msg */
content: url()
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block */
content: url()
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group */
content: url()
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url()
}
.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}
/* about, interests n comments details */
.profile .table-section .details-table td {
background: #FF0000;
border: 7px black;
-webkit-box-shadow: inset 0px 0px 51px 0px rgba(0,0,0,0.75);
-moz-box-shadow: inset 0px 0px 51px 0px rgba(0,0,0,0.75);
box-shadow: inset 0px 0px 51px 0px rgba(0,0,0,0.75);
}
.profile .friends .comments-table td {
background-color: black;
border: 7px red;
}
.comments-table td*{
}
.profile .comments-table .inner {
box-shadow: 0px 0px 19px 0px rgba(255,255,255,0.3);
}
.comments-table td:first-child img{
border-style: solid;
border-width: 10px;
border-image: url("") 60 fill round;
box-shadow: 0px 0px 19px 0px rgba(255,255,255,0.3);
}
.profile .comments-table .comment-replies{
background-color: hotpink;
border: none;
color: white;
}
.general-about .details{
padding: 2px;
background: darkred;
background-image: url("https://64.media.tumblr.com/259b7a886dd529470d7926db7947b647/4cda6a48a23a0b26-0f/s250x400/1e8763c96df447ebde0bd7319897865d24a09338.jpg");
background-size:cover;
}
/* nav bar */
nav{
font-size: 13px !important;
text-shadow: 1px 1px red;
text-transform:none;
padding-left:3px;
text-align: center;
}
nav .links {
background: rgb(28,27,27);
background: hotpink;
box-shadow: 0px 0px 35px 0px rgba(0,0,0,0.75);
filter: (1);
}
nav .links a:hover {
color: black;
}
nav .top{
/* has search bar logo n button */
background: rgb(28,27,27);
background: red;
}
/* the spacehey logo */
nav img.logo{
filter: brightness(100) saturate(100%);
}
.search-wrapper input[type=text] {
background: white;
font-family: starlight;
border: 3px hotpink;
}
button{
font-family: courier !important;
background: rgb(121,121,121);
background: linear-gradient(360deg, rgba(121,121,121,1) 83%, rgba(190,190,190,1) 94%);
color: red;
}
.profile .url-info {
border: none;
color: transparent;
font-size: 0.1px;
}
.profile .table-section {border: none;
}
/* general comments configs */
table.comments-table {
border: 2px inset pink;
}
footer {
color: white !important;
box-shadow: 0px 0px 25px 8px rgba(0,0,0,0.75);
text-decoration: underline !important;
text-decoration-style: dotted !important;
background: rgb(28,27,27);
background: red;
}
<style>
/*hides white box around comments table*/
.table.comments-table:{
border-color:transparent;}
</style>
<style>
h1{
animation: type 3s steps(27);
color: white;
font-size: 10px;
font-family: courier;
white-space: nowrap;
overflow: hidden;
}
@keyframes type{
0%{
width:0ch;
}
100%{
width:27ch;
}
}
@keyframes blink{
0%{opacity:1;}
50%{opacity:0;}
100%{opacity:1;}
}
body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgb(82 15 15 / 48%) 50%, rgb(0 0 0 / 0%) 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 4s;
animation-iteration-count: ;
animation-timing-function: ease-in-out;
}
.col, main, footer, nav::before, .online, nav .links, nav .top {
animation: float 4s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
<style>
/* for this box, you can add an image of your choice. it's right under the contact box. */
.url-info{
background: url('https://64.media.tumblr.com/bcf81aedfbd9573b3305f81f5813e02f/4cda6a48a23a0b26-39/s400x600/be10b1743e100d662e98836a7184dc28fa58bb91.jpg');
background-position: center;
border: var(--borders)!important;
height: 300px;
background-size:cover;
}
.url-info p{
opacity: 0.0;
}
.pfp-fallback{
filter: (1);
}
</style>
<style>
/*Put Your Comments In A Scroll Box*/
table.comments-table{
background-color:#800020;
display: block;
height: 300px!important;
overflow-y: scroll;
border-radius:15px;
border-color:red;
border-width: 3px;
}
</style>
<style>
img:hover , .url-info:hover , .online:hover {
animation: shake 1s;
animation-iteration-count: infinite;
}
@keyframes shake {
0% { transform: translate(1px, 1px) rotate(0deg); }
10% { transform: translate(-1px, -2px) rotate(-1deg); }
20% { transform: translate(-3px, 0px) rotate(1deg); }
30% { transform: translate(3px, 2px) rotate(0deg); }
40% { transform: translate(1px, -1px) rotate(1deg); }
50% { transform: translate(-1px, 2px) rotate(-1deg); }
60% { transform: translate(-3px, 1px) rotate(0deg); }
70% { transform: translate(3px, 1px) rotate(-1deg); }
80% { transform: translate(-1px, -1px) rotate(1deg); }
90% { transform: translate(1px, 2px) rotate(0deg); }
100% { transform: translate(1px, -2px) rotate(-1deg); }
}
</style>
<style>
.online {
animation: rotation 0s infinite linear;
}
@keyframes rotation {
from {
transform: rotate(0deg);
}
to {
transform: rotate(0deg);
}
}
</style>
<style>
/*Customize Scrollbar*/
::-webkit-scrollbar {
width: 8px;
height: 10px;}
::-webkit-scrollbar-thumb {
background: hotpink;}
::-webkit-scrollbar-track {
background: red;}
</style>
<iframe width="0" height="0" src="https://www.youtube.com/embed/cwZ1L_0QLjw?loop=1&autoplay=1&controls=0&start=0&playlist=cwZ1L_0QLjw&" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="">
</iframe>
<!-- (c) Layout created by zombieboycoal (https://layouts.spacehey.com/layout?id=37249) -->
<style>* {cursor: url(https://cur.cursors-4u.net/holidays/hol-4/hol337.cur), auto;}</style><a href="https://www.cursors-4u.com/cursor/2009/10/14/pink-skull-crossbones.html" target="_blank" title="Pink Skull Crossbones"><img src="https://cur.cursors-4u.net/cursor.png" alt="Pink Skull Crossbones" style="position:absolute; top: 0px; right: 0px;"/></a>
Comments
Displaying 0 of 0 comments ( View all | Add Comment )