
@media screen and (min-width: 600px) and (max-width: 939px) {
  .icon-return_up {
    bottom: 2rem;
    right: 2rem;
  }
}
@media screen and (max-width: 599px) {
  .page--module.produit .icon-return_up {
    display: none;
  }
}
@media screen and (orientation: portrait) and (max-width: 599px) {
  .icon-return_up {
    bottom: 1rem;
    right: 1rem;
  }

}
@media screen and (max-width: 939px) {
  .content {
    width: 100%;
    max-width: 100vw;
  }

  .icoLink {
    width: 4rem;
  }

  .icoLink span {
    display: none;
  }

  .buttonIcon,
  button {
    min-width: 10rem;
  }

  .buttonIcon::before {
    margin-right: 1rem;
  }

  .selectIcon {
    max-width: 100%;
  }
}
/********************************************** HEADER ****************************************************************/
@media screen and (max-width: 939px) {
  #surnav > .content {
    display: none;
  }

  #menuMobile {
    display: block;
  }

  #oecContent .header-site {
    top: 0;
    z-index: 14;
  }

  .header-site:not(.visibleSearch) .header {
    padding-right: 5rem;
  }

  .header-site:not(.visibleSearch) .header .content {
    height: 5rem;
  }

  .header-site.visibleSearch .header .content {
    height: auto;
    width: 100%;
    max-width: unset;
    padding: 0;
    flex-wrap: wrap;
  }

  .header-site .content #menuIcon {
    width: 5rem;
    height: 100%
  }

  .header-site .logo {
    height: 5rem;
    flex: 1 1 43vw;
  }

  .header-site:not(.visibleSearch) .logo .retourAccueil {
    justify-content: center;
  }

  .header-site .bloc {
    width: 5rem;
    height: 5rem;
  }

  .header-site .bloc span[class*="icon-"] {
    top: calc(50% - 1.4rem);
  }

  .header-site .blocHover {
    z-index: 13;
  }

  .header-site .blocHover .bloc {
    height: 5.2rem;
  }

  .header-site .divBloc .blocDetail {
    top: 5rem;
    right: 0;
    width: 100%;
    z-index: 9;
  }

  .header-site .divBloc .blocDetail .icon-cross {
    top: 1.5rem;
    right: 1.5rem;
  }

  .header-site.overModal .divBloc {
    z-index: 10;
  }

  .header-site.overModal .divBloc.blocHover {
    z-index: 12;
  }

  .header-site .bloc::before,
  .header-site .bloc p,
  .header-site .bloc div {
    display: none;
  }

  .header-site #div_panier .bloc span.nbArticles {
    top: 0.5rem;
    right: 0;
  }

}

@media screen and (max-width: 599px) {
  #oecContent .header-site {
    z-index: 30;
  }

  .header-site #div_panier .bloc span.nbArticles {
    width: 1.5rem;
    height: 1.5rem;
  }
}

@media screen and (min-width: 600px) and (max-width: 939px) {
  .header-site:not(.visibleSearch) .header .content,
  .header-site .logo {
    height: 8rem;
  }
}

@media screen and (max-width: 939px) {
  .header .mainMenu {
    display: none;
  }
  .header-site.visibleSearch #navigation {
    display: none;
  }
}

/**************************************************** RECHERCHE *******************************************************/
@media screen and (max-width: 939px) {
  .header-site.visibleSearch #block_recherche {
    order: 1;
    flex: 0 0 80vw;
    min-width: 28rem;
    height: 4.6rem;
    margin: 0 auto;
    padding: 0.2rem 0;
  }
  .header-site.visibleSearch #block_recherche form .recherche .form-item {
    flex: 1 0 calc(100% - 5rem);
  }
  .header-site.visibleSearch #block_recherche form input[type=search] {
    display: block !important;
    width: 100%;
    height: 4rem;
    margin: 0;
    padding: 0.6rem;
  }
  .header-site.visibleSearch #block_recherche form button[type=submit] {
    width: 5rem;
    height: 4rem;
    min-width: unset;
  }

  .header-site:not(.visibleSearch) #block_recherche .recherche {
    height: 5rem;
  }

  .header-site:not(.visibleSearch) #block_recherche form .recherche.selected {
    width: 100%;
    z-index: 20;
  }

  .header-site:not(.visibleSearch) #block_recherche .form-item {
    width: 100%;
  }

  .header-site:not(.visibleSearch) #block_recherche input[type=search] {
    height: 4.8rem;
    width: calc(100% - 5rem);
    margin: 0;
    padding: 0.2rem 0.6rem;
  }

  .header-site:not(.visibleSearch) #block_recherche button[type=submit] {
    min-width: unset;
    width: 5rem;
    height: 4.8rem;
    padding: 0;
    margin: 0;
  }

  #oecContent .header-site:not(.visibleSearch) #block_recherche form .recherche {
    position: fixed;
    top: 0;
    right: 0;
  }

  .header-site:not(.visibleSearch) #block_recherche .recherche.selected {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 14;
  }
  .header-site:not(.visibleSearch) #block_recherche form input[type=search] {
    display: none;
  }
  .header-site:not(.visibleSearch) #block_recherche form button[type=submit] {
    position: absolute;
    top: 0;
    right: 0;
  }
  .header-site:not(.visibleSearch) #block_recherche form .selected button[type=submit] {
    margin: 0;
  }

  .toolbar-vertical #oecContent .header-site:not(.visibleSearch) #block_recherche form .recherche {
    top: 4rem;
  }

}

@media screen and (min-width: 600px) and (max-width: 939px) {
  .header-site:not(.visibleSearch) #block_recherche .recherche {
    height: 8rem;
  }

  .header-site:not(.visibleSearch) #block_recherche input[type=search] {
    height: 7.8rem;
    width: calc(100% - 8rem);
  }

  .header-site:not(.visibleSearch) #block_recherche button[type=submit] {
    width: 8rem;
    height: 7.8rem;
  }
}
/**************************************************** MODAL RECHERCHE *************************************************/
@media screen and (max-width: 939px) {
  .toolbar-vertical #block_recherche .modal_recherche__form_results {
    margin-top: 4rem;
  }

  #block_recherche .modal_recherche__form_results .recherche {
    position: relative;
    width: 100%;
    margin: 0;
  }

  #block_recherche .modal_recherche__container .recherche input[type=search] {
    display: block;
  }

  #block_recherche .modal_recherche__container .recherche button[type=submit] {
    position: relative;
  }

  #block_recherche .modal_recherche__container .modal_recherche__results {
    max-height: calc(100% - 9.5rem);
    padding: 2rem 1rem;
    width: 100%;
  }

  #block_recherche .modal_recherche__results__container .modal_recherche__results__container_title {
    flex-wrap: wrap;
  }

  #block_recherche .modal_recherche__container .productsList .catalogArticle .ligneArticle_detail {
    padding: 1rem 0;
  }

  #block_recherche .modal_recherche__container .productsList .blocStock {
    padding: 0.5rem;
    margin: 0;
  }

  #block_recherche .modal_recherche__container .productsList .blocStock p {
    padding: 0;
  }

  #block_recherche .modal_recherche__container .categoryList a {
    margin: 0 1rem 0.6rem 0;
  }
}
@media screen and (orientation: portrait) and (max-width: 599px) {
  #block_recherche .modal_recherche__results__container .productsList .catalogArticle .ligneArticle_tarif {
    padding: 0.5rem;
  }

  #block_recherche .modal_recherche__results__container .productsList .catalogArticle .ligneArticle_tarif .blocStock {
    width: 100%;
    height: 100%;
    padding: 0;
  }
}

/**************************************************** MENUS ***********************************************************/
@media screen and (max-width: 939px) {
  #navigation {
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    width: 100%;
    height: 5rem;
    z-index: 11;
  }
  #parentLink {
    width: calc(100% - 5rem);
    height: 5rem;
  }
  #parentLink a {
    height: 100%;
  }
  #oecContent #parentLink + #parentLink {
    display: none;
  }
  #navigation #menuIcon {
    width: 5rem;
    height: 5rem;
  }
  header.overModal #menuIcon {
    z-index: 10;
  }
  header.overModal #menuIcon.selected {
    z-index: 12;
  }
}

@media screen and (max-width: 939px) {

  #menuNav {
    display: none;
    position: fixed;
    right: 0.1rem;
    height: 100%;
    overflow: auto;
    z-index: 12;
  }
  #menuContent,
  #menuMobile {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
  }

  #menuContent + #menuMobile {
    padding: 1rem;
    margin-top: 0.2rem;
  }

  #menuNav {
    top: 13rem;
    max-height: calc(100vh - 13rem);
    width: 100%;
  }

  .toolbar-vertical #menuNav {
    top: 17rem;
    max-height: calc(100vh - 17rem);
  }

}


@media screen and (max-width: 599px) {
  #menuNav {
    top: 10rem;
    max-height: calc(100vh - 10rem);
  }
  .toolbar-vertical #menuNav {
    top: 14rem;
    max-height: calc(100vh - 14rem);
  }
}

@media screen and (max-width: 939px) {

  #menuMobile .menu-horizontal ul {
    flex-direction: column;
  }
}

@media screen and (max-width: 939px) {
  #menuContent .blocExpert {
    justify-content: center;
  }

  #menuPLV,
  #catalogMenu > div,
  #catalogMenu .content {
    width: 100%;
  }

  #catalogMenu.catalogMenuVT .icon-cross {
    display: none;
  }

  .mainMenu {
    flex-direction: column;
    width: 100%;
  }

  .mainMenu > .subMenu {
    width: 100%;
  }

  .mainMenu .subMenu a,
  .mainMenu .subMenu span {
    width: 100%;
    min-height: 3rem;
    padding: 0 0 0 1rem;
  }

  .mainMenu .subMenu .menuLevel {
    width: 100%;
  }

  .mainMenu .subMenu .menuLevel a,
  .mainMenu .subMenu .menuLevel span {
    padding: 0 1rem 0 2rem;
  }

  .mainMenu .subMenu .menuLevel .menuLevel2 {
    padding-left: 3rem;
  }

  .mainMenu .subMenu .menuLevel .menuLevel3 {
    padding-left: 4rem;
  }

  .mainMenu .subMenu .menuLevel .menuLevel4 {
    padding-left: 5rem;
  }

  a.navSite,
  span.navSite {
    width: 100%;
    height: 3rem;
    margin: 0;
    padding: 0 1rem;
    justify-content: flex-start;
  }

}

/*************************************************** HEADER ***********************************************************/
@media screen and (min-width: 600px) and (max-width: 939px) {
  .header-site:not(.visibleSearch) .header {
    padding-right: 8rem;
  }
  .header-site .bloc {
    width: 8rem;
    height: 8rem;
  }

  #oecContent header .blocHover .bloc {
    height: 8.2rem;
    margin-bottom: -0.2rem;
  }

  #oecContent header .blocDetail {
    top: 8rem;
    right: 0;
    width: 60vw;
  }

  header #div_panier .bloc span.nbArticles {
    top: 1rem;
    right: 1rem;
  }
}

@media screen and (min-width: 600px) and (max-width: 939px) {
  #navUserAccount {
    height: 10rem;
  }

  #navUserAccount .content a {
    width: 10rem;
    height: 10rem;
  }

  #navUserAccount .content a span {
    height: 5rem;
  }

  .tdvContent #vosCoordonnees .fieldsetContent p .input,
  .tdvContent #vosCoordonnees .fieldsetContent p input[type=text],
  .tdvContent #vosCoordonnees .fieldsetContent p input[type=email] {
    width: 24rem;
  }
  #titleUserAccount .pageTitle .content h1 {
    width: 100%;
  }

  .blockTotal p {
    width: 25rem;
  }

  .blockTotal p .value {
    flex: 0 0 14rem;
  }

  .blockTotal .buttonIcon {
    min-width: 14rem;
  }

}
@media screen and (min-width: 600px) and (max-width: 939px) {
  #contentDashboardUser .bloc {
    width: 50rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieComment input {
    width: 30rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect .selectIcon select {
    min-width: 33rem;
  }

  #oecContent .caddieLine .product-tag-chantier {
    position: absolute;
    bottom: 0.6rem;
    right: 2.8rem;
  }

  #contentUserAccount .profilContent .fieldset p.identiteClient select {
    width: 8rem;
  }

  .caddieBlock {
    flex: 0 0 calc((100% / 3) - 1rem);
    width: calc((100% / 3) - 1rem);
    min-width: 20rem;
  }

  .caddieBlock:nth-child(3n) {
    margin: 0 0 1rem 0;
  }

  /*#validation_panier .blockTotal p {
    width: 21rem;
  }*/
}



