/* boegelindner.de — bloki TOLKO dlya glavnoj stranicy.
   Rodnoj index/style.css ne trogaem: on chast vosstanovleniya.
   Setka sajta — obychnyj potok vnutri #container (930px), bez absolute;
   povtoryaem ee zhe: shirina 930, shag kolonok 225+6, kak u #thumbnails. */

/* ---- Glavnaya: stroka o byuro ---- */
#start_intro {
	max-width: 620px;          /* ~70 znakov v stroke — predel chitaemosti */
	margin: 0 0 22px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 19px;
	color: #5f5f5f;            /* 5.9:1 na belom */
}

/* ---- Setka rabot: foto + nazvanie. Tri v ryad, shag 306+6 = 930 ---- */
#start_werke {
	font-size: 0;              /* ubiraem zazory mezhdu inline-blokami */
	margin-bottom: 26px;
}

#start_werke .werk {
	display: inline-block;
	width: 306px;
	margin: 0 6px 18px 0;
	vertical-align: top;
	text-decoration: none;
}

#start_werke .werk:nth-child(3n) { margin-right: 0; }

#start_werke img {
	display: block;
	width: 306px;
	height: 200px;
	object-fit: cover;         /* kadr obrezaetsya, a ne szhimaetsya */
	border: 0;
	transition: opacity 0.18s ease-out;
}

#start_werke .werk_titel {
	display: block;
	padding-top: 7px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 16px;
	color: #444444;            /* 9.7:1 */
}

#start_werke .werk_rubrik {
	display: block;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 15px;
	color: #6e6e6e;
}

#start_werke .werk:hover img { opacity: 0.82; }
#start_werke .werk:hover .werk_titel { color: #e82013; }

#start_werke .werk:focus-visible {
	outline: 2px solid #e82013;
	outline-offset: 3px;
}

/* ssylka «alle N Projekte» v konce kolonki */
#start_inhalt .alle {
	display: inline-block;
	margin-top: 8px;
	color: #6e6e6e;
}

#start_inhalt .alle:hover { color: #e82013; }

@media (prefers-reduced-motion: reduce) {
	#start_werke img { transition: none; }
}

/* Tri kolonki razdelov pod lentoj foto: tot zhe shag 225+6 */
#start_inhalt {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 17px;
	color: #666666;
	padding-bottom: 20px;
}

#start_inhalt .start_spalte {
	float: left;
	width: 225px;
	margin: 0 6px 0 0;
}

#start_inhalt .start_spalte a {
	color: #666666;
	text-decoration: none;
}

#start_inhalt .start_spalte a:hover {
	color: #e82013;
}

/* chistim potoki posle kolonok — inache futer/konec stranicy uedet vverh */
#start_inhalt:after {
	content: "";
	display: block;
	clear: both;
}

@media (prefers-reduced-motion: reduce) {
	#start_bilder a img { transition: none; }
}

/* ---- Futer. Ego v shablone ne bylo voobshche: vernutsya na glavnuyu mozhno
   bylo tolko klikom po logotipu-kartinke, a niz stranicy obryvalsya.
   Odna sderzhannaya stroka v tom zhe stile, chto ves sajt:
   Verdana 10px, seryj #666, krasnyj akcent pri navedenii. ---- */
#fusszeile {
	clear: both;
	margin-top: 28px;
	padding-top: 10px;
	border-top: 1px solid #e0e0e0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	line-height: 17px;
	color: #767676;          /* 4.6:1 na belom — prohodit AA */
}

#fusszeile a {
	color: #767676;
	text-decoration: none;
}

#fusszeile a:hover {
	color: #e82013;
}

/* ================================================================
   Sloj po auditu 28.09. Shablon (style.css) NE tronut — vse zdes.
   ================================================================ */

/* ---- H1. Auditom: na sajte ne bylo NI ODNOGO zagolovka — nazvanie
   proekta lezhalo obychnym tekstom v #headline. Teper ono v <h1>,
   i vneshne dolzhno vyglyadet tak zhe, kak vyglyadelo: brauzernye
   po umolchaniyu 2em/bold/margin sbrasyvaem do rodnyh 12pt. ---- */
#headline h1,
#start_intro h1 {
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
	margin: 0;
	padding: 0;
	display: inline;
	color: inherit;
}

/* ---- Kontrast. Krasnyj akcent #e82013 na belom daet 4.14:1,
   norma dlya melkogo teksta 4.5:1. Zatemnyaem TOLKO svetlotu
   (ton i nasyshchennost sohranyayutsya, cvet uznavaem): #e82013 = 4.52:1, svetlota sdvinuta vsego na 0.04.
   Krasnyj pri navedenii i v ssylkah ostavlyaem etim zhe znacheniem. ---- */
#start_inhalt font,
#navi_sub font,
.start_spalte font {
	color: #e82013;
}

