* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	font-family: "Barlow Semi Condensed", sans-serif;
}

body {
	color: #2f3335;
	font-size: 18px;
	padding-top: 58px;
}

.audio-box {
	background: #fff;
	background: url(../images/audio-bg.png);
	background-size: cover;
	background-position: 10% center;
	border-radius: 12px;
	padding: 50px 20px 40px;
	text-align: center;
}

/* TYPO */

strong,
b {
	font-weight: 600;
}

dl,
ol,
ul {
	padding-left: 1.1em;
	margin-bottom: 0;
}

h2,
.h2 {
	font-size: 25px;
}

h2 .under-main-title {
	font-size: 0.85em;
}

ul:not(.nav) {
	list-style: none;
}

li:not(.nav-item, .second-level-list li)::before {
	content: "•";
	color: #f58a1d;
	font-size: 24px;
	line-height: 18px;
	display: inline-block;
	width: 19px;
	margin-left: -20px;
}

.second-level-list li {
	list-style: circle;
}

.second-level-list li::marker {
	color: #f58a1d;
}

.badge {
	padding: 0.15em 0.4em 0.25em;
}

/* Navbar */

.navbar {
	background: #fff;
}

.brand-right {
	margin-right: -10px;
	margin-left: 1rem;
}

.liens-extraits {
	margin-bottom: -45px;
}

.liens-extraits > div[class*="col-"] {
	margin-bottom: 45px;
}

.liens-extraits .a-venir,
.liens-extraits .a-venir2 {
	background: #fff;
	border-radius: 12px;
	display: flex;
	text-align: center;
	font-size: 24px;
	font-weight: 600;
	min-height: 290px;
	align-items: center;
	justify-content: center;
	height: 100%;
}

.a-venir2 {
	height: 90% !important;
}

/* Entête */

#header {
	background: white;
	background-image: url(../images/background-header-green-triangle.png);
	background-size: 140% auto;
	background-position: center top;
	padding: 40px 0;
	background-repeat: no-repeat;
}

.images-header img {
	width: 100%;
}

.img-sous-imgheader {
	border-radius: 10px;
}

.header-block {
	background: #fff;
	border-radius: 15px;
	padding: 40px 15px 35px;
	position: relative;
}

.header-block h3 {
	margin-top: 25px;
}

.header-block ul li {
	line-height: 135%;
	padding-bottom: 14px;
}

.main-title {
	color: #f58a1d;
	margin-bottom: 45px;
	font-weight: 600;
}

.sub-title {
	margin-top: 35px;
	line-height: 130%;
}

.sub-title2 h3 {
	font-size: 20px !important;
	margin-top: 45px;
	margin-bottom: -35px;
}

.alone-row .sub-title2 {
	margin-top: 20px;
}

.header-block h3 {
	color: #3294e0;
	font-size: 25px;
}

h3.cahier-title,
h3.guide-title {
	color: #ef4145;
}

/* Logo */

h1 {
	background: url(../images/top-upside.png);
	background-size: 100%;
	background-repeat: no-repeat;
	text-indent: -9999px;
	width: 400px;
	height: 100px;
	margin: 20px auto 40px;
}

.h1-title {
	color: #ffffff;
	margin-top: -80px;
	margin-bottom: 30px;
}

/* Tabs */

#tabs {
	padding-top: 50px;
}

.nav-link {
	color: #acb9bf;
}

.nav-link.active {
	border-bottom: 4px solid #3294e0;
	color: #3294e0;
}

.nav-link.no-hover {
	pointer-events: none;
}

/* Intro des extraits */

.tab-intro {
	background: #f0f0fa;
	padding-top: 70px;
	padding-bottom: 80px;
}

.tab-intro h2 {
	font-size: 30px;
	margin-bottom: 45px;
	text-align: center;
	text-transform: uppercase;
}

.extrait-livre.deux-colonnes {
	background: #fff;
}

.extrait-livre.deux-colonnes > .row > div[class^="col-"]:last-child {
	padding: 30px;
}

.row-extrait-livre > div[class^="col-"] {
	padding: 30px;
}

.extrait-livre a,
.liens-extraits a {
	display: block;
	position: relative;
}

.extrait-livre a:before,
.liens-extraits a:before {
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	background: #327ee6;
	position: absolute;
	left: 0;
	top: 0;
	opacity: 0;
	transition: ease-in-out all 0.25s;
}

