/* ESSENTIAL */
/* Start https://www.cursors-4u.com */ * {cursor: url(curbrown.cur), auto !important;} /* End https://www.cursors-4u.com */
 
body{
background-color: #ffffff;
background-image: url(white_and_brown_stripes.gif);
filter: saturate(77%);
font-family: 'ktegaki', sans-serif;
}

@font-face {
  font-family:ktegaki;
  src: url(KTEGAKI.ttf);
}
 
 /* LAYOUT */
#container{
display: flex;
justify-content: center;
align-items: center;
width: 800px;
padding: 12px;
margin-left: 200px;
margin-top: 10px;
}
 
#box{
width: 800px;
background-color: #F5F3F1;
color: #000;
border: 1px solid #dbc1ac;
text-shadow: 0 0 1px #000;
}
 
#header{
clear: both;
padding: 3px;
border: 1px solid #dbc1ac;
background-image: url(brown_stripes.gif);
filter: saturate(30%);
width: 800px;
height: 100px;
a { color: #FFFFFF; }
color: #fff;
font-size: 20px;
text-align: right;
margin-left: 210px;
margin-top: 30px;
text-shadow: 0 0 1px #000;
a {text-shadow: 0 0 1px #000;}
}

#header4{ /* now + sitely */
float: left;
position: fixed;
padding: 3px;
border: 1px solid #dbc1ac;
background-color: #F5F3F1;
width: 170px;
height: 230px;
color: #726455;
font-size: 20px;
text-align: left;
margin-left: 20px;
margin-top: 70px;
text-shadow: 0 0 1px #000;
}

#header5{ /* links + follow */
float: left;
position: fixed;
padding: 3px;
border: 1px solid #dbc1ac;
background-color: #F5F3F1;
width: 170px;
height: 110px;
color: #726455;
font-size: 20px;
text-align: left;
margin-left: 20px;
margin-top: 310px;
text-shadow: 0 0 1px #000;
}

#header6{ /* fanlistings */
float: left;
position: fixed;
padding: 3px;
border: 1px solid #dbc1ac;
background-color: #F5F3F1;
width: 200px;
height: 200px;
color: #726455;
font-size: 20px;
text-align: right;
margin-left: 1025px;
margin-top: 23px;
text-shadow: 0 0 1px #000;
}

#header7{ /* cliques */
float: left;
position: fixed;
padding: 3px;
border: 1px solid #dbc1ac;
background-color: #F5F3F1;
width: 200px;
height: 170px;
color: #726455;
font-size: 20px;
text-align: right;
margin-left: 1025px;
margin-top: 233px;
text-shadow: 0 0 1px #000;
}
 
#header p{
margin: 0px;
}

.subheader{
background-image: url(brown_stripes.gif);
filter: saturate(30%);
border-bottom: 1px solid #dbc1ac;
padding: 3px;
color: #fff;
letter-spacing: 3px;
text-align: right;
font-size: 13px;
text-shadow: 0 0 3px #000;
}
 
.subheader h3{
margin: 0px;
}

#side2{
float: right;
width: 234px;
padding: 0px 5px 0px 10px;
overflow: hidden;
}
 
.sidebox{
margin: 30px 0px 3px 0px;
}

.sidebox2{
margin: 0px 0px 0px 0px;
}
 
.sidecontent{
padding: 0px 0px 0px 5px;
color: #6e5057;
font-size: 17px;
letter-spacing: 1px;
}
 
.sidecontent ul, li{
margin: 0px;
list-style-type: none;
padding-left: 0px;
}

#main{
float:clear:center;
width:530px;
overflow: hidden;
padding: 0px 0px 5px 10px;
}

#main2{
float:right;
width:504px;
overflow: hidden;
padding: 0px 2px 5px 10px;
}

#main4{ /* for oc portraits */ 
float:left;
width: 200px;
overflow: hidden;
padding: 0px 2px 2px 3px;
}

