South Park Goth Kids layout

Tags: south park;

Description:

A layout for nonconformists. Has a loading screen and autoplay music (Darkness Deep Inside from Stick Of Truth)

Preview:

click on the image for a larger preview

Code:

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

<style>

body {
    background: url(https://i.pinimg.com/736x/f0/a4/a9/f0a4a9511d3410b5fe72ee7b31811828.jpg
) no-repeat fixed;
    background-size: cover;
}


main:before {

	width: 100%;

	height: 300px ;

	display: block;

	content: "";

	background-image: url("https://media1.giphy.com/media/v1.Y2lkPTc5MGI3NjExdjFzemczc3VoZzQ3ZGVwaDQ2czF3dWZyM294MGJ6b2Y2ZjlmYTFuZCZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/3o6ZtdZaflPMovpYyI/giphy.gif");

	background-position: center center;

	background-size: cover;

}



main {
  background: #141414;
box-shadow: 0px 0px 25px 8px rgba(0,0,0,0.75);
}

.count {
  color: red;
}




a {
  color: white;
}

p {
color: white;

}

h1 {
color: white;

}

h2 {
color: white;

}

h3 {
color: white;

}

h4 {
color: white;

}

nav{ 

text-align: center;

    }

nav .links {
background: black;



}

nav .links a:hover {
color: red;
}
nav .top{
background: black;
}




.profile .table-section {
border: none;
}


footer {
color: white !important;
box-shadow: 0px 0px 25px 8px rgba(0,0,0,0.75);
background-color: black;
  } 






table.comments-table{
background: transparent;
display: block;
height: 300px!important;
overflow-y: scroll;
border-radius:15px;
border-color: black;
border-width: 3px;

}





.profile .table-section .details-table td {
background: black;
color: white;
}


.profile .friends .comments-table td {
background-color: black;
color: white;
}


.profile .blurbs .section h4 {
background-color: black;
color: white;
}

.profile .blurbs .heading, .profile .friends .heading {
color: white;
background-color: black;

}

.profile .contact .heading, .profile .table-section .heading, .home-actions .heading {
background-color: black;
color: white;
}


::-webkit-scrollbar {
    width: 8px;
    height: 10px;}

    ::-webkit-scrollbar-thumb {
    background: grey;}

    ::-webkit-scrollbar-track {
    background: black;}

.url-info{
    background: url("https://media4.giphy.com/media/v1.Y2lkPTc5MGI3NjExMXg3YjhudGcwM2g5aDdhMG8zdnVvOHN4Znd2am83eGVtaW9waDloeSZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/l0HlRNwIv6w4E3iIE/giphy.gif");
    background-position: center;
    border: var(--borders)!important;
    height: 300px;
    background-size:cover;
}


.url-info p{
    opacity: 0.0;
}


body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed; 
top: 0; 
left: 0; 
z-index: 100;
background-image: url('https://media4.giphy.com/media/v1.Y2lkPTc5MGI3NjExc3NvMGxicnNrY3U2bzY1MmxpMG91czhqdmhsanVqYXY2aHg5ZjFldiZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw/l2SpL1YmF8xtVavf2/giphy.gif');
background-size: cover;
background-repeat: no-repeat;
background-position: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>

<iframe width="0" height="0" src="https://www.youtube.com/embed/LBqh_RGTvf4?loop=1&autoplay=1&controls=0&start=0&playlist=LBqh_RGTvf4&&#x201D;title=" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen="&#x201D;&#x201D;">
/</iframe>

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 )

⛧⃝ tweek

1715473102

Using this looks amazing

Report Comment