.row {
    display: flex;
    flex-flow: wrap;
}
/*------------------------------------*\
    $RESPONSIVE
\*------------------------------------*/
/* Medium Screen */
@media only screen and (min-width: 640px) {

  .col-m-center {
    margin: 0 auto;
     }

  .col-m-push-0 {
    margin-right: 0%; }

  .col-m-offset-0 {
    margin-left: 0%; }

  .col-m-pull-0 {
    left: 0%; }

  .col-m-1 {
    width: 8.33333%; }

  .col-m-push-1 {
    margin-right: 8.33333%; }

  .col-m-offset-1 {
    margin-left: 8.33333%; }

  .col-m-pull-1 {
    left: 8.33333%; }

  .col-m-2 {
    width: 16.66667%; }

  .col-m-push-2 {
    margin-right: 16.66667%; }

  .col-m-offset-2 {
    margin-left: 16.66667%; }

  .col-m-pull-2 {
    left: 16.66667%; }

  .col-m-3 {
    width: 25%; }

  .col-m-push-3 {
    margin-right: 25%; }

  .col-m-offset-3 {
    margin-left: 25%; }

  .col-m-pull-3 {
    left: 25%; }

  .col-m-4 {
    width: 33.33333%; }

  .col-m-push-4 {
    margin-right: 33.33333%; }

  .col-m-offset-4 {
    margin-left: 33.33333%; }

  .col-m-pull-4 {
    left: 33.33333%; }

  .col-m-5 {
    width: 41.66667%; }

  .col-m-push-5 {
    margin-right: 41.66667%; }

  .col-m-offset-5 {
    margin-left: 41.66667%; }

  .col-m-pull-5 {
    left: 41.66667%; }

  .col-m-6 {
    width: 50%; }

  .col-m-push-6 {
    margin-right: 50%; }

  .col-m-offset-6 {
    margin-left: 50%; }

  .col-m-pull-6 {
    left: 50%; }

  .col-m-7 {
    width: 58.33333%; }

  .col-m-push-7 {
    margin-right: 58.33333%; }

  .col-m-offset-7 {
    margin-left: 58.33333%; }

  .col-m-pull-7 {
    right: 58.33333%; }

  .col-m-8 {
    width: 66.66667%; }

  .col-m-push-8 {
    margin-right: 66.66667%; }

  .col-m-offset-8 {
    margin-left: 66.66667%; }

  .col-m-pull-8 {
    left: 66.66667%; }

  .col-m-9 {
    width: 75%; }

  .col-m-push-9 {
    margin-right: 75%; }

  .col-m-offset-9 {
    margin-left: 75%; }

  .col-m-pull-9 {
    left: 75%; }

  .col-m-10 {
    width: 83.33333%; }

  .col-m-push-10 {
    margin-right: 83.33333%; }

  .col-m-offset-10 {
    margin-left: 83.33333%; }

  .col-m-pull-10 {
    left: 83.33333%; }

  .col-m-11 {
    width: 91.66667%; }

  .col-m-push-11 {
    margin-right: 91.66667%; }

  .col-m-offset-11 {
    margin-left: 91.66667%; }

  .col-m-pull-11 {
    left: 91.66667%; }

  .col-m-12 {
    width: 100%; }

  .col-m-push-12 {
    margin-right: 100%; }

  .col-m-offset-12 {
    margin-left: 100%; }

  .col-m-pull-12 {
    left: 100%; }

  .m-hide {
    display: none; }

  .m-show {
    display: block; }

  
}
/* Large Screen */
@media only screen and (min-width: 1200px) {
  .col-l-center {
    margin: 0 auto;
     }

  .col-l-push-0 {
    margin-right: 0%; }

  .col-l-offset-0 {
    margin-left: 0%; }

  .col-l-pull-0 {
    left: 0%; }

  .col-l-1 {
    width: 8.33333%; }

  .col-l-push-1 {
    margin-right: 8.33333%; }

  .col-l-offset-1 {
    margin-left: 8.33333%; }

  .col-l-pull-1 {
    left: 8.33333%; }

  .col-l-2 {
    width: 16.66667%; }

  .col-l-push-2 {
    margin-right: 16.66667%; }

  .col-l-offset-2 {
    margin-left: 16.66667%; }

  .col-l-pull-2 {
    left: 16.66667%; }

  .col-l-3 {
    width: 25%; }

  .col-l-push-3 {
    margin-right: 25%; }

  .col-l-offset-3 {
    margin-left: 25%; }

  .col-l-pull-3 {
    left: 25%; }

  .col-l-4 {
    width: 33.33333%; }

  .col-l-push-4 {
    margin-right: 33.33333%; }

  .col-l-offset-4 {
    margin-left: 33.33333%; }

  .col-l-pull-4 {
    left: 33.33333%; }

  .col-l-5 {
    width: 41.66667%; }

  .col-l-push-5 {
    margin-right: 41.66667%; }

  .col-l-offset-5 {
    margin-left: 41.66667%; }

  .col-l-pull-5 {
    left: 41.66667%; }

  .col-l-6 {
    width: 50%; }

  .col-l-push-6 {
    margin-right: 50%; }

  .col-l-offset-6 {
    margin-left: 50%; }

  .col-l-pull-6 {
    left: 50%; }

  .col-l-7 {
    width: 58.33333%; }

  .col-l-push-7 {
    margin-right: 58.33333%; }

  .col-l-offset-7 {
    margin-left: 58.33333%; }

  .col-l-pull-7 {
    left: 58.33333%; }

  .col-l-8 {
    width: 66.66667%; }

  .col-l-push-8 {
    margin-right: 66.66667%; }

  .col-l-offset-8 {
    margin-left: 66.66667%; }

  .col-l-pull-8 {
    left: 66.66667%; }

  .col-l-9 {
    width: 75%; }

  .col-l-push-9 {
    margin-right: 75%; }

  .col-l-offset-9 {
    margin-left: 75%; }

  .col-l-pull-9 {
    left: 75%; }

  .col-l-10 {
    width: 83.33333%; }

  .col-l-push-10 {
    margin-right: 83.33333%; }

  .col-l-offset-10 {
    margin-left: 83.33333%; }

  .col-l-pull-10 {
    left: 83.33333%; }

  .col-l-11 {
    width: 91.66667%; }

  .col-l-push-11 {
    margin-right: 91.66667%; }

  .col-l-offset-11 {
    margin-left: 91.66667%; }

  .col-l-pull-11 {
    left: 91.66667%; }

  .col-l-12 {
    width: 100%; }

  .col-l-push-12 {
    margin-right: 100%; }

  .col-l-offset-12 {
    margin-left: 100%; }

  .col-l-pull-12 {
    left: 100%; }

  .l-hide {
    display: none; }
  
  .l-show {
    display: block; }
}