.row_i {

    position: absolute;

    width: 100%;

    top: 150px;

  }

  .row_6i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

  }

  .card_s6 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--gray1);

    height: var(--cardHeight);

    width: var(--rn-width6);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  .row_4i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

  }

  .card_s4 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--gray2);

    height: var(--cardHeight);

    width: var(--rn-width4);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  .row_3i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

    flex-wrap: wrap;

  }

  .card_s3 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--gray3);

    height: var(--cardHeight);

    width: var(--rn-width3);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  .row_2i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

  }

  .card_s2 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--gray2);

    height: var(--cardHeight);

    width: var(--rn-width2);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  .row_2-5i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

  }

  .card_s2-5 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--gray2);

    height: var(--cardHeight);

    width: var(--rn-width2);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  .row_1-2i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

  }

  .card_s1-2 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--black);

    height: var(--cardHeight);

    width: var(--rn-width1);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  .row_1i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

    align-items: center;

}

  .card_s1 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--black);

    height: var(--cardHeight);

    width: var(--rn-width1);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  .row_1-5i {

    display: flex;

    justify-content: center;

    width: 100%;

    margin: 40px 0;

  }

  .card_s1-5 {

    box-shadow: 0px 0px 4px 0px black;

    border-radius: 5px;

    border: solid 5px var(--black);

    height: var(--cardHeight);

    width: var(--rn-width1-5);

    margin: 0 var(--um);

    box-sizing: border-box;

  }

  

  .guide_path {

    display: flex;

    width: 100%;

    flex-direction: row;

    justify-content: center;

    position: relative;

    background-color: transparent;

    min-height: 200vh;

  }

  

  .unit1 {

    height: 100%;

    background-color: rgba(82, 198, 218, 0.137);

    margin: 0 var(--um);

    width: var(--unit);

    min-height: 1200vh;

}



a:hover{

  text-decoration: none !important;
  color: inherit !important;

}

dl, ol, ul {
  margin-bottom: 0rem !important;
}

.copyrightSection p{
  margin-bottom: 0px !important;
}

     

button:focus{

    border: none !important;

    outline: none !important;

}



/*/------------------ breadcrumb ------------/*/

    .breadcrumb_Container{

        display: flex;

        justify-content: center;

        width: 100%;

        margin: 0;

    }

    .breadcrumb {

        display: flex;

        height: 60px;

        width: var(--rn-width1);

        margin: 0 var(--um);

        box-sizing: border-box;

        background-color: white !important;

        margin-bottom: 0 !important;

        font-family: NouvelRRegular;

        flex-direction: row;

        align-items: center;

        border-bottom: 1px solid var(--gray2);

        border-radius: 0 !important;

    }

    .breadcrumb a{

        font-family: 'NouvelRRegular';

        font-size: 13px;

        color: #000000;

    }

    .breadcrumb svg{

        width: 26px;

        height: 10px;

        fill: currentcolor;

        color: var(--yellow);

        font-family: 'NouvelRBold';

    }

  

/*/------------- mainTitle ----------/*/

  .mainTitle{

      margin: 0 var(--um);

      box-sizing: border-box; 

      text-align: center;

      font-family: NouvelRBold;

    }

    .mainTitle .title {

        font-size: 35px;

        font-weight: bold;

        font-family: NouvelRBold;

        margin-bottom: 14px;

    }

    .mainTitle .title.exeption {

      margin-top: 0px;

    }

    .mainTitle .semititle {

        font-size: 16px;

        margin-bottom: 0px;

        width: 64%;

        margin: auto;

        font-family: RenaultGroupSemibold;

        color: var(--gray3);

    }





/*---------------optionsRecherche & cars_card -------------------*/

    .optionsRecherche_cars_card{

        width: var(--rn-width1);

        margin: 0 var(--um);

        box-sizing: border-box;

        display: flex;

    }

    .separator {

        background-color: var(--gray2);

        margin: 2px 0;

        height: 0.1px;

    }



