Index: sources/gui/qml/dialogs/NotificationDialog.qml
===================================================================
diff -u -rbea36be2766046e63c4e82539a630b5cee7ce1c6 -r1286d74bd015276aab604808be2766136091c125
--- sources/gui/qml/dialogs/NotificationDialog.qml	(.../NotificationDialog.qml)	(revision bea36be2766046e63c4e82539a630b5cee7ce1c6)
+++ sources/gui/qml/dialogs/NotificationDialog.qml	(.../NotificationDialog.qml)	(revision 1286d74bd015276aab604808be2766136091c125)
@@ -43,6 +43,7 @@
 
     property bool  resumeVisible        : false
     property bool  rinsebackVisible     : false
+    property bool  temporaryBreakVisible: alarmID === 3   // TODO -- ONLY FOR DEMO - nned to update fw message and add
     property bool  endVisible           : false
     property bool  okVisible            : false
     property bool  minVisible           : true
@@ -60,6 +61,7 @@
     signal listClicked()
 
     signal resumeClicked()
+    signal temporaryBreakClicked()
     signal rinsebackClicked()
     signal endClicked()
     signal okClicked()
@@ -121,30 +123,47 @@
             bottom      : _timerRect.top
         }
 
-        Item { id: _infoItem
+        HelpNotification { id: _infoItem
             anchors {
                 left        : parent.left
-                leftMargin  : Variables.defaultMargin * 2
+                leftMargin  : Variables.defaultMargin * 4
                 top         : parent.top
                 topMargin   : Variables.defaultMargin * 3
             }
-            height  : 35
-            width   : parent.width / 2
 
-            NotificationBarSmall { id: _infoNotificationBar
-                color                   : "transparent"
-                imageSource             : "qrc:/images/iHelp"
-                imageVisible            : true
-                text                    : qsTr("TAP THE STEP NUMBER TO VIEW THE CORRESPONDING IMAGES")
-                textColor               : "#595959"
-                imageDiameter           : 25
-                imageTopMargin          : 3
-            }
         }
 
-        Row  { id: _alarmContentRow
+//        Item { id: _infoItem
+//            anchors {
+//                left        : parent.left
+//                leftMargin  : Variables.defaultMargin * 4
+//                top         : parent.top
+//                topMargin   : Variables.defaultMargin * 3
+//            }
+//            height  : 35
+//            width   : parent.width / 2
+
+//            NotificationBarSmall { id: _infoNotificationBar
+//                color                   : "transparent"
+//                imageSource             : "qrc:/images/iHelp"
+//                imageVisible            : true
+//                text                    : qsTr("TAP THE STEP NUMBER TO VIEW IMAGE")
+//                textColor               : "#3682ED"
+//                imageDiameter           : 25
+//                imageTopMargin          : 3
+//                textfontWeight          : Font.DemiBold
+//                height                  : parent.height
+//                rowAnchors       {
+//                    centerIn: undefined
+//                    left    : parent.left
+//                }
+//            }
+//        }
+
+        ListView {id: _listView
             anchors {
                 top         : _infoItem.bottom
+                topMargin   : Variables.defaultMargin
                 bottom      : parent.bottom
                 left        : parent.left
                 leftMargin  : Variables.defaultMargin * 4
@@ -156,31 +175,34 @@
             spacing : Variables.defaultMargin * 3
             width   : _descriptionRect.width
 
-            ListView {id: _listView
-                height      : _alarmContentRow.height
-                width       : parent.width * 0.65
-                currentIndex: 0
-                interactive : false
-                clip        : true
+            height      : _descriptionRect.height
+            width       : _descriptionRect.width / 2
+            currentIndex: 0
+            interactive : false
+            clip        : true
 
                 delegate: Item { id: _delegateControl
                     width   : _listView.width
                     height  : Variables.instructionHeight
                     clip    : true
 
-                    Rectangle { id: _stepRect
-                        height  : 40
-                        width   : height
-                        radius  : height
-                        color   : Colors.backgroundMainMenu
+                Rectangle { id: _stepRect
+                    height  : 40
+                    width   : height
+                    radius  : height
+                    color   : _delegateControl.ListView.isCurrentItem  ?  Colors.backgroundMainMenu : Colors.offWhite
+                    border {
+                        color: Colors.backgroundMainMenu
+                        width: 2
+                    }
 
-                        Text { id: _stepNumberRect
-                            anchors.centerIn: parent
-                            text            : index + 1
-                            color           : Colors.white
-                            font.pixelSize  : 20
-                            font.weight     : Font.Medium
-                        }
+                    Text { id: _stepNumberRect
+                        anchors.centerIn: parent
+                        text            : index + 1
+                        color           :  _delegateControl.ListView.isCurrentItem ? Colors.offWhite :  Colors.backgroundMainMenu
+                        font.pixelSize  : 20
+                        font.weight     : Font.Medium
+                    }
 
                         layer.enabled   : true
                         layer.effect    : DropShadow { id: _dropShadow
@@ -208,6 +230,14 @@
                         text            : model.instruction
                         wrapMode        : Text.WordWrap
                     }
+                    height          : parent.height
+                    width           : parent.width
+                    font.pixelSize  : Fonts.fontPixelInstructionStep
+                    font.weight     : _delegateControl.ListView.isCurrentItem ? Font.DemiBold : Font.Normal
+                    color           : _delegateControl.ListView.isCurrentItem ? "#18559E" : Colors.alarmDialogText
+                    text            : model.instruction
+                    wrapMode        : Text.WordWrap
+                }
 
                     MouseArea {
                         anchors.fill: parent
@@ -221,17 +251,9 @@
                 }
             }
 
-            Item { id: _imageContainer
-                width: parent.width * 0.30
-                height: _alarmContentRow.height - Variables.defaultMargin
-                anchors.verticalCenter: parent.verticalCenter
-
-                Image { id: _figureImage
-                    width: parent.width
-                    height: parent.height
-                    fillMode: Image.PreserveAspectFit
-                }
-            }
+        Image { id: _figureImage
+            anchors.right   : parent.right
+            anchors.verticalCenter: parent.verticalCenter
         }
     }
 
@@ -294,15 +316,15 @@
     }
 
     Row { id: _buttonGroup
-        property int buttonsWidth   : 250
+        property int buttonsWidth   : 350
         spacing: 50
 
         anchors {
             bottom          : parent.bottom
             horizontalCenter: parent.horizontalCenter
             rightMargin     : spacing
             leftMargin      : spacing
-            bottomMargin    : Variables.defaultMargin * 2
+            bottomMargin    : Variables.defaultMargin * 4
         }
 
         // IMPORTANT NOTE : Alarm Dialog buttons
@@ -315,32 +337,47 @@
         TouchRect { id  : _resumeTouchRect
             visible     : resumeVisible
             onPressed   : resumeClicked()
-            text.text   : qsTr("RESUME")
+            text.text   : qsTr("Resume")
             width       : _buttonGroup.buttonsWidth
             isDefault   : true
             backgroundColor: Colors.white
             fgColor     : isPressed ? Colors.white : borderColor
             selectColor : Qt.darker(borderColor, 1.15)
+            pixelSize   : Fonts.fontPixelNotification
         }
 
+        TouchRect { id  : _temporaryBreak
+            visible     : temporaryBreakVisible
+            onPressed   : temporaryBreakClicked()
+            text.text   : qsTr("Temporary Break")
+            width       : _buttonGroup.buttonsWidth
+            backgroundColor: Colors.white
+            fgColor     : isPressed ? Colors.white : borderColor
+            selectColor : Qt.darker(borderColor, 1.15)
+            pixelSize   : Fonts.fontPixelNotification
+        }
+
+
         TouchRect { id  : _rinsebackTouchRect
             visible     : rinsebackVisible
             onPressed   : rinsebackClicked()
-            text.text   : qsTr("RINSEBACK")
+            text.text   : qsTr("Return Blood & End Treatment")
             width       : _buttonGroup.buttonsWidth
             backgroundColor: Colors.white
             fgColor     : isPressed ? Colors.white : borderColor
             selectColor : Qt.darker(borderColor, 1.15)
+            pixelSize   : Fonts.fontPixelNotification
         }
 
         TouchRect { id  : _endTouchRect
             visible     : endVisible
             onPressed   : endClicked()
-            text.text   : qsTr("END TREATMENT")
+            text.text   : qsTr("End Treatment Only")
             width       : _buttonGroup.buttonsWidth
             backgroundColor: Colors.white
             fgColor     : isPressed ? Colors.white : borderColor
             selectColor : Qt.darker(borderColor, 1.15)
+            pixelSize   : Fonts.fontPixelNotification
         }
 
         TouchRect { id  : _okTouchRect
@@ -351,6 +388,7 @@
             backgroundColor: Colors.white
             fgColor     : isPressed ? Colors.white : borderColor
             selectColor : Qt.darker(borderColor, 1.15)
+            pixelSize   : Fonts.fontPixelNotification
         }
     }
 
@@ -361,7 +399,7 @@
             left        : parent.left
             bottom      : parent.bottom
             leftMargin  : Variables.defaultMargin * 3
-            bottomMargin: Variables.defaultMargin * 4
+            bottomMargin: Variables.defaultMargin
         }
         color           : Colors.alarmDialogGreyText
         font.pixelSize  : Fonts.fontPixelAlarmID