diff --git a/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/public/css/styles.css b/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/public/css/styles.css
index 984c46c7f..a64a07abc 100644
--- a/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/public/css/styles.css
+++ b/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/public/css/styles.css
@@ -48,11 +48,11 @@ hr {
 .grey-bg {
     background-color: #f6f4f4;
 }
-.doc-link {
-    background: #11375B;
-    padding: 20px;
-    color: white;
+.doc-link{
+    background: none;
+    color: #000;
+    padding: 10px 0px;
 }
 .doc-link a {
-    color: white;
+    color: #006eff;
 }
diff --git a/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/type-view.hbs b/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/type-view.hbs
index 120ff4950..b0b790ae7 100644
--- a/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/type-view.hbs
+++ b/components/device-types/arduino-plugin/org.wso2.carbon.device.mgt.iot.arduino.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.arduino.type-view/type-view.hbs
@@ -25,9 +25,7 @@
 </div>
 
 <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-top">
-    <h4 class="doc-link">Click <a href="https://docs.wso2.com/display/IoTS100/Arduino"
-                                  target="_blank">[ here ]</a> for latest instructions and
-                         troubleshooting.</h4>
+
 </div>
 
 <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-top">
@@ -40,34 +38,37 @@
     <hr>
     <ul class="list-unstyled">
         <li class="padding-top-double">
-            <span class="circle">ITEM 01</span>
+            <span class="badge">ITEM 01</span>
                Arduino UNO Board.
         </li>
-        <li class="padding-top-double">
-            <span class="circle">ITEM 02</span>
+        <li>
+            <span class="badge">ITEM 02</span>
                Adafruit Wifi Shield for Arduino.
         </li>
-        <li class="padding-top-double">
-            <span class="circle">ITEM 03</span>
+        <li>
+            <span class="badge">ITEM 03</span>
                LED bulb connected to Pin 13.
             <i>(If not available, will use the one on the board.)</i>
         </li>
-        <li class="padding-top-double">
-            <span class="circle">ITEM 04</span>
+        <li>
+            <span class="badge">ITEM 04</span>
                Resister( e.g 330 ohms )
         </li>
-        <li class="padding-top-double">
-            <span class="circle">STEP 05</span>
+        <li>
+            <span class="badge">STEP 05</span>
                Proceed to [Prepare] section.
     </ul>
     <br>
     <a href="/api-store/apis/info?name={{@uriParams.deviceType}}&version=1.0.0&provider=admin"
        class="btn-operations" target="_blank">
-        <i class="fw fw-api"></i> View API
+        <i class="fw fw-api add-margin-1x"></i> View API
     </a>
     <a href="#" class="download-link btn-operations">
-        <i class="fw fw-download"></i>Download Sketch
+        <i class="fw fw-download add-margin-1x"></i>Download Sketch
     </a>
+    <p class="doc-link">Click <a href="https://docs.wso2.com/display/IoTS100/Arduino"
+                                 target="_blank">here</a> for latest instructions and
+        troubleshooting.</p>
     <div id="download-device-modal-content" class="hide">
         <div class="modal-content">
             <div class="row">
diff --git a/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/public/css/styles.css b/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/public/css/styles.css
index 0c138185a..30bab605b 100644
--- a/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/public/css/styles.css
+++ b/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/public/css/styles.css
@@ -56,13 +56,12 @@ hr {
     background-color: #f6f4f4;
 }
 
-.doc-link {
-    background: #11375B;
-    padding: 20px;
-    color: white;
-    margin-top: 0;
+.doc-link{
+    background: none;
+    color: #000;
+    padding: 10px 0px;
 }
 
 .doc-link a {
-    color: white;
+    color: #006eff;
 }
\ No newline at end of file
diff --git a/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/type-view.hbs b/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/type-view.hbs
index 0a49db9ae..4c9f69088 100644
--- a/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/type-view.hbs
+++ b/components/device-types/raspberrypi-plugin/org.wso2.carbon.device.mgt.iot.raspberrypi.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.raspberrypi.type-view/type-view.hbs
@@ -24,11 +24,6 @@
     <img src="{{@unit.publicUri}}/images/respberry-icon.png" class="img-responsive">
 </div>
 
-<div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-top">
-    <h4 class="doc-link">Click <a href="https://docs.wso2.com/display/IoTS100/Raspberry+Pi"
-                                  target="_blank">[ here ]</a> for latest instructions and
-                         troubleshooting.</h4>
-</div>
 
 <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-top">
     <h3 class="uppercase">What it Does</h3>
@@ -39,33 +34,36 @@
     <hr>
     <ul class="list-unstyled">
         <li class="padding-top-double">
-            <span class="circle">ITEM 01</span>
+            <span class="badge">ITEM 01</span>
                Raspberry Pi with SD Card(Internet Enabled [Wifi or Ethernet]).
         </li>
-        <li class="padding-top-double">
-            <span class="circle">ITEM 02</span>
+        <li>
+            <span class="badge">ITEM 02</span>
                Adafruit DHT11 Temperature Sensor.
         </li>
-        <li class="padding-top-double">
-            <span class="circle">ITEM 03</span>
+        <li>
+            <span class="badge">ITEM 03</span>
                LED Bulb.
         </li>
-        <li class="padding-top-double">
-            <span class="circle">ITEM 04</span>
+        <li>
+            <span class="badge">ITEM 04</span>
                Resister (eg : 470 ohm).
         </li>
-        <li class="padding-top-double">
-            <span class="circle">STEP 05</span>
+        <li>
+            <span class="badge">STEP 05</span>
                Proceed to [Prepare] section.
     </ul>
     <br>
     <a href="/api-store/apis/info?name={{@uriParams.deviceType}}&version=1.0.0&provider=admin"
        class="btn-operations"
-       target="_blank"><i class="fw fw-api"></i> View API</i>
+       target="_blank"><i class="fw fw-api add-margin-1x"></i> View API</i>
     </a>
     <a href="#" class="download-link btn-operations">
-        <i class="fw fw-download"></i>Download Agent
+        <i class="fw fw-download add-margin-1x"></i>Download Agent
     </a>
+    <p class="doc-link">Click <a href="https://docs.wso2.com/display/IoTS100/Raspberry+Pi"
+                                 target="_blank">here</a> for latest instructions and
+        troubleshooting.</p>
     <div id="download-device-modal-content" class="hide">
         <div class="modal-content">
             <div class="row">
diff --git a/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/public/css/styles.css b/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/public/css/styles.css
index 04e2a2611..1a65500ff 100644
--- a/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/public/css/styles.css
+++ b/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/public/css/styles.css
@@ -49,13 +49,12 @@ hr {
     background-color: #f6f4f4;
 }
 
-.doc-link {
-    background: #11375B;
-    padding: 20px;
-    color: white;
-    margin-top: 0;
+.doc-link{
+    background: none;
+    color: #000;
+    padding: 10px 0px;
 }
 
 .doc-link a {
-    color: white;
+    color: #006eff;
 }
\ No newline at end of file
diff --git a/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/type-view.hbs b/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/type-view.hbs
index b03801183..3b1496c73 100644
--- a/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/type-view.hbs
+++ b/components/mobile-plugins/android-plugin/org.wso2.carbon.device.mgt.mobile.android.ui/src/main/resources/jaggeryapps/devicemgt/app/units/cdmf.unit.device.type.android.type-view/type-view.hbs
@@ -9,10 +9,6 @@
     <img src="{{@unit.publicUri}}/images/android-icon.png" class="img-responsive">
 </div>
 
-<div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-top">
-    <h4 class="doc-link">Click <a href="https://docs.wso2.com/display/IoTS100/Android"
-                                  target="_blank">[ here ]</a> for latest instructions and troubleshooting.</h4>
-</div>
 
 <div class="col-xs-12 col-sm-8 col-md-8 col-lg-8 padding-top">
 
@@ -24,18 +20,20 @@
     <h3 class="uppercase">What You Need</h3>
     <hr>
     <ul class="list-unstyled">
-        <li class="padding-top-double"><span class="circle">STEP 01</span>   Android
+        <li class="padding-top-double"><span class="badge">STEP 01</span>   Android
                                                                              Mobile.
         </li>
-        <li class="padding-top-double"><span class="circle">STEP 02</span>   Go ahead
+        <li><span class="badge">STEP 02</span>   Go ahead
                                                                              and click [Enroll Device].
         </li>
-        <li class="padding-top-double"><span class="circle">STEP 03</span>   Proceed
+        <li><span class="badge">STEP 03</span>   Proceed
                                                                              to the [Prepare] section.
         </li>
     </ul>
     <br>
-    <a href="javascript:toggleEnrollment()" class="download-link btn-operations"><i class="fw fw-mobile fw-inverse fw-lg"></i> Enroll Device</a>
+    <a href="javascript:toggleEnrollment()" class="download-link btn-operations"><i class="fw fw-mobile fw-inverse fw-lg add-margin-1x"></i> Enroll Device</a>
+    <p class="doc-link">Click <a href="https://docs.wso2.com/display/IoTS100/Android"
+                                      target="_blank">here</a> for latest instructions and troubleshooting.</p>
     <br/><br/>
 </div>