/*---------------optionsRecherche-------------------*/

    .allDropdown {

        max-height: 0;

        overflow: hidden;

        transition: max-height 0.3s ease-out, visibility 0s linear 0.3s;

        visibility: hidden;

    }

    

    .allDropdown.active {

        max-height: 1265px;

        transition: max-height 0.3s ease-out, visibility 0s linear 0s;

        visibility: visible;

    }

  

    .showFilters {

        background-color: #000000;

        color: white;

        height: 46px;

        width: 100%;

        font-family: 'NouvelRBold';

        display: flex;

        justify-content: space-between;

        align-items: center;

    }

    .showFilters img {

        width: 25px;

    }

    .optionsRecherche{

        width: var(--rn-width4);

        box-sizing: border-box;

        margin: 0;

    }

    .dropbtn {

        cursor: pointer;

        width: 100%;

        display: flex;

        flex-direction: row;

        justify-content: space-between;

        align-items: center;

        font-family: 'RenaultGroupSemibold';

    }

/*---------dropdown---------*/

  .dropdown {

    padding: 5px 13px;

    border-left: 1px solid var(--gray2);

  }

  .voir_plus{

      text-align: center;

      margin-top: 10px;

  }

  .voir_plus a {

      text-decoration: underline !important;

      color: var(--gray2);

      font-family: 'NouvelRRegular';

  }

  .dropdown-content{

      display: none;

  }

  .dropdown-content.active {

      display: block;

      margin: 6px 0 0 0;

  }

/*------checkbox-----*/

  .checkbox_container {

      display: flex;

      align-items: center;

      flex-direction: row;

      flex-wrap: nowrap;

      justify-content: flex-start;

  }

  input[type="checkbox"] {

      appearance: none;

      -webkit-appearance: none;

      width: 15px;

      height: 15px;

      border-radius: 3px;

      cursor: pointer;

      border: 1px solid black;

      position: relative;

  }



  input[type="checkbox"]:after {

      content: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='11' width='13' fill='white' viewBox='0 0 448 512'%3E%3Cpath d='M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z'/%3E%3C/svg%3E");

      font-size: 18px;

      top: -8px;

      position: absolute;

      display: none;

  }

  input[type="checkbox"]:checked {

      background-color: #000000;

  }

  input[type="checkbox"]:checked:after {

      display: block;

  }

/*------switcher-----*/

.switch {

    --button-width: 52px;

    --button-height: 34px;

    --toggle-diameter: 31px;

    --button-toggle-offset: calc((var(--button-height) - var(--toggle-diameter)) / 2);

    --toggle-shadow-offset: 6px;

    --toggle-wider: 3em;

    --color-grey: #cccccc;

    --color-green: var(--black);

}

label {

    display: inline-block;

    margin: 7px 0 0 0 !important;

    font-family: 'NouvelRRegular';

}

.sliderswitch {

    display: inline-block;

    width: 38px;

    height: 20px;

    background-color: var(--color-grey);

    border-radius: calc(var(--button-height) / 2);

    position: relative;

    transition: 0.3s all ease-in-out;

    cursor: pointer;

}



.sliderswitch::after {

    content: "";

    display: inline-block;

    width: 16px;

    height: 16px;

    background-color: #fff;

    border-radius: calc(var(--toggle-diameter) / 2);

    position: absolute;

    top: var(--button-toggle-offset);

    transform: translateX(var(--button-toggle-offset));

    box-shadow: var(--toggle-shadow-offset) 0 calc(var(--toggle-shadow-offset) * 4) rgba(0, 0, 0, 0.1);

    transition: 0.3s all ease-in-out;

    left: 1px;

}



.switch input[type="checkbox"]:checked + .sliderswitch {

    background-color: var(--color-green);

}



.switch input[type="checkbox"]:checked + .sliderswitch::after {

    transform: translateX(calc(var(--button-width) - var(--toggle-diameter) - var(--button-toggle-offset)));

    box-shadow: calc(var(--toggle-shadow-offset) * -1) 0 calc(var(--toggle-shadow-offset) * 4) rgba(0, 0, 0, 0.1);

}



