@charset "UTF-8";
/* CSS Document */

* {
	box-sizing:border-box;
	margin:0;
	padding:0;
}
*::selection {
  background-color: #0d1e46 !important;
  color: white !important;
}
*::-moz-selection {
  background-color: #0d1e46 !important;
  color: white !important;
}
body {
	margin:0 auto;
	/*font-family: Arial, Helvetica, sans-serif;*/
	font-family: 'Cabin Condensed', sans-serif;
    color: #000;
	
	background:#CCCCCC;
}
h1, h2, h3, h4 {
	line-height: 110%;
	color: #0d1e46;
}
p, li, label { font-size: 1em;}
ul li {list-style: none}








/*===== DESCRIPTION PRODUIT + FORMULAIRE =====*/
body > main {
	display: table;
	background: #FFFFFF;
    margin: 20px auto;
    max-width: 60em;
	border-radius: 8px;
	overflow: hidden;
}

/*===== SECTION-GAUCHE =====*/

body > main > section {
	display: table-cell;
	width: 67%;
	padding: 30px;
}

/*
body > main > section > header > h1 {
	display: block;
	border-top: 17px solid #0d1e46;
	border-bottom: 1px solid #0d1e46;
	margin:-30px -30px 30px -30px !important;
	padding: 20px 30px;
	font-size: 25px;
	background-color: #F2F2F2;
}
*/
body > main > section > header {
	display: table;
	position: relative;
	border-bottom: 2px solid #0d1e46;
	margin: -20px 0 40px;
}
body > main > section > header > div {
	display: table-cell;
	position: relative;
	vertical-align: middle;
	padding: 20px 0;
}
body > main > section > header > div:first-child {
	width: 152px;
}

body > main > section > header > div:last-child {
	width: auto;
	padding-left: 60px;
	background-image: url("../images/3dotblue.png");
	background-repeat: no-repeat;
	background-position: left 23px center;
	background-size: 15px 51px;
}
body > main > section > header > div:last-child > h1 {
	margin: 0 0 10px;
	padding: 0;
	font-size: 24px;
	text-transform: uppercase;
}

body > main > section > header > div:last-child > h2 {
	margin: 0;
	padding: 0;
	font-size: 18px;
	font-weight: normal;
}
body > main > section > h3 {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 20px;
}

body > main > section > figure {
	display: inline-block;
	float: right;
	width: 33%;
	max-width: 190px;
}
body > main > section > figure > img {
	display: block;
	position: absolute;
	width: 100%;
	max-width: 190px;
	height: auto !important;
	z-index: 0;
}
body > main > section > figure + article {
	display: inline-block;
	width: 65%;
}

body > main > section > article > h2 {
    margin: 40px 0 20px;
	text-align: center;
	color: #8f8f8f
}
body > main > section > article > ul li {
	display:block;
	position:relative;
	margin:0 0 3px 12px;
	font-size:0.9em;
}
body > main > section > article > ul li:last-child {
	margin:0 0 20px 12px;
}
body > main > section > article > ul li:before {
	border-color: transparent transparent transparent #0d1e46;
    border-style: solid;
    border-width: 6px 0 6px 7px;
    content: "";
    font-size: 0 !important;
	float:left;
    position: relative;	
	margin:3px 0 0 -12px;
}
body > main > section > article > a > img {
    float: right;
    margin:0 0 40px 10px;
}
body > main > section > article,
body > main > section > footer {
    clear: both;
}
body > main > section > footer > p {
	font-size:0.75em;
	margin:50px 0;
}
body > main > section > article > h3 {
    clear: both;
    display: block;
    font-size: 1.2em;
    font-weight: normal;
    margin: 0 0 10px;
    width: auto;
}
body > main > section > article > h3 b,
body > main > section > article > h3 strong {
    color: #555555;
    font-weight: bold;
}

body > main > section > article > p{
    font-weight: normal;
	font-size:0.9em;
    line-height: 1.2em;
    margin: 0 0 10px;
}

body > main > section > table > tbody > tr > td > p {
    font-weight: normal;
	font-size:0.8em;
    line-height: 1.1em;
    margin: 0;
}

