body {
  margin: 0 auto;
  font-family: "Mulish", sans-serif;
  background-image: url('images/header-bg.jpg');
  background-position: center top;
  background-size: 100%;
  background-repeat: no-repeat;
}

body header, body main, body footer {
 width:100%;
} 
body header {
  height:865px;
}

a.button {
  padding: 1px;
  border: 1px solid;
  border-radius: 30px;
  color: #333333;
  display: flex;
  align-items:center;
  text-decoration: none;
  background-image: url('images/cta.png');
  background-position: right;
  background-repeat: no-repeat; 
}
header section#top-nav nav#mobile-menu-ham {
  display: none;
}
header p a.button {
  max-width:250px;
  color: white;
  background-image: url('images/cta1.png');
}
header p a.button:hover {
  background-color:#707070;
  color:#333333;
}
section#as6 a.button span, header p a.button span {
  padding: 15px 80px 15px 20px;
}
section#as6 a.button {
  max-width:300px;
}
section#as6 a.button:hover {
  background-color:white;
}
section#as6 a.button:hover, header p a.button:hover {
  background-image: url('images/cta1h.png');
}

header #shade {
  width: 100%;
  background-image: linear-gradient(rgba(0,0,0,1), rgba(0,0,0,0));
  height: 150px;
}

header section, header h1, header aside.cta, main section, footer section {
  max-width: 1335px;
  margin: 0 auto;
}
header section, header h1, header aside.cta {
  display: flex;
  flex-direction: row;
}
header aside.cta {
  margin-top: 75px;
}
header section#top-nav {
  align-items: center;
  align-content: flex-start;
  justify-content: space-between;
  height: 120px;
}
header h1 {
  display: block;
  position: relative;
  font-size: 70pt;
  font-weight: 400;
  color: white;
  margin-top: 40px;
}
header h1::after {
 position: absolute;
 content: " ";
 width: 320px;
 height: 220px;
 background-image: url('images/plane.png');
 background-position: center top;
 background-size: 100%;
 background-repeat: no-repeat;
 left: 770px;
 bottom: -70px;

}
header section#top-nav aside#logo {
  display: flex;
  align-items: center;
}
header section#top-nav aside#logo img {
  width: 220px;
}
header section#top-nav nav {
  display: flex;
  gap: 35px;  
}
section#top-nav-mobile {
  display: none;
}
header section#top-nav nav a, section#top-nav-mobile nav#top-menu.mobile a {
  color: white;
  font-size: 16px;
  text-decoration: none;
  height: 28px;
  box-sizing: border-box;
  margin-top: 10px;
}
header section#top-nav nav a:hover, section#top-nav-mobile nav#top-menu.mobile a:hover {
  border-bottom: 2px solid #D9B559;
}
section#app-button {
  margin: 0;
}
#app-button a {
  display: flex;
  font-size: 13px;
  color: white;
  text-decoration: none;
  border: 1px solid #FFF;
  padding: 5px 4px 5px 23px;
  border-radius: 45px;
  align-items: center;
  justify-content: space-between;
}
#app-button a:hover {
  color: #333333;
  background-color: rgba(255, 255, 255,0.7);
}
#app-button #button-text {
  padding-right: 15px;
}
#app-button #button-arrow {
  border-radius: 79px;
  padding: 12px;
  background-color: #D9B559;
  width: 15px;
  height: 15px;
  background-image: url('images/arrow-white.png');
  background-size: 40px 40px;
}
#app-button a:hover #button-arrow {
  background-color: #333333;
}
#app-button .button-snd-state {
  font-size: 18px;
  background-color: rgba(255, 255, 255,0.7);
  color: #333333;
}
#app-button .button-snd-state #button-arrow {
  background-color: rgba(51, 51, 51,0.9)
}
#app-button .discover {
  font-size: 18px;
  color: #333333;
  border: 1px solid #333333;
}
#app-button .discover #button-arrow  {
  transform: rotate(45deg);
  background-color: #333333;
}
#app-button .discover:hover {
  background-color: #fff;
}
#app-button .discover:hover #button-arrow  {
  transform: rotate(0deg);
}
#app-button .poznaj {
  font-size: 18px;
}
#app-button .poznaj #button-arrow  {
  transform: rotate(45deg);
}
#app-button .poznaj:hover {
  background-color: rgba(255, 255, 255,0.7);
}
#app-button .poznaj:hover #button-arrow  {
  transform: rotate(0deg);
}
#header-buttons-container {
  margin-left: 50px;
  display: inline-flex;
  flex-direction: column;
  gap: 30px;
}
main {
  background-color: white;
  width: 100%;
}
main div.odd {
  display: grid;
}
main div.even {
  display: grid;
  background-color: #f1f1f1;
  width: 100%;
}
main div.oddeven {
  background: linear-gradient(
    to bottom,
    white 0%,
    white 175px,
    #f1f1f1 175px,
    #f1f1f1 100%
  );
}

