Timeshare buy page - changed style to class

src/components/timeshare/buy/buyPage.vue

@@ -5,14 +5,9 @@
       <div class="row">
         <div class="col-sm-12">
           <div class="tobuy-img-box">
-            <img
-              src="img/buy2.jpg"
-              alt="Timeshare To Buy"
-              class="img-fluid"
-              style="width:800px;height:400px; border-radius:10px"
-            />
+            <img src="img/buy2.jpg" alt="Timeshare To Buy" class="img-fluid title-img" />
           </div>
-          <div class="sinse-box" style="opacity:0.7; border: white solid 3px; border-radius: 15px">
+          <div class="sinse-box title-title">
             <h3 class="sinse-title">Timeshare To Buy</h3>
           </div>
         </div>
@@ -95,13 +90,8 @@
                     allowfullscreen
                   ></iframe>
                   <br />
-
                   <small>
-                    <a
-                      :href="mapUrl"
-                      style="color:#60CBEB;text-align:left"
-                      target="_blank"
-                    >See map bigger</a>
+                    <a :href="mapUrl" class="map-url" target="_blank">See map bigger</a>
                   </small>
                 </div>
               </div>
@@ -158,3 +148,19 @@ export default {
   },
 };
 </script>
+<style scoped>
+.title-img {
+  width: 800px;
+  height: 400px;
+  border-radius: 10px;
+}
+.title-title {
+  opacity: 0.7;
+  border: white solid 3px;
+  border-radius: 15px;
+}
+.map-url {
+  color: #60cbeb;
+  text-align: left;
+}
+</style>