#fusszeile a:hover,
#start_inhalt a:hover,
#navi_sub a:hover {
	color: #e82013;
}

/* .werk_rubrik byl #8a8a8a = 3.45:1 pri norme 4.5 */
#start_werke .werk_rubrik {
	color: #6e6e6e;      /* 5.0:1; selektor s id — inache pravilo vyshe perebivaet */
}

/* ---- Fokus s klaviatury. V shablone 2004 goda ego net voobshche,
   a bez nego po sajtu nelzya projti tabom. ---- */
a:focus-visible,
button:focus-visible {
	outline: 2px solid #e82013;
	outline-offset: 2px;
}

/* ---- Telefon. Auditom: zony nazhatiya 14px po vysote pri norme 24,
   i minimalnyj shrift 10px. Tolko na uzkih ekranah — desktopnaya
   verstka 930px ostaetsya bit v bit kak v originale. ---- */
@media (max-width: 760px) {
	body {
		font-size: 13px;
		-webkit-text-size-adjust: 100%;
	}

	#container,
	#graphix,
	#thumbnails,
	#description,
	#navi_sub,
	#start_werke,
	#start_inhalt {
		width: auto;
		max-width: 100%;
		float: none;
	}

	img {
		max-width: 100%;
		height: auto;
	}

	/* ssylki-punkty menyu i spiskov: dotyagivaem do 24px po vysote */
	#navi_main a,
	#navi_sub a,
	#start_inhalt a,
	#browse_int a,
	#fusszeile a {
		display: inline-block;
		min-height: 24px;
		line-height: 24px;
		padding: 0 2px;
	}

	#navi_main a {
		min-height: 30px;
		line-height: 30px;
		margin-right: 6px;
	}

	#navi_main,
	#navi_sub,
	#start_inhalt,
	#start_werke,
	#start_werke .werk_titel,
	#start_werke .werk_rubrik,
	#fusszeile {
		font-size: 13px;
		line-height: 20px;
	}
}

/* ---- Dobor po povtornoj proverke v brauzere. Pervyj prohod ostavil
   sem stranic s uzkimi zonami: bloki profilya (#profil_navi_sub,
   #profil_browse_int) v @media ne byli perechisleny voobshche, a strelki
   «<» / «>» — odinochnye simvoly shirinoj 13px, im nuzhna shirina, a ne
   tolko vysota. Na glavnoj ostavalsya 11px v podpisyah plitok. ---- */
@media (max-width: 760px) {
	#profil_navi_sub,
	#profil_browse_int,
	#profil_kontakt_col_1,
	#profil_ausz_wettbew_mitarb_col_1,
	#profil_ausz_wettbew_col_2 {
		width: auto;
		max-width: 100%;
		float: none;
		font-size: 13px;
	}

	#profil_navi_sub a,
	#profil_browse_int a {
		display: inline-block;
		min-height: 24px;
		line-height: 24px;
		padding: 0 2px;
	}

	/* strelki listaniya: odinochnyj simvol — zadaem i shirinu */
	#browse_int a,
	#profil_browse_int a {
		min-width: 30px;
		min-height: 30px;
		line-height: 30px;
		text-align: center;
		margin-right: 6px;
	}

	/* podpisi plitok na glavnoj: bylo 11px */
	#start_werke .werk_titel,
	#start_werke .werk_rubrik {
		font-size: 13px;
		line-height: 19px;
	}
}

/* ---- Poslednij dobor. #start_intro — eto teper H1 stranicy (do pravok
   zagolovkov na sajte ne bylo voobshche), 11px dlya nego malo: na telefone
   13px. Logotip — ssylka-kartinka 150x19, dotyagivaem zonu nazhatiya
   do 24px po vysote, sama kartinka ne menyaetsya. ---- */
@media (max-width: 760px) {
	#start_intro,
	#start_intro h1 {
		font-size: 13px;
		line-height: 20px;
	}

	#logo a {
		display: inline-block;
		min-height: 24px;
		padding: 3px 0;
	}
}

/* ---- Otbivka futera. Futer ochishchaet floaty (clear: both), poetomu
   prizhimaetsya k nizhnemu krayu samoj dlinnoj kolonki, i ego sobstvennyj
   margin-top ne rabotaet: izmereno — 0px pri zadannyh 28.
   Otstup daem KOLONKAM: liniya ochistki opuskaetsya, futer othodit vniz,
   a ego border-top ostaetsya pri svoem tekste. V rodnom style.css u kolonok
   padding-bottom: 20px, dovodim do 48 (20 + 28 zadumannoj otbivki).
   Na telefone kolonki ne plavayut, tam otbivku daet margin futera. ---- */
#description,
#navi_sub,
#profil_kontakt_col_1,
#profil_ausz_wettbew_mitarb_col_1,
#profil_ausz_wettbew_col_2 {
	padding-bottom: 48px;
}

