dark style

Tags: #goth #scary #css
Description:

If your into dark scary things this is the css for u!! ( it might work its kinda outdated.
Preview:

click on the image for a larger preview
Code:

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

}
.fwiendFace:hover {
    border-radius: 5px;
    transform: scale(1.2);
    background: url(https://pa1.narvii.com/6803/26f8c3b84f4c2b9571e48b4970a34691c925f281_128.gif);
    animation: wob .5s linear infinite;
    box-shadow: 0 0 1rem #ff0400;
    border: 1px solid #ff0400;
    transition: 0.5s;
}
.songName {
    overflow: hidden;
    background: linear-gradient(#ff0400, #000);
    border-radius: 3px;
    margin-top: 0px;
    font-size: small;
    box-shadow: 0px 4px 6px -5px #333;
    text-shadow: 0px -2px #333;
    color: white;
    padding: 5px;
}
* {
    color: #fff;
}
.songName {
    white-space: nowrap;
}
.songName b {
    display: none;
}
.songTitle:after {
    content: ".mp3";
}
@keyframes marquee {
0% {
    text-indent: 100%;
}

100% {
    text-indent: -180%;
 }
}
.songTitle {
    display: block;
    animation: marquee 20s linear infinite;
}
.player {
    background: #000;
    border: 3px solid #000;
    border-radius: 4px;
    padding: 0;
}
@media only screen and (max-width: 768px)
.topLeft, .topRight {
    width: auto;
    float: none;
}
@keyframes fadein {
0% {
    opacity: 0;
}

10% {
    opacity: 0;
}
100% {
    opacity: 1;
 }
}
.topRight {
    -webkit-animation: none 8.5s;
}
.topLeft {
    -webkit-animation: none 5s;
}
.logo::before {
    margin-right: 0px;
    display: inline-block;
    height: 24px;
    width: 24px;
    content: "";
    background: url() no-repeat 0 0;
    background-size: 24px 24px;
}
.logo::after {
    margin-right: 0px;
    display: inline-block;
    height: 24px;
    width: 24px;
    content: "";
    background: url() no-repeat 0 0;
    background-size: 24px 24px;
}
div#hSub {
    color: #ff0400;
}
div.boxInfo.box {
    border: 1px dashed #ff0400;
}
.boxInfo {
    border: 1px dashed #ff0400;
    margin-bottom: 20px;
    margin-top: 20px;
}
.blog {
    background-color: #000;
    border: 1px solid #000;
}
p {
    color: #fff;
}
div#hSub a {
    letter-spacing: 5px;
}
#header a:not(.logo) {
    margin-left: 10px;
    color: #fff;
    font-size: small;
    text-decoration: none;
    font-family: Courier New;
}
#imgPreview img {
    width: auto;
    height: auto;
    max-height: calc(100% - 10px );
    max-width: 100%;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border: 0px solid #fff;
    cursor: zoom-out;
    background: url(lll);
}
#sMsg::after {
    content: "𝖘𝖍𝖔𝖔𝖙 𝖒𝖊 𝖆 𝖒𝖊𝖘𝖘𝖆𝖌𝖊";
    font-size: 15px;
}
#sMsg {
    font-size: 0px;
    color: #fff;
}
#add::after {
    content: "𝖉𝖔𝖓\'𝖙 𝖇𝖊 𝖘𝖍𝖞 𝖏𝖔𝖎𝖓 𝖒𝖞 𝖈𝖚𝖑𝖙";
    font-size: 15px;
}
#add {
    font-size: 0px;
    color: #fff;
}
.topRight &gt; .blurbs.box &gt; .blogs &gt; div &gt; b::after {
    font-size: 15px !Important;
    content: "𝖌𝖔𝖔𝖉 𝖔𝖑𝖉 𝖇𝖑𝖔𝖌𝖘";
    animation: test 1s linear infinite;
}
.topRight &gt; .blurbs.box &gt; .blogs &gt; div &gt; b {
    font-size: 0px !Important;
}
#viewFriends {
    display: none;
}
.fwiendCounter&gt;b::after {
    content: " 𝖈𝖚𝖑𝖙 𝖒𝖊𝖒𝖇𝖊𝖗𝖘";
    font-size: 15px;
    color: #fff;
}
.fwiendCount {
    color: #fff;
    font-size: 15px;
}
.fwiendCounter&gt;b {
    font-size: 0px;
    color: #fff;
}
.fwiendCounter&gt;b&gt;.uName {
    font-size: 0px;
    color: #fff;
}
.topRight &gt; .box:not(.blurbs) &gt; .rightHead &gt; b::after {
    content: "";
 font-size: 15px;
    color: #fff;
}
.topRight &gt; .box:not(.blurbs) &gt; .rightHead &gt; b &gt; span.uName {
    font-size: -9999px;
}
.topRight &gt; .box:not(.blurbs) &gt; .rightHead &gt; b {
    font-size: 0;
}
.blurbs.box &gt; .rightHead &gt; b &gt; span.uName::after {
    content: "𝖆𝖇𝖔𝖚𝖙 𝖒𝖊";
    color: #fff;
    font-size: 15px;
}
.blurbs.box &gt; .rightHead &gt; b {
    font-size: 0px;
}
.blurbs.box &gt; .rightHead &gt; b &gt; span.uName {
    font-size: 0px;
    color: #fff;
}
#sMsg {
    background-repeat: no-repeat;
    background: url(https://i.ibb.co/pZg7t3J/Webp-net-resizeimage-1.gif) no-repeat;
}
#add {
    background-repeat: no-repeat;
    background: url(https://i.ibb.co/pZg7t3J/Webp-net-resizeimage-1.gif) no-repeat;
}
#block {
    display: none;
}
#report {
    display: none;
}
.topRight &gt; .extended.box::after {
    font-size: 15px !important;
    content: "ł₮\'₴ Ø₦ⱠɎ ₮ⱧɆ₳₮ⱤɆ Ø₣ ₱₳ł₦";
}
.topRight &gt; .extended.box &gt; h3 {
    font-size: 0;
}
.boxHead {
    display: none;
    text-indent: -9999px;
}
h4 {
    display: none;
}
div#hSub a {
    font-family: courier;
}
.fwiendFace img, .tableLeft img {
    border: 1px solid #fff;
}
input, button {
    background: linear-gradient(#ff0400, #000);
    color: #fff;
    border: 1px solid #ff0400;
    font-family: "courier";
}
input, .fwiendFace b, .tableLeft b, .tableLeft img, #avatar.avatar, .fwiendFace img, .logo, div#hSub a, button, #add.boxButton, #sMsg.boxButton, #imgPreview img, #header a:not(.logo), #imgPreview {
    cursor: url(https://cur.cursors-4u.net/others/oth-4/oth378.cur),auto!important;
}
html {
    cursor: url(https://cur.cursors-4u.net/others/oth-4/oth378.cur),auto!important;
}
.fwiendFace img, .tableLeft img {
    width: 100px;
    height: 100px;
    object-fit: cover;
    object-position: top;
}
@keyframes wiredB {
50% {
    box-shadow: 0 0 2rem #ff0400;
 }
}
#container {
    background: #000;
    border: 5px double #ff0400;
    animation: wiredB 2s ease-in-out infinite;
}
div#online {
content: url(http://www.myspacegens.com/images/online_now/39.gif);
display: block;
margin-left: auto;
margin-right: auto;
width: 40%;
}
body {
    font-family: "Courier New";
}
body::before {
  content: "";
  display: block;
  position: fixed;
  left: 0;
  top: 0;
  width: calc(500% + 32px);
  height: calc(500% + 32px);
  background-image: url("https://initiate.space/assets/scanlineseg.png");
  background-position: 0 0;
  background-repeat: repeat;
  z-index: 10000000;
  animation: ScanlineAnimationLeft 2s linear infinite;
  pointer-events: none;
  opacity: 0.75;
}
 
body::after {
  content: "";
  display: block;
  position: fixed;
  left: -32px;
  top: 0;
  width: calc(100% + 32px);
  height: calc(100% + 32px);
  background-image: url("https://initiate.space/assets/scanlineseg.png");
  background-position: 0 0;
  background-repeat: repeat;
  z-index: 10000000;
  animation: ScanlineAnimationRight 0.4s linear infinite;
  pointer-events: none;
  opacity: 0.75;
}
 
@keyframes ScanlineAnimationLeft {
  0% {
    transform: translateX(0px) translateY(0px);
  }
  100% {
    transform: translateX(-32px) translateY(-32px);
  }
}
 
@keyframes ScanlineAnimationRight {
  0% {
    transform: translateX(0px) translateY(0px);
  }
  100% {
    transform: translateX(32px) translateY(-32px);
  }
}
.logo b span {
  display: none;
}
.logo b:before {
    vertical-align: middle;
    font-size: 20px;
    content: "";
}
.logo b:after {
    vertical-align: middle;
    font-size: 20px;
    color: #fff;
    content: "";
}
}
img {
    image-rendering: initial;
}
.url.box {
  display: none;
}
body {
    background-image: url(https://avatarfiles.alphacoders.com/678/67824.gif);
}
body {
    text-align: center;
}
.tableLeft {
    background: #000;
    width: 25%;
    padding: 10px;
    vertical-align: top;
    overflow: hidden;
}
.tableRight {
    width: 75%;
    background: #000;
    padding: 10px;
    vertical-align: top;
    overflow-wrap: anywhere;
}
div {
    color: #ff0400;
}
.rightHead {
    background: #000;
    color: #fff;
    border: 1px solid #000;
    padding-left: 4px;
}
h4 {
    color: #fff;
    margin-bottom: 0px;
}
.boxButton {
    display: inline-block;
    width: calc( 49% - 60px );
    padding-left: 30px;
    height: 24px;
    font-size: small;
    color: #fff;
    padding-top: 7px;
}
.topLeft:after {
    content: "";
    white-space: pre-wrap;
    display: block;
    height:500px;
    width: 500px;
    background-image: url(lll), url(https://64.media.tumblr.com/d26cc93a6f995531a78acfb625bf46bd/tumblr_oem0n6n95o1uypm68o1_400.gifv);
   background-repeat: no-repeat;
}
.boxHead {
    background: #000;
    color: #ff0400;
    padding: 3px;
    padding-bottom: 4px;
    padding-left: 6px;
}
.extended {
    background-color: #000;
    border: 1px dashed #ff0400;
    margin-bottom: 20px;
    margin-top: 20px;
}
.blurbs, #box, #header, #hSub {
    background: #000;
    border: 1px dashed #ff0400;
    padding: 0px;
    margin-bottom: 10px;
}
.fwiendCount {
    color: #fff;
}
#commentInput {
    border: 1px solid #ff0400;
    background: linear-gradient(#ff0400, #000);
}
* {
    color: #fff;
}#hSub a {
    color: #fff;
    text-decoration: none;
}
#header, #hSub {
    padding: 5px !important;
    background: #000 url(https://i.pinimg.com/originals/c5/9d/ee/c59dee0e63dd759fc541992e300d089f.gif) repeat!important;
    border-bottom: 1px solid #ff0400 !important;
    border-radius: 10px;
}
div#hSub a:first-child {
  border-bottom: 2px solid #ff0400;
  padding-bottom: 7px;
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 )