/*
	BRIDGE TRAINING
	http://bridge-training.com

	Design et styles du portail (page d’accueil)
	Feuille de styles de la page (CSS)

	Vincent Jockin 2010-2022 / Web·Art·Media
*/




/*	—————————————————————————————— */
/*	Polices de caractères (fontes) */
/*	—————————————————————————————— */

	@font-face {
		font-family: "PCKT";
		src: url('fonts/cards.eot');
		src: url('fonts/cards.eot?#iefix') format('embedded-opentype'),
			 url('fonts/cards.woff') format('woff'),
			 url('fonts/cards.ttf') format('truetype');
	}



/*	—————————————————————————————————— */
/*	Généralités et classes prédéfinies */
/*	—————————————————————————————————— */

	body {
		color: #000;
		background: #fff;
		font-family: 'Montserrat', sans-serif;
		font-size: .9rem;
		font-weight: 400;
		letter-spacing: -.02rem;
	}
	body.bt-scroll {
		overflow: hidden;
	}

	/* Titrages (headings) */
	h1, h2, h3 {
		margin: 0px;
		text-align: center;
	}
	h2, h3 {
		font-weight: 600;
		text-align: center;
	}
	h1 {
		line-height: 2rem;
		padding-top: 9rem;
		font-size: 1.35rem;
		font-weight: 400;
		letter-spacing: -.03rem;
	}

	/* Graisse */
	b { font-weight: 500; }
	strong { font-weight: 600; }

	/* Couleurs de texte */
	u[class^="bt-"] {
		font-weight: 500;
		text-decoration: none !important;
	}
	u.bt-red { color: #cc004c; }
	u.bt-orange { color: #f37021; }
	u.bt-gold { color: #f79419; }
	u.bt-yellow { color: #fcb711; }
	u.bt-green { color: #0db14b; }
	u.bt-blue { color: #0089d0; }
	u.bt-marin { color: #3274bd; }
	u.bt-purple { color: #6460aa; }




/*	————————————————————— */
/*	Navigations & boutons */
/*	————————————————————— */

	/* Boutons */
	button.btn {
		background: #fff;
		height: 2rem;
		line-height: 1rem;
		vertical-align: baseline;
		border-color: #7a7f7d;
	}
	button.btn:hover {
		color: #fff;
		background: #000;
		border-color: #1a1f1d;
		transition: all .15s;
	}
	button.btn:focus {
		box-shadow: 0px 0px .125rem .125rem rgba(0,0,0,.25);
	}

	/* Navigation par onglets */
	nav {
		margin-top: -.25rem;
	}

	/* Language switch */
	nav .language {
		position: relative;
    z-index: 200;
	}
	.language > div {
		position: relative;
		cursor: pointer;
		padding-bottom: 1.25em;
	}
	.language #indicator {
		width: 1.25em;
		vertical-align: bottom;
		display: inline;
	}
	.language .flag {
		width: 1.5625em;
		aspect-ratio: 600 / 400;
		display: inline-block;
	}
	.language ul {
		margin: 0;
		padding: 0;
		list-style: none;
		position: relative;
		display: none;
	}
	.language div:hover ul {
		position: absolute;
		top: 1.5625em;
		left: -1.1em;
		display: block;
		background-color: #fff;
		width: 3.75em;
		padding-top: 0;
		z-index: 1;
		border-radius: 0.3125em;
		box-shadow: 0px 0px 0.8em rgba(0, 0, 0, 0.2);
	}
	.language li {
		position: relative;
		text-align: left;
		background: transparent;
		z-index: 2;
		color: #3c3c3c;
		text-align: center;
		border-radius: 0.3125em;
	}
	.language li:first-child {
		border-radius: 0.3125em 0.3125em 0 0;
	}
	.language li:last-child {
		border-radius: 0 0 0.3125em 0.3125em;
	}
	.language li a {
		text-decoration: none;
		cursor: pointer;
		color: #3c3c3c;
	}
  .language li a svg {
    margin: 0.75em;
  }
	.language li:hover,
	.language li:hover a {
		background-color: #0089d0;
		color: white;
	}

/*	———————————————————————————————— */
/*	Sections & conteneurs principaux */
/*	———————————————————————————————— */

	main {
		position: relative;
		display: block;
		width: 100vw;
	}
	article, section {
		position: relative;
		display: block;
		width: 100%;
	}

	.container-fluid {
		padding-left: 2rem;
		padding-right: 2rem;
	}
	.bt-centered {
		text-align: center;
	}
	.bt-cache {
		position: absolute;
		left: 0px;
		top: 0px;		
		opacity: 0;
	}

	/* Header & Footer */
	header, footer {
		z-index: 99;
		position: fixed;
		background: #fff;
		width: 100vw;
		left: 0px;
		padding: 1rem 0px;
	}

	/* Header */
	header {
		top: 0px;
	}
	header div {
		position: relative;
	}
	header div,
	header img {
		height: 6rem;
	}
	header img {
		position: absolute;
		left: 50%;
		top: 0px;
		cursor: pointer;
		transform: translateX(-50%);
		transition: width .25s, height .25s, left .25s;
	}
	header nav {
		position: absolute;
		right: 0px;
		top: 0px;
		padding-right: inherit;
	}
	/* Liens et ancres */
	header a,
	header a:link,
	header a:visited {
		color: #6460aa;
	}
	header a:hover,
	header a:active,
	header a:focus {
		color: #cc004c;
	}

	/* Footer */
	footer {
		min-width: 20rem;
		height: 4rem;
		line-height: 2rem;
		bottom: 0px;
		white-space: nowrap;
	}
	/* Éléments cachés */
	footer span.bt-copyright-2,
	html[lang="fr"] footer .bt-en,
	html[lang="en"] footer .bt-fr,
	html[lang="es"] footer .bt-fr,
	html[lang="el"] footer .bt-fr,
	html[lang="pt"] footer .bt-fr,
	html[lang="sv"] footer .bt-fr {
		display: none;
	}
	/* Liens et ancres */
	footer a,
	footer a:link,
	footer a:visited {
		color: #6460aa;
		font-weight: 600;
		text-decoration: none;
	}
	footer a:hover,
	footer a:active,
	footer a:focus {
		color: #cc004c;
	}




/*	——————————————— */
/*	Écran d’accueil */
/*	——————————————— */

	/* Conteneur principal */
	#bt-home-screen {
		background: #fff;
		overflow: hidden;
	}
	#bt-home-screen.bt-visible {
		height: 100vh;
		min-height: 100vh;
		max-height: 100vh;
	}
	#bt-home-screen.bt-hidden {
		height: 0px;
		min-height: 0px;
	}
	#bt-home-screen.bt-prev {
		z-index: 1;
		position: absolute;
		background: #fff;
		left: 0px;
		right: 0px;
		top: -100vh;
		margin: 0px;
		padding: inherit;
		opacity: 0;
	}

	/* Titrages & boutons */
	#bt-home-steps [id^="bt-button-"].btn {
		position: absolute;
		width: 24rem;
		height: 5rem;
		left: 50%;
		bottom: 0px;
		padding: .9rem 2rem 1.1rem 2rem;
		font-size: 1.8rem;
		font-weight: 600;
		letter-spacing: -.04rem;
		white-space: nowrap;
		transform: translate(-50%,50%);
	}
	#bt-home-steps [id^="bt-button-"].btn .glyphicons {
		top: 0px;
		margin-right: 1rem;
		font-size: 2.5rem;
		vertical-align: -.5rem;
	}
	#bt-home-steps article[id*="create"] [id^="bt-button-"].btn {
		color: #0089d0;
		background: #fff;
		border-color: #0089d0;
	}
	#bt-home-steps article[id*="play"] [id^="bt-button-"].btn {
		color: #0db14b;
		background: #fff;
		border-color: #0db14b;
	}
	#bt-home-steps article[id*="create"] [id^="bt-button-"].btn:hover,
	#bt-home-steps article[id*="play"] [id^="bt-button-"].btn:hover {
		color: #fff;
		background: #fcb711;
		border-color: #eca701;
	}

	/* Deux étapes */
	#bt-home-steps {
		height: calc(100vh - 27rem);
		margin-top: 2rem;
	}
	#bt-home-steps h2 {
		line-height: 2.5rem;
		margin-bottom: 1rem;
		font-size: 1.8rem;
		letter-spacing: -.04rem;
		white-space: nowrap;
	}
	#bt-home-steps h3 {
		line-height: 3rem;
		font-size: 1.57rem;
		letter-spacing: -.035rem;
		white-space: nowrap;
	}
	#bt-home-steps h3 .glyphicons {
		margin-left: .5rem;
		vertical-align: -.125rem;
		cursor: pointer;
		transition: all .25s;
	}
	#bt-home-steps h3 .glyphicons:hover {
		color: #fcb711;
	}
	#bt-home-steps article[id*="create"] h3 {
		color: #0089d0;
	}
	#bt-home-steps article[id*="play"] h3 {
		color: #0db14b;
	}
	#bt-home-steps article[id^="bt-home-step-"] {
		width: 50%;
		height: calc(100% - 3.5rem);
		padding: 0px 3rem;
	}
	#bt-home-steps article[id^="bt-home-step-"].bt-open {
		z-index: 1;
	}
	#bt-home-steps article[id^="bt-home-step-"].bt-closed {
		z-index: 0;
		opacity: 0;
	}
	#bt-home-steps article[id*="create"] {
		float: left;
	}
	#bt-home-steps article[id*="play"] {
		float: right;		
	}
	#bt-home-steps article[id^="bt-home-step-"] div {
		position: relative;
		display: block;
		color: #fff;
		width: 100%;
		height: calc(100% - 3rem);
		line-height: 1.75rem;
		margin: 0px;
		padding: 2rem 2.25rem 0px 2.25rem;
		font-size: 1rem;
		font-weight: 400;
		letter-spacing: -.0225rem;
		text-align: center;
		border-radius: .25rem;
		overflow: hidden;
	}
	#bt-home-steps article[id^="bt-home-step-"] div::after {
		z-index: 0;
		content: '';
		position: absolute;
		width: calc(100% - 4px);
		height: 7.5rem;
		left: 2px;
		right: 2px;
		bottom: 0px;
	}
	#bt-home-steps article[id*="create"] div {
		background: #0089d0;
	}
	#bt-home-steps article[id*="create"] div::after {
		background: linear-gradient(transparent, #0089d0 66.66%);
	}
	#bt-home-steps article[id*="play"] div {
		background: #0db14b;
	}
	#bt-home-steps article[id*="play"] div::after {
		background: linear-gradient(transparent, #0db14b 66.66%);
	}




