Your browser lacks required capabilities. Please upgrade it or switch to another to continue.
Loading…
<div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Hello, where are you going to?</p></div></div></div>
<div class="answerscontain"><div class="answerbox2"><p class="yourname">You</p><div class="answerbox" data-passage="S1_2"><p class="answer">[[Hi! To the hotel, please->S1_2]]</p></div><div class="answerspan"></div></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab1 volume 0 fadeto 0.4>>
<<set $shanicejor to 0>>
<style>
.yourname {
font-weight: 900;
color: white;
text-shadow: 2px 2px 6px black;
font-size: 110%;
margin-block-start: 0 !important;
margin-block-end: 1px !important;
text-align: left;
}
.answerbox2 {
box-sizing: border-box;
max-width: 27%;
height: auto;
display: inline-block;
transform: skewX(-8deg);
margin-bottom: 3em;
}
.answerbox {
box-sizing: border-box;
width: auto;
max-width: 100% !important;
height: auto;
border: 1px solid black;
margin: 0;
background-color: rgb(154, 232, 255);
padding: 15px;
padding-top: 0;
padding-bottom: 0;
box-shadow: 3px 3px 8px black;
vertical-align: bottom;
transform: skewX(0deg);
}
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">I've never seen you around here... first time in town?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S1_3"><p class="answer">[[Yes, actually->S1_3]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab1 volume 0.4 fadeout>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh! What brings you here?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S1_4"><p class="answer">[[Oh, you know, just a break from the big city->S1_4]]</p></div><div class="answerbox" data-passage="S1_5"><p class="answer">[[I'm a journalist. I came to write a story, actually->S1_5]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Really? How nice! Alec's hotel is actually pretty good if you want to chill. They also have nice events.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S1_9"><p class="answer">[[Good to know->S1_9]]</p></div><div class="answerbox" data-passage="S1_6"><p class="answer">[[Alec's the hotel owner?->S1_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Really?! About Kelby? What is there to write about?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S1_7"><p class="answer">[[It's just a travel article->S1_7]]</p></div><div class="answerbox" data-passage="S1_8"><p class="answer">[[I've heard something weird might be happening to the vegetation. Do you know anything about it, actually?->S1_8]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $shanicejor to 1>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">We are here, enjoy your stay! Call me when you need a ride.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="LG1"><p class="answer">[[Sure will do! Thanks!->LG1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Yes! A very handsome man. Grew up here, it seems. But went away to study architecture... traveled the whole world. He's come back a few years ago and started to manage his mother's hotel... built some stuff, painted some walls, looks really nice.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S1_9"><p class="answer">[[Good to know->S1_9]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, how nice! Hope we get to see more tourists. We have arrived, enjoy your stay! Call me when you need a ride.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="LG1"><p class="answer">[[Thank you!->LG1]]</p></div><div class="answerspan"></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Vegetation? Oh, honestly, the people in this town overreact to everything. Things might not be the same as before, but things change, you know? If you came just for that, you might have come in vain, to be honest...</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S1_10"><p class="answer">[[Well, I might as well enjoy my time here anyway->S1_10]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Receptionist</p><div class="speechbox"><p class="speech">Hey, there! Do you want to check-in? What's your name?</p></div></div></div>
<div class="answerscontain"><<textbox "$userName" "" "LG2">><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio lobby1 volume 0 fadeto 0.3>>
<!--style for the text box-->
<style>
.answerscontain {
text-align: center !important;
}
body {
background: url(images/01-hotel.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
#textbox-username {
border: 0;
background-color: rgb(154, 232, 255);
text-align: center;
color: black;
width: 15%;
box-sizing: border-box;
height: 10vh;
border: 1px solid black;
margin-bottom: 3em;
transform: skewX(-8deg);
box-shadow: 3px 3px 8px black;
font-size: 120%;
vertical-align: bottom;
}
#textbox-username:hover {
background-color: white;
}
.answerbox {
width: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Yeah, sure! Alec's hotel is actually pretty good if you want to chill. They also have nice events.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S1_9"><p class="answer">[[Good to know->S1_9]]</p></div><div class="answerbox" data-passage="S1_6"><p class="answer">[[Alec's the hotel owner?->S1_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Receptionist</p><div class="speechbox"><p class="speech">Welcome, <<print $userName>>! Here's a map of the city, hope you enjoy your stay!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="answer">[[Thanks!->Kelby-Chapter-1]]</p></div><div class="answerspan"></div></div>
<<audio lobby1 volume 0.3 fadeout>>
<<audio theme-song volume 0.01 fadeto 0>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $cm1 to 0>>
<<set $felena1 to 0>>
<<set $foldman1 to 0>>
<<set $h1 to 0>>
<<set $s1 to 0>>
<<set $anne to 0>>
<<set $prepared to 0>>
<<set $elenajor to 0>>
<<set $AL2E2 to 0>>
<<set $CN1 to 0>>
<<set $CE1 to 0>>
<<set $EL1 to 0>>
<<set $AL1 to 0>>
<<set $s2 to 0>>
<<set $NEWS to 0>>
<<set $E3H1 to 0>>
<<set $GOOGLE to 0>>
<<set $easteregg to 0>>
<<set $NM to 0>>
<style>
body {
background: url(images/01-hotel.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech"><<if $cm1 == 0>>Hello there! I'm Anne. Do you want to take a look at my flowers?<</if>><<if $cm1 == 1>>Hi! You're back!<</if>></p></div></div></div>
<div class="answerscontain"><<if $cm1 == 0>><div class="answerbox" data-passage="AN1_1"><p class="answer">[[Sure!->AN1_1]]</p></div><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="answer">[[Sorry, I’m in a hurry->Kelby-Chapter-1]]</p></div><</if>><<if $cm1 == 1>><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="answer">[[Yeah, just passing through->Kelby-Chapter-1]]</p></div><</if>><div class="answerspan"></div></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<audio market1 volume 0.3 fadeoverto 6 0>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">We have roses, daisies, lilies…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_2"><p class="answer">[[They are very beautiful! Do you grow them yourself?->AN1_2]]</p></div><div class="answerbox" data-passage="AN1_3"><p class="answer">[[They are beautiful, I might put some in my hotel room->AN1_3]]</p></div><div class="answerspan"></div></div>
<<set $anne to 1>>
<<set $NM += 1>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">Yes, yes! My husband, Henry, and I… on our little farm just outside of the town. He doesn’t like coming here much, prefers nature to people, but I love to sell my flowers.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_4"><p class="answer">[[Really? I’ve heard rumors something weird is happening to the vegetation around town. Is that true?->AN1_4]]</p></div><div class="answerbox" data-passage="AN1_3"><p class="answer">[[Oh, how nice. They are indeed very beautiful. I am gonna get some lilies to put in my hotel room->AN1_3]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">Oh, you’re staying in town? How nice! What brings you here?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_5"><p class="answer">[[Just a break from the city, I’m staying at Alec’s hotel->AN1_5]]</p></div><div class="answerbox" data-passage="AN1_4"><p class="answer">[[I’m a writing a story about Kelby, I’m a travel journalist. But I heard something weird is happening to the vegetation. Is that true?->AN1_4]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">Oh, our crops have not been the same this year, but it’s probably just the weather, nothing to worry about. Nature around town has been as beautiful as ever. Actually, have you visited the fountain close to the hills already?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_6"><p class="answer">[[Not yet, gonna check it out->AN1_6]]</p></div><<if $fountain gte 1>><div class="answerbox" data-passage="AN1_7"><p class="answer">[[Yes! Very beautiful indeed->AN1_7]]</p></div><</if>><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">Oh, a very good hotel! Just pay attention to Alec… always partying and seducing people that one. Doesn’t care about anything but enjoying life…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_6"><p class="answer">[[Oh, ok. Gonna pay attention->AN1_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">You should! Are you getting a flower?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_9"><p class="answer">[[Yes, give some lilies->AN1_9]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">Isn’t it? It’s a very important fountain, you know? It protects us.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_8"><p class="answer">[[Protects you from what?->AN1_8]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><<if $felena1 == 0>><div class="pspeechbox"><div class="speechbox"><p class="speech">There’s a young woman looking at the plants.</p></div><div class="optionbox" data-passage="EL1_1"><p class="option">[[Get closer to listen->EL1_1]]</p></div></div><</if>><<if ($foldman1 == 0) and ($felena1 == 1)>><div class="pspeechbox"><div class="speechbox"><p class="speech">There’s an old man staring at the fountain.</p></div><div class="optionbox" data-passage="OM1_1"><p class="option">[[Approach him->OM1_1]]</p></div></div><</if>><<if ($foldman1 == 1) and ($felena1 == 1)>><div class="pspeechbox"><div class="speechbox"><p class="speech">There's no one around</p></div></div><</if>></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio fountain1 volume 0.2 fadeoverto 6 0>>
<<set $fountain to 1>>
<style>
body {
background: url(images/03-fountain-02.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.optionbox {
background-color: white;
color: black;
width: auto;
max-width: 48%;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.optionspan {
width: 3%;
display: inline-block;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
.speechbox {
background-color: rgba(250, 250, 250, 0);
color: white;
border: 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
}
.speech {
margin-block-end: 0 !important;
margin-inline-end: 0 !important;
text-shadow: 2px 2px 6px black;
font-size: 110%;
}
a.link-internal:hover {
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">What do you mean from what? Just from general bad things, of course. Do you want a flower or not?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AN1_9"><p class="answer">[[Ok... give some lilies->AN1_9]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Anne</p><div class="speechbox"><p class="speech">Thanks! Have a nice day!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="answer">[[Bye, you too!->Kelby-Chapter-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $cm1 += 1>>
<style>
body {
background: url(images/04-market.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Young woman</p><div class="speechbox"><p class="speech">These plants are getting worse! They used to be so beautiful when I was a child.</p></div><div class="nextbuttonbox" data-passage="EL1_2"><div class="nextbutton" data-passage="EL1_2"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $EL1 to 1>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
display: inline-block;
max-width: 87%;
}
a.link-internal:hover {
color: white !important;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Old man</p><div class="speechbox"><p class="speech">Hello, who are you?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="OM1_2"><p class="answer"><a data-passage="OM1_2">Hi, my name is <<print $userName>>! I’m just visiting the town. I’ve been told this fountain was very beautiful</a></p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $NM += 1 >>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Young woman</p><div class="speechbox"><p class="speech">I’m gonna analyze some samples.</p></div><div class="optionbox" data-passage="EL1_3"><p class="option">[[Approach her->EL1_3]]</p></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
.optionbox {
background-color: white;
color: black;
width: auto;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.optionspan {
width: 3%;
display: inline-block;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
}
.chaname {
text-align: left;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Young woman</p><div class="speechbox"><p class="speech">Hi…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="EL1_4"><p class="answer"><a data-passage="EL1_4">Hey, my name is <<print $userName>>. I heard you talking about the plants…</a></p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $elena to 1>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Young woman</p><div class="speechbox"><p class="speech">Oh… yeah… I was just… the flora here looked much more alive when I was a child…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="EL1_5"><p class="answer">[[What do you mean?->EL1_5]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Well, I don’t know, they look like they might be dying. I used to come here with my mother, you know? She died… maybe it’s just a memory’s trick… it happens. I’m Elena, by the way!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="EL1_6"><p class="answer">[[Nice to meet you, Elena!->EL1_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Yeah, you too… you’re new to town?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="EL1_8"><p class="answer">[[Yeah, just got here for a break->EL1_8]]</p></div><div class="answerbox" data-passage="EL1_7"><p class="answer">[[Yeah, I’m a journalist, actually. I’ve heard something is going on with nature around the town. Maybe that’s something to do with these plants?->EL1_7]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.answerspan {
height: 100%;
width: 0;
display: inline-block;
vertical-align: bottom;
}
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Oh, how nice. Kelby’s a great place to chill for a bit. I have to go now, see you around!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Fountain-1"><p class="answer">[[Yeah, see you->Fountain-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $felena1 += 1>>
<<set $prepared += 1>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Well, maybe… a journalist, you said? I don’t know… who told you something’s going on?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="EL1_9"><p class="answer">[[It was an anonymous tip, actually->EL1_9]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $elenajor to 1>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Oh, I see… well, maybe it’s nothing… I’m gonna run some tests on these samples. I’m a chemist, you know? Can’t go around saying things when I’m not sure…. anyway, I need to go. See you around!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Fountain-1"><p class="answer">[[Yeah, see you!->Fountain-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $felena1 += 1>>
<<set $prepared += 1>>
<style>
body {
background: url(images/03-fountain2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">old man</p><div class="speechbox"><p class="speech">Not just beautiful… it’s very important to our town as well.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="OM1_3"><p class="answer">[[Really? How come?->OM1_3]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">old man</p><div class="speechbox"><p class="speech">Well, do you have some time?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="OM1_4"><p class="answer">[[Yeah, sure!->OM1_4]]</p></div><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="answer">[[Actually, I’m in a hurry. I need to go back. Bye!->Kelby-Chapter-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $foldman1 += 1>>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Old man</p><div class="speechbox"><p class="speech">This fountain is as old as Kelby itself. Our town name actually means “by the fountain”... did you know that?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="OM1_5"><p class="answer">[[Yes, I’ve heard->OM1_5]]</p></div><div class="answerbox" data-passage="OM1_5"><p class="answer">[[No, not really->OM1_5]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Old man</p><div class="speechbox"><p class="speech">Well, my grandparents, my parents, myself… we’ve all always worshiped the fountain, as we should. It provides us with life and keeps our people healthy, wealthy and sane.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="OM1_6"><p class="answer">[[Really? How interesting->OM1_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Old man</p><div class="speechbox"><p class="speech">Yes, yes… for generations, we’ve been taking care of the fountain. People have always had a duty towards keeping the fountain safe and whole. But the new generations don’t care for it, and I’m afraid of what could happen if the fountain turns against us.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="OM1_7"><p class="answer">[[What do you mean by that?->OM1_7]]</p></div><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="Kelby-Chapter-1">[[Ok, I have to go. Bye->Kelby-Chapter-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Old man</p><div class="speechbox"><p class="speech">Oh, well, young child! Who knows? It protects us… crops dying, lack of food, a plague, who knows? What I know is that my old grandfather would always say that if we stopped respecting the fountain, we would have to deal with the consequences.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="OM1_8"><p class="answer">[[Well, that’s grim->OM1_8]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Old man</p><div class="speechbox"><p class="speech">Yes, yes, it is… may we be forgiven.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="answer">[[Yeah. I think I need to go now. Bye!->Kelby-Chapter-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/06-old-man.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><<if $NEWS == 0>><div class="map-container"><img class="map" src="images/14-newspaper-n.gif" usemap="#image-map"><map name="image-map"><area data-passage="Newspaper" coords="1175,999,1156,861,1156,819,1195,805,1173,788,1090,843,1074,814,1080,777,1066,766,1102,729,1183,715,1270,714,1337,727,1412,743,1465,719,1622,693,1760,668,1861,651,1872,751,1861,783,1834,841,1795,826,1794,849,1816,877,1836,897,1887,899,1916,1061,1919,1078,1548,1075,1534,1043,1475,1022,1341,1005" shape="poly"></map></div><</if>><div class="speechcontain"><<if $h1 == 0>><div class="pspeechbox"><div class="speechbox"><p class="speech">Alec, the hotel owner, is talking to someone at the bar</p></div><div class="optionbox" data-passage="AL1_1"><p class="option">[[Get closer and listen to the conversation->AL1_1]]</p></div><div class="optionspan"></div><div class="optionbox" data-passage="AL1_2"><p class="option">[[Get closer, get a drink and join them->AL1_2]]</p></div></div><</if>><<if ($h1 == 1) and ($GOOGLE == 1)>><div class="pspeechbox"><div class="speechbox"><p class="speech">There doesn't seem to be anything interesting happening around here for now</p></div></div><</if>></div>
<div class="bmenu"><<if $NEWS == 1>><div title="Go to your room" data-passage="Hotel-Room-1" class="menu-button"><img class="menu-icon" src="images/room.png"></div><br><</if>><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio lobby1 volume 0.3 fadeoverto 6 0>>
<style>
.menu {
margin-block-end: 0 !important;
margin-block-start: 0.1em !important;
}
body {
background: url(images/14-newspaper.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.optionbox {
background-color: white;
color: black;
width: auto;
max-width: 48%;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.optionspan {
width: 3%;
display: inline-block;
}
.option {
text-align: left;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
.speechbox {
background-color: rgba(250, 250, 250, 0);
color: white;
border: 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
text-align: left;
}
.speech {
margin-block-end: 0 !important;
margin-inline-end: 0 !important;
text-shadow: 2px 2px 6px black;
font-size: 110%;
}
a.link-internal:hover {
}
@media (min-width: 813px) and (max-width: 1024px) {
.map {
width: auto;
min-width: 100%;
max-width: 140%;
object-fit: cover;
text-align: center;
margin-left: -40%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
@media (aspect-ratio: 16/10) {
.map {
width: auto;
min-width: 100%;
max-width: 135%;
object-fit: cover;
text-align: center;
margin-left: -15%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
</style><div class="speechcontain"><<if $AL2E2 == 0>><div class="pspeechbox"><div class="speechbox"><p class="speech">Alec and Elena are sitting at a table having a discussion</p></div><div class="optionbox" data-passage="AL2E2_2"><p class="option">[[Get a table closeby and overhear the conversation->AL2E2_2]]</p></div></div><</if>><<if $AL2E2 == 1>><div class="pspeechbox"><div class="speechbox"><p class="speech">There is no one to talk to here</p></div><</if>></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<audio restaurant1 volume 0.3 fadeoverto 6 0>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/13-restaurant-02.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
.speechbox {
background-color: rgba(250, 250, 250, 0);
color: white;
border: 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
}
.speech {
margin-block-end: 0 !important;
margin-inline-end: 0 !important;
text-shadow: 2px 2px 6px black;
font-size: 110%;
}
.optionbox {
background-color: white;
color: black;
width: auto;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Yeah, by then I was still in Bali. It was great! From there I came back to Eadu, the big city closeby, you know? And when my father died, I decided to move back here and take the hotel so my mom could retire.</p></div><div class="nextbuttonbox" data-passage="AL1_3"><div class="nextbutton" data-passage="AL1_3"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio bar1 volume 0 fadeto 0.3>>
<<set $prepared += 1>>
<<set $AL1 to 1>>
<style>
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
a.link-internal:hover {
color: white !important;
}
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Hey, there! Are you a new guest?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AL1_4"><p class="answer"><a data-passage=AL1_4>Yeah, hi, I’m <<print $userName>>. Just got to town</a></p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio bar1 volume 0 fadeto 0.3>>
<<set $alec to 1>>
<<set $AL1 to 1>>
<<set $prepared += 1>>
<style>
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Anyway, really glad you like the new look! We have a small party next weekend, maybe you could come. I usually organize them for the locals and guests. They are always great, you must come! Oh wait, I have to take this call…</p></div><div class="optionbox" data-passage="AL1_7"><p class="option">[[Overhear the telephone conversation->AL1_7]]</p></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio bar1 volume 0.3 fadeout>>
<style>
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.optionbox {
background-color: white;
color: black;
width: auto;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.optionspan {
width: 3%;
display: inline-block;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
.chaname {
text-align: left;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Hey, Elena! Everything alright? Yes, yes, I know… well we can meet, no problem. Do you wanna come over or… ok, ok, I’ll just tell the guys at the hotel and meet you there.</p></div><div class="nextbuttonbox" data-passage="Hotel-1"><div class="nextbutton" data-passage="Hotel-1"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $h1 to 1>>
<style>
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
a.link-internal:hover {
color: white !important;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Nice! Welcome, <<print $userName>>! This here is Daria, I was just telling her about my last few adventures. Right before I came back here to start managing my mom’s hotel I was in Bali… amazing, I must say! Have you been there?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AL1_5"><p class="answer">[[Yes, really nice->AL1_5]]</p></div><div class="answerbox" data-passage="AL1_5"><p class="answer">[[No, not yet. Maybe I should start planning->AL1_5]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio bar1 volume 0.3 fadeout>>
<style>
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
bottom: 100px;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Yes, indeed! Sadly I had to go back to work in Eadu, the big city closeby… when my father died I decided to come back and manage my mom’s hotel so she could retire. Changed the looks a little, do you like it?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AL1_6"><p class="answer">[[Yes, it looks very nice! How long have you been here?->AL1_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Well, I grew up here, of course. Went away to study and travel the world, came back a few years ago. I’m really happy with Kelby, though, not very far from Eadu, great nature… there’s this amazing hill closeby, I used to go with my mom…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="AL1_8"><p class="answer">[[Yes, from what I’ve seen so far, the city is surrounded by great landscapes->AL1_8]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Well, definitely. Which direction is your bedroom window facing? The sunset between the hills is amazing this time of the year. And if you’re here next weekend you should definitely come to the party on Saturday! Oh, sorry… I have to take the call.</p></div><div class="optionbox" data-passage="AL1_7"><p class="option">[[Overhear the telephone conversation->AL1_7]]</p></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $h1 to 1>>
<style>
body {
background: url(images/02-hotel2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
}
.optionbox {
background-color: white;
color: black;
width: auto;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.optionspan {
width: 3%;
display: inline-block;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
.chaname {
text-align: left;
}
a.link-internal:hover {
}
</style><!--
-----related to chapter-----
set to 0 at the beginning of each chapter, has to be gte (greater or equivalent to) the number of mandatory passages in that chapter
$prepared
$AL2E2 - needs to be equals 3 to make the event AL2|E2 avaiable
---related to locations (the number in the end reffers to the chapter)---
gte (greater or equivalent to) 1 if you've been through all the talks there
$cm1 (City Market)
$felena1 (Elena in The Fountain)
$foldman1 (Old man in The Fountain)
$h1 (Hotel)
$s1 (Cab)
-----related to characters-----
gte (greater or equivalent to) 1 if you've met the character
$elena
$alec
$anne
$CHARACTERjor (if 1 character knows user is a journalist writing about vegetation)
--><div class="speechcontain"><<if $CE1 == 0>><div class="pspeechbox"><div class="speechbox"><p class="speech">A group of people is entering the Town Hall</p></div><div class="optionbox" data-passage="CE1_1"><p class="option">[[Approach gathering->CE1_1]]</p></div></div><</if>><<if $CE1 == 1>><div class="pspeechbox"><div class="speechbox"><p class="speech">There is nothing interesting happening around</p></div><</if>></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio market1 volume 0.3 fadeoverto 6 0>>
<style>
body {
background: url(images/10-townhall.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
.speechbox {
background-color: rgba(250, 250, 250, 0);
color: white;
border: 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
}
.speech {
margin-block-end: 0 !important;
margin-inline-end: 0 !important;
text-shadow: 2px 2px 6px black;
font-size: 110%;
}
.optionbox {
background-color: white;
color: black;
width: auto;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
</style><div class="map-container"><img class="map" src="images/12-library.gif" usemap="#image-map"><map name="image-map"><area data-passage="EL_1" coords="525,863,510,822,505,783,511,734,549,714,846,622,1319,885,1305,907,1275,948,1280,1002,1307,1000,1334,1033,1225,1075,825,1077" shape="poly"></map></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<audio library1 volume 0.3 fadeoverto 6 0>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
@media (min-width: 813px) and (max-width: 1024px) {
.map {
width: auto;
min-width: 100%;
max-width: 140%;
object-fit: cover;
text-align: center;
margin-left: -10%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
@media (aspect-ratio: 16/10) {
.map {
width: auto;
min-width: 100%;
max-width: 140%;
object-fit: cover;
text-align: center;
margin-left: -8%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
</style><div id="map-container"><img id="map" src="file:///C:/Users/Andr%C3%A9/Documents/Twine/Hist%C3%B3rias/Map%20Draft%202.jpg" usemap="#kelby1"><map id="map" name="kelby1"><area alt="Hotel" title="Hotel" data-passage="Hotel-1" coords="367,181,366,75,388,63,416,63,435,76,430,176,408,183,386,185" shape="poly"><area alt="Town Hall" title="Town Hall" data-passage="Townh-Hall-1" coords="1227,522,1225,466,1324,449,1395,487,1400,548,1337,563,1334,583,1307,597" shape="poly"><area alt="Coal Mine" title="Coal Mine" data-passage="Coal-Mine-1" coords="420,841,425,792,450,775,452,814,479,829,483,758,481,700,462,661,427,624,364,563,343,570,388,641,405,676,398,690,394,715,394,732,379,744,379,763,394,768,388,826" shape="poly"><area alt="Fountain" title="Fountain" data-passage="Fountain-1" coords="856,971,856,912,873,917,896,909,905,878,898,846,912,821,934,887,930,941,925,995,934,1017,910,1019,903,992,881,988" shape="poly"><area alt="Cassandra's House" title="Cassandra's House" data-passage="Cassandra-House-1" coords="1470,593,1468,571,1485,539,1539,568,1553,578,1554,607,1524,624,1502,610,1493,619,1475,607" shape="poly"><area alt="Elena's House" title="Elena's House" data-passage="Elena-House-1" coords="1239,678,1239,648,1253,632,1309,619,1324,648,1327,658,1339,663,1349,692,1327,715,1324,726,1310,727,1288,704,1278,714" shape="poly"><area alt="Pharmacy" title="Pharmacy" data-passage="Pharmacy-1" coords="1063,661,1063,644,1074,622,1130,595,1146,600,1161,615,1159,654,1100,695,1088,690,1088,671" shape="poly"><area alt="Farm" title="Farm" data-passage="Farm-1" coords="1614,973,1663,919,1663,871,1638,863,1519,816,1473,855,1490,866,1485,916,1599,973" shape="poly"><area alt="Library" title="Library" data-passage="Library-1" coords="1276,341,1268,415,1290,432,1373,419,1370,375,1358,356,1324,366,1324,353,1305,339" shape="poly"><area alt="Lab" title="Lab" data-passage="Lab-1" coords="1239,904,1287,839,1287,777,1239,739,1192,777,1192,799,1195,858" shape="poly"><area alt="City Market" title="City Market" data-passage="City-Market-1" coords="1633,522,1583,593,1622,622,1665,644,1722,660,1772,548,1697,536" shape="poly"><<if $felena1 == 1>><area alt="Restaurant" title="Restaurant" data-passage="Restaurant-1" coords="761,439,764,419,773,385,859,361,879,375,893,373,898,431,900,454,800,476" shape="poly"><</if>></map></div>
<style>
body {
background-color: #9ee6fa;
}
</style><div class="speechcontain"><<if $E3H1 == 0>><div class="pspeechbox"><div class="speechbox"><p class="speech">Elena is here</p></div><div class="optionbox" data-passage="E3H1_1a"><p class="option">[[Approach her->E3H1_1a]]</p></div></div><</if>><<if $E3H1 == 1>><div class="pspeechbox"><div class="speechbox"><p class="speech">There is no one for you to talk to here</p></div><</if>></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio pharmacy1 volume 0.3 fadeoverto 6 0>>
<style>
body {
background: url(images/09-pharmacy-1.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
background-color: rgba(250, 250, 250, 0);
color: white;
border: 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
}
.speech {
margin-block-end: 0 !important;
margin-inline-end: 0 !important;
text-shadow: 2px 2px 6px black;
font-size: 110%;
}
.optionbox {
background-color: white;
color: black;
width: auto;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
</style><<if $easteregg == 0>><div class="map-container"><img class="map" src="images/11-cassandra-n.gif" usemap="#image-map"><map name="image-map"><area data-passage="Easter-Egg-1" coords="4,690,4,721,21,756,40,775,57,749,72,768,89,810,118,805,120,829,152,827,147,868,186,851,243,844,276,848,310,878,584,882,589,777,606,775,537,687,411,688,189,495" shape="poly">
</map></div><</if>><div class="speechcontain"><div class="pspeechbox"><div class="speechbox"><p class="speech">It seems that Cassandra is not around</p></div><<if $CN1 == 0>><div class="optionbox" data-passage="CN_1"><p class="option">[[Talk to her neighbor->CN_1]]</p></div><</if>></div></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio "cass1" volume 0.3 fadeoverto 6 0>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.optionbox {
background-color: white;
color: black;
width: auto;
margin: 0;
margin-top: 0.5em;
display: inline-block;
padding: 15px;
padding-top: 0;
padding-bottom: 0;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
}
.optionbox:hover {
cursor: pointer;
background-color: rgb(154, 232, 255);
}
.optionspan {
width: 3%;
display: inline-block;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
.speechbox {
background-color: rgba(250, 250, 250, 0);
color: white;
border: 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
}
.speech {
margin-block-end: 0 !important;
margin-inline-end: 0 !important;
text-shadow: 2px 2px 6px black;
font-size: 110%;
}
a.link-internal:hover {
}
@media (min-width: 813px) and (max-width: 1024px) {
.map {
width: auto;
min-width: 100%;
max-width: 140%;
object-fit: cover;
text-align: center;
margin-left: -15%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
@media (aspect-ratio: 16/10) {
.map {
width: auto;
min-width: 100%;
max-width: 135%;
object-fit: cover;
text-align: center;
margin-left: -18%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Hey there! Where are you going to?</p></div></div></div>
<div class="answerscontain"><<if $s2 == 0>><div class="answerbox" data-passage="S2_1a"><p class="answer">[[To the Town Hall, please!->S2_1a]]</p></div><</if>><<if $s2 == 1>><div class="answerbox" data-passage="S3_1"><p class="answer">[[To the Fountain, please!->S3_1]]</p></div><</if>><<if ($s2 == 2) and ($EL1 == 1) and ($AL1 == 1) and ($NEWS == 1)>><div class="answerbox" data-passage="S4_1"><p class="answer">[[To the Restaurant, please!->S4_1]]</p></div><</if>><div class="answerspan"></div></div>
<div class="bmenu"><div title="Return to map" class="menu-button" data-passage="Kelby-Chapter-1"><img class="menu-icon" src="images/go-to-map.png"></div></div>
<<audio cab1 volume 0.3 fadeoverto 6 0>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">So tell me, <<print $userName>>, how are you enjoying Kelby?</p></div></div></div>
<div class="answerscontain"><<if $shanicejor == 0>><div class="answerbox" data-passage="S2_2a"><p class="answer">[[It’s a very beautiful town->S2_2a]]</p></div><</if>><<if $shanicejor == 1>><div class="answerbox" data-passage="S2_1b"><p class="answer">[[It’s a very beautiful town->S2_1b]]</p></div><</if>><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab2 volume 0 fadeto 0.3>>
<<set $s2 += 1>>
<<set $prepared +=1>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">How long are you staying? You must have realized by now there’s not much for a tourist to do here.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_3a"><p class="answer">[[Oh, it has enough for someone who just wants to relax->S2_3a]]</p></div><div class="answerbox" data-passage="S2_4a"><p class="answer">[[Actually, I’m from the Eadu Post. I’m writing a story about Kelby->S2_4a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, I don’t know about that. There are beautiful landscapes, yeah, but not much to do. Now with the profits from the coal mine, we might have some new attractions.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_5a"><p class="answer">[[Is the coal mine new?->S2_5a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Really? Why didn’t you tell me before?!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_6a"><p class="answer">[[Oh, I learned that that are some things that might not be a good idea to tell everybody you are writing about. I’m sure you understand it->S2_6a]]</p></div><div class="answerbox" data-passage="S2_7a"><p class="answer">[[I didn’t know if I could trust you before, you know->S2_7a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $shanicejor to 1>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style>
<div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Yes, yes! Ramón just got to town a little more than a year ago to build it. I work for him, you know? He trusts me to drive him and his son Lucas everywhere. A very important man indeed. Has a lot of businesses around the world.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_8a"><p class="answer">[[Seems like an interesting guy->S2_8a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style>
<div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Of course I understand. But you can one hundred percent trust me. I know everything there is to know about Kelby. What are you writing about then?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_9a"><p class="answer">[[There are rumors that something weird might be happening to nature around the town. Do you know anything about that?->S2_9a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style>
<div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, of course you can trust me! Not only I’m trustworthy but a very good connection indeed. I know everyone in this town. I constantly drive for the richest man in town, for example, he trusts me as his and his son’s driver.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_10a"><p class="answer">[[Really? And who might that be?->S2_10a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style>
<div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, very interesting indeed. Handsome as well. You can probably meet him. He stayed at Alec’s hotel when he first got to town and still goes there for the events. They seem to like each other, those two.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_11a"><p class="answer">[[Nice! I’ll probably meet him this weekend, then. Alec told me there’s some kind of party this Saturday…->S2_11a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, environmentalists, honestly. Everything is fine, people overreact. Usually just an excuse to protest against the coal mine, that is only bringing benefits to the town.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_12a"><p class="answer">[[People protest against the coal mine?->S2_12a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style>
<div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, his name is Ramón! A gentleman. He just got to town a little more than a year ago to build the coal mine. You can probably meet him. He stayed at Alec’s hotel when he first got to town and still goes there for the events. They seem to like each other, those two.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_11a"><p class="answer">[[Nice! I’ll probably meet him this weekend, then. Alec told me there’s some kind of party this Saturday…->S2_11a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, yes, the famous Alec’s parties. You shouldn’t miss it. I might go there myself. We are here, anyway, see you!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Town-Hall-1"><p class="answer">[[Thanks, see you!->Town-Hall-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab2 volume 0.3 fadeto 0>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">An insignificant number of people. A disrespect to Ramón, who just wants what is best for Kelby.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_13a"><p class="answer">[[Sorry, who’s Ramón?->S2_13a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, of course you don’t know him! I’m sorry. Ramón’s a gentleman. He just got to town a little more than a year ago to build the coal mine. I work for him, you know? He trusts me to drive him and his son Lucas everywhere. A very important man indeed. Has a lot of businesses around the world.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_8a"><p class="answer">[[Seems like an interesting guy->S2_8a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Ok! So tell me, <<print $userName>>, how are you?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S3_2"><p class="answer">[[I’m fine. What about you?->S3_2]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab2 volume 0 fadeto 0.3>>
<<set $s2 += 1>>
<<set $NM += 1>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">I think you are my last one today! I have to go home to prepare dinner for my children and I’m late already.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S4_2"><p class="answer">[[Oh, how many do you have?->S4_2]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab2 volume 0 fadeto 0.3>>
<<set $s2 += 1>>
<<set $NM += 1>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Chapter-1"><p class="answer">[[It seems like something. Let's go check it out!->Chapter-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio computer1 volume 0.4 fadeoverto 6 0>>
<style>
body {
background: url(images/00-email-2.jpg);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
}
</style><div class="map-container"><img class="map" src="images/Map.gif" usemap="#kelby1"><map id="map" name="kelby1"><<if $s2 lt 3>><area alt="Cab" title="Shanice's Cab" data-passage="Cab-1" coords="817,553,829,575,856,571,876,549,859,534,834,519" shape="poly"><</if>><area alt="Hotel" title="Hotel" data-passage="Hotel-1" coords="367,181,366,75,388,63,416,63,435,76,430,176,408,183,386,185" shape="poly"><<if $s2 == 1>><area alt="Town Hall" title="Town Hall" data-passage="Town-Hall-1" coords="1227,522,1225,466,1324,449,1395,487,1400,548,1337,563,1334,583,1307,597" shape="poly"><</if>><area alt="Fountain" title="Fountain" data-passage="Fountain-1" coords="856,971,856,912,873,917,896,909,905,878,898,846,912,821,934,887,930,941,925,995,934,1017,910,1019,903,992,881,988" shape="poly"><<if ($GOOGLE == 1)>><area alt="Cassandra's House" title="Cassandra's House" data-passage="Cassandra-House-1" coords="1470,593,1468,571,1485,539,1539,568,1553,578,1554,607,1524,624,1502,610,1493,619,1475,607" shape="poly"><</if>><<if $EL1 == 1>><area alt="Pharmacy" title="Pharmacy" data-passage="Pharmacy-1" coords="1063,661,1063,644,1074,622,1130,595,1146,600,1161,615,1159,654,1100,695,1088,690,1088,671" shape="poly"><</if>><area alt="Library" title="Library" data-passage="Library-1" coords="1276,341,1268,415,1290,432,1373,419,1370,375,1358,356,1324,366,1324,353,1305,339" shape="poly"><area alt="City Market" title="City Market" data-passage="City-Market-1" coords="1633,522,1583,593,1622,622,1665,644,1722,660,1772,548,1697,536" shape="poly"><<if ($EL1 == 1) and ($AL1 == 1) and ($s2 gte 1) and ($NEWS == 1)>><area alt="Restaurant" title="Restaurant" data-passage="Restaurant-1" coords="761,439,764,419,773,385,859,361,879,375,893,373,898,431,900,454,800,476" shape="poly"><</if>></map></div>
<div class="titlemap"><img class="logo" src="images/LOGO.png"><<if $prepared lt 7>><div class="infobox"><p class="info">Explore the locations to unlock the next chapter</p></div><</if>><<if $prepared gte 7>><div class="nextchapterbox" data-passage="Chapter-2"><p class="nextchapter">[[Next chapter->Chapter-2]]</p></div><</if>></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio theme-song volume 0.04 fadeoverto 20 0>>
<style>
area:hover {
cursor: pointer;
}
.titlemap {
float: left;
position: absolute;
right: 1em;
top: 1em;
text-align: center;
width: 20%;
}
.logo {
max-width: 100%;
object-fit: contain;
text-align: center;
}
.infobox {
width: auto;
max-width: 70%;
font-size: 90%;
transform: skew(-8deg);
background-color: rgb(255, 192, 0);
color: black;
margin-block-start: 0 !important;
margin-block-end: 0 !important;
padding: 0;
padding-left: 7px;
padding-right: 7px;
text-align: center;
border: 1px solid black;
/*box-shadow: 3px 3px 8px black;*/
display: inline-block;
}
@media (max-width: 812.98px) {
.infobox {
max-width: 80%;
font-size: 75%;
}
}
.info {
text-align: center;
}
.nextchapterbox {
width: auto;
max-width: 80%;
font-size: 90%;
transform: skew(-8deg);
background-color: rgb(154, 232, 255);
color: black;
margin-block-start: 0 !important;
margin-block-end: 0 !important;
padding: 0;
padding-left: 10px;
padding-right: 10px;
text-align: center;
border: 1px solid black;
/*box-shadow: 3px 3px 8px black;*/
display: inline-block;
}
.nextchapterbox:hover {
cursor: pointer;
background-color: white;
}
@media (min-width: 813px) and (max-width: 1024px) {
.map {
width: 125%;
max-width: 125%;
min-width: 100%;
height: 100%;
object-fit: fill;
text-align: center;
margin-left: 0;
margin-left: -17%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
@media (aspect-ratio: 16/10) {
.map {
width: auto;
min-width: 100%;
max-width: 120%;
object-fit: cover;
text-align: center;
margin-left: -15%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">We’ve been dating for more than a year now, Alec! I think that should be enough for you to trust what I’m telling you now.</p></div><div class="nextbuttonbox" data-passage="AL2E2_3"><div class="nextbutton" data-passage="AL2E2_3"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/13-restaurant.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Well, Elena, just relax. We’ve been having a nice time. You can’t get mad just because I think you are overreacting about this plant thing…</p></div><div class="nextbuttonbox" data-passage="AL2E2_4"><div class="nextbutton" data-passage="AL2E2_4"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/13-restaurant.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">I am a scientist, Alec! I wouldn’t be going around saying things if I had no evidence whatsoever!</p></div><div class="nextbuttonbox" data-passage="AL2E2_5"><div class="nextbutton" data-passage="AL2E2_5"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/13-restaurant.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Babe, can we talk about this another day? We have the party coming up this Saturday, I don’t wanna stress over something right now… we could talk about our vacation to Colombia, maybe?</p></div><div class="nextbuttonbox" data-passage="AL2E2_6"><div class="nextbutton" data-passage="AL2E2_6"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/13-restaurant.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Really, Alec? Well, you can call me when you are ready to compromise, to care for something other than expensive trips and parties. I am not hungry anymore. Excuse me.</p></div><div class="nextbuttonbox" data-passage="AL2E2_7"><div class="nextbutton" data-passage="AL2E2_7"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/13-restaurant.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Alec</p><div class="speechbox"><p class="speech">Please, Elena! Can't you just give me a break this time...</p></div><div class="nextbuttonbox" data-passage="Restaurant-1"><div class="nextbutton" data-passage="Restaurant-1"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $AL2E2 to 1>>
<<set $prepared += 1>>
<style>
.pspeechbox {
left: 5em;
right: auto;
}
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/13-restaurant.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Celina</p><div class="speechbox"><p class="speech">Today, on the first anniversary of the coal mine we built just outside town, I’m glad to tell you that the town’s income has already grown!</p></div><div class="nextbuttonbox" data-passage="CE1_3"><div class="nextbutton" data-passage="CE1_3"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $CE1 to 1>>
<style>
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/08-speech.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Celina</p><div class="speechbox"><p class="speech">The coal mine gave jobs to dozens of the good townspeople of Kelby. People that are now able to provide for their families in a way they weren’t before.</p></div><div class="nextbuttonbox" data-passage="CE1_4"><div class="nextbutton" data-passage="CE1_4"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/08-speech.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Celina</p><div class="speechbox"><p class="speech">We have also attracted a few new businesses, including important shops to our main street. And I’ve had the pleasure of hearing from some of you how excited you were about the changes we’ve been having.</p></div><div class="nextbuttonbox" data-passage="CE1_5"><div class="nextbutton" data-passage="CE1_5"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/08-speech.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Celina</p><div class="speechbox"><p class="speech">I promise that, as long as I am mayor, Kelby will just keep growing more and more! Thank you for your attention.</p></div><div class="nextbuttonbox" data-passage="Town-Hall-1"><div class="nextbutton" data-passage="Town-Hall-1"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $prepared += 1>>
<style>
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/08-speech.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Oh, hey there! <<print $userName>>, is it?</p></div></div></div>
<div class="answerscontain"><<if $elenajor == 0>><div class="answerbox" data-passage="E3H1_2a"><p class="answer">[[Yes! Elena, right? Hi!->E3H1_2a]]</p></div><</if>><<if $elenajor == 1>><div class="answerbox" data-passage="E3H1_2b"><p class="answer">[[Yes! Elena, right? Hi!->E3H1_2b]]</p></div><</if>><div class="answerspan"></div></div>
<<set $E3H1 to 1>>
<<set $prepared += 1>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Hi… oh, this is Henry, our most famous farmer. <<print $userName>> is visiting Kelby.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_3a"><p class="answer">[[Nice to meet you, Henry!->E3H1_3a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $E3H1 to 1>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">Hi. Chilling in Kelby?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_4a"><p class="answer">[[Well, actually, I am a journalist from The Eadu Post. I’m writing a story->E3H1_4a]]</p></div><<if $anne == 1>><div class="answerbox" data-passage="E3H1_5a"><p class="answer">[[Yes, yes, a very relaxing town. Are you by any chance Anne’s husband?->E3H1_5a]]</p></div><</if>><<if $anne == 0>><div class="answerbox" data-passage="E3H1_6a"><p class="answer">[[Yes, yes, a very relaxing town->E3H1_6a]]</p></div><</if>><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Oh, really? Why didn’t you tell me so? What are you writing about?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_7a"><p class="answer">[[I got a tip-off about the vegetation, some kind of disease, maybe->E3H1_7a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">Yes, I am. Why?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_8a"><p class="answer">[[Just met her at the market. She sells beautiful flowers->E3H1_8a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">Indeed. You will excuse me now, gotta meet the wife at the Fountain before heading back home. Later, Miss Elena, <<print $userName>>.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_9a"><p class="answer">[[Bye! It was nice meeting you->E3H1_9a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Really? Who sent you that?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_10a"><p class="answer">[[It was anonymous. Actually, when I saw you earlier at the fountain you told me the plants there didn’t look the same…->E3H1_10a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">Glad you like’em. Speakin’ of the wife. Gotta meet her at the Fountain before it’s late. She ain’t gonna like walking from there home when it’s dark. Excuse me, Miss Elena, <<print $userName>>.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_9a"><p class="answer">[[Bye! It was nice meeting you->E3H1_9a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">I have known Henry my entire life, he always calls me ‘miss’...</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_11a"><p class="answer">[[He seems nice… but what is his wife doing in the middle of the woods so late?->E3H1_11a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Oh, I have some theories, yes… but that’s interesting, who could have sent you that? Have you talked to Cassandra Earle since you got here?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_12a"><p class="answer">[[No… do you think she might have sent it?->E3H1_12a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Anne is a very spiritual woman. She’s been going to the Fountain to pray every day since I can remember.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_13a"><p class="answer">[[People pray to the Fountain?->E3H1_13a]]</p></div><div class="answerbox" data-passage="E3H1_14a"><p class="answer">[[Oh, I see->E3H1_14a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">No, I mean, I was just thinking out loud. You should check with her, though…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_15a"><p class="answer">[[Yes, I will. Could we talk about your theories as well?->E3H1_15a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Oh, yes. Some Kelbians, especially the older ones, believe it has its powers. You might have to excuse me now, I am late for a meeting.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Pharmacy-1"><p class="answer">[[Sure! Bye, see you->Pharmacy-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Yeah… well, I have to go now. See you around, bye!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Pharmacy-1"><p class="answer">[[Bye! See you->Pharmacy-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Maybe another day, I have to meet someone now, but do check with Cassandra. Gotta go, bye! Bye, Henry.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_17a"><p class="answer">[[Sure, bye!->E3H1_17a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">I’m also going myself. Excuse me.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Pharmacy-1"><p class="answer">[[Oh, ok, bye->Pharmacy-1]]</p></div><div class="answerbox" data-passage="E3H1_18a"><p class="answer">[[Wait! What do you think about this plant disease? I mean, as a farmer?->E3H1_18a]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-h.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Can’t talk now, sorry. Bye.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Pharmacy-1"><p class="answer">[[Oh, ok, bye->Pharmacy-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-h.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Hi… oh, this is Henry, our most famous farmer. <<print $userName>> is a journalist, he’s writing a story about Kelby.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_3b"><p class="answer">[[Nice to meet you, Henry!->E3H1_3b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $E3H1 to 1>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">Yeah. Journalist, you say? What can you be writing about Kelby?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_4b"><p class="answer">[[I received a tip-off about some kind of disease the plants might be suffering from. Do you know anything about it, actually?->E3H1_4b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">Don’t know. Gotta go. The wife is waiting for me at the Fountain. Bye, Miss Elena, bye, <<print $userName>>.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_5b"><p class="answer">[[Oh, ok, bye->E3H1_5b]]</p></div><<if $anne == 1>><div class="answerbox" data-passage="E3H1_6b"><p class="answer">[[Wait! Are you Anne’s husband, by any chance?->E3H1_6b]]</p></div><</if>><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Now that you mentioned this tip-off again… have you talked to Cassandra Earle?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_7b"><p class="answer">[[No… do you think she might be the one who sent it to me?->E3H1_7b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">She’s my wife, yes. Why?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_7b"><p class="answer">[[She sells beautiful flowers. Would you tell her the ones I bought look great in my bedroom?->E3H1_8b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">No, I mean, I was just thinking out loud. You should check with her, though…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_9b"><p class="answer">[[Yes, I will. But you seem to have your theories as well...->E3H1_9b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Henry</p><div class="speechbox"><p class="speech">Yes, can do. Excuse me now.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_10b"><p class="answer">[[Thanks! Bye->E3H1_10b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-2.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.pspeechbox {
left: 5em;
right: auto;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Well, I do have a few. Maybe we can talk about them another day. I am late for a meeting now, gotta go. Remember to talk to Cassandra. Bye!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Pharmacy-1"><p class="answer">[[Ok, thanks! Bye->Pharmacy-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Elena</p><div class="speechbox"><p class="speech">Well, he was a little odd now… anyway, now that you mentioned this tip-off again… have you talked to Cassandra Earle?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="E3H1_7b"><p class="answer">[[No… do you think she might be the one who sent it to me?->E3H1_7b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/09-pharmacy-e.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
</style><div class="map-container"><img class="map" src="images/16-book-over.png" usemap="#image-map"><map title="UNDP" name="image-map"><area href="https://www.un.org/sustainabledevelopment/wp-content/uploads/2018/09/14.pdf" target="_blank" coords="961,198,1035,715,1648,631,1570,120" shape="poly">
</map></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<div class="bmenu"><div title="Return" class="menu-button" data-passage="Library-1"><img class="menu-icon" src="images/room.png"></div></div>
<<set $NM += 1>>
<style>
.map-container {
object-fit: contain;
height: 100%;
position: center center;
}
body {
background: url(images/16-book-background.jpg);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center center;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Hey there! Looking for someone?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_2"><p class="answer">[[Yes, actually. Do you know where I can find Cassandra Earle?->CN_2]]</p></div><div class="answerspan"></div></div>
<<set $CN1 to 1>>
<<set $NM += 1>>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Well, that’s the right house. But I haven’t seen her today. She’s been very busy lately…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_3"><p class="answer">[[Oh, has she?->CN_3]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Yeah, you, know, newspaper interviews, her research, meetings with the daughter of the pharmacist, writing a book, even…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_4"><p class="answer">[[She’s writing a book?->CN_4]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Well, yes… who are you?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_5"><p class="answer">[[I’m a reporter. I work at The Eadu Post. Really wanted to talk to Cassandra->CN_5]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Eadu Post? Wow, from The Kelby Gazette to The Eadu Post in a day! She’s getting famous, the little Cassandra.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_6"><p class="answer">[[You’ve known her for a long time?->CN_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Well, but sure! I saw her being born. She’s very sweet. Very smart as well. I find it amazing how she decided to come back after getting her Ph.D. to continue her grandfather’s work about the Fountain.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_7"><p class="answer">[[And the book is about the Fountain?->CN_7]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Yes, I think so. If you look through her window you can see all those papers and manuscripts.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_8"><p class="answer">[[And this daughter of the pharmacist you were talking about…->CN_8]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Oh yes, yes… Gustavo’s daughter… what’s her name again? Elena! Yes. I’ve been seeing her around a lot. Since she’s one of the other town’s geniuses, I could just imagine they were working together on something…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="CN_9"><p class="answer"><a data-passage=CN_9>Yes, probably. If you see Cassandra, would you tell her I came looking for her? My name is <<print $userName>></a></p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Cassandra's neighbor</p><div class="speechbox"><p class="speech">Of course! Don’t worry, I’ll tell her. Bye!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Cassandra-House-1"><p class="answer">[[Thank you, bye!->Cassandra-House-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/11-cassandra.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><div class="bmenu"><div title="Return" class="menu-button" data-passage="Cassandra-House-1"><img class="menu-icon" src="images/room.png"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $easteregg to 1>>
<<set $NM += 1>>
<style>
body {
background: url(images/16-letter.jpg);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: 100% 100%;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
</style><<if $GOOGLE == 0>><div class="map-container"><img class="map" src="images/05-hotel-room-n.gif" usemap="#image-map"><map name="image-map"><area data-passage="Google-1" coords="978,537,1019,719,1290,668,1251,524" shape="poly"></map></div><</if>><<if $GOOGLE == 1>><div class="speechcontain"><div class="pspeechbox"><div class="speechbox"><p class="speech">There is nothing to check around here</p></div></div></div><</if>>
<div class="bmenu"><div title="Return to lobby" class="menu-button" data-passage="Hotel-1"><img class="menu-icon" src="images/room.png"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio room1 volume 0.4 fadeoverto 6 0>>
<style>
.speech {
text-shadow: 2px 2px 6px black;
font-size: 110%;
}
body {
background: url(images/05-hotel-room.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
overflow: hidden;
}
.pspeechbox {
left: 5em;
right: auto;
width: auto;
text-align: right;
}
.speechbox {
background-color: rgba(250, 250, 250, 0);
color: white;
border: 0;
box-shadow: 0 0 0;
padding: 0;
margin: 0;
}
@media (min-width: 813px) and (max-width: 1024px) {
.map {
width: auto;
min-width: 100%;
max-width: 140%;
object-fit: cover;
text-align: center;
margin-left: -30%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
@media (aspect-ratio: 16/10) {
.map {
width: auto;
min-width: 100%;
max-width: 135%;
object-fit: cover;
text-align: center;
margin-left: -15%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
</style><div class="speechcontain"><div class="pspeechbox"></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Kelby-Chapter-1"><p class="answer">[[Well, I guess I can try to pay her a visit…->Kelby-Chapter-1]]</p></div><div class="answerspan"></div></div>
<<set $GOOGLE to 1>>
<<set $NM +=1 >>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/15-google.jpg);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: left center;
background-attachment: fixed;
overflow: hidden;
overflow-y: scroll;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, yes, that it is. But professionally speaking, have you found anything on your story already?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_2b"><p class="answer">[[Oh no, not really. I just had time to talk to a few people, you know?->S2_2b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">I told you before! There’s no story here! Not the one you are looking for anyway. The townspeople are overreacting as always. I was just telling that to Ramón…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_3b"><p class="answer">[[Who’s Ramón?->S2_3b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, the most powerful man in town, honestly. I work for him, you know? He trusts me to drive him and his son Lucas everywhere. He is very handsome as well… well, you can certainly see that he’s not from here.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_4b"><p class="answer">[[Really? What is he doing here?->S2_4b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Well, he moved here a little more than a year ago. From Eadu, I think. He built this coal mine that is just bringing benefits to the town. And to think that there are people protesting against it.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_5b"><p class="answer">[[Yeah, I can’t imagine why->S2_5b]]</p></div><div class="answerbox" data-passage="S2_5b"><p class="answer">[[Protesting, really? Who?->S2_5b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, those overreactive environmentalists, honestly! I have no patience for them. Ramoón is such a great man, a gentleman. Just wants what is best for us all. There’s something you should write about! The benefits coal mining is bringing to Kelby.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_6b"><p class="answer">[[Well, I would love to meet this Ramón->S2_6b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">You will! He’s actually friends with Alec. He always goes to the hotel’s events.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S2_7b"><p class="answer">[[I heard there’s one this Saturday, actually->S2_7b]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Yes, there is! I might go there myself. Anyway, we are here! See you!</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Town-Hall-1"><p class="answer">[[Yeah, bye, see you!->Town-Hall-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab2 volume 0.3 fadeto 0>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Four! The oldest is 13, the youngest 6. The oldest actually hasn’t forgiven me for coming to Kelby a few years ago. She really liked our town.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S4_3"><p class="answer">[[When did you move here?->S4_3]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Almost five years ago, I think. I had a huge fight with their father. He wasn’t good for them. I had to get them out of there. </p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S4_4"><p class="answer">[[Oh, I’m so sorry->S4_4]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Well, nevermind. Apart from the oldest, the others love Kelby. It’s a very nice place to raise children, lots of places to play, certainly better than Eadu…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S4_5"><p class="answer">[[Well, of that I’m sure->S4_5]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Yes, yes… we are here! Good night to you.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Restaurant-1"><p class="answer">[[And to you->Restaurant-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab2 volume 0.3 fadeto 0>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Oh, you know… tired, been driving all day. Actually just drove this girl, Cassandra, she was in the town newspaper today. One of those scientists, you know?</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S3_3"><p class="answer">[[Hm… not exactly->S3_3]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Well, those <i>know-it-alls</i> arrogant folk. She truly believes that Kelby is in some kind of danger, but I’m gonna tell you… I haven’t been around much, just got here a few years ago...</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S3_4"><p class="answer">[[Mhmm->S3_4]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">But I know a lot! And what I’ve heard is that Cassandra’s grandfather was the town’s crazy person back in the day. Kept saying apocalyptic things, even wrote a book about it, it seems. Or started one anyway… nothing he said ever happened.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S3_5"><p class="answer">[[I see->S3_5]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">I just think these crazy ideas might have affected poor Cassandra Earle as well. Genetics, right? Who knows how it works? Who knows…</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="S3_6"><p class="answer">[[I think scientists do->S3_6]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Shanice</p><div class="speechbox"><p class="speech">Yeah, they certainly think so! Anyway, we’ve arrived! See you.</p></div></div></div>
<div class="answerscontain"><div class="answerbox" data-passage="Fountain-1"><p class="answer">[[See you, bye->Fountain-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cab2 volume 0.3 fadeto 0>>
<<set $set +=1>>
<style>
body {
background: url(images/01-taxi.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><div class="speechcontain"></div>
<div class="answerscontain"><div class="answerbox" data-passage="Hotel-1"><p class="answer">[[Interesting… I should go to my room to investigate this further->Hotel-1]]</p></div><div class="answerspan"></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<set $NEWS += 1>>
<<set $prepared += 1>>
<style>
body {
background: url(images/14-newspaper-2.jpg);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: right bottom;
background-attachment: fixed;
}
</style><img class="chapter-2" src="images/chapter-2-over.png">
<<if $NM lt 8>><div class="go-back"><p class="alert-text">You can still explore some events in Chapter 1. Would you like to go back?</p><div class="backbutton" data-passage="Kelby-Chapter-1"><p class="starttext">[[Return->Kelby-Chapter-1]]</p></div></div><</if>>
<div class="go-ahead"><div class="backbutton" data-passage="sneak-peak"><p class="starttext">[[Start->sneak-peak]]</p></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
.chapter-2 {
float: left;
position: absolute;
width: 100vw;
height: auto;
object-fit: contain;
}
.start-button-contain {
display: inline-block;
width: 100%
}
.alert-text {
color: white;
text-shadow: 2px 2px black;
}
body {
background: url(images/chapter-2-background.jpg);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
text-align: center;
}
.backbutton {
text-align: center;
margin-bottom: 5vh;
width: auto;
background-color: rgb(255, 192, 0);
color: black;
margin-block-start: 0 !important;
margin-block-end: 0 !important;
padding: 0;
padding-left: 15px;
padding-right: 15px;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
height: auto;
display: inline-block;
transform: skewX(-8deg);
min-width: 10%;
}
.startbutton {
text-align: center;
width: auto;
background-color: rgb(255, 192, 0);
color: black;
margin-block-start: 0 !important;
margin-block-end: 0 !important;
padding: 0;
padding-left: 15px;
padding-right: 15px;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
height: auto;
display: inline-block;
}
.go-ahead {
text-align: center;
position: absolute;
bottom: 0;
width: 100%;
height: auto;
padding-bottom: 17vh;
margin-left: -10px;
}
.go-back {
text-align: center;
position: absolute;
top: 0;
width: 100%;
height: auto;
padding-top: 1em;
}
.backbutton:hover {
background-color: white;
cursor: pointer;
}
@media (max-width: 813.98px) {
.go-ahead {
padding-bottom: 3em;
}
}
</style><div class="cover-container">
<img class="characters" src="images/characters-cover.png">
</div>
<div class="start-element"><img class="title" src="images/LOGO.png"><br><div class="yellow-line"></div><span class="start-button" data-passage="Email">Start</span><div class="yellow-line"></div></div>
<div class="atentionbox"><p class="atention-text">Please switch to landscape mode to continue</p></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio theme-song volume 0.3 loop play>>
<style>
.start-button {
color: white;
font-size: 140%;
font-weight: 600;
text-shadow: 2px 2px black;
}
.start-button:hover {
color: rgb(154, 232, 255);
cursor: pointer;
}
.start-element {
top: 5vh;
float: left;
position: absolute;
width: 100%;
text-align: center;
}
.yellow-line {
width: 200px;
border: 2px solid rgb(255, 192, 0);
border-radius: 20%;
opacity: 90%;
display: inline-block;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 5px;
vertical-align: center;
}
.title {
width: 400px;
object-fit: contain;
margin-bottom: 1em;
}
body {
overflow: hidden;
background: url(images/background-cover.jpg);
background-repeat: no reapet;
background-position: center bottom;
}
.cover-container {
height: 100vh;
position: relative;
object-fit: contain;
}
.characters {
float: left;
position: absolute;
bottom: 0;
width: 100%;
object-fit: contain;
margin-bottom: -3%;
}
.atentionbox {
color: transparent;
text-shadow: 0;
}
@media (orientation: portrait) {
.cover-container {
-moz-box-shadow: inset 0 0 20px #000000;
-webkit-box-shadow: inset 0 0 20px #000000;
box-shadow: inset 0 0 20px #000000;
}
.yellow-line {
width: 0;
border: 0;
}
.start-button {
color: transparent;
text-shadow: 0 0;
}
.start-button:hover {
cursor: default;
color: transparent;
text-shadow: 0 0;
}
.atentionbox {
float: left;
position: absolute;
bottom: 40vh;
text-align: center;
width: 100%;
padding-left: 10%;
padding-right: 10%;
color: rgb(255, 192, 0);
transform: skew(-8deg);
font-size: 200%;
}
.atentiontext {
width: 40%;
text-align: center;
}
.characters {
margin-bottom: 0;
}
.title {
width: 80%;
}
}
</style><div class="map-container"><img class="map" src="images/00-email.gif" usemap="#image-map"><map name="image-map"><area data-passage="Tip-off" coords="1149,264,1147,448,1390,454,1392,317,1420,295,1427,251,1385,231,1354,258,1339,261" shape="poly"></map></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio theme-song volume 0.3 fadeoverto 15 0.01>>
<style>
body {
overflow: hidden;
}
@media (min-width: 813px) and (max-width: 1024px) {
.map {
width: auto;
min-width: 100%;
max-width: 150%;
object-fit: cover;
text-align: center;
margin-left: -50%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
@media (aspect-ratio: 16/10) {
.map {
width: auto;
min-width: 100%;
max-width: 120%;
object-fit: cover;
text-align: center;
margin-left: -15%;
}
.map-container {
height: 100vh;
text-align: center;
}
}
</style><div class="startbutton" data-passage="S1_1"><p class="starttext">[[Start->S1_1]]</p></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<style>
body {
background: url(images/CHAPTER-1.jpg);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center bottom;
background-attachment: fixed;
}
.startbutton {
text-align: center;
position: absolute;
bottom: 17vh;
right: 46%;
left: 44%;
width: auto;
background-color: rgb(255, 192, 0);
color: black;
margin-block-start: 0 !important;
margin-block-end: 0 !important;
padding: 0;
padding-left: 15px;
padding-right: 15px;
border: 1px solid black;
box-shadow: 3px 3px 8px black;
height: auto;
display: inline-block;
transform: skewX(-8deg);
}
.startbutton:hover {
background-color: white;
cursor: pointer;
}
</style><div class="speechcontain"><div class="pspeechbox"><p class="chaname">Celina</p><div class="speechbox"><p class="speech">Hello, citizens of Kelby! When you elected me your mayor, I promised to help Kelby grow and prosper.</p></div><div class="nextbuttonbox" data-passage="CE1_2"><div class="nextbutton" data-passage="CE1_2"></div></div></div>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio cel1 volume 0.3 fadeoverto 6 0>>
<style>
.speechbox {
display: inline-block;
max-width: 87%;
}
body {
background: url(images/08-speech.gif);
background-color: rgb(40,40,40);
background-repeat: no-repeat;
background-size: cover;
background-position: center top;
background-attachment: fixed;
}
</style><<cacheaudio "cab1" "sounds/Cab1.wav">>
<<cacheaudio "bar1" "sounds/Bar1.mp3">>
<<cacheaudio "fountain1" "sounds/Fountain1.wav">>
<<cacheaudio "library1" "sounds/library1.mp3">>
<<cacheaudio "lobby1" "sounds/lobby1.mp3">>
<<cacheaudio "market1" "sounds/market1.m4a">>
<<cacheaudio "pharmacy1" "sounds/pharmacy1.m4a">>
<<cacheaudio "restaurant1" "sounds/restaurant1.mp3">>
<<cacheaudio "theme-song" "sounds/Darkest_Child.mp3">>
<<cacheaudio "computer1" "sounds/computer1.wav">>
<<cacheaudio "room1" "sounds/Room1.wav">>
<<cacheaudio "cab2" "sounds/cab2.wav">>
<<cacheaudio "cass1" "sounds/cass1.wav">>
<<cacheaudio "cel1" "sounds/celina1.wav">>
<meta name="viewport" content="width=device-width, minimal-ui"><video controls autoplay class="center">
<source src="images/sneak-peek.mp4" type="video/mp4">
Your browser does not support this video.
</video>
<<link 'Fullscreen'>><<fullscreen>><</link>>
<<audio theme-song volume 0.01 fadeto 0>>
<div class="bmenu"><div title="Return to home page" class="hp-button" data-passage="Kelby-Chapter-1"><a class="start-button" href="https://ndrcldrll.github.io/kelby/about/">Home Page</a></div></div>
<style>
.start-button {
color: white;
font-size: 115%;
font-weight: 600;
text-shadow: 2px 2px black;
text-align: center;
}
a.start-button.link-external::after {
display: none;
}
.start-button:hover {
color: rgb(154, 232, 255);
cursor: pointer;
}
.center {
margin-left: auto;
margin-right: auto;
display: block;
padding-top: 3em;
width: auto;
height: auto;
max-width: 70%;
max-height: 70%;
}
body {
background: url(images/landing-page-background.jpg);
position: center center;
repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
overflow: hidden;
text-align: center;
}
</style>