.accueil-titre{
text-align: center;
font-family: "Playball", cursive;
font-size:30px;
font-weight: bold;
/*color:#682825; *//*Marron */
color: #3A2A10;
line-height:1em;
}
.accueil-titre h1{
font-size:3em;
margin-top:-34px;
}
.accueil-titre h2{
text-align: left;
font-family: "Playball", cursive;
font-size:24px;
font-weight: bold;
/*color:#682825; *//*Marron */
color: #3A2A10;
line-height:1em;
}

	#voletb_clos {
		margin-bottom: 1020px;
	}
.accueil{
/*float:right;
position:relative;*/
left:-28px;
text-align:left;
/* margin-bottom:1020px;*/
}
.accueil ul{
list-style:none;
/*position:relative;
left:50%;*/
}
.accueil li {
float:left;
position:relative;
}
.accueil div {
width:190px;/* maxi demi largeur des images mais peut nécessiter d'être plus petit en fonction largeur min écran */
}
.liens-boutiques 
{
/*font-family:"times new roman", times, serif;*/
font-family: "Playball", cursive;
/*font-style:italic;*/
font-size:30px;
font-weight: bold;
text-align:center;
line-height: 1em;
/*margin-top: 266px; *//* décalage de l'écriture en bas des images */
/*color:#682825;*/ /*Marron */
color: #3A2A10;
}
.liens-boutiques  a
{
text-decoration: none;
/*color:#682825; *//* Marron */
color: #3A2A10;
}
.liens-boutiques  a:link { color: #3A2A10;}
.liens-boutiques  a:hover { 
color: #3a4643; /* Vert Kaki */
text-decoration: underline ; 
}

.liens-boutiques :hover {
color:#3A4643; /* Vert de gris */
}

#lien-boutique-1 img{display: none;}
#lien-boutique-1{
  display:-moz-inline-box; /* compatibilité firefox 2 */
  display: inline-block;
  vertical-align: top;
  width:368px;/* demi-largeur de l'image double */
  height:176px;
    zoom:1; /* compatibilité IE < 9 La propriété zoom qui est ignorée par les autres navigateurs indique que l'image doit être affichée entièrement et a des effets corollaires sur l'alignement. */
  *display: inline; /* Placer un astérisque devant display assure que la propriété sera reconnue par Internet Explorer 7 seulement */
  _height: 176px; /* Le code de soulignement n'est reconnu que par ce navigateur et la propriété donc ne compte que pour IE6, elle remplace min-weight qui n'est pas encore implémentée dans cette version */
  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-1.png);
  background-repeat: no-repeat;
  margin-left: -100px;
}
#lien-boutique-1:link{
  background-position: 0 0;
 /* background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-1.png); */
}
#lien-boutique-1:hover {
  background-position: -368px 0;/* demi-largeur de l'image double */
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-1-hover.png); */
}

#lien-boutique-2 img{display: none;}
#lien-boutique-2{
  display:-moz-inline-box;
  display: inline-block;
  vertical-align: top;
  width:200px;
  height:266px;
  zoom:1;
  *display: inline;
  _height: 266px;
  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-2.png);
  background-repeat: no-repeat;
}
#lien-boutique-2:link{
  background-position: 0 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-2.png); */
}
#lien-boutique-2:hover {
  background-position: -200px 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-2-hover.png); */
}
#lien-boutique-3 img{display: none;}
#lien-boutique-3{
  display:-moz-inline-box;
  display: inline-block;
  vertical-align: top;
  width:200px;
  height:266px;
  zoom:1;
  *display: inline;
  _height: 266px;
  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-3.png);
  background-repeat: no-repeat;
}
#lien-boutique-3:link{
  background-position: 0 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-3.png); */
}
#lien-boutique-3:hover {
  background-position: -200px 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-3-hover.png); */
} 
#lien-boutique-4 img{display: none;}
#lien-boutique-4{
  display:-moz-inline-box;
  display: inline-block;
  vertical-align: top;
  width:200px;
  height:266px;
  zoom:1;
  *display: inline;
  _height: 266px;
  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-4.png);
  background-repeat: no-repeat;
}
#lien-boutique-4:link{
  background-position: 0 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-4.png); */
}
#lien-boutique-4:hover {
  background-position: -200px 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-4-hover.png); */
} 
#lien-boutique-5 img{display: none;}
#lien-boutique-5{
  display:-moz-inline-box;
  display: inline-block;
  vertical-align: top;
  width:200px;
  height:266px;
  zoom:1;
  *display: inline;
  _height: 266px;
  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-5.png);
  background-repeat: no-repeat;
}
#lien-boutique-5:link{
  background-position: 0 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-5.png); */
}
#lien-boutique-5:hover {
  background-position: -200px 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-5-hover.png); */
} 
#lien-boutique-6 img{display: none;}
#lien-boutique-6{
  display:-moz-inline-box;
  display: inline-block;
  vertical-align: top;
  width:200px;
  height:266px;
  zoom:1;
  *display: inline;
  _height: 266px;
  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-6.png);
  background-repeat: no-repeat;
}
#lien-boutique-6:link{
  background-position: 0 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-6.png); */
}
#lien-boutique-6:hover {
  background-position: -200px 0;