.switch input[type="checkbox"] {

    display: none;

}



.switch input[type="checkbox"]:active + .sliderswitch::after {

    width: var(--toggle-wider);

}



.switch input[type="checkbox"]:checked:active + .sliderswitch::after {

    transform: translateX(calc(var(--button-width) - var(--toggle-wider) - var(--button-toggle-offset)));

}

/*------END switcher-----*/

/*---------range---------*/

.dropdown_content_range.active {

    display: block;

    margin: 20px 0 25px 0;

}

.dropdown_content_range {

    display: none;

}

.price-input {

    width: 100%;

    display: flex;

    margin: 0px 0 14px;

    justify-content: space-between;

    align-items: center;

}

.min, .max{

    font-family: 'RenaultGroupSemibold';

}

.price-input .field{

  display: flex;

  width: 100%;

  height: 45px;

  align-items: center;

}

.fieldMIN input, .fieldMAX input {

    width: 100%;

    outline: none;

    font-size: 19px;

    -moz-appearance: textfield;

    border: none;

}

.fieldMAX input{

    text-align: right;

    margin-right: 12px;

}

.fieldMIN input{

    text-align: left;

    margin-left: 12px;

}



input[type="number"]::-webkit-outer-spin-button,

input[type="number"]::-webkit-inner-spin-button {

  -webkit-appearance: none;

}

.price-input .separator{

  width: 130px;

  display: flex;

  font-size: 19px;

  align-items: center;

  justify-content: center;

}

.slider {

  height: 4px;

  position: relative;

  background: var(--gray1);

  border-radius: 5px;

}

.slider .progress{

  height: 100%;

  left: 0%;

  right: 0%;

  position: absolute;

  border-radius: 5px;

  background: var(--gray3);

}

.range-input{

  position: relative;

}



.range-input input {

  position: absolute;

  width: 103%;

  height: 5px;

  top: -4px;

  background: none;

  pointer-events: none;

  -webkit-appearance: none;

  -moz-appearance: none;

  left: -5px;

}

input[type="range"]:focus, input[type="range"]:focus-visible{
  border-bottom:0px !important;
}

input[type="range"]::-webkit-slider-thumb {

  width: 40px;

  height: 40px;

  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="40" height="40"><circle cx="20" cy="20" r="15" fill="white"></circle><circle cx="20" cy="20" r="16" stroke="%23939393" fill="none" stroke-width="2"></circle><line x1="15" y1="20" x2="18" y2="18" stroke="black" stroke-width="1"></line><line x1="15" y1="20" x2="18" y2="22" stroke="black" stroke-width="1"></line><line x1="23" y1="18" x2="26" y2="20" stroke="black" stroke-width="1"></line><line x1="23" y1="22" x2="26" y2="20" stroke="black" stroke-width="1"></line></svg>') no-repeat center center;

  pointer-events: auto;

  -webkit-appearance: none;

  cursor: pointer;

  margin: 0;

}





input[type="range"]::-moz-range-thumb{

  height: 40px;

  width: 40px;

  border-radius: 50%;

  box-shadow: 0 0 6px rgba(0,0,0,0.03);

  border: none;

  background: #17A2B8;

  pointer-events: auto;

  -moz-appearance: none;

}

/*------END range-----*/

/*------buttons (appliquer & Vider)-----*/

.submit, .vider {

  width: 100%;

  font-family: 'RenaultGroupSemibold';

  height: 45px;

  transition: background-color 0.5s, color 0.5s;

  margin-top: 4px;

}

.submit{

  background-color: var(--yellow);

}

.vider{

  border: 1px solid var(--gray2);

}

.vider:focus{

  border: 1px solid var(--gray2);

}

.submit:hover{

  background-color: var(--lightYellow);

}

.vider:hover{

  background-color: black;

  color: white;

}



