body:not(.mobile-app) {
  /* main content container */
  /* NOTE: adding static values for exact device widths
        device guide (max-width, large to small):
            712     =>      Galaxy Tab S4
            540     =>      Surface Duo
            414     =>      iPhone Plus 6 / 7 / 8 / XR
            412     =>      Galaxy S20 / A51 / A71
            411     =>      Pixel 2 / 2XL
            393     =>      Pixel 3 / 4 / 5
            390     =>      iPhone 12 Pro
            384     =>      LG Optimus L70
            375     =>      iPhone SE / 6 / 7 / 8 / X
            360     =>      Galaxy Note II / Note 3 / S III / S8 / S5
            353     =>      Pixel 4
            320     =>      iPhone 4 / 5/SE, Galaxy S9+
            280     =>      Galaxy Fold
    */
  /* >>>>>> NOTE: design gets weird between 280 and 320, but I don't believe there are any common devices with that portrait width so I'm ignoring it for now <<<<<< */
}
@media screen and (min-width: 1390px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 921px;
  }
}
@media screen and (max-width: 1389px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 822px;
  }
}
@media screen and (max-width: 1211px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 722px;
  }
}
@media screen and (max-width: 1031px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 665px;
  }
}
@media screen and (max-width: 991px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 637px;
  }
}
@media screen and (max-width: 912px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 587px;
  }
}
@media screen and (max-width: 799px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 564px;
  }
}
@media screen and (min-width: 768px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix {
    top: 143px;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid {
    top: 143px;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child {
    top: 143px;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] {
    top: 143px;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider {
    top: 143px;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] {
    top: 143px;
    position: sticky;
    /*div > * {
                    position: sticky;
                }*/
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child {
    top: 143px;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content {
    top: 143px;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 143px;
    position: sticky !important;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .product-showcase div > *:not(.images-container *) {
    position: sticky;
  }
}
@media screen and (max-width: 767px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: 20%;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix {
    top: 20%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid {
    top: 20%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child {
    top: 20%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:nth-child(2) {
    top: 35%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] {
    top: 20%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider {
    top: 20%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] {
    top: 20%;
    position: sticky;
    /*div > * {
                    position: sticky;
                }*/
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child {
    top: 20%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content {
    top: 20%;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 20%;
    position: sticky !important;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .product-showcase div > *:not(.images-container *) {
    position: sticky;
  }
}
@media screen and (max-width: 712px) and (min-width: 712px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 908px;
  }
}
@media screen and (max-width: 540px) and (min-width: 540px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 723px;
  }
}
@media screen and (max-width: 414px) and (min-width: 414px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 588px;
  }
}
@media screen and (max-width: 412px) and (min-width: 412px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 586px;
  }
}
@media screen and (max-width: 411px) and (min-width: 411px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 585px;
  }
}
@media screen and (max-width: 393px) and (min-width: 393px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 565px;
  }
}
@media screen and (max-width: 390px) and (min-width: 390px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 562px;
  }
}
@media screen and (max-width: 384px) and (min-width: 384px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 556px;
  }
}
@media screen and (max-width: 375px) and (min-width: 375px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 546px;
  }
}
@media screen and (max-width: 360px) and (min-width: 360px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 530px;
  }
}
@media screen and (max-width: 353px) and (min-width: 353px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 522px;
  }
}
@media screen and (max-width: 320px) and (min-width: 320px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 487px !important;
  }
}
@media screen and (max-width: 320px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 17%;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:nth-child(2) {
    top: 33%;
  }
}
@media screen and (max-width: 299px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:nth-child(2) {
    top: 31%;
    position: sticky;
  }
}
@media screen and (max-width: 280px) and (min-width: 280px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase],
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content,
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: 444px;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:nth-child(2) {
    top: 30%;
  }
}
@media screen and (max-width: 279px) and (min-width: 279px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
    top: auto;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:first-child {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:nth-child(2) {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid div[class*=alo-content] .magicslider.home-slider {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] {
    top: auto;
    position: sticky;
    /*div > * {
                    position: sticky;
                }*/
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] > div:first-child {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content {
    top: auto;
    position: sticky;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid div[class*=-showcase] div.content .products.wrapper {
    top: auto;
    position: sticky !important;
  }
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .product-showcase div > *:not(.images-container *) {
    position: sticky;
  }
}
@media screen and (max-width: 278px) {
  body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid .alocolumns.clearfix .column.main.container-fluid > div:nth-child(2) {
    top: 30%;
    position: sticky;
  }
}
body:not(.mobile-app).cms-index-index main#maincontent.page-main.page-main-pal.container.container-fluid {
  position: sticky;
}