@charset "UTF-8";
 
body  {
	margin: 0;
	padding: 0;
	text-align: center;
	background: #FFFFFF;
	background-image: url(http://bibliosante.ca/img/bkg_header_mobile.gif);
	background-repeat:repeat-x;
	background-size: 189px 150px;
}
img.map, map area{
    outline: none;
}
#show-desktop{
    display: inline;
}
#display-desktop{
    display: inline;
}
#display-mobile{
    display: none;
}
.nowrap {white-space: nowrap;}
.videoWrapper-content {
	width: 100%;
	max-width: 1200px;
	height: auto;
}
.videoWrapper {
	position: relative;
	padding-bottom: 56.25%;
	height: auto;
	margin-top: 23px;
	margin-bottom: 37px;
	z-index: 98;
}
.videoWrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
a {
   color:#000;
}

strong {
    font-weight: 500; 
}
#text-center {
    text-align: center;
}

.eventail-cahiers {
	width: 100%;
	max-width: 600px;
	height: auto;
	border: 0 none;
	text-align: center;
}
.template #container { 
	width: 1212px; 
	margin: 0 auto;
	text-align: center;
	padding: 0px;
}
.template #container-acc { 
	width: 1212px; 
	margin: 0 auto;
	text-align: center;
	padding: 0;
}