/*	——————————— */
/*	Chapitrages */
/*	——————————— */

	/* Conteneur principal */
	[class*="bt-chapter-"].bt-visible {
		background: none;
		height: initial;
		min-height: 100vh;
	}
	[class*="bt-chapter-"].bt-hidden {
		background: none;
		height: 0px;
		min-height: 0px;
		overflow: hidden;
	}
	[class*="bt-chapter-"].bt-prev,
	[class*="bt-chapter-"].bt-next {
		z-index: 1;
		position: absolute;
		background: #fff;
		left: 0px;
		right: 0px;
		margin: 0px;
		padding: inherit;
		opacity: 0;
	}
	[class*="bt-chapter-"].bt-prev {
		top: -100vh;
	}
	[class*="bt-chapter-"].bt-next {
		top: 100vh;
	}

	/* Titrages & sections */
	body.bt-onepage [class*="bt-chapter-"] h2 {
		padding-top: calc(9rem - 1px);
		border-top: 1px dashed #7a7f7d;
	}
	body:not(.bt-onepage) [class*="bt-chapter-"] h2 {
		padding-top: 9rem;
	}
	[class*="bt-chapter-"] h2 {
		line-height: 3rem;
		font-size: 1.8rem;
		letter-spacing: -.04rem;
	}
	[class*="bt-chapter-"] h3 {
		line-height: 2rem;
		margin-bottom: 3rem;
		font-size: 1.35rem;
		letter-spacing: -.03rem;
	}
	[class*="bt-page-"] h2,
	[class*="bt-page-"] h3 {
		line-height: 2.25rem;
		text-align: left;
	}
	[class*="bt-page-"] h2 {
		margin-bottom: 2.25rem;
		padding-top: 4.5rem;
		font-size: 1.8rem;
		letter-spacing: -.04rem;
	}
	[class*="bt-page-"] h3 {
		margin-bottom: 1.125rem;
		font-size: 1.575rem;
		letter-spacing: -.035rem;
	}
	[class*="bt-page-"] h2 span {
		font-weight: 400;
	}
	[class*="bt-page-"] h2 span::before {
		content: ' — ' ;
	}
	[class*="bt-chapter-"] > div,
	[class*="bt-page-"] > div {
		line-height: 2.25rem;
		font-size: 1.35rem;
		letter-spacing: -.03rem;
	}
	[class*="bt-chapter-"] > div:last-child {
		padding-bottom: 6rem;
	}
	[class*="bt-page-"] > div:last-child {
		padding-bottom: 8.5rem;
	}
	[class*="bt-chapter-"] > div.text-justify {
		text-align: justify;
	}
	[class*="bt-chapter-"] > div::after {
		content: '';
		display: table;
		clear: both;
	}

	/* Illustrations */
	[class*="bt-chapter-"] [class^="bt-image"] {
		padding: calc(.5rem - 1px);
		border: 1px dashed #7a7f7d;
		border-radius: .25rem;
	}
	[class*="bt-chapter-"] .bt-image-full,
	[class*="bt-chapter-"] [class^="bt-image-top"] {
		display: block;
		margin: .25rem auto 2.5rem auto;
	}
	[class*="bt-chapter-"] .bt-image-full {
		width: 100%;
	}
	[class*="bt-chapter-"] .bt-image-top-1 {
		height: 8rem;
	}
	[class*="bt-chapter-"] .bt-image-top-2 {
		height: 16rem;
	}
	[class*="bt-chapter-"] .bt-image-left {
		float: left;
		height: calc(100vh - 25.25rem - 1px);
		margin: .25rem 3rem 0px 0px;
	}
	[class*="bt-chapter-"] .bt-icon {
		width: auto;
		height: 4.5rem;
	}
	[class*="bt-chapter-"] .bt-icon-in-text {
		width: auto;
		height: 1.5rem;
		margin-top: -.25rem;
	}

	/* Colonnes */
	[class*="bt-chapter-"] > div [class^="bt-column"],
	[class*="bt-page-"] > div [class^="bt-column"] {
		margin: 0px;
	}
	[class*="bt-chapter-"] > div .bt-column-1,
	[class*="bt-page-"] > div .bt-column-1 {
		float: left;
		padding-right: 1.5rem;
	}
	[class*="bt-chapter-"] > div .bt-column-2,
	[class*="bt-page-"] > div .bt-column-2 {
		float: right;		
		padding-left: 1.5rem;
	}
	[class*="bt-chapter-"] > div [class^="bt-column"]::after,
	[class*="bt-page-"] > div [class^="bt-column"]::after {
		content: '';
		display: table;
		clear: both;
	}
	[class^="bt-column-"].bt-1-of-2 { width: 50%; }
	[class^="bt-column-"].bt-2-of-5 { width: 40%; }
	[class^="bt-column-"].bt-3-of-5 { width: 60%; }
	[class^="bt-column-"].bt-1-of-3 { width: 33.34%; }
	[class^="bt-column-"].bt-2-of-3 { width: 66.66%; }
	[class^="bt-column-"].bt-bottom {
		padding-bottom: 8.5rem;
	}

	/* Table spécifique */
	[class*="bt-chapter-"] > div table {
		float: left;
		width: calc(100% - 6rem - ((100vh - 25rem) * .56));
	}
	[class*="bt-chapter-"] > div table tr td {
		padding-top: 2rem;
	}
	[class*="bt-chapter-"] > div table tr td:first-child {
		padding-right: 3rem;
		vertical-align: middle;
	}

	/* Aide & Accéssibilité */
	[class*="bt-chapter-"] > div [class^="bt-btn"],
	[class*="bt-chapter-"] > div [class^="bt-section"],
	[class*="bt-chapter-"] > div .bt-alert {
		position: relative;
		line-height: 1;
		margin: 0px .125rem;
		padding: 0px .75rem;
		font-size: 80%;
		white-space: nowrap;
		vertical-align: 1px;
	}
	[class*="bt-chapter-"] > div [class^="bt-btn"]:not(.bt-btn-select),
	[class*="bt-chapter-"] > div [class^="bt-section"],
	[class*="bt-chapter-"] > div .bt-alert {
		color: #fff;
		font-weight: 600;
	}
	[class*="bt-chapter-"] > div .bt-alert {
		font-size: 100%;
	}
	[class*="bt-chapter-"] > div [class^="bt-btn"]::before,
	[class*="bt-chapter-"] > div [class^="bt-section"]::before,
	[class*="bt-chapter-"] > div .bt-alert::before {
		z-index: -1;
		content: '';
		position: absolute;
		width: 100%;
		height: 150%;
		left: 50%;
		top: 50%;
		border-radius: .25rem;
		transform: translate(-50%,-50%);
	}
	[class*="bt-chapter-"] > div .bt-btn::before,
	[class*="bt-chapter-"] > div .bt-section::before {
		background: #0089d0;
		border: 1px solid #0079c0;
	}
	[class*="bt-chapter-"] > div .bt-btn-alternate::before,
	[class*="bt-chapter-"] > div .bt-section-alternate::before {
		background: #f79419;
		border: 1px solid #e78409;
	}
	[class*="bt-chapter-"] > div .bt-btn::before,
	[class*="bt-chapter-"] > div .bt-btn-alternate::before {
		box-shadow: 0px 0px .075rem .075rem rgba(0,0,0,.25)
	}
	[class*="bt-chapter-"] > div .bt-btn-select::before {
		background: #f2f2f2;
		border: 1px solid #929292;
	}
	[class*="bt-chapter-"] > div .bt-alert::before {
		background: #4678b6;
		height: 133%;
		border: 1px solid #063876;
	}

	/* Courriels */
	span.bt-email {
		color: #6460aa;
		cursor: pointer;
		transition: color .15s;
	}
	span.bt-email:hover {
		color: #cc004c;
	}
	span.bt-email.bt-none {
		font-weight: 600;
	}
	span.bt-email:not(.bt-none)::before {
		content: attr(data-service);
	}
	span.bt-email:not(.bt-none)::after {
		content: 'bridge-training.com';
	}

	/* Liens et ancres */
	[class*="bt-chapter-"] > div a,
	[class*="bt-chapter-"] > div a:link,
	[class*="bt-chapter-"] > div a:visited,
	[class*="bt-page-"] > div a,
	[class*="bt-page-"] > div a:link,
	[class*="bt-page-"] > div a:visited {
		color: #6460aa;
		font-weight: 500;
		text-decoration: none;
	}
	[class*="bt-chapter-"] > div a:hover,
	[class*="bt-chapter-"] > div a:active,
	[class*="bt-chapter-"] > div a:focus,
	[class*="bt-page-"] > div a:hover,
	[class*="bt-page-"] > div a:active,
	[class*="bt-page-"] > div a:focus {
		color: #cc004c;
	}
	[class*="bt-page-"] > div a.bt-link {
		font-weight: 600;
	}
	[class*="bt-page-"] > div a.bt-link .glyphicons {
		transition: margin .25s;
	}
	[class*="bt-page-"] > div a.bt-link:hover .glyphicons {
		margin: 0px 1% 0px 2%;
	}

	/* Séparateurs & divers formatages */
	[class*="bt-chapter-"] > div .bt-separate,
	[class*="bt-page-"] > div .bt-separate {
		display: block;
		width: 100%;
		height: 2.25rem;
		margin: 0px;
		padding: 0px;
	}
	[class*="bt-chapter-"] > div .bt-number {
		line-height: 1;
		font-family: 'Times New Roman', serif;
		font-size: 120%;
	}
	[class*="bt-chapter-"] > div .bt-red {
		color: #da322e;
	}
	[class*="bt-chapter-"] > div i {
		font-family: 'PCKT';
		font-style: normal;
	}
	[class*="bt-page-"] > div .glyphicons {
		color: #000;
		margin: 0px 1.5%;
		vertical-align: -10%;
	}
	[class*="bt-page-"] > div sup {
		top: -.375em;
	}



