/* 
# About Me

#### I wish to experience the 00s, watching Anime with somebody while not needing to care about the world falling apart.

###### INTJ-T & Libra if anyone cares

If you'd like to add me, feel free to do so.
​​
I like being alone, but I would rather want someone to be alone with
​
I may not be as active here, but I'll manage to reply someday.
I'm usually more active on discord, so feel free to add me there too :P
​
If you live in Switzerland, let's meet up :)

---

[website](https://taki.moe) | [discord](https://discordapp.com/users/626078049745502210) | [spotify](https://open.spotify.com/user/w90ba6x2glbbdfjj7m3dbn0ia?si=5g3AYt55Sq-PGtu49QtleQ)

If the discord link doesn't work, then it's just taki#0001

---
.

**try to refresh the page, it should change this picture here**
*/

/*
https://taki.moe/mspace/img/cute.png
*/

body {
  background-color: rgb(0, 0, 0);
  background-image: url("https://taki.moe/mspace/img/8VvOdd10b.gif");
  background-repeat: repeat;
  background-position: center;
  background-attachment: fixed;
  background-size: /*100%*/ 105vw, 150vw;
  opacity: 1;
  background-blend-mode: lighten;
  z-index: -1;
}

/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track { 
  background-color: #ffffff10
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #ffffff20; 
  /* border-radius: 5px; */
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #ffffff30; 
}

h4 {
  color: rgb(0, 0, 0);
  margin: 0;
}

#header, #hSub {
  width: calc( 100% - 14px ) !important;
  border: 1px solid #242424 !important;
  border-radius: 0px !important;

}

#header .logo b span {
  font-size: 0;
}

#header .logo b span::after {
  content: "myspace (not urs)";
  font-size: 15px;
}


* {
  color: rgb(200, 200, 200);
}

button, input[type=submit] {
  padding: 5px;
  margin: 5px;
  backdrop-filter: blur(10px) brightness(60%);
  background: #ffffff20;
  color: rgb(200, 200, 200);
  border: 1px solid #ffffff30;
  border-radius: 3px;
  margin-top: 10px;
}

a, a h3, .boxInfo a div, .fwiendFace b {
  color: #9359ff;
}

span#hUp::before {
  content: "you're loved";
  animation: blink 0.3s infinite !important;
  color: rgb(200, 200, 200);
  font-size: 14px;
}

@keyframes blink {
  0%{color: #96f;}
  25%{color: rgb(200, 200, 200);}
  50%{color: #96f;}
  75%{color: rgb(200, 200, 200);}
  100%{color: #96f;}
}

#avatar {
  border: 2px solid #000 !important;
}

.topLeft > div:nth-of-type(1) {
  position: relative;
}

#name {
  color: #fff;
}

#hSub {
  top: 35px !important;
  color: #fff;
}

.sep {
  color: #fff;
}

#header, #hSub {
  backdrop-filter: blur(10px) brightness(60%);
  background: #24292e;
  padding: 6px !important;
  background: #1b1b1b !important;
  position: absolute !important;
}

div#hSub > a:first-child {
  border-bottom: 2px solid #9966ff;
  padding-bottom: 7px;
}

.tableLeft {
  background: none;
  width: 20% !important;
}

.tableRight {
  background: none;
}

.shortRight {
  padding: 0;
}

/*
.tableLeft img {
  max-width: 100px;
  max-height: 100px;
}
*/

.date {
  color: #505050;
}

.tableLeft a div b {
  color: #9966ff;
  float: left;
  margin-bottom: 7px !important;
}

#country::after {
  content: "in the flower garden";
  font-size: 15px;
  left: 0;
  position: absolute;
  top: 0;
  visibility: visible;
  text-align: center;
  margin-left:0px;
}

#country {
  position: relative;
  visibility: hidden;
}

#online::after {
  content: "online";
  color: rgb(66, 252, 150);
  font-size: 13px;
  left: 0;
  position: absolute;
  top: 0;
  visibility: visible;
  text-align: center;
  margin-left:0px;
}

#online {
  position: relative;
  visibility: hidden;
}

#add, #report, #block, #sMsg {
  font-size: 0px;
  font-family: monospace;
}

#add, #report, #block, #sMsg{
  background-repeat: no-repeat;
  background-image: url(https://taki.moe/mspace/img/arrow.png);
}

#add::after {
  content: "friend req";
  font-size: 15px;
}

#report::after {
  content: "send to tom";
  font-size: 15px;
}

#block::after {
  content: "block :/";
  font-size: 15px;
}

#sMsg::after {
  content:"irc";
  font-size: 15px;
}

.player {
  width: auto !important;
} 

/*
.player::before {
  content: "";
  bottom: 10px;
  display: block;
  position: relative;
  height: 400px;
  width: 400px;
  background-size: 100% 100% !important;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(https://taki.moe/mspace/img/album.jpg);
}
*/

.player audio::-webkit-media-controls-play-button, .player audio::-webkit-media-controls-mute-button, .player audio::-webkit-media-controls-volume-slider, .player audio::-webkit-media-controls-timeline {
  filter: invert();
  -webkit-filter: invert();
}

