responcive: flag collection in content left

web/themes/custom/materiotheme/assets/dist/main.css

@@ -19316,6 +19316,9 @@ main[role="main"] {
     main[role="main"] > .scroller > .wrapper {
       display: flex;
       flex-direction: row-reverse; }
+      @media (max-width: 436px) {
+        main[role="main"] > .scroller > .wrapper {
+          display: block; } }
       main[role="main"] > .scroller > .wrapper #content-left {
         flex-basis: 205px;
         flex-shrink: 0; }
@@ -19323,6 +19326,9 @@ main[role="main"] {
           width: 100%;
           box-sizing: border-box;
           padding: 0.5em 13px; }
+        @media (max-width: 436px) {
+          main[role="main"] > .scroller > .wrapper #content-left {
+            padding-right: 13px; } }
       main[role="main"] > .scroller > .wrapper #content-center {
         flex-basis: 110%; }
 
@@ -19709,6 +19715,12 @@ aside.messages {
     #content-left .flag-collection > header .mdi-close {
       cursor: pointer;
       align-self: flex-end; }
+  @media (max-width: 436px) {
+    #content-left .flag-collection > ul {
+      display: flex;
+      flex-direction: row;
+      flex-wrap: wrap;
+      justify-content: space-between; } }
   #content-left .flag-collection > ul > li {
     margin: 0 0 13px 0;
     padding: 0; }

web/themes/custom/materiotheme/assets/styles/base/_layout.scss

@@ -157,6 +157,9 @@ main[role="main"]{
       @extend %grided-width;
       display: flex;
       flex-direction: row-reverse;
+      @include col-mediaquery-max(2){
+        display: block;
+      }
       #content-left{
         flex-basis: $column_width;
         flex-shrink: 0;
@@ -166,6 +169,9 @@ main[role="main"]{
           box-sizing: border-box;
           padding:0.5em $column_goutiere;
         }
+        @include col-mediaquery-max(2){
+          padding-right: $column_goutiere;
+        }
       }
       #content-center{
         flex-basis: 110%;

web/themes/custom/materiotheme/assets/styles/main.scss

@@ -573,7 +573,14 @@ aside.messages{
       }
     }
     >ul{
+			@include col-mediaquery-max(2){
+				display:flex;
+				flex-direction: row;
+				flex-wrap: wrap;
+				justify-content: space-between;
+			}
       >li{
+
         margin:0 0 $column_goutiere 0;
         padding:0;
         article.card.minicard{
@@ -601,6 +608,7 @@ aside.messages{
             }
           }
         }
+
       }
     }
   }