My layout

Tags:
Description:

Preview:

click on the image for a larger preview
Code:

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

<style>

/*Intro GIF Animation (fade out)*/
  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/9693370476cee73ce5fad9f6ae2ce9b2/tumblr_n4e4kgtkwe1r2dgsfo1_500.gifv'); /*gif link here*/
    background-size: cover;
    background-repeat: no-repeat;
    animation: yourAnimation 4s ease 0s 1 normal forwards;
    pointer-events: none;
  }

@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }

/*whole body changes*/ 
  body {    
    background-image: url(https://cutewallpaper.org/21/emo-aesthetic-wallpapers/Emo-Aesthetic-Computer-Wallpapers-on-WallpaperDog.jpg);/*background for whole page*/
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    font-family: 'Courier New', monospace;
    height: 100%;
    color: #ffffff;
    h1: #ffffff;
    h2: #ffffff;
    h3: #ffffff;
    h4: #ffffff;
    li: #ffffff;
  }

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



<style>* {cursor: url(https://cur.cursors-4u.net/symbols/sym-6/sym597.cur), auto !important;}</style><a href="https://www.cursors-4u.com/cursor/2011/01/26/transparent-white-star.html" target="_blank" title="Transparent White Star"><img src="https://cur.cursors-4u.net/cursor.png" alt="Transparent White Star" style="position:absolute; top: 0px; right: 0px;"/></a> Hi i’m ivan, im 14 years old and im gender fluid 

<style>
.general-about{
  position: relative;
  margin-top: 30px;
}
.online {
    content: url(https://sillyblinkies.neocities.org/online/catonline.gif);
}
</style>

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

<style>
nav img.logo {
 
 content:url("https://media.discordapp.net/attachments/857624184989679626/1106952619576000602/450_Sem_Titulo_20230513113402.png");
    }
</style>

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

<style>
@font-face { font-family: "Digit"; src: url('https://dl.dropbox.com/s/kohddlup61s2qgb/Baby%20Doll.ttf'); 
}
body{
font-family: "Digit";
}
*, p, a, form, li, .links li:not(:last-child)::after, footer .links li:not(:last-child)::after {
   font-size: 10px !important; 
   color: black !important; 
   text-shadow: none !important; 
   letter-spacing: 1px;
}
body {
   background-color: #4F77AA;
}
.top, .links, .heading, footer, button {
   background-color: #4F77AA !important;
}
h1 {
   font-size: 45px !important;
   padding-left: 30px !important;
}
h4 {
   color: black !important;
}
a {
    font-size: 11px!important;
    letter-spacing: .1px;
}
p {
    font-size: 12px!important;
}
h2, h3, h4, h5, DIV.mood > P:nth-child(1) > B, P:nth-child(2) > B{
    letter-spacing: .3px;
    font-size: 18px!important;
    font-weight: normal !important;
}
.contact, .url-info, .table-section, .profile-info {
   border-color: #4F77AA !important;
}
td {
   background-color: white !important;
}
input, button:not(.logout-btn) {
   border: 1px groove #4F77AA !important;
}
.logo-fallback {
   height: 38px !important;
}
.contact .inner a img {
font-size: 0 !important;
}
.contact .inner a img:before {
font-size: 1em !important;
display: block;
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
/* add to friends */
content: url(https://media.discordapp.net/attachments/903364339464044575/1080140749984772186/986CCBFA-AF7E-43D4-86CC-DC634235FB99.gif)
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url(https://media.discordapp.net/attachments/903364339464044575/1080137725262438492/03C37ACB-0E34-4F64-A4C2-41B9FB98F519.gif)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url(https://media.discordapp.net/attachments/903364339464044575/1087693658918228008/IMG_9559.gif)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url(https://media.discordapp.net/attachments/903364339464044575/1090822930855899136/43D8BA88-10ED-4C94-AC5E-1F3AF0B1BCB8.gif)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url(https://media.discordapp.net/attachments/903364339464044575/1080140751402451034/31FD6E25-C2DB-4394-A07B-6BE981C52DF4.gif)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url(https://media.discordapp.net/attachments/903364339464044575/1080140750374846524/49E707C7-A8D7-47B2-A807-705F447F4A0F.gif)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url(https://64.media.tumblr.com/fd6b0a8d466a21203db95a9091009792/e2e6f25fca1c982f-f7/s75x75_c1/8d7d359ee1e9a3cc3e42d7c0b68001ab1c97ac32.gifv)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url(https://media.discordapp.net/attachments/903364339464044575/1090817746696155207/43FB04B0-123B-44E6-AC25-AA17F4D63A58.gif)
}
.search-wrapper input[type=text] {
    background-color: transparent !important;
    border: 2px solid black !important;
    color:black !important;
    border-radius: 10px !important;
}
button{
    border-radius: 10px !important;
    border: 0px solid black!important;
    font-family: var(--font-family) !important;
    background-color:rgba(0, 0, 0, 0.0) !important;
    color:var(--links)!important;
}
.profile-info{
    background: transparent;
    background-size: cover;
    border: transparent !important;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1px 1px;
    border-radius: 10px !important;
    margin-top: 10px;
}
.col.right:before {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 280px;
  background-image: url("https://www2.lunapic.com/do-not-link-here-use-hosting-instead/169083099578494301?54575803057");
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 260px;
  margin-top: 30px;
}
.mood:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 15px;
  background-image: url(https://64.media.tumblr.com/40c93aace51892dafab68a8e756b874f/9b7ddb5905533fa5-dd/s500x750/8aab1489730d6e990dafa3b1afca7a63791f50b6.gifv);
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 300px;
  border-radius: 10px;
}
.contact:after {
  content: "";
  white-space: pre-wrap;
  display: block;
  height: 15px;
  background-image: url(https://64.media.tumblr.com/1007a591631f170596efb781868d59f5/4ac6573ced922d14-ee/s1280x1920/196128b3a5918568503bec143f3e72e78e25220c.gifv);
  background-repeat: no-repeat;
  background-position-x: center;
  background-size: 300px;
  border-radius: 10px;
}
.url-info{display:none !important;
}
</style>





<img src="https://64.media.tumblr.com/e39036ecf9b7a15baaf09d002cb8d122/03e99a2aa37a7ed3-86/s100x200/247ba5e2f0150ec826c32f34ef0436e00c3df1e5.gifv"/>

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

<div class="snowflakes">

  <div class="snowflake">

   <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

  <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

  <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

  <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

  <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

  <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

    <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

    <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

    <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

    <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

  <div class="snowflake">

    <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>


  <div class="snowflake">

    <img src="https://gifcity.carrd.co/assets/images/gallery06/a341e6d7.gif?v=d7271437"/>

  </div>

</div>

<style>

/* customizable snowflake styling */

.snowflake {

  color: blue;

  font-size: 2em;

  font-family: Arial, sans-serif;

  text-shadow: 0 0 5px rgba(0,0,0,0.7);

}

@-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>
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 1 of 1 comments ( View all | Add Comment )
Eridan
1690938600
I was wondering If I could get this without the about me already filled out, and no blinkie?
Report Comment