diff --git a/mix/qml/Debugger.qml b/mix/qml/Debugger.qml
index 9ab2f03a4..836bbaf94 100644
--- a/mix/qml/Debugger.qml
+++ b/mix/qml/Debugger.qml
@@ -225,24 +225,24 @@ Rectangle {
 								id: playAction
 								enabledStateImg: "qrc:/qml/img/play_button.png"
 								disableStateImg: "qrc:/qml/img/play_button.png"
-								onClicked: console.log("play");
+								onClicked: projectModel.stateListModel.runState(transactionLog.selectedStateIndex)
 								width: 30
 								height: 30
 								buttonShortcut: "Ctrl+Shift+F8"
-								buttonTooltip: qsTr("Play")
+								buttonTooltip: qsTr("Start Debugging")
 								visible: true
 							}
 
 							StepActionImage
 							{
 								id: pauseAction
-								enabledStateImg: "qrc:/qml/img/pause_button.png"
-								disableStateImg: "qrc:/qml/img/pause_button.png"
-								onClicked: console.log("pause");
+								enabledStateImg: "qrc:/qml/img/stop_button2x.png"
+								disableStateImg: "qrc:/qml/img/stop_button2x.png"
+								onClicked: Debugger.init(null);
 								width: 30
 								height: 30
 								buttonShortcut: "Ctrl+Shift+F9"
-								buttonTooltip: qsTr("Pause")
+								buttonTooltip: qsTr("Stop Debugging")
 								visible: true
 							}
 
diff --git a/mix/qml/StatesComboBox.qml b/mix/qml/StatesComboBox.qml
index 34567d083..bc7a4853d 100644
--- a/mix/qml/StatesComboBox.qml
+++ b/mix/qml/StatesComboBox.qml
@@ -29,7 +29,7 @@ Rectangle {
 	id: statesComboBox
 
 	width: 200
-	height: 20
+	height: 23
 
 	Component.onCompleted: {
 		var top = dropDownList
@@ -53,7 +53,7 @@ Rectangle {
 	signal selectItem(real item)
 	signal editItem(real item)
 	signal selectCreate
-	property variant rowHeight: 25
+	property int rowHeight: 25
 	property variant items
 	property alias selectedItem: chosenItemText.text
 	property alias selectedIndex: listView.currentRow
@@ -67,21 +67,31 @@ Rectangle {
 	property variant colorItem
 	property variant colorSelect
 
+	SourceSansProRegular
+	{
+		id: regularFont
+	}
+
+	SourceSansProBold
+	{
+		id: boldFont
+	}
+
 	smooth: true
 	Rectangle {
 		id: chosenItem
 		width: parent.width
 		height: statesComboBox.height
 		color: statesComboBox.color
-		smooth: true
+
 		Text {
 			id: chosenItemText
-			anchors.top: parent.top
 			anchors.left: parent.left
-			anchors.margins: 2
+			anchors.leftMargin: 10
+			anchors.verticalCenter: parent.verticalCenter
 			color: statesComboBox.colorItem
 			text: ""
-			smooth: true
+			font.family: regularFont.name
 		}
 
 		MouseArea {
@@ -111,7 +121,7 @@ Rectangle {
 		clip: true
 		radius: 4
 		anchors.top: chosenItem.top
-		anchors.margins: 2
+		anchors.topMargin: 23
 		color: statesComboBox.color
 
 		ColumnLayout {
@@ -151,7 +161,9 @@ Rectangle {
 							color: statesComboBox.colorItem
 							anchors.top: parent.top
 							anchors.left: parent.left
-							anchors.margins: 5
+							anchors.leftMargin: 10
+							anchors.topMargin: 5
+							font.family: regularFont.name
 						}
 						Image {
 							id: imageItemid
@@ -197,15 +209,18 @@ Rectangle {
 			} //Table View
 
 			RowLayout {
-				Rectangle {
-					width: 1
-				}
+				anchors.top: listView.bottom
+				anchors.topMargin: 4
+				anchors.left: parent.left
+				anchors.leftMargin: 10
 				Text {
 					id: createStateText
 					width: statesComboBox.width
 					height: statesComboBox.height
-					font.bold: true
+					font.family: boldFont.name
+					color: "#808080"
 					text: qsTr("Create State ...")
+					font.weight: Font.DemiBold
 					MouseArea {
 						anchors.fill: parent
 						hoverEnabled: true
diff --git a/mix/qml/TransactionLog.qml b/mix/qml/TransactionLog.qml
index 3bcc6c270..5668c6e05 100644
--- a/mix/qml/TransactionLog.qml
+++ b/mix/qml/TransactionLog.qml
@@ -9,6 +9,7 @@ Item {
 	property ListModel fullModel: ListModel{}
 	property ListModel transactionModel: ListModel{}
 	property ListModel callModel: ListModel{}
+	property int selectedStateIndex: statesCombo.selectedIndex
 
 	ColumnLayout {
 		anchors.fill: parent
@@ -45,14 +46,15 @@ Item {
 						projectModel.stateListModel.debugDefaultState();
 				}
 			}
+
 			StatesComboBox
 			{
 				id: statesCombo
 				items: projectModel.stateListModel
 				onSelectCreate: projectModel.stateListModel.addState();
 				onEditItem: projectModel.stateListModel.editState(item)
-				colorItem: "black"
-				colorSelect: "blue"
+				colorItem: "#808080"
+				colorSelect: "#4a90e2"
 				color: "white"
 				Connections {
 					target: projectModel.stateListModel
diff --git a/mix/qml/img/stop_button2x.png b/mix/qml/img/stop_button2x.png
new file mode 100644
index 000000000..1727b729a
Binary files /dev/null and b/mix/qml/img/stop_button2x.png differ
diff --git a/mix/res.qrc b/mix/res.qrc
index 24bbc3830..0149b96e4 100644
--- a/mix/res.qrc
+++ b/mix/res.qrc
@@ -62,5 +62,6 @@
         <file>qml/img/copyicon.png</file>
         <file>qml/img/copyiconactive.png</file>
         <file>qml/img/searchicon.png</file>
+        <file>qml/img/stop_button2x.png</file>
     </qresource>
 </RCC>