@media screen and (max-width:814px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
} 
@media screen and (max-width:800px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
} 
@media screen and (max-width:764px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
*{font-size:1rem;} 
#devise{display:none;} 
#header-container{ grid-template-columns: 10% 20% 20% 20% 25%; height:10px;} 
#imgTitre{ margin-top:18px; height:100%; line-height:30px;  } 
#eCol2{ margin:auto; height:100%; } 
#menuIndep-container{display:none; width:0px; height:0px;} 
#rechBarre-container{grid-row:4; left:0px;margin:auto; grid-column:1 / span 4;} 
#rechInput{padding:0;font-size:1rem; margin:auto;} 
#container-usrSiteMsg{grid-column:1 / span 5;} 
#menuDeroulantBarre>li:first-child{display:block; padding: 10px; margin:2px; width:100%; padding-bottom:0px; margin-bottom:20px;} 
.itemBarrePromo{width:50%;} 
#messCom{font-size:1rem;} 
#barreClientContainer, #pageConnexion{display:flex;flex-direction:column;justify-content:space-around;} 
#spinnerPopup, .spinnerPopup{ top: 10px; width:80%;	} 
} 
@media screen and (max-width:731px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
*{font-size:1rem;} 
#devise{display:none;} 
#header-container{ grid-template-columns: 10% 20% 20% 20% 25%; height:10px;} 
#imgTitre{ margin-top:18px; height:100%; line-height:30px;  } 
#eCol2{ margin:auto; height:100%; } 
#menuIndep-container{display:none; width:0px; height:0px;} 
#rechBarre-container{grid-row:4; left:0px;margin:auto; grid-column:1 / span 4;} 
#rechInput{padding:0;font-size:1rem; margin:auto;} 
#container-usrSiteMsg{grid-column:1 / span 5;} 
#menuDeroulantBarre>li:first-child{display:block; padding: 10px; margin:2px; width:100%; padding-bottom:0px; margin-bottom:20px;} 
.itemBarrePromo{width:50%;} 
#messCom{font-size:1rem;} 
#barreClientContainer, #pageConnexion{display:flex;flex-direction:column;justify-content:space-around;} 
#spinnerPopup, .spinnerPopup{ top: 10px; width:80%;	} 
} 
@media screen and (max-width:720px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
*{font-size:1rem;} 
#devise{display:none;} 
#header-container{ grid-template-columns: 10% 20% 20% 20% 25%; height:10px;} 
#imgTitre{ margin-top:18px; height:100%; line-height:30px;  } 
#eCol2{ margin:auto; height:100%; } 
#menuIndep-container{display:none; width:0px; height:0px;} 
#rechBarre-container{grid-row:4; left:0px;margin:auto; grid-column:1 / span 4;} 
#rechInput{padding:0;font-size:1rem; margin:auto;} 
#container-usrSiteMsg{grid-column:1 / span 5;} 
#menuDeroulantBarre>li:first-child{display:block; padding: 10px; margin:2px; width:100%; padding-bottom:0px; margin-bottom:20px;} 
.itemBarrePromo{width:50%;} 
#messCom{font-size:1rem;} 
#barreClientContainer, #pageConnexion{display:flex;flex-direction:column;justify-content:space-around;} 
#spinnerPopup, .spinnerPopup{ top: 10px; width:80%;	} 
} 
@media screen and (max-width:667px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
*{font-size:1rem;} 
#devise{display:none;} 
#header-container{ grid-template-columns: 10% 20% 20% 20% 25%; height:10px;} 
#imgTitre{ margin-top:18px; height:100%; line-height:30px;  } 
#eCol2{ margin:auto; height:100%; } 
#menuIndep-container{display:none; width:0px; height:0px;} 
#rechBarre-container{grid-row:4; left:0px;margin:auto; grid-column:1 / span 4;} 
#rechInput{padding:0;font-size:1rem; margin:auto;} 
#container-usrSiteMsg{grid-column:1 / span 5;} 
#menuDeroulantBarre>li:first-child{display:block; padding: 10px; margin:2px; width:100%; padding-bottom:0px; margin-bottom:20px;} 
.itemBarrePromo{width:50%;} 
#messCom{font-size:1rem;} 
#barreClientContainer, #pageConnexion{display:flex;flex-direction:column;justify-content:space-around;} 
#spinnerPopup, .spinnerPopup{ top: 10px; width:80%;	} 
} 
@media screen and (max-width:653px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
.flexToColumn{display:flex; flex-direction:column;}
#ongletBarre li{min-width:50%}
#itemMaint{width:85%} 
#btnAdminText{max-width:50%; color:transparent; text-indent:-99px; left:0px; position:relative; padding:0px; font-size:0px; white-space:break-spaces; width:5px;} 
#btnAdminText::after{color:white; content:"Administration";left:1px; font-size:1rem; padding-left:1px; padding-right:1px;} 
.pageConnexion{padding:0px; margin:0px;} 
.libConnCell{grid-column:1 / span 2; text-align:center;} 
.champsConn{width:95%;} 
.libClientsCell{margin:1px; padding:1px;} 
#tableCli{grid-column:1 / span 5;} 
#syntheseLignes{grid-column:1 / span 2; } 
#blocSynthese{grid-column:1 / span 2; grid-row:3; margin:auto; margin-top:2%; margin-bottom:20px;  padding:0px; width:100%;} 
.blocItemPanier{ margin:auto; width:100%;} 
#recapContainer{grid-column:1 / span 2;} 
#etapesContainer{display:flex; flex-direction:column;} 
#hiddenColonne{display:none; visibility: hidden; width:0px;} 
.hiddenColonne{display:none; visibility: hidden; width:0px;} 
.c64{grid-column:4;} 
.c75{grid-column:5;} 
#c64{grid-column:4;} 
#c75{grid-column:5;} 
#tableMesCdes{grid-template-columns:10% 25% 25% 20% 20%; grid-column-gap:0px;} 
#detailResponsiv{grid-column:1 / span 5;} 
#pdpBarre{display:flex; flex-direction:column;} 
#etapesContainer{display:flex; flex-direction:column;} 
#pub-container{flex-direction: row;} 
#page-container{grid-column:1 / span 5;} 
#tablePages{grid-column:1 / span 5;} 
.gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
#familles-container{	width:65%; height:170px;}
.grid1to2{grid-column: 1 / span 2;}
.tablePanier {display:flex;flex-direction:column;} 
.tablePanier>#tableCli {display:grid; grid-column:1 / span 2; grid-row:1;} 
} 
@media screen and (max-width:640px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
.flexToColumn{display:flex; flex-direction:column;}
#ongletBarre li{min-width:50%}
#itemMaint{width:85%} 
#btnAdminText{max-width:50%; color:transparent; text-indent:-99px; left:0px; position:relative; padding:0px; font-size:0px; white-space:break-spaces; width:5px;} 
#btnAdminText::after{color:white; content:"Administration";left:1px; font-size:1rem; padding-left:1px; padding-right:1px;} 
.pageConnexion{padding:0px; margin:0px;} 
.libConnCell{grid-column:1 / span 2; text-align:center;} 
.champsConn{width:95%;} 
.libClientsCell{margin:1px; padding:1px;} 
#tableCli{grid-column:1 / span 5;} 
#syntheseLignes{grid-column:1 / span 2; } 
#blocSynthese{grid-column:1 / span 2; grid-row:3; margin:auto; margin-top:2%; margin-bottom:20px;  padding:0px; width:100%;} 
.blocItemPanier{ margin:auto; width:100%;} 
#recapContainer{grid-column:1 / span 2;} 
#etapesContainer{display:flex; flex-direction:column;} 
#hiddenColonne{display:none; visibility: hidden; width:0px;} 
.hiddenColonne{display:none; visibility: hidden; width:0px;} 
.c64{grid-column:4;} 
.c75{grid-column:5;} 
#c64{grid-column:4;} 
#c75{grid-column:5;} 
#tableMesCdes{grid-template-columns:10% 25% 25% 20% 20%; grid-column-gap:0px;} 
#detailResponsiv{grid-column:1 / span 5;} 
#pdpBarre{display:flex; flex-direction:column;} 
#etapesContainer{display:flex; flex-direction:column;} 
#pub-container{flex-direction: row;} 
#page-container{grid-column:1 / span 5;} 
#tablePages{grid-column:1 / span 5;} 
.gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
#familles-container{	width:65%; height:170px;}
.grid1to2{grid-column: 1 / span 2;}
.tablePanier {display:flex;flex-direction:column;} 
.tablePanier>#tableCli {display:grid; grid-column:1 / span 2; grid-row:1;} 
} 
@media screen and (max-width:568px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#logo{width: 88%; top:1px; left: 32%;} 
#syntheseLignes{grid-column:1 / span 2; } 
.flexToColumn{display:flex; flex-direction:column;}
.flexToRow{display:flex; flex-direction:row;  grid-row-gap:0px; }
.notInResponsive{display: none;}
.onlyInResponsive{display: block; margin: 1px;}
.champsCli,listeDeroulanteCli{width:100%; grid-column: 1 / span 2;}
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
#tableMesCdes{display:flex; flex-direction:column; grid-column-gap:0px;} 
.w100{width:100%;} 
.m0{margin:0px;} 
.champsMesCdesCell{text-align:left;} 
#detailCdeLignes{display:flex; flex-direction:column; width:100%;margin:auto;} 
#familles-container{	width:55%; height:350px; }
#logo{width: 100%; top:55px; left: 1%;z-index:0;} 
.msgInfos>div>span>img{width: 60%; } 
} 
@media screen and (max-width:540px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#logo{width: 88%; top:1px; left: 32%;} 
#syntheseLignes{grid-column:1 / span 2; } 
.flexToColumn{display:flex; flex-direction:column;}
.flexToRow{display:flex; flex-direction:row;  grid-row-gap:0px; }
.notInResponsive{display: none;}
.onlyInResponsive{display: block; margin: 1px;}
.champsCli,listeDeroulanteCli{width:100%; grid-column: 1 / span 2;}
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
#tableMesCdes{display:flex; flex-direction:column; grid-column-gap:0px;} 
.w100{width:100%;} 
.m0{margin:0px;} 
.champsMesCdesCell{text-align:left;} 
#detailCdeLignes{display:flex; flex-direction:column; width:100%;margin:auto;} 
#familles-container{	width:55%; height:350px; }
#logo{width: 100%; top:55px; left: 1%;z-index:0;} 
.msgInfos>div>span>img{width: 60%; } 
} 
@media screen and (max-width:414px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#tablePages{display:block;} 
.menuDeroulantItem{display:block;width:100%;} 
#gallerie{display:block; padding-bottom:0px; margin-bottom:0px;} 
#tableCli {display:flex; flex-direction:column; justify-content:space-between; margin:auto;} 
.libClientsCell,.libClients {text-align:left;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
.itemBarrePromo{width:80%;} 
 .gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
tablePanier{grid-column:1;} 
champsPanierCell{width:100%} 
#etapesContainer{display:flex; flex-direction:column;padding:20px;} 
.champsCli,listeDeroulanteCli {width:100%; grid-column: 1 / span 2;}
#familles-container{
					width:47%;
					height:550px;
					text-align:center;

				}
.familles-boite{
					text-align:center;
					margin-bottom:1px;
					padding:0px;

				}
.familles-libelle {
					font-size:1rem;
				}
.logo{width: 120%; } 
} 
@media screen and (max-width:411px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#tablePages{display:block;} 
.menuDeroulantItem{display:block;width:100%;} 
#gallerie{display:block; padding-bottom:0px; margin-bottom:0px;} 
#tableCli {display:flex; flex-direction:column; justify-content:space-between; margin:auto;} 
.libClientsCell,.libClients {text-align:left;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
.itemBarrePromo{width:80%;} 
 .gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
tablePanier{grid-column:1;} 
champsPanierCell{width:100%} 
#etapesContainer{display:flex; flex-direction:column;padding:20px;} 
.champsCli,listeDeroulanteCli {width:100%; grid-column: 1 / span 2;}
#familles-container{
					width:47%;
					height:550px;
					text-align:center;

				}
.familles-boite{
					text-align:center;
					margin-bottom:1px;
					padding:0px;

				}
.familles-libelle {
					font-size:1rem;
				}
.logo{width: 120%; } 
} 
@media screen and (max-width:375px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#tablePages{display:block;} 
.menuDeroulantItem{display:block;width:100%;} 
#gallerie{display:block; padding-bottom:0px; margin-bottom:0px;} 
#tableCli {display:flex; flex-direction:column; justify-content:space-between; margin:auto;} 
.libClientsCell,.libClients {text-align:left;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
.itemBarrePromo{width:80%;} 
 .gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
tablePanier{grid-column:1;} 
champsPanierCell{width:100%} 
#etapesContainer{display:flex; flex-direction:column;padding:20px;} 
.champsCli,listeDeroulanteCli {width:100%; grid-column: 1 / span 2;}
#familles-container{
					width:47%;
					height:550px;
					text-align:center;

				}
.familles-boite{
					text-align:center;
					margin-bottom:1px;
					padding:0px;

				}
.familles-libelle {
					font-size:1rem;
				}
.logo{width: 120%; } 
} 
@media screen and (max-width:360px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#tablePages{display:block;} 
.menuDeroulantItem{display:block;width:100%;} 
#gallerie{display:block; padding-bottom:0px; margin-bottom:0px;} 
#tableCli {display:flex; flex-direction:column; justify-content:space-between; margin:auto;} 
.libClientsCell,.libClients {text-align:left;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
.itemBarrePromo{width:80%;} 
 .gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
tablePanier{grid-column:1;} 
champsPanierCell{width:100%} 
#etapesContainer{display:flex; flex-direction:column;padding:20px;} 
.champsCli,listeDeroulanteCli {width:100%; grid-column: 1 / span 2;}
#familles-container{
					width:47%;
					height:550px;
					text-align:center;

				}
.familles-boite{
					text-align:center;
					margin-bottom:1px;
					padding:0px;

				}
.familles-libelle {
					font-size:1rem;
				}
.logo{width: 120%; } 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
} 
@media screen and (max-width:320px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#tablePages{display:block;} 
.menuDeroulantItem{display:block;width:100%;} 
#gallerie{display:block; padding-bottom:0px; margin-bottom:0px;} 
#tableCli {display:flex; flex-direction:column; justify-content:space-between; margin:auto;} 
.libClientsCell,.libClients {text-align:left;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
.itemBarrePromo{width:80%;} 
 .gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
tablePanier{grid-column:1;} 
champsPanierCell{width:100%} 
#etapesContainer{display:flex; flex-direction:column;padding:20px;} 
.champsCli,listeDeroulanteCli {width:100%; grid-column: 1 / span 2;}
#familles-container{
					width:47%;
					height:550px;
					text-align:center;

				}
.familles-boite{
					text-align:center;
					margin-bottom:1px;
					padding:0px;

				}
.familles-libelle {
					font-size:1rem;
				}
.logo{width: 120%; } 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
} 
@media screen and (max-width:250px)  { 
#site-container{width: 100%; margin:auto; } 
#header-containerImg{grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; } 
#promos-container{display:flex; flex-direction:column; margin:auto; margin-bottom:15px; justify-content:space-between; } 
.itemBarrePromo{width:50%; margin:auto;} 
.zoneAcheter{display:block; margin-bottom:0px; width:100%;  grid-column:1 / span 2; } 
.catalogueImgPrd{max-width:150px;} 
.boutons{margin:auto; width:auto;} 
.msgKo{display:block;margin:auto;} 
#panierConteneurItem{ display:flex;flex-direction:column} 
#menuIndep-container{display:none; width:0px; height:0px;} 
#menuD-container{
		position:relative;
		align-self:start;
		display:block;
		text-align:left;
		vertical-align:middle;
		z-index:90;
		top:3px;
		left:5px;
		height:40px;
		width:40px;
		padding:1px;
		margin:1px;
		position:fixed;
		border-radius:5px;} 
