diff --git a/src/app/components/admin/list-carte-envoyer/list-carte-envoyer.component.html b/src/app/components/admin/list-carte-envoyer/list-carte-envoyer.component.html
index be80aee..e6f9f8e 100644
--- a/src/app/components/admin/list-carte-envoyer/list-carte-envoyer.component.html
+++ b/src/app/components/admin/list-carte-envoyer/list-carte-envoyer.component.html
@@ -64,7 +64,7 @@
     <div class="list-group wow fadeInLeftBig">
       <div class="card mainCard" *ngFor="let crt of carteParList | async">
         <div class="row no-margin">
-          <img class="col-md-6 card-image mb-1 subCard1" src={{crt.carteTemplate.downloadURL}}>
+          <img class="col-md-6 card-image subCard1" id="image1" src={{crt.carteTemplate.downloadURL}}>
           <!--<div class="col-md-6 card-image mb-1 subCard1" [ngStyle]="{ 'background-image': 'url(' + crt.carteTemplate.downloadURL + ')'}">
 
             <div class="view">
@@ -84,12 +84,12 @@
           </div>-->
           <div class="col-md-6 card subCard2">
             <div class="card-block no-margin">
-              <div class="col-md-12 col-sm-12">
+              <div class="col-md-12 col-sm-12" id="subCard2Part1">
                 <label>ID de la carte: {{crt.uid}}</label>
                 <label>Avantage Cumule: {{crt.avantageCumule === ''? '0' : crt.avantageCumule}} €</label>
                 <label>Avantage Recuperer: {{crt.avantageRecuperer === ''? '0' : crt.avantageRecuperer}} €</label>
               </div>
-              <div class="btn-block d-flex flex-lg-row flex-md-column flex-sm-row">
+              <div class="btn-block d-flex flex-lg-row flex-md-column flex-sm-row" id="subCard2Part2">
                 <button class="btn btn-outline-primary btn-rounded" (click)="hideme[i] = !hideme[i]">{{show ? 'Cacher Détails' : 'Détails'}}</button>
               </div>
             </div>
diff --git a/src/app/components/admin/liste-op-commercial/liste-op-commercial.component.scss b/src/app/components/admin/liste-op-commercial/liste-op-commercial.component.scss
index ea6672a..957c4e4 100644
--- a/src/app/components/admin/liste-op-commercial/liste-op-commercial.component.scss
+++ b/src/app/components/admin/liste-op-commercial/liste-op-commercial.component.scss
@@ -185,4 +185,23 @@
   }
 }
 
+@media screen and (max-width: 786px) {
+
+  .subCard1-row {
+    height: 35vw;
+    .merchant-name p {
+      font-size: 2rem;
+    }
+    .operation-data p {
+      font-size: 1rem;
+    }
+
+    .operation-id p {
+      font-size: 0.8rem;
+      font-weight: bold;
+    }
+  }
+
+}
+
 
diff --git a/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.html b/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.html
index 0a1fa45..9c3fef5 100644
--- a/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.html
+++ b/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.html
@@ -22,7 +22,7 @@
       <div *ngIf="(crt.status == statutAffiche) || (statutAffiche == 'Toutes')">
         <div class="card mainCard">
           <div class="row no-margin" id="testt">
-            <img class="col-md-6 card-image mb-1 subCard1" id="image1" alt="Responsive image" src={{crt.carteTemplate.downloadURL}}>
+            <img class="col-md-6 card-image subCard1" id="image1" alt="Responsive image" src={{crt.carteTemplate.downloadURL}}>
             <!--<div class="col-md-6 mb-1 subCard1" id="subCard1">
               <img src="{{crt.carteTemplate.downloadURL}}" id="image1" class="mx-auto d-block flex-center card-img-overlay" alt="Responsive image">
             </div>-->
diff --git a/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.scss b/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.scss
index a87d64e..02c00f7 100644
--- a/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.scss
+++ b/src/app/components/carteParrainage/carte-envoyer/carte-envoyer.component.scss
@@ -57,6 +57,11 @@
   //background-color: yellow;
 }
 
+#image1 {
+  padding-left: 0;
+  padding-right: 0;
+}
+
 #subCard2Part1 {
   padding-top: 5%;
   display: flex;
diff --git a/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.html b/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.html
index fd6f8b6..eba9a61 100644
--- a/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.html
+++ b/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.html
@@ -32,7 +32,7 @@
     <div *ngFor="let crt of carteParrData | async">
       <div class="card mainCard" *ngIf="(crt.status == statutAffiche) || (statutAffiche == 'Toutes')">
         <div class="row no-margin">
-          <img class="col-md-6 card-image mb-1 subCard1" src={{crt.carteTemplate.downloadURL}}>
+          <img class="col-md-6 card-image subCard1" id="image1" src={{crt.carteTemplate.downloadURL}}>
           <!--<div class="col-md-6 card-image mb-1 subCard1" [ngStyle]="{ 'background-image': 'url(' + crt.carteTemplate.downloadURL + ')'}">
 
             <div class="view">
diff --git a/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.scss b/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.scss
index 8fb8e53..f8912bf 100644
--- a/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.scss
+++ b/src/app/components/carteParrainage/carte-parrainage/carte-parrainage.component.scss
@@ -17,9 +17,9 @@
   width: 100%;
 }
 
-.view {
-  height:102%;
-  width: 103%;
+#image1 {
+  padding-left: 0;
+  padding-right: 0;
 }
 
 
diff --git a/src/app/components/home/home.component.html b/src/app/components/home/home.component.html
index b87d8bf..9b5d925 100644
--- a/src/app/components/home/home.component.html
+++ b/src/app/components/home/home.component.html
@@ -32,7 +32,7 @@
 
 
 <!--Section: Features v.1-->
-<section class="section feature-box wow fadeInUp" id="features">
+<section class="section col-md-12 col-sm-12 feature-box wow fadeInUp" id="features">
 
   <!--Section heading-->
   <h1 class="section-heading pt-4">Comment ça marche ?</h1>
@@ -81,7 +81,7 @@
 
 
 <!--Projects section v.3-->
-<section class="section extra-margins" id="projects">
+<section class="section col-md-12 col-sm-12 extra-margins" id="projects">
 
 
   <!--Grid row-->
diff --git a/src/app/components/home/reset-password/reset-password.component.scss b/src/app/components/home/reset-password/reset-password.component.scss
index aacf573..23f37e0 100644
--- a/src/app/components/home/reset-password/reset-password.component.scss
+++ b/src/app/components/home/reset-password/reset-password.component.scss
@@ -1,3 +1,7 @@
 .card {
   padding: 5%;
 }
+
+.container {
+  padding-top: 30vh;
+}
diff --git a/src/app/components/opCommercial/envoyer-carte/envoyer-carte.component.scss b/src/app/components/opCommercial/envoyer-carte/envoyer-carte.component.scss
index d2372ed..7c7878b 100644
--- a/src/app/components/opCommercial/envoyer-carte/envoyer-carte.component.scss
+++ b/src/app/components/opCommercial/envoyer-carte/envoyer-carte.component.scss
@@ -13,7 +13,11 @@
 
 #subCard1 {
   background-repeat: no-repeat;
-  background-size: 100%;
+  background-size: cover;
+  -ms-background-size: cover;
+  -o-background-size: cover;
+  -moz-background-size: cover;
+  -webkit-background-size: cover;
   background-position: center;
   height: 25vh;
   margin-top: 2vh;