/*
  GRID inspired by: https://github.com/basscss/basscss
*/


/*--MB Basics--*/
.table {
  display: table;
}

.block {
  display: block;
}

.block--imp {
  display: block !important;
}

.hide {
  display: none;
}

.hide--imp {
  display: hide !important;
}

.inline-block {
  display: inline-block;
}

.inline-block--imp {
  display: inline-block !important;
}

.inline {
  display: inline;
}

.fixed {
  position: fixed;
}

.relative {
  position: relative;
}

.center-text,
.centered-text {
    text-align: center;
}

.left-text {
    text-align: left;
}

.right-text {
    text-align: right;
}


/*--RESPONSIVE COND--*/
.no-float {
  float: none;
}

.lg-only,
.md-only,
.sm-only,

.tablet-and-below,
.tab-and-below,
.mobile-only {
  display: none !important;
}

.lg-and-below,
.md-and-below,
.sm-and-below,
.tab-portrait-and-below,
.tablet-portrait-and-below,
.tablet-only {
  display: none;
}

.desktop-only {
  display: inherit;
}

.not-mobile {
  /* display: inherit; */
}

.xl-only,
.tablet-landscape-and-above,
.above-tab-portrait {
  display: block;
}



/*--SPACING--*/
.large-section-block {
  margin-bottom: 150px !important;
  z-index: 9;
  position: relative;
}

.section-block {
  margin-bottom: 80px !important;
  z-index: 9;
  position: relative;
}

.threeqtr-section-block {
  margin-bottom: 40px !important;
  z-index: 9;
  position: relative;
}

.half-section-block {
  margin-bottom: 30px !important;
  z-index: 9;
  position: relative;
}

.qtr-section-block {
  margin-bottom: 15px !important;
  z-index: 9;
  position: relative;
}

.eighth-section-block {
  margin-bottom: 7px !important;
  z-index: 9;
  position: relative;
}





/*--WRAPPERS--*/
.xlarge-wrapper {
  width: 95%;
  margin:0 auto;
  padding: 0;
  position: relative;
  display: block;
  max-width: none;
}

.large-wrapper {
  width: 95%;
  margin:0 auto;
  padding: 0;
  position: relative;
  display: block;
  max-width: 1600px;
}

.wrapper {
  width: 80%;
  margin:0 auto;
  padding: 0;
  position: relative;
  display: block;
  max-width: 1265px;
}

.medium-wrapper {
  width: 65%;
  margin:0 auto;
  padding: 0;
  position: relative;
  display: block;
  max-width: 1024px;
}

.small-wrapper {
  width: 75%;
  margin:0 auto;
  padding: 0;
  position: relative;
  display: block;
  max-width: 750px;
}

.xsmall-wrapper {
  width: 70%;
  margin:0 auto;
  padding: 0;
  position: relative;
  display: block;
  max-width: 650px;
}




/* Basscss Layout */

.inline       { display: inline }
.block        { display: block }
.inline-block { display: inline-block }
.table        { display: table }
.table-cell   { display: table-cell }

.overflow-hidden { overflow: hidden }
.overflow-scroll { overflow: scroll }
.overflow-auto   { overflow: auto }

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table
}
.clearfix:after { clear: both }

.left  { float: left }
.right { float: right }

.border-box { box-sizing: border-box }




/*--GRID--*/
.col {
  float: left;
  box-sizing: border-box;
}

.col-right {
  float: right;
  box-sizing: border-box;
}

.col-1 {
  width: calc(1/12 * 100%);
}

.col-2 {
  width: calc(2/12 * 100%);
}

.col-3 {
  width: calc(3/12 * 100%);
}

.col-4 {
  width: calc(4/12 * 100%);
}

.col-5 {
  width: calc(5/12 * 100%);
}

.col-6 {
  width: calc(6/12 * 100%);
}

.col-7 {
  width: calc(7/12 * 100%);
}

.col-8 {
  width: calc(8/12 * 100%);
}

.col-9 {
  width: calc(9/12 * 100%);
}

.col-10 {
  width: calc(10/12 * 100%);
}

.col-11 {
  width: calc(11/12 * 100%);
}

.col-12 {
  width: 100%;
}



