/* Contact - Le mode d'emploi - Les boutiques - Questions / Réponses - default */


/* Le mode d'emploi */
.boitemdp{
	width: 95%;
	margin:0 0 0 5%;
}
.mdp{
	float:left;
	margin:0;
}
.mdpdroit{
	float:left;
	border-left:2px solid rgba(121,121,121,1);
	margin:0;
}
.mdpdroit h2{
	text-align: left;
	font-size: 1.6rem;
	margin:0.5rem;
}
.mdpdroit h3{
	text-align: left;
	margin-left: 0.5rem;
}
.mdpimgD{
	float:left;
	margin: 2rem 1rem 0 ;
}
.mdpimgB{
	display:none;
}

/* Un petit mot */
.photo{
	float: left;	
	width: 30%;
	margin:0 3% 3% 0;
}
.photo h4{
	text-align: center;
	margin-top: 0;
}
.photo img{
	width: 92%;
	margin: 4% 4% 1% 4%;
	box-shadow: 8px 8px 4px rgba(0,0,0,0.4);	
}

/* Questions / Réponses */
ul.lihr{
	width: 100%;
	clear: both;
}

li.hrversion{
	border-bottom: 2px solid #404040;
}
li.hrpointure{
	border-bottom: 2px solid #404040;
}
li.hrbotte{
	border-bottom: 2px solid #404040;
}
li.hrcommande{
	border-bottom: 2px solid #404040;
}

.accordeon {
    cursor: pointer;
    clear:both;
    text-align: left;
    border: none;
    outline: none;
    transition: 0.4s;  
}

.panel {
    max-height: 0;
    overflow: hidden;
    -webkit-transition: max-height 0.2s ease-out; /* Safari */
    transition: max-height 0.2s ease-out;
}

