/* -------------------------------------------------------
Variable font.
Usage:

  html { font-family: 'Inter', sans-serif; }
  @supports (font-variation-settings: normal) {
    html { font-family: 'Inter var', sans-serif; }
  }
 
*/

.pace {
  -webkit-pointer-events: none;
  pointer-events: none;

  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
}

.pace-inactive {
  display: none;
}

.pace .pace-progress {
  background: #ffffff;
  position: fixed;
  z-index: 2000;
  top: 0;
  right: 100%;
  width: 100%;
  height: 2px;
}
.cb { clear:both; }


@font-face {
  font-family: 'Inter var';
  font-weight: 100 900;
  font-style: normal;
  font-named-instance: 'Regular';
  src: url("Inter-upright.var.woff2") format("woff2");
}
@font-face {
  font-family: 'Inter var';
  font-weight: 100 900;
  font-style: italic;
  font-named-instance: 'Italic';
  src: url("Inter-italic.var.woff2") format("woff2");
}

body { cursor: url(../img/dot-50.png), auto;  }

.fond-mobile,
div.item,
a.secondaire,
a.illustration-mobile,
a.illustration-mobile span.mobile-not,
.fond-mobile,
h2,
h3,
h1,
.sous-titre { 
	-webkit-transition: all 500ms !important;
    -moz-transition: all 500ms !important;
    -o-transition: all 500ms !important;
    transition: all 500ms !important; 
}
.illustrations,
.illustration {
	-webkit-transition: all 900ms !important;
    -moz-transition: all 900ms !important;
    -o-transition: all 900ms !important;
    transition: all 900ms !important; 
}
.background { 
	z-index: 1; 
	position: fixed; top:0; left:0; width: 100%; height: 100%; 
	top: -30%; 
	left: -30%; 
	width: 140%; 
	height: 140%;
}
.fond-mobile { z-index: 5; background-color: #21124d; opacity:0.8;
	position: fixed; top:0; left:0; width: 100%; height: 100%;  }
.background canvas { 
	transform: scale(1.2, 1.2);
	transform: rotate(4deg);
	/* width: 100%;  */ 
/*
	min-width: 100%;
	min-height: 100%;
*/
	position: absolute; 
	top: 0; 
	left: 0; 
	right: 0; 
	bottom: 0; 
	margin: auto; 
	min-width: 50%;
	min-height: 50%;
}
.display-none { display: none; }
.opacity-zero { opacity: 0; }
.illustrations { 
	z-index: 10; 
	position: fixed; top:0%; left:0%; width: 100%; height: 100%;
}
.sombre .illustrations { 
	background-color: rgba(33,18,77,0.7);
}
.flexbox-container {
	display: -ms-flexbox;
	display: -webkit-flex;
	display: flex;

	-ms-flex-align: center;
	-webkit-align-items: center;
	-webkit-box-align: center;

	align-items: center;
}
.illustrations canvas { max-width: 90%; max-height: 90%; position: relative; margin: 0 auto; }

.page {
	z-index: 10;
	font-style:normal;
	font-weight:300;
	width:100%;
	position:absolute;
	top: 0;
	
}
.sombre .content { color:rgba(255,255,255, 1); }
.clair 	.content { color:rgba( 0, 0, 0, 1); }

.sombre h1 { color:rgba(255,255,255, 1); }
.clair  h1 { color:rgba(0,0,0,1);  }

