diff --git a/app/assets/images/dashed-border-govuk-blue.svg b/app/assets/images/dashed-border-govuk-blue.svg
new file mode 100644
index 000000000..3c9d9f1db
--- /dev/null
+++ b/app/assets/images/dashed-border-govuk-blue.svg
@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 15 15" style="enable-background:new 0 0 15 15;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:none;stroke:#185FA0;stroke-width:2;stroke-miterlimit:10;}
+</style>
+<g>
+	<polyline class="st0" points="14,5.1 14,1 9.9,1 	"/>
+	<polyline class="st0" points="5.1,1 1,1 1,5.1 	"/>
+	<polyline class="st0" points="1,9.9 1,14 5.1,14 	"/>
+	<polyline class="st0" points="9.9,14 14,14 14,9.9 	"/>
+</g>
+</svg>
diff --git a/app/assets/stylesheets/components/area-list.scss b/app/assets/stylesheets/components/area-list.scss
index d347af7fc..1bb30c1df 100644
--- a/app/assets/stylesheets/components/area-list.scss
+++ b/app/assets/stylesheets/components/area-list.scss
@@ -1,6 +1,6 @@
 .area-list {
 
-  display: inline-block;
+  display: inline;
 
   &-item {
 
@@ -104,17 +104,26 @@
 
   &--certain {
     &:before {
-      border: 4px solid rgba($white, 0.1);
-      background: rgba($govuk-blue, 0.6);
-      box-shadow: inset 0 0 0 2px $black;
+      border: 2px solid $black;
+      background: $light-blue-50;
     }
   }
 
   &--likely {
     &:before {
       padding: 1px;
-      border: 2px solid $govuk-blue;
-      background: rgba($govuk-blue, 0.2);
+      border: 2px dashed $govuk-blue;
+      border-image: file-url('dashed-border-govuk-blue.svg') 4 round;
+      background: $light-blue-25;
+    }
+  }
+
+  &--phone-estimate {
+    padding-left: govuk-spacing(1);
+    margin-right: 0;
+    float: right;
+    &:before {
+      display: none;
     }
   }
 
diff --git a/app/templates/views/broadcast/partials/area-map-javascripts.html b/app/templates/views/broadcast/partials/area-map-javascripts.html
index 6111f6be2..b557e9445 100644
--- a/app/templates/views/broadcast/partials/area-map-javascripts.html
+++ b/app/templates/views/broadcast/partials/area-map-javascripts.html
@@ -5,23 +5,13 @@
   {% for polygon in broadcast_message.simple_polygons.bleed.as_coordinate_pairs_lat_long %}
     polygons.push(
       L.polygon({{polygon}}, {
-        opacity: 0.8,
-        color: '#005ea5', // $light-blue
-        fillColor: '#005ea5', // $light-blue
+        opacity: 1,
+        color: '#005ea5',
+        fillColor: '#2B8CC4',
         fillOpacity: 0.15,
-        weight: 2
-      })
-    );
-  {% endfor %}
-
-  {% for polygon in broadcast_message.simple_polygons.as_coordinate_pairs_lat_long %}
-    polygons.push(
-      L.polygon({{polygon}}, {
-        opacity: 0.3,
-        color: '#005ea5', // $black
-        fillColor: '#005ea5', // $light-blue
-        fillOpacity: 0.3,
-        weight: 1
+        weight: 2,
+        dashArray: [6, 7],
+        lineCap: 'butt'
       })
     );
   {% endfor %}
@@ -29,8 +19,9 @@
   {% for polygon in broadcast_message.polygons.as_coordinate_pairs_lat_long %}
     polygons.push(
       L.polygon({{polygon}}, {
-        color: '#0b0b0c', // $black
-        fillOpacity: 0,
+        color: '#0b0b0c',
+        fillColor: '#005ea5',
+        fillOpacity: 0.3,
         weight: 2
       })
     );