main section {
  padding:25px 0;
  margin-top:50px;
  padding-top:30px;
  margin-bottom:50px;
}
main section h2, main section h3 {
  font-weight: 400;
  width:1050px;
}
main section h2 {
  font-size: 44pt;
}
section h2 span {
  color: #8E9295;
}
section h3 {
  font-size: 22pt;
  color: #343434;
}
main section.as8 h2, main section.as8 h3 {
  font-weight: 400;
  width:555px;
}
section h4 {
  font-weight: 400;
  font-size: 18pt;
}
main section .onethird h4, main section .onethird p {
  max-width: 330px;
  margin: 10px auto;
  color: #343434;
}
main section p {
  line-height: 25pt;
  font-size: 15pt;
}

section div.row {
  max-width: 1245px;
  display: flex;
  flex-direction: row;
  width: 98vw;
  margin: 0 auto;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
}
section.as3 {
  border: 1px solid;
  border-radius: 30px;
  padding: 50px 75px;
  background-image: url('images/baloon.png');
  background-position: 850px 80px;
  background-repeat: no-repeat;
  margin-top: 100px;
  width: 75%;
}
section.as4 div.row {
  margin: 10px 0;
}
section.as4 div.row img {
  max-width:1335px;
}
section div.row div.cell {
  margin: 5px; 
  width: 100%;
  padding: 1px; 
  /*width: 33%;  */
}
section.as1 div.row {
  margin-top: 100px;
}
section.as1 div.row div.cell {
  /*width: 33%;  */
  height: 600px;
}
section div.row div.onethird {
  max-width:403px;
  padding: 1px;
}
div.cell.travel::after {
 content: " ";
 width: 250px;
 height: 250px;
 background-image: url('images/ilu_2.png');
 background-position: center top;
 background-size: 57%;
 background-repeat: no-repeat;
 left: -205px;
 bottom: 0px;
 display: block;
 position: relative;
}
div.row div.onethird img {
  max-width: 398px;
}
section div.row div.half {
  max-width:600px;
  padding: 1px;
}
main section .half p {
  line-height: 30pt;
  font-size: 20pt;
  margin-top: 55px;
}

section.as1 {
  background-image: url('images/tent.png');
  background-position: right 110px;
  background-size: 250px;
  background-repeat: no-repeat;
  border-radius: 30px;
  width: 80%;
}
section.as1 div.cell h4 {
  margin-top: 80px;
}
section.as1 div.cell div.background {
  width:398px;
  height: 266px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 475px;
  border-radius: 30px;
}
section.as1 div.cell div.background img {
  position: relative;
  right: -235px;
  top: 135px;
}
section.as1 div.travel div.background {
  background-image: url('images/podroze.png');
}
section.as1 div.recreation div.background {
  background-image: url('images/aktywny_wypoczynek.png');
}
section.as1 div.recreation div.background img {
  right: -150px;
}
section.as1 div.culture div.background {
  background-image: url('images/kultura_i_rozrywka.png');
}
section.as1 div.culture div.background img {
  right: -225px;
  top: 125px;
}
section.as1 div.shopping div.background {
  background-image: url('images/zakupy.png');
}
section.as1 div.health div.background {
  background-image: url('images/zdrowie_i_uroda.png');
}
section.as1 div.meal div.background {
  background-image: url('images/jedzenie.png');
}

