

.title{
font-size: 20px;
background-color: #d2f3b8;
}

.tamagotchi{
position: absolute;
background-image: url(https://files.catbox.moe/rdphoy.png);
background-repeat: no-repeat;
background-size: 35px;
width: 35px;
height: 38px;
top: 126px;
right: 3px;
z-index: 5;
}

.yotsuba{
width: 40px;
float: left;
}

.text{
font-family: BalsamiqSans;
color: #6b5333;
font-size: 14px;
padding: 0;
margin: 0;
padding: 5px;
}

.updatesin{
width: 100%;
height: 135px;
margin-top: 22px;
background-color: #ffffff;
border-width: 1px;
border-style: solid;
border-color: #806a50;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
position: relative;
border-radius: 7px;
background-image: url(https://files.catbox.moe/1mq17i.gif);
background-size: 190px;
overflow-y: auto;
overflow-x: hidden;
}

.switchdiv{
position: absolute;
width: auto;
height: fit-content;
top: 10;
right: 10;
padding: 10px;
background-color: #f3ffda;
border-width: 1px;
border-style: solid;
border-color: #96c26d;
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box;    
box-sizing: border-box; 
}

.featuredin{
width: 100%;
height: 100%;
background-size: 190px;
background-color: #ffffff;
border-width: 2px;
border-style: ridge;
border-color: #ffd2e0;
padding: 7px;
gap: 7px;
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box;    
box-sizing: border-box;
display: grid;
grid-template-areas:
"lastestpage featuredpage";
}

.featured{
grid-area: featured;
background-image: url(https://files.catbox.moe/fn6qnz.png);
background-size: 35px;
border-width: 2px;
border-style: ridge;
border-color: #ffd2e0;
padding: 10px;
}

.currently{
background-color: rgb(0, 0, 0);
grid-area: currently;
}

.button{
background-color: black;
grid-area: button;
}

.updates{
background-color: black;
grid-area: updates;
background-image: url(https://files.catbox.moe/qkzxkf.png);
background-size: 80px;
border-width: 2px;
border-style: ridge;
border-color: #d4b286;
padding-left: 10px;
padding-right: 10px;
position: relative;
box-shadow: 2px 2px 2px inset #ffffffb8, -1px -1px 1px inset #8c70538c;
}

.welcomein{
width: 100%;
height: 100%;
border-width: 2px;
border-style: ridge;
border-color: #ffd2e0;
padding: 5px;
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box;    
box-sizing: border-box;
background-color: #fffdfa;
overflow-y: auto;
overflow-x: hidden;
}

.welcome{
grid-area: welcome;
background-image: url(https://files.catbox.moe/fn6qnz.png);
background-size: 35px;
border-width: 2px;
border-style: ridge;
border-color: #ffd2e0;
padding: 10px;
display: flex;
justify-content: center;
align-items: center;
image-rendering: pixelated;
}

.navin{
background-color: #ffffff;
background-size: 35px;
border-width: 2px;
border-style: ridge;
border-color: #c8e6ac;
width: 100%;
height: auto;
}

.nav{
background-color: #000000;
grid-area: nav;
border-width: 2px;
border-style: ridge;
border-color: #ffffff;
padding: 10px;
display: flex;
justify-content: center;
align-content: center;
image-rendering: pixelated;
}

.header{
background-color: black;
grid-area: header;
}

.container{
background-color: #fffaf0;
width: fit-content;
height: auto;
border-width: 0 1px 0 1px;
border-style: solid;
border-color: black;
margin-left: auto;
margin-right: auto;
-webkit-box-sizing: border-box; 
-moz-box-sizing: border-box;    
box-sizing: border-box;
padding: 7px;
display: grid;
gap: 7px;
grid-template-areas:
"header header header"
"nav welcome welcome"
"nav updates updates"
"featured featured button";
grid-template-rows: 115px 200px 170px 250px;
grid-template-columns: 180px 180px 180px;
}

cursor{
image-rendering: pixelated;
}

body{
cursor: url(https://files.catbox.moe/9gj5us.gif), auto;
padding: 0;
margin: 0;
image-rendering: pixelated;
position: relative;
background-size: cover;
}


@font-face {
font-family: BalsamiqSans;
src: url(https://dl.dropbox.com/scl/fi/hbc4j0f7gq8cizgdg4ebn/BalsamiqSans-Regular.ttf?rlkey=hpaesw3ta0j70v03ts9ko98tb&st=7uql7y5x&dl=0);
}

@font-face {
font-family: basiic;
src: url(https://dl.dropbox.com/scl/fi/9mkkkkao0qfmoy9cw3nfc/basiic.ttf?rlkey=d23mzinjl09qisgzw5r989x52&st=v1ycbl78&dl=0);
}

@font-face {
font-family: honya;
src: url(https://dl.dropbox.com/scl/fi/6uide0yuavj2bhp74zie5/HONYA-JI-Regular.ttf?rlkey=c0ghczbkn8hktqz65r4j8vbum&st=fm4916kw&dl=0);
}

.updatetitle{
position: absolute;
width: 343px;
font-size: 18px;
padding-top: 2px;
background-image: url(https://files.catbox.moe/3hxod6.png);
background-clip: text;
-webkit-text-fill-color: transparent;
font-family: BalsamiqSans;
opacity: 0.8;
background-color: #ff9797;
text-align: center;
}


.latestpage{
background-color: #fff0f0;
}

.featuredpage{
background-color: #fff0f0;
}

.welcometitle::after {
content: url(https://files.catbox.moe/3oetr1.gif);
margin-left: 5px;
}

.welcometitle::before {
content: url(https://files.catbox.moe/3oetr1.gif);
margin-right: 5px;
}

.welcometitle{
font-family: BalsamiqSans;
font-size: 20px;
font-weight: 100;
text-align: center;
margin-top: 3px
}

.endimg{
width: 50px;
image-rendering: auto;
opacity: 0.6;
}

.space{
width: 100%;
height: 23px;
}

.entry{
font-family: honya;
font-size: 15px;
color: #6b5333;
padding-bottom: 5px;
border-width: 0 0 1px 0;
border-style: dashed;
border-color: #6b5333;
margin: 7px;
}

.acemote{
width: 60px;
position: absolute;
top: 96px;
right: 6px;
z-index: 5;
image-rendering: auto;
}

.switch {
position: relative;
display: inline-block;
width: 34px;
height: 60px;
}

.switch input { 
opacity: 0;
width: 0;
height: 0;
}

.slider {
position: absolute;
cursor: pointer;
top: 0;
left: 0;
right: 0;
bottom: 0;
background-color: #cccccc;
-webkit-transition: .4s;
transition: .4s;
}

.slider:before {
position: absolute;
content: "";
height: 26px;
width: 26px;
left: 4px;
bottom: 4px;
background-color: white;
-webkit-transition: .4s;
transition: .4s;
}

input:checked + .slider {
background-color: #bee79d;
}

input:focus + .slider {
box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
-webkit-transform: translateY(-26px);
-ms-transform: translateY(-26px);
transform: translateY(-26px);
}

@-webkit-keyframes snowflakes-fall {
		0% {
			top: -10%
		}
		100% {
			top: 100%
		}
	}
	
	@-webkit-keyframes snowflakes-shake {
		0%,
		100% {
			-webkit-transform: translateX(0);
			transform: translateX(0)
		}
		50% {
			-webkit-transform: translateX(80px);
			transform: translateX(80px)
		}
	}
	
	@keyframes snowflakes-fall {
		0% {
			top: -10%
		}
		100% {
			top: 100%
		}
	}
	
	@keyframes snowflakes-shake {
		0%,
		100% {
			transform: translateX(0)
		}
		50% {
			transform: translateX(80px)
		}
	}
	
	#snowflake {
position: fixed;
top: -10%;
z-index: -9999;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-animation-name: snowflakes-fall, snowflakes-shake;
-webkit-animation-duration: 15s, 5s;
-webkit-animation-timing-function: linear, ease-in-out;
-webkit-animation-iteration-count: infinite, infinite;
-webkit-animation-play-state: running, running;
animation-name: snowflakes-fall, snowflakes-shake;
animation-duration: 15s, 5s;
animation-timing-function: linear, ease-in-out;
animation-iteration-count: infinite, infinite;
animation-play-state: running, running
	}
	
	#snowflake:nth-of-type(0) {
		left: 1%;
		-webkit-animation-delay: 0s, 0s;
		animation-delay: 0s, 0s
	}
	
	#snowflake:nth-of-type(1) {
		left: 10%;
		-webkit-animation-delay: 1s, 1s;
		animation-delay: 1s, 1s
	}
	
	#snowflake:nth-of-type(2) {
		left: 20%;
		-webkit-animation-delay: 6s, .5s;
		animation-delay: 6s, .5s
	}
	
	#snowflake:nth-of-type(3) {
		left: 30%;
		-webkit-animation-delay: 4s, 2s;
		animation-delay: 4s, 2s
	}
	
	#snowflake:nth-of-type(4) {
		left: 40%;
		-webkit-animation-delay: 2s, 2s;
		animation-delay: 2s, 2s
	}
	
	
	#snowflake:nth-of-type(5) {
		left: 50%;
		-webkit-animation-delay: 8s, 3s;
		animation-delay: 8s, 3s
	}
	
	#snowflake:nth-of-type(6) {
		left: 60%;
		-webkit-animation-delay: 6s, 2s;
		animation-delay: 6s, 2s
	}
	
	#snowflake:nth-of-type(7) {
		left: 70%;
		-webkit-animation-delay: 2.5s, 1s;
		animation-delay: 2.5s, 1s
	}
	
	#snowflake:nth-of-type(8) {
		left: 80%;
		-webkit-animation-delay: 1s, 0s;
		animation-delay: 1s, 0s
	}
	
	#snowflake:nth-of-type(9) {
		left: 90%;
		-webkit-animation-delay: 3s, 1.5s;
		animation-delay: 3s, 1.5s
	}
	
	#snowflake:nth-of-type(10) {
		left: 25%;
		-webkit-animation-delay: 2s, 0s;
		animation-delay: 2s, 0s
	}
	
	#snowflake:nth-of-type(11) {
		left: 65%;
		-webkit-animation-delay: 4s, 2.5s;
		animation-delay: 4s, 2.5s
	}

