@font-face {
                               font-family: "balsamiq sans";
                               src: url("https://imp.neocities.org/layouts/spacehey/sickly-sweet/BalsamiqSans-Regular.ttf");
                            }
                         
                            /* Start https://www.cursors-4u.com */ * {cursor: url(https://cur.cursors-4u.net/others/oth-4/oth305.cur), auto !important;} /* End https://www.cursors-4u.com */
:root {
                               --logo-blue: #872A4E;
                               --lighter-blue: transparent;
                               --even-lighter-blue: transparent;
                               --lightest-blue: transparent;
                               --dark-orange: #872A4E;
                               --light-orange: transparent;
                               --even-lighter-orange: transparent;
                            }

                            ::-moz-selection {
                               color: #286192;
                               background: #D8EDFF;
                            }
                         
                            ::selection {
                               color: #286192;
                               background: #D8EDFF;
                            }
	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;
}

.friends .person {
  width: 105px;
  display: inline-block;
  padding: 0 10px 15px 0;
}

h1 {
                               font-family: "Cheri";
                               font-size: 21px;
                               border-top-right-radius: 15px;
                               border-top-left-radius: 15px;
                               padding: 7px;
                               margin-top: 0px;
                               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: "balsamiq sans";
                               font-size: 17px;
                               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%;
                            }

blockquote {
   text-align: center;
}


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;
}
a {
                               text-decoration: none;
                               color: #C55582;
                               text-shadow: 0 0 2px #ffafcc;
                               font-size: 13px;
                            }
                         
                            a:hover {
                               color: #ffafcc;
                            }
/* replace with cd image that has transparent background. must be 150px by 150px. */
:root {
--cd-image: url('https://external-media.spacehey.net/media/sfeW7t6xDOd7i0rCQgzQ2_lrLKbZ0agX7PhzlLLTzOcQ=/https://fluorescent-lights.neocities.org/Digital-CD-Disk-Vector-Transparent-PNG.png');
}
.profile-pic {
position: relative;
width: 183px;
filter: drop-shadow(0 0 0.25rem gray);
}
.profile-pic:after {
content: "";
background: url('https://external-media.spacehey.net/media/seS6cnvuNGR8lIzmUYNaiscJjCRlC3rfKXjkhQTmZOyk=/https://fluorescent-lights.neocities.org/f0rzNHe.png'), linear-gradient(150deg, rgba(255,255,255,0.4), rgba(255,255,255,0.2), 40%, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0.6));
background-size: contain, cover;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}

.profile-pic:before {
content: "";
background: var(--cd-image);
position: absolute;
top: 5px;
left: -20px;
width: 150px;
height: 150px;
background-repeat: no-repeat;
z-index: -1;
animation-name: spin;
animation-duration: 5000ms;
animation-iteration-count: infinite;
animation-timing-function: linear; 
transition: left ease 0.5s;
}
.profile-pic:hover:before {
left: -75px;
}
@keyframes spin {
    from {
        transform:rotate(0deg);
    }
    to {
        transform:rotate(360deg);
    }
}
.profile-pic .pfp-fallback {
float: right;
width: 163px;
height: 160px;
border: none;
}
.general-about .profile-pic img {
max-width: inherit;
}

img.float-center {
max-width: 300px;
max-height: 200px;

}

img.art{
  max-width: 143px;
  max-height: 243px;
  border: 2px solid #ffafcc;

}