section.as7 div p span {
  color: #8E9295;
}

section.as2 {
  background-image: url('images/sekcja_2_image 1.png'), url('images/1-2-line.png');
  background-position: 550px 50px, -10px 200px;
  background-repeat: no-repeat, no-repeat;
  background-size: 700px, 80px;
  height: 700px;
  margin-top: 50px;
  width: 80%;
  display: flex;
  flex-direction: column;
}
section.as2 .row {
  justify-content:flex-start;
  margin: 5px 0px 30px 40px;
}
section.as2 .bike2 {
  display: none;
}
section.as3 .row {
  max-width:100%;
  display: flex;
  flex-direction: row;
}
section.as3 .row div.cell.onethird {
  margin-top: -20px;
  max-width:370px;
  text-align: center;
}
section.as3 img {
  margin: 0 auto;
  max-width: 875px;
}
section.as4 {
  width: 100%;
}
section.as4 div.row {
  margin-left:auto;
  margin-right:auto;
  max-width: 90%;
  gap: 15px;
  align-items: center;
  justify-content: center;
}
section.as4 .row .tile {
  width: 280px;
  height: 268px;
  border-radius: 34px;
  color: #343434;
}
section.as4 .row .tile.text {
  border: 1px solid #8E9295;
  padding: 30px;
  font-size: 28px;
  align-content: center;
  box-sizing: border-box;
}
section.as4 .row .tile.picture {
  background-repeat: no-repeat;
  background-position: center center;
}
section.as4 .row .tile.greybg {
  background-color: #f5f5f5;
}
section.as4 #tile1 {
  background-image: url('images/s4-1.png');
}
section.as4 #tile3 {
  background-image: url('images/s4-2.png');
}
section.as4 #tile6 {
  background-image: url('images/s4-3.png');
}
section.as4 #tile8 {
  background-image: url('images/s4-4.png');
}
section.as4 #tile10 {
  background-image: url('images/s4-5.png');
}
section.as4 #tile1::before {
  content: " ";
  display: block;
  width: 180px;
  height: 280px;
  position: relative;
  background-image: url('images/roadsign.png');
  background-size: 100%;
  background-repeat: no-repeat;
  left: -185px;
  top: 70px;
}
section.as4 #tile10::after {
  content: " ";
  display: block;
  width: 280px;
  height: 180px;
  position: relative;
  background-image: url('images/tram.png');
  background-size: 100%;
  background-repeat: no-repeat;
  left: 325px;
  top: 80px;
}
section#as4 img {
  margin: 10px auto;
  max-width: 1100px;
}
section#as5 h2, section#as6 h2 {
  margin: 15px auto;
  text-align: center;
  width: 80%;
}
section#as5 img {
  margin: 10px auto;
  max-width: 1100px;
}
section#as6 {
  background-image: url('images/circles.png');
  background-position: center top;
  background-repeat: no-repeat;
  background-blend-mode: color-burn;
  background-color: rgba(217, 181, 89, 0.99);
  background-size: 50%;
  border-radius: 45px;
  text-align: center;
}
section#as6 p {
  margin:0 auto;
  max-width:90%;
  padding: 15px 0;
}
section#as6 h2 {
  font-size: 36pt;
}
section.as7 img {
  vertical-align: top;
}
section.as7 a {
  padding-right: 45px;
  padding-left: 44px;
  border-right: 1px solid #4E5153;
}
section.as7 a:last-of-type {
  padding-right: 0px;
  border-right: 0px;
}
#mybenefit-button-container {
  display: inline-flex;
  flex-direction: column;
  gap: 50px;
  margin: 50px 0;

} 
#bs-products {
  width: 85%;
  display: flex;
  flex-direction: row;
  justify-content: end;
}
section.as8 {
  margin-top: 100px;
}