/*---------------cars_card-------------------*/

    #showFiltersMobile{

        display: none;

    }

    .numberOfitems {

        width: 100%;

        padding: 10px 0 0 30px;

        font-family: 'NouvelRBold';

    }

    .card {

        background-color: transparent !important;

    }

    .cars_card_container{

        display: flex;

        flex-wrap: wrap;

    }

    .cars-section1 {

        width: 100%;

        box-sizing: border-box;

        display: contents;

    }

    .todispear {

        display: flex;

        flex-direction: column;

        align-items: center;

        width: 77%;

        background-color: #f7f7f7;

    }



    .tout_nos_offres {

        height: 46px;

        width: var(--rn-width4);

        box-sizing: border-box;

        font-family: NouvelRBold;

        font-size: 16px;

        cursor: pointer;

        transition: background-color 0.5s, color 0.5s;

        background-color: black;

        color: white;

        margin: auto;

    }

    .tout_nos_offres:hover {

        background-color: var(--yellow);

        color: black;

    }

    .card{

        border: none !important;

    }

    .card-title {

        font-family: 'NouvelRBold';

        margin: 13px 0;

        font-size: 19px;

    }

    .cars_card {

        width: var(--rn-width4);

        margin: 0 0 0 31px;

        box-sizing: border-box;

        font-family: NouvelRBold;

    }

    .showMorecarsBTN{

        display: none;

    }

    .cars_card .card-img-top{

        width: 100%;

    }

    .cars_card .card-text {

        font-family: NouvelRRegular;

        margin-top: -6px;

        margin-bottom: 7px;

        line-height: 1.2;

        width: 100%;

    }

    .cars_card .cardButton {

        color: var(--black);

        font-weight: 600;

        font-family: 'RenaultGroupSemibold';

    }

    .cars_card .prise {

        color: var(--black);

        font-family: 'RenaultGroupSemibold';

    }

    .cars_card .cardButton svg {

        overflow: hidden;

        vertical-align: middle;

        margin-left: 20px;

        color: var(--yellow);

    }

    .cars_card .cardButton:hover {

        color: var(--black);

        border-bottom: 2px solid var(--black);

        font-weight: 600;

    }

    .hybrid{

        margin-top: -64px;

    }

    .cars_card .hybrid .hybrid_text {

        color: #828282;

        font-family: 'NouvelRRegular';

        margin-bottom: 6px;

    }

    .cars_card .hybrid .hybrid_full {

        border: 2px solid #0086cf;

        color: #0086cf;

        text-align: left;

        display: inline;

        padding: 5px 6px;

        border-radius: 4px;

        font-weight: 600;

        font-size: 12px;

    }

/*---------------pagination-------------------*/

    .accessoires_pagination {

        display: flex;

        margin: auto;

        align-items: center;

        margin: 22px 0;

        justify-content: center;

    }

    

    .pagination_num {

        border: solid 1px var(--black);

        padding: 5px;

        border-radius: 30px;

        width: 30px;

        height: 30px;

        align-items: center;

        display: flex;

        justify-content: center;

        margin: 0 5px;

    }

    

    .pagination_active {

        color: white;

        background: var(--black);

    }

    

    .pagination_space {

        padding: 5px;

        width: 30px;

        height: 30px;

        align-items: center;

        display: flex;

        justify-content: center;

        margin: 0;

    }

    

    .pagination_next {

        padding: 5px;

        border-radius: 30px;

        width: 30px;

        height: 30px;

        align-items: center;

        display: flex;

        justify-content: center;

        margin: 0 5px;

        background: var(--yellow);

    }









/*---------------backToTop-------------------*/

  .backToTop{

    width: var(--rn-width1);

    margin: 0 var(--um);

    box-sizing: border-box; 

    text-align: center;

    align-items: center;

    font-family: RenaultGroupSemibold;

  }

  .backToTop a{

    color: black;

    font-family: RenaultGroupSemibold;

    text-decoration: underline;

  }

  .backToTop svg{

    margin: auto;

    margin-bottom: -2px;

    margin-left: 10px;

  }

  

  

  

  

  