/*  background-image:url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutique-6-hover.png); */
} 
#touslesproduits{
text-align:center;
}
.imgtouslesproduits {
    display:inline;
    margin-left: 65px;
    margin-right: 120px;
}
#titretouslesproduits{
/*margin-bottom:-28px;*/
font-size: 2em;
margin-left: 25px;
margin-top:-15px;
}
/*
.accueil li, #img-lien-boutique-1,  #img-lien-boutique-2{display: inline;}
#lien-boutique-1 {display: inline;}
#img-lien-boutique-1 {display: inline;}
#lien-boutique-2 {display: inline;}
#img-lien-boutique-2 {display: inline;}
*/
.products-grid .product-image {
    width: initial;
	height: 150px;
}
/* pour DIV de 4 produits */
.products-grid-naked{
float: right;
left: -50%;
position:relative;
text-align: left;
width: 100%;
}

/* pour UL contenant les LI des produits */
.products-grid-naked .products-grid {
	left: 50%;
    border-bottom: none;/* YJCV5 pas de lignes haut et bas grilles produits page accueil*/
    border-top: none;/* YJCV5*/
}
}
/* Pour ol si passage accidentel en mode list */
.products-grid-naked .category-products ol{
margin-left: 50%;
min-width: 97%;
}
/* si message d'absence de produit */
.products-grid-naked .note-msg {
margin-left: 50%;
min-width: 97%;
}

