4080 lines
93 KiB
CSS
Executable File
4080 lines
93 KiB
CSS
Executable File
@media screen and (max-width:814px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
}
|
|
@media screen and (max-width:800px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
}
|
|
@media screen and (max-width:764px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
* {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; font-size:1.4rem; }
|
|
#eCol2 {margin:auto; height:100%; }
|
|
#menuIndep-container {display:none; width:0px; height:0px;}
|
|
#rechInput {padding:0;font-size:1rem; margin:auto;}
|
|
#container-usrSiteMsg {grid-column:1 / span 4;}
|
|
#menuDeroulantBarre>li:first-child {display:block; }
|
|
#messCom {font-size:1rem;}
|
|
#barreClientContainer, #pageConnexion {display:flex;flex-direction:column;justify-content:space-around;}
|
|
#spinnerPopup, .spinnerPopup {top: 10px; width:80%; }
|
|
.tableCatalogue {display:block;}
|
|
.prix {display:block; margin:auto; text-align: center;}
|
|
}
|
|
@media screen and (max-width:731px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
* {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; font-size:1.4rem; }
|
|
#eCol2 {margin:auto; height:100%; }
|
|
#menuIndep-container {display:none; width:0px; height:0px;}
|
|
#rechInput {padding:0;font-size:1rem; margin:auto;}
|
|
#container-usrSiteMsg {grid-column:1 / span 4;}
|
|
#menuDeroulantBarre>li:first-child {display:block; }
|
|
#messCom {font-size:1rem;}
|
|
#barreClientContainer, #pageConnexion {display:flex;flex-direction:column;justify-content:space-around;}
|
|
#spinnerPopup, .spinnerPopup {top: 10px; width:80%; }
|
|
.tableCatalogue {display:block;}
|
|
.prix {display:block; margin:auto; text-align: center;}
|
|
}
|
|
@media screen and (max-width:720px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
* {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; font-size:1.4rem; }
|
|
#eCol2 {margin:auto; height:100%; }
|
|
#menuIndep-container {display:none; width:0px; height:0px;}
|
|
#rechInput {padding:0;font-size:1rem; margin:auto;}
|
|
#container-usrSiteMsg {grid-column:1 / span 4;}
|
|
#menuDeroulantBarre>li:first-child {display:block; }
|
|
#messCom {font-size:1rem;}
|
|
#barreClientContainer, #pageConnexion {display:flex;flex-direction:column;justify-content:space-around;}
|
|
#spinnerPopup, .spinnerPopup {top: 10px; width:80%; }
|
|
.tableCatalogue {display:block;}
|
|
.prix {display:block; margin:auto; text-align: center;}
|
|
}
|
|
@media screen and (max-width:667px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
* {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; font-size:1.4rem; }
|
|
#eCol2 {margin:auto; height:100%; }
|
|
#menuIndep-container {display:none; width:0px; height:0px;}
|
|
#rechInput {padding:0;font-size:1rem; margin:auto;}
|
|
#container-usrSiteMsg {grid-column:1 / span 4;}
|
|
#menuDeroulantBarre>li:first-child {display:block; }
|
|
#messCom {font-size:1rem;}
|
|
#barreClientContainer, #pageConnexion {display:flex;flex-direction:column;justify-content:space-around;}
|
|
#spinnerPopup, .spinnerPopup {top: 10px; width:80%; }
|
|
.tableCatalogue {display:block;}
|
|
.prix {display:block; margin:auto; text-align: center;}
|
|
}
|
|
@media screen and (max-width:653px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
.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 4;}
|
|
#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 4;}
|
|
#pdpBarre {display:flex; flex-direction:column;}
|
|
#etapesContainer {display:flex; flex-direction:column;}
|
|
.gondole-container {display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;}
|
|
.grid1to2 {grid-column: 1 / span 2;}
|
|
.tablePanier {display:flex;flex-direction:column;}
|
|
.tablePanier>#tableCli {display:grid; grid-column:1 / span 2; grid-row:1;}
|
|
.catalogueImgPrd {max-width:110px;}
|
|
}
|
|
@media screen and (max-width:640px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
.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 4;}
|
|
#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 4;}
|
|
#pdpBarre {display:flex; flex-direction:column;}
|
|
#etapesContainer {display:flex; flex-direction:column;}
|
|
.gondole-container {display:flex; flex-direction:column; justify-content:space-around; align-content:center; margin:auto; margin-bottom:15px; text-align:center;}
|
|
.grid1to2 {grid-column: 1 / span 2;}
|
|
.tablePanier {display:flex;flex-direction:column;}
|
|
.tablePanier>#tableCli {display:grid; grid-column:1 / span 2; grid-row:1;}
|
|
.catalogueImgPrd {max-width:110px;}
|
|
}
|
|
@media screen and (max-width:568px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#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;}
|
|
#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;}
|
|
.msgInfos>div>span>img {width: 60%; }
|
|
#eCol1 {min-width:30px;}
|
|
#header-containerImg {background-size: cover; }
|
|
#header-containerImg {background-size: contain; size:100%; margin:auto; grid-column: 1/span 5;}
|
|
}
|
|
@media screen and (max-width:540px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#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;}
|
|
#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;}
|
|
.msgInfos>div>span>img {width: 60%; }
|
|
#eCol1 {min-width:30px;}
|
|
#header-containerImg {background-size: cover; }
|
|
#header-containerImg {background-size: contain; size:100%; margin:auto; grid-column: 1/span 5;}
|
|
}
|
|
@media screen and (max-width:414px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#header-containerImg {display:flex; flex-wrap:wrap; }
|
|
#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;}
|
|
.boutons {width:auto;}
|
|
.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-boite {text-align:center; margin-bottom:1px; padding:0px; }
|
|
.familles-libelle {font-size:1rem; }
|
|
#logo {display:none; }
|
|
.titreFamilleVignette:first-child {margin-top:20px;}}
|
|
@media screen and (max-width:411px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#header-containerImg {display:flex; flex-wrap:wrap; }
|
|
#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;}
|
|
.boutons {width:auto;}
|
|
.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-boite {text-align:center; margin-bottom:1px; padding:0px; }
|
|
.familles-libelle {font-size:1rem; }
|
|
#logo {display:none; }
|
|
.titreFamilleVignette:first-child {margin-top:20px;}}
|
|
@media screen and (max-width:375px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#header-containerImg {display:flex; flex-wrap:wrap; }
|
|
#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;}
|
|
.boutons {width:auto;}
|
|
.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-boite {text-align:center; margin-bottom:1px; padding:0px; }
|
|
.familles-libelle {font-size:1rem; }
|
|
#logo {display:none; }
|
|
.titreFamilleVignette:first-child {margin-top:20px;}}
|
|
@media screen and (max-width:360px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#header-containerImg {display:flex; flex-wrap:wrap; }
|
|
#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;}
|
|
.boutons {width:auto;}
|
|
.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-boite {text-align:center; margin-bottom:1px; padding:0px; }
|
|
.familles-libelle {font-size:1rem; }
|
|
#logo {display:none; }
|
|
.titreFamilleVignette:first-child {margin-top:20px;}.boutons {width:auto;}
|
|
}
|
|
@media screen and (max-width:320px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#header-containerImg {display:flex; flex-wrap:wrap; }
|
|
#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;}
|
|
.boutons {width:auto;}
|
|
.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-boite {text-align:center; margin-bottom:1px; padding:0px; }
|
|
.familles-libelle {font-size:1rem; }
|
|
#logo {display:none; }
|
|
.titreFamilleVignette:first-child {margin-top:20px;}.boutons {width:auto;}
|
|
}
|
|
@media screen and (max-width:250px) {
|
|
#site-container {margin:auto; grid-template-columns:15% 21% 21% 22% 20%; }
|
|
#menuD-container {top:25;}
|
|
#bandeau-container {grid-column:1 / span 5;}
|
|
#page-container {grid-column:1 / span 5;}
|
|
#header-containerImg {grid-template-columns:1.7fr 1.7fr 3fr 0.8fr 0.8fr; }
|
|
.itemBarrePromo {margin:auto; margin-top:5px; padding:5px;}
|
|
.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:11;
|
|
|
|
height:40px;
|
|
width:40px;
|
|
padding:1px;
|
|
margin:1px;
|
|
|
|
border-radius:5px; }
|
|
#menuD-container> .top-nav-label {
|
|
position: relative;
|
|
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: 11;
|
|
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 {
|
|
display: block;
|
|
margin:auto;
|
|
position: absolute;
|
|
z-index: 11;
|
|
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:relative;
|
|
padding:7px;
|
|
margin:auto;
|
|
text-align:left;
|
|
z-index:2;
|
|
border-radius:3px;
|
|
max-height:80%;
|
|
width:99%;
|
|
max-width: 100%;
|
|
}
|
|
.menuDeroulantItem {
|
|
left:1px;
|
|
text-align:left;
|
|
width:auto;
|
|
border-radius:3px;
|
|
z-index:0;
|
|
width:98%;
|
|
|
|
}
|
|
.texteMenus {
|
|
z-index:2;
|
|
text-align:left;
|
|
padding:0px;
|
|
margin:0px;
|
|
border-radius:3px;
|
|
display: contents;
|
|
}
|
|
.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:70%;
|
|
margin:auto;
|
|
z-index:10;
|
|
left:130px;
|
|
border-radius:3px;
|
|
padding-bottom:0px;
|
|
margin-left:20px;
|
|
position:absolute;
|
|
top:0px;
|
|
height: max-content;
|
|
|
|
}
|
|
.sousMenuItem{
|
|
height:100%;
|
|
padding:1px;
|
|
margin:1px;
|
|
}
|
|
.familles-img {
|
|
display:none;
|
|
width:2px;
|
|
}
|
|
#familles-container{
|
|
background:white;
|
|
left:0px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content:space-around;
|
|
position:absolute;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
|
|
height:150px;
|
|
z-index:4;
|
|
border:0px;
|
|
width:100%;
|
|
}
|
|
.familles-boite{
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
margin:0px;
|
|
max-height:37px;
|
|
}
|
|
.familles-libelle {
|
|
white-space:break-spaces;
|
|
padding:0px;
|
|
}
|
|
#sousCat-container{
|
|
border-radius:3px;
|
|
}
|
|
.categoriesImages {
|
|
text-align:right;
|
|
}
|
|
#rechBarre-container{
|
|
left : 10%;
|
|
grid-column: 1 / span 4;
|
|
grid-column-gap:3px;
|
|
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;
|
|
}
|
|
.tableCatalogue {width:90%; grid-template-columns:auto;}
|
|
#tableCli{ width:97%; margin:auto; }
|
|
#container-usrSiteMsg{ margin-top:20px; }
|
|
.pdpTxt {font-size:1rem; }
|
|
#header-containerImg {display:flex; flex-wrap:wrap; }
|
|
#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;}
|
|
.boutons {width:auto;}
|
|
.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-boite {text-align:center; margin-bottom:1px; padding:0px; }
|
|
.familles-libelle {font-size:1rem; }
|
|
#logo {display:none; }
|
|
.titreFamilleVignette:first-child {margin-top:20px;}.boutons {width:auto;}
|
|
}
|