.template #header { 
	width: 1212px;
	height:167px;
	text-align: left;
	padding: 29px 0px 0px 0px;
}
.logo-top {
	float: left;
	border:none;
	padding:0px 0px 0px 0px;
}
.container-bt-top {
	float:right;
	margin-left:200px;
	margin-right:15px;
}
.bt-top {
	font: 14px/20px 'Roboto', sans-serif;
	font-weight: 400; 
	color:#490000;
	text-transform:uppercase;
	margin-right:7px;
}
.bt-top a {
	color:#490000;
	text-decoration:none;
		-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
.bt-top a:hover {
	color:#fff;
	text-decoration:none;
}
@font-face {
    font-family: 'socicon';
    src: url('fonts/socicon-webfont.eot');
    src: url('fonts/socicon-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/socicon-webfont.woff') format('woff'),
         url('fonts/socicon-webfont.ttf') format('truetype'),
         url('fonts/socicon-webfont.svg#sociconregular') format('svg');
    font-weight: normal;
    font-style: normal;
}
.socicon {
  position: relative;
  top: -2px;
  right:-2px;
  display: inline-block;
  color:#fff;
  background-color:#490000;
  font-family: 'socicon';
  font-style: normal;
  font-weight: normal;
  font-size:16px;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  padding:5px;
  margin-left:0px;
  	-webkit-border-radius: 13px;
	-moz-border-radius: 13px;
	border-radius: 13px;
}
.socicon:hover {
	color:#fff;
  background-color:#000000;
  text-decoration:none;
}
.socicons { float:right; }

.socicon-footer {
	font-size:21px;
	margin-left:5px;
}



.st-custom-button {
	font-size: 17px;
	width: 20px;
	height: 20px;
  background-color: #000;
   display: inline-block;
   padding:11px;
	margin: 10px 4px 10px 4px;
   cursor: pointer;
	border-radius: 22px;
   color: #fff;
   }

	.menu-close {
	display: none;
	width:37px;
	height:22px;
	background:url(http://bibliosante.ca/img/menu_open.png) 50% 50% no-repeat;
	background-size:contain;
}

.show-menu .menu-close {
	background-image:url(http://bibliosante.ca/img/menu_close.png);
}


.container-menu {
	float:right;
	margin-top:39px;
}
.menu{
	float:right;
	margin:0;
	font: 20.4px/24px 'Oswald', serif;
	font-weight:400;  
	color:#fff;
	padding:0px;
	list-style:none;
	display:block;
}
.menu ul{
	height:25px;
	list-style:none;
	margin:0;
	}
.menu li{
	float:left;
	}
.menu li a{
	color:#fff;
	display:block;
	line-height:20px;
	margin:0px 0px 15px 0px;
	padding:4px 15px 4px 9px;
	text-align:left;
	text-decoration:none;
	vertical-align:middle;
	-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
	}
.menu li a:hover {
	color:#490000;
	text-decoration:none;
	}

.menu li ul{
		background:#f6f5f2;
		display:none;
		height:auto;
		padding:7px 0px 7px 0px;
		margin:0px 0px 0px 18px;
		text-transform:none;
		position:absolute;
		z-index:200;
		/*top:1em;
		/*left:0;*/
		}
	.menu li:hover ul{
		display:block;
		
		}
	.menu li li {
		display:block;
		float:none;
		margin:0px;
		padding:0px;
		text-align:left;
		}
	.menu li:hover li a{
		display:block;
		background:none;
		
		}
	.menu li ul a{
		display:block;
		height:27px;
		letter-spacing:0px;
		font: 17px 'Oswald', serif;
		font-weight: 300;
		color:#490000;
		font-style:normal;
		text-align:left;
		margin:2px 0px 2px 0px;
		padding:4px 18px 4px 18px;
		vertical-align:middle;
		text-transform:uppercase;
		}
		.menu li ul a:hover, .menu li ul li:hover a{
			border:0px;
			color:#f6f5f2;
			text-decoration:none;
			background-color:#490000;
			text-align:left;
			}
	
.template #teaser-acc { 
	width: 1200px;
	height:530px; 
	margin: 0 auto;
	text-align: center;
	padding: 0px 12px 0px 0px;
}

.container-title-teaser-acc {
	width:530px;
	float:right;
	text-align:left;
	padding:0px 10px 32px 30px;
}

.template #mainContent {
	float:left;
	width: 1212px;
	text-align: left;
	margin:35px 0px 0px 0px;
	padding: 0px 0px 30px 0px;
	min-height: 500px;
}
.template #cahier {
	float:left;
	width: 1200px;
	text-align: left;
	margin:0;
	padding: 0px 12px 30px 0px;
}
.title-teaser {
	font: 120px/110px atrament-web, sans-serif;
font-weight: 400;
font-style: normal;
	text-align:left;
	color:#ed1c24;
	padding:0px;
	margin:15px 0px 15px 0px;
	letter-spacing: -2px;
}
.subtitle-teaser {
	font: 50px/58px 'Oswald', serif;
	font-weight: 300;
	text-align:left;
	color:#000000;
	padding:15px 0px 13px 0px;
	margin:0px;
}
h1 {
	font: 52px/60px 'Oswald', serif;
	font-weight:400;
	text-align:left;
	color:#ed1c24;
	padding:0px;
	margin:0px;
	text-transform:uppercase;
	max-width:1020px;
	margin-bottom: 30px;
}
h2 {
	font: 32px/38px 'Oswald', serif;
	font-weight: 300;
	text-align:left;
	color:#000;
	padding:14px 0px 12px 0px;
	margin:0px;
}
h2 a {
	color:#000;
	text-decoration: none;
}
h3 {
	font: 26px/32px 'Oswald', serif;
	font-weight: 300;
	
	text-align:left;
	color:#000;
	padding:11px 0px 8px 0px;
	margin:0px;
}
.text-reg-savoirplus {
	font: 16px/22px 'Roboto', sans-serif;
	font-weight: 400;
	color:#000000;
	text-align:left;
	max-width:980px;
}
.text-reg-savoirplus a {
	text-decoration:underline;
	color:#000000;
}
.text-reg-savoirplus a:hover {
	text-decoration:none;
	color:#56513e;
}
.text-reg-partage {
	font: 19px/25px 'Roboto', sans-serif;
	font-weight: 300;
	color:#000000;
	text-align:center;
	max-width:1020px;
}
.text-reg {
	font: 20px/26px 'Roboto', sans-serif;
	font-weight: 300;
	color:#000000;
	text-align:left;
	max-width:1050px;
}
.text-reg a {
	font: 'Roboto', sans-serif;
	font-weight: 500;
	text-decoration:none;
	color:#000000;
		-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
.text-reg a:hover {
	text-decoration:none;
	color:#ed1c24;
}

.text-reg ul{
	list-style: none;
	margin:0;
	padding:0px;
}
.text-reg li{
	list-style: none;
	margin: 0px 20px 0px 0px;
}
.text-reg ul li{
	list-style: none;
	margin:0;
	padding:0px;
}
.text-reg li li{
	list-style: none;
	margin: 0px 20px 0px 25px;
}
.text-reg li li a{
	font: 'Roboto', sans-serif;
	font-weight: 300;
}
.text-reg li li:before {
	content: "-  ";
	margin: 0px 0px 0px -13px;
	padding: 0px;
}
.text-reg li li li:before {
	content: "•  ";
	margin: 0px 0px 0px -13px;
	padding: 0px;
}
.text-reg li:before {
	content: ">  ";
	margin: 0px 0px 0px -20px;
	padding: 0px;
}
#text-legende {
	font: 14px/17px 'Roboto', sans-serif;
	font-weight: 300;
	color: #4f4f4f;
	text-align:left;
	max-width: 1000px;
	-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
#text-legende a {
	text-decoration: none;
	font-weight: 300;
	color: #4f4f4f;
}

