.own-container {
  margin: 0 auto;
  max-width: 1200px;
  width: 100%;
  padding: 0 15px;
}

.no-marg {
  margin-right: 0;
  margin-left: 0;
}

.slick-dots li.slick-active button:before {
  opacity: 1;
  color: #fff;
  font-size: 20px;
}

.header-logo-text {
  position: absolute;
  top: 56px;
  width: 100%;
  z-index: 99;
}

.hdr-logo-txt-wrapper {
  display: flex;
  align-items: center;
}

.hdr-logo-txt-wrapper img {
  padding-right: 16px;
  height: 53px;
  width: 46px;
}
#tabbing-identy {
  min-height: 500px;
}
.hdr-logo-txt-wrapper .logo-text {
  font-family: Roboto;
  font-size: 24px;
  line-height: 1.25;
  font-weight: 500;
  color: #fff;
}

.HappyFamilyOneLine {
  font-weight: 300;
  color: #f8992c;
  display: block;
}

.congrachulationsText {
  font-size: 24px;
  line-height: 30px;
  color: #444444;
  align-content: center;
  font-family: Roboto;
  font-weight: bold;
  margin-top: 30px;
}

.modalMarginMoified {
  margin-top: 30px;
}

.inireferal {
  font-size: 18px;
  font-weight: 300;
  color: #444444;
  line-height: 1.67;
}

.pointsCredited {
  font-size: 16px;
  font-family: Roboto;
  font-weight: normal;
  line-height: 1.5;
  color: #666666;
}

.pointsCredited1 {
  font-size: 16px;
  font-family: Roboto;
  font-weight: normal;
  line-height: 1.5;
  color: #666666;
}

.congo-modal {
  background: #fff;
  max-width: 721px;
  width: 100%;
  border-radius: 2px;
  height: auto;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  box-shadow: 0px 3px 7px 0 rgba(0, 0, 0, 0.15);
  padding-right: 0 !important;
}

.congratsModalContent {
  border: none;
}

.congratsModalContent .congrats {
  padding: 0 70px 58px;
  font-family: Roboto;
}

.trackReferalStatusCongratsModal {
  font-size: 16px;
  color: #0cb7e6;
  font-family: Roboto;
}

.home-slider {
  position: relative;
  background-color: #f6f6f6;
}

.form-section {
  /* max-width: 570px; */
  width: 100%;
  position: absolute;
  right: 0;
  top: 55%;
  transform: translateY(-50%);
  pointer-events: none;
}

.form-container {
  width: 100%;
  max-width: 1170px;
  margin: 0 auto;
  pointer-events: none;
}

.form-container .formStyle {
  margin-right: 0;
  margin-left: auto;
}

.form-container .termsConditionStyle {
  justify-content: flex-end;
  max-width: 340px;
  width: 100%;
  margin-left: auto;
}

.termsConditionTitle {
  font-size: 24px;
  color: #414142;
  line-height: 1.17;
  font-weight: bold;
  font-family: Roboto;
  padding-top: 59px;
}

.termsConditionData {
  padding: 50px 76px 62px 80px;
}

.termsModalContent {
  border: none;
}

.termsModalContent ul li::before {
  content: "\2022";
  color: #aed140;
  font-weight: bold;
  display: inline-block;
  width: 15px;
  height: 8px;
  margin-left: -1em;
  font-size: 18px;
  margin-top: 14px;
}

.testBulletsTermsModal {
  list-style-type: none;
  font-size: 16px;
  font-weight: 300;
  color: #414042;
  line-height: 24px;
  font-family: Roboto;
}

.tBT {
  list-style-type: none;
  font-size: 16px;
  font-weight: 300;
  color: #414042;
  line-height: 24px;
  font-family: Roboto;
}

.referNowBtnStyleModified {
  border-radius: 3px;
  background-color: #f8992c;
  color: white;
  border: none;
  padding: 18px 34px;
  font-size: 18px;
  line-height: 0.46;
}
 /* mohan css code for rfer a friend brd */
 span.refer-friend-blue-text {
  color: #3DB7E5;
}
a#videobtn.margin-top-refer-form {
  margin-top: 20px;
}
#videobtn img.form-you-tube-logo {
  width: 4%;
  height: auto;
  margin: auto;
  left: 0px;
  position: relative;
}
/* .formStyle.formstyle-shadow {
  box-shadow: rgb(245 139 29 / 59%) 0px 2px 4px 0px, rgb(241 162 11 / 89%) 0px 2px 16px 0px;
} */
  /* end css code */
.voucherSectionModified {
  padding-bottom: 100px !important;
}

.voucherSectionModified .row {
  justify-content: center;
}

.voucherSectionModified .row .box {
  margin-bottom: 30px;
}

.voucherSectionModified .row .box:nth-child(2) {
  margin-left: 30px;
  margin-right: 30px;
}

.voucherSectionModified .row + .row {
  margin-top: 29px;
}

.voucherSectionModified .row .box {
  max-width: 370px;
  width: 100%;
}

.hero-slide {
  background: #fff;
  position: relative;
  z-index: 9;
}

.hero-slide figure {
  width: 63.543%;
  height: 600px;
  position: relative;
}

.hero-slide figure:after {
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  background: url(../images/banner-overlay.png) no-repeat left bottom;
  background-size: cover;
  /* background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), linear-gradient(to top, rgba(12, 30, 55,1), rgba(12, 30, 55,1)); */
}