#menuD-container> .top-nav-label {
	position: relative;
	right: 0;
	top: 0px;
	height: 2.5rem;
	width: 2.5rem;
	border-radius: 0.1875rem;
	cursor: pointer;
	display: block;
	font-size: 0;
	margin: 0;
	overflow: hidden;
	padding: 1px;
	text-align:center;
}

#menuD-container> .top-nav-label .open-close-menu {
	display: block;
	margin:auto;
	position: absolute;
	z-index: 99999;
	background: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0.1875rem;
	right: 0.1875rem;
	top: 1.125rem;
	transition: 0.25s ease-in-out 0s;
}

#menuD-container> .top-nav-label .open-close-menu::before,
#menuD-container> .top-nav-label .open-close-menu::after {
	content: "";
	display: block;
	position: absolute;
	background-color: #6495ED;
	border-radius: 0.1875rem;
	height: 0.25rem;
	left: 0;
	width: 100%;
	transition-duration: 0.3s, 0.3s;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::before {
	top: -0.6875rem;
	transform-origin: top;
	margin:auto;
}

#menuD-container> .top-nav-label .open-close-menu::after {
	bottom: -0.6875rem;
	transform-origin: bottom;
	margin:auto;
}

#menuD-container> [type="checkbox"]:checked ~ .top-nav-label .open-close-menu {
  background: none;
  transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before,