.cahier{
	margin-top:35px;
	margin-bottom:40px;
	}
.icon-cahier {
		width:291px;
		height:620px;
		padding:0;
		margin:0px 12px 12px 0px;
		display:block;
		float:left;
		text-align:left;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}

.icon-cahier img {
		width:291px;
		height:auto;
			-webkit-box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.1);
	box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.1);
	border: 1px solid #d5d5d5;
}
#icon-cahier-media {
		width:291px;
	height:auto;
		padding:0;
		margin:0px 30px 30px 0px;
		display:block;
		float:left;
		text-align:left;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
#icon-cahier-media img {
	border: none;
}
.titre-icon-cahier {
	font: 19px/23px 'Roboto', sans-serif;
	font-weight: 300;
	color:#000;
	text-align:left;
	margin-left:0px;
	padding-top:6px;
}
.titre-icon-cahier a {
	text-decoration:none;
	color:#000;
}
.titre-icon-cahier a:hover {
	text-decoration:none;
	color:#ed1c24;
}

.image-cahier
	{
		margin-top:10px;
	}

.spacer {
height:20px;
}
.spacer-clear {
clear:both;
}
.spacer-clear2 {
clear:both;
	width: 100%;
}
.spacer2 {
height:15px;
clear:both;
}
.spacer3 {
height:12px;
clear:both;
}
.spacer-30 {
height:30px;
clear:both;
}
.spacer-clear-mobile {
		display: none;
		}
sup { 
	vertical-align: top; 
	position: relative; 
	top: -0.3em; 
	font-size: 0.5em; 
}

.template #footer {
	clear:both;
	float:left;
	width:100%;
	margin:0px;
	text-align:center;
	padding: 14px 0px 35px 0px;
	background-color:#2c2c2c;
	line-height:12px;
}
.credits {
	clear:both;
	margin-top:36px;
	font: 11px/13px 'Roboto', sans-serif;
	font-weight: 300; 
	color:#a6a6a6;
	text-transform:uppercase;
}
.credits a {
	color:#a6a6a6;
	text-decoration:none;
}
.credits a:hover {
	color:#e2e2e2;
	text-decoration:none;
}
.template #col-left {
	float:left;
}
.template #col-right {
	float:left;
	margin:0px 0px 0px 40px;
}

#visibility-mobile{
	display:none;
	}
.photo-cahier {
	float:left;
	width:380px;
	height:auto;
	margin-right:40px;
	margin-bottom:30px;
	-webkit-box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.1);
	-moz-box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.1);
	box-shadow: 4px 4px 20px rgba(0, 0, 0, 0.1);
	border: 1px solid #d5d5d5;
}

.photo-cahier-autre-langue {
	float:left;
	width:130px;
	height:auto;
	margin-right:25px;
	margin-bottom:0px;
}
.cadre-sujets {
	width: 100%;
	max-width: 1152px;
	margin:20px 0px 20px 0px ;
	padding: 20px 30px 10px 30px;
	background-color: #e7e3db;
}


.photo-generique {
	float:right;
	width:600px;
	height:auto;
	margin-left:30px;
	margin-right:17px;
	margin-bottom:30px;
}
.photo-generique-tablette {
		display:none;
}

.logo-footer {
		margin-bottom:25px;
		border:0 none;
}
.logo-footer-mobile {
		display:none;
}
#uppercase{
	text-transform:uppercase;}
	