@media all and (max-width:367px) {

	/* Iphone 3 4 5 portrait 320px */

	/* Mode d'emploi */
	.boitemdp{
		width: 95%;
		margin:0 0 0 5%;
	}
	.mdp{
		width:100%;
		margin:0;
	}
	.mdpdroit h2{	
		font-size: 1.3rem;		
	}

	.mdpimgD{
		display:none;
	}
	.mdpimgB{
		clear:both;
		width: 10%;
		display:block;
		margin: 0 0 0 40%;
		padding: 0.5rem 0 0 0;
	}
	.lgtexte h4{
		margin-left: 0.5rem;
	}
	

	.photo{			
		width: 100%;
		margin:0 0 3% 0;
	}

	
	#content ul.lihr{
		padding-top: 1rem;
		margin:0;
	}
	#content ul.lihr li{
		display:inline-block;
	}
	#content li.hrversion{
		width:22%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrpointure{
		width:23%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrbotte{
		width:24%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrcommande{
		width:19%;
		margin: 0 0.5rem 0 0.5rem;
	}

	.accordeon {	   
	    width: 100%;
	   	margin: 0;
	}
	.accordeon h3{
		width: 80%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 100%;
	    margin-left: 0;
	}
	.panel h3{
		font-size: 1rem;
	}

	.accordeon:before {
	    content: "\02C5" ; /* ˅ Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* ˄ Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

}

@media all and (min-width:368px) and (max-width:467px){

	/* Iphone 6 portrait 375px */
	/* affichage minimum sur le ACER*/

	/* Mode d'emploi */
	.boitemdp{
		width: 95%;
		margin:0 0 0 5%;
	}
	.mdp{
		width:100%;
		margin:0;
	}
	.mdpdroit h2{	
		font-size: 1.3rem;		
	}

	.mdpimgD{
		display:none;
	}
	.mdpimgB{
		clear:both;
		width: 10%;
		display:block;
		margin: 0 0 0 40%;
		padding: 0.5rem 0 0 0;
	}
	.lgtexte h4{
		margin-left: 0.5rem;
	}


	.photo{			
		width: 100%;
		margin:0 0 3% 0;
	}


	#content ul.lihr{
		padding-top: 1rem;
		margin:0;
	}
	#content ul.lihr li{
		display:inline-block;
	}
	#content li.hrversion{
		width:28%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrpointure{
		width:29%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrbotte{
		width:30%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrcommande{
		width:26%;
		margin: 0 0.5rem 0 0.5rem;
	}

	.accordeon {	   
	    width: 100%;
	   	margin: 0;
	}
	.accordeon h3{
		width: 80%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 100%;
	    margin-left: 0;
	}
	.panel h3{
		font-size: 1rem;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}
		
}

@media all and (min-width:468px) and (max-width:567px){

	/* iphone 3 4 paysage 480px */

	/* Mode d'emploi */
	.boitemdp{
		width: 80%;
		margin:0 0 0 20%;
	}
	.mdp{
		width:100%;
		margin:0;
	}
	.mdpdroit h2{	
		font-size: 1.3rem;		
	}

	.mdpimgD{
		display:none;
	}
	.mdpimgB{
		clear:both;
		width: 10%;
		display:block;
		margin: 0 0 0 20%;
		padding: 1rem 0 0 0;
	}
	.lgtexte h4{
		margin-left: 0.5rem;
	}

	
	.photo{			
		width: 50%;
		float:left;
		margin:0 3% 3% 0;
	}


	#content ul.lihr{
		padding-top: 1rem;
		margin:0;
	}
	#content ul.lihr li{
		display:inline-block;
	}
	#content li.hrversion{
		width:33%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrpointure{
		width:34%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrbotte{
		width:34.5%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrcommande{
		width:31%;
		margin: 0 0.5rem 0 0.5rem;
	}
	
	.accordeon {	   
	    width: 100%;
	   	margin: 0;
	}
	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 100%;
	    margin-left: 0;
	}
	.panel h3{
		font-size: 1rem;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}
	
}

@media all and (min-width:568px) and (max-width:667px) {

	/* iphone 5 paysage 568px */

	/* Mode d'emploi */
	.boitemdp{
		width: 80%;
		margin:0 0 0 20%;
	}
	.mdp{
		width:100%;
		margin:0;
	}
	.mdpdroit h2{	
		font-size: 1.3rem;		
	}

	.mdpimgD{
		display:none;
	}
	.mdpimgB{
		clear:both;
		width: 10%;
		display:block;
		margin: 0 0 0 20%;
		padding: 1rem 0 0 0;
	}
	.lgtexte h4{
		margin-left: 0.5rem;
	}

	
	.photo{			
		width: 50%;
		float:left;
		margin:0 3% 3% 0;
	}


	#content ul.lihr{
		padding-top: 1rem;
		margin:0;
	}
	#content ul.lihr li{
		display:inline-block;
	}
	#content li.hrversion{
		width:35.5%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrpointure{
		width:36.5%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrbotte{
		width:37%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrcommande{
		width:34%;
		margin: 0 0.5rem 0 0.5rem;
	}

	.accordeon {	   
	    width: 100%;
	    margin-left: 0;
	}
	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 100%;
	    margin-left: 0;
	}
	.panel h3{
		font-size: 1rem;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

}

@media all and (min-width:668px) and (max-width:767px) {

	/* Samsung galaxy paysage 640px iphone 6 paysage 667 */

	/* Mode d'emploi */
	.boitemdp{
		width: 80%;
		margin:0 0 0 20%;
	}
	.mdp{
		width:100%;
		margin:0;
	}
	.mdpdroit h2{	
		font-size: 1.3rem;		
	}

	.mdpimgD{
		display:none;
	}
	.mdpimgB{
		clear:both;
		width: 10%;
		display:block;
		margin: 0 0 0 15%;
		padding: 1rem 0 0 0;
	}
	.lgtexte h4{
		margin-left: 0.5rem;
	}

	
	.photo{			
		width: 50%;
		float:left;
		margin:0 3% 3% 0;
	}


	#content ul.lihr{
		padding-top: 1rem;
		margin:0;
	}
	#content ul.lihr li{
		display:inline-block;
	}
	#content li.hrversion{
		width:37%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrpointure{
		width:37.5%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrbotte{
		width:38%;
		margin: 0 0.5rem 0 0.5rem;
	}
	#content li.hrcommande{
		width:36%;
		margin: 0 0.5rem 0 0.5rem;
	}

	.accordeon {	   
	    width: 100%;
	    margin-left: 0;
	}
	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 100%;
	    margin-left: 0;
	}
	.panel h3{
		font-size: 1rem;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}
	
}