section.as8 div.images {
  position: relative;
  background-image: url('images/phone.png');
  background-position: center top;
  background-repeat: no-repeat;
}
#mobile-download-cut {
  display: none;
}
section.as8 div.images::before {
  content: " ";
  display: block;
  position: absolute;
  top: 80px;
  width: 670px;
  height: 525px;
  background-image: url('images/ico.png');
  background-repeat: no-repeat;
  background-size: 94%;
}
section.as8 div.text h2 {
  margin-top: 200px;
}
section.as8 img.above {

}
main section.as8 .half p {
  line-height: 28pt;
  font-size: 18pt;
  margin-top: 15px;
}

footer {
  background-color:#161616;
  color: #979797;
}

footer section div.row {
  padding: 30px 0;
  margin: 0;
  display: flex;
  flex-direction: row;
  align-content: center;

}
footer section #nav-links {
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: space-between;
  gap: 40px;
}
#foot-nav-text-links-container {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  width: 80%;
}
#foot-nav-text-links-container {
  display: flex;
  flex-direction: row;
  align-content: center;
  justify-content: space-between;
}
footer p.logo {
  display: flex;
  align-items:center;
}
div.right p {
  text-align: right;
  padding-top:20px;
}
footer a {
  color: #979797;
  text-decoration:none;
}
footer a:hover {
  color: #979797;
  text-decoration:none;
}
main section .row img.mobile {
  display:none;
}
  main section .row img.desktop, main section .row p.desktop {
    display:block;
    margin: 0 auto;
  }