#main5{ /* for oc info + bio */
float:right;
width: 320px;
overflow: hidden;
padding: 0px 2px 5px 2px;
}
 
.mainbox{
padding: 2px;
margin: 0px 0px 5px 0px;
}
 
.mainboxcontent{
display: flex;
padding: 0px 15px 0px 15px;
color: #6e5057;
font-size: 17px;
}

.mainboxcontent2{ /* 404 page */
display: flex;
text-align: center;
padding: 0px 15px 0px 15px;
color: #6e5057;
font-size: 17px;
}
 
/* SCROLLBOXES */
#scrollcontainer{
padding: 5px;
}

#scrolly{
display: flex;
overflow: scroll;
overflow-x: hidden;
width:550px;
height:540px;
margin: 0 auto;
text-align: left;
justify-content: left;
align-items: left;
}
 
#scrollyheader{
margin: 0px;
border-bottom: 1px dotted #ff668a;
}
/* SCROLLBOXES */
 
#footer{
clear: both;
padding: 3px;
border: 1px solid #dbc1ac;
background-image: url(brown_stripes.gif);
filter: saturate(30%);
width: 800px;
a { color: #FFffff; }
a {text-shadow: 0 0 1px #000;}
color: #fff;
font-size: 14px;
text-align: center;
margin-left: 210px;
text-shadow: 0 0 1px #000;
}
 
#footer p{
margin: 0px;
}

/* STATUSCAFE */
#statuscafe {
    padding: 2px;
    background-color: #F5F3F1;
}
#statuscafe-username {
    margin-bottom: .4px;
}
#statuscafe-content {
    margin: 0px 0px 0px;
}
/* STATUSCAFE */

/* LINKS */
a{
text-decoration-style: dotted;
color: #dbc1ac;
text-shadow: 0 0 1px #000;
}
 
a:visited{
color: #967259;
}
 
a:hover{
text-shadow: 0px 0px 2px #726455;
font-style: italic;
text-shadow: 0 0 1px #000;
}

/* LINKS */

u { /* underline text decoration */
  text-decoration-style: wavy;
  text-decoration-color: var(--medium);
}

/* Dotted brown border */
hr.new3 {
  border: 1px dotted brown;
  background-color: transparent
}

/* CUSTOM SCROLLBAR/SELECT */
/* ===== Scrollbar CSS ===== */
  /* Firefox */
  * {
    scrollbar-width: thin;
    scrollbar-color: #dbc1ac #F5F3F1;
  }
 
::-webkit-scrollbar{
width: 8px; 
}
 
::-webkit-scrollbar-track{
background-color: #fff7fb;
}
 
::-webkit-scrollbar-thumb{
background-color: #dbc1ac;  
}

::-moz-selection { /* Code for Firefox */
  color: #726455;
  background-color: #dbc1ac;
}

::selection {
  color: #726455;
  background-color: #dbc1ac;
}

button { /* oc select page */
  background-color: #6f513b;
  color: black;
  border: 3px solid #a4866e;
  text-align: center;
  font-size: 14px;
  display: inline-block;
  padding: 5px;
}
	
.img-links:hover {
  box-shadow: 4px 4px var(--sandy-brown);
  transform: translateX(2px);
  transform: translateY(2px);
}

.img-links:active {
  box-shadow: 2px 2px var(--sandy-brown);
  transform: translateX(4px);
  transform: translateY(4px);
}

#player { /* music player */
 width: 50px;
 height: 30px;
 float: left;
}​

/* Tooltip container */
.tooltip {
  position: relative;
  display: inline-block;
  border-bottom: 1px dotted black; /* If you want dots under the hoverable text */
}

/* TOOLTIP */
.tooltip .tooltiptext {
  visibility: hidden;
  width: 150px;
  background-color: #876D61;
  color: #fff;
  text-align: center;
  padding: 5px 0;
  border-radius: 6px;
  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}
/* TOOLTIP */