/* Tablettes */		

@media all and (min-width:768px) and (max-width:899px) {

	/* ipad portrait 768px Samsung Tab 800px */

	/* Mode d'emploi */
	.boitemdp{
		width: 80%;
		margin:0 0 0 20%;
	}
	.mdp{
		width:100%;
		margin:0;
	}
	.mdpimgD{
		display:none;
	}
	.mdpimgB{
		clear:both;
		width: 10%;
		display:block;
		margin: 0 0 0 12%;
		padding: 1rem 0 0 0;
	}

	
	.photo{			
		width: 40%;
		float:left;
		margin:0 3% 3% 0;
	}


	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:31%;
	}
	li.hrpointure{
		width:31.7%;
	}
	li.hrbotte{
		width:32.5%;
	}
	li.hrcommande{
		width:29.9%;
	}

	.accordeon {	   
	    width: 95%;
	    margin:0 0 0 3%;
	}
	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 85%;
	    margin-left:6%;
	}
	.panel h3{
		font-size: 1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

}

@media all and (min-width:900px) and (max-width:999px) {

	/* Asus LG  paysage 960px */

	/* Mode d'emploi */
	.boitemdp{
		width: 98%;
		margin:0 0 0 1%;
	}
	.mdpdroit h2{
		font-size: 1.3rem;
		margin-left: 0.3rem;
	}
	.mdpdroit h3{
		font-size: 1.1rem;
		margin-left: 0.3rem;
	}
	.mdpimgD{
		float:left;
		margin: 2rem 0.3rem 0 -1.1rem;
	}
	

	.photo{			
		width: 40%;
		float:left;
		margin:0 3% 3% 0;
	}


	.dimension{
		margin:1% 0 0 5.4%;
	}
	.dimension h3{
		font-size: 1.2rem;
	}
	.dimension h4{
		font-size: 1.1rem;
	}
	.photo{			
		width: 35%;
		float:left;
		margin:0 3% 3% 0;
	}

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:32.5%;
	}
	li.hrpointure{
		width:33.2%;
	}
	li.hrbotte{
		width:33.8%;
	}
	li.hrcommande{
		width:31.5%;
	}

	.accordeon {	   
	    width: 95%;
	    margin:0 0 0 3%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 85%;
	    margin-left:6%;
	}
	.panel h3{
		font-size: 1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}
	
}

@media all and (min-width:1000px) and (max-width:1099px) {

	/* ipad paysage 1024 px */

	/* Mode d'emploi */
	.boitemdp{
		width: 97%;
		margin:0 0 0 2%;
	}
	.mdpdroit h2{
		font-size: 1.4rem;
		margin-left: 0.3rem;
	}
	.mdpdroit h3{
		font-size: 1.1rem;
		margin-left: 0.3rem;
	}
	.mdpimgD{
		float:left;
		margin: 2rem 0.3rem 0 -0.4rem;
	}

	
	.photo{			
		width: 35%;
		float:left;
		margin:0 3% 3% 0;
	}


	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:32.9%;
	}
	li.hrpointure{
		width:33.7%;
	}
	li.hrbotte{
		width:34.2%;
	}
	li.hrcommande{
		width:32.2%;
	}

	.accordeon {	   
	    width: 95%;
	    margin:0 0 0 3%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 85%;
	    margin-left:6%;
	}
	.panel h3{
		font-size: 1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.5rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 1rem 0 1rem 0;
	}
	
}

/* Ordinateurs */

@media all and (min-width:1100px) and (max-width:1199px) {

	/* Mode d'emploi */
	.boitemdp{
		width: 96%;
		margin:0 0 0 3%;
	}
	.mdpdroit h2{
		font-size: 1.3rem;
		margin-left: 0.3rem;
	}
	.mdpdroit h3{
		font-size: 1.1rem;
		margin-left: 0.3rem;
	}
	.mdpimgD{
		float:left;
		margin: 2rem 0.3rem 0 -0.5rem;
	}
	

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:35%;
	}
	li.hrpointure{
		width:35.7%;
	}
	li.hrbotte{
		width:36.2%;
	}
	li.hrcommande{
		width:34.2%;
	}

	.accordeon {	   
	    width: 95%;
	    margin:0 0 0 3%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 85%;
	    margin-left:6%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}
	
}

