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 98 comments ( View all | Add Comment )

𝕶𝖎𝖐𝖎 ᐟᐟ☆	1701568732 Using!! Thanks ^^ Report Comment
snow	1701333171 using C: Report Comment
Suicide	1701315966 using! Report Comment
julesy poo	1700975616 using !!! Report Comment
livingdeadgirl	1700694781 Using. Report Comment
maria	1700606807 using!! Report Comment
🎸⋆⭒˚｡⋆🥩	1700566705 using ^__^ Report Comment
Ghost	1700522465 Using teehee Report Comment
ʚ₊˚‧ 𖤐 ꒱ ׅNᜊ݊x !	1700504857 usando!! Report Comment
Azael00xx	1700114563 Usando Report Comment
panzerfart	1698755829 using Report Comment
Thatcher.	1697672774 using Report Comment
Thatcher.	1697672773 using Report Comment
Judah	1695963430 uuusingg Report Comment
ava	1695400975 Using Report Comment your profile scared the shit out of me with the loading gif by Gabriel Lee; 1695855612; Report STOPP IM SO SO SORRY IF IT MADE U UNCOMFORTABLE by ava; 1696008719; Report
UrlocalPossum	1695038199 Using Report Comment
Dishsoap366	1694718409 So cute have to use ☆ Report Comment
Funfetti!!	1694395780 Using! Report Comment
Funfetti!!	1694395779 Using! Report Comment
★𝘾𝙝𝙖𝙧𝙡𝙞𝙚★	1694225024 Using! Thank you! Report Comment