/*-----------------------------------------------------------------------------------*/

/*---------------------------------- Responsive -------------------------------------*/

/*-----------------------------------------------------------------------------------*/

@media (max-width: 1024px) {

    .showFilters {

        font-size: 14px;

    }

    .cars_card {

      width: 45%;

    }

    .cars_card .card-text {

        width: 100%;

    }

    .optionsRecherche {

      width: 30%;

    }

    .cars_card_container {

      display: flex;

      flex-wrap: wrap;

      justify-content: space-between;

    }

}

@media (max-width: 1023px) {

    .cars_card_container {

        justify-content: space-around;

    }

    .cars_card {

        width: var(--rn-width4);

    }

}

/*------------------------------------*/

/*--------------- tablet -------------*/

/*------------------------------------*/

@media (max-width: 830px) {



/*---------------breadcrumb---------------------*/

.breadcrumb svg {

  width: 29px;

  height: 11px;

}

.breadcrumb a{

  font-size: 12px;

}

   

/*---------------cars card---------------------*/

.min, .max {

    font-size: 12px;

}

.showFilters {

    font-size: 12px;

}

.cars_card {

    width: 42.2%;

}

.optionsRecherche {

    width: 27.5%;

}



/*/------------- mainTitle ----------/*/

    .mainTitle{

      margin: 0 var(--um);

      box-sizing: border-box; 

      text-align: center;

      font-family: NouvelRBold;

    }

    .mainTitle .title {

      font-size: 29px;

      font-family: NouvelRBold;

      margin-top: 14px;

    }

    .mainTitle .reverstitle {

      font-size: 29px;

      font-family: NouvelRBold;

      margin-top: 0px;

      margin-bottom: -15px;

    }

    .mainTitle .title.exeption {

      margin-top: 0px;

    }

    .mainTitle .semititle {

        font-size: 14px;

        width: 90%;

    }





}

  

  

  

/*------------------------------------*/

/*--------------- phone1 -------------*/

/*------------------------------------*/

@media (max-width: 768px) {

/*---------------breadcrumb---------------------*/

    .breadcrumb svg {

        width: 24px;

        height: 9px;

    }

    .breadcrumb a{

        font-size: 11px;

    }





/*-----------.mainTitle .title -------------*/

    .mainTitle .title {

        font-size: 21px;

        margin-top: 20px;

    }

    .row_1i {

        margin-bottom: 0px;

        margin-top: 15px;

    }



/*/------------- cars cards ----------/*/ 

.cars_card_container > .cars_card:nth-child(n+4) {

    display: none;

}

.numberOfitems {

    display: none;

} 

#showFilters1{

    display: none;

}

.showFilters {

    font-size: 15px;

    width: 30%;

    padding: 17px;

}

.showFilters.active {

    width: 100%;

}

#showFiltersMobile {

    display: flex;

    justify-content: space-between;

    align-items: flex-end;

    background-color: #f7f7f7;

}

#showFiltersMobile .title {

    display: none;

}

#showFiltersMobile .title.active{

  font-family: 'NouvelRBold';

  margin: auto 17px;

  display: block;

}

.todispear {

    width: 100%;

    background-color: white;

}

.cars_card {

    width: 100%;

    margin: 40px 0;

}

.optionsRecherche_cars_card {

    display: flex;

    flex-direction: column;

    align-items: center;

}

.optionsRecherche {

    width: 100%;

}





/*------back to top---------*/

    .backToTop a {

      color: black;

      font-size: small;

    }



}





@media (max-width: 375px) {

    .showFilters {

        width: 34%;

    }

}

  

@media (max-width: 320px) {

    .showFilters {

        width: 40%;

    }

    /*-----------headerTitle -------------*/

    .page_headerTitle {

      width: auto;

      margin-top: 250px;

    }

    .page_headerTitle .title .title_text {

      font-size: 22px;

      text-align: left;

    }

    .page_headerTitle .title .subtitle_text {

      font-size: 12px;

      text-align: left;

      width: 279px;

    }

}