@media screen and (max-width: 599px) {
  .header-site #bloc_connexion .openweb-user-login-form .form-item-name label,
  .header-site #bloc_connexion .openweb-user-login-form .form-item-pass label {
    flex: 0 0 35%;
    width: 35%;
  }

  .header-site #bloc_connexion .openweb-user-login-form .form-item-name input,
  .header-site #bloc_connexion .openweb-user-login-form .form-item-pass input {
    flex: 0 0 64%;
    width: 64%;
  }

  .header-site #bloc_connexion .buttonIcon {
    max-width: calc(50% - 1rem);
    min-width: 40vw;
  }
}





/********************************************** Menu catalogue ********************************************************/
@media screen and (max-width: 939px) {
  #show_catalogMenu {
    display: none;
  }

  #catalogMenu .menuProduit_categories {
    width: 100%;
  }

  #catalogMenu.catalogMenuHZ .menuProduit_categories {
    flex-direction: column;
  }

  #catalogMenu.catalogMenuHZ .menuProduit_categories .menu {
    justify-content: flex-start;
  }

  #catalogMenu .menuProduit_categories .menu {
    min-height: 3rem;
    width: 100%;
  }

  #catalogMenu .menuProduit_categories .menu {
    position: relative;
    margin: 0;
    padding: 0.4rem 1rem;
  }

  #catalogMenu .menuProduit_categories .menu span {
    display: inline-block;
    width: calc(100% - 2rem);
  }

  #catalogMenu .menuProduit_categories .menu::before {
    position: absolute;
    top: calc(50% - 0.7rem);
    right: 0.5rem;
  }

  #catalogMenu .menuProduit_activites {
    display: none;
  }

  .layout-container .header-site + main {
    min-height: calc(100vh - 22rem);
  }
}
/********************************************** SLIDERS ***************************************************************/
@media screen and (max-width: 939px) {
  .slick .slick__slide .views-field-body-1 .field-content {
    max-width: calc(100% - 2rem);
  }

  .cadreListeProduits {
    padding: 1rem;
  }

  .paragraph--type--galerie .content,
  .cadreListeProduits .content {
    width: 100%;
    padding: 3vw 3rem;
  }

  .cadreListeProduits.compact.dark .produit .cadreTitre {
    width: calc(100% - 2rem);
    margin: 0 1rem;
  }

  .cadreListeProduits.compact.light .produit .cadreTitre {
    width: calc(100% - 2rem);
    margin: 1rem;
  }

  .cadreListeProduits.dark .produit .cadreTarif {
    padding: 1rem 1rem 3rem;
  }

  #asideColumn {
    flex-direction: column;
  }

  #asideColumn .cadreListeProduits {
    width: 100%;
    flex: 0 0 100%;
    margin: 0;
    padding: 0;
  }
}
/********************************************** Page ******************************************************************/
@media screen and (max-width: 939px) {
  .pageTitle h1 {
    margin: 0;
    padding: 1rem;
  }

  #leftCol aside,
  #leftCol article {
    width: 100%;
  }
}
/********************************************** Blocs communs *********************************************************/
@media screen and (max-width: 939px) {
  .header-site.overModal {
    position: fixed;
    z-index: 150;
  }

  #oecContent .header-site.overModal {
    z-index: 40;
  }

  .blockTotal p span.showOptions {
    flex: 0 0 4rem;
    width: 4rem;
    padding: 0;
    margin: 0 auto;
  }

  #parentLink a span {
    margin-left: 1rem;
  }

  .breadcrumb {
    display: none;
  }

  .optionsMenu .showOptions {
    width: 4rem;
    margin: 0 auto;
    padding: 1rem;
  }

  .fieldsetLine .optionsMenu span.showOptions {
    flex: 0 0 4rem;
  }

  .caddieFooter .infosTransport .infosTransportPopup p {
    width: 100%;
  }
}
/********************************************** PANIER ****************************************************************/
@media screen and (max-width: 939px) {
  .blockTotal p {
    width: 25rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect {
    flex-wrap: wrap;
    margin: 0 0 0.5rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect .selectIcon {
    height: 3rem;
    margin: 0 0 0.5rem;
    padding: 0;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect .selectIcon::before {
    display: none;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect .selectIcon select {
    width: 100%;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect .selectIcon span.icon-arrowdown {
    height: 3rem;
  }

  .caddieBlocComplement .caddieBlocComplementBloc > a {
    margin-top: 1rem
  }

  #contentUserFavoriteCaddies .caddieContainer .caddieHeader .content .caddieHeaderInfo {
    padding: 0.5rem 0 0.7rem 0.5rem;
  }

  #contentUserFavoriteCaddies .caddieLineOptions .optionsMenu {
    margin-right: 0.5rem;
  }

  .caddieLineOptions {
    margin: 0;
    padding: 0;
  }

  .caddieLineOptions label.checkBox {
    margin: 0 1rem 0 0.9rem;
    padding: 1rem 0;
  }

  .caddieLineOptions .icoLink {
    width: 12rem;
  }

  .caddieLine label.checkBox {
    display: none;
  }

  .caddieContainer:last-child {
    margin-bottom: 2rem;
  }

  .caddieContainer .caddieHeader,
  .caddieContainer .caddieContent,
  .caddieContainer .caddieFooter {
    width: 100%;
    padding: 0 0.5rem;
  }

  .caddieContainer .caddieContent {
    margin: 1rem 0;
  }

  .caddieContainer .caddieHeader .toggleCaddie {
    flex: 0 0 2rem;
    margin: 0;
  }

  .caddieHeader .blockTotal,
  .caddieFooter .blockTotal {
    min-height: 3rem;
    padding: 0.5rem 0;
  }

  .caddieContainer .caddieHeaderContent {
    flex-wrap: wrap;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo {
    min-height: 8rem;
    margin-left: 0.5rem;
    padding: 1rem 0;
    flex: 1 0 50%;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieComment {
    margin: 0 0 1rem 0;
  }

  .hideCaddie .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieComment {
    display: none;
  }

  .caddieLineOptions .buttonIcon[class*=icon-] {
    min-width: 11rem;
    padding: 0 1rem 0 3rem;
  }

  .caddieLineOptions label.selectAgence {
    min-width: 4rem;
    min-height: 3rem;
  }

  .caddieLineOptions label.selectChantier {
    min-width: 5rem;
    min-height: 3rem;
  }

  .caddieLineOptions label.selectAgence form select,
  .caddieLineOptions label.selectChantier form select {
    display: none;
  }

  .caddieLineOptions .popupSelect {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20;
  }

  .caddieLineOptions .popupSelect .selectAgence,
  .caddieLineOptions .popupSelect .selectChantier {
    position: absolute;
    left: 10vw;
  }

  .caddieLineOptions .popupSelect .selectAgence select {
    width: 80vw;
    padding: 0 1rem 0 3.5rem;
  }

  .caddieLineOptions .popupSelect .selectChantier select {
    width: 80vw;
    padding: 0 1rem 0 4rem;
  }

  .caddieLineOptions .popupSelect .selectAgence select option,
  .caddieLineOptions .popupSelect .selectChantier select option {
    padding: 0.4rem;
  }

  .caddieLine {
    margin: 0 0 0.6rem;
  }

  .caddieLine .caddieLineContent .width100 {
    width: calc(100% - 1.6rem);
  }

  .caddieLine .caddieLineComplement .caddieComment input {
    width: 19rem;
  }

  .caddieLine .caddieLineContent {
    width: 100%;
  }

  .caddieLine .caddieLineContent .toggleLine {
    flex: 0 0 1.5rem;
    width: 1.5rem;
  }

  .caddieLine .caddieLinePrice {
    width: 100%;
    padding: 0.5rem;
  }

  .caddieLine .caddieLineImage {
    flex: 0 0 8rem;
    margin: 0 0 0 0.5rem;
  }

  .caddieLine .caddieLineImage .lineImage {
    flex: 0 0 8rem;
    width: 8rem;
    height: 8rem;
  }

  .caddieLine .caddieLineShort .caddieLineInfo .libelleLine .ligneArticle_desi2,
  .caddieLine .caddieLineShort .caddieLineInfo .libelleLine .ligneArticle_desi3,
  .caddieLine .caddieLineShort .caddieLineInfo .libelleLineComplement,
  .caddieLine .caddieLineShort .caddieLineComplement {
    display: none;
  }

  .caddieLine .caddieLineFull .caddieLineComplement .editComment {
    width: calc(100% - 13rem);
  }

  .caddieLine .caddieLineFull .caddieLineComplement .editComment input {
    max-width: 22rem;
    margin-right: 0.2rem;
  }

  .caddieLine .caddieLineFull .caddieLineComplement .editComment button {
    width: 2.4rem;
    height: 2.4rem;
  }

  .caddieLine .caddieLineFull .caddieLineComplement .libelleLineComplement {
    display: flex;
    flex-direction: column;
  }

  .caddieLine span.tarifUnitLine,
  .caddieLine span.quantiteLine,
  .caddieLine span.tarifTotalLine {
    padding: 0 0.5rem;
  }

  .caddieLine .caddieLinePrice > span > span {
    white-space: nowrap;
  }

  .caddieLine .caddieLinePrice .quantiteLine {
    min-width: 30%;
    margin: 0 0.5rem;
    padding-left: 1rem;
  }

  .caddieLine .caddieLinePrice .quantiteLine p {
    align-items: baseline;
  }

  .caddieLine .caddieLinePrice .quantiteLine span.quantite {
    margin: 0 0.2rem 0 0;
  }

  .caddieLine .caddieLinePrice .quantiteLine input.quantite {
    height: 2rem;
    width: 5rem;
    margin: 0 0.2rem 0 0;
  }

  .caddieLine .caddieLinePrice .quantiteLine .quantiteLineConv {
    height: 1rem;
  }

  .caddieLine .caddieLinePrice .tarifUnitLine {
    position: relative;
  }

  .caddieLine .caddieLinePrice .tarifUnitLine {
    min-width: 32%;
  }

  .caddieLine .caddieLinePrice .tarifTotalLine {
    min-width: 32%;
    margin: 0;
  }

  .caddieLine .caddieLinePrice .tarifUnitLine p,
  .caddieLine .caddieLinePrice .tarifTotalLine p {
    height: 2rem;
  }

  .caddieLine .caddieLinePrice .tarifUnitLine p.tarifUnitRemise {
    height: 1.6rem;
  }

  .caddieLine span.icon-delete {
    padding: 0.5rem;
  }

  .caddieLine .caddieLineFull {
    position: relative;
  }

  .infosTransport .buttonIcon {
    width: auto;
    padding: 0 0.5rem;
  }

  .infosTransport .buttonIcon::before {
    margin-right: 0.5rem;
  }
}
/********************************************** TUNNEL DE COMMANDE ****************************************************/
@media screen and (max-width: 939px) {
  #tdv {
    height: calc(20vw - 0.3rem);
    max-height: 12rem;
    margin: 0;
    padding: 0;
  }

  #tdv .content {
    width: calc(100% - 0.2rem);
    margin: 0 0.1rem;
    justify-content: center;
    align-items: flex-start;
  }

  #tdv .content p {
    margin: 0;
  }

  #tdv .content p + p {
    margin: 0 0 0 0.1rem;
  }


  .tdvContent .pageTitle {
    min-height: 5rem;
  }

  #validation_connexion {
    flex-wrap: wrap;
    justify-content: center;
  }

  #validation_connexion .fieldset {
    flex: 1 0;
    max-width: 40rem;
    margin: 0 1rem 3rem;
    padding: 0;
  }

  #validation_connexion .fieldset .form-actions {
    margin: 2rem 0 0;
  }

  .tdvContent .tdvContainer + .content,
  #validation_reglement .tdvContent .tdvContainer + p {
    margin-bottom: 2rem;
  }

  .tdvContent .fieldset .width50 {
    flex: 0 0 100%;
    width: 100%;
    margin-bottom: 1rem;
  }

  .tdvContent #blocEmporte .displayAdresse {
    min-width: 25rem;
  }

  .tdvContent .fieldset .fieldsetContent .blocDate {
    width: 100%;
    margin: 1rem 0;
  }

  .tdvContent .blocChoiceDetail {
    flex-direction: column;
  }

  .tdvContent #typeCommande .fieldsetContent {
    flex-direction: column;
    flex-wrap: nowrap;
  }

  .tdvContent #typeCommande .blocDate {
    margin: 0.5rem 0;
  }

  .tdvContent #typeCommande .blocDate > span {
    flex-wrap: wrap;
  }

  .tdvContent #typeCommande .blocChoice {
    display: flex;
    justify-content: space-between;
  }

  .tdvContent #typeCommande .blocChoice p {
    flex: 1;
    margin-right: 0.1rem;
  }

  .tdvContent #typeCommande .blocChoice p:last-of-type {
    margin-right: 0;
  }

  .tdvContent #typeCommande .blocChoice p .buttonLabel {
    width: 100%;
    justify-content: center;
    white-space: pre-wrap;
  }

  .tdvContent #typeCommande .blocType {
    width: 100%;
  }

  .tdvContent #typeCommande .blocType #js_saisieAdresse label {
    width: 7rem;
    padding: 0;
  }

  .tdvContent #typeCommande .blocType p {
    flex-wrap: wrap;
  }

  .tdvContent .fieldset .fieldsetContent p .label + .selectBox {
    margin-left: 0.5rem;
  }

  .tdvContent .blocChoice .buttonLabel {
    height: auto;
    min-height: 4rem;
    padding: 0.5rem 1rem;
  }

  .tdvContent .blocChoice input:checked + .buttonLabel::after {
    bottom: -1rem;
    left: calc(50% - 0.25rem);
    margin-left: 0;
  }

  .tdvContent #typeCommande #js_saisieAdresse {
    width: calc(100% - 4.8rem);
  }

  .tdvContent .fieldset .formInfo p input {
    width: 100%;
  }

  .tdvContent .fieldset .formInfo p input.smallInput {
    width: calc(100% - 7rem);
  }

  .tdvContent .fieldset .formInfo p input.miniInput + input {
    width: calc(100% - 8rem);
  }

  .tdvContent #infoCGV {
    flex-direction: column;
    align-items: flex-start;
    padding: 0 1rem;
    margin-top: 0.5rem;
  }

  .tdvContent #infoCGV button {
    align-self: flex-end;
  }

  #validation_panier .blockTotal .buttonIcon {
    width: 12rem;
    padding: 0;
  }

  #validation_panier .blockTotal p {
    width: 18.5rem;
  }

  #validation_panier .blockTotal p .value {
    flex: 0 0 12rem;
  }

  #validation_panier .blockTotal .buttonIcon {
    padding: 0 2rem 0 1rem;
  }

  #validation_panier .blockTotal .buttonIcon::before {
    left: auto;
    right: 0;
    margin-right: 0.5rem;
  }

  #validation_panier .caddieBlocComplement {
    width: 100%;
  }

  #validation_panier .caddieBlocComplement .cartAttachmentItems .buttonIcon {
    min-width: 10rem;
    height: 3rem;
    padding: 0 1rem 0 3rem;
  }

  #validation_panier .caddieBlocComplement .cartAttachmentItems .buttonIcon::before {
    margin-right: 0.6rem;
  }

  #coupon_promo {
    flex-wrap: wrap;
    align-items: flex-start;
  }

  .blocCoupon input[type=text] {
    height: 3rem;
    margin: 0;
  }

  .blocCoupon > p {
    height: 3rem;
    margin: 0 0.5rem 0 0;
  }

  #coupon_promo button {
    height: 3rem;
    width: 3rem;
    padding: 0;
  }

  #coupon {
    max-width: 21rem;
    margin: 0;
  }

  #coupon p .libelleRemise {
    max-width: 17rem;
  }

  .tdvContent .modeReglementDetail {
    padding: 1rem;
  }

  .tdvContent .modeReglementDetail img {
    max-width: 35vw;
  }

  .tdvContent .tdvContainer {
    margin: 0 0.5rem 2rem;
  }

  .tdvContent .modeReglement .buttonLabel {
    width: 25rem;
    padding: 0.1rem;
  }

  .tdvContent .modeReglement input:checked + .buttonLabel::after {
    bottom: -1rem;
    left: 50%;
  }

  #validation_reglement {
    padding: 0 0 2rem;
  }

  #validation_confirmation p {
    margin: 0 0.5rem 1rem;
  }

  #validation_confirmation .icoLink span {
    display: block;
  }
}

