my og layout 1

Tags:
Description:

for in case I want to go back to old profile
Code:

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

<style>

/*About Me Scrollbox*/
.profile .blurbs .inner {
    margin-left: 2px;
    margin-right: 2px;
    background-color: #FFFFFF;
    height: 500px;
    overflow: auto;
} 
 
  

    body
        {background: url("https://i.pinimg.com/564x/70/2c/e3/702ce39b954176354c3734df6a310541.jpg")
       
        
}
    .contact {
        
    background-image: url('https://i.pinimg.com/564x/16/9c/10/169c10c35a8574b9e9bbc4c5993117fb.jpg') !important;
    background-attachment: scroll !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: cover;
    border:2px  pink !important;   
        
    }</style>

<style>/* Profile Design Info */
  
  :root {
        --logo-blue: #ffd9ed;
        --darker-blue:#ffd9ed;
        --lighter-blue: #ffd9ed;
        --even-lighter-blue: #FFFFFF;
        --lightest-blue: #FFFFFF;
        --dark-orange: #FFFFFF;
        --light-orange: #ffd9ed;
        --even-lighter-orange: #FFFFFF;
        --green: #FFFFFF;
	}
.col.left h1:before{
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 102px;
  background-image: url(https://static.wikia.nocookie.net/cookierunkingdom/images/f/f1/Royal_margarine_proudly.png/revision/latest/scale-to-width-down/1000?cb=20230518115350);
  background-repeat: no-repeat;
  background-size: 125px;
}
.col.right:before {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 156px;
  background-image: url(https://i.pinimg.com/originals/e0/71/f5/e071f5354beb169c8c09181456020b90.gif);
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 350px;
}

main:before {
      background-image: url(https://i.pinimg.com/originals/9c/53/41/9c53416cb009dc41dd64ed5db3161e33.gif);
      background-position: center center;
      background-size: cover;
display: block;
content: "";
    width: 100%;
    height: 330px;
    border-radius: 10px;
    margin-bottom: 10px;
    margin-left: 8px;
  }
.mood:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 200px;
  background-image: url(https://i.pinimg.com/originals/56/d3/de/56d3de23960a948d43d05c2f7c849758.gif);
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 330px;

</style>




<style>
table, th, td {

  border: 0px solid;

     }

:root {

  --topic1: "<img src="https://external-media.spacehey.net/media/sI3HHiWh1WcgY2jfDcJ-cCcJyXV7G2ElaindAhAZOCA0=/https://splattacks.neocities.org/images/graphics/kirb.gif"/>";
  --topic2: "Music";
  --topic3: "Movies";
  --topic4: "Television";
  --topic5: "Books";
  --topic6: "<img src="https://external-media.spacehey.net/media/sI3HHiWh1WcgY2jfDcJ-cCcJyXV7G2ElaindAhAZOCA0=/https://splattacks.neocities.org/images/graphics/kirb.gif"/>";

 }

.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.details-table tr td:first-child p::after{
    
    
color:var(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px #ff87cb !important;
filter: brightness(95%) !important;
   
   
}
.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
  content: var(--topic1);
}
.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
  content: var(--topic2);
}
.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
  content: var(--topic3);
}
.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
  content: var(--topic4);
}
.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
  content: var(--topic5);
}
.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
  content: var(--topic6);
}
</style>



<style>
nav::before {
   content: "";
   background:  url(https://64.media.tumblr.com/99905a8514ea0b08913f65705171bdae/6e8ce5c7b45e5e0e-a4/s250x400/6ded16b6d184e6cf451851a87dd0dfdd191de793.png);
background-size: 200px;
    position: fixed;
    float: right;
    display: inline;
    bottom: 0;
    right: 5px;
    height: 196px;
    width: 195px;
    margin-bottom: 10px;
    margin-right: 5px;
</style>


<iframe width="0" height="0" src="https://www.youtube.com/embed/mtZW0xMvl2E//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>


<style>* {cursor: url(https://cur.cursors-4u.net/symbols/sym-6/sym596.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2011/01/26/pink-transparent-star.html" target="_blank" title="Pink Transparent Star"><img src="https://cur.cursors-4u.net/cursor.png" alt="Pink Transparent Star" style="position:absolute; top: 0px; right: 0px;"/></a>



<style>
@keyframes spin{
  from{ transform:rotate(0deg); }
  to{ transform:rotate(0deg); }
}
.general-about .profile-pic img{
  border-radius: 50%;
  animation: spin 7s infinite linear;
}
</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;}

}



.col, main, footer, nav::before, .online, nav .links, nav .top {

animation: float 4s;

animation-iteration-count: infinite;

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;

}

@keyframes float {

0% { transform: translate(0, 0px);

}

50% {

transform: translate(0, 8px);

}

100% {

transform: translate(0, -0px);

}



</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>
  
  .logo {
  
  content:url("https://cdn.discordapp.com/attachments/1111836147530874910/1134738469650976848/Untitled174_20230729004512.png")
  
  }
  
  </style>

<style>
.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 to Friends */
	content: "🎧"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* Add to Favorites */
	content: "🦴"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* Send Message */
	content: "🐾"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* Forward to Friend */
	content: "💌"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* Instant Message */
	content: "🍰"
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* Block User */
	content: "🦷"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* Add to Group */
	content: "🍮"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* Report Profile */
	content: "🥩"
}
</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.
Comments

Displaying 0 of 0 comments ( View all | Add Comment )