/* pour LI des produits */
.products-grid-naked .products-grid li.item{
border:none;
padding: 12px 3px;
width: 24.17488%;
height:auto;
}
.products-grid-naked .products-grid .actions {
position: relative;
margin-top: 46%;/*YJCV5 au lieu 30px*/
}
.products-grid-naked .products-grid .product-image img {
max-width: 95%;/*YJCV5 image à largeur variable */
height: auto;/*YJCV5 */
}
.products-grid-naked .add-to-links{
display: none;
}
.products-grid-naked .toolbar{
display: none;
}
/* pour <p> calé à droite sur page de garde avec lien */
.accueil-titre .adroite{
text-align: right;
color: #3A2A10;
font-style:italic; 
font-family: arial; 
font-size: 15px;  
line-height: 0px;
}
.accueil-titre .adroite a{
color: #3A2A10;
}
.block.block-blog.block-latest-news{
margin-top: 0px;
background: url("https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/fond-blocks-gauche.jpg") repeat scroll 0 0 #EEDBB4;
border-bottom: 3px solid #3A2A10;
border-right: 3px solid #3A2A10;
}
/* Responsive etape 3 YJC RUPTURE -2*/
/* afficher plus de produits dans la grille sur grands écrans */	
/**********************************************************************************************/
@media (max-width: 1504px) {
	.products-grid-naked .products-grid li.item.first {
		margin-left: -6px;
	}
}
/* Responsive etape 3 YJC RUPTURE -1*/
/* afficher plus de produits dans la grille sur grands écrans */	
/**********************************************************************************************/
@media (max-width: 1255px) {
	.products-grid-naked .products-grid li.item.first {
		margin-left: -12px;
	}
}
/**********************************************************************************************/
/* Responsive etape 2 YJC RUPTURE 1*/
/* EDITORIAL sur 1 ligne  basculement colonne de droite pour petits écrans */
@media (max-width: 1053px) {
	div.accueil * a {/* raccourcir bloc des 3 liens boutiques spécialisées */
		/*zoom: 0.92; *//* images boutiques */
		transform: scale(0.92); 
		transform-origin: 0 0;
	}
	div.accueil .liens-boutiques {
		margin-top: -20px;
	}
	.accueil ul { /* raccourcir bloc des 3 liens boutiques spécialisées */
		margin-bottom: -75px;
	}
	.main-container.col2-left-layout .main .col-main .std{/* diminuer largeur zone produits page d'accueil */
	/*	margin-left:-20px;
		margin-right:35px;   transféré style_newaccueil.css */
	}
	.main-container.col2-left-layout .main {
		padding-left: 40px;
		width: 100%;
	}
	.main-container.col2-left-layout .col-main {
		width: 74%;
		padding-right: 50px;
	}
	
}
/**********************************************************************************************/
/* Responsive etape 2 YJC RUPTURE 1*/
/* EDITORIAL sur 1 ligne  basculement colonne de droite pour petits écrans */
@media (max-width: 987px) {
	.main-container.col2-left-layout .main .col-main .std{/* diminuer largeur zone produits page d'accueil */
	/*	margin-left:-20px;
		margin-right:35px; */
	}
	.main-container.col2-left-layout .main .col-main .std .products-grid-naked .products-grid li.item {
		width: 160px;/* diminuer largeur produits */
	}
	.main-container.col2-left-layout .main .col-main .std .products-grid li.item.last {
		display:none;/* supprimer 4ème produit*/
	}
	.main-container.col2-left-layout .col-main {
		width: 72%;
		padding-right: 50px;
	}
	.products-grid-naked .products-grid li.item.first {
	/*	margin-left: -62px; */
	}
}
/**********************************************************************************************/
/* Responsive etape 2 YJCV5  RUPTURE 2 écrans horizontaux quand recherche heurte menu */
@media (max-width: 876px) {
	.main-container.col2-left-layout .col-main {
		width: 69%;
		padding-right: 49px;
	}
}
/**********************************************************************************************/
/* Responsive etape 2 YJC  RUPTURE 2 écrans horizontaux quand menu spécial mobile en place */
/* EDITORIAL sur 1 lignes  mise en place menu mobile */