.hero-slide .banner-content-wrapper {
  display: flex;
  position: absolute;
  justify-content: space-between;
  top: 51%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.hero-slide .banner-content-wrapper .slider-content {
  max-width: 553px;
  width: 100%;
  font-family: Roboto;
}

.banner-content-wrapper .slider-content .discription {
  font-size: 40px;
  color: #e3e3e3;
  font-weight: 300;
  line-height: 1.35;
  padding-bottom: 58px;
  padding-top: 136px;
}

.banner-content-wrapper .slider-content strong {
  font-weight: 500;
  display: block;
}

.banner-content-wrapper .slider-content .slider-btn {
  padding: 18px 34px;
  color: #fff;
  font-size: 18.5px;
  line-height: 0.46;
  background-color: #0cb7e6;
  border-radius: 3px;
  text-transform: uppercase;
}

.banner-content-wrapper .slider-content .slider-btn-login {
  font-size: 18.5px;
  color: #0cb7e6;
}

.banner-content-wrapper .slider-content .slider-btn:hover {
  text-decoration: none;
}

.howReferAndEarnWorksModified {
  width: 395px;
  height: 24px;
  font-family: Roboto;
  font-size: 31.5px;
  font-weight: 300;
  font-stretch: normal;
  font-style: normal;
  line-height: 0.57;
  letter-spacing: normal;
  text-align: left;
  color: #414042;
}

.howReferDescStyle {
  width: 961px;
  line-height: 1.5;
  color: #666666;
  margin-bottom: 40px;
  font-family: Roboto;
  font-size: 16px;
}

@font-face {
  src: url("../fonts/Roboto-Black.ttf");
  font-family: Roboto;
}

@font-face {
  src: url("../fonts/Roboto-Bold.ttf");
  font-family: Roboto;
}

@font-face {
  src: url("../fonts/Roboto-Light.ttf");
  font-family: Roboto;
}

@font-face {
  src: url("../fonts/Roboto-Medium.ttf");
  font-family: Roboto;
}

@font-face {
  src: url("../fonts/Roboto-Regular.ttf");
  font-family: Roboto;
}

@font-face {
  font-family: "museosans-300";
  src: url("../fonts/museosans-300.eot");
  src: local("☺"), url("../fonts/museosans-300.woff") format("woff"),
    url("../fonts/museosans-300.ttf") format("truetype"),
    url("../fonts/museosans-300.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "museosans-500";
  src: url("../fonts/museosans-500-webfont.eot");
  src: local("☺"), url("../fonts/museosans-500-webfont.woff") format("woff"),
    url("../fonts/museosans-500-webfont.ttf") format("truetype"),
    url("../fonts/museosans-500-webfont.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "museoSans-700";
  src: url("../fonts/MuseoSans-700.eot");
  src: local("☺"), url("../fonts/MuseoSans-700.woff") format("woff"),
    url("../fonts/MuseoSans-700.ttf") format("truetype"),
    url("../fonts/MuseoSans-700.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "museo-300";
  src: url("../fonts/museo-300-webfont.eot");
  src: local("☺"), url("../fonts/museo-300-webfont.woff") format("woff"),
    url("../fonts/museo-300-webfont.ttf") format("truetype"),
    url("../fonts/museo-300-webfont.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "museo-500";
  src: url("../fonts/museo500-regular.eot");
  src: local("☺"), url("../fonts/museo500-regular.woff") format("woff"),
    url("../fonts/museo500-regular.ttf") format("truetype"),
    url("../fonts/museo500-regular.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "museo-700";
  src: url("../fonts/Museo700-Regular.eot");
  src: local("☺"), url("../fonts/Museo700-Regular.woff") format("woff"),
    url("../fonts/Museo700-Regular.ttf") format("truetype"),
    url("../fonts/Museo700-Regular.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

body {
  overflow-y: hidden;
}

.box-grey {
  background-color: #f6f6f6;
  box-shadow: -9px -16px 89px 27px rgba(255, 255, 255, 1);
}

/** Header Style **/

.topnav {
  background: #1C1C1C;
  box-shadow: 0 5px 6px -2px rgba(0, 0, 0, 0.06);
  -moz-box-shadow: 0 5px 6px -2px rgba(0, 0, 0, 0.06);
  -webkit-box-shadow: 0 5px 6px -2px rgba(0, 0, 0, 0.06);
  /* height: 69px; MC */ 
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  z-index: 999;
}
.memberwelcome span{
  color:#4EABE9;
  text-transform: uppercase;
  font-size:12px;
  display: block;
}
.memberwelcome strong{
  color:#fff;
  font-weight: 500;
}

.topnav a {
  display: block;
  color: darkgray;
  text-align: center;
  padding: 10px 10px;
  text-decoration: none;
  font-size: 15px;
  font-weight: normal;
  position: relative;
}
.new-header{
  display: flex;
  width: 100%;
}
.new-header-wrapper{
  background:#383838;
  width: 100%;
}
.left-side-logo{
  width: 15%;
}
.new-header a{
  margin-right: 20px;
  position: relative;
  padding-bottom: 10px;
  color:#EEEEEE;
}
.new-header a::after{
    content: '';
    position: absolute;
    bottom: 0;
    left:50%;
    transform: translateX(-50%);
    background: #EB9D47;
    width: 35%;
    height: 3px;
    opacity: 0;
    transition: 0.3s ease all;
}
.new-header a.active{
    color:#FFFFFF;
}
.new-header a.active::after{
  opacity: 1;
  transition: 0.3s ease all;

}
.centre-side a.active:after {
  position: absolute;
  bottom: -1px;
  height: 9px;
  border-bottom: solid 3px orange;
  content: "";
  left: 50%;
  width: 20px;
  transform: translateX(-50%);
}
.memberwelcome{
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding-left: 40px;
      position: relative;
}
.memberwelcome::before{
  content: '';
  left: 9px;
  top: 14px;
  position: absolute;
  width: 1px;
  height: 35px;
  background: #626262;
}
.rigth-side-sub{
  background: #26383f;
}
.centre-side a.active {
  color: #333333;
  font-weight: 500;
}

.centre-side a:hover {
  color: #333333;
  font-weight: 500;
}

.centre-side a:hover:after {
  position: absolute;
  bottom: -1px;
  height: 9px;
  border-bottom: solid 3px orange;
  content: "";
  left: 50%;
  width: 20px;
  transform: translateX(-50%);
}

.topnav .icon {
  display: none;
}

.iconImages {
  margin-left: 20px;
}

/* tell the container's children to float left: */
.float-my-children > * {
  float: left;
  margin-right: 5px;
}

/* this is called a clearfix. it makes sure that the container's children floats are cleared, without using extra markup */
/*
.clearfix {
    *zoom:1 
}*/
.topnav a:hover{
  color: #fff;
}

.arrowDown {
  display: block;
  position: absolute;
  top: 52px;
  left: 90px;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  text-align: center;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  box-shadow: 0 4px 8px -2px rgba(0, 0, 0, 0.2);
  background: #fff;
  text-align: center;
  padding: 2px;
}

.heartStyle {
  height: 36px;
}

.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}

.clearfix:after {
  clear: both;
}

.ryf {
  font-weight: 300;
  font-size: 25px;
  margin-top: 98px !important;
  opacity: 8;
}

.termsConditionStyle {
  display: flex;
  justify-content: flex-start;
  padding-top: 22px;
  font-size: 14px;
  font-weight: 500;
  color: #999;
  pointer-events: painted;
}

.term-link {
  font-family: Roboto;
  margin-left: 5px;
}

.color-cyan {
  color: #4bc9eb;
}

.formRow {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  padding-top: 30px;
}

.formRow .home-phone {
  max-width: 225px;
  width: 100%;
  margin-right: 20px;
}

.formRow .mail {
  max-width: 225px;
  width: 100%;
}

header {
  overflow: hidden;
}

.oneimgClass {
  text-align: right !important;
}

.oneimgClass1 {
  text-align: left;
}

.hero-text {
  margin-bottom: -7px;
}

.hero-text h2 {
  margin-bottom: 50px;
}

.hero-text .hero {
  position: relative;
}

.hero-text .hero .hero-slide a:hover span {
  color: #033a71;
}

.hero .hero-slide img {
  width: 100%;
  height: 600px;
  object-fit: cover;
  /* object-position: top center; */
}

.hero .hero-slide .header-content {
  top: 60px;
  max-width: 556px;
  width: 100%;
}

.slide-content .h1 {
  font-size: 62px;
}

.btn-primary {
  background-color: #5302fe;
  border: #111;
  border-radius: 0;
}

/** Text Animation **/

@-webkit-keyframes fadeInUpSD {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpSD {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

/* .fadeInUpSD {
    -webkit-animation-name: fadeInUpSD;
    animation-name: fadeInUpSD;
}

.slick-active .slide-content {
    animation-name: fadeInUpSD;
    animation-duration: 1s;
    opacity: 1;
    width: 100%;
} */

/* Text Animation End **/

.slick-dots {
  position: absolute;
  bottom: 10px;
  display: block;
  width: 100%;
  padding: 0;
  list-style: none;
  text-align: center;
}

.slick-dots li {
  width: auto;
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
  cursor: pointer;
  border-radius: 50%;
  border: 0;
  outline: none;
}

.slick-dots li button::before {
  font-size: 18px;
  color: #fff;
  opacity: 1;
}

.slick-active button {
  background: #f8992c;
}

h1 {
  font-size: 1.5rem !important;
}

.form-earn-wrapper {
  display: flex;
}

.formStyle {
  background-color: #ffffff;
  padding: 20px 40px 20px;
  max-width: 570px;
  width: 100%;
  box-shadow: 0 0 39.6px 0.4px rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  font-family: Roboto;
  pointer-events: painted;
}

input {
  width: 100%;
  outline: 0;
  border-width: 0 0 2px;
  border-color: #cccccc;
  padding-top: 10px;
  padding-bottom: 6px;
  /*font-size: 18px;*/
  font-size: 16px;
  font-weight: 500;
  font-family: Roboto;
}

.btnStyle {
  background-color: #f8992c;
  color: white;
  margin-top: 8%;
  margin-left: 11%;
  margin-bottom: 14%;
}

.descstyle1 {
  padding-left: 80px;
  padding-right: 80px;
}

.body {
  background-color: #fafafa;
}

header {
  overflow: hidden;
}

.hero-text h2 {
  margin-bottom: 50px;
}

.hero-text .hero {
  position: relative;
}

.hero-text .hero .hero-slide a:hover span {
  color: #033a71;
}

.slide-content .h1 {
  font-size: 62px;
}

.btn-primary {
  background-color: #0cb7e6 !important;
  border-radius: 0;
}

.slick-dots {
  position: absolute;
  bottom: 30px;
  display: block;
  width: 100%;
  padding: 0;
  list-style: none;
  text-align: left;
  left: calc(50% - 585px);
  transform: translateX(-0.5%);
  transform-origin: center;
}

.slick-dots li {
  position: relative;
  display: inline-block;
  width: 20px;
  height: 20px;
  margin: 0 5px;
  padding: 0;
  cursor: pointer;
}

.slick-dots li button {
  font-size: 0;
  line-height: 0;
  display: block;
  width: 20px;
  height: 20px;
  padding: 5px;
  cursor: pointer;
  border-radius: 50%;
  border: 0;
  outline: none;
}

.slick-dots li button::before {
  font-size: 16px;
  color: gray;
  opacity: 0.8;
}

.slick-active button {
  background: #f8992c;
}

.slick-active button.knowMorebtnexclusive {
  background:#0ec1eb;
}

.slick-initialized button.knowMorebtnexclusive {
  background:#0ec1eb;
}

/** Text Animation **/

@-webkit-keyframes fadeInUpSD {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

@keyframes fadeInUpSD {
  0% {
    opacity: 0;
    -webkit-transform: translateY(100px);
    transform: translateY(100px);
  }

  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}

/* .fadeInUpSD {
    -webkit-animation-name: fadeInUpSD;
    animation-name: fadeInUpSD;
}

.slick-active .slide-content {
    animation-name: fadeInUpSD;
    animation-duration: 1s;
    opacity: 1;
    width: 100%;
} */

.formStyle {
  background-color: #ffffff;
}

.formStyle1 {
  background-color: #ffffff;
  box-shadow: 0 0 39.6px 0.4px rgba(0, 0, 0, 0.05);
}

.select1 {
  outline: 0;
  border-width: 0 0 2px;
  border-color: #cccccc;
  width: 100%;
  margin-top: 10px;
  padding-bottom: 6px;
  /*font-size: 18px;*/
  font-size: 16px;
  background-color: white;
  font-family: Roboto;
  font-weight: 500;
  color: #333333;
}

.selectMobile {
  outline: 0;
  border-width: 0 0 2px;
  border-color: #cccccc;
  width: 28.5%;
  height: 30px;
  background-color: white;
  padding-left: 69px !important;
}

.inputMobile {
  outline: 0;
  border-width: 0 0 2px;
  border-color: #cccccc;
  width: 118px;
  margin-bottom: 1.5px;
  margin-left: 5px;
}

.style2 {
  font-size: 13.5px;
  color: #3c4b5f;
  padding-top: 2px;
}

.own-align {
  align-items: baseline;
}

.year-duration {
  font-size: 16px;
  line-height: 0.84;
  color: #a7a9ac;
}

.yearstyle {
  position: relative;
  margin-left: 20px;
  cursor: pointer;
}

.yearstyle:hover {
  color: #3c4b5f;
  font-weight: bold;
}

.yearstyle::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 100%;
  height: 2px;
  background: #00aeef;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 250ms ease-in;
}

.yearstyle:hover::after {
  font-weight: bold;
  transform-origin: left;
  transform: scaleX(1);
}

.referYear {
  color: #3c4b5f;
  font-weight: bold;
}

.referYear::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -10px;
  width: 100%;
  height: 2px;
  background: #00aeef;
  transform: scaleX(1);
}

.yearstyle1 {
  font-size: 18px;
  margin-left: 10px;
  color: #9c9ea1;
  cursor: pointer;
}

.blockStyle {
  box-shadow: 0px 10px 18px 2px rgba(0, 0, 0, 0.05);
  text-align: center;
  font-size: 14px;
  line-height: 1.71;
  color: #666666;
  font-family: Roboto;
  margin-right: 15px;
  margin-left: 15px;
  margin-bottom: 30px;
  padding: 20px 17px;
  border-radius: 5px;
  max-width: 170px;
  width: 100%;
  background-color: white;
}

.blockStyle:last-child {
  margin-right: 15px;
}

.blockStyle p {
  margin: 0;
}

.blockStyle p:first-child {
  padding-top: 2px;
  padding-bottom: 7px;
}

.blockStyle p b {
  color: #333333;
  font-size: 18px;
  line-height: 1.33;
  font-weight: 500;
}

.purple {
  background: none !important;
  color: #8d11b1;
  font-weight: 500;
}

.red {
  background: none !important;
  font-weight: 500;
  color: #e54c4c;
}

.white {
  font-weight: 500;
  color: #a7a9ac;
}

.blue {
  background: none !important;
  font-weight: 500;
  color: #0cb7e6;
}

.gary {
  font-weight: 500;
  color: #3c4b5f;
}

.offerStyle {
  margin-top: 80px;
  font-family: Roboto;
  font-size: 31.5px;
  font-weight: 300;
  color: #414042;
  line-height: 0.57;
  margin-bottom: 64px;
}

.optionStyle1 {
  font-weight: bold;
}

.redeem {
  margin-bottom: 54px;
}

.box .inner {
  background-color: #fff;
  display: flex;
  align-items: center;
  padding: 11px 20px 10px;
  border-radius: 5px;
}

.box .inner .redeem-icon img {
  height: 80px;
  width: 80px;
}
.tab-view-one .box .inner form {
  display: flex;
  margin-top: 18px;
  align-items: center;
  flex-wrap: wrap;
  font-family: Roboto;
}

.tab-view-one .box .inner form .all-btn {
  padding: 12px 19px;
  color: #fff;
  font-size: 16px;
  background: #666;
  border-radius: 3px;
  width: fit-content;
  font-weight: normal;
  border-width: 0;
}

.tab-view-one .box .inner form .amount {
  border: 1px solid #e3e3e3;
  border-radius: 3px;
  background-color: #fff;
  color: #333;
  font-size: 21px;
  font-weight: 500;
  max-width: 130px;
  width: 100%;
  height: 48px;
  padding: 4px 12px;
  margin: 0 10px;
}

.tab-view-one .box .inner form span {
  font-size: 14px;
  color: #999;
}

.tab-view-one .box .inner form .cancel,
.tab-view-one .box .inner form .confirm {
  border-radius: 3px;
  color: #fff;
  font-size: 16px;
  padding: 12px 26px;
  width: fit-content;
  font-weight: normal;
  border-width: 0;
  margin-top: 30px;
  line-height: 1;
  border: none;
  margin-bottom: 24px;
}

.tab-view-one .box .inner form .cancel {
  background-color: #ccc;
  margin-right: 20px;
}

.tab-view-one .box .inner form .confirm {
  background-color: #f8992c;
}

.giftcardStyle {
  padding-left: 20px;
  font-family: Roboto;
  font-size: 17.5px;
  font-weight: 500;
  line-height: 1.4;
  color: #444444;
}

.tab-view-one .box {
  transition: transform 500ms;
}

.tab-view-one .box:hover {
  transform: scale(1.07);
  transform-origin: center;
}

.tab-view-one .box .inner {
  align-items: flex-start;
  flex-wrap: wrap;
}

.redeem-voucher-container {
  max-width: 194px;
  padding: 6px 0 16px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

.redeem-voucher-container .redeem-due {
  color: white;
  background: #ffc000;
  padding: 4px 18px;
  font-size: 12px;
  border-radius: 8px;
  margin-right: 10px;
}

.redeem-voucher-container .redeem-due-amount {
  color: #a7a9ac;
  font-weight: bold;
  font-size: 16px;
}

.redeem-voucher-container .redeem-due-pay-btn {
  padding: 10px 20px 9px 21px;
  color: #f8992c;
  border: 1px solid #f8992c;
  border-radius: 5px;
  text-decoration: none;
  font-size: 16px;
  margin-top: 12px;
  transition: all 250ms;
}

.redeem-voucher-container .redeem-due-pay-btn:hover {
  background: #f8992c;
  color: #fff;
}

.tab-view-one .upto-amount {
  font-size: 14px;
  color: #666;
  margin-top: 10px;
}

.tab-view-one .points-conver-txt {
  font-size: 16px;
  color: #666;
  font-family: Roboto;
  margin-top: 16px;
}

.container-fluid {
  margin: 0px;
  padding: 0px;
  background-color: #f6f6f6;
}

.login-header {
  margin-top: 64px;
}

.textOrange {
  color: orange;
  font-size: 16px;
}

.btn-orange {
  background-color: #f8992c;
  color: white;
}

.know-slide-btn button {
  background: #f8992c;
}

.btn:focus {
  box-shadow: none;
}

/* .zoom-out .btn-orange, .zoom-goods .btn-orange{
    transition: all .5s;
    margin-bottom: -30px;
    height: 0;
    overflow: hidden;
}
.zoom-out:hover .btn-orange, .zoom-goods:hover .btn-orange{
    margin-bottom: 0; 
    height: auto;   
} */
.btn-orange:hover {
  color: black !important;
}

.giftCardStyle {
  background-color: #f6f6f6;
  margin-top: 20px;
  margin-right: -34px;
}

.slick-prev {
  display: block !important;
}

.slick-next {
  display: block !important;
  padding-right: 43px;
}

.slick-prev:before,
.slick-next:before {
  color: #17a2b8 !important;
}

.slick-next:before,
.slick-prev:before {
  content: " \2794" !important;
}

.slick-prev:before {
  content: " \2794";
  transform: rotate(180deg);
}

.slick-prev,
.slick-next {
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  display: block;
  width: 55px;
  height: 55px;
  padding-right: 14px;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: #fff;
  border: none;
  outline: none;
  background: #fff;
  border-radius: 50%;
  text-align: center;
  margin-left: 23px;
}

.form-curve .form-section {
  top: 49%;
}

.curvedBorder {
  padding-bottom: 84px;
  font-family: Roboto;
  background-color: var(--white);
}

.giveStyle {
  padding-top: 130px;
  font-size: 24px;
  line-height: 1.52;
  color: #414041;
  padding-bottom: 38px;
  max-width: 486px;
  width: 100%;
}

.giveStyle1 {
  padding-top: 110px;
  margin-left: 30px;
  font-size: 2px;
}

.pointStyle {
  border: 1px solid #0cb7e6;
  max-width: 561px;
  width: 100%;
  border-radius: 5px;
  box-shadow: 0px 5px 12.8px 2.3px rgba(0, 0, 0, 0.05);
}

.unlockOffer {
  font-size: 25px;
}

.paddingStyle {
  padding: 43px;
}

.borderright {
  border-right: 1px solid #dddbd6;
  height: 75px;
}

.trackstatus {
  color: #0cb7e6;
}

.btn-exclusive {
  border-radius: 20px;
  background-color: white !important;
  color: #ffc822;
}

.btn-unlocked {
  border-radius: 20px;
  background-color: white !important;
  color: #aed140;
}

.btn-locked {
  border-radius: 20px;
  background-color: #cccccc !important;
  color: black;
}

.btn-redeem {
  border-radius: 10px;
  background-color: white !important;
  color: #f8992c;
  border: 1px solid #f8992c;
}

.btn-redeemfill {
  border-radius: 10px;
  background-color: #f8992c !important;
  color: white;
  border: 1px solid #f8992c;
}

.pointStyle1 {
  height: 280px;
  border: 1px solid #0cb7e6;
  width: 660px;
  margin-left: 15px;
}

.step1 {
  position: relative;
  min-height: 3em;
  color: gray;
}

.step1 + .step1 {
  margin-top: 1.5em;
}

.step1 > div:first-child {
  position: absolute;
  height: 0;
  margin-top: 30px;
}

.step1 > div:not(:first-child) {
  margin-left: 0.5em;
  padding-left: 1em;
  margin-top: -25px;
}

.step1.step-active {
  color: #4285f4;
}

.step1.step-active .circle {
  background-color: #4285f4;
}

.step1.step-active .circle11 {
  background-color: none;
}

/* Circle */
.circle {
  background: gray;
  position: relative;
  width: 1.5em;
  height: 1.5em;
  line-height: 1.5em;
  border-radius: 100%;
  color: #fff;
  text-align: center;
  box-shadow: 0 0 0 3px #fff;
}

.circle11 {
  position: relative;
  width: 1.5em;
  height: 1.5em;
  line-height: 1.5em;
  border-radius: 100%;
  color: #fff;
  text-align: center;
  box-shadow: 0 0 0 3px #fff;
}

/* Vertical Line */
.circle:after {
  content: " ";
  position: absolute;
  display: block;
  top: 1px;
  right: 50%;
  bottom: 1px;
  left: 50%;
  height: 110%;
  width: 1px;
  transform: scale(1, 2);
  transform-origin: 50% -100%;
  background-color: rgba(0, 0, 0, 0.25);
  z-index: -1;
}

.formStylePayment11 {
  background-color: #ffffff;
  box-shadow: 3px 3px 5px 3px #ccc;
  padding-bottom: 40px;
  height: 100%;
  padding-left: 15px;
  padding-right: 15px;
  margin-left: 12px;
}

.emiAutoDebit {
  color: black;
}

.rowPadding {
  padding: 20px;
}

.formPadding {
  padding: 30px;
}

.redeemFont {
  font-size: 20px;
}

.dotStyle {
  padding: 3px;
}

.btn-success {
  border-radius: 20px;
  font-size: 13px;
  border-color: #ffc000 !important;
  background-color: #ffc000 !important;
  padding-left: 10px;
  padding-right: 10px;
}

.wrapper {
  width: 100%;
}

.panel-heading {
  padding: 0;
  border: 0;
}

.panel-title > a,
.panel-title > a:active {
  display: block;
  padding: 15px;
  color: #555;
  font-size: 16px;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 1px;
  word-spacing: 3px;
  text-decoration: none;
}

.panel-heading a:before {
  font-family: "Glyphicons Halflings";
  content: "\e114";
  float: right;
  transition: all 0.5s;
}

.panel-heading.active a:before {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  transform: rotate(180deg);
}

.font-weight-refer {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 300;
  line-height: 1.71;
  color: #414042 !important;
}

/*=========new harsh==================*/
.top-conatiner {
  max-width: 1400px;
  width: 100%;
  padding: 0 15px;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

.centre-side {
  display: flex;
  justify-content: center;
  align-items: center;
}

.right-side {
  display: flex;
  align-items: center;
  flex: 1;
  justify-content: flex-end;
}

.rigth-side-sub {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.centre-side a {
  padding: 20px 10px;
}

.clearfix.float-my-children {
  align-items: center;
  display: flex;
}

.clearfix.float-my-children p {
  margin: 0;
}

.mobile-menu {
  display: none;
}

.mob-right {
  overflow: hidden;
  background-color: #fff;
  position: relative;
}

.mob-right #myLinks {
  display: none;
  list-style: none;
  padding: 0;
}

.mob-right a {
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
}

.mob-right li:hover {
  background-color: darkgray;
}

.mob-right a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

.mob-right a:hover {
  background-color: #ddd;
  color: black;
}

.rigth-side-sub .icon1 {
  display: none;
}

.clearfix.float-my-children.heart-img {
  display: block;
}

.form-borer {
  position: relative;
  font-family: Roboto;
  line-height: 1.33;
  letter-spacing: normal;
  text-align: left;
  color: #414042;
  font-size: 18px;
  font-weight: 500;
}

.form-borer:after {
  position: absolute;
  bottom: -21px;
  border-bottom: solid 2px #2aace2;
  content: "";
  left: 0px;
  width: 40px;
}

.mrg-form {
  margin-top: 30px;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.mrg-form .name-form {
  max-width: 225px;
  width: 100%;
  margin-right: 20px;
}

.mrg-form .city-form {
  max-width: 225px;
  width: 100%;
}

.mobmarginbtm input {
  width: 100%;
  font-family: Roboto;
  /*font-size: 18px;*/
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
  text-align: left;
  color: #333333;
}

.mobmarginbtm input {
  box-shadow: none;
  outline: none;
}

.mrg-form input::placeholder {
  color: #999;
}

.formRow input::placeholder {
  color: #999;
}

.welcome-lbl input {
  width: 100%;
  background-color: #f6f6f6;
}

.presponsive.text-secondary.text-center {
  font-family: Roboto;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: center;
  color: #666666 !important;
}

.container-fluid.box-grey.card-section {
  padding: 80px 0 75px;
}

.heading-txt {
  font-weight: 300;
  margin-bottom: 30px;
  font-size: 31.5px;
  text-align: center;
  color: #414042;
  line-height: 0.57;
  font-family: Roboto;
}

.box-txt {
  font-family: Roboto;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.71;
  letter-spacing: normal;
  text-align: center;
  color: #666666;
}

.btn-welcome button {
  margin-left: 0;
}

.bg-color-form {
  margin: 38px -40px -20px -40px;
  padding-bottom: 20px;
  border-radius: 0 0 5px 5px;
}

.bg-color-form .bg-form {
  padding-left: 40px;
  justify-content: flex-start;
  align-items: center;
}

.bg-color-form .bg-form .refer-btn {
  padding-left: 50px;
}
/* mohan css code for brd */
.bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
  padding-left: 25px;
}
/* end code */
.bg-color-form .bg-form .welcome-lbl {
  max-width: 244px;
  width: 100%;
  position: relative;
}

.bg-color-btm {
  background-color: #f6f6f6;
}

form .mob-resp input {
  width: 100%;
}

.bootm-border {
  position: relative;
  width: 100%;
  bottom: -18px;
  padding-bottom: 18px;
  border-bottom: 1px solid #eee;
}

.home-pd {
  padding-bottom: 30px;
  display: flex;
}

.earn-upper-wrapper {
  display: flex;
}

.earn-str-img {
  padding: 0 10px;
}

.bal-exp-redm-wrap {
  display: flex;
}

.bal-exp-points-wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 360px;
  padding: 0 10px;
}

.txt-side {
  font-family: Roboto;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.5;
  text-align: left;
  color: #999999;
  max-width: 150px;
  width: 100%;
  margin-right: 6px;
}

.txt-side p {
  font-size: 14px;
  margin-bottom: 0;
  color: #666;
  font-weight: normal;
}

.sceond-txt {
  display: block;
  color: #ffc000;
  font-size: 20px;
}

.txt-2-col {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  text-align: left;
  color: #333;
  max-width: 180px;
  width: 100%;
  margin-left: 6px;
}

.txt-2-col p {
  font-size: 14px;
  margin-bottom: 0;
  font-weight: normal;
  color: #666;
}

.sub-txt-col {
  font-size: 14px;
  color: #333333;
  margin-top: -24px;
}

.txt-2-sub {
  display: flex;
  flex-direction: column;
}

.red-point {
  font-family: Roboto;
  font-size: 16px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.25;
  letter-spacing: normal;
  text-align: left;
  padding: 0 15px;
  color: #0cb7e6;
  margin-top: 20px;
  border-left: 1px solid #f6f6f6;
  max-width: 75px;
  width: 100%;
}

.red-point a {
  text-decoration: none;
  color: #0cb7e6;
}

.suc-pro-container {
  display: flex;
}

.succ-proc-wrap {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  max-width: 360px;
  width: 100%;
  padding: 0 10px;
  margin-left: 60px;
}

.succ-proc-wrap .suc-ref {
  max-width: 145px;
  width: 100%;
  margin-right: 6px;
}

.succ-proc-wrap .ref-proces {
  max-width: 180px;
  width: 100%;
  margin-left: 6px;
}

.txt-2-col .txt-2-sub .sub-txt-col .yellow-colro {
  padding-left: 0px;
}

.yellow-colro {
  color: #ffc000 !important;
  padding-left: 12px;
}

.referal-txt {
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.71;
  letter-spacing: normal;
  text-align: left;
  color: #666666;
}

.suc-proces-point {
  color: #ffc000;
  font-size: 20px;
}

.termsConditionStyle.terms-postion {
  right: 4% !important;
  top: 23px;
}

.main-tab {
  padding-top: 60px;
}

.main-tab .tabs {
  display: flex;
  justify-content: space-between;
  max-width: 620px;
  width: 100%;
  padding-bottom: 25px;
  border-bottom: 1px solid #e4e5e6;
  margin-bottom: 60px;
}

.main-tab .tabs div {
  position: relative;
  margin: 0;
  padding: 0;
}

.main-tab .tabs a {
  text-decoration: none;
  color: #414042;
  font-size: 18.5px;
  font-weight: 300;
}

.main-tab .tabs a::after {
  position: absolute;
  left: 0;
  top: calc(100% + 24.5px);
  content: "";
  width: 100%;
  height: 2px;
  background: #00aeef;
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 350ms ease-in;
}

.main-tab .tabs a:hover::after {
  transform-origin: left;
  transform: scaleX(1);
}

.main-tab .tabs a:hover {
  font-weight: bold;
}

.main-tab .tabs .active a {
  font-weight: bold;
}

.main-tab .tabs .active a:after {
  transform-origin: left;
  transform: scaleX(1);
}

.form-curve .bg-color-form .bg-form .refer-btn {
  padding-left: 0;
}

.iner-tab-view {
  padding: 0;
  width: 100%;
  list-style: none;
  margin: 0 auto;
  max-width: 1030px;
}

.tab-view-one {
  max-width: 100%;
}

.tab-view-one .offerStyle {
  margin-bottom: 56px;
  margin-top: 0;
}

.tab-view-one .hero-slick-slider2 {
  padding-bottom: 36px;
}

.tab-view-one .voucherSectionModified .redeem {
  padding-top: 8px;
}

.tab-view-one .voucherSectionModified {
  padding-bottom: 0 !important;
}

.iner-wrap-tab {
  max-width: 1030px;
  position: relative;
  border-radius: 5px;
  box-shadow: 0px 5px 12.8px 2.3px rgba(0, 0, 0, 0.05);
  background-color: #fbfbfb;
  width: 100%;
  margin-bottom: 10px;
  font-family: Roboto;
  padding: 34px 30px 34px 40px;
}

.iner-wrap-tab::after {
  position: absolute;
  content: " ";
  top: 35.3px;
  left: 0;
  height: 50px;
  /*  border-left: 3px solid #ffc000;*/
}

.iner-wrap-tab-o::after {
  border-left: 3px solid #ffc000;
}
.iner-wrap-tab-g::after {
  border-left: 3px solid #aed140;
}
.iner-wrap-tab-r::after {
  border-left: 3px solid #e54c4c;
}

.inertab {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.inertab .name-num {
  max-width: 180px;
  width: 100%;
}

.inertab .refer-date {
  max-width: 134px;
  width: 100%;
}

.inertab .progress-appointment-date {
  max-width: 290px;
  width: 100%;
}

.inertab .process-expire {
  max-width: 238px;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.inertab .accor-img img {
  width: 48px;
  height: 48px;
}

.green-point {
  max-width: 10px;
  height: 10px;
  background-color: #cccccc;
  display: block;
  width: 100%;
  border-radius: 50%;
  margin-right: 3px;
}

.progress-point {
  display: flex;
}

.green-color {
  background-color: #aed140;
}

.yellow-color {
  background-color: #ffc000;
}

.red-color {
  background-color: #e54c4c;
}

.process-btn {
  max-width: 83px;
  width: 100%;
  border-radius: 8px;
  background-color: #ffc000;
  font-family: Roboto;
  font-size: 12px;
  font-weight: normal;
  letter-spacing: normal;
  text-align: center;
  line-height: 20px;
  color: #fff;
  margin: 10px auto;
}

.expired-btn {
  max-width: 83px;
  height: 20px;
  border-radius: 8px;
  background-color: #e54c4c;
  width: 100%;
  font-family: Roboto;
  font-size: 12px;
  font-weight: normal;
  letter-spacing: normal;
  text-align: center;
  line-height: 20px;
  color: #fff;
  margin: 10px auto;
}

.sub-tab-iner {
  font-family: Roboto;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.71;
  letter-spacing: normal;
  text-align: left;
  color: #999999;
  margin-right: 4px;
}

.sub-tab-iner .ref-date {
  color: #414042;
  font-size: 16px;
  line-height: 1.38;
}

.sub-tab-iner p {
  font-size: 18px;
  font-weight: 500;
  color: #414042;
  margin-bottom: 0;
}

.sub-tab-iner .progress-point {
  padding-bottom: 6px;
}

.held-txt {
  font-size: 16px !important;
  color: #999999 !important;
  font-weight: 300 !important;
  font-family: Roboto;
}

.expires-txt {
  font-family: Roboto;
  font-size: 12px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.17;
  letter-spacing: normal;
  text-align: left;
  color: #3c4b5f;
}

.accordion_content {
  display: none;
  position: relative;
}

.accordion_content:after {
  content: "";
  border-top: 1px solid #e3e3e3;
  position: absolute;
  top: -14px;
  width: 100%;
}

.accordion-content-wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 46px;
  padding-top: 20px;
}

.accordion-content-wrap .details-txt {
  max-width: 174px;
  width: 100%;
}

.accordion-content-wrap .details-txt span {
  margin-bottom: 12px;
}

.logout-pop {
  top: 34%;
  border: none;
}

.check-point {
  display: block;
  text-align: center;
  background-color: #aed140;
  max-width: 32px;
  height: 32px;
  width: 100%;
  padding-top: 5px;
  border-radius: 50%;
}

.check-point i {
  color: #ffffff;
}

.dotted-cricle {
  border: 2px dotted #ffc000;
  max-width: 32px;
  height: 32px;
  border-radius: 50%;
  display: block;
  padding-top: 5px;
  text-align: center;
}

.grey-circle {
  border: solid 1px #b5bbc3;
  max-width: 32px;
  height: 32px;
  border-radius: 50%;
  display: block;
  padding-top: 5px;
  text-align: center;
}

.details-txt p {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  text-align: left;
  color: #666666;
  margin: 0;
}

.sub-date {
  font-size: 11px !important;
  font-weight: 400;
  color: #999999;
}

.light-grey {
  color: rgba(153, 153, 153, 0.5) !important;
}

.sub-tab-iner-wrap {
  display: flex;
  align-items: center;
}

.txt-on {
  font-family: Roboto;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.25;
  text-align: left;
  color: #aed140;
  margin: 0;
}

.txt-mgleft {
  margin-left: 10px;
}

.min-txt-date {
  font-size: 14px;
  font-weight: normal;
  color: #666666;
  margin: 0;
}

.verticol-point {
  min-width: 32px;
}

.bold-txt {
  font-weight: 500;
  color: #444444;
}

.tabcontent {
  display: none;
}

.tab-point {
  position: relative;
  cursor: pointer;
}

.img-row {
  font-family: Roboto;
  font-size: 18px;
  font-weight: 500;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.33;
  letter-spacing: normal;
  text-align: left;
  color: #ffc000;
}

.pop-height {
  min-height: 123px;
  padding: 43px 20px;
}

.tick-check {
  display: none;
  position: absolute;
  top: 40px;
  right: -22px;
}

.iti--separate-dial-code .iti__selected-flag {
  background-color: unset !important;
}

.modal-body .close {
  padding: 17px 17px 0 0;
}

.textCenter {
  text-align: center;
  /* padding-top: 0; */
}

/* zoom out trip code */
.hero1 .slick-list {
  padding: 10px;
}

.hero1 .slick-next {
  transform: translate(-15px, -50%);
}

.hero1 .slick-prev {
  transform: translate(-4px, -50%) rotate(180deg);
  transform-origin: center;
  z-index: 99;
  padding-left: 8px;
}

.hero1 .slick-prev:before {
  line-height: 0.4;
}

.slick-disabled {
  visibility: hidden;
}

.zoom-out {
  cursor: pointer;
  transition: all 0.5s;
  position: relative;
  /*padding: 0 15px;*/
  border-radius: 6px;
  overflow: hidden;
}

.zoom-out img {
  /*width: 100%;
  height: 247px;*/
  object-fit: cover;
  border-radius: 6px;
  overflow: hidden;
}

.on-img-offers {
  font-family: Roboto;
  position: absolute;
  max-width: 315px;
  width: 100%;
  left: 40px;
  font-size: 14px;
  color: #eee;
  bottom: 30px;
  transition: all 0.1s;
}

.curvedBorder {
  border: 0;
}

.form-curve .formStyle {
  position: relative;
}

.form-curve .formStyle:before,
.form-curve .formStyle:after {
  width: 1px;
  height: 60px;
  background: #0cb7e6;
  content: "";
  position: absolute;
  left: 50px;
  z-index: 999;
}

.form-curve .formStyle:before {
  top: -71px;
  transform: rotate(-5deg);
  left: 170px;
  height: 70px;
}

.form-curve .formStyle:after {
  bottom: -63px;
  transform: rotate(30deg);
  height: 68px;
}

.zoom-out:hover {
  transform: scale(1.08);
  transform-origin: center;
  z-index: 999;
}

.on-img-offers .main-offer {
  font-size: 18px;
  line-height: 1.33;
  color: #f6f6f6;
  display: block;
}

.on-img-offers .text-orange {
  color: #ffc000;
  padding-top: 4px;
  display: block;
}

.on-img-offers .lucky-offer {
  line-height: 1.25;
  display: block;
  padding-top: 5px;
}

.on-img-offers .points {
  line-height: 1.75;
  padding-top: 5px;
  display: block;
}

.on-img-offers .points strong {
  font-size: 17.5px;
  font-family: RupeeForadian;
  font-weight: bold;
}

/* End zoom out trip code */

.hero2 .slick-next {
  transform: translate(-15px, -50%);
}

.hero2 .slick-prev {
  transform: translate(-4px, -50%) rotate(180deg);
  transform-origin: center;
  padding-left: 8px;
  z-index: 99;
}

.hero2 .slick-prev:before {
  line-height: 0.6;
}

.hero-slick-slider2 {
  padding-top: 58px;
  padding-bottom: 58px;
}

.hero2 .slick-list {
  padding: 10px;
}

.hero2 .hero-slide .header-content {
  left: 47px;
  bottom: 28px;
  font-family: Roboto;
}

.hero3 .slick-next {
  transform: translate(-15px, -50%);
}

.hero3 .slick-prev {
  transform: translate(-4px, -50%) rotate(180deg);
  transform-origin: center;
  padding-left: 8px;
  z-index: 99;
}

.hero3 .slick-prev:before {
  line-height: 0.6;
}

.hero-slick-slider3 {
  padding-top: 58px;
  padding-bottom: 58px;
}

.hero3 .slick-list {
  padding: 10px;
}

.hero3 .hero-slide .header-content {
  left: 47px;
  bottom: 28px;
  font-family: Roboto;
}

.zoom-goods:hover .offers-on-slide {
  bottom: 35px;
}

.offers-on-slide {
  font-size: 12px;
}

.zoom-goods:hover .know-slide-btn {
  bottom: 0;
}

.hero-slide .lock-unlock-section {
  position: absolute;
  top: 16px;
  left: 4px;
}

.hero-slide .lock-unlock-section .aligns {
  display: flex;
  align-items: baseline;
  padding: 6px 16px 5px;
  border-radius: 16px;
  position: relative;
  left: 14px;
}

.hero-slide .lock-unlock-section .aligns img {
  height: auto;
  width: auto;
  border-radius: 0;
}

.hero-slide .lock-unlock-section .aligns span {
  padding-left: 8px;
  font-size: 14px;
}

.hero-slide .lock-unlock-section .lock {
  background: #cccccc;
}

.hero-slide .lock-unlock-section .lock span {
  color: #666666;
}

.hero-slide .lock-unlock-section .unlock {
  background: #ffffff;
}
.hero-slide .lock-unlock-section .unlocks {
  background: #0ec1eb;
}


.hero-slide .lock-unlock-section .unlock span {
  color: #aed140;
}

.hero-slide .lock-unlock-section .unlocks span {
  color: #ffffff;
}

.hero-slide .lock-unlock-section .exc-offr {
  font-size: 14px;
  background: #fff;
  color: #ffc000;
  font-weight: 500;
  position: relative;
  left: 14px;
}

.zoom-goods {
  cursor: pointer;
  transition: all 0.5s;
  position: relative;
  padding: 0 14px;
  border-radius: 5px;
  overflow: hidden;
}

.zoom-goods img {
  width: 100%;
  height: 360px;
  object-fit: cover;
  border-radius: 5px;
  overflow: hidden;
}

.zoom-goods:hover {
  transform: scale(1.08, 1.05);
  transform-origin: center;
  z-index: 999;
}

.dubai {
  font-size: 24px;
  font-weight: 800;
  color: #414042;
}

.threeNight {
  font-size: 16px;
  color: #414042;
  line-height: 2;
}

.singapore {
  font-size: 16px;
  color: #ffc000;
}

.hfrpPointslp1 {
  margin-left: 15px;
}

.borderStar {
  display: inline-flex;
  align-items: center;
  border: 1px solid #0cb7e6;
  border-radius: 5px;
  box-shadow: 0px 5px 12.8px 2.3px rgba(0, 0, 0, 0.05);
}

.knowMorebtnCancel {
  background-color: #cccccc !important;
  color: white;
}

.placeBookingRequest {
  background-color: #f8992c !important;
  color: white;
}

.knowMoreleftPadding {
  padding-left: 0px !important;
}

.modalBodyPadding {
  padding: 50px 40px;
}

.custom-modal {
  transform: translate(-50%, 101%);
  position: fixed;
  left: 50%;
  width: 100%;
  z-index: 9999;
  background: #fff;
  bottom: 0;
  transition: transform 1s;
  box-shadow: 0 0 27px 3px rgba(0, 0, 0, 0.1);
}




.custom-modal.loaded {
  transform: translate(-50%, 0);
}
.swiggyCard {
  width: 431px;
  height: 282px;
  /* background: #000000 0% 0% no-repeat padding-box; */
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  cursor: pointer;
}
.swiggyCard img {
  /* max-width: 450px; */
  /* transition: 0.3s ease all; */
  margin-top: -40px;
  align-items: center;
  width: 250px;
}


.swiggybtn {
  position: absolute;
  color: black;
  margin-top: 260px;
}

.swiggySection{
  text-align: center;
}
.popupfixedbg,.knowmoreBg{
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background: rgba(0,0,0,0.2);
  z-index: 999999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: 0.3s ease all;
}
.brands-slider.slick-slider.fullwidthpopup .slick-track,
 .brands-slider.slick-slider.fullwidthpopup .slick-list{
  transform: none !important;
}
.brands-slider-item{
  max-width: 250px;
  margin: 0 auto;
}
.brands-slider-item img{
  width:100%;
}
.brands-slider .slick-track{
  display: flex;
  align-items: center;
}
.brands-slider.slick-slider{
  max-width: 100%;
  margin: 0 auto;
  padding-bottom: 100px;
}
.swiggyCard:hover img{
  transition: 0.3s ease all;
  transform: scale(1.3);
}
.popupfixedbg.popshow{
  opacity: 1; 
  visibility: visible;
}
.brandpopshow .popupfixedbg{
  opacity: 1;
  visibility: visible;
}
.brands-slider .slick-dots{
  left: 50%;
  bottom: -40px;
  transform: translateX(-50%);
  max-width: 170px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.container-popup{
  background: #F6F6F6;
  padding: 30px;
  position:relative;
  /*max-width: 1100px;*/
}
.scrollSection small,.scrollSection2 small{  
   display:block;
   color:#A7A7A7;
}
.scrollSection{
   min-height: 270px;
   height: 100%;
   overflow: auto;
   max-height: 210px;
   padding-bottom: 30px;
  }
.headsect{
  display:flex;
  align-items:center;
  padding-bottom:30px;
}
.headsect img{
  max-width: 120px;
}
.headsect h3{
  font-size:22px;
  font-weight:700;
  /* max-width: 500px; */
  padding-left: 30px;
  text-align: left;
}
.howToRedeem{
  display:flex;
  /* justify-content: flex-start; */
  justify-content: flex-start;
  padding-bottom:15px;
  align-items: center;
}
.brands-slider h4{  
  font-size:20px;
  font-weight:700;
  text-align: left;
}
.scrollSection li{
  background:#fff;
  list-style-type: none;
  margin-bottom: 10px;
  padding:12px 16px;
  text-align: left;
}
.scrollSection ul{
  /*max-height: 240px;*/
  overflow: auto;
  padding-left:0;
}

.scrollSection2{
  max-height: 240px;
  overflow: auto;
  padding-bottom: 40px;
}
.scrollSection2 ul{
  max-height: 100%;
  overflow: initial;
  padding-left: 0;
}

.swiggySection h2+small {
  padding-bottom: 20px;
  display: block;
  font-size: 16px;
  font-weight: 400;
}
.swiggySection h2 {
  font-size: 30px;
  font-weight: 700;
  font-size: 30px;
  color: #414042;
  line-height: 1.2;
  font-family: 'Roboto';
}
.okbtnwrapp .availbtn{
  text-transform: uppercase;
  background: #f8992c;
  padding: 6px 8px;
  display: inline-block;
  color: #fff;
  border-radius: 5px;
  padding-right:15px;
  cursor:pointer;
}
.okbtnwrapp .okbtnuse{
  text-transform: uppercase;
  background: #f8992c;
  padding: 6px 8px;
  display: inline-block;
  color: #fff;
  border-radius: 5px;
  padding-right:15px;
  cursor:pointer;
}
.okbtnwrapp{
  text-align:center;
  background:#fff;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  box-shadow: 0px -3px 13px #0000001c;
  padding: 13px 0;
}
.okbtnwrapp1 .enrolbtn{
  text-transform: uppercase;
  background: #f8992c;
  padding: 6px 8px;
  display: inline-block;
  color: #fff;
  border-radius: 5px;
  padding-right:15px;
  cursor:pointer;
}

.okbtnwrapp1{
  text-align:center;
  background:#fff;
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  box-shadow: 0px -3px 13px #0000001c;
  padding: 13px 0;
}
.copyCode{
  /* font-size:16px;
  color:#00B6E3;
  position:relative;
  font-weight:700;
  cursor:pointer; */
  font-size: 16px;
  color: #00B6E3;
  position: relative;
  font-weight: 700;
  cursor: pointer;
  display: block;
  line-height: 1;
  margin-left: 20px;
}
.howToRedeem h6{
    font-weight: 700;
   }
.copyCode i{
  width: 15px;
  border: 2px solid #00B6E3;
  border-radius: 2px;
  height: 20px;
  display: inline-block;
  margin-left: 15px;
  position: relative;
}
.brands-slider-item{
     max-width: 100%;
     padding:0 30px;
 }
.copyCode i:before,
.copyCode i:after{
  content: '';
  width: 2px;
  height: 20px;
  position: absolute;
  left: -6px;
  top: 2px;
  background: #00B6E3;
  border-radius: 2px;
}
.copyCode i:after{
  height: 2px;
  width: 16px;
  left: -6px;
  bottom: -6px;
  top: auto;
}

.tickerBlock { position: absolute; top: 0px; left: 0px; background: #aed13f; height: 35px; border-bottom-left-radius: 5px; border-bottom-right-radius: 5px; z-index: 9;} 
.row.earn-ref-rew-form-wrap{position: relative; padding-top:20px;}
.tickerBlockInner label span { width: 15px; height: 15px; border-radius: 50%; line-height: 13px; text-align: center; display: inline-block; background: #3b4a5f; color: #fff; margin-right: 5px; }
.tickerBlock .tickerBlockInner {
  position: relative;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-align: center;
  -moz-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
  align-items: center;
  height: inherit;
  padding: 0 10px;
  }
  .tickerBlock .tickerBlockInner label {
  font-size: 14px;
  white-space: nowrap;
  padding-right: 5px;
  margin-right: 5px;
  color: #3b4a5f;
  border-right: 1px solid rgba(155, 155, 155, 0.46);
  line-height: 1.2;
  padding-top: 7px;
  
  }
  .tickerBlock .tickerBlockInner p {
  font-size: 14px;
  line-height: 1.2;
  margin: 0;
  padding: 0;
  font-weight: 500;
  }
  .tickerBlock2 {
    width: 100%;
    background: #aed13f;
    height: 32px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-top: 60px;
    }
    .tickerBlockInner2 label span {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    line-height: 15px;
    text-align: center;
    display: inline-block;
    background: #3b4a5f;
    color: #fff;
    margin-right: 5px;
    }
    .tickerBlock2 .tickerBlockInner2 label {
    font-size: 14px;
    white-space: nowrap;
    padding-right: 5px;
    margin-right: 5px;
    color: #3b4a5f;
    border-right: 1px solid rgba(155, 155, 155, 0.46);
    line-height: 1.2;
    padding-top: 7px;
    
    }
    .tickerBlock2 .tickerBlockInner2 {
    position: relative;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-align: center;
    -moz-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    height: inherit;
    padding: 0 10px;
    }
    .tickerBlock2 .tickerBlockInner2 p {
    margin-top: 10px;
    font-size: 14px;
    text-align: center;
    -ms-flex-align: center;
    padding-top: 7px;
    font-weight: 500;
    }

@media (max-width: 1024px) {
  .custom-modal .own-container {
    position: sticky;
    height: 100vh;
    overflow: scroll;
  }
  /* .brands-slider-item{
    max-width: 190px;
  } */
}

.custom-modal .close {
  display: none;
  top: 30px;
  right: 30px;
  font-size: 0;
  width: 30px;
  height: 30px;
  cursor: pointer;
  position: absolute;
  z-index: 99999;
  text-decoration: none;
}

.close img {
  width: 30px;
  height: 30px;
  top: 50%;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
  object-fit: cover;
}

.knowmore .modal-dialog {
  top: calc(100% - 300px);
  width: 100%;
  max-width: 100%;
}

.modalBodyPadding {
  padding: 3rem;
  margin-bottom: -59px;
}

.modal-header {
  border-bottom: 0px solid #e9ecef;
  padding: 29px 29px 0 0;
}

.trips-dest .cancel-place-book-btn {
  display: flex;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.53;
  margin-top: 52px;
}

.trips-dest .cancel-place-book-btn .cancel {
  background: #ccc;
  box-shadow: 0 0 27px 3px rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  padding: 16px 30px;
  color: #fff;
  text-decoration: none;
  margin-right: 10px;
}

.trips-dest .cancel-place-book-btn .cancel:hover {
  color: black;
}

.trips-dest .cancel-place-book-btn .place-book {
  background: #f8992c;
  padding: 16px 30px;
  border-radius: 3px;
  border: solid 1px #f8992c;
  color: #fff;
  text-decoration: none;
}

.trips-dest .cancel-place-book-btn .place-book:hover {
  color: black;
}

.knowMoreModalContent {
  padding: 40px 0;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  font-family: Roboto;
  justify-content: space-between;
}

.knowMoreModalContent .incl-excl-wrap {
  display: flex;
  justify-content: space-between;
}

.knowMoreModalContent .del-section {
  font-size: 14px;
  color: #999999;
  font-weight: 500;
  line-height: 1.71;
  padding-left: 40px;
  padding-top: 40px;
  max-width: 470px;
  width: 100%;
  background: #fafafa;
}

.knowMoreModalContent .del-section a {
  text-decoration: none;
  color: #f8992c;
  font-size: 14px;
  font-weight: 500;
  max-width: 180px;
  width: 100%;
  line-height: 1.75;
  margin-top: 12px;
  display: block;
}

.knowMoreModalContent .del-section .del {
  max-width: 350px;
  width: 100%;
  font-size: 16px;
  line-height: 1.5;
  color: #444;
  padding-top: 16px;
  padding-bottom: 28px;
}

.knowMoreModalContent .del-section .del-mail {
  padding-bottom: 0;
}

.knowMoreModalContent .pic-section {
  max-width: 270px;
  width: 100%;
}

.knowMoreModalContent .pic-info {
  padding-top: 20px;
  padding-left: 10px;
  max-width: 370px;
  width: 100%;
}

.knowMoreModalContent .pic-info .pic-product {
  color: #414042;
  line-height: 1.64;
  max-width: 320px;
  width: 100%;
  margin-bottom: 68px;
}

.knowMoreModalContent .pic-info .pic-product .pic-name {
  font-size: 24px;
  font-weight: bold;
}

.knowMoreModalContent .pic-info .pic-product .pic-des {
  font-size: 18px;
}

.trips-dest .borderStar .points-wrapper,
.pic-info .borderStar .points-wrapper {
  padding: 22px 50px 19px 20px;
}

.trips-dest .borderStar .star-section,
.pic-info .borderStar .star-section {
  padding-left: 30px;
}

.trips-dest .borderStar .points-wrapper .hfrpPoints,
.pic-info .borderStar .points-wrapper .hfrpPoints {
  font-size: 14px;
  color: #666666;
  line-height: 1.71;
  font-weight: normal;
}

.trips-dest .borderStar .points-wrapper .exact-points,
.pic-info .borderStar .points-wrapper .exact-points {
  font-size: 20px;
  font-weight: 500;
  color: #ffc000;
  line-height: 1.71;
}

.pic-info .cancel-place-btn {
  display: flex;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.53;
  margin-top: 52px;
}

.pic-info .cancel-place-btn .cancel {
  background: #ccc;
  box-shadow: 0 0 27px 3px rgba(0, 0, 0, 0.1);
  border-radius: 3px;
  padding: 16px 30px;
  color: #fff;
  text-decoration: none;
  margin-right: 10px;
}

.pic-info .cancel-place-btn .place-order {
  background: #f8992c;
  padding: 16px 33px;
  border-radius: 3px;
  border: solid 1px #f8992c;
  color: #fff;
  text-decoration: none;
}

.pic-info .cancel-place-btn .cancel:hover,
.pic-info .cancel-place-btn .place-order:hover {
  color: black;
}

.modalBodyPadding {
  padding: 0rem;
}

.placeBookingRequest {
  margin-left: -90px;
}

.inclusions ul li::before,
.exclusions ul li::before {
  content: "\2022";
  color: #0cb7e6;
  font-weight: bold;
  width: 1em;
  margin-left: -1.15em;
  border-radius: 50%;
  vertical-align: text-top;
  margin-right: 14px;
  font-size: 18px;
}

.inclusions ul,
.exclusions ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.knowMoreModalContent .inclusions,
.knowMoreModalContent .exclusions {
  max-width: 370px;
  width: 100%;
  padding: 40px 46px 0 40px;
  background: #fafafa;
}

.knowMoreModalContent .trips-dest {
  max-width: 370px;
  width: 100%;
  padding-top: 20px;
  padding-left: 10px;
}

.trips-dest .trip-dest-off {
  color: #414042;
  line-height: 1.64;
  font-size: 18px;
  margin-bottom: 42px;
}

.trips-dest .trip-dest-off .trip-destination {
  font-size: 24px;
  font-weight: bold;
}

.trips-dest .trip-dest-off .destinations-off {
  line-height: 1.5;
  color: #ffc000;
}

.modalMargin {
  margin-top: 20px;
  margin-bottom: 0;
}

.testBullets {
  list-style-type: none;
  font-size: 14px;
  font-weight: normal;
  color: #3c4b5f;
  line-height: 18px;
  font-family: Roboto;
  padding: 4px 0;
}

.inc {
  color: #999999;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.71;
}

.redemp-history {
  margin-bottom: 76px;
}

.redemp-main-wrap {
  padding: 20px 30px;
  border-radius: 5px;
  box-shadow: 0px 5px 12.8px 2.3px rgba(0, 0, 0, 0.05);
  background-color: #fbfbfb;
  font-family: Roboto;
  display: flex;
}

.rcv-points {
  border: 1px solid #e54c4c;
}

.earned-points {
  border: 1px solid #ffc000;
}

.redemp-main-wrap + .redemp-main-wrap {
  margin-top: 2px;
}

.redemp-main-wrap .mob-showing {
  display: none;
}

.redemp-main-wrap .first-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #999;
  font-size: 14px;
  width: 60%;
}

.redemp-main-wrap .first-wrap .icons-text {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 432px;
  width: 100%;
  margin-right: 14px;
}

.redemp-main-wrap .first-wrap .ref-no {
  display: flex;
  flex-direction: column;
  max-width: 126px;
  width: 100%;
}

.redemp-main-wrap .first-wrap .ref-no span:last-child {
  font-size: 16px;
  color: #414042;
}

.redemp-main-wrap .first-wrap .icons-text img {
  width: 60px;
  height: 60px;
  margin-right: 10px;
}

.earned-points .first-earn .earn-img {
  padding: 10px;
  margin-right: 10px;
}

.earned-points .first-earn .earn-img img {
  height: 40px;
  width: 40px;
  margin-right: 0;
}

.redemp-main-wrap .text-voucher {
  display: flex;
  align-items: flex-end;
  max-width: 342px;
  width: 100%;
  justify-content: space-between;
}

.redemp-main-wrap .points-convers {
  color: #e54c4c;
  font-size: 18px;
}

.redemp-main-wrap .points-earned {
  color: #ffc000;
  font-size: 18px;
  font-weight: 500;
}

.redemp-main-wrap .e-voucher a {
  text-decoration: none;
  color: #0cb7e6;
  padding: 5px 12px 6px 11px;
  border: 1px solid #0cb7e6;
  border-radius: 16px;
  font-size: 12px;
  transition: all 200ms;
}

.redemp-main-wrap .e-voucher a:hover {
  color: white;
  background: #0cb7e6;
}

.redemp-main-wrap .icons-text .icon-info {
  display: flex;
  flex-direction: column;
}

.redemp-main-wrap .icons-text .icon-info span:last-child {
  font-weight: 500;
  color: #414042;
  font-size: 18px;
}

.redemp-main-wrap .second-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #999;
  font-size: 14px;
  width: 40%;
  padding-left: 34px;
}

.redemp-main-wrap .earn-arrange {
  padding-right: 10px;
}

.redemp-main-wrap .second-wrap .redump,
.redemp-main-wrap .second-wrap .progress-info {
  display: flex;
  flex-direction: column;
}

.redemp-main-wrap .earn-arrange .onboard {
  max-width: 180px;
  width: 100%;
}

.redemp-main-wrap .second-wrap .redump span:last-child {
  font-size: 16px;
  color: #414042;
}

.redemp-main-wrap .second-wrap .amount {
  color: #414042;
  font-size: 20px;
  font-weight: 500;
}

.redemp-main-wrap .second-wrap .progress-info {
  font-size: 14px;
  color: #3c4b5f;
}

.redemp-main-wrap .second-wrap .progress-info .status {
  font-size: 12px;
  color: white;
  padding: 4px 7px;
  text-decoration: none;
  border-radius: 12px;
  margin-bottom: 4px;
  text-align: center;
}

.redemp-main-wrap .second-wrap .progress-info .cancel {
  background: #e54c4c;
}

.redemp-main-wrap .second-wrap .progress-info .done,
.redemp-main-wrap .second-wrap .progress-info .disp {
  background: #aed140;
}

.redemp-main-wrap .second-wrap .progress-info .in-prog {
  background: #ffc000;
}
/* mohan css code for blink aninmation */
.animated{
  /* animation-name: blink;
  animation-duration: 1s; */
  animation: blink 1s 4;
}
.speed{
  transition-delay: 1s;
  transition-duration: 3s;
  transition-timing-function:ease-in-out;
}

@keyframes blink {
  0%   {box-shadow: rgb(245 139 29 / 59%) 0px 2px 4px 0px, rgb(241 162 11 /        89%) 0px 2px 16px 0px;}   
  100% {box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset;}
}
/*  */
@media (max-width: 1024px) {
  /* mohan css code for refer friend brd  */
  .bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
    text-align: center;
    padding: 12px 0;
    margin-left: 45px;
    /* margin-bottom: 110px; */
}
  .discription.form-you-tube-btn-main {
    bottom: 0;
    position: relative;
    margin-bottom: 75px;
    margin-left: -827px;
    }

a#videobtn.margin-top-refer-form {
  margin-top: 35px;
  width: 100%;
  margin-left: 60px;
}
span.refer-friend-text {
  display: inline-block;
  position: relative;
  margin-left: -95px;
}
#videobtn img.form-you-tube-logo {
  width: 3.5% !important;
  min-height: auto;
}
  /* css code end */
  .slick-dots {
    left: 15px;
    transform: translateX(0);
  }

  .hero1 .slick-next {
    transform: translate(5px, -50%);
  }

  .hero2 .slick-next {
    transform: translate(-15px, -50%);
  }

  .hero3 .slick-next {
    transform: translate(-15px, -50%);
  }

  .modal-dialog {
    margin: 20px;
  }

  .hero-slide .banner-content-wrapper .slider-content {
    max-width: 640px;
    width: 100%;
  }

  .banner-content-wrapper .slider-content .discription {
    padding-top: 120px;
  }

  .form-container .termsConditionStyle {
    justify-content: center;
    padding: 20px 0;
    max-width: 100%;
    margin-left: 0;
  }

  .mobile-menu {
    display: block;
    max-width: 200px;
    width: 100%;
    position: absolute;
    right: 0;
    top: 69px;
  }

  .centre-side {
    display: none;
  }

  .mobile-menu a {
    text-align: left;
    font-size: 15px;
  }

  .icon1 i {
    color: darkgray;
  }

  .right-side a:not(:first-child) {
    display: block;
    padding: 0 5px;
  }

  .ryf {
    font-size: 17px;
  }

  .hero .hero-slide img {
    width: 100vw;
    height: auto;
    object-position: left center;
  }

  .hero-slide .banner-content-wrapper {
    display: block;
    top: 50%;
  }

  .form-section {
    z-index: 999;
    position: relative;
    display: block;
    left: 50%;
    transform: translateX(-50%);
  }

  .form-curve {
    width: 100%;
  }

  .form-curve .form-section {
    left: inherit;
    transform: inherit;
    top: inherit;
    position: static;
  }

  .form-container {
    background: #f6f6f6;
    padding-top: 56px;
  }

  .form-container .formStyle {
    margin: 0 auto;
  }

  .formRow {
    margin-top: 10px !important;
    display: flex;
    padding-bottom: 20px;
    align-items: center;
  }

  .welcome-lbl {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    flex: 0 0 54% !important;
    max-width: 55%;
  }

  .btnStyle {
    display: block;
    margin: 8% auto;
  }

  .btn-welcome {
    padding-bottom: 10px;
  }

  .up-arrow {
    display: block;
    position: relative;
  }

  .up-arrow:after {
    content: "";
    display: block;
    position: absolute;
    right: 16px;
    width: 0;
    height: 0;
    border-bottom: 10px solid darkgray;
    border-top: 10px solid transparent;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    top: -26px;
  }

  .arrowDown {
    display: none;
  }

  .top-img-welcome {
    margin-left: 20px;
  }

  .welcome-lbl input {
    width: 100%;
  }

  .mobmarginbtm input {
    width: 100%;
  }

  .bg-color-form {
    background-color: #f6f6f6;
    width: auto;
    margin-left: -40px;
  }

  .bootm-border:after {
    width: calc(100% - -50px);
    left: -25px;
  }

  .knowMoreModalContent {
    flex-direction: column-reverse;
    padding: 0 60px;
  }

  .knowMoreModalContent .incl-excl-wrap {
    flex-direction: column;
  }

  .iner-tab-view {
    width: 994px;
    overflow-x: auto;
    max-width: 100%;
    /* Added Exclusive Unlock 22 March Start */
    padding-bottom: 15px;
    text-align: center;
    /* Added Exclusive Unlock 22 March End */
  }

  .iner-wrap-tab {
    width: 994px;
    overflow-x: auto;
  }
  .scrollSection ul{
        padding-left:0;
      }
  .earn-ref-rew-form-wrap {
    justify-content: center;
  }

  .curvedBorder {
    padding-bottom: 44px;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    justify-content: center;
  }

  .earn-upper-wrapper > div,
  .suc-pro-container > div {
    flex-shrink: 0;
  }

  .giveStyle {
    padding-top: 56px;
  }

  .form-curve .formStyle:before,
  .form-curve .formStyle:after {
    height: 0;
    width: 0;
  }

  .offers-on-slide {
    position: relative;
    bottom: 0;
  }

  .know-slide-btn {
    position: relative;
    bottom: 0;
  }

  .zoom-out:hover .offers-on-slide {
    bottom: 0;
  }

  .zoom-out:hover .know-slide-btn {
    bottom: 0;
  }

  .zoom-goods:hover .offers-on-slide {
    bottom: 0;
  }

  .close {
    display: block;
  }

  .knowMoreModalContent .inclusions,
  .knowMoreModalContent .exclusions {
    margin-bottom: 16px;
    max-width: 100%;
    padding-bottom: 20px;
  }

  .knowMoreModalContent .trips-dest {
    max-width: 100%;
    padding-top: 40px;
    padding-left: 40px;
    margin-bottom: 40px;
  }

  .knowMoreModalContent .del-section {
    max-width: 100%;
    margin-bottom: 18px;
  }

  .knowMoreModalContent .pic-section {
    max-width: 100%;
    padding-left: 40px;
    margin-bottom: 18px;
  }

  .knowMoreModalContent .pic-info {
    max-width: 100%;
    padding-left: 40px;
    margin-bottom: 30px;
    padding-top: 40px;
  }
}

@media (max-width: 992px) {
  .hero1 .slick-next {
    transform: translate(-15px, -50%);
  }

  .hero2 .slick-next {
    transform: translate(5px, -50%);
  }

  .hero3 .slick-next {
    transform: translate(5px, -50%);
  }

  .voucherSectionModified .row + .row {
    margin-top: 0;
  }

  .voucherSectionModified {
    padding-bottom: 60px !important;
  }

  .wrapper {
    width: 100%;
  }

  .formStyle {
    right: 97%;
  }

  .form-curve .formStyle {
    right: 0;
  }

  .earn-ref-rew-form-wrap {
    justify-content: center;
  }

  .redemp-main-wrap {
    flex-direction: column;
    padding: 16px 24px;
  }

  .redemp-main-wrap .first-wrap {
    width: 100%;
  }

  .redemp-main-wrap .first-wrap .icons-text {
    max-width: 100%;
  }

  .redemp-main-wrap .text-voucher {
    max-width: 100%;
    justify-content: space-around;
  }

  .redemp-main-wrap .second-wrap {
    width: 100%;
    padding-left: 0;
    margin-top: 16px;
  }

  .rcv-points {
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .rcv-points .first-wrap {
    width: 60%;
  }

  .rcv-points .second-wrap {
    width: 40%;
  }

  .rcv-points .rcv-arrange {
    justify-content: flex-end;
    margin-top: 0;
  }

  .rcv-points .first-rcv {
    width: 90%;
  }

  .rcv-points .icons-text {
    margin-right: 0;
  }

  .rcv-points .points-convers {
    margin-right: 0;
  }

  .earned-points {
    display: flex;
    flex-direction: row;
    align-items: center;
  }

  .earned-points .earn-arrange {
    margin-top: 0;
    padding-right: 0;
    padding-left: 10px;
  }

  .earned-points .earn-arrange .onboard {
    max-width: fit-content;
  }
}
@media (max-width: 912px) {
  a#videobtn.margin-top-refer-form {
      margin-top: 46px;
      width: 100%;
      margin-left: 114px;
  }
}
@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {
  .ipadStyle {
    margin-left: 120px !important;
  }

  .widthIframe {
    width: 100% !important;
  }

  .hero1 .slick-slide img {
    display: block;
    width: 100% !important;
  }

  .hero2 .slick-slide img {
    display: block;
    width: 100% !important;
  }

  .hero3 .slick-slide img {
    display: block;
    width: 100% !important;
  }

  .box .inner {
    background-color: #fff;
    text-align: left;
    padding: 16px;
  }

  .d-block {
    display: block !important;
    font-size: 15px;
  }

  .hero-text h2 {
    margin-bottom: 50px;
    font-size: 10px;
  }

  .knowmore .modal-dialog {
    top: 0px;
  }

  .modalBodyPadding {
    padding: 0rem;
  }

  .borderStar {
    max-width: 90%;
  }

  .hfrpPoints {
    margin-left: 0px;
  }

  .knowMorePlaceBookingRequest {
    margin-top: 66px;
    margin-left: -56px;
    font-size: 16px;
  }

  .placeBookingRequest {
    margin-top: 66px;
    margin-left: -56px;
    font-size: 16px;
  }

  .btn-locked {
    font-size: 16px;
  }
}
/* mohan css code for refer a friend brd */
@media (max-width: 820px) {
  .bg-color-form .bg-form .welcome-lbl.welcome-id-top {
    position: relative;
    top: -33px;
}
.bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
  text-align: center;
  padding: 12px 0;
  margin-bottom: 62px;
  margin-left: 40px;
}
.discription.form-you-tube-btn-main {
  bottom: 0;
  position: relative;
  margin-bottom: 35px;
  margin-left: -638px;
}
a#videobtn.margin-top-refer-form {
  margin-top: 18px;
  width: 100%;
  margin-left: 65px;
}
}

/*  */
@media (max-width: 810px) {
  .knowMoreModalContent .inclusions,
  .knowMoreModalContent .exclusions {
    margin-bottom: 10px;
    padding-bottom: 14px;
  }

  .knowMoreModalContent .trips-dest {
    padding-left: 20px;
  }

  .knowMoreModalContent .del-section {
    margin-bottom: 10px;
    padding-bottom: 12px;
  }

  .knowMoreModalContent .pic-section {
    margin: 10px 0;
  }

  .knowMoreModalContent .pic-info {
    padding-left: 40px;
    max-width: 470px;
    width: 100%;
    margin-top: 10px;
  }
}

@media (max-width: 768px) {
  /* mohan css brd */
  .bg-color-form .bg-form .welcome-lbl.welcome-id-top {
    position: relative;
    top: -36px;
}
  .bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
    text-align: center;
    padding: 12px 0;
    margin-bottom: 80px;
    margin-left: 50px;
}
  .discription.form-you-tube-btn-main {
    bottom: 0;
    position: relative;
    margin-bottom: 0px;
    margin-left: -600px;
}
a#videobtn.margin-top-refer-form {
  margin-top: 18px;
  width: 100%;
  margin-left: 58px;
}
  /* end css */
  .hero .hero-slide .header-content {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    /* margin: 0 auto; */
  }

  .hero-text .hero .hero-slide a {
    padding-top: 0.8rem;
  }

  .hero-text .hero .hero-slide a span {
    font-size: 20px;
    margin-top: 0.5rem;
  }

  .hero .hero-slide .header-content {
    left: 10%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    /* margin: 0 auto; */
  }

  @-webkit-keyframes fadeInUpSD {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
    }

    100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }

  @keyframes fadeInUpSD {
    0% {
      opacity: 0;
      -webkit-transform: translateY(100px);
      transform: translateY(100px);
    }

    100% {
      opacity: 1;
      -webkit-transform: none;
      transform: none;
    }
  }

  .fadeInUpSD {
    -webkit-animation-name: fadeInUpSD;
    animation-name: fadeInUpSD;
  }
}

@media (max-width: 767px) {
  /* mohan css code for refer friend brd  */
  .bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
    text-align: center;
    padding: 12px 0;
    margin-bottom: 110px;
}
  .discription.form-you-tube-btn-main {
    bottom: 0;
    position: relative;
    margin-left: 0;
}
a#videobtn.margin-top-refer-form {
  margin-top: 18px;
  width: 100%;
  margin-left: -20px;
}
span.refer-friend-text {
  display: block;
  position: relative;
  margin-left: -54px;
}
#videobtn img.form-you-tube-logo {
  width: 6% !important;
  min-height: auto;
}
  /* css code end */

  #myModalCongrats {
    width: 90vw;
    max-width: 100%;
  }
  .scrollSection ul{
    padding-left:0;
  } 
  .congratsModalContent .congrats {
    padding: 0 40px 38px;
  }

  .hero1 .slick-next {
    transform: translate(5px, -50%);
  }

  .silder-title {
    margin: 0;
    padding: 0;
  }

  .hero .hero-slide .header-content {
    padding: 10px;
  }

  .rigth-side-sub a {
    max-width: 200px;
    width: 100%;
    line-height: 20px;
  }

  .rigth-sub-txt a {
    font-size: 12px;
  }

  .clearfix.float-my-children.heart-img {
    display: none;
  }

  .left-side-logo a {
    padding: 0;
  }

  .left-side-logo a img {
    margin-top: 2px;
    min-width: 52px;
    width: 100%;
  }

  .rigth-side-sub .bell-icon img {
    min-width: 16px;
    width: 100%;
    margin: 0 !important;
    height: 20px !important;
  }

  .clearfix.float-my-children {
    max-width: 165px;
    width: 100%;
  }

  .clearfix.float-my-children .blue-txt {
    font-size: 12px;
  }

  /* .topnav {
    height: 60px MC;
  } 
  .topnav {
       height: 60px;
     }*/
  .mobile-menu {
    top: 60px;
  }

  .clearfix.float-my-children.bell-icon {
    display: none;
  }

  .mob-resp {
    display: flex;
    flex-direction: column;
    margin-bottom: 20px;
  }

  .btnStyle {
    margin: 8% auto;
    display: block;
  }

  .welcome-lbl {
    flex: 0 0 100% !important;
  }

  .welcome-lbl input {
    width: 100%;
    background-color: unset;
  }

  .container-fluid {
    padding: 0 !important;
  }

  .mob-resp input {
    width: 100%;
  }

  .bootm-border:after {
    width: calc(100% - -9px);
    left: -4px;
  }

  .bg-form .col-sm-4 .btnStyle {
    margin: 0 auto;
    display: block;
    margin-left: 0px;
  }

  .header-logo-txt {
    flex-wrap: inherit;
    align-items: center;
  }

  .header-logo-txt div img {
    min-width: 60px;
  }

  .top-img-welcome {
    margin-left: 0;
    display: flex;
    flex-direction: column;
  }

  .top-img-welcome span {
    font-size: 15px;
  }

  .txt-top-heading {
    margin-top: 50px;
  }

  .hero .hero-slide .header-content {
    padding: 10px;
    margin-left: 114px;
    transform: translateX(-144px);
  }

  .silder-title {
    margin-bottom: 10px;
    margin-top: 10px;
  }

  .container-fluid.box-grey.card-section {
    padding: 50px 0 44px !important;
  }

  .heading-txt {
    font-size: 26px;
  }

  .offerStyle {
    margin-top: 50px;
    font-size: 26px;
    margin-bottom: 34px;
  }

  .redeem {
    margin-bottom: 34px;
  }

  .main-tab .tabs a {
    font-size: 16px;
  }

  .hero2 .slick-next {
    transform: translate(-16px, -50%);
  }

  .hero3 .slick-next {
    transform: translate(-16px, -50%);
  }

  .redemp-main-wrap + .redemp-main-wrap {
    margin: 4px;
  }
  .container-popup{
     margin:0 20px;
     padding:20px;
  }
  .headsect img{
    max-width:100px;
  }
  .headsect h3{
    font-size:18px;
  }
  .howToRedeem{
    align-items: center;
  }
  .brands-slider h4{
    font-size:17px;
    /* margin-bottom: 0; */
       margin-bottom: 10px;
  }
  .howToRedeem h4{
    font-size:17px;
    margin-bottom: 0;
  }
  .copyCode{
    display:flex;
    align-items: center;
  }
}

