/* Universal breakpoints */
.page-container {
  overflow-x: clip; }

.download-mobile-app-form {
  position: relative; }
  @media (max-width: 599px) {
    .download-mobile-app-form {
      display: none;
    }
  }
  .download-mobile-app-form .download-mobile-app-form__idle {
    display: flex;
    flex-direction: column;
    gap: 20px; }
  .download-mobile-app-form .download-mobile-app-form__success {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%; }
  .download-mobile-app-form.success .download-mobile-app-form__idle {
    visibility: hidden; }
    .download-mobile-app-form.success .download-mobile-app-form__idle a {
      transition: none; }
    .download-mobile-app-form.success .download-mobile-app-form__idle button {
      transition: none; }
  .download-mobile-app-form.success .download-mobile-app-form__success {
    display: flex;
    color: white;
    flex-direction: column;
    justify-content: center; }
    .download-mobile-app-form.success .download-mobile-app-form__success h3 {
      margin-top: 0; }
    .download-mobile-app-form.success .download-mobile-app-form__success .click-here {
      text-decoration: underline;
      color: #fbc600;
      font-weight: 700;
      cursor: pointer; }

.feature {
  width: 100%;
  display: flex;
  gap: 40px; }
  @media (min-width: 768px) {
    .feature > div {
      flex: 1; } }
  @media (max-width: 767px) {
    .feature {
      flex-direction: column;
      gap: 24px; } }
  .feature .screenshot {
    height: 730px;
    position: relative; }
    .feature .screenshot img {
      position: absolute;
      right: 100px;
      height: 100%;
      width: auto; }
    @media (max-width: 1279px) {
      .feature .screenshot {
        height: 600px; } }
    @media (max-width: 1079px) {
      .feature .screenshot {
        height: 500px; } }
    @media (max-width: 991px) {
      .feature .screenshot img {
        right: 50px; } }
    @media (max-width: 767px) {
      .feature .screenshot {
        height: 300px; }
        .feature .screenshot img {
          right: 8px;
          left: 0;
          margin: auto; }
       .feature .caption p {
	padding:0 30px !important ; } added for spacing content from both side(vertical mode)-Deepmala
 }
  .feature .gold-square {
    border: 8px solid #fbc600;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    height: 50%;
    width: 100%;
    right: 8px;
    border-bottom-right-radius: 25px; }
  .feature .caption {
    font-size: 36px;
    line-height: 48px;
    font-weight: 500;
    display: flex;
    align-items: center; }
    .feature .caption p {
      margin: auto;
      max-width: 500px;
      padding:60px; } added for horizontal mode-Deepmala 
    .feature .caption span {
      font-weight: 700; }
    @media (max-width: 991px) {
      .feature .caption {
        font-size: 24px;
        line-height: 32px; } }
    @media (max-width: 767px) {
      .feature .caption {
        margin-bottom: 60px; } }
    @media (max-width: 479px) {
      .feature .caption {
        margin-bottom: 30px; } }
  @media (max-width: 767px) {
    .feature.flip {
      flex-direction: column-reverse; } }
  .feature.flip .screenshot img {
    left: 100px; }
  @media (max-width: 991px) {
    .feature.flip .screenshot img {
      left: 50px; } }
  @media (max-width: 767px) {
    .feature.flip .screenshot img {
      right: 0;
      left: -8px; } }
  .feature.flip .gold-square {
    border-top-left-radius: 25px;
    border-bottom-right-radius: 0px;
    left: 8px; }

.button-outlined {
  font-size: 20px;
  padding: 16px 70px; }
  @media (max-width: 767px) {
    .button-outlined {
      font-size: 16px;
      padding: 12px 40px; } }
  @media (max-width: 479px) {
    .button-outlined {
      flex: 1;
      padding: 16px;
      margin: 0 16px; } }

.bottom-cta {
  margin-top: 80px; }
  @media (max-width: 991px) {
    .bottom-cta {
      margin-top: 40px; } }
  @media (max-width: 767px) {
    .bottom-cta {
      margin-top: 20px; } }

.fine-print {
  line-height: 22px; }
  @media (max-width: 767px) {
    .fine-print {
      font-size: 12px;
      line-height: 16px; } }

.hero_cta_simple .hero {
  background-position: 100% 15%;
}
.hero_cta_simple .hero .content {
  padding: 0 0 110px 158px;
}
@media (max-width: 991px) {
  .hero_cta_simple .hero {
    background-position: center;
  }
  .hero_cta_simple .hero .content {
    padding: 0 16px 110px 16px;
  }
}
@media (max-width: 543px) {
  .hero_cta_simple .hero {
    background-position: 80% 15%;
  }
  .hero_cta_simple .hero .content {
    padding: 0 16px 48px 16px;
  }
}