/*--PADDING--*/
.p1  { padding:        98px }
.pt1 { padding-top:    98px }
.pr1 { padding-right:  98px }
.pb1 { padding-bottom: 98px }
.pl1 { padding-left:   98px }
.py1 { padding-top:    98px; padding-bottom: 98px }
.px1 { padding-left:   98px; padding-right:  98px }

.p2  { padding:        80px }
.pt2 { padding-top:    80px }
.pr2 { padding-right:  80px }
.pb2 { padding-bottom: 80px }
.pl2 { padding-left:   80px }
.py2 { padding-top:    80px; padding-bottom: 80px }
.px2 { padding-left:   80px; padding-right:  80px }

.p3  { padding:        60px; }
.pt3 { padding-top:    60px; }
.pr3 { padding-right:  60px; }
.pb3 { padding-bottom: 60px; }
.pl3 { padding-left:   60px; }
.py3 { padding-top:    60px; padding-bottom: 60px; }
.px3 { padding-left:   60px; padding-right:  60px; }

.p4  { padding:        40px }
.pt4 { padding-top:    40px }
.pr4 { padding-right:  40px }
.pb4 { padding-bottom: 40px }
.pl4 { padding-left:   40px }
.py4 { padding-top:    40px; padding-bottom: 40px }
.px4 { padding-left:   40px; padding-right:  40px }

.p5  { padding:        20px }
.pt5 { padding-top:    20px }
.pr5 { padding-right:  20px }
.pb5 { padding-bottom: 20px }
.pl5 { padding-left:   20px }
.py5 { padding-top:    20px; padding-bottom: 20px }
.px5 { padding-left:   20px; padding-right:  20px }

.p6  { padding:        12px }
.pt6 { padding-top:    12px }
.pr6 { padding-right:  12px }
.pb6 { padding-bottom: 12px }
.pl6 { padding-left:   12px }
.py6 { padding-top:    12px; padding-bottom: 12px }
.px6 { padding-left:   12px; padding-right:  12px }

.p7  { padding:        10px }
.pt7 { padding-top:    10px }
.pr7 { padding-right:  10px }
.pb7 { padding-bottom: 10px }
.pl7 { padding-left:   10px }
.py7 { padding-top:    10px; padding-bottom: 10px }
.px7 { padding-left:   10px; padding-right:  10px }

.p0  { padding: 0 }
.pt0 { padding-top: 0 }
.pr0 { padding-right: 0 }
.pb0 { padding-bottom: 0 }
.pl0 { padding-left: 0 }
.px0 { padding-left: 0; padding-right:  0 }
.py0 { padding-top: 0;  padding-bottom: 0 }


/*--MARGIN--*/
.m1  { margin:        98px }
.mt1 { margin-top:    98px }
.mr1 { margin-right:  98px }
.mb1 { margin-bottom: 98px }
.ml1 { margin-left:   98px }
.my1 { margin-top:    98px; margin-bottom: 98px }
.mx1 { margin-left:   98px; margin-right:  98px }

.m2  { margin:        80px }
.mt2 { margin-top:    80px }
.mr2 { margin-right:  80px }
.mb2 { margin-bottom: 80px }
.ml2 { margin-left:   80px }
.my2 { margin-top:    80px; margin-bottom: 80px }
.mx2 { margin-left:   80px; margin-right:  80px }

.m3  { margin:        60px; }
.mt3 { margin-top:    60px; }
.mr3 { margin-right:  60px; }
.mb3 { margin-bottom: 60px; }
.ml3 { margin-left:   60px; }
.my3 { margin-top:    60px; margin-bottom: 60px; }
.mx3 { margin-left:   60px; margin-right:  60px; }

.m4  { margin:        40px }
.mt4 { margin-top:    40px }
.mr4 { margin-right:  40px }
.mb4 { margin-bottom: 40px }
.ml4 { margin-left:   40px }
.my4 { margin-top:    40px; margin-bottom: 40px }
.mx4 { margin-left:   40px; margin-right:  40px }

