#name {
	color: #f0cfda;
text-shadow: 1px 1px #000000, 2px 2px #000000, 3px 3px #000000, 4px 4px #000000, 5px 5px #000000, 6px 6px #000000;
}

.url.box a {
display: none;
}

.url.box {
animation: bootAndClippy 3s steps(1) none;
animation-fill-mode: forwards;
}


.fwiendCounter::after {
    content: "calamari";
font-size: 15px;
    
}

.fwiendCounter {
font-size: 0px;
border-radius: 10px;
	color: #f0cfda;
	border-color: #f0cfda;
	 border: 2px double;
	background-color: #301012;
	background-size: cover;
text-align: center;
}

.fwiendCount {
    font-size: 15px;
	color: #f0cfda;
	border-color: #f0cfda;
}

::selection {
    background: #f19fc6;
}

.blogs {
    display: flex;
    flex-grow: 3;
    margin: 15px;
    padding-top: 16px;
    padding-bottom: 16px;
opacity: 90%;
border-radius: 10px;
border: 2px double;
border-color: #f0cfda;
background-color: black;
}

.blurbs>.blogs>div:not(:first-child):before {
    content: "";
    display: block;
    width: 80px;
    height: 60px;
    background: url(https://noiseandkisses.com/apps/note/wp-content/uploads/2022/10/img_chara_01_sp-e1665054312994.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.topLeft {
    position: sticky;
    top: 0;
    float: left;
    width: calc( 40% - 20px );
    padding: 10px;
}


.topLeft:after {
    content: "";
    white-space: pre-wrap;
    display: block;
    height: 420px;
    width: 350px;
    background-image: url(https://media.tenor.com/u4x8IHSNnqkAAAAi/fnaf-jump-scare.gif);
    background-repeat: no-repeat;
    background-size: 350px;
    background-position-x: 10px, 150px, 50px,;
    background-position-y: 10px, 1px, 910px, 360px;
}


#online {
    content: url(https://www.myspacegens.com/images/online_now/109.gif);
    display: block;
    width: 50%;
    height: 50%;
}

.player {
background-color: #f0cfda;
}

textarea {
background-color: #f0cfda;
color: #770723;
}


a {
 color: #f0cfda;
   
}

p {
    text-align: center;
}


img {
 border-radius: 25px;
}


div#header {
	background: black;
	color: #f0cfda;
	text-align: center;
opacity: 90%;
}
 

div#hSub {
	background: black;
	color: #f0cfda;
	text-align: center;
opacity: 90%;
}

.extended {
   border: 2px double;
 border-radius: 10px;
color: #f0cfda;
   text-align: center;
   margin-bottom: 20px;
   margin-top: 15px;
   background-color: #770723;
   background-size: 100% 200%;
   background-position: center;
opacity: 90%;
}
 

#who, #about, .short,  #viewFriends, a > b {
 border-radius: 10px;
	color: #f0cfda;
	border-color: #f0cfda;
	 border: 2px double;
	background-color: #301012;
	background-size: cover;
        text-align: center;
}
 

h3 {
	display: block;
	font-size: 1.17em;
	margin-block-start: 1em;
	margin-block-end: 1em;
	margin-inline-start: 1px;
	margin-inline-end: 1px;
	font-weight: bold;
	color: #f0cfda;

}


body {
cursor: url(), auto;
background-image: url(https://i.pinimg.com/originals/d5/92/69/d592694a13dd942f93d8cd29eaf7f29d.gif);
background-color: black;
background-size:100% 100%;
background-attachment:fixed;
font-family: mv boli;
text-shadow: #e08bb2 0px 0px 5px;
opacity: 90%;
font-size: 15px;
    -webkit-animation: fadeIn ease 3s;
}

@keyframes fadeIn {
0% { opacity: 0; } 
100% { opacity: 1; }
}




.blogs div, .blog div {
	margin-bottom: 10px;
	color: #f0cfda;
        background-color: black;
}

.blogs div, .blog div, .url a {
	color: #f0cfda!important;
}



.blog {
	background-color: #301012;
	padding: 15px;
}
 


.topRight.blogPost {
	float: right;
	width: calc( 75% - 20px );
	padding: 1px;
}



#top {
 border-radius: 10px;
   padding-left: 10px;
   padding-right: 10px;
    border: 2px double;
   border-color: #f0cfda;
   background-color: #770723;
   background-size: cover;
 

}

.fwiendFace img{
animation: shake 2s;
animation-iteration-count: infinite;
height: 128px;
object-position: top;
object-fit: cover;
 border: 2px double;
   border-color: #f0cfda;
filter: drop-shadow(8px 9px 15px #db6990);
}


.rightHead {
 border-radius: 10px;
         border: 2px double;
	background-color: #301012;
	color: #f19fc6;
	padding-left: 5px;
}
 

h4 {
        background-color: black;
	color: #f0cfda;
	margin-bottom: 5px;
opacity: 90%;
}
.boxInfo {
background: #301012;
border-radius: 10px;
	 border: 2px double;
	margin-bottom: 20px;
	margin-top: 20px;
        color: #f0cfda;
}
.boxHead {
	background: black;
	color: #f0cfda;
	padding: 3px;
	padding-bottom: 4px;
	padding-left: 6px;
	background-color: #301012;
}


form {
	margin-bottom: 20px;
	text-align: right;
color: white;
   background-color: #301012;
      	border-color: #f0cfda;
       border: 2px double;
}

#blog {
	background-color: #770723;
	color: white
}



.tableLeft{
	color: #f0cfda;
	width: 25%;
	padding: 10px;
	vertical-align: top;
	background-color: #770723;
border-radius: 10px;
border: 2px double;
    border-color: #f0cfda;

}

.tableRight {
	color: #f0cfda;
	width: 75%;
	padding: 10px;
	vertical-align: top;
	background-color: #301012;
	background-size: 100% 100%;
border-radius: 10px;
border: 2px double;
    border-color: #f0cfda;
}






@keyframes shake{
0% {
transform: translate(1.5px, 1.5px) rotate(0deg);
}
10% {
transform: translate(-0.5px, -1.5px) rotate(-1deg);
}
20% {
transform: translate(-2.5px, 0px) rotate(0deg);
}
30% {
transform: translate(3px, 2px) rotate(0deg);
}
40% {
transform: translate(1px, -1px) rotate(1deg);
}
50% {
transform: translate(-1px, 2px) rotate(0deg);
}
70% {
transform: translate(3px, 1.5px) rotate(1deg);
}
80% {
transform: translate(-1px, -1px) rotate(0deg);
}
90% {
transform: translate(1px, 2px) rotate(0deg);
}
100% {
transform: translate(0.5px, 0.5px) rotate(0deg);
}
}

#userwall {
border: double;
margin: 5px;
padding: 5px;
height:585px;
width: auto;
}