::-webkit-scrollbar {
width: 13px;
height: 16px;
background: none;
}

::-webkit-scrollbar-thumb, body *::-webkit-scrollbar-button {
  width: 16px;
  height: 16px;
  background: silver;
  box-shadow: inset 1px 1px #dfdfdf, inset -1px -1px gray;
  border: 1px solid;
  border-color: silver #000 #000 silver;
}

::-webkit-scrollbar-track {
  image-rendering: optimizeSpeed;
  image-rendering: pixelated;
  image-rendering: optimize-contrast;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAyIDIiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyI+CjxtZXRhZGF0YT5NYWRlIHdpdGggUGl4ZWxzIHRvIFN2ZyBodHRwczovL2NvZGVwZW4uaW8vc2hzaGF3L3Blbi9YYnh2Tmo8L21ldGFkYXRhPgo8cGF0aCBzdHJva2U9IiNjMGMwYzAiIGQ9Ik0wIDBoMU0xIDFoMSIgLz4KPC9zdmc+");
  background-position: 0 0;
  background-repeat: repeat;
  background-size: 2px;
}

::-webkit-scrollbar-button {
  background-repeat: no-repeat;
  background-size: 16px;
}

::-webkit-scrollbar-button:single-button:vertical:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTcgNWgxTTYgNmgzTTUgN2g1TTQgOGg3IiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-button:single-button:vertical:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTQgNWg3TTUgNmg1TTYgN2gzTTcgOGgxIiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-button:single-button:horizontal:decrement {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTggM2gxTTcgNGgyTTYgNWgzTTUgNmg0TTYgN2gzTTcgOGgyTTggOWgxIiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-button:single-button:horizontal:increment {
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgLTAuNSAxNiAxNiIgc2hhcGUtcmVuZGVyaW5nPSJjcmlzcEVkZ2VzIj4KPG1ldGFkYXRhPk1hZGUgd2l0aCBQaXhlbHMgdG8gU3ZnIGh0dHBzOi8vY29kZXBlbi5pby9zaHNoYXcvcGVuL1hieHZOajwvbWV0YWRhdGE+CjxwYXRoIHN0cm9rZT0iIzAwMDAwMCIgZD0iTTYgM2gxTTYgNGgyTTYgNWgzTTYgNmg0TTYgN2gzTTYgOGgyTTYgOWgxIiAvPgo8L3N2Zz4=");
}

::-webkit-scrollbar-corner {
background: silver;
}

::-moz-selection {
color: #5d902d;
background: #b9f28d79
}

::selection {
color: #5d902d;
background: #b9f28d79
}