body > main > section > table > tbody > tr > td > h6 {
    font-weight: bold;
	font-size:0.9em;
    line-height: 1.2em;
    margin: 0 0 10px;
	color: #0d1e46;
}
body > main > section > table {margin: 20px -10px 20px;}
body > main > section > table > tbody > tr > td {
	vertical-align: top;
	width: auto;
	padding:0 10px;
	border-right: 1px solid #0d1e46;
	max-width: 33%;
}
body > main > section > table > tbody > tr > td:last-child {
	border-right: none;
}


body > main > section > article > div {
	display:block;
	width:45%;
	float:left;
	margin-right:5%;
}
body > main > section > article > div.accordion {margin-bottom:0px;}
body > main > section > article > div h4 {
    display: block;
    font-size: 1.10em;
    font-weight: normal;
	color:#0d1e46;
    margin: 15px 0 10px;

}
body > main > section > article > div h4 a {color:inherit; text-decoration:none;}
body > main > section > article > div ul li {
    display: block;
    font-size: 0.8em;
    margin: 0 0 3px 15px;
    position: relative;
	
    font-weight: normal;
    line-height: 1.2em;
    vertical-align: top;
}
body > main > section > article > div ul li::before {
    content: "";
	display:block;
	width:8px;
	height:8px;
	background:#0d1e46;
    float: left;
    font-size: 0 !important;
    margin: 4px 0 0 -15px;
    position: relative;
}
body > main > section > a > img {
	width:100%;
	height:auto !important;
	background-color: #F7F7F7;
	border-radius: 4px;
	margin: 20px 0 0;
}



#hidden-content {
  display: none;
  width: 100%;
  max-width: 600px;
  padding: 40px;
  text-align: justify;
  border-radius: 3px;
  box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23);
}


/*===== FORMULAIRE =====*/

body > main > aside {
	display: table-cell;
	vertical-align: top;
	width: 33%;
    background: #0d1e46;
    padding: 30px;
}
body > main > aside > h2 {
    background: #F7F7F7 none repeat scroll 0 0;
    color: #0d1e46;
    display: block;
    font-size: 1.5em;
    margin: -30px -30px 0;
    padding: 30px 30px 0;
    text-align: left;
}
main > aside > h2 + p {
    background: #F7F7F7 none repeat scroll 0 0;
    color: #000000;
    display: block;
    font-size: 1em;
    margin: 0px -30px 30px;
    padding: 10px 30px 20px;
    text-align: left;
}
body > main > aside > h3 {
    font-size: 0.9em;
    font-weight: bold;
    color: #aa272f;
}