#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	left: 0.125rem;
	transition-delay: 0s, 0.3s;
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::before {
	top: 0px;
	transform: rotate(45deg);
}

#menuD-container > [type="checkbox"]:checked ~ .top-nav-label .open-close-menu::after {
	bottom: 0;
	transform: rotate(-45deg);
	text-align:center;margin:0;vertical-align:middle;
}

#menuDeroulantBarre { display: none; }

#menuD-container > [type="checkbox"]:checked ~ #menuDeroulantBarre{
	display: block;
}
#menuDeroulantBarre{
		position:fixed;
		padding:0px;
		margin:auto;
		margin-top:10px;
		top:160px;
		text-align:left; 
		z-index:2;
		border-radius:3px;
		height:99%;
		width:99%;
	} 
.menuDeroulantItem ,#menuDeroulantBarre>li:first-child{
		left:1px;
		text-align:left;
		width:auto;
		border-radius:3px;
		padding:10px;
		padding-bottom:0px;
		clear:both;
		padding-bottom:20px;
		margin-bottom:20px;
		width:150px;
	}
.menuDeroulantItem:hover > * , #menuDeroulantBarre>li:first-child > * {
		margin:0px;
		border-radius:3px;
		text-align:left;
	}
.textePpauxMenuDeroulant {
		z-index:2;
		text-align:left;
		padding:0px;
		margin:0px;
		border-radius:3px;
	}
