Devil May Cry 3 Layout

Tags: dmc, devil may cry, video games, red, black, dark, 2000s, animation, gif

Description:

Has animations and autoplaying music!

Preview:

click on the image for a larger preview

Code:

<!-- (c) Layout created by ✭ Fren-z ✭ (https://layouts.spacehey.com/layout?id=81569) -->

<style>

body{background:url("https://i.ibb.co/S55JCDX/ezgif-1-3f8d2a9137.jpg") no-repeat fixed; background-size:cover;
background-color: black;
}

nav .links .special a {
display: none;
}

nav .links li:not(:last-child)::after, footer .links li:not(:last-child)::after{
content: "|";
color: darkred;
}

small {
font-size:100%;
}
 
main {
background: transparent;
}

.general-about .profile-pic img {
box-shadow: 0px 0px 15px 0px red;
 }   

b {
font-size: 14px;
}

time.ago {
color: white;
}

.profile h1{
font-size: 30px;
}

h1{
font-family: courier;
animation: type 3s steps(27);
color: white;
white-space: nowrap;
overflow: hidden;
}

@keyframes type{
  0%{
    width:0ch;
  }
  
  100%{
    width:27ch;
  }
}

@keyframes blink{
  0%{opacity:1;}
  50%{opacity:0;}
  100%{opacity:1;}
}

.profile .friends .inner b, .profile .friends .inner a{
text-align: center;
color: white;
text-shadow: 3px 3px 3px black;
}

.profile .mood{ 
color: white;
border: 3px inset darkred;
box-shadow: 0px 0px 10px 0px darkred;
}

.profile .mood a{
color: darkred;
} 

.profile .mood a:hover{
color: red;
} 

p{
font-size: 16px;
font-family: courier !important;
color: white;
}

.details-table td a {
color: red;
}

.details-table td p {
color: white;
font-size: 14px;
}

  .table-section .heading{ 
font-size:14px; 
}

.profile .blurbs .section p, .profile .friends p, .blog-entry .comments p, .bulletin .comments p {
font-size: 14px;
}

.friends p, .friends a {
color: white;
text-shadow: 3px 3px 3px  black;
}

.profile .friends .inner{
text-align: center;
background: black;
border: 3px inset darkred;
box-shadow: 0px 0px 10px 0px darkred;
}

.profile .blurbs .section h4 {
text-align: center;
font-size: 14px;
color: white;
border: 3px black;
}

.profile .contact .heading h4, .profile .table-section .heading h4, .profile .blurbs .heading h4, .profile .friends .heading h4{
display: none;
}

.profile-info{
background:url("https://i.ibb.co/ZXvNrHS/ezgif-1-32d33544ae.gif") no-repeat fixed; background-size:cover;
border: 3px inset darkred;
font-family: courier;
box-shadow: 0px 0px 10px 0px darkred;
}

.profile-info a{
font-size: 14px;
color:white;
text-shadow:  3px 3px 2px black;
}

.profile-info h3{
color:white;
}

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

.profile .blurbs .inner{
background: url("https://i.ibb.co/100BCRP/ezgif-4-9d7b2e4e70.jpg");
box-shadow: 0px 0px 10px 0px darkred;
border: 3px inset darkred;
}

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

.contact .heading h4{
display:none !important;}


.contact .heading{ font-size:20px;}
.contact .heading:before{ content: url(https://i.ibb.co/Fb1tpC0/ezgif-1-7157131909.gif); 
overflow:hidden;
}

  .table-section .heading{ font-size:0; }
.table-section .heading:before{ content: url(https://i.ibb.co/zrcdwQ6/ezgif-1-48b1a66794.gif); 
padding-bottom: 10px;
}

h4 {
font-size: 14px !important;
color: white;
font-family: courier;
 }

   a {
font-size: 14px;
color: white; 
   }


a:hover {
     color: darkred; 
cursor: url(https://cur.cursors-4u.net/cursors/cur-2/cur117.cur), auto;
}

.count {
color: red;
}

.profile .friends .person p {
color: white;  
}
.profile .friends .person p:hover {
color: darkred;  
}

.blog-preview{
text-align: center;
background-image: url(https://i.ibb.co/hHjmTHv/ezgif-4-c3d2bd3e06.jpg);
color: white;
border: 3px inset darkred;
box-shadow: 0px 0px 10px 0px darkred;
}

.contact .heading h4{
font-size:14px;
}

.profile .friends .person img:not(.icon) {
box-shadow: 0px 0px 15px 0px red;
}


.online {
    margin:auto;
    padding-bottom: 5px;
    content: url(https://i.ibb.co/0qsMx7K/ezgif-1-a9a4a5da5b.webp);
}
  
.icon {
        content: url(https://i.ibb.co/LZ38mM2/ezgif-2-9db8b7e076.png);
        display: inline-block;
        height: 1.5em;
        width: 1.5em;
        margin: 0 .05em 0 .1em;
        vertical-align: -0.3em;
        color: rgba(0,0,0,0);
}

.profile .contact {
font-family: courier;
border: black;
background: black;
border: 1px solid black;
box-shadow: 0px 0px 10px 0px black;
}

.profile .contact a{
font-size: 12px;
}

.contact .inner a img {
font-size: 0;
}
.contact .inner a img:before {
font-size: 1em;
display: block
}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(1) a:before {
	/* add friend */
	content: url(https://pixelsafari.neocities.org/favicon/horror/skull7.gif);
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
	/* add to favs */
	content: url(https://i.ibb.co/30qz3pw/ezgif-1-7b8225b90a.gif)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
	/* send message */
	content: url(https://i.ibb.co/tCBwsZX/ezgif-1-1a54c51247.gif)
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
	/* forward */
	content: url(https://i.ibb.co/S3LJG4L/ezgif-2-2340556114.gif)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
	/* instant msg */
	content: url(https://pixel.crd.co/assets/images/gallery04/0399c19f.gif?v=6c952962)
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
	/* block */
	content: url(https://pixels.crd.co/assets/images/gallery06/902ddb74.gif?v=b22a957b)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
	/* add to group */
	content: url(https://pixels.crd.co/assets/images/gallery33/8c4c0ece.gif?v=b22a957b)
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
	/* report */
	content: url(https://external-media.spacehey.net/media/sGBVzOdmUsoGedi6M5Kgr51k_1s5Ls4IKjIfrqNvmJUE=/https://caterpie.crd.co/assets/images/gallery27/d85f2cb8.gif?v=08522da7)
} 

.contact .inner a img {
 font-size: 0;
}
.contact .inner a img:before {
 font-size: 1em;
 display: block
}

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

.profile .table-section .details-table td a{
color: red;
}

.profile .table-section .details-table td a:hover{
color: red;
}

.profile .table-section .details-table td a:hover{
color: darkred;
}

.profile .table-section .details-table td {
background: black;
border: 3px inset darkred;
box-shadow: 0px 0px 10px 0px darkred;
}


.profile .friends .comments-table td {
background-image: url("https://i.ibb.co/fNgF51b/ezgif-4-9a80a8d2b3.jpg");
border: 3px inset darkred;
}

.profile .comments-table .inner {
box-shadow: 0px 0px 19px 0px rgba(255,255,255,0.3); 
background: black;
}

.comments-table td:first-child img{
box-shadow: 0px 0px 19px 0px black;
}

.comment-replies{
border: 3px inset darkred;
color: white;
}

.general-about .details{
background: black;
border: 3px inset darkred;
background-image: url("https://i.ibb.co/QDmWsH4/ezgif-4-bbf4b0e98b.jpg");
background-size:cover;
box-shadow: 0px 0px 10px 0px darkred;
}

.general-about .details p:not(.online){
color: white !important;
font-size: 14px;
}

.general-about .details a{
color: white !important;
font-size: 14px;
}

nav{ 
color:white;
font-size: 13px !important;
text-transform:none;
text-align: center;
    }

.links{
width=810px;
}

nav .links {
background: transparent;
}

nav .links a:hover {
color: darkred;
}

nav .top{
background-color: transparent;
font-family: courier;
}

nav .top a{
color: white !important;
}

nav .top label{
color: white;
}

input{
color: white;
border: 2px solid darkred;
border-radius: 5px;
background: black;
}

button{
background: linear-gradient(360deg, darkred 83%, red 94%);
color: black;
border: 2px solid black;
border-radius: 5px;
font-family: courier;
}

.profile .url-info {
border: 3px solid transparent;
color: transparent;
font-size: 0.1px;
height: 60px;
background-image: url(https://i.ibb.co/SPc7qch/urlinfo.png);
}

.url-info p{
    opacity: 0.0;
}

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

nav .links a{
color: white;
font-size: 13px;
text-shadow: 0 0 7px black;
font-family: courier;
}

table .comments-table {
border: 2px inset darkred;
}

footer p{
color: white;
font-size: 100%;
}

footer a{
color: white;
}

footer {
color: white !important;
box-shadow: 0px 0px 10px 0px darkred;
text-decoration: underline !important;
text-decoration-style: dotted !important;
background-image: url(https://i.ibb.co/0jqxqHk/ezgif-1-fd53b18d30.webp);
border: 3px inset darkred;
  }    

</style>

<style>

.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 5s;
animation-iteration-count: infinite;
animation-timing-function: ease-in-out;
}
@keyframes float {
0% { transform: translate(0, 0px);
}
50% {
transform: translate(0, 5px);
}
100% {
transform: translate(0, -0px);
}

</style>

<style>
table.comments-table{
background-color:black;
display: block;
height: 300px!important;
overflow-y: scroll;
border-color:black;
border-width: 5px;
}
</style>

<style>
img:hover , .url-info:hover{
  animation: shake 1s;
  animation-iteration-count: infinite;
}

@keyframes shake {
  0% { transform: translate(1px, 1px) rotate(0deg); }
  10% { transform: translate(-1px, -2px) rotate(-1deg); }
  20% { transform: translate(-3px, 0px) rotate(1deg); }
  30% { transform: translate(3px, 2px) rotate(0deg); }
  40% { transform: translate(1px, -1px) rotate(1deg); }
  50% { transform: translate(-1px, 2px) rotate(-1deg); }
  60% { transform: translate(-3px, 1px) rotate(0deg); }
  70% { transform: translate(3px, 1px) rotate(-1deg); }
  80% { transform: translate(-1px, -1px) rotate(1deg); }
  90% { transform: translate(1px, 2px) rotate(0deg); }
  100% { transform: translate(1px, -2px) rotate(-1deg); }
}
</style>



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

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

    ::-webkit-scrollbar-track {
    background:black;}
</style>

<style>
.profile .friends .comments-table td:first-child{
background-image: url(https://i.ibb.co/DY3fFRz/ezgif-4-9a39015dc8.jpg);

}

.comments-table td{
border-width:0;
background-color: black;
border: 3px inset darkred;
</style>

<style>
body::before {
content: " ";
display: block;
position: fixed;
top: 0;
left: 0;
bottom: 0;
right: 0;
background: linear-gradient(rgb(0 0 0 / 48%) 50%, rgb(255 255 255 / 0%) 50%);
z-index: 2;
background-size: 100% 2px, 3px 100%;
pointer-events: none;
}
</style>

<style>
.online {
  animation: rotation 8s infinite linear;
}

@keyframes rotation {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(359deg);
  }
}
</style>

<style>
body { cursor: url(https://cur.cursors-4u.net/cursors/cur-2/cur117.cur), auto; }
</style>

<iframe width="0" height="0" src="https://www.youtube.com/embed/7Lh_C_Q0BH8?si=AmoNVeHaBMPHS-51//?&;amp;;autoplay=1&;loop=1&;controls=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen="" loading="lazy">
</iframe>

<style>
nav img.logo {
filter: brightness(0) saturate(100%) invert(22%) sepia(36%) saturate(3844%) hue-rotate(341deg) brightness(99%) contrast(100%); !important;
}
</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 146 comments ( View all | Add Comment )

vanne	1749697135 usando!!! Report Comment
Sr_Belikov	1749322282 Using, so cool Report Comment
Sheon	1748679395 Using!! Report Comment
R41M4	1748545600 using !!! Report Comment
inhalingchilden	1748511267 USINGGGGGUHHHH!! Report Comment
belxnskx	1748406667 I'm eating this up omfg HRHRGRHGRHGR using btw >:] Report Comment
★Yaritza	1748061407 Usando Report Comment
Rat!!	1747960986 using :3 Report Comment
R0MA!	1747739666 shit, i was gonna make a dmc3 layout but bro beat me to it it's literally perfect it has everything i wanted to add Report Comment
Hachikoloverby	1747370397 Usandooo Report Comment
-Arnexic-	1747048279 Using! :PPP :3 Report Comment
⚔︎CB_Dantelover♰	1746461544 Finally my people HELL YEAH Report Comment
ℑ𝔪𝔭𝔶	1746412054 using!! Report Comment
ℑ𝔪𝔭𝔶	1746412038 using!! Report Comment
ℑ𝔪𝔭𝔶	1746412038 using!! Report Comment
Dallas	1746392647 It's impossible not to use. Report Comment
CleanFeetLover	1746192010 USING!!! Report Comment
Kuma	1746047184 using :3 Report Comment
All(i)enくらりん〜	1746045279 USING!! Report Comment
Kai :3	1745772847 happily using Report Comment