@media (max-width: 668px) {
  .offerStyle {
    line-height: normal;
    font-size: 20px;
  }

  .heading-txt {
    line-height: normal;
    font-size: 20px;
  }

  .giftcardStyle {
    font-size: 16px;
  }

  .mobile-form {
    flex-direction: column;
  }

  .mobile-form .col-sm-8 {
    flex: 0 0 auto;
    max-width: inherit;
  }

  .hero .hero-slide .header-content {
    left: 10%;
  }

  .iti {
    width: 100%;
  }

  .formRow .col-sm-6 input {
    width: 100%;
    margin-top: 10px;
  }

  .welcome-lbl {
    max-width: 89%;
  }

  .bg-form .col-sm-4 .btnStyle {
    margin: 10px auto;
    margin-left: 45px;
  }

  .redemp-main-wrap {
    padding: 12px 20px;
  }

  .redemp-main-wrap .first-wrap {
    font-size: 12px;
  }

  .redemp-main-wrap .first-wrap .ref-no span:last-child {
    font-size: 14px;
    color: #414042;
  }

  .redemp-main-wrap .first-wrap .icons-text img {
    width: 40px;
    height: 40px;
    margin-right: 10px;
  }

  .earned-points .first-earn .earn-img {
    padding: 5px;
  }

  .earned-points .first-earn .earn-img img {
    width: 30px;
    height: 30px;
    margin-right: 0;
  }

  .redemp-main-wrap .e-voucher a {
    padding: 4px 11px 5px 10px;
    border-radius: 12px;
    font-size: 10px;
  }

  .redemp-main-wrap .icons-text .icon-info span:last-child {
    font-size: 16px;
  }

  .redemp-main-wrap .first-wrap .ref-no {
    max-width: fit-content;
  }

  .redemp-main-wrap .second-wrap {
    font-size: 12px;
  }

  .redemp-main-wrap .second-wrap .redump span:last-child {
    font-size: 14px;
  }

  .redemp-main-wrap .second-wrap .amount {
    font-size: 18px;
  }

  .redemp-main-wrap .second-wrap .progress-info {
    font-size: 12px;
  }

  .redemp-main-wrap .second-wrap .progress-info a {
    font-size: 10px;
    padding: 4px 6px;
  }

  .redemp-main-wrap .points-convers,
  .redemp-main-wrap .points-earned {
    font-size: 16px;
  }

  .hero .hero-slide img {
    min-height: 460px;
  }

  .hero-slide figure {
    height: 460px;
  }
}
/* mohan css code */
@media screen and (max-width: 640px) {
  .bg-color-form .bg-form .welcome-lbl.welcome-id-top {
    top: -33px;
}
  .bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
    text-align: center;
    padding: 12px 0;
    margin-bottom: 68px;
}
a#videobtn.margin-top-refer-form {
  margin-top: 35px;
  width: 100%;
  margin-left: -187px;
}
}
/* end css code */