@media all and (min-width:1200px) and (max-width:1299px) {

	/* Mode d'emploi */
	.boitemdp{
		width: 96%;
		margin:0 0 0 3%;
	}
	.mdpdroit h2{
		font-size: 1.4rem;
	}
	.mdpdroit h3{
		font-size: 1.1rem;
	}
	.mdpimgD{
		float:left;
		margin: 2rem 0.3rem 0 0;
	}
	

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:35%;
	}
	li.hrpointure{
		width:35.7%;
	}
	li.hrbotte{
		width:36.2%;
	}
	li.hrcommande{
		width:34.2%;
	}

	.accordeon {	   
	    width: 95%;
	    margin:0 0 0 3%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 85%;
	    margin-left:6%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}
	
}

@media all and (min-width:1300px) and (max-width:1399px) {

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:28.3%;
	}
	li.hrpointure{
		width:28.8%;
	}
	li.hrbotte{
		width:29.2%;
	}
	li.hrcommande{
		width:27.8%;
	}

	.accordeon {	   
	    width: 80%;
	    margin:0 0 0 10%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 73%;
	    margin-left:10%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}
	
}

@media all and (min-width:1400px) and (max-width:1499px) {

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:28.3%;
	}
	li.hrpointure{
		width:28.8%;
	}
	li.hrbotte{
		width:29.2%;
	}
	li.hrcommande{
		width:27.8%;
	}

	.accordeon {	   
	    width: 80%;
	    margin:0 0 0 10%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 73%;
	    margin-left:10%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

}

@media all and (min-width:1500px) and (max-width:1599px) {

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:29.2%;
	}
	li.hrpointure{
		width:29.7%;
	}
	li.hrbotte{
		width:30.2%;
	}
	li.hrcommande{
		width:28.6%;
	}

	.accordeon {	   
	    width: 80%;
	    margin:0 0 0 10%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 73%;
	    margin-left:10%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}
		
}

@media all and (min-width:1600px) and (max-width:1699px) {

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:29.7%;
	}
	li.hrpointure{
		width:30.2%;
	}
	li.hrbotte{
		width:30.6%;
	}
	li.hrcommande{
		width:29.1%;
	}

	.accordeon {	   
	    width: 80%;
	    margin:0 0 0 10%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 73%;
	    margin-left:10%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

}

@media all and (min-width:1700px) and (max-width:1799px) {

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:30.2%;
	}
	li.hrpointure{
		width:30.7%;
	}
	li.hrbotte{
		width:31.1%;
	}
	li.hrcommande{
		width:29.6%;
	}

	.accordeon {	   
	    width: 80%;
	    margin:0 0 0 10%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 73%;
	    margin-left:10%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}
	
}

@media all and (min-width:1800px) {

	ul.lihr{
		margin:0.5rem 0 0.5rem 0;
	}

	li.hrversion{
		width:30.7%;
	}
	li.hrpointure{
		width:31.2%;
	}
	li.hrbotte{
		width:31.6%;
	}
	li.hrcommande{
		width:30.3%;
	}

	.accordeon {	   
	    width: 80%;
	    margin:0 0 0 10%;
	}

	.accordeon h3{
		width: 90%;
		float:left;	   
	    font-size: 1.1rem;
	    padding: 1rem 0 1rem 0;
	    margin:0;
	}

	.panel {
	    width: 73%;
	    margin-left:10%;
	}
	.panel h3{
		font-size: 1.1rem;
		margin:0;
	}

	.accordeon:before {
	    content: "\02C5" ; /* Triangle 25BC Fléche 2193*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}

	.ouverture:before {
	    content: "\02C4" ; /* Triangle 25B2 Fléche 2191*/
	    float:left;
	    font-size: 1.6rem;
	    color:#574432;
	    margin: 0 1rem 0 1rem;
	    padding: 0.8rem 0 1rem 0;
	}
		
}