.extrait-livre a:hover:before,
.liens-extraits a:hover:before {
	opacity: 0.6;
}

.extrait-livre h3 {
	font-weight: 600;
	font-size: 18px;
}

.extrait-livre:not(.deux-colonnes) h3 {
	margin-top: 12px;
}

.extrait-livre ul {
	padding-left: 21px;
	margin-top: 1em;
}

.extrait-livre ul li {
	line-height: 21px;
	padding-bottom: 14px;
	padding-left: 7px;
	position: relative;
}

.extrait-livre ul li:last-child {
	padding-bottom: 0;
}

.extrait-livre a {
	color: #2f3335;
}

.extrait-livre.deux-colonnes {
	background: #fff;
}

.extrait-livre.deux-colonnes > .row > div[class^="col-"]:last-child {
	padding: 30px;
}

.extrait-livre ul li::before {
	content: "";
	line-height: 18px;
	display: block;
	position: absolute;
	width: 17px;
	height: 21px;
	background-image: url(../images/iconepdf@3x.png);
	background-size: 17px 21px;
	background-position: top left;
	background-repeat: no-repeat;
	left: 0;
}

.extrait-livre.deux-colonnes {
	max-width: 320px;
}

.extrait-livre img {
	border: 1px solid #b7b5b5;
}

.tall-img {
	max-height: 272px;
	max-width: 192px;
}
.tall-img img {
	max-height: 272px;
	max-width: 192px;
}

/* Boite "Essai gratuit" */

.essai-gratuit {
	background: #436bff;
	background-image: url(../images/extrait-gb-bleu@3x.png);
	background-size: cover;
	background-position: right;
	border-radius: 10px;
	color: #fff;
	margin-top: 60px;
	min-height: 80px;
}

.essai-gratuit h3 {
	font-size: 30px;
	text-transform: uppercase;
}

.essai-gratuit {
	padding: 25px;
}
.essai-gratuit p {
	margin-bottom: 0;
}

.essai-gratuit .logo-iplus {
	margin-right: 3px;
}

.essai-gratuit .btn {
	background-image: url(../images/Fleche@3x.png);
	background-size: 14px 13px;
	background-repeat: no-repeat;
	background-position: calc(100% - 15px) 50%;
	border-radius: 25px;
	border-width: 2px;
	font-weight: 600;
	padding: 12px 40px 12px 15px;
	line-height: 130%;
}

.essai-gratuit .btn:hover {
	background-image: url(../images/Fleche-hover@3x.png);
	color: #327ee6;
}

.sub-title {
	margin-top: 35px;
	line-height: 130%;
}

/* Blocs des extraits/demo */

