diff --git a/app/assets/images/exclamation.svg b/app/assets/images/exclamation.svg
index 5998192ad..e530210e1 100644
--- a/app/assets/images/exclamation.svg
+++ b/app/assets/images/exclamation.svg
@@ -1,26 +1,26 @@
 <?xml version="1.0" encoding="utf-8"?>
 <!-- Generator: Adobe Illustrator 21.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
-<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"
+<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 17.5 14.5" width="17.5" height="14.5" style="enable-background:new 0 0 17.5 14.5;" xml:space="preserve">
 <style type="text/css">
-	.st0{fill:#0B0B0B;}
+	.st0{display:none;}
+	.st1{display:inline;fill:#BCBCBC;}
+	.st2{fill:#FFFFFF;}
+	.st3{fill:#6F777B;}
 </style>
-<path class="st0" d="M8.6,3.9l5.3,8.6H3.5L8.6,3.9 M8.6,0L0,14.5h17.5L8.6,0L8.6,0z"/>
-<g>
-	<circle class="st0" cx="8.8" cy="10.9" r="1.1"/>
-	<path d="M8.8,9.8c-0.6,0-1.1,0.5-1.1,1.1c0,0.6,0.5,1.1,1.1,1.1s1.1-0.5,1.1-1.1C9.8,10.3,9.4,9.8,8.8,9.8L8.8,9.8z"/>
+<g id="Layer_3" class="st0">
+	<rect x="-1.6" y="-0.8" class="st1" width="20.1" height="17.8"/>
 </g>
-<polygon class="st0" points="8.2,6.4 9.3,6.4 9.7,6.8 9.6,9.3 8.7,9.1 8,9.3 7.8,6.9 "/>
-<g>
+<g id="Layer_1">
+	<path class="st2" d="M8.6,0L0,14.5h17.5L8.6,0L8.6,0z"/>
+	<g>
+		<circle class="st2" cx="8.8" cy="10.9" r="1.1"/>
+	</g>
 </g>
-<g>
-</g>
-<g>
-</g>
-<g>
-</g>
-<g>
-</g>
-<g>
+<g id="Layer_2">
+	<path class="st3" d="M8.8,10.3c-0.8,0-1.5,0.7-1.5,1.5c0,0.8,0.7,1.5,1.5,1.5s1.5-0.7,1.5-1.5C10.2,11,9.6,10.3,8.8,10.3L8.8,10.3z
+		"/>
+	<path class="st3" d="M10.1,5.8C10.2,6.6,9.8,9,9.8,9S9.4,9,8.8,9C8.3,9,7.8,9,7.8,9S7.3,6.7,7.3,6c0,0,0-1.6,1.4-1.6
+		C10.1,4.4,10.1,5.8,10.1,5.8z"/>
 </g>
 </svg>
diff --git a/app/assets/stylesheets/components/broadcast-message.scss b/app/assets/stylesheets/components/broadcast-message.scss
index 4ccf1a423..4251922b0 100644
--- a/app/assets/stylesheets/components/broadcast-message.scss
+++ b/app/assets/stylesheets/components/broadcast-message.scss
@@ -6,7 +6,7 @@
   box-sizing: border-box;
   padding: govuk-spacing(9) govuk-spacing(3) govuk-spacing(3) govuk-spacing(3);
   background: $panel-colour;
-  border: 2px solid $black;
+  box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.05);
   border-radius: 5px;
   white-space: normal;
   margin: govuk-spacing(2) 0 govuk-spacing(4) 0;
@@ -16,18 +16,21 @@
   &:before {
     content: "Emergency alert";
     display: block;
-    border-bottom: 2px solid $black;
     position: absolute;
-    top: govuk-spacing(2);
+    top: 0;
     left: 0;
-    padding: 2px govuk-spacing(3) govuk-spacing(2) 45px;
+    padding: govuk-spacing(2) + 1px govuk-spacing(3) (govuk-spacing(2) - 1px) 46px;
     width: 100%;
     box-sizing: border-box;
     font-weight: bold;
-    background: file-url('exclamation.svg');
-    background-size: 20px;
+    background: $grey-1 file-url('exclamation.svg');
+    color: $white;
+    background-size: 22px;
     background-repeat: no-repeat;
-    background-position: govuk-spacing(3) 3px;
+    background-position: govuk-spacing(3) 11px;
+    border-top-right-radius: 5px;
+    border-top-left-radius: 5px;
+    box-shadow: inset 0 -1px 0 0 rgba(0, 0, 0, 0.1);
   }
 
 }