Red Roses

Tags: red, roses, cursive, bela

Description:

If you have any questions, please comment below or go to my blog here.

Image Credits —

    ⇘ Profile Background (2 images):
(Red Tree) https://wallpapercave.com/wp/wp10550825.jpg
(Falling Red Petals) https://media.giphy.com/media/pZv3UCbdReTSg/giphy.gif

    ⇘ Comments Table Background: https://i.imgur.com/55Hmym5.jpg

    ⇘ .online Code: http://dl7.glitter-graphics.net/pub/104/104607x61kd02dl0.gif

    ⇘ Layout Preview:

Preview:

click on the image for a larger preview

Code:

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

<style>
@import url('https://fonts.googleapis.com/css2?family=Libre+Bodoni:ital@0;1&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Fleur+De+Leah&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Carattere&display=swap');
</style>

<style>
:root{
    --headers: SlateGray;
    --text: SlateGray;
    --names: SlateGray;
    --links: gray;
    --borders: 1px dotted darkred;
    --font-family: 'Carattere', cursive;
    --curve: 10px; 
}

h1, h3, h4, h5{color: var(--headers) !important;} /* headings*/
a{color: var(--links) !important;} /* color of links */
p, h2, .count {color: var(--text) !important;} /* color of text */
b:not(DIV.mood > P:nth-child(1) > B){color: var(--names)!important;}
.profile .friends .person p{color: var(--names) !important;} /* color of names and friends counter */
nav label{color: var(--links) !important;} /* color of search */
.section h4 {display:none;} /* aboutme & want2meet headings */
.blurbs .heading {display:none;}

.online{content:url("http://dl7.glitter-graphics.net/pub/104/104607x61kd02dl0.gif");
    margin:auto;
}


body{
    background-image: url('https://media.giphy.com/media/pZv3UCbdReTSg/giphy.gif'), url('https://wallpapercave.com/wp/wp10550825.jpg');
    background-color: #000;
    background-size: 20%, 100%;
    color: var(--text)!important;
    background-attachment: fixed;
}
nav{
    background-color: rgba(0,0,0,0.7);
    border: none;
    border-radius: 10px 10px 0px 0px;
}
nav .top{
    background: transparent;
    color:var(--links);
}
nav .top a, nav .links a{
    color: var(--text);
}
nav .links{
    background-color: transparent;
    border-radius: var(--curve);
    text-align: center;
}

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

nav img.logo{
    filter: brightness(0) saturate(100%) invert(0%) sepia(97%) saturate(14%) hue-rotate(253deg) brightness(95%) contrast(103%) drop-shadow(0 0 0.7px red)!important;
}


.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;
}

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

h1, h2, h3, h4, h5{
    font-family: 'Fleur De Leah', cursive;
    font-size: 28px!important;
    text-align: center;
    font-weight: 1;
    letter-spacing: 1px;
    
}
a, p, b, nav label, .section{ 
    font-family: var(--font-family) !important;	
    font-size: 18px!important;
    font-weight: 1;
    letter-spacing: 1px;
}

hr{
    height:1px;
    background: var(--links);
    border: none;
}
/* this is where you adjust the borders and background */
.blurbs, .friends, .blog-preview, .profile .table-section, .mood, .url-info{
    border-radius: var(--curve) !important;
    border: var(--borders) !important;
    background-color: transparent!important;
    text-align: center;
    padding:5px;
}
.blog-preview p{
    color: #C20318!important;
    letter-spacing: 1px;
}
.contact{
    border-radius: var(--curve) !important;
    border: var(--borders) !important;
    background-color: transparent!important;
    padding:5px;
}
.icon{
    border:none !important;
    font-size: 10px;
}

.comment-replies{
    border:2px dotted darkred; 
    
} 
.comment-reply:not(:first-child){
    border-top: 2px dotted var(--links); 
}

td{
    background-color: transparent!important;
}

main{
    background: rgba(0,0,0,0.7);
    border-radius: none!important;
    border: transparent !important;
    outline: none !important;
}


.table-section{
    border:none !important;
    background-color:transparent!important;
    border-radius: var(--curve) !important;
}

/* the header section of the boxes */
.heading, .blog-preview h4, .section h4{
    background: none !important;
    text-align: center;
}

.profile-info {
    border-radius: var(--curve) !important;
    border: var(--borders) !important;
    background-color: transparent!important;
    text-align: center;
    padding:5px;
}

.friends-grid{
    text-align: center;
}
.profile .friends .person{
    width: 100px;
}
.profile .friends .person img{
    width: 100px;
    height:100px;
}

.general-about .details{
    text-align: right!important;
}

.comments-table {
    border: none;
    border-radius: 8px;
    border-spacing: 5px; /* this changes the distance between boxes */
}
#comments, .url-info, .table-section, .mood, .blog-preview{
    margin-top:20px!important;
}
.mood{
    margin-bottom:20px!important;
}
.comments-table td{
    border: none;
    border-radius: 10px;
    background-image: url('https://media.istockphoto.com/photos/red-sparkles-at-night-picture-id1190412487?k=20&m=1190412487&s=612x612&w=0&h=QjRDIg_UR9mmAdVK_fGDFSEu2KKobF2jS_MleVPNSNI=');
    background-size: 100%100%;
}
.comments-table td:first-child{
    background-image: url('https://media.istockphoto.com/photos/red-sparkles-at-night-picture-id1190412487?k=20&m=1190412487&s=612x612&w=0&h=QjRDIg_UR9mmAdVK_fGDFSEu2KKobF2jS_MleVPNSNI=');
    background-size: cover;
}

footer{
    background-color: rgba(0,0,0,0.7);
    border: none;
    border-radius: 0px 0px 10px 10px;
    margin-top: 0px;
}

::-webkit-scrollbar {
    width: 2px;
    height: 3px;
}
::-webkit-scrollbar-track {
    border-radius: var(--curve);
    border: 1px solid black;
}
::-webkit-scrollbar-thumb {
    background: black; 
    border-radius: var(--curve);
}

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