@font-face {
  font-family: Marsden;
  src: url("./Marsden-Cm-Regular.otf") format("opentype");
}
body {
  font-family: "Marsden";
  font-size: 1.6rem;
  text-transform: uppercase;
  background: rgba(255, 175, 75, 1);
  background: -moz-linear-gradient(
    -45deg,
    rgba(255, 175, 75, 1) 0%,
    rgba(255, 67, 66, 1) 40%,
    rgba(255, 67, 66, 1) 50%,
    rgba(255, 51, 92, 1) 60%,
    rgba(255, 26, 143, 1) 100%
  );
  background: -webkit-gradient(
    left top,
    right bottom,
    color-stop(0%, rgba(255, 175, 75, 1)),
    color-stop(40%, rgba(255, 67, 66, 1)),
    color-stop(50%, rgba(255, 67, 66, 1)),
    color-stop(60%, rgba(255, 51, 92, 1)),
    color-stop(100%, rgba(255, 26, 143, 1))
  );
  background: -webkit-linear-gradient(
    -45deg,
    rgba(255, 175, 75, 1) 0%,
    rgba(255, 67, 66, 1) 40%,
    rgba(255, 67, 66, 1) 50%,
    rgba(255, 51, 92, 1) 60%,
    rgba(255, 26, 143, 1) 100%
  );
  background: -o-linear-gradient(
    -45deg,
    rgba(255, 175, 75, 1) 0%,
    rgba(255, 67, 66, 1) 40%,
    rgba(255, 67, 66, 1) 50%,
    rgba(255, 51, 92, 1) 60%,
    rgba(255, 26, 143, 1) 100%
  );
  background: -ms-linear-gradient(
    -45deg,
    rgba(255, 175, 75, 1) 0%,
    rgba(255, 67, 66, 1) 40%,
    rgba(255, 67, 66, 1) 50%,
    rgba(255, 51, 92, 1) 60%,
    rgba(255, 26, 143, 1) 100%
  );
  background: linear-gradient(
    135deg,
    rgba(255, 175, 75, 1) 0%,
    rgba(255, 67, 66, 1) 40%,
    rgba(255, 67, 66, 1) 50%,
    rgba(255, 51, 92, 1) 60%,
    rgba(255, 26, 143, 1) 100%
  );
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffaf4b', endColorstr='#ff1a8f', GradientType=1 );
}

.logopt {
  padding-top: 10px;
}
.row {
  margin: 0px;
}

.display-1 {
  font-size: 5rem;
  font-weight: 900;
  opacity: 0.6;
}

.fz2 {
  font-size: 3rem;
}

button.download {
  border: none;
  background: #fff;
  border-radius: 4px;
  text-align: center;
  color: rgba(255, 255, 255, 0.2);
}

.text-white.main-container-overflow,
.benefits {
  overflow: hidden;
  position: relative;
}

.header-tex {
  padding: 50px 15px 20px;
}

.download {
  display: flex;
  margin-top: 15px;
  margin-bottom: 15px;
}

.gift {
  position: absolute;
  right: 79%;
  top: 15%;
}

.giftpt {
  position: absolute;
  right: 80%;
}

.plate {
  position: absolute;
  top: 25%;
  left: 86%;
}

.uppercase {
  padding: 5px 8px 0px;
}

.hamburger {
  position: absolute;
  right: 87%;
  bottom: 12.5%;
  transform: rotate(20deg);
}

.hamburgerpt {
  position: absolute;
  left: 12em;
  transform: rotate(-29deg);
  top: 1em;
}

.platept {
  position: absolute;
  left: 11.5em;
  top: 8em;
}

.tomato {
  position: absolute;
  right: -7%;
  bottom: 40%;
}


.tomatopt {
  position: absolute;
  right: 12em;
  top: 11em;
  transform: rotate(94deg);
}

.bikept {
  margin-bottom: 10px;
}

.benefits {
  position: relative;
}

.hot-dog {
  position: absolute;
  top: 92%;
  left: 76%;
}
.btn-container {
  margin: 4px -8px 4px;
  display: flex;
  align-items: center;
  flex-direction: row;
  justify-content: center;
}

.btn-ios {
  margin-right: 10px;
}

.hidden {
  display: none;
}

.coupon {
  background: #fff;
  display: block;
  border-radius: 9px;
  padding: 3px 27px;
  color: #e62e5d;
  margin: 5px;
}

.terms {
  display: block;
  font-size: 21px;
  margin: 0px;
  padding: 0px;
  text-transform: capitalize;
}

@media screen and (min-width: 400px) and (max-width: 780px) {
  .logopt {
    padding-top: 13%;
  }

  .coupon {
    margin: 16px;
  }

  .fz2 {
    font-size: 3rem !important;
  }

  .display-1 {
    font-size: 6rem;
  }

  .btn-container {
    margin: 8px -8px 8px;
  }

  .footer {
    display: block;
    margin: 0 auto;
    padding-bottom: 8%;
  }

  .platept {
    left: 13.5em;
    top: 9em;
  }

  .tomatopt {
    right: 14em;
    top: 13em;
  }
}

@media screen and (min-width: 375px) and (max-width: 399px) {
  .logopt {
    padding-top: 10%;
  }

  .bikept {
    margin-bottom: 5%;
  }

  .coupon {
    margin: 17px;
  }

  .footer {
    margin: 12%;
  }

}

@media screen and (min-width: 360px) and (max-width: 370px) {
  .bikept {
    margin-bottom: 5%;
  }
  .bike {
    position: relative;
    left: 4px;
  }

  .logopt {
    padding-top: 3%;
  }

  

  .footer {
    margin-bottom: 7%;
  }
}

@media screen and (device-aspect-ratio: 40/71) {
  .verfirst-deliy {
    font-size: 22px;
  }

  .bikept {
    margin-bottom: 10px;
    width: 56%;
  }

  .btn-container {
    display: block;
  }

  .hamburgerpt {
    position: absolute;
    left: 10.3em;
    transform: rotate(-29deg);
    top: 4em;
    width: 35%;
  }

  .platept {
    display: none;
  }

  .coupon {
    font-size: 18px;
    margin: auto;
    padding: 0px;
    width: 65%;
  }
}