img.figure{  
  max-width: 222px;
  max-height: 323px;
  border: 2px solid #ffafcc;

}

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://external-media.spacehey.net/media/sqhEJX1Q0JFTI4MAxM9AoMDnx25PQiB_asGGGNjvcYDo=/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://external-media.spacehey.net/media/s-CspP_HCBOOLJqBYSBwf1xCIPUtvi56CMkrsdQ9D3d8=/https://imp.neocities.org/layouts/spacehey/sickly-sweet/img/notif.gif");
       height: 7px;
       width: 9.5px;
       display: inline-block;
    }
 
    li .icon {
       content: url("https://external-media.spacehey.net/media/s4plAAUYpN4gKp1nlSsUA3hcOFw2Afwo8vxUxdaNzzOE=/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://external-media.spacehey.net/media/sdFb8CqjhRuCFhxiFykosFxs0Sx-xsJkiTdQGlY6BEmE=/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;
    }
 
   {
       height: 130px;
       width: 130px;
    }
 
    {
       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;
    }
 
    .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://doqmeat.com/about/!g/adopted/midnightcreamy_star3.gif");
       width: 42px;
       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://external-media.spacehey.net/media/sk0VyLLkNlOH6cpmkP19wqjiY_hajvWKuuN4aERc5yIo=/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://external-media.spacehey.net/media/sk0VyLLkNlOH6cpmkP19wqjiY_hajvWKuuN4aERc5yIo=/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://external-media.spacehey.net/media/sFPJaaALclLcUnMItUcnAE0Fk3y2oaYk1B6sFfz3mgyk=/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://external-media.spacehey.net/media/sFPJaaALclLcUnMItUcnAE0Fk3y2oaYk1B6sFfz3mgyk=/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://external-media.spacehey.net/media/sKlc9uUITJpzr73fCktrU9aHImOzC2eaCpSSS-nWSS34=/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://external-media.spacehey.net/media/sKlc9uUITJpzr73fCktrU9aHImOzC2eaCpSSS-nWSS34=/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://external-media.spacehey.net/media/snfUTcztrrgaPeCrM9fYuq6z-syKR4sdv0iigJTo87b8=/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://external-media.spacehey.net/media/snfUTcztrrgaPeCrM9fYuq6z-syKR4sdv0iigJTo87b8=/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: 500px;
       width: 85%;
       overflow-y: scroll;
       text-align: left;
       border: 2px dashed #ffafcc;
       border-radius: 2px;
       padding: 5px;
    }
    
    #scrollbox-status {
       margin-left: auto;
       margin-right: auto;
       height: 90px;
       width: 85%;
       overflow-y: scroll;
       text-align: left;
       border: 2px dashed #ffafcc;
       border-radius: 2px;
       padding: 5px;
    }
 
    #scrollbox-status::-webkit-scrollbar {
       width: 5px;
       background: #FFeff5;
    }
 
    #scrollbox-status::-webkit-scrollbar-thumb {
       background: #ffafcc;
    }
    
    #scrollbox::-webkit-scrollbar {
       width: 5px;
       background: #FFeff5;
    }
 
    #scrollbox::-webkit-scrollbar-thumb {
       background: #ffafcc;
    }

    #scrollbox-hori {
       margin-left: auto;
       margin-right: auto;
       height: auto;
       max-height: 300px;
       width: 85%;
       overflow-y: scroll;
       text-align: left;
       border: 2px dashed #ffafcc;
       border-radius: 2px;
       padding: 5px;
    }
 
    #scrollbox-hori::-webkit-scrollbar {
       width: 5px;
       background: #FFeff5;
    }
 
    #scrollbox-hori::-webkit-scrollbar-thumb:horizontal {
       background: #ffafcc;
    }

img.float-left {
  float: left;
  margin: 10px 20px 10px 0;
  max-width: 200px;
  border-radius: 12px;
}

img.float-right {
  float: right;
  margin: 10px 0 10px 20px;
  max-width: 270px;
  border-radius: 12px;
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.spin-img {
  width: 60px;             
  height: 60px;
  border-radius: 50%;     
  animation: spin 6s linear infinite;
  margin-left: auto;      
}

table, th, td {

  border: 0px solid;

     }

.pic {
	background: white;
	position: relative;
	display: inline-block;
	margin: 0px 0px;
	transition-duration: 0.3s;
	overflow: hidden;
}

.hov {
	opacity: 0;
	position: absolute;
	height: 99%;
	width: 90%;
	transition-duration: 0.6s;
	top: 1px;
}

.hov:hover {
	opacity: 1;
}

.caption {
  position: absolute;
  top: 25%;
  bottom: 10%;

  left: 15%;
  width: 80%;

  padding-top: 3px;
  padding-bottom: 14px;
  padding-left: 10px;
  padding-right: 10px;
  background: white;
  border-radius: 20px;
  border: 2px solid #ffafcc;
  box-sizing: border-box;

 
  overflow: hidden;
}

.caption-content {
  height: 100%;     
  overflow-y: auto;
  overflow-x: hidden;  
  box-sizing: border-box;
  padding-right: 8px; 
  line-height: 1.2;
  -webkit-overflow-scrolling: touch; 
}

                            .caption-content::-webkit-scrollbar {
                               width: 5px;
                               background: #FFeff5;
                            }
                         
                            .caption-content::-webkit-scrollbar-thumb {
                               background: #ffafcc;
                            }

#s-m-t-tooltip {
	max-width: 300px;
	text-align: center;
	z-index: 999;
	margin: 30px 15px 7px 12px;
	padding: 5px;
	border: 2px dashed #ffafcc;
	background: rgb(187, 255, 206);
	background: linear-gradient(343deg, rgba(187, 255, 206, 0.8991246156665791) 0%, rgba(255, 254, 214, 0.8823178929775035) 48%);
}

:root {
  --topic1: "General";
  --topic2: "Music | 音乐";
  --topic3: "Books | 书籍";
  --topic4: " ";
  --topic5: "Extra | 多余";
  --topic6: " ";
  --links: #872A4E
}

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

img.books{
max-width: 45px;
max-height: 73px;
}