.col-list{
		float:left;
	width: 33%;
		margin-right:0px;
		}
		
		.col-list2{
		float:left;
			width: 33%;
		margin-right:0px;
		}
	
.bt-round {
	border-radius: 25px;
	margin:9px 460px 35px 0px ;
	padding: 10px 18px 10px 18px;
	background-color: #e7e3db;
	color:#000;
	width: auto;
	height: auto;
	float: left;
	font: 19px/25px 'Roboto', sans-serif;
	font-weight: 500;
		-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;

		}
.bt-round a {
	text-decoration:none;
	color:#000;
		-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
		}

.bt-round:hover {
	text-decoration:none;
	color:#fff;
	background-color: #ed1c24;
		}


	.text-description-cahier {
	font: 16px/19px 'Roboto', sans-serif;
	font-weight: 300;
	color:#000;
	max-width: 275px;
}

.container-50-left {
	float: left;
	text-align: left;
	width: 47%;
	margin-right: 3%;
	padding-top: 20px;
	padding-bottom: 25px;
}
.container-50-right {
	float: left;
	text-align: left;
	width: 49%;
}
.container-50-left-video {
	float: left;
	width: 48%;
}
.container-50-right-video {
	float: right;
	width: 48%;
}
.container-photo-portrait {
	float: left;
	text-align: left;
	width: 19%;
	margin-right: 4%;
	padding-top: 14px;
}
.container-texte-portrait {
	float: left;
	text-align: left;
	width: 75%;
}
.img-100 {
	width: 100%;
	height: auto;
}




@media screen and (max-width: 1230px) {
	
		.menu{
	font: 18.5px/24px 'Oswald', serif;
}
	.menu li a{
	padding-left:1px;	
	}
	
.container-photo-portrait {
	margin-right: 2%;
	margin-left: 30px;
}
	.container-texte-portrait {
	width: 75%;
}
	
.container-50-right {
	width: 48%;
}

	.template #mainContent .photo-cahier
	{
		margin-left:25px;
	}
	
	
	.photo-cahier {
		display:block;
		clear:both;
}

	body  {
		-webkit-text-size-adjust: none;
	}
	.template #header { 
	padding-left: 25px;
		padding-right: 15px;
}

	
	.template #container,
	.template #container-acc,
	.template #header,
	.template #mainContent,
	.template #teaser-acc
	 {
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
		width:100%;
		max-width:100%;
	}
	

	
.template #footer {
	padding-bottom:20px;
	}
	.credits {
		margin-top:25px;
}		
	.template #mainContent p.text-reg,
	.template #mainContent h1,
	.template #mainContent h2,
	.template #mainContent h3,
	.template #mainContent div.text-reg
	{
		margin-left:25px;
		margin-right:25px;
	}
	
	
	.cahier{
		margin-left:25px;
		margin-top:59px;
	}
	.icon-cahier {
		width:232px;
		height:560px;
}
	#icon-cahier-media {
	height:auto;
		padding:0;
}
.icon-cahier img {
		width:232px;
		height:auto;
}
.titre-icon-cahier {
	font: 17px/20px 'Roboto', sans-serif;
	font-weight: 300;
	padding-top:4px;
}
	
	.image-cahier
	{
		width:100%;
		height:auto;
	}
	
.text-reg {
	margin-left:25px;
	text-align:left;
}
.container-menu {
	min-width:800px;
}
	.container-title-teaser-acc {
	width:43%;
	padding:33px 20px 32px 20px;
}
.title-teaser {
	font: 105px/95px atrament-web, sans-serif;
font-weight: 400;
	letter-spacing: -2px;
}
	.subtitle-teaser {
	font: 46px/54px 'Oswald', serif;
	font-weight: 300;
}

.photo-generique {
	width:500px;
	height:auto;
	margin-right:25px;
}
		.col-list2{
		float:none;
		margin-right:0px;
		}

	.cadre-sujets {
	padding: 20px 30px 10px 0px;
		max-width: none;
}
}

@media screen and (max-width: 1190px) {
	
		.bt-round {
margin-right: 380px;
	
	}
	}


