diff --git a/src/app/app.component.css b/src/app/app.component.css
index cca6f7d..ef6354a 100644
--- a/src/app/app.component.css
+++ b/src/app/app.component.css
@@ -20,4 +20,8 @@ img {
 
 .heading {
     margin-top: 12px;
+}
+
+.alert {
+    margin-top: 24px;    
 }
\ No newline at end of file
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 3f2d9d1..404ff85 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -16,4 +16,4 @@
     </div>
 </div>
 
-<main></main>
\ No newline at end of file
+<main style="margin-bottom: 24px;"></main>
\ No newline at end of file
diff --git a/src/app/components/main/main.component.html b/src/app/components/main/main.component.html
index 38e346d..c687baf 100644
--- a/src/app/components/main/main.component.html
+++ b/src/app/components/main/main.component.html
@@ -3,7 +3,7 @@
         <div class="col">
             <div class="card">
                 <div class="card-header">
-                    Card Workout!
+                    Card Workout
                 </div>
                 <div class="card-body">
                     <div class="form-group">
@@ -26,12 +26,16 @@
             <div class="alert alert-success" role="alert">
                 Current Exercise
             </div>
-            <div *ngIf="exercise && reps" class="card sticky-card">
+            <div *ngIf="exercise && reps && !rest" class="card sticky-card">
                 <div class="card-body">
                     <h5 class="card-title">{{exercise}}</h5>
                     <p class="card-text">{{reps}} reps</p>
                 </div>
             </div>
+            <div *ngIf="rest">
+                <h5 class="card-title">Rest</h5>
+                <p class="card-text">2 minutes</p>
+            </div>
         </div>
         <!-- Current card -->
         <div class="col-md-4 col-sm-12 center">
diff --git a/src/app/components/main/main.component.ts b/src/app/components/main/main.component.ts
index 6335c05..5ee3824 100644
--- a/src/app/components/main/main.component.ts
+++ b/src/app/components/main/main.component.ts
@@ -81,8 +81,7 @@ export class MainComponent implements OnInit {
     }
 
     public displayExercise() {
-        const currentCard = this.workoutDeck[this.currentCardNumber]
-        console.log(currentCard);
+        const currentCard = this.workoutDeck[this.currentCardNumber];
         if (currentCard.value !== 1) {
             this.rest = undefined
             this.reps = Number(currentCard.value)+10;
@@ -118,14 +117,34 @@ export class MainComponent implements OnInit {
     }
 
     public incrementCardCounter() {
-        this.displayExercise();
         this.currentCardNumber += 1;
         this.previousCardNumber += 1;
+        this.displayExercise();
     }
 
     public decrementCardCounter() {
-        this.displayExercise()
         this.currentCardNumber -= 1;
         this.previousCardNumber -= 1;
+        const currentCard = this.workoutDeck[this.currentCardNumber];
+        const nextCard = this.workoutDeck[this.currentCardNumber+1];
+        if (currentCard.suit === 'c') {
+            this.cCounter -= 1;
+        } else if (currentCard.suit === 'd') {
+            this.dCounter -= 1;
+        } else if (currentCard.suit === 'h') {
+            this.hCounter -= 1;
+        } else if (currentCard.suit === 's') {
+            this.sCounter -= 1;
+        }
+        if (nextCard.suit === 'c') {
+            this.cCounter -= 1;
+        } else if (nextCard.suit === 'd') {
+            this.dCounter -= 1;
+        } else if (nextCard.suit === 'h') {
+            this.hCounter -= 1;
+        } else if (nextCard.suit === 's') {
+            this.sCounter -= 1;
+        }
+        this.displayExercise()
     }
 }