@font-face { font-family: 'quebec'; font-style: normal; font-weight: 100; font-display: swap; src: url(https://shop.ingeheyen.de/fonts/quebec/quebec100.woff') format('woff'); }
@font-face { font-family: 'quebec'; font-style: normal; font-weight: 300; font-display: swap; src: url(https://shop.ingeheyen.de/fonts/quebec/quebec300.woff') format('woff'); }
@font-face { font-family: 'quebec'; font-style: normal; font-weight: 400; font-display: swap; src: url(https://shop.ingeheyen.de/fonts/quebec/quebec400.woff') format('woff'); }
@font-face { font-family: 'quebec'; font-style: normal; font-weight: 500; font-display: swap; src: url(https://shop.ingeheyen.de/fonts/quebec/quebec500.woff') format('woff'); }
@font-face { font-family: 'quebec'; font-style: normal; font-weight: 600; font-display: swap; src: url(https://shop.ingeheyen.de/fonts/quebec/quebec600.woff') format('woff'); }
@font-face { font-family: 'quebec'; font-style: normal; font-weight: 700; font-display: swap; src: url(https://shop.ingeheyen.de/fonts/quebec/quebec700.woff') format('woff'); }
@font-face { font-family: 'quebec'; font-style: normal; font-weight: 900; font-display: swap; src: url(https://shop.ingeheyen.de/fonts/quebec/quebec900.woff') format('woff'); }

html { scroll-behavior: smooth; }

body { background:#dededd; margin:0; padding:0; }

div, p, body, textarea, input, table, tr, td { font-family:quebec; font-size:1rem; font-weight:300; line-height:1.4rem; letter-spacing:0.02rem; color:#888; }
table, { border-collapse:separate; border:0; border-spacing:0; padding:0; }
td { padding:0; }
		
a { font-family:quebec; color:#888; text-decoration: none; font-weight:600; font-size:94%; letter-spacing:0.06rem; }
a:hover { color:#444; border:none; text-decoration: none; transition: all 0.5s; }

grau { font-size:1rem; color:#bbb; }
grau a:hover { font-size:1rem; color:#888; }

english { font-size:1rem; color:#444; }
english a { color:#444; }

h1 { font-size:3rem; line-height:3.2rem; font-weight:100; letter-spacing:0.02rem; margin-block-start:0; margin-block-end:0.5rem; color:#0ae; }
h3 { font-size:2rem; line-height:2.2rem; font-weight:100; letter-spacing:0.02em; margin-block-start:2rem; margin-block-end:0.5rem; color:#888; }
h4 { font-size:94%; line-height:1.4rem; font-weight:600; letter-spacing:0.08em; margin-block-start:1.5rem; margin-block-end:0.5rem; color:#888; }
b { font-weight:600; font-size:94%; letter-spacing:0.06rem; color:#0ae; }
ul { list-style-type:square; list-style-position:outside; margin-block-start:0rem; margin-block-end:0.5rem; padding-inline-start:20px; }
ul li { text-align:left; }

.quelle { color:#bbb; font-size:0.8rem; text-align:right; }

.auftraggeber { color:#444; font-style:italic; text-align:left; }
.auftraggeber a { color:#444; }
.auftraggeber a:hover { color:#000; }
.auftraggeber:before { content:"Auftraggeber: "; white-space:pre; }
s
.quelle { color:#bbb; font-size:0.8rem; font-style:italic; text-align:right; }
.quelle a { color:#bbb; }
.quelle a:hover { color:#fff; }

.keyvisual { border-collapse:collapse; border-spacing:0; margin-left:0%; width:100%; text-align:center;}

.index { border-collapse:separate; margin-left:10%; width:80%; text-align:center; border-spacing:30px 90px; table-layout:fixed; position:absolute; top:0; min-height:100%; }
.index img { max-width:100%; height: auto; }
img.frei { filter: drop-shadow(-3px 5px 5px #aaa); }
img.rund { border-radius:50%; }
img.mood { width:45%; }
img.solos { width:45%; }
img.vignette { width:10%; vertical-align:text-bottom; margin-top: 0.5rem; filter: drop-shadow(-2px 4px 4px #aaa); }
img.artikel { max-width:85%; filter: drop-shadow(-2px 4px 4px #aaa); margin-bottom:0.5rem; }
.index td.bild { width:50%; text-align:right; vertical-align:top; }
.index td.bild a { text-decoration:none; }
.index td.mengentext { width:50%; text-align:left; vertical-align:top; }
.index td.kurztext { width:50%; text-align:left; vertical-align:center; }
.index td.intro { width:50%; text-align:left; vertical-align:center; }
.index td.artikel { text-align:center; }
.index td.mood { text-align:center; }
.index td.op { width:50%; vertical-align:top; }
figure { display:block; margin:0; margin-block:0; margin-block-start:0.15rem; margin-inline:0; }
figure.flex { display:flex; justify-content:flex-end; align-items:flex-end; }
figure.o { width:25%; position:relative; right:-2.5%; z-index:500; }
figure.p { width:60%; }
figure.os { width:25%; position:relative; right:-2.5%; z-index:500; }
figure.ps { width:45%; }
figure > figcaption { position:absolute; bottom:105%; left:-70%; padding:0.125rem 0.5rem 0.125rem 0.125rem; font-size:0.8rem; letter-spacing:0.02rem; line-height:0.9rem; text-align:left; white-space:pre; color:#888; background: rgba(222,222,221,.9); opacity:0; z-index:502; transition: all 0.5s ease; }
figure.o:hover > figcaption { opacity:1; }
figure.os:hover > figcaption { opacity:1; }
figure.kachel { display:inline-block; width:15rem; vertical-align:top; font-size:0.8rem; letter-spacing:0.02rem; line-height:0.9rem; text-align:left; padding:0rem 0 2rem 0; }
table.liste { border-collapse:separate; border-spacing: 0; }

img.linie, img.linieoben { margin-left:-12.5%; min-width:125%; margin-bottom:5px; height:2px; }
div.kapiteloben { font-size:0.85rem; letter-spacing:0.02rem; text-align:left; margin-top: calc(2.3rem - 85px); }
div.kapitel { font-size:0.85rem; letter-spacing:0.02rem; text-align:left; margin-top:2.3rem; }

@media screen and (max-width: 54rem) {
.quelle { text-align:center; }
.index { margin-left:0; width:100%; border-spacing:25px 75px; }
.index td { display:block; max-width:100%; margin-bottom:0.7rem; margin-left:0; }
img.frei { filter: drop-shadow(-3px 5px 5px #aaa); margin-bottom:5px; }
.index td.bild { text-align:center; width:100%; }
.index td.mengentext { text-align:left; width:100%; max-width:600; margin:auto; }
.index td.kurztext { text-align:center; width:100%; max-width:600; margin:auto; }
.index td.intro { text-align:center; width:100%; max-width:600; margin:auto; }
.index td.artikel { text-align:center; width:100%; max-width:600; margin:auto; }
img.linie, img.linieoben { margin-left:0%; min-width:100%; }
div.kapiteloben { text-align:left; margin-top: calc(2.3rem - 70px); }
.index td.op { text-align:center; width:100%; }
figure.flex { justify-content:center; align-items:flex-end; }
figure.o { width:25%; position:relative; right:7.5%; }
figure.p { width:60%; position:relative; left:-12.5%; }
figure.os { width:25%; position:relative; left:-10%; }
figure.ps { width:45%; position:relative; left:-12.5%; }
figure > figcaption { left:0; }
table.liste td { display:table-cell; }
}

textarea, input, button { background-color:#dededd; border:1px solid #888; border-radius:12px; padding-left:12px; padding-right:12px; padding-top:3px; padding-bottom:3px; color:#888; width:100%; font-family:quebec; font-size:1rem; font-weight:300; line-height:auto; letter-spacing:0.02rem; color:#888; }
input.kurz { width:4.5rem; }
button { width:auto; }
button:hover { background-color:#888; color:#dededd; }

table.fader { width:100%; height:calc(100% - 3rem); background-position:50% 50%; background-repeat:repeat; position:absolute; top:0; border-spacing:0; }
.fader tr { position:absolute; top: calc(100% + 0.2rem); right:20px; left:20px; }
.fader td.ort { display:block; font-size:0.8rem; letter-spacing:0.02rem; line-height:1rem; width:100%; }
/* Basic jQuery Slider essential styles */
ul.bjqs { position:static; list-style:none; padding:0; margin:0; overflow:hidden; }
li.bjqs-slide { display:none; }
ul.bjqs-controls { list-style:none; margin:0; padding:0; z-index:5555; }
ul.bjqs-controls.v-centered li a { position:absolute; }
ul.bjqs-controls.v-centered li.bjqs-next a { right:0; }
ul.bjqs-controls.v-centered li.bjqs-prev a { left:0; }
ol.bjqs-markers { list-style:none; padding:0; position:absolute; right:20px; }
ol.bjqs-markers.h-centered { text-align:right; }
ol.bjqs-markers li { display:inline; margin-left:10px; }
ol.bjqs-markers li a { display:inline-block; color:#bbb; font-size:0.8rem; letter-spacing:0; }
ol.bjqs-markers li a:hover { color:#444; }
ol.bjqs-markers li.active-marker a { color:#fff; }