@media screen and (max-width: 600px) {
  /* refer brd css code mohan */
  .bg-color-form .bg-form .welcome-lbl.welcome-id-top {
    top: 0px;
}
  .bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
    text-align: center;
    padding: 12px 0;
    margin-bottom: 110px;
    margin-left: 8px;
}
a#videobtn.margin-top-refer-form {
  margin-top: 18px;
  width: 100%;
  margin-left: -155px;
}
span.refer-friend-blue-text {
  margin-left: -60px;
}
  /* end code */
  .hero-slide .banner-content-wrapper {
    display: block;
    top: 62%;
  }

  .banner-content-wrapper .slider-content .slider-btn {
    padding: 16px 30px;
    font-size: 16px;
  }

  .earn-upper-wrapper > div,
  .suc-pro-container > div {
    flex-shrink: 1;
  }

  .formPadding {
    padding: 14px;
  }

  .mrg-form {
    display: block;
  }

  .mrg-form .name-form {
    max-width: 100%;
    padding-bottom: 12px;
    margin-right: 0;
  }

  .mrg-form .city-form {
    max-width: 100%;
    padding: 12px 0;
  }

  .formRow {
    margin: 0;
    padding: 0;
    display: block;
  }

  .formRow .home-phone {
    padding: 12px 0;
    max-width: 100%;
  }

  .formRow .mail {
    padding: 12px 0;
    max-width: 100%;
  }

  .bg-color-form .bg-form {
    padding-right: 40px;
  }

  .bg-color-form {
    margin-top: 0;
  }

  .bg-color-form .bg-form .welcome-lbl {
    padding: 12px 0;
    max-width: 100%;
  }

  .bg-color-form .bg-form .refer-btn {
    text-align: center;
    padding: 12px 0;
  }

  .topnav a:not(:first-child) {
    display: none;
  }

  .howReferDescStyle {
    margin-bottom: 16px;
  }

  .heading-txt {
    margin-bottom: 0;
  }

  .voucherSectionModified .row .box:nth-child(2) {
    margin-left: 0;
    margin-right: 0;
  }

  .voucherSectionModified .row .box {
    margin-bottom: 16px;
  }

  .hdr-logo-txt-wrapper .logo-text {
    font-size: 20px;
  }

  .banner-content-wrapper .slider-content .discription {
    font-size: 26px;
    padding-top: 0;
  }

  .topnav a.icon {
    float: right;
    display: block;
  }

  .topnav.responsive {
    position: relative;
  }

  .topnav.responsive .icon {
    position: absolute;
    right: 0;
    top: 0;
  }

  .topnav.responsive a {
    float: none;
    display: block;
    text-align: left;
  }

  .hero2 .slick-next {
    transform: translate(5px, -50%);
  }

  .hero3 .slick-next {
    transform: translate(5px, -50%);
  }

  .on-img-offers {
    max-width: 306px;
    left: 30px;
  }

  .hero-slide .lock-unlock-section {
    left: 16px;
  }

  .tick-check {
    top: 52px;
    right: 24px;
  }
}

