diff --git a/src/definitions/modules/checkbox.less b/src/definitions/modules/checkbox.less
index 90a090a6c..bcda8c5b1 100755
--- a/src/definitions/modules/checkbox.less
+++ b/src/definitions/modules/checkbox.less
@@ -161,6 +161,26 @@
   color: @labelPressedColor;
 }
 
+/*--------------
+     Active
+---------------*/
+
+.ui.checkbox input[type="checkbox"]:checked ~ .box:before,
+.ui.checkbox input[type="checkbox"]:checked ~ label:before,
+.ui.checkbox input[type="radio"]:checked ~ .box:before,
+.ui.checkbox input[type="radio"]:checked ~ label:before {
+  background: @checkboxActiveBackground;
+  border: @checkboxActiveBorder;
+}
+
+.ui.checkbox input[type="checkbox"]:checked ~ .box:after,
+.ui.checkbox input[type="checkbox"]:checked ~ label:after,
+.ui.checkbox input[type="radio"]:checked ~ .box:after,
+.ui.checkbox input[type="radio"]:checked ~ label:after {
+  opacity: 1;
+  color: @checkboxActiveColor;
+}
+
 /*--------------
       Focus
 ---------------*/
@@ -168,7 +188,11 @@
 .ui.checkbox input[type="checkbox"]:focus ~ .box:before,
 .ui.checkbox input[type="checkbox"]:focus ~ label:before,
 .ui.checkbox input[type="radio"]:focus ~ .box:before,
-.ui.checkbox input[type="radio"]:focus ~ label:before {
+.ui.checkbox input[type="radio"]:focus ~ label:before,
+.ui.checkbox input[type="checkbox"]:checked:focus ~ .box:before,
+.ui.checkbox input[type="checkbox"]:checked:focus ~ label:before,
+.ui.checkbox input[type="radio"]:checked:focus ~ .box:before,
+.ui.checkbox input[type="radio"]:checked:focus ~ label:before  {
   background: @checkboxFocusedBackground;
   border: @checkboxFocusedBorder;
 }
@@ -184,26 +208,6 @@
 }
 
 
-/*--------------
-     Active
----------------*/
-
-.ui.checkbox input[type="checkbox"]:checked ~ .box:before,
-.ui.checkbox input[type="checkbox"]:checked ~ label:before,
-.ui.checkbox input[type="radio"]:checked ~ .box:before,
-.ui.checkbox input[type="radio"]:checked ~ label:before {
-  background: @checkboxActiveBackground;
-  border: @checkboxActiveBorder;
-}
-
-.ui.checkbox input[type="checkbox"]:checked ~ .box:after,
-.ui.checkbox input[type="checkbox"]:checked ~ label:after,
-.ui.checkbox input[type="radio"]:checked ~ .box:after,
-.ui.checkbox input[type="radio"]:checked ~ label:after {
-  opacity: 1;
-  color: @checkboxActiveColor;
-}
-
 
 /*--------------
     Read-Only