@media screen and (max-width: 1100px) {
	
			.bt-round {
margin-right: 260px;

		}
	
	.container-bt-top {
	margin-left:0px;
	margin-right:0px;
	position:absolute;
		top: 22px;
	right:25px;
	z-index:98;
}
		.bt-top {
	margin-right:6px;
}
.menu,
	.menu li {
		float:none;
	}
	
.menu{
	font: 21px/24px 'Oswald', serif;
}

	.container-menu { 
		margin-top:90px; 
		margin-left:0px; 
		padding-left:0px;
		top:60px;
		right: 9px;
		z-index:97; 
		display:none; 
		float:none;
		clear:both; 
		position:absolute;
		text-align:left;
		}
	.menu-close { 
		display:block; 
		position:absolute;
		cursor:pointer;
		top:95px;
		right:25px;
		z-index:99;
	}
	
	
	
	.menu li a{
	margin-bottom:0px;
	margin-top:2px;
	text-align:right;
		padding:4px 17px 8px 0px;
	}
	.menu ul{
	height:18px;
	}
	
		.menu li ul{
		display:block;
		position:relative;
		padding:2px 0px 10px 0px;
		background-color: #ed1c24;
			text-align: right;
		}
.menu li ul a:hover, .menu li ul li:hover a{
	display:block;
		position:relative;
	text-align: right;
	background-color: #ed1c24;
	font-weight: 400;
			}
.menu li a:hover{
	color:#000000;
	background-color: #ed1c24;
	color:#490000;
		}
		
.menu li ul a{
		height:24px;
		margin:0px 0px 0px 0px;
		padding:2px 17px 5px 25px;
	background-color: #ed1c24;
	color:#490000;
	font-weight: 400;
	text-align: right;
		}
	
	
			.menu{
	letter-spacing:0;
}

			body.show-menu.template #header {
		height:520px;
		background-image: url(img/bkg_header_mobile.gif);
	background-repeat:repeat;
				margin-bottom: 30px;
	}
	body.show-menu .container-menu {
		display:block;
	}
	
	#display-desktop{
    display: none;
}
#display-mobile{
    display: block;
}


	.container-menu {
	min-width:700px;
}

#show-desktop{
    display: none;
}
	

	#visibility-mobile{
	display:block;
	width:100%;
	height:auto;
	}
	

.container-title-teaser-acc {
	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
		width:100%;
		max-width:100%;
	padding:40px 50px 28px 50px;
	clear:both;
	margin-bottom:30px;
	text-align:center;
	background-color: #e7e3db;
}

	
	.template #teaser-acc {
		height:auto;
		margin-right:0px;
		padding-right:0px;
		background-color: #e7e3db;
}
.text-reg-savoirplus {
	text-align:center;
	margin-left:-25px;
}


	
	.title-teaser {
	font: 85px/85px atrament-web, sans-serif;
	font-weight:400;
	text-align:center;
		margin:0px 0px 5px 0px;
			letter-spacing: inherit;
}
.subtitle-teaser {
	font: 25px/30px 'Oswald', serif;
	font-weight: 300;
	text-align:center;
	padding:11px 0px 13px 0px;
}
.cadre-sujets {
	padding: 20px 30px 10px 0px;
}
	

	
	}



@media screen and (max-width: 1020px) {
		.text-reg li:before {
	margin: 0px 0px 0px -16px;
}
		
		.container-50-left-video {
	float: none;
	width: 100%;
}
.container-50-right-video {
	float: none;
	width: 100%;

}
	
	.template #mainContent {
	min-height: 200px;
}
	


	.photo-cahier {
		margin-bottom:40px;
}
	
	
.text-reg {
	font: 16px/21px 'Roboto', sans-serif;
	font-weight: 300;
}

.text-description-cahier {
	font: 14px/17px 'Roboto', sans-serif;
	font-weight: 300;
}

	.icon-cahier {
		height:520px;
}
		#icon-cahier-media {
	height:auto;
}

h2 {
	font: 32px/36px 'Oswald', serif;
	font-weight: 300;
}
h3 {
	font: 22px/27px 'Oswald', serif;
	font-weight: 300;
}
.cahier{
	clear:both;
	margin-top:50px;
	}
	
		.bt-round {
margin-right: 220px;

		}
	
	}

		@media screen and (max-width: 1000px) {
		.bt-round {
margin-right: 200px;

		}		

}

