Dear FutureMe,
@font-face {
font-family: "dinkie9px";
src: url('https://chairfiles.vercel.app/DinkieBitmap-9px.woff2') format('woff2');
}
@font-face {
font-family: "pixelmplus10";
src: url("https://chairfiles.vercel.app/PixelMplus10-Regular.woff2") format("woff2");
font-weight: normal;
font-style: normal;
}
body {
font-family: dinkie9px;
font-weight: normal;
text-decoration-color: #4D21CB;
}
.container {
background-image: url("https://chairfiles.vercel.app/nsotilebg.png");
background-repeat: repeat;
height:100%;
}
main {
background-image: url("https://chairfiles.vercel.app/nsotilebg.png");
background-repeat: repeat;
}
.comments-table td *, .bulletin-table td * {
max-width:60%;
}
.profile .contact, .profile .url-info, .profile .table-section, .home-actions
{
width: 100%;
}
@media(min-width: 30em){ /* desktop */
.col.w-40 {
width: 55%;
}
.blog-preview p {
background-image: url("https://chairfiles.vercel.app/speechbubble.png");
width:75%;
background-size:95%;
}
}
@media(max-width: 30em){ /* mobile */
.col.w-40 {
width: 100%;
}
.blog-preview p {
background-image: url("https://chairfiles.vercel.app/speechbubblemobile.png");
width:85%;
background-size:145%;
}
}
.profile .contact {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
font-weight: 400;
font-family: 'pixelmplus10', sans-serif;
font-size: 7px;
color: #4D21CB;
background-color:#FDF8FD;
}
.profile .contact .inner {
padding-left: 4px;
padding-right: 4px;
color: #4D21CB;
}
.profile .contact .innertime {
padding: 8px;
color: #000;
}
.profile .contact .inner .f-row .f-col a {
color: #000;
font-weight: 400;
}
.url-info {
height: 172px;
width: 343px;
background-image: url("https://chairfiles.vercel.app/mrreow.png");
font-weight: 400;
}
main .left, main .right {
padding: clamp(5px, 5%, 40px);
}
main {
image-rendering: pixelated;
}
.container {
width: 1440px;
max-width: 100%;
margin: 0 auto 10px;
}
.profile .url-info
{
border: 0px;
width: 343px;
font-weight: 400;
}
.url-info p {
padding-top: 4px;
font-weight: 400;
}
button:not(.logout-btn) {
background: #f0d1f1;
box-shadow: inset 2px 2px #815CDA, 2px 2px #FDFDFD;
color: #4d23cf;
font-size: 15px;
font-weight: normal;
text-shadow: #f0d1f1 0px 2px 5px;
border: 2px solid #f0d1f1;
border-radius: 2px;
padding: 4px;
}
#comments button {
background: #FDF8FD;
box-shadow: none;
color: #4d23cf;
font-size: 15px;
font-weight: normal;
text-shadow: none;
border: none;
padding: 4px;
}
.comments-table .comment-replies {
border: 0px solid white;
max-width: 100%;
}
.comments-table .comment-replies .comment-reply {
max-width: 100%;
padding-left: 40px;
background-image: url("https://chairfiles.vercel.app/reparrow.png");
background-repeat: no-repeat;
}
: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: #ED0707;
--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);
}
.profile .contact .heading {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
font-weight: 400;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
}
.timeselector .contact {
border: 2px solid #4D23CD;
}
.timeselector {
width: 180px;
height: 91.85px;
}
.timeselector .contact .heading {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
font-weight: 400;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
}
.profile .contact .heading h4 {
font-weight: 400;
}
.timeselector .contact .heading h4 {
font-weight: 400;
margin-top: 0px;
margin-bottom: 0px;
}
.profile .table-section .heading h4 {
font-weight: 400;
letter-spacing: 0.045em;
}
.profile .table-section .inner {
padding-left: 6px;
padding-right: 6px;
padding-bottom: 6px;
}
.profile .table-section {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
font-weight: 400;
background-color:#FDF8FD;
}
.details-table td {
background: #F7E1FA3d;
}
/* stack everything in innertime vertically */
.innertime {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.details-table td:first-child {
color: #4D21CB;
font-weight: 400;
}
.details-table td:first-child {
background: #805cdc3d;
}
.profile .table-section .heading {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
}
.general-about .profile-pic .pfp-fallback {
box-shadow: 8px 8px #4e23cd48;
}
.general-about .profile-pic {
padding-bottom: 40px;
box-sizing: content-box;
}
.general-about .profile-pic:before {
display: block;
background-color: #EFCFEF;
box-shadow: 0px 0px 0px 4px #90F3E1, 0px 0px 0px 6px #4D23CD, 10px 10px #4e23cd48;
border: 2px solid #4D23CD;
border-bottom: 0px solid #4D23CD;
color: #4D21CB;
background-image: url("https://chairfiles.vercel.app/misalignednavbuttons.png");
background-position: right center;
background-repeat: no-repeat;
font-weight: 400;
content: "Webcam";
font-size: 18px;
text-align: left;
letter-spacing: 0.045em;
padding: 4px;
margin-left: 6px;
}
.general-about .profile-pic .pfp-fallback {
border: 2px solid #4D23CD;
box-shadow: 0px 0px 0px 4px #90F3E1, 0px 0px 0px 6px #4D23CD, 10px 10px #4e23cd48;
font-weight: 400;
font-family: 'pixelmplus10', sans-serif;
image-rendering: optimizeQuality;
color: #4D21CB;
background-color:#FDF8FD;
text-align: center;
display: block;
justify-content: center;
margin-left: 6px;
}
.mood {
padding-top:8px;
}
.contact .inner a img {
image-rendering: pixelated;
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://chairfiles.vercel.app/1heart.png");
}
.contact .inner .f-row:nth-child(1) .f-col:nth-child(2) a:before {
/* add to favorite */
content: url("https://chairfiles.vercel.app/2doubleheart.png");
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(1) a:before {
/* send a message */
content: url("https://chairfiles.vercel.app/32fingers.png");
}
.contact .inner .f-row:nth-child(2) .f-col:nth-child(2) a:before {
/* foward to friend*/
content: url("https://chairfiles.vercel.app/4sparkle.png");
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(1) a:before {
/* instant message */
content: url("https://chairfiles.vercel.app/5musicalnote.png");
}
.contact .inner .f-row:nth-child(3) .f-col:nth-child(2) a:before {
/* block user */
content: url("https://chairfiles.vercel.app/6explosion.png");
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(1) a:before {
/* add to group */
content: url("https://chairfiles.vercel.app/7confetti.png");
}
.contact .inner .f-row:nth-child(4) .f-col:nth-child(2) a:before {
/* report */
content: url("https://chairfiles.vercel.app/8angrysign.png");
}
.blog-preview p .pinned .icon {
content: url("https://chairfiles.vercel.app/pin.png");
width: 20px;
height: 20px;
position: relative;
}
.friends .heading a.more {
margin-right: 75px;
}
.blog-preview h4 {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
font-weight: 400;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
margin: auto;
}
.blog-preview {
display: inline-block;
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
background-color: #FDF8FD;
width: 100%;
background: url("https://chairfiles.vercel.app/JINEBG.png");
background-repeat: repeat;
background-size: 50%;
}
.blog-preview p {
margin-left:32px;
background-repeat: no-repeat;
height:72px;
padding-top:12px;
text-indent: 16px;
}
a {
font-size: 18px;
}
li {
font-size: 18px;
}
.urlinfo {
font-size: 18px;
}
p {
font-size: 18px;
}
h4 {
font-size: 18px;
}
h1 {
font-size: 36px;
}
html, body {
}
a:hover {
cursor: url('https://chairfiles.vercel.app/cursor.png'), auto;
}
* {
cursor: url('https://chairfiles.vercel.app/cursor.png'), auto;
}
/* background changer stuff */
.innertime {
padding: 4px;
background-color:#F7E0FA;
}
.noonbutton{
box-shadow: inset 2px 2px #815CDA, 2px 2px #FDFDFD;
background-color:#F7E0FA;
display:inline-block;
justify-content: center;
float:left;
width:100%;
padding:3px
}
.noonbutton a {
font-family:"pixelmplus10";
font-weight: normal;
float:left;
padding-left: 8px;
color: #4D23CD;
}
.noonbutton img {
padding: 2px;
float:right;
}
.duskbutton{
box-shadow: inset 2px 2px #815CDA, 2px 2px #FDFDFD;
background-color:#F7E0FA;
display:inline-block;
justify-content: center;
float:center;
width:100%;
padding:3px
}
.duskbutton a {
font-family:"pixelmplus10";
font-weight: normal;
float:left;
padding-left: 8px;
color: #4D23CD;
}
.duskbutton img {
float:right;
padding: 2px;
}
.nightbutton{
box-shadow: inset 2px 2px #815CDA, 2px 2px #FDFDFD;
background-color:#F7E0FA;
display:inline-block;
justify-content: center;
float:right;
width:100%;
padding:3px
}
.nightbutton a {
font-family:"pixelmplus10";
font-weight: normal;
float:left;
padding-left: 8px;
color: #4D23CD;
}
.profile .blurbs .section .timeselector h4 {
color: #4D23CD;
}
/* make timeselector stay in the bottom right corner of the screen permanently */
.timeselectorwrapper {
position: fixed;
bottom: 100;
right: 0;
z-index: 100;
}
.nightbutton img {
float:right;
padding: 2px;
}
.fakebgthing {
background-attachment: fixed;
background-position: left center, left center, right center, right center;
background-size: 100% 100%, calc(calc(100vw - 1440px) / 2) auto, calc(calc(100vw - 1440px) / 2) auto, 100% 100;
image-rendering: pixelated;
background-repeat: repeat-y;
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
z-index: -1;
background-color:#ff0000;
}
.origbg {
background:
linear-gradient(to right, transparent, transparent),
url("https://chairfiles.vercel.app/spaceheyleftbg.png") no-repeat,
url("https://chairfiles.vercel.app/spaceheyrightbg.png") no-repeat,
linear-gradient(to left, transparent, transparent);
background-attachment: fixed;
background-position: left center, left center, right center, right center;
image-rendering: pixelated;
background-repeat: repeat-y;
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
z-index: -2;
}
.noonbg {
background:
linear-gradient(to right, transparent, transparent),
url("https://chairfiles.vercel.app/spaceheyleftbg.png") no-repeat,
url("https://chairfiles.vercel.app/spaceheyrightbg.png") no-repeat,
linear-gradient(to left, transparent, transparent);
background-attachment: fixed;
background-position: left center, left center, right center, right center;
image-rendering: pixelated;
background-repeat: repeat-y;
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
visibility: hidden;
}
.duskbg {
background:
linear-gradient(to right, transparent, transparent),
url("https://chairfiles.vercel.app/spaceheyleftduskbg.png") no-repeat,
url("https://chairfiles.vercel.app/spaceheyrightduskbg.png") no-repeat,
linear-gradient(to left, transparent, transparent);
background-attachment: fixed;
background-position: left center, left center, right center, right center;
image-rendering: pixelated;
background-repeat: repeat-y;
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
visibility: hidden;
}
.nightbg {
background:
linear-gradient(to right, transparent, transparent),
url("https://chairfiles.vercel.app/spaceheyleftnightbg.png") no-repeat,
url("https://chairfiles.vercel.app/spaceheyrightnightbg.png") no-repeat,
linear-gradient(to left, transparent, transparent);
background-attachment: fixed;
background-position: left center, left center, right center, right center;
image-rendering: pixelated;
background-repeat: repeat-y;
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
visibility: hidden;
}
.fakebgthing:target {
visibility: visible;
}
.profile .blurbs .heading h4 {
font-weight: normal;
letter-spacing: 0.045em;
}
@media(max-width:1840px) {
.fakebgthing {
background-size: 100% 100%, 180px 100%, 180px 100%, 100% 100%;
}
.timeselectorwrapper {
right: 0;
}
}
@media(min-width:1840px) {
.timeselectorwrapper {
right: calc(calc(calc(calc(calc(100% - 1440px) / 2) - 180px) / 2) - 13px);
}
.fakebgthing {
background-size: 100% 100%, calc(calc(100% - 1440px) / 2) auto, calc(calc(100% - 1440px) / 2) auto, 100% 100%;
}
}
.profile-info {
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border: 2px solid #4D23CD;
}
b, strong {
font-weight: normal;
}
.col h1 {
font-weight: normal;
font-size: 36px
}
.profile .friends {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #DEDEDE, inset 0px 0px 0px 6px #4D23CD;
background-color: #FCF0FD;
font-weight: normal;
image-rendering: optimizeQuality;
}
.profile #comments {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
background-color: #90F3E1;
font-weight: normal;
image-rendering: optimizeQuality;
}
.profile .friends .heading {
padding: 8px;
padding-left: 12px;
background-color: #E2E2E1;
box-shadow: inset 0px 0px 0px 4px #DEDEDE, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
background-image: url("https://chairfiles.vercel.app/grayednavbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
}
.profile .friends .heading h4 {
font-weight: normal;
letter-spacing: 0.045em;
}
.profile .friends .inner .section .heading {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
font-weight: 400;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
}
.profile .blurbs .inner .section .heading {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
font-weight: 400;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
}
@media(min-width: 1440px){
.timeselector {
transform: scale(100%);
}
.profile .blurbs {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #DEDEDE, inset 0px 0px 0px 6px #4D23CD;
background-color: #FCF0FD;
font-weight: normal;
font-family: 'pixelmplus10', sans-serif;
}
.profile .blurbs .heading {
padding: 8px;
padding-left: 12px;
background-color: #E2E2E1;
box-shadow: inset 0px 0px 0px 4px #DEDEDE, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
background-image: url("https://chairfiles.vercel.app/grayednavbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
}
.inner .section {
color: rgb(37, 37, 37);
font-size: 18px;
padding:4px;
}
.profile .blurbs .section h4 {
color: rgb(37, 37, 37);
font-size: 18px;
}
}
@media(max-width: 1440px){
.profile .blurbs .heading h4 {
font-weight: normal;
letter-spacing: 0.045em;
font-family: 'dinkie9px', sans-serif;
}
.inner .section {
color: #4D21CB;
font-size: 18px;
padding:4px;
}
.profile .blurbs .section h4 {
color: #4D21CB;
font-size: 18px;
}
.timeselector {
transform: scale(0);
display: none;
}
.profile .blurbs {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
font-weight: 400;
font-family: 'pixelmplus10', sans-serif;
font-size: 7px;
color: #4D21CB;
background-color:#FDF8FD;
}
.profile .blurbs .heading {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
font-weight: 400;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
}
}
.details-table tbody tr td p {
font-family: "pixelmplus10";
}
.profile .friends .person p {
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
padding: 4px;
background-color: #EFCFEF;
width: 101px;
font-weight:normal;
}
#comments .inner {
background: url("https://chairfiles.vercel.app/result_bg_tile.png"), rgb(216, 230, 242);
background-size:contain;
background-repeat:repeat-x;
margin: 6px;
margin-top: auto;
}
#comments .heading {
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
font-weight: 400;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
letter-spacing: 0.045em;
}
#comments {
margin: 20px 0;
padding-left: -4px;
}
.comments-table td:first-child {
background: #FDF8FD;
font-weight: normal;
max-width:25%;
justify-content: left;
direction: rtl;
color: #4883CD;
outline:#00000000;
border: none;
}
.comments-table td:first-child a {
color: #4883CD;
outline:#00000000;
border: none;
max-width: 100%;
}
.comments-table td:last-child {
background: #FDF8FD;
font-weight: normal;
color: #4F1CCF;
font-size:18px;
outline:#00000000;
border: none;
max-width:75%
}
.comments-table td:last-child a {
color: #4F1CCF;
font-size:18px;
outline:#00000000;
border: none;
max-width: 100%;
}
.comments-table td:first-child p {
max-width: 100%;
}
.comments-table td:last-child p {
max-width: 100%;
}
.profile .friends .person {
width: 105px;
display: inline-block;
padding: 0 20px 15px 0;
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
background-color: #FDF8FD;
}
.profile .friends .person img:not(.icon) {
max-width: 85px;
max-height: 85px;
display: block;
margin: 0 auto;
align-self: center;
padding-left: 16px;
}
.friends .inner .comments-table tr td .report a img {
image-rendering: pixelated;
font-size: 0;
}
.friends .inner .comments-table tr td .report a img:before {
font-size: 1em;
display: block
}
.friends .inner .comments-table tr td .report a:before {
content: url("https://chairfiles.vercel.app/priv.png");
}
.comments-table td:first-child img:not(.icon) {
width: 50px;
max-width: 100%;
max-height: 100px;
padding-right: 4px;
}
.comments-table tbody {
background-color: #FDF8FD;
border: none;
}
.comments-table {
padding: 6px;
border: none;
}
footer {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
font-weight: 400;
font-family: 'pixelmplus10', sans-serif;
color: #4D21CB;
background-color:#FDF8FD;
margin: 0px auto;
padding: 0 0 3px 0;
width: 95%;
text-align: center;
justify-content: center;
}
footer p {
width: 95%;
vertical-align: middle;
display: inline-block;
}
footer ul {
width: 95%;
vertical-align: middle;
display: inline-block;
}
footer:before {
display: block;
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
content: "Footer";
font-size: 18px;
text-align: left;
letter-spacing: 0.045em;
}
.mood {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
font-weight: 400;
font-family: 'pixelmplus10', sans-serif;
color: #4D21CB;
background-color:#FDF8FD;
margin: 0px auto;
padding: 0 0 3px 0;
margin-bottom: 8px;
}
.mood:before {
display: block;
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
content: "Mood";
font-size: 18px;
text-align: left;
letter-spacing: 0.045em;
}
.profile .mood p {
margin-left: 12px;
}
span[itemprop="name"]:before {
display: block;
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
font-family: 'dinkie9px', sans-serif;
color: #4D21CB;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
content: "Name";
font-size: 18px;
text-align: left;
letter-spacing: 0.045em;
}
span[itemprop="name"] {
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
font-weight: 400;
letter-spacing: 0.045em;
color: #4D21CB;
font-family: 'dinkie9px', sans-serif;
background-color:#FDF8FD;
width: auto;
max-width: 450px;
text-align: center;
display: block;
justify-content: center;
}
nav {
margin-top: 4px;
border: 2px solid #4D23CD;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD, 4px 4px #4e23cd48;
font-weight: 400;
font-family: 'pixelmplus10', sans-serif;
color: #4D21CB;
background-color:#FDF8FD;
margin: 0px auto;
padding: 0 0 3px 0;
width: 95%;
align-content: center;
margin-top: 4px;
}
nav .top {
margin-left:4px;
margin-right:4px;
background-color: #FDF8FD;
box-shadow: inset 0px 0px 0px 2px #4D23CD;
margin-bottom: -2px;
margin-top:-2px;
}
nav {
}
.top .left a img {
filter: brightness(0) saturate(100%) invert(16%) sepia(100%) saturate(3681%) hue-rotate(256deg) brightness(79%) contrast(110%);
}
.logout-btn {
color: #4D23CD;
font-family: 'pixelmplus10', sans-serif;
font-size: 18px;
}
.center form label {
font-size: 18px;
}
#q {
background: #f0d1f1;
box-shadow: inset 2px 2px #815CDA, 2px 2px #FDFDFD;
color: #4d23cf;
font-size: 15px;
font-weight: normal;
text-shadow: #f0d1f1 0px 2px 5px;
border: 2px solid #f0d1f1;
border-radius: 2px;
padding: 4px;
}
nav .links {
background:none;
margin-bottom:-2px;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
padding:8px;
padding-left: 16px;
background-color: #FDF8FD;
margin-top:2px;
}
nav .links a {
text-shadow: 0 0 7px #00000000;
color: #4D23CD;
}
nav .links .special a {
text-shadow: 0 0 7px #00000000;
color: #4D23CD;
}
nav:before {
display: block;
padding: 8px;
padding-left: 12px;
background-color: #EFCFEF;
box-shadow: inset 0px 0px 0px 4px #90F3E1, inset 0px 0px 0px 6px #4D23CD;
border-bottom: 2px solid #4D23CD;
color: #4D21CB;
background-image: url("https://chairfiles.vercel.app/navbuttons.png");
background-position: right center;
background-repeat: no-repeat;
padding-right: 12px;
font-weight: 400;
content: "Header";
font-size: 18px;
letter-spacing: 0.045em;
}
Time
Go to Noon
Go to Dusk
Go to Night
body:before {
content: " ";
height: 100vh;
width: 100vw;
display: block;
position: fixed;
top: 0;
left: 0;
z-index: 100;
background-image: url('https://steamuserimages-a.akamaihd.net/ugc/2272693079541106881/F821EBDAA2EF7797279BC05E4D4E2F0DE716033C/');
background-size: cover;
background-repeat: no-repeat;
background-position:center;
animation: yourAnimation 8s ease 0s 1 normal forwards;
pointer-events: none;
}
@keyframes yourAnimation { 0.0%{ opacity: 1;} 75%{ opacity: 1; } 100%{ opacity: 0;} }
.kangel {
background: url(https://64.media.tumblr.com/c9fb55a0ce28925a7b614ca15e3f0ea1/722e6edf05a7c22c-34/s640x960/2adb756a76fec77b8c34b0190d0917f9250e4161.pnj) no-repeat;
background-size: 100%!important;
position: fixed;
left: 15px;
bottom: 3px;
height:200px;
width: 200px;
}
.kangel:hover {
background: url("https://64.media.tumblr.com/e4500ea900ad3054b7e4da0dfd6d8226/722e6edf05a7c22c-62/s640x960/52d3c26b20d677cd20408928ba0049785d748ba6.pnj");
animation: kangel 0.9s;
animation-iteration-count: infinite;
animation-timing-function: cubic-bezier;
}
@keyframes kangel {
0%,
100% {
transform: translateX(0%);
transform-origin: 50% 50%;
content: url("https://64.media.tumblr.com/e4500ea900ad3054b7e4da0dfd6d8226/722e6edf05a7c22c-62/s640x960/52d3c26b20d677cd20408928ba0049785d748ba6.pnj")
}
15% {
transform: translateX(-2px) rotate(-2deg);
}
30% {
transform: translateX(5px) rotate(8deg);
}
45% {
transform: translateX(-6px) rotate(-3.6deg);
}
60% {
transform: translateX(5px) rotate(2.4deg);
}
75% {
transform: translateX(-6px) rotate(-1.2deg);
content: url("https://64.media.tumblr.com/e4500ea900ad3054b7e4da0dfd6d8226/722e6edf05a7c22c-62/s640x960/52d3c26b20d677cd20408928ba0049785d748ba6.pnj")
}
}
}
blog
My Blogs
#myBlogContainer {
max-width: 600px;
margin: 20px auto;
font-family: sans-serif;
}
.blog-post {
border: 1px solid #ccc;
padding: 15px;
margin-bottom: 15px;
border-radius: 8px;
background-color: #f9f9f9;
}
.blog-post h3 {
margin-top: 0;
color: #333;
}
.blog-post p {
color: #555;
}
// Example blog data - you can add more here
const blogs = [
{
title: "Hello World!",
content: "This is my first blog post. Welcome to my website!"
},
{
title: "Another Day, Another Blog",
content: "Here's some thoughts I want to share today."
},
{
title: "JavaScript is Fun",
content: "I love making websites interactive with JS!"
}
];
// Render blogs
const blogList = document.getElementById('blogList');
blogs.forEach(blog => {
const post = document.createElement('div');
post.className = 'blog-post';
post.innerHTML = `<h3>${blog.title}</h3><p>${blog.content}</p>`;
blogList.appendChild(post);
});
Sign in to FutureMe
or use your email address
Create an account
or use your email address
FutureMe uses cookies, read how
Share this FutureMe letter
Copy the link to your clipboard:
Or share directly via social media:
Why is this inappropriate?