/********************************************** MON COMPTE ************************************************************/
@media screen and (max-width: 939px) {
  #oecContent #titleUserAccount .pageTitle {
    display: none;
  }

  #titleUserAccount .pageTitle .content h1 {
    width: 100%;
  }

  #titleUserAccount .pageTitle h1 + .title {
    display: none;
  }

  #navUserAccount {
    margin: 0;
    padding: 0;
  }

  #navUserAccount .content {
    width: calc(100% - 0.2rem);
    margin: 0 0.1rem;
    justify-content: center;
    flex-wrap: wrap;
  }

  #navUserAccount .content a {
    margin: 0.1rem;
    padding: 0;
  }

  #navUserAccount .content a:first-child {
    margin-left: 0;
  }

  #navUserAccount .content a::before {
    width: 100%;
    flex: 0 0 50%;
    height: 50%;
    padding: 0;
  }

  #navUserAccount .content a span {
    flex: 0 0 50%;
    height: 50%;
    width: calc(100% - 0.8rem);
    margin: 0 0.4rem;
    padding: 0.6rem 0;
  }

  .userAccount {
    position: relative;
  }

  .userAccount h2,
  #contentUserOrders h2 {
    margin: 0.5rem;
  }

  .userAccount .content h2 {
    margin-right: 2rem;
  }

  #contentDashboardUser {
    flex-direction: column;
    margin: 0 auto;
  }

  #contentDashboardUser .leftPart,
  #contentDashboardUser .rightPart {
    width: 94%;
    max-width: 50rem;
    margin: 0 auto;
  }

  #contentDashboardUser .bloc {
    width: 100%;
    margin: 1rem auto 0;
  }

  #contentDashboardUser .bloc:last-of-type {
    margin-bottom: 2rem;
  }

  #contentDashboardUser .accountProfil {
    padding: 1rem 0 0;
  }

  #contentDashboardUser .accountProfil p {
    margin: 0 1rem;
  }

  #contentDashboardUser .accountProfil .fieldsetContainer p {
    margin: 1rem 1rem 0;
  }

  #contentDashboardUser .bloc p.linkContent {
    padding: 0 0 1rem 0;
    width: 100%;
  }

  #contentDashboardUser .accountProfil p.linkContent {
    width: calc(100% - 2rem);
  }

  #contentDashboardUser .bloc p.linkContent a {
    height: 4rem;
  }

  #contentDashboardUser .bloc p.linkContent .icon-arrow-right {
    margin-left: 0.5rem;
  }

  #contentDashboardUser .bloc .accountCaddyCDE,
  #contentDashboardUser .bloc .accountCaddyTYP {
    width: calc(50% - 0.5rem);
    max-width: 25rem;
  }

  #contentDashboardUser .fieldsetLegend {
    margin: 0 0 1rem;
  }

  #contentDashboardUser .fieldsetContainer .fieldsetLine .lineDate {
    flex: 1 0 7rem;
    padding: 0;
  }

  #contentDashboardUser .fieldsetContainer .fieldsetLine .lineName {
    flex: 1 1 18rem;
    padding: 0 0 0 0.5rem;
  }

  #contentDashboardUser .fieldsetContainer .fieldsetLine .lineTotal {
    flex: 0 0 10rem;
    padding: 0;
  }

  #contentDashboardUser .fieldsetContainer .fieldsetLine span[class*="icon-"] {
    padding: 0;
  }

  #contentUserAccount .profilContent .fieldset {
    padding: 1rem;
  }

  #contentUserAccount .profilContent .fieldset .userChangeMdp .fieldsetLegend,
  #contentUserAccount .profilContent .fieldset .userChangeMdp .fieldsetContent {
    padding: 1rem;
  }

  #contentUserAccount .fieldset .fieldsetLegend + .fieldsetContent {
    padding: 0.5rem 1rem;
  }

  #contentUserAccount .fieldset .fieldsetLegend + .fieldsetContent p {
    margin: 0 0 0.1rem;
  }

  #contentUserAccount .profilContent .fieldset .fieldsetContent p a {
    flex: 0 0 35%;
  }

  #contentUserAccount .profilContent .fieldset + .fieldset .fieldsetContent {
    height: auto;
  }

  #contentUserAccount .fieldset .fieldsetContent .inputCheckbox input[type="checkbox"] + label {
    flex: 1 0 70%;
  }

  #contentUserAccount .profilContent .userChangeMdp .fieldsetContent p label {
    flex: 0 0 40%;
    width: 40%;
  }

  #contentUserAccount .profilContent .userChangeMdp .fieldsetContent p input {
    flex: 0 0 100%;
    width: auto;
  }

  #contentUserAccount .prefContent {
    margin-top: 1rem;
    padding: 0 1rem;
  }

  #contentUserAccount .prefContent .fieldsetContainer > div {
    flex-wrap: wrap;
  }

  #contentUserAccount .prefContent .fieldset .fieldsetContent p label {
    flex: 0 0 55%;
    width: 55%;
  }

  #contentUserAccount .prefContent .fieldset .fieldsetContent p select {
    flex: 0 0 45%;
    width: 45%;
  }

  #contentUserAccount .actionContent {
    justify-content: space-around;
    margin: 0 0.5rem;
  }

  #contentUserOrders .fieldsetContainer .accountFilter div {
    align-self: flex-start;
    margin: 0.5rem 1rem 0.5rem 0;
  }

  #contentUserOrders .fieldsetContainer .accountFilter p {
    flex-wrap: wrap;
  }

  #contentUserOrders .fieldsetContainer .accountFilter {
    flex: 1;
    width: auto;
  }

  #contentUserOrders .fieldsetContainer .accountFilter a.buttonIcon {
    flex: 1 0 22rem;
    min-width: 22rem;
    margin: 0.5rem 1rem;
    justify-content: flex-start;
  }

  #contentUserOrders .mvts-form {
    margin: 1rem 1rem 2rem;
  }

  #contentUserOrders .mvts-form div {
    flex-direction: column;
    align-items: flex-end;
  }

  #contentUserOrders .mvts-form p span {
    margin: 1rem 0;
  }

  #contentUserOrders .fieldsetContainer .fieldsetContainerHeader {
    width: 100%;
    margin: 0 0 1rem;
    padding: 0 0.5rem;
  }

  #contentUserOrders .fieldsetContainer a > span:not(.showOptions) {
    padding: 0 0 0 0.5rem;
  }

  #contentUserOrders .fieldsetContainer .lineDate {
    flex: 0 0 6rem;
  }

  #contentUserOrders .fieldsetContainer .lineName {
    flex: 1 1 18rem;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #contentUserOrders .fieldsetContainer .lineTotal {
    flex: 1 1 13rem;
  }

  #contentUserOrders .fieldsetContainer .orderOptions {
    flex: 0 0 2.8rem;
  }

  #contentUserOrders .fieldsetContainer .optionsMenu {
    flex: 0 0 4.5rem;
  }

  #contentUserOrders .fieldsetContainer div.optionsMenu {
    flex: 0 0 4rem;
  }

  #contentUserOrders .orderHeader .content {
    flex-wrap: wrap;
  }

  #contentUserOrders .orderHeader .orderHeaderContent {
    flex: 1 0 30rem;
    padding: 1rem 0 0.3rem 0.5rem;
  }

  #contentUserOrders .orderHeader .orderHeaderContent .adresse {
    position: relative;
  }

  #contentUserOrders .orderHeader .orderHeaderContent .adresse + .adresse {
    margin-left: 0.5rem;
  }

  #contentUserOrders .orderHeader .orderHeaderContent .adresse p.title {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 3rem;
    padding: 0 2.5rem 0 1rem;
  }

  #contentUserOrders .orderHeader .orderHeaderContent .adresse p.title::before {
    position: absolute;
    top: 0.7rem;
    right: 0.5rem;
  }

  #contentUserOrders .orderHeader .orderHeaderContent .adresse p.detail {
    position: absolute;
    bottom: 3.5rem;
    width: 50vw;
    height: 0;
    padding: 0;
    z-index: 1;
    overflow: hidden;
  }

  #contentUserOrders .orderHeader .orderHeaderContent .adresse p.detail span {
    display: inline-block;
    padding: 1rem;
  }

  #contentUserOrders .orderHeader .blockTotal {
    flex: 1 0 30rem;
    min-height: 5rem;
    padding: 2rem 0.5rem 0.5rem 0;
    margin: 0;
  }

  #contentUserOrders .orderHeader #typeCommande {
    position: absolute;
    right: 0;
    top: 0.5rem;
  }

  #contentUserOrders .orderHeader #typeCommande .buttonIcon {
    min-width: 10rem;
    width: 10rem;
    height: 3rem;
    padding: 0 0 0 3rem;
    justify-content: flex-start;
  }

  #contentUserOrders .orderHeader #typeCommande .buttonIcon::before {
    left: 0.5rem;
    top: 0.7rem;
  }

  #contentUserOrders .orderHeader #linkOptions .icon-pdf {
    width: 3.5rem;
    height: 3rem;
  }

  #contentUserOrders .orderHeader #linkOptions .icon-pdf::before {
    margin-right: 0.5rem;
  }

  #contentUserOrders .orderContent .fieldsetLine {
    display: block;
    width: calc(100% - 1rem);
    min-height: 5rem;
    height: auto;
    margin: 0.5rem;
    padding: 0.4rem 0;
  }

  #contentUserOrders .orderContent .commentLine {
    padding: 0.4rem;
  }

  #contentUserOrders .orderContent .fieldsetLine p {
    flex-wrap: wrap;
  }

  #contentUserOrders .orderContent .fieldsetLine p span {
    flex: 0 0 calc(25% - 1rem);
    padding: 0 0.4rem;
  }

  #contentUserOrders .orderContent .trp-bloc {
    padding: 0;
    margin: 0 0.5rem 0.6rem;
    width: calc(100% - 1rem);
  }

  #contentUserOrders .orderContent .trp-bloc__block .trp-bloc__ligne {
    flex: 0 0 30rem;
    margin-right: 1rem;
    overflow: hidden;
  }

  #contentUserOrders .orderContent .trp-bloc__block .trp-bloc__ligne .trp-bloc__label {
    width: 12rem;
  }

  #contentUserOrders .orderContent .trp-bloc__block .trp-bloc__ligne .trp-bloc__display {
    flex: 1;
    min-width: 17rem;
  }

  #contentUserOrders .orderContent .trp-bloc__block .trp-bloc__ligne .trp-bloc__display a {
    display: block;
    width: 100%;
  }

  #contentUserOrders .orderContent .fieldsetLine span.codeLine {
    display: none;
  }

  #contentUserOrders .orderContent .fieldsetLine span.libelleLine {
    flex: 1 0 100%;
    margin: 0 0 0.5rem;
  }

  #contentUserOrders .orderFooter {
    display: none;
  }

  #contentUserOrders .legend > p {
    flex: 1 1 50%;
  }

  #contentUserSites .sitesLineHeaders,
  #contentUserSites .fieldsetContainer .fieldsetLine {
    flex-wrap: wrap;
  }

  #contentUserSites .sitesLineHeaders .lineName,
  #contentUserSites .fieldsetContainer .fieldsetLine .lineName {
    order: 1;
  }

  #contentUserSites .sitesLineHeaders .lineNumber,
  #contentUserSites .fieldsetContainer .fieldsetLine .lineNumber {
    order: 2;
  }

  #contentUserSites .sitesLineHeaders .lineTotal,
  #contentUserSites .fieldsetContainer .fieldsetLine .lineTotal {
    order: 3;
  }

  #contentUserSites .sitesLineHeaders .lineList,
  #contentUserSites .fieldsetContainer .fieldsetLine .lineList {
    order: 4;
    width: 100%;
    justify-content: flex-start;
  }

  .caddieBlock {
    margin: 0 1rem 1rem 0;
  }

  .caddieBlockContent {
    padding: 1rem 0.5rem;
  }

  .caddieBlockContent .lineImage {
    flex: 0 0 5rem;
    width: 5rem;
    height: 5rem;
    margin-right: 0.5rem;
  }

  .caddieBlockContent .icon-delete {
    width: 2rem;
    height: 2rem;
  }
}