.player audio, .player audio::-webkit-media-controls, .player audio::-webkit-media-controls-enclosure, .player audio::-webkit-media-controls-panel {
  background: #fff;
  background: var(--color--bg-box);
  height: 36px;
  filter: none;
  left: -11.5px;
  width: calc(100% - 14px);
}

.player audio::-webkit-media-controls-current-time-display, .player audio::-webkit-media-controls-time-remaining-display {
  color: #fff;
  text-shadow: none;
}

/* audio {
  left: -7px;
  width: calc(100% - 14px);
  border: none;
  background: #00000000
} */

#container {
  background-color: #00000010;
  box-shadow: #000;
}

/*
OWOWOWOWO
ignore this, this is just so i can find it faster with CTRL+F
*/

/* .blurbs, #box, .box, .short, #header, #hSub, #commentInput { */
.short, #header, #hSub, #commentInput, .blogs, .rightHead, #about, .boxInfo, .url, .player, .extended, .fwiends, .comments {
  backdrop-filter: blur(10px) brightness(60%);
  background: #a97bff15;
  border: 1px solid #5d06ff50;
  border-radius: 3px;
  
  box-shadow: #000;
  padding: 0px;
  margin-bottom: 10px;
}


.blurbs > h4 {
  display: none;
}

#name {
  opacity: 0;
  font-size: 11px;
}

.shortRight {
  padding-top: 15px !important;
  /* top: 15px; */
}

.shortRight::before {
  position: absolute;
  top: 8px;
  content: "taki";
  font-weight: bold;
  color: white;
  font-size: 1.5em;
}

.box > :not(#form) {
  padding: 7px;
}

#form > {
  padding: 7px;
}

.url.box a {
  color: #aaa !important;
}

.blogs > * {
  background: none !important;
  border: none;
}

.blogs > div:nth-child(1) > b {
  border-bottom: 1px solid #ffffff30;
  margin-bottom: 14px;
  color: white;
}

.blog {
  background: none !important;
}

.blogs .box.comments {
  background: none !important;
  border: none !important;
  backdrop-filter: none !important;
}

.date {
  color: white;
  font-size: smaller;
}

.blog h1 {
  margin-left: 1em;
  font-size: 1.5em;
  color: #fff;
}

.rightHead, .boxHead {
  backdrop-filter: blur(10px) brightness(60%);
  background: #ffffff30;
  padding: 7px;
  display: none;
}

.rightHead b, .rightHead span, .boxHead b, .box.url b {
  color: white;
}

.blurbs h4 {
  font-size: 17px;
} 

.rightHead b {
  font-size: 20px;
}

#about h1 {
  border-bottom: 1px solid #ffffff30;
  margin-bottom: 14px;
  font-size: 15px;
  color: white;
}

#about h4 {
  font-size: 15px;
  color: rgb(200, 200, 200);
  padding-bottom: 10px;
}

#about hr {
  margin-top: 20px;
  margin-bottom: 20px;
  opacity: 0.8;
}

#about p:nth-last-child(4), #about p:nth-last-child(5) {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

#about p:nth-last-child(4) {
  margin-top: 5px;
  font-size: 10px;
}

#about p:nth-last-child(2) {
  height: 400px;
  background: url("https://taki.moe/mspace/img/feed/") no-repeat;
  background-size: contain;
  margin-left: auto;
  margin-right: auto;
  background-position: center;
  text-indent: -9999px;

}

#about p:nth-last-child(1) {
  text-align: center;
  margin-top: 5px;
  font-size: 10px;
}

#about p:nth-last-child(1) {
  text-align: center;
  margin-top: 5px;
  font-size: 10px;
}

.blurbs h4:nth-last-child(2), .blurbs #who {
  display: none;
}

.blurbs {
  margin-bottom: 0px !important;
}

#top {
  text-align: center;
}

.fwiendFace img {
  /* size: cover !important; */
  height: 128px; 
  object-position: center;
  object-fit: cover;
}

#commentInput {
  position: relative;
  resize: vertical;
  width: calc( 100% - 14px ) !important;
  left: -6.5px !important;
}

/* myspace change columns lol */

.topLeft {
border-radius: 10px;
float: right;
}

.topRight {
border-radius: 10px;
width: calc( 60% - 20px );
}

#userWall {
  margin-top: 10px;
  word-wrap: break-word;
  display: inline-block;
  overflow: hidden;
  width: 100%;
  /* height: 350px; */
  /* overflow-y: scroll; */
}

/*
CUSTOM PROFILE NAMES
*/

/* Aydoplaydoh https://myspace.f46n.org/?id=6 */

.tableLeft a[href$="?id=6"] b {
  color: #d9d9d9;
  font-size: 0px;
  visibility: hidden;
}

.tableLeft a[href$="?id=6"] b::before {
  content: "Aydoplaydoh ";
  font-size: 12px;
  max-width: 20px;
  max-height: 20px;
  visibility: visible;
}

.tableLeft a[href$="?id=6"] b::after {
  content: url(https://i.imgur.com/him4fjF.png);
  font-size: 12px;
  max-width: 20px;
  max-height: 20px;
  visibility: visible;
}