@media screen and (max-width: 980px) {
	
	.container-photo-portrait {
		float: none;
		width: 150px;
		height: auto;
	margin-left: 25px;
		margin-bottom: 15px;
}
	.container-texte-portrait {
		float: none;
		width: 100%;
}
	

	
	.container-bt-top {
	margin-left:0px;
	margin-right:0px;
	position:absolute;
		top: 22px;
	right:25px;
	z-index:98;
}
	
	.photo-generique-tablette {
		display:block;
		width:100%;
		height:auto;
		clear:both;
		margin-top:35px;
		margin-right: 0px;
}
.photo-generique {
		display:none;
}

		.col-list2{
		float:left;
		margin-right:40px;
		}

	.logo-footer-mobile {
		display:inline;
		margin-bottom:25px;
		border:0 none;
}
.logo-footer {
		display:none;
}



	
		.bt-round {
margin-right: 170px;
		font: 16px/22px 'Roboto', sans-serif;
		font-weight: 500;

		}	
			
		.container-50-left {
	float: none;
	width: 100%;
	margin-right: 0%;
			
}
.container-50-right {
	float: none;
	width: 100%;
	padding-bottom: 0px;
	margin-bottom: -10px;
}

}
	
	
	@media screen and (max-width: 920px) {
	
	.bt-round {
margin-right: 120px;
		}	
	}
@media screen and (max-width: 880px) {
	
	.bt-round {
	margin-right: 80px;

		}	
	}
@media screen and (max-width: 800px) {
	.bt-round {
	margin-right: 0px;
		margin-top: 0px;
		margin-bottom: 25px;
		}	
	}



@media screen and (max-width: 767px) {
	
	.bt-round {
		margin-left: 25px;
		}
	
	.videoWrapper {
	margin-top: 15px;
	margin-bottom: 25px;
}
	
	body  {
	background-size: 189px 123px;
}
	

	.template #header { 
	height:140px;
	padding: 20px 0px 0px 20px;
}
	
.logo-top {
	width: 190px;
	height: auto;
}
.container-bt-top {
		top: 20px;
	right:20px;
}
		.menu-close { 
		top:77px;
		right:20px;
		z-index:99;
	}
	
	.template #mainContent {
	padding-bottom: 20px;
}
	
	.template #mainContent .photo-cahier
	{
		margin-left:0;
	}
	
	.template #mainContent div.bt-facebook
	{
		margin-left:25px;
	}
	
	body  {
		background-position: 0 0;
	}
	

	.photo-cahier {
		display:block;
		width:100%;
		height:auto;
		clear:both;
}
	.template #col-left,
	.template #col-right
	 {
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
		width:100%;
		max-width:100%;
		float:none;
		margin-left:0;
}


.title-teaser {
	font: 66px/66px atrament-web, sans-serif;
	font-weight:400;
}
.subtitle-teaser {
	font: 20px/22px 'Oswald', serif;
	font-weight: 300;
}
h1 {
	font: 44px/50px 'Oswald', serif;
	font-weight:400;
	margin-left:0px;
}

.cahier{
	margin-top:35px;
	}
	
			body.show-menu.template .cahier {
		margin-top:40px;
	}
	.col-list{
		float:none;
		margin-right:0px;
		width:auto;
		}
		.col-list2{
		float:none;
		margin-right:0px;
		width:auto;
		}
#col-list-right{
	margin-top:-15px;
	float:none;
		clear:both;
	}
	
		
	.bt-round {
		margin-left: 25px;
		}
	
	.spacer-clear-mobile {
		display: block;
		clear: both;
		}
	.text-description-cahier {
	font: 16px/19px 'Roboto', sans-serif;
	font-weight: 300;
}

.photo-cahier-autre-langue {
	float:none;
	width:60%;
	height:auto;
	margin-right:25px;
	margin-left: 25px;
	margin-bottom:25px;
}

	.icon-cahier {
		width:100%;
		height:auto;
		padding:0;
		margin-left:0;
		margin-bottom:12px;
		display:block;
		float:none;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
		#icon-cahier-media {
width:100%;
		height:auto;
				display:block;
		float:none;
		-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;
}
.cahier{
		margin-left:0px;
		margin-top:0px;
		margin-bottom:10px;
	}