/********************************************** Page perso ************************************************************/
@media screen and (max-width: 939px) {
  #infosContent .flex-fJbetween {
    flex-direction: column;
  }

  #infosContent .conteneur_leftBox {
    flex: 1 1 10rem;
  }

  #infosContent .conteneur_mainBox {
    margin: 0;
  }

  main .conteneur_mainBox {
    width: 100%;
  }

  form.maxContent {
    width: 100%;
  }
}
/********************************************** BLOC ASIDE ************************************************************/
@media screen and (max-width: 939px) {
  aside {
    overflow: hidden;
    width: 100%;
    padding: 2rem 0;
  }

  aside .bloc {
    margin: 0 0.5rem 1rem;
  }

  .reassuranceContent .width100 {
    padding: 0 1rem;
  }

  .reassuranceContent .content {
    justify-content: space-evenly;
  }
}
@media screen and (max-width: 400px) {
  .aside .asideContent .bloc {
    flex: 0 0 calc(50vw - 3rem);
    width: calc(50vw - 3rem);
    min-height: calc(50vw - 3rem);
  }
}
/********************************************** FOOTER ****************************************************************/
@media screen and (max-width: 939px) {
  .footer-site .flex-fJbetween {
    flex-wrap: wrap;
  }

  .footer-site .content > div {
    /*flex: 1 0 100%;
    width: 100%;*/
    flex: 1 1 15rem;
    padding: 1rem;
  }

  .footer-site .content > div .title_h6 {
    margin: 1rem 0 0.3rem;
  }

  .footer-site .content > div ul {
    margin-bottom: 0;
  }

  .footer-site .title_h6 + .title_h6 {
    margin-top: 1rem;
  }

  .footer-site .footerSecond a {
    padding: 0;
  }

  .footer-site .footerSecond .separator {
    margin: 0 0.6rem;
  }

  .footer-site .horaires-agence table {
    margin: 0;
  }
}

/********************************************** Popup modal ***********************************************************/
@media screen and (max-width: 939px) {
  #modal {
    width: 100%;
    z-index: 30;
  }

  #modal .popup {
    min-height: 30vh;
    max-height: 80vh;
    width: 90vw;
  }

  #modal .popup h2 {
    padding: 0.8rem 2rem 0.8rem 1rem;
  }

  #modal .popup h2 + div {
    height: calc(80vh - 10rem);
    align-items: flex-start;
  }

  #modal .agenceFormPopup {
    flex-direction: column;
    align-items: flex-start;
  }

  #modal .agenceFormPopup span {
    margin: 0 0 0.5rem;
  }

  #modal #interroStockResults {
    height: 58vh;
    overflow: auto;
  }

  #modal #interroStockResults table {
    width: 100%;
  }

  #modal #choixAgenceResults {
    height: calc(80vh - 17rem);
    overflow: auto;
  }

  #modal #choixAgenceResults table {
    width: 100%;
  }
}
/********************************************** Page 404 **************************************************************/
@media screen and (max-width: 939px) {
  .page403,
  .page404 {
    padding: 0 1rem;
  }

  #oecContent .page403 .pageTitle,
  #oecContent .page404 .pageTitle {
    position: fixed;
    top: 14.2vw;
    width: 86vw;
    height: 10vw;
    z-index: 12;
  }

  .page403 h3,
  .page404 h3 {
    margin: 0;
    padding: 1rem 0;
  }
}
/********************************************** Formulaires ***********************************************************/
@media screen and (max-width: 939px) {
  .drupalForm .fieldset > .fieldsetContent {
    padding: 0.4rem 0.2rem;
  }

  .drupalForm .content {
    padding: 0 1rem;
  }

  .drupalForm .webform-element--title-inline > label {
    min-height: 2rem;
    height: 2rem;
  }

  .drupalForm .js-form-type-checkbox span + label {
    width: 8rem;
  }

  .drupalForm .form-managed-file .pixel_16 {
    padding: 0;
  }

  .drupalForm .webform-actions button {
    margin: 0.5rem;
  }

  .drupalForm .form-item-civiliteclient select,
  .drupalForm .form-item-codepostal input[type=number] {
    width: 8rem;
  }

  .drupalForm .form-item-nomclient input[type=text],
  .drupalForm .form-item-ville input[type=text] {
    width: calc(100% - 8.4rem);
  }

  .drupalForm .fieldsetConnexion div.password-strength {
    width: 100%;
  }

  .drupalForm .fieldsetConnexion .form-item-mdp .password-suggestions {
    margin: -1rem 0 1rem;
  }

  #loginForm .openweb-user-login-form,
  #loginForm .openweb-user-create-form {
    padding: 1rem 1rem 0;
  }

  .pageForm .form-item input:not([type=radio]):not([type=checkbox]):not([type=file]),
  .pageForm .form-item input.inputText {
    width: 30rem;
    min-width: 30rem;
  }
}
@media screen and (min-width: 600px) and (max-width: 939px) {
  .drupalForm .form-item-civiliteclient,
  .drupalForm .form-item-nomclient,
  .drupalForm .form-item-siretclient {
    float: left;
    width: auto;
    margin-right: 0.1rem;
  }

  .drupalForm .contentDrupalForm {
    width: 60rem;
  }

  .drupalForm .js-form-type-checkbox span + label {
    width: 10rem;
  }

  .form-item input[type=text],
  .form-item input[type=email],
  .form-item input[type=password] {
    width: 46rem;
  }

  .form-item input[type=tel] {
    width: 20rem;
  }

  .form-item textarea {
    height: 15rem;
    width: 60rem;
    padding: 0 0.5rem;
  }

  .drupalForm .form-item-login input[type=email],
  .drupalForm .form-item-mail input[type=email] {
    width: 45rem;
  }

  .drupalForm .form-item-societeclient input[type=text] {
    width: 54.2rem;
  }

  .drupalForm .form-item-nomclient input[type=text],
  .drupalForm .form-item-prenomclient input[type=text],
  .drupalForm .form-item-siretclient input[type=text],
  .drupalForm .form-item-idtvaclient input[type=text] {
    width: 23rem;
  }

  .drupalForm .form-item-codepostal input[type=number] {
    width: 9rem;
  }

  .drupalForm .form-item-ville input[type=text] {
    width: calc(100% - 9.1rem);
  }

  .drupalForm .form-item-civiliteclient select {
    width: 8rem;
  }

  .drupalForm .fieldsetAdresse {
    float: left;
    width: calc(50% - 1rem);
    margin-right: 1rem;
    margin-bottom: 2rem;
  }

  .drupalForm .fieldsetContact {
    width: 50%;
  }

}
@media screen and (orientation: portrait) and (max-width: 599px) {
  .drupalForm .form-wrapper {
    max-width: 45rem;
  }
}
@media screen and (max-width: 599px) {
  form.contact-form .form-item label:not(.pixel_32) {
    width: 100%;
  }

  form.contact-form .inputFilebox .form-managed-file,
  form.contact-form .inputFilebox .description {
    margin: 0 0 0.5rem;
  }

  .drupalForm #edit-coordonnees {
    flex-direction: column;
  }
  #passwordChange .width50,
  #passwordChange .form-item input:not([type=checkbox]) {
    width: 100%;
  }
}
/********************************************** Connexion obligatoire  ************************************************/
@media screen and (max-width: 939px) {
  .connexion-obligatoire #oecContent {
    margin-top: 10rem;
  }

  .connexion-obligatoire #oecContent .header-site {
    padding-right: 0;
  }

  .connexion-obligatoire #oecContent header .header .content {
    height: 10.1rem;
    width: 100%;
  }

  .connexion-obligatoire #oecContent header .logo {
    height: 10rem;
    flex: 1 1 100%;
  }
}
/********************************************** CONTENU ***************************************************************/

