@charset "UTF-8";

/* Stylesheet for IMI-Website, ed. 2025
 * General styles for all pages
 * by Sascha Leib for GROW.E.4
 * File name: imi-net.css
 */

/* sleeker main headline: */
#page-headline h1 {
	font-weight: normal;
}

/* h2 touchups */
main h2 {
	margin-bottom: 2.65rem;
}
#inpageNav h2 {
	margin: 0;
}
@media (max-width: 768px) {
	main h2 { margin-bottom: 0; }
}

/* resize sidebar: */
#navigation-layout.has-sidebar-left > :first-child,
#navigation-layout.has-sidebar-both > :first-child {
	flex: 0 0 20%;
	max-width: 20%;
}

#headline-breadcrumb-layout {
	background: #488F8E url('../img/banners/main-header-02.svg') right center no-repeat;
	background-size: 1000px;
	min-height: initial;
}
#headline-breadcrumbs {
	display: grid;
	min-height: 198px;
	align-items: center;
	width: 100%;
	max-width: 1140px;
	margin: 0 auto;
}
#headline-breadcrumbs::before {
	display: block;
	content: 'Connecting authorities across borders and languages';
	font-size: 1.6rem;
	color: #FFF;
	padding: 0 0 0 5.6pt;
	text-wrap: balance;
	margin-right: 440px;
	font-style: italic;
	text-shadow: #488F8E -1px 0 0, #488F8E 0 1px 0, #488F8E 1px 0 0, #488F8E 0 -1px 0;
}

/* change header layout when needed */
@media (max-width: 990px) {
	#headline-breadcrumb-layout {
		background-size: 620px;
	}
	#headline-breadcrumbs {
		min-height: 120px;
	}
	#headline-breadcrumbs:before {
		font-size: 1.25rem;
		margin-right: 235px;
	}
}
@media (max-width: 640px) {
	#headline-breadcrumb-layout {
		background-size: 440px;
	}
	#headline-breadcrumbs {
		min-height: 100px;
	}
	#headline-breadcrumbs:before {
		font-size: 1.1rem;
		margin-right: 165px;
	}
}
@media (max-width: 460px) {
	#headline-breadcrumb-layout {
		background-position: center right -40px;
	}
	#headline-breadcrumbs {
		min-height: 80px;
	}
	#headline-breadcrumbs:before {
		font-size: 1rem;
		margin-right: 128px;
	}
}

/* tagline in other languages: */
#headline-breadcrumbs:lang(bg)::before { content: 'Свързване на публичните органи през граници и езици'; }
#headline-breadcrumbs:lang(cs)::before { content: 'Propojujeme správní orgány napříč hranicemi a jazyky'; }
#headline-breadcrumbs:lang(da)::before { content: 'Forbinder myndigheder på tværs af grænser og sprog'; }
#headline-breadcrumbs:lang(de)::before { content: 'Behörden über Grenzen und Sprachen hinweg verbinden'; }
#headline-breadcrumbs:lang(el)::before { content: 'Διασύνδεση των αρχών σε διασυνοριακό και διαγλωσσικό επίπεδο'; }
#headline-breadcrumbs:lang(es)::before { content: 'Conectando autoridades más allá de fronteras e idiomas'; }
#headline-breadcrumbs:lang(et)::before { content: 'Viime asutused üle riigi- ja keelepiiride omavahel kokku'; }
#headline-breadcrumbs:lang(fi)::before { content: 'Viranomaisyhteistyötä yli rajojen ja kielimuurien'; }
#headline-breadcrumbs:lang(fr)::before { content: 'Relier les autorités par-delà les frontières et les langues'; }
#headline-breadcrumbs:lang(ga)::before { content: 'Údaráis a nascadh le chéile gan beann ar theorainneacha ná teangacha'; }
#headline-breadcrumbs:lang(hr)::before { content: 'Povezivanje tijela preko granica i jezika'; }
#headline-breadcrumbs:lang(hu)::before { content: 'A hatóságok határokon és nyelveken átívelő együttműködésének szolgálatában'; }
#headline-breadcrumbs:lang(it)::before { content: 'Connettere le autorità oltre i confini e le lingue'; }
#headline-breadcrumbs:lang(lt)::before { content: 'Institucijų bendradarbiavimas įveikiant sienas ir kalbų barjerus'; }
#headline-breadcrumbs:lang(lv)::before { content: 'Iestāžu sadarbība robežu un valodas barjeru pārvarēšanai'; }
#headline-breadcrumbs:lang(mt)::before { content: 'Ngħaqqdu l-Awtoritajiet bejn fruntieri u lingwi'; }
#headline-breadcrumbs:lang(nl)::before { content: 'Autoriteiten met elkaar verbinden over de grenzen en talen heen'; }
#headline-breadcrumbs:lang(pl)::before { content: 'Transgraniczna współpraca organów ponad barierami językowymi'; }
#headline-breadcrumbs:lang(pt)::before { content: 'A estabelecer ligações entre autoridades através das fronteiras e das línguas'; }
#headline-breadcrumbs:lang(ro)::before { content: 'Conectarea autorităților la nivel transfrontalier și lingvistic'; }
#headline-breadcrumbs:lang(sk)::before { content: 'Cezhraničné a jazykové prepojenie orgánov'; }
#headline-breadcrumbs:lang(sl)::before { content: 'Čezmejno in medjezikovno povezovanje javnih organov'; }
#headline-breadcrumbs:lang(sv)::before { content: 'Myndighetskontakter över språk- och landsgränser'; }