.icon-cahier img {
	width:100%;
	height:auto;
}

		
		
		
.titre-icon-cahier {
	padding-top:5px;
	padding-bottom:14px;
	margin-left:23px;
}
	
			.text-description-cahier {
	max-width: 1000px;
		margin: 0px 25px 36px 25px;
}
	.cahier h1{
		margin-left:23px;
		padding-top:60px;
	}
.cahier h2{
		margin-left:23px;
		margin-bottom:20px;
	}
}


	@media screen and (max-width: 510px) {
		
				.container-50-left {
			padding-bottom: 15px;
}
		
		.menu{
	font: 22px/25px 'Oswald', serif;
	font-weight:400;  
}

		
			.template #header { 
	height:127px;
}
		

		
		
	
		.icon-cahier img {
			border-right: none;
			border-left: none;
}
		
			.bt-top {
	font: 12px/16px 'Roboto', sans-serif;
}
		
		.photo-cahier {
		display:block;
		width:100%;
		height:auto;
		clear:both;
		margin-bottom:30px;
}

		
		#visibility-mobile{
	display:none;
	}
		
		a {
	text-decoration:none;
}
		
		.container-menu {
	padding-right:0;
}
		

	.text-reg-partage {
	font: 16px/19px 'Roboto', sans-serif;
	font-weight: 300;
}	

.text-reg {
	font: 16px/19px 'Roboto', sans-serif;
	font-weight: 300;
}



.title-teaser {
	font: 45px/45px atrament-web, sans-serif;
	font-weight:400;
}
.subtitle-teaser {
	font: 21px/26px 'Oswald', serif;
	font-weight: 300;
}
h1 {
	font: 36px/42px 'Oswald', serif;
	font-weight: 400;
}
.spacer { height:10px;}
h2 {
	font: 30px/36px 'Oswald', serif;
	font-weight: 300;
	margin-left:0px;
}
		h3 {
	font: 23px/27px 'Oswald', serif;
	font-weight: 300;
	margin-left:0px;
}

				
		
body.show-menu.template .cahier {
		margin-top:0px;
	margin-bottom: 0px;
	}
		
			body.show-menu.template #header {
		height:530px;
	}
		
.container-title-teaser-acc {
	padding:32px 20px 16px 20px;
	margin-bottom:20px;
}

.credits {
	font: 10px/12px 'Roboto', sans-serif;
	font-weight: 300; 
}


}
@media screen and (max-width: 350px) {
.logo-footer-mobile {
		width:100%;
		height:auto;
}
.title-teaser {
	font: 43px/43px atrament-web, sans-serif;
	font-weight:400;
}
}




