/* kilanko.de : Blatt 1001 px links buendig, Reiterband, eine Spalte.
   Masse nach einer Landtechnik-Firmenseite von 2006 (Wayback), Farben und Marke eigen. */

html { background: #fff; }
body { margin: 0; font: 13px/19px Arial, Verdana, Helvetica, sans-serif; color: #1f1b17; background: #fff; }
a { color: #1f1b17; }
a:visited { color: #8a4a12; }
a:hover, a:active { color: #000; text-decoration: underline; background: #f3d0a8; }
img { border: 0; }

.klk-blatt { width: 1001px; margin: 0 auto; }

/* Kopf 64 px */
.klk-kopf { height: 64px; display: flex; justify-content: space-between; }
.klk-kopf-name { padding: 21px 0 0 36px; font-weight: bold; font-size: 13px; }
.klk-kopf-name a { text-decoration: none; }
.klk-kopf-name a:hover { background: none; }
.klk-kopf-name small { display: block; font-weight: normal; font-size: 11px; color: #6b5a4a; line-height: 15px; }
.klk-kopf-marke { width: 200px; padding-top: 6px; }
.klk-kopf-marke a:hover { background: none; }
.klk-marke { display: block; }

/* Reiterband 64 px */
.klk-band { display: flex; background: #d97a2b; min-height: 64px; }
.klk-band-links { width: 773px; margin-left: 10px; }
.klk-reiter { display: flex; border: solid #fff; border-width: 0 1px 1px; height: 21px; }
.klk-reiter a { font-size: 11px; font-weight: bold; line-height: 21px; padding: 0 30px 0 24px; text-decoration: none; color: #1f1b17; white-space: nowrap; }
.klk-reiter a:hover { background: #fff; }
.klk-reiter .klk-reiter-an { background: #fff; position: relative; }
.klk-reiter .klk-reiter-an::before { content: "\2198"; position: absolute; left: 9px; font-weight: normal; }
.klk-unter { padding: 0 0 4px 0; display: flex; flex-wrap: wrap; }
.klk-unter a, .klk-unter span { font-size: 11px; line-height: 21px; padding: 0 0 0 24px; text-decoration: none; color: #1f1b17; white-space: nowrap; }
.klk-unter a:hover, .klk-unter .klk-unter-an { color: #fff; background: none; }
.klk-band-rechts { width: 190px; margin-left: 18px; padding-top: 14px; font-size: 11px; line-height: 14px; }
.klk-band-rechts p { margin: 0 0 4px; }
.klk-stand { color: #4a2a0c; }

/* Rumpf: weisse Flaeche, links und rechts 10 px Band */
.klk-rumpf { background: #d97a2b; padding: 0 10px; }
.klk-inhalt { background: #fff; padding: 18px 18px 40px; min-height: 560px; overflow: hidden; }
.klk-krumen { font-size: 11px; color: #4d4239; margin: 0 0 10px; }
.klk-krumen a { color: #4d4239; text-decoration: none; }

h1 { font-size: 20px; line-height: 23px; color: #6b5a4a; margin: 10px 0 10px; }
h2 { font-size: 15px; line-height: 19px; color: #6b5a4a; margin: 22px 0 4px; }
h3 { font-size: 13px; line-height: 16px; color: #1f1b17; margin: 16px 0 2px; }
.klk-inhalt p, .klk-inhalt ul, .klk-inhalt ol, .klk-inhalt dl { max-width: 690px; }
.klk-inhalt p { margin: 0 0 10px; }
.klk-inhalt ul, .klk-inhalt ol { padding-left: 18px; margin: 0 0 12px; }
.klk-inhalt li { margin-bottom: 4px; }
.klk-vorspann { font-size: 14px; line-height: 20px; color: #3a322b; }

/* breiter Bildstreifen wie die Teaserbilder der Vorlage */
.klk-streifen { margin: 4px 0 16px; max-width: 755px; }
.klk-streifen img { display: block; width: 100%; height: 230px; object-fit: cover; }
.klk-streifen figcaption, .klk-hoch figcaption { font-size: 11px; line-height: 14px; color: #5e534a; padding-top: 4px; }
.klk-hoch { float: right; width: 240px; margin: 4px 0 10px 20px; }
.klk-hoch img { display: block; width: 100%; height: auto; }
.klk-schema { margin: 6px 0 16px; max-width: 755px; }
.klk-schema svg { display: block; width: 100%; height: auto; }
.klk-schema figcaption { font-size: 11px; color: #5e534a; }

/* Kachel: Bild 120 x 73 + Linkliste, zwei je Zeile (aus der Produktuebersicht der Vorlage) */
.klk-kacheln { display: flex; flex-wrap: wrap; gap: 10px; max-width: 755px; margin: 0 0 18px; }
.klk-kachel { width: 350px; border: 1px solid #dcd6cf; padding: 6px 10px 10px; }
.klk-kachel h2 { margin: 0 0 6px; font-size: 13px; color: #1f1b17; }
.klk-kachel-innen { display: flex; gap: 16px; }
.klk-kachel img { width: 120px; height: 73px; object-fit: cover; object-position: 50% 22%; flex: none; }
.klk-kachel ul { list-style: none; padding: 0; margin: 0; font-size: 12px; line-height: 15px; }
.klk-kachel li { margin: 0 0 3px; }
.klk-kachel a { text-decoration: none; }
.klk-kachel-breit { width: 732px; }

/* Kasten mit heller Kopfleiste (Top-Meldung der Vorlage), hoechstens einer pro Seite */
.klk-kasten { max-width: 360px; border: 1px solid #f3d0a8; margin: 18px 0 12px; }
.klk-kasten-kopf { background: #f3d0a8; font-weight: bold; font-size: 12px; line-height: 20px; padding: 0 9px; color: #3a2a1a; }
.klk-kasten ul { list-style: none; padding: 8px 9px 4px; margin: 0; font-size: 12px; }
.klk-kasten li::before { content: "\2192\00a0"; }

.klk-tabelle { overflow-x: auto; max-width: 755px; }
.klk-liste { border-collapse: collapse; font-size: 12px; line-height: 16px; margin: 6px 0 14px; }
.klk-liste th { text-align: left; background: #f3d0a8; padding: 3px 8px; }
.klk-liste td { padding: 5px 8px; border-bottom: 1px solid #e4ded8; vertical-align: top; }
.klk-mini { width: 120px; height: 73px; object-fit: cover; display: block; }

dl.klk-begriffe dt { font-weight: bold; margin-top: 12px; }
dl.klk-begriffe dd { margin: 2px 0 0 0; }
.klk-abc { font-size: 12px; margin: 0 0 14px; }
.klk-abc a { padding: 0 5px; }

.klk-quellen { font-size: 11px; line-height: 15px; color: #4d4239; border-top: 1px solid #e4ded8; margin-top: 26px; padding-top: 8px; max-width: 755px; }
.klk-quellen p { margin: 0 0 4px; }
.klk-redaktion { font-size: 11px; color: #5e534a; }

/* Fussband 18 px */
.klk-fuss { background: #d97a2b; display: flex; flex-wrap: wrap; padding: 0 10px; font-size: 11px; line-height: 18px; }
.klk-fuss a, .klk-fuss span { padding: 0 16px; text-decoration: none; color: #1f1b17; }
.klk-fuss a:hover { color: #fff; background: none; }
.klk-fuss .klk-fuss-trenn { border-left: 1px solid #fff; }
.klk-fuss span { margin-left: auto; color: #3a1f08; }

@media (max-width: 1010px) {
  .klk-blatt { width: auto; }
  .klk-band { flex-wrap: wrap; }
  .klk-band-links { width: auto; flex: 1 1 100%; margin-right: 10px; }
  .klk-band-rechts { display: none; }
}
@media (max-width: 640px) {
  body { font-size: 15px; line-height: 22px; }
  .klk-vorspann { font-size: 16px; line-height: 23px; }
  h1 { font-size: 21px; line-height: 25px; }
  .klk-kopf { height: auto; padding-bottom: 6px; }
  .klk-kopf-name { padding: 12px 0 0 12px; }
  .klk-kopf-marke { width: 130px; padding-top: 10px; }
  .klk-marke { width: 124px; height: 33px; }
  .klk-band-links { margin-left: 0; margin-right: 0; }
  .klk-reiter { height: auto; flex-wrap: wrap; border-width: 0 0 1px; }
  .klk-reiter a { padding: 0 10px 0 22px; font-size: 13px; line-height: 30px; }
  .klk-unter a, .klk-unter span { font-size: 13px; line-height: 28px; padding-left: 12px; white-space: normal; }
  .klk-rumpf { padding: 0 4px; }
  .klk-inhalt { padding: 12px 12px 30px; }
  .klk-kachel, .klk-kachel-breit { width: 100%; }
  .klk-kachel-innen { gap: 10px; }
  .klk-kachel img { width: 90px; height: 60px; }
  .klk-hoch { float: none; width: auto; margin: 4px 0 12px; }
  .klk-streifen img { height: 170px; }
  .klk-fuss { padding: 4px 4px; line-height: 26px; }
  .klk-fuss a, .klk-fuss span { padding: 0 9px; }
  .klk-fuss .klk-fuss-trenn { border-left: 0; }
  .klk-fuss span { margin-left: 0; }
}