Light Blue Space Theme

Tags: space, galaxy, galaxies, astronaut, blue
Description:

Here's a fun space layout c:
➤Custom spaceship cursor
➤Set up so you can customize your interest topics
➤"About me" and "Who I want to meet" hidden
➤Blogs, URL, and "XXX is your friend" section hidden
Please comment and/or add me if you use this c: Also let me know of any other theme ideas. I'm looking to make more layouts!
Code:

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

<style>
/*Main Body Background Color*/
body{
background-image: url('wallpapercave.com/wp/wp3213868.jpg') !important;
background-attachment: FIXED !important;
background-repeat: NO-REPEAT !important;
background-position: CENTER !important;
background-size: COVER;}
</style>

<style>
/*Profile Background Color*/
main{
background-color: transparent !important;}
</style>

<style>
/*Adding rounded corners to profile*/
.top{
border-radius: 25px 25px 25px 25px !important;}

main{
border-radius: 25px 25px 25px 25px !important;}
</style>

<style>
/*Top Background Color*/
.top{
background-color: #00739955 !important;}
</style>

<style>
/*Top Links Background Color*/
.links{
text-align:center;
background-color: transparent !important;}
</style>

<style>
/*Search Users Box Background Color*/
.top input{
background-color: #007399 !important;}
</style>

<style>
/*Buttons Background Color*/
button{
border-radius: 25px 25px 25px 25px !important;
background-color: #007399 !important;}
</style>

<style>
/*Profile Name Background Color*/
h1{
text-align:center;
background-color: #00739955 !important;
border-radius: 25px 25px 25px 25px !important;}
</style>

<style>
/*Mood (Background Color/Background Image)*/
.mood{
text-align:center;
background-color: transparent !important;
border-radius: 25px 25px 0px 0px !important;}
</style>

<style>
/*Contact Box Background Color*/
.contact{
background-color: #00739955 !important;
border-radius: 25px 25px 25px 25px !important;
}
</style>

<style>
/*Interests Section/Social Links Heading Color*/
.table-section .heading{
border-radius: 25px 25px 25px 25px !important;
text-align:center;
background-color: #00739955 !important;}
</style>

<style>
/*Interests Table & Links Table Background Color*/
.profile .details-table td{
background-color: #00739955 !important;}
</style>

<style>
/*Blurbs Heading Background Color*/
.blurbs .heading{
border-radius: 25px 25px 25px 25px !important;
background-color: #00739955 !important;}
</style>

<style>
/*Hide "About Me" & "Who I'd Like To Meet" Headers*/
.blurbs .section h4{display: none !important;}
</style>

<style>
table.comments-table{
border-color: transparent!important;}

/*Friends/Comments Heading Color*/
.friends .heading{
border-radius: 25px 25px 25px 25px !important;
background-color: #00739955 !important;}
</style>

<style>
/*Comments Background Color*/
.comments-table td{
background-color: #00739955 !important;
border-radius: 25px 25px 25px 25px !important;
border-color: transparent;
}
</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(80, 80, 80);}

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

<style>
/*spacehey logo color.
you can change it at codepen.io/sosuke/pen/Pjoqqp */
nav img.logo{
filter: brightness(0) saturate(100%) invert(84%) sepia(12%) saturate(11%) hue-rotate(330deg) brightness(79%) contrast(89%);!important;
}
</style>

<style>
/*Footer Links (Background Color/Background Image)*/
footer{
background-color: #00739955 !important;
border-radius: 25px 25px 25px 25px !important;}
</style>

<style>
/*Change Text Colors*/
.top{
color: #1ac6ff;}

main{
color: #1ac6ff !important;}

footer{
color: #1ac6ff;}
</style>

<style>
/*Change Link Colors*/
a{
color: #1ac6ff !important;}

a:hover{
color: #e6f9ff !important;}

a:visited{
color: #1ac6ff !important;}

.top a{
color: #1ac6ff !important;}

.top a:hover{
color: #e6f9ff !important;}

.top a:visited{
color: #1ac6ff !important;}

.links a{
color: #1ac6ff !important;}

.links a:hover{
color: #e6f9ff !important;}

.links a:visited{
color: #1ac6ff !important;}

.friends-grid p{
color: #1ac6ff !important;}

footer .links a{
color: #1ac6ff !important;}

footer .links a:hover{
color: #e6f9ff !important;}

footer .links a:visited{
color: #1ac6ff !important;}
</style>

<style>
/*Change Interests Section Titles*/

table, th, td {
border: 0px trans;text-align:center;border-radius: 15px;}

:root {
--topic1: "one";
--topic2: "two";
--topic3: "three";
--topic4: "four";
--topic5: "five";
--topic6: "six";}

.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 #1ac6ff !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>
/*Follow font instructions at: forum.spacehey.com/topic?id=6530 */
/*Change normal text font*/
.profile .blurbs .section p{
font-family: 'Open Sans Condensed', sans-serif;}
</style>

<style>
/*Change link font*/
a{
font-family: 'Open Sans Condensed', sans-serif;}

a:hover{
font-family: 'Open Sans Condensed', sans-serif;}

a:visited{
font-family: 'Open Sans Condensed', sans-serif;}
</style>

<style>
/*Change Profile Name Font*/
h1{
font-family: 'Open Sans Condensed', sans-serif;font-size:;}
</style>

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

<style>
/* cursors: top URL is the cursor that shows when you hover over links, bottom URL is the main or "resting" cursor */
/* cursors-4u.net */
a:hover {
cursor: url('cur.cursors-4u.net/mechanics/mec-1/mec8.cur'), auto;
}
* {
cursor: url('cur.cursors-4u.net/mechanics/mec-1/mec8.cur'), auto;
}
</style>

<style>
/* this edits your friends' icons */
.profile .friends .person img:not(.icon) {
border-radius:15px;
box-shadow: 1px 0px 7px 2px rgb(26, 201, 255)
}
</style>

<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: "⭐"
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: "🌟"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: "🌠"
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward 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 2 group */
content: "🌙"
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: "🛰️"
}
</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: "⬐Do Your Thing⬎"; font-size:.8rem; font-weight:bold;color:#1ac6ff; }

/*"Your Blurbs" Title*/
.blurbs .heading{ font-size:0; text-align:center;}
.blurbs .heading:before{ content: "About Me"; font-size:.8rem; font-weight:bold;color:#1ac6ff; }

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

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

<style>
/* for this box, you can add an image of your choice. it's right under the contact box. */
.url-info{
background: url('media4.giphy.com/media/gmmDZTShXCW48gFLnd/200w.webp?cid=ecf05e47modf1palj71w8nwugt88vt8x7087key4n4o6r8gv&;rid=200w.webp&ct=s');
background-position: center;
background-repeat: NO-REPEAT !important;
border: var(--borders)!important;
border-radius: 15px;
height: 200px;}

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

<style>
/*Hides "XXX is your friend" Box*/
.profile-info{display: none !important;}
</style>

<style>
/*Hides Blogs*/
.blog-preview{display: none !important;}
</style>

<style>
/* the color of the number count of your friends/comments */
.count {
color: #1ac6ff;
}
</style>

<style>
/*Interests and links table header text color*/
.profile .table-section .heading h4 {
color: #1ac6ff;
}
</style>

<style>
/* the online symbol and text
you can change it at codepen.io/sosuke/pen/Pjoqqp*/
.online{color: var(--links) !important;}
.online img{
filter: brightness(0) saturate(100%) invert(84%) sepia(12%) saturate(11%) hue-rotate(330deg) brightness(79%) contrast(89%); !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 0 of 0 comments ( View all | Add Comment )