@media screen and (max-width: 939px) {
  .list-card .card {
    width: calc(50% - 3rem)
  }

}

@media screen and (max-width: 600px) {
  .list-card .card {
    width: calc(100% - 3rem)
  }

}
@media screen and (max-width: 939px) {
  .paragraph .layout--twocol-section > .layout__region--first {
    margin-bottom: 1rem;
  }

  .paragraph[class*="reverse"] .layout--twocol-section > .layout__region--first {
    order: 2;
    margin-bottom: 0;
  }

  .paragraph[class*="reverse"] .layout--twocol-section > .layout__region--second {
    order: 1;
    margin-bottom: 1rem;
  }
}
@media screen and (max-width: 600px) {
  .paragraph {
    padding: 0 1rem;
  }

  .paragraph .paragraph {
    padding: 0;
  }

  .paragraph .width80,
  .paragraph .width70,
  .paragraph .width60,
  .paragraph .width50,
  .paragraph .width40,
  .paragraph .width30 {
    width: 80%;
  }
}
@media screen and (max-width: 650px) {
  .paragraph .layout--twocol-section > .layout__region--first {
    padding-right: 0;
  }

  .paragraph .layout--twocol-section > .layout__region--second {
    padding-left: 0;
  }
}
/********************************************** Menu Select ***********************************************************/
@media screen and (max-width: 939px) {
  #catalogMenuSelect div.selectBox .v-select {
    height: 5rem;
  }
}
@media screen and (max-width: 939px) {
  #catalogMenuSelect {
    height: 50vh;
  }

  #catalogMenuSelect div.selectBox {
    flex-direction: column;
  }

  #catalogMenuSelect div.selectBox .v-select {
    min-width: unset;
    width: 60vw;
    height: 5rem;
    margin: 0 2rem 0.2rem;
    flex: 1;
  }

  #catalogMenuSelect div.selectBox .v-select .vs__selected-options {
    height: 5rem;
  }

  #catalogMenuSelect div.selectBox .v-select .vs__actions {
    width: 8.8rem;
    height: 5rem;
  }

  #catalogMenuSelect div.selectBox .v-select .vs__actions span.icon-arrowdown,
  #catalogMenuSelect div.selectBox .v-select .vs__actions span.icon-arrow-down {
    justify-content: center;
    align-items: center;
    width: 5rem;
    height: 5rem;
  }

  #catalogMenuSelect div.selectBox .v-select .vs__actions .vs__clear {
    width: 2rem;
    min-width: 2rem;
    margin: 0;
    padding: 0;
  }

  #catalogMenuSelect div.selectBox .v-select .vs__actions .vs__clear {
    width: 2rem;
    min-width: 2rem;
    margin: 0;
    padding: 0;
  }

  #catalogMenuSelect div.selectBox .v-select .vs__dropdown-option {
    padding: 1rem 2rem;
  }
}
@media screen and (max-width: 599px) {
  #catalogMenuSelect {
    width: calc(100% - 1rem);
    padding-bottom: 2rem;
  }

  #catalogMenuSelect div.selectBox .v-select {
    margin: 0 0 0.1rem;
  }

  #catalogMenuSelect div.selectBox p {
    margin-bottom: 0;
  }

  .menu-vertical ul li a,
  .menu-horizontal ul li a {
    min-height: 2rem;
    display: inline-block;
  }
}

/********************************************** A ranger **************************************************************/
@media screen and (orientation: portrait) and (max-width: 939px) {
  #contentUserAccount .profilContent {
    margin: 0 0.5rem;
    padding: 0;
    flex-direction: column;
  }

  #contentUserAccount .fieldset {
    flex: 0 0 100%;
    width: 100%;
  }
}
@media screen and (orientation: landscape) and (max-width: 939px) {
  /************************************************* Blocs communs ******************************************************/
  #modal #interroStockResults {
    height: 42vh;
  }

  #vosCoordonnees,
  #adresseFacturation {
    flex: 0 0 calc(50% - 2rem);
    max-width: calc(50% - 2rem);
    width: calc(50% - 2rem);
  }

  #typeCommande {
    flex: 0 0 calc(100% - 2rem);
    max-width: calc(100% - 2rem);
    width: calc(100% - 2rem);
  }

  #contentUserAccount .profilContent {
    margin: 0 1rem;
  }

  #contentUserAccount .profilContent .fieldset {
    width: 50%;
  }

  #contentUserAccount .prefContent .fieldset {
    width: 100%;
  }
}

@media screen and (min-width: 600px) and (max-width: 939px) {
  .icon-return_up {
    bottom: 2rem;
    right: 2rem;
  }

}

@media screen and (min-width: 600px) and (max-width: 939px) and (orientation: portrait) {
  #oecContent header .header .content,
  #oecContent header .logo {
    height: 8rem;
  }

  #oecContent header .bloc {
    width: 8rem;
    height: 8rem;
  }

  #oecContent header .blocHover .bloc {
    height: 8.2rem;
    margin-bottom: -0.2rem;
  }

  #oecContent header .blocDetail {
    top: 8rem;
    right: 0;
    width: 60vw;
  }

  header #div_panier .bloc span.nbArticles {
    top: 1rem;
    right: 1rem;
  }
}

@media screen and (min-width: 600px) and (max-width: 939px) {
  #navUserAccount {
    height: 10rem;
  }

  #navUserAccount .content a {
    width: 10rem;
    height: 10rem;
  }

  #navUserAccount .content a span {
    height: 5rem;
  }
}

@media screen and (min-width: 600px) and (max-width: 939px) {
  .tdvContent #vosCoordonnees .fieldsetContent p .input,
  .tdvContent #vosCoordonnees .fieldsetContent p input[type=text],
  .tdvContent #vosCoordonnees .fieldsetContent p input[type=email] {
    width: 24rem;
  }

  #titleUserAccount .pageTitle .content h1 {
    width: 100%;
  }

  .blockTotal p {
    width: 25rem;
  }

  .blockTotal p .value {
    flex: 0 0 14rem;
  }

  .blockTotal .buttonIcon {
    min-width: 14rem;
  }
}

@media screen and (min-width: 600px) and (max-width: 939px) {
  .drupalForm .form-item-civiliteclient,
  .drupalForm .form-item-nomclient,
  .drupalForm .form-item-siretclient {
    float: left;
    width: auto;
    margin-right: 0.1rem;
  }

  .drupalForm .contentDrupalForm {
    width: 60rem;
  }

  .drupalForm .js-form-type-checkbox span + label {
    width: 10rem;
  }

  .form-item input[type=text],
  .form-item input[type=email],
  .form-item input[type=password] {
    width: 46rem;
  }

  .form-item input[type=tel] {
    width: 20rem;
  }

  .form-item textarea {
    height: 15rem;
    width: 60rem;
    padding: 0 0.5rem;
  }

  .drupalForm .form-item-login input[type=email],
  .drupalForm .form-item-mail input[type=email] {
    width: 45rem;
  }

  .drupalForm .form-item-societeclient input[type=text] {
    width: 54.2rem;
  }

  .drupalForm .form-item-nomclient input[type=text],
  .drupalForm .form-item-prenomclient input[type=text],
  .drupalForm .form-item-siretclient input[type=text],
  .drupalForm .form-item-idtvaclient input[type=text] {
    width: 23rem;
  }

  .drupalForm .form-item-codepostal input[type=number] {
    width: 9rem;
  }

  .drupalForm .form-item-ville input[type=text] {
    width: calc(100% - 9.1rem);
  }

  .drupalForm .form-item-civiliteclient select {
    width: 8rem;
  }

  .drupalForm .fieldsetAdresse {
    float: left;
    width: calc(50% - 1rem);
    margin-right: 1rem;
    margin-bottom: 2rem;
  }

  .drupalForm .fieldsetContact {
    width: 50%;
  }

  #contentDashboardUser .bloc {
    width: 50rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieComment input {
    width: 30rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect .selectIcon select {
    min-width: 33rem;
  }

  #oecContent .caddieLine .product-tag-chantier {
    position: absolute;
    bottom: 0.6rem;
    right: 2.8rem;
  }

  #contentUserAccount .profilContent .fieldset p.identiteClient select {
    width: 8rem;
  }

  .caddieBlock {
    flex: 0 0 calc((100% / 3) - 1rem);
    width: calc((100% / 3) - 1rem);
    min-width: 20rem;
  }

  .caddieBlock:nth-child(3n) {
    margin: 0 0 1rem 0;
  }

  /*#validation_panier .blockTotal p {
    width: 21rem;
  }*/
}

/*************************************************** HEADER ***********************************************************/


@media screen and (max-width: 599px) {

  header #bloc_connexion .openweb-user-login-form .form-item-name label,
  header #bloc_connexion .openweb-user-login-form .form-item-pass label {
    flex: 0 0 35%;
    width: 35%;
  }

  header #bloc_connexion .openweb-user-login-form .form-item-name input,
  header #bloc_connexion .openweb-user-login-form .form-item-pass input {
    flex: 0 0 64%;
    width: 64%;
  }

  header #bloc_connexion .buttonIcon {
    max-width: calc(50% - 1rem);
    min-width: 40vw;
  }
}

@media screen and (max-width: 599px) {
  #contentUserOrders .mvts-form p {
    margin: 0 1rem 0.5rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo {
    width: 21rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieComment input {
    width: 16rem;
  }

  .caddieBlocComplement,
  .caddieBlocComplement .caddieBlocComplementBloc {
    position: unset;
    height: auto;
    width: 100%;
  }

  .caddieBlocComplement .blocExpert .saisieExpert {
    height: auto;
    flex-wrap: wrap;
  }

  .tdvContent #typeCommande .blocType > p {
    flex-direction: column;
    align-items: flex-start;
  }
}
/************************************************* Blocs communs ******************************************************/

@media screen and (max-width: 599px) {

  .blocTarif {
    margin: 0;
  }

  .blocTarif .tarifEcotaxePopup {
    bottom: 2rem;
    left: 0;
    padding: 0.5rem;
  }

  .blocTarif .tarifEcotaxe:active + .tarifEcotaxePopup,
  .blocTarif .tarifEcotaxe:target + .tarifEcotaxePopup,
  .blocTarif .tarifEcotaxe:focus + .tarifEcotaxePopup {
    display: block;
  }

  .autresAgences {
    padding: 0.2rem;
  }

/*  .blocSaisie {
    display: flex;
    justify-content: flex-end;
  }*/

  .blocSaisie .quantite {
    width: 6rem;
  }

/*  .blocSaisie .buttonIcon {
    min-width: 0;
  }*/

  .blockTotal p {
    height: 3rem;
    min-width: 18rem;
    margin: 0 0 0.5rem 0;
  }

  .blockTotal > :last-child {
    margin: 0;
  }

  .blockTotal p a span {
    flex: 0 0 2rem;
  }

  .blockTotal .buttonIcon {
    height: 3rem;
  }

  .blockTotal .buttonIcon::before {
    top: calc(50% - 0.75rem);
    left: 0.5rem;
  }

  .blockTotal p .label {
    flex: 1 0 6rem;
    margin: 0 0.5rem 0 0;
    padding: 0;
  }

  .blockTotal p .value {
    flex: 0 0 11rem;
    padding: 0.2rem;
  }
}
@media screen and (max-width: 599px) {
  #contentUserOrders .fieldsetContainer .accountOrderHeader .optionsMenu {
    display: none;
  }
  #contentUserOrders .fieldsetContainer .fieldsetLine a {
    flex-wrap: wrap;
    padding: 6px 0 4px 0;
  }

  #contentUserOrders .fieldsetContainer .fieldsetLine .orderType {
    order: 1;
  }

  #contentUserOrders .fieldsetContainer .orderOptions {
    margin-left: 0.4rem;
    order: 2;
  }

  #contentUserOrders .fieldsetContainer .fieldsetLine .lineName {
    order: 3;
  }

  #contentUserOrders .fieldsetContainer .fieldsetLine .lineName + .lineName {
    order: 4;
  }

  #contentUserOrders .fieldsetContainer .fieldsetLine .lineDate {
    order: 5;
  }

  #contentUserOrders .fieldsetContainer .fieldsetLine .lineDate + .lineDate {
    order: 6;
  }

  #contentUserOrders .fieldsetContainer .fieldsetLine .lineTotal {
    order: 7;
    flex: 1 1 7rem;
  }
  /*********************************************** Formulaire ***********************************************************/

  /*********************************************** Autre page ***********************************************************/
  body.contact form.contact-form .js-form-type-item label {
    width: 100%;
  }

  body.contact form.contact-form .js-form-type-item {
    height: 7rem;
  }

}
@media screen and (orientation: landscape) and (max-width: 599px) {
  #contentUserAccount .profilContent {
    flex-direction: column;
  }

  #contentUserAccount .profilContent .fieldset {
    width: 100%;
  }

  .tdvContent .tdvContainer #vosCoordonnees,
  .tdvContent .tdvContainer #adresseFacturation {
    width: calc(100% - 2rem);
    flex: 0 0 calc(100% - 2rem);
    max-width: calc(100% - 2rem);
  }
}