body > main > aside > form  p {
    margin: 5px 0 15px 0px;
	font-size:0.9em;
    font-weight: normal;
    line-height: 1.2em;
	color: #FFFFFF;
}
body > main > aside > form  p:nth-of-type(3) {
	font-size:0.8em;
    line-height: 1.1em;
}
form p font {
	color:#0d1e46;
}
body > main > aside label {color: #FFFFFF;}
body > main > aside > form > p:nth-of-type(2) {font-size:0.75em;}
body > main > aside > form > p a { color: #FFFFFF;}
body > main > aside label,
body > main > aside input,
body > main > aside select {width:100%; margin: 5px 0 15px;}
body > main > aside textarea {
    max-width:253px;
    min-width:100%;
    max-height: 300px;
    min-height: 100px;
	margin-bottom: 15px;
}
body > main > aside input[type="radio"],
body > main > aside input[type="checkbox"] {
	float: left;
    margin: 0px 5px 0 -5px;
    width: 20px;
}
body > main > aside input[type="submit"] {
    display: block;
    width: auto;
    margin: 15px auto;
    padding: 10px 30px 10px 25px;
    border: none;
    background:  #FFFFFF url("../images/cache_fleche_bleu.png") right center no-repeat;
    font-size: 1em;
    font-weight: bold;
    color: #0d1e46;
	cursor: pointer;
}
body > main > aside input[type="radio"] + p,
body > main > aside input[type="checkbox"] + p {
    display: block;
    width: auto;
    margin:0 0 20px 20px;
}

body > main > aside > form  ul.legend,
body > main > aside > form  ol.legend {
	margin: 20px 0 0 20px;
	font-size: 12px;
	font-weight: normal;
	line-height: 14px;
	color: #FFFFFF;
}
ul.legend > li {list-style: none;}
ul.legend > li::before {margin: 0 7px 0 -25px}
ul.legend > li:nth-child(1)::before {content:"(1)"}
ul.legend > li:nth-child(2)::before {content:"(2)"}
ul.legend > li:nth-child(3)::before {content:"(3)"}
ul.legend > li:nth-child(4)::before {content:"(4)"}
ul.legend > li > ul > li {font-weight: normal; list-style: initial !important;}



/*===== FOOTER =====*/
body > footer {
	display: table;
	width: 100%;
	max-width: 980px;
	font-size: 0.75em;
	margin: 10px auto 0;
	border-collapse: separate;
	border-spacing: 10px;
}
body > footer > div, body > footer > p {display: table-cell; vertical-align: bottom;}
body > footer > div {width: 152px;}

body > section#rgpd {
	display: block;
	width: 100%;
	max-width: 960px;
	font-size: 0.70em;
	text-align: justify;
	margin: 0 auto  10px;
}








/*===== MEDIA-QUERIES =====*/
@media screen and (max-width:960px){
    body > header,
    body > main > div {padding: 0 15px}
	body > header > section > div > h1 {font-size: 18px;margin-bottom: 0px !important}
	body > header > section > div > h2 {font-size: 14px;}
}

@media screen and (max-width:760px){
    /*===== * Main =====*/
	
	body > main > section > header > div {
		display: block !important;
		width: 100% !important;
		padding-top: 0px;
		padding-bottom: 0px
	}
	body > main > section > header > div {
		padding-top: 20px
	}
	body > main > section > header > div:last-child {
		padding-bottom: 20px
	}
	body > main > section > header > div > img {
		display: block;
		position: relative;
		margin: 0 auto !important;
	}
	
    body > main > section,
    body > main > aside {width: 100%;}
    body > main > section > article {margin-bottom: 25px;}
    body > main > section > article:nth-of-type(n) > a > img  {float: none; margin: 0 auto; display:  block}
    body > main > section > article + div p { text-align: center}
	body > main > section > article:nth-of-type(odd) > a > img:first-of-type {margin-top: 0px;}
    body > main > aside label,
    body > main > aside input,
    body > main > aside select { min-height: 25px}
	body > footer {position:relative !important;}
	body > main > section > table > tbody > tr > td {
		display: block;
		width: 100%;
		max-width: 100% !important;
		border-right: none;
		border-bottom: 1px solid #0d1e46;
		padding: 15px 0;
	}
	body > main > section > table > tbody > tr > td:last-child {border-bottom: none;}
	body > main > section > table > tbody > tr > td > p {margin-bottom: 0;}
	body > main > section > figure,
	body > main > section > figure + article {
		display: block;
		width: 100% !important;
		float: none !important;
		max-width: 100%;
	}
	body > main > section > figure img {
		margin: 0 auto 20px !important;
		position: relative;
		display: block;
	}
}
@media screen and (max-width:660px){
	body > main > section > article > div {margin-right: 0%;width: 100%;}
	body > main > section > article > div.accordion {margin-bottom:0 !important;}
	body > main > section > article > div.accordion > div h4 {
		border-bottom: 2px solid #0d1e46;
		display: block;
		height: auto;
		padding: 11px 0;
		text-align: center;
	}
	body > main > section > article > div.accordion.two > div:last-child h4 {
		border-bottom: none;
	}
	body > main > section > article > div.accordion > div h4::after {
		border-color: #0d1e46 transparent transparent;
		border-style: solid;
		border-width: 10px 10px 0 10px;
		content: "";
		display: block;
		height: 0;
		margin:0 auto -15px;
		position: relative;
		top: 7px;
		width: 0;
	}
	body > main > section > article > div .accordion-section-content {padding-top: 10px; vertical-align: bottom;}
	body > main > section > article > div.accordion.two > div:last-child h4::after {border-color:transparent;}
	
	body > footer > div {width: 40px !important;}
	body > footer > div img.logo-max { display: none !important;}
	body > footer > div img.logo-min { display: block !important; position: relative; margin: 0 auto;}
	
	body > section#rgpd {padding: 0 10px 10px}

}
@media screen and (max-width:560px){
	body > main > section, body > main > aside {display: block;	width: 100%;}
	body > main > section {border-right: none; border-bottom: 2px solid #0d1e46;}
	body > main > section > header > h1, body > main > aside > h2, main > aside > h2 + p {text-align: center}
}
@media screen and (max-width:533px){
/*	body > main > div:first-child > article > footer p::before {bottom: -90px;}*/
}