@media (max-width: 574px) {
  .earn-upper-wrapper {
    flex-direction: column;
  }

  .earn-str-img {
    padding-bottom: 12px;
    text-align: center;
  }

  .succ-proc-wrap {
    margin-left: 0;
  }

  .succ-proc-wrap .suc-ref {
    margin-right: 2px;
    max-width: 138px;
  }

  .succ-proc-wrap .ref-proces {
    margin-left: 2px;
    max-width: 176px;
  }

  .bal-exp-redm-wrap,
  .suc-pro-container {
    justify-content: space-around;
  }

  .red-point {
    padding: 0 4px;
    border: 0;
  }

  .bal-exp-points-wrap,
  .succ-proc-wrap {
    justify-content: space-around;
    border-right: 1px solid #f6f6f6;
  }

  .bal-exp-points-wrap .txt-side {
    margin-right: 2px;
    max-width: 148px;
    width: 100%;
  }

  .bal-exp-points-wrap .txt-2-col {
    margin-left: 2px;
    max-width: 172px;
    width: 100%;
  }

  .main-tab {
    padding-top: 36px;
  }

  .main-tab .tabs {
    margin-bottom: 36px;
  }

  .main-tab .tabs a {
    font-size: 14px;
    font-weight: 600;
    margin: 0 6px;
  }

  .knowMoreModalContent {
    padding: 0 30px;
  }

  .redemp-main-wrap {
    padding: 8px 12px;
  }

  .redemp-main-wrap .mob-hidden {
    display: none;
  }

  .redemp-main-wrap .mob-showing {
    display: block;
    margin-bottom: 4px;
  }

  .earned-points {
    display: flex;
    flex-direction: column;
  }

  .earned-points .earn-arrange {
    margin-top: 16px;
    padding-left: 0;
  }

  .earned-points .first-earn .icons-text {
    margin-right: 0;
  }

  .earned-points .first-earn .earn-img {
    margin-right: 20px;
  }

  .earned-points .first-earn .icons-text,
  .redemp-main-wrap .earn-arrange {
    justify-content: space-around;
  }

  .redemp-main-wrap .points-earned {
    max-width: fit-content;
  }

  .hero .hero-slide img {
    min-height: 420px;
  }
  .hero-slide figure {
    height: 420px;
  }
}
@media screen and (max-width: 540px) {
  a#videobtn.margin-top-refer-form {
      margin-top: 18px;
      width: 100%;
      margin-left: -111px;
  }
}
@media (max-width: 480px) {
  /* mohan css code refer brd  */

    a#videobtn.margin-top-refer-form {
        margin-top: 18px;
        width: 100%;
        margin-left: -73px;
    }
  /* end code */
  .congratsModalContent .congrats {
    padding: 0 24px 28px;
  }

  .modal-header {
    padding: 18px 18px 0 0;
  }

  .modalMargin {
    margin-top: 12px;
  }

  .congrachulationsText {
    margin-top: 16px;
    font-size: 20px;
  }

  .inireferal {
    font-size: 16px;
  }

  .pointsCredited,
  .pointsCredited1 {
    font-size: 14px;
  }

  .modal-body .close {
    padding: 0;
  }

  .termsConditionTitle {
    font-size: 20px;
    padding-top: 40px;
  }

  .termsConditionData {
    padding: 22px 36px;
  }

  .testBulletsTermsModal {
    font-size: 14px;
    line-height: 28px;
  }
  .tBT {
    font-size: 14px;
    line-height: 28px;
  }

  .termsConditionStyle {
    right: -3% !important;
    margin-left: 0 !important;
  }

  .ryf {
    margin-top: 0px !important;
  }

  .arrowDown {
    bottom: 71px !important;
    left: 46% !important;
    display: none;
  }

  .heartStyle {
    margin-left: 0px !important;
  }

  .formPadding {
    padding: 10px;
    border: 1px solid #0cb7e6;
    border-radius: 4px;
  }

  .curvedBorder {
    padding-bottom: 0;
  }

  .testContainer {
    margin-left: 0px !important;
  }

  .unlockOffer {
    font-size: 20px !important;
  }

  .pointStyle {
    border: none !important;
  }

  .pointStyle1 {
    border: none !important;
  }

  .emailIDPadding {
    padding-top: 24px;
    width: 100%;
  }

  h3 {
    padding: 10px;
  }

  .oneimgClass {
    text-align: center !important;
  }

  .oneimgClass1 {
    text-align: center !important;
    padding-top: 10px;
  }

  .termsContitions {
    padding: 10px;
  }

  .slick-dots {
    bottom: 23px !important;
  }

  .presponsive {
    padding: 10px;
  }

  .offerStyle {
    margin-left: 20px;
  }

  .box .inner {
    background-color: #fff;
    text-align: left;
    padding: 16px;
    margin-bottom: 10px;
  }

  .hero2 .slick-slide img {
    display: block;
    width: 100% !important;
  }

  .hero3 .slick-slide img {
    display: block;
    width: 100% !important;
  }

  .paddingMobile {
    padding: 20px;
  }

  .knowmore .modal-dialog {
    top: 0px;
  }

  .modalBodyPadding {
    padding: 0rem;
  }

  .knowMoreModalContent {
    overflow-y: scroll;
  }

  .knowMoreModalContent ul p {
    margin-bottom: 0rem;
    margin-top: 20px;
  }

  .knowMoreleftPadding {
    padding-left: 15px !important;
  }

  .dubai {
    margin-top: 20px;
  }

  .placeBookingRequest {
    margin-top: 20px;
    margin-left: 0px !important;
    margin-bottom: 18px;
  }

  .main-tab .tabs .tab-point {
    display: flex;
  }

  .earn-upper-wrapper .earn-str-img {
    padding: 0 0 12px;
    text-align: left;
  }

  .bal-exp-redm-wrap {
    flex-direction: column;
  }

  .bal-exp-points-wrap,
  .succ-proc-wrap {
    justify-content: space-between;
    border-right: 0;
    padding: 0;
  }

  .bal-exp-points-wrap .txt-side {
    max-width: 146px;
    width: 100%;
  }

  .bal-exp-points-wrap .txt-2-col {
    max-width: 168px;
    width: 100%;
  }

  .txt-side,
  .txt-2-col {
    font-size: 12px;
  }

  .txt-side p,
  .txt-2-col p {
    font-size: 14px;
  }

  .sceond-txt {
    font-size: 20px;
  }

  .sub-txt-col {
    font-size: 14px;
  }

  .red-point {
    margin-top: 16px;
    padding: 0 0 4px;
  }

  .suc-pro-container {
    flex-direction: column;
  }

  .succ-proc-wrap .suc-ref {
    max-width: 146px;
  }

  .succ-proc-wrap .ref-proces {
    margin-left: 2px;
    max-width: 160px;
  }

  .referal-txt {
    font-size: 14px;
  }

  .suc-proces-point {
    font-size: 20px;
  }

  .giveStyle {
    padding-top: 38px;
  }

  .knowMoreModalContent .inclusions,
  .knowMoreModalContent .exclusions {
    padding-right: 12px;
    padding-top: 16px;
  }

  .knowMoreModalContent {
    padding: 0;
  }

  .close {
    top: 16px;
    right: 16px;
  }

  .zoom-out {
    padding: 0 10px;
  }

  .on-img-offers {
    max-width: 264px;
    left: 30px;
    font-size: 12px;
  }

  .on-img-offers .main-offer {
    font-size: 16px;
  }

  .textOrange {
    font-size: 14px;
  }

  .form-container {
    padding-top: 36px;
  }

  .tick-check {
    right: -22px;
  }
}

@media only screen and (min-device-width: 449px) and (max-device-width: 479px) {
  .hero1 .slick-next {
    transform: translate(5px, -50%);
  }
}

@media (max-width: 420px) {
  .redemp-main-wrap {
    padding: 8px 10px;
  }

  .redemp-main-wrap .first-wrap {
    font-size: 10px;
  }

  .redemp-main-wrap .first-wrap .ref-no span:last-child {
    font-size: 12px;
  }

  .redemp-main-wrap .icons-text .icon-info span:last-child {
    font-size: 14px;
  }

  .redemp-main-wrap .second-wrap {
    font-size: 10px;
  }

  .redemp-main-wrap .second-wrap .redump span:last-child {
    font-size: 12px;
  }

  .redemp-main-wrap .second-wrap .amount {
    font-size: 16px;
  }

  .redemp-main-wrap .second-wrap .progress-info {
    font-size: 10px;
  }

  .redemp-main-wrap .second-wrap .progress-info a {
    padding: 3px 5px;
  }

  .redemp-main-wrap .first-wrap .icons-text {
    margin-right: 12px;
  }

  .redemp-main-wrap .points-convers {
    font-size: 14px;
  }

  .earned-points .first-earn .earn-img {
    margin-right: 0;
  }
}
@media screen and (max-width: 430px) {
  a#videobtn.margin-top-refer-form {
      margin-top: 18px;
      width: 100%;
      margin-left: -47px;
  }
}
@media (max-width: 400px) {
  .trips-dest .cancel-place-book-btn {
    flex-direction: column-reverse;
  }

  .trips-dest .cancel-place-book-btn > div:first-child {
    margin-top: 42px;
  }

  .knowMoreModalContent .del-section,
  .knowMoreModalContent .pic-section,
  .knowMoreModalContent .pic-info {
    padding-left: 20px;
  }

  .bal-exp-points-wrap .txt-2-col {
    max-width: 160px;
    width: 100%;
  }

  .bal-exp-points-wrap {
    width: 336px;
  }

  .succ-proc-wrap {
    width: 336px;
  }

  .sub-txt-col {
    font-size: 11px;
  }
  .txt-side {
    font-size: 11px;
  }

  .on-img-offers {
    max-width: 240px;
  }
}

