.row {
  display: flex;  
  flex-flow: wrap;  
}
.inline-row {
  display: inline-flex !important;
}

.row-column {
  flex-direction: column;
}
.flex {
  display: flex;
}
.flex-row {
  flex-direction: row;
}
.flex-column {
  flex-direction: column;
}
.justify-end, .jc-end {justify-content: end; justify-content: flex-end; }
.justify-center, .c-between {justify-content: center;}
.justify-start {justify-content: flex-start; justify-content:start;}
.jc-between,.c-between {justify-content: space-between;}
.c-evenly {justify-content: space-evenly;}


.align-center, .i-center {
  align-items: center;
}
.justify-center {
  justify-content: center;
}


.col-s-1, .col-m-1, .col-l-1, .col-s-2, .col-m-2, .col-l-2, .col-s-3, .col-m-3, .col-l-3, .col-s-4, .col-m-4, .col-l-4, .col-s-5, .col-m-5, .col-l-5, .col-s-6, .col-m-6, .col-l-6, .col-s-7, .col-m-7, .col-l-7, .col-s-8, .col-m-8, .col-l-8, .col-s-9, .col-m-9, .col-l-9, .col-s-10, .col-m-10, .col-l-10, .col-s-11, .col-m-11, .col-l-11, .col-s-12, .col-m-12, .col-l-12 {
  padding-left: .8rem;
  padding-right: .8rem;
  max-width: 100%;
  
}
.col-center {margin: 0 auto;}
/*------------------------------------*\
    $Grid
\*------------------------------------*/
.col-s-center {
  margin: 0 auto;
}

.col-s-push-0 {
  margin-left: 0%; }

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

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

.col-s-1 {
  width: 8.33333%; }
.col-s-push-1 {
  margin-left: 8.33333%; }

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

.col-s-pull-1 {
  margin-right: 8.33333%; }

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

.col-s-push-2 {
  margin-left: 16.66667%; }

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

.col-s-pull-2 {
  margin-right: 16.66667%; }

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

.col-s-push-3 {
  margin-left: 25%; }

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

.col-s-pull-3 {
  margin-right: 25%; }

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

.col-s-push-4 {
  margin-left: 33.33333%; }

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

.col-s-pull-4 {
  margin-right: 33.33333%; }

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

.col-s-push-5 {
  margin-left: 41.66667%; }

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

.col-s-pull-5 {
  margin-right: 41.66667%; }

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

.col-s-push-6 {
  margin-left: 50%; }

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

.col-s-pull-6 {
  margin-right: 50%; }

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

.col-s-push-7 {
  margin-left: 58.33333%; }

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

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

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

.col-s-push-8 {
  margin-left: 66.66667%; }

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

.col-s-pull-8 {
  margin-right: 66.66667%; }

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

.col-s-push-9 {
 margin-left: 75%; }

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

.col-s-pull-9 {
  margin-right: 75%; }

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

.col-s-push-10 {
  margin-left: 83.33333%; }

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

.col-s-pull-10 {
  margin-right: 83.33333%; }

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

.col-s-push-11 {
  left: 91.66667%; }

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

.col-s-pull-11 {
  margin-right: 91.66667%; }

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

.col-s-push-12 {
  margin-left: 100%; }

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

.col-s-pull-12 {
  margin-right: 100%; }
  
.m-show {
  display: none; 
}

.l-show {
  display: none; }

