diff --git a/dist/css/ionic.css b/dist/css/ionic.css
index 4a5e162ecd..3eb761bb2f 100644
--- a/dist/css/ionic.css
+++ b/dist/css/ionic.css
@@ -4284,6 +4284,12 @@ input[type="checkbox"][readonly] {
 
 /* the checkmark within the box */
 .checkbox input:after {
+  -webkit-transition: opacity 0.05s ease-in-out;
+  -moz-transition: opacity 0.05s ease-in-out;
+  transition: opacity 0.05s ease-in-out;
+  -webkit-transform: rotate(-45deg);
+  -moz-transform: rotate(-45deg);
+  transform: rotate(-45deg);
   position: absolute;
   top: 34%;
   left: 26%;
@@ -4294,10 +4300,7 @@ input[type="checkbox"][readonly] {
   border-top: 0;
   border-right: 0;
   content: ' ';
-  opacity: 0;
-  transition: opacity .05s ease-in-out;
-  -webkit-transform: rotate(-45deg);
-  transform: rotate(-45deg); }
+  opacity: 0; }
 
 /* what the background looks like when its checked */
 .checkbox input:checked:before {
diff --git a/scss/_checkbox.scss b/scss/_checkbox.scss
index 5b7f6b84c9..d81d0dc889 100644
--- a/scss/_checkbox.scss
+++ b/scss/_checkbox.scss
@@ -35,6 +35,9 @@
 
 /* the checkmark within the box */
 .checkbox input:after {
+
+  @include transition(opacity .05s ease-in-out);
+  @include rotate(-45deg);
   position: absolute;
   top: 34%;
   left: 26%;
@@ -46,10 +49,6 @@
   border-right: 0;
   content: ' ';
   opacity: 0;
-  transition: opacity .05s ease-in-out;
-
-  -webkit-transform: rotate(-45deg);
-  transform: rotate(-45deg);
 }
 
 /* what the background looks like when its checked */