ARI ABDUL LAYOUT (REQ !)

Tags: ari abdul, red, black, simple, gif, layout
Description:

ARI ABDUULLLL <33
Preview:

click on the image for a larger preview
Code:

<!-- (c) Layout created by finn (PROFILE REWORK) (https://layouts.spacehey.com/layout?id=103687) -->

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

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

<center><img width="270px" height="100px" src="https://media.tenor.com/idLZu-IMtoQAAAAM/dark-red-edgy-aestetic-dark.gif"/></center>

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

<style>
/*Main Body (Background Color/Background Image)*/
    body{
    background-image: url('https://media.tenor.com/erbfpVT0mPUAAAAM/red-and-black-red.gif') !important;
    background-attachment: FIXED !important;
    background-repeat: NO-REPEAT !important;
    background-position: CENTER !important;
    background-size: COVER;}
</style>
    
<style>
/*Profile (Background Color/Background Image)*/
    main{
    background-color: rgb(41, 41, 41, 0.4) !important;
    background-attachment: SCROLL !important;
    background-repeat: NO-REPEAT !important;
    background-position: CENTER!important;}
</style>
    
<style>
/*Adding rounded corners to profile*/
   .top{
        border-radius: 25px 25px 25px 25px !important;}
        
    main{
        border-radius: 29px 29px 29px 29px !important;}
</style>
        
<style>
/*Top (Background Color/Background Image)*/
   .top{
    background-color: rgb(9,9,9, 0.7)!important;
    background-attachment: FIXED!important;
    background-repeat: REPEAT!important;
    background-position: CENTER!important;
    background-size: COVER;}
</style>
    
<style>
/*Top Links (Background Color/Background Image)*/
 .links{
     text-align:center;
    background-color: transparent!important;
    background-attachment: FIXED!important;
    background-repeat: REPEAT!important;
    background-position: CENTER!important;}
</style>

<style>
/*Search Users Box (Background Color/Background Image)*/
    .top input{
    background-color: White!important;
    background-attachment: FIXED!important;
    background-repeat: NO-REPEAT!important;
    background-position: CENTER!important;}
</style>

<style>
/*Buttons (Background Color/Background Image)*/
    button{
    border-radius: 25px 25px 25px 25px !important;
    background-color: gray !important;
    background-attachment: FIXED!important;
    background-repeat: NO-REPEAT !important;
    background-position: CENTER!important;}
</style>

<style>
/*Profile Name (Background Color/Backround Image)*/
    h1{
    text-align:center;
    background-color: transparent!important;
    background-attachment: FIXED!important;
    background-repeat: REPEAT!important;
    background-position:center!important;}
</style>

<style>

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

<style>
.general-about{
  position: relative;
  margin-top: 30px;
}
.online {
    content: url(http://www.myspacegens.com/images/online_now/332.gif);
}
</style>

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

⠀<style>
.general-about img {-webkit-mask-image: url( https://i.postimg.cc/ry03mrP3/2024-01-28-0lg-Kleki.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}
</style>

<style>
.profile .friends .person img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/ry03mrP3/2024-01-28-0lg-Kleki.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}
</style>
<style>

.comments-table td:first-child img:not(.icon) { -webkit-mask-image: url(https://i.postimg.cc/ry03mrP3/2024-01-28-0lg-Kleki.png);-webkit-mask-size: 100%;-webkit-mask-repeat: no-repeat;-webkit-mask-position: center;}

</style>

<style>
/*Mood (Background Color/Background Image)*/
    .mood{
    text-align:center;
    background-color: transparent !important;
    background-attachment: FIXED!important;
    background-repeat: NO-REPEAT !important;
    background-position: CENTER !important;}
</style>

<style>
/*Contact Heading (Background Color/Background Image)*/
    .contact .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: transparent!important;
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
/*Contact Box (Background Color/Background Image)*/
    .contact{
    background-color: rgb(41, 41, 41, 0.9)!important;
    padding: 15px 10px 14px 10px;
    position: relative;
    margin-top: 20px;
    border: 5px ridge black;
</style>

<style>
/*Interests Section/Social Links Heading (Background Color/Backround Image)*/
    .table-section .heading{
    border-radius: 25px 25px 25px 25px !important;
    text-align:center;
    background-color: rgb(17, 17, 17, 0.7) !important;
    background-color: black !important;
    background-repeat: repeat;
    background-position: center;}
    
    
</style>

<style>
/*Interests Table & Links Table (Background Color/Background Image)*/
    table.details-table{
    background-color: rgb(9, 9, 9, 0.7)!important;
    background-attachment: FIXED!important;
    background-repeat: REPEAT!important;
    background-position: CENTER!important;}
    
   .profile .details-table td {
    background-color: rgb(203 203 203 / 78%)!important;
    background-attachment: FIXED OR SCROLL !important;
    background-repeat: REPEAT!important;
    background-position: CENTER!important;}
</style>

<style>
/*Blogs Heading (Background Color/Background Image)*/
    .blog-preview h4{
    border-radius: 25px 25px 25px 25px !important;
    background-color: rgb(9, 9, 9, 0.8);
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
/*Blog (Background Color/Background Image)*/
    .blog-preview{
    background-color: transparent!important;
    padding: 15px 15px 12px 15px;
    position: relative;
    margin-top: 6px;
    border: 5px ridge black;
</style>

<style>
    .blurbs .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: rgb(9, 9, 9, 0.7)!important;
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
    .blurbs{
    padding: 15px 10px 14px 10px;
    position: relative;
    margin-top: 20px;
    border: 5px ridge black;


<style>
/*About Me/Who I'd Like To Meet (Background Color/Background Image)*/
    .blurbs{
    background-color: transparent!important;
padding: 15px 10px 14px 10px;
    position: relative;
    margin-top: 20px;
    border: 5px ridge black;;}
    
/*Hide "About Me" & "Who I'd Like To Meet" Headers*/
 .blurbs .section h4{display: none !important;}
</style>

<style>
/*Friends/Comments Heading (Background Color/Background Image)*/
    .friends .heading{
    border-radius: 25px 25px 25px 25px !important;
    background-color: rgb(9, 9, 9, 0.7)!important;
    background-repeat: repeat;
    background-position: center;}
</style>

<style>
/*Friends (Background Color/Background Image)*/
    .friends{
    background-color: transparent!important;
    background-attachment: SCROLL !important;
    background-repeat: NO-REPEAT !important;
    background-position: CENTER!important;}
</style>

<style>
/*Comments (Background Color/Background Image)*/
    .comments-table td{
    background-color: rgb(9, 9, 9, 0.7)!important;
    background-attachment: FIXED !important;
    background-repeat: REPEAT !important;
    background-position: CENTER!important;
    border-radius: 0px 0px 0px 0px !important;}
    
</style>

<style>
/*Put Your Comments In A Scroll Box*/
table.comments-table{
display: block;
height: 300px!important;
overflow-y: scroll;}
</style>

<style>
/*Customize Scrollbar*/
    ::-webkit-scrollbar {
    width: 5px;
    height: 10px;}

    ::-webkit-scrollbar-thumb {
    background: rgba(9, 9, 9);}

    ::-webkit-scrollbar-track {
    background: rgba(41, 41, 41, 0.2);}
</style>


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

<style>
.logo {
  content: url(https://yourimageshare.com/ib/KgHd9VV6wQ.webp)

</style>



<style>
/*SpaceHey Logo (Background Color/Background Image)*/
    .logo{
    background-color: transparent!important;
    background-attachment: FIXED!important;
    background-repeat: REPEAT!important;
    background-position: CENTER!important;}
</style>

<style>
/*Footer Links (Background Color/Background Image)*/
    footer{
    background-color: rgb(41, 41, 41, 0.7)!important;
    background-attachment: FIXED!important;
    background-repeat: REPEAT!important;
    background-position: CENTER!important;}
</style>

<style>
/*Change Text Colors*/
    .top{
    color: white;}    
    
    main{
    color: white!important;}
    
    footer{
    color: white;}
</style>

<style>
/*Change Link Colors*/
    a{
    color: White!important;}
    
    a:hover{
    color: White!important;}
    
    a:visited{
    color: white!important;}
    
    .top a{
    color: white!important;}
    
    .top a:hover{
    color: white!important;}
    
    .top a:visited{
    color: white!important;}
    
    .links a{
    color: white!important;}
    
    .links a:hover{
    color: White!important;}
    
    .links a:visited{
    color: White!important;}
   
    .friends-grid p{
    color: White!important;}

    footer .links a{
    color: White!important;}
   
    footer .links a:hover{
    color: White!important;}
   
    footer .links a:visited{
    color: white!important;}

</style>

<style>
/*Change Interests Section Titles*/
table, th, td {
  border: 0px trans;text-align:center;border-radius: 15px;}

:root {
  --topic1: "General";
  --topic2: "Music";
  --topic3: "Movies";
  --topic4: "Youtubers";
  --topic5: "Books";
  --topic6: "Heroes";}

:root {
    --light-gray: #f2f0f0;
    --gray: #e3e3e3;
    --dark-gray: #919191;
    --darker-gray: #545454;
    --logo-blue: #1D4ED8;
    --darker-blue: #1E40AF;
    --lighter-blue: #60A5FA;
    --even-lighter-blue: #BFDBFE;
    --lightest-blue: #DBEAFE;
    --red: #FF0000;
    --dark-orange: #ffffff;
    --light-orange: #f9c56c;
    --even-lighter-orange: #fcdbb8;
    --strange-yellow: #dbae2e;
    --green: #34D399;
    --light-green: #E6F8DD;
    --medium-green: #A0C99C;
    --dark-green: #059669;
    accent-color: #1D4ED8;
    accent-color: var(--logo-blue);
}

.table-section:not(:last-child) .details-table tr td:first-child p{color:transparent !important;text-shadow: none !important;letter-spacing: -100px;}

.details-table tr td:first-child p::after{
color:var(--links) !important;
letter-spacing:normal !important;
text-shadow: 2px 2px black !important;
filter: brightness(95%) !important;}

.table-section:not(:last-child) .details-table tr:nth-child(1) td:first-child p::after{
  content: var(--topic1);}

.table-section:not(:last-child) .details-table tr:nth-child(2) td:first-child p::after{
  content: var(--topic2);}

.table-section:not(:last-child) .details-table tr:nth-child(3) td:first-child p::after{
  content: var(--topic3);}

.table-section:not(:last-child) .details-table tr:nth-child(4) td:first-child p::after{
  content: var(--topic4);}

.table-section:not(:last-child) .details-table tr:nth-child(5) td:first-child p::after{
  content: var(--topic5);}

.table-section:not(:last-child) .details-table tr:nth-child(6) td:first-child p::after{
  content: var(--topic6);}
</style>


<style>
/* this centers your friend space */
    .profile .friends .inner, .profile .blurbs .section h4{
    text-align: center;
    }
</style>

<style>* {cursor: url(''), auto !important;}</style>
<a href="" target="_blank" style="position:absolute; top: 0px; right: 0px;"></a>



<style>
/* contact icons */
.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 to friends */
content: url("✧")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url("✧")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url("✧")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url("✧")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url("✧")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url("✧")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add 2 group  */
content: url("✧")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url("✧")
}   
</style>

<style>
/*Rounds profile picture*/
    .profile-pic img{
border-radius:25px;}
</style>
<style>
/*Change Header Text (Contact, About Me, Who I'd Like To Meet, etc)*/

/*"Contacting You" Box Title*/
.contact .heading{ font-size:0; text-align:center; }
.contact .heading:before{ content: "Contact Me"; font-size:.8rem; font-serif-bold; }

/*"Latest Blogs Entries" Title*/
.blog-preview h4{ font-size:0; text-align:center;}
.blog-preview h4 a{font-size:.8rem;margin-left:5px; }
.blog-preview h4:before{ content: "New Blog Entries  |"; font-size:.8rem; }

/*"Your Blurbs" Title*/
.blurbs .heading{ font-size:0; text-align:center;}
.blurbs .heading:before{ content: "Personality"; font-size:.8rem; font-weight:bold; }

/*"Your Friend Space" Title*/
.friends .heading{ font-size:0; text-align:center;}
.friends .heading:before{ content: "New Friends"; font-size:.8rem; font-weight:bold; }

/*"Your Friend Comments" Title*/
.friends#comments .heading{ font-size:0; text-align:center; }
.friends#comments .heading:before{ content: "Your Friends Comments"; font-size:.8rem; font-weight:bold; }
</style>



<style>
/*contact box border*/
    .contact{
border: 1px transparent !important;
border-radius: 10px;}
</style>

<style>
/* for this box, you can add an image of your choice. it's right under the contact box. */
.url-info{
    background: url('https://lastfm.freetls.fastly.net/i/u/ar0/ea5600d975c26901cb3eda831c30bb9f.jpg');
    background-position: center;
    height: 240px
    ;}

.url-info p{
    opacity: 0.0;}
</style>

<style>
/*removes boxes around the interests/links table*/
body  
    {
--lighter-blue: none;
}
</style>

<style>
/*hides white box around comments table*/
    .table.comments-table:{
    border-color:transparent;}
</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 20 comments ( View all | Add Comment )
𝔞𝔯𝔰𝔥?	1779547508 usingg Report Comment
𝔞𝔯𝔰𝔥?	1779547507 usingg Report Comment
Hades	1774547999 USING Report Comment
IlianRaro	1771755585 USING Report Comment
ĝ̽̓̀͑1̨̹̦͍̀ỉ͔͖̜͌t̲̂̓ͩ̑c͕͗ͤ̕̕ḣ̖̻͛̓	1767488544 USING Report Comment
Your best nightmare	1767374962 using Report Comment
ZephyrN.	1766986631 using ! Report Comment
Lucifer	1763210359 using! Report Comment
✮ Mary ☣︎	1752564900 using !! :D Report Comment
Matthe.exe	1748121563 using!! Report Comment
Skrota	1747192733 using!!!!!! Report Comment
Charlie	1745464149 using <3 Report Comment
Anixuko	1743688025 using Report Comment
lol12	1741464070 using!! Report Comment
Nour (nimf)	1737742017 usingg Report Comment
bugb1te	1735019971 usinggg Report Comment
theantichrist_	1724040257 using! Report Comment
ETHAN .	1720286368 using ! Report Comment
ZOMIE KITTEN!!	1713722610 the red doesn't show Report Comment