Tom Sawyer in English and German

by clayshannon

HTML

<h1 class="smallcaps">The Adventures of Tom Sawyer / Die Abenteuer Tom Sawyers</h1>


<h2>by / von Mark Twain (1876)</h2>

<p><em><span class="consolas">In </span><span class="english">English</span><span class="consolas"> and </span><span class="germannomargin"><strong>German</strong></span></em><em><span class="consolas"> / Auf </span><span class="english">Englisch</span><span class="consolas"> und </span><span class="germannomargin"><strong>Deutsch</strong></span></em></p>

<p class="smallfont">Translated by/Übersetzt von H. Hellwag (1921) and/und B. Clay Shannon (2015)</p>

<hr/>
<section>
    
<h3>PREFACE</h3>

    
<h3 class="german">Vorwort des Autors.</h3>

    <p>Most of the adventures recorded in this book really occurred; one or two were experiences of my own, the rest those of boys who were schoolmates of mine. Huck Finn is drawn from life; Tom Sawyer also, but not from an individual--he is a combination of the characteristics of three boys whom I knew, and therefore belongs to the composite order of architecture.</p>
    <p class="german"><strong>Die meisten der hier erzählten Abenteuer haben sich tatsächlich zugetragen.
Das eine oder das andere habe ich selbst erlebt, die anderen meine
Schulkameraden. Huck Finn ist nach dem Leben gezeichnet, nicht weniger Tom
Sawyer, doch entspricht dieser nicht einer bestimmten Persönlichkeit,
sondern wurde mit charakteristischen Zügen mehrerer meiner Altersgenossen
ausgestattet und darf daher jenem gegenüber als einigermaßen kompliziertes
psychologisches Problem gelten.</strong>

    </p>
    <p>The odd superstitions touched upon were all prevalent among children and slaves in the West at the period of this story--that is to say, thirty or forty years ago.</p>
    <p class="german"><strong>Ich muß hier bemerken, daß zur Zeit meiner Erzählung -- vor dreißig bis
vierzig Jahren -- unter den Unmündigen und Unwissenden des Westens noch die
seltsamsten, unwahrscheinlichsten Vorurteile und Aberglauben...

CSS

body {
    font-family:"Segoe UI", "Bookman Old Style", "Candara", "Calibri", "Consolas", serif;
    font-size: 1.2em;
}
section, aside, header, footer, nav, article, time {
    display: block;
}
h1 {
    font-family:"Lucida Sans", "Courier";
    text-shadow: -4px 4px 3px #999999;
    font-size: 3em;
}
h2 {
    font-family:"Segoe UI Light", "Consolas", sans-serif;
}
h3 {
    font-family:"Lucida Sans", "Consolas", "Baskerville", "Palatino Linotype", sans-serif;
}
.chapter {
    font-size: 2em;
    font-family:"Consolas";
    background: -webkit-linear-gradient(#eee, #333);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.smallcaps {
    font-variant: small-caps;
}
.smallfont {
    font-size: 0.6em;
}
aside {
    color: cornsilk;
    font-family:'Bookman Old School', Candara, Calibri, serif;
}
aside p:last-child {
    margin-bottom:0;
}
span:hover {
    position:relative;
    cursor:pointer;
}
span[title]:hover:after {
    content: attr(title);
    background:yellow;
    padding: 4px 8px;
    color: #000;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 20;
    white-space: nowrap;
}
.marginalize {
    margin-left: 5em;
    margin-right: 5em;
}
.tightvert {
    line-height: .5;
}
.german {
    font-family:"Courier";
    margin-left: 1em;
    margin-right: 1em;
}
.germannomargin {
    font-family:"Courier";
}
.english {
    font-family:"Segoe UI";
}
.consolas {
    font-family:"Consolas";
}