/* hide the breadcrumbs: */
#breadcrumbs-nav { display: none !important; }

/* sidebar navigation */
#sidebar-nav header {
	display: none;
}
#sidebar-nav header button {
	border: none;
	width: 100%;
	text-align: left;
	background-color: transparent;
	font-weight: bold;
	display: grid;
	grid-template-columns: 1.2em auto;
	column-gap: 6pt;
	padding: 6pt;
	overflow: hidden;
	cursor: pointer;
}
#sidebar-nav header button:focus {
	outline: none;
}
#sidebar-nav header button::before {
	content: '';
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3,6H21V8H3V6M3,11H21V13H3V11M3,16H21V18H3V16Z' style='fill:004494;' /%3E%3C/svg%3E") center no-repeat;
	background-size: 1.2em;
}
#sidebar-nav header button[aria-expanded="true"]::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21,15.61L19.59,17L14.58,12L19.59,7L21,8.39L17.44,12L21,15.61M3,6H16V8H3V6M3,13V11H13V13H3M3,18V16H16V18H3Z' /%3E%3C/svg%3E");
}
#sidebar-nav header button:hover span {
	text-decoration: underline;
}
#sidebar-nav ul {
	background-color: #F8F9FD;
}
#sidebar-nav ul li {
	display: block;
}
#sidebar-nav ul li.current,
#sidebar-nav ul li a[aria-current] {
	background-color: #E0E5F5;
}

#sidebar-nav ul li a {
	font-weight: normal;
	color: #26324B;
	text-decoration: none;
	display: grid;
	grid-template-columns: 1.2em auto;
	column-gap: 6pt;
	padding: 6pt;
}

#sidebar-nav ul li.login-link {
	background-color: #4755A0;
}
#sidebar-nav ul li.login-link a {
	color: #FFF;
}

#sidebar-nav ul li a:hover,
#sidebar-nav ul li a:focus {
	color: #000;
	background-color: #99AACC;
}

#sidebar-nav ul li a::before {
	content: ' ';
	display: inline-block;
	width: 1.2em;
	height: 1.2em;
	background: transparent none center no-repeat;
	background-size: 1.2em;
}

#sidebar-nav ul li a:hover::before,
#sidebar-nav ul li a:focus::before {
	filter: brightness(0);
}

