/* ---------------------------------------------------------------------------
	Google-Übersetzung: runde Flagge neben dem Suchfeld

	Bewusst eine eigene CSS-Datei (eingebunden über page.includeCSSLibs.translate
	in site_setup.ts) und nicht im Grunt-Bundle: so ist für diese Ergänzung
	kein Asset-Build nötig.
*/

.translate-flag {
	display: inline-block;
	line-height: 0;
	text-decoration: none;
}

.translate-flag img {
	display: block;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	overflow: hidden;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15);
	-webkit-transition: -webkit-transform 0.2s;
	transition: transform 0.2s;
}

.translate-flag:hover img,
.translate-flag:focus img {
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}

/* Desktop: eigene Tabellen-Spalte rechts neben der Suche */
.translate-flag-column {
	padding-left: 15px;
	margin: 0 0 13px 0;
	white-space: nowrap;
}

/* Mobil: links neben dem Sandwich-Menü. Beide float:right, die Flagge steht
   im Markup nach dem Toggle und landet dadurch links davon. */
.nav-mobile-translate {
	float: right;
	margin: 14px 4px 0 0;
}

/* Der mobile Header ist bereits voll: DGIM-Logo (position:absolute, right:60px)
   endet rund 9px vor dem Sandwich-Menue. Damit die Flagge dazwischen passt,
   ruecken wir das Logo um die Flaggenbreite nach links – und machen es auf
   sehr schmalen Geraeten etwas kleiner, sonst stoesst es an das
   "Klug entscheiden"-Logo. Werte aus Messungen bei 320/375/390/767px. */
@media (max-width: 767px) {
	.header-dgim {
		right: 88px;
	}
}

@media (max-width: 389px) {
	.header-dgim .logo {
		width: 90px;
		height: 18px;
	}
}