@media (max-width: 760px) {
	/* na uzkom ekrane kolonki idut drug pod drugom — lishnij otstup
	   mezhdu nimi ne nuzhen, futeru hvataet svoego margin-top */
	#description,
	#navi_sub,
	#profil_kontakt_col_1,
	#profil_ausz_wettbew_mitarb_col_1,
	#profil_ausz_wettbew_col_2 {
		padding-bottom: 20px;
	}
}

/* ---- Ssylki v tekste stranicy /kontakt. Pravilo vyshe perechislyaet bloki
   poimenno i #profil_kontakt_col_1 v nem est, no ssylki VNUTRI abzacev
   (a ne otdelnymi strokami) ostavalis 15px po vysote pri norme 24.
   Zadaem im zonu nazhatiya, ne lomaya stroku teksta. ---- */
@media (max-width: 760px) {
	#profil_kontakt_col_1 a {
		display: inline-block;
		min-height: 24px;
		line-height: 24px;
		padding: 0 1px;
	}
}

/* ---- Tablica nagrad (/auszeichnungen, /praem-wettbewerbe).
   Bylo: dve nezavisimye kolonki-floata, svyaz goda s nagradoj derzhalas
   SCHETOM pustyh <br>. Moya chistka szhala lishnie <br> (levaya kolonka
   29 strok vmesto 63) — i gody uehali k chuzhim nagradam: izmereno,
   «1998» stoyal naprotiv pustoty, «2005» naprotiv Jacobs University
   (v arhive tam 2006). Teper para «god + nagrada» — odna stroka tablicy,
   vyravnivanie derzhit brauzer, a ne sovpadenie chisla perevodov stroki.
   Shirina i tipografika — rodnye: 105 + 455 = 560, kak levaya kolonka. ---- */
table.auszeichnungen {
	width: 465px;      /* realnaya shirina kolonki profil_*_col_1 */
	border-collapse: collapse;
}

table.auszeichnungen td {
	padding: 0 0 18px;
	vertical-align: top;
	line-height: 1.55;
}

table.auszeichnungen td.jahr {
	width: 95px;
	white-space: nowrap;
}

@media (max-width: 760px) {
	table.auszeichnungen,
	table.auszeichnungen td.jahr {
		width: auto;
	}
	table.auszeichnungen td.jahr { width: 68px; }
}

/* ---- Lenta foto v #graphix: byla razorvana v vertikalnyj stolb.
   V rodnom style.css stoit `#graphix img { display: block }`, a kadry
   v razmetke zapisany VSTYK (`<img...><img...>` bez probelov) — eto
   gorizontalnaya lenta 929px, narezannaya pod tochnuyu shirinu polosy
   (proveril summy: billebad 321+310+298=929, kaiserkai 310+156+310+153=929).
   display:block delal iz nee stolb 600 i 800px vmesto 200.
   Lechim tak zhe, kak sdelan sosednij #thumbnails: inline + font-size:0,
   chtoby ne poyavilis zazory mezhdu kartinkami. ---- */
#graphix {
	font-size: 0;
}

#graphix img {
	display: inline;
	vertical-align: top;
}

/* ---- Podmenyu razdela: bylo 988px pri tekste v 218-308px, sleva ostavalos
   do 940px pustoty (izmereno na 52 stranicah iz 60). Prichina — spisok
   perechislyaet VSE 24 proekta razdela na kazhdoj stranice.
   Ne sokrashchaem spisok (on chast navigacii sajta), a ukladyvaem ego
   v dve kolonki i daem plotnee shag strok: 988 -> 528px.
   Shirina ostaetsya rodnye 340px, sredstvami kolonok — nichego ne vylezaet
   za konteiner 930. ---- */
#navi_sub {
	line-height: 1.3;
	column-count: 2;
	column-gap: 16px;
	column-fill: balance;
}

#navi_sub a {
	break-inside: avoid;        /* nazvanie proekta ne rvetsya mezhdu kolonkami */
	margin-bottom: 7px;
}

/* zagolovok razdela — nad obeimi kolonkami, a ne vnutri pervoj */
#navi_sub > font:first-child {
	column-span: all;
	display: block;
}

@media (max-width: 760px) {
	/* na telefone kolonki ne nuzhny — spisok i tak idet vo vsyu shirinu */
	#navi_sub {
		column-count: 1;
		line-height: 1.6;
	}
}

/* ---- Tekushchaya stranica v podmenyu. Do etogo punkt, na kotorom
   polzovatel nahoditsya, nichem ne otlichalsya ot ostalnyh 23.
   Otmechaem cvetom TEKSTA stranicy i zhirnym — no NE krasnym:
   krasnyj na etom sajte oznachaet zagolovok razdela, roli putat nelzya. ---- */
#navi_sub a.tek {
	color: #564f45;
	font-weight: bold;
	cursor: default;
}