@media (max-width: 799px) { 
	/* page d'accueil*/
	.main-container.col2-left-layout .main .col-main .std{/* diminuer largeur zone produits page d'accueil */
	/*	margin-left:-60px; */
		margin-right:0;
		/*zoom: 0.95;*/
		transform: scale(0.95); 
		transform-origin: 0 0;
	}

	.main-container.col2-left-layout .main {
		padding-left: 0px;
	}
	.main-container.col2-left-layout .col-main {
		width: 73%;
		padding-right: 0px;
	}	
	.main-container.col2-left-layout .main {
		height: 1580px;/*YJCV5*/
	}
}
/**********************************************************************************************/
/* Responsive etape 3 YJC RUPTURE 3  édito 2 lignes */
/* EDITORIAL sur 2 lignes */
@media (max-width: 704px) {
	/* page d'accueil*/
	.main-container.col2-left-layout .main .col-main .std {
		margin-left: -20px;
		margin-right: 5px;
		transform: scale(0.85);
		transform-origin: 0 0 0;
		width: 115%;/* ne pas étendre car trop large sous chrome ideal étant 117% sous FF */
	}
	.main-container.col2-left-layout .col-main {
		width: 70%;
		padding-right: 0px;
	}
	.products-grid-naked .products-grid li.item.first {
	/*	margin-left: -75px; */
	}
	.main-container.col2-left-layout .main {
		height: 1450px;/*YJCV5*/
	}
}
/**********************************************************************************************/
/* Responsive etape 3 YJC RUPTURE 3'  écrans mobiles verticaux */
/* EDITORIAL sur 2 lignes */
@media (max-width: 638px) {
	/* page d'accueil*/
	.main-container.col2-left-layout .main .col-main .std {
		position:absolute;
		margin-left: 5px;
		margin-right: 5px;
		transform: scale(0.8);
		transform-origin: 0 0 0;
		width: 120.42%;
	}
	.main-container.col2-left-layout .col-main {
		width: 95%;
		position: relative;
	}
	.main-container.col2-left-layout .main {
		height: 1520px;/*YJCV5*/
	}
	.col-left.sidebar {
	/*	transform: scale(0.73); */
	/*	transform-origin: 0 0 0; */
		width: 143.6%;
		z-index:-1; /*YJC necessaire pour produits accueil cliquable mais bloque les select des filtres si pas z-index:0 pour ce cas */
	}
	.col-left.sidebar > p {
		position: relative;/*absolute*/
		margin-left:10px;/*55px*/
		margin-top:-27px;/*-40px*/
		/*top: 35px;*/
		/*zoom:0.95;*/
	 	transform: scale(0.7);  
	 	transform-origin: 0 0 0;  
		width: 204px;/*110px*/
	}
	.col-left.sidebar .accueil {
		margin-bottom: 0;
		margin-top: 80px;/* 1760px remplace 1660px */
		transform: scale(0.40);
		transform-origin: 0 0 0;
		width: 760px;
		padding-left: 90px;
	}
	.col-left.sidebar .block.block-tags {
		display: inline-block;
		float:none;
		margin-left: 10px;
		margin-top:10px; /*15px */
		vertical-align: top;
	}
	.col-left.sidebar .block.block-subscribe {
		clear:both;
		display: inline-block;
		float:none;
		margin-bottom:0;
		margin-left: 10px;
		margin-top:10px; /*15px */
		vertical-align: top;
	}
	.col-left.sidebar .block.block-blog {
		display: inline-block;
		float:none;
		margin-left: 10px;
		margin-top:10px;/*15px*/
		vertical-align: top;
	}
	.block-latest-news .menu-recent {
		height: 150px;
	}
	#lien-boutique-3:link {
		margin-left:0;
	}
	#lien-boutique-4:link {
		margin-left:0;
	}
	#lien-boutique-5:link {
		margin-left: 0px;
	}
	.accueil li {
		display: inline-block;
		width: 230px;
	}
	div.accueil .liens-boutiques{
	/*	left:22px; */
	/*  margin-top:0; */
	/*	position:absolute; */
	/*	top:230px; */
	}
	/**** YJC Volet gauche filtre */
	/* YJC réafficher les ajouts pour le volet filtre en menu mobile */
	.col-left.sidebar {
		transform: initial; /* réinitialisation de transform pour rendre position: fixed efficace */
		z-index: 0;
		position: relative;
		top: 1050px; /* YJCV5 au lieu 960px si non les liens pas actifs au centre */
	}
	.accueil  {/* reduction autres éléments */
		transform: scale(0.82);
		transform-origin: 0 0 0;
		position: relative;
		z-index: -1;
	}
	.col-left.sidebar > p {
		transform: scale(0.7);
		transform-origin: 0 0 0;
		z-index: -1;
		position: absolute;
		top: -1048px;/*YJCV5 au lieu de -958px*/
	}
	#voletb .block-content {
		overflow: auto;
		max-height: 42vh;
		background: none;
		border: none;
		padding-right: 7px;
		box-sizing: border-box;
	}
	#voletb a.ouvrir, #voletb a.fermer {
		display: block;
	}
	/* Nous allons fixer une largeur à notre volet (et quelques couleurs) et à notre lien.*/
	#voletb {
		width: 276px;
		/* background: transparent url("https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/etiquette-gauche-centre.png") repeat-y scroll 0 0; */
		background: #fbfaf6 url(https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/bkg_main2.jpg) 50% 0 repeat;
		border-radius: 10px;
		border: 1px solid #3a2a10;
		box-sizing: border-box;
	}
	#voletb a.ouvrir,
	#voletb a.fermer {
		padding: 15px 5px;
		background: #717f72 no-repeat;
		background-image: url("https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutiques.gif");
		background-size: 15px 15px;
		background-position: 50% 15%;
		color: transparent;
		font-size: 0;
		width: 15px;
		height: 20px;
	}
	#voletb a.ouvrir:before,
	#voletb a.fermer:before {/* amelioration focus en mobile */
	  bottom: -2px;
	  content: "";
	  left: -20px;
	  position: absolute;
	  right: -20px;
	  top: -2px;
	}
	/* Puis nous décalons le volet en dehors de l'écran en ne faisant ressortir que notre lien. */
	#voletb {
		position: relative;
		left: -316px;
		min-height: 150px;
		/* top: -15px; *//*  fixed */
		/*top: -87px; */
	}
	#voletb a.fermer {
		right: -24px;
	}
	#voletb a.ouvrir {
		right: -27px;
	}
	#voletb a.ouvrir,
	#voletb a.fermer {
		position: absolute;
		top: 5px;
		border-radius: 0 8px 8px 0;
	}
	/* Ensuite il nous faut préparer la transition sur le volet. */
	#voletb {
		-webkit-transition: all .5s ease-in;
		transition: all .5s ease-in;
	}
	/* Et enfin déterminer à quel moment nous allons faire sortir le volet. */
	#voletb:target {
		/* right: 10px; *//* fixed */
		left: -35px;
		z-index: 51; /* au dessus slogan */
		min-height: 150px;
		/*top: -51px;*/
	}
	/* Sauf que, par défaut notre lien .fermer doit être caché, rajoutons  */
	#voletb a.fermer {
		display: none;
	}
	#voletb_clos:target #voletb {
		/*right: -274px; *//* fixed */
		left: -316px;
		min-height: 150px;
	}
	#voletb:target a.ouvrir {
		display: none;
	}
	#voletb:target a.fermer {
		display: block;
		background-image: url("https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/boutiques.gif"), url("https://www.a-et-a.com/skin/frontend/default/aeta-v5-fr/images/croix.gif");
		background-position: 50% 15%, 50% 85%;
	}

	 /* test fixed + scroll */
		#voletb_clos {
		position: fixed; /*fixed */
		top: 212px; /* fixed */
		left: 37px; /*fixed */
		height: 0; /*fixed */
		width: 0; /*fixed */
		z-index: 51;
		}

	/**** /YJC Volet gauche filtre */

	.col-left.sidebar .block.block-subscribe {
		float: left;
		top: 260px;
		margin-left: 3px;
	}
	.col-left.sidebar .block.block-tags {
		float: left;
		margin-left: -30px;/*YJCV5*/
		top: 260px;
		max-width: 28%;/*YJCV5*/
	}
	.col-left.sidebar .block.block-blog {
		float: left;
		/* margin-top: -25px; */
		margin-left: -40px;/*YJCV5*/
		top: 260px;
	}
}
/**********************************************************************************************/
/* Responsive etape 3 YJC  RUPTURE 3" écrans verticaux quand menu spécial mobile en place */
/*                                                                                        */
@media (max-width: 459px) { 
	.main-container.col2-left-layout .main .col-main .std {
		transform: scale(0.69);
		transform-origin: 0 0 0;
		width: 140.5%;
	}
	.col-left.sidebar {
		width: 456px;
	}
	.main-container.col2-left-layout .main {
		/*height: 1400px; YJCV5 */
	}
	.col-left.sidebar .block.block-subscribe, .col-left.sidebar .block.block-tags {
		top: 90px;
		/*margin-left: 10px;*//* YJCV5 */
		max-width: 50%;/* YJCV5 */
	}
	.col-left.sidebar .block.block-blog {
		top: -70px;/* YJCV5 */
		margin-left: 10px;
	}
}
/**********************************************************************************************/
/* Responsive etape 3 YJC  RUPTURE 4 écrans verticaux quand menu spécial mobile en place */
/* EDITORIAL sur 3 lignes */
@media (max-width: 396px) { 
	#voletb_clos {
		top: 325px; /* déplacement volet plus bas pour ne pas gêner slideshow */
	}
	.main-container.col2-left-layout .main .col-main .std {
		transform: scale(0.57);/* 0.675 au lieu 0.72*/
		transform-origin: 0 0 0;
		width: 167%;/* 136% au lieu 127.2% */
	}
	.main-container.col2-left-layout .main {
		height: 1270px;/* YJCV5 */
	}
	.col-left.sidebar .block.block-subscribe, .col-left.sidebar .block.block-tags {
		top: -80px;
	}
	.col-left.sidebar .block.block-tags {
		margin-left: -35px;/* YJCV5 */
		max-width: 38%;/* YJCV5 */
	}
	.col-left.sidebar .block.block-blog {
		top: -280px; /* YJCV5 */
		transform: scale(0.96);/* YJCV5 */
		transform-origin: 0 0;/* YJCV5 */
	}
	.std>p { /* pour éviter superposition volet avec texte */
		max-width: 90%;
		margin-left: 40px;
	}
}
/* YJC
style pour masquer les informations de la toolbar 
en cas d'affichage aleatoire 
*/
.sorter .sort-by {display:none;}
.pager .limiter {display:none;}
.pager .pages {display:none;}
.sorter .view-mode {display:none;}
