Horror Layout (updated)

Tags: horror, red, scary

Description:

Layout for all the horror fans out there, enjoy :) Please give credit or comment to boost if you use, thank you

Preview:

click on the image for a larger preview

Code:

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

<style>

    a {
        color: red;
        text-shadow: 0px 0px 10px red; !important
        text-decoration: none;
    }
    
    a:hover {
        animation:blinkingText 1.2s infinite;
    }
    
    @keyframes blinkingText{
        0%{     color: red;    }
        50%{    color: black; }
        100%{    color: red; }
}
     
    
    .contact:after {
        width: 98%;
        height: 167px;
        display: block;
        content: "";
        background-color: transparent;
        background-image: url('https://media0.giphy.com/media/l2YWoE1MjEPo9sG3K/giphy.gif');
        background-position: center;
        opacity: 70%;
        background-size: 402px;
        border-style: double;
        border-color: black;
    }


    .profile {
        background-image: url(https://i.makeagif.com/media/11-15-2015/iHywJQ.gif);
        background-size: 200px;
        position: relative;
        border: 3.5px double black;
        border-width: 5px;
        border-radius: 20px;
        box-shadow: 0px 0px 10px black;
        display: block;
    }
    
    .profile {
        border-color: black;
        animation-name: flash_border;
        animation-duration: 10s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
        -webkit-animation-name: flash_border;
        -webkit-animation-duration: 1.4s;
        -webkit-animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-name: flash_border;
        -moz-animation-duration: 2s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
      }

@keyframes flash_border {
  0% {
    border-color: red;
  }
  50% {
    border-color: black;
  }
  100% {
    border-color: red;
  }
}

@-webkit-keyframes flash_border {
0% {
    border-color: red;
  }
  50% {
    border-color: black;
  }
  100% {
    border-color: red;
  }
}

@-moz-keyframes flash_border {
0% {
    border-color: red;
  }
  50% {
    border-color: black;
  }
  100% {
    border-color: red;
  }
}

    body {
        background-image: url(https://i.pinimg.com/originals/f3/42/d3/f342d3b65227a71623f93f7d3bcc0962.jpg);
        background-size: cover;
        background-attachment: fixed;
        background-position: center;
    }
    
    main {
        background-color: transparent;
        color: white;
    }
    
    :root {
        text-shadow: 1px 1px 0px red;
        --logo-blue: ;
        --darker-blue: ;
        --lighter-blue: ;
        --even-lighter-blue: ;
        --lightest-blue: ;
        --dark-orange: ;
        --light-orange: ;
        --even-lighter-orange: ;
        --green: ;
    }
    
    nav .top {
        background-image: url('https://64.media.tumblr.com/2ada53507df9c60939598d098c3c3df5/tumblr_p956mwWIt21vhpaeyo1_640.gifv');
        height: 300px;
        background-size: 809px;
        background-position: top;
        border-radius: 5px;
        position: relative;
        border: 3.5px double black;
        border-width: 5px;
        border-radius: 20px;
        box-shadow: 0px 0px 10px black;
        display: block;
    } 
    
    nav .top {
        border-color: black;
        animation-name: flash_border;
        animation-duration: 10s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
        -webkit-animation-name: flash_border;
        -webkit-animation-duration: 1.4s;
        -webkit-animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-name: flash_border;
        -moz-animation-duration: 2s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
    }
    
    nav .links {
        background-color: ;
        border-radius: 30px;
        height: 33px;
    }
    
    .profile-pic {
        border-style: double;
        border-color: black;
        box-shadow: 0px 0px 7px red;
        border-radius: 3px;
        overflow: hidden;
        animation-name: example;
        animation-iteration-count: infinite;
        animation-duration: 0.8s;
    }

    .profile .contact,
    .profile .url-info,
    .profile .table-section,
    .home-actions {
        border-color: black;
        border-radius: 6px;
        box-shadow: 0px 0px 5px red;
    }

    table.details-table td {
        background-color: black !important;
    }
    
    .heading {
        padding: 5px 0 !important;
        margin-top: 15px;
        margin-bottom: 15px;
        background-color: transparent !important;
        color: white !important;
        border-bottom: 1px dashed red;
    }
    
    .container {
        border-radius: 0px 0px 0 0;
        overflow: hidden;
        margin-top: 20px;
        padding: 20px;
    }

    footer {
        border-radius: 2px;
        background:  black!important;
        display: block !important;
        position: relative;
        border: 3.5px double black;
        border-width: 5px;
        border-radius: 20px;
        box-shadow: 0px 0px 10px black;
        display: block;
    }

    footer {
        border-color: black;
        animation-name: flash_border;
        animation-duration: 10s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
        -webkit-animation-name: flash_border;
        -webkit-animation-duration: 1.4s;
        -webkit-animation-timing-function: linear;
        -webkit-animation-iteration-count: infinite;
        -moz-animation-name: flash_border;
        -moz-animation-duration: 2s;
        -moz-animation-timing-function: linear;
        -moz-animation-iteration-count: infinite;
    }
    
    table.comments-table td {
        background-color:  black!important;
    }
    
    .comments-table td:first-child img {
        width: 80px;
        border-radius: 4px;
        border-style: double;
        border-color: black;
        border-width: 3px;
        box-shadow: 0px 0px 7px red;
        animation-name: example;
        animation-iteration-count: infinite;
        animation-duration: 0.8s;
    }

    .profile .friends .person img {
        border-radius: 4px;
        border-style: double;
        border-color: black;
        box-shadow: 0px 0px 7px red;
        animation-name: example;
        animation-iteration-count: infinite;
        animation-duration: 0.8s;
    }

    .blog-preview p {
        font-size: 1.2rem;
    }

    .online {
        color: red;
        font-weight: bold;
        font-size: 98%;
    }
    

    .online img {
        content: url(https://static.myfigurecollection.net/upload/pictures/2021/03/04/2651068.gif);
        height: 2.9em;
        margin-right: 5px;
        animation-name: blink;
        animation-iteration-count: infinite;
        animation-duration: 1s;
    }

    .icon, .award img {
        content: url(https://thumbs.gfycat.com/AffectionateHarshHapuku-max-1mb.gif);
        display: inline-block;
        height: 2.0em;
        width: 1.8em;
        margin: 0 .05em 0 .1em;
        vertical-align: -0.3em;
        color: rgba(0,0,0,0);
    }

    .profile .blurbs .section h4 {
        margin: 0;
        color: white;
    }
    

     .comments-table td:first-child {
        background-image: url('https://i1.wp.com/i.pinimg.com/originals/83/72/92/8372928780f04433011ad2830a46b744.gif');
        background-size: 400px;
        padding: 10px;
    }

    .count {
        color: red;
        text-shadow: 0px 0px 3px red;
    }

    .details-table td:first-child {
        background: var(--even-lighter-blue);
        color: red;
        text-shadow: 0px 0px 3px red;
        font-weight: bold;
        width: 33%;
    }

    .profile-info {
        background-image: url('https://i1.wp.com/i.pinimg.com/originals/83/72/92/8372928780f04433011ad2830a46b744.gif');
        background-size: 500px;
        border: 2px double black;
        box-shadow: 0px 0px 7px red;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 15px 5px;
        margin-bottom: 10px;
    }

    .profile .friends .person p {
        color: red;
        text-shadow: 0px 0px 3px red;
        font-weight: bold;
        width: 100%;
        word-break: break-word;
        font-size: 100%;
        text-align: center;
    }

    @keyframes example {
0% {
transform:translate(0px,0.3px) rotate(0.3deg);
}
8% {
    transform:translate(0px,0.5px) rotate(-0.5deg);
}

16% {
    transform:translate(0px,1px) rotate(1deg);
}

24% {
    transform:translate(0px,1.5px) rotate(-1.5deg);
}

32% {
    transform:translate(0px,2px) rotate(2deg);
}

40% {
    transform:translate(0px,2.5px) rotate(-2.5deg);
}

48% {
    transform:translate(0px,3px) rotate(3deg);
}

56% {
    transform:translate(0px,3.5px) rotate(-3.5deg);
}

64% {
    transform:translate(0px,3px) rotate(3deg);
}

72% {
    transform:translate(0px,2.5px) rotate(-2.5deg);
}

80% {
    transform:translate(0px,2px) rotate(2deg);
}

88% {
    transform:translate(0px,1.5px) rotate(-1.5deg);
}

96% {
    transform:translate(0px,0.5px) rotate(0.5deg);
}

100% {
    transform:translate(0px,0.3px) rotate(-0.3deg);
}

</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 20 of 567 comments ( View all | Add Comment )

Tt	1761455390 Usinf Report Comment
Tt	1761455375 Using Report Comment
Tt	1761455370 Using Report Comment
Tt	1761455370 Using Report Comment
zruuhi	1760636148 USIIINGGGGGG Report Comment
Xee..~	1760363579 USING Report Comment
𝑨𝑱𝑨𝑿/𝑻𝑶𝑩𝒀	1760067504 USING!!! Report Comment
ꜰᴇɴᴛʏɢᴀᴜʀᴅɪᴀɴ⠀	1759989421 boosting luv <333 Report Comment
Gabss ♱ !!	1759939099 Using !! Report Comment
ViniWeen	1759846636 boosting!! might use it on mine Report Comment
Shroomz	1759645463 Using<3 Report Comment
𝕵𝖆𝖈𝖐 𝕯𝖎𝖆𝖛𝖔𝖑𝖔	1759640758 using!! Report Comment
𖤐⋆burNzz⋆♱✮	1759623547 using!! Report Comment
plaguedogs	1759473741 using !! Report Comment
Zybkiy Rezakk	1759405192 Using! Report Comment
Morgana	1759332156 using! Report Comment
Epickest	1759303143 Using! Sick work Report Comment
MANICMOTHMAN’S TESTER	1759174163 Using Report Comment
†SUI𝙓IDE†	1758799271 Usinggg Report Comment
vampy.zoe	1758751164 using !! Report Comment