.extrait {
	padding-bottom: 85px;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fefefe+0,f0f0fa+100 */
	background: #fefefe;
	/* Old browsers */
	background: -moz-linear-gradient(top, #fefefe 0%, #f0f0fa 100%);
	/* FF3.6-15 */
	background: -webkit-linear-gradient(top, #fefefe 0%, #f0f0fa 100%);
	/* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom, #fefefe 0%, #f0f0fa 100%);
	/* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fefefe', endColorstr='#f0f0fa', GradientType=0);
	/* IE6-9 */
	overflow: visible;
}

.extrait.dernier-extrait {
	padding-bottom: 55px;
}

.extrait h3 {
	font-size: 30px;
	font-weight: 500;
}

.extrait.extrait-activite h3 {
	color: #00d776;
}

.extrait.extrait-visuel h3 {
	color: #ffaa00;
}

.extrait.extrait-dynamique h3 {
	color: #15aef1;
}

.extrait.extrait-video h3 {
	color: #f72a4b;
}

.extrait.extrait-audio h3 {
	color: #ff5e1f;
}

.extrait.extrait-hyperliens h3 {
	color: #ff3d9d;
}

.extrait.extrait-groupe h3 {
	color: #463aef;
}

.extrait h3:before {
	background-size: 100% 100%;
	content: "";
	display: block;
	width: 60px;
	height: 60px;
	margin: -30px auto 10px;
}

.extrait.extrait-activite h3:before {
	background-image: url(../images/icone-act-inter@3x.png);
}

.extrait.extrait-dynamique h3:before {
	background-image: url(../images/iconedynamique@3x.png);
}

.extrait.extrait-visuel h3:before {
	background-image: url(../images/iconevisuel@3x.png);
}

.extrait.extrait-video h3:before {
	background-image: url(../images/icone-video@3x.png);
}

.extrait.extrait-audio h3:before {
	background-image: url(../images/icone-audio@3x.png);
}

.extrait.extrait-hyperliens h3:before {
	background-image: url(../images/icone-hyperlien@3x.png);
}

.extrait.extrait-groupe h3:before {
	background-image: url(../images/icone-groupe@3x.png);
}

.extrait p {
	margin-bottom: 0;
}

.extrait .liens-extraits {
	margin-top: 45px;
}

.extrait .liens-extraits a {
	display: block;
}

.alone-row {
	margin-top: 80px !important;
	margin-bottom: 10px;
}

h3 .icon-new {
	color: #ffffff;
	background-color: #ff366a;
	border-radius: 30px;
	font-size: 0.55em;
	padding: 3px 12px 4px;
	position: relative;
	bottom: 0.225em;
	line-height: 1;
	margin-left: 0.75em;
}

.bonif {
	color: #ff366a;
}

.non-dispo {
	opacity: 0.5;
}

.tab-intro .sous-essai-gratuit {
	margin-top: 70px;
	margin-bottom: -20px;
}

.title-video {
	font-weight: 600;
}

/* FOOTER */

footer {
	color: #2f3335;
	padding: 20px 0;
	text-align: center;
}

/* MEDIA QUERIES */

@media all and (min-width: 320px) {
	.col-milieu {
		margin-bottom: 35px;
	}

	.a-venir {
		padding: 130px 20px;
	}

	.avion {
		margin-bottom: 30px;
	}

	.sub-title3 {
		padding-top: 25px;
	}
}

@media all and (min-width: 576px) {
	.navbar {
		padding: 0.5rem 0;
	}

	.nav-fill .nav-item {
		width: 100%;
	}

	.nav-link {
		padding: 1rem 1rem;
	}

	#tabs > .container {
		padding: 0;
	}

	.extrait-livre:not(.tall-img) {
		margin: auto;
		max-width: 260px;
	}

	.extrait-livre.deux-colonnes {
		max-width: 100%;
	}

	.col-milieu {
		margin-bottom: 35px;
	}
}
@media all and (max-width: 576px) {
	h1 {
		width: 250px;
		height: 70px;
		margin: 10px auto 40px;
	}

	.tall-img {
		max-height: inherit;
		max-width: 100%;
	}
	.tall-img img {
		max-height: inherit;
		max-width: 100%;
	}
}

@media all and (max-width: 767px) {
	.essai-gratuit {
		padding: 30px 25px;
	}
}

@media all and (min-width: 768px) {
	.row-extrait-livre > div[class^="col-"] {
		padding-top: 0;
	}

	.brand-right {
		margin-right: 5px;
	}

	.col-milieu {
		margin-bottom: 35px;
	}

	.liens-extraits .a-venir {
		min-height: 200px;
	}

	.avion {
		margin-bottom: 30px;
	}

	.sub-title3 {
		padding-top: 0;
	}

	#header {
		background-size: 100% auto;
		margin-top: -30px;
	}

	.a-venir2 {
		min-height: 200px !important;
	}
}

@media all and (min-width: 992px) {
	.alone-row {
		margin-top: 100px;
	}

	.alone-row .a-venir {
		padding: 130px 20px;
	}

	.col-milieu {
		margin-bottom: 35px;
	}
}

@media all and (max-width: 991px) {
	.z-index-1 {
		margin-bottom: 0;
	}
}

@media all and (min-width: 1025px) {
	#header {
		background-size: 100% auto;
	}

	.header-block {
		padding: 60px 30px 50px;
	}

	.avion {
		margin-top: -180px;
		margin-bottom: 10px;
	}
}

@media all and (min-width: 1025px) and (max-width: 1600px) {
	#header {
		background-size: auto 62.5%;
	}
}

/* FIX pour l'entête en x-large */
@media (min-width: 1200px) {
	.align-center-xl {
		-ms-flex-align: center !important;
		align-items: center !important;
	}

	.header-block h3 {
		margin-top: 25px;
	}

	.avion {
		padding: 0 30px;
		margin-left: 35px;
	}
}
