Use flexbox for checkbox fields

assets/stylesheets/wizard/wizard_custom.scss

@@ -363,10 +363,11 @@ img.avatar {
 }
 
 .wizard-column .checkbox-field {
-  float: left;
+  display: flex;
 
   &> label {
-    float: right;
+    order: 1;
+    flex: 1;
 
     .field-description {
       margin-top: 0;
@@ -374,7 +375,7 @@ img.avatar {
   }
 
   &> .input-area {
-    float: left;
+    order: 0;
     margin: 15px 20px !important;
 
     input {

assets/stylesheets/wizard/wizard_custom_mobile.scss

@@ -46,22 +46,16 @@
     border: 1px solid #919191;
   }
 
-  .wizard-column {
-    .checkbox-field > label {
-      max-width: calc(100% - 53px);
+  .wizard-column .wizard-field .field-description {
+    display: flex;
+    align-items: center;
+
+    img {
+      float: none;
     }
 
-    .wizard-field .field-description {
-      display: flex;
-      align-items: center;
-
-      img {
-        float: none;
-      }
-
-      i, span {
-        flex: 1;
-      }
+    i, span {
+      flex: 1;
     }
   }
 }