.m5  { margin:        20px }
.mt5 { margin-top:    20px }
.mr5 { margin-right:  20px }
.mb5 { margin-bottom: 20px }
.ml5 { margin-left:   20px }
.my5 { margin-top:    20px; margin-bottom: 20px }
.mx5 { margin-left:   20px; margin-right:  20px }

.m6  { margin:        12px }
.mt6 { margin-top:    12px }
.mr6 { margin-right:  12px }
.mb6 { margin-bottom: 12px }
.ml6 { margin-left:   12px }
.my6 { margin-top:    12px; margin-bottom: 12px }
.mx6 { margin-left:   12px; margin-right:  12px }

.m7  { margin:        10px }
.mt7 { margin-top:    10px }
.mr7 { margin-right:  10px }
.mb7 { margin-bottom: 10px }
.ml7 { margin-left:   10px }
.my7 { margin-top:    10px; margin-bottom: 10px }
.mx7 { margin-left:   10px; margin-right:  10px }

.m0  { margin: 0 }
.mt0 { margin-top: 0 }
.mr0 { margin-right: 0 }
.mb0 { margin-bottom: 0 }
.ml0 { margin-left: 0 }
.mx0 { margin-left: 0; margin-right:  0 }
.my0 { margin-top: 0;  margin-bottom: 0 }

.push-pr1 {
  width:  calc(100% + 98px);
}

.push-pr2 {
  width:  calc(100% + 80px);
}

.push-pr3 {
  width:  calc(100% + 60px);
}

.push-pr4 {
  width:  calc(100% + 40px);
}

.push-pr5 {
  width:  calc(100% + 20px);
}

.push-pr6 {
  width:  calc(100% + 15px);
}

.push-pr7 {
  width:  calc(100% + 10px);
}

.ratio-2point5x1 {
  aspect-ratio: 2.5 / 1;
}

.ratio-1x1 {
  aspect-ratio: 1 / 1;
}

.ratio-5x4 {
  aspect-ratio: 5 / 4;
}

.ratio-4x5 {
  aspect-ratio: 4 / 5;
}

.ratio-4x3 {
  aspect-ratio: 4 / 3;
}

.ratio-3x2 {
  aspect-ratio: 3 / 2;
}

.ratio-2x3 {
  aspect-ratio: 2 / 3;
}

.ratio-16x9 {
  aspect-ratio: 16 / 9;
}

.ratio-9x16 {
  aspect-ratio: 9 / 16;
}

.ratio-2x1 {
  aspect-ratio: 2 / 1;
}

.ratio-3x1 {
  aspect-ratio: 3 / 1;
}

.hide-last-mb5 .mb5:last-of-type {
  margin-bottom: 0 !important;
}


@media all and (max-width: 1181px) {


  .lg-and-below,
  .lg-only,
  .tablet-only,
  .tablet-and-below {
    display: block !important;
  }

  .xl-only,
  .md-only,
  .sm-only,
  .desktop-only {
    display: none !important;
  }

  .lg-no-float {
    float: none !important;
  }


  /*--SPACING--*/
  .eighth-section-block {
    margin-bottom:  !important;
  }

  .qtr-section-block {
    margin-bottom:  !important;
  }

  .half-section-block {
    margin-bottom:  !important;
  }

  .section-block {
    margin-bottom:  !important;
  }

  .threeqtr-section-block {
    margin-bottom:  !important;
  }

  .large-section-block {
    margin-bottom:  !important;
  }

  .lg-eighth-section-block {
    margin-bottom:  !important;
  }

  .lg-qtr-section-block {
    margin-bottom:  !important;
  }

  .lg-half-section-block {
    margin-bottom:  !important;
  }

  .lg-section-block {
    margin-bottom:  !important;
  }

  .lg-large-section-block {
    margin-bottom:  !important;
  }


  /*--WRAPPERS--*/
  .xsmall-wrapper {
    width: ;
    max-width: ;
  }

  .small-wrapper {
    width: ;
    max-width: ; 
  }

  .wrapper {
    width: 90%;
    max-width: 960px;
  }

  .medium-wrapper {
    width: ;
  }

  .lg-large-wrapper,
  .large-wrapper {
    width: calc(100% - 80px);
    max-width: calc(100% - 80px);
  }

  .xlarge-wrapper {
    width: ;
  }



  /*--GRID--*/
  .lg-col {
    float: left;
    box-sizing: border-box;
  }

  .lg-col-right {
    float: right;
    box-sizing: border-box;
  }

  .lg-col-1 {
    width: calc(1/12 * 100%);
  }

  .lg-col-2 {
    width: calc(2/12 * 100%);
  }

  .lg-col-3 {
    width: calc(3/12 * 100%);
  }

  .lg-col-4 {
    width: calc(4/12 * 100%);
  }

  .lg-col-5 {
    width: calc(5/12 * 100%);
  }

  .lg-col-6 {
    width: calc(6/12 * 100%);
  }

  .lg-col-7 {
    width: calc(7/12 * 100%);
  }

  .lg-col-8 {
    width: calc(8/12 * 100%);
  }

  .lg-col-9 {
    width: calc(9/12 * 100%);
  }

  .lg-col-10 {
    width: calc(10/12 * 100%);
  }

  .lg-col-11 {
    width: calc(11/12 * 100%);
  }

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


  .push-pr1 {
    width:  calc(100% + 85px);
  }

  .push-pr2 {
    width:  calc(100% + 60px);
  }

  .push-pr3 {
    width:  calc(100% + 35px);
  }

  .push-pr4 {
    width:  calc(100% + 20);
  }

  .push-pr5 {
    width:  calc(100% + 16px);
  }

  .push-pr6 {
    width:  calc(100% + 12px);
  }

  .push-pr7 {
    width:  calc(100% + 7px);
  }


  .lg-ratio-1x1 {
    aspect-ratio: 1 / 1;
  }

  .lg-ratio-5x4 {
    aspect-ratio: 5 / 4;
  }

  .lg-ratio-3x2 {
    aspect-ratio: 3 / 2;
  }

  .lg-ratio-2x3 {
    aspect-ratio: 2 / 3;
  }

  .lg-ratio-16x9 {
    aspect-ratio: 16 / 9;
  }

  .lg-ratio-9x16 {
    aspect-ratio: 9 / 16;
  }

  .lg-ratio-2x1 {
    aspect-ratio: 2 / 1;
  }

  .lg-ratio-3x1 {
    aspect-ratio: 3 / 1;
  }

  .lg-ratio-5x4 {
    aspect-ratio: 5 / 4;
  }  

}


@media all and (max-width: 821px) {


  /*--RESPONSIVE COND--*/
  
  
  .md-no-float {
    float: none !important;
  }

  .tablet-landscape-and-above {
    display: none;
  }

  .md-and-below,
  .tablet-portrait-and-below {
    display: block;
  }

  .md-only {
    display: none !important;
  }

  .xl-only
  .lg-only {
    display: block !important; 
  }





  /*--WRAPPERS--*/
  .xsmall-wrapper {
    width: ;
    max-width: ;
  }

  .small-wrapper {
    width: ;
    max-width: ; 
  }

  .wrapper {
    width: 90%;
    max-width: 960px;
  }

  .medium-wrapper {
    width: ;
  }

  .large-wrapper {
    width: ;
  }

  .xlarge-wrapper {
    width: ;
  }


  /*--GRID--*/
  .md-col {
    float: left;
    box-sizing: border-box;
  }

  .md-col-right {
    float: right;
    box-sizing: border-box;
  }

  .md-col-1 {
    width: calc(1/12 * 100%);
  }

  .md-col-2 {
    width: calc(2/12 * 100%);
  }

  .md-col-3 {
    width: calc(3/12 * 100%);
  }

  .md-col-4 {
    width: calc(4/12 * 100%);
  }

  .md-col-5 {
    width: calc(5/12 * 100%);
  }

  .md-col-6 {
    width: calc(6/12 * 100%);
  }

  .md-col-7 {
    width: calc(7/12 * 100%);
  }

  .md-col-8 {
    width: calc(8/12 * 100%);
  }

  .md-col-9 {
    width: calc(9/12 * 100%);
  }

  .md-col-10 {
    width: calc(10/12 * 100%);
  }

  .md-col-11 {
    width: calc(11/12 * 100%);
  }

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



  .md-ratio-1x1 {
    aspect-ratio: 1 / 1;
  }

  .md-ratio-5x4 {
    aspect-ratio: 5 / 4;
  }

  .md-ratio-3x2 {
    aspect-ratio: 3 / 2;
  }

  .md-ratio-2x3 {
    aspect-ratio: 2 / 3;
  }

  .md-ratio-16x9 {
    aspect-ratio: 16 / 9;
  }

  .md-ratio-9x16 {
    aspect-ratio: 9 / 16;
  }

  .md-ratio-2x1 {
    aspect-ratio: 2 / 1;
  }

  .md-ratio-3x1 {
    aspect-ratio: 3 / 1;
  }

  .md-ratio-5x4 {
    aspect-ratio: 5 / 4;
  }  
}