@media screen and (orientation: portrait) and (max-width: 599px) {
  header #bloc_profil p .buttonIcon {
    padding: 0 1rem 0 3rem;
  }

  .caddieBlocComplement .caddieBlocComplementBloc {
    padding-bottom: 0.5rem;
    padding-left: 0.5rem;
  }

  .caddieBlock {
    flex: 0 0 calc(50% - 0.5rem);
    width: calc(50% - 0.5rem);
    min-width: 20rem;
  }

  .caddieBlock:nth-child(2n) {
    margin: 0 0 1rem 0;
  }

  .caddieLineComplement.flex-fJbetween-fAend {
    flex-direction: column;
  }

  .caddieLineComplement.flex-fJbetween-fAend > p {
    justify-content: flex-end;
  }

  .caddieLineComplement .product-tag-chantier {
    margin-top: 0.5rem;
  }

  #navUserAccount .content a {
    max-width: 8rem;
    max-height: 8rem;
    width: 8rem;
    height: 8rem;
  }

  .blocTarif .tarifEcotaxe .montant {
    display: block;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo div + div {
    padding-bottom: 3.4rem;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieSelect .selectIcon select {
    min-width: 12rem;
  }

  .caddieLine .caddieLineFull .caddieLineComplement .editComment {
    width: calc(100% - 1rem);
  }

  .caddieLine .caddieLinePrice .quantiteLine {
    padding: 0;
  }

  #infoCGV label {
    flex-direction: column;
    align-items: flex-start;
  }

  #contentUserOrders .adminOptions p {
    flex-direction: column;
    align-items: flex-start;
  }

  #contentUserOrders .adminOptions p > span {
    width: 100%;
    flex-wrap: wrap;
    padding: 0 0.5rem;
  }

  #contentUserOrders .adminOptions p label {
    flex: 1 0 90%;
    height: 2rem;
  }

  #contentUserOrders .adminOptions p input {
    width: 40%;
    margin: 0;
  }

  #contentUserOrders .adminOptions p a {
    flex: 1 0 40%;
  }

  #modal .popup .pixel_64 + .popupContent {
    max-width: calc(100% - 5.4rem);
    overflow: visible;
  }

  #modal #choixAgenceResults {
    margin-left: -4rem;
  }

  #contentUserAccount .profilContent {
    margin: 0 0.5rem;
    padding: 0;
    flex-direction: column;
  }

  #contentUserAccount .fieldset {
    flex: 0 0 100%;
    width: 100%;
  }
}
@media screen and (orientation: portrait) and (max-width: 599px) {
  #contentUserAccount .profilContent {
    margin: 0 0.5rem;
    padding: 0;
    flex-direction: column;
  }

  #contentUserAccount .fieldset {
    flex: 0 0 100%;
    width: 100%;
  }
}
@media screen and (max-width: 500px) {
  .blocCoupon > p {
    margin: 0 0 0.5rem 0;
  }

  #contentDashboardUser .bloc p.accountNumber + p.linkContent {
    width: 60%;
  }

  #contentDashboardUser .twoBlocs {
    flex-direction: column;
  }

  #contentDashboardUser .twoBlocs .accountCaddyCDE + .accountCaddyTYP {
    margin-top: 0.6rem;
  }

  #contentDashboardUser .bloc .accountCaddyCDE,
  #contentDashboardUser .bloc .accountCaddyTYP {
    flex-direction: row;
    width: 100%;
    height: 8rem;
    padding: 0;
    max-width: 100%;
  }

  #contentDashboardUser .bloc p.accountNumber {
    padding: 0 1rem;
  }

  #contentDashboardUser .bloc .accountCaddyCDE p,
  #contentDashboardUser .bloc .accountCaddyTYP p {
    flex-direction: row;
    justify-content: center;
    width: 50%;
    height: 100%;
  }

  #contentDashboardUser .bloc .accountCaddyCDE p.linkContent,
  #contentDashboardUser .bloc .accountCaddyTYP p.linkContent {
    justify-content: flex-end;
    padding: 0 1rem;
  }

  #contentDashboardUser .bloc p.accountNumber span {
    margin: 0 0.2rem 0 0;
  }

  #contentUserAccount .profilContent .fieldset .fieldsetContent {
    width: 90vw;
  }

  #contentUserAccount .profilContent .fieldset .fieldsetContent p.identiteClient input {
    flex: 1 1 11.2rem;
    width: 11.2rem;
  }

  #contentUserAccount .prefContent .fieldset .choixClient input {
    flex: 1 0 6rem;
    width: 6rem;
  }

  #modal .popup .pixel_64 {
    height: 3.2rem;
    width: 3.2rem;
    font-size: 2.6rem;
  }

  #modal .popup {
    height: 80vh;
    width: 90vw;
  }

  #modal .popup .popupContent .validationButtons {
    height: calc(100vh - 36rem);
  }

  #modal .popup .popupContent .validationButtons .popupButton {
    flex-wrap: wrap;
    justify-content: center;
    left: 1rem;
  }

  #modal .popup .popupContent .validationButtons .popupButton button {
    margin: 0.5rem;
  }

  .openweb-user-login-form {
    padding: 0 1rem;
  }

  .openweb-user-login-form .content {
    padding: 0;
  }

  .agenceFormPopup .buttonIcon[class*=icon-] {
    min-width: 3rem;
    width: 3rem;
    padding: 0;
  }

  .agenceFormPopup .buttonIcon[class*=icon-]::before {
    left: 0.6rem;
    margin: 0;
  }

  .agenceFormPopup .buttonIcon span {
    display: none;
  }

  .openweb-user-login-form {
    padding: 0 1rem;
  }

  .openweb-user-login-form .content {
    padding: 0;
  }

  .agenceFormPopup .buttonIcon[class*=icon-] {
    min-width: 3rem;
    width: 3rem;
    padding: 0;
  }

  .agenceFormPopup .buttonIcon[class*=icon-]::before {
    left: 0.6rem;
    margin: 0;
  }

  .agenceFormPopup .buttonIcon span {
    display: none;
  }

}
@media screen and (max-width: 400px) {
  .blocExpert .saisieExpert input.expertArticle,
  .blocExpert .saisieExpert .form-item input[type=text].expertArticle {
    width: 17rem;
  }
  .pageForm .inline-fieldset {
    flex-wrap: wrap;
  }
  fieldset .form-item input:not([type=radio]):not([type=checkbox]):not([type=file]),
  fieldset .form-item select,
  fieldset .form-item textarea,
  fieldset .form-item input.inputText {
    width: calc(100vw - 5.4rem);
    min-width: calc(100vw - 5.4rem);
  }
  .form-item input:not([type=radio]):not([type=checkbox]):not([type=file]),
  .form-item select,
  .form-item textarea,
  .form-item input.inputText {
    width: 92vw;
    min-width: 92vw;
  }
}
@media screen and (max-width: 400px) {
  .tdvContent .displayAdresse,
  .tdvContent #js_saisieAdresse {
    width: 100%;
  }

  .blocCoupon input[type=text] {
    width: 13rem;
  }

  #coupon p .libelleRemise {
    max-width: 12rem;
  }
}
@media screen and (max-width: 400px) {
  #contentUserCaddies .blockTotal p .label,
  #validation_panier .blockTotal p .label {
    flex: 1 0 4rem;
  }

  #contentUserCaddies .blockTotal p .value,
  #validation_panier .blockTotal p .value {
    flex: 0 0 11rem;
  }

  #contentUserCaddies .blockTotal .buttonIcon,
  #validation_panier .blockTotal .buttonIcon {
    min-width: 11rem;
  }

  .caddieContainer .caddieHeaderContent .blockTotal,
  .caddieContainer .caddieFooter .blockTotal {
    width: calc(100% - 0.5rem);
    align-items: flex-end;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo {
    width: 100%;
  }

  .caddieHeader .caddieHeaderContent .caddieHeaderInfo .caddieComment input {
    width: 60vw;
  }

  .caddieLine .caddieLineFull .caddieLineInfo {
    flex-direction: column;
  }

  .caddieLine .caddieLineImage .lineImage {
    margin: 0.5rem 0 0;
  }

  .caddieLine .quantiteLine input.quantite {
    width: 4rem;
  }

  .blockTotal p {
    width: 100%;
  }

  .blockTotal p .label {
    flex: 1 0 calc(100% - 16rem);
  }

  .blockTotal p .value {
    flex: 0 0 15rem;
  }

  .caddieBlock {
    flex: 0 0 100%;
    width: 100%;
    min-width: 20rem;
  }

  .caddieBlockContent {
    width: 100%;
  }

  .caddieLine .caddieLineContent {
    width: calc(100% - 0.5rem);
  }

  #contentUserOrders .orderHeader .orderHeaderContent {
    padding: 1rem 0.3rem 0;
  }

  #contentUserOrders .orderHeader .blockTotal {
    padding: 0.5rem;
  }

  #contentUserOrders .orderContent .fieldsetLine p span {
    flex: 0 0 calc(33% - 1rem);
  }

  #contentUserOrders .orderContent .fieldsetLine .tarifTotalLine + .tarifTotalLine {
    flex: 0 0 100%;
    margin: 0.4rem 0 0;
  }

  #navUserAccount .content a span {
    width: calc(100% - 0.4rem);
    margin: 0 0.2rem;
  }

  #contentDashboardUser .accountProfil p {
    width: calc(100% - 2rem);
  }
}
@media screen and (max-width: 499px) {
  .caddieLine .caddieLinePrice {
    flex-direction: column;
    align-items: stretch;
  }
  .caddieLine .caddieLinePrice .quantiteLine {
    margin: 0.5rem 0;
  }
}

/********************************************** CATALOGUE *************************************************************/
@media screen and (max-width: 939px) {
  #catalogContent {
    position: relative;
  }

  .categoryEntete .categoryPicture,
  .categoryEntete .categoryDescription {
    margin: 1rem 0;
  }

  .categoryFiles a {
    min-width: 10rem;
    max-width: 16rem;
    height: 18rem;
  }

  .categoryFiles a span:first-child {
    height: 13rem;
    max-width: 15.6rem;
  }

  #listeCategories + .catalogTitle {
    height: 0.1rem;
  }

  #listeCategories + .catalogTitle .pageTitle {
    display: none;
  }

  .catalogFacet {
    display: none;
    position: absolute;
    width: 100%;
    max-height: 74vh;
    margin: 5rem 0 0;
    padding: 0 1rem;
    overflow-x: hidden;
    overflow-y: auto;
    z-index: 10;
  }

  .catalogFacet .facetForm {
    height: 100%;
    padding: 0;
    overflow: auto;
  }

  .catalogFacet fieldset.plv li::before {
    margin-right: 0.2rem;
  }

  .catalogFacet .filterBox .blocStock {
    flex-direction: column;
    align-items: flex-start;
  }

  .catalogFacet .blocStock .libelleStock {
    white-space: nowrap;
  }

  .catalogContent {
    width: 100%;
  }

  .productsFilter {
    width: 100%;
    margin: 0.5rem 0;
    padding: 0.5rem;
    z-index: 2;
    flex-wrap: wrap;
  }

  .productsFilter > *,
  .productsPaging {
    margin: 1rem auto;
  }

  .productsFilter .productsPerPage {
    display: none;
  }

  .productsFilter label {
    padding: 0 0.5rem;
  }

  .productsFilter select {
    max-width: 50vw;
    padding: 0 0.5rem;
  }

  #listeProduits .catalogDetail {
    width: 100%;
  }

  .productsList .catalogArticle {
    position: relative;
  }

  .productsList .catalogArticle .ligneArticle_image .mainImage span {
    display: none;
  }

  .productsList .catalogArticle .ligneArticle_image .pictosLinks {
    flex-wrap: wrap;
    justify-content: center;
  }

  .productsList .catalogArticle .ligneArticle_image .pictosLinks span {
    width: 2rem;
    height: 2rem;
    margin: 0 0.1rem;
    padding: 0;
  }

  .productsList .catalogArticle .ligneArticle_detail h2 {
    margin: 0;
  }

  .productsList .catalogArticle .ligneArticle_detail .ligneArticle_code {
    margin: 0.3rem 0 0;
  }

  .productsList .catalogArticle .ligneArticle_detail .blocTarif {
    padding: 0.5rem;
  }

  .productsList .catalogArticle .ligneArticle_tarif .produitStartingPrice {
    display: none;
  }

  .withPromo .blocTarif .title {
    padding-left: 3rem;
  }

  #modal #listeDeclinaisons {
    width: 100%;
    height: 70vh;
    overflow: auto;
  }

  #modal #listeDeclinaisons .listeDeclinaisons .declinaisonConteneur {
    width: 100%;
  }

  #modal #saisie {
    max-height: 70vh;
    overflow: auto;
  }
}

