xRanZaix

About me:

<!-- (c) Layout created by ⋆♱PoisonedProxy♱⋆ (https://layouts.spacehey.com/layout?id=95444) -->

<style>

/* this is the cursor that appears when you hover over links */

a:hover{

    cursor: url('https://cur.glitter-graphics.net/pub/111/111944aomhvemlia.gif'), auto;

}

/* this is the main cursor */

* { 

    cursor: url('https://cur.glitter-graphics.net/pub/111/111944aomhvemlia.gif'), auto; 

}

</style>

<style>

/* font-family */

@font-face { font-family: "PenetrationOutGrunge-JvyM"; src: url('//dl.dropbox.com/s/3wt5r6e8l5xrc66/PenetrationOutGrunge-JvyM.ttf'); }

@font-face { font-family: "RavenouslyDemoGrunge-Ea9OW"; src: url('//dl.dropbox.com/s/ydwh9wmm0k5a2bo/RavenouslyDemoGrunge-Ea9OW.ttf'); }

</style>

<style>

/* this is where the colors are rooted */

:root{

    --headers: #ff3884;

    --text: #cc6aa3; 

    --names: #ff458c;

    --links: #cf0064;

    --hover: #fc00a0;

    --borders: 4px double #fc00a0;

    --background_image: url('https://i.pinimg.com/564x/dd/3e/f6/dd3ef6d2505a68035ad84b5b52b400db.jpg');

    --font-family: "RavenouslyDemoGrunge-Ea9OW";

    --curve: 0px; /* the higher the number, the rounder the border. (try putting 50 as an example) */

}

/* this is where the colors for specific things are located */

h3, h4, h5{color: var(--headers) !important;} /* headings*/

a{color: var(--links) !important;} /* color of links */

a:hover{color: var(--hover) !important;} /* color of links on hover */

p, b, h2, .count {color: var(--text) !important;} /* color of text */

.friends a p{color: var(--names) !important;} /* color of names, and friends counter */

.friends a:hover p{color: var(--hover) !important;} /* color of names on hover */

nav label{color: var(--links) !important;} /* color of search */

.section h4 {display:none;} /* aboutme & want2meet headings */

.blurbs .heading {display:none;} /* hides the blurbs title. if you want it to show, replace with the code: color: var(--headers) !important; */

/* .details-table td:first-child{display:none;} this code hides the general-heroes titles */

/* this is where your background image ends up being styled */

body{

    background-image: var(--background_image)!important;

    background-color: #000;

    background-size: contain;

    background-attachment: fixed;

    color: var(--text)!important;

}

/* this is where your name appears */

h1{

    color: #ff30cf;

    font-family: "PenetrationOutGrunge-JvyM"; 

    font-size:30px !important;

    font-weight: bold;

    text-align: center;

    background-color: rgba(0,0,0,0.5);

    border: var(--borders);

}

/* the navigation is adjusted here */

nav{

    background-color: rgba(0,0,0,0.5);

    border: var(--borders);

    border-radius: var(--curve);

}

nav .top{

    background: transparent;

    color:var(--links);

}

nav .top a, nav .links a{

    color: var(--text);

    text-shadow:none;

}

nav .links{

    color: var(--text);

    background-color: transparent;

    border-radius: var(--curve);

    text-align: center;

}

/* this is the line that appears between links in the header and footer.

you can add an emoji or symbol instead of the default line it has */

nav .links li:not(:last-child)::after,

footer .links li:not(:last-child)::after{

    content: " ✦";

    color: var(--links);

}

/* this is the spacehey logo color.

you can change it at https://codepen.io/sosuke/pen/Pjoqqp */

nav img.logo{

    filter: brightness(0) saturate(100%) invert(8%) sepia(84%) saturate(3937%) hue-rotate(358deg) brightness(108%) contrast(117%)!important;

}

/* the search wrapper and button */

.search-wrapper input[type=text] {

    background-color: transparent !important;

    border: 1px solid var(--links) !important;

    color:var(--links) !important;

    border-radius: var(--curve) !important;

}

button{

    border-radius: var(--curve) !important;

    border: 0px solid var(--links) !important;

    font-family: var(--font-family) !important;

    background-color: transparent !important;

    color:var(--links) !important;

}

/* the online symbol and text */

.online{

    color: var(--links) !important;

    text-transform: lowercase;

    margin:auto;

} 

.online img{

    filter: brightness(0) saturate(100%) invert(8%) sepia(84%) saturate(3937%) hue-rotate(358deg) brightness(108%) contrast(117%) !important;

}

/* font family for the headers, navigtion links, links, body text */

h2, h3, h4, h5{

    font-family: "PenetrationOutGrunge-JvyM";

    font-size: 20px;

    font-weight: normal;

}

a, p, b, nav label, .section{ 

    font-family: var(--font-family) !important; 

    font-size: 14px;

    font-weight: bold;

}

/* the hr code.

the hr is the horizontal line when you want to 

separate important info or add a break in your paragraphs*/

hr{

    height:1px;

    background: var(--links);

    border: none;

}

/* this is where you adjust the borders and background */

.blurbs, .friends, .profile .table, .blog-preview, .contact{

    border-radius: var(--curve) !important;

    border: var(--borders) !important;

    background-color: rgba(0,0,0,0.5)!important;

}

.general-about .details{

    border-radius: var(--curve) !important;

    border: var(--borders) !important;

    background-color: rgba(0,0,0,0.5)!important;

    padding:20px;

    text-align: right;

}

.mood{

    border-radius: var(--curve) !important;

    border: var(--borders) !important;

    background-color: rgba(0,0,0,0.5)!important;

    text-align: center;

    padding:5px;

}

.icon{border:none !important;}

.comment-replies{border:2px dotted #ff007b;} /* this is the border around the replies */

.comment-reply:not(:first-child){border-top: 2px dotted var(--links);} /* line in between comment replies*/

/* your interest and comments table row background color */

td{

    background-color: transparent!important;

}

/* the middle section of your profile background color*/

main{

    background: transparent;

    border-radius: var(--curve) !important;

    border: transparent !important;

    outline: none !important;

}

/* the interest table */

.table-section{

    background-color:transparent!important;

    border:var(--borders)!important;

    background-color: rgba(0,0,0,0.5)!important;

}

.details-table{

    border-spacing:0px 10px;

}

.details-table td{

    border-top:1px solid darkred;

    padding:5px;

}

/* the header section of the boxes */

.heading, .blog-preview h4, .section h4{

    background: none !important;

    text-align: center;

}

/* this is the box that says "Edit Info" when you're logged in,

and to your friends it says "Profile Name is your friend". */

.profile-info {

    background-color: rgba(0,0,0,0.5);

    border: var(--borders) !important;

    border-radius: var(--curve) !important;

}

/* adjusting images borders and adding styling if you want to */

.profile-pic img{

    outline:none !important;

    border-radius: var(--curve) !important;

    padding:6px;

    border: none;

}

/* you can remove text-align:center; if you don't want your friends to be centered */

.friends-grid{

    text-align: center;

}

.friends-grid img{

    border-radius: var(--curve) !important;

    filter: brightness(70%);

}

/* margin and padding */

h2, h3, h4, h5, p{padding-left:5px !important;} /* this is important when you have rounded corners */

.profile .table-section .heading, .blog-preview .heading, .profile .friends .heading{padding: 5px!important;} /* add space to the titles */

.friends, .mood, .general-about .details{margin-bottom: 20px;} /* this adds space between sections */

/* custom contact

you can change the content: "✦" to content: url('image-url-here');

*/

.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: "▸"

}

.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {

 /* add to favorites */

 content: "▸"

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {

 /* Send Message */

 content: "▸"

}

.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {

 /* forward to friend */

 content: "▸"

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {

 /* instant message */

 content: "▸"

}

.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {

 /* block user */

 content: "▸"

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {

 /* add to group */

 content: "▸"

}

.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {

 /* report user */

 content: "▸"

} 

/* where your spacehey url goes. you can add a picture here instead.

if you don't want a picture or the url just remove this code 

and add this:

.url-info{display:none;}

*/

.url-info{

    background-image: url('https://i.pinimg.com/736x/73/5a/9c/735a9c9883361e25dbbcbc5e5f98f738.jpg');

    background-size: 100%;

    background-repeat: no-repeat;

    height: 193px;

    border: var(--borders)!important;

    border-radius: var(--curve);

}

.url-info p{

    opacity: 0.0;

}

/* this is the comments table scroll code. 

you can delete this if you don't want a scroll box */

.comments-table {

    display: block;

    height: 500px!important;

    overflow-y: scroll;

    border: 0px dotted #e6007a !important;

    outline: none !important;

    border-radius: 8px;

    padding:5px;

    border-spacing: 4px; /* this changes the distance between boxes */

}

/* this styles the first column */

.comments-table td:first-child{

    background-image: url('https://i.pinimg.com/736x/73/5a/9c/735a9c9883361e25dbbcbc5e5f98f738.jpg');

    background-size: cover;

    background-position: center;

}

.comments-table td{

    background-image: url('');

    background-size: cover;

    background-position: center;

    border: 2px solid #e6007a;

    padding:10px;

    border-radius: 0px;

}

footer{

    background-color: rgba(0,0,0,0.5);

    border: var(--borders);

    border-radius: var(--curve);

    padding:5px;

}

</style>

<style>

/* Scrollbar styles */

::-webkit-scrollbar {

    width: 5px;

    height: 10px;

}

::-webkit-scrollbar-track {

    border-radius: var(--curve);

    border: 1px solid #e6007a;

}

::-webkit-scrollbar-thumb {

    background: #e6007a; 

    border-radius: var(--curve);

}

</style>

2 MYspace!!! 

Who I'd like to meet: