Blank Frame layout

Tags: purple, horror, ps1, pixels, simple, cursor, logo, retro, cyber

Description:

Blank frame is a retro cybercore horror game, where you get trapped in your apartment! SPOILERS!!

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by Sam  (https://layouts.spacehey.com/layout?id=94865) -->

<style>* {cursor: url( https://i.postimg.cc/B6JFCL1B/2024-01-09-0r3-Kleki.png), auto;}</style><a href="" target="_blank" title="Seven Star Dragon Ball"><img src="https://i.postimg.cc/B6JFCL1B/2024-01-09-0r3-Kleki.png" alt="Seven Star Dragon Ball" style="position:absolute; top: 0px; right: 0px;"/></a>


<style>
  
  .logo {
  
  content:url(" https://i.postimg.cc/D0CWchxz/2024-01-09-0qq-Kleki.png ")
  
  }
  
  </style>


<style>

main:before {

width: auto;

margin-bottom: 1px;

border: 1px solid black;

height: 165px;

display: block;

content: "";

box-shadow: 0px 0px 10px 1px #cceeff;

background-image: url('https://i.pinimg.com/564x/3d/e3/55/3de355bbd0efc442179d26ef4779879f.jpg ');

background-position: center center;

background-size: 100;

}

</style>


<style>
.online{

content: url("https://i.postimg.cc/y8D1RVQp/2024-01-09-0qj-Kleki.png ") !important;
"
}

.award a{ font-size:0pt !important; }
.award a::before{ content: "" !important; font-size:9pt; }
.award::before {
display: inherit;
content: url(" https://i.pinimg.com/564x/3d/e3/55/3de355bbd0efc442179d26ef4779879f.jpg ") !important;
}


body{font-family: Courier New, monospace;}
{background-color: black;}
body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
.edit-info {
    background-color: black;
    border: 1px;
}
#q, button {
color: #f0f0f0;
background-color: black;
border: 1px solid grey;
font-family: inherit;
}
p, i, b, .count {
color: #f0f0f0 !important;
}
a, .profile .friends .person p, .logout-btn {
color: #f0f0f0 !important;
text-decoration: underline !important;
}
.container {
margin: 0 auto 0;
}
.icon {
display: none;
}
nav, nav .links a {
color: #f0f0f0;
}
nav .top {
margin-top: 2px;
background: none;
background-color: black;
border: 2px solid grey;
border-bottom: none;
}
nav .links {
background-color: black;
border: 2px solid grey;
}
nav img.logo{
    color: #f0f0f0;
}
body{
background-image:
url(https://i.pinimg.com/564x/79/e0/f1/79e0f13e769cb7d91894cc169f0445c7.jpg );

}

main {
background: black;
background-image:
url(https://i.pinimg.com/564x/20/91/2f/20912f01ac060d959cfaafb88e8ee9fe.jpg );

color: #f0f0f0;
border-left: 2px solid grey;
border-right: 2px solid grey;
}
.heading, .url-info {
color: #f0f0f0 !important;
background-image:
url( https://i.pinimg.com/564x/3d/e3/55/3de355bbd0efc442179d26ef4779879f.jpg);
background-color: black !important;
border: 2px solid grey !important;
}
.inner {
color: #f0f0f0 !important;
border: 2px solid grey;
border-top: none;
}
.profile-info {
border: 2px solid grey;
}
.profile-info .inner {
border: none;
}
.friends .inner {
border-bottom: none;
}
#comments {
border-bottom: 2px solid grey;
}
.profile .contact, .profile .table-section, .home-actions {
border: none !important;
}
.profile .contact .f-row:first-of-type {
margin-top: 0px;
padding-top: 7px;
}
.profile .blurbs .section h4 {
color: #f0f0f0 !important;
}
.details-table {
margin: 2px;
}
.details-table, td {
border: 1px solid grey;
border-collapse: collapse;
}
td {
color: #f0f0f0 !important;
background: none;
background-color: black !important;
} 
table.details-table {
max-width: 98%;
}
.profile h1 {
font-size: 20px;
}
footer {
background: black;
border: 2px solid grey;
}
footer p {
color #f0f0f0 !important;
}
.comments-table {
border: none;
border-collapse: collapse;
}
.comment-replies {
border: 1px solid grey;
margin: 2px;
}
nav .info {
background: none;
}
.profile .friends .person img:not(.icon):hover { 
        transform: scale(1.1);
        transition: 0.5s ease;
filter: grayscale(100%);
}
</style>

<style>
html:before {
  animation: grain 8s steps(10) infinite;
  background-image: url(https://i.ibb.co/d2Np1d2/static.gif);
  background-size: 200px !important;
  content: "";
  height: 300%;
  left: -50%;
  opacity:.2;
  position: fixed;
  top: -110%;
  width: 300%;
  pointer-events:none;
}
@keyframes grain {
  0%, 100% { transform:translate(0, 0) }
  10% { transform:translate(-5%, -10%) }
  20% { transform:translate(-15%, 5%) }
  30% { transform:translate(7%, -25%) }
  40% { transform:translate(-5%, 25%) }
  50% { transform:translate(-15%, 10%) }
  60% { transform:translate(15%, 0%) }
  70% { transform:translate(0%, 15%) }
  80% { transform:translate(3%, 35%) }
  90% { transform:translate(-10%, 10%) }
}
</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/xTWVNLWh/xrJOHy.gif ');
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center 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>

Copy and paste this code into the "About me" section of your Profile to use it.

Caution: This Layout was not inspected by SpaceHey — use it at your own risk.