@media screen and (max-width: 599px) {
  .productsFilter select {
    max-width: 13rem;
  }
  .productsList .catalogArticle {
    margin: 1rem 0.5rem;
  }

  .productsList p.optionImg .showOption img {
    max-height: 5rem;
    max-width: 5rem;
  }

  .productsList .catalogArticle .ligneArticle_tarif {
    width: 100%;
    max-height: 22rem;
    margin: 0;
    padding: 1rem 0.5rem;
    z-index: 12;
  }

  #listeProduits .productsList .catalogArticle .ligneArticle_tarif {
    display: grid;
    grid-template-areas:  "tarif stock"
                          "tarif saisie";
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 5rem minmax(5rem, 1fr);

  }

  .productsList .catalogArticle .ligneArticle_tarif .blocTarif {
    grid-area: tarif;
    break-inside: avoid;
  }

  .productsList .catalogArticle .ligneArticle_tarif.withPromo .blocTarif {
    margin-top: 1rem;
  }

  .productsList .catalogArticle .ligneArticle_tarif .produitStock {
    grid-area: stock;
  }
  .productsList .catalogArticle .ligneArticle_tarif .produitStock .blocStock {
    margin: 0;
  }

  .productsList .catalogArticle .ligneArticle_tarif .blocSaisie {
    grid-area: saisie;
    margin: 0;
  }

  #oecContent #productCard .productsList .catalogArticle .productsList .ligneArticle_tarif .blocStock {

  }
  .productsList .blocTarif .prixBarre span,
  .productsList .blocTarif .prix span,
  .productsList .blocTarif .prixPrepa span,
  .productsList .blocTarif .tarifEcotaxe span.montant {
    white-space: nowrap;
  }

  .productsList .tarifQuantitatif {
    width: 100%;
    margin: 0.5rem 0;
  }

  .productsList .tarifQuantitatif p {
    min-width: unset;
  }

  .productsList .tarifQuantitatif .tarifQuantitatifPopup {
    display: none;
    position: absolute;
    right: 0;
    z-index: 5;
  }

  .productsList .ligneArticle_tarif.withPromo .blocStock {
    top: 2rem
  }

  .productsList .ligneArticle_tarif .blocStock .pictoStock {
    display: inline-flex;
    flex-direction: column;
    justify-content: center;
    width: 4rem;
    height: 4rem;
    margin: 0;
    padding: 0;
  }

  .productsList .ligneArticle_tarif .blocStock .pictoStock span {
    flex: 0;
    width: 3rem;
    height: 0.8rem;
    margin: 0 0 0.2rem;
    padding: 0.3rem;
  }

  .productsList .ligneArticle_tarif .blocStock .pictoStock span:last-child {
    margin-bottom: 0;
  }

  .productsList .ligneArticle_tarif .blocStock .libelleStock,
  .productsList .ligneArticle_tarif .blocStock .pictoStock span::after {
    display: none;
  }

  .productsList .ligneArticle_tarif .blocStock .majStock {
    display: none;
  }

  .productsList .autresAgences {
    margin: 0.5rem 0.2rem;
  }

  .productsList .blocSaisie.showInput .icon-cross {
    position: absolute;
    top: 3.2rem;
    right: calc(100% / 3);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 2rem;
    height: 2rem;
  }

  .productsList .blocSaisie.showInput div {
    margin-bottom: 0.5rem;
  }


  /*
  .productsList .blocSaisie.showInput > p {
    width: 5rem
  }
  */

  .productsList .blocSaisie .inputBloc {
    display: none;
  }

  .productsList .blocSaisie .inputBloc .inputLine label {
    white-space: nowrap;
    margin-right: 0.6rem;
  }

  .productsList .blocSaisie > p {
    justify-content: flex-end;
    align-items: flex-end;
    margin: 0;
  }

  .productsList .blocSaisie .buttonIcon {
    width: 4rem;
    min-width: 4rem;
    padding: 0;
    margin: 0;
  }

  .productsList .blocSaisie .buttonIcon::before {
    left: 0.6rem;
  }

  .productsList .blocSaisie .buttonIcon span {
    display: none;
  }
  .productsList .blocSaisie.showInput .inputLine {
    margin-top: 0.5rem;
  }
  .productsList .blocSaisie.showInput .buttonIcon {
    width: inherit;
    min-width: 16rem;
    padding: 0 2rem 0 4rem;
  }
  .productsList .blocSaisie.showInput .buttonIcon::before {
    left: 1rem;
  }
  .productsList .blocSaisie.showInput .buttonIcon span {
    display: inline-block;
  }

  .productsList .blocSaisie a.buttonIcon {
    width: 12rem;
    padding: 0 1rem;
  }

  .productsList .blocSaisie a.buttonIcon span {
    display: inline-block;
  }

  .productsList .ligneArticle_tarif .nonDispo {
    display: none;
  }

  #modal .productsList .catalogArticle .ligneArticle_tarif {
    flex: 0 0 10rem;
    min-width: unset;
    max-width: unset;
  }

  #modal .productsList .catalogArticle .ligneArticle_tarif .blocStock .updateStock {
    align-items: center;
  }

  .productsList .catalogArticle .ligneArticle_tarif.withPromo {
    padding-top: 2rem;
  }

  .productsList .catalogArticle .ligneArticle_tarif .blocTarif {
    text-align: left;
  }
  .productsList .catalogArticle .ligneArticle_tarif .blocTarif .icon-promo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    left: 0;
    top: 0;
    height: 2rem;
    max-width: unset;
    -ms-transform: none;
    transform: unset;
  }
  .productsList .catalogArticle .ligneArticle_tarif .icon-promo::before {
    display: none;
  }