@media all and (max-width: 480px) {


  /*--RESPONSIVE COND--*/
  .sm-block,
  .sm-only,
  .sm-and-below,
  .mobile-only {
    display: block !important;
  }

  .lg-only,
  .md-only,
  .lg-and-below,
  .md-and-below,

  .not-mobile,
  .tablet-only,
  .above-tab-portrait,
  .tablet-only,
  .desktop-only {
    display: none !important;
  }

  .sm-no-float {
    float: none !important;
  }

  .sm-center-text {
    text-align: center;
  }

  .sm-left-text {
    text-align: left;
  }

  .sm-right-text {
    text-align: right;
  }




  /*--WRAPPERS--*/
  .xsmall-wrapper {
    width:calc(100% - 40px);
    max-width:calc(100% - 40px);
  }

  .small-wrapper {
    width:calc(100% - 40px);
    max-width:calc(100% - 40px);
  }

  .wrapper {
    width:calc(100% - 40px);
    max-width:calc(100% - 40px);
  }

  .medium-wrapper {
    width:calc(100% - 40px);
    max-width:calc(100% - 40px);
  }

  .large-wrapper {
    width:calc(100% - 40px);
    max-width:calc(100% - 40px);
  }

  .xlarge-wrapper {
    width:calc(100% - 40px);
    max-width:calc(100% - 40px);
  }




  /*--GRID--*/
  .sm-col {
    float: left;
    box-sizing: border-box;
  }

  .sm-col-right {
    float: right;
    box-sizing: border-box;
  }

  .sm-col-1 {
    width: calc(1/12 * 100%);
  }

  .sm-col-2 {
    width: calc(2/12 * 100%);
  }

  .sm-col-3 {
    width: calc(3/12 * 100%);
  }

  .sm-col-4 {
    width: calc(4/12 * 100%);
  }

  .sm-col-5 {
    width: calc(5/12 * 100%);
  }

  .sm-col-6 {
    width: calc(6/12 * 100%);
  }

  .sm-col-7 {
    width: calc(7/12 * 100%);
  }

  .sm-col-8 {
    width: calc(8/12 * 100%);
  }

  .sm-col-9 {
    width: calc(9/12 * 100%);
  }

  .sm-col-10 {
    width: calc(10/12 * 100%);
  }

  .sm-col-11 {
    width: calc(11/12 * 100%);
  }

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


  /*--PADDING--*/
  .p1  { padding:        55px }
  .pt1 { padding-top:    55px }
  .pr1 { padding-right:  55px }
  .pb1 { padding-bottom: 55px }
  .pl1 { padding-left:   55px }
  .py1 { padding-top:    55px; padding-bottom: 55px }
  .px1 { padding-left:   55px; padding-right:  55px }

  .p2  { padding:        40px }
  .pt2 { padding-top:    40px }
  .pr2 { padding-right:  40px }
  .pb2 { padding-bottom: 40px }
  .pl2 { padding-left:   40px }
  .py2 { padding-top:    40px; padding-bottom: 40px }
  .px2 { padding-left:   40px; padding-right:  40px }

  .p3  { padding:        40px; }
  .pt3 { padding-top:    40px; }
  .pr3 { padding-right:  40px; }
  .pb3 { padding-bottom: 40px; }
  .pl3 { padding-left:   40px; }
  .py3 { padding-top:    40px; padding-bottom: 40px; }
  .px3 { padding-left:   40px; padding-right:  40px; }

  .p4  { padding:        20px }
  .pt4 { padding-top:    20px }
  .pr4 { padding-right:  20px }
  .pb4 { padding-bottom: 20px }
  .pl4 { padding-left:   20px }
  .py4 { padding-top:    20px; padding-bottom: 20px }
  .px4 { padding-left:   20px; padding-right:  20px }

  .p5  { padding:        18px }
  .pt5 { padding-top:    18px }
  .pr5 { padding-right:  18px }
  .pb5 { padding-bottom: 18px }
  .pl5 { padding-left:   18px }
  .py5 { padding-top:    18px; padding-bottom: 18px }
  .px5 { padding-left:   18px; padding-right:  18px }

  .p6  { padding:        10px }
  .pt6 { padding-top:    10px }
  .pr6 { padding-right:  10px }
  .pb6 { padding-bottom: 10px }
  .pl6 { padding-left:   10px }
  .py6 { padding-top:    10px; padding-bottom: 10px }
  .px6 { padding-left:   10px; padding-right:  10px }  

  .p7  { padding:        8px }
  .pt7 { padding-top:    8px }
  .pr7 { padding-right:  8px }
  .pb7 { padding-bottom: 8px }
  .pl7 { padding-left:   8px }
  .py7 { padding-top:    8px; padding-bottom: 8px }
  .px7 { padding-left:   8px; padding-right:  8px }    

  .p0  { padding: 0 }
  .pt0 { padding-top: 0 }
  .pr0 { padding-right: 0 }
  .pb0 { padding-bottom: 0 }
  .pl0 { padding-left: 0 }
  .px0 { padding-left: 0; padding-right:  0 }
  .py0 { padding-top: 0;  padding-bottom: 0 }


  .sm-p1  { padding:        55px }
  .sm-pt1 { padding-top:    55px }
  .sm-pr1 { padding-right:  55px }
  .sm-pb1 { padding-bottom: 55px }
  .sm-pl1 { padding-left:   55px }
  .sm-py1 { padding-top:    55px; padding-bottom: 55px }
  .sm-px1 { padding-left:   55px; padding-right:  55px }

  .sm-p2  { padding:        40px }
  .sm-pt2 { padding-top:    40px }
  .sm-pr2 { padding-right:  40px }
  .sm-pb2 { padding-bottom: 40px }
  .sm-pl2 { padding-left:   40px }
  .sm-py2 { padding-top:    40px; padding-bottom: 40px }
  .sm-px2 { padding-left:   40px; padding-right:  40px }

  .sm-p3  { padding:        40px; }
  .sm-pt3 { padding-top:    40px; }
  .sm-pr3 { padding-right:  40px; }
  .sm-pb3 { padding-bottom: 40px; }
  .sm-pl3 { padding-left:   40px; }
  .sm-py3 { padding-top:    40px; padding-bottom: 40px; }
  .sm-px3 { padding-left:   40px; padding-right:  40px; }

  .sm-p4  { padding:        20px }
  .sm-pt4 { padding-top:    20px }
  .sm-pr4 { padding-right:  20px }
  .sm-pb4 { padding-bottom: 20px }
  .sm-pl4 { padding-left:   20px }
  .sm-py4 { padding-top:    20px; padding-bottom: 20px }
  .sm-px4 { padding-left:   20px; padding-right:  20px }

  .sm-p5  { padding:        18px }
  .sm-pt5 { padding-top:    18px }
  .sm-pr5 { padding-right:  18px }
  .sm-pb5 { padding-bottom: 18px }
  .sm-pl5 { padding-left:   18px }
  .sm-py5 { padding-top:    18px; padding-bottom: 18px }
  .sm-px5 { padding-left:   18px; padding-right:  18px }

  .sm-p6  { padding:        10px }
  .sm-pt6 { padding-top:    10px }
  .sm-pr6 { padding-right:  10px }
  .sm-pb6 { padding-bottom: 10px }
  .sm-pl6 { padding-left:   10px }
  .sm-py6 { padding-top:    10px; padding-bottom: 10px }
  .sm-px6 { padding-left:   10px; padding-right:  10px }  

  .sm-p7  { padding:        8px }
  .sm-pt7 { padding-top:    8px }
  .sm-pr7 { padding-right:  8px }
  .sm-pb7 { padding-bottom: 8px }
  .sm-pl7 { padding-left:   8px }
  .sm-py7 { padding-top:    8px; padding-bottom: 8px }
  .sm-px7 { padding-left:   8px; padding-right:  8px }    

  .sm-p0  { padding: 0 }
  .sm-pt0 { padding-top: 0 }
  .sm-pr0 { padding-right: 0 }
  .sm-pb0 { padding-bottom: 0 }
  .sm-pl0 { padding-left: 0 }
  .sm-px0 { padding-left: 0; padding-right:  0 }
  .sm-py0 { padding-top: 0;  padding-bottom: 0 }


  /*--MARGIN--*/
  .m1  { margin:        55px }
  .mt1 { margin-top:    55px }
  .mr1 { margin-right:  55px }
  .mb1 { margin-bottom: 55px }
  .ml1 { margin-left:   55px }
  .my1 { margin-top:    55px; margin-bottom: 55px }
  .mx1 { margin-left:   55px; margin-right:  55px }

  .m2  { margin:        40px }
  .mt2 { margin-top:    40px }
  .mr2 { margin-right:  40px }
  .mb2 { margin-bottom: 40px }
  .ml2 { margin-left:   40px }
  .my2 { margin-top:    40px; margin-bottom: 40px }
  .mx2 { margin-left:   40px; margin-right:  40px }

  .m3  { margin:        40px; }
  .mt3 { margin-top:    40px; }
  .mr3 { margin-right:  40px; }
  .mb3 { margin-bottom: 40px; }
  .ml3 { margin-left:   40px; }
  .my3 { margin-top:    40px; margin-bottom: 40px; }
  .mx3 { margin-left:   40px; margin-right:  40px; }

  .m4  { margin:        20px }
  .mt4 { margin-top:    20px }
  .mr4 { margin-right:  20px }
  .mb4 { margin-bottom: 20px }
  .ml4 { margin-left:   20px }
  .my4 { margin-top:    20px; margin-bottom: 20px }
  .mx4 { margin-left:   20px; margin-right:  20px }

  .m5  { margin:        18px }
  .mt5 { margin-top:    18px }
  .mr5 { margin-right:  18px }
  .mb5 { margin-bottom: 18px }
  .ml5 { margin-left:   18px }
  .my5 { margin-top:    18px; margin-bottom: 18px }
  .mx5 { margin-left:   18px; margin-right:  18px }

  .m6  { margin:        10px }
  .mt6 { margin-top:    10px }
  .mr6 { margin-right:  10px }
  .mb6 { margin-bottom: 10px }
  .ml6 { margin-left:   10px }
  .my6 { margin-top:    10px; margin-bottom: 10px }
  .mx6 { margin-left:   10px; margin-right:  10px }  

  .m7  { margin:        8px }
  .mt7 { margin-top:    8px }
  .mr7 { margin-right:  8px }
  .mb7 { margin-bottom: 8px }
  .ml7 { margin-left:   8px }
  .my7 { margin-top:    8px; margin-bottom: 8px }
  .mx7 { margin-left:   8px; margin-right:  8px }    

  .m0  { margin: 0 }
  .mt0 { margin-top: 0 }
  .mr0 { margin-right: 0 }
  .mb0 { margin-bottom: 0 }
  .ml0 { margin-left: 0 }
  .mx0 { margin-left: 0; margin-right:  0 }
  .my0 { margin-top: 0;  margin-bottom: 0 }


  .sm-m1  { margin:        55px }
  .sm-mt1 { margin-top:    55px }
  .sm-mr1 { margin-right:  55px }
  .sm-mb1 { margin-bottom: 55px }
  .sm-ml1 { margin-left:   55px }
  .sm-my1 { margin-top:    55px; margin-bottom: 55px }
  .sm-mx1 { margin-left:   55px; margin-right:  55px }

  .sm-m2  { margin:        40px }
  .sm-mt2 { margin-top:    40px }
  .sm-mr2 { margin-right:  40px }
  .sm-mb2 { margin-bottom: 40px }
  .sm-ml2 { margin-left:   40px }
  .sm-my2 { margin-top:    40px; margin-bottom: 40px }
  .sm-mx2 { margin-left:   40px; margin-right:  40px }

  .sm-m3  { margin:        40px; }
  .sm-mt3 { margin-top:    40px; }
  .sm-mr3 { margin-right:  40px; }
  .sm-mb3 { margin-bottom: 40px; }
  .sm-ml3 { margin-left:   40px; }
  .sm-my3 { margin-top:    40px; margin-bottom: 40px; }
  .sm-mx3 { margin-left:   40px; margin-right:  40px; }

  .sm-m4  { margin:        20px }
  .sm-mt4 { margin-top:    20px }
  .sm-mr4 { margin-right:  20px }
  .sm-mb4 { margin-bottom: 20px }
  .sm-ml4 { margin-left:   20px }
  .sm-my4 { margin-top:    20px; margin-bottom: 20px }
  .sm-mx4 { margin-left:   20px; margin-right:  20px }

  .sm-m5  { margin:        18px }
  .sm-mt5 { margin-top:    18px }
  .sm-mr5 { margin-right:  18px }
  .sm-mb5 { margin-bottom: 18px }
  .sm-ml5 { margin-left:   18px }
  .sm-my5 { margin-top:    18px; margin-bottom: 18px }
  .sm-mx5 { margin-left:   18px; margin-right:  18px }

  .sm-m6  { margin:        10px }
  .sm-mt6 { margin-top:    10px }
  .sm-mr6 { margin-right:  10px }
  .sm-mb6 { margin-bottom: 10px }
  .sm-ml6 { margin-left:   10px }
  .sm-my6 { margin-top:    10px; margin-bottom: 10px }
  .sm-mx6 { margin-left:   10px; margin-right:  10px }  

  .sm-m7  { margin:        8px }
  .sm-mt7 { margin-top:    8px }
  .sm-mr7 { margin-right:  8px }
  .sm-mb7 { margin-bottom: 8px }
  .sm-ml7 { margin-left:   8px }
  .sm-my7 { margin-top:    8px; margin-bottom: 8px }
  .sm-mx7 { margin-left:   8px; margin-right:  8px }    

  .sm-m0  { margin: 0 }
  .sm-mt0 { margin-top: 0 }
  .sm-mr0 { margin-right: 0 }
  .sm-mb0 { margin-bottom: 0 }
  .sm-ml0 { margin-left: 0 }
  .sm-mx0 { margin-left: 0; margin-right:  0 }
  .sm-my0 { margin-top: 0;  margin-bottom: 0 }

  .push-pr1:not(.mobile) {
    width:  calc(100% + 55px);
  }

  .push-pr2:not(.mobile) {
    width:  calc(100% + 40px);
  }

  .push-pr3:not(.mobile) {
    width:  calc(100% + 40px);
  }

  .push-pr4:not(.mobile) {
    width:  calc(100% + 20px);
  }

  .push-pr5:not(.mobile) {
    width:  calc(100% + 18px);
  }

  .push-pr6:not(.mobile) {
    width:  calc(100% + 10px);
  }

  .push-pr7:not(.mobile) {
    width:  calc(100% + 8px);
  }    

  .push-pr1,
  .push-pr2,
  .push-pr3,
  .push-pr4,
  .push-pr5 {
    width:  100%;
  }

  .sm-ratio-1x1 {
    aspect-ratio: 1 / 1;
  }

  .sm-ratio-5x4 {
    aspect-ratio: 5 / 4;
  }

  .sm-ratio-3x2 {
    aspect-ratio: 3 / 2;
  }

  .sm-ratio-2x3 {
    aspect-ratio: 2 / 3;
  }

  .sm-ratio-16x9 {
    aspect-ratio: 16 / 9;
  }

  .sm-ratio-9x16 {
    aspect-ratio: 9 / 16;
  }

  .sm-ratio-2x1 {
    aspect-ratio: 2 / 1;
  }

  .sm-ratio-3x1 {
    aspect-ratio: 3 / 1;
  }

  .sm-ratio-5x4 {
    aspect-ratio: 5 / 4;
  }  
  
}