.sombre h3 { color:#00d5ff; color:#02ffd0; }
.clair  h3 { color:rgba(0,0,0,1);  }

.sombre a:not(.secondaire),
.sombre a span:not(.mobile-not), 
.sombre a span:not(.secondaire):visited, 
.sombre a:not(.mobile-not):visited { 
	color:#00d5ff; 
	}
.sombre a:not(.secondaire):hover,
.sombre a span:not(.mobile-not):hover,
.sombre .mail,
.sombre .contact { 
	color:#00d5ff; color:#02ffd0; 
	}	
body.sombre {
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#296fb5+0,d95757+100 */
	background: #f45747; /* Old browsers */
	background: -moz-linear-gradient(left,  #21124d 0%, #f45747 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left,  #21124d 0%, #f45747 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right,  #21124d 0%, #f45747 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#21124d', endColorstr='#f45747',GradientType=1 ); /* IE6-9 */
	}	

.sombre div.item,
.sombre a.secondaire  { 
	color:rgba(255,255,255,1); 
	}
.clair div.item,
.clair a.secondaire  { 
	color:rgba(0,0,0,1); 
	}		
	
	
	
	
	
	
	
.sombre h2 { color:rgba(255,255,255,1); }
.clair h2 { color:rgba(0,0,0,1); }

.sombre div.item:not(.no-hover):hover,
.sombre div.item:not(.no-hover):hover a,
.sombre div.item:not(.no-hover):hover h3  {  color:rgba(255,255,255,1);  }
.clair div.item:not(.no-hover):hover,
.clair div.item:not(.no-hover):hover a,
.clair div.item:not(.no-hover):hover h3  {  color:rgba(0,0,0,1);  }
.sombre div.item a:not(.secondaire) span.mobile-not { border:1px solid rgba(255,255,255,1); }
.clair div.item a:not(.secondaire) span.mobile-not { border:1px solid rgba(0,0,0,1); }

.sombre div.item a:hover  { color:#21124d; color:#02ffd0; }

.letter-spacing-1 { letter-spacing:1px; }
.letter-spacing-1 em { margin-left: -2px; margin-right: 3px; }

/* -------------------- */




	
.content {
	z-index: 10;
	font-family: 'Inter var', sans-serif;
	font-style:normal;
	font-weight:300;
	font-variation-settings: 'wght' 350;
	letter-spacing: 0.003em;
	
	line-height: 28px;
	text-align:left;
	max-width:600px;
	margin:0 auto;
	margin-bottom:90px;
	margin-top:15%;
	position:relative;	
}
h3 { margin: 0; padding: 0; display:inline-block; line-height: 28px; text-decoration:none; }




a:not(.secondaire),
a span:not(.mobile-not), 
a span:not(.secondaire):visited, 
a:not(.mobile-not):visited {
	display:inline-block; line-height: 22px; text-decoration:none;
	}


a:not(.secondaire):hover,
a span:not(.mobile-not):hover {
	display:inline-block; line-height: 22px; text-decoration:none;
	}
	
a.secondaire { text-decoration: underline; }
.mail { font-style:italic; }


H1 {
	margin-bottom: 10px; margin-top:0;
	font-family: 'Inter var', sans-serif;
	font-weight:400;
	font-variation-settings: 'wght' 450;
	font-size:45px;  
	}
	
.sous-titre { 
	font-size: 1.2em; 
	font-weight: 700; 
	font-variation-settings: 'wght' 750; 
	margin-top: 15px; 
	display: block; 
	}

.contact { 
	font-weight: 700; 
	font-variation-settings: 'wght' 750;
	}

body { 
	margin:0; 
	padding:0; 
	}
h1,
h2,
.sous-titre,
div.item { padding:4px 8px;  }

	
div.item,
a.secondaire  { 
	margin: 25px 0; 
	font-family: 'Inter var', sans-serif;
	font-weight:400;
	font-variation-settings: 'wght' 450;
	font-size:1.3em;  
	letter-spacing: 0.003em;
	}

a.secondaire { font-size: 1em ;}
a.illustration-mobile,
a.illustration-mobile span.mobile-not { text-decoration: underline; color:#FFF;}
a.illustration-mobile,
a.illustration-mobile span,
a.illustration-mobile span.mobile-not { font-size: 0.65em ; letter-spacing: 0.003em; color:#FFF;}
a.illustration-mobile:hover { text-decoration: underline; }
a.illustration-mobile:hover,
a.illustration-mobile:hover span.mobile-not { color:#21124d; color:#02ffd0; border-color:#02ffd0 !important; }

div.item:not(.no-hover):hover { background-color:#00d5ff; background-color: rgba(33,18,77,0.85); /* padding:8px 4px; */ 
/*
	-moz-box-shadow: 5px 5px 0px 2.5px #21124d;
	-webkit-box-shadow: 5px 5px 0px 2.5px #21124d;
	-o-box-shadow: 5px 5px 0px 2.5px #21124d;
	box-shadow: 5px 5px 0px 2.5px #21124d;
	filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=134, Strength=0); 
*/
}
div.item:not(.no-hover):hover { 
	cursor: url(../svg/oeil.svg), auto; 
	cursor: url(../img/oeil-50.png), auto; 
	}
a:active { 
	cursor: url(../img/pointer-50-negative.png), auto; 
	}
a:hover { 
	cursor: url(../img/pointer-50.png), auto; 
	}

h2 { 
	font-size: 2.8em ; 
	letter-spacing: 0.003em;
	font-weight: 400; 
	font-variation-settings: 'wght' 450;
	margin-top: 80px; 
	}
h3 { 
	font-weight:800; 
	font-variation-settings: 'wght' 850;
	}
div.item a:not(.secondaire) { 
/*
	font-family: 'Arimo', sans-serif; 
	font-size: 1.3em ; 
	font-weight:700; 
*/
	display:inline-block; 
	/* margin-bottom:6px; */
	
/* 	font-family: 'Inter var', sans-serif; */
	font-size: 1.3em ; 
	letter-spacing: 0.003em;
	font-weight:800; 
	font-variation-settings: 'wght' 850;
	
	 }
	 .legende { font-size: 0.8rem; text-align: center; }
	 .offset-1 img { margin-top:-10px !important; margin-bottom:-10px !important; }

.item img,
.item-full img { width: 100%; height: auto;}

.mobile.on  { display:none;  }
.mobile.off { display:inline;  }

img.illustration-mobile { 
	margin:0; 
	padding:0;
	}
a.illustration-mobile,
img.illustration-mobile { 
	display:none; 
	width:100%; 
	}

div.item.chapo { 
		font-style:italic;
}

.clair .liens { border: 1px rgba(0,0,0,0.15) solid; }


div.item a:not(.secondaire) {text-decoration: none !important; }
div.item a:not(.secondaire) span.mobile-not {
	text-decoration: none;
	text-transform: uppercase;
	font-weight:100;
	font-variation-settings: 'wght' 150;
	font-size:0.6em;
	letter-spacing:1px;
	margin:8px 0 0 0;
	display: block;
	padding: 4px 0 5px 0;
	border-radius: 0px;
	text-align: center;
}



/* =============================================== */
/* OA~  */




@media (min-width : 1025px) { 
	
	.content { max-width: 80%; position: relative; display: block; }
	h1.item,
	h2.item,
	span.item { clear:both; margin-left: 2%; margin-right: 2%;  }
	span.item:not(.contact) { pointer-events: none; }
	h2.item { padding-top: 60px; }
	div.item { 
		display: block; 
		float: left;
		width: 44%; 
		margin: 0 2% 30px 2%;
		min-height: 120px;
	}
	div.item,
	a.secondaire  { 
	font-size: 1em ; 
	line-height: 22px;
	}
	div.item:hover { padding:4px 8px; }
}



@media (min-width : 1250px) { 
		
	div.item { 
		width: 27%; 
		margin: 0 2% 30px 2%;
		min-height: 180px;
	}
	
	div.item.chapo { 
		display: block; 
		float: left;
		width: 44%; 
		margin: 0 2% 30px 2%;
		min-height: 120px;
	}
}


/* =============================================== */
/* OA~ Ipad and Ipad retina */
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { 
	
	div.item:hover { 	
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		-o-box-shadow: none;
		box-shadow: none;
	}	
	
	
	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:80%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item { padding:4px; }
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }	
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) {
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape) and (-webkit-min-device-pixel-ratio: 2) {	
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) { 
	.content  { max-width:90%; padding:10px; margin-top:50px;}
}
@media only screen and (min-device-width : 768px) and (max-device-width : 1024px) and (orientation : portrait) and (-webkit-min-device-pixel-ratio: 2) {  
}


@media ( max-width: 650px ){
	
	div.item:hover { 	
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		-o-box-shadow: none;
		box-shadow: none;
	}	
	
	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:100%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	 
 }



/* =============================================== */
/* OA~ iPhone 2 -> 4S in landscape OR portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) {
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:100%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #fff; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : landscape) {
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:100%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	
}
@media only screen and (min-device-width : 320px) and (max-device-width : 480px) and (orientation : portrait) {
}

/* =============================================== */
/* OA~ iPhone 5 & 5S in landscape OR portrait */
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) {
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:100%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : landscape) {
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:90%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	
}
@media only screen and (min-device-width : 320px) and (max-device-width : 568px) and (orientation : portrait) {
}

/* =============================================== */
/* OA~ iPhone 6PLUS */
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) {
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:80%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	div.item:hover  { color: #fff; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:100%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	
}
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : landscape) {
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:80%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:80%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	div.item:hover  { color: #fff; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	
}
@media only screen and (min-device-width : 414px) and (max-device-width : 736px) and (orientation : portrait) {
}

/* =============================================== */
/* OA~ iPhone 6 */
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) {
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:100%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	
}
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : landscape) { 
	
	.background { 
		top: -40%; 
		left: -70%; 
		width: 200%; 
		height: 200%;
	}

	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.85; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:80%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
	a.illustration-mobile span.mobile-not { display:none;}
	.fond-mobile { opacity:0.5; }
	.illustrations { display:none !important; }
	img.illustration-mobile { 
		margin:15px 0 15px 0; 
	}
	a.illustration-mobile,
	img.illustration-mobile { 
		display:block;  
		width:100%;
	}
	.content  { max-width:100%; padding:10px; margin-top:50px;}
	/* div.item a { font-weight: bold; } */
	
	h2 { padding-bottom:20px; border-bottom: 1px solid #FFF; line-height: 40px;}
	div.item:hover { background-color:transparent !important; padding:4px;  }
	.sombre div.item:hover  { color: #fff; }
	.clair div.item:hover  { color: #000; }
    div.item:hover a,
    div.item:hover h3  { color:#00d5ff; }
	 
	.mobile.on  { display:inline; }
	.mobile.off { display:none;  }
}
@media only screen and (min-device-width : 375px) and (max-device-width : 667px) and (orientation : portrait) {	
}