#sidebar-nav ul li[data-menu="home"] a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9,13H15V19H18V10L12,5.5L6,10V19H9V13M4,21V9L12,3L20,9V21H4Z' style='fill:%2326324B;' /%3E%3C/svg%3E");
}
#sidebar-nav ul li[data-menu="about"] a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M11,9H13V7H11M12,20C7.59,20 4,16.41 4,12C4,7.59 7.59,4 12,4C16.41,4 20,7.59 20,12C20,16.41 16.41,20 12,20M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M11,17H13V11H11V17Z' style='fill:%2326324B;' /%3E%3C/svg%3E");
}
#sidebar-nav ul li[data-menu="library"] a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 1L14 6V17L19 12.5V1M21 5V18.5C19.9 18.15 18.7 18 17.5 18C15.8 18 13.35 18.65 12 19.5V6C10.55 4.9 8.45 4.5 6.5 4.5C4.55 4.5 2.45 4.9 1 6V20.65C1 20.9 1.25 21.15 1.5 21.15C1.6 21.15 1.65 21.1 1.75 21.1C3.1 20.45 5.05 20 6.5 20C8.45 20 10.55 20.4 12 21.5C13.35 20.65 15.8 20 17.5 20C19.15 20 20.85 20.3 22.25 21.05C22.35 21.1 22.4 21.1 22.5 21.1C22.75 21.1 23 20.85 23 20.6V6C22.4 5.55 21.75 5.25 21 5M10 18.41C8.75 18.09 7.5 18 6.5 18C5.44 18 4.18 18.19 3 18.5V7.13C3.91 6.73 5.14 6.5 6.5 6.5C7.86 6.5 9.09 6.73 10 7.13V18.41Z' style='fill:%2326324B;' /%3E%3C/svg%3E");
}
#sidebar-nav ul li[data-menu="faqs"] a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4,2A2,2 0 0,0 2,4V16A2,2 0 0,0 4,18H8V21A1,1 0 0,0 9,22H9.5V22C9.75,22 10,21.9 10.2,21.71L13.9,18H20A2,2 0 0,0 22,16V4C22,2.89 21.1,2 20,2H4M4,4H20V16H13.08L10,19.08V16H4V4M12.19,5.5C11.3,5.5 10.59,5.68 10.05,6.04C9.5,6.4 9.22,7 9.27,7.69C0.21,7.69 6.57,7.69 11.24,7.69C11.24,7.41 11.34,7.2 11.5,7.06C11.7,6.92 11.92,6.85 12.19,6.85C12.5,6.85 12.77,6.93 12.95,7.11C13.13,7.28 13.22,7.5 13.22,7.8C13.22,8.08 13.14,8.33 13,8.54C12.83,8.76 12.62,8.94 12.36,9.08C11.84,9.4 11.5,9.68 11.29,9.92C11.1,10.16 11,10.5 11,11H13C13,10.72 13.05,10.5 13.14,10.32C13.23,10.15 13.4,10 13.66,9.85C14.12,9.64 14.5,9.36 14.79,9C15.08,8.63 15.23,8.24 15.23,7.8C15.23,7.1 14.96,6.54 14.42,6.12C13.88,5.71 13.13,5.5 12.19,5.5M11,12V14H13V12H11Z' style='fill:%2326324B;' /%3E%3C/svg%3E");
}
#sidebar-nav ul li[data-menu="stat"] a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M16,11.78L20.24,4.45L21.97,5.45L16.74,14.5L10.23,10.75L5.46,19H22V21H2V3H4V17.54L9.5,8L16,11.78Z' style='fill:%2326324B;' /%3E%3C/svg%3E");
}
#sidebar-nav ul li[data-menu="data"] a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21,11C21,16.55 17.16,21.74 12,23C6.84,21.74 3,16.55 3,11V5L12,1L21,5V11M12,21C15.75,20 19,15.54 19,11.22V6.3L12,3.18L5,6.3V11.22C5,15.54 8.25,20 12,21M12,6A3,3 0 0,1 15,9C15,10.31 14.17,11.42 13,11.83V14H15V16H13V18H11V11.83C9.83,11.42 9,10.31 9,9A3,3 0 0,1 12,6M12,8A1,1 0 0,0 11,9A1,1 0 0,0 12,10A1,1 0 0,0 13,9A1,1 0 0,0 12,8Z' style='fill:%2326324B;' /%3E%3C/svg%3E");
}
#sidebar-nav ul li[data-menu="contact"] a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M20 4H4C2.9 4 2 4.9 2 6V18C2 19.1 2.9 20 4 20H20C21.1 20 22 19.1 22 18V6C22 4.9 21.1 4 20 4M20 18H4V6H20V18M4 0H20V2H4M4 22H20V24H4M12 12C13.38 12 14.5 10.88 14.5 9.5S13.38 7 12 7 9.5 8.12 9.5 9.5 10.62 12 12 12M12 8.5C12.55 8.5 13 8.95 13 9.5S12.55 10.5 12 10.5 11 10.05 11 9.5 11.45 8.5 12 8.5M17 16C17 13.9 13.69 13 12 13S7 13.9 7 16V17H17V16M8.81 15.5C9.42 15 10.84 14.5 12 14.5C13.17 14.5 14.59 15 15.2 15.5H8.81Z' style='fill:%2326324B;' /%3E%3C/svg%3E");
}
#sidebar-nav ul li.login-link a::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19,3H5C3.89,3 3,3.89 3,5V9H5V5H19V19H5V15H3V19A2,2 0 0,0 5,21H19A2,2 0 0,0 21,19V5C21,3.89 20.1,3 19,3M10.08,15.58L11.5,17L16.5,12L11.5,7L10.08,8.41L12.67,11H3V13H12.67L10.08,15.58Z' style='fill:%23FFF;' /%3E%3C/svg%3E");
}

