diff --git a/site/client/app/components/modals/searchMatch.js b/site/client/app/components/modals/searchMatch.js
index e2a7c0f..cb5aef0 100644
--- a/site/client/app/components/modals/searchMatch.js
+++ b/site/client/app/components/modals/searchMatch.js
@@ -2,6 +2,13 @@ module.exports = {
 
   template: require('../../views/modals/searchMatch.html'),
 
- 	inherit: true
+ 	inherit: true,
+
+ 	methods: {
+ 		cancelMatch: function() {
+ 			this.modal = false;
+    	// trigger match functions
+ 		}
+ 	}
 
 };
\ No newline at end of file
diff --git a/site/client/app/views/modals/searchMatch.html b/site/client/app/views/modals/searchMatch.html
index d58b258..f529f5b 100644
--- a/site/client/app/views/modals/searchMatch.html
+++ b/site/client/app/views/modals/searchMatch.html
@@ -5,6 +5,8 @@
       <i class="icon-content-load"></i>
       <p class="modal-para">Search for Player</p>
 
+      <span class="btn-cancel" v-on="click: cancelMatch">Cancel</span>
+
     </div>
   </div>
 </div>
\ No newline at end of file
diff --git a/site/client/assets/sass/_modal.scss b/site/client/assets/sass/_modal.scss
index c33ae6d..0acdeee 100644
--- a/site/client/assets/sass/_modal.scss
+++ b/site/client/assets/sass/_modal.scss
@@ -16,7 +16,7 @@
   top: 0;
   right: 0;
   bottom: 0;
-  background: rgba(14,27,43,.8);
+  background: rgba(14,27,43,.5);
   z-index: 10;
   opacity: 0;
   visibility: hidden;
@@ -34,16 +34,18 @@
   width: 100%;
   color: #fff;
   padding: 50px 0;
-  margin: 15% 0 0 0;
+  margin: 25vh 0 0 0;
   float: left;
 }
 
 .icon-content-load {
   background: url(../img/content-load.gif) no-repeat;
-  float: left;
+  //float: left;
   width: 32px;
   height: 32px;
   opacity: .9;
+  display: block;
+  margin: 0 auto;
 }
 
 .modal-para {
@@ -53,5 +55,22 @@
   text-shadow: 0 0 10px rgba(255, 255, 255, 0.6);
   color: #8798ac;
   float: left;
-  margin: 3px 0 0 20px;
+  clear: both;
+  width: 100%;
+  text-align: center;
+  //margin: 3px 0 0 20px;
+}
+
+.btn-cancel {
+  float: left;
+  clear: both;
+  margin: 50px 0 0 0;
+  width: 100%;
+  text-align: center;
+  color: darken(#8798ac, 10%);
+  cursor: pointer;
+
+  &:hover {
+   color: #8798ac;
+  }
 }
\ No newline at end of file