ABOVE THE ABOUT ME PARAGRAPH
CODE BELOW GOES UNDER YOUR ABOUT ME PARAGRAPH
TO ADD YOUTUBE VIDEO CLICK SHARE, EMBED, COPY THEN PASTE HERE ONLY CHANGING THE WIDTH AND HEIGHT TO 350 AND 215
MAIN CODE - BODY MEANS THE FULL BACKGROUND - PROFILE MEANS ANYTHING WITHIN THE MIDDLE SECTION
ABOVE THE ABOUT ME PARAGRAPH
CODE BELOW GOES UNDER YOUR ABOUT ME PARAGRAPH
TO ADD YOUTUBE VIDEO CLICK SHARE, EMBED, COPY THEN PASTE HERE ONLY CHANGING THE WIDTH AND HEIGHT TO 350 AND 215
MAIN CODE - BODY MEANS THE FULL BACKGROUND - PROFILE MEANS ANYTHING WITHIN THE MIDDLE SECTION
::selection {
color: #286192;
background: #D8EDFF;
}
/* General CSS Stuff */
body {
background: repeating-linear-gradient(135deg, #FFE6F0, #FFE6F0 15px, #fff 0, #fff 16px);
color: #872A4E;
font-family: "balsamiq sans";
padding-top: 10px;
}
main {
background-color: transparent;
font-size: 15px;
color: #872A4E;
padding: 10px;
}
h1 {
font-family: "Cheri";
font-size: 24px;
padding: 7px;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
margin-top: 10px;
margin-bottom: 10px;
background: repeating-linear-gradient(135deg, #FFE6F0, #FFE6F0 15px, #fff 0, #fff 30px);
text-align: center;
border: 2px dashed #ffafcc;
}
h2,
h3,
h4 {
font-family: "Cheri";
font-size: 20px;
padding: 7px;
margin-top: 10px;
margin-bottom: 10px;
border-top-left-radius: 15px;
border-top-right-radius: 15px;
background-color: #FFE6F0;
text-align: center;
width: 100%;
}
footer {
background-color: white;
color: #872A4E;
border: 2px dashed #ffafcc;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
width: 100%;
padding: 5px;
margin-left: auto;
margin-right: auto;
}
footer a {
color: #C55582;
}
footer a:hover {
text-decoration: none;
}
button,
[id=q] {
border: 2px solid #ffafcc;
background-color: white;
color: #872A4E;
font-family: 'balsamiq sans';
font-size: 10px;
border-radius: 5px;
padding: 2px;
margin-top: 10px;
}
/* SpaceHey specfiic */
nav .top {
background-color: white;
color: #872A4E;
border: 2px dashed #ffafcc;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
width: 100%;
padding: 8px;
margin-left: auto;
margin-right: auto;
margin-bottom: 15px;
}
nav .top a {
color: #872A4E;
text-shadow: 0 0 2px #ffafcc;
}
nav .top a:hover {
color: #ffafcc;
}
nav .links {
background-color: white !important;
text-align: center;
font-size: 14px;
color: #872A4E;
border: 2px dashed #ffafcc;
border-radius: 15px;
width: 100%;
padding: 5px;
margin-left: auto;
margin-right: auto;
margin-bottom: 5px;
height: auto;
}
nav .links li:not(:last-child)::after,
footer .links li:not(:last-child)::after {
content: " ♡ ";
margin: 2px;
color: #872A4E;
}
nav .links a {
text-decoration: none;
color: #C55582;
text-shadow: 0 0 2px #ffafcc;
}
nav .links a:hover {
color: #ffafcc;
}
.container {
width: 75%;
}
.blurbs {
background: white;
text-align: center;
padding: 10px;
border: 2px dashed #ffafcc;
border-radius: 15px;
height: auto;
}
.blurbs a {
text-decoration: none;
color: #C55582;
text-shadow: 0 0 2px #ffafcc;
}
.blurbs a:hover {
color: #ffafcc;
}
.blurbs h1 {
margin: 15px 0;
}
.blurbs .heading {
display: none;
}
.profile .blurbs {
margin: 10px 0;
}
.profile .blurbs .section h4 {
display: none;
}
.col.left {
background-color: white;
border: 2px dashed #ffafcc;
border-top-right-radius: 15px;
border-top-left-radius: 15px;
}
.col.left a {
text-decoration: none;
color: #C55582;
text-shadow: 0 0 2px #ffafcc;
}
.col.left a:hover {
color: #ffafcc;
}
.col.w-40 {
min-width: 290px;
/* Mobile fix */
width: 30%;
}
.blog-preview {
background: white;
padding-left: 15px;
padding-right: 15px;
border: 2px dashed #ffafcc;
border-bottom-right-radius: 15px;
border-bottom-left-radius: 15px;
text-align: center;
}
.blog-preview a {
text-decoration: none;
color: #C55582;
text-shadow: 0 0 2px #ffafcc;
}
.blog-preview a:hover {
color: #ffafcc;
}
.blog-preview p .pinned .icon {
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/pinned.gif");
}
.friends {
background: white;
padding: 15px;
border: 2px dashed #ffafcc;
border-radius: 15px;
margin-bottom: 10px;
text-align: center;
}
.friends a {
text-decoration: none;
color: #C55582;
text-shadow: 0 0 2px #ffafcc;
}
.friends a:hover {
color: #ffafcc;
}
.count {
color: #C55582;
}
.icon {
border-radius: 0px !important;
}
.profile .contact .heading,
.profile .table-section .heading,
.setting-section .heading,
.home-actions .heading {
color: #872A4E;
}
.profile .contact .heading {
padding: 0px;
}
.logout-btn {
font-family: 'balsamiq sans';
color: #872A4E;
text-shadow: 0 0 2px #ffafcc;
}
.logout-btn:hover {
color: #ffafcc;
}
li.active .icon {
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/notif.gif");
height: 7px;
width: 9.5px;
display: inline-block;
}
li .icon {
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/new.gif");
height: 7px;
width: 21px;
display: inline-block;
}
nav .links .icon {
vertical-align: 0px;
}
.online {
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/online.gif");
animation-name: none;
}
.profile-info {
color: #872A4E;
background: white;
padding: 15px;
border: 2px dashed #ffafcc;
border-radius: 15px;
margin-bottom: 10px;
text-align: center;
height: 50px;
}
.profile-info a {
text-decoration: none;
color: #C55582;
text-shadow: 0 0 2px #ffafcc;
}
.profile-info a:hover {
color: #ffafcc;
}
.profile-info h3 {
background: transparent;
border: none;
}
.general-about {
height: auto;
}
.general-about .profile-pic {
height: 130px;
width: 130px;
}
.general-about .profile-pic img {
margin-left: 5px;
width: 130px;
height: 130px;
border-top-left-radius: 100%;
border-top-right-radius: 0%;
border-bottom-left-radius: 100%;
border-bottom-right-radius: 100%;
box-shadow: 0px 0px 3px #C55582;
}
.profile .friends .person img:not(.icon) {
border-top-left-radius: 100%;
border-top-right-radius: 0%;
border-bottom-left-radius: 100%;
border-bottom-right-radius: 100%;
box-shadow: 0px 0px 3px #C55582;
height: 75px;
width: 75px;
}
.friends .heading a.more {
float: none;
}
.profile .friends .person p {
color: #872A4E;
}
.logo {
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/logo.png");
width: 165px;
height: 42px;
}
.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("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star66.gif")
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* Add to Favorites */
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star66.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* Send Message */
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star71.gif")
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* Forward to Friend */
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star71.gif")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* Instant Message */
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star67.gif")
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* Block User */
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star67.gif")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* Add to Group */
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star68.gif")
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* Report Profile */
content: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/star68.gif")
}
.comments-table td img {
border-top-left-radius: 100%;
border-top-right-radius: 0%;
border-bottom-left-radius: 100%;
border-bottom-right-radius: 100%;
box-shadow: 0px 0px 3px #C55582;
}
img:hover {
transform: scale(1.1);
transition: transform .2s;
}
.comments-table td {
background-color: #fff;
border: 1px dashed #ffafcc;
}
.comments-table tr {
background: repeating-linear-gradient(90deg, #FFeff5, #FFeff5 5px, #fff 0, #fff 10px);
}
.comments-table td * {
text-align: center;
}
.comments-table td button {
font-size: 12px;
border: 2px solid #ffafcc;
border-radius: 5px;
padding: 2px;
color: #C55582;
text-shadow: 0 0 2px #ffafcc;
float: left;
}
.comments-table td button:hover{
color:#ffafcc
}
.comment-replies {
border: none;
background-color: #FFeff5;
border-left: 25px solid #ffafcc;
}
.comments-table .report {
font-size: 12px;
float:right;
}
.comments-table .report img{
display: none;
}
/* Bonus additions */
#scrollbox {
margin-left: auto;
margin-right: auto;
height: auto;
max-height: 100px;
width: 85%;
overflow-y: scroll;
text-align: left;
border: 2px dashed #ffafcc;
border-radius: 2px;
padding: 5px;
}
#scrollbox::-webkit-scrollbar {
width: 5px;
background: #FFeff5;
}
#scrollbox::-webkit-scrollbar-thumb {
background: #ffafcc;
}
your custom heading!
Your actual "about me" information goes here! Feel free to use any of the h1-h3 tags.
Note that h4 is omitted so the default "About Me" and "Who I'd like to meet" are not shown.
You can also remove this and paste it into the "Meet" section to keep things more organized and make them easier to edit!
This is bold text. This is a link. This is italics.
Add to Friends
Add to Favorites
Send Message
Forward to Friend
Instant Message
Block User
Add to Group
Report User