/* sidebar on smaller screens: */
@media (max-width: 768px) {
	
	#navigation-layout.has-sidebar-left {
		display: grid;
		grid-template-columns: 2.2rem auto;
		column-gap: 8px;
	}

	#sidebar-nav {
		margin-top: 6pt;
		width: 2.2rem;
		overflow: hidden;
	}
	#sidebar-nav header {
		display: block;
	}
	#sidebar-nav ul {
		background-color: transparent;
	}
	#sidebar-nav header button span,
	#sidebar-nav ul li a span {
		display: none;
	}
	#sidebar-nav ul:hover,
	#sidebar-nav ul[aria-hidden="false"] {
		background-color: #F8F9FD;
		position: absolute;
		z-index: 3;
		-webkit-box-shadow:  2px 2px 4px 1px rgba(0, 0, 0, 0.33);
		box-shadow:  2px 2px 4px 1px rgba(0, 0, 0, 0.33);
		min-width: 12em;
	}
	#sidebar-nav ul:hover li a span,
	#sidebar-nav ul[aria-hidden="false"] li a span {
		display: inline-block;
	}
}

/* mark links to other languages: */
main a[hreflang]::after {
  display: inline-block;
  color: #4A4A4F;
  background-color: #EDEDF0;
  border: #CACAD1 solid 1px;
  border-radius: 3pt;
  font-size: .75em;
  padding: 0 2pt;
  text-decoration: none;
  margin-left: .25em;
}
main a[hreflang]::after {
	content: attr(hreflang);
	text-transform: uppercase;
}
main a[hreflang][href$=".pdf"]::after {
	content: 'PDF, ' attr(hreflang);
	padding-left: 1pt;
}

/* override template colours */
main a:focus, main input:focus, main button:focus {outline-color: #A8CF4C; border-radius: .15em;}
main a:link, main a:visited {color: #4755A0;}
main a:focus {outline-color: #A8CF4C; border-radius: .15em;}
main textarea:focus, main select:focus {outline-color: #A8CF4C; border-radius: .15em;}
main #toTopButton a:link {background-color:  #4755A044;}

/* avoid line breaks in special cases: */
main .no-break { white-space: nowrap; }

/* print modes for IMI */
@media print {
	#headline-breadcrumbs {
		display: none;
	}
	#navigation-layout {
		display: block !important;
		width: 100%;
	}
}