@media (max-width: 380px) {
  .bg-form .col-sm-4 .btnStyle {
    margin-left: 0;
  }
}
@media (max-width: 375px) {
 
.bg-color-form .bg-form .refer-btn.refer-btn-margin-bottom {
  margin-left: 8px;
}
  a#videobtn.margin-top-refer-form {
      margin-top: 18px;
      width: 100%;
      margin-left: -21px;
  }
}
@media (max-width: 280px) {
  .top-img-welcome {
    padding-left: 0;
  }

  .top-img-welcome span {
    font-size: 13px;
  }
}

.onePlusSuccessPop .close,
.orderSorryPop .close {
  position: absolute;
  right: 30px;
  top: 30px;
  z-index: 10;
  box-shadow: none;
  outline: none;
}
.onePlusSuccessPop .modal-content,
.orderSorryPop .modal-content {
  border-radius: 2px;
}
.onePlusSuccessPop .modal-body {
  padding: 50px 16px;
  max-width: 510px;
  margin: 0 auto;
}
.orderSorryPop .modal-body {
  padding: 58px 16px;
  max-width: 550px;
  margin: 0 auto;
}
.onePlusRightTick {
  display: flex;
  align-items: center;
  justify-content: center;
}
.tickRight {
  width: 60px;
  height: 60px;
  background-color: #aed140;
  display: flex;
  align-items: center;
  border-radius: 50%;
  justify-content: center;
}
.tickRightTxt {
  display: inline-block;
  transform: rotate(45deg);
  height: 19px;
  width: 12px;
  border-bottom: 3px solid #fff;
  border-right: 3px solid #fff;
  margin-top: -8px;
}
.onePlusSuccessPop .modal-body h3,
.onePlusSuccessPop .modal-body h4 {
  font-family: Roboto;
  font-size: 24px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 30px;
  letter-spacing: normal;
  text-align: center;
  color: #414142;
  margin: 21px 0px;
  padding: 0px;
}
.onePlusSuccessPop .modal-body h5 {
  font-family: Roboto;
  font-size: 22px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 28px;
  letter-spacing: normal;
  text-align: center;
  color: #414142;
  margin: 0px 0px 20px 0px;
  padding: 0px;
}
.onePlusSuccessPop .modal-body p {
  font-family: Roboto;
  font-size: 14px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: normal;
  text-align: center;
  color: #666666;
  margin: 0px;
  padding: 0px;
}

.orderSorryPop h3 {
  font-family: Roboto;
  font-size: 24px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 30px;
  letter-spacing: normal;
  text-align: center;
  color: #414142;
  margin: 0px 0px 15px 0px;
  padding: 0px;
}
.orderSorryPop h5 {
  font-family: Roboto;
  font-size: 16px;
  font-weight: normal;
  font-style: normal;
  line-height: 22px;
  letter-spacing: normal;
  text-align: center;
  color: #414142;
  margin: 0px 0px;
  padding: 0px;
}
.sorryPopMedia {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 40px;
}
.sorryPopMedia .media img {
  max-width: 100%;
  margin-right: 8px;
}
.sorryPopMedia .media-body h4 {
  font-family: Roboto;
  font-size: 14px;
  font-weight: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: normal;
  text-align: left;
  color: #858e9b;
  padding: 0px;
  margin-bottom: 4px;
}
.sorryPopMedia .media-body h3 {
  font-family: Roboto;
  font-size: 18px;
  font-weight: bold;
  font-style: normal;
  line-height: 24px;
  letter-spacing: normal;
  text-align: left;
  color: #3c4b5f;
  margin: 0px;
  padding: 0px;
}
.cardExpend .cardHidden {
  display: block !important;
}
.cardExpend.active .cardHidden,
.cardExpend .main-form {
  display: none !important;
}
.cardExpend.active .main-form {
  display: flex !important;
}
.cardExpend.active .inner {
  position: relative;
}
.box.cardExpend.active {
  position: relative;
}
.successBoxContent {
  padding: 24px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.redeemSuccessBox {
  position: relative;
  height: 100%;
}
.redeemSuccessBox .close {
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 10;
  box-shadow: none;
  outline: none;
}
.redeemSuccessBox .onePlusRightTick {
  display: flex;
  align-items: center;
  justify-content: center;
}
.redeemSuccessBox .tickRight {
  width: 60px;
  height: 60px;
  background-color: #aed140;
  display: flex;
  align-items: center;
  border-radius: 50%;
  justify-content: center;
}
.redeemSuccessBox .tickRightTxt {
  display: inline-block;
  transform: rotate(45deg);
  height: 19px;
  width: 12px;
  border-bottom: 3px solid #fff;
  border-right: 3px solid #fff;
  margin-top: -8px;
}
.successBoxContent h4 {
  font-family: Roboto;
  font-size: 22px;
  font-weight: 500;
  color: #0cb7e6;
  line-height: 28px;
  margin: 30px 0px 16px 0px;
}
.successBoxContent h5 {
  font-family: Roboto;
  font-size: 16px;
  font-weight: normal;
  color: #666666;
  line-height: 22px;
  margin: 0px;
}
.inner .redeemSuccessBox,
.inner.active .boxInner {
  display: none;
}
.inner.active .redeemSuccessBox {
  display: flex;
}
.inner .boxInner {
  align-items: flex-start;
  flex-wrap: wrap;
  display: flex;
}
.cardExpend .points-conver-txt,
.cardExpend .upto-amount {
  display: none;
}
.cardExpend.active .points-conver-txt,
.cardExpend.active .upto-amount {
  display: block;
}
.cardExpend .redeem-voucher-container {
  padding: 8px 0px 0px 0px;
}
.cardExpend .redeem-voucher-container.cardHidden {
  padding: 0px 0px 0px 0px;
}
.cardExpend.box .inner {
  padding: 16px;
}
.cardExpend .giftcardStyle {
  margin-top: 16px;
}
.cardExpend .redeem-voucher-container .redeem-due-pay-btn {
  background-color: transparent;
  box-shadow: none;
  outline: none;
}
.cardExpend .redeem-voucher-container .redeem-due-pay-btn:hover {
  background: #f8992c;
  color: #fff;
  box-shadow: none;
  outline: none;
}
.cardExpend .redeem-voucher-container .redeem-due-amount {
  font-weight: 500;
}
.dashboardTabs .voucherSectionModified .row + .row {
  margin-top: 0px;
}
.dashboardHeaderSection {
  padding: 40px 0px 26px 0px;
  background-color: #fff;
}
.dashboardHeaderSection .form-section {
  position: static;
  transform: initial;
}
.dashboardHeaderSection .giveStyle {
  padding-top: 0px;
  max-width: initial;
}
.dashboardHeaderSection .pointStyle {
  max-width: initial;
}
.dashboardHeaderSection .curvedBorder {
  padding-top: 78px;
}
.dashboardTabs {
  background-color: #f6f6f6;
}
.dashboardHeaderSection .form-curve .formStyle:before {
  top: -60px;
  height: 60px;
  z-index: 10;
}
.dashboardHeaderSection .form-curve .formStyle:after {
  bottom: -75px;
  height: 80px;
  z-index: 10;
}
.dashboardHeaderSection .form-container .termsConditionStyle {
  max-width: initial;
  margin-left: initial;
  width: initial;
}
.dashboardHeaderSection .bal-exp-redm-wrap {
  flex: 1;
  align-items: center;
}
.dashboardHeaderSection .bal-exp-points-wrap {
  width: initial;
  flex: 1;
}
.dashboardHeaderSection .red-point {
  padding: 0 0px 0px 15px;
  margin-top: 0px;
}
.dashboardHeaderSection .succ-proc-wrap {
  max-width: initial;
  flex-wrap: initial;
  flex-shrink: initial;
}
.dashboardHeaderSection .succ-proc-wrap .suc-ref,
.dashboardHeaderSection .succ-proc-wrap .ref-proces {
  max-width: initial;
}
.dashboardHeaderSection .form-container {
  background-color: transparent;
  padding: 0px;
}
.dashboardHeaderSection .bg-color-form {
  background-color: transparent;
  margin: 0px;
}
.dashboardHeaderSection .bg-color-form .bg-form {
  padding: 0px !important;
  margin: 20px 0px 0px 0px !important;
}
.dashboardHeaderSection .bg-color-form .bg-form .refer-btn {
  padding: 0px !important;
}
.dashboardTabs .main-tab .tabs {
  margin-bottom: 60px !important;
  margin: 0 auto;
}
.dashboardTabs .hero-slide {
  background-color: transparent;
  background: transparent;
}
.dashboardTabs .slick-prev,
.dashboardTabs .slick-next {
  padding-right: 0px;
  margin-left: 0px;
}
.dashboardTabs .slick-prev {
  left: -8px;
}
.dashboardTabs .box .inner .redeem-icon img {
  max-height: 80px;
  max-width: 80px;
}
.inertab.trackReferalLiSection {
  display: block;
}
.trackReferalMain {
  display: flex;
  justify-content: space-between;
  flex: 1;
  flex-direction: row;
}
.trackReferalLeft {
  display: flex;
  justify-content: space-between;
  max-width: 320px;
  flex: 1;
}
.trackReferalRight {
  flex: 1;
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
}
.trackReferalRight .expired-btn {
  margin: 0px auto 10px auto;
}
.yearBoxMain .blockStyle {
  margin: 0px 16px 16px 0px;
}
.yearBoxMain .blockStyle:last-child {
  margin: 0px 0px 16px 0px;
}
.bottomModalMain .cancel,
.bottomModalMain .place-book {
  display: inline-block;
  cursor: pointer;
  margin: 0px;
}
.bottomModalMain .trips-dest .cancel-place-book-btn,
.bottomModalMain .cancel-place-btn {
  margin-top: 40px;
  justify-content: space-between;
  align-items: center;
}
.bottomModalMain .borderStar {
  padding: 30px;
  min-width: 270px;
}
.bottomModalMain .trips-dest .borderStar .star-section {
  padding: 0px;
  margin-right: 20px;
}
.bottomModalMain .trips-dest .borderStar .points-wrapper {
  padding: 0px;
}
.bottomModalMain .trips-dest .borderStar .hfrpPoints {
  line-height: 20px;
}
.bottomModalMain .trips-dest .borderStar .exact-points {
  line-height: 26px;
}
.knowMoreModalContent.bottomModalMain .trips-dest {
  padding: 0px 0px !important;
}
.knowMoreModalContent.bottomModalMain .inclusions,
.knowMoreModalContent.bottomModalMain .exclusions,
.knowMoreModalContent.bottomModalMain .del-section {
  padding: 40px;
}
.knowMoreModalContent.bottomModalMain .testBullets {
  position: relative;
}
.bottomModalMain .inclusions ul li::before,
.bottomModalMain .exclusions ul li::before {
  margin-left: 0px;
}
.knowMoreModalContent.bottomModalMain .pic-info {
  padding: 0px;
}
.knowMoreModalContent.bottomModalMain .pic-info .pic-product {
  margin-bottom: 40px;
}
.duePopMain .close {
  position: absolute;
  right: 30px;
  top: 30px;
  z-index: 10;
  box-shadow: none;
  outline: none;
}
.duePopMain .modal-body {
  padding: 60px;
}
.duePopMain .modal-body h3 {
  font-family: Roboto;
  font-size: 24px;
  font-weight: bold;
  font-stretch: normal;
  font-style: normal;
  line-height: 30px;
  letter-spacing: normal;
  text-align: center;
  color: #414142;
  margin: 0px 0px 10px 0px;
  padding: 0px;
}
.duePopMain .modal-body p {
  font-family: Roboto;
  font-size: 16px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 20px;
  letter-spacing: normal;
  text-align: center;
  color: #666666;
  margin: 0px;
  padding: 0px;
}
.dueAmountPay {
  max-width: 290px;
  margin: 30px auto;
  border: 1px solid #aed140;
  padding: 12px;
  text-align: center;
}
.dueAmountPay p {
  font-size: 14px;
  margin: 0px;
  color: #999;
  line-height: 20px;
  font-family: Roboto-ragular;
}
.dueAmountPay h4 {
  font-size: 18px;
  margin: 0px;
  color: #333;
  line-height: 24px;
  font-weight: 600;
}
.dueCustInner h4 {
  font-size: 16px;
  line-height: 22px;
  color: #999;
  margin: 0px 0px 16px 0px;
  font-weight: 400;
}
.dueCustInner.dueCustH4 h4 {
  font-size: 16px;
  line-height: 22px;
  color: #666;
  margin: 0px;
  font-weight: 600;
}
.dueCustInfo {
  background-color: #fbfbfb;
  padding: 16px;
  margin-bottom: 24px;
}
.dueCheck {
  position: relative;
  padding-left: 40px;
  margin: 0px;
  font-size: 16px;
  color: #414042;
  cursor: pointer;
}
.dueCheck a {
  color: #2aace2;
}
.dueCheck input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}
.dueCheck .checkmark {
  position: absolute;
  top: -3px;
  left: 0;
  height: 30px;
  width: 30px;
  background-color: #fff;
  border: 1px solid #aed140;
  border-radius: 3px;
  cursor: pointer;
}
.dueCheck input:checked ~ .checkmark {
  background-color: #fff;
}
.dueCheck .checkmark:after {
  content: "";
  position: absolute;
  display: none;
}
.dueCheck input:checked ~ .checkmark:after {
  display: block;
}
.dueCheck .checkmark:after {
  left: 10px;
  top: 5px;
  width: 8px;
  height: 14px;
  border: solid #aed140;
  border-width: 0 3px 3px 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}
.dueBtn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 32px;
}
.dueBtn .btn {
  background-color: #f8992c;
  border: 1px solid #f8992c;
  color: #fff;
  padding: 13px 46px;
  font-size: 20px;
  margin: 0px;
  box-shadow: none;
  outline: none;
  border-radius: 3px;
  line-height: 26px;
}
.mobmarginbtm input {
  border-bottom: 2px solid #cccccc;
}
.tooltipDasboardMain {
  position: relative;
}
.tooltipDasboardMain i {
  position: relative;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  color: #fff;
  background-color: #0cb7e6;
  cursor: pointer;
  display: inline-flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  padding: 3px 6px;
  font-size: 8px;
  font-style: normal;
}
.tooltipDashInner.active {
  display: block;
  position: absolute;
  background-color: #fff;
  border-radius: 2px;
  box-shadow: 0px 5px 32.7px 5.3px rgba(0, 0, 0, 0.1);
  top: 25px;
  left: auto;
  right: auto;
  min-width: 300px;
  padding: 24px;
}
.tooltipDashInner {
  display: none;
}
.tooltipDashInner:before {
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #fff;
  content: "";
  top: -8px;
  position: absolute;
  left: 0;
  right: 0;
  max-width: 16px;
  margin: 0 auto;
}
.tooltipDashInner p {
  font-size: 14px;
  line-height: 20px;
  color: #3c4b5f;
}
.tooltipCross {
  position: absolute;
  right: 12px;
  top: 10px;
  width: 12px;
  height: 12px;
}
.tooltipCross:before,
.tooltipCross:after {
  position: absolute;
  left: 5px;
  content: " ";
  height: 12px;
  width: 2px;
  background-color: #333;
}
.tooltipCross:before {
  transform: rotate(45deg);
}
.tooltipCross:after {
  transform: rotate(-45deg);
}

@media (min-width: 576px) {
  .onePlusSuccessPop .modal-dialog,
  .orderSorryPop .modal-dialog,
  .duePopMain .modal-dialog {
    max-width: 720px;
  }
}
@media screen and (max-width: 1024px) {
  .dashboardHeaderSection .curvedBorder {
    max-width: 570px;
    margin: 0 auto;
  }
}
@media screen and (max-width: 767px) {
  .duePopMain .modal-body {
    padding: 24px 24px;
  }
  .duePopMain .close {
    right: 12px;
    top: 6px;
  }
  .duePopMain .modal-body h3 {
    font-size: 20px;
    line-height: 26px;
  }
  .duePopMain .modal-body p,
  .dueCustInner h4,
  .dueCustInner.dueCustH4 h4,
  .dueCheck {
    font-size: 14px;
    line-height: 20px;
  }
  .dueBtn .btn {
    font-size: 16px;
    line-height: 22px;
  }
  .trackReferalLiSection .accordion-content-wrap {
    flex-wrap: wrap;
  }
  .trackReferalLiSection .accordion-content-wrap .details-txt {
    max-width: initial;
    width: initial;
    flex: 0 1 48%;
    margin: 8px 0px;
  }
  .knowMoreModalContent ul p {
    margin-top: 0px;
    margin-bottom: 8px;
  }
  .knowMoreModalContent.bottomModalMain .trips-dest {
    padding: 0px 16px !important;
  }
  .knowMoreModalContent.bottomModalMain {
    padding: 40px 0px !important;
  }
  .custom-modal .close {
    display: block;
  }
  .trackReferalMain {
    flex-direction: column;
    align-items: initial;
  }
  .trackReferalLeft {
    max-width: initial;
  }
  .trackReferalRight {
    margin-top: 30px;
  }
  .trackReferalRight .accor-img {
    display: none;
  }
  .dashboardHeaderSection .red-point {
    padding: 0 0px 0px 0px;
    margin-top: 8px;
  }
  .dashboardHeaderSection .bal-exp-redm-wrap {
    align-items: flex-start;
  }
  .dashboardHeaderSection .bal-exp-points-wrap {
    width: 100%;
    flex: 1;
  }
  .dashboardHeaderSection .curvedBorder {
    padding-top: 0px;
  }
  .dashboardHeaderSection .form-container {
    background-color: transparent;
    padding-top: 24px;
  }
  .onePlusSuccessPop .modal-body {
    padding: 48px 16px;
  }
  .onePlusSuccessPop .modal-body h3,
  .onePlusSuccessPop .modal-body h4 {
    font-size: 18px;
    line-height: 24px;
    margin: 16px 0px;
  }
  .onePlusSuccessPop .modal-body h5 {
    font-size: 16px;
    line-height: 22px;
    margin: 0px 0px 16px 0px;
  }
  .orderSorryPop h3 {
    font-size: 20px;
    line-height: 26px;
  }
  .orderSorryPop h5 {
    font-size: 15px;
    line-height: 21px;
  }
  .sorryPopMedia .media-body h3 {
    font-size: 16px;
    line-height: 22px;
  }
}

#voucherid input {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* margin-top: 18px; */
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  font-family: Roboto;
}
#voucherid .all-btn {
  width: 24%;
}
/* #voucherid .cancel,
#voucherid .confirm {
  width: 36%;
} */
#voucherid .successBoxContent {
  border-radius: 5px;
  box-shadow: 0px 0px 5px 26px rgba(0, 0, 0, 0.01);
}
#voucherid .cardExpend .inner {
  border-radius: 5px;
  box-shadow: 7px 5px 7px 10px rgba(0, 0, 0, 0.01);
}

.expired-btnn {
  max-width: 125px;
  height: 20px;
  border-radius: 8px;
  background-color: #e54c4c;
  width: 100%;
  font-family: Roboto;
  font-size: 12px;
  font-weight: normal;
  letter-spacing: normal;
  text-align: center;
  line-height: 20px;
  color: #fff;
  margin: 10px auto;
}

