diff --git a/Gemfile b/Gemfile
index 7563fcfdb..cd8e340f2 100644
--- a/Gemfile
+++ b/Gemfile
@@ -12,6 +12,7 @@ gem 'json'
 # Gems used only for assets and not required
 # in production environments by default.
 group :assets do
+  gem 'autoprefixer-rails'
   gem 'sass-rails' #, github: 'rails/sass-rails'
   gem 'coffee-rails'
   gem 'coffee-script-source'
diff --git a/app/assets/stylesheets/zammad.css.scss b/app/assets/stylesheets/zammad.css.scss
index 0919b66e3..87241100a 100644
--- a/app/assets/stylesheets/zammad.css.scss
+++ b/app/assets/stylesheets/zammad.css.scss
@@ -50,8 +50,7 @@ blockquote {
 .u-clickable {
   pointer-events: auto;
   cursor: pointer;
-  -webkit-user-select: none;
-          user-select: none;
+  user-select: none;
 }
 
 .u-textTruncate {
@@ -195,11 +194,9 @@ time[data-tooltip]:after,
 span[data-tooltip]:after {
   content: "";
   position: absolute;
-  -webkit-transform: scale(0);
-          transform: scale(0);
+  transform: scale(0);
   opacity: 0;
-  -webkit-transition: -webkit-transform 300ms cubic-bezier(0.34,1.6,0.71,1), opacity 300ms;
-          transition:         transform 300ms cubic-bezier(0.34,1.6,0.71,1), opacity 300ms;
+  transition: transform 300ms cubic-bezier(0.34,1.6,0.71,1), opacity 300ms;
 }
 a[data-tooltip]:before,
 time[data-tooltip]:before,
@@ -214,8 +211,7 @@ span[data-tooltip]:before {
   padding: 0 13px;
   content: attr(data-tooltip);
   white-space: nowrap;
-  -webkit-transform-origin: 17px 26px;
-          transform-origin: 17px 26px;
+  transform-origin: 17px 26px;
 }
 a[data-tooltip]:after,
 time[data-tooltip]:after,
@@ -225,8 +221,7 @@ span[data-tooltip]:after {
   border-top: 7px solid #c6c6c5;
   border-left: 7px solid transparent;
   border-right: 7px solid transparent;
-  -webkit-transform-origin: 4px 0;
-          transform-origin: 4px 0;
+  transform-origin: 4px 0;
 }
 a[data-tooltip]:hover:after,
 a[data-tooltip]:hover:before,
@@ -236,8 +231,7 @@ span[data-tooltip]:hover:after,
 span[data-tooltip]:hover:before {
   transform: scale(1);
   opacity: 1;
-  -webkit-transition: -webkit-transform 300ms 1.5s cubic-bezier(0.34,1.6,0.71,1), opacity 300ms 1.5s;
-          transition:         transform 300ms 1.5s cubic-bezier(0.34,1.6,0.71,1), opacity 300ms 1.5s;
+  transition: transform 300ms 1.5s cubic-bezier(0.34,1.6,0.71,1), opacity 300ms 1.5s;
 }
 
 .textarea::-webkit-input-placeholder,
@@ -493,7 +487,10 @@ table {
   padding: 0;
   margin: 0;
   height: 38px;
-  @extend .u-clickable, .centered;
+  @extend .u-clickable;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 
 .input-replacement input {
@@ -680,7 +677,8 @@ fieldset > *:not(.form-group) .form-control {
   padding: 0 2px;
   margin-bottom: 3px;
   position: relative;
-  @extend .horizontal, .center;
+  display: flex;
+  align-items: center;
   
   label {
     margin: 0;
@@ -692,7 +690,10 @@ fieldset > *:not(.form-group) .form-control {
 }
 
 .formGroup-bookmark {
-  @extend .u-clickable, .horizontal, .center, .reverse;
+  @extend .u-clickable;
+  display: flex;
+  align-items: center;
+  flex-direction: row-reverse;
   width: 30px;
   height: 30px;
   position: absolute;
@@ -755,8 +756,7 @@ textarea,
   box-shadow: none;
   outline: none;
   -webkit-appearance: none;
-     -moz-appearance: none;
-          appearance: none;
+  appearance: none;
 }
 
   .form-control:focus,
@@ -847,7 +847,9 @@ textarea,
 
 .fullscreenMessage {
   padding: 22px;
-  @extend .centered;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 
   .icon {
     margin: -5px 14px 0 0;
@@ -868,7 +870,7 @@ textarea,
 
 .pagination {
   margin: 0 0 0 19px;
-  @extend .horizontal;
+  display: flex;
 }
 
 .pagination > li > a, 
@@ -914,7 +916,8 @@ textarea,
 .page-header-meta {
   margin-top: 6px;
   margin-left: auto;
-  @extend .horizontal, .self-start;
+  display: flex;
+  align-self: flex-start;
   
   .btn {
     margin: 0 0 2px 9px;
@@ -1048,7 +1051,9 @@ textarea,
   }
 
 .poweredBy {
-  @extend .centered;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   color: hsl(233,7%,26%);
   margin: auto 0 34px -16px;
   cursor: default;
@@ -1128,7 +1133,8 @@ ol.tabs li {
     padding: 10px 20px;
     text-align: center;
     border-right: 1px solid rgba(0,8,14,.08);
-    @extend .flex-auto, .u-clickable;
+    flex: 1 1 auto;
+    @extend .u-clickable;
   }
 
   .tab.active {
@@ -1201,7 +1207,7 @@ ol.tabs li {
   line-height: 22px;
   text-align: center;
   border-radius: 4px;
-  @extend .horizontal;
+  display: flex;
   
   &.auth_provider--wide {
     padding-right: 25px;
@@ -1239,7 +1245,7 @@ ol.tabs li {
   }
 
   .provider_name {
-    @extend .flex;
+    flex: 1;
   }
 
 .provider_icon {
@@ -1836,8 +1842,7 @@ ol.tabs li {
     width: 30px;
     height: 30px;
     background: hsl(145,51%,45%);
-    -webkit-animation: rotateplane 1.2s infinite ease-in-out;
-            animation: rotateplane 1.2s infinite ease-in-out;
+    animation: rotateplane 1.2s infinite ease-in-out;
   }
 
   .small.loading.icon {
@@ -1845,22 +1850,13 @@ ol.tabs li {
     height: 20px;
   }
 
-  @-webkit-keyframes rotateplane {
-    0% { -webkit-transform: perspective(120px); }
-    50% { -webkit-transform: perspective(120px) rotateY(180deg); }
-    100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg); }
-  }
-
   @keyframes rotateplane {
     0% { 
-              transform: perspective(120px) rotateX(0deg) rotateY(0deg);
-      -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg);
+      transform: perspective(120px) rotateX(0deg) rotateY(0deg);
     } 50% { 
-              transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
-      -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
+      transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
     } 100% { 
-              transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
-      -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
+      transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
     }
   }
 
@@ -1980,11 +1976,7 @@ footer {
   background-color: whiteSmoke;
   border: 1px solid #eee;
   border: 1px solid rgba(0, 0, 0, 0.05);
-  -webkit-border-radius: 4px;
-  -moz-border-radius: 4px;
   border-radius: 4px;
-  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-  -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
 }
 
@@ -2001,8 +1993,6 @@ footer {
 
 .translation {
   border: 1px dotted #F92;
-  -webkit-border-radius: 3px;
-  -moz-border-radius: 3px;
   border-radius: 3px;
 }
 .translation:hover {
@@ -2102,7 +2092,7 @@ footer {
     .tasks--standalone .task {
       padding: 0;
       margin-bottom: 9px;
-      @extend .horizontal;
+      display: flex;
     }
 
     .tasks-standalone .name {
@@ -2117,7 +2107,9 @@ footer {
     padding: 10px 15px 7px 0;
     position: relative;
     color: #808080;
-    @extend .u-clickable, .horizontal, .center;
+    display: flex;
+    align-items: center;
+    @extend .u-clickable;
   }
 
     .tasks-navigation .nav-tab {
@@ -2212,7 +2204,10 @@ footer {
     width: 50px;
     height: 100%;
     visibility: hidden;
-    @extend .u-clickable, .centered;
+    @extend .u-clickable;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
     .nav-tab:hover .nav-tab-close {
@@ -2224,7 +2219,9 @@ footer {
       height: 21px;
       background-color: #2c2d36;
       border-radius: 100%;
-      @extend .centered;
+      display: flex;
+      align-items: center;
+      justify-content: center;
     }
 
     .nav-tab-close:hover .nav-tab-close-inner {
@@ -2236,8 +2233,7 @@ footer {
       height: 13px;
       fill: white;
       opacity: 0.3;
-      -webkit-transform: scale(0.7);
-              transform: scale(0.7);
+      transform: scale(0.7);
     }
 
     .nav-tab-close:hover .icon {
@@ -2263,7 +2259,9 @@ footer {
     width: 40px;
     z-index: 1;
     visibility: hidden;
-    @extend .centered;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
   .empty-search .close.icon {
@@ -2376,7 +2374,10 @@ footer {
       height: 60px;
       position: relative;
       text-decoration: none;
-      @extend .centered, .u-clickable;
+      @extend .u-clickable;
+      display: flex;
+      align-items: center;
+      justify-content: center;
     }
     
     .user-menu .list-button *:not(.dropdown-nose) {
@@ -2474,7 +2475,7 @@ footer {
     height: 40px;
     padding: 0 15px;
     color: #2594d4;
-    @extend %displayflex;
+    display: flex;
   }
 
   .user-menu .dropdown-menu > li > a:hover {
@@ -2613,8 +2614,8 @@ footer {
     border-radius: 0;
     border-top: 1px solid #f2f2f3;
     background: transparent; /* a:focus, a:active with bg: transparent fixes gray focus bg in IE 10 */
+    display: flex;
     @extend .u-textTruncate;
-    @extend %displayflex;
   }
 
   .nav-pills > li:hover > a {
@@ -2794,7 +2795,7 @@ footer {
     }
 
     .popover-content {
-      @extend .flex;
+      flex: 1;
       overflow-y: scroll;
     }
 
@@ -2806,8 +2807,8 @@ footer {
   }
 
   .popover-notificationsHeader {
-    @extend .horizontal;
-    @extend .end;
+    display: flex;
+    align-items: flex-end;
     padding-bottom: 22px;
     margin: 21px 17px 0;
 
@@ -2826,7 +2827,7 @@ footer {
   .popover-notificationsMarkRead {
     @extend .btn;
     @extend .btn--subtle;
-    @extend .align-right;
+    margin-left: auto;
     padding: 5px 0 0 10px;
     
     &:hover {
@@ -2941,7 +2942,10 @@ footer {
     }
 
   .stat-graphic {
-    @extend .flex, .centered;
+    flex: 1;
+    display: flex;
+    justify-content: center;
+    align-items: center;
   }
 
     .time.stat-widget .stat-amount {
@@ -2963,7 +2967,9 @@ footer {
   padding: 8px 0 7px;
   margin-bottom: -7px;
   border-radius: 3px;
-  @extend .vertical, .center;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
 }
 
 .stats-row:hover {
@@ -2978,7 +2984,8 @@ footer {
     background: linear-gradient(to top, #f2f2f3, #f2f2f3 1px, transparent 1px);
     background-position: center bottom;
     background-size: 100% 12px;
-    @extend .horizontal, .end;
+    display: flex;
+    align-items: flex-end;
   }
 
   .stat-bars .stat-bar {
@@ -2996,7 +3003,8 @@ footer {
 
   .stat-legend {
     margin-top: 30px;
-    @extend .align-right, .horizontal;
+    margin-left: auto;
+    display: flex;
   }
 
   .stat-legendEntry {
@@ -3100,7 +3108,7 @@ footer {
   }
 
 .form-inline {
-  @extend .horizontal;
+  display: flex;
 }
 
 .form-inline .input-group-addon,
@@ -3114,11 +3122,11 @@ footer {
     overflow: hidden;
     position: relative;
     height: 60px;
-    @extend .flex-auto;
+    flex: 1 1 auto;
   }
 
     .attributeBar.form-inline .form-group:last-child {
-      @extend .flex-shrink;
+      flex: 0 1 auto;
     }
 
     .form-group.is-changed {
@@ -3226,7 +3234,9 @@ footer {
 }
 
 .ticketZoom-controls {
-  @extend .horizontal, .justify-end, .center;
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
 }
 
 .ticketZoom .page-header {
@@ -3447,8 +3457,7 @@ footer {
       background: white;
       border: 1px solid hsl(240,4%,95%);
       box-shadow: 0 0 1px rgba(0,0,0,.06) inset;
-      -webkit-transform: rotate(-45deg);
-              transform: rotate(-45deg);
+      transform: rotate(-45deg);
     }
 
     .article-add.is-internal .bubble-arrow:after {
@@ -3884,7 +3893,9 @@ footer {
 .tabsSidebar-holder {
   overflow: hidden;
   position: relative;
-  @extend .flex, .vertical;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
 }
 
 .tabsSidebar .sidebar {
@@ -3898,7 +3909,8 @@ footer {
   }
 
   .tabsSidebar .sidebar-header {
-    @extend .horizontal, .center;
+    display: flex;
+    align-items: center;
     margin: 20px 20px 0;
     padding: 0 0 5px;
     position: relative;
@@ -3922,7 +3934,10 @@ footer {
   .tabsSidebar-close {
     padding: 20px;
     margin: -15px;
-    @extend .centered, .u-clickable;
+    @extend .u-clickable;
+    display: flex;
+    align-items: center;
+    justify-content: center;
     
     .icon {
       width: 13px;
@@ -3956,8 +3971,7 @@ footer {
   }
 
   .tabsSidebar.is-closed {
-    -webkit-transform: translateX(280px);
-            transform: translateX(280px);
+    transform: translateX(280px);
   }
 
   .tabsSidebar-tabs {
@@ -3979,7 +3993,10 @@ footer {
     background: hsl(197,20%,93%);
     position: relative;
     border-top: 1px solid hsl(202,12%,87%);
-    @extend .u-clickable, .centered;
+    @extend .u-clickable;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 
   .tabs
@@ -4147,8 +4164,7 @@ footer {
   vertical-align: top;
   margin-right: 9px;
   margin-top: 11px;
-  -webkit-transform: scale(1.2);
-          transform: scale(1.2);
+  transform: scale(1.2);
 }
 
 .type-tabs .tab.active .tab-icon {
@@ -4270,7 +4286,9 @@ footer {
 }
 
 .switchBackToUser {
-  @extend .fit, .horizontal, .center, .zIndex-7;
+  @extend .fit, .zIndex-7;
+  display: flex;
+  align-items: center;
   background: hsl(200,87%,45%);
   color: #fff;
   height: 45px;
@@ -4289,7 +4307,9 @@ footer {
     width: 40px;
     height: 40px;
     margin-right: -10px;
-    @extend .centered;
+    display: flex;
+    align-items: center;
+    justify-content: center;
     
     .icon {
       fill: white;
@@ -4359,7 +4379,9 @@ footer {
   .modal-leftFooter,
   .modal-centerFooter,
   .modal-rightFooter {
-    @extend .flex, .horizontal, .start;
+    display: flex;
+    align-items: start;
+    flex: 1;
   }
 
 .modal.modal--local {
@@ -4447,12 +4469,14 @@ footer {
   .dropdown.dropdown--actions {
     li {
       padding: 0;
-      @extend .horizontal, .center;
+      display: flex;
+      align-items: center;
     }
 
     .dropdown-iconSpacer,
     .dropdown-activeSpacer {
-      @extend .horizontal, .center;
+      display: flex;
+      align-items: center;
     }
 
     .dropdown-iconSpacer {
@@ -4462,11 +4486,12 @@ footer {
     .dropdown-activeSpacer {
       width: 34px;
       margin-left: auto;
-      @extend .justify-end;
+      justify-content: flex-end;
     }
 
     a {
-      @extend .u-clickable, .horizontal;
+      @extend .u-clickable;
+      display: flex;
       min-width: 100%;
       padding: 3px 18px;
     }
@@ -4688,7 +4713,9 @@ footer {
 }
 
 .scrollPageHeader {
-  @extend .tabsSidebar-sidebarSpacer, .zIndex-6, .horizontal, .center;
+  @extend .tabsSidebar-sidebarSpacer, .zIndex-6;
+  display: flex;
+  align-items: center;
   background: white;
   border-bottom: 1px solid hsl(0,0%,78%);
   height: 64px;
@@ -4697,8 +4724,7 @@ footer {
   position: fixed;
   right: 0;
   top: 0;
-  -webkit-transform: translateY(-64px);
-          transform: translateY(-64px);
+  transform: translateY(-64px);
 }
 
   .scrollPageHeader small {
@@ -4709,7 +4735,7 @@ footer {
     max-width: initial;
     padding: 0;
     min-width: 0;
-    @extend .flex;
+    flex: 1;
   }
 
   .scrollPageHeader h1 {
@@ -4719,7 +4745,9 @@ footer {
   }
 
 .wizard-slide {
-  @extend .vertical, .hero-unit;
+  @extend .hero-unit;
+  display: flex;
+  flex-direction: column;
   width: 400px;
   padding-bottom: 18px;
   margin-bottom: 20px;
@@ -4737,12 +4765,12 @@ footer {
 }
 
 .wizard-body {
-  @extend .flex;
+  flex: 1;
   padding-bottom: 15px;
 }
 
 .wizard-controls {
-  @extend .horizontal;
+  display: flex;
   margin-top: 15px;
   height: 39px;
 }
@@ -4792,7 +4820,9 @@ label + .wizard-buttonList {
     color: hsl(0,0%,60%);
     background: hsl(0,0%,95%);
     margin-bottom: 10px;
-    @extend .centered;
+    display: flex;
+    align-items: center;
+    justify-content: center;
   }
 }
 
@@ -4877,7 +4907,9 @@ label + .wizard-buttonList {
 }
 
 .channelList {
-  @extend .flex, .vertical;
+  flex: 1;
+  display: flex;
+  flex-direction: column;
   background: white;
   border-radius: 2px;
   margin: 5px 0 20px;
@@ -4890,7 +4922,7 @@ label + .wizard-buttonList {
 }
 
 .channelList-entry {
-  @extend .horizontal;
+  display: flex;
   cursor: default;
   padding: 5px 8px;
   
@@ -4901,7 +4933,7 @@ label + .wizard-buttonList {
 
 .channelList-label {
   margin: 0 10px;
-  @extend .flex;
+  flex: 1;
   & > * {
     @extend .u-textTruncate; 
   }
@@ -4913,13 +4945,16 @@ label + .wizard-buttonList {
 }
 
 .channelList-placeholder {
-  @extend .flex, .centered;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex: 1;
   color: #999;
 }
 
 .channelList-controls {
   margin-top: auto;
-  @extend .horizontal;
+  display: flex;
   background: hsl(251,6%,92%);
   border-left: none;
   border-right: none;
@@ -4927,7 +4962,8 @@ label + .wizard-buttonList {
 }
 
 .channelList-controlEntry {
-  @extend .horizontal, .justified;
+  display: flex;
+  justify-content: center;
   width: 26px;
   height: 26px;
   border-left: none;
@@ -5009,12 +5045,10 @@ label + .wizard-buttonList {
   @extend .u-unclickable;
 }
 .camera-flash.is-active {
-  -webkit-animation: flash 500ms ease;
-          animation: flash 500ms ease;
+  animation: flash 500ms ease;
 }
 
-@-webkit-keyframes flash { 0% { opacity: 0 } 50% { opacity: 1 } 100% { opacity: 0 } }
-        @keyframes flash { 0% { opacity: 0 } 50% { opacity: 1 } 100% { opacity: 0 } }
+@keyframes flash { 0% { opacity: 0 } 50% { opacity: 1 } 100% { opacity: 0 } }
 
 .fileUpload {
   position: relative;
@@ -5126,7 +5160,7 @@ label + .wizard-buttonList {
 }
 
 .profile-ticketsPlaceholder {
-  @extend .flex;
+  flex: 1;
   margin: 8px 0 22px;
   color: hsl(209,28%,74%);
   
@@ -5148,7 +5182,9 @@ label + .wizard-buttonList {
 }
 
 .profile-organizationMember {
-  @extend .profile-detailsEntry, .horizontal, .center;
+  @extend .profile-detailsEntry;
+  display: flex;
+  align-items: center;
   
   .avatar {
     margin-right: 10px;
@@ -5156,14 +5192,18 @@ label + .wizard-buttonList {
 }
 
 .profile-ticketList {
-  @extend .flex, .vertical;
+  display: flex;
+  flex-direction: column;
+  flex: 1;
   
   &:not(:last-child) {
     margin-right: 50px;
   }
 
   .tasks {
-    @extend .flex, .vertical;
+    display: flex;
+    flex-direction: column;
+    flex: 1;
   }
 }
 
@@ -5186,7 +5226,9 @@ label + .wizard-buttonList {
 }
 
 .profile-organizationIcon {
-  @extend .centered;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   width: 80px;
   height: 80px;
   background: hsl(0,0%,87%);
@@ -5194,8 +5236,7 @@ label + .wizard-buttonList {
   opacity: 0.4;
   
   .icon {
-    -webkit-transform: scale(1.6);
-            transform: scale(1.6);
+    transform: scale(1.6);
   }
 }
 
@@ -5271,12 +5312,7 @@ label + .wizard-buttonList {
 
 .horizontal, 
 .vertical, 
-.centered, 
-%displayflex {
-  display: -webkit-box;
-  display: -ms-flexbox;
-  display: -moz-flex;
-  display: -webkit-flex;
+.centered {
   display: flex;
 }
 .horizontal.hide, 
@@ -5286,43 +5322,23 @@ label + .wizard-buttonList {
 }
 
 .horizontal {
-  -webkit-box-orient: horizontal;
-  -ms-flex-direction: row;
-  -moz-flex-direction: row;
-  -webkit-flex-direction: row;
   flex-direction: row;
 }
 
 .horizontal.reverse {
-  -webkit-box-direction: reverse;
-  -ms-flex-direction: row-reverse;
-  -moz-flex-direction: row-reverse;
-  -webkit-flex-direction: row-reverse;
   flex-direction: row-reverse;
 }
 
 .vertical {
-  -webkit-box-orient: vertical;
-  -ms-flex-direction: column;
-  -moz-flex-direction: column;
-  -webkit-flex-direction: column;
   flex-direction: column;
 }
 
 .vertical.reverse {
-  -webkit-box-direction: reverse;
-  -ms-flex-direction: column-reverse;
-  -moz-flex-direction: column-reverse;
-  -webkit-flex-direction: column-reverse;
   flex-direction: column-reverse;
 }
 
 .vertical.stretch > *,
 .horizontal.stretch > * {
-  -webkit-box-flex: 1;
-  -ms-flex: 1;
-  -moz-flex: 1;
-  -webkit-flex: 1;
   flex: 1;
 }
 
@@ -5347,161 +5363,83 @@ body.fit {
 }
 
 .flex {
-  -webkit-box-flex: 1;
-      -webkit-flex: 1;
-         -moz-flex: 1;
-          -ms-flex: 1;
-              flex: 1;
+  flex: 1;
 }
 
 .flex-full {
-  -webkit-box-flex: 1;
-  -webkit-flex: 1 1 100%;
-     -moz-flex: 1 1 100%;
-      -ms-flex: 1 1 100%;
-          flex: 1 1 100%;
+  flex: 1 1 100%;
 }
 
 .flex-auto {
-  -webkit-box-flex: 1;
-  -webkit-flex: 1 1 auto;
-     -moz-flex: 1 1 auto;
-      -ms-flex: 1 1 auto;
-          flex: 1 1 auto;
+  flex: 1 1 auto;
 }
 
 .flex-shrink {
-  -webkit-box-flex: 1;
-  -webkit-flex: 0 1 auto;
-     -moz-flex: 0 1 auto;
-      -ms-flex: 0 1 auto;
-          flex: 0 1 auto;
+  flex: 0 1 auto;
 }
 
 .flex-none {
-  -webkit-box-flex: none;
-  -webkit-flex: none;
-     -moz-flex: none;
-      -ms-flex: none;
-          flex: none;
+  flex: none;
 }
 
 .flex-1 {
-  -webkit-box-flex: 1;
-      -webkit-flex: 1;
-         -moz-flex: 1;
-          -ms-flex: 1;
-              flex: 1;
+  flex: 1;
 }
 
 .flex-2 {
-  -webkit-box-flex: 2;
-      -webkit-flex: 2;
-         -moz-flex: 2;
-          -ms-flex: 2;
-              flex: 2;
+  flex: 2;
 }
 
 .flex-3 {
-  -webkit-box-flex: 3;
-      -webkit-flex: 3;
-         -moz-flex: 3;
-          -ms-flex: 3;
-              flex: 3;
+  flex: 3;
 }
 
 .justify-start {
-  -webkit-box-pack: start;
-  -ms-flex-pack: start;
-  -moz-justify-content: flex-start;
-  -webkit-justify-content: flex-start;
   justify-content: flex-start;
 }
 
 .justified {
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  -moz-justify-content: center;
-  -webkit-justify-content: center;
   justify-content: center;
 }
 
 .justify-end {
-  -webkit-box-pack: end;
-  -ms-flex-pack: end;
-  -moz-justify-content: flex-end;
-  -webkit-justify-content: flex-end;
   justify-content: flex-end;
 }
 
 .justify-between {
-  -webkit-box-pack: justify;
-  -ms-flex-pack: justify;
-  -moz-justify-content: space-between;
-  -webkit-justify-content: space-between;
   justify-content: space-between;
 }
 
 
 .start {
-  -webkit-box-align: start;
-  -ms-flex-align: start;
-  -moz-align-items: flex-start;
-  -webkit-align-items: flex-start;
   align-items: flex-start;
 }
 
 .center {
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  -moz-align-items: center;
-  -webkit-align-items: center;
   align-items: center;
 }
 
 .centered {
-  -webkit-box-align: center;
-  -ms-flex-align: center;
-  -moz-align-items: center;
-  -webkit-align-items: center;
   align-items: center;
-  -webkit-box-pack: center;
-  -ms-flex-pack: center;
-  -moz-justify-content: center;
-  -webkit-justify-content: center;
   justify-content: center;
 }
 
 .end {
-  -webkit-box-align: end;
-  -ms-flex-align: end;
-  -moz-align-items: flex-end;
-  -webkit-align-items: flex-end;
   align-items: flex-end;
 }
 
 .self-start {
-  -webkit-align-self: start;
-     -moz-align-self: start;
-      -ms-align-self: start;
-          align-self: start;
+  align-self: start;
 }
 
 .self-end {
-  -webkit-align-self: end;
-     -moz-align-self: end;
-      -ms-align-self: end;
-          align-self: end;
+  align-self: end;
 }
 
 .two-columns,
 .three-columns,
 .wrap {
-  -ms-box-lines: multiple;
-  -webkit-flex-wrap: wrap;
-     -moz-flex-wrap: wrap;
-      -ms-flex-wrap: wrap;
-          flex-wrap: wrap;
+  flex-wrap: wrap;
 }
 
 .two-columns > .column {
diff --git a/browserlist b/browserlist
new file mode 100644
index 000000000..e83e7f60c
--- /dev/null
+++ b/browserlist
@@ -0,0 +1,5 @@
+# Browsers that we support
+
+> 1%
+Last 2 versions
+Explorer 10
\ No newline at end of file