cr ratboizs

--- TITLE + BUTTONS (Main) ---

<link rel="stylesheet" href="https://unpkg.com/98.css">
<div class="window" style="box-shadow:inset -1px -0px #0a0a0a, inset 1px 1px #fff, inset -2px -0px #808080, inset 2px 2px #E8E8E8;">
<div class="title-bar" style="background: #305181;">
<div class="title-bar-text" style="color: #ffffff;"> www.name.net </div>
<div class="title-bar-controls">
<button aria-label="Minimize"></button>
<button aria-label="Maximize"></button>
<button aria-label="Close"></button></div></div></div>

--- More Info Button ---

<a href="#i"><button id="button" style="color: #000; text-decoration: none; width: 100%; height: 2.125em; cursor:help;">More Info</button></a>

--- TITLE + BUTTONS (Left) ---

<link rel="stylesheet" href="https://unpkg.com/98.css">
<div class="window" style="box-shadow:inset -1px -0px #0a0a0a, inset 1px 1px #fff, inset -2px -0px #808080, inset 2px 2px #E8E8E8;">
<div class="title-bar" style="background: #305181;">
<div class="title-bar-text" style="color: #ffffff;"> info.txt </div>
<div class="title-bar-controls">
<button aria-label="Help"></button>
<a href="#"><button id="close1" aria-label="Close" style="cursor: help;"></button></a></div></div></div>

--- TITLE + BUTTONS (Right) ---

<link rel="stylesheet" href="https://unpkg.com/98.css">
<div class="window" style="box-shadow:inset -1px -0px #0a0a0a, inset 1px 1px #fff, inset -2px -0px #808080, inset 2px 2px #E8E8E8;">
<div class="title-bar" style="background: #305181;">
<div class="title-bar-text" style="color: #ffffff;"> name.jpg </div>
<div class="title-bar-controls">
<button aria-label="Help"></button>
<a href="#"><button id="close2" aria-label="Close" style="cursor: help;"></button></a></div></div></div>

--- MAIN CONTAINER ---

box-shadow: inset -1px -1px #0A0A0A, inset 1px 0px #FFFFFF, inset -2px -2px grey, inset 2px 0px #DFDFDF;

--- TEXT BOX ---

font-family: Pixelated MS Sans Serif;
background: #f2f1ef;
padding: 5px;
border: 2px inset;

--- SCROLLBOX ---

background: #F2F1EF;
padding: 0.5em;
height: 13.125em;
border: 2px inset;
overflow: auto;

(mobile)
height: 12.875em;

--- OTHER CONTAINERS ---

width: 52%;
box-shadow: inset -1px -1px #0a0a0a, inset 1px 0px #fff, inset -2px -2px grey, inset 2px 0px #dfdfdf;

--- EXTRA TEXT BOX ---

background: #f2f1ef;
padding: 6px;
border: 2px inset;

--- ALL FONTS ---

<style>
@font-face {
font-family: Pixelated MS Sans Serif;
src:url(ms_sans_serif.woff) format("woff"); src:url(ms_sans_serif.woff2) format("woff2");
}

@font-face {
font-family: emoji;
src: url(https://dl.dropbox.com/s/cvba4kh6qm23mru/EmojiFont.ttf);
}
</style>

--- LINKS ---

<style>
a {
color: #000000;
}

a, a:hover {
cursor: help;
}
</style>

--- SOUND EFFECT ---

<script>
document.getElementById('button').onclick = function() {
document.getElementById('sound').play();
}
document.getElementById('close1').onclick = function() {
document.getElementById('sound').play();
}
document.getElementById('close2').onclick = function() {
document.getElementById('sound').play();
}
document.getElementById('glenplayer02').onclick = function() {
document.getElementById('sound').play();
}
</script>
<audio id="sound" src="https://cdn.discordapp.com/attachments/916511538410569829/1006909357981712414/mouse_click_fx.mp3" preload="auto"></audio>
<script>
var sound = document.getElementById("sound");
sound.volume = 0.3;
</script>