@media  (min-width:600px) and (max-width:1449px) {
  body {
    background-image: none;
  }

  body header {
    background-image: url('images/header-bg.jpg');
    background-position: center top;
    background-size: cover;
    background-repeat: no-repeat;
    height: auto;
    padding-bottom: 100px;
  }

  header section#top-nav {
    width: 90%;
  }
  header section#top-nav aside#logo img {
    width: 140px;
  }

  header h1 {
    font-size: 55pt;
    max-width: 90%;
  }
  header h1::after {
    left: 600px;
  }
  section div.row {
    max-width: 97%;
  }
  main section h2 {
    max-width: 77%;
    font-size: 40px;
  }
  main section h3 {
    max-width: 75%;
  }
  main div.odd {
    display: block;
    width: 100%;
  }
  section.as1 {
    width: 90%;
    background-size: 200px;
  }
  section.as1 div.row {
    max-width: 90%;
  }
  section div.row div.onethird {
    max-width: 30%;
    min-width: 250px;
  }
  section.as1 div.cell div.background {
    width: 100%;
    height: 100%;
    max-height: 187px;
  }
  section.as1 div.cell div.background img {
    position: relative;
    height: auto;
    max-width: 30%;
    width: 100%;
    right: -60%;
    top: 110px;
  }
  section.as1 div.row div.cell.recreation img {
    top: 140px;
  }
  main div.even {
    display: block;
  }
  section.as2 {
    background-position: 115% center, -10px 200px;
    background-size: 50%, 80px;
  }
  section.as2 .row {
    margin-left: 100px;
    margin-top: 57px;
    margin-bottom: 0;
  }
  section.as2 h2 {
    max-width: 90%
  }
  section.as2 .row:nth-of-type(2) {
    margin-top: 33px;
    
  }
  section.as2 div.row div.onethird {
    min-width: 350px;
  }
  section.as3 {
    background-position: 90% 10%;
    background-size: 20%;
  }
  section.as3 h2 {
    font-size: 36px;
  }
  section.as3 img {
    max-width: 82%;
  }
  section.as3 .row:nth-of-type(2) {
    justify-content: space-between;
  }
  section.as4 #tile1::before, section.as4 #tile10::after {
    display: none;
  }
  section.as3 .row div.cell.onethird {
    width: 25%;
    min-width: 120px
  }
  section#as5 img {
    max-width: 90%;
  }
  section#as6 {
    max-width: 90%;
    background-position: center center;
    background-size: 70%;
  }
  section#as6 h2 {
  font-size: 30pt;
  }
  section.as8 div.images {
    height: 750px;
  }
  section.as8 div.text h2 {
    margin-top: 30px;
  }
  section.as8, section.as2 {
    overflow: hidden;
  }
}
@media only screen and (max-width: 600px) {
  body {
    background: none;
    background-image: url('images/header-bg.jpg');
    background-size: cover;
    height: 730px;
    background-repeat: no-repeat;
    background-position: center;
  }
  header section, header h1, header aside.cta, main section, footer section, main section h2, main section h3 {
    max-width: 90%;
    margin: 0 auto;
  }

  body header {
    height:730px;
  }
  header h1 {
    margin: 25px 15px;
    font-size: 35pt;
  }
  header h1::after {
    display: none;
  }
  section#top-nav-mobile.active {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    position: fixed;
    top: 0;
    right: 0;
    width: 100%;
    height: 1000%;
    background-color: #292929;
    padding: 0px;
    z-index: 9999;
    overflow: hidden;
    max-width: 100%;
  }
  section#top-nav-mobile.inactive {
    display: none;
  }
  #top-nav-mobile #logo.mobile img {
    height: 30px;
    margin: 30px 0;
  }
  nav#close-button.mobile {
    width: 22px;
    height: 22px;
    position: absolute;
    right: 23px;
    top: 32px;
    cursor: pointer;
  }
  section#app-button.mobile {
    display: flex;
    margin: 30px 0;
    position: relative;
  }
  section#app-button.mobile a {
    border-color: #d9b559;
    color: #d9b559;
  }
  section#app-button.mobile a:hover {
    color: #292929;
    background-color: #d9b559;
  }
  section#app-button.mobile #button-arrow {
    background-image: url('images/arrow-dark.png');
  }
  section#app-button.mobile a:hover #button-arrow {
    background-image: url('images/arrow-white.png');
  }
  section#app-button.mobile::after {
    content: " ";
    position: absolute;
    width: 200px;
    height: 200px;
    background-image: url('images/plane.png');
    background-position: center top;
    background-size: 100%;
    background-repeat: no-repeat;
    top: 150%;
    left: 0%;
  }
  nav#top-menu  {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 15px;
  }
  #top-nav nav #app-button, #top-nav nav#top-menu {
    display: none !important;
  }
  header section#top-nav nav#mobile-menu-ham#mobile-menu-ham {
    display: block;
  }
  header section#top-nav nav#mobile-menu-ham#mobile-menu-ham:hover {
    cursor: pointer;
  }
  header section#top-nav, header section#top-nav aside#logo {
    height: 90px;
  }
  header section#top-nav aside#logo img {
    width: 120px;
  }
  header section#app-button {
    display: none;
  }
  #header-buttons-container {
    margin-top: 50px;
    margin-left: 0;
  }
  main div.odd {
    display: block;
  }
  section.as1 {
    background: none;
    margin:5px 15px;
    width: 100%;
    margin: 0 auto;
  }
  section.as1 div.row {
    min-width: 338px;
    max-width: 338px;
  }
  section.as1 h2, section.as1 h3 {
    width: 100%;
    margin: 20px;
  }
  main section h2 {
  margin: 20px 0 30px 0;
  }
  main section h3 {
    margin: 20px 0 30px 0;
  }
  
  main section h2 {
    font-size: 22pt;
  }
  main section h3 {
    font-size: 18pt;
  }
  
  section div.row {
    max-width: 80%;
  }
  section div.row div.cell{
    margin: 0;
  }
  section.as1 div.row div.cell {
    min-height: 500px;
  }
  section.as1 div.cell div.background {
    position: relative;
    width: auto;
    height: auto;
    background-size: cover;
    margin: 0 auto;
    max-width: 360px;
    max-height: 100%;
    min-height: 227px;
  }
  section.as1 div.cell div.background img {
    position: absolute;
    left: 55%;
    top: 53%;
    max-width: 50%;
    max-height: 70%;
  }

  main section.as2, main section.as3, main section#as6, main section.as8 {
    background: none;
    height:100%;
    border:none;
    border-radius:0;
  }
  section.as2 .row {
    margin: 0 auto;
  }
  section.as2 .bike2 {
    margin-top: 50px;
    display: block;
  }
  section.as2 .mobile.line-long {
   margin-top: 0px;
  }
  section div.row div.onethird {
    max-width: 95%;
    margin-left: auto;
    margin-right: auto;
  }

  main section#as6 {
    background-color: rgba(217, 181, 89, 0.99);
    max-width: 100%;
  }
  main section.as2 .row, main section.as3 .row, main section.as7 .row, main section.as8 .row, footer section .row {
    display: block;
  }
  main section.as2 h2, main section.as2 h4, main section.as2 p, 
    main section.as3 h2, main section.as3 h4, main section.as3 p,
    main section.as7 h2, main section.as7 h4, main section.as8 h2, 
    main section.as8 h3, main section.as8 h4
  {
    max-width: 250px;
    margin: 0 auto 30px auto;
    text-align: center;
  }
  main section.as7 p {
    width: 100%;
    margin: 0 auto 30px auto;
    text-align: center;
  }
  main section.as3 h2, main section.as7 h2, main section.as8 h2, main section.as8 h3 {
    max-width: 100%;
  }
  div.cell.travel::after {
    display: none;
  }
  main section.as3 {
    padding: 0;
  }
  section.as4 {
    background-color: #f1f1f1;
    max-width: 100%;
  }
  section.as4 .row {
    width: 300px;
    flex-basis: 100%;
    flex-shrink: 0;
    height: 100%;
  }
  section.as4 .row .tile {
    flex: 1 1 120px 220px;
  }
  section.as4 #tile1 {
    order: 1;
  }
  section.as4 #tile2 {
    order: 2;
  }
  section.as4 #tile3 {
    order: 3;
  }
  section.as4 #tile4 {
    order: 4;
  }
  section.as4 #tile5 {
    order: 6;
  }
  section.as4 #tile6 {
    order: 5;
  }
  section.as4 #tile7 {
    order: 8;
  }
  section.as4 #tile8 {
    order: 7;
  }
  section.as4 #tile9 {
    order: 10;
  }
  section.as4 #tile10 {
    order: 9;
  }
  section.as4 .row .tile.text {
    height: 100px;
    width: 250px;
    border: 0;
    font-size: 18px;
    font-weight: normal;
    text-align: center;
    padding: 0;
    background-color: transparent;
  }
  section.as4 .row .tile.picture {
    width: 300px;
    height: 280px;
    background-repeat: no-repeat;
    background-position: center center;
  }
  section.as4 .row .tile.text strong {
    font-weight: normal;
  }
  section.as4 #tile1::before, section.as4 #tile10::after {
    display: none;
  }
  #slider1, #slider2 {
    display:flex;
    height: 70px;
    width: 200px;
    gap: 15px;
    margin: 30px 0 40px 80px;
  }
  section.as1 .row.slider1 {
    min-height: 530px;
    max-height: 530px;
    margin-top: 30px;
    gap: 15px;
  }
  .row.slider1, .row.slider2 {
    display: flex;
    width: 90%;
    min-height: 400px;
    max-height: 400px;
    overflow-x: auto;
    flex-wrap: wrap;
    flex-direction: column;
  }
  
  .row.slider1::-webkit-scrollbar, .row.slider2::-webkit-scrollbar {
    display: none;
  }
  .row.slider1, .row.slider2 {
    -ms-overflow-style: none; 
    scrollbar-width: none;
  }
  
  .right-arrow, .left-arrow, .right-arrow2, .left-arrow2 {
    background-repeat: no-repeat;
    background-position: center;
    width: 60px;
    height: 60px;
    border-radius: 100px;
    -webkit-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
    -moz-box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
    box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.05);
    z-index: 2;
    cursor: pointer;
}
.left-arrow, .left-arrow2 {
  background-image: url('images/CaretLeft.svg');
  background-color: white;
}
.left-arrow svg, .left-arrow2 svg {
    fill:rgba(51, 51, 51,0.9)
}
.right-arrow, .right-arrow2 {
  background-image: url('images/CaretRight.svg');
  background-color: #d9b559;
}
  main section .half p, main section.as8 .half p {
    line-height: 22pt;
    font-size: 12pt;
    margin-top: 55px;
  }
  section#as6 h2 {
    font-size: 20pt;
  }
  section#as6 p {
    max-width: 65%;
    margin: 0 auto;
  }
  
  section.as7 p a img, section.as8 p a img {
    padding: 5px;
    margin: 0px auto 25px auto;
  }
  
  main div.oddeven {
    display:grid;
    background:none;
    background-color: #f1f1f1;
    overflow: hidden;
  }
  section.as8 div.text h2 {
    margin-top: 15px;
  }
  section div.row div.half p {
   margin: 15px 0 0 0;
   font-size: 18px;
  }
  #bs-products {
    flex-direction: column;
    gap: 50px;
    width: 100%;
    margin: 50px 0;
  }
  #bs-products a {
    margin: 0 auto;
    padding: 0;
  }
  section.as7 a {
    border-right: 0px;
  }
  section.as8 {
    margin-top: 40px;
  }
  main section.as8 h2, main section.as8 h3, main section.as8 p {
    text-align: left;
  }
  section div.row div.half p.mobile-stores {
    text-align: center;
    margin: 0 auto;
  }
  main section.as8 p {
    max-width: 300px;
    margin: 0 auto 30px auto;
  }
  main section.as8 div.cell.half.text {
    position: relative;
  }
  section.as8 div.images::before {
    display: none;
  }
  #mobile-download-cut {
    margin: 50px 0px 55px 17px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  #mobile-download-cut::before {
    content: "";
    display:block;
    width: 2000px;
    height: 50px;
    position: absolute;
    bottom: 278px;
    left: -100px;
    background: rgb(0,0,0);
    background: linear-gradient(0deg, rgba(0,0,0,0.15) 0%, rgba(0,212,255,0) 100%);
    overflow: hidden;
  }
  footer {
   font-size: 10pt; 
  }
  footer section div.row {
    flex-direction: column;
    max-width: 100%;
    gap: 30px;
  }
  footer #nav-logo p.logo a {
    margin: 0 auto;
  }
  #foot-nav-logo-container {
    width: 100%;
  }
  #foot-nav-text-links-container {
    flex-direction: column-reverse;
    gap: 30px;
    width: 100%;
  }
  main section .row img.mobile {
    display:block;
    margin: 40px auto;
  }
  main section .row img.desktop, main section .row p.desktop {
    display:none;
  }
}
@media  (min-width:600px) and (max-width:950px) {
  section#app-button {
    display: none;
  }
  header section#top-nav nav {
    gap: 17px;
  }
  header section#top-nav nav a {
    font-size: 14px;
  }
  header h1::after {
    display: none;
  }
  section.as2 {
    background-position: 115% center, -10px 200px;
    background-size: 50%, 80px;
    background-image: none, url('images/1-2-line.png');
  }
  #bs-products {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 50px;
  }
  #bs-products a {
    margin-top: 30px;
    border-right: 0px;
    padding: 0;
  }
}