/*
	TEMPLATE TRAVEL AGENCY - DIGITALLAOS - Framework grille

	Paliers responsive canoniques du theme, partages par .container, .row/.col-N
	et la taille des titres (css/travel-laos.css) :
	  - mobile    : max-width 736px  (.col-N-mobile)
	  - tablette  : max-width 980px  (.col-N-medium)
	  - desktop   : max-width 1280px
	  - grand ecran : au-dessus de 1280px (.container continue a retrecir
	    fluidement jusqu'a 1680px, cf. ci-dessous)
	Seule exception documentee : le seuil 840px du menu mobile (Responsive
	Nav + habillage du theme dans travel-laos.css), distinct du palier
	tablette pour rester propre au plugin de navigation.
*/

html, body, div, span, applet, object,
iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
pre, a, abbr, acronym, address, big, cite,
code, del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var, b,
u, i, center, dl, dt, dd, ol, ul, li, fieldset,
form, label, legend, table, caption, tbody,
tfoot, thead, tr, th, td, article, aside,
canvas, details, embed, figure, figcaption,
footer, header, hgroup, menu, nav, output, ruby,
section, summary, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

body {
	-webkit-text-size-adjust: none;
}

mark {
	background-color: transparent;
	color: inherit;
}

input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

input, select, textarea {
	-moz-appearance: none;
	-webkit-appearance: none;
	-ms-appearance: none;
	appearance: none;
}

/* Basic */

	html {
		box-sizing: border-box;
	}

	*, *:before, *:after {
		box-sizing: inherit;
	}
	.invisible { position:absolute; clip: rect(0, 0, 0, 0); overflow:hidden; margin:0; padding:0; width:1px; height:1px; white-space:nowrap; border: 0;}

/* Container */

	.container {
		margin: 0 auto;
		max-width: 100%;
		width: 1440px;
	}

		@media screen and (max-width: 1680px) {
			.container { width: 1200px; }
		}

		@media screen and (max-width: 1280px) {
			.container { width: 960px; }
		}

		@media screen and (max-width: 980px) {
			.container { width: 95%; }
		}

		@media screen and (max-width: 736px) {
			.container { width: 100%; padding: 0 1.5em; }
		}

/* Row / colonnes */

	.row {
		display: flex;
		flex-wrap: wrap;
		box-sizing: border-box;
		align-items: stretch;
	}

		.row > * {
			box-sizing: border-box;
		}

		.row.gtr-0 {
			margin-top: 0px;
			margin-left: 0px;
		}

			.row.gtr-0 > * {
				padding: 0px 0 0 0px;
			}

	/* Palier par defaut (desktop), aucune media query : col-1 a col-12 */
	.row > .col-1  { width: 8.33333%; }
	.row > .col-2  { width: 16.66667%; }
	.row > .col-3  { width: 25%; }
	.row > .col-4  { width: 33.33333%; }
	.row > .col-5  { width: 41.66667%; }
	.row > .col-6  { width: 50%; }
	.row > .col-7  { width: 58.33333%; }
	.row > .col-8  { width: 66.66667%; }
	.row > .col-9  { width: 75%; }
	.row > .col-10 { width: 83.33333%; }
	.row > .col-11 { width: 91.66667%; }
	.row > .col-12 { width: 100%; }

	/* Palier tablette : <=980px, meme seuil que le reste du site
	   (sidebars/menus qui basculent en colonne, cf. css/travel-laos.css) */
	@media screen and (max-width: 980px) {

		.row > .col-1-medium  { width: 8.33333%; }
		.row > .col-2-medium  { width: 16.66667%; }
		.row > .col-3-medium  { width: 25%; }
		.row > .col-4-medium  { width: 33.33333%; }
		.row > .col-5-medium  { width: 41.66667%; }
		.row > .col-6-medium  { width: 50%; }
		.row > .col-7-medium  { width: 58.33333%; }
		.row > .col-8-medium  { width: 66.66667%; }
		.row > .col-9-medium  { width: 75%; }
		.row > .col-10-medium { width: 83.33333%; }
		.row > .col-11-medium { width: 91.66667%; }
		.row > .col-12-medium { width: 100%; }

	}

	/* Palier mobile : <=736px, meme seuil que le reste du site */
	@media screen and (max-width: 736px) {

		.row > .col-1-mobile  { width: 8.33333%; }
		.row > .col-2-mobile  { width: 16.66667%; }
		.row > .col-3-mobile  { width: 25%; }
		.row > .col-4-mobile  { width: 33.33333%; }
		.row > .col-5-mobile  { width: 41.66667%; }
		.row > .col-6-mobile  { width: 50%; }
		.row > .col-7-mobile  { width: 58.33333%; }
		.row > .col-8-mobile  { width: 66.66667%; }
		.row > .col-9-mobile  { width: 75%; }
		.row > .col-10-mobile { width: 83.33333%; }
		.row > .col-11-mobile { width: 91.66667%; }
		.row > .col-12-mobile { width: 100%; }

	}

/* Section/Article — utilise par content/401.html et content/404.html */

	section.special, article.special {
		text-align: center;
	}

	header.major {
		padding-bottom: 2em;
	}

	header.special {
		margin-bottom: 5em;
		padding-top: 7em;
		position: relative;
		text-align: center;
	}

		header.special:before, header.special:after {
			border-bottom: solid 1.5px;
			border-top: solid 1.5px;
			content: '';
			height: 7px;
			opacity: 0.1;
			position: absolute;
			top: 1.75em;
			width: 43%;
		}

		header.special:before {
			left: 0;
		}

		header.special:after {
			right: 0;
		}

		header.special h2 {
			margin-bottom: 0;
		}

		header.special h2 + p {
			margin-bottom: 0;
			padding-top: 1.5em;
		}

		header.special .icon {
			cursor: default;
			height: 7em;
			left: 0;
			position: absolute;
			text-align: center;
			top: 1em;
			width: 100%;
		}

			header.special .icon:before {
				font-size: 3.5em;
				opacity: 0.35;
			}

	footer > :last-child {
		margin-bottom: 0;
	}

	footer.major {
		padding-top: 3em;
	}