.text-cookie {
	z-index: 9999;
	font: 14px/17px 'Roboto', sans-serif;
	font-weight: 300;
	color: #4f4f4f;
	text-align:left;
	max-width: 58%;
	float: left;
	padding-right: 20px;
	-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
.text-cookie a {
	font: 14px/18px 'Roboto', sans-serif;
	font-weight: 500;
	color: #ed1c24;
	text-align:left;
	text-decoration: none;
}
.text-cookie a:hover {
	text-decoration:none;
	color: #4f4f4f;
}
#text-cookie-personnaliser {
	max-width: 100%;
	float: none;
	padding-right: none;
	margin-top: -15px;
	margin-bottom: 20px;
}
.titre-personnaliser {
	font: 24px/29px 'Roboto', sans-serif;
	font-weight: 400;  
	color:#4f4f4f;
	text-align: left;
	padding-top: 10px;
	padding-bottom: 0px;
	margin-bottom: 0px;
	max-width: 980px;
	text-transform: uppercase;
	-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
.sous-titre-personnaliser{
	font: 19px/27px 'Roboto', sans-serif;
	font-weight: 300;
	text-align:left;
	color: #4f4f4f;
	max-width: 980px;
}
.sous-titre-personnaliser a {
	font: 19px/27px 'Roboto', sans-serif;
	font-weight: 400;
	text-decoration:none;
	color: #ed1c24;
	
}
.sous-titre-personnaliser a:hover {
	text-decoration:none;
	color: #4f4f4f;
}

.cadre_popup {
	border-top: 1px solid #c9c7c6;
	width:100%;
	position: fixed;
	bottom: 0;
	left: 0;
	background-color: #FFFFFF;
	display: none;
	z-index: 9999;
}

.cadre_personnaliser {
position: fixed;
top: 0;
left: 0;
z-index: 9999;
	width:100%;
	height: 100%;
	background-color: #FFFFFF;
	text-align: center;
	display: none;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
	
.content-popup {
	width:100%;
		max-width: 1274px;
		margin:auto;
	padding-right:30px;
		padding-left:30px;
	padding-top: 20px;
	padding-bottom: 30px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		display: flex;
}

.content-personnaliser {
	width:600px;
	max-height: 96vh;
		margin:0 auto;
	padding-right:30px;
		padding-left:30px;
	padding-top: 20px;
	padding-bottom: 20px;
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;	
		overflow: scroll;
}
.buttonX {
	float: left;
  background-color: #ed1c24;
	color: #fff;
  padding: 12px 18px 13px 18px;
	margin: 18px 10px 10px 0px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
font: 14px 'Roboto', sans-serif;
	font-weight: 500;
border-radius: 26px;
	text-transform: uppercase;
	cursor: pointer;
	border: 1px solid #ed1c24;
	-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
.buttonX:hover {
	border: 1px solid #4f4f4f;
	background-color: #4f4f4f;
	color: #fff;
}
#button2 {
	background-color: #fff;
 color: #4f4f4f;
	border: 1px solid #4f4f4f;
	-webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}
#button2:hover {
	border: 1px solid #4f4f4f;
	background-color: #4f4f4f;
	color: #fff;
}

.container {
  display: block;
  position: relative;
	padding-left: 38px;
	padding-bottom: 12px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.container input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #fff;
	border: 1px solid #ed1c24;
}

.container:hover input ~ .checkmark {
  background-color: #fff;
}

.container input:checked ~ .checkmark {
  background-color: #ed1c24;
}

.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

.container input:checked ~ .checkmark:after {
  display: block;
}

.container .checkmark:after {
  left: 9px;
  top: 4px;
  width: 5px;
  height: 10px;
  border: solid white;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

.spacer{
	clear: both;
		}
.spacer-10{
	clear: both;
	height: 10px;
		}
.spacer-20{
	clear: both;
	height: 20px;
		}
.spacer-30{
	clear: both;
	height: 30px;
		}



@media screen and (max-width: 1300px) {

.text-cookie {
	max-width: 48%;
}
	}

@media screen and (max-width: 1000px) {

	.text-cookie {
	width: 100%;
		max-width: 100%;
		font-weight: 400;
}
.titre-personnaliser{
	font: 21px/26px 'Roboto', sans-serif;
	font-weight: 400;  
}
.sous-titre-personnaliser{
	font: 18px/23px 'Roboto', sans-serif;
	font-weight: 400;
}
.sous-titre-personnaliser a {
	font: 18px/23px 'Roboto', sans-serif;
	font-weight: 500;
}
	.buttonX {
  padding: 10px 15px 11px 15px;
	margin-top: 5px;
font: 13px 'Roboto', sans-serif;
	font-weight: 500;
border-radius: 20px;
}
	.content-popup {
		flex-wrap: wrap;
		padding-bottom: 20px;
	}
	}


@media screen and (max-width: 767px) {

	.container {
	padding-left: 30px;
}
.sous-titre-personnaliser{
	font: 15px/18px 'Roboto', sans-serif;
	font-weight: 400;
}
.sous-titre-personnaliser a {
	font: 15px/18px 'Roboto', sans-serif;
	font-weight: 500;
}
.checkmark {
  height: 20px;
  width: 20px;
	margin-top: -2px;
}

.container .checkmark:after {
  left: 6px;
  top: 3px;
  width: 4px;
  height: 8px;
}

.content-popup {
	padding: 15px 23px 20px 23px;
}

	.content-personnaliser {
	width:100%;
	padding-right:20px;
		padding-left:20px;
	padding-top: 20px;
	padding-bottom: 20px;
}
	}