/*	—————————————————————————————————— */
/*	Boutons de navigation (chapitrage) */
/*	—————————————————————————————————— */

	body.bt-onepage [id^="bt-nav-button-"],
	body:not(.bt-onepage) [id^="bt-nav-button-"].bt-disabled {
		cursor: default !important;
		pointer-events: none !important;
		opacity: 0;
	}
	body:not(.bt-onepage) [id^="bt-nav-button-"]:not(.bt-disabled) {
		cursor: pointer;
		opacity: 1;
	}
	[id^="bt-nav-button-"] {
		z-index: 100;
		position: absolute;
		background: #fff;
		display: block;
		width: 4rem;
		height: 4rem;
		right: -.375rem;
		font-size: 4rem;
		border-radius: 50%;
		transition: opacity .75s, color .15s;
	}
	#bt-nav-button-prev {
		top: 100%;
		transform: translate(-50%,-50%) rotate(180deg);
	}
	#bt-nav-button-next {
		top: 0;
		transform: translate(-50%,-50%);
	}
	[id^="bt-nav-button-"].bt-create { color: #0089d0; }
	[id^="bt-nav-button-"].bt-play { color: #0db14b; }
	[id^="bt-nav-button-"].bt-create:hover,
	[id^="bt-nav-button-"].bt-play:hover { color: #fcb711; }




/*	———————————————————————— */
/*	Résolutions alternatives */
/*	———————————————————————— */


	/* Selon la largeur de l’écran */

	@media only screen and (min-width: 94rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			padding: 0px calc((100% - 90rem) / 2);
		}

		/* Chapitrages */
		[class*="bt-chapter-"],
		[class*="bt-chapter-"].bt-prev,
		[class*="bt-chapter-"].bt-next,
		[class*="bt-page-"] {
			padding: 0px calc((100% - 90rem) / 2);
		}
	}

	@media only screen and (min-width: 90rem)
	{
		/* Colonnes */
		[class*="bt-chapter-"] > div .bt-column-1,
		[class*="bt-page-"] > div .bt-column-1 {
			padding-right: 2.5rem;
		}
		[class*="bt-chapter-"] > div .bt-column-2,
		[class*="bt-page-"] > div .bt-column-2 {
			padding-left: 2.5rem;
		}
	}

	@media only screen and (min-width: 67.5rem) and (max-width: 90rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id*="create"] {
			padding: 0px 1.5rem 0px 0px;
		}
		#bt-home-steps article[id*="play"] {
			padding: 0px 0px 0px 1.5rem;
		}
		#bt-home-steps #bt-button-create.btn {
			left: calc(50% - .75rem);
		}
		#bt-home-steps #bt-button-play.btn {
			left: calc(50% + .75rem);
		}

		/* Sections & conteneurs principaux */
		[class*="bt-chapter-"] > div,
		[class*="bt-page-"] > div {
			line-height: 2.0625rem;
			font-size: 1.2rem;
			letter-spacing: -.0275rem;
		}
		[class*="bt-page-"] h2,
		[class*="bt-page-"] h3 {
			line-height: 2.0625rem;
		}
		[class*="bt-page-"] h2 {
			margin-bottom: 2.0625rem;
			padding-top: 4.125rem;
			font-size: 1.7rem;
			letter-spacing: -.0375rem;
		}
		[class*="bt-page-"] h3 {
			margin-bottom: 1.03125rem;
			font-size: 1.5rem;
			letter-spacing: -.0325rem;
		}
		[class*="bt-page-"] > div:last-child {
			padding-bottom: 8.125rem;
		}
		[class*="bt-page-"] > div .bt-separate {
			height: 2.0625rem;
		}
	}

	@media only screen and (min-width: 60rem) and (max-width: 67.5rem)
	{
		/* Écran d’accueil */
		#bt-home-screen h1 {
			line-height: 1.875rem;
			font-size: 1.2rem;
			letter-spacing: -.0275rem;
		}
		#bt-home-steps {
			height: calc(100vh - 26.5rem);
		}
	}

	@media only screen and (max-width: 58rem)
	{
		/* Illustrations */
		[class*="bt-chapter-"] .bt-image-top-1 {
			width: 100%;
			height: auto;
		}
	}

	@media only screen and (min-width: 50rem) and (max-width: 67.5rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id*="create"] {
			padding: 0px 1rem 0px 0px;
		}
		#bt-home-steps article[id*="play"] {
			padding: 0px 0px 0px 1rem;
		}
		#bt-home-steps #bt-button-create.btn {
			left: calc(50% - .5rem);
		}
		#bt-home-steps #bt-button-play.btn {
			left: calc(50% + .5rem);
		}

		/* Sections & conteneurs principaux */
		[class*="bt-chapter-"] > div,
		[class*="bt-page-"] > div {
			line-height: 1.875rem;
			font-size: 1.125rem;
			letter-spacing: -.025rem;
		}
		[class*="bt-page-"] h2,
		[class*="bt-page-"] h3 {
			line-height: 1.875rem;
		}
		[class*="bt-page-"] h2 {
			margin-bottom: 1.875rem;
			padding-top: 3.75rem;
			font-size: 1.5rem;
			letter-spacing: -.0325rem;
		}
		[class*="bt-page-"] h3 {
			margin-bottom: .9375rem;
			font-size: 1.35rem;
			letter-spacing: -.03rem;
		}
		[class*="bt-page-"] > div:last-child {
			padding-bottom: 7.75rem;
		}
		[class*="bt-page-"] > div .bt-separate {
			height: 1.875rem;
		}

		/* Boutons de navigation */
		[id^="bt-nav-button-"] {
			width: 3rem;
			height: 3rem;
			right: -.25rem;
			font-size: 3rem;
		}
	}

	@media only screen and (min-width: 50rem) and (max-width: 60rem)
	{
		/* Écran d’accueil */
		#bt-home-screen h1 {
			line-height: 1.75rem;
			font-size: 1.125rem;
			letter-spacing: -.025rem;
		}
		#bt-home-steps {
			height: calc(100vh - 26.25rem);
		}
	}

	@media only screen and (max-width: 50rem)
	{
		/* Header */
		header div,
		header img {
			height: 5rem;
		}
		header img {
			position: relative;
			left: 0px;
			transform: translateX(0);
		}

		/* Footer */
		footer {
			line-height: 1rem;
			font-size: .675rem;
			letter-spacing: -.015rem;
		}
		footer span.bt-copyright-1 { display: none; }
		footer span.bt-copyright-2 { display: block; }

		/* Écran d’accueil */
		#bt-home-screen h1 {
			line-height: 3vw;
			padding-top: 7rem;
			font-size: 2.25vw;
			letter-spacing: -.05vw;
			text-align: left;
		}
		#bt-home-screen h1 br {
			display: none;
		}
		#bt-home-steps {
			height: calc(100vh - 19rem - 9vw);
		}
		#bt-home-steps h2 {
			font-size: 1.35rem;
			letter-spacing: -.03rem;
		}
		#bt-home-steps h3 {
			font-size: 1.125rem;
			letter-spacing: -.025rem;
		}
		#bt-home-steps article[id*="create"] {
			padding: 0px .75rem 0px 0px;
		}
		#bt-home-steps article[id*="play"] {
			padding: 0px 0px 0px .75rem;
		}

		/* Sections & conteneurs principaux */
		[class*="bt-chapter-"] h2 {
			line-height: 2rem;
			font-size: 1.35rem;
			letter-spacing: -.03rem;
		}
		[class*="bt-chapter-"] h3 {
			line-height: 1.5rem;
			font-size: 1.125rem;
			letter-spacing: -.025rem;
		}
		[class*="bt-chapter-"] > div,
		[class*="bt-page-"] > div {
			line-height: 1.6875rem;
			font-size: 1rem;
			letter-spacing: -.0225rem;
		}
		[class*="bt-page-"] h2,
		[class*="bt-page-"] h3 {
			line-height: 1.6875rem;
		}
		[class*="bt-page-"] h2 {
			margin-bottom: 1.6875rem;
			padding-top: 3.375rem;
			font-size: 1.35rem;
			letter-spacing: -.03rem;
		}
		[class*="bt-page-"] h3 {
			margin-bottom: .8375rem;
			font-size: 1.125rem;
			letter-spacing: -.025rem;
		}
		[class*="bt-page-"] > div:last-child {
			padding-bottom: 7.375rem;
		}
		[class*="bt-page-"] > div .bt-separate {
			height: 1.6875rem;
		}

		/* Boutons de navigation */
		[id^="bt-nav-button-"] {
			right: 1rem;
		}
		#bt-nav-button-prev {
			top: 66.66%;
		}
		#bt-nav-button-next {
			top: 50%;
		}
	}

	@media only screen and (max-width: 46rem)
	{
		/* Illustrations */
		[class*="bt-chapter-"] .bt-image-top-2 {
			width: 100%;
			height: auto;
		}
	}

	@media only screen and (min-width: 40rem) and (max-width: 67.5rem)
	{
		/* Sections & conteneurs principaux */
		.container-fluid {
			padding-left: 1.5rem;
			padding-right: 1.5rem;
		}
	}

	@media only screen and (min-width: 40rem) and (max-width: 50rem)
	{
		/* Boutons de navigation */
		[id^="bt-nav-button-"] {
			width: 2rem;
			height: 2rem;
			font-size: 2rem;
		}
	}

	@media only screen and (max-width: 40rem)
	{
		/* Sections & conteneurs principaux */
		.container-fluid {
			padding-left: 1rem;
			padding-right: 1rem;
		}

		/* Boutons de navigation */
		[id^="bt-nav-button-"] {
			width: 1.5rem;
			height: 1.5rem;
			font-size: 1.5rem;
		}
	}

	@media only screen and (min-width: 34.0625rem) and (max-width: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps #bt-button-create.btn {
			left: calc(50% - .375rem);
		}
		#bt-home-steps #bt-button-play.btn {
			left: calc(50% + .375rem);
		}
	}

	@media only screen and (max-width: 34rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id^="bt-home-step-"] {
			float: initial;
			position: absolute;
			display: block;
			width: 100%;
			padding: 0px;
		}
		#bt-home-steps article[id^="bt-home-step-"] div {
			display: inline-block;
			margin-bottom: -.5rem;
		}

		/* Élements dynamique */
		.bt-centered {
			text-align: left;
		}
	}

	@media only screen and (max-width: 20rem)
	{
		/* Écran d’accueil */
		#bt-home-screen.bt-visible {
			width: 18rem;
			min-width: 18rem;
			max-width: 18rem;
		}
		#bt-home-screen h1 {
			line-height: .625rem;
			font-size: .45rem;
			letter-spacing: -.01rem;
		}
	}


	/* Selon la hauteur d’écran */

	@media only screen and (max-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-screen h1 {
			display: none;
		}
	}

	@media only screen and (max-height: 42rem)
	{
		/* Écran d’accueil */
		#bt-home-steps h2 {
			display: none;
		}
	}

	@media only screen and (max-height: 34rem)
	{
		/* Écran d’accueil */
		#bt-home-steps h3 {
			font-size: 1.125rem;
			letter-spacing: -.025rem;
		}
	}

	@media only screen and (max-height: 30rem)
	{
		/* Écran d’accueil */
		#bt-home-screen.bt-visible {
			height: 30rem;
			min-height: 30rem;
			max-height: 30rem;
		}
	}


	/* Selon la largeur et la hauteur de l’écran */

	@media only screen and (min-width: 67.5rem) and (min-height: 37.5rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id^="bt-home-step-"] div {
			line-height: 2rem;
			font-size: 1.2rem;
			letter-spacing: -.0275rem;
		}
		.bt-if-space-only {
			display: none;
		}
	}

	@media only screen and (min-width:  54rem) and (max-width:  72rem) and (min-height: 44rem),
		   only screen and (min-height: 44rem) and (max-height: 54rem) and (min-width:  54rem)
	{
		/* Écran d’accueil */
		#bt-home-steps [id^="bt-button-"].btn {
			width: 18.75rem;
			height: 3.75rem;
			padding: .675rem 1.5rem .825rem 1.5rem;
			font-size: 1.35rem;
			letter-spacing: -.03rem;
		}
		#bt-home-steps [id^="bt-button-"].btn .glyphicons {
			margin-right: .75rem;
			font-size: 1.875rem;
			vertical-align: -.375rem;
		}
		#bt-home-steps article[id^="bt-home-step-"] div::after {
			height: 5.625rem;
		}
	}

	@media only screen and (min-width:  46rem) and (max-width:  54rem) and (min-height: 34rem),
		   only screen and (min-height: 34rem) and (max-height: 44rem) and (min-width:  46rem)
	{
		/* Écran d’accueil */
		#bt-home-steps [id^="bt-button-"].btn {
			width: 16rem;
			height: 3.2rem;
			padding: .576rem 1.28rem .704rem 1.28rem;
			font-size: 1.125rem;
			letter-spacing: -.025rem;
		}
		#bt-home-steps [id^="bt-button-"].btn .glyphicons {
			margin-right: .64rem;
			font-size: 1.6rem;
			vertical-align: -.32rem;
		}
		#bt-home-steps article[id^="bt-home-step-"] div::after {
			height: 4.8rem;
		}
	}

	@media only screen and (max-width:  50rem) and (max-height: 42rem),
		   only screen and (max-width:  46rem) and (min-height: 42rem),
		   only screen and (max-height: 34rem) and (min-width:  50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps [id^="bt-button-"].btn {
			width: 12.5rem;
			height: 2.5rem;
			padding: .45rem 1rem .55rem 1rem;
			font-size: .9rem;
			letter-spacing: -.02rem;
		}
		#bt-home-steps [id^="bt-button-"].btn .glyphicons {
			margin-right: .5rem;
			font-size: 1.25rem;
			vertical-align: -.25rem;
		}
		#bt-home-steps article[id^="bt-home-step-"] div::after {
			height: 3.75rem;
		}
	}

	@media only screen and (min-height: 42rem) and (max-height: 50rem) and (min-width: 34rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			height: calc(100vh - 18rem);
			margin-top: 8rem;
		}
	}

	@media only screen and (max-height: 42rem) and (min-width: 54rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			height: calc(100vh - 12.5rem);
			min-height: 17.5rem;
			margin-top: 8rem;
		}
	}

	@media only screen and (max-width: 54rem) and (max-height: 34rem)
	{
		#bt-home-steps article[id^="bt-home-step-"] {
			height: calc(100% - 3rem);
		}
	}

	@media only screen and (min-width: 50rem) and (max-width: 54rem) and (max-height: 42rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			height: calc(100vh - 11rem);
			min-height: 19rem;
			margin-top: 7rem;
		}
	}

	@media only screen and (max-width: 50rem) and (max-height: 42rem)
	{
		/* Écran d’accueil */
		#bt-home-steps h3 {
			font-size: 1rem;
			letter-spacing: -.0225rem;
		}
	}

	@media only screen and (min-width: 34rem) and (max-width: 50rem) and (max-height: 42rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			height: calc(100vh - 10rem);
			min-height: 20rem;
			margin-top: 6rem;
		}
	}

	@media only screen and (min-width: 50rem) and (max-height: 34rem),
		   only screen and (min-width: 34rem) and (max-width:  50rem) and (min-height: 34rem),
		   only screen and (max-width: 34rem) and (min-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id^="bt-home-step-"] div {
			line-height: 1.5rem;
			padding: 1.5rem 1.75rem 0px 1.75rem;
			font-size: .9rem;
			letter-spacing: -.02rem;
		}
	}

	@media only screen and (min-width: 34rem) and (max-width:  50rem) and (max-height: 34rem),
		   only screen and (max-width: 34rem) and (max-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id^="bt-home-step-"] div {
			line-height: 1.25rem;
			padding: 1rem 1.25rem 0px 1.25rem;
			font-size: .8rem;
			letter-spacing: -.0175rem;
		}
	}

	@media only screen and (min-width: 20rem) and (max-width: 34rem) and (min-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			height: calc(100vh - 15rem - 9vw);
		}
	}

	@media only screen and (max-width: 20rem) and (min-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			height: calc(100vh - 16.875rem);
		}
	}

	@media only screen and (max-width: 34rem) and (min-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id^="bt-home-step-"]:not(.bt-open) {
			height: calc(50% - 5.5rem);
		}
		#bt-home-steps article[id^="bt-home-step-"].bt-open {
			height: calc(100% - 7.5rem);
		}
		#bt-home-steps article[id*="create"] {
			top: 4.5rem;
		}
		#bt-home-steps article[id*="play"] {
			bottom: 3rem;
		}
	}

	@media only screen and (max-width: 34rem) and (max-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps {
			height: calc(100vh - 12rem);
			margin-top: 8rem;
		}
	}

	@media only screen and (max-width: 34rem) and (min-height: 42rem) and (max-height: 50rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id^="bt-home-step-"]:not(.bt-open) {
			height: calc(50% - 4.5rem);
		}
		#bt-home-steps article[id^="bt-home-step-"].bt-open {
			height: calc(100% - 7rem);
		}
		#bt-home-steps article[id*="create"] {
			top: 3.5rem;
		}
		#bt-home-steps article[id*="play"] {
			bottom: 3.5rem;
		}
	}

	@media only screen and (max-width: 34rem) and (min-height: 34rem) and (max-height: 42rem)
	{
		/* Écran d’accueil */
		#bt-home-steps article[id^="bt-home-step-"]:not(.bt-open) {
			height: calc(50% - 1.75rem);
		}
		#bt-home-steps article[id^="bt-home-step-"].bt-open {
			height: calc(100% - 1.5rem);
		}
		#bt-home-steps article[id*="create"] {
			top: -1.5rem;
		}
		#bt-home-steps article[id*="play"] {
			bottom: 3rem;
		}
	}

	@media only screen and (max-width: 34rem) and (max-height: 34rem)
	{
		/* Écran d’accueil */
		#bt-home-steps h3 {
			line-height: 2rem;
		}
		#bt-home-steps article[id^="bt-home-step-"]:not(.bt-open) {
			height: calc(50% - 1.5rem);
		}
		#bt-home-steps article[id^="bt-home-step-"].bt-open {
			height: calc(100% - 1rem);
		}
		#bt-home-steps article[id*="create"] {
			top: -1.5rem;
		}
		#bt-home-steps article[id*="play"] {
			bottom: 2.5rem;
		}
		#bt-home-steps article[id^="bt-home-step-"] div {
			height: calc(100% - 2rem);
		}
	}

	@media only screen and (max-width:   34rem) and (max-height:  48rem),
		   only screen and (min-width: 67.5rem) and (max-height:  34rem),
		   only screen and (min-width:   34rem) and (max-width: 67.5rem)
	{
		.bt-if-space-only {
			display: none;
		}
	}


	/* Selon l’orientation en mode “Paysage” (landscape) */

	@media only screen and (orientation: landscape)
	{
		/* Élements dynamique */
		.bt-screen-height,
		[class*="bt-image-"].bt-screen-height,
		[class*="bt-column"].bt-screen-height {
			display: none;
		}
	}


	/* Selon l’orientation en mode “Portrait” (portrait) */

	@media only screen and (orientation: portrait),
		   only screen and (max-width: 50rem)
	{
		/* Illustrations */
		[class*="bt-chapter-"] [class^="bt-image-top"] {
			width: 100%;
			height: auto;
			margin-left: 0px;
			margin-right: 0px;
		}

		/* Colonnes */
		[class*="bt-chapter-"] > div [class^="bt-column-"],
		[class*="bt-page-"] > div [class^="bt-column-"],
		[class^="bt-column-"][class^="bt-"] {
			float: initial;
			width: 100%;
			padding: 0px;
		}

		/* Table spécifique */
		[class*="bt-chapter-"] > div table {
			float: initial;
			width: 100%;
		}

		/* Élements dynamique */
		.bt-screen-width,
		[class*="bt-image-"].bt-screen-width,
		[class*="bt-column"].bt-screen-width {
			display: none;
		}
	}