body {
  font-family:times;
  font-size:14px;
  color:#9c4221;
}

.container {
  background-color:black;
  border:0.05rem solid #234e52;
  padding:5px;
  margin:0px;
}

.he{
  font-family:valty;
  font-size:18px;
  font-weight:bold;
  color:#d69e2e;
}

.pixel{
  width:14px;
  margin-right:2px;
  vertical-align:top;
}

.inline-img{
  vertical-align:top;
}

.btwn{
  display:flex;
  justify-content:space-between;
}

.center{
  display:flex;
  justify-content:center;
}

.even{
  display:flex;
  justify-content:space-evenly;
}

.upd-date {
  color:#426bc2;
  font-size:10px;
  background-color:#d4edff;
  padding:0 5px;
  width:85px;
  text-align:right;
}

  
.highlight-blue{
  background-color:#d4edff;
  color:#426bc2;
  font-weight:bold;
}

.new-badge{
  height:12px;
}

.indent{
  margin:0 0 0 10px;
}

iframe {
  box-sizing:border-box;
  border:none;
  border-width:0px;
  padding:0px;
  margin:0px;
  overflow:hidden;
  max-width:1000px;
}

@font-face {
  font-family: "basiic";
  src: url(https://beachglass.neocities.org/fonts/basiic.ttf);
  format: "truetype"
}

@font-face {
  font-family: "valty";
  src: url(https://beachglass.neocities.org/fonts/valty.otf);
  format: "truetype"
}

@font-face {
  font-family: "emoji";
  src: url(https://beachglass.neocities.org/fonts/EmojiFont.ttf);
  format: "truetype"
}

#cred a:link{
  color:#D69E2E;
  text-decoration:none;}
  
#cred a:visited{
  color:#D69E2E;
  text-decoration:none;}
  
#cred a:active{
  color:#D69E2E;
  text-decoration:none;}

#cred a:hover{
  background-color:#234E52;
  text-decoration:underline;
  color:#68D391;
  margin-left:5px;
}

#linky a:link{
  color:#D69E2E;
  text-decoration:none;}
  
#linky a:visited{
  color:#D69E2E;
  text-decoration:none;}
  
#linky a:active{
  color:#D69E2E;
  text-decoration:none;}

#linky a:hover{
  background-color:#234E52;
  text-decoration:underline;
  color:#68D391;
}

.linked {
  transition: transform 0s;
}

.linked:hover {
  -ms-transform: scale(0.9); /* IE 9 */
  -webkit-transform: scale(0.9); /* Safari 3-8 */
  transform: scale(0.9); 
}

.pagedoll {
  transition: transform 0.5s;
}

.pagedoll:hover {
  -ms-transform: scale(1.05); /* IE 9 */
  -webkit-transform: scale(1.05); /* Safari 3-8 */
  transform: scale(1.05) rotate(10deg); 
}

.pagedoll-2 {
  transform:rotate(-20deg);
  transition: transform 0.5s;
  margin: 1px;
}

.pagedoll-2:hover {
  -ms-transform: scale(1.1) rotate(-25deg); /* IE 9 */
  -webkit-transform: scale(1.1) rotate(-25deg); /* Safari 3-8 */
  transform: scale(1.1) rotate(-25deg); 
}

.pagedoll-3{
  transition:transform 0.5s;
}

.pagedoll-3:hover{
  -ms-transform: scale(1.05) rotate(-5deg);
  -webkit-transform: scale(1.05) rotate(-5deg);
  transform: scale(1.05) rotate(-5deg);
}

.li-none{
  list-style-type:none;
  margin:0px;
  padding:1px 0px;
  text-align:left;
}

.li-square{
  list-style-type: square;
  margin:0 10px;
  padding:1px 0px;
  text-align:left;
  }
  
.li-box{
  list-style-type: none;
  margin:0px;
  padding:0px 0px;
  text-align:left;
  }
  
.li-box li:before{
  content:"\2610"
 
  }
  
.li-box-check{
  list-style-type: none;
  margin:0px;
  padding:0px 0px;
  text-align:left;
  }
  
.li-box-check li:before{
  content:"\2611"
 
  }

li{
  margin:1px;
}

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

/* Track */
::-webkit-scrollbar-track {
  background: black; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: #888;
}

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

.marquee {
			display: flex ;
			overflow: hidden ;
			white-space: nowrap ;
		}
		.marquee__item {
			animation-duration: 10s ;
			animation-iteration-count: infinite ;
			animation-name: marquee-content ;
			animation-timing-function: linear ;
			padding: 2px 5px ;
		}
		.marquee:hover .marquee__item {
			animation-play-state: paused ;
		}

		/**
		* BOTH of the marquee items are going to be translating left at the same time.
		* And, once each of them has translated to -100%, they will both snap back into
		* place, making it seem as if they are continuously scrolling.
		*/
		@keyframes marquee-content {
			from {
				transform: translateX( 0% );
			}
			to {
				transform: translateX( -100% );
			}
		}