31 Minutos layout

Tags: autoplay, filter, floating, theme

Description:

31 minutos themed layout!! i love this show sm <3. comment if using, feel free to edit, and iif you want a layout, just comment!

Preview:

click on the image for a larger preview

Code:

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


<style>
  font-size: 150%;
}
h1,h2,h3,h4,h5{
  font-size: 200%; 
}
  body {
   background-image: url(https://wallpaperaccess.com/full/6183783.jpg);
    background-size: 3000px ;
 background-position: center center;
}
.profile {
   background-color: #FF6600 ; 
}
  .profile .blurbs .heading,
  .profile .friends .heading{
   background-color: #FFAB00 ;
   color: #FFAB00 ;
}

}

main:before {
    width: auto;
    margin-bottom: 25px;
    border: 3px solid black;
    height: 120px;
    display: block;
    content: "";
    background-image: url(Insert image link here);
    background-position: center center;
    background-size: cover;
}

footer {
    border-radius: 15px;
    background-image: url(insert image link here);
    color: #FFAB00;
}

table.comments-table td {
    color: #00 ;
}

:root {
    --logo-blue: #000;
    --darker-blue: #000;
    --lighter-blue: #000;
    --even-lighter-blue: #FF9100 ;
    --lightest-blue: #FF9100;
    --dark-orange: #FF9100;
    --light-orange: #FF9100;
    --even-lighter-orange: #FF9100;
    --green: #FF9100;
}
</style>

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

</iframe>

<style>
background-repeat: no-repeat;

background-position:center;

animation: yourAnimation 4s ease 0s 1 normal forwards;

pointer-events: none;}

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

.online {content:url(https://i1.glitter-graphics.org/pub/529/529581v0wkv3tmxo.gif); background-repeat: no-repeat; background-position: -15% 75%; z-index: 2; 

}


</style>

<style>

.contact .inner a img {

font-size: 0;

}

.contact .inner a img:before {

font-size: 1em;

}

.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 */

	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 */

	content: "📺";

} 

</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>
*{
  border-radius: 9px;
}
.profile .contact .heading, .profile .table-section .heading, .home-actions .heading{
  border-radius: 6px 6px 9px 9px;
}
</style>



<div class="lordfoogthetwost"></div>
<style>
.lordfoogthetwost {
background: url(https://cdn.getstickerpack.com/storage/uploads/sticker-pack/31-minutos/sticker_22.png?50a6ae2bc3be4853e2fae96c44b9ba1f) no-repeat;
background-size: 100%!important;
position: fixed;
right: 1100px;
bottom: 0px;
height: 270px;
width: 300px;
z-index: 1000;
}</style>

<div style="float:  ; max-height: 400px; position: fixed; right: 1px; bottom: 9px; z-index: 200;"><img src="https://cdn.getstickerpack.com/storage/uploads/sticker-pack/31-minutos/sticker_3.png?50a6ae2bc3be4853e2fae96c44b9ba1f" width="250" height="200"/></div>

<style>
.logo {
   content: url(https://cdn.discordapp.com/attachments/997257331681267722/1157111528412155904/spacehey.png?ex=65176b96&is=65161a16&hm=8fef3f86a45f322d4dfe1cecb08ff4c2b454f0af85ffaf365df6620b43afafc6&);
}
</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: 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>

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 )