/* style work start HFRP loyality program */

.points-bar-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
}
.points-bar {
  position: relative;
}
.points-bar div:first-of-type .flag-bar-inner {
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  overflow: hidden;
}
.points-bar div:last-of-type .flag-bar-inner {
  border-top-right-radius: 8px;
  border-bottom-right-radius: 8px;
  overflow: hidden;
}

.progress-car {
  position: absolute;
  top: 0;
  left: 0;
  width: 48px;
  z-index: 9;
  height: 21px;
  transform: translate(0, -110%);
  transition: left 1s ease-in-out 0.45s;
  display: block;
  caret-color: rgba(0, 0, 0, 0);
  cursor: pointer;
}

.pbp_container {
  position: absolute;
  bottom: 130%;
  left: 50%;
  transform: translateX(-50%);
  padding: 10px 0 0;
  max-width: 120px;
  width: max-content;
  display: none;
  text-align: center;
}
.progress-car.active .pbp_container {
  display: block;
}
.pbpc_inner {
  background-color: #fff;
  border-radius: 16px;
  position: relative;
  padding: 8px 14px;
  color: #666;
  box-shadow: 0px 3px 8px #00000010;
}

.pbpc_inner:before {
  content: "";
  border: 12px solid transparent;
  border-top-color: #fff;
  position: absolute;
  bottom: -20px;
  left: 50%;
  transform: translateX(-50%);
}
.pbpci_title {
  font-size: 12px;
  line-height: 1.2;
  color: #666;
}

.bronze .flag-bar .points-bar-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 8px;
  overflow: hidden;
}
.pbo-in {
  position: absolute;
  display: block;
  height: 100%;
  width: 100%;
  right: 0;
  background: url(../images/points-bar-overlay.png) repeat 0 0 / cover;
  transition: width 1s ease-in-out 0.5s;
}

.flag-points-icon {
  height: 12px;
  overflow: hidden;
}

.flag-points-txt {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.2;
  color: #414042;
}

.flag-points {
  gap: 1px;
}

.bronze {
  position: absolute;
}

.flag-bar {
  height: 15px;
}

.bronze .flag-bar {
  position: relative;
  border-radius: 8px;
}

.flag-bar-inner {
  height: 100%;
}

.bronze .flag-bar-inner {
  background-color: #a15923;
}

.silver .flag-bar-inner {
  background-color: #949798;
}

.gold .flag-bar-inner {
  background-color: #c1960c;
}

.Platinum .flag-bar-inner {
  background-color: #000;
}

.cards-container {
  display: flex;
  flex-direction: column;
  font-family: Roboto;
  padding: 20px 0;
}
.cards-container strong {
  font-weight: 500;
}

.stTop {
  font-size: 18px;
  line-height: 1.2;
  color: #414042;
}
.stBottom {
  font-size: 16px;
  line-height: 1.2;
  color: #414042;
  margin-top: 10px;
}

.pointZoneCard {
  min-height: 280px;
  height: 100%;
  position: relative;
}

.pZc_card:not(.active):first-child {
  transform-origin: center left;
  left: 0;
}
.pZc_card:not(.active):last-child {
  transform-origin: center right;
  right: 0;
}
.pZc_card:first-child.active {
  transform-origin: center left;
  left: 0;
}
.pZc_card:last-child.active {
  transform-origin: center right;
  right: 0;
}

.pZc_card {
  border-radius: 12px;
  box-shadow: 0px 3px 8px #00000033;
  width: 360px;
  height: 230px;
  position: absolute;
  flex-shrink: 0;
  top: 50%;
  transform: translateY(-50%) scale(0.8);
  opacity: 0.5;
  cursor: pointer;
  transition: all 0.3s ease-in-out;
  box-shadow: -2px -4px 30px #00000020;
}

.locked {
  top: 0;
  left: 0;
  z-index: 1;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  position: absolute;
  object-fit: contain;
  transform: translate(-10px, -10px);
  box-shadow: -1px -2px 10px #00000010;
}

.pZc_card.active {
  transform: translateY(-50%) scale(1);
  z-index: 2;
  opacity: 1;
  box-shadow: -2px -3px 40px #00000020;
}

.pZc_card:before {
  content: "";
  height: 152px;
  width: 128px;
  display: block;
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: url(../images/CM_logo_white.svg) no-repeat;
}

