@font-face {
  font-family: "Pixelated MS Sans Serif";
  src: url(https://unpkg.com/98.css@0.1.16/dist/ms_sans_serif.woff) format("woff");
  src: url(https://unpkg.com/98.css@0.1.16/dist/ms_sans_serif.woff2) format("woff2");
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family:"Pixelated MS Sans Serif";src:url(https://unpkg.com/98.css@0.1.16/dist/ms_sans_serif_bold.woff) format("woff");src:url(https://unpkg.com/98.css@0.1.16/dist/ms_sans_serif_bold.woff2) format("woff2");font-weight:700;font-style:normal;
}

body {
    background-color: black;
    cursor: url('arrow.png'), auto;

}

.container {
    position: relative; /* important so canvas can fill it */
    height: 97vh;
    /* border: 2px solid white; */
    overflow: hidden; /* keeps flakes inside */
	cursor: url('arrow.png'), auto;
}

canvas {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 0; /* behind text */
    pointer-events: none; /* let clicks & selection pass through */
}


.ht {
    font-family: Pixelated MS Sans Serif;
    margin-top: 100px;
    color: white;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.wt {
    color: white;
}

.window {
    height: 400px;
    width: 750px;
    border: 5px solid #BFBFBF-;
    position: absolute;
    background-color: #BFBFBF;
    top: 44%;
    left: 50%;
    overflow: auto;
    transform: translate(-50%, -50%);
}

.title-bar-controls button:active {
	font-family: Pixelated MS Sans Serif;
    box-shadow: inset -1px -1px #fff, inset 1px 1px #0a0a0a, inset -2px -2px #dfdfdf, inset 2px 2px grey;
}

.title-bar-controls button {
    font-family: "Pixelated MS Sans Serif", Arial, sans-serif; /* your 98.css font */
    font-size:ffffx; /* pixel-sized sad energy */
    font-weight: bold; /* optional, looks more 98-ish */
    text-align: center; /* make that X sit in the middle */
    line-height: 14px; /* match button height so it’s vertically centered */
}

.slider {
	height: 15px;
	width: 730px;
	margin-top: -4px;
	margin-left: -1.9px;
	border: 2px solid #000080;
	background-color: #000080;
	cursor: url('arrow.png'), auto;
}

.slider:active {
	cursor: url('move.png'), auto;
}

.btn-close {
  width:16px;
  height:14px;
  background-image:url("data:image/svg+xml;charset=utf-8,<svg width='8' height='7' fill='none' xmlns='http://www.w3.org/2000/svg'><path fill-rule='evenodd' clip-rule='evenodd' d='M0 0h2v1h1v1h2V1h1V0h2v1H7v1H6v1H5v1h1v1h1v1h1v1H6V6H5V5H3v1H2v1H0V6h1V5h1V4h1V3H2V2H1V1H0V0z' fill='%23000'/></svg>");
  background-repeat:no-repeat;
  background-position:center;
  cursor: pointer;
  margin-left: 715px;
  top: -2px;
  position: absolute;
  background-color: #C0C0C0;
  cursor: url('link.png'), pointer;
}

.btn-maximize {
  width:16px;
  height:14px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='9' height='9' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M9 0H0v9h9V0zM8 2H1v6h7V2z' fill='%23000'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  cursor: pointer;
  margin-left: 698px;
  top: -2px;
  position: absolute;
  background-color: #C0C0C0;
  cursor: url('link.png'), pointer;
}

.btn-minimize {
  width:16px;
  height:14px;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg width='6' height='2' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='%23000' d='M0 0h6v2H0z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:center;
  cursor: pointer;
  margin-left: 680px;
  top: -2px;
  background-color: #C0C0C0;
  position: absolute;
  cursor: url('link.png'), pointer;
}

.windowinner {
    height: 383px;
    width: 733px;
    border: 5px solid white;
    position: absolute;
    background-color: white;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}


.veryinner {
    height: 381px;
    width: 730px;
    border: 5px solid #C0C0C0;
    position: absolute;
    background-color: #C0C0C0;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.iconfile {
	height: 16px;
	width: 16px;
	user-selection: none;
}

.text {
	color: white;
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: -14px;
	left: 20px;
	letter-spacing: 1px;
	font-size: 13px;
	position: absolute;
	user-select: none;
}

.textin {
	color: black;
	font-family: Pixelated MS Sans Serif;
	position: absolute;
	top: 10px;
	right: 140px;
	cursor: text;
}

.abouttxt {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	font-size: 20px;
	top: 67px;
	position: absolute;
}

.about {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 100px;
	width: 700px;
	position: absolute;
}

.about2 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 200px;
	width: 700px;
	position: absolute;
}

.li1 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	left: 5px;
	top: 245px;
	position: absolute;	
}

.li2 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 245px;
	left: 250px;
	position: absolute;	
}

.li3 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	left: 5px;
	top: 270px;
	position: absolute;	
}

.li4 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 270px;
	left: 250px;
	position: absolute;	
}

.mainwin {
    height: 375px;
    width: 725px;
    border: 5px solid #9A9A9A;
    position: absolute;
    background-color: #9A9A9A;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);	
}

.li5 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 296px;
	left: 5px;
	position: absolute;	
}

.li6 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 296px;
	left: 250px;
	position: absolute;	
}

.li7 {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 306px;
	left: 10px;
	position: absolute;	
}


*::selection {
	color: white;
	background-color: black;
}

.linktocontact {
	font-family: Pixelated MS Sans Serif;
	font-weight: bold;
	top: 356px;
	font-size: 15px;
	left: 190px;
	position: absolute;
  cursor: url('link.png'), pointer;
}

.linktocontact:visited {
  color: blue; /* Replace with your preferred hex code */
  text-decoration: none; /* Optional: removes the underline */
}

.chead {
    font-family: Pixelated MS Sans Serif;
    color: black;
    left: 250px;
    top: 40px;
    position: absolute;
}

.disclaimer {
	color: red;
	font-family: Pixelated MS Sans Serif;
    position: absolute;
    left: 40px;
    top: 90px;
}

.disclaimer1 {
	color: black;
	font-family: Pixelated MS Sans Serif;
    position: absolute;
    left: 150px;
    width: 520px;
    top: 90px;
}

.mail {
	color: blue;
	font-weight: bold;
	font-family: Pixelated MS Sans Serif;
    position: absolute;
    left: 150px;
    width: 520px;
    top: 200px;
}

.mail2:visited {
	color: blue;
}

.discord {
	color: blue;
	font-weight: bold;
	font-family: Pixelated MS Sans Serif;
    position: absolute;
    left: 150px;
    width: 520px;
    top: 220px;
}

.discord2:visited {
	color: blue;
}

.rt {
    font-family: Pixelated MS Sans Serif;
    color: black;
    left: 153px;
    top: 230px;
    font-weight: bold;
    position: absolute;
}

.home {
    font-family: Pixelated MS Sans Serif;
    color: blue;
    left: 320px;
    top: 340px;
    font-weight: bold;
    position: absolute;
}

.home:visited {
	color: blue;
}

.banner {
    position: absolute;
    bottom: 10px;      /* hugs the floor like it owes rent */
    left: 50%;         /* moves to the middle of the screen */
    transform: translateX(-50%); /* actually centers it instead of lying */
}

#rings {
    position: absolute;
    bottom: 40px;
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    font-family: Pixelated MS Sans Serif;
    color: white;
    z-index: 9999;
}

.ring {
    margin-bottom: 6px;
    font-size: 14px;
}

.ring a {
    color: white;
    text-decoration: none;
}

.ring a:hover {
    text-decoration: underline;
}