/*------------------------------------*\
    $RESPONSIVE
\*------------------------------------*/
/* Medium Screen */
@media only screen and (min-width: 1024px) {

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

  .m-hide {
    display: none; }

  .m-show {
    display: block; }

  
}
/* Large Screen */
@media only screen and (min-width: 1280px)
{   
    .row > div.col-l-center{margin:0 auto;}
    .row > div.col-l-push-0{left:0%;}
    .row > div.col-l-offset-0{margin-left:0%;}
    .row > div.col-l-pull-0{margin-right:0%;}
    .row > div.col-l-1{width:8.33333%;}
    .row > div.col-l-push-1{left:8.33333%;}
    .row > div.col-l-offset-1{margin-left:8.33333%;}
    .row > div.col-l-pull-1{margin-right:8.33333%;}
    .row > div.col-l-2{width:16.66667%;}
    .row > div.col-l-push-2{left:16.66667%;}
    .row > div.col-l-offset-2{margin-left:16.66667%;}
    .row > div.col-l-pull-2{margin-right:16.66667%;}
    .row > div.col-l-3{width:25%;}
    .row > div.col-l-push-3{margin-left:25%;}
    .row > div.col-l-offset-3{margin-left:25%;}
    .row > div.col-l-pull-3{margin-right:25%;}
    .row > div.col-l-4{width:33.33333%;}
    .row > div.col-l-push-4{left:33.33333%;}
    .row > div.col-l-offset-4{margin-left:33.33333%;}
    .row > div.col-l-pull-4{margin-right:33.33333%;}
    .row > div.col-l-5{width:41.66667%;}
    .row > div.col-l-push-5{left:41.66667%;}
    .row > div.col-l-offset-5{margin-left:41.66667%;}
    .row > div.col-l-pull-5{margin-right:41.66667%;}
    .row > div.col-l-6{width:50%;}
    .row > div.col-l-push-6{margin-left:50%;}
    .row > div.col-l-offset-6{margin-left:50%;}
    .row > div.col-l-pull-6{margin-right:50%;}
    .row > div.col-l-7{width:58.33333%;}
    .row > div.col-l-push-7{margin-left:58.33333%;}
    .row > div.col-l-offset-7{margin-left:58.33333%;}
    .row > div.col-l-pull-7{margin-right:58.33333%;}
    .row > div.col-l-8{width:66.66667%;}
    .row > div.col-l-push-8{margin-left:66.66667%;}
    .row > div.col-l-offset-8{margin-left:66.66667%;}
    .row > div.col-l-pull-8{margin-right:66.66667%;}
    .row > div.col-l-9{width:75%;}
    .row > div.col-l-push-9{margin-left:75%;}
    .row > div.col-l-offset-9{margin-left:75%;}
    .row > div.col-l-pull-9{margin-right:75%;}
    .row > div.col-l-10{width:83.33333%;}
    .row > div.col-l-push-10{margin-left:83.33333%;}
    .row > div.col-l-offset-10{margin-left:83.33333%;}
    .row > div.col-l-pull-10{margin-right:83.33333%;}
    .row > div.col-l-11{width:91.66667%;}
    .row > div.col-l-push-11{margin-left:91.66667%;}
    .row > div.col-l-offset-11{margin-left:91.66667%;}
    .row > div.col-l-pull-11{margin-right:91.66667%;}
    .row > div.col-l-12{width:100%;}
    .row > div.col-l-push-12{margin-left:100%;}
    .row > div.col-l-offset-12{margin-left:100%;}
    .row > div.col-l-pull-12{margin-right:100%;}  
}
@media only screen and (min-width: 1920px)
{   
    .row > div.col-xl-center{margin:0 auto;}
    .row > div.col-xl-push-0{left:0%;}
    .row > div.col-xl-offset-0{margin-left:0%;}
    .row > div.col-xl-pull-0{margin-right:0%;}
    .row > div.col-xl-1{width:8.33333%;}
    .row > div.col-xl-push-1{left:8.33333%;}
    .row > div.col-xl-offset-1{margin-left:8.33333%;}
    .row > div.col-xl-pull-1{margin-right:8.33333%;}
    .row > div.col-xl-2{width:16.66667%;}
    .row > div.col-xl-push-2{left:16.66667%;}
    .row > div.col-xl-offset-2{margin-left:16.66667%;}
    .row > div.col-xl-pull-2{margin-right:16.66667%;}
    .row > div.col-xl-3{width:25%;}
    .row > div.col-xl-push-3{margin-left:25%;}
    .row > div.col-xl-offset-3{margin-left:25%;}
    .row > div.col-xl-pull-3{margin-right:25%;}
    .row > div.col-xl-4{width:33.33333%;}
    .row > div.col-xl-push-4{left:33.33333%;}
    .row > div.col-xl-offset-4{margin-left:33.33333%;}
    .row > div.col-xl-pull-4{margin-right:33.33333%;}
    .row > div.col-xl-5{width:41.66667%;}
    .row > div.col-xl-push-5{left:41.66667%;}
    .row > div.col-xl-offset-5{margin-left:41.66667%;}
    .row > div.col-xl-pull-5{margin-right:41.66667%;}
    .row > div.col-xl-6{width:50%;}
    .row > div.col-xl-push-6{margin-left:50%;}
    .row > div.col-xl-offset-6{margin-left:50%;}
    .row > div.col-xl-pull-6{margin-right:50%;}
    .row > div.col-xl-7{width:58.33333%;}
    .row > div.col-xl-push-7{margin-left:58.33333%;}
    .row > div.col-xl-offset-7{margin-left:58.33333%;}
    .row > div.col-xl-pull-7{margin-right:58.33333%;}
    .row > div.col-xl-8{width:66.66667%;}
    .row > div.col-xl-push-8{margin-left:66.66667%;}
    .row > div.col-xl-offset-8{margin-left:66.66667%;}
    .row > div.col-xl-pull-8{margin-right:66.66667%;}
    .row > div.col-xl-9{width:75%;}
    .row > div.col-xl-push-9{margin-left:75%;}
    .row > div.col-xl-offset-9{margin-left:75%;}
    .row > div.col-xl-pull-9{margin-right:75%;}
    .row > div.col-xl-10{width:83.33333%;}
    .row > div.col-xl-push-10{margin-left:83.33333%;}
    .row > div.col-xl-offset-10{margin-left:83.33333%;}
    .row > div.col-xl-pull-10{margin-right:83.33333%;}
    .row > div.col-xl-11{width:91.66667%;}
    .row > div.col-xl-push-11{margin-left:91.66667%;}
    .row > div.col-xl-offset-11{margin-left:91.66667%;}
    .row > div.col-xl-pull-11{margin-right:91.66667%;}
    .row > div.col-xl-12{width:100%;}
    .row > div.col-xl-push-12{margin-left:100%;}
    .row > div.col-xl-offset-12{margin-left:100%;}
    .row > div.col-xl-pull-12{margin-right:100%;}  
}

.no-gutter{margin:0;padding: 0;}
.gutter-lft-off {padding-left: 0;}
.gutter-rgt-off {padding-right: 0;}
.col-s-center.no-gutter, .col-m-center.no-gutter, .col-l-center.no-gutter{margin:0 auto 0;}