.pZc_card.bronze {
  background: url(../images/Logo-bronze.svg) no-repeat bottom center / cover,
    linear-gradient(125deg, #a05822 0%, #d8a776 100%) 0% 0% no-repeat
      padding-box;
}
.pZc_card.bronze .pZcc_right_inner {
  color: #a15a24;
}

.pZc_card.silver {
  background: url(../images/Logo-silver.svg) no-repeat bottom center / cover,
    linear-gradient(121deg, #949798 0%, #cbcbcb 100%) 0% 0% no-repeat
      padding-box;
}
.pZc_card.silver .pZcc_right_inner {
  color: #949798;
}

.pZc_card.gold {
  background: url(../images/Logo-gold.svg) no-repeat bottom center / cover,
    linear-gradient(121deg, #c1960c 0%, #f8d305 100%) 0% 0% no-repeat
      padding-box;
}
.pZc_card.gold .pZcc_right_inner {
  color: #c2970c;
}

.pZc_card.platinum {
  background: url(../images/Logo-platinum.svg) no-repeat bottom center / cover,
    linear-gradient(121deg, #000 0%, #37485f 100%) 0% 0% no-repeat padding-box;
}
.pZc_card.platinum .pZcc_right_inner {
  color: rgba(0, 0, 0, 0.8);
}

.pZc_content {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9;
  width: 100%;
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  padding: 8px 8px 14px 14px;
  justify-content: space-between;
}

.pZcc_right_inner {
  background: rgba(255, 255, 255, 0.6);
  border-radius: 0px 12px 0px 20px;
  padding: 20px;
  gap: 4px;
}
.pZcc_ri_title {
  font-size: 14px;
  line-height: 1.2;
  color: currentColor;
}
.pZcc_ri_title strong {
  font-size: 18px;
  line-height: 1.2;
  font-weight: 700;
  color: currentColor;
}
.pZcc_ri_dis {
  font-size: 11px;
  line-height: 1.2;
  color: currentColor;
}
.pZcc_ri_tooltip {
  position: relative;
  cursor: pointer;
}
.pZcc_ri_tooltip svg {
  caret-color: rgba(0, 0, 0, 0);
  cursor: pointer;
}
.pZcc_rit_container {
  position: absolute;
  top: 130%;
  left: 50%;
  transform: translateX(-50%);
  padding: 10px 0 0;
  min-width: 140px;
  width: 100%;
  display: none;
}
.pZcc_ri_tooltip.active .pZcc_rit_container {
  display: block;
}
.pZcc_ritc_inner {
  background-color: #fff;
  border-radius: 4px;
  position: relative;
  padding: 10px 13px;
  color: #666;
  z-index: 9;
  box-shadow: 0px 3px 8px #00000010;
}
.pZcc_ritc_inner strong {
  font-weight: 500;
  color: #414042;
}

.pZcc_ritc_inner:before {
  content: "";
  border: 12px solid transparent;
  border-bottom-color: #fff;
  position: absolute;
  height: 20px;
  width: 20px;
  top: -23px;
  left: 50%;
  z-index: -2;
  transform: translateX(-50%);
}

.pcc_tooltip {
  position: relative;
  cursor: pointer;
}
.pcc_tooltip svg {
  caret-color: rgba(0, 0, 0, 0);
  cursor: pointer;
}
.pcct_container {
  position: absolute;
  top: 40px;
  left: 50%;
  transform: translateX(-50%);
  min-width: fit-content;
  width: 100%;
  display: none;
}
.pcc_tooltip.active .pcct_container {
  display: block;
}
.pcct_inner {
  background-color: #fff;
  border-radius: 4px;
  position: relative;
  padding: 10px 13px;
  color: #666;
  z-index: 9;
  border: 1px solid rgba(0,0,0,.1);
  box-shadow: 0px 3px 8px #00000010;
}
.pcct_inner strong {
  font-weight: 500;
  color: #414042;
  white-space: nowrap;
}
.pcct_inner:before {
  content: "";
  border: 12px solid transparent;
  border-bottom-color: #fff;
  position: absolute;
  height: 20px;
  width: 20px;
  top: -23px;
  left: 50%;
  z-index: -2;
  transform: translateX(-50%);
}
.pcct_inner:after {
  content: "";
  background: url(../images/triangle-up-arrow.svg) no-repeat 0 0/100% 100%;
  position: absolute;
  height: 16px;
  width: 24px;
  top: -16px;
  left: 50%;
  z-index: -4;
  transform: translateX(-50%);
}
.pcct_title {
  font-size: 12px;
  line-height: 1.2;
  color: #666;
}
.pcct_desc {
  font-size: 12px;
  line-height: 1.8;
  font-weight: 500;
  margin-top: 5px;
  color: #a7a9ac;
}

.pZcc_ritc_title {
  font-size: 12px;
  line-height: 1.2;
  color: #666;
}
.pZcc_ritc_desc {
  font-size: 12px;
  line-height: 1.8;
  font-weight: 500;
  margin-top: 5px;
  color: #a7a9ac;
}

.pZcc_title {
  font-size: 28px;
  line-height: 1.2;
  font-weight: 300;
  color: #fff;
  margin-top: 20px;
}
.pZcc_id {
  font-size: 16px;
  line-height: 1.2;
  font-weight: 300;
  color: #fff;
  margin-top: 20px;
  letter-spacing: 3px;
}

.aZcc_vt {
  font-size: 12px;
  line-height: 1.2;
  color: #fff;
  margin-top: 10px;
}

.aZcc_vd {
  font-size: 14px;
  line-height: 1.2;
  color: #fff;
  font-weight: 500;
  margin-top: 5px;
}

.aZcc_offers {
  font-size: 14px;
  line-height: 1.2;
  color: #fff;
  font-weight: 500;
  margin-top: 10px;
  padding: 5px 10px;
  border-radius: 40px;
  border: 2px solid #fff;
  gap: 6px;
  height: min-content;
}

.aZcco_icon img {
  width: 21px;
  height: 21px;
  object-fit: contain;
}

.aZcco_status {
  margin: auto 0 auto auto;
}

.aZcco_status img {
  width: 13px;
  height: 16px;
  object-fit: contain;
}

.pointsCalculatorCard {
  background: #fff;
  box-shadow: 0px 0px 20px #0000001a;
  border: 2px solid #fff;
  border-radius: 12px;
  padding: 0 10px;
  max-width: 360px;
}

.pcc_row {
  padding: 16px 0;
  border-bottom: 1px solid #eee;
  gap: 15px;
}
.pcc_row:last-child {
  border-bottom: none;
}
.pcc_title {
  font-size: 11px;
  line-height: 1.2;
  color: #666;
}
.pcc_points {
  font-size: 20px;
  line-height: 1.2;
  font-weight: 500;
  color: #ffc000;
}
.pcc_action {
  color: #0cb7e6;
}

.bottom-card-section {
  gap: calc(25% - 259px);
  display: flex;
  font-family: Roboto;
  margin-top: 20px;
}

.mini-pZc_card {
  border-radius: 12px;
  box-shadow: 0px 3px 8px #00000033;
  padding: 6px;
  background: #fff;
  width: max-content;
  position: relative;
}

.mpc_inner {
  border-radius: 12px;
  width: 247px;  
  position: relative;
}

.mini-pZc_card .mpc_inner:before {
  content: "";
  height: 152px;
  width: 128px;
  display: block;
  position: absolute;
  right: 10px;
  bottom: 10px;
  background: url(../images/CM_logo_white.svg) no-repeat;
}

.mini-pZc_card.bronze{
  height: 176px;
}
.mini-pZc_card.bronze .mpc_inner {
  background: url(../images/Logo-bronze.svg) no-repeat bottom center / cover,
    linear-gradient(125deg, #a05822 0%, #d8a776 100%) 0% 0% no-repeat
      padding-box;
}

.mini-pZc_card.silver .mpc_inner {
  background: url(../images/Logo-silver.svg) no-repeat bottom center / cover,
    linear-gradient(121deg, #949798 0%, #cbcbcb 100%) 0% 0% no-repeat
      padding-box;
}
.mini-pZc_card.gold .mpc_inner {
  background: url(../images/Logo-gold.svg) no-repeat bottom center / cover,
    linear-gradient(121deg, #c1960c 0%, #f8d305 100%) 0% 0% no-repeat
      padding-box;
}
.mini-pZc_card.platinum .mpc_inner {
  background: url(../images/Logo-platinum.svg) no-repeat bottom center / cover,
    linear-gradient(121deg, #000 0%, #37485f 100%) 0% 0% no-repeat padding-box;
}

.mini-pZc_content {
  position: relative;
  z-index: 9;
  min-height: 164px;
  padding: 8px 8px 14px 14px;
}

.mini-pZcc_title {
  font-size: 24px;
  line-height: 1.2;
  font-weight: 300;
  margin-top: 20px;
  color: #fff;
}
.mini-pZcc_title strong {
  font-weight: 500;
}

.mini-pZcc_subTitle {
  font-size: 14px;
  line-height: 1.2;
  margin-top: 12px;
  color: #fff;
}
.mini-pZcc_subTitle strong {
  font-size: 23px;
  line-height: 1.2;
  font-weight: 500;
}

.mini-pZcc_benefits {
  font-size: 14px;
  line-height: 1.2;
  color: #fff;
  display: none;
  align-items: center;
  gap: 5px;
  bottom: 10px;
  position: absolute;
}

.mini-pZcc_benefits.desktop { 
  position: relative;
  padding: 10px 10px 5px;
  color: #000;
  bottom: 0;
  display: flex;
}

.mini-pZcc_benefits strong {
  font-size: 14px;
  line-height: 1.2;
  font-weight: 500;
}
/* gold platinum */
.mini-pZcc_benefits_desktop_rs {
  font-size: 14px;
  font-weight: 500;
  position: relative;
  padding: 3px 22px 5px;
  color: #000;
  bottom: 0;
  /* display: flex; */
  line-height: 0.5;
}
.mini-pZcc_benefits_mobile_rs {
  display: none;
}
/* gold platinum end */
.FAQ-section {
  padding: 60px 0 30px;
  background-color: #fff;
  font-family: Roboto;
}
.FAQ-section .h3 {
  margin-bottom: 10px;
  font-size: 24px;
  font-weight: bold;
}

.accordian-section .accordion {
  border-bottom: 1px solid #b4b4b4;
  color: #00aeef;
  cursor: pointer;
  display: flex;
  font-size: 21px;
  justify-content: space-between;
  line-height: 1.25;
  padding: 24px 0 16px;
  position: relative;
  text-align: left;
  width: 100%;
}
.accordian-section .accordion:after {
  background: url(../images/down-arrow.svg) no-repeat center center / contain,
    #fff;
  content: "";
  height: 7px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  transition: 0.3s;
  width: 17px;
}
.accordian-section .accordion.active:after {
  transform: translateY(-50%) rotate(180deg);
}
.accordian-section .panel {
  color: #414042;
  font-size: 16px;
  height: 0;
  line-height: 1.43;
  overflow: hidden;
  margin: 0;
  padding-right: 100px;
  transition: height 0.5s, margin 0.5s;
}
.accordian-section .panel.active {
  margin-top: 20px;
}

.FAQ-section .accordian-section .accordion > strong {
  padding-right: 50px;
  font-weight: 500;
}

.FAQ-section .accordian-section .panel p {
  margin-bottom: 16px;
}
.FAQ-section .accordian-section .panel p:last-child {
  margin-bottom: 0;
}
.see-all {
  font-size: 16px;
  font-weight: 500;
  margin-top: 30px;
  color: #00aeef;
}
.see-all a {
  position: relative;
  text-decoration: none;
  color: currentColor;
}

/*three steps Block style*/
.tsb_block {
  padding-top: 60px;
}

.threeStepBlock {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  overflow: hidden;
  background: transparent linear-gradient(291deg, #33d3ff 0%, #007b9d 100%) 0%
    0% no-repeat padding-box;
  box-shadow: 0px 0px 20px #00000029;
  border-radius: 32px;
  margin-bottom: 40px;
  padding: 32px 64px;
  font-family: Roboto;
}

.threeStepBlock .title {
  color: #fff;
  margin: 0;
  font-size: 28px;
  font-weight: bold;
  line-height: 1.2;
}

.threeStepBlock .subTitle {
  font-size: 24px;
  font-weight: 500;
  line-height: 1.2;
  color: #fff;
}

.threeStepBlock .step-box > div {
  gap: 8px;
}

.threeStepBlock .step-box .icon img {
  width: 80px;
  height: 80px;
  object-fit: contain;
}

.threeStepBlock .step-box .count {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #414042;
  color: #fff;
  font-size: 15px;
  font-weight: bold;
  line-height: 1.2;
  position: relative;
  margin-bottom: 10px;
  flex-shrink: 0;
}

.threeStepBlock .step-box .count span {
  position: relative;
  z-index: 9;
}

.threeStepBlock .step-box:first-child .count::before {
  display: none;
}
.threeStepBlock .step-box:last-child .count::after {
  display: none;
}

.threeStepBlock .step-box .count::before {
  content: "";
  width: 200px;
  height: 1px;
  background-color: #414042;
  position: absolute;
  top: 50%;
  right: 20px;
  transform: translateY(-50%);
}
.threeStepBlock .step-box .count::after {
  content: "";
  width: 200px;
  height: 1px;
  background-color: #414042;
  position: absolute;
  top: 50%;
  left: 20px;
  transform: translateY(-50%);
}

.threeStepBlock .step-box .discription {
  color: #fff;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  padding: 0 20px;
}

.steps-read-more {
  font-size: 16px;
  font-weight: 400;
  line-height: 1.2;
  color: #414042;
  margin-top: 8px;
  border-radius: 4px;
  background-color: #fff;
  padding: 10px 26px;
  text-align: center;
  cursor: pointer;
  overflow: hidden;
  border: none;
}

.tweb_block {
  font-family: Roboto;
  padding-bottom: 60px;
}

.tweb_block .slick-prev,
.tweb_block .slick-next {
  margin: 0;
  padding: 0;
  z-index: 99;
  box-shadow: 0 0 8px 1px #00000029;
  transform-origin: center center;
}

.tweb_block .slick-prev {
  transform: rotate(-180deg) translate(0, 50%);
}

.twe_benefits .slick-list {
  overflow: visible;
}

.tweb_title {
  margin-top: 40px;
  font-size: 30px;
  font-weight: 300;
  color: #414042;
  line-height: 1.2;
}
.tweb_title strong {
  font-weight: 700;
}
.tweb_block .main-tab {
  padding-top: 30px;
}
.tweb_block .main-tab .tabs {
  gap: 34px;
  padding-bottom: 19px;
}
.tweb_block .main-tab .tabs a::after {
  top: calc(100% + 17.5px);
}

.twe_benefits .hero-slide {
  background: transparent;
}

/* breadcrumbs style */
.breadcrumbs-list {
  gap: 4px;
  color: #414042;
  font-size: 14px;
  padding: 0;
  list-style: none;
  margin-bottom: 30px;
}
.bl_arrow {
  margin-left: 6px;
}
.breadcrumbs-list li {
  white-space: nowrap;
}
.breadcrumbs-list li.active a {
  color: #00aeef;
  font-weight: 500;
}
.breadcrumbs-list li:last-child .bl_arrow {
  display: none;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .cards-container {
    align-items: center;
  }
  .ulisting{
    padding:0 10px;
  }
  .pointZoneCard {
    max-width: 500px;
    display: flex;
    width: 100%;
  }
  .pZc_card:not(.active):first-child {
    left: 0;
  }
  .pZc_card:not(.active):last-child {
    right: 0;
  }
  .pZc_card:last-child.active {
    transform: translateY(-50%) scale(0.9);
  }
  .pZc_card:first-child.active {
    transform: translateY(-50%) scale(0.9);
  }
  .threeStepBlock .step-box .discription {
    font-size: 14px;
    padding: 0;
  }
}
@media (min-width: 768px) and (max-width: 1200px) {
  .bottom-card-section {
    gap: 30px;
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
    justify-content: center;
  }
}
@media (max-width: 1200px) {
  .mini-pZcc_benefits { display: flex; }
  .mini-pZcc_benefits.desktop { display: none; }
   /* gold platinu responsive code */
   .mini-pZcc_benefits_desktop_rs {
    display: none;
}
.mini-pZcc_benefits_mobile_rs {
  display: block;
  font-size: 14px;
  line-height: 1.2;
  margin-top: 12px;
  color: #fff;
  position: relative;
  padding-left: 13px;
  bottom: -30px;
}
.mini-pZcc_benefits.benefit_bottom {
  bottom: 30px;
}

  /* gold platinu responsive code  end*/
}
@media (max-width: 767px) {
  /*.brands-slider .slick-next,
 .brands-slider .slick-prev{
   display: none;
 }*/

   /* gold platinu responsive code */
   /* .mini-pZcc_benefits_desktop_rs {
    display: none;
}
.mini-pZcc_benefits_mobile_rs {
  display: block;
  font-size: 14px;
  line-height: 1.2;
  margin-top: 12px;
  color: #fff;
  position: relative;
  bottom: -30px;
}
.mini-pZcc_benefits.benefit_bottom {
  bottom: 30px;
} */

  /* gold platinu responsive code  end*/
 .brands-slider .slick-next,
 .brands-slider .slick-prev{
   display: none !important;
 }
  .stTop {
    font-size: 18px;
  }
  .stBottom {
    font-size: 14px;
    margin-top: 10px;
  }
  .pZc_card:not(.active):first-child {
    left: 0;
    transform: translateY(-50%) scale(0.7);
  }
  .pZc_card:not(.active):last-child {
    right: 0;
    transform: translateY(-50%) scale(0.7);
  }
  .pZc_card:last-child.active {
    transform: translateY(-50%) scale(0.9);
  }
  .pZc_card:first-child.active {
    transform: translateY(-50%) scale(0.9);
  }

  .points-bar-container {
    flex-direction: row;
    margin-top: 30px;
    gap: 20px;
  }

  .points-bar {
    position: relative;
    flex-direction: column;
  }

  .points-bar > div {
    display: flex;
    width: 100% !important;
    height: 25%;
    flex-direction: row-reverse;
    justify-content: flex-end;
  }

  .points-bar div:first-of-type .flag-bar-inner {
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    border-bottom-left-radius: 0;
  }
  .points-bar div:first-of-type .flag-bar-inner {
    height: 25%;
    display: flex;
    flex-shrink: 0;
    flex-direction: column;
    width: 100% !important;
  }

  .points-bar div:last-of-type .flag-bar-inner {
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-right-radius: 0;
  }

  .progress-car {
    top: 0;
    left: 0;
    z-index: 9;
    width: 48px;
    height: 21px;
    display: block;
    position: absolute;
    transform-origin: center left;
    transition: top 1s ease-in-out 0.45s;
    transform: rotate(90deg) translate(0, 55%) scaleY(-1);
  }

  .progress-car .pbp_container {
    display: block !important;
    transform: rotate(180deg) translate(25%,-230%);
  }

  .pbpc_inner {
    padding: 4px 10px;
    font-size: 10px;
    border-radius: 12px;
  }

  .pbpci_title {
    font-size: 14px;
    line-height: 1.2;
    color: #666;
    transform: scaleX(-1);
  }

  .bronze .flag-bar .points-bar-overlay {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    border-radius: 8px;
  }
  .pbo-in {
    bottom: 0;
    right: auto;
    transition: height 1s ease-in-out 0.5s;
  }

  .flag {
    display: none;
  }

  .flag-points-icon {
    height: 8px;
    width: 12px;
    transform: rotate(-90deg);
  }

  .flag-points-txt {
    font-size: 12px;
  }

  .flag-points {
    gap: 1px;
    flex-direction: row-reverse !important;
    max-width: 50px;
    width: 100%;
    height: min-content;
    transform: translateY(-42%);
  }

  .bronze .flag-points {
    transform: translateY(-8%);
  }

  .mini-pZc_card {
    height: max-content;
  }
  .h-full-on-mobile{
    height: 100% !important;
    top: 0;
  }

  .flag-bar {
    width: 15px !important;
    height: 100%;
    margin-left: 4px;
  }

  .bronze .flag-bar {
    position: relative;
    border-radius: 8px;
  }

  .flag-bar-inner {
    height: 100%;
  }

  .bottom-card-section {
    height: 100%;
    margin-top: 0;
    gap: 30px;
    flex-wrap: wrap;
    justify-content: center;
  }

  .pZcc_rit_container {
    transform: translateX(-80%);
  }

  .pZcc_ritc_inner:before {
    left: 80%;
  }

  .threeStepBlock {
    min-height: 468px;
    border-radius: 32px;
    margin-bottom: 10px;
    padding: 22px 20px 30px;
    gap: 30px;
  }

  .threeStepBlock .title {
    font-size: 24px;
  }

  .threeStepBlock .subTitle {
    font-size: 16px;
    margin-bottom: 10px;
  }
  .threeStepBlock .step-box > div {
    gap: 8px;
  }
  .threeStepBlock .step-box .icon img {
    width: 48px;
    height: 48px;
  }
  .threeStepBlock .step-box .count {
    width: 24px;
    height: 24px;
    font-size: 12px;
    margin-bottom: 10px;
  }

  .threeStepBlock .step-box .count::before {
    width: 2px;
    height: 400%;
    bottom: 20px;
    top: auto;
    left: 50%;
    transform: translate(-50%, 0);
  }
  .threeStepBlock .step-box .count::after {
    width: 2px;
    height: 400%;
    top: 20px;
    left: 50%;
    transform: translate(-50%, 0);
  }

  .threeStepBlock .step-box .discription {
    font-size: 13px;
    line-height: 1.6;
    padding: 0;
  }

  .steps-read-more {
    font-size: 14px;
    margin-top: 8px;
    padding: 8px 18px;
  }

  .steps-container {
    flex-direction: column !important;
    align-content: space-around;
    gap: 30px;
  }
  .steps-container .step-box {
    max-width: 440px;
  }
  .steps-container .step-box > div .icon {
    margin-top: 20px;
  }
  .steps-container .step-box > div .count {
    margin-top: 30px;
  }
  .steps-container .step-box > div {
    width: 100%;
    gap: 20px;
    justify-content: space-between;
    flex-direction: row !important;
    align-items: flex-start !important;
  }
  .sb-content {
    text-align: left;
  }
  
  .tsb_block{
    padding-top: 20px !important;
  }
}

/*for overlay start*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
.tile{
  position: relative !important;
  width: 354px !important;
  height: 257px !important;
  border-radius: 10px !important;
  margin: 0px 20px !important;
  overflow: hidden !important;
  
}

.tile img{
  height: 100% !important;
  border-radius: 10px !important;
  object-fit: contain !important;
}

.overlay-content{
  display: flex !important;
  position: absolute !important;
  color: white !important;
  z-index: 2 !important;
  bottom: 0% !important;
  width: 100% !important;
  align-items: flex-end !important;
  padding: 10px 10px !important;

}

.wrap-one{
  display: flex !important;
  height: max-content !important;
  flex-direction: column !important;
  width: 120% !important;
}

.wrap-two{
  display: flex !important;
  justify-content: right !important;
  width: 65% !important;
}

.overlay-content p, .overlay-content h5, .overlay-content a{
  padding: 0% !important;
  margin: 0px 8px !important;
  font-size: 12px !important;

}
/*KNOW MORE BUTTON*/
.overlay-content a{
  display: flex !important;
  width: 100px !important;
  margin-bottom: 10px !important;
  text-decoration: none !important;
  background-color: orange !important;
  color: white !important;
  justify-content: center !important;
  align-items: center !important;
  border-radius: 5px !important;
}

/*BLACK GRADIENT ON THE TOP OF THE IMAGE*/
.overlay-black{
  object-fit: contain !important;
  height: 50% !important;
  width: 100% !important;
  position: absolute !important;
  bottom: 0% !important;
  background: linear-gradient(to top, rgba(0, 0, 0, 1), rgba(0, 0, 0, 0)) !important;
  z-index: 1 !important;
  border-radius: 10px !important;
}
/*for overlay end*/
.brands-slider .slick-prev{
  left:0px;
  top: calc(50% - 56px);
  transform: translateY(-50%);
  z-index: 999999;
}
/*Unlock exclusive benifits CSS*/
.unlock-dot{
  width: 8px;
  height: 8px;
  background: #0ec1eb;
  display: inline-block;
  border-radius: 50%;
  position: absolute;
  right: -14px;
  top: 11px;
}
.referNowBtnStyleModified.knowMorebtn{
  font-size: 10px;
  padding: 15px 20px;
  margin-left: 20px;
}
.referNowBtnStyleModified.knowMorebtnexclusive{
  font-size: 12px !important;
}
/* .knowmoreBg{
  opacity: 0;
  visibility: hidden; 
} */
.knowmoreBg.popshow{
    opacity: 1;
    visibility: visible;
}
.knowmoreBg .okbtnwrapp1 span{
  background: #F9982B;
  color: #fff;
  padding: 10px 31px;
  border-radius: 4px;
  cursor: pointer;
}
.knowmoreBg .headsect{
  border-bottom: 1px solid #D1D1D1;
  margin-bottom: 20px;
}
.overlaynewc{
  padding: 20px 20px !important;
}
.knowmoreBg h4{
  font-size: 18px;
  margin-bottom: 10px;
}
.knowmoreBg .scrollSection2 li span{
  color:#A7A7A7;
  display: block;
  width: 100%;
}
.knowmoreBg .scrollSection2 li{
  display: flex;
  background: #fff;
  padding:20px;
  flex-wrap: wrap;

}
.knowmoreBg .newlistings {
  padding-left:0;
}
.knowmoreBg .newlistings li{
  list-style-type: none;
}
.knowmoreBg .headsect h3{
  max-width: 100%;
}
.knowmoreBg .container-popup{
  max-width: 1100px;
}
.wrappopupRedeem{
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #00000065;
  z-index: 9999;
  opacity: 0;
  visibility: hidden;
}
.wrappopupRedeem.shownow{
  opacity: 1;
  visibility: visible;
}
.wrappopupRedeem .tooltipCross{
  width:20px;
  height: 20px;
  cursor: pointer;
}
.wrappopupRedeem .tooltipCross::before,
.wrappopupRedeem .tooltipCross::after{
  height: 25px;
}
.wrappopupRedeem .tooltipCross{
  top:20px;
}
.redeem-new-btm{
  color:#f8992c !important;
  border-color: #f8992c;
  transition: all 250ms;
  cursor: pointer;
}
.redeem-new-btm:hover{
  background: #f8992c;
  color: #fff !important;
  box-shadow: none;
  outline: none;
}
.wrappopupRedeem .okbtn{
  border-radius: 3px;
  background-color: #f8992c;
  color: white;
  border: none;
  padding: 10px 20px;
  font-size: 15px;
}
.wrappopupRedeem .okbtn a{
  color:#fff;
  cursor: pointer;
  text-decoration: none;
}
.popupRedeem li{
  background: #fff;
  padding: 10px 15px;
  margin-bottom: 20px;
}
.wrappopupRedeem .popupRedeem li{
  display: flex;
  flex-wrap: wrap;
  text-align: left;
}
.wrappopupRedeem .popupRedeem{
  max-width: 620px;
  width: 100%;
}
.wrappopupRedeem .scrollSection2 small{
  width: 100%;
  text-align: left;
}
@media(max-width:767px){
  .newlistings{
    overflow: auto;
    max-height: 90px;
  }
}
/*Unlock exclusive benifits CSS*/

.brands-slider .slick-prev{
  left:50px;
  top: calc(50% - 37px);
  transform: translateY(-50%);
  z-index: 999999;
}

.brandlogo{
  cursor: pointer;
  transition: 0.3s ease all;
}
.brandlogo:hover{
  transition: 0.3s ease all;
  transform: scale(1.05);
}
.brands-slider .slick-next{
  right:0px;
  top: calc(50% - 56px);
  transform: translateY(-50%);
  z-index: 9999;
}
.brands-slider .slick-next::before,
.brands-slider .slick-prev::before {
  background: url(../images/down-arrow.svg) no-repeat center center / contain;
  content: '' !important;
  position: absolute;
  left: 17px;
  top: 19px;
  width: 22px;
  height: 22px;
  transform: rotate(270deg);
}
.brands-slider .slick-prev::before{
  left: 14px;
    transform: rotate(90deg);
}

/*NEW <LIST STYLE*/
.ulisting{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 0 90px;
  font-family: Roboto;
}
.ulisting li{
  width: 40%;
  position: relative;
  padding-left: 60px;
  font-size: 16px;
  line-height: 1.4;
  text-align: left;
  font-family: Roboto;
  margin-bottom: 10px;
}
.councircle{
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #00aeef;
  position: absolute;
  left: 0;
  top: 22px;
  background: #fff;
  font-size: 18px;
  font-weight: 600;
  border-radius: 50%;
  box-shadow: 0px 0px 7px 0px rgba(0, 0, 0, 0.15);
  transform: translateY(-50%);
}
.benefitStyle1{
  font-size: 30px;
  font-weight: 400;
  font-family: Roboto;
}
.membershipSubhead{
  font-size: 20px;
  margin-bottom: 20px;
  display: block;
  font-weight: 400;
    font-family: Roboto;

}
.membershipSubhead strong{
  font-weight: 700;
    font-family: Roboto;

}
.redeemRef{
  background: #FFFFFF;
  box-shadow: 0px 3px 8px #00000014;
  border: 1px solid #E6E6E6;
  border-radius: 24px;
  color:#414042;
  padding:30px 50px;
  margin-bottom: 50px;
    font-family: Roboto;

}
.redeemRef h5{
  margin-bottom: 40px;
}
.colDisplay small{
  text-align: center;
  color: #414042;
  display: inline-block;
  max-width: 210px;
  font-size: 18px;
  padding:20px 0;
  min-height: 83px;
  line-height: 1.2;
    font-family: Roboto;

}
.colDisplay picture{
  min-height: 108px;
}
.pointsDisplay{
  display: flex;
}
.colDisplay{
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
    font-family: Roboto;

}
.redeem-new-btm{
  background-color: transparent;
  box-shadow: none;
  outline: none;
  padding: 10px 20px 9px 21px;
  color: #f8992c;
  border: 1px solid #f8992c;
  border-radius: 5px;
  text-decoration: none;
  font-size: 16px;
  margin-top: 12px;
  transition: all 250ms;
  margin-top: 12px;
  display: inline-block;
}
/*NEW <LIST STYLE*/

@media(max-width:767px){
  .brands-slider .slick-dots{
    bottom: 0;
  }
  .pointsDisplay{
    flex-direction: column;
  }
  .benefitStyle1{
    font-size: 22px;
  }
  .membershipSubhead{
    font-size:15px;
  }
  .ulisting{
    padding:0;
    flex-direction: column;
  }
  .ulisting li{
     width:100%;
     font-size: 18px;
  }
  .colDisplay{
    flex-direction: column;
  }
  .colDisplay small{
    max-width:100%;
  }
}

/*NEW CARD CSS*/
.banner-smallimg{
  width:575px;
  height: 265px;
  border-radius: 12px;
  overflow: hidden;
}
.banner-small img{
  object-fit: cover;
    width:100%;
    height:100%;
}
.ref-benifts h3{
  text-align: center;
}
.ref-benifts img{
  width:85%;
}
.benifittoogle{
  opacity: 0;
  visibility: hidden;
  height: 0;
  padding:0;
  transition:0.3s ease all;
}
.benifittoogle.show{
  opacity: 1;
  visibility: visible;
  height: 100%;
  padding:0 0 40px;
  transition:0.3s ease all;
 }
 .clickbenifits{
  font-size: 25px;
  cursor: pointer;
  font-weight: 700;
  margin: 50px auto;
  display: block;
  text-align: center;
  position: relative;
  transition:0.3s ease all;
  padding-bottom:20px;
  width: max-content;
 }
 .clickbenifits::after{
      content:'';
      position: absolute;
      left:0;
      background:#000;
      bottom:10px;
      height:2px;
      width:100%;
      opacity: 0;
      transition:0.3s ease all;
 }
 .clickbenifits:hover::after{
  opacity: 1;
 }

 .tb-benifits p {
  text-align: left;
  font-weight: 700;
  font-family: Roboto;
  padding: 0 85px;
 }

@media(max-width:767px){
  .tb-benifits{
    overflow: auto;
  }
  .clickbenifits{
    font-size:15px;
  }
  .banner-smallimg{
    width: 100%;
    height: 100%;
  }
  .banner-smallimg img{
    width: 100%;
  }
  .tb-benifits img{
    width: 100%;
  }
  .tb-benifits p {
    padding:20px 0;
  }
  .tb-benifits p strong{
    font-weight: 500;
  }

  #referEarnForm input,
  #referEarnForm select{
    border-radius: 0;
    outline: none;
  }
  .dashboardHeaderSection .bg-color-form .bg-form .refer-btn{
    margin-bottom: 40px;
  }
  .dashboardTabs .slick-prev, .dashboardTabs .slick-next{
    margin-right: 20px;
  }

  .inner .boxInner {
    align-items: center;
    text-align: center;
    width: 100%;
    flex-direction: column;
  }
  .dashboardTabs .hero-slide.tile{
    width:100% !important;
    margin:0 0 !important;
  }

  .referNowBtnStyleModified{
    background: transparent;
    color: #0cb7e6;
    border: 1px solid #0cb7e6;
    width: 100%;
    text-align: center;
    padding-left: 20px;
    font-size: 16px;
    margin-top: 5px;
    font-weight: 500;
  }
  .blueCardtxt{
      width:100%;
      background: #13a0cb;
      border-radius: 3px;
      overflow: hidden;
      color:#fff;
      height: 210px;
      padding:15px;
      text-align: center;
  }
  .blueCardtxt h4{
    padding-bottom: 10px;
    font-size: 18px;
  }
  .blueCardtxt {
    font-size: 15px;
  }
  .form-curve .formStyle {
    padding:20px;
  }
  .app-head-new{
    font-weight: 600;
    display: block;
    text-align: center;
    font-size: 25px;
    padding: 0 10px;
  }
  .app-head-new small{
    display: block;
    font-size: 18px;
    padding-top: 10px;
  }
  .dashboardHeaderSection .form-container .termsConditionStyle{
    flex-wrap: wrap;
  }
  /* .tBT{
    list-style-type: disc;
  } */

  .modal-body-inner{
    max-height: calc(100vh - 130px);
    width: 100%;
  }
  .termsModalContent ul li{
    position: relative;
  }
  .termsModalContent ul li::before{
    margin-left: -0.9em;
    background: #000;
    border-radius: 50%;
    width: 6px;
    height: 6px;
    position: absolute;
    left: 5px;
    top: -5px;
    content: " ";
  }
}

/*NEW CARD CSS*/