.menuDeroulantItem:hover > ul, #menuDeroulantBarre>li:first-child:hover > ul {
		position:relative;
		display:table;
		left:130px;
		top:-30px;
		height:100%;
		margin:auto;
		z-index:3;
		margin-left:20px;
		border-radius:3px;
	} 
.sousMenuBarre { 
		height:100%;
		width:100%;
		margin:auto;
		z-index:3;
		left:130px;
		border-radius:3px;
		padding-bottom:0px;
		margin-left:20px;
		position:absolute;
	} 
.sousMenuItem{ 
		height:100%;
		padding:1px;
		margin:1px;
	} 
.familles-img {
		display:none;
		width:2px;
	}
#familles-container{
		background:white;
		left:0px;
		display: flex;
		justify-content:space-around;
		position:absolute;
  		flex-wrap: wrap;
		width:75%;
		height:150px;
	}
.familles-boite{
		white-space:break-spaces;
		padding:0px;
		margin:0px;
		max-height:37px;
	}
.familles-libelle {
		white-space:break-spaces;
		padding:0px;
	}
#categories-container{
		border-radius:3px;
	}
.categoriesImages {
		text-align:right;
	}
#rechBarre-container{
		left : 10%; 
		grid-column:1 / span 4;
		grid-column-gap:3px;
		grid-row:2 / span 3;
		margin:0;
		margin:1px;
		padding-top:7px;
		padding-left:28px;
		justify-self:center;
	} 
#rechItem{
		margin:0px;
		padding:0px;
		padding-left:30px;
		left:10%;
	} 
#rechInput{
		margin:0px;
		padding:0px;
	} 
#tablePages{display:block;} 
.menuDeroulantItem{display:block;width:100%;} 
#gallerie{display:block; padding-bottom:0px; margin-bottom:0px;} 
#tableCli {display:flex; flex-direction:column; justify-content:space-between; margin:auto;} 
.libClientsCell,.libClients {text-align:left;} 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
.itemBarrePromo{width:80%;} 
 .gondole-container{display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;} 
tablePanier{grid-column:1;} 
champsPanierCell{width:100%} 
#etapesContainer{display:flex; flex-direction:column;padding:20px;} 
.champsCli,listeDeroulanteCli {width:100%; grid-column: 1 / span 2;}
#familles-container{
					width:47%;
					height:550px;
					text-align:center;

				}
.familles-boite{
					text-align:center;
					margin-bottom:1px;
					padding:0px;

				}
.familles-libelle {
					font-size:1rem;
				}
.logo{width: 120%; } 
.pub-image {max-width:150px; max-height:150px; min-width:150px; min-height:150px; } 
.boutons{width:auto;} 
}