/*  .productsList .catalogArticle .ligneArticle_detail .blocTarif .tarifPublic,
  .productsList .catalogArticle .ligneArticle_tarif .blocTarif .tarifClient,
  .productsList .catalogArticle .ligneArticle_tarif .blocTarif .tarifPublic {
    display: flex;
    flex-wrap: wrap;
  }*/
  .productsList .catalogArticle .ligneArticle_tarif.withPromo .blocTarif .tarifDouble .prixBarre {
    width: 100%;
  }

  .productsList .catalogArticle .ligneArticle_detail .blocTarif .tarifPublic > *,
  .productsList .catalogArticle .ligneArticle_tarif .blocTarif .tarifClient > *,
  .productsList .catalogArticle .ligneArticle_tarif .blocTarif .tarifPublic > * {
    white-space: nowrap;
    margin-right: 0.4rem;
  }


  .productsList .catalogArticle .ligneArticle_tarif .produitStock .autresAgences,
  .productsList .catalogArticle .ligneArticle_tarif .produitStock .stockComplement {
    display: none;
  }
  .productsList .catalogArticle .ligneArticle_tarif .produitStock .blocStock > p,
  .productsList .catalogArticle .ligneArticle_tarif .produitStock .blocStock > a {
    align-items: flex-end;
  }

  .productsList .catalogArticle .ligneArticle_tarif .tarifQuantitatif .tarifQuantitatif {
    max-width: 22rem;
  }

  .productsList .catalogArticle .ligneArticle_tarif .tarifQuantitatif .tarifQuantitatifPopup {
    display: none;
    position: absolute;
    bottom: 3rem;
    left: 0;
    z-index: 5;
  }
}
@media screen and (max-width: 500px) {
  .productsFilter > .productsPaging {
    order: 2;
  }
}
@media screen and (max-width: 400px) {
  .productsList .blocTarif .prix span,
  .productsList .blocTarif .tarifEcotaxe span.montant {
    display: inline-block;
  }
}
/********************************************** PRODUIT ***************************************************************/
@media screen and (max-width: 939px) {
  main .produit-navigation {
    top: 0;
    left: 0;
    width: 100%;
  }

  main .produit-navigation a {
    top: 2rem;
  }

  main .produit-navigation a.icon-arrow-left {
    left: 0;
  }

  main .produit-navigation a.icon-arrow-right {
    right: 0;
  }

  #productCard {
    overflow: hidden;
  }

  #productCard .pageTitle .returnLink {
    display: none;
  }

  #productCard .produitPresentation {
    padding: 2rem 0 0;
  }

  #productCard .produitPresentation .produitContent {
    padding: 0 1rem;
  }

  #productCard .produitImages .mainImage {
    max-width: 22rem;
    max-height: 22rem;
    margin: 0 auto;
  }

  #productCard #tabs .optionImg span.infoDetail .showZoom,
  #productCard .produitDescriptif .optionImg span.infoDetail .showZoom,
  #productCard .produitCaracteristiqueBas .optionImg span.infoDetail .showZoom {
    max-width: 20rem;
    max-height: 20rem;
  }

  #productCard #tabs .optionImg span.infoDetail .showZoom img,
  #productCard .produitDescriptif .optionImg span.infoDetail .showZoom img,
  #productCard .produitCaracteristiqueBas .optionImg span.infoDetail .showZoom img {
    max-width: 19.6rem;
    max-height: 19.6rem;
  }

  #productCard .produitDescriptif {
    flex: 1;
    width: 100%;
  }

  #productCard .produitPresentation .produitTarif .blocSaisie {
    flex-direction: column;
  }

  #productCard .tarifQuantitatif {
    width: 100%;
    margin: 0.5rem 0;
  }

  #productCard .tarifQuantitatif .tarifQuantitatifPopup {
    max-width: 30rem;
    width: 100%;
    z-index: 5;
  }

  #productCard .produitTarif .blocSaisie div p {
    width: calc(100% - 2rem);
    margin: 1rem 1rem 0;
  }

  #productCard .blocStock .updateStock {
    width: 100%;
  }

  #productCard .blocStock .pictoStock {
    width: 100%;
    height: 2rem;
    margin: 0;
    padding: 0 1rem;
  }

  #productCard .produitDetail .blocStock .pictoStock span,
  #productCard .produitTarif .blocStock .pictoStock span {
    flex: 1;
    width: calc(100% / 3 - 0.1rem);
    margin: 0 0.05rem 0;
  }

  #productCard .produitPresentation .produitTarif > div.productContact {
    margin-top: 0.6rem;
  }

  #productCard #listeDeclinaisons .produitTarif .blocSaisie div {
    margin: 0;
  }

  #listeDeclinaisons .listeDeclinaisons .declinaisonListe {
    flex-direction: column;
  }

  #productCard .produitDetailDimensions.tableauHZ .produitDimensionConteneur {
    height: 2.4rem;
    width: 100%;
  }

  #productCard .produitDetailDimensions.tableauHZ .produitDimensionLibelle {
    width: 8rem;
  }

  #productCard .ficheArticle_infoSup .ficheProduit {
    margin: 1rem;
  }
  #productCard .ficheArticle_infoSup .ficheProduitTR {
    flex-wrap: nowrap;
  }
  #productCard .ficheArticle_infoSup .ficheProduitTable .ficheProduitTH,
  #productCard .ficheArticle_infoSup .ficheProduitTable .ficheProduitTD {
    padding: 0.2rem;
  }

  #productCard .regroupements > div {
    flex-direction: column;
    align-items: flex-start;
  }

  #productCard div.produitCaracteristique {
    flex-wrap: wrap;
    width: 100%;
  }

  #productCard .produitCaracteristique p span.infoTitre {
    width: 50%;
    padding: 0 1rem;
  }

  #listeComposant .catalogArticle .ligneArticle_detail p.title {
    padding: 0 0.3rem;
  }

  #listeComposant .catalogArticle .ligneArticle_detail .produitStock {
    display: inline-block;
  }

  .ui-tabs .ui-tabs-panel {
    padding: 1rem 0;
  }

  #tabs {
    padding: 0;
  }

  #tabs .content {
    width: 100%;
    flex-wrap: wrap;
  }

  #tabs .menu {
    flex-wrap: wrap;
  }

  #tabs .menu li {
    flex: 0 0 calc(50% - 0.1rem);
    overflow: hidden;
  }

  #tabs .menu.tabs_3 li {
    flex: 0 0 calc(100% / 3 - 0.1rem);
  }

  #tabs .menu.tabs_4 li {
    flex: 0 0 calc(100% / 4 - 0.1rem);
  }

  #tabs .menu.tabs_1 li {
    flex: 0 0 100%;
  }

  #tabs .menu li a span.libelleOnglet {
    width: calc(100% - 2.2rem);
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #tabs .ongletTabs > .content {
    padding: 0 1rem;
  }

}
@media screen and (min-width: 600px) and (max-width: 939px) {
  #productCard .produitPresentation .produitContent {
    align-items: flex-start;
    width: 100%;
  }

  #productCard .produitImages {
    width: auto;
    height: 24rem;
  }

  #productCard .produitImages .mainImage {
    width: 20rem;
    height: 20rem;
  }

  #productCard .produitDetail {
    width: 100%;
  }

  #productCard .produitDescriptif {
    width: 100%;
    margin: 0 0.5rem 1rem;
  }

  #productCard .produitPresentation .produitDetail .tarifQuantitatif,
  #productCard .produitPresentation .produitDetail .produitStock,
  #productCard .produitPresentation .produitDetail .produitStartingPrice {
    display: none;
  }

  #productCard .produitPresentation .produitTarif.withPromo .blocTarif .title {
    padding-left: 2rem;
  }

  #productCard .produitPresentation .produitTarif {
    position: relative;
    flex: 0 0 23rem;
    width: 23rem;
    min-height: 20rem;
    padding: 1rem;
    margin: 0 1rem 0 0;
  }

  #productCard .produitPresentation .produitTarif > div {
    width: 100%;
    max-width: unset;
    margin: 0;
  }

  #productCard .produitPresentation .produitTarif > div.productContact {
    margin-top: 0.6rem;
  }

  #productCard .produitTarif .blocSaisie div p {
    margin: 1rem 1rem 0;
  }

}
@media screen and (orientation: portrait) and (max-width: 939px) {
  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTH {
    width: 8rem;
    height: 100%;
    flex-wrap: wrap;
  }

  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTR {
    width: calc(100vw - 10rem);
    overflow: auto;
  }

  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTD {
    flex-wrap: wrap;
  }

  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTH div,
  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTD div {
    flex: 1 0 100%;
    width: 100%;
    min-height: 3rem;
    padding: 0 0.2rem;
  }

  #productCard .ficheArticle_infoSup div.ficheProduitQte {
    min-width: unset;
    min-height: 4rem;
  }

  #productCard p.optionImg .showOption img {
    max-height: 5rem;
    max-width: 5rem;
  }

  #productCard .produitTarif {
    z-index: 10;
  }

  #productCard .produitTarif .blocTarif .tarifQuantitatif {
    width: 100%;
  }

  #productCard .produitTarif .blocStock + .autresAgences {
    width: 100%;
  }

  #productCard .produitTarif .blocSaisie {
    width: 100%;
    margin-top: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie div {
    margin-bottom: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie div p + p {
    margin-top: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie p.nonDispo {
    margin-bottom: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie .quantite {
    width: 5rem;
    margin: 0;
  }
}
@media screen and (min-width: 600px) and (max-width: 800px) {
  #productCard .produitPresentation .produitContent {
    flex-direction: column;
  }

  #productCard .produitDescriptif .blocTarif + p {
    clear: right;
  }
}
@media screen and (orientation: portrait) and (max-width: 599px) {

  #productCard .produitCaracteristique.optionHTML {
    flex-direction: column;
    margin-bottom: 2rem;
  }

  #productCard .produitCaracteristique.optionHTML .infoTitre {
    flex: 0 0 2rem;
    padding: 0;
  }

  #productCard .produitCaracteristique.optionHTML .infoDetail {
    width: 100%;
  }

  #productCard .flex-fJbetween {
    flex-wrap: wrap;
    width: calc(100% - 1rem);
    margin: 1rem 0.5rem;
  }

  #productCard .ongletTabs .flex-fJbetween {
    width: 100%;
  }

  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTH {
    width: 8rem;
    height: 100%;
    flex-wrap: wrap;
  }

  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTR {
    width: calc(100vw - 10rem);
    overflow: auto;
  }

  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTD {
    flex-wrap: wrap;
  }

  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTH div,
  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTD div {
    flex: 1 0 100%;
    width: 100%;
    min-height: 3rem;
    padding: 0 0.2rem;
  }

}
@media screen and (max-width: 599px) {

  #productCard .ficheArticle_infoSup .has_dimension .ficheProduitTR {
    flex-wrap: wrap;
  }

  #productCard .ficheArticle_infoSup .ficheProduitTH,
  #productCard .ficheArticle_infoSup .ficheProduitTD {
    flex: 0 0 20%;
  }

  #productCard .ficheArticle_infoSup .ficheProduitTH:first-child,
  #productCard .ficheArticle_infoSup .ficheProduitTD:first-child {
    flex: 0 0 40%
  }

  #productCard .ficheArticle_infoSup .ficheProduitTH.ficheProduitQte,
  #productCard .ficheArticle_infoSup .ficheProduitTH:last-child {
    display: none;
  }

  #productCard .produitPresentation .produitContent {
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    width: 100%;
  }

  #productCard .produitPresentation .produitDetail {
    flex-direction: column;
    width: 100%;
    padding:  0 1rem;
  }

  #productCard .produitPresentation .produitContent .produitImages {
    margin: 0 auto 1rem;
  }

  #productCard .produitPresentation .produitContent .produitDetail .blocTarif {
    margin: 1rem 0;
    padding: 5px;
  }

  #oecContent #productCard .produitPresentation .produitTarif {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    max-height: 22rem;
    display: block;
    column-count: 2;
    margin: 0;
    padding: 1rem 0.5rem;
    z-index: 12;
    border-width: 0.1rem 0 0;
    box-shadow: 0 -0.3rem 0.3rem rgba(182, 182, 182, 0.5);
  }

  #productCard .blocTarif .tarifEcotaxePopup p {
    white-space: wrap;
  }

  #productCard .produitPresentation .hideMobile {
    display: none !important;
  }

  #productCard .produitPresentation .produitTarif > div {
    width: 100%;
    margin: 0;
    -webkit-column-break-inside: avoid;
    overflow: hidden;
  }

  #oecContent #productCard .produitPresentation .withSaisie .produitTarif {
    min-height: 10rem;
  }

  #productCard .produitPresentation .produitTarif .blocTarif {
    padding: 0 1rem;
  }

  #productCard .produitTarif.withPromo {
    margin-top: 1rem;
  }
  #productCard .produitPresentation .produitTarif.withPromo .blocTarif {
    padding-top: 1rem;
  }

  #productCard .produitPresentation .produitDetail .stockComplement,
  #productCard .produitPresentation .produitDetail .autresAgences {
    display: flex;
    width: 22rem;
  }

  #productCard .produitPresentation .produitDetail .blocStock {
    flex-direction: column;
  }

  #productCard .produitPresentation .produitDetail .tarifQuantitatif,
  #productCard .produitPresentation .produitDetail .produitStock,
  #productCard .produitPresentation .produitDetail .produitStartingPrice {
    display: block;
  }

  #productCard .produitPresentation .produitDetail .produitStock {
    width: 100%;
    max-width: 25rem;
    margin: auto;
  }

  #productCard .produitPresentation .withSaisie .produitTarif .blocTarif,
  #productCard .produitPresentation .produitTarif .blocSaisie,
  #productCard .produitPresentation .produitTarif .blocTarif .tarifQuantitatif {
    width: 100%;
    max-width: unset;
    margin: 1rem 0 0;
    break-inside: avoid;
  }

  #productCard .produitPresentation .produitTarif .tarifQuantitatif,
  #productCard .produitPresentation .produitTarif .produitStock,
  #productCard .produitPresentation .produitTarif .produitStartingPrice {
    display: none;
  }

  #productCard .produitTarif .blocSaisie div {
    margin-bottom: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie div p + p {
    margin-top: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie p.nonDispo {
    margin-bottom: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie .quantite {
    width: 5rem;
    margin: 0;
  }

  #productCard .produitTarif .productContact {
    width: calc(50vw - 2rem);
    max-width: unset;
    margin: 0;
    break-inside: avoid;
  }

  #tabs .menu .ui-state-default,
  #tabs .menu .ui-state-active {
    flex: 1 0 100%;
    height: 4rem;
    min-width: 15rem;
    margin: 0 0.1rem 0.1rem 0;
    overflow: hidden;
  }
  #tabs .ongletTabs .produitCaracteristique {
    padding: 0 0.5rem;
  }

  #modal #saisie .produitDetailDimensions .produitDimensionConteneur,
  #modal #saisie .inputLine {
    flex-direction: column;
    align-items: flex-start;
  }

  #listeComposant .catalogArticle .ligneArticle_detail.noImage {
    padding-left: 0;
  }
}
@media screen and (max-width: 500px) {
  #productCard .ficheArticle_infoSup div.ficheProduitQte {
    flex: 0 0 8rem;
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}
@media screen and (max-width: 400px) {
  #tabs .menu .ui-state-default,
  #tabs .menu .ui-state-active {
    flex: 1 0 100%
  }
}
@media screen and (orientation: portrait) and (max-width: 400px) {
  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTH div:first-child,
  #productCard .ficheArticle_infoSup .ficheProduit .ficheProduitTD div:first-child {
    display: none;
  }

  #productCard .produitPresentation .produitTarif .blocSaisie p {
    width: 100%;
    margin: 0;
  }

  #productCard .produitPresentation .produitTarif .blocSaisie div p + p {
    margin-top: 0.5rem;
  }

  #productCard .produitPresentation .produitTarif .blocSaisie p.nonDispo {
    margin-bottom: 0.5rem;
  }

  #productCard .produitPresentation .produitTarif .blocSaisie .quantite {
    width: 5rem;
    margin: 0;
  }
}
@media screen and (max-width: 400px)  and (max-height: 400px) {
  #productCard .produitTarif {
    position: fixed;
    display: block;
    bottom: 0;
    width: 100vw;
    height: 14rem;
    margin: 0;
    padding: 1rem 0.5rem;
    z-index: 100;
  }

  #productCard .produitTarif .blocTarif {
    padding: 0 1rem 0 0;
  }

  #productCard .produitTarif .blocTarif .tarifQuantitatif {
    width: 100%;
  }

  #productCard .produitTarif .blocStock p {
    max-width: 20rem;
    margin: 0 auto;
  }

  #productCard .produitTarif .blocStock + .autresAgences {
    float: right;
    width: 45vw;
  }

  #productCard .produitTarif form {
    float: right;
    width: 45vw;
  }

  #productCard .produitTarif .blocSaisie {
    width: 45vw;
    margin-top: 0.5rem;
    flex-direction: column;
  }

  #productCard .produitTarif .blocSaisie p {
    margin: 0;
  }

  #productCard .produitTarif .blocSaisie div {
    margin-bottom: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie div p + p {
    margin-top: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie p.nonDispo {
    margin-bottom: 0.5rem;
  }

  #productCard .produitTarif .blocSaisie .quantite {
    width: 5rem;
    margin: 0;
  }
}
