/*--- Backgrounds CSS --- */ 
/* Backgrounds ALL */ 



/* End ALL */ 

/* ----------- Smartphone Device Styles (XS)  ----------- */

@media (max-width: 767px) {  

  .reload-bus-background-mobile {
    padding-bottom: 275px;
    background-image: url('../img/checkout/checkout-thanks-mobile.png');
    background-position: left bottom;
    background-repeat: no-repeat;
    background-color: #fff;
    padding-top: 2rem;
  }

}


@media (min-width: 768px) {

  .get-train-background {
    padding-bottom: 260px;
    background-image: url('../img/get/get-train.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px 424px
  }

  .register-train-background {
    padding-bottom: 300px;
    background-image: url('../img/register/register-train.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px 394px
  }

  .reload-hill-background {
    background-image: url('../img/reload/bottom.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px auto;
  }

  .reload-train-background {
    background-image: url('../img/reload/top.png');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 2400px auto;
  }


  /* boat */
  .new-1-background {
    padding-bottom: 200px;
    background-image: url('../img/new_new_to_clipper/new-1.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px 561px;
  }

  /* bart */
  .new-2-background {
    background-image: url('../img/new_new_to_clipper/new-2.png');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 2400px 554px;
  }

  /* beach */
  .new-3-background {
    background-image: url('../img/new_new_to_clipper/new-3.png');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 2400px 408px;
  }
  .new-3-background .col-12 {
    background-color: #fff;
  }

  /* bus */
  .new-4-background {
    background-image: url('../img/new_new_to_clipper/new-4.png');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 2400px 502px;
  }

  .new-4a-background {
    background-image: url('../img/new_new_to_clipper/new-image-4a.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px auto;
  }

  .new-4b-background {
    background-image: url('../img/new_new_to_clipper/new-image-4b.png');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 2400px auto;
  }

  /* computer */
  .new-5-background {
    background-image: url(../img/new_new_to_clipper/new-5.png);
    background-position: 65% 60%;
    background-repeat: no-repeat;
  }

  /* tap to pay */
  .new-6-background {
    background-image: url('../img/new_new_to_clipper/new-6.png');
    background-position: center top;
    background-repeat: no-repeat;
    background-size: 1650px 850px;
    padding-bottom: 5rem;
  }
  .new-6-background .region-4 .callout-clipper {
    margin-bottom: 2.2rem;
  }

  .discounts-1-background {
    margin-top: -160px;
    background-image: url('../img/discounts/discounts-1.png');
    background-position: 54% 100%; 
    background-repeat: no-repeat;
    background-size: 1800px 555px;
  }

  .discounts-1-background .container {
    padding-top: 220px;
    padding-bottom: 60px
  }

  .discounts-2-background {
    background-image: url('../img/discounts/discounts-2.png');
    background-position: 55% top;
    background-repeat: no-repeat;
    background-size: 2400px 561px;
  }

  .where-background {
    padding-bottom: 250px;
    background-image: url('../img/where-to-use/where-boat.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px 336px;
  }

  .reload-bus-background {
    padding-bottom: 40px;
    background-image: url('../img/reload/Reload-2400px@2x.png');
    background-position: center 100%;
    background-repeat: no-repeat;
    background-size: 2400px auto;
    background-color: #fff;
  } 

  .reload-bus-background-lower {
    padding-bottom: 300px;
    background-image: url('../img/reload/reload-bus.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px auto;
    background-color: #fff;
  }

}

/* End SM */

/* ----------- Desktops and laptops (MD) ----------- */
@media (min-width: 992px) {

  .discounts-1-background {
    margin-top: -160px;
    background-image: url('../img/discounts/discounts-1.png');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: 2400px 741px
  }

  .discounts-1-background .container {
    padding-bottom: 100px
  }

  .discounts-2-background {
    background-position: 52% top;
  }
 

}

/* ----------- Large Desktops (LG) ----------- */

@media (min-width: 1200px) {

  .discounts-1-background .container {
    padding-top: 270px;
    padding-bottom: 120px;
  }

  .discounts-2-background {
    background-size: 2400px 561px;
    background-position: center top;
  }


}