@font-face {
	font-family: Daydream;
	src: url("/content/fonts/Daydream.ttf");
}
/*@font-face {
	font-family: PixelOperator;
	src: url("/content/fonts/PixelOperator-Bold.ttf");
}
@font-face {
	font-family: font04B19;
	src: url("/content/fonts/04B19.ttf");
}
@font-face {
	font-family: OctoSquare;
	src: url("/content/fonts/octo.ttf");
}
@font-face {
	font-family: Mussels;
	src: url("/content/fonts/MusselsRegular.otf");
}*/
@font-face {
	font-family: MusselsBold;
	src: url("/content/fonts/MusselsExtraBold.otf");
}
@font-face {
	font-family: forcedsquare;
	src: url("/content/fonts/forcedsquare.ttf");
}

* {
  box-sizing: border-box;
}

body {
  margin: 0;
  overflow: hidden;
  font-family: forcedsquare;
  font-size: 24px;
  color: #FFBF00;
}

span:not([class]) {
  text-shadow: 1px 0px 0px #FF3F00, -1px 0px 0px #FF3F00, 0px -1px 0px #FF3F00, 0px 1px 0px #FF3F00, 0px 0px 4px #FF3F00;
}

.container,
.background,
.background2,
.background3,
.filter
{
  position: absolute;
  top: 0px;
  left: 0px;
}

