@font-face {
    font-family: 'Cutive Mono';
    src: url('CutiveMono-Regular.ttf') format('truetype');
}

* { margin: 0; padding: 0;}
body { background-color: #fff; color: #333;	font: 14px/20px "Cutive Mono", "CourierNew", "Courier", monospace;}

#page { width: 800px; margin: 80px auto; text-align:center;}

header#top h1 { font-size: 32px; line-height: 36px; }
header#top span { font-size: 18px; font-weight: 400; }

nav { margin: 80px 0px 80px; }
nav ul li { display: inline; margin: 20px;}
nav a { color: #333; text-decoration: none; font-weight: 800;}
nav a:hover { text-decoration: underline;}
nav a:before {content:none!important;}

h1 { margin-bottom: 20px; }
p { margin: 0px 200px 20px; text-align:justify; font-weight: 200; height: auto;}
p.centered, p.center { text-align:center; }
p.small { font-size: 10px; text-align:center; }
h2 { font-size: 18px; font-weight: 200; }
h3 { font-size: 16px; font-weight: 200; }
h2 + p, h3 + p { margin-top: 20px; }
p + h2, p + h3 { margin-top: 80px; }
em { font-style: italic; }
strong { font-weight: 800; }
u { text-decoration: underline; }

a { color: #333; text-decoration: underline; }
a:hover { color: #999;}
/* a[href^="http://"]:before, a[href^="https://"]:before { content: "\2197\00A0"; } */
a.none { text-decoration: none; }
a.none:before { content:none; }

p.image { margin: 0px; line-height: 0px; text-align:center;}
img { margin: 0px 20px 20px 0px;}
img.one { width: 800px !important; height: auto !important; }
img.two { width: 390px !important; height: auto !important;}
img.three { width: 253px !important; height: auto !important;}
img.three:nth-child(2) { width:254px !important; height: auto !important; }
img.four { width: 185px !important; height: auto !important; }
img.five { width: 144px !important; height: auto !important; }
img:last-child { margin-right: 0px; }

hr { background: url('haus.png') no-repeat center; width:106px; height:152px; display:block; border:none; margin:auto; margin-bottom:80px;}
hr.home {margin:80px auto;}

blockquote { margin: 10px 10px 20px; padding: 9px; background-color: #f8f8f8; color: #666; border-left: 5px solid #ddd; font: 14px/20px Georgia, Times, serif; quotes: "\201C" "\201D"; }
blockquote p { margin: 0; }
blockquote:before { content: open-quote; font-weight: bold; }
blockquote:after  { content: close-quote; font-weight: bold; }

ul { margin-bottom: 20px; list-style-position:inside; }
ol { margin-bottom: 20px; list-style-position:inside; }
ul ul, ol ol { margin-bottom:0; }

fieldset { position: relative; border-top:1px solid #ccc; padding: 10px; margin-bottom:20px; }
fieldset legend { font-weight:bold; font-size:16px; padding: 0 5px; }

table { margin-bottom: 20px; width:100%; }
thead, th { font-weight: bold; }
td { text-align: left; }
tfoot { font-style: italic; }

footer { margin-top: 80px;}
footer p, footer a { text-align: center; color: #aaa;}

footer.source { position: absolute; bottom: 10px; right: 10px; }
footer.cookers { position: absolute; bottom: 10px; left: 10px; color: #ddd }
footer.cookers a { color: #ddd }

.map { position: relative; height: 530px; width: 800px; overflow: hidden; margin-bottom: 20px; }
.map img { position: absolute; top: 0; left: 0; max-width: 800px; z-index: 1; }
.map img:nth-child(1) { z-index: 10 }
.map img:nth-child(2) { z-index: 9 }
.map .fade { transition: 2s ease-in; }
.map .fade.up { transform: translateY(-120%); }
.map .fade.down { transform: translateY(120%); }
.map .fade.left { transform: translateX(-120%); }
.map .fade.right { transform: translateX(120%); }