/*
 * Aanpassingen voor tablets (iPad), bovenop de stijlen van de oude website (12-11-2026, ISS-70).
 * Een apart bestand, omdat de bestanden onder /_site/ een jaar in de browsercache blijven:
 * de bestaande stylesheets aanpassen komt bij bezoekers die ze al hebben niet aan.
 * Iets wijzigen? Zet het in een nieuw bestand of verhoog het versienummer in oud/head.mjs.
 */

/* Niets mag de pagina breder maken dan het scherm. general.css zet daarvoor overflow-x: hidden
   op html, maar Safari op de iPad houdt zich daar niet aan, waardoor je opzij kunt schuiven.
   Vooral de inschuif-animaties (slideInRight, fadeInRightBig) beginnen 2000px rechts van het scherm.
   'clip' maakt geen scrollcontainer, dus het plakkende menu en het verticale scrollen blijven gelijk.
   !important omdat website.js na het laden 'overflow: visible' direct op de body zet (preloader). */
body {
	overflow-x: clip !important;
}

/* Het citaatblok op de branchepagina's is vast 800px breed en heeft pas onder de 800px een kleinere
   versie. Tussen 801 en 991px past 800px niet in de kolom (720px) en stak het tot 830px buiten het
   scherm (iPad Air en iPad 10e generatie staand: 820px). Daarom tot 991px dezelfde kleine versie,
   met de waarden uit de <style> op die pagina's; 'body' ervoor, anders wint die <style>. */
@media screen and (min-width: 801px) and (max-width: 991px) {
	body .siteBlockquote {
		max-width: 550px;
		font-size: 8px;
	}
	body .siteBlockquote > div {
		font-size: 12px;
		top: 100px;
		padding-left: 120px;
		padding-right: 90px;
		line-height: 14px;
	}
	body .siteBlockquote > span {
		font-size: 8px;
		bottom: 120px;
	}
}

/* Menu: tot 1200px breed als hamburger, net als op de telefoon. Daarvoor stond het logo op een
   eigen regel en braken de menu-items over twee regels (189px hoog op een iPad staand,
   127px liggend, tegen 67px op een computer); het menu plakt bovenaan bij het scrollen. */
@media (min-width: 768px) and (max-width: 1199px) {
	.navbar-default .navbar-header {
		float: none;
	}
	.navbar-default .navbar-toggle {
		display: block;
	}
	.navbar-default .navbar-collapse {
		border-top: 1px solid #e7e7e7;
	}
	.navbar-default .navbar-collapse.collapse {
		display: none !important;
	}
	.navbar-default .navbar-collapse.collapse.in {
		display: block !important;
		overflow-y: auto !important;
	}
	.navbar-default .navbar-right {
		float: none !important;
		margin-right: 0;
	}
	.navbar-default .navbar-nav {
		float: none !important;
		margin: 7.5px 0;
	}
	.navbar-default .navbar-nav > li {
		float: none;
	}
	.navbar-default .navbar-nav > li > a {
		padding-top: 10px;
		padding-bottom: 10px;
	}
	/* 'Home' staat in het menu op de telefoon en op grote schermen; nu ook in het hamburgermenu. */
	.navbar-default .navbar-nav > li > a.visible-xs.visible-lg {
		display: block !important;
	}
}