.background {
  background-image: url("/content/img/space.gif");
  width: 100vw;
  height: 100vh;
  image-rendering: pixelated;
}
.background3 {
  background-image: url("/content/img/space2.gif");
  width: 100vw;
  height: 100vh;
  image-rendering: pixelated;
  mix-blend-mode: lighten;
}
.background2 {
  background-image: url("/content/img/galaxy.gif");
  width: 100vw;
  height: 100vh;
  image-rendering: pixelated;
  opacity: 75%; 
  mix-blend-mode: plus-lighter;
  background-size: cover;    
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.filter {
  display: inline-block;
  position: fixed;
  top: 0px;
  left: 0px;
  height: 400vh;
  width: 100vw;
  backdrop-filter: saturate(180%) brightness(180%);
  pointer-events: none;
}

.filter-2 {
  display: inline-block;
  position: fixed;
  top: 0px;
  left: 0px;
  height: 400vh;
  width: 100vw;
  /* background: red; */
  /* background: repeating-linear-gradient(135deg, rgba(255, 127, 127, 1) 0px, rgba(255, 255, 127, 1) 5px, rgba(127, 255, 127, 1) 10px, rgba(127, 255, 255, 1) 15px, rgba(127, 127, 255, 1) 20px, rgba(255, 127, 255, 1) 25px, rgba(255, 127, 127, 1) 30px); */
  background: repeating-linear-gradient(135deg, rgba(255, 191, 191, 1) 0px, rgba(255, 255, 191, 1) 40px, rgba(191, 255, 191, 1) 80px, rgba(191, 255, 255, 1) 120px, rgba(191, 191, 255, 1) 160px, rgba(255, 191, 255, 1) 200px, rgba(255, 191, 191, 1) 240px);
  /* background: repeating-linear-gradient(135deg, rgba(255, 0, 0, 1) 0px, rgba(0, 0, 0, 1) 5px, rgba(0, 255, 0, 1) 10px, rgba(0, 0, 0, 1) 15px, rgba(0, 0, 255, 1) 20px, rgba(0, 0, 0, 1) 25px, rgba(255, 0, 0, 1) 30px); */
  /* background: transparent; */
  mix-blend-mode: multiply;
  pointer-events: none;
}
.filter-cosmos {
  display: block;
  position: absolute;
  top: 16px;
  left: 16px;
  height: calc( 100% - 32px );
  width: calc( 100% - 32px );
  backdrop-filter: hue-rotate(90deg);
  z-index: -1;
}

.container {
  width: 100vw;
  height: 100vh;
  overflow: auto;
  overflow-x: hidden;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.main {
  /*height: 200vh;*/
  width: 1024px;
  /*max-width: 100vw;*/
  max-width: calc(100vw - 180px);
  display: flex;
  flex-direction: column;
}

.border {
  border: 2px solid white;
}
.borderouter,
.borderinner {
  border-image-slice: 4;
  border-image-width: 8px;
  border-image-repeat: stretch;
  padding: 8px;
  image-rendering: pixelated;
}
.borderouter {
  border-image-source: url("/content/img/box2outer.png");
  /*backdrop-filter: hue-rotate(90deg);*/
}
.borderinner {
  border-image-source: url("/content/img/box2inner.png");
  border-image-outset: 8px;
  margin: 8px;
}
.borderouter.top {
  border-image-source: url("/content/img/box2outer-top.png");
}
.borderouter.botm {
  border-image-source: url("/content/img/box2outer-botm.png");
}
.borderouter.mid {
  border-image-source: url("/content/img/box2outer-mid.png");
}

.margin {
  margin: 8px;
}

.headtext {
  font-family: Daydream;
  font-size: 48px;
}
.bodytext {
  color: transparent;
  background: repeating-linear-gradient(135deg, rgba(255,191,191,1) 0px, rgba(255,255,191,1) 20px, rgba(191,255,191,1) 40px, rgba(191,255,255,1) 60px, rgba(191,191,255,1) 80px, rgba(255,191,255,1) 100px, rgba(255,191,191,1) 120px);
  background-clip: text;
}
.supertext {
  font-size: xxx-large; 
  font-family: forcedsquare;
}

.flex-row {
  display: flex;
}
.flex-static {
  flex-grow: 0;
  flex-shrink: 0;
}
.flex-stretch {
  flex-grow: 1;
  flex-shrink: 1;
}

::-webkit-scrollbar {
  width: 16px;
}
::-webkit-scrollbar-track {
  background: repeating-linear-gradient(45deg, rgba(255,127,127,0.5) 0px, rgba(255,255,127,0.5) 5px, rgba(127,255,127,0.5) 10px, rgba(127,255,255,0.5) 15px, rgba(127,127,255,0.5) 20px, rgba(255,127,255,0.5) 25px, rgba(255,127,127,0.5) 30px);
  box-shadow: inset -1px -1px 0px #FFFFFF4F, inset 1px 1px 0px #0000004F;
}
::-webkit-scrollbar-thumb {
  background: repeating-linear-gradient(45deg, rgba(255,160,160,1) 0px, rgba(255,255,160,1) 5px, rgba(160,255,160,1) 10px, rgba(160,255,255,1) 15px, rgba(160,160,255,1) 20px, rgba(255,160,255,1) 25px, rgba(255,160,160,1) 30px); 
  box-shadow: inset 1px 1px 0px #FFFFFF7F, inset -1px -1px 0px #0000007F;
}
::-webkit-scrollbar-thumb:hover {
  background: repeating-linear-gradient(45deg, rgba(255,127,127,1) 0px, rgba(255,255,127,1) 5px, rgba(127,255,127,1) 10px, rgba(127,255,255,1) 15px, rgba(127,127,255,1) 20px, rgba(255,127,255,1) 25px, rgba(255,127,127,1) 30px);
  box-shadow: inset 1px 1px 0px #FFFFFF7F, inset -1px -1px 0px #0000007F;
}

.neocitiesbadges a img {
  image-rendering: pixelated;
  width: 88px;
  height: 31px;
}

.b88x31 {
  display: inline-block;
  width: 88px;
  height: 31px;
  margin: 4px;
}
.neatmarquee {
  overflow: hidden;
  max-width: 1024px;
  white-space: nowrap;
  height: 40px;
}
.neatmarqueecontent {
  display: inline-block;
  width: calc( (88px * 25) );
  font-size: 0;
  position: relative;
  animation: neatmarq linear 36s infinite;
  will-change: transform;
}
@keyframes neatmarq {
  0% { left: 0 }
  100% { left: calc( (-88px * 25) - 8px ) }
}
.neatmarqueecontent2 {
  display: inline-block;
  width: calc( 784px + 8px );
  position: relative;
  animation: neatmarq2 linear 6s infinite;
  will-change: transform;
}
@keyframes neatmarq2 {
  0% { left: 0 }
  100% { left: calc( -784px - 16px ) }
}

.hover3d {
  transform: rotate3d(0, 0, 1, -8deg);
  margin-top: 64px;
  animation: hovereffect ease-in-out 24s infinite;
}
@keyframes hovereffect {
  0% { 
    transform: translateY(0px) rotate3d(0, 0, 1, 4deg);
  }
  50% { 
    transform: translateY(-32px) rotate3d(0, 0, 1, 3deg); 
  }
  100% {
    transform: translateY(0px) rotate3d(0, 0, 1, 4deg);
  }
}


iframe.ifill {
  display: block; 
  width: 100%; 
  height: 100%; 
  border: none;
}

a {
  position: relative;
}

a.link {
  backdrop-filter: saturate(2) hue-rotate(180deg) blur( 1px );
  padding: 4px;
  margin: -4px;
  filter: brightness( 2 );
}

a:hover::after {
  content: '';
  background: url( '/content/link.gif' );
  width: 64px;
  height: 96px;
  position: absolute;
  left: -48px;
  bottom: calc( 100% - 64px );
  z-index: 256;
  pointer-events: none;
}
a.link:hover::after {
  filter: brightness( 0.5 );
}

.bg-cover {
  background-size: cover !important;
  background-position: center !important;
}

.iframe {
  display: block;
  border: none;
}