<html>
<meta name="viewport" content="width=800px;initial-scale:1;">
<head>
<style>
* {
box-sizing: border-box;
}
tw-story {
padding: 0;
background-color: white;
margin: auto;
height: 100%;
max-width: 900px;
min-width: 0vw;
margin: auto;
padding: 0;
border-left:2px solid rgba(18, 37, 84, 1);
border-right:2px solid rgba(18, 37, 84, 1);
-webkit-filter: drop-shadow(0 0 5px black);
filter: drop-shadow(0 0 5px black);
line-height: 1em;
font-size: 1.2em;
overflow:hidden;
}
body {
font-family: Arial;
background: #f1f1f1;
margin: 0;
padding: 0;
min-width:900px;
background-color: transparent;
background-attachment:fixed;
position: fixed;
}
.bg {
top: -15%;
left: -20%;
width: 200vw;
height: 200vh;
background-color: white;
position: fixed;
overflow: hidden;
}
#container {
text-align: center;
}
</style>
</head>
<body>
<div id="song2"></div>
<div id="container">
Chapter One.
<a onclick="parent.changeSong('sfx2');">[[Start]]</a>
Blind Justice
<a onclick="parent.changeSong('sfx1');">(set: ?passage1 to"Start")(click: ?passage1)[(goto: "BJ_2")]|passage1>[]</a>
(set: ?passage2 to"Back")(click: ?passage2)[(goto: "Home")]|passage2>[]
</div>
<div id="preload">
<img src="https://vertpush.neocities.org/VN/Character/chetico1.png">
<img src="https://vertpush.neocities.org/VN/Character/chet1.png">
<img src="https://vertpush.neocities.org/VN/Character/chet2.png">
<img src="https://vertpush.neocities.org/VN/Character/chet3.png">
<img src="https://vertpush.neocities.org/VN/Character/chet4.png">
<img src="https://vertpush.neocities.org/VN/Character/hateico1.png">
<img src="https://vertpush.neocities.org/VN/Character/hate1.png">
<img src="https://vertpush.neocities.org/VN/Character/hate2.png">
<img src="https://vertpush.neocities.org/VN/Character/hate3.png">
<img src="https://vertpush.neocities.org/VN/Character/hate4.png">
<img src="https://vertpush.neocities.org/VN/Character/hate5.png">
</div>
</body>
</html>
{
<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_right"><img class="speak" style="animation-delay: 1s;" src="https://vertpush.neocities.org/VN/Character/chet2.png"></div>
<div class='ch_left'><img class="speak" style="animation-delay: 4s;" src="https://vertpush.neocities.org/VN/Character/hate4.png"></div>
<div class="textContainer">
<table>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/chetico1.png" style="width:50px;"></td>
<td>{(live:2s)[<div class="css-typing">"...aaaate... Haaaate... <b>HAAAATE!!</b>"</div>(stop:)]}
</td>
</tr>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/hateico1.png" style="width:50px;"></td>
<td>{(live:5s)[<div class="css-typing">"... Hnnngghhhrff..."</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_2.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Scene3")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene5")]|passage>[]
</div>
</div>
</div>}{
(print: "<script>$('html').removeClass(\)</script>")
(if: (passage:)'s tags's length > 0)[
(print: "<script>$('html').addClass('" + (passage:)'s tags.join(' ') + "'\)</script>")
]
}{<!DOCTYPE html>
<html>
<meta name="viewport" content="width=800px;initial-scale:1;">
<head>
<style>
* {
box-sizing: border-box;
}
::-webkit-scrollbar {
width: 2px;
}
::-webkit-scrollbar-track {
background-color: transparent;
margin-top:10px;
}
::-webkit-scrollbar-thumb {
border-radius: 0px;
background-color: rgba(18, 37, 84, 1);
}
tw-story {
padding: 0;
background-color: white;
margin: auto;
max-width: 900px;
min-width: 0vw;
margin: auto;
padding: 0;
border-left:2px solid rgba(18, 37, 84, 1);
border-right:2px solid rgba(18, 37, 84, 1);
-webkit-filter: drop-shadow(0 0 5px black);
filter: drop-shadow(0 0 5px black);
background-image: url("https://vertpush.neocities.org/VN/Bg/bg_2.png");
background-size: cover;
background-attachment: fixed;
line-height: 1em;
font-size: 1.2em;
}
body {
font-family: Arial;
background: #f1f1f1;
margin: 0;
padding: 0;
min-width:900px;
background-color: transparent;
background-attachment:fixed;
}
.bg {
top: -15%;
left: -20%;
width: 200vw;
height: 200vh;
background-color: white;
position: fixed;
overflow: hidden;
}
#container {
}
/* Header/Blog Title */
.header {
width: 100%;
}
h1 {color: red; text-align: center;}
h2 {
font-size: 25px;
color: #004C41;
text-align: center;
margin-top: 0;
padding-bottom: 0;
}
h3 {padding-left: 20px;}
h5 {text-align:center;}
a { color: white; text-decoration: none; transition: 2s; font-size: 15px;text-transform:uppercase;}
a:hover { color: rgba(18, 37, 84, 1); transition: .32s;}
p {padding-top: 5px;padding-left:20px;padding-right:20px;}
/* Style the top navigation bar */
.topnav {
width:100%;
text-align: center;
background-color: transparent;
margin-top: -23%;
}
/* Style the topnav links */
.topnav a {
float:center;
text-align: center;
text-decoration: none;
}
/* Create two unequal columns that floats next to each other */
/* Left column */
.leftcolumn {
float: left;
width: 75%;
margin-top:-5px;
}
/* Right column */
.rightcolumn {
float: left;
width: 25%;
background-color: transparent;
margin-top:-5px;
margin-left:-3px;
}
/* Fake image */
.fakeimg {
background-color: #aaa;
width: 100%;
padding: 20px;
}
/* Add a card effect for articles */
.card {
background-color: white;
padding-top: 3px;
padding-left: 3px;
padding-right: 3px;
border-radius: 20px;
border: 2px solid rgba(18, 37, 84, 1);
margin:5px;
}
/* Clear floats after the columns */
.row:after {
content: "";
display: table;
clear: both;
}
/* Footer */
.footer {
padding: 20px;
text-align: center;
background: transparent;
margin-top: 20px;
}
#link {width: 100%;
transition: .2s;
image-rendering: -o-crisp-edges; /* Opera */
image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
image-rendering: auto;
-ms-interpolation-mode: bicubic; /* IE (non-standard property) */}
#link:hover {
scale: 1.5;
-webkit-filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 1));
filter: drop-shadow(5px 5px 5px rgba(0, 0, 0, 1));
transform: translate(-2px, -2px);
transition: .2s;
}
button {width: 25%; transition: 1s;padding: 0;
border: none;
background: none;z-index:2; cursor: pointer;}
.margin { margin: auto; }
.ata {width:100%;height:100%;}
/* Responsive layout - when the screen is less than 800px wide, make the two columns stack on top of each other instead of next to each other */
@media screen and (max-width: 800px) {
.leftcolumn, .rightcolumn {
width: 100%;
padding: 0;
}
.rightcolumn {
margin-top:0;}
tw-story { width:100%; font-size: 15px;}
}
.tabcontent {
transition: 2s;
}
.tabcontent.on {
-webkit-animation: fadein 0.6s 1 linear alternate;
-moz-animation: fadein 0.6s 1 linear alternate;
-ms-animation: fadein 0.6s 1 linear alternate;
-o-animation: fadein 0.6s 1 linear alternate;
animation: fadein 0.6s 1 linear alternate;
}
@keyframes fadein {
0% { opacity: 0%; transform: translate(-7px);
}
30% { opacity: 0%; transform: translate(-7px);
}
100% { opacity: 100%; transform: translate(0px);
}
}
.trigger {
transition: 2s;}
</style>
</head>
<body>
<div id="container">
{<div class="header"><img src="https://vertpush.neocities.org/VN/Banner1v3.png" style="width:100%; image-rendering: auto;">
</div>}
<div class="topnav">
<button class="tablinks trigger" onclick="openTab(event, 'Home')" id="defaultOpen"><img src="https://vertpush.neocities.org/VN/Buttons/home.png" id="link"></button>
(set: ?passage to"<button><img src='https://vertpush.neocities.org/VN/Buttons/read.png' id='link'></button>")(click: ?passage)[(goto: "Navigate")]|passage>[]
<button class="tablinks active trigger" onclick="openTab(event, 'Charas')" id="defaultOpen"><img src="https://vertpush.neocities.org/VN/Buttons/charas%20.png" id="link"></button>
<button class="tablinks active trigger" onclick="openTab(event, 'About')" id="defaultOpen"><img src="https://vertpush.neocities.org/VN/Buttons/about.png" id="link"></button>
</div>
<div id="Home" class="tabcontent" style="display: none;">
<div class="row">
<div class="leftcolumn">
<div class="card">
<img src="https://vertpush.neocities.org/VN/Welcome2.png" style="width: 100%; border-radius: 15px;"></div>
<div style="width:100%;height:675px;overflow:auto;">
<div class="card">
<img src="https://vertpush.neocities.org/VN/update.png" style="width: 100%; border-radius: 15px;">
<h5>Breakthrough!! 8.8.21</h5>
<p>With some help from a friendly community member, FINALLY we can get some background music happening! I feel like I can start writing now. Let's see what happens! (Thank you, friend!) - ohmi</p>
</div>
<div class="card">
<img src="https://vertpush.neocities.org/VN/update.png" style="width: 100%; border-radius: 15px;">
<h5>Added Characters & World Info 6.16.21</h5>
<p>Hey hey! Finally have it so all the tabs on the main page work. Now to start the story and making sure that works on every platform =w= Do you think I should make music, too? We'll see! - ohmi</p>
</div>
<div class="card">
<img src="https://vertpush.neocities.org/VN/update.png" style="width: 100%; border-radius: 15px;">
<h5>Still Working 6.10.21</h5>
<p>Just adding some graphics to this "main page" before writing the actual story and getting that VN process a little more... accessible. Having fun with it, & not worrying too much about perfection or anything =w= just looking to make something!! - ohmi</p>
</div>
</div>
</div>
<div class="rightcolumn">
{<div class="card" style="background: rgba(196, 253, 248, 0.28);">
<iframe src="https://www6.cbox.ws/box/?boxid=847355&boxtag=z734Lj" width="100%" height="450" allowtransparency="yes" allow="autoplay" frameborder="0" marginheight="0" marginwidth="0" scrolling="auto"></iframe></div>}
{ <div class="card" style="text-align: center;">
<div class="ata"><img src="https://vertpush.neocities.org/VN/atasm.png" style="border-radius: 15px;"></div>
<p>I'm ohmi! An anthro-enthusiast who likes to draw and write.</p>
</div>}
</div>
</div>
</div>
<div id="Charas" class="tabcontent" style="display: none;">
<div class="row">
<div class="card" style="background-color:transparent; border:none;"><h2><br></h2></div>
<br><br>
<div class="card">
<img src="https://vertpush.neocities.org/VN/Character/chet.png" style="height:250px;position: absolute;left:0;bottom:0;max-height:none;"><div style="margin-left: 200px;"> <h3> Chet Farron </h3> <p>He's too tall! Friendly blue idiot. Quick reflexes and heals fast. Does he know more than he lets on? Probably not.</p><br></div>
</div>
<br>
<div class="card" style="background-color:transparent; border:none;"><h2><br></h2></div>
<div class="card">
<img src="https://vertpush.neocities.org/VN/Character/hate.png" style="height:250px; position: absolute; left:0;bottom:0;max-height:none;"><div style="margin-left: 200px;"> <h3> Hate Farron </h3> <p> Chet's "big" sister. Suspiciously strong. Hate is just a nickname. <b>Unfriendly!</b></p><br></div>
</div>
<br>
<div class="card" style="background-color:transparent; border:none;"><h2><br></h2></div>
<div class="card">
<img src="https://vertpush.neocities.org/VN/Character/athena.png" style="height:250px; position: absolute; left:0;bottom:0;max-height:none;"><div style="margin-left: 200px;"> <h3> Athena </h3> <p>How does someone this lazy make it this far? Likely depending on the kindness of others. Likes to make snarky jokes. What a leech!</p><br></div>
</div>
<br>
<div class="card" style="background-color:transparent; border:none;"><h2><br></h2></div>
<div class="card">
<img src="https://vertpush.neocities.org/VN/Character/kit.png" style="height:250px; position: absolute; left:0;bottom:0;max-height:none;"><div style="margin-left: 200px;"> <h3> Kit </h3> <p>She's a mysterious master chef that likes to let Athena try her food. Don't feed Athena, Kit!! You're too good for this world.</p><br><br></div>
</div>
<br>
<div class="card" style="background-color:transparent; border:none;"><h2><br></h2></div>
<div class="card">
<img src="https://vertpush.neocities.org/VN/Character/taw.png" style="height:250px; position: absolute; left:0;bottom:0;max-height:none;"><div style="margin-left: 200px;"> <h3> Taw </h3> <p>Wild aeronaut with too much energy! She's a whirlwind! Beware of her antics, you <i>will</i> get swept up!</p><br><br></div>
</div>
<br>
<div class="card" style="background-color:transparent; border:none;"><h2><br></h2></div>
<div class="card">
<img src="https://vertpush.neocities.org/VN/Character/dyne.png" style="height:250px; position: absolute; left:0;bottom:0;max-height:none;"><div style="margin-left: 200px;"> <h3> Dyne </h3> <p>Timid and fluffy girl wrapped up in Taw's <i>shenanigans</i>. Does... she need help?</p><br></div>
</div>
<br>
<div class="card" style="background-color:transparent; border:none;"><h2></h2></div>
<div class="card">
<div style="margin-left: 200px;"><h3> ??? </h3> <p>There are many friends not here yet. And many enemies as well...</p></div>
</div>
</div>
</div>
<div id="About" class="tabcontent" style="display: none;">
<div class="row">
<div class="card">
<h3>Welcome to The World!</h3>
<p> It doesn't have a name yet, but I can tell you some things about it.</p>
</div>
<div class="card"><h1>Event!</h1><p>Recently there have been reports of Royal Blooded citizens going missing. Keep on the lookout for suspicious individuals, and keep tabs on your Royal Blooded patrons.</p></div>
<div class="card">
<h3>Royal Blooded</h3>
<p> Long ago, gods descended from the heavens and roamed the surface world. Some took positions of power and ruled peacefully, some waged war, some acquired fortunes, and some wandered the planet experiencing simple lives. As the gods grew old in their mortal forms, they bred with mortals to carry on the lineage and seek glory in that god's name. A single godlike ability would pass on to the child of a god, and they were called <b>Royal Blooded.</b></p>
<p>Because of their inherant abilities, Royal Blooded offspring more often than not find their way into positions of power. Whether they use that power for good or evil... is up to the individual.</p>
<p><b>Royal Breeding:</b> Only one child born of a Royal Blooded parent may carry on an ability. This may be a direct descendant, being the very same ability of the parent, or some sort of deviation or mutation of the parent ability.<br><br>There is only one possibility for a child to carry two abilities at once: If two Royal Blooded parents breed. The drawback to a child born with two abilities is that they will be barren, and not produce offspring themselves. However, this is incredibly unlikely, because those with Royal Blood instinctively wish to overcome eachother.</p>
</div>
<div class="card">
<h3>Map</h3>
<p> Someday there will be a map! </p>
</div>
<div class="card">
<h3>History</h3>
<p> There is important history, entire kindoms built and razed in the name of gods, at the hands of rulers with incredible abilities. Someday, it will be more relevant than now! ;) </p>
</div>
</div>
</div>
<div class="footer">
<a href="https://twitter.com/home">Twitter</a> |
<a href="https://vertpush.neocities.org/">Neocities</a> |
<a href="https://www.ohmiyoni.com/">ohmiyoni.com</a>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$('.trigger').click(function () {
$('.tabcontent').addClass('on');
$('.tabcontent').one('webkitAnimationEnd oanimationend msAnimationEnd animationend', function(event) {
$('.tabcontent').removeClass('on')
});
});
</script>
<script>
function openTab(evt, tabName) {
var i, tabcontent, tablinks;
tabcontent = document.getElementsByClassName("tabcontent");
for (i = 0; i < tabcontent.length; i++) {
tabcontent[i].style.display = "none";
}
tablinks = document.getElementsByClassName("tablinks");
for (i = 0; i < tablinks.length; i++) {
tablinks[i].className = tablinks[i].className.replace(" active", "");
}
document.getElementById(tabName).style.display = "block";
evt.currentTarget.className += " active";
}
document.getElementById("defaultOpen").click();
</script>
</body>
</html>}
{
<head>
<style>
.bg {
width: 200%;
height: 200%;
background-color: black;
position: fixed;
top:-100%;
left:-100%;
z-index:-100;
overflow: hidden;
}
@media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }
</style>
</head>
<meta name="viewport" content="width=device-width, initial-scale=.6">
<div class='gameContainer'>
<img src="" id="ch_left">
<img src="" id="ch_right">
<div class="textContainer">
<table>
<tr>
<td><b>???:</b></td>
<td>{(live:250ms)[<div class="css-typing">"..."</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-color: black;"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Navigate")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene1")]|passage>[]
</div>
</div>
<div class="bg"></div>
</div>
}{
<head>
<style>
.bg {
width: 200%;
height: 200%;
background-color: black;
position: fixed;
top:-100%;
left:-100%;
z-index:-100;
overflow: hidden;
}
@media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }
</style>
</head>
<meta name="viewport" content="width=device-width, initial-scale=.6">
<div class='gameContainer'>
<img src="" id="ch_left">
<img src="" id="ch_right">
<div class="textContainer">
<table>
<tr>
<td><b>???:</b></td>
<td>{(live:250ms)[<div class="css-typing">".......?"</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-color: black;"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Start")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene2")]|passage>[]
</div>
</div>
<div class="bg"></div>
</div>}{
<head>
<style>
.bg {
width: 200%;
height: 200%;
background-color: black;
position: fixed;
top:-100%;
left:-100%;
z-index:-100;
overflow: hidden;
}
@media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }
</style>
</head>
<meta name="viewport" content="width=device-width, initial-scale=.6">
<div class='gameContainer'>
<img src="" id="ch_left">
<img src="" id="ch_right">
<div class="textContainer">
<table>
<tr>
<td><b>???:</b></td>
<td>{(live:250ms)[<div class="css-typing">"... It looks like you're stuck here again."</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-color: black;"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Scene1")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene3")]|passage>[]
</div>
</div>
<div class="bg"></div>
</div>}{
<head>
<style>
.bg {
width: 200%;
height: 200%;
background-color: black;
position: fixed;
top:-100%;
left:-100%;
z-index:-100;
overflow: hidden;
}
@media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }
</style>
</head>
<meta name="viewport" content="width=device-width, initial-scale=.6">
<div class='gameContainer'>
<img src="" id="ch_left">
<img src="" id="ch_right">
<div class="textContainer">
<table>
<tr>
<td><b>???:</b></td>
<td>{(live:250ms)[<div class="css-typing">"You know, eventually you won't be able to leave here by yourself." </div> (stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-color: black;"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Scene2")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene4")]|passage>[]
</div>
</div>
<div class="bg"></div>
</div>}
{
<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_right"><img class="speak" style="animation-delay: 1s, 6s;" src="https://vertpush.neocities.org/VN/Character/chet8.png"></div>
<div class='ch_left'><img class="speak" style="animation-delay: 3s;" src="https://vertpush.neocities.org/VN/Character/hate.png"></div>
<div class="textContainer">
<table>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/chetico1.png" style="width:50px;"></td>
<td>{(live:1s)[<div class="css-typing">"Oh good! You're awake! You nearly punched a hole in me."</div>(stop:)]}
</td>
</tr>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/hateico1.png" style="width:50px;"></td>
<td>{(live:3s)[<div class="css-typing">"<i>Urgh</i>... Yeah, yeah. How long was I asleep?"</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_2.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Scene4")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene6")]|passage>[]
</div>
</div>
</div>}
{
<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_right"><img class="speak" style="animation-delay: 6s;" src="https://vertpush.neocities.org/VN/Character/chet7.png"></div>
<div class='ch_left'><img class="speak" style="animation-delay: 1s;" src="https://vertpush.neocities.org/VN/Character/hate8.png"></div>
<div class="textContainer">
<table>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/hateico1.png" style="width:50px;"></td>
<td>{(live:1s)[<div class="css-typing">"Well <i>Gods</i> why didn't you wake me up sooner?</div>(stop:)]}
{(live:3s)[<div class="css-typing">We only have a small window to catch the emperor on his trip through Maldere!"</div>(stop:)]}
</td>
</tr>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/chetico1.png" style="width:50px;"></td>
<td>{(live:6s)[<div class="css-typing">"I, ermm, figured it'd be best for you to get some sleep. You've been a bit... tired lately."</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_2.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Scene6")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene8")]|passage>[]
</div>
</div>
</div>}{
<!-- Create a variable to track the position within the $typewriterText string -->
(set: $typewriterPos to 1)
<!-- Create a hook to hold the typed text -->
|typewriterOutput>[]
<!-- Set a delay of 20ms seconds per loop -->
(live: 1ms)[
<!-- Add the next character to the hook -->
(append: ?typewriterOutput)[(print: $typewriterText's $typewriterPos)]
<!-- Update the position -->
(set: $typewriterPos to it + 1)
<!-- If it's gone past the end, stop -->
(if: $typewriterPos is $typewriterText's length + 1)[
(stop:)
]
]
}{
<!-- Create a variable to track the position within the $typewriterText string -->
(set: $typewriterPos to 1)
<!-- Create a hook to hold the typed text -->
|typewriterOutput>[]
<!-- Set a delay of 20ms seconds per loop -->
(live: 1ms)[
<!-- Add the next character to the hook -->
(append: ?typewriterOutput)[(print: $typewriterText's $typewriterPos)]
<!-- Update the position -->
(set: $typewriterPos to it + 1)
<!-- If it's gone past the end, stop -->
(if: $typewriterPos is $typewriterText's length + 1)[
(stop:)
]
]
}
{
<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_right"><img class="speak" style="animation-delay: 6s;" src="https://vertpush.neocities.org/VN/Character/chet5.png"></div>
<div class='ch_left'><img class="speak" style="animation-delay: 1s;" src="https://vertpush.neocities.org/VN/Character/hate6.png"></div>
<div class="textContainer">
<table>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/hateico1.png" style="width:50px;"></td>
<td>{(live:1s)[<div class="css-typing">"That's... not important right now. In what direction is the city from here?</div>(stop:)]}
</td>
<tr><td></td>
<td>
{(live:3s)[<div class="css-typing"><i>Chet vanishes for a moment. As the tree above rustles, Chet reappears, covered in twigs.</i></div>(stop:)]}
</td></tr>
</tr>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/chetico1.png" style="width:50px;"></td>
<td>{(live:6s)[<div class="css-typing">"Hard to say. There's a path that goes west-ish.</div>(stop:)]}
{(live:8.5s)[<div class="css-typing">There might be a village we could ask for directions."</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_2.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Scene7")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene9")]|passage>[]
</div>
</div>
</div>}So I don't forget:
<div class='ch2_right rin'><img src='https://vertpush.neocities.org/VN/Character/athena1.png'></div>
<div class='ch2_left lin'><img src="https://vertpush.neocities.org/VN/Character/kit1.png" style="transform: scaleX(-1);"></div>
<div class='ch2_rightout rout'><img src='https://vertpush.neocities.org/VN/Character/athena1.png'></div>
<div class='ch2_leftout lout'><img src="https://vertpush.neocities.org/VN/Character/kit1.png" style="transform: scaleX(-1);"></div>{
<head>
<style>
.bg {
width: 200%;
height: 200%;
background-color: black;
position: fixed;
top:-100%;
left:-100%;
z-index:-100;
overflow: hidden;
}
@media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }
</style>
</head>
<div id="preload">
<img src="https://vertpush.neocities.org/VN/Character/taw.png">
<img src="https://vertpush.neocities.org/VN/Character/taw1.png">
<img src="https://vertpush.neocities.org/VN/Character/taw2.png">
<img src="https://vertpush.neocities.org/VN/Character/taw3.png">
<img src="https://vertpush.neocities.org/VN/Character/taw4.png">
<img src="https://vertpush.neocities.org/VN/Character/dyne.png">
<img src="https://vertpush.neocities.org/VN/Character/dyne1.png">
<img src="https://vertpush.neocities.org/VN/Character/dyne2.png">
<img src="https://vertpush.neocities.org/VN/Character/dyne3.png">
<img src="https://vertpush.neocities.org/VN/Character/dyne4.png">
<img src="https://vertpush.neocities.org/VN/Character/dyne5.png">
<img src="https://vertpush.neocities.org/VN/Character/dyne6.png">
<img src="https://vertpush.neocities.org/VN/Bg/bg_office.png">
<img src="https://vertpush.neocities.org/VN/Bg/bg_dungeon.png">
</div>
<div class='container'>
<img src="" id="ch_left">
<img src="" id="ch_right">
<div class="textContainer">
<table>
<tr>
<td><b></b></td>
<td>{(live:250ms)[<div class="css-typing"></div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-color: black;"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Navigate")]|passage1>[]
<a onclick="parent.changeSong('sfx1');">(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "BJ_2")]|passage>[]</a>
</div>
</div>
<div class="bg"></div>
</div>
}{<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_left"><img class="speak" style="animation-delay: 2s;" src="https://vertpush.neocities.org/VN/Character/taw7.png"></div>
<div class='ch_right'><img class="speak" style="animation-delay: 8s;" src="https://vertpush.neocities.org/VN/Character/dyne3.png"></div>
<div class="textContainer">
<table>
<tr>
<td><b>Taw:</b></td>
<td>{(live:2s)[<div class="css-typing">Alright, D, we have the perpetrator captive.</div>(stop:)]}
{(live:4s)[<div class="css-typing">Now we just have to interrogate him for the confession.</div>(stop:)]}
{(live:6s)[<div class="css-typing">You know what that means...</div>(stop:)]}
</td>
</tr>
<tr>
<td><b>Dyne:</b></td>
<td>{(live:8s)[<div class="css-typing">Th-that we interrogate him for the confession?</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_office.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "BJ_1")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "BJ_3")]|passage>[]
</div>
</div>
<div class="transbg transOut"></div>
</div>}{<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_left"><img class="speak" src="https://vertpush.neocities.org/VN/Character/taw2.png"></div>
<div class='ch_right'><img class="speak" style="animation-delay: 3s;" src="https://vertpush.neocities.org/VN/Character/dyne8.png"></div>
<div class="textContainer">
<table>
<tr>
<td><b>Taw:</b></td>
<td>{(live:1s)[<div class="css-typing">We're going to play <i><b>Good Cop Bad Cop!</b></i></div>(stop:)]}
</td>
</tr>
<tr>
<td><b>Dyne:</b></td>
<td>{(live:3s)[<div class="css-typing">O-oh! I think I can do that!</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_office.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "BJ_2")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "BJ_4")]|passage>[]
</div>
</div>
</div>}{<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_left"><img class="speak" src="https://vertpush.neocities.org/VN/Character/taw4.png"></div>
<div class='ch_right'><img class="speak" style="animation-delay: 3s;" src="https://vertpush.neocities.org/VN/Character/dyne4.png"></div>
<div class="textContainer">
<table>
<tr>
<td><b>Taw:</b></td>
<td>{(live:1s)[<div class="css-typing">I'll be the good cop. D, you be the bad cop!</div>(stop:)]}
</td>
</tr>
<tr>
<td><b>Dyne:</b></td>
<td>{(live:3s)[<div class="css-typing"><i>WHAT?! B-B-B-!!</i></div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_office.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "BJ_3")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "BJ_5")]|passage>[]
</div>
</div>
</div>}{<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_left"><img class="speak" src="https://vertpush.neocities.org/VN/Character/taw3.png"></div>
<div class='ch_right'><img src="https://vertpush.neocities.org/VN/Character/dyne4.png"></div>
<div class="textContainer">
<table>
<tr>
<td><b>Taw:</b></td>
<td>{(live:1s)[<div class="css-typing">You know what <i>that</i> means...</div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_office.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "BJ_4")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "BJ_6")]|passage>[]
</div>
</div>
</div>}{<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_left"><img class="speak" style="animation-delay: 2s;" src="https://vertpush.neocities.org/VN/Character/taw7.png"></div>
<div class='ch_right'><img src="https://vertpush.neocities.org/VN/Character/dyne7.png"></div>
<div class="textContainer">
<table>
<tr>
<td></td>
<td>{(live:1s)[<div class="css-typing"><i>Jail bars slam shut</i></div>(stop:)]}
</td>
</tr>
<tr>
<td><b>Taw:</b></td>
<td>{(live:3s)[<div class="css-typing">One bad apple spoils the barrel! We don't tolerate bad cops!!</div>(stop:)]}
</td>
</tr>
</tr>
<tr>
<td><b>Dyne:</b></td>
<td>{(live:5s)[<div class="css-typing"><b><i>!!!</i></b></div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_dungeon.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "BJ_5")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "BJ_7")]|passage>[]
</div>
</div>
</div>}{<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_left"><img class="speak" src="https://vertpush.neocities.org/VN/Character/taw5.png"></div>
<div class='ch_right'><img src="https://vertpush.neocities.org/VN/Character/dyne6.png"></div>
<div class="textContainer">
<table>
<tr>
<td><b>Taw:</b></td>
<td>{(live:1s)[<div class="css-typing">That's one more terror off of the streets of Donningham.</div>(stop:)]}
{(live:3s)[<div class="css-typing"><i>This</i> case called for plain, good old-fashioned police leg work!</div>(stop:)]}
</td>
</tr>
<tr>
<td><b>Dyne:</b></td>
<td>{(live:5s)[<div class="css-typing"><sub>h-heeelp...</sub></div>(stop:)]}
</td>
</tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_dungeon.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "BJ_6")]|passage1>[]
<a onclick="parent.musicPlayer.pause();">(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Navigate")]|passage>[]</a>
</div>
</div>
</div>}
{
<style> @media screen and (max-width: 850px) {
.gameContainer {width:100vw;height: 100vh;}
.ch_left {width: 200px;}
.ch_right {width:200px;}
.topBackground {height:100vh;} }</style>
<div class='gameContainer'>
<div class="ch_right"><img class="speak" style="animation-delay: 1s, 6s;" src="https://vertpush.neocities.org/VN/Character/chet8.png"></div>
<div class='ch_left'><img src="https://vertpush.neocities.org/VN/Character/hate.png"></div>
<div class="textContainer">
<table>
<tr>
<td><img src="https://vertpush.neocities.org/VN/Character/chetico1.png" style="width:50px;"></td>
<td>{(live:1s)[<div class="css-typing">"About a week!"</div>(stop:)]}
</td>
</tr>
<tr>
</table>
</div>
<div class="topBackground" style="background-image: url('https://vertpush.neocities.org/VN/Bg/bg_2.png')"></div>
<div class='textBubble'>
(set: ?passage1 to"<div class='textButton' style='left:0px;'><div class='previous'><img src='https://vertpush.neocities.org/VN/Buttons/previous.png' style='width:100%;'></div></div>")
(click: ?passage1)[(goto: "Scene5")]|passage1>[]
(set: ?passage to"<div class='textButton' style='right:0px;'><div class='next'><img src='https://vertpush.neocities.org/VN/Buttons/next.png' style='width:100%;z-index:5;' id='link'></div></div>")
(click: ?passage)[(goto: "Scene7")]|passage>[]
</div>
</div>
</div>}